From 804ab2e49387697c25eda983e7ece3b92bcff56e Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期五, 10 六月 2022 14:53:38 +0800
Subject: [PATCH] 摄像机数量改成授权数量
---
src/pages/settings/views/generalSettings.vue | 653 +++++++++++++++++++++++++---------------------------------
1 files changed, 281 insertions(+), 372 deletions(-)
diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue
index 95f0429..db07d76 100644
--- a/src/pages/settings/views/generalSettings.vue
+++ b/src/pages/settings/views/generalSettings.vue
@@ -9,55 +9,11 @@
v-for="(item, i) in menuArr"
:key="i"
>
- <span class="iconfont" :style="`font-size:${item.size}px;`">{{
- item.icon
- }}</span>
+ <span class="iconfont" :style="`font-size:${item.size}px;`">{{ item.icon }}</span>
<span class="title">{{ item.name }}</span>
</div>
</div>
<div class="general-right">
- <!-- <div class="lang" v-if="activePage == 0">
- <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 videoTime" v-if="activePage == 0">
<div class="min-dur">
<div class="title">鎶撴媿鍓嶅綍鍍忔椂闀�</div>
@@ -77,10 +33,9 @@
:format-tooltip="formatTooltip"
></el-slider>
</div>
- <!-- <el-input-number
+ <el-input-number
v-model="min_len"
@change="fakeObj.min = +(min_len / 1.2)"
- controls-position="right"
:min="5"
:step="5"
:max="120"
@@ -88,16 +43,17 @@
size="small"
></el-input-number
> s -->
-
- <el-input-number
- v-model="min_len"
- @change="fakeObj.min = +(min_len / 1.2)"
- :min="5"
- :step="5"
- :max="120"
- step-strictly
- size="small"
- ></el-input-number> s
+
+ <el-input-number
+ v-model="min_len"
+ @change="fakeObj.min = +(min_len / 1.2)"
+ :min="5"
+ :step="5"
+ :max="120"
+ step-strictly
+ size="small"
+ ></el-input-number
+ > s
</div>
</div>
<div class="min-dur">
@@ -127,7 +83,6 @@
size="small"
></el-input-number
> s
-
</div>
</div>
@@ -150,17 +105,22 @@
</div>
<div class="sound-btns">
<span @click="togglePlay(item, i)">
- <span
- class="iconfont"
- v-if="!item.isPlay"
- style="cursor: pointer"
- >{{ playSpan }}</span
- >
+ <span class="iconfont" v-if="!item.isPlay" style="cursor: pointer">{{ playSpan }}</span>
<!-- <span class="iconfont" v-else style="cursor: pointer">{{
playSpan2
}}</span> -->
- <img v-else src="/images/settings/鏆傚仠.png" alt="" style="width:16px;hight:16px;cursor: pointer;margin-top:15px;">
+ <img
+ v-else
+ src="/images/settings/鏆傚仠.png"
+ alt=""
+ style="
+ width: 16px;
+ hight: 16px;
+ cursor: pointer;
+ margin-top: 15px;
+ "
+ />
<!--
<i
v-if="!item.isPlay"
@@ -169,28 +129,13 @@
></i>
<i v-else class="el-icon-video-pause"></i> -->
</span>
- <span
- class="icon iconfont del"
- style="cursor: pointer"
- @click="removeSound(item)"
- >{{ delspan }}</span
- >
+ <span class="icon iconfont del" style="cursor: pointer" @click="removeSound(item)">{{ delspan }}</span>
</div>
</div>
</div>
<div v-if="showUpload" @click.stop>
- <el-upload
- class="upload-demo"
- drag
- action=""
- :http-request="uploadSound"
- :show-file-list="false"
- >
- <div class="info">
- 璇峰皢澹伴煶浜嬩欢鏂囦欢鎷栨嫿鍒版澶勶紝鎴�<span class="info-click"
- >鐐瑰嚮涓婁紶</span
- >
- </div>
+ <el-upload class="upload-demo" drag action="" :http-request="uploadSound" :show-file-list="false">
+ <div class="info">璇峰皢澹伴煶浜嬩欢鏂囦欢鎷栨嫿鍒版澶勶紝鎴�<span class="info-click">鐐瑰嚮涓婁紶</span></div>
<div class="des" v-if="showUpload" @click.stop>
浠呮敮鎸乵p3銆亀av绛夋牸寮�
</div>
@@ -199,89 +144,66 @@
<div class="add-group">
<div class="add-btn">
- <span class="icon iconfont" @click.stop="showUpload = !showUpload"
- ></span
- >
+ <span class="icon iconfont" @click.stop="showUpload = !showUpload"></span>
</div>
</div>
</div>
<div class="self-setting" v-if="activePage == 2">
<div class="top-title">棰滆壊涓婚</div>
- <div class="color-bar">
- <div
- v-for="(item,index) in colorList"
- :key="index"
- style="border:none;"
- >
- <div class="color-option"
- v-if="universalColor != index"
- :style="{cursor: 'pointer',backgroundColor:item.color}"
- @click="colorCard(item.color,index)"
- />
+ <div class="color-bar">
+ <div v-for="(item, index) in colorList" :key="index" style="border: none">
+ <div
+ class="color-option"
+ v-if="universalColor != index"
+ :style="{ cursor: 'pointer', backgroundColor: item.color }"
+ @click="colorCard(item.color, index)"
+ />
- <div class="color-option color-option-active"
- v-else
- :style="{cursor: 'pointer',border:`2px solid ${item.color}`}"
- @click="colorCard(item.color,index)">
- <div
- :style="{backgroundColor:item.color}"
- class="color-option-content">
- </div>
-
+ <div
+ class="color-option color-option-active"
+ v-else
+ :style="{
+ cursor: 'pointer',
+ border: `2px solid ${item.color}`
+ }"
+ @click="colorCard(item.color, index)"
+ >
+ <div :style="{ backgroundColor: item.color }" class="color-option-content"></div>
+ </div>
</div>
</div>
- </div>
-
-
-
<div class="top-title">鍥炬爣涓婚</div>
<div class="icon-bar" style="cursor: pointer" @click="selectIcons(0)">
<div class="bar-title">
- <span class="title">鎵佸钩鍐欏疄鍥炬爣</span>
- <span
- class="icon iconfont"
- :class="activeIcons == 0 ? 'icon-active' : 'icon-normal'"
- ></span
- >
+ <span class="title">闈㈡�ч鏍�</span>
+ <span class="icon iconfont" :class="activeIcons == 0 ? 'icon-active' : 'icon-normal'"></span>
</div>
<div class="entity">
- <div
- class="entity-img"
- v-for="(item, i) in realIconList"
- :key="i"
- >
+ <div class="entity-img" v-for="(item, i) in realIconList" :key="i">
<img :src="item.url" alt="" />
</div>
</div>
</div>
<div class="icon-bar" style="cursor: pointer" @click="selectIcons(1)">
<div class="bar-title">
- <span class="title">鎵佸钩鍖栧浘鏍�</span>
- <span
- class="icon iconfont"
- :class="activeIcons == 1 ? 'icon-active' : 'icon-normal'"
- ></span
- >
+ <span class="title">绠�绾﹂鏍�</span>
+ <span class="icon iconfont" :class="activeIcons == 1 ? 'icon-active' : 'icon-normal'"></span>
</div>
<div class="entity">
- <div
- class="entity-img"
- v-for="(item, i) in flatIconList"
- :key="i"
- >
+ <div class="entity-img" v-for="(item, i) in flatIconList" :key="i">
<img :src="item.url" alt="" />
</div>
</div>
</div>
-
+
<div class="top-title">妗岄潰鑳屾櫙涓婚</div>
<div class="bg-bar">
<div class="bg-list">
<div
v-for="(item, i) in tableBGList"
class="bg-img"
- :class="activeBg == i ? 'bg-list-active' : ''"
+ :class="activeBg == i ? 'bg-list-active' : ''"
:key="i"
@click="pickBg(item, i)"
>
@@ -296,9 +218,9 @@
</template>
<script>
-import { saveAlarmConfig, getDevInfo } from "@/api/system";
-import { uploadSound, getSoundList, deleteSound } from "@/api/event";
-
+import { saveAlarmConfig, getDevInfo } from "@/api/system"
+import { uploadSound, getSoundList, deleteSound } from "@/api/event"
+import { updateUser } from "@/api/user"
export default {
data() {
return {
@@ -313,13 +235,12 @@
max_len: 0,
fakeObj: {
min: 0,
- max: 0,
+ max: 0
},
menuArr: [
- // { name: "璁惧淇℃伅", icon: "\ue933" ,size:18},
{ name: "浜嬩欢褰曞儚鏃堕暱", icon: "\ue74f", size: 20 },
{ name: "浜嬩欢澹伴煶", icon: "\ueb5e", size: 16 },
- { name: "涓�у寲璁剧疆", icon: "\ue750", size: 18 },
+ { name: "涓�у寲璁剧疆", icon: "\ue750", size: 18 }
],
soundList: [],
activePage: 0,
@@ -335,231 +256,263 @@
webVersion: "",
disks: "",
memory: "",
- activeBg: 0,
+ activeBg: 0
},
isPlay: false,
realIconList: [
- { url: "/images/settings/鏃ュ織绠＄悊.png", color: "green" },
- { url: "/images/settings/瀹炴椂鐩戞帶.png", color: "yellow" },
- { url: "/images/settings/鏁版嵁鍙鍖�.png", color: "pink" },
+ { url: "/images/settings/闈㈡�у浘鏍�/1浠板崸妫�娴�.png" },
+ { url: "/images/settings/闈㈡�у浘鏍�/2涓綋闈欐.png" },
+ { url: "/images/settings/闈㈡�у浘鏍�/3瀹夊叏璀︽垝.png" },
+ { url: "/images/settings/闈㈡�у浘鏍�/4瀹夊叏甯芥娴�.png" },
+ { url: "/images/settings/闈㈡�у浘鏍�/5濂旇窇.png" },
+ { url: "/images/settings/闈㈡�у浘鏍�/6杞﹁締妫�娴�.png" },
+ { url: "/images/settings/闈㈡�у浘鏍�/7鎶界儫.png" }
],
flatIconList: [
- { url: "/images/settings/鏁版嵁鎺ㄩ��.png" },
- { url: "/images/settings/鏁版嵁鏍堥厤缃�.png" },
- { url: "/images/settings/绯荤粺璁剧疆.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/1浠板崸妫�娴�.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/2涓綋闈欐.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/3瀹夊叏璀︽垝.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/4瀹夊叏甯芥娴�.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/5濂旇窇.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/6杞﹁締妫�娴�.png" },
+ { url: "/images/settings/绠�绾﹀浘鏍�/7鎶界儫.png" }
],
tableBGList: [
- { name: "background", url: "/images/settings/background.png" },
- { name: "message", url: "/images/settings/鏁版嵁鎺ㄩ��.png" },
- { name: "weather", url: "/images/settings/绯荤粺璁剧疆.png" },
+ { name: "background", url: "/images/desktop/background.png" },
+ { name: "message", url: "/images/desktop/message.png" },
+ { name: "weather", url: "/images/desktop/weather.png" }
],
- universalColor:'',
+ universalColor: "",
colorList: [
- {name:1 ,color:"#FC6B9E"},
- {name:2 ,color:"#F38F56"},
- {name:3 ,color:"#FDD33A"},
- {name:4 ,color:"#53D999"},
- {name:5 ,color:"#21CDB2"},
- {name:6 ,color:"#61E2EB"},
- {name:7 ,color:"#4E94FF"},
- {name:8 ,color:"#8E8CD8"},
- {name:9 ,color:"#4C4A48"},
+ { name: 1, color: "#FC6B9E" },
+ { name: 2, color: "#F38F56" },
+ { name: 3, color: "#FDD33A" },
+ { name: 4, color: "#53D999" },
+ { name: 5, color: "#21CDB2" },
+ { name: 6, color: "#61E2EB" },
+ { name: 7, color: "#4E94FF" },
+ { name: 8, color: "#8E8CD8" },
+ { name: 9, color: "#4C4A48" }
]
- };
+ }
},
mounted() {
- this.getDeviceInfo();
- this.getSounds();
- let _this = this;
- this.eventAudio.addEventListener("ended", () => {
- if (_this.curPlayingIndex !== null && _this.soundList.length) {
- _this.soundList[_this.curPlayingIndex].isPlay = false;
- _this.curPlayingIndex = null;
- }
- });
- const url = localStorage.getItem("backgroundPic");
+ this.getDeviceInfo()
+ this.getSounds()
+ const url = this.curUser.backgroundpic
+ this.activeIcons = this.curUser.useIconType - 1
+ this.universalColor = this.colorList.findIndex((x) => {
+ return x.color == localStorage.getItem("--colorCard")
+ })
if (url) {
- const arr = url.split("/");
this.activeBg = this.tableBGList.findIndex((x) => {
- return x.url.includes(arr[arr.length - 1]);
- });
+ return x.url == url
+ })
} else {
- this.activeBg = 0;
+ this.activeBg = 0
}
- const e = this.$refs.curPage;
- e.addEventListener("click", (e) => {
- if (this.showUpload) {
- this.showUpload = false;
- }
- });
+
+ this.eventAudio.addEventListener("ended", this.endedHandle, false)
+ this.$refs.curPage.addEventListener("click", this.clickHandle, false)
},
beforeDestroy() {
- this.$refs.curPage.removeEventListener("click");
+ this.eventAudio.removeEventListener("ended", this.endedHandle, false)
+ this.$refs.curPage.removeEventListener("click", this.clickHandle, false)
},
computed: {
min_video_len() {
- return Math.round(this.fakeObj.min * 1.2);
+ return Math.round(this.fakeObj.min * 1.2)
},
max_video_len() {
- return Math.round(this.fakeObj.max * 1.2);
+ return Math.round(this.fakeObj.max * 1.2)
},
+ curUser() {
+ return JSON.parse(sessionStorage.getItem("userInfo"))
+ }
},
methods: {
+ endedHandle() {
+ let _this = this
+ if (_this.curPlayingIndex !== null && _this.soundList.length) {
+ _this.soundList[_this.curPlayingIndex].isPlay = false
+ _this.curPlayingIndex = null
+ }
+ },
+ clickHandle() {
+ let _this = this
+ if (this.showUpload) {
+ this.showUpload = false
+ }
+ },
formatTooltip(v) {
- return Math.round(v * 1.2);
+ return Math.round(v * 1.2)
},
pickBg(item, i) {
- this.activeBg = i;
- let message = "changeBackground?" + item.name;
- window.parent.postMessage(
- {
- msg: message,
- },
- "*"
- );
+ this.activeBg = i
+ let message = "changeBackground?" + item.name
+ window.parent.postMessage({ msg: message }, "*")
+ updateUser({
+ id: this.curUser.id,
+ backgroundpic: item.url
+ }).then((res) => {
+ if (res.success) {
+ sessionStorage.setItem("userInfo", JSON.stringify(res.data))
+ debugger
+ this.$message.success(res.msg)
+ }
+ })
this.$forceUpdate()
},
togglePlay(item, i) {
if (this.curPlayingIndex !== null) {
- this.eventAudio.pause();
- this.soundList[this.curPlayingIndex].isPlay = false;
+ this.eventAudio.pause()
+ this.soundList[this.curPlayingIndex].isPlay = false
if (this.curPlayingIndex === i) {
- this.curPlayingIndex = null;
- return;
+ this.curPlayingIndex = null
+ return
}
}
- this.curPlayingIndex = i;
- this.eventAudio.src = "http://" + item.path;
+ this.curPlayingIndex = i
+ this.eventAudio.src = "http://" + item.path
if (item.isPlay) {
- this.eventAudio.pause();
+ this.eventAudio.pause()
} else {
- this.eventAudio.play();
+ this.eventAudio.play()
}
- item.isPlay = !item.isPlay;
+ item.isPlay = !item.isPlay
},
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 = "V2.0.0";
- this.deviceInfo.disks = "( " + info.disk + ") ";
- this.deviceInfo.memory =
- (info.mem.total / 1024 / 1024 / 1024).toFixed(2) + "GB";
- this.fakeObj.min = basic.min_video_len / 1.2;
- this.fakeObj.max = basic.max_video_len / 1.2;
- });
+ 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 = "V2.0.0"
+ this.deviceInfo.disks = "( " + info.disk + ") "
+ this.deviceInfo.memory = (info.mem.total / 1024 / 1024 / 1024).toFixed(2) + "GB"
+ this.fakeObj.min = basic.min_video_len / 1.2
+ this.fakeObj.max = basic.max_video_len / 1.2
+ })
},
getSounds() {
getSoundList().then((res) => {
if (res.success) {
- this.soundList = res.data;
+ this.soundList = res.data
this.soundList.forEach((x) => {
- this.$set(x, "isPlay", false);
- });
+ this.$set(x, "isPlay", false)
+ })
}
- });
+ })
},
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 + "绉�";
+ 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);
+ let param = new FormData()
+ param.append("file", params.file)
uploadSound(param).then(
(res) => {
- this.$message.success("涓婁紶鎴愬姛");
- this.showUpload = false;
- this.getSounds();
+ this.$message.success("涓婁紶鎴愬姛")
+ this.showUpload = false
+ this.getSounds()
},
(err) => {
- this.$message.error("澹伴煶涓婁紶澶辫触");
+ this.$message.error("澹伴煶涓婁紶澶辫触")
}
- );
+ )
},
openRight(i) {
- this.activePage = i;
+ this.activePage = i
},
selectIcons(i) {
- this.activeIcons = i;
+ this.activeIcons = i
+ updateUser({
+ id: this.curUser.id,
+ iconType: i + 1
+ }).then((res) => {
+ if (res.success) {
+ window.parent.postMessage({ msg: "AppUpdate" }, "*")
+ sessionStorage.setItem("userInfo", JSON.stringify(res.data))
+ debugger
+ this.$message.success(res.msg)
+ }
+ })
},
removeSound(item) {
- const h = this.$createElement;
+ const h = this.$createElement
const icon = this.$msgbox({
title: "",
message: h(
"div",
{
- style:
- "display: flex; flex-direction: column; justify-content: center; align-items: center;",
+ style: "display: flex; flex-direction: column; justify-content: center; align-items: center;"
},
[
h("span", { class: "icon iconfont warn-icon" }, `${this.warnSpn}`),
h("span", { class: "warn-title" }, "鍒犻櫎浜嬩欢澹伴煶 "),
- h("span", { class: "warn-dec" }, "鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺０闊�?"),
+ h("span", { class: "warn-dec" }, "鎮ㄦ槸鍚︾‘璁ゅ垹闄や簨浠跺０闊�?")
]
),
showCancelButton: true,
confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
+ cancelButtonText: "鍙栨秷"
}).then(() => {
deleteSound({
- id: item.id,
+ id: item.id
}).then(
(res) => {
if (res.success) {
- this.getSounds();
+ this.getSounds()
this.$message({
type: "success",
- message: "鍒犻櫎鎴愬姛!",
- });
- this.showUpload = false;
+ message: "鍒犻櫎鎴愬姛!"
+ })
+ this.showUpload = false
}
},
(err) => {
- this.$message.error(err.msg);
+ this.$message.error(err.msg)
}
- );
- });
+ )
+ })
},
clickSound(item, i) {
this.$refs["soundBar"].forEach((x) => {
- x.style = "border: 2px solid #FFF;";
- });
- this.$refs["soundBar"][i].style = "border: 2px solid #4E94FF;";
+ x.style = "border: 2px solid #FFF;"
+ })
+ this.$refs["soundBar"][i].style = "border: 2px solid #4E94FF;"
},
submitAlarm() {
saveAlarmConfig({
min_video_len: this.min_video_len,
- max_video_len: this.max_video_len,
+ max_video_len: this.max_video_len
}).then((res) => {
if (res && res.success) {
- this.getDeviceInfo();
+ this.getDeviceInfo()
this.$notify({
type: "success",
- message: "淇濆瓨鎴愬姛",
- });
+ message: "淇濆瓨鎴愬姛"
+ })
}
- });
+ })
},
- colorCard(color,index) {
+ colorCard(color, index) {
this.universalColor = index
- document.documentElement.style.setProperty('--colorCard',`${color}`)
- localStorage.setItem('--colorCard',`${color}`)
- window.parent.postMessage({msg:'changeColor',color},'*')
+ document.documentElement.style.setProperty("--colorCard", `${color}`)
+ localStorage.setItem("--colorCard", `${color}`)
+ window.parent.postMessage({ msg: "changeColor", color }, "*")
}
- },
-};
+ }
+}
</script>
<style scoped lang="scss">
@@ -574,16 +527,21 @@
flex: 1;
flex-basis: auto;
box-sizing: border-box;
+ .el-input__inner {
+ height: 24px !important;
+ }
.general-center {
height: 100%;
width: 300px;
overflow: auto;
box-sizing: border-box;
flex-shrink: 0;
- padding: 24px 10px;
+ padding: 10px 10px;
+ padding-top: 6px;
border-right: 4px solid #f2f2f7;
+ border-top: 4px solid #f2f2f7;
+ border-left: 4px solid #f2f2f7;
background-color: #fbfaff;
-
.menu-item {
height: 56px;
margin-bottom: 4px;
@@ -608,7 +566,7 @@
color: white !important;
}
.menu-item:hover {
- background-color: #F2F2F7;
+ background-color: #f2f2f7;
}
}
.general-right {
@@ -617,13 +575,11 @@
overflow: auto;
box-sizing: border-box;
background-color: rgb(251, 250, 255);
+ border-top: 4px solid #f2f2f7;
- padding: 10px 18px 10px 10px;
- .el-form-item.is-required:not(.is-no-asterisk)
- > .el-form-item__label:before,
- .el-form-item.is-required:not(.is-no-asterisk)
- .el-form-item__label-wrap
- > .el-form-item__label:before {
+ padding: 6px 18px 10px 10px;
+ .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before,
+ .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label:before {
display: none;
}
.el-select {
@@ -632,7 +588,7 @@
.el-form-item {
margin-bottom: 10px;
height: 50px;
- background: #f8f8f8;
+ background: #f2f2f7;
padding: 4px 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
@@ -665,13 +621,18 @@
text-align: center;
font-weight: 700;
border: none;
+ background: #f2f2f7;
+ border-radius: 8px;
+ height: 48px;
+ margin-bottom: 4px;
+ border: 2px solid #f2f2f7 !important;
}
.bar-group {
overflow: auto;
height: calc(100% - 100px);
.general-bar {
height: 48px;
- background-color: #f8f8f8;
+ background: #f2f2f7;
border-radius: 10px;
line-height: 48px;
box-sizing: border-box;
@@ -680,7 +641,8 @@
display: flex;
justify-content: space-between;
margin-bottom: 2px;
- border: 2px solid #f8f8f8;
+ border: 2px solid #f2f2f7;
+ margin-bottom: 4px;
.name {
font-size: 14px;
}
@@ -689,18 +651,7 @@
display: flex;
justify-content: space-between;
color: rgba(191, 191, 191, 1);
- /* .el-icon-video-pause {
- cursor: pointer;
- font-size: 23px;
- vertical-align: middle;
- color: #409eff;
- }
- .el-icon-video-play {
- cursor: pointer;
- font-size: 23px;
- vertical-align: middle;
- color: #409eff;
- } */
+
span {
color: #333;
}
@@ -746,7 +697,7 @@
.min-dur {
box-sizing: border-box;
padding: 0 20px;
- background-color: #F2F2F7;
+ background-color: #f2f2f7;
height: 105px;
margin-bottom: 4px;
border-radius: 15px;
@@ -775,7 +726,7 @@
min-width: 30px;
line-height: 80px;
margin-right: 10px;
- color:#333 ;
+ color: #333;
font-size: 8px;
}
.block {
@@ -834,7 +785,7 @@
font-weight: 700;
margin-top: 20px;
}
- /* .icon-bar:hover {
+ /* .icon-bar:hover {
background-color: rgba(233, 233, 233, 1);
} */
.color-bar {
@@ -845,26 +796,26 @@
height: 96px;
background-color: #fff;
border-radius: 8px;
- padding-left:7px ;
+ padding-left: 7px;
.color-option {
- margin-right:12px ;
+ margin-right: 12px;
width: 30px;
height: 30px;
- border-radius:50% ;
+ border-radius: 50%;
}
.color-option-active {
box-sizing: border-box;
- margin-right:12px ;
+ margin-right: 12px;
width: 30px;
height: 30px;
- border-radius:50% ;
+ border-radius: 50%;
background-color: #fff;
- padding: 3px;
+ padding: 4px;
.color-option-content {
width: 100%;
height: 100%;
- border-radius:50% ;
+ border-radius: 50%;
}
}
}
@@ -872,7 +823,7 @@
cursor: pointer;
box-sizing: border-box;
padding: 15px 13px 14px 20px;
- background: #F2F2F7;
+ background: #f2f2f7;
border-radius: 8px;
margin-bottom: 10px;
.bar-title {
@@ -891,12 +842,12 @@
}
.icon-normal {
font-size: 16px;
- color: #E0E0E0;
+ color: #e0e0e0;
}
}
.entity {
display: flex;
- margin-left:5px ;
+ margin-left: 5px;
.entity-img {
background-color: rgba(248, 248, 248, 1);
width: 50px;
@@ -910,7 +861,7 @@
}
}
.bg-bar {
- background-color: #F2F2F7;
+ background-color: #f2f2f7;
box-sizing: border-box;
padding: 15px 25px;
border-radius: 12px;
@@ -928,7 +879,7 @@
height: 100%;
}
}
- /* .bg-img:hover {
+ /* .bg-img:hover {
border: 2px solid yellow;
} */
.bg-list-active {
@@ -975,10 +926,10 @@
margin-top: 30px;
}
-.info-click {
- color: var(--colorCard);
- text-decoration: underline;
-}
+ .info-click {
+ color: var(--colorCard);
+ text-decoration: underline;
+ }
.info-click {
color: #4e94ff;
@@ -1007,7 +958,7 @@
font-size: 14px;
}
.warn-icon {
- color: #fe6d68;
+ color: var(--colorCard);
font-size: 40px;
margin-top: 11px;
}
@@ -1033,7 +984,7 @@
.el-message-box__btns {
display: flex;
justify-content: center;
- margin-top: 20px;
+ margin: 20px;
.el-button:focus,
.el-button:hover {
background-color: none;
@@ -1060,8 +1011,8 @@
button:last-child {
background-color: var(--colorCard) !important;
border: 1px solid var(--colorCard) !important;
- span {
- color: #fff;
+ span {
+ color: #fff;
}
}
}
@@ -1069,17 +1020,15 @@
</style>
<style>
-
.videoTime .el-slider__button {
margin-top: -25px !important;
border: none !important;
-
}
.videoTime .el-slider__button::after {
display: block;
position: relative;
-content: "\e75d";
+ content: "\e75d";
color: var(--colorCard);
font-family: "iconfont" !important;
font-size: 16px;
@@ -1089,7 +1038,7 @@
}
.videoTime .el-tooltip {
-background-color: #F2F2F7 !important;
+ background-color: #f2f2f7 !important;
border: none !important;
}
@@ -1099,10 +1048,10 @@
}
.videoTime .el-slider__stop {
- background-color: #C4C4C4 !important;
+ background-color: #c4c4c4 !important;
height: 3px !important;
width: 8px !important;
- border-radius:0 !important;
+ border-radius: 0 !important;
}
.videoTime .el-slider__bar {
@@ -1112,75 +1061,35 @@
.videoTime .el-input-number.el-input-number--small {
width: 90px;
- height: 24px;
+ height: 24px !important;
border-radius: 4px;
line-height: 24px !important;
font-weight: 700 !important;
}
-
.videoTime .el-input-number.el-input-number--small .el-input__inner {
-font-size: 12px !important;
+ font-size: 12px !important;
+ height: 24px !important;
}
.el-input-number__decrease {
-color: #333 !important;
-/* top: 4px !important; */
- height: 22px !important;
- width: 20px !important;
- line-height: 22px !important;
+ color: #333 !important;
+ /* top: 4px !important; */
+ height: 22px !important;
+ width: 20px !important;
+ line-height: 22px !important;
}
-
-/* .el-input-number__decrease:hover i{
- color: var(--colorCard);
-} */
.el-input-number__increase {
-color: #333 !important;
- /* top: 4px !important; */
- height: 22px !important;
- width: 24px !important;
- line-height: 22px !important;
+ color: #333 !important;
+ /* top: 4px !important; */
+ height: 22px !important;
+ width: 24px !important;
+ line-height: 22px !important;
}
-.el-input-number__increase:hover i{
- /* color: var(--colorCard); */
- color: #4E94FF;
+.el-input-number__increase:hover i {
+ /* color: var(--colorCard); */
+ color: #4e94ff;
}
-
-.el-input__inner {
- height: 24px !important;
-}
-
-
-/* .el-tooltip__popper {
- font-size: 12px !important;
- background-color: transparent !important;
- color:var(--colorCard) !important;
-}
-
-.popper__arrow::after {
- border-color: transparent !important;
- border: none !important;
-}
-
-.popper__arrow:after {
- border-bottom-color: green !important;
-}
-
-.popper__arrow:after {
- border-top-color: pink !important;
-}
-
-.toolClass {
- border: none !important;
-}
-
-.toolClass {
- border: none !important;
-}
-
-.el-slider__button::after {
- border: none !important;
-} */
</style>
--
Gitblit v1.8.0