From b94da8f63e4e614d62d88fedad79db4b3952db20 Mon Sep 17 00:00:00 2001 From: sd <shidong@jhsoft.cc> Date: 星期四, 31 七月 2025 10:03:31 +0800 Subject: [PATCH] 检测内容、预警规则整合进系统设置里边; 预警规则增加图标; 摄像机配置样式调整、预警规则更名为任务描述并调整数据结构; 实时监控右侧样式调整,预警数据按所有任务进行筛选。 --- src/pages/cameraAccess/components/SceneRule.vue | 163 +++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 119 insertions(+), 44 deletions(-) diff --git a/src/pages/cameraAccess/components/SceneRule.vue b/src/pages/cameraAccess/components/SceneRule.vue index d061e72..8bfea00 100644 --- a/src/pages/cameraAccess/components/SceneRule.vue +++ b/src/pages/cameraAccess/components/SceneRule.vue @@ -1,7 +1,7 @@ <template> <div class="scene-edit-container"> <div class="scene-title"> - <b style="font-size: 14px; line-height: 18px">鐫f煡浠诲姟</b> + <b style="font-size: 14px; line-height: 18px">AI浠诲姟</b> <el-button type="primary" size="mini" @click="handleCreate" style="margin-left: 90%" v-show="!editScene && TreeDataPool.selectedNode.type !== 'MENU'">+ 娣诲姞浠诲姟</el-button> </div> @@ -9,8 +9,13 @@ <el-form ref="form" label-width="80px" v-show="editScene"> <div class="flex-form"> <div class="left"> - <el-form-item label="浠诲姟鍚嶇О"> - <el-input v-model="sceneForm.scene_name" size="mini" maxlength="15"></el-input> + <el-form-item label="鍥炬爣"> + <!-- 鍥剧墖棰勮 --> + <div class="icon-preview-container"> + <el-image v-if="sceneForm.iconUrl" :src="sceneForm.iconUrl" fit="cover" /> + <!-- <el-image v-else src="@/assets/img/瀹瑰櫒@1x.png" fit="cover" /> --> + <img style="width: 60px;" v-else src="@/assets/img/瀹瑰櫒@1x.png" /> + </div> </el-form-item> <el-form-item label="浜嬩欢绛夌骇"> <el-select v-model="sceneForm.alarm_level" placeholder="璇烽�夋嫨" size="mini" style="width: 250px"> @@ -22,36 +27,47 @@ </el-select> </el-form-item> <el-form-item label="鏃堕棿娈�"> - <el-select v-model="sceneForm.workingTimes" placeholder="璇烽�夋嫨" size="mini"> + <el-select v-model="sceneForm.workTimeId" placeholder="璇烽�夋嫨" size="mini"> <el-option v-for="item in VideoManageData.TimeRules" :key="item.id" :label="item.name" :value="item.id"></el-option> </el-select> </el-form-item> <!-- 妫�娴嬪唴瀹� --> - <el-form-item label="妫�娴嬪唴瀹�"> + <!-- <el-form-item label="妫�娴嬪唴瀹�"> <el-select v-model="sceneForm.checkContents" multiple placeholder="璇烽�夋嫨" size="mini"> <el-option v-for="item in VideoManageData.checkOptions" :key="item.checkId" :label="item.fileName" :value="item.checkId"></el-option> </el-select> - </el-form-item> + </el-form-item> --> </div> <div class="right"> - <el-form-item label="浠诲姟鎻忚堪"> - <el-input v-model="sceneForm.desc" type="textarea" size="mini"></el-input> + + <el-form-item label="浠诲姟鍚嶇О"> + <el-input v-model="sceneForm.scene_name" size="mini" maxlength="15"></el-input> </el-form-item> <!-- 棰勮瑙勫垯 --> - <el-form-item label="棰勮瑙勫垯"> - <el-select v-model="sceneForm.warningRules" placeholder="璇烽�夋嫨" size="mini" multiple> + <el-form-item label="浠诲姟鎻忚堪"> + <!-- <el-select v-model="sceneForm.warningRules" placeholder="璇烽�夋嫨" size="mini" multiple> <el-option v-for="item in VideoManageData.ruleOptions" :key="item.ruleId" :label="item.fileName" :value="item.ruleId"></el-option> - </el-select> + </el-select> --> + <!-- <el-select v-model="sceneForm.warningRules" placeholder="璇烽�夋嫨" size="mini" filterable> + <el-option v-for="item in VideoManageData.ruleOptions" :key="item.ruleId" :label="item.fileName" + :value="item.ruleId"></el-option> + </el-select> --> + <ruleSelect :initial-rules="VideoManageData.ruleOptions" :selected-rule="currentRule" + @rule-selected="handleRuleSelect" + @rule-created="handleRuleCreate" /> </el-form-item> <!-- 鐭ヨ瘑搴� --> - <el-form-item label="鐭ヨ瘑搴�" size="mini"> + <el-form-item label="鍏宠仈鐭ヨ瘑搴�" size="mini"> <el-cascader v-model="sceneForm.knowsList" :options="VideoManageData.knowsList" :props="knowledgeProps" clearable filterable placeholder="璇烽�夋嫨" class="knowledge-cascader" :show-all-levels="false"></el-cascader> + </el-form-item> + <el-form-item label="澶囨敞"> + <el-input v-model="sceneForm.desc" type="textarea" size="mini"></el-input> </el-form-item> <!-- <el-form-item label="浜嬩欢澹伴煶"> <el-select @@ -133,22 +149,22 @@ {{ tag.name }}</span> </template> </el-table-column> - <el-table-column label="妫�娴嬪唴瀹�" prop="checkContent" align="center"> + <!-- <el-table-column label="妫�娴嬪唴瀹�" prop="checkContent" align="center"> <template slot-scope="scope"> {{(scope.row.checkContent || []).map(r => r.fileName).join(' / ') || ''}} </template> - </el-table-column> - <el-table-column label="棰勮瑙勫垯" prop="warningRule" align="center"> + </el-table-column> --> + <el-table-column label="浠诲姟鎻忚堪" prop="warningRule" align="center"> <template slot-scope="scope"> {{(scope.row.warningRule || []).map(r => r.fileName).join(' / ') || ''}} </template> </el-table-column> - <el-table-column label="鐭ヨ瘑搴�" prop="knowledge" align="center"> + <el-table-column label="鍏宠仈鐭ヨ瘑搴�" prop="knowledge" align="center"> <template slot-scope="scope"> {{(scope.row.knowledge || []).map(r => r.fileName).join(' / ') || ''}} </template> </el-table-column> - <el-table-column label="鎻忚堪" prop="desc" align="center" min-width="120"></el-table-column> + <el-table-column label="澶囨敞" prop="desc" align="center" min-width="120"></el-table-column> <!-- <el-table-column label="鐘舵��" align="center" width="90"> <template slot-scope="scope"> <el-switch v-model="scope.row.defence_state" @change="updateDefence(scope.row)"></el-switch> @@ -181,12 +197,14 @@ import RuleEditor from "@/components/subComponents/RuleEditor"; import SceneEditor from "./scene/Editor"; import { getSoundList } from "@/api/event"; +import ruleSelect from "../components/ruleSelect/ruleSelect.vue"; import { forEach } from "jszip"; export default { name: "SceneRuleEditor", components: { SceneEditor, + ruleSelect, }, props: { seletedCameras: { @@ -240,6 +258,7 @@ }, data() { return { + currentRule:null,// 鍒濆鏃犻�変腑瑙勫垯 knowledgeProps: { multiple: true, // 鏀寔澶氶�� value: 'id', // 鎸囧畾閫夐」鍊煎瓧娈� @@ -260,7 +279,6 @@ }, templateSdks: [], templateRules: "", - ruleList: [], sceneNameStore: [], eventAudio: new Audio(), soundList: [], @@ -268,6 +286,19 @@ }; }, methods: { + handleRuleSelect(rule) { + // console.log('閫変腑瑙勫垯:', rule); + this.sceneForm.warningRules = [rule.ruleId] + this.sceneForm.ruleName = null + // 鎵ц棰勮鍒ゆ柇閫昏緫 + }, + handleRuleCreate(newRule) { + // console.log('鍒涘缓鏂拌鍒�:', newRule); + this.sceneForm.ruleName = newRule.fileName + this.sceneForm.warningRules = [] + this.sceneForm.rules = [] + // 灏嗘柊瑙勫垯淇濆瓨鍒板悗绔� + }, getSoundById(id) { if (id) { let sound = this.soundList.find((item) => item.id == id); @@ -350,8 +381,8 @@ voice: {}, voiceId: "", }; - this.$refs.sceneEditor.cleanRule(); - this.$refs.sceneEditor.getSdkConnection(); + // this.$refs.sceneEditor.cleanRule(); + // this.$refs.sceneEditor.getSdkConnection(); }, handleCreate() { if (this.linkRule && this.TreeDataPool.selectedNodes.length < 2) { @@ -426,6 +457,11 @@ this.templateSdks = selectedTpl.sdks; this.templateRules = JSON.stringify(scene.rules); + this.sceneForm.iconUrl = this.VideoManageData.ruleOptions.find(rue => + rue.ruleId === scene.warningRule[0].ruleId + ).iconUrl + this.currentRule = this.sceneForm.warningRule[0] + console.info(this.currentRule) // this.$refs.sceneEditor.editHandle(this.templateRules);//绠楁硶鐩稿叧 }, @@ -442,31 +478,34 @@ message: "浜嬩欢绛夌骇涓嶈兘涓虹┖", }); return false; - } else if (!this.sceneForm.workingTimes) { + } else if (!this.sceneForm.workTimeId) { this.$notify({ type: "warning", message: "鏃堕棿娈典笉鑳戒负绌�", }); return false; - } else if (!this.sceneForm.checkContents) { - this.$notify({ - type: "warning", - message: "妫�娴嬪唴瀹逛笉鑳戒负绌�", - }); - return false; - } else if (!this.sceneForm.workingTimes) { + } + // else if (!this.sceneForm.checkContents) { + // this.$notify({ + // type: "warning", + // message: "妫�娴嬪唴瀹逛笉鑳戒负绌�", + // }); + // return false; + // } + else if (!this.sceneForm.warningRules) { this.$notify({ type: "warning", message: "棰勮瑙勫垯涓嶈兘涓虹┖", }); return false; - } else if (!this.sceneForm.knowsList) { - this.$notify({ - type: "warning", - message: "鐭ヨ瘑搴撲笉鑳戒负绌�", - }); - return false; } + // else if (!this.sceneForm.knowsList) { + // this.$notify({ + // type: "warning", + // message: "鐭ヨ瘑搴撲笉鑳戒负绌�", + // }); + // return false; + // } return true; }, saveSceneRule() { @@ -487,21 +526,26 @@ // labelName: timeOption ? timeOption.name : '' // } // }) - const fileIds = this.sceneForm.knowsList.map( - path => { - // 鎻愬彇鏈�鍚庝竴绾х殑鏂囦欢ID骞惰浆鎹负鏁板瓧 - const id = path[path.length - 1]; - return Number(id); // 鎴栬�呬娇鐢� parseInt(id) 鎴� +id - } - ) + let fileIds = [] + if (this.sceneForm.knowsList) { + fileIds = this.sceneForm.knowsList.map( + path => { + // 鎻愬彇鏈�鍚庝竴绾х殑鏂囦欢ID骞惰浆鎹负鏁板瓧 + const id = path[path.length - 1]; + return Number(id); // 鎴栬�呬娇鐢� parseInt(id) 鎴� +id + } + ) + } this.sceneForm.taskName = this.sceneForm.scene_name this.sceneForm.eventLevel = this.sceneForm.alarm_level - this.sceneForm.checks = this.sceneForm.checkContents + // this.sceneForm.checks = this.sceneForm.checkContents + this.sceneForm.checks = [this.VideoManageData.checkOptions[0].checkId] this.sceneForm.rules = this.sceneForm.warningRules // this.sceneForm.workTimes = workTimes - this.sceneForm.workTimeId = this.sceneForm.workingTimes this.sceneForm.taskDescription = this.sceneForm.desc this.sceneForm.knows = fileIds, + + // console.info(this.sceneForm) this.onSaveScene(this.sceneForm); }, @@ -547,6 +591,34 @@ </script> <style lang="scss"> +.icon-preview-container { + margin-right: 240px; + width: 60px; + height: 60px; + border: 1px dashed #d9d9d9; + border-radius: 6px; + cursor: pointer; + position: relative; + overflow: hidden; + display: flex; + justify-content: center; + align-items: center; + + .el-image { + width: 100%; + height: 100%; + } + + .el-icon-plus { + font-size: 28px; + color: #8c939d; + } + + &:hover { + border-color: #409EFF; + } +} + .scene-edit-container { .scene-title { height: 30px; @@ -570,6 +642,8 @@ .el-form-item__label { text-align: left; + // min-width: 82px; + font-size: 13px; } .el-form-item__content { @@ -582,7 +656,8 @@ } textarea { - height: 92px; + height: 72px; + width: 400px; } } -- Gitblit v1.8.0