zc 添加管理的区段列表（计轴区段）

src/jmapNew/mouseController.js

@@ -112,6 +112,7 @@ class MouseController extends Eventful {
                 this.trigger(this.events.__Pan, { dx, dy, oldX, oldY, newX: this._x, newY: this._y });
             } else if (e.which === 3 && this._zoomOnMouseWheel && this._previewOrMapDraw) {
                 this.handleMouseMoveRight({x: e.offsetX, y: e.offsetY});
+                this.isMoveRight = true;
             }
         }
     }
@@ -121,10 +122,23 @@ class MouseController extends Eventful {
             this._dragging = false;
         }
         if (this._zoomOnMouseWheel && this.$jmap.mapDevice['check_box'] && this._previewOrMapDraw ) {
+            console.log(this.isMoveRight, 'mouseup');
             this.eventTarget = this.$jmap.mapDevice['check_box'].instance;
             this.handleBoundingRect(this.eventTarget);
-            var em = this.checkEvent(e);
+            let em;
+            if (!this.isMoveRight) {
+                em = this.checkEvent(e);
+            } else {
+                em = {
+                    clientX:e.offsetX,
+                    clientY:e.offsetY,
+                    eventTarget:this.eventTarget,
+                    deviceCode:'check_box',
+                    deviceType:'CheckBox'
+                };
+            }
             this.trigger(this.events.Selected, em);
+
         }
     }
 
@@ -157,8 +171,13 @@ class MouseController extends Eventful {
     }
 
     contextmenu(e) {
+        // 判断是否正在右键拖选 若不是则弹出右键菜单
+        if (!this.isMoveRight) {
             var em = this.checkEvent(e);
             this.trigger(this.events.Contextmenu, em);
+        } else {
+            this.isMoveRight = false;
+        }
     }
 
     moveEvent(e) {

src/views/newMap/newMapdraft/mapoperate/config/list.vue

@@ -304,13 +304,19 @@
                     :type="item.buttonShowType ? 'danger' : 'primary'"
                     @click="item.hover(item.buttonType)"
                   >激活选择</el-button>
+                  <el-button
+                    size="small"
+                    @click="item.clear()"
+                  >清空</el-button>
                 </div>
-                <div v-for="(nor,indexIn) in formModel[item.prop]" :key="nor" class="list-content" @mouseenter="item.mouseenter(nor)" @mouseleave="item.mouseleave(nor)">
+                <div class="list-content">
+                  <div v-for="(nor,indexIn) in formModel[item.prop]" :key="nor" class="each-content" @mouseenter="item.mouseenter(nor)" @mouseleave="item.mouseleave(nor)">
                     <div class="name">{{ item.getName(nor) }}</div>
                     <div class="close" @click="formModel[item.prop].splice(indexIn, 1);"><i class="el-icon-close" /></div>
                   </div>
                 </div>
               </div>
+            </div>
           </template>
         </template>
       </fieldset>

src/views/newMap/newMapdraft/mapoperate/zcControl.vue

@@ -53,6 +53,7 @@ export default {
             editModel: {
                 code: '',
                 name: '',
+                managedSectionList:[],
                 // visible: '',
                 // concentrateStationList:[],
                 position: {
@@ -95,7 +96,8 @@ export default {
     },
     computed: {
         ...mapGetters('map', [
-            'zcList'
+            'zcList',
+            'seclectDeviceList'
         ]),
         isButtonType() {
             return this.field == 'checkZcSection';
@@ -117,7 +119,8 @@ export default {
                             { prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), type: 'coordinate', width: '140px', children: [
                                 { prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
                                 { prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
-                            ] }
+                            ] },
+                            { prop:'managedSectionList', label:'管理区段列表: ', type: 'checkBoxDevice', getName:this.getName, mouseenter:this.mouseenter, mouseleave:this.mouseleave, buttonShowType:this.isButtonType, hover:this.hover, buttonType:'checkZcSection', clear:this.clear}
                             // { prop:'concentrateStationList', label:this.$t('map.concentrateStationList'), type: 'multiSelect', optionLabel: 'name', optionValue: 'code', options: this.concertrateStation, deviceChange: this.changeConcentrateStation }
                         ]
                     }
@@ -136,9 +139,7 @@ export default {
                             { prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), type: 'coordinate', width: '140px', children: [
                                 { prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
                                 { prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
-                            ] },
+                            ] }
-
-                            { prop:'sectionList', label:'关联区段: ', type: 'checkBoxDevice', getName:this.getName, mouseenter:this.mouseenter, mouseleave:this.mouseleave, buttonShowType:this.isButtonType, hover:this.hover, buttonType:'checkZcSection'}
                             //
                             // { prop:'concentrateStationList', label:this.$t('map.concentrateStationList'), type: 'multiSelect', optionLabel: 'name', optionValue: 'code', options: this.concertrateStation, deviceChange: this.changeConcentrateStation }
                         ]
@@ -159,15 +160,28 @@ export default {
             this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
         },
         deviceSelect(selected) {
-            // debugger;
             // 待调整
+            // this.$refs.make && this.$refs.make.resetFields();
+            if (selected && selected._type.toUpperCase() === 'CheckBox'.toUpperCase()) {
+                this.activeName = 'first';
+                this.seclectDeviceList.forEach(item => {
+                    if (item._type == 'Section' && (item.type == '01' || item.type == '04') && !this.editModel.managedSectionList.includes(selected.code)) {
+                        this.editModel.managedSectionList.push(item.code);
+                    }
+                });
+            } else if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) {
+                if (selected._type == 'Section' && (selected.type == '01' || selected.type == '04') && !this.editModel.managedSectionList.includes(selected.code)) {
+                    this.editModel.managedSectionList.push(selected.code);
+                }
+            } else if (selected && selected._type.toUpperCase() === 'ZcControl'.toUpperCase()) {
                 this.$refs.dataform && this.$refs.dataform.resetFields();
-            this.$refs.make && this.$refs.make.resetFields();
-            if (selected && selected._type.toUpperCase() === 'ZcControl'.toUpperCase()) {
                 this.activeName = 'first';
                 this.editModel = deepAssign(this.editModel, selected);
             }
         },
+        clear() {
+            this.editModel.managedSectionList = [];
+        },
         create() {
             const uid = getUID('ZcControl', this.zcList);
             const models = [];
@@ -263,3 +277,31 @@ export default {
         color: #3E44BE;
     }
 </style>
+<style lang="scss">
+    .view-control-content .list-box .list-content{
+        margin-left:10px;
+        margin-top:10px;
+        margin-right:10px;
+        padding:5px;
+
+    }
+    .view-control-content .list-box .each-content{
+        background: #e2e2e2;
+        margin: 5px;
+        border-radius: 5px;
+        height: 30px;
+        line-height: 30px;
+        padding-left: 10px;
+        padding-right: 7px;
+        display: inline-block;
+        cursor: pointer;
+        font-size: 14px;
+    }
+    .view-control-content .list-box .each-content .name{
+        display: inline-block;
+    }
+    .view-control-content .list-box .each-content .close{
+        display: inline-block;
+        cursor: pointer;
+    }
+</style>