任务管理

src/api/command/index.js

@@ -63,5 +63,48 @@ export default {
       method: 'POST',
       data:params
     })
+  },
+
+  getAskCount(params){
+    return axios({
+      url: '/api/index/inspect/count',
+      method: 'GET',
+      params:params
+    })
+  },
+
+  getAskList(params){
+    return axios({
+      url: '/api/index/inspect/list',
+      method: 'GET',
+      params:{
+        ...params
+      }
+    })
+  },
+
+  addTask(params){
+    return axios({
+      url: '/api/index/inspect/addTask',
+      method: 'POST',
+      data:params
+    })
+  },
+
+  getQuaWarnList(params){
+    return axios({
+      url: '/api/index/water/warn',
+      method: 'GET',
+      params:{}
+    })
+  },
+
+  getQuaTrend(params){
+    return axios({
+      url: '/api/index/water/trend',
+      method: 'GET',
+      params:{}
+    })
   }
+
 }

src/views/command/ask/addDialog.vue

@@ -3,29 +3,33 @@
     <img src="../../../assets/img/command/ask-new.png">
     <el-form ref="form" :model="ruleForm" :label-width="formLabelWidth+'px'">
       <el-form-item label="河道名称:">
-        <el-select :class="ruleForm.driver?'check-select':void(0)" clearable v-model="ruleForm.driver" placeholder="">
-          <el-option
-            v-for="item in userList"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
-          </el-option>
+        <el-select :class="ruleForm.driverId?'check-select':void(0)" filterable clearable v-model="ruleForm.driverId" placeholder="">
+         <el-option
+              v-for="item in driverDataList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id">
+            </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="任务选择:">
-        <el-select :class="ruleForm.user?'check-select':void(0)" clearable v-model="ruleForm.user" placeholder="">
+        <el-select :class="ruleForm.type?'check-select':void(0)"  clearable v-model="ruleForm.type" placeholder="">
+          <el-option
+            key="1"
+            label="可见光巡检"
+            value="1">
+          </el-option>
           <el-option
-            v-for="item in userList"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
+            key="2"
+            label="多光谱巡检"
+            value="2">
           </el-option>
         </el-select>
       </el-form-item>
       <el-form-item label="巡检日期:">
         <el-date-picker
           style="width: 100%"
-          v-model="ruleForm.date"
+          v-model="ruleForm.inspectTime"
           value-format="yyyy-MM-dd"
           type="date"
           placeholder="">
@@ -44,18 +48,18 @@
 
 <script>
   import {mapGetters} from "vuex";
+  import api from '@/api/command/index'
 
   export default {
     name: "addDialog",
     data() {
       return {
         submitLoading:false,
-        userList: [
-          {value: 1, label: '未处理'},
-          {value: 2, label: '处理中'},
-          {value: 3, label: '已完成'},
-        ],
-        ruleForm: {},
+        ruleForm: {
+          inspectTime:'',
+          driverId:'',
+          type:''
+        },
         formLabelWidth: this.$root.$options.filters.filterPx(0.83, this.fontSize),
       }
     },
@@ -65,6 +69,12 @@
         default() {
           return false
         }
+      },
+      driverDataList: {
+        type: Array,
+        default() {
+          return []
+        }
       }
     },
     computed: {
@@ -76,11 +86,17 @@
       },
       submit(){
         this.submitLoading=true
-        let me=this
-        setTimeout(function () {
-          me.submitLoading=false
-          me.$emit('successSubmit')
-        },2000)
+        let params = {
+          inspectTime:this.ruleForm.inspectTime,
+          type:this.ruleForm.type,
+          inspectDriverList:[{driverId:this.ruleForm.driverId}]
+        }
+        api.addTask(params).then(res => {
+          this.$emit('successSubmit')
+          this.submitLoading=false
+        }).catch(err => {
+          this.submitLoading=false
+        });
       }
     }
   }

src/views/command/ask/askLeft.vue

@@ -8,63 +8,69 @@
       </div>
     </div>
     <div>
-      <div :class="activeType==1?'check-type':''" @click="activeTypeClick(1)">
+      <div :class="activeType==2?'check-type':''" @click="activeTypeClick(2)">
         <div>
           <div></div>
           <div>正在执行</div>
         </div>
