Merge branch 'master' of http://192.168.11.205:9000/r/se-cloud

13693261870

2024-11-27 ad65280d10217df22b9812293c70ab2726c13bd8

Merge branch 'master' of http://192.168.11.205:9000/r/se-cloud

 se-index/src/assets/images/ConditionMonitoring/bg.png

 se-index/src/assets/images/ConditionMonitoring/default.png

 se-index/src/assets/images/ConditionMonitoring/delete.png

 se-index/src/assets/images/ConditionMonitoring/edit.png

 se-index/src/assets/images/ConditionMonitoring/highlight.png

 se-index/src/assets/images/ConditionMonitoring/left.png

 se-index/src/assets/images/ConditionMonitoring/right.png

 se-index/src/assets/img/interactive/call_icon.png

 se-index/src/assets/img/interactive/details.png

 se-index/src/assets/img/interactive/left_bg.png

 se-index/src/assets/img/interactive/left_btn.png

 se-index/src/assets/img/interactive/left_btn_height.png

 se-index/src/assets/img/interactive/refresh_icon.png

 se-index/src/assets/img/interactive/yes.png

 se-index/src/components/ConditionMonitoring.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,410 @@
<template>
  <div class="box">
    <el-row :gutter="10">
      <el-col class="left" :span="4">
        <div style="padding-top: 20px">
          <div
            @click="change(item)"
            v-for="(item, index) in dataArr"
            :key="'butBox' + index"
            class="butBox"
            :style="focus == item ? highlightImg : defaultImg"
          >
            {{ item }}
          </div>
        </div>
      </el-col>
      <el-col class="right" :span="20">
        <div style="height: 100%">
          <div class="boxTop">
            <div style="margin:20px 20px">
            <el-table :data="table1.data">
              <el-table-column width="100" label="平台标志" prop="logo" align="center" >
                <template><div class="bg"></div></template>
              </el-table-column>
              <el-table-column width="200" label="平台名称" prop="name" align="center" ></el-table-column>
              <el-table-column width="100" label="平台类型" prop="type" align="center" >
                <template slot-scope="scope"><div class="type">{{scope.row.type}}</div></template>
              </el-table-column>
              <el-table-column min-width="350" label="平台主页" prop="url" align="center" ></el-table-column>
              <el-table-column width="200" label="平台描述" prop="describe" align="center" ></el-table-column>
              <el-table-column width="100" label="创建者" prop="create" align="center" ></el-table-column>
              <el-table-column width="180" label="创建时间" prop="createTime" align="center" ></el-table-column>
              <el-table-column width="100" label="告警设置" prop="giveAlarm" align="center" >
                <template slot-scope="scope">
                  <el-switch
                  v-model="scope.row.giveAlarm"
                  active-color="#0CB8FF"
                  inactive-color="#ff4949">
                </el-switch></template>
              </el-table-column>
              <el-table-column width="80" label="编辑" align="center">
                <template slot-scope="scope">
                  <div class="edit" @click="handleClick(scope.row)"></div>
                </template>
              </el-table-column>
              <el-table-column label="删除" width="80" align="center">
                <template slot-scope="scope">
                  <div class="delete" @click="handleClick(scope.row)"></div>
                </template>
              </el-table-column>
            </el-table>
            </div>
          </div>
          <div class="boxBottom">
            <el-row :gutter="30">
              <el-col :span="12"> 
                <div  class="box1">
                    <div class="title">{{focus}}</div>
                    <div class="group">
                        <div class="text">启停状态</div>
                        <div class="status">正常启动</div>
                    </div>
                    <div class="group">
                        <div class="text">链接状态</div>
                        <div class="status">正常链接</div>
                    </div>
                    <div class="group">
                        <div class="text">故障时间</div>
                        <div class="status">无故障</div>
                    </div>
                    <div class="group">
                        <div class="text">更新时间</div>
                        <div>2024-11-01 11:08:48</div>
                    </div>
                <div class="log">
                    <div class="logTitle">异常日志</div>
                    <div class="logText">8C-11-C 11:35:(6 00 DE0- bierntomhya;ahi.:mn.nf;, imaint:ga:he店户:famu:"sn,sac:1:</div>
                    <div class="logText">8C-11-C 11:35:(6 00 DE0- bierntomhya;ahi.:mn.nf;, imaint:ga:he店户:famu:"sn,sac:1:</div>
                </div>
                </div>
              </el-col>
              <el-col style="overflow:auto;" :span="12">
                <el-table :data="table2.data">
                  <el-table-column align="center" label="序号" type="index" width="60">
                  </el-table-column>
                  <el-table-column
                    v-for="(item, index) in table2.tableTh"
                    :key="index"
                    :label="item.label"
                    :prop="item.prop"
                    align="center"
                  >
                  </el-table-column>
                  <el-table-column label="操作" min-width="60" align="center">
                    <template slot-scope="scope">
                      <el-button
                        type="primary"
                        @click="handleClick(scope.row)"
                        size="small"
                        >检验</el-button
                      >
                    </template>
                  </el-table-column>
                </el-table>
              </el-col>
            </el-row>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: "ConditionMonitoring",
  data() {
    return {
      focus: "作战概念开发与验证平台",
      highlightImg: {
        backgroundImage: `url(${require("@/assets/images/ConditionMonitoring/highlight.png")})`,
      },
      defaultImg: {
        backgroundImage: `url(${require("@/assets/images/ConditionMonitoring/default.png")})`,
      },
      dataArr: [
        "作战概念开发与验证平台",
        "作战系统设计与评估平台",
        "作战方案推演与分析平台",
        "战法创新与作战运用研究平台",
        "战略综合集成研讨厅",
        "态势显示分系统",
        "综合管控分系统",
        "数据管理分系统",
        "仿真资源管理系统",
      ],
      table2: {
        data: [
          {
            subsystemName: "作战概念开发与验证平台",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "作战系统设计与评估平台",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "作战方案推演与分析平台",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "战法创新与作战运用研究平台",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "战略综合集成研讨厅",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "态势显示分系统",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "综合管控分系统",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "数据管理分系统",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
          {
            subsystemName: "仿真资源管理系统",
            interactionStatus: "正常",
            updateTime: "2024-01-26",
          },
        ],
        tableTh: [
          {
            label: "分系统名称",
            prop: "subsystemName",
          },
          {
            label: "交互状态",
            prop: "interactionStatus",
          },
          {
            label: "更新时间",
            prop: "updateTime",
          },
        ],
      },
      table1: {
        data: [
          {
            name: "作战概念开发与验证平台",
            type: "默认应用",
            url: "http://10.64.33.1859080/imcloud2/e/space/task?id=1762040579103117314",
            describe: "",
            create:"管理员",
            createTime: "2024-02-26 17:03:06",
            giveAlarm: true,
          }
        ],
      },
    };
  },
  methods: {
    change(value) {
      this.focus = value;
      this.table1.data.name = value
      this.table1 = {
        data: [
          {
            name: value,
            type: "默认应用",
            url: "http://10.64.33.1859080/imcloud2/e/space/task?id=1762040579103117314",
            describe: "",
            create:"管理员",
            createTime: "2024-02-26 17:03:06",
            giveAlarm: true,
          }
        ],
      }
    },
    handleClick(row) {},
  },
};
</script>

<style lang="less" scoped>
.box {
  width: 100%;
  height: 100%;
  .el-row {
    height: 100%;
    padding: 0 20px 20px;
    .el-col {
      height: 100%;
    }
  }
  .left {
    background-size: 100% 100%;
    background-image: url("~@/assets/images/ConditionMonitoring/left.png");
    .butBox {
      width: 90%;
      margin: 0px auto 30px;
      text-align: center;
      height: 40px;
      line-height: 40px;
      font-size: 18px;
      cursor: pointer;
      background-size: 100% 100%;
      color: #fff;
    }
  }
  .right {
    background-image: url("~@/assets/images/ConditionMonitoring/right.png");
    background-size: 100% 100%;
    .boxTop {
      width: 100%;
      height: 20%;
      // margin-bottom: 20px;
      .type{
        width: 75px;
        height: 25px;
        line-height: 22px;
        background: #066932;
        color: #22C707;
        box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.35);
        border-radius: 4px;
        border: 1px solid #FFFFFF;
        margin:0 auto;
      }
      .bg{
        width: 50px;
        height: 50px;
        margin:0 auto;
        background-image: url("~@/assets/images/ConditionMonitoring/bg.png");
        background-size: 100% 100%;
      }
      .edit{
        width: 38px;
        height: 38px;
        margin:0 auto;
        background-image: url("~@/assets/images/ConditionMonitoring/edit.png");
        background-size: 100% 100%;
      }
      .delete{
        width: 38px;
        height: 38px;
        margin:0 auto;
        background-image: url("~@/assets/images/ConditionMonitoring/delete.png");
        background-size: 100% 100%;
      }
    }
    .boxBottom {
      width: 100%;
      height: 78%;
      .box1{
        width: 100%;
        height: 100%;
        background-color: #2D4C9E;
            color: #fff;
        .title{
            padding-top:20px;
            margin-bottom:10px;
            font-size: 24px;
            margin-left:15px;
        }
        .group{
            display: flex;
            line-height: 37px;
            height: 37px;
            font-size: 20px;
            font-weight: 400;
            margin-bottom:4px;
            .text{
                width: 130px;
                text-align: center;
            }
            .status{
                width: 115px;
                // height:37px;
                text-align: center;
                background-color: #00E572;
            }
        }
        .log{
            width: 88%;
            height: 56%;
            background-color: #181C40;
            margin:20px auto 0;
            padding:10px 20px;
            .logTitle{
                width: auto;
                height: 30px;
                // font-family: Source Han Sans SC;
                font-weight: 400;
                font-size: 24px;
                color: #0CB8FF;
                // line-height: 10px;
            }
            .logText{
                line-height: 30px;
                width: 100%;
                overflow: hidden;
            }
        }
      }
    }
  }
}
/deep/ .el-table {
  background-color: rgba(0, 0, 0, 0);
  .computeNode {
    background-image: url("~@/assets/images/InferentialTaskControl/computeNode.png");
    background-size: 100% 100%;
    width: 35px;
    height: 35px;
    margin: 0 auto;
  }
  thead {
    tr {
      th {
        background-color: #1C305F;
        border-bottom: 0px;
        .cell {
          font-weight: 400;
          font-size: 18px;
          color: #fff;
          text-shadow: 0px 0px 2px #00fbff;
        }
      }
    }
  }
  tbody {
    tr {
      background-color: rgba(0, 0, 0, 0);
      td {
        background-color: #181C40;
        border-bottom: 0px;
        .cell {
          font-size: 16px;
          color: #fff;
        }
      }
    }
    tr:hover {
    //   border: 2px solid #4b96dd;
      td {
        background-color: #2d468b;
        .cell {
          color: #fff;
        }
      }
    }
  }
}
/deep/ .el-table::before {
  height: 0px;
}
</style>

 se-index/src/components/InferentialTaskControl.vue

@@ -223,7 +223,7 @@
  height: 85%;
  background-image: url("~@/assets/images/InferentialTaskControl/bg.png");
  background-size: 100% 100%;
  margin: 5% 5% 0;
  margin: 0 5% 0;
  padding: 10px 1% 20px;
}
/deep/ .el-form-item__label {

 se-index/src/components/door.vue

@@ -37,7 +37,7 @@
            },
            {
              name: "分系统状态监控",
              url: ""
              url: "/home/ConditionMonitoring"
            }
          ]
        },
