From 4b67f81cf0787773fc823b4c49fea12d7cf7f21c Mon Sep 17 00:00:00 2001
From: fan <18706759286@163.com>
Date: Tue, 9 Jun 2020 14:39:32 +0800
Subject: [PATCH] =?UTF-8?q?iscs=20=E5=B0=8F=E7=B3=BB=E7=BB=9F=E6=A8=A1?=
 =?UTF-8?q?=E5=BC=8F=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/baseUrl.js                          |   4 +-
 .../iscs/iscsSystem/config/bas/controlBAS.vue | 636 +-----------------
 .../bas/controlChild/bigSystemTable.vue       | 221 ++++++
 .../config/bas/controlChild/modeType.vue      | 154 +++++
 .../bas/controlChild/smallSystem1Table.vue    | 320 +++++++++
 .../bas/controlChild/smallSystem2Table.vue    | 315 +++++++++
 .../config/bas/controlChild/ventilation.vue   | 286 ++++++++
 .../config/bas/controlChild/ventilation1.vue  | 308 +++++++++
 .../config/bas/controlChild/ventilation2.vue  | 249 +++++++
 9 files changed, 1884 insertions(+), 609 deletions(-)
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/bigSystemTable.vue
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/modeType.vue
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem1Table.vue
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem2Table.vue
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/ventilation.vue
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/ventilation1.vue
 create mode 100644 src/views/iscs/iscsSystem/config/bas/controlChild/ventilation2.vue

