fd_dwgz_zhyw_nx/src/views/IntegratedAlarm/reliability/partsTemperatureAnalyse/index.vue

<template>
  <div class="history-warning">
    <div class="form-wrapper">
      <div class="search-wrapper">
        <div class="search-item">
          <span class="label">场站：</span>
          <div class="search-content">
            <el-select
              v-model="state.stationId"
              clearable
              size="mini"
              placeholder="全部"
              popper-class="select"
              @change="getWindturbineList"
            >
              <el-option
                v-for="item in stationList"
                :key="item.id"
                :value="item.id"
                :label="item.name"
              ></el-option>
            </el-select>
          </div>
        </div>
        <div class="search-item">
          <span class="label">型号：</span>
          <div class="search-content">
            <el-select
              v-model="state.modelId"
              clearable
              size="mini"
              placeholder="全部"
              popper-class="select"
            >
              <el-option
                v-for="item in modelList"
                :key="item.id"
                :value="item.id"
                :label="item.name"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="search-item">
          <span class="label">部件：</span>
          <div class="search-content">
            <el-select
              v-model="state.components"
              clearable
              size="mini"
              placeholder="全部"
              popper-class="select"
            >
              <el-option
                v-for="item in componentList"
                :key="item.id"
                :value="item.nemCode"
                :label="item.name"
              >
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="search-item">
          <span class="label">日期：</span>
          <div class="search-content">
            <el-date-picker
              v-model="state.dateTime"
              size="mini"
              type="datetimerange"
              range-separator="-"
              format="YYYY-MM-DD HH:mm:ss"
              value-format="YYYY-MM-DD HH:mm:ss"
              start-placeholder="开始"
              end-placeholder="结束"
              popper-class="date-select"
            >
            </el-date-picker>
          </div>
        <el-button class="buttons" round size="mini">查询</el-button>
        </div>
      </div>
    </div>

    <div class="table-wrapper">
      <div class="leftContent">
        <span>{{ pageTitle }}</span>
      </div>
      <el-table
        size="mini"
        :data="state.tableData"
        height="calc(100% - 35px - 55px)"
        style="width: 100%"
        stripe
      >
        <el-table-column label="部件功率统计表">
            <el-table-column label="机组"
                prop="projectname"
                width="200"
                header-align="center"
                align="center"
            >
                <template #default="scope">
                    <el-button type="text" style="color: #05bb4c">{{scope.row.projectname}}</el-button>
                </template>
            </el-table-column>
            <el-table-column label="0kw-150kw">
                <el-table-column
                    v-for="item in state.tableHeader"
                    :label="item.title"
                    :prop="item.code"
                    :key="item.code"
                    :width="item.width || ''"
                    show-overflow-tooltip
                    align="center"
                >
                </el-table-column>
            </el-table-column>
            <el-table-column label="150kw-300kw">
                <el-table-column
                    v-for="item in state.tableHeader1"
                    :label="item.title"
                    :prop="item.code"
                    :key="item.code"
                    :width="item.width || ''"
                    show-overflow-tooltip
                    align="center"
                >
                </el-table-column>
            </el-table-column>
            <el-table-column label="300kw-450kw">
                <el-table-column
                    v-for="item in state.tableHeader2"
                    :label="item.title"
                    :prop="item.code"
                    :key="item.code"
                    :width="item.width || ''"
                    show-overflow-tooltip
                    align="center"
                >
                </el-table-column>
            </el-table-column>
        </el-table-column>
      </el-table>
      <div class="pagination-wrapper">
        <el-pagination
          layout="total, sizes, prev, pager, next"
          :current-page="query.page"
          :page-size="query.limit"
          :page-sizes="[21, 100, 500, 1000]"
          :total="query.pageTotal"
          @size-change="
            (value) => {
              query.page = 1;
              query.limit = value;
              getAlarmHistoryt();
            }
          "
          @current-change="handlePageChange"
        ></el-pagination>
      </div>
    </div>
  </div>
</template>

