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

/* 问题区 */
<template>
  <gy-card
    title="问题区"
    area-style="problem"
    circle-style="green"
    content-style="89"
    @parentRun="run"
    @contextmenu="contextmenu"
  >
    <MatrixCard title="故障" :datas="ls.malfunction"></MatrixCard>
    <MatrixCard title="维护" :datas="ls.maintain"></MatrixCard>
    <MatrixCard title="离线" :datas="ls.offline"></MatrixCard>
    <MatrixCard title="挂牌" :datas="ls.lockd"></MatrixCard>
  </gy-card>
</template>

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

export default {
  name: "ProblemArea",
  components: {
    MatrixCard,
  },
  props: {},
  data() {
    return {
      ls: {
        maintain: { key: "维护", value: [] },
        malfunction: { key: "故障", value: [] },
        offline: { key: "离线", value: [] },
        lockd: { key: "挂牌", value: [] },
      },
      datas: new Array(),
    };
  },
  computed: {},
  created: function () {
    this.initData();
  },
  methods: {
    initData: function () {
      var mb = MessageBridge.getInstance();
      var vs = [{ key: "/topic/windturbine", action: this.windturbineMessage }];
      mb.register(vs);
    },
    windturbineMessage(msg) {
      var ll = {
        maintain: { key: "维护", value: [] },
        malfunction: { key: "故障", value: [] },
        offline: { key: "离线", value: [] },
        lockd: { key: "挂牌", value: [] },
      };
      var mmsg = JSON.parse(msg);
      for (var id in mmsg) {
        var val = mmsg[id];
        if (val.status == 6) {
          // 维护
          ll.maintain.value.push(val);
        } else if (val.status == 7) {
          // 离线
          ll.offline.value.push(val);
        } else if (val.status == 5) {
          // 故障
          ll.malfunction.value.push(val);
        }
        if (val.lockValue > 0) {
          // 挂牌
          ll.lockd.value.push(val);
        }
      }
      this.ls = ll;
    },
    /* 右键菜单 */
    contextmenu() {
      const { remote } = require("electron");
      var that = this;
      const menuTemplate = [
        {
          label: "标注",
          click() {
            that.menuClicked({ type: "marking" });
          },
        },
        {
          label: "挂牌",
          submenu: [
            {
              label: "检修",
              click() {
                that.menuClicked({ type: "lock", value: 8 });
              },
            },
            {
              label: "故障维修",
              click() {
                that.menuClicked({ type: "lock", value: 7 });
              },
            },
            {
              label: "场内受累检修",
              click() {
                that.menuClicked({ type: "lock", value: 2 });
              },
            },
            {
              label: "场内受累故障",
              click() {
                that.menuClicked({ type: "lock", value: 3 });
              },
            },
            {
              label: "场外受累电网",
              click() {
                that.menuClicked({ type: "lock", value: 4 });
              },
            },
            {
              label: "场外受累天气",
              click() {
                that.menuClicked({ type: "lock", value: 5 });
              },
            },
          ],
        },
        {
          label: "取消挂牌",
          click() {
            that.menuClicked({ type: "unlock" });
          },
        },
      ];
      const menu = remote.Menu.buildFromTemplate(menuTemplate);

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

    menuClicked(msg) {
      var bd = BackgroundData.getInstance();
      if (!bd.LoginUser) {
        bd.showdialog("提示", "控制出现错误：", "未登录");
        return;
      }
      if (msg.type == "lock") {
        // 挂牌
      } else if (msg.type == "unlock") {
        // 取消挂牌
      } else if (msg.type == "marking") {
        // 标注
      }
    },
  },
};
</script>