Merge branch 'develop' of gitadmin/tuoheng_lc_web into release

src/views/dashboard/components/OneMap.vue

@@ -1,154 +1,119 @@
 <template>
+  <div class="map-container" :="getMapOptions" />
 
-  <div
-    class="map-container"
-    :="getMapOptions"
-  />
-
-  <div
-
-    id="airOverlay"
-    class="airport-overlay"
-  >
-    <span
-      id="closeAir"
-      class="close-overlay"
-      @click="hideAirInfo"
-    >x</span>
+  <div id="airOverlay" class="airport-overlay">
+    <span id="closeAir" class="close-overlay" @click="hideAirInfo">x</span>
     <air-info :data="airDetail" />
   </div>
-  <div
-
-    v-show="problemPopupShow"
-    id="problemOverlay"
-    class="problem-overlay"
-  >
-    <span
-      class="close-overlay"
-      @click="hideProblemInfo"
-    >x</span>
+  <div v-show="problemPopupShow" id="problemOverlay" class="problem-overlay">
+    <span class="close-overlay" @click="hideProblemInfo">x</span>
     <problem-info :detail="problemDetail" />
   </div>
 
-  <div
-    v-show="listChecked"
-    class="menu"
-  >
+  <div v-show="listChecked" class="menu">
     <div class="tabBar">
       <span
-        :class="[tabIndex==1?'checkedColor':'uncheckedColor']"
-        style="margin-right:97px"
+        :class="[tabIndex == 1 ? 'checkedColor' : 'uncheckedColor']"
+        style="margin-right: 97px"
         @click="showTask"
       >任务</span>
       <span
-        :class="[tabIndex==1?'uncheckedColor':'checkedColor']"
+        :class="[tabIndex == 1 ? 'uncheckedColor' : 'checkedColor']"
         @click="showProblem"
       >问题</span>
     </div>
-    <div
-      v-if="tabIndex==1"
-      class="listDetail"
-    >
+    <div v-if="tabIndex == 1" class="listDetail">
       <ul>
         <li
-          v-for="(item,index) in taskList"
+          v-for="(item, index) in taskList"
           :key="index"
-          style="display:flex;font-size:14px"
+          style="font-size: 14px"
         >
-          <div style="width:145px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis">{{ item.date }}&nbsp;&nbsp;{{ item.taskName }}</div>
-          <div style="width:42px">{{ item.statusInfo }}</div>
+          <div
+            style="
+              width: 150px;
+              white-space: nowrap;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              margin-right:20px;
+            "
+          >
+            {{ item.date }}&nbsp;&nbsp;{{ item.taskName }}
+          </div>
+          <div style="margin-right:30px">{{ item.statusInfo }}</div>
 
           <n-popconfirm
-            v-if="item.status==1"
+            v-if="item.status == 1"
+            style="float:left"
             @positive-click="handlePositiveClick(item)"
             @negative-click="handleNegativeClick"
           >
             <template #trigger>
-              <span style="color:#22D33D">立即执行</span>
+              <span style="color: #22d33d">立即执行</span>
             </template>
             是否立即开始执行任务?
           </n-popconfirm>
-          <div
-            v-else
-            style="color:#1890FF"
-            @click="liveShow(item)"
-          >直播</div>
+          <div v-else style="color: #1890ff" @click="liveShow(item)">直播</div>
         </li>
-
       </ul>
       <n-pagination
         v-model:page="page"
         :page-count="pageCount"
         :page-slot="7"
-        style="color:#FFFFFF;position:absolute;bottom:10px;left:10px"
+        style="color: #ffffff; position: absolute; bottom: 10px; left: 10px"
       />
     </div>
-    <div
-      v-else
-      class="listDetail"
-    >
+    <div v-else class="listDetail">
       <n-date-picker
         :on-update:formatted-value="abc"
         :default-formatted-value="efg"
         type="daterange"
         :default-value="[Date.now() - 6.048e8, Date.now()]"
         :is-date-disabled="disablePreviousDate"
-        style="margin-bottom:15px"
+        style="margin-bottom: 15px"
       />
       <!-- 多选框 -->
       <n-checkbox-group
         v-model:value="problemTypeSelected"
         @update:value="handleProblemTypeValue"
       >
-        <div
-          v-for="(item,index) in problemTypeList"
-          :key="index"
-        >
+        <div v-for="(item, index) in problemTypeList" :key="index">
           <n-checkbox
             :value="item.content"
             :label="item.content"
-            style="color:#FFFFFF"
+            style="color: #ffffff"
           />
         </div>
-
       </n-checkbox-group>
-
     </div>
   </div>
   <div class="menuControl">
     <div
-      style="border-bottom:1px solid rgba(1122,112,112,0.65)"
+      style="border-bottom: 1px solid rgba(1122, 112, 112, 0.65)"
       class="item"
     >
       <div @click="showList">
         <img
-          v-if="listChecked==true"
+          v-if="listChecked == true"
           src="../../../assets/images/listChecked.png"
         >
