diff --git a/.env.staging b/.env.staging
index 6e00a4872..dbd2c9181 100644
--- a/.env.staging
+++ b/.env.staging
@@ -1,5 +1,5 @@
 # just a flag
-NODE_ENV = 'production'
+NODE_ENV = 'test'
 
 # base api
 VUE_APP_BASE_API = 'https://test.joylink.club/jlcloud'
diff --git a/src/iscs/shape/line.js b/src/iscs/shape/line.js
index 3b5fefb54..f97fe91f3 100644
--- a/src/iscs/shape/line.js
+++ b/src/iscs/shape/line.js
@@ -1,7 +1,8 @@
 import Group from 'zrender/src/container/Group';
-import Line from 'zrender/src/graphic/shape/Line';
+import Polyline from 'zrender/src/graphic/shape/Polyline';
 import Polygon from 'zrender/src/graphic/shape/Polygon';
 import JTriangle from '../utils/JTriangle';
+import zrender from 'zrender';
 
 export default class line extends Group {
     constructor(device) {
@@ -10,7 +11,12 @@ export default class line extends Group {
         this._type = device.model._type;
         this._code = device.model.code;
         this.zlevel = device.model.zlevel;
-        this.model.point = this.model.point1;
+        // this.model.point = this.model.points;
+        if (!this.model.points) {
+            this.model.points = [];
+            this.model.points.push(this.model.point1);
+            this.model.points.push(this.model.point2);
+        }
         this.z = device.model.z;
         this.create();
     }
@@ -18,21 +24,42 @@ export default class line extends Group {
         const model = this.model;
         this.grouper = new Group({
             id: model.code,
-            position: [model.point1.x, model.point1.y]
+            position: [model.points[0].x, model.points[0].y]
         });
-        this.iscsLine = new Line({
+        // 1101 垂直渐变 1110 水平渐变
+        let strokeColor = this.model.fillColor;
+        if (model.isGradual) {
+            const offsetList = [];
+            model.modelList.forEach(item => {
+                offsetList.push({
+                    offset: item.offset,
+                    color: item.color
+                });
+            });
+            if (model.gradualShow == 'level') {
+                strokeColor = new zrender.LinearGradient(1, 1, 0, 1, offsetList);
+            } else {
+                strokeColor = new zrender.LinearGradient(1, 1, 1, 0, offsetList);
+            }
+        }
+        const modelPoints = [];
+        model.points.forEach((item, index) => {
+            if (index == 0) {
+                modelPoints.push([0, 0]);
+            } else {
+                modelPoints.push([item.x - model.points[0].x, item.y - model.points[0].y]);
+            }
+        });
+        this.iscsLine = new Polyline({
             zlevel: model.zlevel,
             z: model.z,
             draggable: false,
             shape: {
-                x1: 0,
-                y1: 0,
-                x2: model.point2.x - model.point1.x,
-                y2: model.point2.y - model.point1.y
+                points: modelPoints
             },
             style: {
                 lineWidth: this.model.lineWidth,
-                stroke: this.model.fillColor
+                stroke: strokeColor
             }
         });
         if (model.classify == 'dashed') {
@@ -40,9 +67,9 @@ export default class line extends Group {
         }
 
         if (model.arrowShow == 'star') {
-            const traingle = new JTriangle(this.model.point1, this.model.point2);
+            const traingle = new JTriangle(this.model.points[0], this.model.points[1]);
             let rotation = Math.PI * 2 - Math.atan2(traingle.absy, traingle.absx) * traingle.drictx * traingle.dricty;
-            if (this.model.point1.x >= this.model.point2.x) {
+            if (this.model.points[0].x >= this.model.points[1].x) {
                 rotation += Math.PI;
             }
             this.arrows = new Polygon({
@@ -65,13 +92,13 @@ export default class line extends Group {
             });
             this.grouper.add(this.arrows);
         } else if (model.arrowShow == 'end') {
-            const traingle = new JTriangle(this.model.point2, this.model.point1);
+            const traingle = new JTriangle(this.model.points[this.model.points.length - 1], this.model.points[this.model.points.length - 2]);
             let rotation = Math.PI * 2 - Math.atan2(traingle.absy, traingle.absx) * traingle.drictx * traingle.dricty;
-            if (this.model.point1.x <= this.model.point2.x) {
+            if (this.model.points[this.model.points.length - 2].x <= this.model.points[this.model.points.length - 1].x) {
                 rotation += Math.PI;
             }
-            const x = model.point2.x - model.point1.x;
-            const y = model.point2.y - model.point1.y;
+            const x = model.points[this.model.points.length - 1].x - model.points[this.model.points.length - 2].x;
+            const y = model.points[this.model.points.length - 1].y - model.points[this.model.points.length - 2].y;
             this.arrows = new Polygon({
                 zlevel: model.zlevel,
                 z: model.z,
@@ -96,9 +123,9 @@ export default class line extends Group {
         this.add(this.grouper);
     }
     setModel(dx, dy) {
-        this.model.point1.x += dx;
-        this.model.point1.y += dy;
-        this.model.point2.x += dx;
-        this.model.point2.y += dy;
+        this.model.points.forEach(item => {
+            item.x += dx;
+            item.y += dy;
+        });
     }
 }
diff --git a/src/iscs/shape/text.js b/src/iscs/shape/text.js
index 151cd08df..4e5a3b0ee 100644
--- a/src/iscs/shape/text.js
+++ b/src/iscs/shape/text.js
@@ -31,10 +31,14 @@ export default class text extends Group {
                 text: model.context,
                 textStrokeWidth: model.textStrokeWidth,
                 textFill: model.textFill,
-                textAlign: model.textAlign,
+                textAlign: model.textAlign || 'center',
                 textPosition: model.textPosition || 'inside',
-                textVerticalAlign: model.textVerticalAlign || null,
-                textLineHeight: model.fontSize
+                textVerticalAlign: model.textVerticalAlign || 'middle',
+                textLineHeight: model.fontSize,
+                textBackgroundColor: model.gbColor || null,
+                textBorderColor: model.gbColorBorder || null,
+                textBorderWidth: model.gbWidth || null,
+                textPadding: [model.verticalPadding || 0, model.levelPadding || 0]
             }
         });
         this.grouper.add(this.textName);
diff --git a/src/views/iscs/iscsDesign/demonList.vue b/src/views/iscs/iscsDesign/demonList.vue
index a696e3aab..8c07b5216 100644
--- a/src/views/iscs/iscsDesign/demonList.vue
+++ b/src/views/iscs/iscsDesign/demonList.vue
@@ -99,6 +99,38 @@ export default {
                             }
                         ]
                     },
+                    {
+                        name: '环境与设备监控系统',
+                        mode: 'environment02',
+                        id: 'environment',
+                        type: 'totalSystem',
+                        children: [
+                            {
+                                name: '大系统',
+                                mode: 'environment02',
+                                id: 'environmentOne',
+                                type: 'interface'
+                            },
+                            {
+                                name: '冷水系统',
+                                mode: 'environment02',
+                                id: 'environmentTwo',
+                                type: 'interface'
+                            },
+                            {
+                                name: '隧道通风系统',
+                                mode: 'environment02',
+                                id: 'environmentThree',
+                                type: 'interface'
+                            },
+                            {
+                                name: '车站小系统1',
+                                mode: 'environment02',
+                                id: 'environmentFour',
+                                type: 'interface'
+                            }
+                        ]
+                    },
                     {
                         name: '自动售检票/门禁',
                         mode: 'afc02',
@@ -115,7 +147,15 @@ export default {
                                 name: '门禁系统',
                                 mode: 'afc02',
                                 id: 'entranceGuard',
-                                type: 'interface'
+                                type: 'system',
+                                children: [
+                                    {
+                                        name: '站厅层',
+                                        mode: 'afc02',
+                                        id: 'afcOne02',
+                                        type: 'interface'
+                                    }
+                                ]
                             }
                         ]
                     },
@@ -135,13 +175,65 @@ export default {
                                 name: '火灾报警系统-站厅层',
                                 mode: 'fas02',
                                 id: 'stationHall',
-                                type: 'interface'
+                                type: 'system',
+                                children: [
+                                    {
+                                        name: '站厅层',
+                                        mode: 'fas02',
+                                        id: 'stationHallOne',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '站厅层A端',
+                                        mode: 'fas02',
+                                        id: 'stationHallTwo',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '站厅层B端',
+                                        mode: 'fas02',
+                                        id: 'stationHallThree',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '站厅层公共区段',
+                                        mode: 'fas02',
+                                        id: 'stationHallFour',
+                                        type: 'interface'
+                                    }
+                                ]
                             },
                             {
                                 name: '火灾报警系统-站台层',
                                 mode: 'fas02',
                                 id: 'platform',
-                                type: 'interface'
+                                type: 'system',
+                                children: [
+                                    {
+                                        name: '站台层',
+                                        mode: 'fas02',
+                                        id: 'platformOne',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '站台层A端',
+                                        mode: 'fas02',
+                                        id: 'platformTwo',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '站台层B端',
+                                        mode: 'fas02',
+                                        id: 'platformThree',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '站台层公共区段',
+                                        mode: 'fas02',
+                                        id: 'platformFour',
+                                        type: 'interface'
+                                    }
+                                ]
                             },
                             {
                                 name: '火灾报警系统-区间',
@@ -169,18 +261,20 @@ export default {
                         id: 'signalSystem',
                         type: 'totalSystem',
                         children: [
-                            {
-                                name: 'TIS管理器',
-                                mode: 'signalSystem02',
-                                id: 'tis',
-                                type: 'interface'
-                            },
-                            {
-                                name: '列车时刻表',
-                                mode: 'signalSystem02',
-                                id: 'schedule',
-                                type: 'interface'
-                            },
+                            // 暂时没有 系统界面 介绍
+                            // {
+                            //     name: 'TIS管理器',
+                            //     mode: 'signalSystem02',
+                            //     id: 'tis',
+                            //     type: 'interface'
+                            // },
+                            // {
+                            //     name: '列车时刻表',
+                            //     mode: 'signalSystem02',
+                            //     id: 'schedule',
+                            //     type: 'interface'
+                            // },
+                            // 这两个内容 不清晰
                             {
                                 name: '信号系统',
                                 mode: 'signalSystem02',
@@ -195,29 +289,82 @@ export default {
                             }
                         ]
                     },
+                    {
+                        name: '屏蔽门系统',
+                        mode: 'psdSystem02',
+                        id: 'signalSystem',
+                        type: 'totalSystem',
+                        children: [
+                            {
+                                name: '屏蔽门系统',
+                                mode: 'psdSystem02',
+                                id: 'psdOne',
+                                type: 'interface'
+                            }
+                        ]
+                    },
                     {
                         name: '通信',
                         mode: 'communication02',
                         id: 'communication',
                         type: 'totalSystem',
                         children: [
-                            {
-                                name: '乘客信息显示系统',
-                                mode: 'communication02',
-                                id: 'pis',
-                                type: 'interface'
-                            },
-                            {
-                                name: '广播系统',
-                                mode: 'communication02',
-                                id: 'broadcasting',
-                                type: 'interface'
-                            },
+                            // 不用画图
+                            // {
+                            //     name: '乘客信息显示系统',
+                            //     mode: 'communication02',
+                            //     id: 'pis',
+                            //     type: 'system',
+                            //     children: [
+
+                            //     ]
+                            // },
+                            // {
+                            //     name: '广播系统',
+                            //     mode: 'communication02',
+                            //     id: 'broadcasting',
+                            //     type: 'system',
+                            //     children: [
+
+                            //     ]
+                            // },
                             {
                                 name: '闭路电视',
                                 mode: 'communication02',
                                 id: 'cctv',
-                                type: 'interface'
+                                type: 'system',
+                                children:[
+                                    {
+                                        name: '站厅',
+                                        mode: 'communication02',
+                                        id: 'basOne',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '上行站台',
+                                        mode: 'communication02',
+                                        id: 'basTwo',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '下行站台',
+                                        mode: 'communication02',
+                                        id: 'basThree',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '地下一层',
+                                        mode: 'communication02',
+                                        id: 'basFour',
+                                        type: 'interface'
+                                    },
+                                    {
+                                        name: '地下二层',
+                                        mode: 'communication02',
+                                        id: 'basFive',
+                                        type: 'interface'
+                                    }
+                                ]
                             }
                         ]
                     }],
diff --git a/src/views/iscs/iscsDraw/icscComponents/line.vue b/src/views/iscs/iscsDraw/icscComponents/line.vue
index 89a2d99ba..03edcef20 100644
--- a/src/views/iscs/iscsDraw/icscComponents/line.vue
+++ b/src/views/iscs/iscsDraw/icscComponents/line.vue
@@ -1,6 +1,6 @@
 <template>
   <div style="overflow-y: scroll;height: calc(100% - 46px); width: 100%;">
-    <el-form ref="form" :rules="rules" :model="form" label-width="100px" style="width: 100%;padding: 10px 50px;">
+    <el-form ref="form" :rules="rules" :model="form" label-width="100px" style="width: 100%;padding: 10px 20px;">
       <el-form-item label="线段宽度:" prop="lineWidth">
         <el-input-number v-model="form.lineWidth" controls-position="right" :min="1" :max="50" size="small" />
       </el-form-item>
@@ -10,7 +10,37 @@
           <el-option label="虚线:" value="dashed" />
         </el-select>
       </el-form-item>
-      <el-form-item label="线段颜色:" prop="fillColor">
+      <el-form-item label="是否渐变:">
+        <el-checkbox v-model="form.isGradual" size="small" />
+      </el-form-item>
+      <el-form-item v-if="form.isGradual" label="渐变方向:">
+        <el-select v-model="form.gradualShow" placeholder="请选择" size="small">
+          <el-option label="水平渐变" value="level" />
+          <el-option label="垂直渐变" value="vertical" />
+        </el-select>
+      </el-form-item>
+      <div v-if="form.isGradual" style="position: relative;">
+        <div class="title-gradual">渐变颜色:</div>
+        <el-button icon="el-icon-plus" circle size="small" style="position: absolute; right: 50px; top: 10px; z-index: 10;" @click="addModelList" />
+        <el-table :data="form.modelList" style="width: 100%; margin-bottom: 20px;">
+          <el-table-column label="偏移值" width="160">
+            <template slot-scope="scope">
+              <el-input-number v-model="scope.row.offset" size="mini" :min="0" :max="1" :step="0.1" />
+            </template>
+          </el-table-column>
+          <el-table-column label="颜色">
+            <template slot-scope="scope">
+              <el-color-picker v-model="scope.row.color" size="small" />
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" width="80">
+            <template slot-scope="scope">
+              <el-button size="mini" type="text" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <el-form-item v-if="!form.isGradual" label="线段颜色:" prop="fillColor">
         <el-color-picker v-model="form.fillColor" size="small" />
       </el-form-item>
       <el-form-item label="箭头显示:" prop="arrowShow">
@@ -23,24 +53,57 @@
       <el-form-item v-if="form.arrowShow != 'none'" label="箭头大小:" prop="arrowSize">
         <el-input-number v-model="form.arrowSize" controls-position="right" :min="1" size="small" />
       </el-form-item>
-      <el-form-item label="起始X轴坐标:">
-        <el-input-number v-model="form.x1" controls-position="right" :min="0" size="small" />
-      </el-form-item>
-      <el-form-item label="起始Y轴坐标:">
-        <el-input-number v-model="form.y1" controls-position="right" :min="0" size="small" />
-      </el-form-item>
-      <el-form-item label="终止X轴坐标:">
-        <el-input-number v-model="form.x2" controls-position="right" :min="0" size="small" />
-      </el-form-item>
-      <el-form-item label="终止Y轴坐标:">
-        <el-input-number v-model="form.y2" controls-position="right" :min="0" size="small" />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" size="small" @click="onSubmit('form')">{{ buttonText }}</el-button>
-        <el-button v-show="showDeleteButton" size="small" type="danger" @click="deleteDevice">删除</el-button>
-        <el-button v-show="showDeleteButton" size="small" @click="initPage">取消</el-button>
-      </el-form-item>
-    </el-form>
+      <div class="coordinate">
+        <div class="titles" style="width: 88px">坐标点</div>
+        <div class="point-section">
+          <template v-for="(point, j) in form.points">
+            <div :key="j" style="overflow: hidden;">
+              <span style="display: table; margin-right: 3px; font-size: 14px; float: left; line-height: 28px;" :style="{'margin-right': j == 0 || j == form.points.length - 1 ? '9px' : '5px'}">{{ j == 0 ? '起 点' : j == form.points.length - 1 ? '终 点' : `中点${j}` }}</span>
+              <el-form-item
+                label=""
+                :prop="'points[' + j + '].x'"
+                style="display: table; float: left;"
+                label-width="0px"
+              >
+                <el-input-number v-model="point.x" size="small" />
+              </el-form-item>
+              <span
+                style="display: table; margin-left: 8px; float: left; line-height: 28px;"
+              >
+                , </span>
+              <el-form-item
+                label=""
+                :prop="'points[' + j + '].y'"
+                style="display: table; float: left; margin-right: 5px;"
+                label-width="4px"
+              >
+                <el-input-number v-model="point.y" size="small" />
+              </el-form-item>
+              <el-button
+                icon="el-icon-plus"
+                circle
+                size="small"
+                class="point-button"
+                @click="addPoint(j)"
+              />
+              <el-button
+                icon="el-icon-minus"
+                :disabled="j == 0 || j == form.points.length - 1"
+                circle
+                size="small"
+                class="point-button"
+                style="margin-left: 4px;"
+                @click="delPoint(j)"
+              />
+            </div>
+          </template>
+        </div>
+        <el-form-item>
+          <el-button type="primary" size="small" @click="onSubmit('form')">{{ buttonText }}</el-button>
+          <el-button v-show="showDeleteButton" size="small" type="danger" @click="deleteDevice">删除</el-button>
+          <el-button v-show="showDeleteButton" size="small" @click="initPage">取消</el-button>
+        </el-form-item>
+      </div></el-form>
   </div>
 </template>
 
@@ -61,10 +124,13 @@ export default {
                 fillColor: '#fff',
                 arrowShow: 'none',
                 arrowSize: 5,
-                x1: 10,
-                y1: 10,
-                x2: 20,
-                y2: 10
+                points: [
+                    { x: 10, y: 10 },
+                    { x: 20, y: 10 }
+                ],
+                isGradual: false,
+                modelList: [],
+                gradualShow: 'level'
             },
             rules: {
                 lineWidth: [
@@ -91,13 +157,22 @@ export default {
                 this.form.code = model.code;
                 this.form.lineWidth = model.lineWidth;
                 this.form.fillColor = model.fillColor;
-                this.form.x1 = model.point1.x;
-                this.form.y1 = model.point1.y;
-                this.form.x2 = model.point2.x;
-                this.form.y2 = model.point2.y;
+                if (model.point1) {
+                    this.form.points = [];
+                    this.form.points.push(model.point1);
+                    this.form.points.push(model.point2);
+                } else {
+                    this.form.points = model.points || [
+                        { x: 10, y: 10 },
+                        { x: 20, y: 10 }
+                    ];
+                }
                 this.form.classify = model.classify;
                 this.form.arrowShow = model.arrowShow || 'none';
                 this.form.arrowSize = model.arrowSize || 5;
+                this.form.isGradual = model.isGradual || false;
+                this.form.modelList = model.modelList || [];
+                this.form.gradualShow = model.gradualShow || 'level';
             }
         }
     },
@@ -107,24 +182,29 @@ export default {
             this.$refs[form].validate((valid) => {
                 if (valid) {
                     const lineModel = {
-                        point1: {
-                            x: this.form.x1,
-                            y: this.form.y1
-                        },
-                        point2: {
-                            x: this.form.x2,
-                            y: this.form.y2
-                        },
+                        points: this.form.points,
                         code: this.isUpdate ? this.form.code : getUID('IscsLine', this.iscs.iscsLineList),
                         _type: 'IscsLine',
                         lineWidth: this.form.lineWidth,
                         fillColor: this.form.fillColor,
                         classify: this.form.classify,
                         arrowShow: this.form.arrowShow,
-                        arrowSize: this.form.arrowSize
+                        arrowSize: this.form.arrowSize,
+                        modelList: this.form.modelList,
+                        isGradual: this.form.isGradual,
+                        gradualShow: this.form.gradualShow
                     };
-                    this.$emit('createDataModel', lineModel);
-                    this.initPage();
+                    if (this.form.isGradual) {
+                        if (this.form.modelList.length) {
+                            this.$emit('createDataModel', lineModel);
+                            this.initPage();
+                        } else {
+                            this.$message.error('渐变列表不能为空');
+                        }
+                    } else {
+                        this.$emit('createDataModel', lineModel);
+                        this.initPage();
+                    }
                 } else {
                     return false;
                 }
@@ -132,14 +212,6 @@ export default {
         },
         deleteDevice() {
             const lineModel = {
-                point1: {
-                    x: this.form.x1,
-                    y: this.form.y1
-                },
-                point2: {
-                    x: this.form.x2,
-                    y: this.form.y2
-                },
                 code: this.form.code,
                 _type: 'IscsLine',
                 lineWidth: this.form.lineWidth,
@@ -160,16 +232,73 @@ export default {
                 fillColor: '#fff',
                 arrowShow: 'none',
                 arrowSize: 5,
-                x1: 10,
-                y1: 10,
-                x2: 20,
-                y2: 10,
-                classify:'solid'
+                points: [
+                    { x: 10, y: 10 },
+                    { x: 20, y: 10 }
+                ],
+                classify:'solid',
+                isGradual: false,
+                modelList: [],
+                gradualShow: 'level'
             };
+        },
+        addModelList() {
+            const param = {
+                offset: '',
+                color: ''
+            };
+            this.form.modelList.push(param);
+        },
+        handleDelete(index, row) { // 删除创建表格元素
+            this.form.modelList.splice(index, 1);
+        },
+        addPoint(index) {
+            const data = { x: 0, y: 0 };
+            this.form.points.splice(index + 1, 0, data);
+        },
+        delPoint(index) {
+            this.form.points.splice(index, 1);
         }
     }
 };
 </script>
 <style rel="stylesheet/scss" lang="scss" scoped>
+.title-gradual{
+	width: 100px;
+	text-align: right;
+    vertical-align: middle;
+    float: left;
+    font-size: 14px;
+    color: #606266;
+    line-height: 40px;
+    padding: 0 12px 0 0;
+    box-sizing: border-box;
+	font-weight: 700;
+}
+.coordinate {
+	overflow: hidden;
 
+	.titles {
+		text-align: right;
+		font-size: 14px;
+		color: #606266;
+		line-height: 40px;
+		-webkit-box-sizing: border-box;
+		box-sizing: border-box;
+		line-height: 28px;
+		width: 120px;
+		font-weight: bold;
+		display: block;
+		// float: left;
+		margin-right: 7px;
+	}
+	.listWidth{
+		display: table;
+		float: left;
+		margin-right: 20px;
+		&:last-child{
+			margin: 0;
+		}
+	}
+}
 </style>
diff --git a/src/views/iscs/iscsDraw/icscComponents/text.vue b/src/views/iscs/iscsDraw/icscComponents/text.vue
index 4bc17d3b9..354550bc6 100644
--- a/src/views/iscs/iscsDraw/icscComponents/text.vue
+++ b/src/views/iscs/iscsDraw/icscComponents/text.vue
@@ -19,6 +19,21 @@
       <el-form-item label="Y轴坐标:">
         <el-input-number v-model="form.y" controls-position="right" :min="1" size="small" />
       </el-form-item>
+      <el-form-item label="背景颜色:">
+        <el-color-picker v-model="form.gbColor" size="small" />
+      </el-form-item>
+      <el-form-item label="背景描边颜色:">
+        <el-color-picker v-model="form.gbColorBorder" size="small" />
+      </el-form-item>
+      <el-form-item label="背景描边宽度:">
+        <el-input-number v-model="form.gbWidth" size="small" controls-position="right" :min="0" />
+      </el-form-item>
+      <el-form-item label="左右内距:" prop="levelPadding">
+        <el-input-number v-model="form.levelPadding" size="small" controls-position="right" :min="0" />
+      </el-form-item>
+      <el-form-item label="上下内距:" prop="verticalPadding">
+        <el-input-number v-model="form.verticalPadding" size="small" controls-position="right" :min="0" />
+      </el-form-item>
       <el-form-item>
         <el-button type="primary" size="small" @click="onSubmit('form')">{{ buttonText }}</el-button>
         <el-button v-show="showDeleteButton" size="small" type="danger" @click="deleteDevice">删除</el-button>
@@ -47,7 +62,12 @@ export default {
                 fontSize: 14,
                 fontWeight: 450,
                 x: 10,
-                y: 10
+                y: 10,
+                gbColor: '',
+                gbColorBorder: '',
+                gbWidth: '',
+                levelPadding: 0,
+                verticalPadding: 0
             },
             rules: {
                 code: [
@@ -64,6 +84,12 @@ export default {
                 ],
                 fontWeight: [
                     { required: true, message: '请输入文字粗细', trigger: 'blur' }
+                ],
+                levelPadding: [
+                    { required: true, message: '请输入文字间距', trigger: 'blur' }
+                ],
+                verticalPadding: [
+                    { required: true, message: '请输入文字间距', trigger: 'blur' }
                 ]
             }
         };
@@ -87,6 +113,11 @@ export default {
                 this.form.textFill = model.textFill;
                 this.form.x = model.point.x;
                 this.form.y = model.point.y;
+                this.form.gbColor = model.gbColor;
+                this.form.gbColorBorder = model.gbColorBorder;
+                this.form.gbWidth = model.gbWidth;
+                this.form.levelPadding = model.levelPadding;
+                this.form.verticalPadding = model.verticalPadding;
             }
         }
     },
@@ -106,7 +137,12 @@ export default {
                         textFill: this.form.textFill,
                         fontSize: this.form.fontSize,
                         fontWeight: this.form.fontWeight,
-                        fontFamily: 'consolas'
+                        fontFamily: 'consolas',
+                        gbColor: this.form.gbColor,
+                        gbColorBorder: this.form.gbColorBorder,
+                        gbWidth: this.form.gbWidth,
+                        levelPadding: this.form.levelPadding,
+                        verticalPadding: this.form.verticalPadding
                     };
                     this.$emit('createDataModel', textModel);
                     this.initPage();
@@ -142,7 +178,12 @@ export default {
                 fontSize: 14,
                 fontWeight: 450,
                 x: 10,
-                y: 10
+                y: 10,
+                gbColor: '',
+                gbColorBorder: '',
+                gbWidth: '',
+                levelPadding: 0,
+                verticalPadding: 0
             };
         }
     }
diff --git a/src/views/iscs/iscsDraw/index.vue b/src/views/iscs/iscsDraw/index.vue
index 5fa79cb6e..ec8df6585 100644
--- a/src/views/iscs/iscsDraw/index.vue
+++ b/src/views/iscs/iscsDraw/index.vue
@@ -18,6 +18,8 @@
         <iscs-fire-alarm v-else-if="iscsMode==='fas02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" />  <!-- 火灾报警系统 -->
         <iscs-power-monitoring v-else-if="iscsMode==='powerMonitoring02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" />  <!-- 电力监控系统 -->
         <iscs-signal-system v-else-if="iscsMode==='signalSystem02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" />  <!-- 信号系统 -->
+        <iscs-environment v-else-if="iscsMode=='environment02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" /> <!-- 环境与设备监控系统 -->
+        <iscs-psd v-else-if="iscsMode=='psdSystem02'" ref="" @iscsChange="iscsChange" @handleSave="handleSave" /> <!-- 屏蔽门系统 -->
       </div>
     </div>
   </transition>
@@ -38,6 +40,8 @@ import IscsCommunication from './iscsCommunication/index';
 import IscsFireAlarm from './iscsFireAlarm/index';
 import IscsPowerMonitoring from './iscsPowerMonitoring/index';
 import IscsSignalSystem from './iscsSignalSystem/index';
+import IscsPsd from './iscsPsd/index';
+import IscsEnvironment from './iscsEnvironment/index';
 
 import { saveIscsElement } from '@/api/iscs';
 
@@ -57,7 +61,9 @@ export default {
         IscsCommunication,
         IscsFireAlarm,
         IscsPowerMonitoring,
-        IscsSignalSystem
+        IscsSignalSystem,
+        IscsPsd,
+        IscsEnvironment
     },
     data() {
         return {
diff --git a/src/views/iscs/iscsDraw/iscsEnvironment/index.vue b/src/views/iscs/iscsDraw/iscsEnvironment/index.vue
new file mode 100644
index 000000000..89a9cf455
--- /dev/null
+++ b/src/views/iscs/iscsDraw/iscsEnvironment/index.vue
@@ -0,0 +1,174 @@
+<template>
+  <transition name="el-zoom-in-center">
+    <div class="map-control heightClass ">
+      <el-card type="border-card" class="heightClass">
+        <div slot="header" class="clearfix">
+          <el-button
+            type="text"
+            style="float: right; padding: 3px 0; margin-right: 5px;"
+            @click="handleSave"
+          >{{ $t('ibp.save') }}</el-button>
+        </div>
+        <el-tabs v-model="enabledTab" class="mapEdit" type="card" @tab-click="handleTabClick">
+          <el-tab-pane label="按钮" name="IscsButton">
+            <iscs-button
+              ref="iscsButton"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+          <el-tab-pane label="文字" name="IscsText">
+            <iscs-text
+              ref="iscsText"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+          <el-tab-pane label="线段" name="IscsLine">
+            <iscs-line
+              ref="iscsLine"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+          <el-tab-pane label="矩形" name="IscsRect">
+            <iscs-rect
+              ref="iscsRect"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+        </el-tabs>
+      </el-card>
+    </div>
+  </transition>
+</template>
+<script>
+import {deviceFactory} from '@/iscs/utils/parser';
+import IscsLine from '../icscComponents/line';
+import IscsText from '../icscComponents/text';
+import IscsRect from '../icscComponents/rect';
+import IscsButton from '../icscComponents/button';
+
+export default {
+    name: 'IscsOperate',
+    components: {
+        IscsRect,
+        IscsLine,
+        IscsText,
+        IscsButton
+    },
+    mixins: [
+    ],
+    data() {
+        return {
+            enabledTab: 'PlatformScreenDoor',
+            data: '',
+            stationCode: ''
+        };
+    },
+    computed: {
+        height() {
+            return this.$store.state.config.height;
+        }
+    },
+    watch: {
+        '$store.state.iscs.rightClickCount': function (val) {
+            const model = this.$store.getters['iscs/updateDeviceData'];
+            this.enabledTab = model._type;
+        }
+    },
+    mounted() {
+        this.$emit('iscsChange', this.$route.params.id);
+    },
+    beforeDestroy() {
+
+    },
+    methods: {
+        createDataModel(model) {
+            const newModel = deviceFactory(model._type, model);
+            this.$store.dispatch('iscs/updateIscsDevices', newModel.model);
+        },
+        deleteDataModel(model) {
+            this.$store.dispatch('iscs/deleteIscsDevices', model);
+        },
+        handleSave() {
+            const data = JSON.stringify(this.$store.state.iscs.iscs);
+            console.log(data);
+            this.$emit('handleSave', data);
+        },
+        handleTabClick() {
+
+        }
+    }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+    @import "src/styles/mixin.scss";
+	.map-control {
+		float: right;
+		width: 100%;
+		height: 100%;
+		.border-card{
+			height: 100%;
+		}
+	}
+	.mapEdit{
+		height: calc(100% - 47px);
+		.tab_pane_box{
+			height: 100%;
+		}
+	}
+	/deep/ .el-card__body{
+		height:100%;
+	}
+	/deep/ {
+		.mapEdit .el-tabs__nav-wrap.is-scrollable  {
+			padding: 0 20px;
+		}
+		.mapEdit .el-tabs__header .el-tabs__item.is-active {
+			border-bottom-color: #f5f7fa;
+			background: #f5f7fa;
+		}
+		.mapEdit .el-tabs__active-bar{
+			background: transparent;
+		}
+		.mapEdit .el-tabs__content {
+			height: calc(100% - 56px);
+		}
+		.mapEdit .el-tab-pane {
+			height: 100%;
+		}
+		.card .el-tabs__nav .el-tabs__item.is-active {
+			border-bottom: 2px solid #E4E7ED;
+			background: #409eff;
+			color: #fff;
+		}
+		.card .el-tabs__nav .el-tabs__item{
+			padding: 0 20px!important;
+		}
+
+		.mapEdit .el-tabs__nav-prev {
+			width: 20px;
+			height: 41px;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			box-shadow: 1px 1px 4px #ccc;
+		}
+
+		.mapEdit .el-tabs__nav-next {
+			width: 20px;
+			height: 41px;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			box-shadow: 1px 1px 4px #ccc;
+		}
+	}
+    .heightClass{height:100%;}
+</style>
diff --git a/src/views/iscs/iscsDraw/iscsPsd/index.vue b/src/views/iscs/iscsDraw/iscsPsd/index.vue
new file mode 100644
index 000000000..89a9cf455
--- /dev/null
+++ b/src/views/iscs/iscsDraw/iscsPsd/index.vue
@@ -0,0 +1,174 @@
+<template>
+  <transition name="el-zoom-in-center">
+    <div class="map-control heightClass ">
+      <el-card type="border-card" class="heightClass">
+        <div slot="header" class="clearfix">
+          <el-button
+            type="text"
+            style="float: right; padding: 3px 0; margin-right: 5px;"
+            @click="handleSave"
+          >{{ $t('ibp.save') }}</el-button>
+        </div>
+        <el-tabs v-model="enabledTab" class="mapEdit" type="card" @tab-click="handleTabClick">
+          <el-tab-pane label="按钮" name="IscsButton">
+            <iscs-button
+              ref="iscsButton"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+          <el-tab-pane label="文字" name="IscsText">
+            <iscs-text
+              ref="iscsText"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+          <el-tab-pane label="线段" name="IscsLine">
+            <iscs-line
+              ref="iscsLine"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+          <el-tab-pane label="矩形" name="IscsRect">
+            <iscs-rect
+              ref="iscsRect"
+              style="width: 100%;height: 100%;"
+              @createDataModel="createDataModel"
+              @deleteDataModel="deleteDataModel"
+            />
+          </el-tab-pane>
+        </el-tabs>
+      </el-card>
+    </div>
+  </transition>
+</template>
+<script>
+import {deviceFactory} from '@/iscs/utils/parser';
+import IscsLine from '../icscComponents/line';
+import IscsText from '../icscComponents/text';
+import IscsRect from '../icscComponents/rect';
+import IscsButton from '../icscComponents/button';
+
+export default {
+    name: 'IscsOperate',
+    components: {
+        IscsRect,
+        IscsLine,
+        IscsText,
+        IscsButton
+    },
+    mixins: [
+    ],
+    data() {
+        return {
+            enabledTab: 'PlatformScreenDoor',
+            data: '',
+            stationCode: ''
+        };
+    },
+    computed: {
+        height() {
+            return this.$store.state.config.height;
+        }
+    },
+    watch: {
+        '$store.state.iscs.rightClickCount': function (val) {
+            const model = this.$store.getters['iscs/updateDeviceData'];
+            this.enabledTab = model._type;
+        }
+    },
+    mounted() {
+        this.$emit('iscsChange', this.$route.params.id);
+    },
+    beforeDestroy() {
+
+    },
+    methods: {
+        createDataModel(model) {
+            const newModel = deviceFactory(model._type, model);
+            this.$store.dispatch('iscs/updateIscsDevices', newModel.model);
+        },
+        deleteDataModel(model) {
+            this.$store.dispatch('iscs/deleteIscsDevices', model);
+        },
+        handleSave() {
+            const data = JSON.stringify(this.$store.state.iscs.iscs);
+            console.log(data);
+            this.$emit('handleSave', data);
+        },
+        handleTabClick() {
+
+        }
+    }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+    @import "src/styles/mixin.scss";
+	.map-control {
+		float: right;
+		width: 100%;
+		height: 100%;
+		.border-card{
+			height: 100%;
+		}
+	}
+	.mapEdit{
+		height: calc(100% - 47px);
+		.tab_pane_box{
+			height: 100%;
+		}
+	}
+	/deep/ .el-card__body{
+		height:100%;
+	}
+	/deep/ {
+		.mapEdit .el-tabs__nav-wrap.is-scrollable  {
+			padding: 0 20px;
+		}
+		.mapEdit .el-tabs__header .el-tabs__item.is-active {
+			border-bottom-color: #f5f7fa;
+			background: #f5f7fa;
+		}
+		.mapEdit .el-tabs__active-bar{
+			background: transparent;
+		}
+		.mapEdit .el-tabs__content {
+			height: calc(100% - 56px);
+		}
+		.mapEdit .el-tab-pane {
+			height: 100%;
+		}
+		.card .el-tabs__nav .el-tabs__item.is-active {
+			border-bottom: 2px solid #E4E7ED;
+			background: #409eff;
+			color: #fff;
+		}
+		.card .el-tabs__nav .el-tabs__item{
+			padding: 0 20px!important;
+		}
+
+		.mapEdit .el-tabs__nav-prev {
+			width: 20px;
+			height: 41px;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			box-shadow: 1px 1px 4px #ccc;
+		}
+
+		.mapEdit .el-tabs__nav-next {
+			width: 20px;
+			height: 41px;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			box-shadow: 1px 1px 4px #ccc;
+		}
+	}
+    .heightClass{height:100%;}
+</style>