目前展示菜单接口调试

src/App.vue

@@ -1,13 +1,13 @@
 <template>
-  <router-view/>
+  <router-view />
 </template>
 
 <script>
-export default {
-};
+export default {};
 </script>
 
 <style>
 @import "./assets/css/main.css";
+@import "./assets/css/custom.scss";
 @import "./assets/css/color-dark.css";
 </style>

src/api/api.js

@@ -1,6 +1,6 @@
 import request from "./axios.js";
 // export const baseURL = "http://10.81.3.154:6015/";
-export const baseURL = "http://192.168.1.105:6015/";
+export const baseURL = "http://192.168.1.109:6015/";
 import JSONBIG from "json-bigint";
 
 // 获取场站数据
@@ -114,9 +114,7 @@ export const fetchAIDIPointList = (
   });
 };
 
-// ---------------------------------------- 基础数据- 字典------------------------------------------------
-
-//
+//字典维护列表
 export const get_datadictionary = (pageNum, pageSize, name, category) => {
   return request({
     baseURL: baseURL,
@@ -124,16 +122,122 @@ export const get_datadictionary = (pageNum, pageSize, name, category) => {
     url: `datadictionary/page?pageNum=${pageNum}&pageSize=${pageSize}&name=${name}&category=${category}`,
   });
 };
-// 新增 修改
+//字典维护 新增 修改
 export const post_saveorupdate = (data) => {
   return request({
-    baseURL: baseURL,method: "post",
+    baseURL: baseURL,
+    method: "post",
     url: `datadictionary/save`,
     data,
   });
 };
-// ----------------------------------------end 基础数据- 风机管理------------------------------------------------
 
+//实时报警列表
+export const alarm_snap_top = (params) => {
+  return request({
+    baseURL: baseURL,
+    method: "get",
+    url: `alarm/history/findAlarmByTypelist`,
+    params: params,
+  });
+};
+//数据查询实时数据
+export const getAdapterLatest = (stationId, AIlist) => {
+  return request({
+    url: `ts/latest?uniformCodes=${AIlist}&thingId=${stationId}&thingType=windturbine`,
+    baseURL: "http://10.81.3.152:8098/",
+    showLoading: {
+      statu: false,
+    },
+    timeout: 1000,
+    transformResponse: [
+      function (data) {
+        const json = JSONBIG({
+          storeAsString: true,
+        });
+        const res = json.parse(data);
+        return res;
+      },
+    ],
+  });
+};
+//数据查询 历史数据
+export const getAdapterHistory = (
+  stationId,
+  AIpoint,
+  startTs,
+  endTs,
+  baseUrl
+) => {
+  return request({
+    url: `ts/history/raw?uniformCode=${AIpoint}&thingId=${stationId}&thingType=windturbine&startTs=${startTs}&endTs=${endTs}`,
+    baseURL: baseUrl,
+  });
+};
+//数据查询 数据快照
+export const getAdapterHistorysnap = (
+  stationId,
+  AIpoint,
+  startTs,
+  endTs,
+  interval,
+  baseUrl
+) => {
+  return request({
+    url: `ts/history/snap?uniformCode=${AIpoint}&thingId=${stationId}&thingType=windturbine&startTs=${startTs}&endTs=${endTs}&interval=${interval}`,
+    baseURL: baseUrl,
+  });
+};
+
+//查询历史报警记录
+export const alarm_history = (params) => {
+  return request({
+    url: `alarm/history/findAlarmlist`,
+    params: params,
+    baseURL,
+  });
+};
+
+// 风机原始数据统计
+// 列表接口
+export const getAlarmCountList = (params) => {
+  return request({
+    url: `alarm/history/findWtFeatureStat?timeType=${params.timeType}&begin=${params.begin}&end=${params.end}&stationid=${params.stationid}&components=${params.components}&modelId=${params.modelId}&alarmIds=${params.alarmIds}`,
+    baseURL,
+    method: "get",
+  });
+};
+// 获取报警描述列表
+export const GetAlarmId = (params) => {
+  return request({
+    url: `alarmconfiguration/querywtalarmdesclist?components=${params.components}&modelId=${params.modelId}&wpId=${params.wpId}`,
+    baseURL,
+    method: "get",
+  });
+};
+//报警修改日志
+export const fetchruleventLogs = (pagenum, pagesize, ruleName, ruleType) => {
+  return request({
+    url: "ruleupdate/page",
+    method: "get",
+    baseURL,
+    params: {
+      pagenum,
+      pagesize,
+      ruleName,
+      ruleType,
+    },
+  });
+};
+//风机报警列表
+export const windturbinebj_fetchTableData = (query) => {
+  return request({
+    url: "alarmconfiguration/page",
+    method: "get",
+    baseURL,
+    params: query,
+  });
+};
 //获取服务端公钥
 export const getPublickey = (query) => {
   return request({
@@ -142,8 +246,39 @@ export const getPublickey = (query) => {
 };
 // login
 export const loginRequest = (params) => {
-  return request.post("user/login", params);
+  return request({
+    url: "/admin-api/system/auth/login",
+    baseURL: "http://10.81.3.127:48080",
+    data: params,
+    method: "post",
+  });
+};
+export const Login = (params) => {
+  return request({
+    url: "auth/login",
+    baseURL,
+    data: params,
+    method: "post",
+  });
 };
+export function getUserinfo() {
+  return request({
+    baseURL: "http://10.81.3.127:48080",
+    url: "/admin-api/system/auth/get-permission-info",
+    method: "get",
+    headers: {
+      isUser: true,
+    },
+  });
+}
+export function logout(data) {
+  return request({
+    baseURL,
+    url: `auth/logout`,
+    method: "post",
+    data,
+  });
+}
 //register
 export const registerRequest = (params) => {
   return request.post("user/registers", params);
@@ -248,14 +383,6 @@ export const getCheckList = (params) => {
   });
 };
 
-// 风机原始数据统计
-// 列表接口
-export const getAlarmCountList = (params) => {
-  return request.get(
-    `windturbineAlarmCount/query/list?stationid=${params.stationid}&starttime=${params.starttime}&endtime=${params.endtime}`
-  );
-};
-
 // 弹窗数据接口
 export const getDialogData = (params) => {
   return request.get(
@@ -315,13 +442,7 @@ export const fetchStationList = () => {
 // };
 
 // ----------------------------------------安全生产- 报警记录------------------------------------------------
-//查询历史报警记录
-export const alarm_history = (params) => {
-  return request({
-    url: `alarm/history/page2`,
-    params: params,
-  });
-};
+
 //导出历史报警记录
 export const new_alarm_history = (params) => {
   // return request.get(`alarm/history/export?stationid=${params.stationid}&starttime=${params.starttime}&endtime=${params.endtime}&windturbineid=&category1=&category2=&rank=&modelid=&snapid=&messagetype=&keyword=`)
@@ -375,17 +496,7 @@ export const alarm_fault_top = (params) => {
     params: params,
   });
 };
-//底下的实时报警
-export const alarm_snap_top = (params) => {
-  return request({
-    url: `alarm/snap/top`,
-    params: params,
-    showLoading: {
-      statu: false,
-    },
-    timeout: 1000,
-  });
-};
+
 //报警确认
 export const get_fault_confirm = (params) => {
   return request({
@@ -397,45 +508,7 @@ export const get_fault_confirm = (params) => {
 // ----------------------------------------安全生产- 实时数据查询------------------------------------------------
 
 // get 实时data
-export const getAdapterLatest = (stationId, AIlist) => {
-  return request({
-    url: `ts/latest?uniformCodes=${AIlist}&thingId=${stationId}&thingType=windturbine`,
-    baseURL: "http://10.81.3.152:8098/",
-    showLoading: {
-      statu: false,
-    },
-    timeout: 1000,
-    transformResponse: [
-      function (data) {
-        const json = JSONBIG({
-          storeAsString: true,
-        });
-        const res = json.parse(data);
-        return res;
-      },
-    ],
-  });
-};
-// get 历史数据
-export const getAdapterHistory = (stationId, AIpoint, startTs, endTs) => {
-  return request({
-    url: `ts/history/raw?uniformCode=${AIpoint}&thingId=${stationId}&thingType=windturbine&startTs=${startTs}&endTs=${endTs}`,
-    baseURL: "http://10.81.3.152:8098/",
-  });
-};
-// get 历史数据
-export const getAdapterHistorysnap = (
-  stationId,
-  AIpoint,
-  startTs,
-  endTs,
-  interval
-) => {
-  return request({
-    url: `ts/history/snap?uniformCode=${AIpoint}&thingId=${stationId}&thingType=windturbine&startTs=${startTs}&endTs=${endTs}&interval=${interval}`,
-    baseURL: "/adapter/",
-  });
-};
+
 // 批量导出
 export const AdapterHistoryExport = (activeAI, activeWT, startTs, endTs) => {
   return request({
@@ -635,30 +708,11 @@ export const scadabj_batchImport = (list) => {
 //********************************************end********************************//\
 
 //********************************************报警记录日志********************************//\
-export const fetchruleventLogs = (pagenum, pagesize, ruleName, ruleType) => {
-  return request({
-    url: "rulevent/page",
-    method: "get",
-    params: {
-      pagenum,
-      pagesize,
-      ruleName,
-      ruleType,
-    },
-  });
-};
 
 //********************************************end********************************//\
 
 //******************************风机报警API************************************//
-export const windturbinebj_fetchTableData = (query) => {
-  return request({
-    url: "warning2/page",
-    method: "get",
-    params: query,
-    timeout: 20000,
-  });
-};
+
 export const windturbinebj_postSave = (form) => {
   return request.post("warning2/save", form);
 };

src/api/axios.js

@@ -1,79 +1,97 @@
-import axios from 'axios';
-import { ElMessage, ElMessageBox, ElLoading } from 'element-plus';
+import axios from "axios";
+import route from "@/router";
+import store from "@/store";
+import { ElMessage, ElMessageBox, ElLoading } from "element-plus";
 import { nextTick } from "vue";
-import config from './config';
-import JSONBIG from 'json-bigint'
-
+import config from "./config";
+import JSONBIG from "json-bigint";
+import { getCookie } from "@/utils/auth"; // getToken from cookie
 // 配置新建一个 axios 实例
-var loading = null
+var loading = null;
 const service = axios.create({
-    baseURL: '/sharding/',
-    timeout: 20000,
-    headers: { 'Content-Type': 'application/json' },
-    showLoading: {
-        statu: true,
-        text: '加载中...'
-    }
+  baseURL: "/sharding/",
+  timeout: 20000,
+  headers: { "Content-Type": "application/json" },
+  showLoading: {
+    statu: true,
+    text: "加载中...",
+  },
 });
 
-
 // 添加请求拦截器
 service.interceptors.request.use(
-    (config) => {
-        if (config.showLoading.statu) {
-            loading = ElLoading.service({
-                lock: true,
-                text: config.showLoading.text,
-                spinner: 'el-icon-loading',
-                background: 'rgba(0, 0, 0, 0.3)'
-            });
-        }
-        // 在发送请求之前做些什么 token
-        let token = sessionStorage.getItem('token')
-        if (token) {
-            config.headers.common['token'] = token;
-        }
-        return config
-    },
-    (error) => {
-        // 对请求错误做些什么
-        return Promise.reject(error);
+  (config) => {
+    if (config.showLoading.statu) {
+      loading = ElLoading.service({
+        lock: true,
+        text: config.showLoading.text,
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.3)",
+      });
     }
+    const u = (config.headers || {}).isUser;
+    // 在发送请求之前做些什么 token
+    let token = getCookie("accessToken");
+    let userId = getCookie("userId");
+    if (token) {
+      if (u) {
+        config.headers["Authorization"] = "Bearer " + token;
+      } else {
+        config.headers.common["token"] = token;
+        config.headers.common["userId"] = userId;
+      }
+    }
+    return config;
+  },
+  (error) => {
+    // 对请求错误做些什么
+    return Promise.reject(error);
+  }
 );
 
 // 添加响应拦截器
 service.interceptors.response.use(
-    (response) => {
-        // 对响应数据做点什么
-        nextTick(async() => {
-            loading && await loading.close()
-        })
-        const res = response.data;
-        if (res.status === 401 || res.status === 4001 || res.status == 521) {
-            sessionStorage.clear(); // 清除浏览器全部临时缓存
-            window.location.href = '/'; // 去登录页
-            ElMessage.error(res.msg)
-        } else {
-            return response.data;
-        }
-    },
-    (error) => {
-        nextTick(async() => {
-                loading && await loading.close()
-            })
-            // 对响应错误做点什么
-        if (error.message.indexOf('timeout') != -1) {
-            // ElMessage.error('网络超时');
-        } else if (error.message == 'Network Error') {
-            // ElMessage.error('网络连接错误');
-
-        } else {
-            // if (error.response.data) ElMessage.error(error.response.statusText);
-            // else ElMessage.error('接口路径找不到');
+  (response) => {
+    // 对响应数据做点什么
+    nextTick(async () => {
+      loading && (await loading.close());
+    });
+    const res = response.data;
+    if (res.code === 401) {
+      ElMessageBox.alert(
+        "登录状态已过期，您可以继续留在该页面，或者重新登录",
+        "系统提示",
+        {
+          confirmButtonText: "重新登录",
+          cancelButtonText: "取消",
+          type: "warning",
+          callback: () => {
+            store.dispatch("user/LogOut").then(() => {
+              route.push("/");
+            });
+          },
         }
-        return Promise.reject(error);
+      );
+    } else {
+      return response.data;
+    }
+  },
+  (error) => {
+    nextTick(async () => {
+      loading && (await loading.close());
+    });
+    // 对响应错误做点什么
+    if (error.message.indexOf("timeout") != -1) {
+      // ElMessage.error('网络超时');
+    } else if (error.message == "Network Error") {
+      // ElMessage.error('网络连接错误');
+    } else {
+      // if (error.response.data) ElMessage.error(error.response.statusText);
+      // else ElMessage.error('接口路径找不到');
     }
+    return Promise.reject(error);
+  }
 );
 
 // 导出 axios 实例
-export default service;
+export default service;

src/assets/css/custom.scss

@@ -0,0 +1,23 @@
+.search-input {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  color: #000;
+  min-width: 192px;
+  white-space: nowrap;
+  .label {
+    margin-right: 5px;
+  }
+  .el-input {
+    width: 150px;
+    .el-input__inner {
+      width: 150px;
+    }
+  }
+  .el-date-editor.el-input {
+    width: 192px;
+    .el-input__inner {
+      width: 192px;
+    }
+  }
+}

src/assets/css/main.css

@@ -27,7 +27,7 @@ a {
   right: 0;
   top: 70px;
   bottom: 0;
-  padding-bottom: 8px;
+  /* padding-bottom: 8px; */
   -webkit-transition: left 0.3s ease-in-out;
   transition: left 0.3s ease-in-out;
   background: #f0f0f0;

src/components/Header.vue

@@ -15,9 +15,9 @@
           </span>
           <template #dropdown>
             <el-dropdown-menu>
-              <el-dropdown-item command="editpassword"
+              <!-- <el-dropdown-item command="editpassword"
                 >修改密码</el-dropdown-item
-              >
+              > -->
               <el-dropdown-item command="loginout">退出登录</el-dropdown-item>
             </el-dropdown-menu>
           </template>
@@ -58,7 +58,8 @@
 <script setup>
 import { ref, computed, onMounted, reactive } from "vue";
 import { useRouter } from "vue-router";
-import { editRequest } from "/@/api/api.js";
+import { editRequest, logout } from "/@/api/api.js";
+import { getCookie } from "@/utils/auth"; // getToken from cookie
 import { ElMessage } from "element-plus";
 import { useStore } from "vuex";
 import { JSEncrypt } from "jsencrypt";
@@ -71,7 +72,9 @@ const refruleForm = ref(null);
 const rules = reactive({
   userName: [{ required: true, message: "请输入账号", trigger: "blur" }],
   chineseName: [{ required: true, message: "请输入中文名称", trigger: "blur" }],
-  newPassWord: [{ required: true, validator: BASE.elCkeck.validatePass, trigger: "blur" }],
+  newPassWord: [
+    { required: true, validator: BASE.elCkeck.validatePass, trigger: "blur" },
+  ],
 });
 const ruleForm = reactive({
   id: sessionStorage.getItem("ms_id"),
@@ -81,7 +84,7 @@ const ruleForm = reactive({
 });
 
 const username = computed(() => {
-  return sessionStorage.getItem("ms_chinesename");
+  return store.getters.username;
 });
 
 const collapse = computed(() => store.state.collapse);
@@ -89,10 +92,15 @@ const collapse = computed(() => store.state.collapse);
 // 用户名下拉菜单选择事件
 const handleCommand = (command) => {
   if (command == "loginout") {
-    sessionStorage.clear();
-    router.push("/login");
+    logout({
+      token: getCookie("authToken"),
+      userId: getCookie("userId"),
+    }).then((res) => {
+      store.commit("user/REMOVE_TOKEN");
+      router.push("/login");
+    });
   } else if (command == "editpassword") {
-    dialogVisible.value = true;
+    // dialogVisible.value = true;
   }
 };
 // 利用jsencrypt.js进行RSA加密
@@ -112,7 +120,7 @@ const edit = async () => {
   };
   const res = await editRequest(requestWrapper);
   dialogVisible.value = false;
-  if (res.success){
+  if (res.success) {
     ElMessage.success(res.msg);
   } else {
     ElMessage.error(res.msg);

src/main.js

@@ -1,19 +1,23 @@
-import { createApp } from 'vue'
-import App from './App.vue'
-import router from './router'
-import store from './store'
-import ElementPlus from 'element-plus'
-import 'element-plus/lib/theme-chalk/index.css'
-import './assets/css/icon.css'
-import './assets/font/iconfont.css'
-import 'default-passive-events'
-import dialogDrag from '/@/assets/js/dialogDrag.js' // 地址就是dialogDrag.js在位置
-
+import { createApp } from "vue";
+import App from "./App.vue";
+import router from "./router";
+import store from "./store";
+import ElementPlus from "element-plus";
+import "element-plus/lib/theme-chalk/index.css";
+import "./assets/css/icon.css";
+import "./assets/font/iconfont.css";
+import "default-passive-events";
+import dialogDrag from "/@/assets/js/dialogDrag.js"; // 地址就是dialogDrag.js在位置
 
+import "./permission";
 // import Antd from 'ant-design-vue';
 // import 'ant-design-vue/dist/antd.css';
 
-createApp(App).use(router).use(store).use(dialogDrag).use(ElementPlus, { size: 'small' })
-// .use(Antd)
+createApp(App)
+  .use(router)
+  .use(store)
+  .use(dialogDrag)
+  .use(ElementPlus, { size: "small" })
+  // .use(Antd)
 
-.mount('#app')
+  .mount("#app");

src/pages/Login.vue

@@ -70,7 +70,7 @@ import { useStore } from "vuex";
 import { useRouter } from "vue-router";
 import { ElMessage } from "element-plus";
 import { JSEncrypt } from "jsencrypt";
-import { loginRequest, getPublickey } from "/@/api/api.js";
+import { loginRequest, getPublickey, Login, getUserinfo } from "/@/api/api.js";
 const router = useRouter();
 const login = ref(null);
 const store = useStore();
@@ -133,27 +133,31 @@ const submitForm = () => {
   });
 };
 const loginFun = async () => {
-  let requestWrapper = {
-    publicKey: sessionStorage.getItem("publicKey"),
-    data: encryptionByPublickey(userInfo),
-  };
-  const res = await loginRequest(requestWrapper);
-  console.warn(res);
-  if (res.status == 20000) {
-    ElMessage.success("登录成功");
-    sessionStorage.setItem("ms_username", res.data.userName);
-    sessionStorage.setItem("ms_chinesename", res.data.chineseName);
-    sessionStorage.setItem("ms_id", res.data.id);
-    sessionStorage.setItem("token", res.token);
-    sessionStorage.setItem("identity", res.data.identity);
+  //   let requestWrapper = {
+  //     publicKey: sessionStorage.getItem("publicKey"),
+  //     data: encryptionByPublickey(userInfo),
+  //   };
+  const { data: res, msg, code } = await loginRequest({ ...userInfo });
+  if (code == 0) {
+    // sessionStorage.setItem("ms_username", res.data.userName);
+    // sessionStorage.setItem("ms_chinesename", res.data.chineseName);
+    store.commit("user/SET_TOKEN", res);
+    // sessionStorage.setItem("ms_id", res.userId);
+    // sessionStorage.setItem("token", res.token);
+    Login({ userId: res.userId, token: res.accessToken }).then((res) => {
+      if (res.code == 200) {
+        ElMessage.success("登录成功");
+      }
+    });
+    // sessionStorage.setItem("identity", res.data.identity);
   } else {
-    ElMessage.error(res.msg);
+    ElMessage.error(msg);
   }
   router.push("/");
 };
 </script>
 
-<style  lang="scss"  scoped>
+<style lang="scss" scoped>
 .login-wrap {
   position: relative;
   width: 100%;

src/pages/alarmConfig/bj_custom/custom.vue

@@ -158,6 +158,7 @@
       class="table"
       header-cell-name="table-header"
       :highlight-current-row="true"
+      height="calc(100% - 42px - 45px)"
     >
       <el-table-column
         v-for="item in query.category == 'windturbine'
@@ -233,7 +234,15 @@ import {
   baseURL,
 } from "/@/api/api.js";
 import { outExportExcel } from "/@/utils/exportExcel"; //引入文件
-import { ref, onMounted, provide, computed, reactive, watch } from "vue";
+import {
+  ref,
+  onMounted,
+  provide,
+  computed,
+  reactive,
+  watch,
+  nextTick,
+} from "vue";
 import { useStore } from "vuex";
 import { useRouter } from "vue-router";
 import { ElMessageBox, ElMessage } from "element-plus";
@@ -246,7 +255,7 @@ const router = useRouter();
 const isStation = computed(() => store.getters.isStation);
 const query = reactive({
   pagenum: 1,
-  pagesize: 10,
+  pagesize: 4,
   name: "",
   wpId: "",
   rank: "",
@@ -345,11 +354,25 @@ const stationList = computed(() => {
     return store.state.booststationList;
   }
 });
+watch(
+  () => stationList,
+  (val, old) => {
+    val.value.length &&
+      nextTick(async () => {
+        query.wpId = val.value[0]?.id;
+        await getData();
+      });
+  },
+  {
+    deep: true,
+    immediate: true,
+  }
+);
 let total = ref(0);
 onMounted(() => {
   getfetchRelatePart();
   getequipmentmodel_list();
-  getData();
+  //   getData();
 });
 const dialogclose = () => {
   state.visible = false;
@@ -505,9 +528,12 @@ const enabledConvert = (val) => {
   }
 };
 </script>
-<style scoped>
-.el-card {
+<style scoped lang="scss">
+:deep.el-card {
   height: 100%;
+  .el-card__body {
+    height: calc(100% - 40px);
+  }
 }
 .mr10 {
   margin-right: 10px;

src/pages/alarmConfig/bj_windturbine/windturbine.vue

@@ -48,22 +48,39 @@
       <div style="display: flex; flex-direction: row; margin-bottom: 10px">
         <el-select
           v-if="!isStation"
-          v-model="query.stationId"
+          v-model="query.alarmType"
+          class="mr10"
+          style="width: 150px"
+          popper-class="select"
+          @change="categorychanged"
+        >
+          <el-option key="1" label="设备报警" value="windturbine"></el-option>
+          <el-option
+            key="2"
+            label="升压站报警"
+            value="booststation"
+          ></el-option>
+        </el-select>
+        <el-select
+          v-model="query.wpId"
           clearable
           class="mr10"
           style="width: 150px"
-          placeholder="全部场站"
+          :placeholder="
+            query.alarmType == 'windturbine' ? '全部场站' : '全部升压站'
+          "
           popper-class="select"
-          @change="changeStation()"
+          @change="changeStation"
         >
           <el-option
             v-for="item in stationList"
             :key="item.id"
             :value="item.id"
-            :label="item.name"
+            :label="item.aname"
           ></el-option>
         </el-select>
         <el-select
+          v-if="query.alarmType == 'windturbine'"
           v-model="query.modelId"
           clearable
           class="mr10"
@@ -72,13 +89,12 @@
           popper-class="select"
         >
           <el-option
-            v-for="item in state.modelList"
-            :key="item"
-            :value="item"
-            :label="item"
+            v-for="item in modelList"
+            :key="item.id"
+            :value="item.id"
+            :label="item.aname"
           ></el-option>
         </el-select>
-
         <el-input
           placeholder="请输入名称"
           v-model="query.name"
@@ -92,7 +108,38 @@
       </div>
     </el-row>
     <el-table :data="state.tableData" :highlight-current-row="true" border>
-      <el-table-column label="序列号" align="center" prop="id" />
+      <el-table-column
+        v-for="item in query.alarmType == 'windturbine'
+          ? state.tableHeader
+          : state.tableHeader1"
+        :key="item.code"
+        :label="item.title"
+        align="center"
+        :prop="item.code"
+        show-overflow-tooltip
+      >
+        <template #default="scope">
+          <span v-if="item.code == 'rank'">
+            {{ rankConvert(scope.row.rank) }}
+          </span>
+          <span v-else-if="item.code == 'alarmType'">
+            {{ alarmTypeConvert(scope.row.alarmType) }}
+          </span>
+          <span v-else-if="item.code == 'deviceType'">
+            {{ alarmTypeConvert(scope.row.deviceType) }}
+          </span>
+          <span v-else-if="item.code == 'enable'">
+            {{ enabledConvert(scope.row.enable) }}
+          </span>
+          <span v-else-if="item.code == 'characteristic'">
+            {{ charactConvert(scope.row.characteristic) }}
+          </span>
+          <span v-else>
+            {{ scope.row[item.code] }}
+          </span>
+        </template>
+      </el-table-column>
+      <!-- <el-table-column label="序列号" align="center" prop="id" />
       <el-table-column label="统一编码" align="center" prop="uniformCode">
         <template #default="scope">{{
           // ednaValueConvert(scope.row.ednaValue)
@@ -106,7 +153,7 @@
         width="180"
       />
       <el-table-column label="停机类型" align="center" prop="characteristic" />
-      <el-table-column label="风机型号" align="center" prop="modelId" />
+      <el-table-column label="设备型号" align="center" prop="modelId" />
       <el-table-column label="报警类型" align="center" prop="warningTypeId" />
       <el-table-column label="故障编码" align="center" prop="faultCode" />
       <el-table-column label="报警级别" align="center" prop="levelId">
@@ -153,7 +200,7 @@
         <template #default="scope">
           <span>{{ relatePartConvert(scope.row.relatedParts) }}</span>
         </template>
-      </el-table-column>
+      </el-table-column> -->
       <el-table-column label="操作" align="center" width="100">
         <template #default="scope">
           <el-button
@@ -188,43 +235,124 @@
   </el-card>
 </template>
 <script setup>
-import { windturbinebj_fetchTableData, getStationinfo } from "/@/api/api.js";
+import {
+  windturbinebj_fetchTableData,
+  getStationinfo,
+  fetchRelatePartAndAlarmType,
+  fetchModel,
+} from "/@/api/api.js";
 import { outExportExcel } from "/@/utils/exportExcel"; //引入文件
-import { ref, onMounted, provide, computed, reactive, watch } from "vue";
+import {
+  ref,
+  onMounted,
+  provide,
+  computed,
+  reactive,
+  watch,
+  nextTick,
+} from "vue";
 import { useStore } from "vuex";
 import { ElMessageBox, ElMessage } from "element-plus";
 import windturbinecomponents from "./windturbine_components.vue";
 const token = { token: sessionStorage.getItem("token") };
 const store = useStore();
-const stationList = computed(() => store.state.stationList);
-const isStation = computed(() => store.getters.isStation);
-const state = reactive({
-  tableData: [],
-  modelList: [],
-  visible: false,
-  form: {},
+onMounted(() => {
+  getequipmentmodel_list();
 });
 const query = reactive({
   pagenum: 1,
   pagesize: 10,
-  stationId: "",
+  wpId: "",
   modelId: "",
   name: "",
+  alarmType: "windturbine",
 });
-let total = ref(0);
-onMounted(() => {
-  getData();
-  getequipmentmodel_list();
+const state = reactive({
+  tableData: [],
+  modelList: [],
+  modelListAll: {}, //型号所有列表
+  visible: false,
+  form: {},
+  tableHeader: [
+    { title: "编码", code: "id" },
+    { title: "场站", code: "stationId", width: "100" },
+    { title: "设备", code: "deviceId", width: "100" },
+    { title: "机型", code: "modelId" },
+    { title: "部件", code: "components" },
+    { title: "报警描述", code: "description", width: "150" },
+    { title: "设备部件", code: "components" },
+    { title: "级别", code: "rank" },
+    { title: "特性", code: "characteristic" },
+    { title: "设备类型", code: "deviceType" },
+    { title: "报警类型", code: "alarmType" },
+    { title: "报警类别", code: "triggerType" },
+    { title: "是否启用", code: "enable" },
+    { title: "是否可复位", code: "resetTable" },
+  ],
+  tableHeader1: [
+    { title: "编码", code: "id" },
+    { title: "升压站", code: "stationName" },
+    { title: "规则名称", code: "name" },
+    { title: "表达式", code: "expression" },
+    { title: "描述", code: "description" },
+    { title: "级别", code: "rank" },
+    { title: "类型", code: "alarmType" },
+    { title: "是否启用", code: "enable" },
+  ],
 });
-const dialogclose = () => {
-  state.visible = false;
-  getData();
+// 机型
+const getequipmentmodel_list = async () => {
+  const { data } = await fetchModel();
+  state.modelListAll = data;
 };
+// 场站列表/升压站列表
+const stationList = computed(() => {
+  if (query.alarmType == "windturbine") {
+    return store.state.stationListAll;
+  } else {
+    return store.state.booststationList;
+  }
+});
+watch(
+  () => stationList,
+  (val, old) => {
+    val.value.length &&
+      nextTick(async () => {
+        query.wpId = val.value[0]?.id;
+        await getData();
+      });
+  },
+  {
+    deep: true,
+    immediate: true,
+  }
+);
+//型号列表
+const modelList = computed(() => {
+  if (query.wpId == "") {
+    return [];
+  } else {
+    return state.modelListAll[query.wpId];
+  }
+});
+const isStation = computed(() => store.getters.isStation);
+
+let total = ref(0);
 const getData = async () => {
-  const res = await windturbinebj_fetchTableData(query);
+  const { data: res } = await windturbinebj_fetchTableData(query);
   state.tableData = res.records;
   total.value = res.total;
 };
+//changeStation
+const changeStation = async () => {
+  query.modelId = "";
+  getData();
+};
+const dialogclose = () => {
+  state.visible = false;
+  getData();
+};
+
 const handleInsert = () => {
   state.visible = true;
 };
@@ -234,24 +362,7 @@ const handleEditClick = (row) => {
   state.form = obj;
   state.visible = true;
 };
-//changeStation
-const changeStation = async () => {
-  query.modelId = "";
-  await getequipmentmodel_list();
-};
-// 机型
-const getequipmentmodel_list = async () => {
-  const { data } = await getStationinfo(query.stationId);
-  if (query.stationId == "") {
-    let arr = [];
-    data.forEach((e) => {
-      arr.push(...e.pointModelList);
-    });
-    state.modelList = [...new Set(arr)];
-  } else {
-    state.modelList = data[0].pointModelList;
-  }
-};
+
 // 分页导航
 const handlePageChange = (val) => {
   query.pagenum = val;
@@ -267,7 +378,7 @@ const tableHeader = [
   "是否有子节点",
   "序列号",
   "类别 ：正常停机，正常启动，快速停机，紧急停机",
-  "风机型号",
+  "设备型号",
   "全部默认为1",
   "统一编码",
   "是否展示（0：是；1：否）",
@@ -301,23 +412,23 @@ const tableKey = [
 ];
 // 批量导出
 const export2Excel = async () => {
-  let { name, stationId, modelId } = query;
+  let { name, wpId, modelId } = query;
   const res = await windturbinebj_fetchTableData({
     pagenum: 1,
     pagesize: 999999,
     name,
-    stationId,
+    wpId,
     modelId,
   });
 
   ElMessage.success(`导出成功!`);
-  outExportExcel(tableHeader, tableKey, res.records, "风机报警配置导出excel");
+  outExportExcel(tableHeader, tableKey, res.records, "设备报警配置导出excel");
 };
 // 模板下载
 const outExe = () => {
   const data = [];
   ElMessage.success(`导出成功!`);
-  outExportExcel(tableHeader, tableKey, data, "风机报警模板");
+  outExportExcel(tableHeader, tableKey, data, "设备报警模板");
 };
 // 批量导入
 const handleSuccess = (response, file, fileList) => {
@@ -328,8 +439,39 @@ const handleProgress = (response, file, fileList) => {};
 const handleError = (response, file, fileList) => {
   ElMessage.success("导入失败!");
 };
-// 报警级别
-const levelIdConvert = (val) => {
+//级别
+const rankConvert = (val) => {
+  if (val == 1) {
+    return "低";
+  } else if (val == 2) {
+    return "中低";
+  } else if (val == 3) {
+    return "中";
+  } else if (val == 4) {
+    return "中高";
+  } else if (val == 5) {
+    return "高";
+  }
+};
+// 类型
+const alarmTypeConvert = (val) => {
+  if (val === "windturbine") {
+    return "设备";
+  } else if (val === "booststation") {
+    return "升压站";
+  }
+};
+// 状态
+const enabledConvert = (val) => {
+  if (val === false) {
+    return "停用";
+  } else if (val === true) {
+    return "启用";
+  }
+};
+
+// 特征
+const charactConvert = (val) => {
   switch (val) {
     case "ZC_BJ":
       return "运转正常";
@@ -501,4 +643,4 @@ const relatePartConvert = (val) => {
 .el-button + .el-button {
   margin-left: 10px;
 }
-</style>
+</style>

src/pages/alarmConfig/bj_windturbine/windturbine_components.vue

@@ -1,6 +1,12 @@
 <template>
   <el-dialog v-model="isShow" width="800px" :before-close="handleClose">
-    <el-form ref="ruleFormRef" :model="form" :rules="rules" label-position="right" label-width="100px">
+    <el-form
+      ref="ruleFormRef"
+      :model="form"
+      :rules="rules"
+      label-position="right"
+      label-width="100px"
+    >
       <el-row :gutter="50">
         <el-col :span="12">
           <el-form-item label="序列号" prop="id">
@@ -10,7 +16,12 @@
         <el-col :span="12">
           <el-form-item label="制造商" prop="manufacturerCode">
             <el-select class="width-100" v-model="form.manufacturerCode">
-              <el-option v-for="item in state.creator" :key="item.id" :value="item.id" :label="item.name" />
+              <el-option
+                v-for="item in state.creator"
+                :key="item.id"
+                :value="item.id"
+                :label="item.name"
+              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -18,18 +29,38 @@
       <el-row :gutter="50">
         <el-col :span="12">
           <el-form-item label="风机型号" prop="modelId">
-            <el-select class="width-100" v-model="form.modelId" @change="modelChange">
-              <el-option v-for="item in state.modelList" :key="item" :value="item" :label="item" />
+            <el-select
+              class="width-100"
+              v-model="form.modelId"
+              @change="modelChange"
+            >
+              <el-option
+                v-for="item in state.modelList"
+                :key="item"
+                :value="item"
+                :label="item"
+              />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="风机测点" prop="uniformCode">
-            <el-select v-model="form.uniformCode" class="width-100" filterable placeholder="请选择">
-              <el-option v-for="item in state.pointList" :key="item.id" :label="item.uniformCode + '    ' + item.name"
-                :value="item.uniformCode">
+            <el-select
+              v-model="form.uniformCode"
+              class="width-100"
+              filterable
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in state.pointList"
+                :key="item.id"
+                :label="item.uniformCode + '    ' + item.name"
+                :value="item.uniformCode"
+              >
                 <span style="float: left">{{ item.name }}</span>
-                <span style="float: right; color: #8492a6; font-size: 13px">{{ item.uniformCode }}</span>
+                <span style="float: right; color: #8492a6; font-size: 13px">{{
+                  item.uniformCode
+                }}</span>
               </el-option>
             </el-select>
           </el-form-item>
@@ -39,7 +70,12 @@
         <el-col :span="12">
           <el-form-item label="停机类型" prop="characteristic">
             <el-select class="width-100" v-model="form.characteristic">
-              <el-option v-for="item in state.CHARACTERISTIC" :key="item" :label="item" :value="item" />
+              <el-option
+                v-for="item in state.CHARACTERISTIC"
+                :key="item"
+                :label="item"
+                :value="item"
+              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -58,7 +94,12 @@
         <el-col :span="12">
           <el-form-item label="报警级别" prop="levelId">
             <el-select class="width-100" v-model="form.levelId">
-              <el-option v-for="item in state.LEVELID" :key="item.id" :value="item.id" :label="item.name" />
+              <el-option
+                v-for="item in state.LEVELID"
+                :key="item.id"
+                :value="item.id"
+                :label="item.name"
+              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -67,7 +108,12 @@
         <el-col :span="12">
           <el-form-item label="报警分类" prop="warningClassIfyId">
             <el-select class="width-100" v-model="form.warningClassIfyId">
-              <el-option v-for="item in state.warningClassifyList" :key="item.id" :value="item.id" :label="item.name" />
+              <el-option
+                v-for="item in state.warningClassifyList"
+                :key="item.id"
+                :value="item.id"
+                :label="item.name"
+              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -91,7 +137,12 @@
         <el-col :span="12">
           <el-form-item label="关联部件" prop="relatedParts">
             <el-select class="width-100" v-model="form.relatedParts">
-              <el-option v-for="item in state.relatePartList" :key="item.id" :value="item.id" :label="item.name" />
+              <el-option
+                v-for="item in state.relatePartList"
+                :key="item.id"
+                :value="item.id"
+                :label="item.name"
+              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -111,7 +162,9 @@
     <template #footer>
       <span class="dialog-footer">
         <el-button @click="closeDialog">取 消</el-button>
-        <el-button type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
+        <el-button type="primary" @click="submitForm(ruleFormRef)"
+          >确 定</el-button
+        >
       </span>
     </template>
   </el-dialog>
@@ -120,9 +173,9 @@
 import { ref, onMounted, reactive, computed, watch, nextTick } from "vue";
 import { ElMessageBox, ElMessage } from "element-plus";
 import {
-  fetchRelatePart,
+  //   fetchRelatePart,
   windturbinebj_postSave,
-  getDIPointList,
+  fetchRelatePartAndAlarmType,
   getStationinfo,
   fetchWarningClassify,
 } from "/@/api/api.js";
@@ -131,43 +184,43 @@ const store = useStore();
 const stationList = computed(() => store.state.stationList);
 onMounted(() => {
   getfetchRelatePart();
-  getdatadictionaryList()
-  getfetchWarningClassify()
+  getdatadictionaryList();
+  getfetchWarningClassify();
 });
 watch(
   () => props.isVisible,
   (val, old) => {
-    isShow.value = val
+    isShow.value = val;
   },
   {
     deep: true,
-  },
+  }
 );
 watch(
   () => props.form?.id,
   (val, old) => {
     if (val != "") {
       nextTick(async () => {
-        modelChange()
+        modelChange();
       });
     }
   },
   {
     deep: true,
-  },
+  }
 );
 watch(
   () => props.form,
   (val, old) => {
     nextTick(() => {
-      form.value = val
+      form.value = val;
     });
   },
   {
     deep: true,
   }
-)
-const isShpw=ref(false);
+);
+const isShow = ref(false);
 const form = ref({
   id: "",
   levelId: "",
@@ -186,7 +239,7 @@ const form = ref({
   faultCode: "",
   relatedParts: "",
   userName: "",
-})
+});
 const emits = defineEmits(["close"]);
 const props = defineProps({
   isVisible: {
@@ -203,7 +256,8 @@ const toEmits = () => {
 const state = reactive({
   modelList: [],
   pointList: [],
-  relatePartList: [],
+  fetchListAll: [],
+//   relatePartList: [],
   warningClassifyList: [],
   creator: [
     {
@@ -231,7 +285,6 @@ const state = reactive({
     { id: "XD_BJ", name: "限电/计划停机" },
   ],
   CHARACTERISTIC: ["正常停机", "正常启动", "快速停机", "紧急停机"],
-
 });
 const ruleFormRef = ref(null);
 const rules = reactive({
@@ -256,23 +309,34 @@ const rules = reactive({
     trigger: "change",
   },
 });
-
+//部件列表
+const relatePartList = computed(() => {
+//   if (query.wpId == "") {
+//     return [];
+//   } else {
+//     if (query.wpId.includes("FDC")) {
+//       return state.fetchListAll?.fjbj;
+//     } else {
+//       return state.fetchListAll?.gfbj;
+//     }
+//   }
+});
 const modelChange = async () => {
   const { data } = await getDIPointList(form.value?.modelId);
-  state.pointList = data
+  state.pointList = data;
 };
 //机型
 const getdatadictionaryList = async () => {
-  const { data } = await getStationinfo('');
-    let arr = []
-    data.forEach(e => {
-      arr.push(...e.pointModelList)
-    });
-    state.modelList = [...new Set(arr)]
+  const { data } = await getStationinfo("");
+  let arr = [];
+  data.forEach((e) => {
+    arr.push(...e.pointModelList);
+  });
+  state.modelList = [...new Set(arr)];
 };
 //所属部件
 const getfetchRelatePart = async () => {
-  const res = await fetchRelatePart();
+  const res = await fetchRelatePartAndAlarmType();
   state.relatePartList = res;
 };
 const getfetchWarningClassify = async () => {
@@ -285,14 +349,14 @@ const save = async () => {
   const res = await windturbinebj_postSave(form.value);
   console.warn(res);
   ElMessage.success(`保存成功!`);
-  closeDialog()
+  closeDialog();
 };
 //提交
 const submitForm = async (formEl) => {
   if (!formEl) return;
   await formEl.validate((valid, fields) => {
     if (valid) {
-      save()
+      save();
     } else {
       console.log("error submit!", fields);
     }
@@ -323,4 +387,4 @@ const closeDialog = () => {
 .width-100 {
   width: 100%;
 }
-</style>
+</style>

src/pages/baseData/FanDataStatisticChart.vue

@@ -0,0 +1,458 @@
+<template>
+  <!-- 风机原始数据统计表页面 -->
+  <div class="AllPage">
+    <!-- 页面头部 multiple多选属性 -->
+    <el-card>
+      <el-space>
+        <div class="search-input">
+          <span class="lable">场站：</span>
+          <el-select v-model="state.changZhan" placeholder="全部场站">
+            <el-option
+              v-for="item in changZhanArray"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">型号：</span>
+          <el-select v-model="state.modelId" placeholder="全部型号">
+            <el-option
+              v-for="item in modelList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">部件：</span>
+          <el-select v-model="state.components" placeholder="全部部件">
+            <el-option
+              v-for="item in componentList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.nemCode"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">开始日期：</span>
+          <el-date-picker
+            v-model="state.starttime"
+            type="datetime"
+            placeholder="选择日期"
+            popper-class="date-select"
+            value-format="YYYY-MM-DD HH:mm:ss"
+          >
+          </el-date-picker>
+        </div>
+        <div class="search-input">
+          <span class="lable">结束日期：</span>
+          <el-date-picker
+            v-model="state.endtime"
+            type="datetime"
+            placeholder="选择日期"
+            popper-class="date-select"
+            value-format="YYYY-MM-DD HH:mm:ss"
+          >
+          </el-date-picker>
+        </div>
+        <el-button type="primary" @click="getTableList">查询</el-button>
+      </el-space>
+    </el-card>
+
+    <!-- 页面下部---统计表 -->
+    <div class="table_all">
+      <el-table
+        :data="state.tableData"
+        border
+        :cell-class-name="tableCell"
+        :header-row-class-name="tableRowClassName"
+        height="100%"
+        width="100%"
+        @cell-click="handle"
+      >
+        <el-table-column prop="wtId" fixed label="风机编号" align="center" />
+        <el-table-column
+          :label="item.label"
+          v-for="(item, index) in state.tHeard"
+          :key="index"
+          header-align="center"
+          show-overflow-tooltip
+        >
+          <template #default="{ row }">
+            <div class="bar">
+              <div
+                class="bar-percent"
+                :style="{
+                  width: (row?.count / (row?.count + row?.time)) * 100 + 'px',
+                }"
+              ></div>
+              <span class="value">{{ row?.count }} 次数</span>
+            </div>
+            <div class="bar">
+              <div
+                class="bar-percent"
+                :style="{
+                  width: (row?.time / (row?.count + row?.time)) * 100 + 'px',
+                }"
+              ></div>
+              <span class="value">{{ row?.time }} 分钟</span>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <el-dialog
+      v-model="dialogVisible"
+      width="80%"
+      :before-close="dialogClose"
+      custom-class="currentPdfDialogStyle"
+    >
+      <el-table
+        :data="DataDetail"
+        border
+        :cell-class-name="tableCell"
+        :header-row-class-name="tableRowClassName"
+        height="600px"
+        @row-click="handle"
+      >
+        <el-table-column prop="windturbineId" label="风机编号" align="center" />
+        <el-table-column prop="alarmName" label="报警名称" align="center" />
+        <el-table-column prop="alarmDate" label="时间" align="center" />
+        <el-table-column prop="type" label="类型(触发/解除)" align="center">
+          <template #default="scope">
+            <!-- <span v-if="scope.row.type === 1">触发</span>
+            <span v-if="scope.row.type === 0">解除</span> -->
+            {{ scope.row.type === 1 ? "触发" : "解除" }}
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+    <!-- <el-pagination
+      small
+      background
+      layout="total, prev, pager, next"
+      :current-page="pageParam.pagenum"
+      :page-size="pageParam.pagesize"
+      :total="pageParam.total"
+      @current-change="changePage"
+    ></el-pagination> -->
+  </div>
+</template>
+
+<script setup>
+import { useStore } from "vuex";
+// import BASE from "@tools/basicTool.js";
+import {
+  ref,
+  onMounted,
+  watch,
+  reactive,
+  computed,
+  onUnmounted,
+  nextTick,
+} from "vue";
+import {
+  getAlarmCountList,
+  fetchModel,
+  fetchRelatePartAndAlarmType,
+} from "/@/api/api.js";
+import dayjs from "dayjs";
+onMounted(() => {
+  getequipmentmodel_list();
+  getfetchRelatePart();
+  getTableList();
+});
+const store = useStore();
+const changZhanArray = computed(() => store.state.stationListAll);
+const state = reactive({
+  tableData: [],
+  tHeard: [
+    // { title: "风机编号", code: "windturbineCode" },
+    // { title: "时间", code: "time" },
+    // { title: "报警信息", code: "alertText" },
+    // { title: "部件", code: "relatePartsText" },
+  ],
+  changZhan: "",
+  components: "", //部件
+  modelId: "", //型号
+  modelListAll: {},
+  fetchListAll: {},
+  starttime: dayjs().add(-1, "day").format("YYYY-MM-DD HH:mm:ss"),
+  endtime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
+  dialogVisible: false,
+});
+// 机型
+const getequipmentmodel_list = async () => {
+  const { data } = await fetchModel();
+  state.modelListAll = data;
+};
+//所属部件
+const getfetchRelatePart = async () => {
+  const { data } = await fetchRelatePartAndAlarmType();
+  state.fetchListAll = data;
+};
+//型号列表
+const modelList = computed(() => {
+  if (state.changZhan == "") {
+    return [];
+  } else {
+    return state.modelListAll[state.changZhan];
+  }
+});
+//部件列表
+const componentList = computed(() => {
+  if (state.changZhan == "") {
+    return [];
+  } else {
+    if (state.changZhan.includes("FDC")) {
+      return state.fetchListAll?.fjbj;
+    } else {
+      return state.fetchListAll?.gfbj;
+    }
+  }
+});
+// 获取列表数据 调用接口
+function getTableList() {
+  getAlarmCountList({
+    stationid: state.changZhan || "",
+    begin: state.starttime,
+    end: state.endtime,
+    alarmType: "windturbine",
+    components: state.components,
+    modelId: state.modelId,
+  }).then((res) => {
+    if (res.length) {
+      let tableData = [];
+      let tHeard = [];
+      let data = res;
+      data.forEach((pEle) => {
+        for (let wtId in pEle) {
+          let wtItem = data.find((tableItem) => {
+            return wtId === tableItem.windturbineId;
+          });
+          !wtItem && (wtItem = { wtId });
+          console.log(wtItem);
+          pEle[wtId].forEach((cEle) => {
+            // console.log(cEle);
+            let someRes = tHeard.some((findEle) => {
+              return findEle.label == cEle.alertText;
+            });
+
+            if (!someRes) {
+              tHeard.push({
+                label: cEle.alertText,
+              });
+            }
+            wtItem["count"] = cEle.count + 20;
+            wtItem["time"] = cEle.time + 523;
+          });
+          tableData.push(wtItem);
+        }
+      });
+      state.tHeard = tHeard;
+      state.tableData = tableData;
+    }
+  });
+}
+// export default {
+//   data() {
+//     return {
+//       tableData: [],
+//       tHeard: [],
+//       changZhan: "",
+//     //   changZhanArray: [],
+//       starttime: dayjs(new Date(new Date() - 1 * 24 * 60 * 60 * 1000)).format(
+//         "YYYY-MM-DD"
+//       ),
+//       endtime: dayjs(new Date()).format("YYYY-MM-DD"),
+
+//       // pageParam: {
+//       //   pagenum: 1,
+//       //   pagesize: 10,
+//       //   total: 0,
+//       // },
+//       dialogVisible: false,
+//     };
+//   },
+
+//   created() {
+//     this.getTableList();
+//   },
+
+//   mounted() {
+//     this.$nextTick(() => {
+//       this.getChangZhan();
+//     });
+//   },
+
+//   methods: {
+//     //获取场站
+//     getChangZhan() {
+//       //   getStationinfoAll().then((res) => {
+//       //     this.changZhan = res.data[0].id;
+//       //     this.changZhanArray = res.data;
+//       //     // console.log('changzhang>>>>>>>>>>>',res)
+//       //     this.getTableList();
+//       //   });
+//     },
+//     // 查询按钮
+//     Select() {
+//       this.getTableList();
+//     },
+//     // 对时间进行包装
+//     getTime(date) {
+//       var y = date.getFullYear();
+//       var m = date.getMonth() + 1;
+//       m = m < 10 ? "0" + m : m;
+//       var d = date.getDate();
+//       d = d < 10 ? "0" + d : d;
+//       return y + "-" + m + "-" + d + " ";
+//     },
+
+//     // 获取列表数据 调用接口
+//     getTableList() {
+//       getAlarmCountList({
+//         stationid: this.changZhan || "",
+//         starttime: dayjs(this.starttime).format("YYYY-MM-DD"),
+//         endtime: dayjs(this.endtime).format("YYYY-MM-DD"),
+//       }).then((res) => {
+//         console.log("列表数据》》》》》》》", res);
+//         if (res && res.status === 20000) {
+//           let tHeard = [];
+//           let tableData = [];
+
+//           this.tableData = res.data;
+
+//           res.data.forEach((pEle) => {
+//             for (let wtId in pEle) {
+//               let wtItem = tableData.find((tableItem) => {
+//                 return wtId === tableItem.wtId;
+//               });
+//               !wtItem && (wtItem = { wtId });
+//               pEle[wtId].forEach((cEle) => {
+//                 let someRes = tHeard.some((findEle) => {
+//                   return findEle.parts === cEle.parts;
+//                 });
+
+//                 if (!someRes) {
+//                   tHeard.push({
+//                     parts: cEle.parts,
+//                     label: cEle.partsName,
+//                     align: "center",
+//                     prop: `${cEle.parts}_Value`,
+//                   });
+//                 }
+
+//                 wtItem[`${cEle.parts}_Value`] = wtItem[`${cEle.parts}_Value`]
+//                   ? wtItem[`${cEle.parts}_Value`] + cEle.count
+//                   : cEle.count;
+//               });
+//               tableData.push(wtItem);
+//             }
+//           });
+
+//           this.tHeard = tHeard;
+//           this.tableData = tableData;
+//         }
+//       });
+//     },
+
+//     // 单元格点击事件
+//     handle(row, column, event, cell) {
+//       let parts =
+//         this.tHeard.find((ele) => {
+//           return ele.label === column.label;
+//         })?.parts || "";
+//       getDialogData({
+//         stationid: this.changZhan || "",
+//         starttime: dayjs(this.starttime).format("YYYY-MM-DD"),
+//         endtime: dayjs(this.endtime).format("YYYY-MM-DD"),
+//         windturbineid: row.wtId,
+//         parts,
+//       }).then((res) => {
+//         if (res && res.status === 20000) {
+//           console.log("弹窗数据》》》》》》》", res);
+
+//           if (res.data.length) {
+//             if (column.property !== "wtId") {
+//               this.DataDetail = res.data;
+//               let tableArr = [];
+//               res.data.forEach((currentItem) => {
+//                 // if (currentItem.type === 1) {
+//                 //   currentItem.type = '触发'
+//                 // }
+//                 // else if (currentItem.type === 0) {
+//                 //   currentItem.type = '解除'
+//                 // }
+//                 tableArr.push(currentItem);
+//               });
+
+//               this.dialogVisible = true;
+//             }
+//           } else {
+//             BASE.showMsg({
+//               msg: "所选风机暂无数据",
+//             });
+//           }
+//         }
+//       });
+//     },
+
+//     // changePage(val) {
+//     //   this.pageParam.pagenum = val;
+//     //   this.getTableList();
+//     // },
+//   },
+// };
+</script>
+
+<style lang="scss" scoped>
+.AllPage {
+  height: 100%;
+  .Head {
+    display: flex;
+    width: 100%;
+    height: 5%;
+    margin: 5px 0;
+  }
+  .bar {
+    display: flex;
+    align-items: center;
+    height: 16px;
+    margin: 8px 0;
+
+    .bar-percent {
+      height: 100%;
+      background: #6198ff;
+      margin-right: 8px;
+    }
+  }
+}
+</style>
+
+<style lang="scss">
+.table_all {
+  height: calc(100% - 74px - 30px);
+  padding: 10px;
+  margin-top: 10px;
+  background: #fff;
+  .el-table {
+    .el-table__row {
+      td {
+        cursor: pointer;
+
+        &:first-child {
+          cursor: auto;
+        }
+      }
+    }
+  }
+}
+</style>

src/pages/baseData/FanDataStatisticTable.vue

@@ -2,78 +2,149 @@
   <!-- 风机原始数据统计表页面 -->
   <div class="AllPage">
     <!-- 页面头部 multiple多选属性 -->
-    <div class="Head">
-      <div class="select">
-        <el-select v-model="changZhan" placeholder="全部场站">
-          <el-option
-            v-for="item in changZhanArray"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
+    <el-card>
+      <el-space>
+        <div class="search-input">
+          <span class="lable">场站：</span>
+          <el-select
+            v-model="state.changZhan"
+            @change="changeChangzhan"
+            placeholder="全部场站"
           >
-          </el-option>
-        </el-select>
-      </div>
-
-      <div class="time">
-        <span class="lable">开始日期：</span>
-        <el-date-picker
-          v-model="starttime"
-          type="date"
-          placeholder="选择日期"
-          popper-class="date-select"
-        >
-        </el-date-picker>
-      </div>
-      <div class="time">
-        <span class="lable">结束日期：</span>
-        <el-date-picker
-          v-model="endtime"
-          type="date"
-          placeholder="选择日期"
-          popper-class="date-select"
-        >
-        </el-date-picker>
-      </div>
-
-      <!-- <el-date-picker
-          v-model="planStartEnd"
-          @change="changePick"
-          type="datetimerange"
-          range-separator="至"
-          start-placeholder="开始时间"
-          end-placeholder="结束时间"
-        >
-        </el-date-picker> -->
-
-      <el-button type="primary" @click="Select">查询</el-button>
-    </div>
+            <el-option
+              v-for="item in changZhanArray"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">型号：</span>
+          <el-select
+            v-model="state.modelId"
+            @change="changeModel"
+            placeholder="全部型号"
+          >
+            <el-option
+              v-for="item in modelList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">部件：</span>
+          <el-select
+            v-model="state.components"
+            multiple
+            collapse-tags
+            placeholder="全部部件"
+            @change="changeComponents"
+          >
+            <el-option
+              v-for="item in componentList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.nemCode"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">报警描述：</span>
+          <el-select
+            v-model="state.alarmIds"
+            multiple
+            collapse-tags
+            placeholder="全部描述"
+          >
+            <el-option
+              v-for="item in state.alarmIdList"
+              :key="item.id"
+              :label="item.description"
+              :value="item.alarmId"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="search-input">
+          <span class="lable">开始日期：</span>
+          <el-date-picker
+            v-model="state.starttime"
+            type="datetime"
+            placeholder="选择日期"
+            value-format="YYYY-MM-DD HH:mm:ss"
+          >
+          </el-date-picker>
+        </div>
+        <div class="search-input">
+          <span class="lable">结束日期：</span>
+          <el-date-picker
+            v-model="state.endtime"
+            type="datetime"
+            placeholder="选择日期"
+            value-format="YYYY-MM-DD HH:mm:ss"
+          >
+          </el-date-picker>
+        </div>
+        <el-button type="primary" @click="getTableList">查询</el-button>
+      </el-space>
+    </el-card>
 
     <!-- 页面下部---统计表 -->
     <div class="table_all">
       <el-table
-        :data="tableData"
+        :data="state.tableData"
         border
         :cell-class-name="tableCell"
         :header-row-class-name="tableRowClassName"
-        height="740px"
         @cell-click="handle"
+        height="100%"
       >
-        <el-table-column prop="wtId" label="风机编号" align="center" />
+        <el-table-column
+          prop="wtname"
+          label="风机编号"
+          align="center"
+          width="80"
+        />
         <el-table-column
           :label="item.label"
-          :align="item.align"
-          v-for="(item, index) in tHeard"
+          v-for="(item, index) in state.tHeard"
           :key="index"
+          header-align="center"
+          show-overflow-tooltip
         >
-          <template #default="scope">
-            <span>{{
-              `${
-                scope.row[`${item.parts}_Value`]
-                  ? scope.row[`${item.parts}_Value`] + "次"
-                  : "---"
-              }`
-            }}</span>
+          <template #default="{ row }">
+            <div class="bar">
+              <div
+                class="bar-percent"
+                :style="{
+                  width:
+                    (row[`${item.code}_count`] /
+                      (row[`${item.code}_count`] + row[`${item.code}_time`])) *
+                      100 +
+                    'px',
+                }"
+              ></div>
+              <span class="value">{{ row[`${item.code}_count`] }} 次数</span>
+            </div>
+            <div class="bar">
+              <div
+                class="bar-percent"
+                :style="{
+                  width:
+                    (row[`${item.code}_time`] /
+                      (row[`${item.code}_count`] + row[`${item.code}_time`])) *
+                      100 +
+                    'px',
+                }"
+              ></div>
+              <span class="value">{{ row[`${item.code}_time`] }} 分钟</span>
+            </div>
           </template>
         </el-table-column>
       </el-table>
@@ -116,185 +187,251 @@
   </div>
 </template>
 
-<script>
-import BASE from "@tools/basicTool.js";
+<script setup>
+import { useStore } from "vuex";
+// import BASE from "@tools/basicTool.js";
+import {
+  ref,
+  onMounted,
+  watch,
+  reactive,
+  computed,
+  onUnmounted,
+  nextTick,
+} from "vue";
 import {
   getAlarmCountList,
-  getDialogData,
-  getStationinfoAll,
+  fetchModel,
+  fetchRelatePartAndAlarmType,
+  GetAlarmId,
 } from "/@/api/api.js";
 import dayjs from "dayjs";
-export default {
-  data() {
-    return {
-      tableData: [],
-      tHeard: [],
-      changZhan: "",
-      changZhanArray: [],
-      starttime: dayjs(new Date(new Date() - 1 * 24 * 60 * 60 * 1000)).format(
-        "YYYY-MM-DD"
-      ),
-      endtime: dayjs(new Date()).format("YYYY-MM-DD"),
-
-      // pageParam: {
-      //   pagenum: 1,
-      //   pagesize: 10,
-      //   total: 0,
-      // },
-      dialogVisible: false,
-    };
-  },
+onMounted(() => {
+  getequipmentmodel_list();
+  getfetchRelatePart();
+  //   getTableList();
+});
 
-  created() {
-    this.getTableList();
+const store = useStore();
+const changZhanArray = computed(() => store.state.stationListAll);
+const state = reactive({
+  tableData: [],
+  tHeard: [],
+  changZhan: "",
+  components: "", //部件
+  modelId: "", //型号
+  alarmIds: "",
+  alarmIdList: [],
+  modelListAll: {},
+  fetchListAll: {},
+  starttime: dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss"),
+  endtime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
+  dialogVisible: false,
+});
+// 机型
+const getequipmentmodel_list = async () => {
+  const { data } = await fetchModel();
+  state.modelListAll = data;
+};
+//所属部件
+const getfetchRelatePart = async () => {
+  const { data } = await fetchRelatePartAndAlarmType();
+  state.fetchListAll = data;
+};
+//型号列表
+const modelList = computed(() => {
+  if (state.changZhan == "") {
+    return [];
+  } else {
+    return state.modelListAll[state.changZhan];
+  }
+});
+//部件列表
+const componentList = computed(() => {
+  if (state.changZhan == "") {
+    return [];
+  } else {
+    if (state.changZhan.includes("FDC")) {
+      return state.fetchListAll?.fjbj;
+    } else {
+      return state.fetchListAll?.gfbj;
+    }
+  }
+});
+watch(
+  () => changZhanArray,
+  (val, old) => {
+    val.value[0] &&
+      nextTick(async () => {
+        state.changZhan = changZhanArray.value[0]?.id;
+      });
   },
-
-  mounted() {
-    this.$nextTick(() => {
-      this.getChangZhan();
-    });
+  {
+    deep: true,
+    immediate: true,
+  }
+);
+watch(
+  () => [modelList, componentList],
+  (val) => {
+    let arr = val.map((item) => item.value);
+    if (arr[0] && arr[0].length && arr[1] && arr[1].length) {
+      state.modelId = [arr[0][0]?.nemCode];
+      state.components = [arr[1][0]?.nemCode];
+      getAlarmId();
+    }
   },
+  {
+    deep: true,
+    immediate: true,
+  }
+);
+function changeModel(val) {
+  state.modelId = val;
+  getAlarmId();
+}
+function changeComponents(val) {
+  state.components = val;
+  getAlarmId();
+}
+function changeChangzhan(val) {
+  state.changZhan = val;
+  getAlarmId();
+}
+function getAlarmId() {
+  GetAlarmId({
+    components: state.components,
+    modelId: state.modelId,
+    wpId: state.changZhan,
+  }).then(({ data }) => {
+    state.alarmIdList = data;
+    state.alarmIds =
+      data.length <= 5
+        ? data.map((item) => item.alarmId)
+        : data.slice(0, 5).map((item) => item.alarmId);
+    getTableList();
+  });
+}
+// 获取列表数据 调用接口
+function getTableList() {
+  getAlarmCountList({
+    stationid: state.changZhan || "",
+    begin: state.starttime,
+    end: state.endtime,
+    timeType: "s",
+    components: state.components,
+    modelId: state.modelId,
+    alarmIds: state.alarmIds,
+  }).then((res) => {
+    if (res.length) {
+      let tableData = [];
+      let tHeard = [];
+      let data = res;
+      data.forEach((pEle) => {
+        for (let wtId in pEle) {
+          let wtItem = data.find((tableItem) => {
+            return wtId === tableItem.windturbineId;
+          });
+          !wtItem && (wtItem = { wtId });
+          pEle[wtId].forEach((cEle) => {
+            let someRes = tHeard.some((findEle) => {
+              return findEle.label == cEle.alertText;
+            });
 
-  methods: {
-    //获取场站
-    getChangZhan() {
-      getStationinfoAll().then((res) => {
-        this.changZhan = res.data[0].id;
-        this.changZhanArray = res.data;
-        // console.log('changzhang>>>>>>>>>>>',res)
-        this.getTableList();
-      });
-    },
-    // 查询按钮
-    Select() {
-      this.getTableList();
-    },
-    // 对时间进行包装
-    getTime(date) {
-      var y = date.getFullYear();
-      var m = date.getMonth() + 1;
-      m = m < 10 ? "0" + m : m;
-      var d = date.getDate();
-      d = d < 10 ? "0" + d : d;
-      return y + "-" + m + "-" + d + " ";
-    },
-
-    // 获取列表数据 调用接口
-    getTableList() {
-      getAlarmCountList({
-        stationid: this.changZhan || "",
-        starttime: dayjs(this.starttime).format("YYYY-MM-DD"),
-        endtime: dayjs(this.endtime).format("YYYY-MM-DD"),
-      }).then((res) => {
-        console.log("列表数据》》》》》》》", res);
-        if (res && res.status === 20000) {
-          let tHeard = [];
-          let tableData = [];
-
-          this.tableData = res.data;
-
-          res.data.forEach((pEle) => {
-            for (let wtId in pEle) {
-              let wtItem = tableData.find((tableItem) => {
-                return wtId === tableItem.wtId;
-              });
-              !wtItem && (wtItem = { wtId });
-              pEle[wtId].forEach((cEle) => {
-                let someRes = tHeard.some((findEle) => {
-                  return findEle.parts === cEle.parts;
-                });
-
-                if (!someRes) {
-                  tHeard.push({
-                    parts: cEle.parts,
-                    label: cEle.partsName,
-                    align: "center",
-                    prop: `${cEle.parts}_Value`,
-                  });
-                }
-
-                wtItem[`${cEle.parts}_Value`] = wtItem[`${cEle.parts}_Value`]
-                  ? wtItem[`${cEle.parts}_Value`] + cEle.count
-                  : cEle.count;
+            if (!someRes) {
+              tHeard.push({
+                label: cEle.alertText,
+                code: cEle.alarmid,
               });
-              tableData.push(wtItem);
             }
+            wtItem[`${cEle.alarmid}_count`] = cEle.count;
+            wtItem[`${cEle.alarmid}_time`] = cEle.time;
+            wtItem["wtname"] = cEle.windturbineCode;
           });
-
-          this.tHeard = tHeard;
-          this.tableData = tableData;
+          tableData.push(wtItem);
         }
       });
-    },
-
-    // 单元格点击事件
-    handle(row, column, event, cell) {
-      let parts =
-        this.tHeard.find((ele) => {
-          return ele.label === column.label;
-        })?.parts || "";
-      getDialogData({
-        stationid: this.changZhan || "",
-        starttime: dayjs(this.starttime).format("YYYY-MM-DD"),
-        endtime: dayjs(this.endtime).format("YYYY-MM-DD"),
-        windturbineid: row.wtId,
-        parts,
-      }).then((res) => {
-        if (res && res.status === 20000) {
-          console.log("弹窗数据》》》》》》》", res);
+      state.tHeard = tHeard;
+      state.tableData = tableData;
+    } else {
+      state.tHeard = [];
+      state.tableData = [];
+    }
+  });
+}
 
-          if (res.data.length) {
-            if (column.property !== "wtId") {
-              this.DataDetail = res.data;
-              let tableArr = [];
-              res.data.forEach((currentItem) => {
-                // if (currentItem.type === 1) {
-                //   currentItem.type = '触发'
-                // }
-                // else if (currentItem.type === 0) {
-                //   currentItem.type = '解除'
-                // }
-                tableArr.push(currentItem);
-              });
+//     // 单元格点击事件
+//     handle(row, column, event, cell) {
+//       let parts =
+//         this.tHeard.find((ele) => {
+//           return ele.label === column.label;
+//         })?.parts || "";
+//       getDialogData({
+//         stationid: this.changZhan || "",
+//         starttime: dayjs(this.starttime).format("YYYY-MM-DD"),
+//         endtime: dayjs(this.endtime).format("YYYY-MM-DD"),
+//         windturbineid: row.wtId,
+//         parts,
+//       }).then((res) => {
+//         if (res && res.status === 20000) {
+//           console.log("弹窗数据》》》》》》》", res);
 
-              this.dialogVisible = true;
-            }
-          } else {
-            BASE.showMsg({
-              msg: "所选风机暂无数据",
-            });
-          }
-        }
-      });
-    },
+//           if (res.data.length) {
+//             if (column.property !== "wtId") {
+//               this.DataDetail = res.data;
+//               let tableArr = [];
+//               res.data.forEach((currentItem) => {
+//                 // if (currentItem.type === 1) {
+//                 //   currentItem.type = '触发'
+//                 // }
+//                 // else if (currentItem.type === 0) {
+//                 //   currentItem.type = '解除'
+//                 // }
+//                 tableArr.push(currentItem);
+//               });
 
-    // changePage(val) {
-    //   this.pageParam.pagenum = val;
-    //   this.getTableList();
-    // },
-  },
-};
+//               this.dialogVisible = true;
+//             }
+//           } else {
+//             BASE.showMsg({
+//               msg: "所选风机暂无数据",
+//             });
+//           }
+//         }
+//       });
+//     },
 </script>
 
 <style lang="scss" scoped>
 .AllPage {
+  height: 100%;
   .Head {
     display: flex;
     width: 100%;
     height: 5%;
     margin: 5px 0;
-    .select {
-      margin-right: 15px;
-    }
-    .time {
-      margin-right: 15px;
+  }
+  .bar {
+    display: flex;
+    align-items: center;
+    height: 16px;
+    margin: 8px 0;
+
+    .bar-percent {
+      height: 100%;
+      background: #6198ff;
+      margin-right: 8px;
     }
   }
 }
 </style>
 
-<style lang="scss" >
+<style lang="scss">
 .table_all {
+  height: calc(100% - 74px - 30px);
+  padding: 10px;
+  margin-top: 10px;
+  background: #fff;
   .el-table {
     .el-table__row {
       td {
@@ -307,4 +444,4 @@ export default {
     }
   }
 }
-</style>
+</style>

src/pages/baseData/dictionary.vue

@@ -20,7 +20,12 @@
         <el-button type="primary" @click="search">查询</el-button>
       </el-space>
     </div>
-    <el-table :data="state.TableData" stripe style="width: 100%" height="65vh">
+    <el-table
+      :data="state.TableData"
+      stripe
+      style="width: 100%"
+      height="calc(100% - 42px)"
+    >
       <!-- <el-table-column type="index" width="50" /> -->
       <el-table-column
         prop="name"
@@ -186,4 +191,10 @@ const handlePageChange = (val) => {
 .devicemenu {
   margin-bottom: 10px;
 }
+.el-card :deep {
+  height: 100%;
+  .el-card__body {
+    height: calc(100% - 40px);
+  }
+}
 </style>

src/pages/baseData/fan_components/custom_components.vue

@@ -151,9 +151,9 @@
 import { ref, onMounted, reactive, computed, watch, nextTick } from "vue";
 import { ElMessageBox, ElMessage } from "element-plus";
 import {
-  fetchAIPointList,
-  fetchDIPointList,
-  fetchRelatePart,
+//   fetchAIPointList,
+//   fetchDIPointList,
+//   fetchRelatePart,
   custombj_postSave,
   fetch_electrical_point_ai,
   fetch_electrical_point_di,
@@ -508,10 +508,10 @@ const getfetchRelatePart = async () => {
 };
 // 查询风场AI、DI测点
 const getfetchAIPointList = async () => {
-  const res = await fetchAIPointList(form.value.station, form.value.modelId);
-  state.AIPointList = res.sort(function (a, b) {
-    return a.uniformCode - b.uniformCode;
-  });
+//   const res = await fetchAIPointList(form.value.station, form.value.modelId);
+//   state.AIPointList = res.sort(function (a, b) {
+//     return a.uniformCode - b.uniformCode;
+//   });
 };
 const filterAIList = computed(() =>
   state.AIPointList?.filter(

src/pages/baseData/fan_components/windturbine_components.vue

@@ -120,9 +120,9 @@
 import { ref, onMounted, reactive, computed, watch, nextTick } from "vue";
 import { ElMessageBox, ElMessage } from "element-plus";
 import {
-  fetchRelatePart,
+//   fetchRelatePart,
   windturbinebj_postSave,
-  getDIPointList,
+//   getDIPointList,
   getStationinfo,
   fetchWarningClassify,
 } from "/@/api/api.js";

src/pages/faultDiagnosis/warning.vue

@@ -160,11 +160,7 @@ import Table3 from "/@/components/warningCom/table3.vue";
 import MultipleYLineChartNormal from "/@/components/warningCom/multiple-y-line-chart-normal.vue";
 import { ElMessage } from "element-plus";
 import dayjs from "dayjs";
-import {
-  getStationinfoAll,
-  warning_query_new,
-  warning_detail,
-} from "/@/api/api.js";
+import { warning_query_new, warning_detail } from "/@/api/api.js";
 import { outExportExcel } from "/@/utils/exportExcel"; //引入文件
 export default {
   components: { Panel3, Table3, MultipleYLineChartNormal },
@@ -222,9 +218,9 @@ export default {
       cascaderProps: { multiple: true },
       column: [],
       columnObj: [],
-      startdate: dayjs(
-        new Date(new Date() - 1 * 24 * 60 * 60 * 1000)
-      ).format("YYYY-MM-DD"),
+      startdate: dayjs(new Date(new Date() - 1 * 24 * 60 * 60 * 1000)).format(
+        "YYYY-MM-DD"
+      ),
       enddate: dayjs(new Date()).format("YYYY-MM-DD"),
       tableData: {
         column: [
@@ -353,9 +349,9 @@ export default {
     },
     //获取场站
     async search() {
-      const { data } = await getStationinfoAll();
-      this.wpoptions = data;
-      this.wpvalue = data[0].id;
+    //   const { data } = await getStationinfoAll();
+    //   this.wpoptions = data;
+    //   this.wpvalue = data[0].id;
       this.searchData();
     },
 

src/pages/safe/datasearch.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="datasearch">
-    <el-card class="box-card cardleft" style="margin-right: 10px">
+    <el-card class="box-card cardleft">
       <div class="cardleft_top">
         <el-select
           v-if="!isStation"
@@ -41,19 +41,21 @@
         placeholder="检索"
         clearable
       />
-      <el-scrollbar height="78vh">
-        <div
-          v-for="item in filterWTList"
-          :key="item"
-          :class="[
-            'scrollbar-demo-item',
-            item.id == state.activeWT ? 'active' : '',
-          ]"
-          @click="clickWT(item)"
-        >
-          {{ item.aname }}
-        </div>
-      </el-scrollbar>
+      <div style="height: calc(100% - 54px)">
+        <el-scrollbar height="100%">
+          <div
+            v-for="item in filterWTList"
+            :key="item"
+            :class="[
+              'scrollbar-demo-item',
+              item.id == state.activeWT ? 'active' : '',
+            ]"
+            @click="clickWT(item)"
+          >
+            {{ item.aname }}
+          </div>
+        </el-scrollbar>
+      </div>
     </el-card>
     <!-- <el-card class="box-card cardmid">
       <el-input
@@ -126,9 +128,7 @@
         state.activeAI +
         '_' +
         state.handleSearch?.name +
-        '_' +
-        state.handleSearch?.id +
-        '历史数据'
+        +'历史数据'
       "
     >
       <div class="pickerFifter">
@@ -308,7 +308,7 @@ const getWindturbineList = async () => {
   state.activeWT = state.windturbineList[0]?.id;
   state.modeId = "";
   //   await getequipmentmodel_list();
-    await getFetchAIPointListt();
+  await getFetchAIPointListt();
 };
 // 风机搜索
 const filterWTList = computed(() =>
@@ -345,7 +345,19 @@ const getLatest = async (stationId, AIlist) => {
 const getHistory = async (stationId, AIpoint) => {
   let startTs = dayjs(state.pickerVal[0]).valueOf();
   let endTs = dayjs(state.pickerVal[1]).valueOf();
-  const data = await getAdapterHistory(stationId, AIpoint, startTs, endTs);
+  let baseUrl = "";
+  if (stationId.includes("G_IN")) {
+    baseUrl = "http://10.81.3.152:8099/";
+  } else {
+    baseUrl = "http://10.81.3.152:8098/";
+  }
+  const data = await getAdapterHistory(
+    stationId,
+    AIpoint,
+    startTs,
+    endTs,
+    baseUrl
+  );
   state.downData = data;
   option.xAxis.data = [];
   option.series[0].data = [];
@@ -361,25 +373,32 @@ const getHistory = async (stationId, AIpoint) => {
 
 // get 数据快照
 const getHistorysnap = async (stationId, AIpoint, interval) => {
-  //   let startTs = dayjs(state.pickerVal[0]).valueOf();
-  //   let endTs = dayjs(state.pickerVal[1]).valueOf();
-  //   const data = await getAdapterHistorysnap(
-  //     stationId,
-  //     AIpoint,
-  //     startTs,
-  //     endTs,
-  //     interval
-  //   );
-  //   state.downData = data;
-  //   option.xAxis.data = [];
-  //   option.series[0].data = [];
-  //   let timeArr = [];
-  //   data.forEach((e) => {
-  //     option.series[0].data.push(e.doubleValue.toFixed(2));
-  //     option.xAxis.data.push(dayjs(e.ts).format("YYYY-MM-DD HH:mm:ss"));
-  //   });
-  //   let chat = echarts.init(document.getElementById(eChart.value));
-  //   state.echarts = await chat.setOption(option);
+  let startTs = dayjs(state.pickerVal[0]).valueOf();
+  let endTs = dayjs(state.pickerVal[1]).valueOf();
+  let baseUrl = "";
+  if (stationId.includes("G_IN")) {
+    baseUrl = "http://10.81.3.152:8099/";
+  } else {
+    baseUrl = "http://10.81.3.152:8098/";
+  }
+  const data = await getAdapterHistorysnap(
+    stationId,
+    AIpoint,
+    startTs,
+    endTs,
+    interval,
+    baseUrl
+  );
+  state.downData = data;
+  option.xAxis.data = [];
+  option.series[0].data = [];
+  let timeArr = [];
+  data.forEach((e) => {
+    option.series[0].data.push(e.doubleValue.toFixed(2));
+    option.xAxis.data.push(dayjs(e.ts).format("YYYY-MM-DD HH:mm:ss"));
+  });
+  let chat = echarts.init(document.getElementById(eChart.value));
+  state.echarts = await chat.setOption(option);
 };
 const option = {
   tooltip: {
@@ -509,10 +528,12 @@ const export2Excel = async () => {
 <style lang="scss" scoped>
 .datasearch {
   width: 100%;
-  height: 86vh;
+  height: 100%;
   display: flex;
   justify-content: space-between;
-
+  .el-card__body {
+    height: calc(100% - 40px);
+  }
   .cardleft {
     width: 18vw;
 
@@ -537,7 +558,7 @@ const export2Excel = async () => {
 
   .cardright {
     flex: 1;
-    margin: 0 10px;
+    margin-left: 10px;
   }
 }
 

src/pages/safe/historywaring.vue

@@ -1,6 +1,6 @@
 <template>
   <el-card>
-    <el-space wrap :size="30">
+    <el-space wrap>
       <div class="search-input">
         <span class="lable">类型：</span>
         <el-select
@@ -22,15 +22,16 @@
         </el-select>
       </div>
       <div class="search-input" v-if="!isStation">
-        <span class="lable">场站：</span>
+        <span class="lable">{{
+          state.isshowwindturbineName ? "场站：" : "升压站："
+        }}</span>
         <el-select
           v-model="state.stationId"
           clearable
-          style="width: 150px"
           size="mini"
           placeholder="全部"
           popper-class="select"
-          @change="getWindturbineList()"
+          @change="getWindturbineList"
         >
           <el-option
             v-for="item in stationList"
@@ -40,12 +41,11 @@
           ></el-option>
         </el-select>
       </div>
-      <div class="search-input" v-show="state.isshowwindturbineName">
+      <div class="search-input" v-if="state.isshowwindturbineName">
         <span class="lable">机组：</span>
         <el-select
           v-model="state.windturbineId"
           clearable
-          style="width: 150px"
           size="mini"
           placeholder="全部"
           popper-class="select"
@@ -54,15 +54,51 @@
             v-for="item in state.windturbineList"
             :key="item.id"
             :value="item.id"
-            :label="item.windturbineCode"
+            :label="item.name"
+          >
+          </el-option>
+        </el-select>
+      </div>
+      <div class="search-input" v-if="state.isshowwindturbineName">
+        <span class="lable">型号：</span>
+        <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 class="search-input" v-if="state.isshowwindturbineName">
+        <span class="lable">部件：</span>
+        <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.id"
+            :label="item.name"
           >
           </el-option>
         </el-select>
       </div>
       <div class="search-input">
-        <span class="lable">关键字：</span>
+        <span class="lable">描述：</span>
         <el-input
-          v-model="state.keywords"
+          v-model="state.description"
           style="width: 100px"
           size="mini"
         ></el-input>
@@ -85,187 +121,282 @@
       <el-button type="primary" size="mini" @click="getAlarmHistoryt"
         >查询</el-button
       >
-      <el-button size="mini" type="primary" @click="export2Excel"
-        :disabled="state.tableData?.length == 0 ? true : false">
+      <el-button
+        size="mini"
+        type="primary"
+        @click="export2Excel"
+        :disabled="state.tableData?.length == 0 ? true : false"
+      >
         导出</el-button
       >
     </el-space>
   </el-card>
-  <el-table
-    :data="state.tableData"
-    height="70vh"
-    style="width: 100%; margin-top: 10px"
-  >
-    <el-table-column prop="alertTime" label="时间" width="180px">
-      <template #default="scope">
-        {{ formatTime(scope.row.alertTime) }}
-      </template>
-    </el-table-column>
-
-    <el-table-column prop="stationName" label="场站" width="180px" />
-    <el-table-column
-      label="机组"
-      prop="windturbineName"
-      v-if="state.isshowwindturbineName"
-      width="180px"
-    />
-    <el-table-column prop="alertText" label="报警信息" />
-    <el-table-column prop="rank" label="级别" width="80px">
-      <template #default="scope">
-        {{ tableFilter(scope.row.rank) }}
-      </template>
-    </el-table-column>
-    <el-table-column prop="messageType" label="类型" width="80px">
-      <template #default="scope">
-        {{ messageTypeFilter(scope.row.messageType) }}
-      </template>
-    </el-table-column>
-  </el-table>
-  <div class="pagination">
-    <el-pagination
-      background
-      layout="total, prev, pager, next"
-      hide-on-single-page
-      :current-page="query.page"
-      :page-size="query.limit"
-      :total="query.pageTotal"
-      @current-change="handlePageChange"
-    ></el-pagination>
+  <div class="table-wrapper">
+    <el-table
+      :data="state.tableData"
+      height="calc(100% - 35px - 10px)"
+      style="width: 100%"
+      border
+      stripe
+    >
+      <el-table-column
+        v-for="item in state.isshowwindturbineName
+          ? state.tableHeader
+          : state.tableHeader1"
+        :label="item.title"
+        :prop="item.code"
+        :key="item.code"
+        :width="item.width ? item.width : 0"
+        show-overflow-tooltip
+        header-align="center"
+      >
+        <template #default="scope">
+          <span v-if="item.code == 'rank'">
+            {{ tableFilter(scope.row.rank) }}
+          </span>
+          <span v-else-if="item.code == 'alarmtype'">
+            {{ tableFilter(scope.row.alarmtype) }}
+          </span>
+          <span v-else-if="item.code == 'ts'">
+            {{ formatTime(scope.row.ts) }}
+          </span>
+          <span v-else>
+            {{ scope.row[item.code] }}
+          </span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div class="pagination-wrapper">
+      <el-pagination
+        background
+        layout="total, prev, pager, next"
+        hide-on-single-page
+        :current-page="query.page"
+        :page-size="query.limit"
+        :total="query.pageTotal"
+        @current-change="handlePageChange"
+      ></el-pagination>
+    </div>
   </div>
 </template>
 
 <script setup>
 import { watch, reactive, nextTick, computed, onMounted } from "vue";
 import dayjs from "dayjs";
-import { alarm_history,new_alarm_history, fetchWindturbineList } from "/@/api/api.js";
+import {
+  alarm_history,
+  new_alarm_history,
+  fetchWindturbineList,
+  fetchModel,
+  fetchRelatePartAndAlarmType,
+} from "/@/api/api.js";
 import { ElMessage } from "element-plus";
 import { initWebSocket } from "/@/websocket/indextest";
 import { outExportExcel } from "/@/utils/exportExcel"; //引入文件
 import { useStore } from "vuex";
 
 const store = useStore();
-const endtime = new Date();
-const starttime = new Date(endtime - 1 * 24 * 60 * 60 * 1000);
-const stationList = computed(() => store.state.stationList);
 const isStation = computed(() => store.getters.isStation);
 
-onMounted(() => {});
-
-watch(
-  () => stationList,
-  (val, old) => {
-    val.value[0] &&
-      nextTick(async () => {
-        state.stationId = val.value[0]?.id;
-        state.dateTime[0] = formatTime(starttime);
-        state.dateTime[1] = formatTime(endtime);
-        await getWindturbineList();
-        await getAlarmHistoryt();
-      });
-  },
-  {
-    deep: true,
-    immediate: true,
-  }
-);
+onMounted(() => {
+  getequipmentmodel_list();
+  getfetchRelatePart();
+  state.dateTime = [
+    dayjs().startOf("day").format("YYYY-MM-DD HH:mm:ss"),
+    dayjs().format("YYYY-MM-DD HH:mm:ss"),
+  ];
+});
+// 机型
+const getequipmentmodel_list = async () => {
+  const { data } = await fetchModel();
+  state.modelListAll = data;
+};
+//所属部件
+const getfetchRelatePart = async () => {
+  const { data } = await fetchRelatePartAndAlarmType();
+  state.fetchListAll = data;
+};
 const state = reactive({
   typeList: [
-    // {
-    //   label: "升压站",
-    //   value: "SYZ",
-    // },
     {
-      label: "自定义",
-      value: "custom",
+      label: "升压站",
+      value: "booststation",
     },
+    // {
+    //   label: "自定义",
+    //   value: "custom",
+    // },
     {
       label: "风机",
       value: "windturbine",
     },
   ],
-  typeVal: "",
+  typeVal: "windturbine",
   stationId: "",
   windturbineList: [],
   windturbineId: "",
-  keywords: "",
+  modelListAll: {},
+  fetchListAll: {},
+  modelId: "", //型号
+  components: "", //部件
+  description: "", //描述
   dateTime: [],
   startDate: null,
   endDate: null,
   tableData: [],
   isshowwindturbineName: true,
+  tableHeader: [
+    { title: "时间", code: "ts", width: "180" },
+    { title: "场站", code: "stationname", width: "180" },
+    { title: "机组", code: "devicename", width: "180" },
+    { title: "报警信息", code: "description" },
+    { title: "级别", code: "rank", width: "80" },
+    { title: "类型", code: "alarmtype", width: "80" },
+  ],
+  tableHeader1: [
+    { title: "时间", code: "ts", width: "180" },
+    { title: "升压站", code: "stationname", width: "180" },
+    { title: "报警信息", code: "description" },
+    { title: "级别", code: "rank", width: "80" },
+    { title: "类型", code: "alarmtype", width: "80" },
+  ],
 });
+// 场站列表/升压站列表
+const stationList = computed(() => {
+  if (state.typeVal == "windturbine") {
+    return store.state.stationListAll;
+  } else if (state.typeVal == "booststation") {
+    return store.state.booststationList;
+  }
+});
+watch(
+  () => stationList,
+  (val, old) => {
+    val.value.length &&
+      nextTick(async () => {
+        state.stationId = val.value[0]?.id;
+        await getWindturbineList();
+        await getAlarmHistoryt();
+      });
+  },
+  {
+    deep: true,
+    immediate: true,
+  }
+);
+//型号列表
+const modelList = computed(() => {
+  if (state.typeVal == "windturbine") {
+    if (state.stationId == "") {
+      return [];
+    } else {
+      return state.modelListAll[state.stationId];
+    }
+  } else {
+    return [];
+  }
+});
+//部件列表
+const componentList = computed(() => {
+  if (state.typeVal == "windturbine") {
+    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.windturbineList = [];
+  state.windturbineId = "";
+  const { data } = await fetchWindturbineList(state.stationId);
+  state.windturbineList = data;
+};
 const query = reactive({
   page: 1,
-  limit: 15,
+  limit: 17,
   pageTotal: null,
 });
 
 // 获取历史记录表
 const getAlarmHistoryt = async () => {
   let params = {
-    pagenum: query.page,
-    pagesize: query.limit,
+    pageNum: query.page,
+    pageSize: query.limit,
+    alarmType: state.typeVal,
     stationid: state.stationId,
-    windturbineid: state.typeVal == "SYZ" ? "" : state.windturbineId,
-    category1: state.typeVal,
-    category2: "",
-    rank: null,
-    keyword: state.keywords,
-    starttime: state.dateTime[0],
-    endtime: state.dateTime[1],
+    deviceid: state.typeVal == "booststation" ? "" : state.windturbineId,
+    modelId: state.modelId,
+    components: state.components,
+    description: state.description,
+    begin: state.dateTime[0],
+    end: state.dateTime[1],
   };
   const { data } = await alarm_history(params);
   query.pageTotal = data?.total;
-  state.tableData = data?.records;
+  state.tableData = data?.ls;
 };
+//报警类型变化
 const typechange = () => {
-  state.isshowwindturbineName = state.typeVal == "SYZ" ? false : true;
-};
-//get 风机
-const getWindturbineList = async () => {
-  state.windturbineList = [];
-  state.windturbineId = "";
-  const res = await fetchWindturbineList(state.stationId);
-  state.windturbineList = res;
+  state.isshowwindturbineName = state.typeVal == "booststation" ? false : true;
 };
 
 // 批量导出
 const export2Excel = async () => {
   let params = {
-    pagenum: 1,
-    pagesize: 999999,
+    pageNum: query.page,
+    pageSize: query.pageTotal,
+    alarmType: state.typeVal,
     stationid: state.stationId,
-    windturbineid: state.typeVal == "SYZ" ? "" : state.windturbineId,
-    category1: state.typeVal,
-    category2: "",
-    rank: null,
-    keyword: state.keywords,
-    starttime: state.dateTime[0],
-    endtime: state.dateTime[1],
+    deviceid: state.typeVal == "booststation" ? "" : state.windturbineId,
+    modelId: state.modelId,
+    components: state.components,
+    description: state.description,
+    begin: state.dateTime[0],
+    end: state.dateTime[1],
   };
 
-  if (endtime - starttime > 6 * 24 * 60 * 60 * 1000) {
+  if (state.dateTime[1] - state.dateTime[0] > 6 * 24 * 60 * 60 * 1000) {
     this.$message({
       message: "导出时间范围不能大于7天",
       type: "warning",
     });
   } else {
-    const file = await new_alarm_history(params);
-    let blob = new Blob([file], {
-      type: "application/zip", // 这边的类型需要改
-    });
+    let tableHeader = [];
+    let tableKey = [];
+    const { data } = await alarm_history(params);
+    if (state.isshowwindturbineName) {
+      tableHeader = state.tableHeader.map((item) => item.title);
+      tableKey = state.tableHeader.map((item) => item.code);
+    } else {
+      tableHeader = state.tableHeader1.map((item) => item.title);
+      tableKey = state.tableHeader1.map((item) => item.code);
+    }
     const stationName = stationList.value.find((ele) => {
       return ele.id === state.stationId;
     }).name;
-    const fileName = `${stationName} ${state.dateTime[0].replace(/_/g,':')} ~ ${state.dateTime[1].replace(/_/g,':')} 数据表`;
+    const fileName = `${stationName} ${state.dateTime[0]} ~ ${state.dateTime[1]} 数据表`;
 
-    let url = window.URL.createObjectURL(blob);
-    let link = document.createElement("a");
-    link.style.display = "none";
-    link.download = fileName; 
-    link.href = url;
-    document.body.appendChild(link);
-    link.click();
+    outExportExcel(
+      tableHeader,
+      tableKey,
+      data.ls.map((item) => {
+        return {
+          ...item,
+          ts: formatTime(item.ts),
+          rank: tableFilter(item.rank),
+          alarmtype: tableFilter(item.alarmtype),
+        };
+      }),
+      fileName
+    );
     ElMessage.success(`导出成功!`);
   }
 };
@@ -285,7 +416,7 @@ const obj = {
   3: "中级",
   4: "中高级",
   5: "高级",
-  SYZ: "升压站",
+  booststation: "升压站",
   custom: "自定义",
   windturbine: "风机",
 };
@@ -301,5 +432,18 @@ const messageTypeFilter = (val) => {
 };
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style scoped lang="scss">
+.table-wrapper {
+  height: calc(100% - 70px - 50px);
+  background-color: #fff;
+  margin-top: 10px;
+  padding: 20px;
+  .pagination-wrapper :deep {
+    text-align: right;
+    margin-top: 10px;
+    .el-icon {
+      width: unset;
+    }
+  }
+}
+</style>

src/pages/safe/index.vue

@@ -0,0 +1,134 @@
+<template>
+  <div>
+    <p>
+      <button @click="send('1')">1分钟</button>
+      <button @click="send('2')">10分钟</button>
+      <button @click="send('3')">1小时</button>
+      <button @click="send('4')">24小时</button>
+    </p>
+    <ul>
+      <li v-for="(item, index) in tableData" :key="index">
+        {{ item.name }}:{{ item.value }}
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+import Stomp from "stompjs";
+import SockJS from "sockjs-client";
+
+// const headers = {}
+const headers = {
+  login: "mylogin",
+  passcode: "mypasscode",
+  // additional header
+  "client-id": "my-client-id",
+  Author: "1235465tyrgw32rsgg",
+};
+export default {
+  data() {
+    return {
+      socketUrl: "/websocket/ws", // ws://localhost:8080/websocket/ws
+      tableData: [],
+      reconnecting: false,
+      socket: null,
+      stompClient: null,
+    };
+  },
+  mounted() {
+    this.initWebsocket();
+  },
+  beforeDestroy() {
+    this.closeSocket();
+  },
+  methods: {
+    /* 只需要在连接服务器注册端点endPoint时，写访问服务器的全路径URL：
+      new SockJS('http://127.0.0.1:9091/sbjm-cheng/endpointOyzc');
+      其他监听指定服务器广播的URL不需要写全路径
+      stompClient.subscribe('/topic/getResponse',function(response){})
+    */
+    /* 创建stompClient： (1) 使用原生的websocket (2) 使用定制的websocket(例如sockjs包裹的websocket)
+    ① Stomp.client("ws://localhost:61614/stomp")
+    ② SockJS的url是http、https协议，而不是 ws
+      const socket = new SockJS("http://127.0.0.1:9091/sbjm-cheng/endpointOyzc"); 
+       Stomp.over(socket)
+
+       const ws = new Websocket("ws://localhost:61614/ws")
+       Stomp.over(ws)
+    */
+    initWebsocket() {
+      /* 
+      ① 创建sockJS对象；
+      ② 创建stomp客户端
+      ③ stompClient客户端 连接 stomp服务器
+      */
+      this.socket = new SockJS(this.socketUrl);
+      this.stompClient = Stomp.over(this.socket);
+
+      this.stompClient.connect(
+        headers, // headers头部信息。可添加客户端的认证信息。也可以不添加信息，headers 直接就设置为 {}
+        (frame) => {
+          // 连接成功： 订阅服务器的地址。为了浏览器可以接收到消息，必须先订阅服务器的地址
+          this.connectSucceed();
+        },
+        (err) => {
+          // 连接失败的回调
+          this.reconnect(this.socketUrl, this.connectSucceed);
+        }
+      );
+    },
+    /* 连接成功的回调：订阅服务器的地址。为了浏览器可以接收到消息，必须先订阅服务器的地址 */
+    connectSucceed() {
+      // 设置心跳发送接受频率（ms）默认为10000ms。 heart-beating是利用window.setInterval()去规律地发送heart-beats或者检查服务端的heart-beats。
+      this.stompClient.heartbeat.outgoing = 10000;
+      this.stompClient.heartbeat.incoming = 0;
+
+      this.stompClient.subscribe("/topic/dashboard/data", (res) => {
+        this.tableData = res.body.list;
+      });
+
+      /* 
+    当客户端与服务端连接成功后，可以调用 send()来发送STOMP消息。这个方法必须有一个参数，用来描述对应的STOMP的目的地。
+    另外可以有两个可选的参数：headers，object类型包含额外的信息头部；body，一个String类型的参数。
+
+    client.send("/queue/test", {priority: 9}, "Hello, STOMP");
+    // client会发送一个STOMP发送帧给/queue/test，这个帧包含一个设置了priority为9的header和内容为“Hello, STOMP”的body。
+    */
+      this.stompClient.send("/topic/dashboard/send", {}, "1");
+    },
+    reconnect(socketUrl, callback) {
+      this.reconnecting = true;
+      let connected = false;
+      const timer = setInterval(() => {
+        this.socket = new SockJS(socketUrl);
+        this.stompClient = Stomp.over(this.socket);
+        this.stompClient.connect(
+          headers,
+          (frame) => {
+            this.reconnectting = false;
+            connected = true;
+            clearInterval(timer);
+            callback();
+          },
+          (err) => {
+            console.log("Reconnect failed！");
+            if (!connected) console.log(err);
+          }
+        );
+      }, 1000);
+    },
+    closeSocket() {
+      if (this.stompClient != null) {
+        this.stompClient.disconnect();
+        // this.stompClient.disconnect(()=>{
+        //   console.log('连接关闭')
+        // });
+      }
+    },
+    send(flag) {
+      this.stompCLient.send("/topic/dashboard/send", {}, flag);
+    },
+  },
+};
+</script>

src/pages/safe/realwaring.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="safe">
-    <div class="topCard card">
+    <!-- <div class="topCard card">
       <el-scrollbar
         style="width: 100%"
         wrap-style="width:100%"
@@ -32,19 +32,19 @@
           </div>
         </div>
       </el-scrollbar>
-    </div>
+    </div> -->
     <div class="bottomCard">
       <div class="bott_left safe_bott card">
         <Safecom title="风机原始报警" category1="windturbine" />
       </div>
       <div class="bott_mid safe_bott card" v-if="!isStation">
-        <Safecom title="升压站" category1="SYZ" />
+        <Safecom title="升压站" category1="booststation" />
       </div>
       <div class="bott_right safe_bott card">
         <Safecom title="风机预警" category1="custom" />
       </div>
     </div>
-    <div v-dialogdrag>
+    <!-- <div v-dialogdrag>
       <el-dialog
         v-model="centerDialogVisible"
         :title="doubleClickVal?.windturbineName || doubleClickVal?.stationName"
@@ -82,7 +82,7 @@
           ></el-pagination>
         </div>
       </el-dialog>
-    </div>
+    </div> -->
   </div>
 </template>
 <script setup>
@@ -107,6 +107,7 @@ import Safecom from "./safecomponent.vue";
 import { ElNotification, ElButton } from "element-plus";
 import { common } from "/@/composables/common";
 import { useStore } from "vuex";
+import { dataAdapterInit } from "@/websocket/index.js";
 const store = useStore();
 
 let Notifica = null;
@@ -118,6 +119,7 @@ const synth = window.speechSynthesis;
 const msg = new SpeechSynthesisUtterance();
 const { username, system, getenableWarn } = common();
 onMounted(async () => {
+//   dataAdapterInit();
   await getenableWarn();
   if (!windowSetInterval.value) {
     await init();
@@ -145,24 +147,24 @@ const Notification = (item) => {
   });
 };
 const fearch = async (dateTime) => {
-  const data = await alarm_fault_recent({ faulttime: dateTime });
-  const warnListKeyArr = [];
-  for (const k of warnList.value) {
-    warnListKeyArr.push(k.id);
-  }
-  const { enableWarn, enableSpeak } = system.value;
-  for (const e of data) {
-    if (!warnListKeyArr.includes(e.id)) {
-      enableWarn && (await Notification(e));
-      enableSpeak &&
-        (await handleSpeak(
-          `${e.windturbineName || e.stationName}${e.alertText}`
-        ));
-      setTimeout(() => {
-        store.dispatch("actionsWarning", e);
-      }, 0);
-    }
-  }
+  //   const data = await alarm_fault_recent({ faulttime: dateTime });
+  //   const warnListKeyArr = [];
+  //   for (const k of warnList.value) {
+  //     warnListKeyArr.push(k.id);
+  //   }
+  //   const { enableWarn, enableSpeak } = system.value;
+  //   for (const e of data) {
+  //     if (!warnListKeyArr.includes(e.id)) {
+  //       enableWarn && (await Notification(e));
+  //       enableSpeak &&
+  //         (await handleSpeak(
+  //           `${e.windturbineName || e.stationName}${e.alertText}`
+  //         ));
+  //       setTimeout(() => {
+  //         store.dispatch("actionsWarning", e);
+  //       }, 0);
+  //     }
+  //   }
 };
 // 双击弹出风机报警table
 const query = reactive({
@@ -244,31 +246,33 @@ const handlePageChange = (val) => {
 const formatTime = (val) => {
   return dayjs(val).format("YYYY-MM-DD HH:mm:ss");
 };
-// 格式化
-const obj = {
-  0: "解除",
-  1: "触发",
-  2: "低级",
-  3: "中级",
-  4: "中高级",
-  5: "高级",
-};
-const messageTypeObj = {
-  1: "触发",
-  3: "解除",
-};
-const tableFilter = (val) => {
-  return obj[val];
-};
-const messageTypeFilter = (val) => {
-  return messageTypeObj[val];
-};
+// // 格式化
+// const obj = {
+//   1: "低级",
+//   2: "中低级",
+//   3: "中级",
+//   4: "中高级",
+//   5: "高级",
+// };
+// const messageTypeObj = {
+//   true: "触发",
+//   false: "解除",
+// };
+// const rankFilter = (val) => {
+//   return obj[val];
+// };
+// const stateFilter = (val) => {
+//   return messageTypeObj[val];
+// };
+// const messageTypeFilter = (val) => {
+//   return messageTypeObj[val];
+// };
 </script>
 
 <style lang="scss" scoped>
 .safe {
   width: 100%;
-
+  height: 100%;
   .topCard {
     height: 24vh;
     overflow-y: auto;
@@ -325,10 +329,14 @@ const messageTypeFilter = (val) => {
   .bottomCard {
     display: flex;
     justify-content: space-between;
-    margin-top: 6px;
-
+    // margin-top: 6px;
+    height: 100%;
+    .bott_left,
+    .bott_mid {
+      margin-right: 10px;
+    }
     .safe_bott {
-      height: 62vh;
+      height: calc(100% - 20px);
       // width: 32%;
       width: 50%;
     }

src/pages/safe/safecomponent.vue

@@ -1,11 +1,17 @@
 <template>
   <div class="safeCom">
     <div class="safeCom_head">
-      
-      <i :class="['iconfont',iconfonts()]" style="font-size: 24px;margin-right:10px"></i>
-      <div style="display:flex;justify-content: space-between;width:100%">
+      <i
+        :class="['iconfont', iconfonts()]"
+        style="font-size: 24px; margin-right: 10px"
+      ></i>
+      <div style="display: flex; justify-content: space-between; width: 100%">
         <div class="safeCom_title">{{ props.title }}</div>
-        <div style="font-size: 14px;position: relative;right: 35px;top: 15px;">共{{tableData.length}}条</div>
+        <div
+          style="font-size: 14px; position: relative; right: 35px; top: 15px"
+        >
+          共{{ tableData.length }}条
+        </div>
       </div>
       <div class="safeCom_fifter">
         <!-- <el-select
@@ -40,27 +46,34 @@
         </el-select> -->
       </div>
     </div>
-    <el-table :data="tableData" style="width: 100%" height="55vh">
+    <el-table :data="tableData" style="width: 100%" height="calc(100% - 51px)">
       <el-table-column prop="lastUpdateTime" label="报警时间">
-       <template #default="scope">
-          {{ dayjs(scope.row.lastUpdateTime).format("MM-DD HH:mm:ss") }}
+        <template #default="scope">
+          {{ dayjs(scope.row.ts).format("MM-DD HH:mm:ss") }}
         </template>
       </el-table-column>
+      <el-table-column prop="stationname" label="场站" align="center" />
       <el-table-column
-        prop="shortStationName"
-        label="场站"
-        align="center"
+        prop="devicename"
+        v-if="props.category1 !== 'booststation'"
+        label="风机"
       />
-      <el-table-column prop="windturbineCode" v-if="props.category1 !== 'SYZ'" label="风机" />
-      <el-table-column prop="alertText" label="报警信息" />
+      <el-table-column prop="description" label="报警信息" />
       <el-table-column prop="rank" label="级别" width="80px">
         <template #default="scope">
-         <el-tag :type="tagType(scope.row.rank)"  size="small">{{ tableFilter(scope.row.rank) }}</el-tag> 
+          <el-tag :type="tagType(scope.row.rank)" size="small">{{
+            rankFilter(scope.row.rank)
+          }}</el-tag>
         </template>
       </el-table-column>
       <el-table-column prop="isOpened" label="状态" width="80px">
         <template #default="scope">
-         <span :style="{color:scope.row.isOpened == 1?'#F56C6C':'#909399'}">{{ tableFilter(scope.row.isOpened) }}</span>
+          <span
+            :style="{
+              color: scope.row.confirmed == true ? '#F56C6C' : '#909399',
+            }"
+            >{{ stateFilter(scope.row.confirmed) }}</span
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -68,12 +81,10 @@
 </template>
 
 <script setup>
-import { ref, onMounted,onUnmounted, reactive, computed } from "vue";
-import {
-  
-} from "element-plus";
+import { ref, onMounted, onUnmounted, reactive, computed } from "vue";
+import {} from "element-plus";
 import dayjs from "dayjs";
-import { alarm_snap ,alarm_snap_top} from "/@/api/api.js";
+import { alarm_snap, alarm_snap_top } from "/@/api/api.js";
 import { useStore } from "vuex";
 const store = useStore();
 const props = defineProps({
@@ -83,15 +94,14 @@ const props = defineProps({
   },
   category1: {
     type: String,
-    defaule: "SYZ",
+    defaule: "booststation",
   },
 });
 const stationList = computed(() => store.state.stationList);
 const state = reactive({
-  
   dateVal: 1,
   //场站
-  stationId: '',
+  stationId: "",
   // stationId: computed(() => stationList.value[0]?.id),
   //级别
   rankList: [
@@ -116,19 +126,19 @@ const state = reactive({
 });
 const tableData = ref([]);
 const timer = ref([]);
-onMounted(async() => {
-  getAlarm_snap_top()
+onMounted(async () => {
+  getAlarm_snap_top();
   fearch();
 });
-onUnmounted(()=>{
-  console.warn('onUnmounted,页面销毁定时任务');
-  window.clearInterval(timer.value)
-})
+onUnmounted(() => {
+  console.warn("onUnmounted,页面销毁定时任务");
+  window.clearInterval(timer.value);
+});
 const fearch = () => {
   timer.value = window.setInterval(() => {
     setTimeout(() => {
       // getAlarm_snap();
-      getAlarm_snap_top()
+      getAlarm_snap_top();
     }, 0);
   }, 5000);
 };
@@ -149,57 +159,63 @@ const getAlarm_snap = async () => {
   const res = await alarm_snap(params);
   tableData.value = res;
 };
-const getAlarm_snap_top= async () => {
-  const res = await alarm_snap_top({
-    category1:props.category1,
-    topnum:100
-  });
-  tableData.value = res;
-  };
+const getAlarm_snap_top = async () => {
+  if (props.category1 != "custom") {
+    const res = await alarm_snap_top({
+      type: props.category1,
+      // topnum:100
+    });
+    tableData.value = res.data;
+  }
+};
 // 时间格式化
 const formatTime = (val) => {
   return dayjs(val).format("YYYY-MM-DD HH:mm:ss");
 };
 // 格式化
 const obj = {
-  0: "解除",
-  1: "触发",
-  2: "低级",
+  1: "低级",
+  2: "中低级",
   3: "中级",
   4: "中高级",
   5: "高级",
 };
-
-const tableFilter = (val) => {
+const messageTypeObj = {
+  true: "触发",
+  false: "解除",
+};
+const rankFilter = (val) => {
   return obj[val];
 };
+const stateFilter = (val) => {
+  return messageTypeObj[val];
+};
 // 格式化
 const tagTypeObj = {
-  0: "success",
-  1: "danger",
-  2:'info',
-  3:'info',
+  1: "default",
+  2: "info",
+  3: "warning",
   4: "warning",
   5: "danger",
 };
 
- const tagType= (val) => {
+const tagType = (val) => {
   return tagTypeObj[val];
 };
-const iconfontsObj ={
-  'SYZ':'iconIOTtubiao_huabanfuben',
-  'windturbine':'iconfengji',
-  'custom':'iconzidingyi',
-}
-const iconfonts =()=>{
-  return iconfontsObj[props.category1]
-}
+const iconfontsObj = {
+  booststation: "iconIOTtubiao_huabanfuben",
+  windturbine: "iconfengji",
+  custom: "iconzidingyi",
+};
+const iconfonts = () => {
+  return iconfontsObj[props.category1];
+};
 </script>
 
 <style lang="scss" scoped>
 .safeCom {
   width: 100%;
-  height: 100%;
+  height: calc(100% - 20px);
   .safeCom_head {
     height: 50px;
     display: flex;
@@ -214,4 +230,4 @@ const iconfonts =()=>{
     }
   }
 }
-</style>
+</style>

src/permission.js

@@ -0,0 +1,61 @@
+import router from "./router";
+import { getCookie } from "@/utils/auth"; // getToken from cookie
+const whiteList = ["/login", "/logout"]; // 不重定向白名单
+import store from "@/store";
+// router.beforeEach((to, from, next) => {
+//   if (getCookie("authToken")) {
+//     if (to.path == "/login") {
+//       next({ path: "/" });
+//     } else {
+//       if (store.getters.roles.length === 0) {
+//         // 判断当前用户是否已拉取完user_info信息
+//         store
+//           .dispatch("user/GetInfo")
+//           .then(async () => {
+//             let permissions = store.getters.permissions;
+//             let accessRoutes = [];
+//             accessRoutes = await store.dispatch(
+//               "routes/setRoutes",
+//               permissions
+//             );
+//             accessRoutes?.forEach((item) => {
+//               router.addRoute(item);
+//             });
+//             next({ ...to, replace: true });
+//           })
+//           .catch((err) => {});
+//       } else {
+//         next();
+//       }
+//     }
+//   } else if (whiteList.indexOf(to.path) !== -1) {
+//     next();
+//   } else {
+//     next(`/login?redirect=${to.fullPath}`);
+//   }
+
+// });
+router.beforeEach((to, from, next) => {
+  document.title = `${to.meta.title} | 设备隐患感知系统`;
+  const token = getCookie("accessToken");
+  //   const role = sessionStorage.getItem("ms_chinesename");
+  if (token) {
+    if (to.path == "/login") {
+      next("/");
+    } else {
+      if (store.getters.roles.length == 0) {
+        store.dispatch("user/GetInfo").then(async () => {
+          next();
+        });
+      } else {
+        next();
+      }
+    }
+  } else if (whiteList.indexOf(to.path) !== -1) {
+    next();
+  } else {
+    next(`/login?redirect=${to.fullPath}`);
+  }
+});
+
+router.afterEach((to, from, next) => {});

src/router/index.js

@@ -4,12 +4,10 @@ import {
   createWebHashHistory,
 } from "vue-router";
 import Home from "../pages/Home.vue";
+import store from "@/store";
+import { getCookie } from "@/utils/auth"; // getToken from cookie
 const routes = [
-  {
-    path: "/",
-    redirect: "/safe/realwaring",
-    // redirect: '/firstPage',
-  },
+  { path: "/", redirect: "/safe/realwaring" },
   {
     path: "/",
     name: "Home",
@@ -119,38 +117,38 @@ const routes = [
           //             '../pages/faultDiagnosis/record.vue'
           //         ),
           // },
-          {
-            icon: "el-icon-s-home",
-            path: "/faultDiagnosis/warning",
-            name: "faultDiagnosiswarning",
-            meta: {
-              title: "预警分析",
-            },
-            component: () =>
-              import(
-                /* webpackChunkName: "form" */
-                "../pages/faultDiagnosis/warning.vue"
-              ),
-          },
-          {
-            icon: "el-icon-s-home",
-            path: "/faultDiagnosis/statistics",
-            name: "faultDiagnosisstatistics",
-            meta: {
-              title: "预警统计",
-            },
-            component: () =>
-              import(
-                /* webpackChunkName: "form" */
-                "../pages/faultDiagnosis/statistics.vue"
-              ),
-          },
+          //   {
+          //     icon: "el-icon-s-home",
+          //     path: "/faultDiagnosis/warning",
+          //     name: "faultDiagnosiswarning",
+          //     meta: {
+          //       title: "预警分析",
+          //     },
+          //     component: () =>
+          //       import(
+          //         /* webpackChunkName: "form" */
+          //         "../pages/faultDiagnosis/warning.vue"
+          //       ),
+          //   },
+          //   {
+          //     icon: "el-icon-s-home",
+          //     path: "/faultDiagnosis/statistics",
+          //     name: "faultDiagnosisstatistics",
+          //     meta: {
+          //       title: "预警统计",
+          //     },
+          //     component: () =>
+          //       import(
+          //         /* webpackChunkName: "form" */
+          //         "../pages/faultDiagnosis/statistics.vue"
+          //       ),
+          //   },
           {
             icon: "el-icon-s-home",
             path: "/basedata/FanDataStatisticTable",
             name: "FanDataStatisticTable",
             meta: {
-              title: "原始报警统计",
+              title: "原始报警分析",
               keepAlive: true,
             },
             component: () =>
@@ -158,6 +156,17 @@ const routes = [
           },
           //   {
           //     icon: "el-icon-s-home",
+          //     path: "/basedata/FanDataStatisticTable",
+          //     name: "FanDataStatisticTable",
+          //     meta: {
+          //       title: "原始报警统计",
+          //       keepAlive: true,
+          //     },
+          //     component: () =>
+          //       import("../pages/baseData/FanDataStatisticTable.vue"),
+          //   },
+          //   {
+          //     icon: "el-icon-s-home",
           //     path: "/faultDiagnosis/report",
           //     name: "faultDiagnosisreport",
           //     meta: {
@@ -233,7 +242,7 @@ const routes = [
         icon: "iconfont iconbaojingpeizhi",
         path: "/alarmconfig",
         name: "alarmconfig",
-        isshow: ["admin", "superuser"],
+        // isshow: ["admin", "superuser"],
         redirect: "/alarmconfig/station",
         meta: {
           title: "预警配置",
@@ -271,20 +280,6 @@ const routes = [
               ),
           },
 
-          // {
-          //     icon: 'el-icon-s-home',
-          //     path: '/alarmConfig/boostleg',
-          //     name: 'alarmConfigboostleg',
-          //     meta: {
-          //         title: '升压站报警',
-          //     },
-          //     component: () =>
-          //         import(
-          //             /* webpackChunkName: "form" */
-          //             '../pages/alarmConfig/bj_scada/scada.vue'
-          //         ),
-          // },
-
           {
             icon: "el-icon-s-home",
             path: "/alarmConfig/Logs",
@@ -305,8 +300,7 @@ const routes = [
         icon: "iconfont iconjichushuju",
         path: "/basedata",
         name: "basedata",
-        isshow: "admin",
-
+        // isshow: "admin",
         redirect: "/basedata/station",
         meta: {
           title: "基础数据",
@@ -317,20 +311,20 @@ const routes = [
             "../pages/routerView.vue"
           ),
         children: [
-          {
-            icon: "el-icon-s-home",
-            path: "/basedata/device",
-            name: "basedatadevice",
-            meta: {
-              title: "设备模型",
-              keepAlive: true,
-            },
-            component: () =>
-              import(
-                /* webpackChunkName: "form" */
-                "../pages/baseData/device.vue"
-              ),
-          },
+          //   {
+          //     icon: "el-icon-s-home",
+          //     path: "/basedata/device",
+          //     name: "basedatadevice",
+          //     meta: {
+          //       title: "设备模型",
+          //       keepAlive: true,
+          //     },
+          //     component: () =>
+          //       import(
+          //         /* webpackChunkName: "form" */
+          //         "../pages/baseData/device.vue"
+          //       ),
+          //   },
           {
             icon: "el-icon-s-home",
             path: "/basedata/dictionary",
@@ -370,16 +364,6 @@ const routes = [
     ],
   },
   {
-    icon: "iconfont iconxitongcaidan",
-    path: "/check",
-    isshow: "admin",
-    name: "check",
-    meta: {
-      title: "单点登录",
-    },
-    component: () => import("../pages/check/check.vue"),
-  },
-  {
     path: "/login",
     name: "Login",
     meta: {
@@ -391,23 +375,21 @@ const routes = [
         "../pages/Login.vue"
       ),
   },
+  {
+    icon: "iconfont iconxitongcaidan",
+    path: "/check",
+    isshow: "admin",
+    name: "check",
+    meta: {
+      title: "单点登录",
+    },
+    component: () => import("../pages/check/check.vue"),
+  },
 ];
-
+const constantRoutes = [];
 const router = createRouter({
   history: createWebHashHistory(""),
   routes,
 });
 
-router.beforeEach((to, from, next) => {
-  document.title = `${to.meta.title} | 设备隐患感知系统`;
-  const role = sessionStorage.getItem("ms_chinesename");
-  if (to.path === "/check") {
-    next();
-  } else if (!role && to.path !== "/login") {
-    next("/login");
-  } else {
-  }
-  next();
-});
-
 export default router;

src/store/getters.js

@@ -0,0 +1,11 @@
+const getters = {
+  roles: (state) => state.user.roles,
+  permissions: (state) => state.user.permissions,
+  authToken: (state) => state.user.authToken, //建立token的快捷访问   user 是因为index.js中导入的时候名称定义为user
+  username: (state) => state.user.username,
+//   routes: (state) => state.routes.routes,
+  isStation(state) {
+    return state.stationList.length == 1;
+  },
+};
+export default getters;

src/store/index.js

@@ -1,5 +1,7 @@
-import { createStore } from 'vuex'
-
+import { createStore } from "vuex";
+import user from "@/store/modules/user";
+// import routes from "@/store/modules/routes";
+import getter from "./getters";
 export default createStore({
   state: {
     tagsList: [],
@@ -96,10 +98,6 @@ export default createStore({
       context.commit("setWarnInterval", newData);
     },
   },
-  modules: {},
-  getters: {
-    isStation(state) {
-      return state.stationList.length == 1;
-    },
-  },
-});
+  modules: { user, },
+  getters: getter,
+});

src/store/modules/router.js

@@ -0,0 +1,23 @@
+import { filterAsyncRoutes, } from "@/utills/handleRoutes";
+import { asyncRoutes, constantRoutes } from "@/router";
+const state = () => ({
+  routes: [],
+});
+
+const mutations = {
+  setRoutes(state, routes) {
+    state.routes = constantRoutes.concat(routes);
+  },
+
+};
+const actions = {
+  async setRoutes({ commit }, permissions) {
+    const finallyAsyncRoutes = await filterAsyncRoutes(
+      [...asyncRoutes],
+      permissions
+    );
+    commit("setRoutes", finallyAsyncRoutes);
+    return finallyAsyncRoutes;
+  },
+};
+export default { namespaced: true, state, mutations, actions };

src/store/modules/user.js

@@ -0,0 +1,94 @@
+import {
+  getCookie,
+  setToken,
+  setUserId,
+  removeToken,
+  removeUserId,
+  setName,
+  removeName,
+} from "@/utils/auth";
+// import { Message } from "element-plus";
+import { Login, loginRequest, getUserinfo, logout } from "@/api/api";
+const state = {
+  authToken: getCookie("accessToken") || "", //
+  username: getCookie("username") || "",
+  userId: getCookie("userId") || "",
+  roles: [],
+  permissions: [],
+};
+const mutations = {
+  REMOVE_TOKEN(state) {
+    removeToken();
+    removeUserId();
+    removeName();
+    state.roles = [];
+    state.permissions = [];
+    state.username = "";
+    state.userId = "";
+    state.authToken = "";
+  },
+  SET_TOKEN: (state, data) => {
+    state.authToken = data.accessToken;
+    state.userId = data.userId;
+    setToken(data.accessToken);
+    setUserId(data.userId);
+  },
+  SET_LOGINSTATE: (state, login) => {
+    state.loginState = login;
+    setLoginState(login);
+  },
+  SET_NAME: (state, name) => {
+    state.username = name;
+    setName(name);
+  },
+  SET_ROLES: (state, roles) => {
+    state.roles = roles;
+  },
+  SET_PERMISSIONS: (state, permissions) => {
+    state.permissions = permissions;
+  },
+};
+const actions = {
+  // 获取用户信息
+  GetInfo({ commit, state }) {
+    return new Promise((resolve, reject) => {
+      getUserinfo()
+        .then((res) => {
+          if (res) {
+            if (res.data.roles && res.data.roles.length > 0) {
+              // 验证返回的roles是否是一个非空数组
+              commit("SET_ROLES", res.data.roles);
+              commit("SET_NAME", res.data.user.nickname);
+              commit("SET_PERMISSIONS", res.data.permissions);
+            } else {
+              commit("SET_ROLES", ["ROLE_DEFAULT"]);
+            }
+            resolve(res.data);
+          }
+        })
+        .catch((error) => {
+          reject(error);
+        });
+    });
+  },
+  LogOut({ commit, state }) {
+    return new Promise((resolve, reject) => {
+      logout({ token: state.authToken, userId: state.userId })
+        .then((res) => {
+          if (res.code == 200) {
+            commit("REMOVE_TOKEN");
+            resolve();
+          }
+        })
+        .catch((error) => {
+          reject(error);
+        });
+    });
+  },
+};
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+};

src/utils/auth.js

@@ -0,0 +1,104 @@
+import Cookies from "js-cookie";
+import dayjs from "dayjs";
+const timeKey = "hrsaas-timestamp-key";
+// 设置时间戳的存储变量
+const TokenKey = "accessToken";
+const UserIdKey = "userId";
+const Username = "username";
+
+export function getCookie(name) {
+  return Cookies.get(name);
+}
+
+export function setCookie(name, value) {
+  return Cookies.set(name, value);
+}
+
+// cookie存储Username
+export function setName(name) {
+  return Cookies.set(Username, name);
+}
+// cookie存储token
+export function setToken(token) {
+  return Cookies.set(TokenKey, token);
+}
+// cookie存储UserId
+export function setUserId(userId) {
+  return Cookies.set(UserIdKey, userId);
+}
+
+// cookie删除token
+export function removeToken() {
+  return Cookies.remove(TokenKey);
+}
+// cookie删除UserId
+export function removeUserId() {
+  return Cookies.remove(UserIdKey);
+}
+// cookie删除Username
+export function removeName() {
+  return Cookies.remove(Username);
+}
+
+// 获取时间戳
+export function getTimeStamp() {
+  return Cookies.get(timeKey);
+}
+// 设置时间戳
+export function setTimeStamp() {
+  return Cookies.set(timeKey, Date.now());
+}
+
+// 时间格式化
+export function parseTime() {
+  var myDate = new Date();
+  const formatObj = {
+    year: myDate.getFullYear(),
+    month:
+      myDate.getMonth() + 1 >= 10
+        ? myDate.getMonth() + 1
+        : "0" + (myDate.getMonth() + 1),
+    day: myDate.getDate() >= 10 ? myDate.getDate() : "0" + myDate.getDate(),
+  };
+  return formatObj.year + "-" + formatObj.month + "-" + formatObj.day;
+}
+//获取1天前时间
+export function getStampTime() {
+  let stamp1 = new Date(new Date().setHours(0, 0, 0, 0));
+  stamp1 = dayjs(stamp1).format("YYYY-MM-DD HH:mm:ss");
+  let stamp2 = new Date(new Date().setHours(0, 0, 0, 0) + 24 * 60 * 60 * 1000);
+  stamp2 = dayjs(stamp2).format("YYYY-MM-DD HH:mm:ss");
+  return {
+    startTime: stamp1,
+    endTime: stamp2,
+  };
+}
+
+export function transTreeData(arr, idStr, pidStr, chindrenStr) {
+  let r = [],
+    hash = {},
+    id = idStr,
+    pid = pidStr,
+    children = chindrenStr,
+    len = arr.length;
+  for (let i = 0; i < len; i++) {
+    hash[arr[i][id]] = arr[i];
+  }
+  for (let j = 0; j < len; j++) {
+    let aVal = arr[j],
+      hashVP = hash[aVal[pid]];
+    if (hashVP) {
+      !hashVP[children] && (hashVP[children] = []);
+      hashVP[children].push(aVal);
+    } else {
+      r.push(aVal);
+    }
+  }
+  return r;
+}
+export function checkIn(item, arr) {
+  const result = arr.find((value) => {
+    return value.name == item.meta.title;
+  });
+  return result;
+}

src/websocket/index.js

@@ -6,7 +6,7 @@ export const dataAdapterInit = initialize;
 // ============================  大函数体   ============================
 function initialize() {
     let adpClient = null;
-    var url = "ws://192.168.2.3:8075/wisdom";
+    var url = `ws://192.168.1.109:6014/websocket/${store.state.user.authToken}`;
     adpClient = Stomp.client(url);
     adpClient.debug = null;
     adpClient.connect({}, adpClient => connectCallBackSubscribe(adpClient), error => reconnect(error, adpClient));