he wei
2023-04-11 367a46ace6eb1be38288e356d97ccf7d62ca89fd
src/views/home/home-monitor.vue
@@ -6,99 +6,64 @@
        <div class="main-view">
          <div class="side">
            <div class="dischargTask">
              <card-box title="今日放电任务" content-class="task-content">
                <template #tools>
                  <el-radio-group size="mini" v-model="taskLevel">
                    <el-radio-button :label="0">按状态</el-radio-button>
                    <el-radio-button :label="1">按站点</el-radio-button>
                  </el-radio-group>
                </template>
              <card-box title="今日放电站点" content-class="task-content">
                <div class="row row-desc">
                  <div class="col col1">
                    <div class="label">放电站点:</div>
                    <div class="value">{{ plan.sum }}</div>
                    <div class="label">核容放电站点:</div>
                    <div class="value">{{ charge.hrNum }}</div>
                  </div>
                  <div class="col col2">
                    <div class="label">进行中:</div>
                    <div class="value">{{ plan.runList.length }}</div>
                  </div>
                  <div class="col col3">
                    <div class="label">未执行:</div>
                    <div class="value">{{ plan.waitList.length }}</div>
                    <div class="label">停电放电站点:</div>
                    <div class="value">{{ charge.tdNum }}</div>
                  </div>
                </div>
                <div class="content-wrap">
                  <div class="scroller">
                    <!-- 手风琴 -->
                    <el-collapse v-if="0 == taskLevel" accordion class="collapse">
                      <el-collapse-item class="collapse-item" :disabled="!plan.runList.length">
                    <el-collapse accordion class="collapse">
                      <el-collapse-item class="collapse-item hr" :disabled="!charge.hrNum">
                        <template #title>
                          <div class="title">进行中</div>
                          <div class="count">{{ plan.runList.length }}</div>
                          <div class="title">核容放电</div>
                          <div class="count">{{ charge.hrNum }}</div>
                        </template>
                        <!-- 内容 -->
                        <div class="list-item" v-for="(item, idx) in plan.runList" :key="'run_' + idx">
                        <div class="list-item" v-for="(item, idx) in charge.hrList" :key="'run_' + idx">
                          <el-tooltip class="item" effect="dark" placement="top-start" :content="item.stationName3">
                            <div class="station">{{ item.stationName3 }}</div>
                          </el-tooltip>
                          <div class="node">{{ item.nodeStation ? '节点站' : '非节点站' }}</div>
                          <div class="start-time">放电开始时间{{ item.dischargeStarttime }}</div>
                          <div class="test-time">累计放电{{ item.timeLong }}</div>
                          <div class="btn" @click="goPlan(item)">查看</div>
                          <div class="btn" @click="goRT(item)">实时</div>
                        </div>
                        <div class="btn-grp">
                          <el-button size="mini" type="primary" @click="goDevStatus(2)">查看更多</el-button>
                        </div>
                      </el-collapse-item>
                      <el-collapse-item class="collapse-item" :disabled="!plan.waitList.length">
                      <el-collapse-item class="collapse-item td" :disabled="!charge.tdNum">
                        <template #title>
                          <div class="title">未执行</div>
                          <div class="count">{{ plan.waitList.length }}</div>
                          <div class="title">停电放电</div>
                          <div class="count">{{ charge.tdNum }}</div>
                        </template>
                        <!-- 内容 -->
                        <div class="list-item" v-for="(item, idx) in plan.waitList" :key="'wait_' + idx">
                          <el-tooltip class="item" effect="dark" placement="top-start" :content="item.stationName3">
                            <div class="station">{{ item.stationName3 }}</div>
                          </el-tooltip>
                          <div class="node">{{ item.nodeStation ? '节点站' : '非节点站' }}</div>
                          <div class="start-time">放电开始时间{{ item.dischargeStarttime }}</div>
                          <div class="test-time">累计放电---</div>
                          <div class="btn" @click="goPlan(item)">查看</div>
                        </div>
                      </el-collapse-item>
                    </el-collapse>
                    <el-collapse v-if="1 == taskLevel" accordion class="collapse">
                      <el-collapse-item class="collapse-item" :disabled="!plan.nodeList.length">
                        <template #title>
                          <div class="title">节点站</div>
                          <div class="count">{{ plan.nodeList.length }}</div>
                        </template>
                        <!-- 内容 -->
                        <div class="list-item" v-for="(item, idx) in plan.nodeList" :key="'node_' + idx">
                        <div class="list-item" v-for="(item, idx) in charge.tdList" :key="'wait_' + idx">
                          <el-tooltip class="item" effect="dark" placement="top-start" :content="item.stationName3">
                            <div class="station">{{ item.stationName3 }}</div>
                          </el-tooltip>
                          <div class="node">{{ item.nodeStation ? '节点站' : '非节点站' }}</div>
                          <div class="start-time">放电开始时间{{ item.dischargeStarttime }}</div>
                          <div class="test-time">累计放电{{ item.timeLong }}</div>
                          <div class="btn" @click="goPlan(item)">查看</div>
                          <div class="btn" @click="goRT(item)">实时</div>
                        </div>
                      </el-collapse-item>
                      <el-collapse-item class="collapse-item" :disabled="!plan.normalList.length">
                        <template #title>
                          <div class="title">普通站</div>
                          <div class="count">{{ plan.normalList.length }}</div>
                        </template>
                        <!-- 内容 -->
                        <div class="list-item" v-for="(item, idx) in plan.normalList" :key="'normal_' + idx">
                          <el-tooltip class="item" effect="dark" placement="top-start" :content="item.stationName3">
                            <div class="station">{{ item.stationName3 }}</div>
                          </el-tooltip>
                          <div class="node">{{ item.nodeStation ? '节点站' : '非节点站' }}</div>
                          <div class="start-time">放电开始时间{{ item.dischargeStarttime }}</div>
                          <div class="test-time">累计放电{{ item.timeLong }}</div>
                          <div class="btn" @click="goPlan(item)">查看</div>
                        <div class="btn-grp">
                          <el-button size="mini" type="primary" @click="goDevStatus(3)">查看更多</el-button>
                        </div>
                      </el-collapse-item>
                    </el-collapse>
                  </div>
                </div>
                <div class="btn-grp">
                  <el-button size="mini" type="primary" @click="goDevStatus(-1)">更多站点状态</el-button>
                </div>
              </card-box>
            </div>
