Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test

2021-01-13 17:54:11 +08:00 · 2021-01-13 17:54:11 +08:00 · c42a184b7b
commit c42a184b7b
parent 7ac59f6006 9f4155b70d
6 changed files with 115 additions and 62 deletions
--- a/src/jmapNew/shape/Responder/index.js
+++ b/src/jmapNew/shape/Responder/index.js
@ -9,9 +9,9 @@ import Polygon from 'zrender/src/graphic/shape/Polygon';
 const defaultStyle = {
    block:{
        stroke: '#fff', mapStyle: {
-            FB: { fill: '#fff' },
-            VB: { fill: '#666' },
-            IB: { fill: '#666' }
+            FB: { fill: '#fff', stroke: '#000' },
+            VB: { fill: '#666', stroke: '#000' },
+            IB: { fill: '#666', stroke: '#000' }
        }
    },
    text:{
@ -40,16 +40,19 @@ export default class Responder extends Group {
    create() {
        const model = this.model;
        const responderStyle = this.style.Responder || defaultStyle;
-        const blockX = model.position.x;
-        const blockY = model.position.y;
+        const distance = 12;
+        const offsetX = distance * Math.sin(model.rotate);
+        const offsetY = distance * Math.cos(model.rotate);
        const blockWidth = responderStyle.block.width || 5;
        const blockHeight = responderStyle.block.height || 12;
-        const blockStroke = responderStyle.block.stroke;
        const blockStyle = responderStyle.block.mapStyle[model.type] || { fill: '#fff'};
-        const textX = model.position.x + model.textOffset.x;
-        const textY = model.position.y + model.textOffset.y;
+        const blockX = model.position.x - blockWidth / 2 - offsetX;
+        const blockY = model.position.y - blockHeight / 2 - offsetY;
+        const textX = blockX + model.textOffset.x;
+        const textY = blockY + model.textOffset.y;
        const textName = `${model.type}-${model.name}`;
        const textFill = responderStyle.text.textFill;
+        const origin = [model.position.x, model.position.y];
        const deltaFill = responderStyle.delta.fill;
        const padding = 1.2;

@ -63,25 +66,10 @@ export default class Responder extends Group {
                height: blockHeight
            },
            style: {
-                stroke: blockStroke,
                ...blockStyle
            }
        });

-        this.text = new Text({
-            zlevel: this.zlevel,
-            z: this.z + 1,
-            style: {
-                x: textX,
-                y: textY,
-                text: textName,
-                fontFamily: this.style.fontFamily,
-                fontSize: this.style.fontSize,
-                textFill: textFill,
-                textAlign: 'right'
-            }
-        });
-
        this.delta1 = new Polygon({
            zlevel: this.zlevel,
            z: this.z + 1,
@ -112,8 +100,22 @@ export default class Responder extends Group {
            }
        });

+        this.text = new Text({
+            zlevel: this.zlevel,
+            z: this.z + 1,
+            origin,
+            style: {
+                x: textX,
+                y: textY,
+                text: textName,
+                fontFamily: this.style.fontFamily,
+                fontSize: this.style.fontSize,
+                textFill: textFill,
+                textAlign: 'right'
+            }
+        });
+
        if (model.rotate) {
-            const origin = [blockX, blockY];
            const rotation = -Math.PI / 180 * Number(model.rotate);
            [this.block, this.delta1, this.delta2].forEach(el => {
                this.transformRotation(el, origin, rotation);
@ -121,7 +123,6 @@ export default class Responder extends Group {
        }

        if (model.textRotate) {
-            const origin = [textX, textY];
            const rotation = -Math.PI / 180 * Number(model.textRotate);
            this.transformRotation(this.text, origin, rotation);
        }
--- a/src/views/newMap/newMapdraft/mapoperate/responder/index.vue
+++ b/src/views/newMap/newMapdraft/mapoperate/responder/index.vue
@ -1,13 +1,46 @@
 <template>
  <el-tabs v-model="activeName" class="card">
    <el-tab-pane class="view-control" :label="$t('map.property')" name="first" :lazy="lazy">
-      <responder-model ref="respModel" :field="field" :responder-type-list="responderTypeList" :centralized-station-list="centralizedStationList" v-on="$listeners" @hover="hover" @deviceChange="deviceChange" @deviceSelect="deviceSelect"/>
+      <responder-model
+        ref="respModel"
+        :field="field"
+        :responder-type-list="responderTypeList"
+        :centralized-station-list="centralizedStationList"
+        :responder-list="responderList"
+        :section-list="filterSectionList"
+        v-on="$listeners"
+        @hover="hover"
+        @deviceChange="deviceChange"
+        @deviceSelect="deviceSelect"
+      />
    </el-tab-pane>
    <el-tab-pane class="view-control" :label="$t('map.newConstruction')" name="second" :lazy="lazy">
-      <responder-create ref="respCreate" :field="field" :responder-type-list="responderTypeList" :centralized-station-list="centralizedStationList" v-on="$listeners" @hover="hover" @deviceChange="deviceChange" @deviceSelect="deviceSelect"/>
+      <responder-create
+        ref="respCreate"
+        :field="field"
+        :responder-type-list="responderTypeList"
+        :centralized-station-list="centralizedStationList"
+        :responder-list="responderList"
+        :section-list="filterSectionList"
+        v-on="$listeners"
+        @hover="hover"
+        @deviceChange="deviceChange"
+        @deviceSelect="deviceSelect"
+      />
    </el-tab-pane>
    <el-tab-pane class="view-control" label="批量创建" name="third" :lazy="lazy">
-      <responder-batch ref="respBatch" :field="field" :responder-type-list="responderTypeList" :centralized-station-list="centralizedStationList" v-on="$listeners" @hover="hover" @deviceChange="deviceChange" @deviceSelect="deviceSelect"/>
+      <responder-batch
+        ref="respBatch"
+        :field="field"
+        :responder-type-list="responderTypeList"
+        :centralized-station-list="centralizedStationList"
+        :responder-list="responderList"
+        :section-list="filterSectionList"
+        v-on="$listeners"
+        @hover="hover"
+        @deviceChange="deviceChange"
+        @deviceSelect="deviceSelect"
+      />
    </el-tab-pane>
  </el-tabs>
 </template>
@ -44,8 +77,13 @@ export default {
    },
    computed: {
        ...mapGetters('map', [
-            'stationList'
+            'stationList',
+            'sectionList',
+            'responderList'
        ]),
+        filterSectionList() {
+            return this.sectionList.filter(el => ['01', '03'].includes(el.type));
+        },
        responderTypeList() {
            return 	ConstConfig.ConstSelect.responderTypeList;
        }
@ -76,15 +114,23 @@ export default {
                this.activeName = 'first';
                this.$refs.respModel.setModel(selected);
            } else if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase() && this.field.toUpperCase() === 'RelSectionCode'.toUpperCase()) {
+                if (['01', '03'].includes(selected.type)) {
                    this.$refs.respCreate.setModel(selected);
                    this.activeName = 'second';
                    this.field = '';
                    this.$emit('deviceSelect', '');
+                } else {
+                    this.$message.error('请选择物理区段');
+                }
            } else if (selected && selected._type.toUpperCase() === 'Section'.toUpperCase() && this.field.toUpperCase() === 'RelBatchSectionCode'.toUpperCase()) {
+                if (['01', '03'].includes(selected.type)) {
                    this.$refs.respBatch.setModel(selected);
                    this.activeName = 'third';
                    this.field = '';
                    this.$emit('deviceSelect', '');
+                } else {
+                    this.$message.error('请选择物理区段');
+                }
            } else if (!selected) {
                this.$emit('deviceSelect', '');
            }
--- a/src/views/newMap/newMapdraft/mapoperate/responder/responderBatch.vue
+++ b/src/views/newMap/newMapdraft/mapoperate/responder/responderBatch.vue
@ -53,7 +53,6 @@
 </template>

 <script>
-import { mapGetters } from 'vuex';
 import * as utils from './utils';

 export default {
@ -71,6 +70,14 @@ export default {
        responderTypeList: {
            type: Array,
            required: true
+        },
+        sectionList: {
+            type: Array,
+            required: true
+        },
+        responderList: {
+            type: Array,
+            required: true
        }
    },
    data() {
@ -83,12 +90,6 @@ export default {
            rowData: null
        };
    },
-    computed: {
-        ...mapGetters('map', [
-            'responderList',
-            'sectionList'
-        ])
-    },
    methods: {
        setModel(selected) {
            if (this.rowData) {
--- a/src/views/newMap/newMapdraft/mapoperate/responder/responderCreate.vue
+++ b/src/views/newMap/newMapdraft/mapoperate/responder/responderCreate.vue
@ -9,7 +9,6 @@
 </template>

 <script>
-import { mapGetters } from 'vuex';
 import CreateOperate from '../components/createOperate';
 import * as utils from './utils';

@ -31,6 +30,14 @@ export default {
        responderTypeList: {
            type: Array,
            required: true
+        },
+        sectionList: {
+            type: Array,
+            required: true
+        },
+        responderList: {
+            type: Array,
+            required: true
        }
    },
    data() {
@ -48,16 +55,12 @@ export default {
                    { required: true, message: '请选择应答器类型', trigger: 'blur' }
                ],
                sectionCode: [
-                    { required: true, message: '请选择关联区段', trigger: 'blur' }
+                    { required: true, message: '请关联物理区段', trigger: 'blur' }
                ]
            }
        };
    },
    computed: {
-        ...mapGetters('map', [
-            'responderList',
-            'sectionList'
-        ]),
        isButtonType() {
            return this.field == 'RelSectionCode';
        },
--- a/src/views/newMap/newMapdraft/mapoperate/responder/responderModel.vue
+++ b/src/views/newMap/newMapdraft/mapoperate/responder/responderModel.vue
@ -11,7 +11,6 @@
 </template>

 <script>
-import { mapGetters } from 'vuex';
 import { deepAssign } from '@/utils/index';
 import OperateProperty from '../components/operateProperty';

@ -35,6 +34,14 @@ export default {
            type: Array,
            required: true
        },
+        sectionList: {
+            type: Array,
+            required: true
+        },
+        responderList: {
+            type: Array,
+            required: true
+        },
        centralizedStationList: {
            type: Array,
            required: true
@ -80,7 +87,7 @@ export default {
                    { required: true, message: '请输入应答器文字旋转角度', trigger: 'blur' }
                ],
                sectionCode: [
-                    { required: true, message: '请选择关联区段', trigger: 'blur' }
+                    { required: true, message: '请关联物理区段', trigger: 'blur' }
                ],
                stationCode: [
                    { required: true, message: '请选择关联集中站', trigger: 'blur' }
@ -101,10 +108,6 @@ export default {
        };
    },
    computed: {
-        ...mapGetters('map', [
-            'responderList',
-            'sectionList'
-        ]),
        form() {
            const form = {
                labelWidth: '130px',
@ -130,7 +133,7 @@ export default {
                                { prop: 'textOffset.y', firstLevel: 'textOffset', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px', disabled: false }
                            ] },
                            { prop:'textRotate', label: '文字旋转', type: 'number' },
-                            { prop: 'sectionCode', label: '关联区段', type: 'select', optionLabel: 'code', optionValue: 'code', options: this.sectionList },
+                            { prop: 'sectionCode', label: '关联区段', type: 'select', optionLabel: 'code', optionValue: 'code', options: this.sectionList},
                            { prop: 'stationCode', label: '关联集中站' + ':', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.centralizedStationList }
                        ]
                    },
--- a/src/views/newMap/newMapdraft/mapoperate/responder/utils.js
+++ b/src/views/newMap/newMapdraft/mapoperate/responder/utils.js
@ -2,21 +2,20 @@ import { getUID } from '@/jmapNew/utils/Uid';

 export function buildModelBySection(section, model, list) {
    if (section) {
-        const distance = 10;
        const length = section.points.length;
        const dx = (section.points[length - 1].x - section.points[0].x);
        const dy = (section.points[length - 1].y - section.points[0].y);
        const rotate = Math.atan2(dy, dx) * 180 / Math.PI;
-        const vx = (section.points[length - 1].x + section.points[0].x) / 2 - distance * Math.sin(rotate);
-        const vy = (section.points[length - 1].y + section.points[0].y) / 2 - distance * Math.cos(rotate);
+        const vx = (section.points[length - 1].x + section.points[0].x) / 2;
+        const vy = (section.points[length - 1].y + section.points[0].y) / 2;

        return {
            _type: 'Responder',
            code: getUID('Responder', list),
            type: model.type,
            name: model.name,
-            rotate: 90 + rotate,
-            textRotate: 90 + rotate,
+            rotate: rotate + 90,
+            textRotate: rotate + 90,
            position: {
                x: vx,
                y: vy