From 0341e93686ea341491f23b77134ac8e2762d1a93 Mon Sep 17 00:00:00 2001 From: Hcat1314 <2768237203@qq.com> Date: Tue, 19 Dec 2023 10:12:07 +0800 Subject: [PATCH 01/22] =?UTF-8?q?=E4=BC=98=E5=8C=96promise+=E7=AC=AC?= =?UTF-8?q?=E4=B8=80=E6=AC=A1=E8=BF=9B=E5=85=A5=E6=A8=A1=E5=9E=8B=E4=B8=8D?= =?UTF-8?q?=E5=8A=A0=E8=BD=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/content/tunnelScene/TunnelScene.vue | 5 ++--- src/components/content/tunnelScene/sceneClass/demo.js | 2 +- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/components/content/tunnelScene/TunnelScene.vue b/src/components/content/tunnelScene/TunnelScene.vue index 133d09e..57c28f6 100644 --- a/src/components/content/tunnelScene/TunnelScene.vue +++ b/src/components/content/tunnelScene/TunnelScene.vue @@ -81,12 +81,11 @@ async function handleMounted() { // 给对象初加载设备模型 demo.initDevicesModel(map); + await Promise.all([map.get("equ_fan"), map.get("equ_sensors")]); + demo.tunnelModeInit(); } catch (err) { console.log(err); } - - demo.tunnelModeInit(); - } // 每个模型加载回调 diff --git a/src/components/content/tunnelScene/sceneClass/demo.js b/src/components/content/tunnelScene/sceneClass/demo.js index b66276b..b2456fd 100644 --- a/src/components/content/tunnelScene/sceneClass/demo.js +++ b/src/components/content/tunnelScene/sceneClass/demo.js @@ -513,7 +513,7 @@ export default class Demo { for (const item of this.tunnelConfigEquipment) { //使用api取拿到附着点 let pointmodel = this.scene.getObjectByName(item.pointName) - // pointmodel.hasDevice = true; + pointmodel.hasDevice; let formInfo = { equipmentType: item.equipmentType, //设备类型 chooseEquipment: item.equipmentName, //设备选择(设备名称) From a850d9af78513eb3d94537584ab2b6771ce76735 Mon Sep 17 00:00:00 2001 From: Hcat1314 <2768237203@qq.com> Date: Wed, 20 Dec 2023 12:21:42 +0800 Subject: [PATCH 02/22] =?UTF-8?q?=E9=A2=84=E8=A7=88=E6=A8=A1=E5=BC=8F?= =?UTF-8?q?=E5=92=8C=E7=BC=96=E8=BE=91=E6=A8=A1=E5=BC=8F=E5=A4=A7=E8=87=B4?= =?UTF-8?q?=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../content/tunnelScene/PreviewScene.vue | 346 ++++++++++++++++++ .../content/tunnelScene/TunnelScene.vue | 11 + .../tunnelScene/editEquComp/editDialog.vue | 8 + .../preEquComp/childComps/InputNum.vue | 60 +++ .../tunnelScene/preEquComp/preDialog.vue | 304 +++++++++++++++ .../content/tunnelScene/sceneClass/demo.js | 11 + src/router/index.js | 12 +- src/views/tunnel/{preview.vue => edit.vue} | 121 +++++- src/views/tunnel/index.vue | 72 ++-- 9 files changed, 894 insertions(+), 51 deletions(-) create mode 100644 src/components/content/tunnelScene/PreviewScene.vue create mode 100644 src/components/content/tunnelScene/preEquComp/childComps/InputNum.vue create mode 100644 src/components/content/tunnelScene/preEquComp/preDialog.vue rename src/views/tunnel/{preview.vue => edit.vue} (58%) diff --git a/src/components/content/tunnelScene/PreviewScene.vue b/src/components/content/tunnelScene/PreviewScene.vue new file mode 100644 index 0000000..c0063c4 --- /dev/null +++ b/src/components/content/tunnelScene/PreviewScene.vue @@ -0,0 +1,346 @@ + + + + + diff --git a/src/components/content/tunnelScene/TunnelScene.vue b/src/components/content/tunnelScene/TunnelScene.vue index 57c28f6..11e6767 100644 --- a/src/components/content/tunnelScene/TunnelScene.vue +++ b/src/components/content/tunnelScene/TunnelScene.vue @@ -2,6 +2,7 @@
+ +
+

{{ params.name }}

+ +
+ + + + + diff --git a/src/components/content/tunnelScene/preEquComp/preDialog.vue b/src/components/content/tunnelScene/preEquComp/preDialog.vue new file mode 100644 index 0000000..bb20668 --- /dev/null +++ b/src/components/content/tunnelScene/preEquComp/preDialog.vue @@ -0,0 +1,304 @@ + + + + + diff --git a/src/components/content/tunnelScene/sceneClass/demo.js b/src/components/content/tunnelScene/sceneClass/demo.js index b2456fd..001c138 100644 --- a/src/components/content/tunnelScene/sceneClass/demo.js +++ b/src/components/content/tunnelScene/sceneClass/demo.js @@ -521,5 +521,16 @@ export default class Demo { } this.addEquipment(pointmodel, formInfo); } + //进行预览和编辑模式的一些操作 + if (this.isedit == false) { + this.scene.traverse(function (item) { + if (item.name.includes('point')) { + if (item.hasDevice == false) { + item.visible = false + item.layers.set(-1) + } + } + }) + } } } diff --git a/src/router/index.js b/src/router/index.js index eaf44cd..e2ec91a 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -21,16 +21,16 @@ const routes = [ meta: { title: '首页', breadcrumb: true - } + }, }, { - path: '/preview', - name: 'tunnelpreview', - component: () => import('@/views/tunnel/preview.vue'), + path: '/edit', + name: 'tunneledit', + component: () => import('@/views/tunnel/edit.vue'), meta: { - title: '预览首页', + title: '编辑首页', breadcrumb: true - } + }, }, { path: '/debug', diff --git a/src/views/tunnel/preview.vue b/src/views/tunnel/edit.vue similarity index 58% rename from src/views/tunnel/preview.vue rename to src/views/tunnel/edit.vue index 383a19c..49144c7 100644 --- a/src/views/tunnel/preview.vue +++ b/src/views/tunnel/edit.vue @@ -7,7 +7,15 @@
当前站点:{{ currentSite }} -
+ +
+ +
上午好:{{ currentUser }} @@ -16,7 +24,8 @@
- + + - + diff --git a/src/views/site/index.vue b/src/views/site/index.vue index 7cd9893..44ce543 100644 --- a/src/views/site/index.vue +++ b/src/views/site/index.vue @@ -34,7 +34,7 @@
{{ item.info.tunnelName }}
施工长度{{ item.info.constructionLength }}米
-
实现长度{{ item.info.implementationLength }}公里 +
实现长度{{ item.info.totalLength }}公里
diff --git a/src/views/tunnel/index.vue b/src/views/tunnel/index.vue index 77fe670..31c35e6 100644 --- a/src/views/tunnel/index.vue +++ b/src/views/tunnel/index.vue @@ -30,8 +30,8 @@
- - + +
From efa6d5b8c1df1a928bc78e881fb95b795bc9e34e Mon Sep 17 00:00:00 2001 From: Hcat <2768237203@qq.com> Date: Fri, 22 Dec 2023 13:40:46 +0800 Subject: [PATCH 08/22] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=B8=80=E7=82=B9?= =?UTF-8?q?=E7=82=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../content/tunnelScene/PreviewScene.vue | 13 +++++---- .../content/tunnelScene/TunnelScene.vue | 3 +- .../tunnelScene/preEquComp/preDialog.vue | 28 ++++++++++--------- .../content/tunnelScene/sceneClass/demo.js | 26 ++--------------- .../sceneClass/tunnelInit/index.js | 24 ++++++++++++++++ src/router/index.js | 2 +- src/views/{tunnel => edit}/edit.vue | 0 7 files changed, 50 insertions(+), 46 deletions(-) create mode 100644 src/components/content/tunnelScene/sceneClass/tunnelInit/index.js rename src/views/{tunnel => edit}/edit.vue (100%) diff --git a/src/components/content/tunnelScene/PreviewScene.vue b/src/components/content/tunnelScene/PreviewScene.vue index 9ae9bb7..3d96d1b 100644 --- a/src/components/content/tunnelScene/PreviewScene.vue +++ b/src/components/content/tunnelScene/PreviewScene.vue @@ -73,7 +73,7 @@ async function handleMounted() { demo = new ThreeDScene(three, content.value); //看是不是预览模式,然后继续相关的操作(会在demo中的初始化中进行) demo.isedit = params.isedit; - demo.loadModel(GLTFLoader, "./assets/tunnelModel/chanel.gltf"); + let tunnelasync = await demo.loadModel(GLTFLoader, "./assets/tunnelModel/chanel.gltf"); demo.addOrbitControls(OrbitControls); demo.addTween(TWEEN); demo.addCSS3Renderer(CSS3DRenderer, CSS3DSprite, doms); @@ -87,13 +87,12 @@ async function handleMounted() { // 初始化设备模型 try { + //在这加载隧道 const map = new Map(); map.set("equ_fan", await loadModel("/devicesModel/model2.obj")); map.set("equ_sensors", await loadModel("/devicesModel/sensors.obj")); - // 给对象初加载设备模型 demo.initDevicesModel(map); - await Promise.all([map.get("equ_fan"), map.get("equ_sensors")]); demo.tunnelModeInit(); } catch (err) { console.log(err); @@ -242,14 +241,16 @@ function previewEquInfProcess() { let tunnelThreeConfig = demo.ThreeConfig.data.tunnelThreeConfig for (const equipment of tunnelThreeConfig) { if (equipment.pointName == targetP.name) { - console.log(equipmentType); - console.log(equipmentName); - console.log(equipmentValue); equipmentType.value = equipment.equipmentType equipmentName.value = equipment.equipmentName equipmentValue.value = equipment.equipmentValue + console.log(equipmentType.value); + console.log(equipmentName.value); + console.log(equipmentValue.value); } + } + } // let equipmentType = reactive(previewEquInfProcess().equipmentType) diff --git a/src/components/content/tunnelScene/TunnelScene.vue b/src/components/content/tunnelScene/TunnelScene.vue index 6c9fb08..ad4c6d5 100644 --- a/src/components/content/tunnelScene/TunnelScene.vue +++ b/src/components/content/tunnelScene/TunnelScene.vue @@ -72,8 +72,7 @@ async function handleMounted() { demo = new ThreeDScene(three, content.value); //看是不是预览模式,然后继续相关的操作(会在demo中的初始化中进行) demo.isedit = params.isedit; - - demo.loadModel(GLTFLoader, "./assets/tunnelModel/chanel.gltf"); + let tunnelasync = await demo.loadModel(GLTFLoader, "./assets/tunnelModel/chanel.gltf"); demo.addOrbitControls(OrbitControls); demo.addTween(TWEEN); demo.addCSS3Renderer(CSS3DRenderer, CSS3DSprite, doms); diff --git a/src/components/content/tunnelScene/preEquComp/preDialog.vue b/src/components/content/tunnelScene/preEquComp/preDialog.vue index bb20668..9a028b2 100644 --- a/src/components/content/tunnelScene/preEquComp/preDialog.vue +++ b/src/components/content/tunnelScene/preEquComp/preDialog.vue @@ -9,18 +9,18 @@

传感器类型

+ :placeholder="params.equipmentType" disabled>

设备选择

+ :placeholder="params.equipmentValue" disabled>
-
@@ -50,18 +50,20 @@ const params = defineProps(["pointNum", "pointGap", "equipmentType", "equipmentN // 当前风压 let p = ref(57); -function EquInf() { - // 发射事件给tunnel父组件 - emit("EquInf"); -} +// function EquInf() { +// // 发射事件给tunnel父组件 +// emit("EquInf"); +// } -console.log(params.equipmentType); -console.log(params.equipmentName); -console.log(params.equipmentValue); +// console.log(params.equipmentType); +// console.log(params.equipmentName); +// console.log(params.equipmentValue); -let equipmentTypeInf = ref(params.equipmentType) -let equipmentNameInf = ref(params.equipmentName) -let equipmentValueInf = ref(params.equipmentValue) + + +// let equipmentTypeInf = ref(params.equipmentType) +// let equipmentNameInf = ref(params.equipmentName) +// let equipmentValueInf = ref(params.equipmentValue) diff --git a/src/components/content/tunnelScene/sceneClass/demo.js b/src/components/content/tunnelScene/sceneClass/demo.js index 001c138..4705450 100644 --- a/src/components/content/tunnelScene/sceneClass/demo.js +++ b/src/components/content/tunnelScene/sceneClass/demo.js @@ -9,6 +9,7 @@ import { import { saveState, resetState } from "./viewBack"; import addFunction from "./addEvent"; import { addEquipment, removeEquipment } from "./editEquipment"; +import tunnelModeInit from "./tunnelInit" import { Group } from "three/examples/jsm/libs/tween.module"; export default class Demo { // 摄像机看向位置 @@ -26,6 +27,7 @@ export default class Demo { this._resetState = resetState; this.addEquipment = addEquipment; this.removeEquipment = removeEquipment; + this.tunnelModeInit = tunnelModeInit; // 外部可添加函数 this.addFunction = addFunction; @@ -509,28 +511,4 @@ export default class Demo { msg: "dda" } tunnelConfigEquipment = this.ThreeConfig.data.tunnelThreeConfig - tunnelModeInit() { - for (const item of this.tunnelConfigEquipment) { - //使用api取拿到附着点 - let pointmodel = this.scene.getObjectByName(item.pointName) - pointmodel.hasDevice; - let formInfo = { - equipmentType: item.equipmentType, //设备类型 - chooseEquipment: item.equipmentName, //设备选择(设备名称) - threshold: item.equipmentValue, //阈值 - } - this.addEquipment(pointmodel, formInfo); - } - //进行预览和编辑模式的一些操作 - if (this.isedit == false) { - this.scene.traverse(function (item) { - if (item.name.includes('point')) { - if (item.hasDevice == false) { - item.visible = false - item.layers.set(-1) - } - } - }) - } - } } diff --git a/src/components/content/tunnelScene/sceneClass/tunnelInit/index.js b/src/components/content/tunnelScene/sceneClass/tunnelInit/index.js new file mode 100644 index 0000000..4f93bc0 --- /dev/null +++ b/src/components/content/tunnelScene/sceneClass/tunnelInit/index.js @@ -0,0 +1,24 @@ +export default function tunnelModeInit() { + for (const item of this.tunnelConfigEquipment) { + //使用api取拿到附着点 + let pointmodel = this.scene.getObjectByName(item.pointName) + pointmodel.hasDevice; + let formInfo = { + equipmentType: item.equipmentType, //设备类型 + chooseEquipment: item.equipmentName, //设备选择(设备名称) + threshold: item.equipmentValue, //阈值 + } + this.addEquipment(pointmodel, formInfo); + } + //进行预览和编辑模式的一些操作 + if (this.isedit == false) { + this.scene.traverse(function (item) { + if (item.name.includes('point')) { + if (item.hasDevice == false) { + item.visible = false + item.layers.set(-1) + } + } + }) + } +} \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index e2ec91a..a83d828 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -26,7 +26,7 @@ const routes = [ { path: '/edit', name: 'tunneledit', - component: () => import('@/views/tunnel/edit.vue'), + component: () => import('@/views/edit/edit.vue'), meta: { title: '编辑首页', breadcrumb: true diff --git a/src/views/tunnel/edit.vue b/src/views/edit/edit.vue similarity index 100% rename from src/views/tunnel/edit.vue rename to src/views/edit/edit.vue From 68d121091f3e31792b02d8da0f44990f9dea5059 Mon Sep 17 00:00:00 2001 From: Hcat <2768237203@qq.com> Date: Fri, 22 Dec 2023 13:56:41 +0800 Subject: [PATCH 09/22] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=88=9D=E5=A7=8B?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../content/tunnelScene/PreviewScene.vue | 14 +------- .../content/tunnelScene/TunnelScene.vue | 34 +------------------ .../content/tunnelScene/sceneClass/demo.js | 4 +-- .../index.js | 3 +- 4 files changed, 6 insertions(+), 49 deletions(-) rename src/components/content/tunnelScene/sceneClass/{tunnelInit => previewTunnelInit}/index.js (94%) diff --git a/src/components/content/tunnelScene/PreviewScene.vue b/src/components/content/tunnelScene/PreviewScene.vue index 3d96d1b..c029eff 100644 --- a/src/components/content/tunnelScene/PreviewScene.vue +++ b/src/components/content/tunnelScene/PreviewScene.vue @@ -93,7 +93,7 @@ async function handleMounted() { map.set("equ_sensors", await loadModel("/devicesModel/sensors.obj")); // 给对象初加载设备模型 demo.initDevicesModel(map); - demo.tunnelModeInit(); + demo.previewtunnelModeInit(); } catch (err) { console.log(err); } @@ -248,9 +248,7 @@ function previewEquInfProcess() { console.log(equipmentName.value); console.log(equipmentValue.value); } - } - } // let equipmentType = reactive(previewEquInfProcess().equipmentType) @@ -279,16 +277,6 @@ const ThreeConfig = { }, msg: "dda" } -//取值方便操作 -// const tunnelConfigEquipment = ThreeConfig.data.tunnelThreeConfig - -// function tunnelModeInit() { -// for (const item of tunnelConfigEquipment) { -// let pointmodel = demo.scene.getobjectByName(item.pointName) -// console.log(pointmodel); -// } -// } -// tunnelModeInit() diff --git a/src/components/content/tunnelScene/TunnelScene.vue b/src/components/content/tunnelScene/TunnelScene.vue index ad4c6d5..dff8add 100644 --- a/src/components/content/tunnelScene/TunnelScene.vue +++ b/src/components/content/tunnelScene/TunnelScene.vue @@ -92,7 +92,7 @@ async function handleMounted() { // 给对象初加载设备模型 demo.initDevicesModel(map); await Promise.all([map.get("equ_fan"), map.get("equ_sensors")]); - demo.tunnelModeInit(); + // demo.tunnelModeInit() } catch (err) { console.log(err); } @@ -221,39 +221,7 @@ function handleCancel() { demo._resetState(); demo.clearTagsObj(); } -//现在首先有二种方案,是写在TunnelScene.vue中还是demo.js中呢? -//我认为可能看数据在哪获取?到时候看在哪里导入,首先我们放在TunnelScene里面吧 -//因为没获取到接口,我们先写死!!! -//需要参考接口的数据结构!!!,主要是传入函数的参数应该是什么结构??? -const ThreeConfig = { - code: 0, - data: { - tunnelThreeConfig: [{ - equipmentId: 'fan_01',//传感器id - equipmentName: '01',//设备名称 - pointName: 'point_005_tl',//附着点名称(定位) - equipmentType: 'fan',//设备类型(类型可根据后端 - equipmentValue: 23, //设备存的值 - }, { - equipmentId: 'sensors_01',//传感器id - equipmentName: '01',//设备名称 - pointName: 'point_009_bl',//附着点名称(定位) - equipmentType: 'sensors',//设备类型(类型可根据后端 - equipmentValue: 67, //设备存的值 - }], - }, - msg: "dda" -} -//取值方便操作 -// const tunnelConfigEquipment = ThreeConfig.data.tunnelThreeConfig -// function tunnelModeInit() { -// for (const item of tunnelConfigEquipment) { -// let pointmodel = demo.scene.getobjectByName(item.pointName) -// console.log(pointmodel); -// } -// } -// tunnelModeInit() diff --git a/src/components/content/tunnelScene/sceneClass/demo.js b/src/components/content/tunnelScene/sceneClass/demo.js index 4705450..bccca26 100644 --- a/src/components/content/tunnelScene/sceneClass/demo.js +++ b/src/components/content/tunnelScene/sceneClass/demo.js @@ -9,7 +9,7 @@ import { import { saveState, resetState } from "./viewBack"; import addFunction from "./addEvent"; import { addEquipment, removeEquipment } from "./editEquipment"; -import tunnelModeInit from "./tunnelInit" +import previewtunnelModeInit from "./previewTunnelInit" import { Group } from "three/examples/jsm/libs/tween.module"; export default class Demo { // 摄像机看向位置 @@ -27,7 +27,7 @@ export default class Demo { this._resetState = resetState; this.addEquipment = addEquipment; this.removeEquipment = removeEquipment; - this.tunnelModeInit = tunnelModeInit; + this.previewtunnelModeInit = previewtunnelModeInit; // 外部可添加函数 this.addFunction = addFunction; diff --git a/src/components/content/tunnelScene/sceneClass/tunnelInit/index.js b/src/components/content/tunnelScene/sceneClass/previewTunnelInit/index.js similarity index 94% rename from src/components/content/tunnelScene/sceneClass/tunnelInit/index.js rename to src/components/content/tunnelScene/sceneClass/previewTunnelInit/index.js index 4f93bc0..22f1662 100644 --- a/src/components/content/tunnelScene/sceneClass/tunnelInit/index.js +++ b/src/components/content/tunnelScene/sceneClass/previewTunnelInit/index.js @@ -1,4 +1,5 @@ -export default function tunnelModeInit() { +export default function previewtunnelModeInit() { + for (const item of this.tunnelConfigEquipment) { //使用api取拿到附着点 let pointmodel = this.scene.getObjectByName(item.pointName) From 65510ce59d16ccfcd4c58ee79ec659e775f749ec Mon Sep 17 00:00:00 2001 From: Hcat <2768237203@qq.com> Date: Fri, 22 Dec 2023 14:55:05 +0800 Subject: [PATCH 10/22] =?UTF-8?q?=E5=90=88=E5=B9=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/tunnelScene.js | 44 ++++ .../content/tunnelScene/TunnelScene.vue | 117 +++++---- .../editEquComp/childComps/SelectInput.vue | 113 +++++++++ .../tunnelScene/editEquComp/editDialog.vue | 233 +++++++++--------- .../content/tunnelScene/sceneClass/demo.js | 24 +- .../sceneClass/editEquipment/index.js | 53 ++-- .../sceneClass/editTunnelInit/index.js | 10 + .../sceneClass/utils/EquipmentTag.js | 21 +- src/store/modelSceneStore.js | 54 ++++ src/views/edit/edit.vue | 2 +- 10 files changed, 463 insertions(+), 208 deletions(-) create mode 100644 src/api/tunnelScene.js create mode 100644 src/components/content/tunnelScene/editEquComp/childComps/SelectInput.vue create mode 100644 src/components/content/tunnelScene/sceneClass/editTunnelInit/index.js create mode 100644 src/store/modelSceneStore.js diff --git a/src/api/tunnelScene.js b/src/api/tunnelScene.js new file mode 100644 index 0000000..5b1aa0a --- /dev/null +++ b/src/api/tunnelScene.js @@ -0,0 +1,44 @@ +import request from "@/utils/request.js"; + +// 设备类型 +export const getEquipmentType = () => { + return request({ + url: "/tunnel/model/equipment/type/option", + method: "get", + }); +}; +// 获取设备 +export const getEquipment = (tunnelId, typeKey, equipmentIds = "1") => { + return request({ + url: "/tunnel/model/equipment/option", + method: "post", + params: { + tunnelId, + typeKey, + equipmentIds, + }, + }); +}; +// 初始化数据 +export const initSceneData = (tunnelId) => { + return request({ + url: `/tunnel/model/${tunnelId}`, + method: "get", + }); +}; +// 添加设备 +export const saveEquipment = ( + constructionLength, + tunnelId, + tunnelThreeConfig +) => { + return request({ + url: "/tunnel/model", + method: "put", + data: { + constructionLength, + tunnelId, + tunnelThreeConfig, + }, + }); +}; diff --git a/src/components/content/tunnelScene/TunnelScene.vue b/src/components/content/tunnelScene/TunnelScene.vue index dff8add..54c4444 100644 --- a/src/components/content/tunnelScene/TunnelScene.vue +++ b/src/components/content/tunnelScene/TunnelScene.vue @@ -4,7 +4,8 @@ + :hasDev="hasDevice" :pointNum="pointNum" :tunnelId="tunnelId" :position="targetP?.name" :hasEquipment="hasDevice" + pointGap="500" /> { + demo.removeEquipment(targetP.value); + centerDialogVisible.value = false; + ElMessage({ + message: "删除成功!", + type: "success", + }); + }) + .catch((err) => { + ElMessage({ + message: "请求异常!", + type: "warning", + }); + }); } // 处理取消关闭编辑框事件 function handleCancel() { @@ -221,8 +224,32 @@ function handleCancel() { demo._resetState(); demo.clearTagsObj(); } - - +//现在首先有二种方案,是写在TunnelScene.vue中还是demo.js中呢? +//我认为可能看数据在哪获取?到时候看在哪里导入,首先我们放在TunnelScene里面吧 +//因为没获取到接口,我们先写死!!! +//需要参考接口的数据结构!!!,主要是传入函数的参数应该是什么结构??? +const ThreeConfig = { + code: 0, + data: { + tunnelThreeConfig: [ + { + equipmentId: "fan_01", //传感器id + equipmentName: "01", //设备名称 + pointName: "point_005_tl", //附着点名称(定位) + equipmentType: "fan", //设备类型(类型可根据后端 + equipmentValue: 23, //设备存的值 + }, + { + equipmentId: "sensors_01", //传感器id + equipmentName: "01", //设备名称 + pointName: "point_009_bl", //附着点名称(定位) + equipmentType: "sensors", //设备类型(类型可根据后端 + equipmentValue: 67, //设备存的值 + }, + ], + }, + msg: "dda", +}; diff --git a/src/components/content/tunnelScene/editEquComp/editDialog.vue b/src/components/content/tunnelScene/editEquComp/editDialog.vue index 9a822a9..b188143 100644 --- a/src/components/content/tunnelScene/editEquComp/editDialog.vue +++ b/src/components/content/tunnelScene/editEquComp/editDialog.vue @@ -2,25 +2,39 @@

当前距离洞口:{{ pointDistance_str }}

- +
当前风压:{{ p }}Pa

传感器类型

- - - + +

设备选择

- - - +
- +
@@ -31,84 +45,81 @@ diff --git a/src/views/tunnel/index.vue b/src/views/tunnel/index.vue index 31c35e6..08d166b 100644 --- a/src/views/tunnel/index.vue +++ b/src/views/tunnel/index.vue @@ -29,7 +29,7 @@
+ :close-on-click-modal="false" :close-on-press-escape="false"> From 1cb5c6c25899615c7438aac3495c9843a885b6f0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=82=93=E6=B4=81?= <209192278@qq.com> Date: Fri, 22 Dec 2023 16:08:49 +0800 Subject: [PATCH 13/22] =?UTF-8?q?=E9=82=93=E6=B4=81:=20=E5=90=88=E5=B9=B6?= =?UTF-8?q?=E4=BB=A3=E7=A0=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/content/airInfo/AirInfo.vue | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/content/airInfo/AirInfo.vue b/src/components/content/airInfo/AirInfo.vue index 3408ec0..957c3dd 100644 --- a/src/components/content/airInfo/AirInfo.vue +++ b/src/components/content/airInfo/AirInfo.vue @@ -242,6 +242,7 @@ const initChart = () => { } ] } + myEcharts.setOption(option); //图表大小自适应窗口大小变化 window.onresize = () => { From 2eeba5ee7e71b43d3694a63495b1c2253c910ecd Mon Sep 17 00:00:00 2001 From: Hcat <2768237203@qq.com> Date: Fri, 22 Dec 2023 18:04:05 +0800 Subject: [PATCH 14/22] =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96=E6=8E=A5?= =?UTF-8?q?=E5=8F=A3=E7=BB=91=E5=AE=9A=E5=AE=8C=E5=85=A8=E5=AE=8C=E6=88=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../content/tunnelScene/PreviewScene.vue | 76 ++++++++----------- .../content/tunnelScene/TunnelScene.vue | 8 +- .../preEquComp/childComps/InputNum.vue | 3 +- .../tunnelScene/preEquComp/preDialog.vue | 8 +- 4 files changed, 44 insertions(+), 51 deletions(-) diff --git a/src/components/content/tunnelScene/PreviewScene.vue b/src/components/content/tunnelScene/PreviewScene.vue index e3b2d46..bc0e3bc 100644 --- a/src/components/content/tunnelScene/PreviewScene.vue +++ b/src/components/content/tunnelScene/PreviewScene.vue @@ -50,6 +50,7 @@ import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader"; import { onMounted, reactive, ref } from "vue"; import { ElMessage } from "element-plus"; import { useModelSceneStore } from "@/store/modelSceneStore"; +import { toRaw } from "vue" // 获取html标签跟随组件dom const content = ref(null); const info = ref(null); @@ -63,7 +64,7 @@ let backColorSet = three.sRGBEncoding; const params = defineProps(["isedit", "tunnelId"]); //接收参数看是不是编辑模式,如果是编辑模式,则需要做一些处理 -// alert(params.isedit) + let isedit = ref(params.isedit) @@ -86,8 +87,12 @@ async function handleMounted() { //加载HDR背景图片 demo.loadBackground(hdrLoader, backColorSet); - console.log("xxxx", params.tunnelId); - const text = await store.initData(params.tunnelId); + watch( + () => params.tunnelId, + async () => { + const text = await store.initData(params.tunnelId); + } + ); // 初始化设备模型 try { //在这加载隧道 @@ -98,6 +103,7 @@ async function handleMounted() { demo.initDevicesModel(map); const equipmentList = await store.getEquipmentList(); demo.previewtunnelModeInit(equipmentList); + // previewEquInfProcess(equipmentList) } catch (err) { console.log(err); } @@ -165,7 +171,9 @@ function rClickCallback(demo) { hasDevice = targetPoint.hasDevice; targetP = targetPoint; //点击之后马上调用这个函数,变成回调,然后进行处理处理在传给preview表单 - previewEquInfProcess() + const equipmentList = store.getEquipmentList().then((result) => { + previewEquInfProcess(result, targetP) + }); pointNum.value = Number( targetPoint.name.substring( targetPoint.name.indexOf("_") + 1, @@ -227,60 +235,40 @@ function handleCancel() { demo._resetState(); demo.clearTagsObj(); } -//我们的数据应该在哪个获取并将其传入进去呢? -//是在demo.js中还是我们这二个PreviewScene或者editDialog呢? -//按目前我这写的逻辑,好像是获取了二次??,有没有办法可以把里面的导出到这呢? -// console.log(demo.isControlOrbit()); let equipmentType = ref(0) let equipmentName = ref(0) let equipmentValue = ref(0) -function previewEquInfProcess() { - //3个信息都可以完全获取,之后,我们可以进行信息处理再传进去就可以了 - // console.log(demo); - // console.log(targetP.name); - // console.log(demo.ThreeConfig.data.tunnelThreeConfig); - let tunnelThreeConfig = demo.ThreeConfig.data.tunnelThreeConfig - for (const equipment of tunnelThreeConfig) { - if (equipment.pointName == targetP.name) { +function previewEquInfProcess(equipmentList, targetP) { + for (const equipment of equipmentList) { + // console.log(equipment); + if (equipment.position == targetP.name) { equipmentType.value = equipment.equipmentType - equipmentName.value = equipment.equipmentName - equipmentValue.value = equipment.equipmentValue - console.log(equipmentType.value); - console.log(equipmentName.value); - console.log(equipmentValue.value); + //需要将获取到的设备列表进行序列化 + equipmentName.value = toRaw(equipment.chooseEquipment).label + equipmentValue.value = equipment.threshold + if (equipmentType.value == 'frequency') { + equipmentType.value = '风机' + } + if (equipmentType.value == 'windPressure') { + equipmentType.value = '风压传感器' + } + if (equipmentType.value == 'sensor') { + equipmentType.value = '其他传感器' + } + // console.log(equipmentType.value); + // console.log(equipmentName.value); + // console.log(equipmentValue.value); } } } -// let equipmentType = reactive(previewEquInfProcess().equipmentType) -// let equipmentName = reactive(previewEquInfProcess().equipmentName) -// let equipmentValue = reactive(previewEquInfProcess().equipmentValue) -// console.log(equipmentType); -const ThreeConfig = { - code: 0, - data: { - tunnelThreeConfig: [{ - equipmentId: 'fan_01',//传感器id - equipmentName: '01',//设备名称 - pointName: 'point_005_tl',//附着点名称(定位) - equipmentType: 'fan',//设备类型(类型可根据后端 - equipmentValue: 23, //设备存的值 - }, { - equipmentId: 'sensors_01',//传感器id - equipmentName: '01',//设备名称 - pointName: 'point_009_bl',//附着点名称(定位) - equipmentType: 'sensors',//设备类型(类型可根据后端 - equipmentValue: 67, //设备存的值 - }], - }, - msg: "dda" -} + diff --git a/src/components/content/tunnelScene/TunnelScene.vue b/src/components/content/tunnelScene/TunnelScene.vue index b52a163..76b102b 100644 --- a/src/components/content/tunnelScene/TunnelScene.vue +++ b/src/components/content/tunnelScene/TunnelScene.vue @@ -87,8 +87,12 @@ async function handleMounted() { //加载HDR背景图片 demo.loadBackground(hdrLoader, backColorSet); - console.log("xxxx", params.tunnelId); - const text = await store.initData(params.tunnelId); + watch( + () => params.tunnelId, + async () => { + const text = await store.initData(params.tunnelId); + } + ); // 初始化设备模型 try { const map = new Map(); diff --git a/src/components/content/tunnelScene/preEquComp/childComps/InputNum.vue b/src/components/content/tunnelScene/preEquComp/childComps/InputNum.vue index 987e5c9..6b84f0a 100644 --- a/src/components/content/tunnelScene/preEquComp/childComps/InputNum.vue +++ b/src/components/content/tunnelScene/preEquComp/childComps/InputNum.vue @@ -1,7 +1,8 @@ diff --git a/src/components/content/tunnelScene/preEquComp/preDialog.vue b/src/components/content/tunnelScene/preEquComp/preDialog.vue index 9a028b2..41b86d7 100644 --- a/src/components/content/tunnelScene/preEquComp/preDialog.vue +++ b/src/components/content/tunnelScene/preEquComp/preDialog.vue @@ -16,7 +16,7 @@

设备选择

+ :placeholder="params.equipmentName" disabled>
@@ -55,9 +55,9 @@ let p = ref(57); // emit("EquInf"); // } -// console.log(params.equipmentType); -// console.log(params.equipmentName); -// console.log(params.equipmentValue); +console.log(params.equipmentType); +console.log(params.equipmentName); +console.log(params.equipmentValue); From 56f954e35472a2ff4e76ebaa0687edcf5d291746 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=82=93=E6=B4=81?= <209192278@qq.com> Date: Fri, 22 Dec 2023 23:11:01 +0800 Subject: [PATCH 15/22] =?UTF-8?q?=E9=82=93=E6=B4=81:=20=E7=94=A8=E6=88=B7?= =?UTF-8?q?=E7=AE=A1=E7=90=86=E6=8E=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/tunnel.js | 8 + src/api/user.js | 42 +++++ src/assets/styles/index.scss | 110 +++++++----- src/router/index.js | 2 +- src/views/tunnel/index.vue | 7 +- src/views/user/index.vue | 326 ++++++++++++++++++++++++----------- vite.config.js | 21 ++- 7 files changed, 372 insertions(+), 144 deletions(-) create mode 100644 src/api/tunnel.js create mode 100644 src/api/user.js diff --git a/src/api/tunnel.js b/src/api/tunnel.js new file mode 100644 index 0000000..c06d5d4 --- /dev/null +++ b/src/api/tunnel.js @@ -0,0 +1,8 @@ +import request from '@/utils/request.js' + +export const getTunnelOption = (siteId) => { + return request({ + url: `/tunnel/tunnel/option/${siteId}`, + method: 'get' + }) +} diff --git a/src/api/user.js b/src/api/user.js new file mode 100644 index 0000000..7fb0961 --- /dev/null +++ b/src/api/user.js @@ -0,0 +1,42 @@ +import request from '@/utils/request.js' + +export const getUser = (params) => { + return request({ + url: '/admin/user/tunnel', + method: 'get', + params + }) +} +export const getUserDetail = (userId) => { + return request({ + url: `/admin/user/info/${userId}`, + method: 'get' + }) +} +export const editUser = (data) => { + return request({ + url: '/admin/user', + method: 'put', + data + }) +} +export const addUser = (data) => { + return request({ + url: '/admin/user', + method: 'post', + data + }) +} +export const deleteUser = (userId) => { + return request({ + url: `/admin/user/${userId}`, + method: 'delete' + }) +} + +export const getRoleOption = () => { + return request({ + url: '/admin/role/option', + method: 'get' + }) +} diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss index 5d87f08..aaeb918 100644 --- a/src/assets/styles/index.scss +++ b/src/assets/styles/index.scss @@ -12,7 +12,7 @@ -khtml-user-select: none; /*早期浏览器*/ user-select: none; font-family: "MicrosoftYaHei", "微软雅黑", "Helvetica Neue", Helvetica, Arial, - sans-serif; + sans-serif; } body { @@ -97,6 +97,7 @@ body, .current-site { display: flex; align-items: center; + > span:first-child { color: #f7b500; margin-right: 20px; @@ -486,43 +487,72 @@ body, background: #072247 !important; border: 1px solid #0F82AF !important; } - .el-popper { - max-width: 202px !important; + max-width: 200px !important; box-sizing: border-box; } - .el-popper__arrow::before { display: none; } - -.el-select-dropdown { - width: 200px !important; +.el-select-dropdown{ + width: 200px!important; } - -.el-select-dropdown__item { - color: #fff !important; -} - -.el-select-dropdown__item.hover { - background-color: #072247 !important; -} - -.el-select-dropdown__item:hover { - background-color: #072247 !important; - color: #08B7B8 !important; -} - -.el-select-dropdown__item.selected { - color: #08B7B8 !important; -} - -.el-select-dropdown__list { - .el-select-dropdown__item:first-child { +.el-select-dropdown__item{ + >span{ color: #FFFFFF; + } +} +.el-select .el-input .el-select__caret { + font-size: 35px!important; +} +.el-select-dropdown__item.hover,.el-select-dropdown__item:hover{ + background-color: #064B66!important; + width:198px!important; +} +.el-select-dropdown.is-multiple .el-select-dropdown__item.selected{ + background-color: #064B66!important; + width:200px!important; +} +.el-select-tags-wrapper{ + .el-tag{ + padding: 28px 20px!important; + font-size: 35px; + .el-icon{ + width: 40px; + height: 40px; + font-size: 40px!important; + } + } +} +.current-site { + .el-select-dropdown { + width: 200px !important; + } - &:hover { - color: #08B7B8 !important; + .el-select-dropdown__item { + color: #fff !important; + } + + .el-select-dropdown__item.hover { + background-color: #072247 !important; + } + + .el-select-dropdown__item:hover { + background-color: #072247 !important; + color: #08B7B8 !important; + } + + .el-select-dropdown__item.selected { + color: #08B7B8 !important; + } + + .el-select-dropdown__list { + .el-select-dropdown__item:first-child { + color: #FFFFFF; + + &:hover { + color: #08B7B8 !important; + } } } } @@ -542,8 +572,8 @@ input[type="number"] { width: 40px !important; height: 40px !important; border-radius: 25px !important; - border: 4px solid #05FEFF!important; - background-color: transparent!important; + border: 4px solid #05FEFF !important; + background-color: transparent !important; } .el-checkbox__input.is-checked .el-checkbox__inner { @@ -559,11 +589,11 @@ input[type="number"] { //border-top: 0; border-radius: 25px; top: 6px; - left:6px; + left: 6px; //left: 12px; font-size: 30px; background: #05FEFF; - border-color: transparent!important; + border-color: transparent !important; } //取消 确定按钮 @@ -599,11 +629,13 @@ input[type="number"] { font-size: 38px; } } -.el-pagination.is-background .btn-prev:disabled{ - background-color: transparent!important; - color: #60DDDE!important; + +.el-pagination.is-background .btn-prev:disabled { + background-color: transparent !important; + color: #60DDDE !important; } -.el-pagination.is-background .btn-next:disabled{ - background-color: transparent!important; - color: #60DDDE!important; + +.el-pagination.is-background .btn-next:disabled { + background-color: transparent !important; + color: #60DDDE !important; } diff --git a/src/router/index.js b/src/router/index.js index a83d828..1a9f2fd 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -51,7 +51,7 @@ const routes = [ } }, { - path: '/user', + path: '/user/:siteId(\\d+)', name: 'user', component: () => import('@/views/user/index.vue'), meta: { diff --git a/src/views/tunnel/index.vue b/src/views/tunnel/index.vue index 08d166b..3811102 100644 --- a/src/views/tunnel/index.vue +++ b/src/views/tunnel/index.vue @@ -85,6 +85,7 @@ const selectIndex = ref(-1); const showFan = ref(false); const drawerLeft = ref(true); const drawerRight = ref(true); +const currentSiteId = ref(0); const currentSite = ref(""); const siteList = ref([]) const currentUser = ref(""); @@ -123,6 +124,7 @@ const getOtherInfo = () => { getLargeScreenInfo().then((res) => { if (res?.code === 1000) { routeList.value = res.data.routeList + currentSiteId.value = res.data.siteOption[0].value currentSite.value = res.data.siteOption[0].label siteList.value = res.data.siteOption tunnelId.value = res.data.tunnelOption[0].value @@ -165,13 +167,12 @@ const manageSelect = (index) => { if (index === 0) { router.push("/site"); } else if (index === 1) { - router.push("/tunnel/1"); + router.push("/tunnel/"+tunnelId.value); } else if (index === 2) { - router.push("/user"); + router.push("/user/"+currentSiteId.value); } }; const handleCommand = (item) => { - console.log('commads', item) currentSite.value = item.label getTunnel(item.value) } diff --git a/src/views/user/index.vue b/src/views/user/index.vue index 78e78d8..c807caa 100644 --- a/src/views/user/index.vue +++ b/src/views/user/index.vue @@ -7,10 +7,10 @@
-
- 全选 -
-
+ + + +
删除
@@ -22,26 +22,29 @@
- 搜索 + 搜索
用户管理
-
添加用户
+
添加用户
- - - - + + + + -