调整线段画法

src/iscs/shape/line.js

@@ -27,7 +27,7 @@ export default class line extends Group {
             position: [model.points[0].x, model.points[0].y]
         });
         // 1101 垂直渐变 1110 水平渐变
-        let strokeColor = this.model.fillColor;
+        let fillColor = this.model.fillBackground;
         if (model.isGradual) {
             const offsetList = [];
             model.modelList.forEach(item => {
@@ -37,9 +37,9 @@ export default class line extends Group {
                 });
             });
             if (model.gradualShow == 'level') {
-                strokeColor = new zrender.LinearGradient(1, 1, 0, 1, offsetList);
+                fillColor = new zrender.LinearGradient(1, 1, 0, 1, offsetList);
             } else {
-                strokeColor = new zrender.LinearGradient(1, 1, 1, 0, offsetList);
+                fillColor = new zrender.LinearGradient(1, 1, 1, 0, offsetList);
             }
         }
         const modelPoints = [];
@@ -53,16 +53,20 @@ export default class line extends Group {
         this.iscsLine = new Polyline({
             zlevel: model.zlevel,
             z: model.z,
-			z2: model.z2||0,
+            z2: model.z2 || 0,
             draggable: false,
             shape: {
                 points: modelPoints
             },
             style: {
                 lineWidth: this.model.lineWidth,
-                stroke: strokeColor
+                stroke: this.model.fillColor
             }
         });
+        console.log(this.model.fill);
+        if (fillColor) {
+            this.iscsLine.setStyle('fill', fillColor);
+        }
         if (model.classify == 'dashed') {
             this.iscsLine.setStyle('lineDash', [8, 6]);
         }
@@ -76,7 +80,7 @@ export default class line extends Group {
             this.arrows = new Polygon({
                 zlevel: model.zlevel,
                 z: model.z,
-				z2: model.z2||0,
+                z2: model.z2 || 0,
                 origin: [0, 0],
                 rotation: rotation,
                 shape: {
@@ -104,7 +108,7 @@ export default class line extends Group {
             this.arrows = new Polygon({
                 zlevel: model.zlevel,
                 z: model.z,
-				z2: model.z2||0,
+                z2: model.z2 || 0,
                 origin: [x, y],
                 rotation: rotation,
                 shape: {

src/iscs/shape/picture.js

@@ -20,10 +20,11 @@ import blowerRedRight from '@/assets/iscs_picture/gufengji-red-r.png';
 import blowerGrayRight from '@/assets/iscs_picture/gufengji-gray-r.png';
 import iscsAPF from '@/assets/iscs_picture/iscs_APF.png';
 import drum from '@/assets/iscs_picture/drum.png';
-import exhaustFan from '@/assets/iscs_picture/exhaustFan.png'
+import exhaustFan from '@/assets/iscs_picture/exhaustFan.png';
 import waterCooler from '@/assets/iscs_picture/ZSDF533.png';
 import textBgBluePoint from '@/assets/iscs_picture/textBgBluePoint.png';
-import ventilationFan from '@/assets/iscs_picture/ventilationFan.png'
+import ventilationFan from '@/assets/iscs_picture/ventilationFan.png';
+import kongzhixiang from '@/assets/iscs_picture/iscs_kongzhixiang.png';
 
 const pictureObj = {
     'psdLeft': psdLeft,
@@ -48,7 +49,8 @@ const pictureObj = {
     exhaustFan,
     waterCooler,
     textBgBluePoint,
-	ventilationFan
+    ventilationFan,
+    kongzhixiang
 };
 export default class Picture extends Group {
     constructor(device) {
@@ -70,8 +72,8 @@ export default class Picture extends Group {
         this.imageButton = new Image({
             zlevel: model.zlevel,
             z: model.z,
-			origin: [model.width/2, model.height/2],
-			rotation: (model.rotation||0)*Math.PI/180,
+            origin: [model.width / 2, model.height / 2],
+            rotation: (model.rotation || 0) * Math.PI / 180,
             style: {
                 x: 0,
                 y: 0,

src/views/iscs/iscsDraw/icscComponents/line.vue

@@ -5,7 +5,7 @@
         <el-input-number v-model="form.z2" controls-position="right" :min="0" size="small" />
       </el-form-item>
       <el-form-item label="线段宽度:" prop="lineWidth">
-        <el-input-number v-model="form.lineWidth" controls-position="right" :min="1" :max="50" size="small" />
+        <el-input-number v-model="form.lineWidth" controls-position="right" :min="0" :max="50" size="small" />
       </el-form-item>
       <el-form-item label="类型:" prop="type">
         <el-select v-model="form.classify" placeholder="请选择类型" size="small">
@@ -43,7 +43,10 @@
           </el-table-column>
         </el-table>
       </div>
-      <el-form-item v-if="!form.isGradual" label="线段颜色:" prop="fillColor">
+      <el-form-item v-if="!form.isGradual" label="线段填充色:" prop="fillColor">
+        <el-color-picker v-model="form.fillBackground" size="small" />
+      </el-form-item>
+      <el-form-item label="线段颜色:" prop="borderColor">
         <el-color-picker v-model="form.fillColor" size="small" />
       </el-form-item>
       <el-form-item label="箭头显示:" prop="arrowShow">
@@ -126,6 +129,7 @@ export default {
                 z2: 0,
                 lineWidth: '',
                 fillColor: '#fff',
+                fillBackground: '',
                 arrowShow: 'none',
                 arrowSize: 5,
                 points: [
@@ -141,7 +145,7 @@ export default {
                     { required: true, message: '请输入线段宽度', trigger: 'blur' }
                 ],
                 fillColor: [
-                    { required: true, message: '请输入线段颜色', trigger: 'blur' }
+                    { required: true, message: '请输入线段边框颜色', trigger: 'blur' }
                 ]
             }
         };
@@ -159,9 +163,10 @@ export default {
                 this.showDeleteButton = true;
                 this.isUpdate = true;
                 this.form.code = model.code;
-				this.form.z2 = model.z2||0;
+                this.form.z2 = model.z2 || 0;
                 this.form.lineWidth = model.lineWidth;
                 this.form.fillColor = model.fillColor;
+                this.form.fillBackground = model.fillBackground || '';
                 if (model.point1) {
                     this.form.points = [];
                     this.form.points.push(model.point1);
@@ -193,6 +198,7 @@ export default {
                         z2: this.form.z2,
                         lineWidth: this.form.lineWidth,
                         fillColor: this.form.fillColor,
+                        fillBackground: this.form.fillBackground,
                         classify: this.form.classify,
                         arrowShow: this.form.arrowShow,
                         arrowSize: this.form.arrowSize,
@@ -222,6 +228,7 @@ export default {
                 _type: 'IscsLine',
                 lineWidth: this.form.lineWidth,
                 fillColor: this.form.fillColor,
+                fillBackground: this.form.fillBackground,
                 classify: this.form.classify,
                 arrowShow: this.form.arrowShow,
                 arrowSize: this.form.arrowSize
@@ -236,6 +243,7 @@ export default {
                 code: '',
                 lineWidth: '',
                 fillColor: '#fff',
+                fillBackground: '',
                 arrowShow: 'none',
                 arrowSize: 5,
                 points: [

src/views/iscs/iscsDraw/icscComponents/picture.vue

@@ -78,7 +78,8 @@ export default {
                 { name: '排风机', value: 'exhaustFan' },
                 { name: '冷水机', value: 'waterCooler'},
                 { name: '顶部排风机', value: 'ventilationFan'},
-				{ name: '文字蓝色背景', value: 'textBgBluePoint'}
+                { name: '文字蓝色背景', value: 'textBgBluePoint'},
+                { name: '风井', value: 'kongzhixiang' }
             ],
 
             rules: {
@@ -149,7 +150,7 @@ export default {
                 _type: 'IscsPicture',
                 type: this.form.type,
                 size: this.form.size,
-				rotation: this.form.rotation,
+                rotation: this.form.rotation
             };
             this.$emit('deleteDataModel', rectModel);
         },