From 9a57f78974fa275dc2241df82fd7f2ef7eb96964 Mon Sep 17 00:00:00 2001 From: donghao Date: Fri, 19 Jan 2024 16:33:51 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B5=8B=E8=AF=95=E6=8F=90=E4=BA=A41?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .husky/lintstagedrc.js | 6 +- .../CustomTree/src/collapseTree.tsx | 80 +++++++++---------- src/layout/components/appMain.vue | 2 +- src/layout/components/notice/index.vue | 5 +- src/router/modules/computePowerAllocation.ts | 1 + src/views/computePowerAllocation/index.vue | 1 - src/views/device/index.vue | 73 +++++++++++++---- 7 files changed, 103 insertions(+), 65 deletions(-) diff --git a/.husky/lintstagedrc.js b/.husky/lintstagedrc.js index 623bd6c..d4a404b 100644 --- a/.husky/lintstagedrc.js +++ b/.husky/lintstagedrc.js @@ -2,15 +2,15 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2024-01-12 14:35:28 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2024-01-17 13:17:41 + * @LastEditTime: 2024-01-19 16:31:46 * @FilePath: \General-AI-Platform-Web-Client\.husky\lintstagedrc.js * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE */ module.exports = { - "*.{js,jsx,ts,tsx}": ["eslint --fix", "prettier --write"], + "*.{js,jsx,ts,tsx}": ["prettier --write"], "{!(package)*.json}": ["prettier --write--parser json"], "package.json": ["prettier --write"], - "*.vue": ["eslint --fix", "prettier --write"], + "*.vue": ["prettier --write"], "*.{vue,css,scss,postcss,less}": ["prettier --write"], "*.md": ["prettier --write"] }; diff --git a/src/components/CustomTree/src/collapseTree.tsx b/src/components/CustomTree/src/collapseTree.tsx index eb6bb2f..7a557c0 100644 --- a/src/components/CustomTree/src/collapseTree.tsx +++ b/src/components/CustomTree/src/collapseTree.tsx @@ -3,77 +3,77 @@ import CollapseTreeItem from "./collapseTreeItem"; import "./collapseTreeStyle.scss"; const testDeviceTreeData = [ { - name: "控制设备组1", + name: "分析设备组", id: "11", level: 0, expended: true, childList: [ { - name: "控制器A", - id: "1101", - level: 1, - childList: [ - { - name: "控制器A1", - id: "1101001", - level: 2, - childList: [ - { - name: "控制器A1a1", - id: "110100101", - level: 3 - }, - { - name: "控制器A2a2", - id: "110100202", - level: 3 - } - ] - }, - { - name: "控制器A2", - id: "1101002", - level: 2 - } - ] + name: "分析设备", + id: "分析设备", + level: 1 + // childList: [ + // { + // name: "控制器A1", + // id: "1101001", + // level: 2, + // childList: [ + // { + // name: "控制器A1a1", + // id: "110100101", + // level: 3 + // }, + // { + // name: "控制器A2a2", + // id: "110100202", + // level: 3 + // } + // ] + // }, + // { + // name: "控制器A2", + // id: "1101002", + // level: 2 + // } + // ] }, { - name: "控制器B", + name: "控制设备2", id: "1102", level: 1 }, { - name: "控制器C", + name: "控制设备3", id: "1103", level: 1 }, { - name: "控制器D", + name: "控制设备4", id: "1104", level: 1 } ] }, { - name: "控制设备组2", + name: "监控", id: "12", level: 0, childList: [ { - name: "控制器B", - id: "1202", + name: "监控1", + id: "监控1", level: 1 }, { - name: "控制器C", + name: "监控2", id: "1203", level: 1 - }, - { - name: "控制器D", - id: "1204", - level: 1 } + // { + // name: "控制器D", + // id: "1204", + // level: 1 + // } ] } ]; diff --git a/src/layout/components/appMain.vue b/src/layout/components/appMain.vue index c7cbba1..48ed26c 100644 --- a/src/layout/components/appMain.vue +++ b/src/layout/components/appMain.vue @@ -91,7 +91,7 @@ const props = defineProps({ position: relative; width: 100%; height: calc(100vh - 48px - 2 * 24px); - overflow: scroll; + overflow: hidden; /* height: 100vh; */ overflow-x: hidden; diff --git a/src/layout/components/notice/index.vue b/src/layout/components/notice/index.vue index 0a99947..2dc46cc 100644 --- a/src/layout/components/notice/index.vue +++ b/src/layout/components/notice/index.vue @@ -2,7 +2,7 @@ * @Author: donghao donghao@supervision.ltd * @Date: 2024-01-12 14:35:28 * @LastEditors: donghao donghao@supervision.ltd - * @LastEditTime: 2024-01-17 10:02:25 + * @LastEditTime: 2024-01-19 15:04:59 * @FilePath: \General-AI-Platform-Web-Client\src\layout\components\notice\index.vue * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE --> @@ -67,8 +67,7 @@ notices.value.map(v => (noticesNum.value += v.list.length)); align-items: center; justify-content: center; width: 40px; - - /* height: 48px; */ + height: 48px; margin-right: 10px; cursor: pointer; diff --git a/src/router/modules/computePowerAllocation.ts b/src/router/modules/computePowerAllocation.ts index c83bb42..16ea791 100644 --- a/src/router/modules/computePowerAllocation.ts +++ b/src/router/modules/computePowerAllocation.ts @@ -6,6 +6,7 @@ export default { title: $t("menus.hsComputePowerAllocation"), icon: "icon-suanlipeizhi", // showLink: false, + bodyClass: ["computePowerAllocation_page"], rank: 6, roles: ["admin", "common"] }, diff --git a/src/views/computePowerAllocation/index.vue b/src/views/computePowerAllocation/index.vue index 769fb00..9084966 100644 --- a/src/views/computePowerAllocation/index.vue +++ b/src/views/computePowerAllocation/index.vue @@ -18,7 +18,6 @@ const animation1 = ref(null); //获取dom; - {{ animation1 }} diff --git a/src/views/device/index.vue b/src/views/device/index.vue index cc7da89..61dd972 100644 --- a/src/views/device/index.vue +++ b/src/views/device/index.vue @@ -2,7 +2,9 @@ import TreeCard from "./components/TreeCard.vue"; import DeviceCard from "./components/DeviceCard.vue"; import { getCardList } from "@/api/list"; -import { onMounted, reactive, ref } from "vue"; +import { onMounted, ref, watch, onBeforeUnmount, nextTick } from "vue"; +import { emitter } from "@/utils/mitt"; + defineOptions({ name: "DeviceList" }); @@ -24,9 +26,9 @@ const deviceList = ref([]); const searchValue = ref(""); -const formData = reactive({ +const formData = ref({ deviceSort: "", - deviceState: "", + state: "", isEnabled: "" }); const dataLoading = ref(true); @@ -43,11 +45,26 @@ const onCurrentChange = (current: number) => { const getCardListData = async () => { try { const { data } = await getCardList(); - deviceList.value = data.list; console.log(data.list); + let finalList = data.list; + if (formData.value.deviceSort) { + finalList = finalList.filter( + item => item.deviceSort === formData.value.deviceSort + ); + } + if (formData.value.state) { + finalList = finalList.filter(item => item.state === formData.value.state); + } + if (formData.value.isEnabled) { + finalList = finalList.filter( + item => item.isEnabled + "" === formData.value.isEnabled + ); + } + deviceList.value = finalList; + pagination.value = { ...pagination.value, - total: data.list.length + total: finalList.length }; } catch (e) { console.log(e); @@ -57,6 +74,32 @@ const getCardListData = async () => { }, 500); } }; + +nextTick(() => { + emitter.on("changCollapseTreeNodeId", data => { + formData.value = { + ...formData.value, + deviceSort: data + }; + }); +}); + +onBeforeUnmount(() => { + // 解绑`changCollapseTreeNodeId`公共事件，防止多次触发 + emitter.off("changCollapseTreeNodeId"); +}); + +watch( + () => formData.value, + () => { + console.log(formData, "formData"); + getCardListData(); + }, + { + deep: true + } +); + onMounted(() => { getCardListData(); }); @@ -74,7 +117,7 @@ onMounted(() => { @@ -83,24 +126,20 @@ onMounted(() => { - - - - + + + + - - + +