From 9229eb2151660ba7e59879f3b9ac2b14d72a9530 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期一, 28 六月 2021 18:49:01 +0800
Subject: [PATCH] 应用中心图标修改
---
src/pages/ai/index/App.vue | 6
src/api/system.ts | 18 +
src/pages/settings/components/BasicSetting.vue | 1
src/pages/systemSettings/views/keyboardLanguage.vue | 100 +++++++--
src/pages/systemSettings/views/generalSettings.vue | 254 +++++++++++++++++++------
src/pages/systemSettings/views/NetSettings.vue | 185 ++++++++++-------
6 files changed, 395 insertions(+), 169 deletions(-)
diff --git a/src/api/system.ts b/src/api/system.ts
index 42866e0..bf9b0c6 100644
--- a/src/api/system.ts
+++ b/src/api/system.ts
@@ -150,6 +150,16 @@
data: query
});
};
+
+
+export const setKeyboardLayout = (query: any) => {
+ return request({
+ url: "/data/api-v/sysset/setKeyboardLayout",
+ method: "post",
+ data: qs.stringify(query)
+ });
+};
+
export const setNetWorkCard = (query: any) => {
return request({
url: "/data/api-v/sysset/setNetWorkCard",
@@ -181,6 +191,14 @@
data: query
});
};
+export const getCurKeyboardLayout = (query: any) => {
+ return request({
+ url: "/data/api-v/sysset/getDefKeyboardLayout",
+ method: "get",
+ data: query
+ });
+};
+
export const setLang = (query: any) => {
return request({
url: "/data/api-v/sysset/setLang",
diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue
index 29fccaf..e8463a3 100644
--- a/src/pages/ai/index/App.vue
+++ b/src/pages/ai/index/App.vue
@@ -134,11 +134,11 @@
</div>
<div class="alg-name">
<div style="padding: 0px 10px 0px 10px">
- <!-- <span class="list-choose-item-left-uninstal">
+ <span class="list-choose-item-left-uninstal">
{{
item.sdk_name
}}
- </span> -->
+ </span>
</div>
</div>
</div>
@@ -2545,7 +2545,7 @@
filter: grayscale(100%);
}
.alg-name {
- color: #ffffff;
+ color: grey;
}
}
}
diff --git a/src/pages/settings/components/BasicSetting.vue b/src/pages/settings/components/BasicSetting.vue
index 604374d..f36761c 100644
--- a/src/pages/settings/components/BasicSetting.vue
+++ b/src/pages/settings/components/BasicSetting.vue
@@ -71,7 +71,6 @@
</el-menu-item-group>
</el-submenu>
- <!-- 璇︾粏淇℃伅 -->
<el-submenu index="1">
<template slot="title">
<b class="tree-font">璇︾粏淇℃伅</b>
diff --git a/src/pages/systemSettings/views/NetSettings.vue b/src/pages/systemSettings/views/NetSettings.vue
index c82ce15..600cf6e 100644
--- a/src/pages/systemSettings/views/NetSettings.vue
+++ b/src/pages/systemSettings/views/NetSettings.vue
@@ -2,21 +2,19 @@
<div class="all">
<div class="cluster-content">
<div class="cluster-center" ref="left">
- <div class="menu-item" @click="openRight('net')">
- <div><span class="icon iconfont"></span>缃戠粶璁剧疆</div>
- <div class="status">宸茶繛鎺�</div>
- </div>
- <div class="menu-item" @click="openRight('wifi')">
- <div><span class="icon iconfont"></span>鏃犵嚎缃戠粶</div>
- <div class="status">宸茶繛鎺�</div>
- </div>
- <div class="menu-item" @click="openRight('wire')">
- <div><span class="icon iconfont"></span>鏈夌嚎缃戠粶</div>
+ <div
+ class="menu-item"
+ v-for="(item, i) in tabList"
+ :key="i"
+ @click="openRight(item, i)"
+ ref="leftbar"
+ >
+ <div><span class="icon iconfont"></span>{{ item.name }}</div>
<div class="status">宸茶繛鎺�</div>
</div>
</div>
<div class="cluster-right">
- <div class="net-set" v-if="activePage == 'net'">
+ <div class="net-set" v-if="activePage == '缃戠粶璁剧疆'">
<div class="title">缃戠粶璁剧疆</div>
<el-form
:model="ruleForm"
@@ -24,7 +22,6 @@
ref="joinForm"
class="join-form"
label-width="150px"
- v-loading="joinLoading"
>
<el-form-item label="璁惧鍚嶇О" prop="deviceName">
<el-input
@@ -41,11 +38,11 @@
size="small"
></el-input>
</el-form-item>
- <div class="save-btn" @click="saveServerName">淇濆瓨</div>
</el-form>
+ <div class="save-btn" @click="saveServerName">淇濆瓨</div>
</div>
- <div class="wifi" v-if="activePage == 'wifi' && !inWifiDetail">
+ <div class="wifi" v-if="activePage == '鏃犵嚎缃戠粶' && !inWifiDetail">
<switchBar
:barName="`鏃犵嚎缃戝崱`"
@switchChange="wifiControl"
@@ -60,16 +57,19 @@
<div class="more-detail">
<span class="icon iconfont"></span>
- <span
+ <span
class="icon iconfont"
- style="margin-left: 10px"
+ style="margin-left:10px;cursor:pointer;"
@click="checkWifi(item)"
></span
>
</div>
</div>
</div>
- <div class="wifi-detail" v-if="activePage == 'wifi' && inWifiDetail">
+ <div
+ class="wifi-detail"
+ v-if="activePage == '鏃犵嚎缃戠粶' && inWifiDetail"
+ >
<div class="btns">
<div class="left">鍒犻櫎</div>
<div class="right">鏂紑杩炴帴</div>
@@ -84,7 +84,6 @@
class="join-form"
label-width="150px"
>
- <!-- v-loading="joinLoading" -->
<el-form-item label="鍚嶇О" prop="name">
<div class="wifi-name">{{ 12123 }}</div>
</el-form-item>
@@ -105,23 +104,6 @@
:value="isHighClass"
></switchBar>
<div class="title">IPV4</div>
-
- <!-- <el-form
- :model="ipv4Form"
- :rules="ipv4FormRules"
- ref="ipv4Form"
- class="join-form"
- label-width="150px"
- >
- <el-form-item label="瀵嗙爜" prop="password">
- <el-input
- v-model="wifiForm.password"
- placeholder="璇疯緭鍏ュ瘑鐮�"
- size="small"
- show-password
- ></el-input>
- </el-form-item>
- </el-form> -->
<el-form
:model="ipv4Form"
@@ -233,14 +215,13 @@
</el-form>
<div class="btns">
- <div class="left">鍙栨秷</div>
+ <div class="left" @click="inWifiDetail = false">鍙栨秷</div>
<div class="right">淇濆瓨</div>
</div>
</div>
- <div class="wire" v-if="activePage == 'wire' && !inWireDetail">
+ <div class="wire" v-if="activePage == '鏈夌嚎缃戠粶' && !inWireDetail">
<div
-
class="wire-bar"
v-for="(item, i) in wireArr"
:key="i"
@@ -260,7 +241,10 @@
</div>
</div>
</div>
- <div class="wire-detail" v-if="activePage == 'wire' && inWireDetail">
+ <div
+ class="wire-detail"
+ v-if="activePage == '鏈夌嚎缃戠粶' && inWireDetail"
+ >
<div class="title">缃戠粶璁剧疆</div>
<el-form
:model="wireForm"
@@ -269,7 +253,7 @@
label-width="150px"
>
<el-form-item label="缃戠粶鍚嶇О" prop="name">
- <div class="wifi-name">{{"缃戠粶" + activeWireItem.index }}</div>
+ <div class="wifi-name">{{ "缃戠粶" + activeWireItem.index }}</div>
</el-form-item>
<el-form-item label="缃戝崱" prop="ifname">
<div class="wifi-name">{{ activeWireItem.name }}</div>
@@ -328,7 +312,13 @@
addESNode,
getEsClusterInfo,
} from "@/api/clusterManage";
-import { setServerName, getWireList, setNetWorkCard,getNetWorkCardInfo } from "@/api/system";
+import {
+ setServerName,
+ getWireList,
+ setNetWorkCard,
+ getNetWorkCardInfo,
+ getDevInfo,
+} from "@/api/system";
import cloudNode from "../components/CloudNode";
import ipInput from "@/components/subComponents/IPInput";
@@ -366,13 +356,13 @@
isOpenWifi: false,
inWireDetail: false,
wireForm: {
- dns:"",
- subMask:"",
- gateway:"",
- ip:"",
+ dns: "",
+ subMask: "",
+ gateway: "",
+ ip: "",
},
wireFormRules: {},
- activePage: "net",
+ activePage: "缃戠粶璁剧疆",
activeWireItem: {},
rules: {
deviceName: [
@@ -382,6 +372,11 @@
ipv4Form: {},
ipv6Form: {},
ipv4FormRules: {},
+ tabList: [
+ { name: "缃戠粶璁剧疆" },
+ { name: "鏃犵嚎缃戠粶" },
+ { name: "鏈夌嚎缃戠粶" },
+ ],
ipv6FormRules: {},
options: [
{
@@ -401,20 +396,32 @@
ipInput,
switchBar,
},
- mounted() {},
+ mounted() {
+ this.getCurServer();
+ this.fetchWireList();
+ },
beforeDestroy() {},
props: ["barName"],
methods: {
+ getCurServer() {
+ getDevInfo().then((res) => {
+ this.ruleForm.deviceName = res.data.server_name;
+ this.ruleForm.port = res.data.server_port;
+ });
+ },
fetchWireList() {
getWireList().then((res) => {
if (res && res.success) {
- console.log(res);
this.wireArr = res.data;
}
});
},
cancelSaveWire() {
this.inWireDetail = false;
+ this.wireForm.ip = '';
+ this.wireForm.gateway = '';
+ this.wireForm.dns = '';
+ this.wireForm.subMask = '';
},
saveServerName() {
setServerName({
@@ -427,28 +434,37 @@
}
});
},
- openRight(typ) {
- this.activePage = typ;
- if (typ == "wire") {
- this.fetchWireList();
+ openRight(item, i) {
+ this.activePage = item.name;
+ if (i == 1) {
+ this.inWifiDetail = false;
}
+ this.$refs["leftbar"].forEach((x) => {
+ x.style.backgroundColor = "rgba(248, 248, 248, 1)";
+ x.style.color = "#333";
+ });
+ this.$refs["leftbar"][i].style.backgroundColor = "rgb(61, 104, 225)";
+ this.$refs["leftbar"][i].style.color = "white";
},
saveWire(ifname) {
- debugger
- let data ={
+ debugger;
+ let data = {
ip: this.wireForm.ip,
gateway: this.wireForm.gateway,
dns: this.wireForm.dns,
subMask: this.wireForm.subMask,
ifname: this.activeWireItem.name,
- }
- setNetWorkCard(data).then((res) => {
- if (res&&res.success) {
- this.$message.success(res.data)
+ };
+ setNetWorkCard(data).then(
+ (res) => {
+ if (res && res.success) {
+ this.$message.success(res.data);
+ }
+ },
+ (err) => {
+ this.$message.error("淇濆瓨澶辫触锛�" + err.msg);
}
- },(err) => {
- this.$message.error("淇濆瓨澶辫触锛�"+ err.msg)
- });
+ );
},
wifiControl(val) {},
checkWifi() {
@@ -458,16 +474,17 @@
this.inWireDetail = true;
this.activeWireItem = item;
getNetWorkCardInfo({
- ifname:item.name
+ ifname: item.name,
}).then((res) => {
- if (res&&res.success) {
- debugger
- this.wireForm.ip = res.data.ip
- this.wireForm.gateway = res.data.gateway
- this.wireForm.dns = res.data.dns
- this.wireForm.subMask = res.data.subMask
+ if (res && res.success) {
+ this.wireForm.ip = res.data.ip;
+ this.wireForm.gateway = res.data.gateway;
+ this.wireForm.dns = res.data.dns;
+ this.wireForm.subMask = res.data.subMask;
}
- })
+ },(err) => {
+ this.$message.error("鏌ユ壘涓嶅埌鏁版嵁: "+err.msg)
+ });
},
},
};
@@ -497,7 +514,21 @@
}
}
}
-
+.net-set {
+ .title {
+ font-size: 16px;
+ margin-bottom: 12px;
+ }
+ .el-input--small .el-input__inner {
+ height: 35px;
+ line-height: 35px;
+ background-color: rgba(240, 240, 240, 1);
+ border: none;
+ }
+ .el-input__inner::placeholder {
+ color: rgba(134, 134, 134, 1);
+ }
+}
.cluster-content {
height: 100%;
display: flex;
@@ -514,7 +545,6 @@
padding: 10px;
border-right: 5px solid #f8f8f8;
- // background-color: lavender;
.menu-item {
background-color: #f8f8f8;
height: 40px;
@@ -549,9 +579,9 @@
}
.el-form-item {
margin-bottom: 10px;
- height: 50px;
+ height: 54px;
+ padding: 6px 20px;
background: #f8f8f8;
- padding: 4px 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: 10px;
@@ -563,7 +593,7 @@
.el-form-item__content {
line-height: 40px;
position: relative;
- font-size: 14px;
+ font-size: 15px;
}
.ip-input-container {
max-width: none !important;
@@ -620,12 +650,13 @@
.wire {
.wire-bar {
height: 50px;
- background-color: aliceblue;
+ background-color: #f8f8f8;
display: flex;
justify-content: space-between;
+ align-items: center;
box-sizing: border-box;
padding: 0 20px;
- align-items: center;
+ margin-bottom: 10px;
}
.wifi-name {
height: 40px;
@@ -644,7 +675,7 @@
color: #fff;
line-height: 40px;
font-size: 14px;
- margin-top: 20px;
+ margin-top: 30px;
}
}
}
diff --git a/src/pages/systemSettings/views/generalSettings.vue b/src/pages/systemSettings/views/generalSettings.vue
index b584c9d..f2c3a69 100644
--- a/src/pages/systemSettings/views/generalSettings.vue
+++ b/src/pages/systemSettings/views/generalSettings.vue
@@ -11,12 +11,51 @@
<div class="menu-item" @click="openRight('sound')">
<div>浜嬩欢澹伴煶</div>
</div>
+ <div class="menu-item" @click="openRight('personalise')">
+ <div>涓�у寲璁剧疆</div>
+ </div>
</div>
<div class="cluster-right">
<div class="lang" v-if="activePage == 'basic'">
- <div class="bar" v-for="(item, i) in basioInfoList" :key="i">
- <span class="name">{{ item.name }}</span>
- <span class="desc">{{ item.desc }}</span>
+ <div class="bar">
+ <span class="name">璁惧ID</span>
+ <span class="desc">{{ deviceInfo.server_id }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">璁惧鍨嬪彿</span>
+ <span class="desc">{{ deviceInfo.deviceModel }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">璁惧绫诲瀷</span>
+ <span class="desc">{{ deviceInfo.deviceDesc }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">閫氶亾涓暟</span>
+ <span class="desc">{{ deviceInfo.channelCount }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">涓绘帶鐗堟湰</span>
+ <span class="desc">{{ deviceInfo.masterVersion }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">web鐗堟湰</span>
+ <span class="desc">{{ deviceInfo.webVersion }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">纭洏淇℃伅</span>
+ <span class="desc">{{ deviceInfo.disks }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">CPU</span>
+ <span class="desc">{{ deviceInfo.cpu }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">鍐呭瓨</span>
+ <span class="desc">{{ deviceInfo.memory }}</span>
+ </div>
+ <div class="bar">
+ <span class="name">杩愯鏃堕棿</span>
+ <span class="desc">{{ deviceInfo.runningTime }}</span>
</div>
</div>
<div class="lang" v-if="activePage == 'video'">
@@ -39,7 +78,8 @@
:min="0"
:max="100"
size="mini"
- ></el-input-number> s
+ ></el-input-number
+ > s
</div>
</div>
<div class="min-dur">
@@ -61,7 +101,8 @@
:min="0"
:max="100"
size="mini"
- ></el-input-number> s
+ ></el-input-number
+ > s
</div>
</div>
@@ -82,7 +123,7 @@
</div>
<div class="btns">
<span class="icon iconfont"></span>
- <span class="icon iconfont"></span>
+ <span class="icon iconfont" @click="removeSound(item)"></span>
</div>
</div>
<div class="add-group">
@@ -102,7 +143,44 @@
</el-upload>
<div v-show="!showUpload"></div>
<div class="add-btn">
- <span class="icon iconfont" @click="showUpload = !showUpload"></span>
+ <span class="icon iconfont" @click="showUpload = !showUpload"
+ ></span
+ >
+ </div>
+ </div>
+ </div>
+
+ <div class="lang" v-if="activePage == 'personalise'">
+ <div class="title">鍥炬爣涓婚</div>
+
+ <div class="min-dur" style="cursor:pointer;" @click="selectIcons(0)">
+ <div class="title">鎵佸钩鍐欏疄鍥炬爣</div>
+ <div class="entity">
+ <div
+ class="entity-img"
+ v-for="(item, i) in realIconList"
+ :key="i"
+ ></div>
+ </div>
+ </div>
+ <div class="min-dur" style="cursor:pointer;" @click="selectIcons(1)">
+ <div class="title">鎵佸钩鍖栧浘鏍�</div>
+ <div class="entity">
+ <div
+ class="entity-img"
+ v-for="(item, i) in flatIconList"
+ :key="i"
+ ></div>
+ </div>
+ </div>
+ <div class="title">妗岄潰鑳屾櫙涓婚</div>
+ <div class="min-dur" style="padding-top:25px;">
+ <div class="bg-list">
+ <div
+ class="bg-img"
+ v-for="(item, i) in tableBGList"
+ :key="i"
+ ></div>
</div>
</div>
</div>
@@ -112,8 +190,9 @@
</template>
<script>
-import { saveAlarmConfig } from "@/api/system";
+import { saveAlarmConfig, getDevInfo } from "@/api/system";
import { uploadSound, getSoundList } from "@/api/event";
+import config from "../../../../package.json";
import { isIPv4 } from "@/scripts/validate";
@@ -121,92 +200,111 @@
data() {
return {
isHighClass: false,
-
- ruleForm: {
- deviceName: "",
- port: "",
- },
- wifiForm: {
- name: "",
- password: "",
- },
- wireArr: [{ name: "鏈夌嚎缃戠粶1" }, { name: "鏈夌嚎缃戠粶2" }],
inWifiDetail: false,
- wifiList: [{ name: "鏃犵嚎缃戠粶1" }, { name: "鏃犵嚎缃戠粶2" }],
- isOpenWifi: false,
inWireDetail: false,
- wireForm: {},
showUpload: false,
alarmConf: {
- min_video_len: 0,
- max_video_len: 0,
+ min_video_len: 10,
+ max_video_len: 15,
},
- basioInfoList: [
- { name: "绠�浣撲腑鏂�", desc: "fesF" },
- { name: "鑻辨枃", desc: "fesF" },
- { name: "绻佷綋涓枃锛堥娓級", desc: "fesF" },
- ],
- soundList: [{ name: "2.mp3" }, { name: "3.mp3" }],
-
- wireFormRules: {},
+ soundList: [],
activePage: "basic",
- rules: {
- deviceName: [
- { required: true, message: "璇疯緭鍏ヨ澶囧悕绉�", trigger: "change" },
- ],
+ deviceInfo: {
+ cpu: "",
+ runningTime: "",
+ server_id: "",
+ deviceModel: "",
+ deviceDesc: "",
+ masterVersion: "",
+ channelCount: "",
+ webVersion: "",
+ disks: "",
+ memory: "",
},
- ipv4Form: {},
- ipv6Form: {},
- ipv4FormRules: {},
- ipv6FormRules: {},
- options: [
- {
- value: "閫夐」1",
- label: "鎵嬪姩",
- },
- {
- value: "閫夐」2",
- label: "鑷姩",
- },
- ],
- value: "",
+ realIconList: [{}, {}, {}],
+ flatIconList: [{}, {}, {}],
+ tableBGList: [{}, {}, {}],
};
},
mounted() {
- this.getSounds()
+ this.getDeviceInfo();
+ this.getSounds();
},
- beforeDestroy() { },
+ beforeDestroy() {},
props: ["barName"],
methods: {
+ getDeviceInfo() {
+ getDevInfo().then((res) => {
+ let info = res.data.deviceInfo;
+ let basic = res.data;
+ this.deviceInfo.cpu = info.cpu[0].modelName;
+ this.deviceInfo.runningTime = this.secondsFormat(info.host.uptime);
+ this.deviceInfo.server_id = basic.server_id;
+ this.deviceInfo.deviceModel = basic.deviceModel;
+ this.deviceInfo.deviceDesc = basic.deviceDesc;
+ this.deviceInfo.masterVersion = basic.masterVersion;
+ this.deviceInfo.channelCount = basic.channelCount;
+ this.deviceInfo.webVersion = "V" + config.version;
+ this.deviceInfo.disks = "( " + info.disk + ") ";
+ this.deviceInfo.memory =
+ (info.mem.total / 1024 / 1024 / 1024).toFixed(2) + "GB";
+ this.alarmConf.min_video_len = basic.min_video_len
+ this.alarmConf.max_video_len = basic.max_video_len
+ });
+ },
+
getSounds() {
- getSoundList().then(res => {
- if (res.success) {
- this.soundList = res.data.list
- }
- }).catch(
- e => console.log(e)
- )
+ getSoundList()
+ .then((res) => {
+ if (res.success) {
+ this.soundList = res.data;
+ }
+ })
+ .catch((e) => console.log(e));
+ },
+ secondsFormat(s) {
+ var day = (s / (24 * 3600)) | 0;
+ var hour = ((s - day * 24 * 3600) / 3600) | 0;
+ var minute = ((s - day * 24 * 3600 - hour * 3600) / 60) | 0;
+ var second = s - day * 24 * 3600 - hour * 3600 - minute * 60;
+ return day + "澶� " + hour + "灏忔椂 " + minute + "鍒� " + second + "绉�";
},
uploadSound(params) {
let param = new FormData();
param.append("file", params.file);
uploadSound(param).then((res) => {
console.log(res.data);
+ this.getSounds();
});
},
openRight(typ) {
this.activePage = typ;
- if (typ == "sound") {
- this.getSounds()
- }
+ // if (typ == "sound") {
+ // this.getSounds();
+ // }
},
- wifiControl(val) { },
+ wifiControl(val) {},
checkWifi() {
this.inWifiDetail = true;
},
checkWire(item) {
this.inWireDetail = true;
+ },
+ selectIcons(typ){
+
+ },
+ removeSound(){
+ this.$confirm('鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺０闊�', '鍒犻櫎浜嬩欢澹伴煶', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).then(() => {
+ this.$message({
+ type: 'success',
+ message: '鍒犻櫎鎴愬姛!'
+ });
+ })
},
clickSound(item, i) {
this.$refs["soundBar"].forEach((x) => {
@@ -371,7 +469,7 @@
box-sizing: border-box;
padding: 0 20px;
background-color: rgba(248, 248, 248, 1);
- height: 95px;
+ height: 105px;
margin-bottom: 20px;
border-radius: 15px;
.title {
@@ -383,6 +481,10 @@
padding: 0 6px;
font-size: 14px;
}
+ }
+
+ .min-dur:hover {
+ background-color: rgba(233, 233, 233, 1);
}
.entity {
@@ -449,5 +551,29 @@
margin-top: 20px;
}
}
+
+ .lang {
+ .min-dur {
+ .bg-list {
+ display: flex;
+ .bg-img {
+ background-color: aquamarine;
+ width: 100px;
+ height: 60px;
+ margin-right: 10px;
+ }
+ }
+ .entity {
+ display: flex;
+
+ .entity-img {
+ background-color: aquamarine;
+ width: 50px;
+ height: 50px;
+ margin-right: 10px;
+ }
+ }
+ }
+ }
}
</style>
diff --git a/src/pages/systemSettings/views/keyboardLanguage.vue b/src/pages/systemSettings/views/keyboardLanguage.vue
index 339ba0d..bdcdf56 100644
--- a/src/pages/systemSettings/views/keyboardLanguage.vue
+++ b/src/pages/systemSettings/views/keyboardLanguage.vue
@@ -2,27 +2,42 @@
<div class="all">
<div class="cluster-content">
<div class="cluster-center" ref="left">
- <div class="menu-item" @click="openRight('lang')">
- <div>绯荤粺璇█</div>
- </div>
- <div class="menu-item" @click="openRight('keyboard')">
- <div>閿洏绠＄悊</div>
+ <div
+ class="menu-item"
+ v-for="(item, i) in tabList"
+ :key="i"
+ @click="openRight(item, i)"
+ ref="leftbar"
+ >
+ <div>{{ item.name }}</div>
</div>
</div>
<div class="cluster-right">
- <div class="lang" v-if="activePage == 'lang'">
+ <div class="lang" v-if="activePage == '绯荤粺璇█'">
<div class="title">璇█鍒楄〃</div>
- <div class="bar" v-for="(item, i) in langList" :key="i" @click="pickLang(item, i)">
+ <div
+ class="bar"
+ v-for="(item, i) in langList"
+ :key="i"
+ @click="pickLang(item, i)"
+ >
<span class="name">{{ item.Name }}</span>
- <!-- <span class="icon iconfont" v-show="activeLang==item.Lang"></span> -->
- <span class="icon iconfont" v-show="activeLang == item.Lang">宸查��</span>
+ <span class="icon iconfont" v-show="activeLang == item.Lang"
+ >宸查��</span
+ >
</div>
</div>
- <div class="lang" v-if="activePage == 'keyboard'">
+ <div class="lang" v-if="activePage == '閿洏绠＄悊'">
<div class="title">閿洏甯冨眬</div>
- <div class="bar" v-for="(item, i) in keyboardList" :key="i">
+ <div
+ class="bar"
+ v-for="(item, i) in keyboardList"
+ :key="i"
+ @click="pickKb(item, i)"
+ >
<span class="name">{{ item.name }}</span>
- <span class="icon iconfont"></span>
+ <span class="icon iconfont" v-show="activeKb == item.id">宸查��</span>
+ <!-- <span class="icon iconfont"></span> -->
</div>
</div>
</div>
@@ -48,18 +63,27 @@
getEsClusterInfo,
} from "@/api/clusterManage";
-import { getLangs, setLang, getLang, getKeyboardLayouts } from "@/api/system";
+import {
+ getLangs,
+ setLang,
+ getLang,
+ getKeyboardLayouts,
+ getCurKeyboardLayout,
+ setKeyboardLayout,
+} from "@/api/system";
import { isIPv4 } from "@/scripts/validate";
export default {
data() {
return {
activeLang: "",
+ activeKb: "",
inWifiDetail: false,
inWireDetail: false,
langList: [],
keyboardList: [],
- activePage: "lang",
+ tabList: [{ name: "绯荤粺璇█" }, { name: "閿洏绠＄悊" }],
+ activePage: "绯荤粺璇█",
rules: {
deviceName: [
{ required: true, message: "璇疯緭鍏ヨ澶囧悕绉�", trigger: "change" },
@@ -71,9 +95,17 @@
mounted() {
this.fetchLangList();
this.getCurLang();
+ this.fetchKeyBoardList();
+ this.getCurKb();
},
props: ["barName"],
methods: {
+ getCurKb() {
+ getCurKeyboardLayout().then((res) => {
+ this.activeKb = res.data.keyboard;
+ });
+ },
+
getCurLang() {
getLang().then((res) => {
if (res && res.success) {
@@ -88,11 +120,19 @@
}
});
},
+ fetchKeyBoardList() {
+ getKeyboardLayouts().then((res) => {
+ if (res && res.success) {
+ this.keyboardList = res.data.slice(0, 5);
+ }
+ });
+ },
pickLang(item) {
setLang({
lang: item.Lang,
}).then(
(res) => {
+ this.getCurLang();
this.$message.success(res.data);
},
(err) => {
@@ -100,17 +140,29 @@
}
);
},
- openRight(typ) {
- this.activePage = typ;
- if (typ == "keyboard") {
- getKeyboardLayouts().then((res) => {
- if (res && res.success) {
- this.keyboardList = res.data.slice(0, 5);
- }
- });
- }
+ pickKb(item) {
+ setKeyboardLayout({
+ layout: item.id,
+ }).then(
+ (res) => {
+ this.getCurKb()
+ this.$message.success(res.data);
+ },
+ (err) => {
+ this.$message.error(err.msg);
+ }
+ );
},
- wifiControl(val) { },
+ openRight(item, i) {
+ this.activePage = item.name;
+ this.$refs["leftbar"].forEach((x) => {
+ x.style.backgroundColor = "rgba(248, 248, 248, 1)";
+ x.style.color = "#333";
+ });
+ this.$refs["leftbar"][i].style.backgroundColor = "rgb(61, 104, 225)";
+ this.$refs["leftbar"][i].style.color = "white";
+ },
+ wifiControl(val) {},
checkWifi() {
this.inWifiDetail = true;
},
--
Gitblit v1.8.0