temp

package-lock.json

@@ -5772,6 +5772,11 @@
         "yallist": "^4.0.0"
       }
     },
+    "mitt": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.0.tgz",
+      "integrity": "sha512-7dX2/10ITVyqh4aOSVI9gdape+t9l2/8QxHrFmUXu4EEUpdlxl6RudZUPZoc+zuY2hk1j7XxVroIVIan/pD/SQ=="
+    },
     "mkdirp": {
       "version": "0.5.6",
       "resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-0.5.6.tgz",

package.json

@@ -13,6 +13,7 @@
     "core-js": "^3.8.3",
     "echarts": "^5.4.0",
     "echarts-gl": "^2.0.9",
+    "mitt": "^3.0.0",
     "vue": "^3.2.13",
     "vue-router": "^4.1.5"
   },

src/utils/bus.js

@@ -0,0 +1,2 @@
+import mitt from 'mitt';
+export default mitt();

src/views/home/Header.vue

@@ -23,7 +23,7 @@
         <div class="right">
           <i class="btn-dfmz" @click="handleDfmz"></i>
           <i class="btn-fulls" @click="handleFullExtent"></i>
-          <i class="btn-tools" @click="changeToolsShow(true)"></i>
+          <i class="btn-tools" @click="changeToolsShow()"></i>
           <div class="tool-box" v-show="toolsShow">
             <i class="tb-icon-close" @click="changeToolsShow(false)"></i>
             <div class="search-wrapper">
