绘图相关调整_(问题调整)

src/views/mapsystem/plugin/delayBox.vue

@@ -1,7 +1,8 @@
 <template>
   <div v-if="delayShow">
-    <div v-for="item in delayInfoList" />
+    <div v-for="item in stationList">
-
+      <delay-info v-if="item.delayInfo" :delay-info-list="item.delayInfo" position="item.points" />
+    </div>
   </div>
 </template>
 
@@ -10,16 +11,21 @@ import DelayInfo from './delayInfo';
 
 export default {
     name: 'DelayBox',
+    components: {
+        DelayInfo
+    },
     data() {
         return {
             delayShow: false,
-            delayInfoList: []
+            stationList: []
         };
     },
-    methods: {
+    watch: {
-        doShow() {
+        '$store.state.map.stationList': function(val) {
-
+            this.stationList = val;
         }
+    },
+    methods: {
     }
 };
 </script>

src/views/mapsystem/plugin/delayInfo.vue

@@ -1,19 +1,72 @@
 <template>
-  <div><span>人解</span><span>信号机名</span><span>时间</span></div>
+  <div v-show="showDelayBox" class="info_box" :style="{left: tPosition.x+'px', top: tPosition.y+'px' }">
+    <el-scrollbal>
+      <div v-for="item in delayInfoList"><span>人解</span><span>信号机名</span><span>时间</span></div>
+    </el-scrollbal>
+  </div>
 </template>
 
 <script>
 export default {
     name: 'DelayInfo',
     props: {
-        delayInformation: {
+        delayInfoList: {
             type: Object,
-            required: true
+            required: true,
+            default: function () {
+                return [];
+            }
+        },
+        position: {
+            type: Object,
+            required: true,
+            default: function () {
+                return {
+                    x: 0,
+                    y: 0
+                };
+            }
+        }
+    },
+    data() {
+        return {
+            tPosition: {
+                x: 0,
+                y: 0
+            },
+            showDelayBox: true
+        };
+    },
+    watch: {
+        'position.x': function (val) {
+            this.handlePosition();
+        },
+        'position.y': function (val) {
+            this.handlePosition();
+        }
+    },
+    methods: {
+        handlePosition() {
+            const offset = this.$store.state.config.canvasOffset;
+            this.tPosition = {
+                x: this.position.x + offset.x,
+                y: this.position.y + offset.y
+            };
+            if (this.tPosition.x < 0 || this.tPosition < 0) {
+                this.showDelayBox = false;
+            } else {
+                this.showDelayBox = true;
+            }
         }
     }
 };
 </script>
 
 <style scoped>
-
+    .info_box{
+        border-top:1px solid #fff;
+        height: auto;
+        max-height: 200px;
+        background-color: #000;
+    }
 </style>

src/views/newMap/newMapdraft/index.vue

@@ -137,7 +137,6 @@ export default {
                     this.setDelayUnlockStatus(response.data, '00');
                     this.initAutoSaveTask();
                 }).catch((error) => {
-                    console.log(error);
                     this.$message.error(this.$t('tip.failedLoadMap'));
                     this.endViewLoading();
                 });

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

@@ -68,6 +68,7 @@
                 filterable
                 :placeholder="item.placeholder"
                 :disabled="item.disabled"
+                :clearable="item.clearable"
               >
                 <el-option
                   v-for="option in item.options"

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

@@ -342,7 +342,9 @@ export default {
                 value: '02',
                 label: this.$t('map.sectionAssociationMode')
             }],
-            AssociateSectionList: []
+            AssociateSectionList: [],
+            oldLeftSectionCode: '',
+            oldRightSectionCode: ''
         };
     },
     computed: {
@@ -372,8 +374,8 @@ export default {
                                 { prop: 'namePosition.y', firstLevel: 'namePosition', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px' }
                             ] },
                             { prop: 'type', label: this.$t('map.sectionType'), type: 'select', optionLabel: 'name', optionValue: 'code', options: this.SectionTypeList},
-                            { prop: 'leftSectionCode', label: this.$t('map.leftAssociatedSection'), type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', clearable: true, options: this.AssociateSectionList, hover: this.hover, buttonType: 'leftSection', buttonShowType: this.isLeftSectionButtonShow},
+                            { prop: 'leftSectionCode', label: this.$t('map.leftAssociatedSection'), type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', clearable: true, options: this.AssociateSectionList, hover: this.hover, buttonType: 'leftSection', buttonShowType: this.isLeftSectionButtonShow, isHidden: !this.hasAssociatedSection},
-                            { prop: 'rightSectionCode', label: this.$t('map.rightAssociatedSection'), type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', clearable: true, options: this.AssociateSectionList},
+                            { prop: 'rightSectionCode', label: this.$t('map.rightAssociatedSection'), type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', clearable: true, options: this.AssociateSectionList, hover: this.hover, buttonType: 'rightSection', buttonShowType: this.isRightSectionButtonShow, isHidden: !this.hasAssociatedSection},
                             { prop: 'parentCode', label: this.$t('map.associatedSection'), type: 'select', mode: true, optionLabel: 'name&&code', optionValue: 'code', disabled: true, options: this.sectionList, isHidden: !this.isParentCode },
 
                             { prop: 'isStandTrack', label: this.$t('map.isStandTrack'), type: 'checkbox', isHidden: !this.isStandTrackShow }, // 1
@@ -444,16 +446,16 @@ export default {
         },
         rules() {
             var validateLeftSection = (rule, value, callback) => {
-                const leftSection = value ? this.$store.getters['map/getDeviceByCode'](value) : '';
+                const leftSection = value ? this.$store.getters['map/getDeviceByCode'](value) : null;
-                if (leftSection && (leftSection.points[1].x !== this.editModel.points[0].x || leftSection.points[1].y !== this.editModel.points[0].y )) {
+                if (leftSection && !(this.checkPointsCoincide(leftSection.points[leftSection.points.length - 1], this.editModel.points[0].x) || this.checkPointsCoincide(leftSection.points[leftSection.points.length - 1], this.oldPoint[0]) )) {
                     callback(new Error(this.$t('rules.theLeftEndOfTheSelectedAssociatedSectionIsNotAdjacent')));
                 } else {
                     callback();
                 }
             };
             var validateRightSection = (rule, value, callback) => {
-                const rightSection = value ? this.$store.getters['map/getDeviceByCode'](value) : '';
+                const rightSection = value ? this.$store.getters['map/getDeviceByCode'](value) : null;
-                if (rightSection && (rightSection.points[0].x !== this.editModel.points[1].x || rightSection.points[0].y !== this.editModel.points[1].y )) {
+                if (rightSection && !(this.checkPointsCoincide(rightSection.points[0], this.editModel.points[this.editModel.points.length - 1]) || this.checkPointsCoincide(rightSection.points[0], this.oldPoint[this.oldPoint.length - 1]))) {
                     callback(new Error(this.$t('rules.theRightEndOfTheSelectedAssociatedSectionIsNotAdjacent')));
                 } else {
                     callback();
@@ -598,6 +600,12 @@ export default {
         },
         isLeftSectionButtonShow() {
             return this.field === 'leftSection';
+        },
+        isRightSectionButtonShow() {
+            return this.field === 'rightSection';
+        },
+        hasAssociatedSection() {
+            return this.editModel.type === '01' || this.editModel.type === '03';
         }
     },
     watch: {
@@ -647,16 +655,20 @@ export default {
             if (!this.fieldS) { // 判断是否激活选择站台
                 if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase()) {
                     if (this.field === 'leftSection') {
+                        if (selected.type === '01' || selected.type === '03') {
                             this.editModel.leftSectionCode = selected.code;
                             this.activeName = 'first';
                             this.field = '';
                             this.$emit('fieldSelect', '');
+                        }
                         return;
                     } else if (this.field === 'rightSection') {
+                        if ((selected.type === '01' || selected.type === '03')) {
                             this.editModel.rightSectionCode = selected.code;
                             this.activeName = 'first';
                             this.field = '';
                             this.$emit('fieldSelect', '');
+                        }
                         return;
                     }
                     this.$refs.dataform.resetFields();
@@ -667,6 +679,8 @@ export default {
                     this.editModel.isSegmentation = selected.isSegmentation || false;
                     this.editModel.points = JSON.parse(JSON.stringify(selected.points));
                     this.oldPoint = JSON.parse(JSON.stringify(selected.points));
+                    this.oldLeftSectionCode = selected.leftSectionCode;
+                    this.oldRightSectionCode = selected.rightSectionCode;
                     this.editModel.lengthFact = selected.lengthFact || 0;
 
                     this.addModel.splitOffsetMax = Math.sqrt(new JTriangle(selected.points[0], selected.points[selected.points.length - 1]).abspowz);
@@ -902,6 +916,10 @@ export default {
         edit() {
             this.$refs['dataform'].validate((valid) => {
                 if (valid) {
+                    if (this.editModel.type === '03' && this.editModel.leftSectionCode && this.editModel.rightSectionCode) {
+                        this.$messageBox('道岔区段应仅有一侧关联区段！');
+                        return;
+                    }
                     const models = [];
                     const model = deepAssign(this.editModel, {_type: 'Section'}); // 修改元素model
                     model.leftStopPointOffset = Number(model.leftStopPointOffset);
@@ -933,11 +951,50 @@ export default {
                     this.fieldS = '';
                     this.$emit('updateMapModel', models);
                     this.oldPoint = JSON.parse(JSON.stringify(model.points));
+                    this.oldLeftSectionCode = model.leftSectionCode;
+                    this.oldRightSectionCode = model.rightSectionCode;
                 } else {
                     this.$message('还有属性未填写，修改未生效！');
                 }
             });
         },
+        handleAssociatedSectionChange(model) { // 处理因该区段关联区段改变影响的区段数据
+            const models = [];
+            if (model.leftSectionCode !== this.oldLeftSectionCode) {
+                const editLeftSection = this.getSectionByCode(model.leftSectionCode);
+                const oldEditLeftSection = this.getSectionByCode(this.oldLeftSectionCode);
+                if (editLeftSection) {
+                    editLeftSection.rightSectionCode = model.code;
+                    models.push(editLeftSection);
+                }
+                if (oldEditLeftSection) {
+                    oldEditLeftSection.rightSectionCode = '';
+                    models.push(oldEditLeftSection);
+                }
+            }
+            if (model.rightSectionCode !== this.oldRightSectionCode) {
+                const editRightSection = this.getSectionByCode(model.rightSectionCode);
+                const oldEditRightSection = this.getSectionByCode(this.oldRightSectionCode);
+                if (editRightSection) {
+                    editRightSection.leftSectionCode = model.code;
+                    models.push(editRightSection);
+                }
+                if (oldEditRightSection) {
+                    oldEditRightSection.leftSectionCode = '';
+                    models.push(oldEditRightSection);
+                }
+            }
+            return models;
+        },
+        getSectionByCode(code) { // 根据sectionCode 获取深拷贝的section对象
+            if (code) {
+                const section = deepAssign({}, this.$store.getters['map/getDeviceByCode'](code) || {});
+                if (JSON.stringify(section) !== '{}') {
+                    return section;
+                }
+            }
+            return null;
+        },
         // 删除对象
         deleteObj() {
             const models = [];
@@ -1170,6 +1227,12 @@ export default {
                     }
                 }
             });
+        },
+        checkPointsCoincide(point1, point2) { // 校验两点是否重合
+            if (point1 && point2) {
+                return point1.x === point2.x && point1.y === point2.y;
+            }
+            return false;
         }
     }
 };