<script setup name="partsTemperatureAnalyse">
import { getStation } from "@/api/performance";
import { getApiequipmentListByWp } from "@/api/monthlyPerformanceAnalysis.js";
import { watch, reactive, nextTick, computed, onMounted, ref } from "vue";
import { useRouter, useRoute } from "vue-router";
import BASE from "@/tools/basicTool.js";
import dayjs from "dayjs";
import {
  alarm_history,
  new_alarm_history,
  fetchWindturbineList,
  fetchModel,
  fetchRelatePartAndAlarmType,
  getWpList,
  confirmAlart,
} from "@/api/zhbj/index.js";
import { ElMessageBox, ElMessage } from "element-plus";
import { outExportExcel } from "@/tools/excel/exportExcel.js"; //引入文件
import { useStore } from "vuex";
const pageTitle = "各出力部件温度分析";
const store = useStore();

const route = useRoute();

onMounted(() => {
  state.dateTime = [
    dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss"),
    dayjs().format("YYYY-MM-DD HH:mm:ss"),
  ];
  if (route.query.deviceType != "booststation") {
    state.deviceId = route.query.deviceId || "";
    state.alarmId = route.query.alarmId || "";
    state.modelId = route.query.modelId || "";
  } else {
    state.stationName = route.query.deviceId;
    state.deviceId = "";
    state.alarmId = route.query.alarmId || "";
  }

  getAlarmHistoryt()
  //   if (route.query.ts) {
  //     state.dateTime = [
  //       `${dayjs(Number(route.query.ts)).format("YYYY-MM-DD")} 00:00:00`,
  //       dayjs(Number(route.query.ts)).format("YYYY-MM-DD HH:mm:ss"),
  //     ];
  //   }
  // getStationList(); //场站
  getequipmentmodel_list(); //机型
  getfetchRelatePart(); //部件
});
// 机型
const getequipmentmodel_list = async () => {
  const { data } = await fetchModel();
  state.modelListAll = data;
};
//所属部件
const getfetchRelatePart = async () => {
  const { data } = await fetchRelatePartAndAlarmType();
  state.fetchListAll = data;
};

const confirmItem = (alarmItem) => {
  ElMessageBox("您确定要执行此操作吗？", "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      confirmAlart(alarmItem)
        .then((res) => {
          if (res.code === 200) {
            ElMessage.success("确认成功");
            store.commit("removeWarning", alarmItem);
            getAlarmHistoryt();
          }
        })
        .catch(() => {
          ElMessage.error("确认失败，请重试");
        });
    })
    .catch(() => {});
};

const getColumnStyle = (columnItem) => {
  let style = "color:";
  if (columnItem.endts) {
    style += " #05bb4c";
  } else {
    style += "var(--el-color-danger)";
  }
  return style;
};

const state = reactive({
  stationId: "",
  stationName: "",
  alarmId: "",
  windturbineList: [],
  deviceId: "",
  modelListAll: {},
  fetchListAll: {},
  modelId: "", //型号
  components: "", //部件
  description: "", //描述
  dateTime: [],
  startDate: null,
  endDate: null,
  tableData: [],
  isshowwindturbineName: true,
  ts: "",
  tableHeader: [
    { title: "发电机U相绕组温度", code: "U_150", width: "150" },
    { title: "发电机V相绕组温度", code: "V_150", width: "150" },
    { title: "发电机W相绕组温度", code: "W_150", width: "150" },
    { title: "发电机冷却风温度", code: "X_150", width: "180" },
    { title: "发电机轴承温度A", code: "A_150", width: "150" }
  ],
  tableHeader1: [
    { title: "发电机U相绕组温度", code: "U_300", width: "150" },
    { title: "发电机V相绕组温度", code: "V_300", width: "150" },
    { title: "发电机W相绕组温度", code: "W_300", width: "150" },
    { title: "发电机冷却风温度", code: "X_300", width: "180" },
    { title: "发电机轴承温度A", code: "A_300", width: "150" }
  ],
  tableHeader2: [
    { title: "发电机U相绕组温度", code: "U_450", width: "150" },
    { title: "发电机V相绕组温度", code: "V_450", width: "150" },
    { title: "发电机W相绕组温度", code: "W_450", width: "150" },
    { title: "发电机冷却风温度", code: "X_450", width: "180" },
    { title: "发电机轴承温度A", code: "A_450", width: "150" }
  ],
});
// 场站列表/升压站列表
const stationList = ref([]);
//获取场站列表
const getStationList = async () => {
  const { data } = await getStation({
    companyids: 0,
    type: state.typeVal == "windturbine" ? -1 : -2,
  });

  stationList.value = data.data;

  state.stationId = stationList.value[0]?.id;
  getWindturbineList();
  //   if (state.deviceId && state.typeVal != "booststation") {
  //     let station = data.data.find((i) => {
  //       let st = i.id.split("_")[2];
  //       let dt = state.deviceId.split("_")[2];
  //       if (st == dt) {
  //         return i;
  //       }
  //     });
  //     state.stationId = station?.id;
  //   } else if (state.typeVal == "booststation") {
  //     let station = data.data.find((i) => i.name == state.stationName);
  //     state.stationId = station ? station?.id : data.data[0]?.id;
  //   } else {
  //     state.stationId = data.data[0]?.id;
  //   }

  //   state.stationId = route.query.stationId || state.stationId;
  //   route.query.stationId ? (state.modelId = modelList.value?.[0]?.id || "") : "";
  if (stationList.value.length) {
  }
};

