project-neic/src/components/area/ControlArea.vue

/* 控制区 */
<template>
  <gy-card
    title="控制区"
    area-style="control"
    circle-style="green"
    content-style="44"
    @contextmenu="contextmenu"
  >
    <ControlMatrixCard
      title="待启动"
      :datas="ls.start"
      :operateStyle="1"
      ref="start"
    ></ControlMatrixCard>
    <ControlMatrixCard
      title="待停机"
      :datas="ls.stop"
      :operateStyle="2"
      ref="stop"
    ></ControlMatrixCard>
    <ControlMatrixCard
      title="待维护"
      :datas="ls.maintain"
      :operateStyle="6"
      ref="maintain"
    ></ControlMatrixCard>
    <ControlMatrixCard
      title="待取消维护"
      :datas="ls.unmaintain"
      :operateStyle="8"
      ref="unmaintain"
    ></ControlMatrixCard>
    <ControlMatrixCard
      title="待复位"
      :datas="ls.reset"
      :operateStyle="5"
      ref="reset"
    ></ControlMatrixCard>
    <el-button
      style="
        z-index: 2;
        position: absolute;
        bottom: 10px;
        right: 10px;
        background: #292929;
        font-size: 15px;
        width: 90px;
        border: none;
        color: rgb(220, 220, 220);
      "
      size="small"
      @click="menuClicked({ type: 'send' })"
      >发送</el-button
    >
  </gy-card>
  <el-button-group
    style="z-index: 3; position: absolute; top: 6px; left: 120px"
  >
    <el-button :class="buttonLeftStyle" size="mini" @click="controlClick(false)"
      >手动</el-button
    >
    <el-button :class="buttonRightStyle" size="mini" @click="controlClick(true)"
      >自动</el-button
    >
  </el-button-group>
</template>

<script>
import ControlMatrixCard from "./windturbine/control/ControlMatrixCard.vue";
import MessageBridge from "../../assets/script/MessageBridge";
import BackgroundData from "../../assets/script/BackgroundData";