diff --git a/src/utils/baseUrl.js b/src/utils/baseUrl.js
index 778caeb7b..836771751 100644
--- a/src/utils/baseUrl.js
+++ b/src/utils/baseUrl.js
@@ -2,11 +2,11 @@ export function getBaseUrl() {
     let BASE_API;
     if (process.env.NODE_ENV === 'development') {
         // BASE_API = 'https://joylink.club/jlcloud';
-        BASE_API = 'https://test.joylink.club/jlcloud';
+        // BASE_API = 'https://test.joylink.club/jlcloud';
         // BASE_API = 'http://192.168.3.5:9000'; // 袁琪
         // BASE_API = 'http://192.168.3.6:9000'; // 旭强
         // BASE_API = 'http://192.168.3.41:9000'; // 张赛
-        // BASE_API = 'http://192.168.3.82:9000'; // 杜康
+        BASE_API = 'http://192.168.3.82:9000'; // 杜康
         // BASE_API = 'http://b29z135112.zicp.vip';
         // BASE_API = 'http://2925963m2a.zicp.vip'; // 杜康
         // BASE_API = 'http://2i38984j47.qicp.vip'; // 张赛
diff --git a/src/views/iscs/iscsSystem/config/bas/controlBAS.vue b/src/views/iscs/iscsSystem/config/bas/controlBAS.vue
index f52cde379..aaf69e419 100644
--- a/src/views/iscs/iscsSystem/config/bas/controlBAS.vue
+++ b/src/views/iscs/iscsSystem/config/bas/controlBAS.vue
@@ -2,247 +2,12 @@
   <div class="control-bas-box">
     <div class="title-name">{{ $route.query.stationName + modeName }}</div>
     <div class="control-bas">
-      <el-table v-if="mode==='bigSystem'" ref="table1" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyle" :span-method="objectSpanMethod" style="float: left;">
-        <el-table-column label="日期" width="300">
-          <template slot="header">
-            <div class="title-0">全年运行工况</div>
-            <div class="title-0">运行模式号</div>
-            <div class="title-0">模式状态</div>
-            <div class="title-0">火灾指示灯:</div>
-          </template>
-          <template slot-scope="scope">
-            <div v-if="scope.$index == 0" class="table-0-top">
-              <div class="left">
-                <div>正常</div>
-                <div>运行</div>
-              </div>
-              <div class="right">
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">小新风空调</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(1)">全新风空调</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(2)">非空调季节</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(3)">冬季模式</div>
-              </div>
-            </div>
-            <div v-if="scope.$index == 4" class="table-4-top">
-              <div class="left">
-                <div>火灾</div>
-                <div>模式</div>
-              </div>
-              <div class="right">
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">站厅公共区火灾</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">站台公共区火灾</div>
-              </div>
-              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(6)">非火灾工况突发事件</div>
-              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(7)">全停模式</div>
-            </div>
-            <div v-if="scope.$index == 8" class="table-8-top">设备实际运行状态</div>
-            <div v-if="scope.$index == 9" class="table-9-top">状态比较</div>
-          </template>
-        </el-table-column>
-        <el-table-column prop="code" width="120">
-          <template slot="header">
-            <div style="width: 100%">模式</div>
-            <div style="width: 100%">编号</div>
-          </template>
-        </el-table-column>
-        <el-table-column label="大系统模式表">
-          <el-table-column label="新风机">
-            <el-table-column prop="faf1" label="FAF-1" width="120" />
-            <el-table-column prop="faf2" label="FAF-2" width="120" />
-          </el-table-column>
-          <el-table-column label="组合式空调器">
-            <el-table-column prop="ahu1" label="AHU-1" width="120" />
-            <el-table-column prop="ahu2" label="AHU-2" width="120" />
-          </el-table-column>
-          <el-table-column label="回排风机">
-            <el-table-column prop="raf1" label="RAF/SEF-1" width="120" />
-            <el-table-column prop="raf2" label="RAF/SEF-2" width="120" />
-          </el-table-column>
-          <el-table-column label="风机1">
-            <el-table-column prop="md1" label="MD-1" width="120" />
-            <el-table-column prop="md1" label="MD-2" width="120" />
-            <el-table-column prop="md1" label="MD-3" width="120" />
-            <el-table-column prop="md1" label="MD-4" width="120" />
-            <el-table-column prop="md1" label="MD-5" width="120" />
-            <el-table-column prop="md1" label="MD-6" width="120" />
-            <el-table-column prop="md1" label="MD-7" width="120" />
-            <el-table-column prop="md1" label="MD-8" width="120" />
-            <el-table-column prop="md1" label="MD-9" width="120" />
-            <el-table-column prop="md1" label="MD-10" width="120" />
-            <el-table-column prop="md1" label="MD-11" width="120" />
-            <el-table-column prop="md1" label="MD-12" width="120" />
-            <el-table-column prop="md1" label="MD-13" width="120" />
-          </el-table-column>
-        </el-table-column>
-      </el-table>
-      <el-table v-else-if="mode === 'smallSystem1'" ref="table2" :data="tableData1" :header-row-style="tableTitleStyle" :cell-style="rowStyle" :span-method="objectSpanMethod1" style="float: left;">
-        <el-table-column type="index" width="20" class-name="index-column">
-          <template slot="header">
-            <div style="width: 100%;height: 26px;background: #FFF" />
-            <div class="index-column-cell">1</div>
-            <div class="index-column-cell">2</div>
-            <div class="index-column-cell">3</div>
-          </template>
-          <template slot-scope="scope">
-            <div class="index-column-cell">{{ scope.$index + 4 }}</div>
-          </template>
-        </el-table-column>
-        <el-table-column width="300">
-          <template slot="header">
-            <div style="font-size: 0;text-align: center;">
-              <div class="index-row-cell">1</div>
-              <div class="index-row-cell">2</div>
-              <div class="index-row-cell">3</div>
-            </div>
-            <div class="title-0">全年运行工况</div>
-            <div class="title-0">运行模式号</div>
-            <div class="title-0">模式状态</div>
-            <div class="title-0">火灾指示灯:</div>
-          </template>
-          <template slot-scope="scope">
-            <div v-if="scope.$index == 0" class="table-0-top">
-              <div class="left" style="width: 100px;">
-                <div>正</div>
-                <div>常</div>
-                <div>运</div>
-                <div>行</div>
-              </div>
-              <div class="right" style="width: 195px;">
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">小新风空调</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(1)">小新风空调</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(2)">非空调工况</div>
-                <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(3)">35KV开关柜室事故排风</div>
-              </div>
-            </div>
-            <div v-if="scope.$index == 4" style="display: flex;">
-              <div style="width: 100px;display: inline-block;margin: auto;">
-                <div>火</div>
-                <div>灾</div>
-                <div>模</div>
-                <div>式</div>
-              </div>
-              <div style="width: 100px;display: inline-block;">
-                <div style="height: 56px; border: 1px solid #FFF;">控制室</div>
-                <div style="height: 56px; border: 1px solid #FFF;">
-                  <div>35KV</div>
-                  <div>开关柜室</div>
-                </div>
-                <div style="height: 56px; border: 1px solid #FFF;">
-                  <div>整流变频</div>
-                  <div>压器室1</div>
-                </div>
-                <div style="height: 56px; border: 1px solid #FFF;">
-                  <div>整流变频</div>
-                  <div>压器室2</div>
-                </div>
-                <div style="height: 56px; border: 1px solid #FFF;">
-                  <div>直流开</div>
-                  <div>关柜室</div>
-                </div>
-                <div style="height: 56px; border: 1px solid #FFF;">
-                  <div>0.4KV</div>
-                  <div>低压柜室</div>
-                </div>
-              </div>
-              <div style="width: 100px;display: inline-block;">
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
-                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
-                <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(5)">排气</div>
-              </div>
-            </div>
-            <div v-if="scope.$index === 16" style="height: 28px;line-height: 28px;">设备实际运行状态</div>
-            <div v-if="scope.$index === 17">状态比较</div>
-          </template>
-        </el-table-column>
-        <el-table-column :key="11" prop="code" label="模式编号" width="90">
-          <template slot="header">
-            <div style="font-size: 0;text-align: center;height: 100%;">
-              <div class="index-row-cell" style="width: 90px;margin-left: -1px;">4</div>
-              <div style="font-size: 14px;height: 80px;line-height: 80px;">模式编号</div>
-            </div>
-          </template>
-        </el-table-column>
-        <el-table-column prop="smallSystem1">
-          <template slot="header">
-            <div style="font-size: 0;text-align: center;height: 100%;">
-              <div class="index-row-cell" style="width: 90px;">5</div>
-              <div class="index-row-cell" style="width: 90px;">6</div>
-              <div class="index-row-cell" style="width: 90px;">7</div>
-              <div class="index-row-cell" style="width: 90px;">8</div>
-              <div class="index-row-cell" style="width: 90px;">9</div>
-              <div class="index-row-cell" style="width: 90px;">10</div>
-              <div class="index-row-cell" style="width: 90px;">11</div>
-              <div class="index-row-cell" style="width: 89px;">12</div>
-              <div style="font-size: 14px;">小系统1</div>
-            </div>
-          </template>
-          <el-table-column prop="airConditioner" label="空调机">
-            <el-table-column prop="ahu1" width="90" label="AHU-B101" />
-          </el-table-column>
-          <el-table-column prop="exhaustFan" label="回排风机">
-            <el-table-column prop="raf1" width="90" label="RAF-B101" />
-          </el-table-column>
-          <el-table-column prop="flowControl" label="电动风量调节阀">
-            <el-table-column prop="md1" width="90" label="MD-B101" />
-            <el-table-column prop="md2" width="90" label="MD-B102" />
-            <el-table-column prop="md3" width="90" label="MD-B103" />
-            <el-table-column prop="md4" width="90" label="MD-B104" />
-            <el-table-column prop="md5" width="90" label="MD-B105" />
-            <el-table-column prop="md6" width="90" label="MD-B106" />
-          </el-table-column>
-        </el-table-column>
-        <el-table-column prop="smallSystem2">
-          <template slot="header">
-            <div style="font-size: 0;text-align: center;height: 100%;">
-              <div class="index-row-cell" style="width: 90px;">13</div>
-              <div class="index-row-cell" style="width: 99px;">14</div>
-              <div style="font-size: 14px;">小系统2</div>
-            </div>
-          </template>
-          <el-table-column prop="exhaustFan" label="排风机">
-            <el-table-column prop="eaf" width="90" label="EAF-B201" />
-          </el-table-column>
-          <el-table-column prop="flowControl" label="电动风量调节阀">
-            <el-table-column prop="md7" width="100" label="MD-B201" />
-          </el-table-column>
-        </el-table-column>
-        <el-table-column prop="smallSystem4">
-          <template slot="header">
-            <div style="font-size: 0;text-align: center;height: 100%;">
-              <div class="index-row-cell" style="width: 90px;">15</div>
-              <div class="index-row-cell" style="width: 90px;">16</div>
-              <div class="index-row-cell" style="width: 90px;">17</div>
-              <div class="index-row-cell" style="width: 90px;">18</div>
-              <div class="index-row-cell" style="width: 90px;">19</div>
-              <div class="index-row-cell" style="width: 90px;">20</div>
-              <div class="index-row-cell" style="width: 89px;">21</div>
-              <div style="font-size: 14px;">小系统4</div>
-            </div>
-          </template>
-          <el-table-column prop="airConditioner" label="空调机">
-            <el-table-column prop="ahu2" width="90" label="AHU-B401" />
-          </el-table-column>
-          <el-table-column prop="exhaustFan" label="回排风机">
-            <el-table-column prop="raf2" width="90" label="RAF-B401" />
-          </el-table-column>
-          <el-table-column prop="flowControl" label="电动风量调节阀">
-            <el-table-column prop="md8" width="90" label="MD-B401" />
-            <el-table-column prop="md9" width="90" label="MD-B402" />
-            <el-table-column prop="md10" width="90" label="MD-B403" />
-            <el-table-column prop="md11" width="90" label="MD-B404" />
-            <el-table-column prop="md12" width="90" label="MD-B405" />
-          </el-table-column>
-        </el-table-column>
-      </el-table>
+      <big-system-table v-if="mode === 'bigSystem'" @showModeDialog="showModeDialog" />
+      <small-system1-table v-else-if="mode === 'smallSystem1'" @showModeDialog="showModeDialog" />
+      <small-system2-table v-else-if="mode === 'smallSystem2'" @showModeDialog="showModeDialog" />
+      <ventilation v-else-if="mode === 'ventilation'" @showModeDialog="showModeDialog" />
+      <ventilation1 v-else-if="mode=== 'ventilation1'" @showModeDialog="showModeDialog" />
+      <ventilation2 v-else-if="mode === 'ventilation2'" @showModeDialog="showModeDialog" />
     </div>
     <div style="width: 100%;display:flex;justify-content:space-around;">
       <div class="button-box" style="padding: 5px;" @click="switchedSystems('bigSystem')">至大系统模式表</div>
@@ -254,153 +19,30 @@
       <div class="button-box" style="padding: 5px;" @click="switchedSystems('ventilation3')">至隧道通风系模式表3</div>
       <div class="button-box" style="padding: 5px;" @click="switchedSystems('lightingSystem')">至照明模式表</div>
     </div>
-    <el-dialog title="" :visible.sync="dialogVisible" width="600px" class="iscs_device_control_dialog">
-      <div>
-        <div class="dialog-box">
-          <div class="title">模式类别</div>
-          <div class="content">
-            <div class="stand-title">{{ modeModel.stationName }}</div>
-            <div class="stand-control">{{ modeModel.controlName }}</div>
-          </div>
-        </div>
-        <div class="dialog-box">
-          <div class="title">启动模式号</div>
-          <div class="content">
-            <div class="model">{{ modeModel.modeCode }}</div>
-          </div>
-        </div>
-      </div>
-      <div class="dialog-footer" style="margin-top: 20px; text-align: center;">
-        <el-button style="margin-right: 13px;" @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="dialogVisible = false">执 行</el-button>
-      </div>
-    </el-dialog>
+    <mode-type ref="modeType" />
   </div>
 </template>
 <script>
+import BigSystemTable from './controlChild/bigSystemTable';
+import SmallSystem1Table from './controlChild/smallSystem1Table';
+import SmallSystem2Table from './controlChild/smallSystem2Table';
+import ModeType from './controlChild/modeType';
+import Ventilation from './controlChild/ventilation';
+import Ventilation1 from './controlChild/ventilation1';
+import Ventilation2 from './controlChild/ventilation2';
 export default {
+    components: {
+        BigSystemTable,
+        SmallSystem1Table,
+        ModeType,
+        SmallSystem2Table,
+        Ventilation,
+        Ventilation1,
+        Ventilation2
+    },
     data() {
         return {
-            mode:'bigSystem',
-            dialogVisible: false,
-            modeModel: {
-                stationName: this.$route.query.stationName,
-                controlName: '系统模式控制',
-                modeCode: ''
-            },
-            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
-            rowStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B' },
-            tableData: [{
-                code: '101',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '关闭'
-            }, {
-                code: '102',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }, {
-                code: '103',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '关闭'
-            }, {
-                code: '104',
-                faf1: '打开',
-                faf2: '关闭',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }, {
-                code: '105',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '关闭'
-            }, {
-                code: '106',
-                faf1: '打开',
-                faf2: '关闭',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }, {
-                code: '107',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }, {
-                code: '108',
-                faf1: '打开',
-                faf2: '关闭',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }, {
-                code: '',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }, {
-                code: '',
-                faf1: '打开',
-                faf2: '打开',
-                ahu1: '打开',
-                ahu2: '打开',
-                raf1: '打开',
-                raf2: '打开',
-                md1: '打开'
-            }],
-            tableData1: [
-                {code: '301', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '302', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '303', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '304', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '305', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '306', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '307', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '308', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '309', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '310', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '311', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '312', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '313', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '314', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '315', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '316', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {code: '', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
-                {}
-            ]
+            mode:'bigSystem'
         };
     },
     computed: {
@@ -433,74 +75,8 @@ export default {
         }
     },
     methods: {
-        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
-            if (columnIndex === 0) { // 只有第一行合并
-                if (rowIndex == 0 || rowIndex == 4) {
-                    return {
-                        rowspan: 4,
-                        colspan: 1
-                    };
-                } else if (rowIndex >= 8) {
-                    return {
-                        rowspan: 1,
-                        colspan: 2
-                    };
-                } else {
-                    return {
-                        rowspan: 0,
-                        colspan: 0
-                    };
-                }
-            }
-            if (columnIndex == 1) {
-                if (rowIndex >= 8) {
-                    return {
-                        rowspan: 0,
-                        colspan: 0
-                    };
-                }
-            }
-        },
-        objectSpanMethod1( {row, column, rowIndex, columnIndex}) {
-            if (columnIndex === 1) {
-                if (rowIndex === 0) {
-                    return {
-                        rowspan: 4,
-                        colspan: 1
-                    };
-                } else if (rowIndex === 4) {
-                    return {
-                        rowspan: 12,
-                        colspan: 1
-                    };
-                } else if (rowIndex === 16 || rowIndex === 17) {
-                    return {
-                        rowspan: 1,
-                        colspan: 2
-                    };
-                } else {
-                    return {
-                        rowspan: 0,
-                        colspan: 0
-                    };
-                }
-            } else if (columnIndex === 2) {
-                if (rowIndex === 16 || rowIndex === 17) {
-                    return {
-                        rowspan: 0,
-                        colspan: 0
-                    };
-                } else {
-                    return {
-                        rowspan: 1,
-                        colspan: 1
-                    };
-                }
-            }
-        },
-        showModeDialog(index) {
-            this.modeModel.modeCode = this.tableData[index].code;
-            this.dialogVisible = true;
+        showModeDialog(code) {
+            this.$refs.modeType.doShow(code);
         },
         switchedSystems(mode) {
             this.mode = mode;
@@ -517,36 +93,6 @@ export default {
         text-align: left;
         padding-left: 14px;
     }
-    .table-0-top{
-        overflow: hidden;
-        .left{
-            float: left;
-            width: 40%;
-            display: flex;
-            flex-direction: column;
-            height: 110px;
-            justify-content: center;
-        }
-        .right{
-            float: right;
-            width: 60%;
-        }
-    }
-    .table-4-top{
-        overflow: hidden;
-        .left{
-            float: left;
-            height: 56px;
-            width: 40%;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-        }
-        .right{
-            float: right;
-            width: 60%;
-        }
-    }
     .button-box{
         text-align: center;
         background-color: #ccc;
@@ -569,46 +115,6 @@ export default {
             border-bottom: 1px solid #fff;
         }
     }
-    .dialog-box{
-        width: 100%;
-        overflow: hidden;
-        margin-bottom: 10px;
-        .title{
-            float: left;
-            width: 90px;
-            text-align: left;
-			color:#6F49FE;
-			font-size: 14px;
-        }
-        .content{
-            float: left;
-            width: 400px;
-            background: #efefef;
-            height: 40px;
-            padding-left: 15px;
-            .stand-title{
-                float: left;
-                margin-right: 50px;
-                height: 40px;
-                line-height: 40px;
-				color:#6F49FE;
-				font-size: 14px;
-            }
-            .stand-control{
-                float: left;
-                height: 40px;
-                line-height: 40px;
-				color:#6F49FE;
-				font-size: 14px;
-            }
-            .model{
-                height: 40px;
-                line-height: 40px;
-				color:#6F49FE;
-				font-size: 14px;
-            }
-        }
-    }
 }
 .control-bas{
     margin: 30px;
@@ -627,26 +133,6 @@ export default {
     margin-top: 30px;
     color: #56E5DE;
 }
-.index-column-cell {
-	text-align:center;
-	width: 100%;
-	height: 28px;
-	border-top: 1px solid #203244;
-	border-left: 2px solid #A3A3A3;
-	border-bottom: 1px solid #203244;
-	border-right: 1px solid #203244;
-}
-.index-row-cell {
-	width: 99px;
-	height: 20px;
-	font-size: 14px;
-	line-height: 20px;
-	display: inline-block;
-	border-top: 2px solid #A3A3A3;
-	border-left: 1px solid #203244;
-	border-bottom: 2px solid #203244;
-	border-right: 1px solid #203244;
-}
 /deep/{
     .el-table--border{
         background: #45607B;
@@ -656,6 +142,9 @@ export default {
 	.index-column{
 		border: 0 !important;
 	}
+	.cyan-label{
+		color: #56E5DE;
+	}
     .el-table th, .el-table tr{
         background: #45607B;
         color: #fff;
@@ -682,70 +171,3 @@ export default {
     }
 }
 </style>
-<style>
-	.iscs_device_control_dialog .el-dialog .el-dialog__header {
-		width: 100%;
-		height: 30px;
-		background-image: linear-gradient(#F0DBCE,#ECB85E, #F0DBCE);
-	}
-	.iscs_device_control_dialog .el-dialog .el-dialog__headerbtn{
-		position: absolute;
-		top: 5px;
-		right: 10px;
-		padding: 0;
-		background: 0 0;
-		outline: 0;
-		cursor: pointer;
-		font-size: 16px;
-		border: 1px solid #FFF;
-		width: 20px;
-		height: 18px;
-	}
-	.iscs_device_control_dialog .el-dialog .el-dialog__body {
-		padding: 30px 20px;
-		color: #606266;
-		font-size: 14px;
-		word-break: break-all;
-		background: #CDC6C0;
-	}
-	.iscs_device_control_dialog .el-dialog .el-button {
-		display: inline-block;
-		line-height: 1;
-		white-space: nowrap;
-		cursor: pointer;
-		background: #CACACA;
-		border-top: 1px solid #3D3B39;
-		border-left: 1px solid #3D3B39;
-		border-bottom: 1px solid #847B77;
-		border-right: 1px solid #847B77;
-		color: #000;
-		-webkit-appearance: none;
-		text-align: center;
-		-webkit-box-sizing: border-box;
-		box-sizing: border-box;
-		outline: 0;
-		margin: 0;
-		-webkit-transition: .1s;
-		transition: .1s;
-		padding: 0;
-		font-weight: 500;
-		font-size: 12px;
-		height: 30px;
-		width: 70px;
-		border-radius: 0;
-		position: relative;
-	}
-	.iscs_device_control_dialog .el-dialog .el-button :before {
-		content: '';
-		width: 70px;
-		height: 30px;
-		border-top: 1px solid #FFF;
-		border-left: 1px solid #FFF;
-		position: absolute;
-		top: -2px;
-		left: -2px;
-	}
-	.iscs_device_control_dialog .el-dialog .el-button:hover {
-		background-image: linear-gradient(#E2E4E5,#D5D6D8,#E2E4E5);
-	}
-</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/bigSystemTable.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/bigSystemTable.vue
new file mode 100644
index 000000000..d7d38a637
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/bigSystemTable.vue
@@ -0,0 +1,221 @@
+<template>
+  <el-table ref="table1" class="table-box" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyleFunction" :span-method="objectSpanMethod" style="float: left;">
+    <el-table-column label="日期" fixed width="300">
+      <template slot="header">
+        <div class="title-0">全年运行工况</div>
+        <div class="title-0">运行模式号</div>
+        <div class="title-0">模式状态</div>
+        <div class="title-0">火灾指示灯:</div>
+      </template>
+      <template slot-scope="scope">
+        <div v-if="scope.$index == 0" class="table-0-top">
+          <div class="left">
+            <div>正常</div>
+            <div>运行</div>
+          </div>
+          <div class="right">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">小新风空调</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(1)">全新风空调</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(2)">非空调季节</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(3)">冬季模式</div>
+          </div>
+        </div>
+        <div v-if="scope.$index == 4" class="table-4-top">
+          <div class="left">
+            <div>火灾</div>
+            <div>模式</div>
+          </div>
+          <div class="right">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">站厅公共区火灾</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">站台公共区火灾</div>
+          </div>
+          <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(6)">非火灾工况突发事件</div>
+          <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(7)">全停模式</div>
+        </div>
+        <div v-if="scope.$index == 8" class="table-8-top">设备实际运行状态</div>
+        <div v-if="scope.$index == 9" class="table-9-top">状态比较</div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="code" width="120">
+      <template slot="header">
+        <div style="width: 100%">模式</div>
+        <div style="width: 100%">编号</div>
+      </template>
+    </el-table-column>
+    <el-table-column label="大系统模式表">
+      <el-table-column label="新风机">
+        <el-table-column prop="faf1" label-class-name="cyan-label" label="FAF-1" width="120" />
+        <el-table-column prop="faf2" label-class-name="cyan-label" label="FAF-2" width="120" />
+      </el-table-column>
+      <el-table-column label="组合式空调器">
+        <el-table-column prop="ahu1" label-class-name="cyan-label" label="AHU-1" width="120" />
+        <el-table-column prop="ahu2" label-class-name="cyan-label" label="AHU-2" width="120" />
+      </el-table-column>
+      <el-table-column label="回排风机">
+        <el-table-column prop="raf1" label-class-name="cyan-label" label="RAF/SEF-1" width="120" />
+        <el-table-column prop="raf2" label-class-name="cyan-label" label="RAF/SEF-2" width="120" />
+      </el-table-column>
+      <el-table-column label="风机1">
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-1" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-2" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-3" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-4" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-5" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-6" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-7" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-8" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-9" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-10" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-11" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-12" width="120" />
+        <el-table-column prop="md1" label-class-name="cyan-label" label="MD-13" width="120" />
+      </el-table-column>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+export default {
+    name: 'BigSystemTable',
+    data() {
+        return {
+            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
+            tableData: [
+                {code: '101', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '关闭'},
+                {code: '102', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'},
+                {code: '103', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '关闭'},
+                {code: '104', faf1: '打开', faf2: '关闭', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'},
+                {code: '105', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '关闭'},
+                {code: '106', faf1: '打开', faf2: '关闭', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'},
+                {code: '107', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'},
+                {code: '108', faf1: '打开', faf2: '关闭', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'},
+                {code: '', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'}, {}
+                // {code: '', faf1: '打开', faf2: '打开', ahu1: '打开', ahu2: '打开', raf1: '打开', raf2: '打开', md1: '打开'}
+            ]
+        };
+    },
+    methods: {
+        rowStyleFunction({row, column, rowIndex, columnIndex}) {
+            if (rowIndex === 8 && columnIndex > 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#0F0'
+                };
+            } else if (columnIndex === 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#56E5DE'
+                };
+            } else {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B'
+                };
+            }
+        },
+        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+            if (columnIndex === 0) { // 只有第一行合并
+                if (rowIndex == 0 || rowIndex == 4) {
+                    return {
+                        rowspan: 4,
+                        colspan: 1
+                    };
+                } else if (rowIndex >= 8) {
+                    return {
+                        rowspan: 1,
+                        colspan: 2
+                    };
+                } else {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            }
+            if (columnIndex == 1) {
+                if (rowIndex >= 8) {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            }
+        },
+        showModeDialog(index) {
+            this.$emit('showModeDialog', this.tableData[index].code);
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+	.table-box {
+		width: 100%;
+		.title-0{
+			width: 100%;
+			line-height: 20px;
+			text-align: left;
+			padding-left: 14px;
+		}
+		.table-0-top{
+			overflow: hidden;
+			.left{
+				float: left;
+				width: 40%;
+				display: flex;
+				flex-direction: column;
+				height: 110px;
+				justify-content: center;
+			}
+			.right{
+				float: right;
+				width: 60%;
+			}
+		}
+		.table-4-top{
+			overflow: hidden;
+			.left{
+				float: left;
+				height: 56px;
+				width: 40%;
+				display: flex;
+				flex-direction: column;
+				justify-content: center;
+			}
+			.right{
+				float: right;
+				width: 60%;
+			}
+		}
+		.button-box{
+			text-align: center;
+			background-color: #ccc;
+			float: left;
+			font-size: 12px;
+			color: #333;
+			font-weight: bold;
+			box-sizing: border-box;
+			border-top: 2px solid #fff;
+			border-left: 2px solid #fff;
+			border-right: 2px solid #565656;
+			border-bottom: 2px solid #565656;
+			cursor: pointer;
+			&.active,
+			&:hover{
+				background: #EBB570;
+				border-top: 2px solid #795B31;
+				border-left: 2px solid #795B31;
+				border-right: 1px solid #fff;
+				border-bottom: 1px solid #fff;
+			}
+		}
+	}
+</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/modeType.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/modeType.vue
new file mode 100644
index 000000000..91729a325
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/modeType.vue
@@ -0,0 +1,154 @@
+<template>
+  <el-dialog title="" :visible.sync="dialogVisible" width="600px" class="iscs_device_control_dialog">
+    <div>
+      <div class="dialog-box">
+        <div class="title">模式类别</div>
+        <div class="content">
+          <div class="stand-title">{{ modeModel.stationName }}</div>
+          <div class="stand-control">{{ modeModel.controlName }}</div>
+        </div>
+      </div>
+      <div class="dialog-box">
+        <div class="title">启动模式号</div>
+        <div class="content">
+          <div class="model">{{ modeModel.modeCode }}</div>
+        </div>
+      </div>
+    </div>
+    <div class="dialog-footer" style="margin-top: 20px; text-align: center;">
+      <el-button style="margin-right: 13px;" @click="dialogVisible = false">取 消</el-button>
+      <el-button type="primary" @click="dialogVisible = false">执 行</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+    name: 'ModeType',
+    data() {
+        return {
+            dialogVisible: false,
+            modeModel: {
+                stationName: this.$route.query.stationName,
+                controlName: '系统模式控制',
+                modeCode: ''
+            }
+        };
+    },
+    methods: {
+        doShow(code) {
+            this.modeModel.modeCode = code;
+            this.dialogVisible = true;
+        }
+    }
+};
+</script>
+<style slot="scope" lang="scss">
+	.dialog-box{
+		width: 100%;
+		overflow: hidden;
+		margin-bottom: 10px;
+	.title{
+		float: left;
+		width: 90px;
+		text-align: left;
+		color:#6F49FE;
+		font-size: 14px;
+	}
+	.content{
+		float: left;
+		width: 400px;
+		background: #efefef;
+		height: 40px;
+		padding-left: 15px;
+	.stand-title{
+		float: left;
+		margin-right: 50px;
+		height: 40px;
+		line-height: 40px;
+		color:#6F49FE;
+		font-size: 14px;
+	}
+	.stand-control{
+		float: left;
+		height: 40px;
+		line-height: 40px;
+		color:#6F49FE;
+		font-size: 14px;
+	}
+	.model{
+		height: 40px;
+		line-height: 40px;
+		color:#6F49FE;
+		font-size: 14px;
+	}
+	}
+	}
+</style>
+<style>
+	.iscs_device_control_dialog .el-dialog .el-dialog__header {
+		width: 100%;
+		height: 30px;
+		background-image: linear-gradient(#F0DBCE,#ECB85E, #F0DBCE);
+	}
+	.iscs_device_control_dialog .el-dialog .el-dialog__headerbtn{
+		position: absolute;
+		top: 5px;
+		right: 10px;
+		padding: 0;
+		background: 0 0;
+		outline: 0;
+		cursor: pointer;
+		font-size: 16px;
+		border: 1px solid #FFF;
+		width: 20px;
+		height: 18px;
+	}
+	.iscs_device_control_dialog .el-dialog .el-dialog__body {
+		padding: 30px 20px;
+		color: #606266;
+		font-size: 14px;
+		word-break: break-all;
+		background: #CDC6C0;
+	}
+	.iscs_device_control_dialog .el-dialog .el-button {
+		display: inline-block;
+		line-height: 1;
+		white-space: nowrap;
+		cursor: pointer;
+		background: #CACACA;
+		border-top: 1px solid #3D3B39;
+		border-left: 1px solid #3D3B39;
+		border-bottom: 1px solid #847B77;
+		border-right: 1px solid #847B77;
+		color: #000;
+		-webkit-appearance: none;
+		text-align: center;
+		-webkit-box-sizing: border-box;
+		box-sizing: border-box;
+		outline: 0;
+		margin: 0;
+		-webkit-transition: .1s;
+		transition: .1s;
+		padding: 0;
+		font-weight: 500;
+		font-size: 12px;
+		height: 30px;
+		width: 70px;
+		border-radius: 0;
+		position: relative;
+	}
+	.iscs_device_control_dialog .el-dialog .el-button :before {
+		content: '';
+		width: 70px;
+		height: 30px;
+		border-top: 1px solid #FFF;
+		border-left: 1px solid #FFF;
+		position: absolute;
+		top: -2px;
+		left: -2px;
+	}
+	.iscs_device_control_dialog .el-dialog .el-button:hover {
+		background-image: linear-gradient(#E2E4E5,#D5D6D8,#E2E4E5);
+	}
+</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem1Table.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem1Table.vue
new file mode 100644
index 000000000..df5505292
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem1Table.vue
@@ -0,0 +1,320 @@
+<template>
+  <el-table ref="table2" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyleFunction" :span-method="objectSpanMethod" style="float: left;">
+    <el-table-column type="index" width="20" fixed class-name="index-column">
+      <template slot="header">
+        <div style="width: 100%;height: 26px;background: #FFF" />
+        <div class="index-column-cell">1</div>
+        <div class="index-column-cell">2</div>
+        <div class="index-column-cell">3</div>
+      </template>
+      <template slot-scope="scope">
+        <div class="index-column-cell">{{ scope.$index + 4 }}</div>
+      </template>
+    </el-table-column>
+    <el-table-column fixed width="300">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;">
+          <div class="index-row-cell">1</div>
+          <div class="index-row-cell">2</div>
+          <div class="index-row-cell">3</div>
+        </div>
+        <div class="title-0">全年运行工况</div>
+        <div class="title-0">运行模式号</div>
+        <div class="title-0">模式状态</div>
+        <div class="title-0">火灾指示灯:</div>
+      </template>
+      <template slot-scope="scope">
+        <div v-if="scope.$index == 0" style="display: flex;">
+          <div style="width: 100px;">
+            <div>正</div>
+            <div>常</div>
+            <div>运</div>
+            <div>行</div>
+          </div>
+          <div style="width: 199px;">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">小新风空调</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(1)">小新风空调</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(2)">非空调工况</div>
+            <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(3)">35KV开关柜室事故排风</div>
+          </div>
+        </div>
+        <div v-if="scope.$index == 4" style="display: flex;">
+          <div style="width: 100px;display: inline-block;margin: auto;">
+            <div>火</div>
+            <div>灾</div>
+            <div>模</div>
+            <div>式</div>
+          </div>
+          <div style="width: 100px;display: inline-block;">
+            <div style="height: 56px; border: 1px solid #FFF;">控制室</div>
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>35KV</div>
+              <div>开关柜室</div>
+            </div>
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>整流变频</div>
+              <div>压器室1</div>
+            </div>
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>整流变频</div>
+              <div>压器室2</div>
+            </div>
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>直流开</div>
+              <div>关柜室</div>
+            </div>
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>0.4KV</div>
+              <div>低压柜室</div>
+            </div>
+          </div>
+          <div style="width: 100px;display: inline-block;">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(5)">排气</div>
+          </div>
+        </div>
+        <div v-if="scope.$index === 16" style="height: 28px;line-height: 28px;">设备实际运行状态</div>
+        <div v-if="scope.$index === 17">状态比较</div>
+      </template>
+    </el-table-column>
+    <el-table-column :key="11" prop="code" label="模式编号" width="90">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;margin-left: -1px;">4</div>
+          <div style="font-size: 14px;height: 80px;line-height: 80px;">模式编号</div>
+        </div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="smallSystem1">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">5</div>
+          <div class="index-row-cell" style="width: 90px;">6</div>
+          <div class="index-row-cell" style="width: 90px;">7</div>
+          <div class="index-row-cell" style="width: 90px;">8</div>
+          <div class="index-row-cell" style="width: 90px;">9</div>
+          <div class="index-row-cell" style="width: 90px;">10</div>
+          <div class="index-row-cell" style="width: 90px;">11</div>
+          <div class="index-row-cell" style="width: 89px;">12</div>
+          <div style="font-size: 14px;">小系统1</div>
+        </div>
+      </template>
+      <el-table-column prop="airConditioner" label="空调机">
+        <el-table-column prop="ahu1" width="90" label-class-name="cyan-label" label="AHU-B101" />
+      </el-table-column>
+      <el-table-column prop="exhaustFan" label="回排风机">
+        <el-table-column prop="raf1" width="90" label-class-name="cyan-label" label="RAF-B101" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动风量调节阀">
+        <el-table-column prop="md1" width="90" label-class-name="cyan-label" label="MD-B101" />
+        <el-table-column prop="md2" width="90" label-class-name="cyan-label" label="MD-B102" />
+        <el-table-column prop="md3" width="90" label-class-name="cyan-label" label="MD-B103" />
+        <el-table-column prop="md4" width="90" label-class-name="cyan-label" label="MD-B104" />
+        <el-table-column prop="md5" width="90" label-class-name="cyan-label" label="MD-B105" />
+        <el-table-column prop="md6" width="90" label-class-name="cyan-label" label="MD-B106" />
+      </el-table-column>
+    </el-table-column>
+    <el-table-column prop="smallSystem2">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">13</div>
+          <div class="index-row-cell" style="width: 99px;">14</div>
+          <div style="font-size: 14px;">小系统2</div>
+        </div>
+      </template>
+      <el-table-column prop="exhaustFan" label="排风机">
+        <el-table-column prop="eaf" width="90" label-class-name="cyan-label" label="EAF-B201" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动风量调节阀">
+        <el-table-column prop="md7" width="100" label-class-name="cyan-label" label="MD-B201" />
+      </el-table-column>
+    </el-table-column>
+    <el-table-column prop="smallSystem4">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">15</div>
+          <div class="index-row-cell" style="width: 90px;">16</div>
+          <div class="index-row-cell" style="width: 90px;">17</div>
+          <div class="index-row-cell" style="width: 90px;">18</div>
+          <div class="index-row-cell" style="width: 90px;">19</div>
+          <div class="index-row-cell" style="width: 90px;">20</div>
+          <div class="index-row-cell" style="width: 89px;">21</div>
+          <div style="font-size: 14px;">小系统4</div>
+        </div>
+      </template>
+      <el-table-column prop="airConditioner" label="空调机">
+        <el-table-column prop="ahu2" width="90" label-class-name="cyan-label" label="AHU-B401" />
+      </el-table-column>
+      <el-table-column prop="exhaustFan" label="回排风机">
+        <el-table-column prop="raf2" width="90" label-class-name="cyan-label" label="RAF-B401" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动风量调节阀">
+        <el-table-column prop="md8" width="90" label-class-name="cyan-label" label="MD-B401" />
+        <el-table-column prop="md9" width="90" label-class-name="cyan-label" label="MD-B402" />
+        <el-table-column prop="md10" width="90" label-class-name="cyan-label" label="MD-B403" />
+        <el-table-column prop="md11" width="90" label-class-name="cyan-label" label="MD-B404" />
+        <el-table-column prop="md12" width="90" label-class-name="cyan-label" label="MD-B405" />
+      </el-table-column>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+export default {
+    name: 'SmallSystem1Table',
+    data() {
+        return {
+            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
+            tableData: [
+                {code: '301', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '302', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '303', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '304', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '305', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '306', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '307', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '308', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '309', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '310', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '311', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '312', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '313', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '314', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '315', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '316', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {}
+            ]
+        };
+    },
+    methods: {
+        rowStyleFunction({row, column, rowIndex, columnIndex}) {
+            if (rowIndex === 16 && columnIndex > 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#0F0'
+                };
+            } else if (columnIndex === 2) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#56E5DE'
+                };
+            } else {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B'
+                };
+            }
+        },
+        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+            if (columnIndex === 1) {
+                if (rowIndex === 0) {
+                    return {
+                        rowspan: 4,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 4) {
+                    return {
+                        rowspan: 12,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 16 || rowIndex === 17) {
+                    return {
+                        rowspan: 1,
+                        colspan: 2
+                    };
+                } else {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            } else if (columnIndex === 2) {
+                if (rowIndex === 16 || rowIndex === 17) {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                } else {
+                    return {
+                        rowspan: 1,
+                        colspan: 1
+                    };
+                }
+            }
+        },
+        showModeDialog(index) {
+
+        }
+    }
+};
+</script>
+
+<style scoped>
+	.title-0{
+		width: 100%;
+		line-height: 20px;
+		text-align: left;
+		padding-left: 14px;
+	}
+	.index-column-cell {
+		text-align:center;
+		width: 100%;
+		height: 28px;
+		border-top: 1px solid #203244;
+		border-left: 2px solid #A3A3A3;
+		border-bottom: 1px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.index-row-cell {
+		width: 99px;
+		height: 20px;
+		font-size: 14px;
+		line-height: 20px;
+		display: inline-block;
+		border-top: 2px solid #A3A3A3;
+		border-left: 1px solid #203244;
+		border-bottom: 2px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.button-box{
+		text-align: center;
+		background-color: #ccc;
+		float: left;
+		font-size: 12px;
+		color: #333;
+		font-weight: bold;
+		box-sizing: border-box;
+		border-top: 2px solid #fff;
+		border-left: 2px solid #fff;
+		border-right: 2px solid #565656;
+		border-bottom: 2px solid #565656;
+		cursor: pointer;
+	}
+	.button-box.active,
+	.button-box:hover{
+		background: #EBB570;
+		border-top: 2px solid #795B31;
+		border-left: 2px solid #795B31;
+		border-right: 1px solid #fff;
+		border-bottom: 1px solid #fff;
+	}
+</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem2Table.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem2Table.vue
new file mode 100644
index 000000000..fb00c691e
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/smallSystem2Table.vue
@@ -0,0 +1,315 @@
+<template>
+  <el-table ref="table2" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyleFunction" :span-method="objectSpanMethod" style="float: left;">
+    <el-table-column type="index" fixed width="20" class-name="index-column">
+      <template slot="header">
+        <div style="width: 100%;height: 26px;background: #FFF" />
+        <div class="index-column-cell">1</div>
+        <div class="index-column-cell">2</div>
+        <div class="index-column-cell">3</div>
+      </template>
+      <template slot-scope="scope">
+        <div class="index-column-cell">{{ scope.$index + 4 }}</div>
+      </template>
+    </el-table-column>
+    <el-table-column fixed width="300">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;">
+          <div class="index-row-cell">1</div>
+          <div class="index-row-cell">2</div>
+          <div class="index-row-cell">3</div>
+        </div>
+        <div class="title-0">全年运行工况</div>
+        <div class="title-0">运行模式号</div>
+        <div class="title-0">模式状态</div>
+        <div class="title-0">火灾指示灯:</div>
+      </template>
+      <template slot-scope="scope">
+        <div v-if="scope.$index == 0" style="display: flex;">
+          <div style="width: 100px;">
+            <div>正</div>
+            <div>常</div>
+            <div>运</div>
+            <div>行</div>
+          </div>
+          <div style="width: 100px;">
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>商用通信</div>
+              <div>设备室</div>
+            </div>
+            <div style="height: 56px; border: 1px solid #FFF;">
+              <div>再生制动</div>
+              <div>监控室</div>
+            </div>
+          </div>
+          <div style="width: 99px;">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+          </div>
+        </div>
+        <div v-if="scope.$index == 4" style="display: flex;">
+          <div style="width: 100px;display: inline-block;margin: auto;">
+            <div>火</div>
+            <div>灾</div>
+            <div>模</div>
+            <div>式</div>
+          </div>
+          <div style="width: 200px;display: inline-block;">
+            <div style="width: 200px;display: flex;">
+              <div style="width: 100px;display: inline-block;height: 56px; border: 1px solid #FFF;">
+                <div>再生制动</div>
+                <div>电阻室</div>
+              </div>
+              <div style="display: inline-block;width: 100px;">
+                <div class="button-box" style="width: 100px;height: 28px;line-height: 28px;" @click="showModeDialog(4)">灭火</div>
+                <div class="button-box" style="width: 100px;height: 28px;line-height: 28px;" @click="showModeDialog(5)">排气</div>
+              </div>
+            </div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">车站控制室</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">站厅B端环控电控室</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">站厅B端空调机房</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">站厅A端冷水机房</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">站厅A端空调机房</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">站厅A端环控电控室</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">站厅A端走廊</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(5)">B端其余房间火灾</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(4)">A端其余房间火灾</div>
+            <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(5)">全停模式</div>
+          </div>
+        </div>
+        <div v-if="scope.$index === 16" style="height: 28px;line-height: 28px;">设备实际运行状态</div>
+        <div v-if="scope.$index === 17">状态比较</div>
+      </template>
+    </el-table-column>
+    <el-table-column :key="11" prop="code" label="模式编号" width="90">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;margin-left: -1px;">4</div>
+          <div style="font-size: 14px;height: 80px;line-height: 80px;">模式编号</div>
+        </div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="smallSystem1">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">5</div>
+          <div class="index-row-cell" style="width: 90px;">6</div>
+          <div class="index-row-cell" style="width: 90px;">7</div>
+          <div class="index-row-cell" style="width: 90px;">8</div>
+          <div class="index-row-cell" style="width: 90px;">9</div>
+          <div class="index-row-cell" style="width: 90px;">10</div>
+          <div class="index-row-cell" style="width: 90px;">11</div>
+          <div class="index-row-cell" style="width: 89px;">12</div>
+          <div style="font-size: 14px;">小系统1</div>
+        </div>
+      </template>
+      <el-table-column prop="airConditioner" label="空调机">
+        <el-table-column label-class-name="cyan-label" prop="ahu1" width="90" label="AHU-B101" />
+      </el-table-column>
+      <el-table-column prop="exhaustFan" label="回排风机">
+        <el-table-column label-class-name="cyan-label" prop="raf1" width="90" label="RAF-B101" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动风量调节阀">
+        <el-table-column prop="md1" width="90" label-class-name="cyan-label" label="MD-B101" />
+        <el-table-column prop="md2" width="90" label-class-name="cyan-label" label="MD-B102" />
+        <el-table-column prop="md3" width="90" label-class-name="cyan-label" label="MD-B103" />
+        <el-table-column prop="md4" width="90" label-class-name="cyan-label" label="MD-B104" />
+        <el-table-column prop="md5" width="90" label-class-name="cyan-label" label="MD-B105" />
+        <el-table-column prop="md6" width="90" label-class-name="cyan-label" label="MD-B106" />
+      </el-table-column>
+    </el-table-column>
+    <el-table-column prop="smallSystem2">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">13</div>
+          <div class="index-row-cell" style="width: 99px;">14</div>
+          <div style="font-size: 14px;">小系统2</div>
+        </div>
+      </template>
+      <el-table-column prop="exhaustFan" label="排风机">
+        <el-table-column prop="eaf" width="90" label-class-name="cyan-label" label="EAF-B201" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动风量调节阀">
+        <el-table-column prop="md7" width="100" label-class-name="cyan-label" label="MD-B201" />
+      </el-table-column>
+    </el-table-column>
+    <el-table-column prop="smallSystem4">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">15</div>
+          <div class="index-row-cell" style="width: 90px;">16</div>
+          <div class="index-row-cell" style="width: 90px;">17</div>
+          <div class="index-row-cell" style="width: 90px;">18</div>
+          <div class="index-row-cell" style="width: 90px;">19</div>
+          <div class="index-row-cell" style="width: 90px;">20</div>
+          <div class="index-row-cell" style="width: 89px;">21</div>
+          <div style="font-size: 14px;">小系统4</div>
+        </div>
+      </template>
+      <el-table-column prop="airConditioner" label="空调机">
+        <el-table-column prop="ahu2" width="90" label-class-name="cyan-label" label="AHU-B401" />
+      </el-table-column>
+      <el-table-column prop="exhaustFan" label="回排风机">
+        <el-table-column prop="raf2" width="90" label-class-name="cyan-label" label="RAF-B401" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动风量调节阀">
+        <el-table-column prop="md8" width="90" label-class-name="cyan-label" label="MD-B401" />
+        <el-table-column prop="md9" width="90" label-class-name="cyan-label" label="MD-B402" />
+        <el-table-column prop="md10" width="90" label-class-name="cyan-label" label="MD-B403" />
+        <el-table-column prop="md11" width="90" label-class-name="cyan-label" label="MD-B404" />
+        <el-table-column prop="md12" width="90" label-class-name="cyan-label" label="MD-B405" />
+      </el-table-column>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+export default {
+    name: 'SmallSystem1Table',
+    data() {
+        return {
+            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
+            tableData: [
+                {code: '317', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '318', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '319', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '320', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '321', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '322', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '323', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '324', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '325', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '326', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '327', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '328', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '329', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '330', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '331', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '332', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {code: '', ahu1: '打开', raf1: '打开', md1: '半开', md2: '半开', md3: '半开', md4: '打开', md5: '打开', md6: '关闭', eaf: '打开', md7: '打开', ahu2: '打开', raf2: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开'},
+                {}
+            ]
+        };
+    },
+    methods: {
+        rowStyleFunction({row, column, rowIndex, columnIndex}) {
+            if (rowIndex === 16 && columnIndex > 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#0F0'
+                };
+            } else if (columnIndex === 2) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#56E5DE'
+                };
+            } else {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B'
+                };
+            }
+        },
+        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+            if (columnIndex === 1) {
+                if (rowIndex === 0) {
+                    return {
+                        rowspan: 4,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 4) {
+                    return {
+                        rowspan: 12,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 16 || rowIndex === 17) {
+                    return {
+                        rowspan: 1,
+                        colspan: 2
+                    };
+                } else {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            } else if (columnIndex === 2) {
+                if (rowIndex === 16 || rowIndex === 17) {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                } else {
+                    return {
+                        rowspan: 1,
+                        colspan: 1
+                    };
+                }
+            }
+        },
+        showModeDialog(index) {
+
+        }
+    }
+};
+</script>
+
+<style scoped>
+	.title-0{
+		width: 100%;
+		line-height: 20px;
+		text-align: left;
+		padding-left: 14px;
+	}
+	.index-column-cell {
+		text-align:center;
+		width: 100%;
+		height: 28px;
+		border-top: 1px solid #203244;
+		border-left: 2px solid #A3A3A3;
+		border-bottom: 1px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.index-row-cell {
+		width: 99px;
+		height: 20px;
+		font-size: 14px;
+		line-height: 20px;
+		display: inline-block;
+		border-top: 2px solid #A3A3A3;
+		border-left: 1px solid #203244;
+		border-bottom: 2px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.button-box{
+		text-align: center;
+		background-color: #ccc;
+		float: left;
+		font-size: 12px;
+		color: #333;
+		font-weight: bold;
+		box-sizing: border-box;
+		border-top: 2px solid #fff;
+		border-left: 2px solid #fff;
+		border-right: 2px solid #565656;
+		border-bottom: 2px solid #565656;
+		cursor: pointer;
+	}
+	.button-box.active,
+	.button-box:hover{
+		background: #EBB570;
+		border-top: 2px solid #795B31;
+		border-left: 2px solid #795B31;
+		border-right: 1px solid #fff;
+		border-bottom: 1px solid #fff;
+	}
+</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation.vue
new file mode 100644
index 000000000..ced4bc887
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation.vue
@@ -0,0 +1,286 @@
+<template>
+  <el-table ref="table2" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyleFunction" :span-method="objectSpanMethod" style="float: left;">
+    <el-table-column type="index" width="20" fixed class-name="index-column">
+      <template slot="header">
+        <div style="width: 100%;height: 26px;background: #FFF" />
+        <div class="index-column-cell">1</div>
+        <div class="index-column-cell">2</div>
+        <div class="index-column-cell">3</div>
+      </template>
+      <template slot-scope="scope">
+        <div class="index-column-cell">{{ scope.$index + 4 }}</div>
+      </template>
+    </el-table-column>
+    <el-table-column fixed width="300">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;">
+          <div class="index-row-cell">1</div>
+          <div class="index-row-cell">2</div>
+          <div class="index-row-cell">3</div>
+        </div>
+        <div class="title-0">全年运行工况</div>
+        <div class="title-0">运行模式号</div>
+        <div class="title-0">模式状态</div>
+        <div class="title-0">火灾指示灯:</div>
+      </template>
+      <template slot-scope="scope">
+        <div v-if="scope.$index == 0" style="display: flex;">
+          <div style="width: 299px;">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">正常运营</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(1)">夜间停运</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(2)">月检测</div>
+            <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(3)">月检测</div>
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(2)">早晚运行-早间通风</div>
+            <div class="button-box" style="width: 100%;height: 27px;line-height: 27px;" @click="showModeDialog(3)">早晚运行-晚间通风</div>
+          </div>
+        </div>
+        <div v-if="scope.$index == 6">
+          <div style="width: 299px;display: flex;">
+            <div style="width: 199px;display: inline-block;">
+              <div style="height: 56px;border: 1px solid #FFF;">
+                <div>站台火灾开启</div>
+                <div>上行屏蔽门</div>
+              </div>
+              <div style="height: 56px;border: 1px solid #FFF;">
+                <div>站台火灾开启</div>
+                <div>下行屏蔽门</div>
+              </div>
+            </div>
+            <div style="width: 100px;display: inline-block">
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+            </div>
+          </div>
+          <div style="width: 299px;display: flex;">
+            <div style="display: inline-block;width: 100px;border: 1px solid #FFF;height: 112px;line-height: 112px;">车站隧道火灾</div>
+            <div style="display: inline-block;width: 100px;">
+              <div style="width: 100%; border: 1px solid #FFF; height: 56px;line-height: 56px;">上行</div>
+              <div style="width: 100%; border: 1px solid #FFF; height: 56px;line-height: 56px;">下行</div>
+            </div>
+            <div style="width: 100px;display: inline-block">
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+            </div>
+          </div>
+        </div>
+        <div v-if="scope.$index === 14" style="height: 28px;line-height: 28px;">设备实际运行状态</div>
+        <div v-if="scope.$index === 15">状态比较</div>
+      </template>
+    </el-table-column>
+    <el-table-column :key="11" prop="code" label="模式编号" width="90">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;margin-left: -1px;">4</div>
+          <div style="font-size: 14px;height: 80px;line-height: 80px;">模式编号</div>
+        </div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="smallSystem1">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">5</div>
+          <div class="index-row-cell" style="width: 90px;">6</div>
+          <div class="index-row-cell" style="width: 90px;">7</div>
+          <div class="index-row-cell" style="width: 90px;">8</div>
+          <div class="index-row-cell" style="width: 90px;">9</div>
+          <div class="index-row-cell" style="width: 90px;">10</div>
+          <div class="index-row-cell" style="width: 90px;">11</div>
+          <div class="index-row-cell" style="width: 89px;">12</div>
+          <div class="index-row-cell" style="width: 90px;">13</div>
+          <div class="index-row-cell" style="width: 90px;">14</div>
+          <div class="index-row-cell" style="width: 90px;">15</div>
+          <div class="index-row-cell" style="width: 90px;">16</div>
+          <div class="index-row-cell" style="width: 90px;">17</div>
+          <div class="index-row-cell" style="width: 90px;">18</div>
+          <div class="index-row-cell" style="width: 90px;">19</div>
+          <div class="index-row-cell" style="width: 89px;">20</div>
+          <div class="index-row-cell" style="width: 90px;">21</div>
+          <div class="index-row-cell" style="width: 90px;">22</div>
+          <div class="index-row-cell" style="width: 90px;">23</div>
+          <div class="index-row-cell" style="width: 90px;">24</div>
+          <div class="index-row-cell" style="width: 89px;">25</div>
+          <div style="font-size: 14px;">隧道通风系</div>
+        </div>
+      </template>
+      <el-table-column prop="tunnelFan" label="隧道风机">
+        <el-table-column prop="tvf1" width="90" label-class-name="cyan-label" label="TVF-201-I-1" />
+        <el-table-column prop="tvf2" width="90" label-class-name="cyan-label" label="TVF-201-I-2" />
+        <el-table-column prop="tvf3" width="90" label-class-name="cyan-label" label="TVF-201-II-1" />
+        <el-table-column prop="tvf4" width="90" label-class-name="cyan-label" label="TVF-201-II-2" />
+      </el-table-column>
+      <el-table-column prop="exhaustFan" label="车站排热风机">
+        <el-table-column prop="tef1" width="90" label-class-name="cyan-label" label="TEF-201-I-1" />
+        <el-table-column prop="tef2" width="90" label-class-name="cyan-label" label="TEF-201-II-1" />
+      </el-table-column>
+      <el-table-column prop="jetFan" label="射流风机风机">
+        <el-table-column prop="jet1" width="90" label-class-name="cyan-label" label="JET-281-1" />
+        <el-table-column prop="jet2" width="90" label-class-name="cyan-label" label="JET-281-2" />
+        <el-table-column prop="jet3" width="90" label-class-name="cyan-label" label="JET-281-3" />
+        <el-table-column prop="jet4" width="90" label-class-name="cyan-label" label="JET-281-4" />
+        <el-table-column prop="jet5" width="90" label-class-name="cyan-label" label="JET-281-5" />
+        <el-table-column prop="jet6" width="90" label-class-name="cyan-label" label="JET-281-6" />
+        <el-table-column prop="jet7" width="90" label-class-name="cyan-label" label="JET-281-7" />
+        <el-table-column prop="jet8" width="90" label-class-name="cyan-label" label="JET-281-8" />
+        <el-table-column prop="jet9" width="90" label-class-name="cyan-label" label="JET-281-9" />
+        <el-table-column prop="jet10" width="90" label-class-name="cyan-label" label="JET-281-10" />
+        <el-table-column prop="jet11" width="90" label-class-name="cyan-label" label="JET-281-11" />
+        <el-table-column prop="jet12" width="90" label-class-name="cyan-label" label="JET-281-12" />
+        <el-table-column prop="jet13" width="90" label-class-name="cyan-label" label="JET-281-13" />
+        <el-table-column prop="jet14" width="90" label-class-name="cyan-label" label="JET-281-14" />
+        <el-table-column prop="jet15" width="90" label-class-name="cyan-label" label="JET-281-15" />
+      </el-table-column>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+export default {
+    name: 'Ventilation',
+    data() {
+        return {
+            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
+            tableData: [
+                {code: '401', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '402', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '403', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '404', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '405', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '406', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '407', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '408', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '409', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '410', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '411', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '412', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '413', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '414', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {code: '', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', jet1: '打开', jet2: '关闭', jet3: '打开', jet4: '打开', jet5: '打开', jet6: '打开', jet7: '打开', jet8: '打开', jet9: '打开', jet10: '打开', jet11: '打开', jet12: '打开', jet13: '打开', jet14:'打开', jet15: '打开'},
+                {}
+            ]
+        };
+    },
+    methods: {
+        rowStyleFunction({row, column, rowIndex, columnIndex}) {
+            if (rowIndex === 14 && columnIndex > 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#0F0'
+                };
+            } else if (columnIndex === 2) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#56E5DE'
+                };
+            } else {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B'
+                };
+            }
+        },
+        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+            if (columnIndex === 1) {
+                if (rowIndex === 0) {
+                    return {
+                        rowspan: 6,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 6) {
+                    return {
+                        rowspan: 8,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 14 || rowIndex === 15) {
+                    return {
+                        rowspan: 1,
+                        colspan: 2
+                    };
+                } else {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            } else if (columnIndex === 2) {
+                if (rowIndex === 14 || rowIndex === 15) {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                } else {
+                    return {
+                        rowspan: 1,
+                        colspan: 1
+                    };
+                }
+            }
+        },
+        showModeDialog(index) {
+
+        }
+    }
+};
+</script>
+
+<style scoped>
+	.title-0{
+		width: 100%;
+		line-height: 20px;
+		text-align: left;
+		padding-left: 14px;
+	}
+	.index-column-cell {
+		text-align:center;
+		width: 100%;
+		height: 28px;
+		border-top: 1px solid #203244;
+		border-left: 2px solid #A3A3A3;
+		border-bottom: 1px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.index-row-cell {
+		width: 99px;
+		height: 20px;
+		font-size: 14px;
+		line-height: 20px;
+		display: inline-block;
+		border-top: 2px solid #A3A3A3;
+		border-left: 1px solid #203244;
+		border-bottom: 2px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.button-box{
+		text-align: center;
+		background-color: #ccc;
+		float: left;
+		font-size: 12px;
+		color: #333;
+		font-weight: bold;
+		box-sizing: border-box;
+		border-top: 2px solid #fff;
+		border-left: 2px solid #fff;
+		border-right: 2px solid #565656;
+		border-bottom: 2px solid #565656;
+		cursor: pointer;
+	}
+	.button-box.active,
+	.button-box:hover{
+		background: #EBB570;
+		border-top: 2px solid #795B31;
+		border-left: 2px solid #795B31;
+		border-right: 1px solid #fff;
+		border-bottom: 1px solid #fff;
+	}
+</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation1.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation1.vue
new file mode 100644
index 000000000..d9064ed2b
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation1.vue
@@ -0,0 +1,308 @@
+<template>
+  <el-table ref="table2" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyleFunction" :span-method="objectSpanMethod" style="float: left;">
+    <el-table-column type="index" width="20" fixed class-name="index-column">
+      <template slot="header">
+        <div style="width: 100%;height: 26px;background: #FFF" />
+        <div class="index-column-cell">1</div>
+        <div class="index-column-cell">2</div>
+        <div class="index-column-cell">3</div>
+      </template>
+      <template slot-scope="scope">
+        <div class="index-column-cell">{{ scope.$index + 4 }}</div>
+      </template>
+    </el-table-column>
+    <el-table-column fixed width="300">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;">
+          <div class="index-row-cell">1</div>
+          <div class="index-row-cell">2</div>
+          <div class="index-row-cell">3</div>
+        </div>
+        <div class="title-0">全年运行工况</div>
+        <div class="title-0">运行模式号</div>
+        <div class="title-0">模式状态</div>
+        <div class="title-0">火灾指示灯:</div>
+      </template>
+      <template slot-scope="scope">
+        <div v-if="scope.$index == 0">
+          <div style="width: 299px;">
+            <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">正常工况</div>
+          </div>
+          <div style="width: 300px;display: flex;">
+            <div style="width: 200px;display: inline-block;border: 1px solid #FFF;height: 56px;line-height: 56px;">A端出入端左线火灾</div>
+            <div style="width: 99px;display: inline-block;">
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+            </div>
+          </div>
+          <div style="width: 300px;display: flex;">
+            <div style="width: 200px;display: inline-block;border: 1px solid #FFF;height: 56px;line-height: 56px;">A端出入端右线火灾</div>
+            <div style="width: 99px;display: inline-block;">
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+            </div>
+          </div>
+          <div style="width: 300px;display: flex;">
+            <div style="width: 100px;display: inline-block;border: 1px solid #FFF;height: 84px;margin: auto;">
+              <div style="margin-top: 18px;">上行</div><div>阻塞</div>
+            </div>
+            <div style="width: 200px;display: inline-block">
+              <div style="width: 200px;display: flex;">
+                <div style="width: 100px;display: inline-block;height: 56px;line-height: 56px;">工况1</div>
+                <div style="width: 99px;display: inline-block">
+                  <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+                  <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+                </div>
+              </div>
+              <div style="width: 199px;">
+                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">工况2</div>
+              </div>
+            </div>
+          </div>
+          <div style="width: 300px; display: flex;">
+            <div style="width: 100px;display: inline-block;border: 1px solid #FFF;height:112px;margin: auto;">
+              <div style="margin-top: 32px;">上行</div><div>火灾</div>
+            </div>
+            <div style="width: 100px;display: inline-block;">
+              <div style="width: 100px;border: 1px solid #FFF;height:56px;line-height: 56px;">工况1</div>
+              <div style="width: 100px;border: 1px solid #FFF;height:56px;line-height: 56px;">工况2</div>
+            </div>
+            <div style="width: 99px;display: inline-block;">
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+            </div>
+          </div>
+          <div style="width: 300px;display: flex;">
+            <div style="width: 100px;display: inline-block;border: 1px solid #FFF;height: 84px;margin: auto;">
+              <div style="margin-top: 18px;">下行</div><div>阻塞</div>
+            </div>
+            <div style="width: 200px;display: inline-block">
+              <div style="width: 200px;display: flex;">
+                <div style="width: 100px;display: inline-block;height: 56px;line-height: 56px;">工况1</div>
+                <div style="width: 99px;display: inline-block">
+                  <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+                  <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+                </div>
+              </div>
+              <div style="width: 199px;">
+                <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">工况2</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div v-if="scope.$index === 15" style="height: 28px;line-height: 28px;">设备实际运行状态</div>
+        <div v-if="scope.$index === 16">状态比较</div>
+      </template>
+    </el-table-column>
+    <el-table-column :key="11" prop="code" label="模式编号" width="90">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;margin-left: -1px;">4</div>
+          <div style="font-size: 14px;height: 80px;line-height: 80px;">模式编号</div>
+        </div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="smallSystem1">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">5</div>
+          <div class="index-row-cell" style="width: 90px;">6</div>
+          <div class="index-row-cell" style="width: 90px;">7</div>
+          <div class="index-row-cell" style="width: 90px;">8</div>
+          <div class="index-row-cell" style="width: 90px;">9</div>
+          <div class="index-row-cell" style="width: 90px;">10</div>
+          <div class="index-row-cell" style="width: 90px;">11</div>
+          <div class="index-row-cell" style="width: 89px;">12</div>
+          <div class="index-row-cell" style="width: 90px;">13</div>
+          <div class="index-row-cell" style="width: 90px;">14</div>
+          <div class="index-row-cell" style="width: 90px;">15</div>
+          <div class="index-row-cell" style="width: 90px;">16</div>
+          <div class="index-row-cell" style="width: 90px;">17</div>
+          <div class="index-row-cell" style="width: 90px;">18</div>
+          <div class="index-row-cell" style="width: 90px;">19</div>
+          <div class="index-row-cell" style="width: 89px;">20</div>
+          <div class="index-row-cell" style="width: 90px;">21</div>
+          <div class="index-row-cell" style="width: 90px;">22</div>
+          <div class="index-row-cell" style="width: 90px;">23</div>
+          <div class="index-row-cell" style="width: 90px;">24</div>
+          <div class="index-row-cell" style="width: 89px;">25</div>
+          <div style="font-size: 14px;">隧道通风系1</div>
+        </div>
+      </template>
+      <el-table-column prop="exhaustFan" label="车站排热风机">
+        <el-table-column prop="tef1" width="90" label-class-name="cyan-label" label="TEF-201-I-1" />
+        <el-table-column prop="tef2" width="90" label-class-name="cyan-label" label="TEF-201-II-1" />
+      </el-table-column>
+      <el-table-column prop="tunnelFan" label="隧道风机">
+        <el-table-column prop="tvf1" width="90" label-class-name="cyan-label" label="TVF-201-I-1" />
+        <el-table-column prop="tvf2" width="90" label-class-name="cyan-label" label="TVF-201-I-2" />
+        <el-table-column prop="tvf3" width="90" label-class-name="cyan-label" label="TVF-201-II-1" />
+        <el-table-column prop="tvf4" width="90" label-class-name="cyan-label" label="TVF-201-II-2" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动组合风量调节阀">
+        <el-table-column prop="md1" width="90" label-class-name="cyan-label" label="MD-201-I-1" />
+        <el-table-column prop="md2" width="90" label-class-name="cyan-label" label="MD-201-I-2" />
+        <el-table-column prop="md3" width="90" label-class-name="cyan-label" label="MD-201-I-3" />
+        <el-table-column prop="md4" width="90" label-class-name="cyan-label" label="MD-201-I-4" />
+        <el-table-column prop="md5" width="90" label-class-name="cyan-label" label="MD-201-I-5" />
+        <el-table-column prop="md6" width="90" label-class-name="cyan-label" label="MD-201-I-6" />
+        <el-table-column prop="md7" width="90" label-class-name="cyan-label" label="MD-201-I-7" />
+        <el-table-column prop="md8" width="90" label-class-name="cyan-label" label="MD-201-I-8" />
+        <el-table-column prop="md9" width="90" label-class-name="cyan-label" label="MD-201-II-1" />
+        <el-table-column prop="md10" width="90" label-class-name="cyan-label" label="MD-201-II-2" />
+        <el-table-column prop="md11" width="90" label-class-name="cyan-label" label="MD-201-II-3" />
+        <el-table-column prop="md12" width="90" label-class-name="cyan-label" label="MD-201-II-4" />
+        <el-table-column prop="md13" width="90" label-class-name="cyan-label" label="MD-201-II-5" />
+        <el-table-column prop="md14" width="90" label-class-name="cyan-label" label="MD-201-II-6" />
+        <el-table-column prop="md15" width="90" label-class-name="cyan-label" label="MD-201-II-7" />
+        <el-table-column prop="md16" width="90" label-class-name="cyan-label" label="MD-201-II-8" />
+      </el-table-column>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+export default {
+    name: 'Ventilation1',
+    data() {
+        return {
+            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
+            tableData: [
+                {code: '415', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '416', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '417', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '418', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '419', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '420', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '421', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '422', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '423', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '424', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '425', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '426', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '427', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '428', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '429', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {}
+            ]
+        };
+    },
+    methods: {
+        rowStyleFunction({row, column, rowIndex, columnIndex}) {
+            if (rowIndex === 15 && columnIndex > 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#0F0'
+                };
+            } else if (columnIndex === 2) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#56E5DE'
+                };
+            } else {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B'
+                };
+            }
+        },
+        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+            if (columnIndex === 1) {
+                if (rowIndex === 0) {
+                    return {
+                        rowspan: 15,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 16 || rowIndex === 15) {
+                    return {
+                        rowspan: 1,
+                        colspan: 2
+                    };
+                } else {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            } else if (columnIndex === 2) {
+                if (rowIndex === 16 || rowIndex === 15) {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                } else {
+                    return {
+                        rowspan: 1,
+                        colspan: 1
+                    };
+                }
+            }
+        },
+        showModeDialog(index) {
+
+        }
+    }
+};
+</script>
+
+<style scoped>
+	.title-0{
+		width: 100%;
+		line-height: 20px;
+		text-align: left;
+		padding-left: 14px;
+	}
+	.index-column-cell {
+		text-align:center;
+		width: 100%;
+		height: 28px;
+		border-top: 1px solid #203244;
+		border-left: 2px solid #A3A3A3;
+		border-bottom: 1px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.index-row-cell {
+		width: 99px;
+		height: 20px;
+		font-size: 14px;
+		line-height: 20px;
+		display: inline-block;
+		border-top: 2px solid #A3A3A3;
+		border-left: 1px solid #203244;
+		border-bottom: 2px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.button-box{
+		text-align: center;
+		background-color: #ccc;
+		float: left;
+		font-size: 12px;
+		color: #333;
+		font-weight: bold;
+		box-sizing: border-box;
+		border-top: 2px solid #fff;
+		border-left: 2px solid #fff;
+		border-right: 2px solid #565656;
+		border-bottom: 2px solid #565656;
+		cursor: pointer;
+	}
+	.button-box.active,
+	.button-box:hover{
+		background: #EBB570;
+		border-top: 2px solid #795B31;
+		border-left: 2px solid #795B31;
+		border-right: 1px solid #fff;
+		border-bottom: 1px solid #fff;
+	}
+</style>
diff --git a/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation2.vue b/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation2.vue
new file mode 100644
index 000000000..2e18ddab2
--- /dev/null
+++ b/src/views/iscs/iscsSystem/config/bas/controlChild/ventilation2.vue
@@ -0,0 +1,249 @@
+<template>
+  <el-table ref="table2" :data="tableData" :header-row-style="tableTitleStyle" :cell-style="rowStyleFunction" :span-method="objectSpanMethod" style="float: left;">
+    <el-table-column type="index" width="20" fixed class-name="index-column">
+      <template slot="header">
+        <div style="width: 100%;height: 26px;background: #FFF" />
+        <div class="index-column-cell">1</div>
+        <div class="index-column-cell">2</div>
+        <div class="index-column-cell">3</div>
+      </template>
+      <template slot-scope="scope">
+        <div class="index-column-cell">{{ scope.$index + 4 }}</div>
+      </template>
+    </el-table-column>
+    <el-table-column fixed width="300">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;">
+          <div class="index-row-cell">1</div>
+          <div class="index-row-cell">2</div>
+          <div class="index-row-cell">3</div>
+        </div>
+        <div class="title-0">全年运行工况</div>
+        <div class="title-0">运行模式号</div>
+        <div class="title-0">模式状态</div>
+        <div class="title-0">火灾指示灯:</div>
+      </template>
+      <template slot-scope="scope">
+        <div v-if="scope.$index == 0">
+          <div style="width: 300px; display: flex;">
+            <div style="width: 100px;display: inline-block;border: 1px solid #FFF;height:112px;margin: auto;">
+              <div style="margin-top: 32px;">下行</div><div>火灾</div>
+            </div>
+            <div style="width: 100px;display: inline-block;">
+              <div style="width: 100px;border: 1px solid #FFF;height:56px;line-height: 56px;">工况1</div>
+              <div style="width: 100px;border: 1px solid #FFF;height:56px;line-height: 56px;">工况2</div>
+            </div>
+            <div style="width: 99px;display: inline-block;">
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">首选</div>
+              <div class="button-box" style="width: 100%;height: 28px;line-height: 28px;" @click="showModeDialog(0)">备选</div>
+            </div>
+          </div>
+			<div style=""></div>
+        </div>
+        <div v-if="scope.$index === 6" style="height: 28px;line-height: 28px;">设备实际运行状态</div>
+        <div v-if="scope.$index === 7">状态比较</div>
+      </template>
+    </el-table-column>
+    <el-table-column :key="11" prop="code" label="模式编号" width="90">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;margin-left: -1px;">4</div>
+          <div style="font-size: 14px;height: 80px;line-height: 80px;">模式编号</div>
+        </div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="smallSystem1">
+      <template slot="header">
+        <div style="font-size: 0;text-align: center;height: 100%;">
+          <div class="index-row-cell" style="width: 90px;">5</div>
+          <div class="index-row-cell" style="width: 90px;">6</div>
+          <div class="index-row-cell" style="width: 90px;">7</div>
+          <div class="index-row-cell" style="width: 90px;">8</div>
+          <div class="index-row-cell" style="width: 90px;">9</div>
+          <div class="index-row-cell" style="width: 90px;">10</div>
+          <div class="index-row-cell" style="width: 90px;">11</div>
+          <div class="index-row-cell" style="width: 89px;">12</div>
+          <div class="index-row-cell" style="width: 90px;">13</div>
+          <div class="index-row-cell" style="width: 90px;">14</div>
+          <div class="index-row-cell" style="width: 90px;">15</div>
+          <div class="index-row-cell" style="width: 90px;">16</div>
+          <div class="index-row-cell" style="width: 90px;">17</div>
+          <div class="index-row-cell" style="width: 90px;">18</div>
+          <div class="index-row-cell" style="width: 90px;">19</div>
+          <div class="index-row-cell" style="width: 89px;">20</div>
+          <div class="index-row-cell" style="width: 90px;">21</div>
+          <div class="index-row-cell" style="width: 90px;">22</div>
+          <div class="index-row-cell" style="width: 90px;">23</div>
+          <div class="index-row-cell" style="width: 90px;">24</div>
+          <div class="index-row-cell" style="width: 89px;">25</div>
+          <div style="font-size: 14px;">隧道通风系1</div>
+        </div>
+      </template>
+      <el-table-column prop="exhaustFan" label="车站排热风机">
+        <el-table-column prop="tef1" width="90" label-class-name="cyan-label" label="TEF-201-I-1" />
+        <el-table-column prop="tef2" width="90" label-class-name="cyan-label" label="TEF-201-II-1" />
+      </el-table-column>
+      <el-table-column prop="tunnelFan" label="隧道风机">
+        <el-table-column prop="tvf1" width="90" label-class-name="cyan-label" label="TVF-201-I-1" />
+        <el-table-column prop="tvf2" width="90" label-class-name="cyan-label" label="TVF-201-I-2" />
+        <el-table-column prop="tvf3" width="90" label-class-name="cyan-label" label="TVF-201-II-1" />
+        <el-table-column prop="tvf4" width="90" label-class-name="cyan-label" label="TVF-201-II-2" />
+      </el-table-column>
+      <el-table-column prop="flowControl" label="电动组合风量调节阀">
+        <el-table-column prop="md1" width="90" label-class-name="cyan-label" label="MD-201-I-1" />
+        <el-table-column prop="md2" width="90" label-class-name="cyan-label" label="MD-201-I-2" />
+        <el-table-column prop="md3" width="90" label-class-name="cyan-label" label="MD-201-I-3" />
+        <el-table-column prop="md4" width="90" label-class-name="cyan-label" label="MD-201-I-4" />
+        <el-table-column prop="md5" width="90" label-class-name="cyan-label" label="MD-201-I-5" />
+        <el-table-column prop="md6" width="90" label-class-name="cyan-label" label="MD-201-I-6" />
+        <el-table-column prop="md7" width="90" label-class-name="cyan-label" label="MD-201-I-7" />
+        <el-table-column prop="md8" width="90" label-class-name="cyan-label" label="MD-201-I-8" />
+        <el-table-column prop="md9" width="90" label-class-name="cyan-label" label="MD-201-II-1" />
+        <el-table-column prop="md10" width="90" label-class-name="cyan-label" label="MD-201-II-2" />
+        <el-table-column prop="md11" width="90" label-class-name="cyan-label" label="MD-201-II-3" />
+        <el-table-column prop="md12" width="90" label-class-name="cyan-label" label="MD-201-II-4" />
+        <el-table-column prop="md13" width="90" label-class-name="cyan-label" label="MD-201-II-5" />
+        <el-table-column prop="md14" width="90" label-class-name="cyan-label" label="MD-201-II-6" />
+        <el-table-column prop="md15" width="90" label-class-name="cyan-label" label="MD-201-II-7" />
+        <el-table-column prop="md16" width="90" label-class-name="cyan-label" label="MD-201-II-8" />
+      </el-table-column>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script>
+export default {
+    name: 'Ventilation1',
+    data() {
+        return {
+            tableTitleStyle: {'text-align': 'center', 'height': '28px', 'padding': '0', 'background': '#45607B'},
+            tableData: [
+                {code: '415', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '416', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '417', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '418', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '419', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '420', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {code: '', tvf1: '打开', tvf2: '打开', tvf3: '半开', tvf4: '半开', tef1: '半开', tef2: '打开', md1: '打开', md2: '关闭', md3: '打开', md4: '打开', md5: '打开', md6: '打开', md7: '打开', md8: '打开', md9: '打开', md10: '打开', md11: '打开', md12: '打开', md13: '打开', md14:'打开', md15: '打开', md16: '打开'},
+                {}
+            ]
+        };
+    },
+    methods: {
+        rowStyleFunction({row, column, rowIndex, columnIndex}) {
+            if (rowIndex === 6 && columnIndex > 1) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#0F0'
+                };
+            } else if (columnIndex === 2) {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B',
+                    'color': '#56E5DE'
+                };
+            } else {
+                return {
+                    'text-align': 'center',
+                    'height': '28px',
+                    'padding': '0',
+                    'background': '#45607B'
+                };
+            }
+        },
+        objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+            if (columnIndex === 1) {
+                if (rowIndex === 0) {
+                    return {
+                        rowspan: 6,
+                        colspan: 1
+                    };
+                } else if (rowIndex === 6 || rowIndex === 7) {
+                    return {
+                        rowspan: 1,
+                        colspan: 2
+                    };
+                } else {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                }
+            } else if (columnIndex === 2) {
+                if (rowIndex === 6 || rowIndex === 7) {
+                    return {
+                        rowspan: 0,
+                        colspan: 0
+                    };
+                } else {
+                    return {
+                        rowspan: 1,
+                        colspan: 1
+                    };
+                }
+            }
+        },
+        showModeDialog(index) {
+
+        }
+    }
+};
+</script>
+
+<style scoped>
+	.title-0{
+		width: 100%;
+		line-height: 20px;
+		text-align: left;
+		padding-left: 14px;
+	}
+	.index-column-cell {
+		text-align:center;
+		width: 100%;
+		height: 28px;
+		border-top: 1px solid #203244;
+		border-left: 2px solid #A3A3A3;
+		border-bottom: 1px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.index-row-cell {
+		width: 99px;
+		height: 20px;
+		font-size: 14px;
+		line-height: 20px;
+		display: inline-block;
+		border-top: 2px solid #A3A3A3;
+		border-left: 1px solid #203244;
+		border-bottom: 2px solid #203244;
+		border-right: 1px solid #203244;
+	}
+	.button-box{
+		text-align: center;
+		background-color: #ccc;
+		float: left;
+		font-size: 12px;
+		color: #333;
+		font-weight: bold;
+		box-sizing: border-box;
+		border-top: 2px solid #fff;
+		border-left: 2px solid #fff;
+		border-right: 2px solid #565656;
+		border-bottom: 2px solid #565656;
+		cursor: pointer;
+	}
+	.button-box.active,
+	.button-box:hover{
+		background: #EBB570;
+		border-top: 2px solid #795B31;
+		border-left: 2px solid #795B31;
+		border-right: 1px solid #fff;
+		border-bottom: 1px solid #fff;
+	}
+</style>