-        <img
-          v-else
-          src="../../../assets/images/listUnchecked.png"
-        >
+        <img v-else src="../../../assets/images/listUnchecked.png">
       </div>
 
-      <span :style="{'color':listChecked?'#1890FF':'#666666'}">列表</span>
+      <span :style="{ color: listChecked ? '#1890FF' : '#666666' }">列表</span>
     </div>
     <div class="item">
       <div @click="showAirportList">
         <img
-          v-if="airportSelected==true"
+          v-if="airportSelected == true"
           src="../../../assets/images/airportChecked.png"
         >
-        <img
-          v-else
-          src="../../../assets/images/airportUnchecked.png"
-        >
+        <img v-else src="../../../assets/images/airportUnchecked.png">
       </div>
 
-      <span :style="{'color':airportSelected?'#1890FF':'#666666'}">机场</span>
+      <span :style="{ color: airportSelected ? '#1890FF' : '#666666' }">机场</span>
     </div>
   </div>
-
 </template>
 
 <script>
@@ -170,7 +135,12 @@ import deadTree_icon from '@/assets/images/deadTree.png'
 import fireHazard_icon from '@/assets/images/fireHazard.png'
 import { reactive, toRefs, onMounted, computed, ref, watch } from 'vue'
 import { Point } from 'ol/geom'
-import { airportList, getMissionList, getQuestionType, getQuestionList } from '@/api/dashboard/index.js'
+import {
+  airportList,
+  getMissionList,
+  getQuestionType,
+  getQuestionList
+} from '@/api/dashboard/index.js'
 import { getQuestions } from '@/api/task/index.js'
 import { gcj02towgs84 } from '@/utils/coordinate-util.js'
 import AirInfo from './AirInfo.vue'
@@ -224,21 +194,27 @@ export default {
       listShow: false,
       // 时间范围是一周前至今天
       efg: '',
-      listIcon: new URL('../../../assets/images/listChecked.png', import.meta.url).href,
-
-      airportIcon: new URL('../../../assets/images/airportChecked.png', import.meta.url).href,
+      listIcon: new URL(
+        '../../../assets/images/listChecked.png',
+        import.meta.url
+      ).href,
+
+      airportIcon: new URL(
+        '../../../assets/images/airportChecked.png',
+        import.meta.url
+      ).href,
       listFontStyle: {
-        'color': '#666666'
+        color: '#666666'
       },
       airportFontStyle: {
-        'color': '#1890FF'
+        color: '#1890FF'
       },
       problemPopupShow: false,
       tabIndex: 1,
       page: ref(1),
       pageCount: 1,
       taskList: [],
-      range: (['2012-09-10', '2022-09-10']),
+      range: ['2012-09-10', '2022-09-10'],
       problemTypeSelected: null,
       problemTypeList: [],
       listChecked: false,
@@ -247,11 +223,14 @@ export default {
       airportPopupShow: false,
       problemlayer: null
     })