@@ -112,7 +77,7 @@
                </template>
                <div class="row row-desc">
                  <div class="col col1">
                    <div class="label">告警站点:</div>
                    <div class="label">告警总数:</div>
                    <div class="value">{{ alarm.sum }}</div>
                  </div>
                  <div class="col col2">
@@ -128,7 +93,7 @@
                  <div class="scroller">
                    <!-- 手风琴 -->
                    <el-collapse v-if="0 == alarmLevel" accordion class="collapse collapse-alarm">
                      <el-collapse-item class="collapse-item" :disabled="!alarm.level1Sum">
                      <el-collapse-item class="collapse-item level1" :disabled="!alarm.level1Sum">
                        <template #title>
                          <div class="title">一级告警</div>
                          <div class="count">{{ alarm.level1Sum }}</div>
@@ -150,7 +115,7 @@
                          <div class="item-icon el-icon-arrow-right"></div>
                        </div>
                      </el-collapse-item>
                      <el-collapse-item class="collapse-item" :disabled="!alarm.level2Sum">
                      <el-collapse-item class="collapse-item level2" :disabled="!alarm.level2Sum">
                        <template #title>
                          <div class="title">二级告警</div>
                          <div class="count">{{ alarm.level2Sum }}</div>
@@ -172,7 +137,7 @@
                          <div class="item-icon el-icon-arrow-right"></div>
                        </div>
                      </el-collapse-item>
                      <el-collapse-item class="collapse-item" :disabled="!alarm.level3Sum">
                      <el-collapse-item class="collapse-item level3" :disabled="!alarm.level3Sum">
                        <template #title>
                          <div class="title">三级告警</div>
                          <div class="count">{{ alarm.level3Sum }}</div>
@@ -194,7 +159,7 @@
                          <div class="item-icon el-icon-arrow-right"></div>
                        </div>
                      </el-collapse-item>
                      <el-collapse-item class="collapse-item" :disabled="!alarm.level4Sum">
                      <el-collapse-item class="collapse-item level4" :disabled="!alarm.level4Sum">
                        <template #title>
                          <div class="title">四级告警</div>
                          <div class="count">{{ alarm.level4Sum }}</div>
