From 7332b154f5c0aec3fa6b485eec17518755b70836 Mon Sep 17 00:00:00 2001 From: maochaoying <925670706@qq.com> Date: Mon, 14 Aug 2023 21:42:45 +0800 Subject: [PATCH] some interface --- src/components/Operator.vue | 4 +- src/components/Progress.vue | 6 ++- src/components/Setting/components/User.vue | 29 ++++++++++---- src/components/Setting/index.vue | 7 ++++ src/mock/command.js | 14 ++----- src/pages/Home.vue | 40 +++++++++++++++++++- src/socket/index.js | 1 + src/store/index.js | 2 + src/store/modules/setting.js | 5 +++ src/store/modules/user.js | 26 +++++++++++++ src/store/modules/websocket.js | 61 +++++++++++++++++++++--------- vite.config.js | 4 ++ 12 files changed, 161 insertions(+), 38 deletions(-) create mode 100644 src/store/modules/user.js diff --git a/src/components/Operator.vue b/src/components/Operator.vue index 7709788..b1fbe91 100644 --- a/src/components/Operator.vue +++ b/src/components/Operator.vue @@ -109,7 +109,9 @@ const startDisinfect = () => { if (roomSize.value == 0) { showFailToast('请调整房间大小设置，不能为0') } else { - webSocketStore.sendCommandMsg(startDisinfectionJSON) + webSocketStore.sendCommandMsg( + startDisinfectionJSON(logVal.value, roomSize.value), + ) operatorStore.updateDisinfectStatus(true) props.changeShowOperator(false) } diff --git a/src/components/Progress.vue b/src/components/Progress.vue index 5939119..c0b1ea8 100644 --- a/src/components/Progress.vue +++ b/src/components/Progress.vue @@ -49,8 +49,11 @@ diff --git a/src/mock/command.js b/src/mock/command.js index d5a41ca..b3aaf8c 100644 --- a/src/mock/command.js +++ b/src/mock/command.js @@ -1,9 +1,3 @@ -export const startDisinfectionJSON = { - command: '1231', - roomSize: 12, - log: 6, -} - // 登陆 export const loginJSON = (userid, passwd) => { return { @@ -38,7 +32,7 @@ export const shutdownJSON = { } // 开始消毒 -export const startDisinfection = (loglevel, roomVolume) => { +export const startDisinfectionJSON = (loglevel, roomVolume) => { return { command: 'startDisinfection', messageId: 'startDisinfection', @@ -48,18 +42,18 @@ export const startDisinfection = (loglevel, roomVolume) => { } // 停止消毒 -export const stopDisinfection = { +export const stopDisinfectionJSON = { command: 'stopDisinfection', messageId: 'stopDisinfection', } // 获取当前设备的状态信息 -export const getState = { +export const getStateJSON = { command: 'getState', messageId: 'getState', } -export const getAllUser = { +export const getAllUserJSON = { command: 'getAllUser', messageId: 'getAllUser', } diff --git a/src/pages/Home.vue b/src/pages/Home.vue index 6c76326..364d55c 100644 --- a/src/pages/Home.vue +++ b/src/pages/Home.vue @@ -163,6 +163,14 @@ + +
+
+ +

初始化系统参数...

+
+
+ @@ -175,12 +183,13 @@ import LiquidHandle from 'cpns/LiquidHandle' import Setting from 'cpns/Setting' import Test from 'cpns/Test' import { storeToRefs } from 'pinia' -import { useOperatorStore, useWebSocketStore } from '@/store' -import { logoutJSON } from '@/mock/command' +import { useOperatorStore, useWebSocketStore, useSettingStore } from '@/store' +import { logoutJSON, getStateJSON } from '@/mock/command' import { useRouter } from 'vue-router' const router = useRouter() const webSocketStore = useWebSocketStore() +const settingStore = useSettingStore() const { socketCommandInstance } = storeToRefs(webSocketStore) webSocketStore.initCommandSocket() webSocketStore.initEventSocket() @@ -209,6 +218,9 @@ onMounted(() => { timer.value = setInterval(() => { getdateTime() }, 1000) + setTimeout(() => { + webSocketStore.sendCommandMsg(getStateJSON) + }, 2000) }) onBeforeUnmount(() => { @@ -295,4 +307,28 @@ const handleLogout = () => { position: absolute; } } +.wrapper { + display: flex; + align-items: center; + justify-content: center; + height: 100%; +} +.block { + width: 220px; + height: 220px; + display: flex; + flex-direction: column; + padding: 16px; + align-items: center; + justify-content: center; + .shutdown_text { + margin-top: 24px; + font-family: Source Han Sans CN; + font-size: 16px; + font-weight: normal; + line-height: normal; + letter-spacing: 0.06em; + color: #fff; + } +} diff --git a/src/socket/index.js b/src/socket/index.js index 011502c..6362294 100644 --- a/src/socket/index.js +++ b/src/socket/index.js @@ -39,6 +39,7 @@ export default class Socket { if (param === 'heartbeat') { this.ws.send(param) } else { + console.log(param) this.ws.send(JSON.stringify(param)) } } diff --git a/src/store/index.js b/src/store/index.js index 0ce8dfd..cd09b7c 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -4,6 +4,7 @@ import { useSettingStore } from './modules/setting' import { useOperatorStore } from './modules/operator' import { useWebSocketStore } from './modules/websocket' import { useDeviceStore } from './modules/device' +import { useUserStore } from './modules/user' const store = createPinia() export default store @@ -13,4 +14,5 @@ export { useOperatorStore, useWebSocketStore, useDeviceStore, + useUserStore, } diff --git a/src/store/modules/setting.js b/src/store/modules/setting.js index c7bbd04..eb01d21 100644 --- a/src/store/modules/setting.js +++ b/src/store/modules/setting.js @@ -12,10 +12,15 @@ export const useSettingStore = defineStore({ addLiquidConfigVal: 0, // 设置喷液泵的参数 sprayLiquidConfigVal: 0, + // 首屏初始化 + initLoading: true, } }, // actions actions: { + updateInitLoading() { + this.initLoading = false + }, updateCurrentDate(currentDate) { this.currentDate = currentDate }, diff --git a/src/store/modules/user.js b/src/store/modules/user.js new file mode 100644 index 0000000..0707028 --- /dev/null +++ b/src/store/modules/user.js @@ -0,0 +1,26 @@ +import { defineStore } from 'pinia' +export const useUserStore = defineStore({ + id: 'user', // id必填，且需要唯一 + // state + state: () => { + return { + allUserList: [], + operUser: '', + } + }, + // actions + actions: { + updateOperUser(operUser) { + this.operUser = operUser + }, + updateUserList(userList) { + this.allUserList = userList + }, + }, + getters: { + userList: state => { + const arr = state.allUserList.filter(item => item.permission_level == 3) + return arr + }, + }, +}) diff --git a/src/store/modules/websocket.js b/src/store/modules/websocket.js index f07b76a..011de7a 100644 --- a/src/store/modules/websocket.js +++ b/src/store/modules/websocket.js @@ -1,5 +1,8 @@ import { defineStore } from 'pinia' import Socket from '@/socket' +import { useSettingStore } from './setting' +import { useUserStore } from './user' + export const useWebSocketStore = defineStore({ id: 'websocket', // id必填，且需要唯一 // state @@ -14,17 +17,38 @@ export const useWebSocketStore = defineStore({ // actions actions: { initCommandSocket() { - const url = 'ws://192.168.1.100:19001/' + const url = 'ws://192.168.8.115:19001/' const init = new Socket(url) + const settingStore = useSettingStore() + const userStore = useUserStore() init.connect() init.ws.onmessage = function (ev) { - console.log(ev) - // switch (data.type) { - // case 1: - // break - // case 2: - // break - // } + console.log(JSON.parse(ev.data)) + const { ackcode, messageId } = JSON.parse(ev.data) + + if (ackcode == 0) { + switch (messageId) { + case 'getState': + // 初始化完毕 + settingStore.updateInitLoading() + // 将sensor_data中的数据更新到store中 + break + case 'getAllUser': + const { dbval } = JSON.parse(ev.data) + userStore.updateUserList(dbval) + break + case 'chpasswd': + // const { dbval } = JSON.parse(ev.data) + // userStore.updateUserList(dbval) + break + case 'startDisinfection': + break + case 'stopDisinfection': + break + default: + break + } + } } this.socketCommandInstance = init }, @@ -32,17 +56,20 @@ export const useWebSocketStore = defineStore({ this.socketCommandInstance?.msg(message) }, initEventSocket() { - const url = 'ws://192.168.1.100:19002/' + const url = 'ws://192.168.8.115:19002/' const init = new Socket(url) init.connect() - init.ws.onmessage = function (ev) { - console.log(ev) - // switch (data.type) { - // case 1: - // break - // case 2: - // break - // } + init.ws.onmessage = function (data) { + // console.log(data) + const { command } = data + switch (command) { + case 'RealtimeSensorDataReport': + const { sensor_data } = data || {} + // 将sensor_data中的数据更新到store中 + break + default: + break + } } this.socketEventInstance = init }, diff --git a/vite.config.js b/vite.config.js index 77287b2..d2ed1ac 100644 --- a/vite.config.js +++ b/vite.config.js @@ -12,6 +12,10 @@ export default defineConfig({ extensions: ['.js', '.json', '.vue'], }, plugins: [vue()], + server: { + host: '0.0.0.0', + port: 5173, + }, //配置sass css: { preprocessorOptions: {