-    watch(() => data.page, (newValue, oldValue) => {
-      if (newValue !== oldValue) {
-        initTaskList()
+    watch(
+      () => data.page,
+      (newValue, oldValue) => {
+        if (newValue !== oldValue) {
+          initTaskList()
+        }
       }
-    })
+    )
     const getMapOptions = computed(() => {
       return {
         id: props.id
@@ -260,17 +239,16 @@ export default {
 
     const initMap = () => {
       // 天地图影像图
-      const tdtImgMap =
-        new Tile({
-          visible: true,
-          source: new XYZ({
-            url: 'https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0'
-          })
+      const tdtImgMap = new Tile({
+        visible: true,
+        source: new XYZ({
+          url: 'https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0'
         })
+      })
       var wmsSource = new Tile({
         source: new TileWMS({
           url: 'https://geoserver.t-aaron.com:4080/geoserver/jiangning/wms',
-          params: { 'LAYERS': 'jiangning:town' }
+          params: { LAYERS: 'jiangning:town' }
         })
       })
       data.map = new Map({
@@ -281,16 +259,12 @@ export default {
           zoom: 11,
           maxZoom: 17
         }),
-        layers: [
-          tdtImgMap
-
-        ],
+        layers: [tdtImgMap],
         controls: control.defaults({
           attribution: false,
           rotate: false,
           zoom: false
         })
-
       })
       data.map.addLayer(wmsSource)
       wmsSource.setOpacity(0.3)
@@ -311,9 +285,7 @@ export default {
     /**
      * @description:分页器改变时改变任务列表信息
      */
-    const changePage = (v) => {
-
-    }
+    const changePage = (v) => {}
     /**
      *  展示机场
      */
@@ -321,7 +293,10 @@ export default {
       if (data.airportsAll.length > 0) {
         for (let i = 0; i < data.airportsAll.length; i++) {
           const airport = data.airportsAll[i]
-          const lngLat = gcj02towgs84(parseFloat(airport.longitude), parseFloat(airport.latitude))
+          const lngLat = gcj02towgs84(
+            parseFloat(airport.longitude),
+            parseFloat(airport.latitude)
+          )
           const feature = new Feature({
             geometry: new Point(fromLonLat(lngLat))
           })
@@ -478,13 +453,16 @@ export default {
     const performTask = (item) => {
       // console.log(router, '路径')
 
-      router.push({ path: '/taskManage/all', query: { rowInfo: JSON.stringify(item) }})
+      router.push({
+        path: '/taskManage/all',
+        query: { rowInfo: JSON.stringify(item) }
+      })
     }
     const abc = (value) => {
       getQuestionList({
         startTime: value[0],
         endTime: value[1]
-      }).then(res => {
+      }).then((res) => {
         if (res.code === 0) {
           const arr = res.data
 
@@ -494,7 +472,7 @@ export default {
             var n = resArr.indexOf(arr[i].typeName)
             if (n == -1) {
               resArr.push(arr[i].typeName)
-              narr.push({ 'name': arr[i].typeName, fraction: [arr[i]] })
+              narr.push({ name: arr[i].typeName, fraction: [arr[i]] })
             } else {
               narr[n].fraction.push(arr[i])
             }
@@ -515,7 +493,6 @@ export default {
         element: document.getElementById('problemOverlay'),
         // autoPan: true,
         offset: [10, 10]
-
       })
       narr.map((item) => {
         const Features = []
@@ -523,7 +500,10 @@ export default {
         if (item.fraction.length > 0) {
           item.fraction.map((iitem) => {
             const problem = iitem
-            const lngLat = gcj02towgs84(parseFloat(problem.lng), parseFloat(problem.lat))
+            const lngLat = gcj02towgs84(
+              parseFloat(problem.lng),
+              parseFloat(problem.lat)
+            )
             const feature = new Feature({
               geometry: new Point(fromLonLat(lngLat))
             })
@@ -579,13 +559,14 @@ export default {
       getMissionList({
         page: data.page,
         limit: 8
-      }).then(res => {
+      }).then((res) => {
         if (res.code === 0) {
           data.taskList = res.data.records
+
           data.pageCount = res.data.pages
           // console.log(data.pageCount, '页数')
           data.taskList.map((item, index) => {
-            const arr = item.executionStartTime.split(/[ ]+/)// 以空格分开
+            const arr = item.executionStartTime.split(/[ ]+/) // 以空格分开
             item.date = arr[0]
             item.taskName = item.name
 
@@ -605,7 +586,7 @@ export default {
      * 获取问题多选类型
      */
     const initProblemType = () => {
-      getQuestionType().then(res => {
+      getQuestionType().then((res) => {
         if (res.code === 0) {
           data.problemTypeList = res.data
           data.problemTypeSelected = []
@@ -650,7 +631,10 @@ export default {
      * 展示直播视频
      */
     const liveShow = (rowInfo) => {
-      router.push({ path: '/taskManage/all', query: { rowInfo: JSON.stringify(rowInfo), type: 1 }})
+      router.push({
+        path: '/taskManage/all',
+        query: { rowInfo: JSON.stringify(rowInfo), type: 1 }
+      })
     }
     onMounted(() => {
       initMap()
@@ -672,10 +656,14 @@ export default {
         const d = 864e5
         // return ts > Date.now()
         if (type === 'start' && range !== null) {
-          return startOfDay(range[1]).valueOf() - startOfDay(ts).valueOf() >= d * 8
+          return (
+            startOfDay(range[1]).valueOf() - startOfDay(ts).valueOf() >= d * 8
+          )
         }
         if (type === 'end' && range !== null) {
-          return startOfDay(ts).valueOf() - startOfDay(range[0]).valueOf() >= d * 8
+          return (
+            startOfDay(ts).valueOf() - startOfDay(range[0]).valueOf() >= d * 8
+          )
         }
         return ts > Date.now()
       },
@@ -700,37 +688,32 @@ export default {
       },
       handlePositiveClick(row) {
         $message.info('机场设备开始自检，请稍等')
-        implement(row.id)
-          .then(res => {
-            if (res.code === 0) {
-              $message.info('操作成功')
-            }
-          })
-      },
-      handleNegativeClick() {
-
+        implement(row.id).then((res) => {
+          if (res.code === 0) {
+            $message.info('操作成功')
+          }
+        })
       },
+      handleNegativeClick() {},
       liveShow
-
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-.container{
-  width:100vw;
-  height:100vh;
-   position:relative;
-  overflow:hidden;
+.container {
+  width: 100vw;
+  height: 100vh;
+  position: relative;
+  overflow: hidden;
 }
 .map-container {
- position:absolute;
- top:0px;
- left:0px;
- right:0px;
- bottom:0px;
-
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
 }
 
 .layer-management {
@@ -814,10 +797,12 @@ export default {
     padding: 10px 19px;
     ul {
       li {
-        display: flex;
-        justify-content: space-between;
+
         padding: 5px 2px;
         margin-bottom: 3px;
+        div{
+          float:left;
+        }
       }
     }
   }