-        <div>24</div>
-        <div v-show="activeType==1"></div>
+        <div>{{inExecution}}</div>
+        <div v-show="activeType==2"></div>
       </div>
-      <div :class="activeType==2?'check-type':''" @click="activeTypeClick(2)">
+      <div :class="activeType==1?'check-type':''" @click="activeTypeClick(1)">
         <div>
           <div></div>
-          <div>已执行</div>
+          <div>已完成</div>
         </div>
-        <div>19</div>
-        <div v-show="activeType==2"></div>
+        <div>{{finished}}</div>
+        <div v-show="activeType==1"></div>
       </div>
     </div>
     <div>
-      <el-input placeholder="请输入河流" v-model="searchValue">
-      </el-input>
-      <div>
-        <img @click="search" src="../../../assets/img/command/search.png">
-      </div>
+      <el-select @change="search" filterable v-model="ruleForm.driverId" placeholder="请选择河流" clearable>
+            <el-option
+              v-for="item in driverDataList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id">
+            </el-option>
+      </el-select>
     </div>
     <div>
-      <div :key="index" v-for="(item,index) in dataList">
+      <div :key="index" v-for="(item,index) in dataList.slice((currentPage - 1) * pageSize, currentPage * pageSize)">
         <div>
           <div>
-            <div>澧水河</div>
-            <div>江宁</div>
+            <div>{{item.driverName}}</div>
+            <div>{{item.areaName}}</div>
           </div>
-          <div>2020-04-22</div>
+          <div>{{item.inspectTime}}</div>
         </div>
-        <div>秦淮河河东-秦淮河北</div>
+        <div>{{item.startPoint}}-{{item.endPoint}}</div>
         <div>
           <div>
-            <div :class="activeType==2?'isCheck':''"></div>
-            <div>{{activeType?'在执行':'已执行'}}</div>
+            <div :class="activeType==1?'isCheck':''"></div>
+            <div>{{item.statusText}}</div>
           </div>
           <div>
-            <img @click="routesClick" src="../../../assets/img/command/ask-routes.png"/>
-            <img @click="videoClick" v-if="activeType==1" src="../../../assets/img/command/ask-video.png"/>
-            <img @click="hpClick" v-if="activeType==2" src="../../../assets/img/command/ask-hp.png"/>
+            <img @click="routesClick(item.driverId)" src="../../../assets/img/command/ask-routes.png"/>
+            <img @click="videoClick(item.liveUrl)" v-if="activeType==2" src="../../../assets/img/command/ask-video.png"/>
+            <img @click="hpClick(item)" v-if="activeType==1" src="../../../assets/img/command/ask-hp.png"/>
           </div>
         </div>
       </div>
     </div>
-    <div v-show="dataList.length>0">
+    <div v-show="dataList.length>4" style="text-align: center">
       <el-pagination
+       @current-change="handleCurrentChange"
         background
         :pager-count="5"
+         :current-page="currentPage"
+        :page-size="pageSize"
         layout="prev, pager, next"
-        :total="100">
+        :total="dataList.length">
       </el-pagination>
     </div>
     <videoDialog :liveUrl="liveUrl" @dialogClose="visible=false" v-if="visible" :visible="visible" ></videoDialog>
-    <addDialog @successSubmit="successSubmit" @dialogClose="addVisible=false" v-if="addVisible" :visible="addVisible" ></addDialog>
+    <addDialog :driverDataList="driverDataList" @successSubmit="successSubmit" @dialogClose="addVisible=false" v-if="addVisible" :visible="addVisible" ></addDialog>
   </div>
 </template>
 
@@ -72,18 +78,26 @@
   import {mapGetters} from "vuex";
   import videoDialog from './videoDialog'
   import addDialog from './addDialog'