@@ -268,14 +233,12 @@
  mixins: [WSMixin],
  data() {
    return {
      taskLevel: 0,
      alarmLevel: 0,
      plan: {
        sum: 0,
        runList: [],
        waitList: [],
        nodeList: [],
        normalList: [],
      charge: {
        hrNum: 0,
        tdNum: 0,
        hrList: [],
        tdList: [],
      },
      alarm: {
        sum: 0,
@@ -316,46 +279,47 @@
      // console.log(res, "=====111data");
      let {
        bAlmRes,
        planRes,
        bDebRes,
        bPwrRes,
        stationMap,
        chargeRes,
      } = res.data;
      // 更新地图
      if (this.$refs.map) {
        this.updateMap(stationMap);
      }
      this.formatPlan(planRes);
      this.formatCharge(chargeRes);
      this.formatAlarm(bAlmRes, bDebRes, bPwrRes);
    },
    formatPlan(res) {
    formatCharge(res) {
      let { code, data, data2 } = res;
      if (code && data) {
        // console.log(data2);
        let nowTime = data2.nowTime;
        const getTimeLong = (time) => formatSeconds(Math.ceil((new Date(nowTime).getTime() - new Date(time).getTime()) / 1000));
        this.plan.sum = data2.disNumAll;
        this.plan.runList = data2.stateMap.state3;
        this.plan.waitList = data2.stateMap.state0.map((v) => ({
          ...v,
          timeLong: getTimeLong(v.dischargeStarttime)
        }));
        this.plan.nodeList = data2.nodeMap.node1.map((v) => {
          if (3 == v.dischargeState) {
            v.timeLong = getTimeLong(v.dischargeStarttime);
          } else {
            v.timeLong = '---';
          }
          return v;
        let {
          stateNumMap: {
            state2: hrNum,
            state3: tdNum,
          },
          stateMap: {
            state2: hrList,
            state3: tdList,
          },
          nowTime,
        } = data2;
        // const getTimeLong = (time) => formatSeconds(Math.ceil((new Date(nowTime).getTime() - new Date(time).getTime()) / 1000));
        hrList.map(v => {
          let rtstate = v.rtstate || {battTestStarttime: 0, battTestTlong: 0};
          v.dischargeStarttime = formatSeconds(rtstate.battTestStarttime);
          v.timeLong = formatSeconds(rtstate.battTestTlong);
        });
        this.plan.normalList = data2.nodeMap.node0.map((v) => {
          if (3 == v.dischargeState) {
            v.timeLong = getTimeLong(v.dischargeStarttime);
          } else {
            v.timeLong = '---';
          }
          return v;
        });
        this.charge.hrNum = hrNum;
        this.charge.tdNum = tdNum;
        this.charge.hrList = hrList;
        this.charge.tdList = tdList;
      } else {
        this.charge.hrNum = 0;
        this.charge.tdNum = 0;
        this.charge.hrList = [];
        this.charge.tdList = [];
      }
    },
    formatAlarm(alarmRes, devRes, pwrRes) {
@@ -391,13 +355,9 @@
      const getColor = (o) => {
        let res = 0;
        if (o.fbs9100State) {
          if (o.fbs9100State.devOnlinevollow) {
            res = 5;
          } else {
            res = o.fbs9100State.devWorkstate
          }
          res = o.fbs9100State.devWorkstate <= 3 ? o.fbs9100State.devWorkstate : 0;
        }
        return ['#0081ff', '#ff6b6c', '#66f842', 'transparent', 'transparent', '#7668f9'][res];
        return ['#0081ff', '#66f842', '#ff6b6c', '#7668f9'][res];
      };
      this.$refs.map.setData(data.map(v => {
        return {
@@ -437,15 +397,29 @@
        }
      });
    },
    goPlan(data) {
      let { stationName1, stationName, dischargeState } = data;
    goRT(obj) {
      let search =
        "?province=" +
        obj.stationName1 +
        "&city=" +
        obj.stationName2 +
        "&county=" +
        obj.stationName5 +
        "&home=" +
        obj.stationName3 +
        "&batt=" + obj.battGroupId +
        // list组件重载
        "&listReload=1";
      this.$router.push("/dataTest/movingRingSystem/" + search);
    },
    goDevStatus(status) {
      this.$router.push({
        path: '/jobManage/planManage',
        path: '/dataTest/btsStatus',
        query: {
          stationName1, stationName, dischargeState
          status
        }
      });
    }
    },
  },
  mounted() {
@@ -490,7 +464,7 @@
    }
    .label {
      width: 5.6em;
      width: 6.6em;
    }
    .col3 .label {
@@ -550,7 +524,7 @@
    }
    /deep/ .el-collapse-item__header {
      height: 72px;
      height: 62px;
      padding-left: 0.8em;
      padding-right: 0.8em;
      color: #00fefe;
@@ -750,4 +724,37 @@
    }
  }
}
.btn-grp {
  text-align: center;
  padding: 4px 0;
}
.list-item+.btn-grp {
  background: #034b63;
}
.hr.collapse-item /deep/ .el-collapse-item__header {
  background: #1ae008;
}
.td.collapse-item /deep/ .el-collapse-item__header {
  background: #0955f7;
}
.level1.collapse-item /deep/ .el-collapse-item__header {
  background: #d5001d;
}
.level2.collapse-item /deep/ .el-collapse-item__header {
  background: #f59a23;
}
.level3.collapse-item /deep/ .el-collapse-item__header {
  background: #eeea3a;
}
.level4.collapse-item /deep/ .el-collapse-item__header {
  background: #d7d7d7;
}
</style>