// watch(
//   () => stationList,
//   (val, old) => {
//     val?.value?.length &&
//       nextTick(async () => {
//         await getWindturbineList();
//       });
//   },
//   {
//     deep: true,
//     immediate: true,
//   }
// );
watch(
  () => route,
  (val, old) => {
    // if (route.query.deviceType != "booststation") {
    //   state.deviceId = route.query.deviceId || "";
    //   state.alarmId = route.query.alarmId || "";
    //   state.modelId = route.query.modelId || "";
    // } else {
    //   state.stationName = route.query.deviceId;
    //   state.deviceId = "";
    //   state.alarmId = route.query.alarmId || "";
    // }
    state.isshowwindturbineName =
      state.typeVal == "booststation" ? false : true;
    getStationList();
  },
  {
    deep: true,
    immediate: true,
  }
);
//型号列表
const modelList = computed(() => {
  return [
    {
      id: "SEC-W02B-1250kW",
      nemCode: "SEC-W02B-1250kW",
      name: "SEC-W02B-1250kW",
      aname: "SEC-W02B-1250kW",
      description: "DI",
      powerProduction: 1250,
      windturbineManufacturerId: "SHDQ_MF",
      photo: null,
      unit: null,
      cutinwindSpeed: 3,
      ratedwindSpeed: 11,
      cutoutwindSpeed: "25",
      sweptArea: 5800,
      equipmentCategory: "F",
    },
  ];
  //   if (state.typeVal != "booststation") {
  //     if (state.stationId == "") {
  //       return [];
  //     } else {
  //       state.modelId = route.query.deviceId ? route.query.modelId : "";
  //       return state.modelListAll[state.stationId];
  //     }
  //   } else {
  //     return [];
  //   }
});
//部件列表
const componentList = computed(() => {
  return [
    {
      id: "1",
      category: "alertrule_category",
      nemCode: "YP",
      name: "叶片",
      orderNumber: 1,
      enable: 1,
    },
    {
      id: "2",
      category: "alertrule_category",
      nemCode: "LG",
      name: "轮毂",
      orderNumber: 2,
      enable: 1,
    },
    {
      id: "3",
      category: "alertrule_category",
      nemCode: "TJ",
      name: "塔架",
      orderNumber: 3,
      enable: 1,
    },
    {
      id: "4",
      category: "alertrule_category",
      nemCode: "JC",
      name: "机舱",
      orderNumber: 4,
      enable: 1,
    },
    {
      id: "5",
      category: "alertrule_category",
      nemCode: "KZXT",
      name: "控制系统",
      orderNumber: 5,
      enable: 1,
    },
    {
      id: "6",
      category: "alertrule_category",
      nemCode: "BJXT",
      name: "变桨系统",
      orderNumber: 6,
      enable: 1,
    },
    {
      id: "7",
      category: "alertrule_category",
      nemCode: "PHXT",
      name: "偏航系统",
      orderNumber: 7,
      enable: 1,
    },
    {
      id: "8",
      category: "alertrule_category",
      nemCode: "CLX",
      name: "齿轮箱",
      orderNumber: 8,
      enable: 1,
    },
    {
      id: "9",
      category: "alertrule_category",
      nemCode: "FDJ",
      name: "发电机",
      orderNumber: 9,
      enable: 1,
    },
    {
      id: "10",
      category: "alertrule_category",
      nemCode: "BPQ",
      name: "变频器",
      orderNumber: 10,
      enable: 1,
    },
    {
      id: "11",
      category: "alertrule_category",
      nemCode: "YYXT",
      name: "液压系统",
      orderNumber: 11,
      enable: 1,
    },
    {
      id: "12",
      category: "alertrule_category",
      nemCode: "FZXT",
      name: "辅助系统",
      orderNumber: 12,
      enable: 1,
    },
    {
      id: "13",
      category: "alertrule_category",
      nemCode: "CFXT",
      name: "测风系统",
      orderNumber: 13,
      enable: 1,
    },
    {
      id: "14",
      category: "alertrule_category",
      nemCode: "DWXT",
      name: "电网系统",
      orderNumber: 14,
      enable: 1,
    },
    {
      id: "15",
      category: "alertrule_category",
      nemCode: "TDG",
      name: "塔底柜",
      orderNumber: 15,
      enable: 1,
    },
    {
      id: "16",
      category: "alertrule_category",
      nemCode: "CDL",
      name: "传动链",
      orderNumber: 16,
      enable: 1,
    },
    {
      id: "17",
      category: "alertrule_category",
      nemCode: "QT",
      name: "其他",
      orderNumber: 17,
      enable: 1,
    },
    {
      id: "42",
      category: "alertrule_category",
      nemCode: "CGQ",
      name: "传感器",
      orderNumber: 19,
      enable: 1,
    },
    {
      id: "41",
      category: "alertrule_category",
      nemCode: "BYQ",
      name: "变压器",
      orderNumber: 18,
      enable: 1,
    },
    {
      id: "44",
      category: "alertrule_category",
      nemCode: "ZZ",
      name: "主轴",
      orderNumber: 20,
      enable: 1,
    },
  ];
  //   if (state.typeVal != "booststation") {
  //     if (state.stationId == "") {
  //       return [];
  //     } else {
  //       if (state.stationId.includes("FDC")) {
  //         return state.fetchListAll?.fjbj;
  //       } else {
  //         return state.fetchListAll?.gfbj;
  //       }
  //     }
  //   } else {
  //     return [];
  //   }
});
//get 风机
const getWindturbineList = async () => {
  state.deviceId = "";

  //   const { data } = await getApiequipmentListByWp({ wpid: state.stationId });

  state.windturbineList = [
    {
      id: "SXJ_KGDL_XWT_F_WT_0001_EQ",
      nemCode: "#1",
      windpowerstationId: "SXJ_KGDL_XWT_FDC_STA",
      longitude: 112.415335,
      latitude: 40.281307,
      modelId: "SEC-W02B-1250kW",
      status: "NULL",
      projectId: "SXJ_KGDL_XWTF01_EG",
      lineId: "SXJ_KGDL_XWTF01_LN",
      firstIntegratedTime: "2008-07-27T16:00:00.000+0000",
      photo: "NULL",
      name: "01号风机",
      aname: "#1",
      isStandard: 1,
      regionId: "NX_FGS",
      companyId: "SXJ_KGDL_FLFD_ZGS",
      isable: 1,
      equipmentCategory: -1,
      parentId: "NULL",
      squareId: "NULL",
      spare1: "WT",
      spare2: "1",
      spare3: "NULL",
      spare4: "NULL",
      orderNum: 271,
      substationId: "SXJ_KGDL_XWTF01_SBS",
    },
  ];
  //   state.modelId = modelList.value?.[0]?.id || "";
  await getAlarmHistoryt();
};
const query = reactive({
  page: 1,
  limit: 21,
  pageTotal: null,
});

