From 1b20ab505d771e8d2168ddb8154da5d6aa85919a Mon Sep 17 00:00:00 2001
From: baoshiwei <baoshiwei@shlanbao.cn>
Date: 星期一, 11 十二月 2023 10:11:21 +0800
Subject: [PATCH] 远控增加密码
---
src/views/dashboard/control/index.vue | 132 +++++++++++++++++++++++++++++++++-----------
1 files changed, 99 insertions(+), 33 deletions(-)
diff --git a/src/views/dashboard/control/index.vue b/src/views/dashboard/control/index.vue
index e9d321d..f376325 100644
--- a/src/views/dashboard/control/index.vue
+++ b/src/views/dashboard/control/index.vue
@@ -1,14 +1,22 @@
<template>
- <a-modal v-model:visible="visible" centered :mask="false" :closable="false" :cancelText="null" title="璀﹀憡"
- @ok="hideModal">
+ <a-modal v-model:visible="visible" centered :mask="true" :maskClosable="false" :keyboard="false" :closable="false" :cancelText="null" title="璀﹀憡"
+ @ok="hideModal" @cancel="cnacelModal" >
<a-card>
<div class="indented-text">鍦ㄤ娇鐢ㄨ繙绋嬫帶鍒惰澶囧墠锛岃纭繚鏈哄櫒鍛ㄥ洿娌℃湁鍏朵粬浜哄憳銆傚缓绔嬩竴涓畨鍏ㄥ尯鍩燂紝纭繚娌℃湁浜鸿兘澶熻繘鍏ヨ鍖哄煙锛岄槻姝笉蹇呰鐨勪激瀹炽��</div>
+ <div style="display: flex; justify-content: space-between; padding-top: 20px; ">
+ <p style="font-weight: bold;" >璇疯緭鍏ュ瘑鐮侊細</p>
+ <p style="color: red">{{ error }}</p>
+ </div>
+ <div >
+ <a-input-password v-model:value="password" placeholder="璇疯緭鍏ュ瘑鐮侊紒"></a-input-password>
+ </div>
</a-card>
</a-modal>
<div class="app">
<a-row>
- <a-card title="鐓ф槑" style="width: 60%">
+ <div style="width: 60%">
+ <a-card title="鐓ф槑" >
<div class="light-box">
<div v-for="item in lightList" :key="item.identifier" class="center">
<!-- <a-button v-if="item.type == 0" type="primary" class="com-btn"
@@ -27,7 +35,9 @@
</div>
</a-card>
- <a-card title="鐩戞帶" style="width: 35%; margin-left: 10px;">
+ </div>
+ <div style="width: 40%">
+ <a-card title="鐩戞帶" style=" margin-left: 10px;">
<div class="monitor-box">
<div v-for="item in lightList" :key="item.identifier" class="center" >
<div v-if="item.type==1" @click="deviceClick(item)">
@@ -40,19 +50,20 @@
</div>
</div>
</a-card>
-
+</div>
</a-row>
-
- <a-card title="鎸囦护" style="margin-top: 10px">
+ <a-row>
+ <div style="width: 50%">
+<a-card title="鎸囦护" style="margin-top: 10px; ">
<div class="com-box">
<!-- <a-button v-for="item in comList" :key="item.id" type="primary" class="com-btn"
@click="comClick(item)">
{{ item.title }}
</a-button> -->
- <div style="width: 500px;">
+ <div style="width: 500px;" >
<a-row class="button-row">
- <a-button type="primary" @click="clickButton(1010, '骞茬嚗鍚姩')" class="com-btn">
+ <a-button type="primary" :disabled="btnDisabled" @click="clickButton(1010, '骞茬嚗鍚姩')" class="com-btn">
<div> <PlayCircleOutlined style="font-size: 20px;" /> </div>
<div> 骞茬嚗鍚姩 </div>
@@ -62,33 +73,33 @@
<div> 鍚庨棬寮�鍏� </div>
</a-button> -->
- <a-button type="default" @click="clickButton(1003,'婊氱瓛鍗�')" class="com-btn w300">
+ <a-button type="default" :disabled="btnDisabled" @click="clickButton(1003,'婊氱瓛鍗�')" class="com-btn w300">
<div> <UpCircleOutlined style="font-size: 20px;" /> </div>
<div> 婊氱瓛鍗� </div>
</a-button>
- <a-button type="info" @click="clickButton(1014, '寮�闂ㄨ瀵�')" class="com-btn">
- <div> <SettingOutlined style="font-size: 20px;" /> </div>
- <div> 寮�闂ㄨ瀵� </div>
+ <a-button type="normal" :disabled="btnDisabled" @click="clickButton(1016,'娓呴櫎')" class="com-btn">
+ <div> <ClearOutlined style="font-size: 20px;" /> </div>
+ <div> 娓呴櫎 </div>
</a-button>
</a-row>
<a-row class="button-row">
- <a-button type="normal" @click="clickButton(1005,'婊氱瓛姝ｈ浆')" class="com-btn h100">
+ <a-button type="normal" :disabled="btnDisabled" @click="clickButton(1005,'婊氱瓛姝ｈ浆')" class="com-btn h100">
<div> <RedoOutlined style="font-size: 20px;" /> </div>
<div> 婊氱瓛姝ｈ浆 </div>
</a-button>
- <a-button type="danger" @click="clickButton(1007,'鍋滄')" class="com-btn h100 w300 " >
+ <a-button type="danger" :disabled="btnDisabled" @click="clickButton(1007,'鍋滄')" class="com-btn h100 w300 " >
<div> <PauseCircleOutlined style="font-size: 20px;" /> </div>
<div> 鍋滄 </div>
</a-button>
- <a-button type="normal" @click="clickButton(1006,'婊氱瓛鍙嶈浆')" class="com-btn h100">
+ <a-button type="normal" :disabled="btnDisabled" @click="clickButton(1006,'婊氱瓛鍙嶈浆')" class="com-btn h100">
<div> <UndoOutlined style="font-size: 20px;" /> </div>
<div> 婊氱瓛鍙嶈浆 </div>
</a-button>
</a-row>
<a-row class="button-row">
- <a-button type="success" @click="clickButton(1015,'鍑烘枡')" class="com-btn">
+ <a-button type="success" :disabled="btnDisabled" @click="clickButton(1015,'鍑烘枡')" class="com-btn">
<div> <DownloadOutlined style="font-size: 20px;" /> </div>
<div> 鍑烘枡 </div>
@@ -97,11 +108,11 @@
<div> <SplitCellsOutlined style="font-size: 20px;" /> </div>
<div> 鍓嶉棬寮�鍏� </div>
</a-button> -->
- <a-button type="normal" @click="clickButton(1004,'婊氱瓛闄�')" class="com-btn w300">
+ <a-button type="normal" :disabled="btnDisabled" @click="clickButton(1004,'婊氱瓛闄�')" class="com-btn w300">
<div> <DownCircleOutlined style="font-size: 20px;" /> </div>
<div> 婊氱瓛闄� </div>
</a-button>
- <a-button type="normal" @click="clickButton(1013,'鐑鍚姩')" class="com-btn">
+ <a-button type="normal" :disabled="btnDisabled" @click="clickButton(1013,'鐑鍚姩')" class="com-btn">
<div> <FireOutlined style="font-size: 20px;" /> </div>
<div> 鐑鍚姩 </div>
@@ -109,26 +120,45 @@
</a-row>
</div>
- <div style="margin-left: 100px;">
- <div>
- <a-button type="warning" @click="clickButton(1017,'鎵嬪姩/鑷姩')" class="com-btn">
+
+
+ </div>
+ </a-card>
+ </div>
+ <div style="width: 50%">
+ <a-card title="鐘舵��" style="margin-left: 10px;margin-top:10px">
+ <div class="com-box">
+ <div>
+ <div>
+ <a-button type="warning" :disabled="btnDisabled" @click="clickButton(1017,'鎵嬪姩/鑷姩')" class="com-btn">
<div> <SyncOutlined style="font-size: 20px;" /> </div>
<div> 鎵嬪姩/鑷姩 </div>
</a-button>
+
</div>
<div>
- <a-button type="normal" @click="clickButton(1016,'娓呴櫎')" class="com-btn">
- <div> <ClearOutlined style="font-size: 20px;" /> </div>
- <div> 娓呴櫎 </div>
+ <a-button type="info" :disabled="btnDisabled" @click="clickButton(1014, '寮�闂ㄨ瀵�')" class="com-btn">
+ <div> <SettingOutlined style="font-size: 20px;" /> </div>
+ <div> 寮�闂ㄨ瀵� </div>
+
+ </a-button>
+
+ </div>
+ <div>
+ <a-button type="normal" @click="lock()" class="com-btn">
+ <div> <Icon :icon="lockIcon" :size="28" /> </div>
+ <div> {{lockText}} </div>
</a-button>
</div>
- </div>
-
</div>
+ </div>
</a-card>
- <a-card title="鎺у埗鍙�" style="margin-top: 10px">
+ </div>
+ </a-row>
+
+ <a-card title="鎺у埗鍙�" style="margin-top: 10px; ">
<div class="log-box">
<p v-for="log in logList" :key="log"> {{ log }}</p>
</div>
@@ -144,8 +174,11 @@
import { connectWebSocket, onWebSocket } from '/@/hooks/web/useWebSocket';
import { useUserStore } from '/@/store/modules/user';
import { RedoOutlined ,SettingOutlined, UndoOutlined,FireOutlined, SplitCellsOutlined, DownloadOutlined, PauseCircleOutlined,ClearOutlined, SyncOutlined,PlayCircleOutlined, SwapOutlined , UpCircleOutlined, DownCircleOutlined, LeftCircleOutlined, RightCircleOutlined} from '@ant-design/icons-vue';
-
-
+import { router } from '/@/router'
+const error = ref('')
+const lockIcon = ref('tdesign:lock-off')
+const lockText = ref('瑙ｉ攣')
+const password = ref()
const visible = ref<boolean>(false);
const glob = useGlobSetting();
interface Commant {
@@ -213,9 +246,19 @@
icon: "caret-right-outlined"
}]);
-
+const btnDisabled = ref(true)
const lightList = ref<Device[]>([]);
const monitorList = ref<Device[]>([]);
+
+function lock() {
+ btnDisabled.value = !btnDisabled.value
+ lockIcon.value = btnDisabled.value?'tdesign:lock-off':'tdesign:lock-on'
+ lockText.value = btnDisabled.value?'瑙ｉ攣': '閿佸畾'
+ if (btnDisabled.value) {
+ showModal()
+ }
+}
+
function comClick(item) {
addLog("鍙戦��", item.title);
//鍙戦�佹寚浠�
@@ -257,8 +300,23 @@
visible.value = true;
};
+const cnacelModal = () => {
+ router.back()
+}
+
const hideModal = () => {
- visible.value = false;
+ if(!password.value || password.value.length<=0) {
+ error.value="璇疯緭鍏ュ瘑鐮侊紒"
+ }else
+ if(password.value === 'LBit@123') {
+ visible.value = false;
+ password.value = ''
+ error.value = ''
+ } else {
+ error.value = '瀵嗙爜閿欒锛�'
+ }
+
+
};
/**
@@ -330,9 +388,17 @@
})
}
+ function keydown(e) {
+ error.value = ''
+ if(e.keyCode == 13) {
+ hideModal()
+ }
+ }
+
onMounted(() => {
showModal();
initWebSocket();
+ window.addEventListener('keydown', keydown)
});
queryDevice()
@@ -349,7 +415,7 @@
// margin-left: 200px;
display: flex;
-
+ justify-content: center;
.com-btn {
border-radius: 5px;
--
Gitblit v1.9.3