+  import api from '@/api/command/index'
 
   export default {
     name: "ask-left",
     data() {
       return {
+         pageSize:4,
+        currentPage:1,
+        inExecution:'-',
+        finished:'-',
         liveUrl:'',
         searchLoading: false,
         addVisible:false,
         searchValue: '',
-        activeType: 1,
+        activeType:2,
         visible: false,
-        dataList: [{}, {}, {}, {}],
+        dataList: [],
+        ruleForm:{
+          driverId:''
+        }
       }
     },
     computed: {
@@ -92,10 +106,8 @@
     components: {videoDialog,addDialog},
     watch: {
       driverId() {
-        if (this.driverId) {
-          this.searchValue= this.driverId
+          this.ruleForm.driverId= this.driverId
           this.search()
-        }
       }
     },
     props: {
@@ -104,33 +116,61 @@
         default() {
           return ''
         }
+      },
+      driverDataList: {
+        type: Array,
+        default() {
+          return []
+        }
       }
     },
     mounted() {
+      this.getAskCount()
       this.search()
     },
     methods: {
+      handleCurrentChange(val){
+        this.currentPage = val
+      },
+      getAskCount(){
+        api.getAskCount().then(res => {
+          const {inExecution,finished}=res.data
+          this.inExecution=inExecution?inExecution:''
+          this.finished=finished?finished:''
+        }).catch(err => {
+          this.inExecution=''
+          this.finished=''
+        });
+      },
       activeTypeClick(activeType) {
         this.activeType = activeType
         this.searchValue = ''
+        this.$emit('askClear')
         this.search()
       },
       showProblemDetail(item) {
         this.$emit('showProblemDetail', {id: 1, driverId: 27})
       },
-      routesClick(){
-        this.$emit('routesClick',  296)
+      routesClick(driverId){
+        this.$emit('routesClick',driverId )
       },
-      videoClick(){
-        this.$emit('askClear',this.driverId)
-        this.liveUrl='http://mudu.tv/?a=index&c=show&id=230645&type=pc&playerInlineMode=1'
-        this.visible=true
+      videoClick(liveUrl){
+        this.$emit('askClear')
+        if(liveUrl){
+          this.liveUrl=liveUrl
+          this.visible=true
+        }else{
+          this.$notify.error({
+            title: '错误',
+            message: '请配置直播地址'
+          });
+        }
       },
-      hpClick(){
-        this.$emit('hpDetail',296)
+      hpClick(item){
+        this.$emit('hpDetail',item)
       },
       addClick(){
-        this.$emit('askClear',this.driverId)
+        this.$emit('askClear')
         this.addVisible=true
       },
       successSubmit(){
@@ -139,14 +179,17 @@
 
       },
       search() {
+        this.$emit('askClear',this.ruleForm.driverId)
         let me = this
         this.dataList=[]
         this.searchLoading = true
-        me.$emit('askClear',me.driverId)
-        setTimeout(function () {
-          me.dataList=[{},{},{},{}]
-          me.searchLoading = false
-        }, 2000)
+         api.getAskList({type:this.activeType,driverId:this.ruleForm.driverId}).then(res => {
+            this.dataList=res.data?res.data:[]
+            me.searchLoading = false
+          }).catch(e => {
+            me.searchLoading = false
+             this.dataList=[]
+          });
       }
     },
   }
@@ -278,23 +321,6 @@
         line-height: 0.36rem;
         opacity: 1;
       }
-
-      > div:last-child {
-        position: absolute;
-        right: 0.1rem;
-        top: -0.63rem;
-        width: 0.23rem;
-        height: 0.23rem;
-
-        > img {
-          width: 100%;
-        }
-
-        .el-icon-loading {
-          font-size: 0.2rem;
-          color: #ffffff;
-        }
-      }
     }
 
     > div:nth-child(4) {
@@ -322,6 +348,7 @@
           width: 100%;
           line-height: 0.2rem;
           margin-top: 0.1rem;
+          text-align: left;
           overflow: hidden;
           text-overflow: ellipsis;
           -o-text-overflow: ellipsis;

src/views/command/ask/hpDetailWin.vue

@@ -8,48 +8,40 @@
       <div>
         <div>
           <div>河道名称：</div>
-          <div>槽水河</div>
+          <div>{{askChild.driverName}}</div>
         </div>
         <div>
-          <div>水质问题：</div>
-          <div>河流漂浮物</div>
+          <div>区属：</div>
+          <div>{{askChild.areaName}}</div>
         </div>
       </div>
       <div>
         <div>
-          <div>处理人员：</div>
-          <div>张世名</div>
+          <div>起点：</div>
+          <div>{{askChild.startPoint}}</div>
         </div>
         <div>
-          <div>处理时间：</div>
-          <div>2020-12-01</div>
+          <div>终点：</div>
+          <div>{{askChild.endPoint}}</div>
         </div>
       </div>
       <div>
         <div>
           <div>巡检时间：</div>
-          <div>2020-12-01</div>
+          <div>{{askChild.inspectTime}}</div>
         </div>
         <div>
-          <div>水质标准：</div>
-          <div>污水3类</div>
         </div>
       </div>
-      <div>
-        <div>地理位置：</div>
-        <div>南京市江宁区东吉大道1号</div>
-      </div>
       <div>
         <div>拍摄照片：</div>
-        <viewer :images='[require("../../../assets/img/login.png"),require("../../../assets/img/login.png"),require("../../../assets/img/login.png")]'>
-          <img style="margin-left: 0" :src='require("../../../assets/img/login.png")'>
-          <img :src='require("../../../assets/img/login.png")'>
-          <img :src='require("../../../assets/img/login.png")'>
+        <viewer v-if="askChild.imageList&&askChild.imageList.length>0">
+          <img v-lazy="item.thumbImg" :data-source="item.originalImg"  :key=index v-for="(item,index) in askChild.imageList">
         </viewer>
       </div>
-      <div>
+      <div v-if="askChild.driverVideo">
         <div>拍摄视频：</div>
-        <dVideo videoUrl="https://gss3.baidu.com/6LZ0ej3k1Qd3ote6lo7D0j9wehsv/tieba-smallvideo-transcode-crf/1116315_20146aa2c462c9383115e2512c34deb1_0.mp4"></dVideo>
+        <dVideo :videoUrl="askChild.driverVideo"></dVideo>
       </div>
     </div>
   </div>
@@ -65,9 +57,18 @@
         default(){
           return 0
         }
+      },
+      askChild:{
+        type:Object,
+        default(){
+          return {}
+        }
       }
     },
     watch:{
+      askChild(){
+        console.log(this.askChild)
+      }
     },
     components:{dVideo},
     methods: {
@@ -105,6 +106,7 @@
             font-family: PingFangSC-Regular;
             font-size: 0.14rem;
             color: #989898;
+            width: 0.9rem;
           }
           >div:last-child{
             font-family: PingFangSC-Regular;
@@ -119,42 +121,32 @@
         }
       }
       >div:nth-child(4){
-        display: flex;
-        line-height: 0.2rem;
-        >div:first-child{
-          font-family: PingFangSC-Regular;
-          font-size: 0.14rem;
-          color: #989898;
-        }
-        >div:last-child{
-          font-family: PingFangSC-Regular;
-          font-size: 0.14rem;
-          margin: 0 0.05rem;
-          color: #FFFFFF;
-          flex: 1;
-        }
-      }
-      >div:nth-child(5){
         display: flex;
         >div:first-child{
           font-family: PingFangSC-Regular;
           font-size: 0.14rem;
           color: #989898;
           line-height: 0.2rem;
+          width: 0.9rem;
+          flex: none;
         }
         >div:last-child{
           display: flex;
+          flex-wrap: wrap;
         }
         img{
           width: 0.95rem;
           height: 0.95rem;
           margin-left: 0.13rem;
         }
+        img:first-child{
+          margin-left: 0px;
+        }
         >img:first-child{
           margin-left: 0;
         }
       }
