From 600f3c72842b59fc368c2512f1ded25687d104ae Mon Sep 17 00:00:00 2001
From: mark <mark18340872469@163.com>
Date: 星期二, 27 九月 2022 16:48:05 +0800
Subject: [PATCH] 点位信息维护
---
src/views/hashrate/CameraManage/CameraRules/components/AddRuleBox.vue | 232 +++++++++++++++++++++++++++++++++-------------------------
1 files changed, 132 insertions(+), 100 deletions(-)
diff --git a/src/views/hashrate/CameraManage/CameraRules/components/AddRuleBox.vue b/src/views/hashrate/CameraManage/CameraRules/components/AddRuleBox.vue
index 1ed8212..ba2bc1e 100644
--- a/src/views/hashrate/CameraManage/CameraRules/components/AddRuleBox.vue
+++ b/src/views/hashrate/CameraManage/CameraRules/components/AddRuleBox.vue
@@ -1,45 +1,30 @@
<template>
<div class="AddBox">
- <div class="title">
- {{ editData.type ? "淇敼" : "娣诲姞"
- }}{{ type === "separate" ? "鐙珛" : "鑱斿姩" }}鍦烘櫙
- </div>
+ <div class="title">{{ editData.type ? "淇敼" : "娣诲姞" }}{{ type === "separate" ? "鐙珛" : "鑱斿姩" }}鍦烘櫙</div>
<div class="close iconfont" @click="close"></div>
- <el-form :model="ruleForm">
+ <el-form :model="ruleForm" :rules="rules" ref="form">
<div class="label">鍦烘櫙鍚嶇О</div>
- <el-form-item>
- <el-input
- class="h32"
- v-model="ruleForm.scene_name"
- placeholder="璇疯緭鍏�"
- ></el-input>
+ <el-form-item prop="scene_name">
+ <!-- <el-input class="h32" v-model="ruleForm.scene_name" placeholder="璇疯緭鍏�"></el-input> -->
+
+ <el-select v-model="ruleForm.scene_name" filterable placeholder="璇烽�夋嫨">
+ <el-option v-for="item in scene_nameOptions" :key="item.value" :label="item.label" :value="item.value">
+ </el-option>
+ </el-select>
</el-form-item>
<div class="label">浜嬩欢绛夌骇</div>
<el-form-item>
- <el-select
- class="h32"
- v-model="ruleForm.alarm_level"
- placeholder="璇烽�夋嫨"
- >
- <el-option
- v-for="item in eventLevel"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- ></el-option>
+ <el-select class="h32" v-model="ruleForm.alarm_level" placeholder="璇烽�夋嫨">
+ <el-option v-for="item in eventLevel" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<div class="label">鏃堕棿娈�</div>
- <el-form-item>
- <el-select
- class="h32 left"
- v-model="ruleForm.time_rule_id"
- placeholder="璇烽�夋嫨"
- >
+ <el-form-item prop="time_rule_id">
+ <el-select class="h32 left" v-model="ruleForm.time_rule_id" placeholder="璇烽�夋嫨">
<el-option
v-for="item in VideoManageData.TimeRules"
:key="item.id"
@@ -53,28 +38,13 @@
<div class="label">鍦烘櫙鎻忚堪</div>
<el-form-item>
- <el-input
- class="h32"
- v-model="ruleForm.desc"
- type="textarea"
- ></el-input>
+ <el-input class="h32" v-model="ruleForm.desc" type="textarea"></el-input>
</el-form-item>
<div class="label">浜嬩欢澹伴煶</div>
<el-form-item>
- <el-select
- v-model="ruleForm.voice"
- placeholder="璇烽�夋嫨"
- value-key="id"
- @change="selSound"
- class="h32 left"
- >
- <el-option
- v-for="item in soundList"
- :key="item.id"
- :label="item.name"
- :value="item"
- ></el-option>
+ <el-select v-model="ruleForm.voice" placeholder="璇烽�夋嫨" value-key="id" @change="selSound" class="h32 left">
+ <el-option v-for="item in soundList" :key="item.id" :label="item.name" :value="item"></el-option>
</el-select>
<span @click="togglePlayer" v-show="ruleForm.voiceId.length">
<i v-if="togglePlay" class="iconfont"></i>
@@ -88,38 +58,83 @@
<div class="cancelBtn button" @click="close">鍙栨秷</div>
</div>
- <TimeSlider
- v-if="showTimeSlider"
- @close="showTimeSlider = false"
- ></TimeSlider>
+ <TimeSlider v-if="showTimeSlider" @close="showTimeSlider = false"></TimeSlider>
</div>
</template>
<script>
-import { getSoundList } from "@/api/event";
-import TimeSlider from "@/views/hashrate/CameraManage/CameraRules/components/TimeSlider";
+import { getSoundList } from "@/api/event"
+import TimeSlider from "@/views/hashrate/CameraManage/CameraRules/components/TimeSlider"
export default {
props: {
type: {
- type: String,
+ type: String
},
- editData: {},
+ editData: {}
},
components: {
- TimeSlider,
+ TimeSlider
},
mounted() {
- this.getSounds();
+ console.log(this.editData)
+ this.getSounds()
this.eventAudio.addEventListener("ended", () => {
- this.togglePlay = true;
- });
- if (this.editData.type) {
- this.initEditData();
- }
+ this.togglePlay = true
+ })
},
data() {
return {
+ scene_nameOptions: [
+ {
+ value: "鏄庣伀",
+ label: "鏄庣伀"
+ },
+ {
+ value: "鐑熼浘",
+ label: "鐑熼浘"
+ },
+ {
+ value: "缈昏秺鍥存爮",
+ label: "缈昏秺鍥存爮"
+ },
+ {
+ value: "鍖哄煙鍏ヤ镜",
+ label: "鍖哄煙鍏ヤ镜"
+ },
+ {
+ value: "浜哄憳鎾ょ",
+ label: "浜哄憳鎾ょ"
+ },
+ {
+ value: "浜哄憳绂诲矖",
+ label: "浜哄憳绂诲矖"
+ },
+ {
+ value: "浜哄憳鑱氶泦",
+ label: "浜哄憳鑱氶泦"
+ },
+ {
+ value: "鎵撶數璇�",
+ label: "鎵撶數璇�"
+ },
+ {
+ value: "鎶界儫",
+ label: "鎶界儫"
+ },
+ {
+ value: "鏈僵鎴村畨鍏ㄥ附",
+ label: "鏈僵鎴村畨鍏ㄥ附"
+ },
+ {
+ value: "鏈┛鐫�宸ヤ綔鏈�",
+ label: "鏈┛鐫�宸ヤ綔鏈�"
+ },
+ {
+ value: "鐫″矖",
+ label: "鐫″矖"
+ }
+ ],
ruleForm: {
alarm_level: 1,
scene_name: "",
@@ -127,36 +142,40 @@
template_id: "",
time_rule_id: "",
voice: {},
- voiceId: "",
+ voiceId: ""
},
eventLevel: [
{
label: "涓�绾�",
- value: 1,
+ value: 1
},
{
label: "浜岀骇",
- value: 2,
+ value: 2
},
{
label: "涓夌骇",
- value: 3,
+ value: 3
},
{
label: "鍥涚骇",
- value: 4,
+ value: 4
},
{
label: "浜旂骇",
- value: 5,
- },
+ value: 5
+ }
],
+ rules: {
+ scene_name: [{ required: true, message: "璇烽�夋嫨鍦烘櫙鍚嶇О", trigger: "blur" }],
+ time_rule_id: [{ required: true, message: "璇烽�夋嫨鏃堕棿娈�", trigger: "blur" }]
+ },
soundPath: "",
togglePlay: true,
eventAudio: new Audio(),
soundList: [],
- showTimeSlider: false,
- };
+ showTimeSlider: false
+ }
},
methods: {
@@ -170,57 +189,70 @@
time_rule_id: this.editData.rule.time_rule_id,
voice: this.editData.rule.voice,
voiceId: this.editData.rule.voiceId,
- index: this.editData.index,
- };
+ index: this.editData.index
+ }
+ this.soundList.forEach((item) => {
+ if (item.id == this.editData.rule.voiceId) {
+ this.ruleForm.voiceId = item.id
+ this.ruleForm.voice = item
+ }
+ })
},
getSounds() {
- let _this = this;
+ let _this = this
getSoundList()
.then((res) => {
if (res.success) {
- _this.soundList = [{ id: "", name: "绌�", path: "" }].concat(
- res.data
- );
+ _this.soundList = [{ id: "", name: "绌�", path: "" }].concat(res.data.voices)
+ if (_this.editData.type) {
+ _this.initEditData()
+ }
}
})
- .catch((e) => console.log(e));
+ .catch((e) => console.log(e))
},
selSound(sound) {
- this.soundPath = sound.path;
- this.ruleForm.voiceId = sound.id;
- this.togglePlay = true;
- this.eventAudio.pause();
- this.$forceUpdate();
+ this.soundPath = sound.path
+ this.ruleForm.voiceId = sound.id
+ this.togglePlay = true
+ this.eventAudio.pause()
+ this.$forceUpdate()
// this.eventAudio.
},
togglePlayer() {
if (!this.soundPath) {
this.$notify({
type: "info",
- message: "璇峰厛閫夋嫨涓�涓０闊�!",
- });
- return false;
+ message: "璇峰厛閫夋嫨涓�涓０闊�!"
+ })
+ return false
}
- this.eventAudio.src = this.soundPath;
+ this.eventAudio.src = this.soundPath
if (this.togglePlay) {
- this.eventAudio.play();
- this.togglePlay = false;
+ this.eventAudio.play()
+ this.togglePlay = false
} else {
- this.eventAudio.pause();
- this.togglePlay = true;
+ this.eventAudio.pause()
+ this.togglePlay = true
}
},
close() {
- this.$emit("close");
+ this.$emit("close")
},
save() {
- this.$emit("save", {
- action: this.editData.type ? "edit" : "add",
- data: this.ruleForm,
- });
- },
- },
-};
+ this.$refs["form"].validate((valid) => {
+ if (valid) {
+ this.$emit("save", {
+ action: this.editData.type ? "edit" : "add",
+ data: this.ruleForm
+ })
+ } else {
+ return false
+ }
+ })
+ }
+ }
+}
</script>
<style lang="scss" scoped>
@@ -233,7 +265,7 @@
background-color: #fff;
box-shadow: 0px 2px 16px 0px rgba(0, 43, 106, 0.25);
- z-index: 2;
+ z-index: 2002;
.title {
box-sizing: border-box;
@@ -308,4 +340,4 @@
}
}
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.8.0