// 获取历史记录表
const getAlarmHistoryt = async () => {
  //   if (route.params.deviceId && route.params.alarmId) {
  //     state.stationId = "";
  //   }
  //   BASE.showLoading();
  //   let params = {
  //     pageNum: query.page,
  //     pageSize: query.limit,
  //     alarmId: state.alarmId,
  //     alarmType: state.typeVal,
  //     stationid: state.stationId,
  //     deviceid: state.typeVal == "booststation" ? "" : state.deviceId,
  //     modelId: state.typeVal == "booststation" ? "" : state.modelId,
  //     components: state.components,
  //     description: state.description,
  //     begin: state.dateTime[0],
  //     end: state.dateTime[1],
  //   };
  //   const { data } = await alarm_history(params);
  //   BASE.closeLoading();
  //   query.pageTotal = data?.total;
  //   data?.ls?.forEach((ele) => {
  //     ele.isCloseName = ele.endts ? "已解除" : "未解除";
  //     ele.alarmTypeName =
  //       ele.alarmType === "booststation"
  //         ? "升压站"
  //         : ele.alarmType === "windturbine"
  //         ? "风机"
  //         : ele.alarmType === "inverter"
  //         ? "光伏"
  //         : "";
  //     ele.endtsName = ele.endts > 0 ? formatTime(ele.endts) : "--";
  //   });
  //   state.tableData = data?.ls;
  state.tableData = new Array(20).fill({
    modelId: "SEC-W02B-1250kW",
    projectid: "SXJ_KGDL_XWTF01_EG",
    projectname: "一期项目",
    U_150: 52.1,
    V_150: 48.9,
    W_150: 47.1,
    X_150: 58.5,
    A_150: 52.2,
    U_300: 55.8,
    V_300: 48.3,
    W_300: 53.1,
    X_300: 57.2,
    A_300: 54.5,
    U_450: 52.3,
    V_450: 46.1,
    W_450: 48.5,
    X_450: 49.8,
    A_450: 51.2
  });
};