@@ -90,10 +90,12 @@
  padding: 0 60px;
  display: flex;
  justify-content: space-between;
  height: 100%;
  .item {
    width: 554px;
    height: 830px;
    height: 90%;
    background: url("../assets/img/home/door_bg.png");
    background-size: 100% 100%;
    .title {
      position: relative;
      font-family: Source Han Sans SC;

 se-index/src/components/home.vue

@@ -117,7 +117,7 @@
  }
  .content {
    width: 100%;
    height:calc(100vh - 183px);
    height:calc(100vh - 147px);
    margin-top: 60px;
  }
}

 se-index/src/components/interactive.vue

@@ -1,11 +1,575 @@
<template>
  <div class="interactive">
    <h1>1111111111</h1>
    <div class="left">
      <div
        :class="leftBtnName == item ? 'btn-height' : 'btn'"
        v-for="(item, index) in leftBtnList"
        :key="index"
        @click="leftBtnClick(item, index)"
      >
        {{ item }}
      </div>
    </div>
    <div class="right">
      <div class="select">
        <div class="log">
          <div class="name">通道异常日志</div>
          <div class="sum">1</div>
        </div>
        <div class="from">
          <el-form style="margin-bottom: 20px" label-width="120px">
            <el-row style="height: 50px">
              <el-form-item style="float: left" label="信源：">
                <el-select
                  :popper-append-to-body="false"
                  v-model="source.value"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in source.options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item style="float: left" label="信宿：">
                <el-select
                  :popper-append-to-body="false"
                  v-model="destination.value"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in destination.options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item style="float: left" label="传输方式：">
                <el-select
                  :popper-append-to-body="false"
                  v-model="transmission.value"
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in transmission.options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-row>
          </el-form>
        </div>
        <div class="refresh">
          <img src="../assets/img/interactive/refresh_icon.png" alt="" />
          <div class="name">刷新</div>
        </div>
        <div class="call">
          <img src="../assets/img/interactive/call_icon.png" alt="" />
          <div class="name">全部报警</div>
        </div>
      </div>
      <el-table :data="table.data" height="85%">
        <el-table-column label="信源" width="150px">
          <template slot-scope="scope">
            <div>
              {{ scope.row.source }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="信宿">
          <template slot-scope="scope">
            <div>
              {{ scope.row.destination }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="传输方式">
          <template slot-scope="scope">
            <div>
              {{ scope.row.transmission }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="状态">
          <template>
            <img src="../assets/img/interactive/yes.png" alt="" />
          </template>
        </el-table-column>
        <el-table-column label="描述">
          <template slot-scope="scope">
            <div>
              {{ scope.row.describe }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="传输数据">
          <template slot-scope="scope">
            <div>
              {{ scope.row.transfer }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="故障报警">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.call"> </el-switch>
          </template>
        </el-table-column>
        <el-table-column label="异常处理">
          <template slot-scope="scope">
            <div>
              {{ scope.row.abnormal }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="更新时间">
          <template slot-scope="scope">
            <div>
              {{ scope.row.time }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="健康">
          <template>
            <img src="../assets/img/interactive/yes.png" alt="" />
          </template>
        </el-table-column>
        <el-table-column label="可用">
          <template>
            <img src="../assets/img/interactive/yes.png" alt="" />
          </template>
        </el-table-column>
        <el-table-column label="详情">
          <template>
            <img
              src="../assets/img/interactive/details.png"
              alt=""
              @click="detailsClick"
            />
          </template>
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="10"
          layout="total, sizes, prev, pager, next, jumper"
          :total="40"
        >
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
export default {};
export default {
  data() {
    return {
      leftBtnList: ["交互通道管理", "交互过程监控"],
      leftBtnName: "交互通道管理",
      source: {
        options: [
          {
            value: "qx102stect1",
            label: "qx102stect1"
          },
          {
            value: "qx102stect2",
            label: "qx102stect2"
          }
        ],
        value: ""
      },
      destination: {
        options: [
          {
            value: "qx102stect1",
            label: "qx102stect1"
          },
          {
            value: "qx102stect2",
            label: "qx102stect2"
          }
        ],
        value: ""
      },
      transmission: {
        options: [
          {
            value: "qx102stect1",
            label: "qx102stect1"
          },
          {
            value: "qx102stect2",
            label: "qx102stect2"
          }
        ],
        value: ""
      },
      table: {
        data: [
          {
            source: "数据管理分系统",
            destination: "分系统",
            transmission: "消息中间件",
            state: "",
            describe: "系统管理服务数裾",
            transfer: "",
            call: "",
            abnormal: "通道断开",
            time: "2024-11-05 09:51:34",
            healthy: "是",
            available: "是",
            details: ""
          },
          {
            source: "数据管理分系统",
            destination: "分系统",
            transmission: "消息中间件",
            state: "是",
            describe: "网关服务",
            transfer: "",
            call: "",
            abnormal: "传输超时",
            time: "2024-11-05 18:20:04",
            healthy: "是",
            available: "是",
            details: ""
          }
        ],
        tableTh: [
          {
            label: "信源",
            prop: "source"
          },
          {
            label: "信宿",
            prop: "destination"
          },
          {
            label: "传输方式",
            prop: "transmission"
          },
          {
            label: "状态",
            prop: "state"
          },
          {
            label: "描述",
            prop: "describe"
          },
          {
            label: "传输数据",
            prop: "transfer"
          },
          {
            label: "故障报警",
            prop: "call"
          },
          {
            label: "异常处理",
            prop: "abnormal"
          },
          {
            label: "更新时间",
            prop: "time"
          },
          {
            label: "健康",
            prop: "healthy"
          },
          {
            label: "可用",
            prop: "available"
          },
          {
            label: "详情",
            prop: "details"
          }
        ]
      },
      currentPage: 4
    };
  },
  methods: {
    leftBtnClick(item, index) {
      this.leftBtnName = item;
    },
    detailsClick() {},
    handleSizeChange(val) {
      console.log(`每页 ${val} æ¡`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    }
  }
};
</script>

<style lang="less" scope></style>
<style lang="less" scoped>
.interactive {
  padding: 20px 30px;
  display: flex;
  height: 100%;
  .left {
    padding-top: 20px;
    width: 320px;
    height: 90%;
    background: url("../assets/img/interactive/left_bg.png") no-repeat;
    background-size: 100% 100%;
    font-family: Source Han Sans SC;
    font-weight: 400;
    font-size: 18px;
    color: #ffffff;
    .btn {
      margin: 20px auto;
      width: 268px;
      height: 43px;
      line-height: 43px;
      text-align: center;
      background: url("../assets/img/interactive/left_btn.png");
    }
    .btn-height {
      margin: 20px auto;
      width: 268px;
      height: 43px;
      line-height: 43px;
      text-align: center;
      background: url("../assets/img/interactive/left_btn_height.png");
    }
  }
  .right {
    position: relative;
    margin-left: 30px;
    padding-top: 20px;
    height: 90%;
    .select {
      display: flex;
      .log {
        position: relative;
        width: 128px;
        height: 48px;
        background: radial-gradient(circle, #00c0fa 0%, #015eea 100%);
        border-radius: 6px;
        .name {
          width: 100%;
          height: 100%;
          text-align: center;
          line-height: 48px;
          font-family: Source Han Sans SC;
          font-weight: 400;
          font-size: 18px;
          color: #ffffff;
        }
        .sum {
          position: absolute;
          right: -10px;
          top: -10px;
          width: 25px;
          height: 25px;
          text-align: center;
          line-height: 25px;
          background: #10ad40;
          border-radius: 50%;
          border: 1px solid #ffffff;
          font-size: 14px;
          color: #ffffff;
        }
      }
      .from {
        margin-left: 300px;
      }
      .refresh {
        margin-left: 10px;
        display: flex;
        align-items: center;
        width: 76px;
        height: 50px;
        line-height: 50px;
        background: #015eea;
        border-radius: 6px;
        font-size: 18px;
        color: #ffffff;
        img {
          margin-left: 5px;
          width: 23px;
          height: 23px;
        }
        .name {
          margin-left: 5px;
        }
      }
      .call {
        margin-left: 10px;
        display: flex;
        align-items: center;
        width: 115px;
        height: 49px;
        line-height: 49px;
        background: #083d62;
        border-radius: 6px;
        border: 1px solid #4b96dd;
        font-size: 18px;
        color: #ffffff;
        img {
          margin-left: 5px;
          width: 23px;
          height: 23px;
        }
        .name {
          margin-left: 5px;
        }
      }
    }
    .block {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      /deep/.el-pagination__total {
        margin-top: 8px;
        font-size: 18px;
        color: #ffffff;
      }
      /deep/.el-input__inner {
        width: 110px;
        height: 40px;
        font-size: 18px;
      }
      /deep/.btn-prev {
        margin-top: 6px;
        color: #fff;
        background: rgba(0, 0, 0, 0);
      }
      /deep/.btn-next {
        margin-top: 6px;
        color: #fff;
        background: rgba(0, 0, 0, 0);
      }
      /deep/.el-pager {
        margin-top: 6px;
        .number {
          background: rgba(0, 0, 0, 0);
          font-size: 18px;
          color: #fff;
        }
        .active {
          color: #0cb8ff;
        }
      }
      /deep/.el-icon {
        font-size: 16px;
      }
      /deep/.el-pagination__jump {
        font-size: 18px;
        color: #fff;
      }
      /deep/.el-pagination__editor {
        width: 100px;
        margin-left: 10px;
        .el-input__inner {
          width: 60px;
          background: rgba(0, 0, 0, 0);
          border: 1px solid #409eff;
          color: #fff;
          font-size: 18px;
        }
      }
    }
  }
}
/deep/ .el-form-item__label {
  margin-top: 5px;
  color: #fff;
  font-size: 16px;
}
/deep/ .el-select {
  input {
    border: 1px solid #4b96dd;
    background-color: rgba(0, 0, 0, 0);
    color: #ddd;
    height: 50px;
    width: 160px;
    font-size: 16px;
  }
}
/deep/ .el-select-dropdown {
  border: 1px solid #4b96dd;
  background-color: #091631;
  .el-select-dropdown__item.hover,
  .el-select-dropdown__item:hover {
    background-color: #2d4c9e;
    color: #fff;
  }
  .el-select-dropdown__item {
    color: #bbb;
  }
}

/deep/ .el-table {
  background-color: rgba(0, 0, 0, 0);
  
  thead {
    tr {
  
      th {
        background-color: #2d4c9e;
        border-bottom: 0px;
        .cell {
          font-weight: 400;
          font-size: 20px;
          color: #fff;
          text-shadow: 0px 0px 2px #00fbff;
        }
      }
    }
  }
  tbody {
    font-size: 16px;
    color: #fff;
    tr {
      background-color: rgba(0, 0, 0, 0);
      td {
        background-color: rgba(0, 0, 0, 0);
        border-bottom: 0px;
      }
    }
    tr:hover {
      border: 2px solid #4b96dd;
      td {
        background-color: #2d4c9e;
      }
    }
  }
}
/deep/ .el-table::before {
  height: 0px;
}
</style>

<style>
.el-select-dropdown {
  border: 1px solid #4b96dd;
  background-color: #091631;
}
.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover {
  background-color: #2d4c9e;
  color: #fff;
}
.el-select-dropdown__item {
  color: #bbb;
}


</style>

 se-index/src/router/index.js

@@ -42,6 +42,11 @@
        name:'推演任务控制',
        component: () => import("@/components/InferentialTaskControl.vue")
      },
      {
        path: "ConditionMonitoring",
        name:'分系统状态监控',
        component: () => import("@/components/ConditionMonitoring.vue")
      },
    ]
  }
];