export default {
  name: "ControlArea",
  components: {
    ControlMatrixCard,
  },
  props: {},
  computed: {
    buttonLeftStyle: function () {
      return this.IsAutoControl ? "button-unselected" : "button-selected";
    },
    buttonRightStyle: function () {
      return this.IsAutoControl ? "button-selected" : "button-unselected";
    },
  },
  created: function () {
    this.initData();
  },
  data() {
    return {
      ls: {
        start: { key: "待启动", value: [] },
        stop: { key: "待停机", value: [] },
        maintain: { key: "待维护", value: [] },
        unmaintain: { key: "待取消维护", value: [] },
        reset: { key: "待复位", value: [] },
      },
      IsAutoControl: false,
      controlErorCodes:[
        "控制成功",
        "控制命令发送失败",
        "无效的控制地址",
        "被控设备异常",
        "网络连接错误,检查场站通信",
        "控制结果读取超时",
        "未知错误",
        "控制命令错误",
        "收到无法识别数据",
        "未读取到数据包",
        "未知错误",
        "风机操作过频繁",
        "风机被挂牌",
        "风机操作与风机状态不符",
        "需要登录",
      ],
    };
  },
  methods: {
    initData: function () {
      var mb = MessageBridge.getInstance();
      var vs = [{ key: "/topic/suggestion", action: this.suggestion }];
      mb.register(vs);
    },
    suggestion(msg, headers) {
      var val = JSON.parse(msg);
      var tp = headers["operate-type"];
      if (tp == "UnMaintain") {
        this.updateSuggestion(this.ls.unmaintain.value, val);
      } else if (tp == "Start") {
        //推荐启动
        this.updateSuggestion(this.ls.start.value, val);
      } else if (tp == "Stop") {
        // 推荐停机
        this.updateSuggestion(this.ls.stop.value, val);
      } else if (tp == "Reset") {
        // 推荐复位
        this.updateSuggestion(this.ls.reset.value, val);
      } else if (tp == "Maintain") {
        // 推荐维护
        this.updateSuggestion(this.ls.maintain.value, val);
      }
    },

    /* 获取推荐类型 */
    getSuggestionType(val) {
      if (typeof val === "undefined") return null;
      for (var v in val) {
        return val[v].adviceOperateStyle;
      }
      return null;
    },

    /* 更新推荐数据 */
    updateSuggestion(ll, val) {
      var lls = new Array();
      for (var v1 in ll) {
        var v2 = val[ll[v1]];
        if (typeof v2 === "undefined") {
          lls.push(v1);
        }
      }
      for (var v3 in lls) {
        ll.splice(v3, 1);
      }
      for (var v in val) {
        var vl = val[v];
        if (!ll.includes(vl.windturbineId)) {
          ll.push(vl.windturbineId);
        }
      }
    },

    /* 右键菜单 */
    contextmenu() {
      const { remote } = require("electron");
      var that = this;
      const menuTemplate = [
        {
          label: "发送",
          click() {
            that.menuClicked({ type: "send" });
          },
        },
        {
          label: "挂牌",
          submenu: [
            {
              label: "检修",
              click() {
                that.menuClicked({ type: "lock", value: "CheckLock" });
              },
            },
            {
              label: "故障维修",
              click() {
                that.menuClicked({ type: "lock", value: "FaultLock" });
              },
            },
            {
              label: "场内受累检修",
              click() {
                that.menuClicked({ type: "lock", value: "StationCheckLock" });
              },
            },
            {
              label: "场内受累故障",
              click() {
                that.menuClicked({ type: "lock", value: "StationFaulLock" });
              },
            },
            {
              label: "场外受累电网",
              click() {
                that.menuClicked({
                  type: "lock",
                  value: "StationPowerLineLock",
                });
              },
            },
            {
              label: "场外受累天气",
              click() {
                that.menuClicked({ type: "lock", value: "StationWeatherLock" });
              },
            },
          ],
        },
        {
          label: "标注",
          click() {
            that.menuClicked({ type: "marking" });
          },
        },
      ];
      const menu = remote.Menu.buildFromTemplate(menuTemplate);

      menu.popup(remote.getCurrentWindow());
    },

    menuClicked(msg) {
      var bd = BackgroundData.getInstance();
      if (!bd.LoginUser) {
        this.$notify({
          title: "请登录",
          message: "控制风机需要先登录！",
          type: "warning",
          position: "bottom-right",
          offset: 60,
        });
        return;
      }
      if (msg.type == "lock") {
        // 挂牌
        var los = this.getSelectedItems();
        for (var id in los) {
          los[id].lockType = msg.value;
        }
        bd.windturbineControl(
          los,
          true,
          this.controlSuccess,
          this.controlError
        );
      } else if (msg.type == "send") {
        // 发送
        var vs = this.getSelectedItems(true);
        bd.windturbineControl(
          vs,
          false,
          this.controlSuccess,
          this.controlError
        );
      } else if (msg.type == "marking") {
        // 标注
        var vvs = this.getSelectedItems();
        bd.marking(vvs);
      }
      this.clearSelected();
    },

    /* 控制成功 */
    controlSuccess(msg) {
      console.log(msg);
      var mss = '';     // 信息
      var iserror=false;// 是否有控制错误的风机
      for(var v in msg.data){
        var val = msg.data[v];
        if(val.errorCode>0){
          iserror=true;
          mss+=`${val.windturbineId}  ${this.controlErorCodes[val.errorCode]}\n`;
        }
      }
      var tp = iserror?"warning":"success";
      var dt = iserror?0:4500;
      if(!iserror){
        mss="控制成功";
      }

      this.$notify({
          title: "控制",
          message: mss,
          type: tp,
          position: "bottom-right",
          offset: 60,
          duration: dt,
        });
    },

    /* 控制失败 */
    controlError(err) {
      this.$notify({
        title: "控制出现错误",
        message: err.message,
        type: "warning",
        position: "bottom-right",
        offset: 60,
      });
    },

    /* 获取选中的项目，isControl：是否是控制 */
    getSelectedItems(isControl) {
      var ls = new Array();
      this.$refs.start.outputSelectedItems(ls);
      this.$refs.stop.outputSelectedItems(ls);
      if (isControl) return ls;
      this.$refs.maintain.outputSelectedItems(ls);
      this.$refs.unmaintain.outputSelectedItems(ls);
      this.$refs.reset.outputSelectedItems(ls);
      return ls;
    },

    /* 清除所有选择 */
    clearSelected() {
      this.$refs.start.clearSelected();
      this.$refs.stop.clearSelected();
      this.$refs.maintain.clearSelected();
      this.$refs.unmaintain.clearSelected();
      this.$refs.reset.clearSelected();
    },

    controlClick(isAuto) {
      var bd = BackgroundData.getInstance();
      if (isAuto) {
        if (!bd.LoginUser) {
          this.$notify({
            title: "请登录",
            message: "切换为自动控制需要先登录！",
            type: "warning",
            position: "bottom-right",
            offset: 60,
          });
          return;
        }
        this.AutoSendTimer = setInterval(this.AutoSend, 60000);
        /* this.$message({
          message: "已切换为自动控制",
          type: "success",
        }); */
      } else {
        /* this.$message({
          message: "已切换为手动控制",
          type: "success",
        }); */
        clearInterval(this.AutoSendTimer);
      }
      this.IsAutoControl = isAuto;
    },

    /* 自动发送命令 */
    AutoSend() {
      var ls = new Array();
      this.$refs.start.outputAllItems(ls);
      this.$refs.stop.outputAllItems(ls);
      console.log("自动发送命令 " + ls.length);
      if (ls.length <= 0) return;
      var bd = BackgroundData.getInstance();
      bd.windturbineControlSystem(ls, false);
    },
  },
};
</script>
<style scoped>
.button-selected {
  background: black;
  font-size: 14px;
  width: 80px;
  border: none;
  color: rgb(220, 220, 220);
}
.button-unselected {
  background: #202020;
  font-size: 14px;
  width: 80px;
  border: none;
  color: rgb(220, 220, 220);
}
</style>