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/systemSettings/views/generalSettings.vue | 254 ++++++++++++++++++++++++++++++++++++++------------
1 files changed, 190 insertions(+), 64 deletions(-)
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>
--
Gitblit v1.8.0