From 36e044280298d6f6b37b1295f9eba25584ef66a2 Mon Sep 17 00:00:00 2001 From: Gary Gu <garygu@Garydebijibendiannao.local> Date: Wed, 28 May 2025 09:13:42 +0800 Subject: [PATCH] feat: 增加设备分类 --- public/config.js | 10 src/store/modules/common.js | 70 ++++--- src/Dashboard.vue | 241 +++++++++++++++--------------- src/api/home.js | 88 +++++++--- src/components/Header.vue | 42 ++++- vite.config.js | 2 src/utils/getToken.js | 4 src/views/EquipmentView.vue | 17 ++ 8 files changed, 278 insertions(+), 196 deletions(-) diff --git a/public/config.js b/public/config.js index 75a53f4..0567746 100644 --- a/public/config.js +++ b/public/config.js @@ -8,12 +8,12 @@ */ window.ProjectConfig = { // axiosBaseURL: "http://47.117.124.20:2002/", - axiosBaseURL: "http://8.140.54.245:5000", + axiosBaseURL: "http://101.201.155.10:4011", axiosTimeout: 1000 * 30, //毫秒 - panoUrl: 'http://8.140.54.245:4010', // 全景预览地址 - panoBaseUrl: 'http://8.140.54.245:5000', // 全景图及文档接口 - modelUrl: 'http://8.140.54.245:4010/#/Home/sceneManagementDetail?shareUrlToken=AA82C10E34245412D8E276559C8582363A2CD38177A286C582C0471DC44FA5D836CAFB932F2C33B44201FE828EF6545397771FA675F7518619FAD578EB06FB6FA7671DFBEA34C32F8241C1EF1DDEA645', // 模型预览地址 + panoUrl: 'http://101.201.155.10:4010', // 全景预览地址 + panoBaseUrl: 'http://101.201.155.10:4011', // 全景图及文档接口 + modelUrl: 'http://101.201.155.10:4010/#/Home/sceneManagementDetail?shareUrlToken=AA82C10E34245412D8E276559C8582363A2CD38177A286C582C0471DC44FA5D836CAFB932F2C33B44201FE828EF6545397771FA675F7518619FAD578EB06FB6FA7671DFBEA34C32F8241C1EF1DDEA645', // 模型预览地址 sceneUrl: 'http://resources.vothing.com/mp4/12.mp4', // 实况地址 projectId: 'de42bc0a-9a5a-4d43-877f-0ae980f905b2', // 项目id - xieTongIframeSrc: 'http://8.140.54.245:4010/#/', // BIMe地址 + xieTongIframeSrc: 'http://101.201.155.10:4010/#/', // BIMe地址 } \ No newline at end of file diff --git a/src/Dashboard.vue b/src/Dashboard.vue index c920516..ef37b63 100644 --- a/src/Dashboard.vue +++ b/src/Dashboard.vue @@ -15,172 +15,171 @@ backgroundImage: `url(${backgroundImage})`, backgroundRepeat: 'no-repeat', backgroundPosition: 'center center', - backgroundSize: 'cover' + backgroundSize: 'cover', }" > <!--头部--> - <app-header class="absolute z-[100] top-0 left-0 right-0" :selected-id="currentProjectId" @onHomeClick="switchView" /> - - + <app-header class="absolute z-[100] top-0 left-0 right-0" :selected-id="currentProjectId" @onHomeClick="switchView" @onSelectChange="onSelectChange" /> <!--页面内容--> <div class="content-wrapper px-[22px] py-[10px] absolute inset-0 top-[80px] flex gap-[20px]"> <div class="flex-1 min-w-0"> <!-- 左侧模块 --> <div class="w-full h-full"> - <project-view v-if="isReady"/> + <project-view v-if="isReady" /> </div> </div> <div class="flex-1 min-w-0"> <!-- 中间模块 --> <div class="w-full h-full"> - <equipment-view v-if="isReady"/> + <equipment-view :selected-id="selectedId" v-if="isReady" /> </div> </div> <div class="w-[1080px]"> <!-- 右侧模块 --> <div class="w-full h-full"> - <Home v-if="isReady"/> + <Home v-if="isReady" /> </div> </div> </div> -<!-- <div class="absolute inset-0 top-[80px] flex" v-if="clickTab === 'xietong'"> + <!-- <div class="absolute inset-0 top-[80px] flex" v-if="clickTab === 'xietong'"> <iframe :src="iframeSrc" class="xieTongIframe" frameborder='0'></iframe> </div>--> <!--multiverse渲染容器 <div id="renderDom" class="absolute z-[40] top-0 bottom-0 left-0 right-0 w-full h-full"></div>--> - - </main> </template> <script> -import Vue from "vue"; -import { mapGetters } from "vuex"; -import Header from "./components/Header.vue"; -import Home from "./views/Home.vue"; -import ProjectView from "./views/ProjectView.vue"; -import { sceneJSON } from "./sceneJSON.js"; -import EquipmentView from "./views/EquipmentView.vue"; -import dayjs from "dayjs"; -import "dayjs/locale/zh-cn"; -import relativeTime from "dayjs/plugin/relativeTime"; -import { HomeAPI } from "./api/home"; -dayjs.locale("zh-cn"); -dayjs.extend(relativeTime); -Vue.prototype.$dayjs = dayjs; + import Vue from "vue"; + import { mapGetters } from "vuex"; + import Header from "./components/Header.vue"; + import Home from "./views/Home.vue"; + import ProjectView from "./views/ProjectView.vue"; + import { sceneJSON } from "./sceneJSON.js"; + import EquipmentView from "./views/EquipmentView.vue"; + import dayjs from "dayjs"; + import "dayjs/locale/zh-cn"; + import relativeTime from "dayjs/plugin/relativeTime"; + import { HomeAPI } from "./api/home"; + dayjs.locale("zh-cn"); + dayjs.extend(relativeTime); + Vue.prototype.$dayjs = dayjs; -import * as echarts from "echarts"; -Vue.prototype.$echarts = echarts; + import * as echarts from "echarts"; + Vue.prototype.$echarts = echarts; -import { nanoid } from "nanoid"; -Vue.prototype.$nanoid = nanoid; + import { nanoid } from "nanoid"; + Vue.prototype.$nanoid = nanoid; -export default { - name: "Dashboard", - components: { - "app-header": Header, - "Home": Home, - "project-view": ProjectView, - "equipment-view": EquipmentView - }, - data() { - return { - backgroundImage: new URL('@/assets/images/backgrounds/screen.png', import.meta.url).href, - currentProjectId: '1c179617-a7d9-4243-b813-84fa55a17ce7', - isReady: false, - clickTab:'home', - iframeSrc: window.ProjectConfig.xieTongIframeSrc - }; - }, - computed: { - ...mapGetters("common", []) - }, - watch: { - }, - mounted() { - this.getLoginInfo(); - }, - beforeDestroy() { - this.resetEngineRelated(); - }, - methods: { - /** - * 切换视图 - * @param val - */ - switchView(val){ - switch (val){ - case 'xietong': - window.open(window.ProjectConfig.xieTongIframeSrc, '_blank'); - break; - } + export default { + name: "Dashboard", + components: { + "app-header": Header, + Home: Home, + "project-view": ProjectView, + "equipment-view": EquipmentView, }, - //重置引擎相关的东西 - resetEngineRelated() { - window.scene = window.underlay = null; + data() { + return { + backgroundImage: new URL("@/assets/images/backgrounds/screen.png", import.meta.url).href, + currentProjectId: "1c179617-a7d9-4243-b813-84fa55a17ce7", + isReady: false, + clickTab: "home", + iframeSrc: window.ProjectConfig.xieTongIframeSrc, + selectedId: "", + }; }, - //响应切换地图 - onChangeMap(item) { - if (window.scene && window.underlay) { - const u = window.underlay; - const building = window.scene.findFeature("3DBuilding"); - switch (item.id) { - case "pic": { - if (building) { - building.visible = false; - } - u.change("satellite"); //这样需要将本地资源放在工程内 - // u.url = "http://multiverse.vothing.com/ref/style/satellite.json"; - // // 加载显示底图 - // u.load(); + computed: { + ...mapGetters("common", []), + }, + watch: {}, + mounted() { + this.getLoginInfo(); + }, + beforeDestroy() { + this.resetEngineRelated(); + }, + methods: { + onSelectChange(val) { + this.selectedId = val; + console.log("onSelectChange", val); + }, + /** + * 切换视图 + * @param val + */ + switchView(val) { + switch (val) { + case "xietong": + window.open(window.ProjectConfig.xieTongIframeSrc, "_blank"); break; - } - case "gis": { - if (building) { - building.visible = true; + } + }, + //重置引擎相关的东西 + resetEngineRelated() { + window.scene = window.underlay = null; + }, + //响应切换地图 + onChangeMap(item) { + if (window.scene && window.underlay) { + const u = window.underlay; + const building = window.scene.findFeature("3DBuilding"); + switch (item.id) { + case "pic": { + if (building) { + building.visible = false; + } + u.change("satellite"); //这样需要将本地资源放在工程内 + // u.url = "http://multiverse.vothing.com/ref/style/satellite.json"; + // // 加载显示底图 + // u.load(); + break; } - u.change("darkblue"); //这样需要将本地资源放在工程内 - // u.url = "http://multiverse.vothing.com/ref/style/darkblue.json"; - // // 加载显示底图 - // u.load(); - break; + case "gis": { + if (building) { + building.visible = true; + } + u.change("darkblue"); //这样需要将本地资源放在工程内 + // u.url = "http://multiverse.vothing.com/ref/style/darkblue.json"; + // // 加载显示底图 + // u.load(); + break; + } } } - } - }, - getLoginInfo() { - this.isReady = true - const data = { - "UserName": "JSC", - "Password": "JSC@jsc123", - "IfSingleLogin": "", - } - HomeAPI.WhLogin(data).then(res => { - console.log(res); - if(res.Ret === 1) { - const result = res.Data - window.localStorage.setItem("token", result.token) - console.log(result); - } - - }); - }, + }, + getLoginInfo() { + this.isReady = true; + const data = { + UserName: "JSC", + Password: "JSC@jsc123", + IfSingleLogin: "", + }; + HomeAPI.WhLogin(data).then((res) => { + console.log(res); + if (res.Ret === 1) { + const result = res.Data; + window.localStorage.setItem("token", result.token); + console.log(result); + } + }); + }, - //设置字体颜色 - cellStyle(row, _column, _rowIndex, _columnIndex) { - // console.log("row", row); - if (row.column.label === "状态" && row.row.status === "未处置") { - return "color:#EF424E"; - } + //设置字体颜色 + cellStyle(row, _column, _rowIndex, _columnIndex) { + // console.log("row", row); + if (row.column.label === "状态" && row.row.status === "未处置") { + return "color:#EF424E"; + } + }, }, - }, -}; + }; </script> <style lang="scss" scoped> - .xieTongIframe{ + .xieTongIframe { width: 100%; height: 100%; } diff --git a/src/api/home.js b/src/api/home.js index 71b94a3..50b0d63 100644 --- a/src/api/home.js +++ b/src/api/home.js @@ -8,34 +8,64 @@ */ import { http } from "../utils/http"; export const HomeAPI = { - GetProject: (data) => { - return http.get("/api/User/Project/GetProject", { - params: data - }); - }, + GetProject: (data) => { + return http.get("/api/User/Project/GetProject", { + params: data, + }); + }, - WhLogin: (data, config = {}) => { - return http.post("/api/User/Home/WhLogin", data, config); - }, + WhLogin: (data, config = {}) => { + return http.post("/api/User/Home/WhLogin", data, config); + }, - GetParticipatingList: (data) => { - return http.get("/api/User/Home/GetParticipatingList", { - params: data - }); - }, - GetParticipatingNumber: (data) => { - return http.get("/api/User/Home/GetParticipatingNumber", { - params: data - }); - }, - GetProjectPanoramaList: (data) => { - return http.get("/api/Panorama/PanoramaFile/GetProjectPanoramaList", { - params: data - }); - }, - GetScenesByPbGuid: (data) => { - return http.get("/api/Panorama/PanoramaFile/GetScenesByPbGuid", { - params: data - }); - } -}; \ No newline at end of file + GetParticipatingList: (data) => { + return http.get("/api/User/Home/GetParticipatingList", { + params: data, + }); + }, + GetParticipatingNumber: (data) => { + return http.get("/api/User/Home/GetParticipatingNumber", { + params: data, + }); + }, + GetProjectPanoramaList: (data) => { + return http.get("/api/Panorama/PanoramaFile/GetProjectPanoramaList", { + params: data, + }); + }, + GetScenesByPbGuid: (data) => { + return http.get("/api/Panorama/PanoramaFile/GetScenesByPbGuid", { + params: data, + }); + }, + GetBindSelect: (data) => { + return http.get("/api/jsc/JSCManage/GetBindSelect", { + params: data, + }); + }, + GetDeviceType: (data) => { + return http.get("/api/jsc/JSCManage/GetDeviceType", { + params: data, + }); + }, + GetJSCDeviceState: (data) => { + return http.get("/api/jsc/JSCManage/GetJSCDeviceState", { + params: data, + }); + }, + GetJSCEnvMonitor: (data) => { + return http.get("/api/jsc/JSCManage/GetJSCEnvMonitor", { + params: data, + }); + }, + GetJSCProgress: (data) => { + return http.get("/api/jsc/JSCManage/GetJSCProgress", { + params: data, + }); + }, + GetJSCProjectMonitor: (data) => { + return http.get("/api/jsc/JSCManage/GetJSCProjectMonitor", { + params: data, + }); + }, +}; diff --git a/src/components/Header.vue b/src/components/Header.vue index 3fc3799..979b004 100644 --- a/src/components/Header.vue +++ b/src/components/Header.vue @@ -43,7 +43,7 @@ </div> <div class="absolute top-0 right-0"> <div class="flex items-center h-[80px] mr-[20px]"> - <el-select v-model="projectSelected" placeholder="请选择" class="mr-[24px]"> + <el-select v-model="bindSelected" placeholder="请选择" class="mr-[24px]" @change="handleSelect"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" /> </el-select> <i @@ -61,6 +61,9 @@ </template> <script> + import { HomeAPI } from "@/api/home"; + import { mapActions } from "vuex"; + export default { name: "AppHeader", components: {}, @@ -76,12 +79,8 @@ }, data() { return { - projectSelected: "", - options: [ - { value: "project1", label: "项目1" }, - { value: "project2", label: "项目2" }, - { value: "project3", label: "项目3" }, - ], + bindSelected: "", + options: [], activeTab: "home", currentTime: "", currentDate: "", @@ -91,6 +90,7 @@ }, mounted() { this.updateTime(); + this.getBinds(); this.timer = setInterval(this.updateTime, 1000); }, beforeDestroy() { @@ -127,6 +127,32 @@ const weekDay = weekDays[now.getDay()]; this.currentDate = `${year}.${month}.${day} 星期${weekDay}`; }, + /** + * 获取标段信息 + */ + getBinds() { + HomeAPI.GetBindSelect().then((res) => { + if (res.Ret === 1) { + const result = res.Data; + if (result.length > 0) { + this.options = result.map((item) => ({ + value: item.Id, + label: item.BindName, + })); + this.bindSelected = this.options[0].value; // 默认选中第一个项目 + this.handleSelect(this.bindSelected); + } else { + this.options = []; + } + } + }); + }, + /** + * 处理选择变化 + */ + handleSelect(val) { + this.$emit("onSelectChange", val); + }, }, }; </script> @@ -137,7 +163,7 @@ ::v-deep(.el-select) { width: 160px; height: 28px; - background: rgba(33,72,115,0.9); + background: rgba(33, 72, 115, 0.9); border-radius: 2px; .el-input { align-items: center; diff --git a/src/store/modules/common.js b/src/store/modules/common.js index 45426ee..666f417 100644 --- a/src/store/modules/common.js +++ b/src/store/modules/common.js @@ -7,38 +7,46 @@ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE */ export default { - namespaced: true, - state: () => ({ - code: null, //用户信息 - token: null, //token - projectEndDate: null, //项目结束日期 - }), + namespaced: true, + state: () => ({ + code: null, //用户信息 + token: null, //token + projectEndDate: null, //项目结束日期 + bindId: null, + }), - mutations: { - setCode(state, data) { - state.code = data; - }, - setToken(state, data) { - state.token = data; - }, - setProjectEndDate(state, data) { - state.projectEndDate = data; - }, + mutations: { + setCode(state, data) { + state.code = data; }, - actions: { - setCode(context, data) { - context.commit("setCode", data); - }, - setToken(context, data) { - context.commit("setToken", data); - }, - setProjectEndDate(context, data) { - context.commit("setProjectEndDate", data); - }, + setToken(state, data) { + state.token = data; }, - getters: { - code: (state) => state.code, - token: (state) => state.token, - projectEndDate: (state) => state.projectEndDate, + setProjectEndDate(state, data) { + state.projectEndDate = data; }, -}; \ No newline at end of file + setBindId(state, data) { + state.bindId = data; + }, + }, + actions: { + setCode(context, data) { + context.commit("setCode", data); + }, + setToken(context, data) { + context.commit("setToken", data); + }, + setProjectEndDate(context, data) { + context.commit("setProjectEndDate", data); + }, + updateBindId({ commit }, data) { + commit("setBindId", data); + }, + }, + getters: { + code: (state) => state.code, + token: (state) => state.token, + projectEndDate: (state) => state.projectEndDate, + bindId: (state) => state.bindId, + }, +}; diff --git a/src/utils/getToken.js b/src/utils/getToken.js index 9713fc6..5217589 100644 --- a/src/utils/getToken.js +++ b/src/utils/getToken.js @@ -14,4 +14,8 @@ export const getProjectEndDate = () => { let endDate = store.getters["common/projectEndDate"]; return endDate; +} +export const getBindId = () => { + let bindId = store.getters["common/bindId"]; + return bindId; } \ No newline at end of file diff --git a/src/views/EquipmentView.vue b/src/views/EquipmentView.vue index dd39b73..7b2233b 100644 --- a/src/views/EquipmentView.vue +++ b/src/views/EquipmentView.vue @@ -176,6 +176,12 @@ components: { V2Echarts, }, + props: { + selectedId: { + type: String, + default: "", + }, + }, data() { return { equipmentSelected: "", @@ -496,6 +502,16 @@ }; }, }, + watch: { + selectedId: { + handler(newVal) { + console.log("设备界面接收到的数据:", newVal); + // 处理数据变化的逻辑 + }, + deep: true, // 深度监听对象内部变化 + immediate: true, // 立即执行一次 + }, + }, methods: { handleControlBtnClick(tab) { this.currentTab = tab; @@ -749,5 +765,4 @@ .progress-inner { display: none; } - </style> diff --git a/vite.config.js b/vite.config.js index cee0dd3..b0162fb 100644 --- a/vite.config.js +++ b/vite.config.js @@ -52,7 +52,7 @@ proxy: { "^/api/": { // target: "http://47.117.124.20:2002/", - target: "http://8.140.54.245:5000/", + target: "http://101.201.155.10:4011/", rewrite: (path) => path.replace(/^\/api\//, ""), changeOrigin: true, //通过浏览器查看像是"未生效",实际发送给后端的是更改过的Host(与target的host相同) }, -- Gitblit v1.9.3