-      >div:last-child {
+      >div:nth-child(5) {
         display: flex;
 
         > div:first-child {

src/views/command/ask/videoDialog.vue

@@ -65,6 +65,7 @@
         padding: 0rem;
         height: 100%;
         width: 100%;
+        border: 1px #ffffff solid;
       }
 
       .tech-theme .banner {

src/views/command/index.vue

@@ -2,7 +2,7 @@
   <div v-loading="loading" class="command-index" style="position: relative">
     <div style="display:none;">
       <problemDetailWin :id="questionId" @closeInfoWindow="closeInfoWindow" ref="problemDetailWin"></problemDetailWin>
-      <hpDetailWin @closeInfoWindow="closeInfoWindow" ref="hpDetailWin"></hpDetailWin>
+      <hpDetailWin :askChild="askChild" @closeInfoWindow="closeInfoWindow" ref="hpDetailWin"></hpDetailWin>
     </div>
     <div class="index-map" id="indexMap"></div>
     <img class="head-img" src="../../assets/img/command/nav.png"/>
@@ -89,7 +89,7 @@
     <problemLeft :driverArea="driverArea" :driverDataList="driverDataList" :driverId="driverId" @fillMarker="fillMarker" @problemClear="problemClear"
                  @problemSearch="problemSearch" @showProblemDetail="showProblemDetail"
                  v-if="activeType=='problem'&&finshMap"></problemLeft>
-    <askLeft @hpDetail="hpDetail" @routesClick="routesClick" @askClear="askClear" :driverId="driverId"
+    <askLeft @hpDetail="hpDetail" @routesClick="routesClick" @askClear="askClear" :driverDataList="driverDataList" :driverId="driverId"
              v-if="activeType=='ask'&&finshMap"></askLeft>
     <qualityLeft @qualityClear="askClear" :driverId="driverId" v-if="activeType=='quality'&&finshMap"></qualityLeft>
     <qualityRight v-if="activeType=='quality'&&finshMap"></qualityRight>
@@ -127,6 +127,7 @@
         activeType: "date",
         map: {},
         center: {},
+        askChild:{},
         barHeight: document.body.clientHeight > 1050 ? 2.42 : 2.06,
         driverDataList:[],
         nameMarkList: [],
@@ -173,7 +174,7 @@
           offset: new AMap.Pixel(0, -25)
         });
         me.addBound();
-        // me.addBound2();
+        me.addBound2();
         me.map.setFitView(this.polygonList)
         me.getDriver()
         me.loading = false
@@ -184,23 +185,25 @@
     },
     components: {dateLeft, dateRight, problemLeft, problemDetailWin, askLeft,hpDetailWin,qualityLeft,qualityRight},
     methods: {
-      hpDetail(driverId){
+      hpDetail(child){
         this.closeInfoWin()
         this.askClear()
+        this.askChild = {}
         let me = this
         setTimeout(function () {
-          let marker = me.driverList.find(item => item.id == driverId)
+          let marker = me.driverList.find(item => item.id == child.driverId)
           if (marker) {
+            me.askChild = JSON.parse(JSON.stringify(child))
             me.InfoWindow.open(me.map, marker.getPath()[0]);
           }
-          me.checkDriver(driverId)
+          me.checkDriver(child.driverId)
         }, 500)
       },
       routesClick(driverId) {
         this.clearRoutersMarker()
         this.checkDriver(driverId)
         let child = this.driverDataList.find(item => item.id == driverId)
-        if (child&&child.mapInfo&&child.mapInfo.length>0) {
+        if (child&&child.pointList&&child.pointList.length>0) {
           this.initRouters(child)
         } else {
           this.$notify.error({
@@ -210,7 +213,7 @@
         }
       },
       initRouters(child) {
-        let path = child.mapInfo
+        let path = child.pointList
         let point = new AMap.LngLat(path[0].x, path[0].y)
         let me = this
         let image = require('../../assets/img/command/uva.png')
@@ -300,10 +303,7 @@
         this.map.setFitView(this.polygonList)
       },
       askClear(driverId) {
-        if (!driverId) {
-          this.fillMarker()
-        }
-        this.driverId=''
+        this.checkDriver(driverId)
         this.clearRoutersMarker()
         this.map.setFitView(this.polygonList)
       },
@@ -315,27 +315,12 @@
         }
         this.clearMarker()
         this.map.setFitView(this.polygonList)
-        // if(driverArea){
-        //   this.polygonList2.map(item=>{
-        //     item.hide()
-        //   })
-        //   this.driverList.map(item=>{
-        //     item.show()
-        //   })
-        // }else{
-        //   this.polygonList2.map(item=>{
-        //     item.show()
-        //   })
-        //   this.driverList.map(item=>{
-        //     item.hide()
-        //   })
-        // }
       },
       closeInfoWindow() {
         this.closeInfoWin()
         this.fillDriver()
       },
-      problemSearch(markerList,driverArea) {
+      problemSearch(markerList,driverArea,driverId) {
         this.driverArea=driverArea
         let me = this
         let list = []
@@ -345,6 +330,21 @@
             list.push(me.addMarker(point, item))
           }
         })
+        if(driverArea||driverId){
+          this.polygonList2.map(item=>{
+            item.hide()
+          })
+          this.driverList.map(item=>{
+            item.show()
+          })
+        }else{
+          this.polygonList2.map(item=>{
+            item.show()
+          })
+          this.driverList.map(item=>{
+            item.hide()
+          })
+        }
         me.markerList = list
       },
       addMarker(point, item) {
@@ -517,23 +517,23 @@
           this.showDirver()
         }else if(type=='problem'){
           this.InfoWindow.setContent(this.$refs.problemDetailWin.$el)
-          // this.polygonList2.map(item=>{
-          //   item.show()
-          // })
-          // this.driverList.map(item=>{
-          //   item.hide()
-          // })
+          this.polygonList2.map(item=>{
+            item.show()
+          })
+          this.driverList.map(item=>{
+            item.hide()
+          })
         }else{
           this.showDirver()
         }
       },
       showDirver(){
-        // this.polygonList2.map(item=>{
-        //   item.hide()
-        // })
-        // this.driverList.map(item=>{
-        //   item.show()
-        // })
+        this.polygonList2.map(item=>{
+          item.hide()
+        })
+        this.driverList.map(item=>{
+          item.show()
+        })
       },
       addBound() {
         let me = this;

src/views/command/problem/problemLeft.vue

@@ -208,7 +208,7 @@
           api.getQuestionList(ruleForm).then(res => {
             this.dataList=res.data?res.data:[]
             console.log(this.dataList)
-            me.$emit('problemSearch', this.dataList,this.ruleForm.driverArea)
+            me.$emit('problemSearch', this.dataList,this.ruleForm.driverArea,this.ruleForm.driverId)
             me.searchLoading = false
           }).catch(e => {
             me.searchLoading = false

src/views/command/quality/qualityRight.vue

@@ -105,6 +105,7 @@
   import {mapGetters} from "vuex";
   import cLine from './line'
   import quilityDialog from './qualityDialog'
+  import api from '@/api/command/index'
 
   export default {
     name: "qualityRight",
@@ -118,38 +119,24 @@
     watch: {},
     props: {},
     mounted() {
-      this.search()
+      this.getQuaTrend()
+      this.getQuaWarnList()
     },
     methods: {
       detail(){
         this.visible=true
       },
-      activeTypeClick(activeType) {
-        this.activeType = activeType
-        this.search()
+      getQuaWarnList(){
+        api.getQuaWarnList().then(res => {
+          console.log(res)
+        }).catch(err => {
+        });
       },
-      childTypeClick(childType) {
-        this.childType = childType
-        this.search()
-      },
-      showProblemDetail(item) {
-        this.$emit('showProblemDetail', {id: 1, driverId: 27})
-      },
-      addClick() {
-        this.$emit('askClear', this.driverId)
-        this.addVisible = true
-      },
-      successSubmit() {
-        this.addVisible = false
-        this.search()
-      },
-      search() {
-        let me = this
-        this.searchLoading = true
-        me.$emit('qualityClear', me.driverId)
-        setTimeout(function () {
-          me.searchLoading = false
-        }, 2000)
+      getQuaTrend(){
+        api.getQuaTrend().then(res => {
+          console.log(res)
+        }).catch(err => {
+        });
       }
     },
   }
@@ -181,6 +168,7 @@
     }
 
     > div:first-child {
+      height: 2.2rem;
       > div:last-child {
         padding: 0rem 0rem 0.1rem 0rem;
         position: relative;
@@ -236,6 +224,7 @@
     }
 
     > div:nth-child(2) {
+      height: 2.46rem;
       > div:last-child {
         padding: 0rem 0rem 0.1rem 0rem;
         position: relative;

src/views/main/mainCake.vue

@@ -79,7 +79,7 @@ export default {
     const chart = new G2.Chart({
       container: this.id,
       autoFit: true,
-      padding: [40,270,20,0],
+      padding: [40,270,40,0],
       height: this.height
     });