// 分页导航
const handlePageChange = (val) => {
  query.page = val;
  getAlarmHistoryt();
};
// 时间格式化
const formatTime = (val) => {
  return dayjs(val).format("YYYY-MM-DD HH:mm:ss");
};
// 格式化
const obj = {
  1: "低级",
  2: "低中级",
  3: "中级",
  4: "中高级",
  5: "高级",
  booststation: "升压站",
  inverter: "光伏",
  windturbine: "风机",
};
const messageTypeObj = {
  1: "触发",
  3: "解除",
};
const tableFilter = (val) => {
  return obj[val];
};
const messageTypeFilter = (val) => {
  return messageTypeObj[val];
};
</script>

<style scoped lang="less">
p {
  padding: 0;
  margin: 0;
}
.history-warning {
  height: 100%;
  width: 100%;
  padding: 0 20px;
  padding-bottom: 10px;
  .form-wrapper ::v-deep {
    display: flex;
    flex-direction: column;
    padding-top: 10px;
    position: relative;
    .search-wrapper {
      display: flex;
      align-items: center;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #b3b3b3;
      margin-bottom: 10px;
      .search-item {
        display: flex;
        margin-right: 10px;
        max-width: 450px;
        align-items: center;
        .label {
          margin-right: 10px;
          text-align: right;
          white-space: nowrap;
          // width: 60px;
        }
        .search-content {
          flex: 1;
        }
      }
    }

    .btns {
      display: flex;
      justify-content: flex-end;
      margin-right: 10px;
      position: absolute;
      right: 0;
      top: 53px;
    }

    .buttons {
        margin-left: 10px;
      background-color: rgba(5, 187, 76, 0.2);
      border: 1px solid #3b6c53;
      color: #b3b3b3;
      font-size: 14px;

      &:hover {
        background-color: rgba(5, 187, 76, 0.5);
        color: #ffffff;
      }
    }
  }
  .table-wrapper {
    height: calc(100% - 43px);
    width: 100%;
    .leftContent {
      width: 242px;
      height: 41px;
      display: flex;
      align-items: center;
      background: url("~@/assets/imgs/title_left_bg1.png") no-repeat;

      span {
        font-size: 16px;
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: #05bb4c;
        margin-left: 25px;
      }
    }
    .pagination-wrapper :deep {
      text-align: right;
      margin-top: 10px;
    }
  }
}
</style>