@@ -113,10 +113,11 @@ export default {
 </script>
 
 <script setup>
-  import { onMounted, reactive, ref, computed, nextTick, watch } from 'vue';
+  import { onMounted, reactive, ref, computed, nextTick, watch, onBeforeUnmount } from 'vue';
   import { useNow, useDateFormat } from '@vueuse/core'
   import { addResponseEventListener, callUIInteraction } from '@/webRtcVideo.js'
   import { setWaterLevel } from '@/echarts/options'
+  import bus from '@/utils/bus'
 
   const sceneBoxShow = ref(false)
 
@@ -234,7 +235,8 @@ export default {
 
   const toolsShow = ref(true)
   function changeToolsShow(param) {
-    toolsShow.value = param
+
+    toolsShow.value = param || !toolsShow.value
   }
 
   function handleFullExtent() {
@@ -468,6 +470,12 @@ export default {
     }
     callUIInteractionFormat(action);
   }
+
+  bus.on('hideToolBox', () => { toolsShow.value = false});
+
+  onBeforeUnmount(() => {
+    bus.off('hideToolBox');
+  })
   
 </script>
 

src/views/home/Home.vue

@@ -25,8 +25,8 @@ export default {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  /* background-color: rgb(29, 40, 63); */
-  background-color: rgb(150, 150, 150);
+  background-color: rgb(29, 40, 63);
+  /* background-color: rgb(150, 150, 150); */
   color: #e3e3e3;
   user-select: none;
 }

src/views/ssky/Index.vue

@@ -12,7 +12,7 @@
             <span></span>
           </div>
         </div> -->
-        <div class="ylzy-item" style="cursor: pointer;" @click="boatDetailShow = !boatDetailShow">
+        <div class="ylzy-item" @click="handleBDListShow('ylzy-boat')">
           <img :src="require('@/assets/imgs/icon-youchuan.png')" alt="">
           <div>
             <span>游船数</span>
@@ -21,7 +21,7 @@
             </div>
           </div>
         </div>
-        <div class="ylzy-item">
+        <div class="ylzy-item" @click="handleBDListShow('ylzy-dock')">
           <img :src="require('@/assets/imgs/icon-matou.png')" alt="">
           <div>
             <span>码头数</span>
@@ -31,22 +31,8 @@
           </div>
         </div>
       </div>
-      <div class="boat-detail" v-show="boatDetailShow">
-        <span class="bd-title">游船信息</span>
-        <ul class="bd-list">
-          <li v-for="item, index in ylzyData.boatList" class="bdl-item">
-            <div class="bdl-row1">
-              <span>{{index+1}}</span>
-              <span>{{item.name}}</span>
-              <span>{{item.status}}</span>
-            </div>
-            <div class="bdl-row2">
-              <span>MMSI : </span>
-              <span>{{item.mmsi}}</span>
-            </div>
-          </li>
-        </ul>
-      </div>
+      <BoatDockList :list-data="ylzyData.boatList" :list-title="'游船信息'" v-if="boatDockListShow==='ylzy-boat'"/>
+      <BoatDockList :list-data="ylzyData.dockList" :list-title="'码头信息'" v-if="boatDockListShow==='ylzy-dock'"/>
       <div class="pl-b2">
         <span class="title1">码头客流量</span>
         <div class="plb2-row1">
@@ -85,7 +71,7 @@
       <div class="pr-b1">
         <span class="title1">轮渡资源</span>
         <div class="prb1-main">
-          <div>
+          <div @click="handleBDListShow('ldzy-dock')">
             <i></i>
             <div>
               <span>渡口数</span>
@@ -95,7 +81,7 @@
               </div>
             </div>
           </div>
-          <div>
+          <div  @click="handleBDListShow('ldzy-boat')">
             <i></i>
             <div>
               <span>渡船数</span>
@@ -107,6 +93,8 @@
           </div>
         </div>
       </div>
+      <BoatDockList :list-data="ldzyData.dockList" :list-title="'渡口信息'" v-if="boatDockListShow==='ldzy-dock'"/>
+      <BoatDockList :list-data="ldzyData.boatList" :list-title="'渡船信息'" v-if="boatDockListShow==='ldzy-boat'"/>
       <div class="pr-b2">
         <span class="title1">轮渡客流量</span>
         <div class="prb2-p1">
@@ -150,9 +138,11 @@ export default {
   import ListBoxLshb from './cpns/ListBoxLshb'
   import ListBoxLdkll from './cpns/ListBoxLdkll'
   import LshbDialog from './cpns/LshbDialog.vue'
+  import BoatDockList from './cpns/BoatDockList.vue'
   import { Getdjld, Getpjyl, GetLshb } from '@/apis/ssky'
   import { useRafFn } from '@vueuse/core'
   import { addResponseEventListener, callUIInteraction } from '@/webRtcVideo.js'
+  import bus from '@/utils/bus'
 
 
   onMounted(() => {
@@ -275,11 +265,62 @@ export default {
       { name: '浦江游览12', status: '航行中', mmsi: '413971338' },
       { name: '浦江游览13', status: '航行中', mmsi: '413971338' },
       { name: '浦江游览14', status: '航行中', mmsi: '413971338' },
-      { name: '浦江游览15', status: '航行中', mmsi: '413971338' }
+      { name: '浦江游览15', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览16', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览17', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览18', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览19', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览20', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览21', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览22', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览23', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览24', status: '航行中', mmsi: '413971338' },
+      { name: '浦江游览25', status: '航行中', mmsi: '413971338' },
+    ],
+    dockList: [
+      { name: '浦江码头1' },
+      { name: '浦江码头2' },
+      { name: '浦江码头3' },
+      { name: '浦江码头4' },
+      { name: '浦江码头5' },
+      { name: '浦江码头6' },
+      { name: '浦江码头7' },
+      { name: '浦江码头8' },
+      { name: '浦江码头9' },
+      { name: '浦江码头10' },
+      { name: '浦江码头11' },
+      { name: '浦江码头12' },
+      { name: '浦江码头13' },
+      { name: '浦江码头14' },
+      { name: '浦江码头15' },
+      { name: '浦江码头16' },
+      { name: '浦江码头17' },
+      { name: '浦江码头18' },
+      { name: '浦江码头19' },
+      { name: '浦江码头20' },
+      { name: '浦江码头21' },
+      { name: '浦江码头22' },
+      { name: '浦江码头23' },
+      { name: '浦江码头24' },
+      { name: '浦江码头25' },
+      { name: '浦江码头26' },
+      { name: '浦江码头27' },
+      { name: '浦江码头28' },
+      { name: '浦江码头29' },
+      { name: '浦江码头30' },
+      { name: '浦江码头31' },
+      { name: '浦江码头32' },
     ]
   })
 
-  const boatDetailShow = ref(false)
+  const boatDockListShow = ref(false)
+
+  function handleBDListShow(name) {
+    if(name.indexOf('ldzy')!==-1 && name!==boatDockListShow.value) {
+      bus.emit('hideToolBox');
+    }
+    boatDockListShow.value = boatDockListShow.value===name? false: name
+  }
 
   const mtkllData = reactive({
     total: 0,
@@ -322,11 +363,11 @@ export default {
   function handleLsAdd() {
     // lshbDiaShow.value = true
 
-    let addLength = 1
+    /* let addLength = 1
     for(let i=0; i<addLength; i++) {
       lshbData.value.unshift({ name: 'test'+ parseInt(Math.random()*1000) , value:  99, type: '商务', ent: '上海浦江游览集团有限公司' } )
       lshbData.value.splice(-1, 1)
-    }
+    } */
 
   }
 
@@ -336,7 +377,61 @@ export default {
 
   const ldzyData = reactive({
     dk: 0,
-    dc: 0
+    dc: 0,
+    boatList: [
+      { name: '轮渡客船1', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船2', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船3', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船4', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船5', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船6', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船7', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船8', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船9', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船10', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船11', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船12', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船13', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船14', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船15', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船16', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船17', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船18', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船19', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船20', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船21', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船22', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船23', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船24', status: '航行中', mmsi: '413971338' },
+      { name: '轮渡客船25', status: '航行中', mmsi: '413971338' },
+    ],
+    dockList: [
+      { name: '轮渡渡口1' },
+      { name: '轮渡渡口2' },
+      { name: '轮渡渡口3' },
+      { name: '轮渡渡口4' },
+      { name: '轮渡渡口5' },
+      { name: '轮渡渡口6' },
+      { name: '轮渡渡口7' },
+      { name: '轮渡渡口8' },
+      { name: '轮渡渡口9' },
+      { name: '轮渡渡口10' },
+      { name: '轮渡渡口11' },
+      { name: '轮渡渡口12' },
+      { name: '轮渡渡口13' },
+      { name: '轮渡渡口14' },
+      { name: '轮渡渡口15' },
+      { name: '轮渡渡口16' },
+      { name: '轮渡渡口17' },
+      { name: '轮渡渡口18' },
+      { name: '轮渡渡口19' },
+      { name: '轮渡渡口20' },
+      { name: '轮渡渡口21' },
+      { name: '轮渡渡口22' },
+      { name: '轮渡渡口23' },
+      { name: '轮渡渡口24' },
+      { name: '轮渡渡口25' },
+    ]
   })
   
   const ldklData = reactive({value: [
@@ -463,6 +558,9 @@ export default {
     left: 0;
     padding: 12.4vh 30px 10px 40px;
     background: linear-gradient(-90deg, rgba(0,17,50,0), rgba(0,17,51,0.55), rgba(0,17,50,0.8));
+    .boat-dock-list {
+      left: 360px;
+    }
   }
 
   .panel-right {
@@ -472,6 +570,10 @@ export default {
     .title-divider {
       margin-left: 40px;
     }
+
+    .boat-dock-list {
+      right: 360px;
+    }
   }
 
   .pl-b1 {
@@ -483,6 +585,7 @@ export default {
       justify-content: flex-start;
       align-items: center;
       color: #fff;
+      cursor: pointer;
       &>div {
         display: flex;
         flex-direction: column;
@@ -677,97 +780,6 @@ export default {
 
   }
 
-  .boat-detail {
-    position: absolute;
-    left: 360px;
-    top: 12.4vh;
-    box-sizing: border-box;
-    padding: 15px;
-    width: 325px;
-    height: fit-content;
-    background-color: rgba(0, 17, 51, 0.5);
-    border-radius: 4px;
-    box-shadow: 0 2px 12px 0 rgba(0, 17, 51, 0.2);
-
-    .bd-list {
-      height: fit-content;
-      max-height: 67vh;
-      box-sizing: border-box;
-      padding: 0 10px;
-      margin-top: 15px;
-      overflow-y: auto;
-    }
-
-    .bdl-item {
-      cursor: pointer;
-      margin-bottom: 12px;
-      padding: 5px;
-      &:hover {
-        background-color: rgba(0, 17, 51, 0.2);
-      }
-      .bdl-row1 {
-        display: flex;
-        align-items: flex-end;
-        margin-bottom: 7px;
-        span:nth-child(1) {
-          display: inline-block;
-          width: 24px;
-          height: 24px;
-          background-color: rgba($color: #12477d, $alpha: 0.6);
-          line-height: 24px;
-          text-align: center;
-          margin-right: 10px;
-        }
-        span:nth-child(2) {
-          display: inline-block;
-          width: 140px;
-          font-size: 18px;
-          font-weight: bolder;
-          font-style: italic;
-          overflow: hidden;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-          letter-spacing: 1px;
-        }
-        span:nth-child(3) {
-          display: inline-block;
-          width: 90px;
-          height: 26px;
-          line-height: 30px;
-          text-align: center;
-          font-size: 14px;
-          // font-weight: bold;
-          background: url('@/assets/imgs/bg-boat-status.png') no-repeat;
-          background-size: 100% 100%;
-        }
-      }
-      .bdl-row2 {
-        padding-left: 34px;
-        font-family: DIN;
-        font-size: 14px;
-        letter-spacing: 1px;
-        span:first-child {
-          font-weight: bold;
-        }
-      }
-    }
-
-    .bd-title {
-      display: block;
-      box-sizing: border-box;
-      width: 293px;
-      height: 41px;
-      background: url('@/assets/imgs/bg-list-title.png') no-repeat;
-      background-size: 100% 100%;
-      padding-left: 45px;
-      line-height: 41px;
-      font-size: 16px;
-      font-weight: bolder;
-      font-style: italic;
-
-    }
-  }
-
   .pr-b1 {
     .prb1-main {
       display: flex;
@@ -777,6 +789,7 @@ export default {
       &>div {
         display: flex;
         align-items: center;
+        cursor: pointer;
         i {
           display: block;
           width: 80px;

src/views/ssky/cpns/BoatDockList.vue

@@ -0,0 +1,270 @@
+<template>
+  <div class="boat-dock-list">
+    <span class="title">{{props.listTitle}}</span>
+    <ul class="boat-list" v-if="props.listData[0].mmsi" ref="list">
+      <li v-for="item, index in listSlice.value" class="list-item" @click="handleClick(item)">
+        <div class="item-row1">
+          <span>{{index+1}}</span>
+          <span>{{item.name}}</span>
+          <span>{{item.status}}</span>
+        </div>
+        <div class="item-row2">
+          <span>MMSI : </span>
+          <span>{{item.mmsi}}</span>
+        </div>
+      </li>
+    </ul>
+    <ul class="dock-list" v-else ref="list">
+      <li v-for="item, index in listSlice.value" class="list-item" @click="handleClick(item)">
+        <div class="item-row1">
+          <span>{{index+1}}</span>
+          <span>{{item.name}}</span>
+        </div>
+      </li>
+    </ul>
+    <transition name="loading">
+      <div class="loading" v-if="showLoading">加载中...</div>
+    </transition>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'BoatDockList',
+}
+</script>
+
+<script setup>
+  
+  import { defineProps, onMounted, reactive, ref } from 'vue'
+  import { useInfiniteScroll } from '@vueuse/core'
+  import { callUIInteraction } from '@/webRtcVideo.js'
+
+  const props = defineProps(['list-data', 'list-title'])
+
+  const listSlice = reactive({value: []})
+
+  onMounted(() => {
+    listSlice.value = props.listData.slice(0, 10)
+    
+  })
+
+  const showLoading = ref(false)
+
+  const list = ref(null)
+
+  useInfiniteScroll(
+    list,
+    () => {
+      // load more
+      const length = listSlice.value.length
+      if(length<props.listData.length) { 
+        showLoading.value = true
+        setTimeout(() => {
+          listSlice.value.push(...props.listData.slice(length, length+10))
+          showLoading.value = false
+        }, 1000);
+      }
+    },
+    { distance: 10 }
+  )
+
+  function callUIInteractionFormat(action) {
+    if(action['Parameters']) {
+      action['Parameters'] = JSON.stringify(action['Parameters'])
+    }
+    callUIInteraction(action)
+  }
+
+  function handleClick(item) {
+    console.log(item)
+    let action = {
+      "ActionName":"position_by_type",
+      "Parameters":{
+        "position_type": '',
+        "position_name": ''
+      }
+    }
+    switch(props['list-title']) {
+      case '游船信息': 
+        action.Parameters.position_type = 'boat'
+        action.Parameters.position_name = item.mmsi
+        break
+      case '码头信息': 
+        action.Parameters.position_type = 'lymt'
+        action.Parameters.position_name = item.name
+        break
+      case '渡口信息': 
+        action.Parameters.position_type = 'mt'
+        action.Parameters.position_name = item.name
+        break
+      case '渡船信息': 
+        action.Parameters.position_type = 'boat'
+        action.Parameters.position_name = item.mmsi
+    }
+    
+    callUIInteractionFormat(action);
+  }
+
+
+
+</script>
+
+<style lang="scss" scoped>
+.boat-dock-list {
+  position: absolute;
+  top: 12.4vh;
+  box-sizing: border-box;
+  padding: 15px;
+  width: 325px;
+  height: fit-content;
+  background-color: rgba(0, 17, 51, 0.5);
+  border-radius: 4px;
+  box-shadow: 0 2px 12px 0 rgba(0, 17, 51, 0.2);
+  overflow: hidden;
+
+  .loading {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 40px;
+    text-align: center;
+    color: #ddd;
+    font-size: 14px;
+    line-height: 40px;
+    background: linear-gradient(0deg, rgb(26, 48, 86, 1) 0%, rgba(26, 48, 86, 0.2) 100%);
+  }
+
+  .loading-enter-active,.loading-leave-active{
+    transition: all 0.2s ease;
+  }
+  .loading-enter-from,.loading-leave-to {
+    opacity: 0;
+    transform: translateY(40px);
+  }
+
+  .boat-list {
+    height: fit-content;
+    max-height: 67vh;
+    box-sizing: border-box;
+    padding: 0 10px;
+    margin-top: 15px;
+    overflow-y: auto;
+
+    .list-item {
+      cursor: pointer;
+      margin-bottom: 12px;
+      padding: 5px;
+      border-radius: 3px;
+      &:hover {
+        background-color: rgba(0, 17, 51, 0.2);
+      }
+      .item-row1 {
+        display: flex;
+        align-items: flex-end;
+        margin-bottom: 7px;
+        span:nth-child(1) {
+          display: inline-block;
+          width: 24px;
+          height: 24px;
+          background-color: rgba($color: #12477d, $alpha: 0.6);
+          line-height: 24px;
+          text-align: center;
+          margin-right: 10px;
+        }
+        span:nth-child(2) {
+          display: inline-block;
+          width: 140px;
+          font-size: 18px;
+          font-weight: bolder;
+          font-style: italic;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+          letter-spacing: 1px;
+        }
+        span:nth-child(3) {
+          display: inline-block;
+          width: 90px;
+          height: 26px;
+          line-height: 30px;
+          text-align: center;
+          font-size: 14px;
+          // font-weight: bold;
+          background: url('@/assets/imgs/bg-boat-status.png') no-repeat;
+          background-size: 100% 100%;
+        }
+      }
+      .item-row2 {
+        padding-left: 34px;
+        font-family: DIN;
+        font-size: 14px;
+        letter-spacing: 1px;
+        span:first-child {
+          font-weight: bold;
+        }
+      }
+    }
+  }
+  .dock-list {
+    height: fit-content;
+    max-height: 67vh;
+    box-sizing: border-box;
+    padding: 0 10px;
+    margin-top: 15px;
+    overflow-y: auto;
+
+    .list-item {
+      cursor: pointer;
+      margin-bottom: 16px;
+      padding: 18px 10px;
+      border-radius: 3px;
+      &:hover {
+        background-color: rgba(0, 17, 51, 0.2);
+      }
+      .item-row1 {
+        display: flex;
+        align-items: center;
+        span:nth-child(1) {
+          display: inline-block;
+          width: 24px;
+          height: 24px;
+          background-color: rgba($color: #12477d, $alpha: 0.6);
+          line-height: 24px;
+          text-align: center;
+          margin-right: 10px;
+        }
+        span:nth-child(2) {
+          display: inline-block;
+          width: 140px;
+          font-size: 18px;
+          font-weight: bolder;
+          font-style: italic;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+          letter-spacing: 1px;
+        }
+      }
+    }
+  }
+
+  
+
+  .title {
+    display: block;
+    box-sizing: border-box;
+    width: 293px;
+    height: 41px;
+    background: url('@/assets/imgs/bg-list-title.png') no-repeat;
+    background-size: 100% 100%;
+    padding-left: 45px;
+    line-height: 41px;
+    font-size: 16px;
+    font-weight: bolder;
+    font-style: italic;
+
+  }
+}
+</style>

src/views/ssky/cpns/LshbDialog.vue

@@ -77,41 +77,43 @@ export default {
 </script>
 
 <script setup>
-
   
   import { defineProps, onMounted, reactive, ref } from 'vue'
+  import { useNow, useDateFormat } from '@vueuse/core'
 
   const props = defineProps(['lshb-data'])
 
   const isNew = ref(false)
 
   onMounted(() => {
-    console.log('mountedddd')
     isNew.value = Object.keys(props.lshbData).length===0
     if(!isNew.value) {
       form.cm = props.lshbData.name
+      form.sqdw = props.lshbData.ent
+      form.ycdw = props.lshbData.ent
+      form.hbxz = props.lshbData.type
     }
     
   })
 
   const form = reactive({
-    sqdw: '123321',
-    hbxz: 'sw',
-    ycdw: '6655',
-    cm: 'chuanming',
+    sqdw: '',
+    hbxz: '商务',
+    ycdw: '',
+    cm: '',
     rs: '120人',
-    sj: '2021-10-27  19:00-20:00',
-    hx: 'sbhx',
+    sj: useDateFormat(useNow(), 'YYYY-MM-DD').value + '  19:00-20:00',
+    hx: 'jhyhx',
     qthx: '',
     tkmt: '十六铺一号码头3泊位'
 
   })
 
   const radioDataHbxz = [
-    { value: 'sw', name: '商务' },
-    { value: 'hq', name: '婚庆' },
-    { value: 'gr', name: '个人' },
-    { value: 'gwjd', name: '公务接待' },
+    { value: '商务', name: '商务' },
+    { value: '婚庆', name: '婚庆' },
+    { value: '个人', name: '个人' },
+    { value: '公务接待', name: '公务接待' },
   ]
 
   const radioDataHx = [