更新

src/api/qdtl/video.js

@@ -8,3 +8,21 @@ export function listVideo(query) {
     params: query
   })
 }
+
+export function queryCamera(query) {
+  return request({
+    url: '/qdtl/monitor/queryCamera',
+    method: 'get',
+    params: query
+  })
+}
+
+  export function editCamera(data) {
+    return request({
+      url: '/qdtl/monitor/editName',
+      method: 'put',
+      data: data
+    })
+
+  // http://api.xt.wenhq.top:8083/mock/55/qdtl/monitor/queryCamera
+}

src/components/map/index.vue

@@ -715,6 +715,36 @@ export default {
             this.pointArry[id]=markerta;
             this.map.addLayer(markerta); //这里是执行，执行之后点就出来了
       },
+       addMarkerVideo(lnglats,icon,size,id,data,type) {
+            let tamarker = new Feature({
+                tadata: {
+                    sectionId: "point",
+                    towerNumber: 22,
+                    data: data ,
+                    type: type
+                }, //这里是用来传值用的，在接下来的一章里（事件）中我会讲到。
+                geometry: new Point(lnglats) //这里是点坐标的位置，这里要注意fromLonLat
+            });
+            tamarker.setStyle(
+                new Style({
+                    image: new Icon({
+                        color: "#eee",
+                        crossOrigin: "anonymous",
+                        src: require("../../assets/images/icons/" + icon), //本地的样式
+                        scale:size
+                    }),
+                },
+                )
+            ); //这里是样式
+            var markerta = new LayerVec({
+                source: new SourceVec({
+                    features: [tamarker] //这里放的就是之前的那个点，如果要放置多个点直接push到这里面就行了
+                }),
+                zIndex:30
+            });
+            this.pointArry[id]=markerta;
+            this.map.addLayer(markerta); //这里是执行，执行之后点就出来了
+      },
        addText(lnglats,text,color,background) {
             let tamarker = new Feature({
                 tadata: {

src/views/qdtl/paiban/index.vue

@@ -80,8 +80,8 @@
       class="my_table"
       :row-class-name="tableRowClassName"
       :header-cell-style="{background:'#24A3B3 50%',color: '#C5D0D4'}">
-      <el-table-column label="生效日期" align="center" prop="effectDate" width='250'/>
-      <el-table-column label="巡更点" align="center" prop="locationName" width='200'>
+      <el-table-column label="生效日期" align="center" prop="effectDate" width='250' fixed/>
+      <el-table-column label="巡更点" align="center" prop="locationName" width='200' fixed>
             <template slot-scope="scope">
                     <div v-for="item of scope.row.locations">
                          <span>  {{item}} </span>
@@ -89,7 +89,7 @@
                     </div>
             </template>
       </el-table-column>
-      <el-table-column label="巡更时间" align="center" prop="detail" width='150' >
+      <el-table-column label="巡更时间" align="center" prop="detail" width='150' fixed>
              <template slot-scope="scope">
                     <div v-for="item of scope.row.timeUnit">
                          <span>  {{item}} </span>
@@ -97,13 +97,20 @@
                     </div>
             </template>
       </el-table-column>
-      <el-table-column :label="dateRange" align="center">
-                    <el-table-column
-                          prop="name"
-                          label="姓名"
-                          align="center"
-                    >
-                    </el-table-column>
+      
+      <el-table-column :label="dateRange" align="center" >
+              <!-- <el-table-column label="生效日期" align="center" prop="effectDate" />
+              <el-table-column label="生效日期" align="center" prop="effectDate" /> -->
+              <!-- <template slot-scope="scope"> -->
+                <el-table-column v-for='(item,key) in dateRangeArry' :key='key' :label="item" :prop="item" width='200' align="center">
+                      <template slot-scope="scope">
+                              <!-- <div style="text-align:center"> -->
+                                          <span>{{scope.row.planDetails[key].nickName}}</span> 
+                              <!-- </div>          -->
+                      </template>
+                </el-table-column>
+            <!-- </template> -->
+                  
       </el-table-column>
     </el-table>
 
@@ -156,6 +163,8 @@ export default {
       userList:[],
 
       dateRange:'',
+
+      dateRangeArry:[],
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -197,6 +206,11 @@ export default {
       getSchedule().then(response =>{
                console.log(response);
                this.scheduleList = response.data
+               this.dateRangeArry = [];
+               for(var index in response.data[0].planDetails){
+                        var date = response.data[0].planDetails[index].queryDate+'('+this.getWeek(response.data[0].planDetails[index].week)+')'
+                        this.dateRangeArry.push(date);
+               }
                this.loading = false
       })
     },
@@ -310,6 +324,24 @@ export default {
      deleteLocation(){
       // this.$refs.mapv.draw.set
        this.$refs.mapv.vector.getSource().clear()
+    },
+    getWeek(week){
+      switch (week) {
+          case 1:
+            return '星期日';
+          case 2:
+            return '星期一';   
+          case 3:
+            return '星期二';
+          case 4:
+            return '星期三';    
+          case 5:
+            return '星期四';    
+          case 6:
+            return '星期五';   
+          case 7:
+            return '星期六';
+        }
     }
   }
 };

src/views/qdtl/plan/index.vue

@@ -344,7 +344,6 @@
                       :value="obj.userId"
                     ></el-option>
           </el-select>
-           </el-form>
        <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitUser">确 定</el-button>
         <el-button @click="cancelUser">取 消</el-button>

src/views/qdtl/video/index.vue

@@ -21,6 +21,18 @@
                             @check-change = 'treeChange'
                             style="color:#C5D0D4;background-color:#04283C;"
                             >
+                             <span class="custom-tree-node" slot-scope="{ node, data }">
+                                <span>{{ node.label }}</span>
+                                <span>
+                                  <el-button
+                                    type="text"
+                                    size="mini"
+                                    icon="el-icon-edit"
+                                    @click="() => openName(node, data)"
+                                    style="margin-left:1rem">
+                                  </el-button>
+                                </span>
+                              </span>
                         </el-tree>
                   </el-scrollbar>
             </div>
@@ -30,11 +42,32 @@
            <mapdiv ref='mapv' style="height:100rem;width:100%" ></mapdiv>
       </div>
 
+       <el-dialog title="重命名" :visible.sync="openNameValue" width="50rem" append-to-body>
+             <el-form :model="nameObj" ref="queryForm" :inline="true" label-width="6.8rem">
+                      <el-form-item label="原名称:" prop="oldName">
+                                <div style="color:white">{{nameObj.oldName}}</div>
+                      </el-form-item>
+                      <el-form-item label="名称:" prop="name">
+                        <el-input
+                          v-model="nameObj.name"
+                          placeholder="请输入名称"
+                          clearable
+                          size="small"
+                          style="width:30rem"
+                        />
+                      </el-form-item>
+             </el-form>
+       <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitName">确 定</el-button>
+        <el-button @click="cancelName">取 消</el-button>
+      </div>
+      </el-dialog>
+
   </div>
 </template>
 
 <script>
-import { listVideo } from "@/api/qdtl/video";
+import { listVideo,queryCamera,editCamera } from "@/api/qdtl/video";
 import { httpRequest } from "@/api/data/http";
 import mapdiv from "@/components/map/index.vue"
 
@@ -43,6 +76,10 @@ export default {
       return {
         videoData:[],
         expandedKeys:[],
+        openNameValue:false,
+        nameObj:{},
+        nameData:{},
+        videoMap:{},
         data: [{
           id: 1,
           label: '一级 1',
@@ -106,9 +143,33 @@ export default {
     },
     created() {
         this.getvideo();
+        this.queryCamera();
         // this.getList();
     },
     methods:{
+        openName(node,data){
+                 this.nameObj.channel = data.id;
+                 this.nameObj.oldName = data.label
+                 this.nameData = data;
+                 this.openNameValue = true
+        },
+        submitName(){
+                  // var that = this
+                  editCamera(this.nameObj).then(response =>{
+                                this.openNameValue = false
+                                this.nameData.label = this.nameObj.name
+                                this.nameObj.name = null
+                  })
+        },
+        cancelName(){
+             this.queryParams.name = null;
+             this.openNameValue = false
+        },
+        queryCamera(){
+              queryCamera().then(data =>{
+                      this.videoMap = data.data
+              })
+        },
         loadNode(node, resolve){
         if (node.level > 3) return resolve([]);
         if(node.level <3){
@@ -131,7 +192,11 @@ export default {
                           // console.log();
                               var obj = json.data.list[index];
                               obj.id = obj.cameraIndexCode;
-                              obj.label = obj.name;
+                              if(this.videoMap[obj.id]){
+                                     obj.label = this.videoMap[obj.id]
+                              }else{
+                                     obj.label = obj.name;
+                              }
                               obj.data = obj;
                               obj.lnglat = obj.longitude +','+obj.latitude;
                               childerns.push(obj);
@@ -210,7 +275,7 @@ export default {
               if(node == false){
                    this.$refs.mapv.removeLayer(data.id);
               }else if(node == true){
-                   this.$refs.mapv.addMarker(data.lnglat.split(','),'video.png',0.8,data.id,data,'video');
+                   this.$refs.mapv.addMarkerVideo(data.lnglat.split(','),'video.png',0.8,data.id,data,'video');
               }
 
           }
@@ -234,7 +299,7 @@ export default {
 <style>
      .leftTree{
           float:left;
-          width:32rem;
+          width:36rem;
           background-color:#04283C;
           padding: 10px;
           padding-top:0 ;

src/views/qdtl/video/video.vue

@@ -3,9 +3,20 @@
      <headerdiv ref="headerDiv" :currentindexP = currentindexNew></headerdiv>
      <div style="display: inline-flex">
       <div class='leftTree'>
+            <!-- <el-form :model="nameObj" ref="nameObj" :inline="true" label-width="68px">
+                <el-form-item label="名称" prop="name"> -->
+                  <!-- <el-input
+                    v-model="nameObj.name"
+                    placeholder="请输入重命名名称"
+                    clearable
+                    size="small"
+                  /> -->
+                <!-- </el-form-item>
+            </el-form>          -->
             <el-input
                 placeholder="输入关键字进行过滤"
-                v-model="filterText">
+                v-model="filterText"
+                style="margin-top:1rem">
             </el-input>
              <div style="height:83vh;">
                   <el-scrollbar style="height:110%;">
@@ -13,7 +24,7 @@
                             :data="videoData"
                             :load="loadNode"
                             lazy
-                          :expand-on-click-node="false"
+                            :expand-on-click-node="false"
                             node-key="id"
                             :default-expanded-keys="expandedKeys"
                             :default-checked-keys="[5]"
@@ -23,12 +34,25 @@
                             @node-click = 'treeChange'
                             style="background-color:#04283C;color:#C5D0D4"
                             >
+                            <!-- <span class="custom-tree-node" slot-scope="{ node, data }">
+                                <span>{{ node.label }}</span>
+                                <span>
+                                  <el-button
+                                    type="text"
+                                    size="mini"
+                                    @click.stop="treeChange"
+                                    @click="() => openName(node, data)"
+                                    style="margin-left:2rem">
+                                    修改
+                                  </el-button>
+                                </span>
+                              </span> -->
                         </el-tree>
                </el-scrollbar>
             </div>
       </div>
 
-     <div style="position: absolute;right:0;top:0;width:100% ;height: 100%;padding-left:33rem;margin-top:5rem;z-index:1000;">
+     <div style="position: absolute;right:0;top:0;width:100%;height:90%;padding-left:33rem;margin-top:5rem;z-index:1000;">
          <videodiv :cameracode="ccode" style="height:100%;width:100%"></videodiv>
       </div>
      </div>
@@ -36,7 +60,7 @@
 </template>
 
 <script>
-import { listVideo } from "@/api/qdtl/video";
+import { listVideo,queryCamera,editCamera } from "@/api/qdtl/video";
 import { httpRequest } from "@/api/data/http";
 import videodiv from "@/components/Videoplayer/index.vue"
 import headerdiv from '@/components/HeaderDiv/index.vue'
@@ -45,10 +69,16 @@ export default {
     data() {
       return {
         videoMap:new Map(),
+        nameObj:{
+              channel:'',
+              name:''
+        },
         videoData:[],
+        // videoMap:new Map(),
         expandedKeys:[],
         videoIndex:1,
         currentindexNew:2,
+        remarkName:false,
         data: [{
           id: 1,
           label: '一级 1',
@@ -91,6 +121,7 @@ export default {
         filterText:'',
         ccode:'',
         jsonArry:[],
+        creamData:[],
         pointIdArry:[],
         regionIndexCode:'',
         queryParams:{
@@ -119,6 +150,7 @@ export default {
     
     mounted(){
       window.videosize = "3x3";
+      this.queryCamera();
 
     },
     beforeDestroy(){
@@ -126,6 +158,25 @@ export default {
       closevideo();
     },
     methods:{
+        openName(node,data){
+              if(this.nameObj.name.length > 0){
+                      this.nameObj.channel = data.id
+                      console.log(this.nameObj);
+                      editCamera(this.nameObj).then(response =>{
+                                console.log(response);
+                       })
+              }
+        },
+        editCamera(){
+              editCamera().then(data =>{
+
+              })
+        },
+        queryCamera(){
+              queryCamera().then(data =>{
+                      this.videoMap = data.data
+              })
+        },
         loadNode(node, resolve){
         if (node.level > 3) return resolve([]);
         if(node.level <3){
@@ -145,10 +196,15 @@ export default {
                         // console.log(json);
                         var childerns = [];
                         for(var index in json.data.list){
-                          // console.log();
+                          // console.log();\
                               var obj = json.data.list[index];
                               obj.id = obj.cameraIndexCode;
-                              obj.label = obj.name;
+                              // remarkName
+                              if(this.videoMap[obj.id]){
+                                     obj.label = this.videoMap[obj.id]
+                              }else{
+                                     obj.label = obj.name;
+                              }
                               obj.data = obj;
                               obj.lnglat = obj.longitude +','+obj.latitude;
                               childerns.push(obj);
@@ -163,10 +219,10 @@ export default {
                var json = JSON.parse(response.data);
                console.log(json);
                for(var index in json.data.list){
-                    obj = json.data.list[index]
-                    obj.id = obj.indexCode;
-                    obj.label = obj.name;
-                    obj.data = obj;
+                    // obj = json.data.list[index]
+                    // obj.id = obj.indexCode;
+                    // obj.label = obj.name;
+                    // obj.data = obj;
                     var obj = json.data.list[index]
                     obj.id = obj.indexCode;
                     obj.label = obj.name;
@@ -210,8 +266,6 @@ export default {
                 return data.label.indexOf(value) !== -1;
       },
       treeChange(data, node){
-          console.log(data);
-          console.log(node);
           var arry = this.$refs.tree.getCheckedNodes()
           // console.log(data.cameraIndexCode);
           // var pointArry = this.$refs.mapv.pointArry;