From e116bdd983b4a456c866119666e41bbaab4f7293 Mon Sep 17 00:00:00 2001 From: ZZJ <10913410+zzj2100@user.noreply.gitee.com> Date: 星期五, 15 七月 2022 16:42:08 +0800 Subject: [PATCH] 禅道bug --- src/components/canvas/Dialog.vue | 580 +++++---- vue.config.js | 4 src/pages/cameraAccess/components/TimeSlider.vue | 164 + src/components/cardWindow.vue | 239 ++- src/pages/library/components/addBase.vue | 2 src/api/baseLibrary.ts | 8 src/pages/visual/components/subComponents/CardItem2.vue | 455 ++++++-- src/pages/ai/index/App.vue | 25 src/pages/ai/index/detail.vue | 10 src/pages/library/components/carList.vue | 32 src/components/subComponents/CardItem.vue | 615 +++++++--- src/pages/syslog/views/pollingLog.vue | 4 src/components/subComponents/FileUpload/index.vue | 2 src/api/search.ts | 9 src/pages/cameraAccess/components/SeparateRules.vue | 7 src/pages/search/index/Searching.vue | 46 src/pages/index/components/formAccount.vue | 2 src/pages/library/components/baseList.vue | 156 +- src/components/wasmPlayer/index.vue | 2 src/components/subComponents/FileUpload/btn.vue | 41 src/pages/cameraAccess/components/DataStackInfo.vue | 655 +++++++---- src/pages/cameraAccess/components/SceneRule.vue | 3 src/pages/library/index/App.vue | 127 +- src/components/subComponents/MultiRangeSlider.vue | 127 + src/pages/cameraAccess/index/VideoManage.vue | 2 src/pages/library/components/personList.vue | 1 src/pages/settings/views/generalSettings.vue | 7 src/Pool/VideoPhotoData.ts | 8 28 files changed, 2,152 insertions(+), 1,181 deletions(-) diff --git a/src/Pool/VideoPhotoData.ts b/src/Pool/VideoPhotoData.ts index 1063f21..14abc0d 100644 --- a/src/Pool/VideoPhotoData.ts +++ b/src/Pool/VideoPhotoData.ts @@ -48,6 +48,7 @@ public uploadDiaplay: boolean = false; public uploadType: boolean = false; public dataSource: string = 'camera'; + public collection: string = '' constructor() { this.cards = []; @@ -61,6 +62,7 @@ this.tasks = []; this.treeNodes = []; this.dataSource = 'camera' + this.collection = '' } clearStatus() { @@ -85,7 +87,8 @@ tabs: this.queryTabs, tasks: this.queryTasks, treeNodes: this.treeNodes, - dataSource:this.dataSource + dataSource:this.dataSource, + collection:this.collection } if (this.searchFrom == 'cluster') { param.isAll = true @@ -206,7 +209,8 @@ databases: this.compareTabs, compareNum: this.compareNum, threshold: this.threshold, - isAll: this.searchFrom == "cluster" ? true : false + isAll: this.searchFrom == "cluster" ? true : false, + collection:this.collection } const rsp: any = await findPerson(param); if (rsp && rsp.success) { diff --git a/src/api/baseLibrary.ts b/src/api/baseLibrary.ts index c293f22..5ffc1d5 100644 --- a/src/api/baseLibrary.ts +++ b/src/api/baseLibrary.ts @@ -257,3 +257,11 @@ params: query }) } + +// 杞﹁締鐩稿叧鐨勫瓧鍏� +export const dicByType = () => { + return request({ + url: "/data/api-v/dbperson/dicByType", + method: "get", + }) +} diff --git a/src/api/search.ts b/src/api/search.ts index 9e685f9..83a310e 100644 --- a/src/api/search.ts +++ b/src/api/search.ts @@ -60,4 +60,13 @@ method: "post", data: query }); +}; + +// 鍏虫敞 +export const collect = (query: any) => { + return request({ + url: " /data/api-v/es/collect", + method: "post", + data: query + }); }; \ No newline at end of file diff --git a/src/components/canvas/Dialog.vue b/src/components/canvas/Dialog.vue index da99d2b..9e743eb 100644 --- a/src/components/canvas/Dialog.vue +++ b/src/components/canvas/Dialog.vue @@ -5,19 +5,28 @@ ref="remarksName" v-model="delCursor.remarksName" size="mini" - style="margin-left: 90px;margin-top: 15px; width: 150px; position:relation;" + style=" + margin-left: 90px; + margin-top: 15px; + width: 150px; + position: relation; + " placeholder="鍥惧舰澶囨敞" @change="changeName" ></el-input> </p> - <el-row style="margin-top:10px"> - <el-col :span="2" style="position:relative;margin-top:10px"> - <el-tooltip content="鍒囨崲鍒版鐘舵�佸悗鍙�変腑宸茬敾鍥惧舰" placement="left" popper-class="atooltip"> + <el-row style="margin-top: 10px"> + <el-col :span="2" style="position: relative; margin-top: 10px"> + <el-tooltip + content="鍒囨崲鍒版鐘舵�佸悗鍙�変腑宸茬敾鍥惧舰" + placement="left" + popper-class="atooltip" + > <el-button class="btn" @click="changeType('0')" :disabled="disableSelect" - :style="type == '0'? 'border:2px solid #0066eb':''" + :style="type == '0' ? 'border:2px solid #0066eb' : ''" > <i class="iconfont iconshou"></i> </el-button> @@ -26,9 +35,13 @@ content="鐩寸嚎" placement="left" popper-class="atooltip" - :style="type == '1'? 'border:2px solid #0066eb':''" + :style="type == '1' ? 'border:2px solid #0066eb' : ''" > - <el-button class="btn" @click="changeType('1')" :disabled="disableLine"> + <el-button + class="btn" + @click="changeType('1')" + :disabled="disableLine" + > <i class="iconfont iconzhixian"></i> </el-button> </el-tooltip> @@ -36,9 +49,13 @@ content="鐭╁舰" placement="left" popper-class="atooltip" - :style="type == '2'? 'border:2px solid #0066eb':''" + :style="type == '2' ? 'border:2px solid #0066eb' : ''" > - <el-button class="btn" @click="changeType('2')" :disabled="disableRect"> + <el-button + class="btn" + @click="changeType('2')" + :disabled="disableRect" + > <i class="iconfont iconlegend-base"></i> </el-button> </el-tooltip> @@ -46,9 +63,13 @@ content="绠ご" placement="left" popper-class="atooltip" - :style="type == '4'? 'border:2px solid #0066eb':''" + :style="type == '4' ? 'border:2px solid #0066eb' : ''" > - <el-button class="btn" @click="changeType('4')" :disabled="disableArrow"> + <el-button + class="btn" + @click="changeType('4')" + :disabled="disableArrow" + > <i class="iconfont iconrighttop"></i> </el-button> </el-tooltip> @@ -56,29 +77,54 @@ content="澶氳竟褰細鍙屽嚮缁撴潫缁樺埗" placement="left" popper-class="atooltip" - :style="type == '5'? 'border:2px solid #0066eb':''" + :style="type == '5' ? 'border:2px solid #0066eb' : ''" > - <el-button @click="changeType('5')" class="btn" :disabled="disablePolygon"> + <el-button + @click="changeType('5')" + class="btn" + :disabled="disablePolygon" + > <i class="iconfont iconduobianxing"></i> </el-button> </el-tooltip> - <el-tooltip content="閫変腑鍥惧舰鍐嶇紪杈戦噸缁橈紝閲嶇粯鐨勫浘褰繚鐣欎箣鍓嶇殑鍚嶇О" placement="left" popper-class="atooltip"> + <el-tooltip + content="閫変腑鍥惧舰鍐嶇紪杈戦噸缁橈紝閲嶇粯鐨勫浘褰繚鐣欎箣鍓嶇殑鍚嶇О" + placement="left" + popper-class="atooltip" + > <el-button class="btn" @click="edit()" :disabled="disableSelect"> <i class="iconfont iconxiugaitubiao1"></i> </el-button> </el-tooltip> - <el-tooltip content="鍏堥�変腑鍥惧舰锛屽啀鍒犻櫎" placement="left" popper-class="atooltip"> + <el-tooltip + content="鍏堥�変腑鍥惧舰锛屽啀鍒犻櫎" + placement="left" + popper-class="atooltip" + > <el-button class="btn" @click="del()" :disabled="disableSelect"> <i class="iconfont iconshanchu5"></i> </el-button> </el-tooltip> - <el-tooltip content="娓呯┖鎵�鏈夊凡鐢诲浘褰紝姝ゆ搷浣滀笉鍙挙閿�" placement="left" popper-class="atooltip"> + <el-tooltip + content="娓呯┖鎵�鏈夊凡鐢诲浘褰紝姝ゆ搷浣滀笉鍙挙閿�" + placement="left" + popper-class="atooltip" + > <el-button class="btn" @click="clear()" :disabled="disableSelect"> <i class="iconfont iconqingkong"></i> </el-button> </el-tooltip> - <el-tooltip content="鎾ら攢涓婁竴姝ユ搷浣�" placement="left" popper-class="atooltip"> - <el-button class="btn" @click="del()" :disabled="disableSelect" style="border:0px"> + <el-tooltip + content="鎾ら攢涓婁竴姝ユ搷浣�" + placement="left" + popper-class="atooltip" + > + <el-button + class="btn" + @click="undo()" + :disabled="disableSelect" + style="border: 0px" + > <i class="iconfont iconfanhui1" style="font-size: 2rem"></i> </el-button> <!-- <span @@ -90,20 +136,30 @@ </el-tooltip> <!-- <el-button type="default" @click="undo()">鎾ら攢</el-button> --> </el-col> - <el-col :span="22" style="position:relative;width:980px;padding-left:10px"> + <el-col + :span="22" + style="position: relative; width: 980px; padding-left: 10px" + > <canvas id="canvasDialog" ref="canvasDialog" width="960" height="540" - :style=" - `position:static;background:url(${snapshot_url}) 0% 0%/960px 540px no-repeat;` - " + :style="`position:static;background:url(${snapshot_url}) 0% 0%/960px 540px no-repeat;`" ></canvas> <p - style="position:absolute;width:350px;left:80px;top:90px;color:white;font-size:1.5rem" + style=" + position: absolute; + width: 350px; + left: 80px; + top: 90px; + color: white; + font-size: 1.5rem; + " :style="disabled ? `display:block;` : `display:none;`" - >鎵归噺閰嶇疆鏂瑰紡涓嶅厑璁哥粯鍒跺尯鍩燂紝璇烽�夋嫨鎽勫儚鏈鸿繘琛屽尯鍩熺粯鍒�</p> + > + 鎵归噺閰嶇疆鏂瑰紡涓嶅厑璁哥粯鍒跺尯鍩燂紝璇烽�夋嫨鎽勫儚鏈鸿繘琛屽尯鍩熺粯鍒� + </p> <!-- <span class="iconfont icongengxin" @click="refresh" @@ -139,7 +195,7 @@ line: [], rect: [], // {id:'uuid', name: '鐭╁舰1', location: [{ x: 20, y: 30 }, { x: 20, y: 60 }, { x: 100, y: 60 }, { x: 100, y: 30 }] } arrow: [], - polygon: [] + polygon: [], }, // canvasData: this.canvasDataToChild, // 鏈�缁堣緭鍑虹殑鐢诲竷鍧愭爣鏁版嵁 originX: null, // 褰撳墠鐐瑰嚮鐐箈 @@ -151,7 +207,7 @@ c: null, ctx: null, inputWidth: 80, - oldName: "" // 鐢ㄦ潵鏆傚瓨鏇存敼涔嬪墠鐨剅emarksName,鏂逛究鏀捐繘鎾ら攢闃熷垪閲� + oldName: "", // 鐢ㄦ潵鏆傚瓨鏇存敼涔嬪墠鐨剅emarksName,鏂逛究鏀捐繘鎾ら攢闃熷垪閲� }; }, mounted() { @@ -165,14 +221,14 @@ } this.oldName = oldVal.remarksName; }, - deep: true + deep: true, }, snapshot_url: { handler(newVal, oldVal) { if (newVal !== oldVal) { // console.log(newVal, 'canvasDialog') } - } + }, }, canvasDataToChild: { handler(newVal, oldVal) { @@ -186,11 +242,11 @@ this.step++; this.canvasHistory.push({ type: 0, - src: this.c.toDataURL("image/png") + src: this.c.toDataURL("image/png"), }); }, - deep: true - } + deep: true, + }, // canvasDataToChild: function(newVal, oldVal) { // this.init() // } @@ -199,7 +255,7 @@ // 鍒濆鍖栧嚱鏁� init() { //this.c = document.querySelector("#canvasDialog"); - this.c = this.$refs['canvasDialog']; + this.c = this.$refs["canvasDialog"]; this.ctx = this.c.getContext("2d"); this.drawCanvasInit(); this.canvasData = JSON.parse(JSON.stringify(this.canvasDataToChild)); @@ -209,16 +265,16 @@ this.step++; this.canvasHistory.push({ type: 0, - src: this.c.toDataURL("image/png") + src: this.c.toDataURL("image/png"), }); - this.delCursor = { type: -1, index: -1, remarksName: "", id: "" } + this.delCursor = { type: -1, index: -1, remarksName: "", id: "" }; console.log("鐢诲竷鍒濆鍖�"); }, // 鍙栨秷鐢诲竷娓呴櫎鐘舵�佸嚱鏁� cancel() { - this.changeType('0') - this.undisabled() + this.changeType("0"); + this.undisabled(); //this.delCursor = {} this.delCursor = { type: -1, index: -1, remarksName: "", id: "" }; this.canvasHistory.length = 0; @@ -230,19 +286,19 @@ this.step++; this.canvasHistory.push({ type: 0, - src: this.c.toDataURL("image/png") + src: this.c.toDataURL("image/png"), }); }, // 涓荤洃鍚祦绋� drawCanvasInit() { - window.addEventListener("keydown", e => { + window.addEventListener("keydown", (e) => { let keyID = e.keyCode ? e.keyCode : e.which; if (keyID === 82) { // r閿� this.undo(); } }); - this.c.addEventListener("mousedown", e => { + this.c.addEventListener("mousedown", (e) => { if (this.type !== "0") { this.flag = true; this.originX = e.offsetX; // 榧犳爣钀戒笅鏃剁殑X @@ -251,30 +307,30 @@ // 缁樺埗澶氳竟褰� this.points.push({ x: this.originX, - y: this.originY + y: this.originY, }); } } else { this.clickSelect(e); } }); - this.c.addEventListener("mousemove", e => { + this.c.addEventListener("mousemove", (e) => { switch (this.type) { case "1": - this.drawLine(e) + this.drawLine(e); break; case "2": - this.drawRect(e) + this.drawRect(e); break; case "4": - this.drawArrow(e) + this.drawArrow(e); break; case "5": - this.drawPolygon(e) + this.drawPolygon(e); break; } }); - this.c.addEventListener("mouseup", e => { + this.c.addEventListener("mouseup", (e) => { switch (this.type) { case "1": // 鐩寸嚎 @@ -290,7 +346,7 @@ break; } }); - this.c.addEventListener("dblclick", e => { + this.c.addEventListener("dblclick", (e) => { if (this.type === "5") { // 缁樺埗澶氳竟褰� this.polygonDblclick(e); @@ -309,9 +365,9 @@ this.canvasData.polygon.length = 0; this.canvasHistory.length = 0; - this.indexInit() - this.freedEdit() - this.delCursor = {} + this.indexInit(); + this.freedEdit(); + this.delCursor = {}; this.step = -1; }, // 淇敼鍥惧舰鍚嶇О @@ -320,27 +376,23 @@ switch (this.delCursor.type) { case "1": this.oldName = this.canvasData.line[this.delCursor.index].name; - this.canvasData.line[ - this.delCursor.index - ].name = this.delCursor.remarksName; + this.canvasData.line[this.delCursor.index].name = + this.delCursor.remarksName; break; case "2": this.oldName = this.canvasData.rect[this.delCursor.index].name; - this.canvasData.rect[ - this.delCursor.index - ].name = this.delCursor.remarksName; + this.canvasData.rect[this.delCursor.index].name = + this.delCursor.remarksName; break; case "4": this.oldName = this.canvasData.arrow[this.delCursor.index].name; - this.canvasData.arrow[ - this.delCursor.index - ].name = this.delCursor.remarksName; + this.canvasData.arrow[this.delCursor.index].name = + this.delCursor.remarksName; break; case "5": this.oldName = this.canvasData.polygon[this.delCursor.index].name; - this.canvasData.polygon[ - this.delCursor.index - ].name = this.delCursor.remarksName; + this.canvasData.polygon[this.delCursor.index].name = + this.delCursor.remarksName; break; } this.clickSelect(); @@ -349,33 +401,29 @@ type: this.delCursor.type, src: this.c.toDataURL("image/png"), index: this.delCursor.index, - name: this.oldName + name: this.oldName, }); } else { this.$notify({ type: "warning", - message: "鍛藉悕闀垮害涓嶈兘瓒呰繃6涓瓧锛�" + message: "鍛藉悕闀垮害涓嶈兘瓒呰繃6涓瓧锛�", }); switch (this.delCursor.type) { case "1": - this.delCursor.remarksName = this.canvasData.line[ - this.delCursor.index - ].name; + this.delCursor.remarksName = + this.canvasData.line[this.delCursor.index].name; break; case "2": - this.delCursor.remarksName = this.canvasData.rect[ - this.delCursor.index - ].name; + this.delCursor.remarksName = + this.canvasData.rect[this.delCursor.index].name; break; case "4": - this.delCursor.remarksName = this.canvasData.arrow[ - this.delCursor.index - ].name; + this.delCursor.remarksName = + this.canvasData.arrow[this.delCursor.index].name; break; case "5": - this.delCursor.remarksName = this.canvasData.polygon[ - this.delCursor.indexhhhhhhhhhhh - ].name; + this.delCursor.remarksName = + this.canvasData.polygon[this.delCursor.indexhhhhhhhhhhh].name; break; } } @@ -390,7 +438,7 @@ type: this.delCursor.type, src: this.c.toDataURL("image/png"), index: this.delCursor.index, - data: delEle + data: delEle, }); }, // 鍒犻櫎鍏冪礌 @@ -421,7 +469,7 @@ src: this.c.toDataURL("image/png"), index: this.delCursor.index, deleteLength: 0, // 鍒犻櫎鐨勮瘽deleteLength涓�0 - data: delEle + data: delEle, }); // console.log(this.canvasHistory, "鍒犻櫎涔嬪悗鐨勬挙閿�闃熷垪"); }, @@ -432,37 +480,52 @@ delEle = { id: this.canvasData.line[this.delCursor.index].id, name: this.canvasData.line[this.delCursor.index].name, - location: this.canvasData.line[this.delCursor.index].location - } + location: this.canvasData.line[this.delCursor.index].location, + }; // this.canvasData.line.splice(this.delCursor.index, 1); - this.canvasData.line[this.delCursor.index].location = [{ x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }] + this.canvasData.line[this.delCursor.index].location = [ + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + ]; break; case "2": delEle = { id: this.canvasData.rect[this.delCursor.index].id, name: this.canvasData.rect[this.delCursor.index].name, - location: this.canvasData.rect[this.delCursor.index].location - } - // this.canvasData.rect.splice(this.delCursor.index, 1); - this.canvasData.rect[this.delCursor.index].location = [{ x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }] + location: this.canvasData.rect[this.delCursor.index].location, + }; + // this.canvasData.rect.splice(this.delCursor.index, 1); + this.canvasData.rect[this.delCursor.index].location = [ + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + ]; break; case "4": delEle = { id: this.canvasData.arrow[this.delCursor.index].id, name: this.canvasData.arrow[this.delCursor.index].name, - location: this.canvasData.arrow[this.delCursor.index].location - } - // this.canvasData.arrow.splice(this.delCursor.index, 1); - this.canvasData.arrow[this.delCursor.index].location = [{ x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }] + location: this.canvasData.arrow[this.delCursor.index].location, + }; + // this.canvasData.arrow.splice(this.delCursor.index, 1); + this.canvasData.arrow[this.delCursor.index].location = [ + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + ]; break; case "5": delEle = { id: this.canvasData.polygon[this.delCursor.index].id, name: this.canvasData.polygon[this.delCursor.index].name, - location: this.canvasData.polygon[this.delCursor.index].location - } - // this.canvasData.polygon.splice(this.delCursor.index, 1); - this.canvasData.polygon[this.delCursor.index].location = [{ x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }, { x: delEle.location[0].x, y: delEle.location[0].y }] + location: this.canvasData.polygon[this.delCursor.index].location, + }; + // this.canvasData.polygon.splice(this.delCursor.index, 1); + this.canvasData.polygon[this.delCursor.index].location = [ + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + { x: delEle.location[0].x, y: delEle.location[0].y }, + ]; break; } this.clickSelect(); @@ -471,22 +534,22 @@ type: this.delCursor.type, src: this.c.toDataURL("image/png"), index: this.delCursor.index, - deleteLength: 1, // 缂栬緫鐨勮瘽deleteLength涓�1 - data: delEle + deleteLength: 1, // 缂栬緫鐨勮瘽deleteLength涓�1 + data: delEle, }); this.editObj = { id: this.delCursor.id, type: this.delCursor.type, index: this.delCursor.index, - remarksName: this.delCursor.remarksName - } - this.disabledOthers(this.delCursor.type) + remarksName: this.delCursor.remarksName, + }; + this.disabledOthers(this.delCursor.type); // 鍒囨崲褰撳墠鐘舵�� - this.changeType(this.delCursor.type) + this.changeType(this.delCursor.type); this.$notify({ type: "warning", - message: "宸叉摝闄ゆ棫鐨勫尯鍩燂紝璇风洿鎺ョ粯鍒跺尯鍩�" - }) + message: "宸叉摝闄ゆ棫鐨勫尯鍩燂紝璇风洿鎺ョ粯鍒跺尯鍩�", + }); }, // 鐐瑰嚮閫変腑鍙樿壊 灏嗗綋鍓嶉〉闈㈡墍鏈夎矾寰勯噸缁樺垽鏂綋鍓嶉紶鏍囩殑鍧愭爣鍦ㄥ摢涓浘褰㈠唴 濡傛灉涓嶄紶鍧愭爣鍙傛暟灏辨槸鍥炴樉鐨勬柟娉� clickSelect(e) { @@ -522,7 +585,6 @@ } }); _this.canvasData.rect.forEach(function (v, i) { - _this.ctx.strokeStyle = "yellow"; _this.ctx.beginPath(); _this.ctx.moveTo(v.location[0].x, v.location[0].y); @@ -569,7 +631,10 @@ v.location[1].x, v.location[1].y, 20, - _this.twoPointDistance({ x: v.location[0].x, y: v.location[0].y }, { x: v.location[1].x, y: v.location[1].y }) * 0.1, + _this.twoPointDistance( + { x: v.location[0].x, y: v.location[0].y }, + { x: v.location[1].x, y: v.location[1].y } + ) * 0.1, 2, "yellow" ); // 缁樺埗鏂规硶 @@ -597,7 +662,10 @@ v.location[1].x, v.location[1].y, 20, - _this.twoPointDistance({ x: v.location[0].x, y: v.location[0].y }, { x: v.location[1].x, y: v.location[1].y }) * 0.1, + _this.twoPointDistance( + { x: v.location[0].x, y: v.location[0].y }, + { x: v.location[1].x, y: v.location[1].y } + ) * 0.1, 2, "red" ); // 缁樺埗鏂规硶 @@ -615,12 +683,7 @@ } _this.ctx.closePath(); _this.ctx.stroke(); - _this.showRemarks( - v.location[0].x, - v.location[0].y, - v.name, - false - ); + _this.showRemarks(v.location[0].x, v.location[0].y, v.name, false); _this.c.style.cursor = "pointer"; if (e && _this.minDistance(e.offsetX, e.offsetY, v.location, 10)) { // 濡傛灉浼犲叆浜嗕簨浠跺潗鏍囷紝灏辩敤isPointInStroke鍒ゆ柇涓�涓� @@ -640,12 +703,7 @@ } _this.ctx.closePath(); _this.ctx.stroke(); - _this.showRemarks( - v.location[0].x, - v.location[0].y, - v.name, - true - ); + _this.showRemarks(v.location[0].x, v.location[0].y, v.name, true); _this.c.style.cursor = "pointer"; } } @@ -654,6 +712,8 @@ }, // 鎾ら攢 undo() { + console.log(this.canvasHistory); + console.log(this.step); if (this.type === "5" && this.flag) { // 姝e湪鐢诲杈瑰舰锛屾殏瀛樻暟缁勯噷鏈夊潗鏍囨暟鎹紝鍙竴姝ヤ竴姝ユ挙閿� if (this.points.length > 0) { @@ -671,7 +731,7 @@ } } else { // 澶氳竟褰㈠凡缁忓畬鎴愭垨鑰呮槸鍦ㄧ敾鍒殑鍥惧舰 - if (this.step >= 0) { + if (this.step > 0) { if (this.canvasHistory[this.step].data !== undefined) { // 缂栬緫鍒犻櫎姝ラ鐨勬挙閿� 涔嬪墠鍒犻櫎鐨勬暟鎹師璺鍥炲幓 switch (this.canvasHistory[this.step].type) { @@ -716,14 +776,12 @@ // 淇敼鍥惧舰澶囨敞鐨勬挙閿� switch (this.canvasHistory[this.step].type) { case "1": - this.canvasData.line[ - this.canvasHistory[this.step].index - ].name = this.canvasHistory[this.step].name; + this.canvasData.line[this.canvasHistory[this.step].index].name = + this.canvasHistory[this.step].name; break; case "2": - this.canvasData.rect[ - this.canvasHistory[this.step].index - ].name = this.canvasHistory[this.step].name; + this.canvasData.rect[this.canvasHistory[this.step].index].name = + this.canvasHistory[this.step].name; break; case "4": this.canvasData.arrow[ @@ -746,6 +804,7 @@ this.step--; } else { // 姝e父鐨勬挙閿� + console.log("姝e父鐨勬挙閿�"); this.ctx.clearRect(0, 0, this.c.width, this.c.height); let canvasPic = new Image(); if (this.step > 0) { @@ -756,9 +815,12 @@ canvasPic.addEventListener("load", function () { ctx.drawImage(canvasPic, 0, 0); }); + console.log("娓呴櫎"); + // 鎾ら攢鏈�缁堟暟鎹� switch (this.canvasHistory[this.step].type) { - case "1": + case 1: + console.log("娓呴櫎绾�"); this.canvasData.line.pop(); break; case 2: @@ -782,57 +844,55 @@ } else { this.$notify({ type: "warning", - message: "涓嶈兘鍐嶇户缁挙閿�浜�" + message: "涓嶈兘鍐嶇户缁挙閿�浜�", }); } } // console.log("鎾ら攢锛�",this.canvasData); }, disabledOthers(type) { - - console.log("褰撳墠type:", type) + console.log("褰撳墠type:", type); switch (type) { case "1": - this.disableLine = false - this.disableRect = true - this.disableArrow = true - this.disablePolygon = true - this.disableSelect = true - break + this.disableLine = false; + this.disableRect = true; + this.disableArrow = true; + this.disablePolygon = true; + this.disableSelect = true; + break; case "2": - this.disableLine = true - this.disableRect = false - this.disableArrow = true - this.disablePolygon = true - this.disableSelect = true - break + this.disableLine = true; + this.disableRect = false; + this.disableArrow = true; + this.disablePolygon = true; + this.disableSelect = true; + break; case "4": - this.disableLine = true - this.disableRect = true - this.disableArrow = false - this.disablePolygon = true - this.disableSelect = true - break + this.disableLine = true; + this.disableRect = true; + this.disableArrow = false; + this.disablePolygon = true; + this.disableSelect = true; + break; case "5": - this.disableLine = true - this.disableRect = true - this.disableArrow = true - this.disablePolygon = false - this.disableSelect = true - break + this.disableLine = true; + this.disableRect = true; + this.disableArrow = true; + this.disablePolygon = false; + this.disableSelect = true; + break; } - console.log("绂佺敤鐩寸嚎锛�", this.disableLine) - console.log("绂佺敤鐭╁舰锛�", this.disableRect) - console.log("绂佺敤绠ご锛�", this.disableArrow) - console.log("绂佺敤澶氳竟褰細", this.disablePolygon) + console.log("绂佺敤鐩寸嚎锛�", this.disableLine); + console.log("绂佺敤鐭╁舰锛�", this.disableRect); + console.log("绂佺敤绠ご锛�", this.disableArrow); + console.log("绂佺敤澶氳竟褰細", this.disablePolygon); }, undisabled() { - - this.disableLine = false - this.disableRect = false - this.disableArrow = false - this.disablePolygon = false - this.disableSelect = false + this.disableLine = false; + this.disableRect = false; + this.disableArrow = false; + this.disablePolygon = false; + this.disableSelect = false; }, // 鍒锋柊搴曞浘 refresh() { @@ -857,7 +917,7 @@ width = typeof width !== "undefined" ? width : 1; // color = typeof color !== 'undefined' ? color : 'yellow' // 璁$畻鍚勮搴﹀拰瀵瑰簲鐨凱2,P3鍧愭爣 - + let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI; let angle1 = ((angle + theta) * Math.PI) / 180; let angle2 = ((angle - theta) * Math.PI) / 180; @@ -887,11 +947,10 @@ }, // 鑾峰彇鐩稿鍧愭爣(鏆備笉鐢�) getLocation(x, y, c) { - let bbox = c.getBoundingClientRect(); return { x: (x - bbox.left) * (c.width / bbox.width), - y: (y - bbox.top) * (c.height / bbox.height) + y: (y - bbox.top) * (c.height / bbox.height), /* * 姝ゅ涓嶇敤涓嬮潰涓よ鏄负浜嗛槻姝娇鐢–SS鍜孞S鏀瑰彉浜哻anvas鐨勯珮瀹戒箣鍚庢槸琛ㄩ潰绉媺澶ц�屽疄闄� * 鏄剧ず鍍忕礌涓嶅彉鑰岄�犳垚鐨勫潗鏍囪幏鍙栦笉鍑嗙殑鎯呭喌 @@ -902,7 +961,6 @@ }, // 鐢熸垚鍥惧舰澶囨敞 remarks(x, y, type) { - this.ctx.moveTo(x, y - 20); this.ctx.fillStyle = "green"; // 璁剧疆濉厖棰滆壊涓虹豢鑹� this.ctx.font = '20px "寰蒋闆呴粦"'; // 璁剧疆瀛椾綋 @@ -932,7 +990,6 @@ }, // 鍥炴樉鍥惧舰澶囨敞 showRemarks(x, y, remarks, isHightlight) { - this.ctx.moveTo(x, y - 20); if (isHightlight) { this.ctx.fillStyle = "#8ae22e"; // 璁剧疆濉厖棰滆壊涓虹豢鑹� @@ -946,7 +1003,6 @@ }, // 閲嶇幇淇濆瓨鐢婚潰 loadImage() { - if (this.step > -1) { let img = new Image(); img.src = this.canvasHistory[this.step].src; @@ -955,17 +1011,15 @@ }, // 鍒囨崲鐢荤嚎绫诲瀷 changeType(num) { - - if (num === '0') { + if (num === "0") { this.c.style.cursor = "pointer"; } else { - this.c.style.cursor = "crosshair" + this.c.style.cursor = "crosshair"; } this.type = num; }, // 缁樺埗澶氳竟褰㈡柟娉� drawPolygonUtil(points) { - this.ctx.strokeStyle = "yellow"; this.ctx.lineWidth = 2; this.ctx.beginPath(); @@ -992,7 +1046,6 @@ }, // 鐢荤煩褰㈢Щ鍔ㄥ嚱鏁� drawRect(e) { - if (this.flag) { this.ctx.clearRect(0, 0, this.c.width, this.c.height); this.loadImage(); @@ -1020,39 +1073,39 @@ e.offsetX, e.offsetY, 20, - this.twoPointDistance({ x: this.originX, y: this.originY }, { x: e.offsetX, y: e.offsetY }) * 0.1, + this.twoPointDistance( + { x: this.originX, y: this.originY }, + { x: e.offsetX, y: e.offsetY } + ) * 0.1, 2, "yellow" ); // 缁樺埗鏂规硶 } }, twoPointDistance(p1, p2) { - - let dep = Math.sqrt(Math.pow((p1.x - p2.x), 2) + Math.pow((p1.y - p2.y), 2)); + let dep = Math.sqrt(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2)); return dep; }, // 鐢诲杈瑰舰绉诲姩鍑芥暟 drawPolygon(e) { - if (this.flag) { this.ctx.clearRect(0, 0, this.c.width, this.c.height); this.loadImage(); this.pointsUndo = this.points.concat({ x: e.offsetX, - y: e.offsetY + y: e.offsetY, }); this.drawPolygonUtil( this.points.concat({ // concat杩斿洖杩炴帴鍚庣殑鏁扮粍锛屽師鏁扮粍涓嶅彉锛岀浉褰撲簬鎶婄Щ鍔ㄧ殑鍧愭爣浣滀负涓�涓櫄鍋囩殑鍧愭爣杩藉姞鍦ㄥ悗闈�,缁濓紒 x: e.offsetX, - y: e.offsetY + y: e.offsetY, }) ); } }, // 鐢荤洿绾挎姮璧� lineMouseUp(e) { - if ( Math.abs(this.originX - e.offsetX) < 5 && Math.abs(this.originY - e.offsetY) < 5 @@ -1061,55 +1114,54 @@ return; } this.flag = false; - let Id - let fileName + let Id; + let fileName; let coordinate = []; coordinate.push({ x: this.originX, - y: this.originY + y: this.originY, }); coordinate.push({ x: e.offsetX, - y: e.offsetY + y: e.offsetY, }); // console.log("line鐨別ditObj:",this.editObj) if (this.editObj.id == undefined) { - Id = this.getUuid() + Id = this.getUuid(); fileName = this.remarks(this.originX, this.originY, "1"); this.canvasData.line.push({ id: Id, name: fileName, - location: coordinate + location: coordinate, }); } else { - Id = this.editObj.id - fileName = this.editObj.remarksName + Id = this.editObj.id; + fileName = this.editObj.remarksName; this.canvasData.line.splice(this.delCursor.index, 1, { id: Id, name: fileName, - location: coordinate + location: coordinate, }); } - this.clickSelect() - this.undisabled() - this.c.style.cursor = "crosshair" + this.clickSelect(); + this.undisabled(); + this.c.style.cursor = "crosshair"; // 灏嗗綋鍓嶅垰鐢诲畬鐨勫浘褰㈠姞鍏ュ垹鏀规父鏍囷紝鍙互灏嗗垰鐢诲畬鐨勫浘褰㈠悕绉版樉绀哄湪宸︿笂瑙� this.delCursor = { id: this.getUuid(), remarksName: fileName, type: "1", - index: this.lineIndex - 1 + index: this.lineIndex - 1, }; this.url = this.c.toDataURL(); // 姣忔 mouseup 閮戒繚瀛樹竴娆$敾甯冪姸鎬� this.step++; this.canvasHistory.length = this.step; // 鎴柇鏁扮粍 this.canvasHistory.push({ type: 1, src: this.c.toDataURL("image/png") }); // 灏嗗揩鐓т繚瀛樺埌鍘嗗彶璁板綍涓互渚涙挙閿�涔嬬敤 // this.changeType('0') - this.freedEdit() + this.freedEdit(); }, // 鐢荤煩褰㈡姮璧� rectMouseUp(e) { - if ( Math.abs(this.originX - e.offsetX) < 5 && Math.abs(this.originY - e.offsetY) < 5 @@ -1122,49 +1174,49 @@ // 閫嗘椂閽堢畻鍑虹煩褰㈠洓瑙掑潗鏍� coordinate.push({ x: this.originX, - y: this.originY + y: this.originY, }); coordinate.push({ x: this.originX, - y: e.offsetY + y: e.offsetY, }); coordinate.push({ x: e.offsetX, - y: e.offsetY + y: e.offsetY, }); coordinate.push({ x: e.offsetX, - y: this.originY + y: this.originY, }); - let Id - let fileName + let Id; + let fileName; // console.log("rect鐨別ditObj:",this.editObj) if (this.editObj.id == undefined) { - Id = this.getUuid() + Id = this.getUuid(); fileName = this.remarks(this.originX, this.originY, "2"); this.canvasData.rect.push({ id: Id, name: fileName, - location: coordinate + location: coordinate, }); } else { - Id = this.editObj.id - fileName = this.editObj.remarksName + Id = this.editObj.id; + fileName = this.editObj.remarksName; this.canvasData.rect.splice(this.delCursor.index, 1, { id: Id, name: fileName, - location: coordinate + location: coordinate, }); } - this.clickSelect() - this.undisabled() - this.c.style.cursor = "crosshair" + this.clickSelect(); + this.undisabled(); + this.c.style.cursor = "crosshair"; this.delCursor = { id: Id, remarksName: fileName, type: "2", - index: this.rectIndex - 1 + index: this.rectIndex - 1, }; // console.log("鍒氱敾瀹岀殑鐭╁舰鏍囧織锛�",this.delCursor) this.url = this.c.toDataURL(); // 姣忔 mouseup 閮戒繚瀛樹竴娆$敾甯冪姸鎬� @@ -1172,7 +1224,7 @@ this.canvasHistory.length = this.step; // 鎴柇鏁扮粍 this.canvasHistory.push({ type: 2, src: this.c.toDataURL("image/png") }); // 灏嗗揩鐓т繚瀛樺埌鍘嗗彶璁板綍涓互渚涙挙閿�涔嬬敤 - this.freedEdit() + this.freedEdit(); }, // 鐢荤澶存椂鎶捣 arrowMouseUp(e) { @@ -1184,83 +1236,82 @@ return; } this.flag = false; - let Id - let fileName + let Id; + let fileName; let coordinate = []; coordinate.push({ x: this.originX, - y: this.originY + y: this.originY, }); coordinate.push({ x: e.offsetX, - y: e.offsetY + y: e.offsetY, }); // console.log("arrow鐨別ditObj:",this.editObj) if (this.editObj.id == undefined) { - Id = this.getUuid() + Id = this.getUuid(); fileName = this.remarks(this.originX, this.originY, "4"); this.canvasData.arrow.push({ id: Id, name: fileName, - location: coordinate + location: coordinate, }); } else { - Id = this.editObj.id - fileName = this.editObj.remarksName + Id = this.editObj.id; + fileName = this.editObj.remarksName; this.canvasData.arrow.splice(this.delCursor.index, 1, { id: Id, name: fileName, - location: coordinate + location: coordinate, }); } - this.clickSelect() - this.undisabled() - this.c.style.cursor = "crosshair" + this.clickSelect(); + this.undisabled(); + this.c.style.cursor = "crosshair"; // 灏嗗綋鍓嶅垰鐢诲畬鐨勫浘褰㈠姞鍏ュ垹鏀规父鏍囷紝鍙互灏嗗垰鐢诲畬鐨勫浘褰㈠悕绉版樉绀哄湪宸︿笂瑙� this.delCursor = { id: this.getUuid(), remarksName: fileName, type: "4", - index: this.arrowIndex - 1 + index: this.arrowIndex - 1, }; this.url = this.c.toDataURL(); // 姣忔 mouseup 閮戒繚瀛樹竴娆$敾甯冪姸鎬� this.step++; this.canvasHistory.length = this.step; // 鎴柇鏁扮粍 this.canvasHistory.push({ type: 4, src: this.c.toDataURL("image/png") }); // 灏嗗揩鐓т繚瀛樺埌鍘嗗彶璁板綍涓互渚涙挙閿�涔嬬敤 // this.changeType('0') - this.freedEdit() + this.freedEdit(); }, // 鐢诲杈瑰舰缁撴潫鏃跺弻鍑� polygonDblclick(e) { - this.flag = false; this.points.pop(); // 鍙屽嚮涔嬪悗澶氫竴涓偣鐨勯噸澶嶅潗鏍囷紝闇�瑕佸垹闄� - let Id - let fileName + let Id; + let fileName; let coordinate = []; this.points.map((item, index) => { coordinate.push(item); }); // console.log("polygon鐨別ditObj:",this.editObj) if (this.editObj.id == undefined) { - Id = this.getUuid() + Id = this.getUuid(); fileName = this.remarks(this.points[0].x, this.points[0].y, "5"); this.canvasData.polygon.push({ id: Id, name: fileName, - location: coordinate + location: coordinate, }); } else { - Id = this.editObj.id - fileName = this.editObj.remarksName + Id = this.editObj.id; + fileName = this.editObj.remarksName; this.canvasData.polygon.splice(this.delCursor.index, 1, { id: Id, name: fileName, - location: coordinate + location: coordinate, }); } - this.clickSelect() - this.undisabled() + this.clickSelect(); + this.undisabled(); this.c.style.cursor = "crosshair"; this.points.length = 0; // 灏嗗綋鍓嶅垰鐢诲畬鐨勫浘褰㈠姞鍏ュ垹鏀规父鏍囷紝鍙互灏嗗垰鐢诲畬鐨勫浘褰㈠悕绉版樉绀哄湪宸︿笂瑙� @@ -1268,7 +1319,7 @@ id: this.getUuid(), remarksName: fileName, type: "5", - index: this.polygonIndex - 1 + index: this.polygonIndex - 1, }; this.url = this.c.toDataURL(); this.step++; @@ -1276,12 +1327,11 @@ this.canvasHistory.push({ type: 5, src: this.c.toDataURL("image/png") }); // 灏嗗揩鐓т繚瀛樺埌鍘嗗彶璁板綍涓互渚涙挙閿�涔嬬敤 // this.changeType('0') // console.log("鎬绘暟鎹細",this.canvasData) - this.freedEdit() + this.freedEdit(); }, // 閲婃斁缂栬緫鐘舵�� freedEdit() { - - this.editObj = {} + this.editObj = {}; }, // 鍥炴樉鍘嗗彶鏁版嵁鏃惰绠椾竴涓嬪洖鏄剧殑姣忕鍏冪礌鐨勬暟閲忎互渚跨敓鎴愬浘褰㈡敞瑙f椂鑾峰緱姝g‘鐨勫紑澶� indexInit() { @@ -1290,12 +1340,13 @@ this.arrowIndex = this.canvasData.arrow.length; //鎺掗櫎this.canvasData.polygon鍏ㄩ儴鍖哄煙(鍏ㄩ儴鍖哄煙鐨刬d灏辨槸鎽勫儚鏈虹殑id) - let filterPolygonArr = this.canvasData.polygon.filter(item=>item.id != this.TreeDataPool.selectedNode.id) + let filterPolygonArr = this.canvasData.polygon.filter( + (item) => item.id != this.TreeDataPool.selectedNode.id + ); this.polygonIndex = filterPolygonArr.length; }, // 鐢熸垚uuid getUuid() { - let originStr = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"; let originChar = "0123456789abcdef"; let len = originChar.length; @@ -1305,20 +1356,37 @@ }, // 鍒ゆ柇涓�涓偣鏄惁绂讳竴涓浘褰㈢殑鏈�灏忚窛绂讳负n鍍忕礌浠ュ唴 minDistance(x, y, locations, n) { - - let flag = false + let flag = false; for (let i = 0; i < locations.length; i++) { if (i == locations.length - 1) { - if (this.point2Line(x, y, locations[i].x, locations[i].y, locations[0].x, locations[0].y) < n) { - flag = true + if ( + this.point2Line( + x, + y, + locations[i].x, + locations[i].y, + locations[0].x, + locations[0].y + ) < n + ) { + flag = true; } } else { - if (this.point2Line(x, y, locations[i].x, locations[i].y, locations[i + 1].x, locations[i + 1].y) < n) { - flag = true + if ( + this.point2Line( + x, + y, + locations[i].x, + locations[i].y, + locations[i + 1].x, + locations[i + 1].y + ) < n + ) { + flag = true; } } } - return flag + return flag; }, point2Line(x, y, x1, y1, x2, y2) { let cross = (x2 - x1) * (x - x1) + (y2 - y1) * (y - y1); // |AB| * |AC|*cos(x) @@ -1329,15 +1397,15 @@ return Math.sqrt((x - x2) * (x - x2) + (y - y2) * (y - y2) + 0.0); let r = cross / d2; - let px = x1 + (x2 - x1) * r; // C鍦� AB涓婄殑鍨傝冻鐐癸紙px锛宲y锛� + let px = x1 + (x2 - x1) * r; // C鍦� AB涓婄殑鍨傝冻鐐癸紙px锛宲y锛� let py = y1 + (y2 - y1) * r; return Math.sqrt((x - px) * (x - px) + (y - py) * (y - py) + 0.0); //涓ょ偣闂磋窛绂诲叕寮� - } + }, }, props: { isGB28181: { default: false, - type: Boolean + type: Boolean, }, // isShowDrawArrow: { // default: false, @@ -1345,7 +1413,7 @@ // }, disabled: { default: false, - type: Boolean + type: Boolean, }, canvasDataToChild: { default: () => { @@ -1353,16 +1421,16 @@ line: [], rect: [], arrow: [], - polygon: [] + polygon: [], }; }, - type: Object + type: Object, }, snapshot_url: { type: String, - default: "" - } - } + default: "", + }, + }, }; </script> <style lang="scss" scoped> diff --git a/src/components/cardWindow.vue b/src/components/cardWindow.vue index c41eeb0..f994d40 100644 --- a/src/components/cardWindow.vue +++ b/src/components/cardWindow.vue @@ -1,12 +1,12 @@ <template> - <div class="window-view"> + <div class="window-view" @mouseleave="log($event)"> <hsc-window-style-metal class="windown-model"> <hsc-window v-for="(item, index) in CardList.details" :closeButton="true" @closebuttonclick="closeWindow(index)" :key="index" - style="background:white; " + style="background: white" :left="center.x + index * 10" :top="center.y + index * 10" :resizable="true" @@ -24,7 +24,11 @@ <model-card :data="item.list[0]"></model-card> </div> <el-carousel v-else height="calc(100% - 50px);" :autoplay="false"> - <el-carousel-item v-for="(subitem, subindex) in item.list" :key="subindex" height="100%"> + <el-carousel-item + v-for="(subitem, subindex) in item.list" + :key="subindex" + height="100%" + > <model-card :data="subitem" :activeName="type" @@ -48,20 +52,20 @@ </div> </template> <script> -import bus from '@/plugin/bus' -import ModelCard from '@/components/subComponents/ModelCard' +import bus from "@/plugin/bus"; +import ModelCard from "@/components/subComponents/ModelCard"; export default { - name: 'cardWindow', + name: "cardWindow", components: { - ModelCard + ModelCard, }, data() { return { - center: '', - type: 'pic', + center: "", + type: "pic", defaultHeight: 432, - defaultWidth: 600 - } + defaultWidth: 600, + }; }, mounted() { this.getCenter(); @@ -75,171 +79,186 @@ getCenter() { this.center = { x: document.documentElement.clientWidth / 2 - 250, - y: document.documentElement.clientHeight / 2 - 200 + y: document.documentElement.clientHeight / 2 - 200, }; }, resizeWidth(w) { - this.defaultWidth = w + this.defaultWidth = w; }, resizeHeight(h) { - this.defaultHeight = h + this.defaultHeight = h; }, changeType(str) { - this.type = str + this.type = str; }, async closeWindow(index) { - let tempPage = JSON.stringify(this.CardList.details[index].ownerPage) - this.CardList.details.splice(index, 1) + let tempPage = JSON.stringify(this.CardList.details[index].ownerPage); + this.CardList.details.splice(index, 1); if (this.CardList.details.length > 0) { - let len = this.CardList.details.length - let currentObj = this.CardList.details[len - 1] + let len = this.CardList.details.length; + let currentObj = this.CardList.details[len - 1]; if (Number(tempPage) === currentObj.ownerPage) { - this.VideoPhotoData.activeCard = currentObj.activeObject.id + this.VideoPhotoData.activeCard = currentObj.activeObject.id; } else { - this.VideoPhotoData.page = currentObj.ownerPage - await this.VideoPhotoData.querySearchList() - bus.$emit('changePage', this.VideoPhotoData.page) - this.CardList.datalist = this.VideoPhotoData.cards - this.VideoPhotoData.activeCard = currentObj.activeObject.id + this.VideoPhotoData.page = currentObj.ownerPage; + await this.VideoPhotoData.querySearchList(); + bus.$emit("changePage", this.VideoPhotoData.page); + this.CardList.datalist = this.VideoPhotoData.cards; + this.VideoPhotoData.activeCard = currentObj.activeObject.id; } } else { - this.VideoPhotoData.activeCard = '' + this.VideoPhotoData.activeCard = ""; } }, async nextPage(dataInfo, index) { - let id = dataInfo[0].id - let res = this.CardList.getBehindEle(id) + let id = dataInfo[0].id; + let res = this.CardList.getBehindEle(id); if (res) { - this.$set(this.CardList.details, index, res) - this.VideoPhotoData.activeCard = res.activeObject.id + this.$set(this.CardList.details, index, res); + this.VideoPhotoData.activeCard = res.activeObject.id; } else { if ( this.VideoPhotoData.total <= this.VideoPhotoData.page * this.VideoPhotoData.size ) { this.$notify({ - title: '娉ㄦ剰', - message: '宸叉棤鏁版嵁鏇存柊!', - type: 'warning' - }) - return + title: "娉ㄦ剰", + message: "宸叉棤鏁版嵁鏇存柊!", + type: "warning", + }); + return; } - this.VideoPhotoData.page += 1 - let detailsLen - let len + this.VideoPhotoData.page += 1; + let detailsLen; + let len; if (this.VideoPhotoData.uploadDiaplay) { - await this.VideoPhotoData.findPersonByPage() - bus.$emit('changePage', this.VideoPhotoData.page) - this.CardList.datalist = this.VideoPhotoData.persons - console.log('datalist:', this.CardList.datalist) - detailsLen = this.CardList.details.length - len = this.VideoPhotoData.persons.length - this.VideoPhotoData.activeCard = this.VideoPhotoData.persons[0].activeObject.id + await this.VideoPhotoData.findPersonByPage(); + bus.$emit("changePage", this.VideoPhotoData.page); + this.CardList.datalist = this.VideoPhotoData.persons; + console.log("datalist:", this.CardList.datalist); + detailsLen = this.CardList.details.length; + len = this.VideoPhotoData.persons.length; + this.VideoPhotoData.activeCard = + this.VideoPhotoData.persons[0].activeObject.id; } else { - await this.VideoPhotoData.querySearchList() - bus.$emit('changePage', this.VideoPhotoData.page) - this.CardList.datalist = this.VideoPhotoData.cards - detailsLen = this.CardList.details.length - len = this.VideoPhotoData.cards.length - this.VideoPhotoData.activeCard = this.VideoPhotoData.cards[0].activeObject.id + await this.VideoPhotoData.querySearchList(); + bus.$emit("changePage", this.VideoPhotoData.page); + this.CardList.datalist = this.VideoPhotoData.cards; + detailsLen = this.CardList.details.length; + len = this.VideoPhotoData.cards.length; + this.VideoPhotoData.activeCard = + this.VideoPhotoData.cards[0].activeObject.id; } - this.$set(this.CardList.details, index, this.CardList.datalist[0]) + this.$set(this.CardList.details, index, this.CardList.datalist[0]); this.$notify({ - title: '鏇存柊鏁版嵁', - message: '宸茶烦杞埌涓嬩竴椤碉紒', - type: 'warning' - }) + title: "鏇存柊鏁版嵁", + message: "宸茶烦杞埌涓嬩竴椤碉紒", + type: "warning", + }); } - this.autoScrollDown() + this.autoScrollDown(); // let target = driver.find_elements_by_class_name("my-active-card") // let target = window.scroll // console.log(target,'閫夋嫨寰楀厓绱�') // driver.execute_script("arguments[0].scrollIntoView();", target) }, async upPage(dataInfo, index) { - console.log('涓婁竴椤�') - let id = dataInfo[0].id - let res = this.CardList.getFrontEle(id) + console.log("涓婁竴椤�"); + let id = dataInfo[0].id; + let res = this.CardList.getFrontEle(id); if (res) { - this.$set(this.CardList.details, index, res) - this.VideoPhotoData.activeCard = res.activeObject.id - this.autoScrollUp() + this.$set(this.CardList.details, index, res); + this.VideoPhotoData.activeCard = res.activeObject.id; + this.autoScrollUp(); } else { if (this.VideoPhotoData.page === 1) { this.$notify({ - title: '娉ㄦ剰', - message: '宸叉棤鏁版嵁鏇存柊!', - type: 'warning' - }) - return + title: "娉ㄦ剰", + message: "宸叉棤鏁版嵁鏇存柊!", + type: "warning", + }); + return; } - this.VideoPhotoData.page -= 1 - let detailsLen - let len + this.VideoPhotoData.page -= 1; + let detailsLen; + let len; if (this.VideoPhotoData.uploadDiaplay) { - await this.VideoPhotoData.findPersonByPage() - bus.$emit('changePage', this.VideoPhotoData.page) - this.CardList.datalist = this.VideoPhotoData.persons - detailsLen = this.CardList.details.length - len = this.VideoPhotoData.persons.length - this.VideoPhotoData.activeCard = this.VideoPhotoData.persons[ - len - 1 - ].activeObject.id + await this.VideoPhotoData.findPersonByPage(); + bus.$emit("changePage", this.VideoPhotoData.page); + this.CardList.datalist = this.VideoPhotoData.persons; + detailsLen = this.CardList.details.length; + len = this.VideoPhotoData.persons.length; + this.VideoPhotoData.activeCard = + this.VideoPhotoData.persons[len - 1].activeObject.id; } else { - await this.VideoPhotoData.querySearchList() - bus.$emit('changePage', this.VideoPhotoData.page) - this.CardList.datalist = this.VideoPhotoData.cards - detailsLen = this.CardList.details.length - len = this.VideoPhotoData.cards.length - this.VideoPhotoData.activeCard = this.VideoPhotoData.cards[ - len - 1 - ].activeObject.id + await this.VideoPhotoData.querySearchList(); + bus.$emit("changePage", this.VideoPhotoData.page); + this.CardList.datalist = this.VideoPhotoData.cards; + detailsLen = this.CardList.details.length; + len = this.VideoPhotoData.cards.length; + this.VideoPhotoData.activeCard = + this.VideoPhotoData.cards[len - 1].activeObject.id; } - this.$set(this.CardList.details, index, this.CardList.datalist[len - 1]) + this.$set( + this.CardList.details, + index, + this.CardList.datalist[len - 1] + ); this.$notify({ - title: '鏇存柊鏁版嵁', - message: '宸茶烦杞埌涓婁竴椤碉紒', - type: 'warning' - }) - this.autoScrollDown(1) + title: "鏇存柊鏁版嵁", + message: "宸茶烦杞埌涓婁竴椤碉紒", + type: "warning", + }); + this.autoScrollDown(1); } }, autoScrollDown(arg) { //arg == 1 琛ㄧず鍚戝墠缈婚〉鐩存帴婊氬埌搴曪紝涓�0鎴栫┖ 琛ㄧず鏈〉鍐呮粴鍔� if (this.VideoPhotoData.scrollContainDom) { this.$nextTick(() => { - let dom = document.getElementsByClassName('my-active-card')[0] - let scrollTop = this.VideoPhotoData.scrollContainDom.scrollTop - let offsetHeight = this.VideoPhotoData.scrollContainDom.offsetHeight + let dom = document.getElementsByClassName("my-active-card")[0]; + let scrollTop = this.VideoPhotoData.scrollContainDom.scrollTop; + let offsetHeight = this.VideoPhotoData.scrollContainDom.offsetHeight; if (arg == 1) { this.VideoPhotoData.scrollContainDom.scrollTop = - scrollTop + offsetHeight + 160 - return + scrollTop + offsetHeight + 160; + return; } if (dom.offsetTop > scrollTop + offsetHeight) { this.VideoPhotoData.scrollContainDom.scrollTop = - scrollTop + offsetHeight + 80 - return + scrollTop + offsetHeight + 80; + return; } - }) + }); } }, autoScrollUp() { if (this.VideoPhotoData.scrollContainDom) { this.$nextTick(() => { - let dom = document.getElementsByClassName('my-active-card')[0] - let scrollTop = this.VideoPhotoData.scrollContainDom.scrollTop - let offsetHeight = this.VideoPhotoData.scrollContainDom.offsetHeight + let dom = document.getElementsByClassName("my-active-card")[0]; + let scrollTop = this.VideoPhotoData.scrollContainDom.scrollTop; + let offsetHeight = this.VideoPhotoData.scrollContainDom.offsetHeight; if (dom.offsetTop < scrollTop && scrollTop !== 0) { this.VideoPhotoData.scrollContainDom.scrollTop = - scrollTop - offsetHeight + scrollTop - offsetHeight; } - }) + }); } - } - } -} + }, + log() { + this.$refs["hscw"][0].draggableHelper.unbindMove && + this.$refs["hscw"][0].draggableHelper.unbindMove(); + + this.$refs["hscw"][0].draggableHelper.unbindUp && + this.$refs["hscw"][0].draggableHelper.unbindUp(); + + this.$refs["hscw"][0].draggableHelper.unbindUp = this.$refs[ + "hscw" + ][0].draggableHelper.unbindMove = undefined; + }, + }, +}; </script> <style lang="scss"> .layout { @@ -371,3 +390,5 @@ } } </style> + + diff --git a/src/components/subComponents/CardItem.vue b/src/components/subComponents/CardItem.vue index 063f9af..7600f20 100644 --- a/src/components/subComponents/CardItem.vue +++ b/src/components/subComponents/CardItem.vue @@ -2,13 +2,13 @@ <div class="box-card" ref="cardItem"> <!-- 宸︿晶鍥剧墖鍖哄煙 --> <!-- 姣斿妯″紡 --> - <div class="s-card-left-isCompare" v-if="showType === 'compare' "> + <div class="s-card-left-isCompare" v-if="showType === 'compare'"> <div class="card-img-box"> <div class="card-img-box-compear"> <div class="card-img-box-compear-left" ref="firstImg"> <img :src="data.targetInfo[0].picSmUrl | httpImage" - :id="'/compear/'+data.targetInfo[0].picSmUrl" + :id="'/compear/' + data.targetInfo[0].picSmUrl" class="cursor-pointer" @click="detailsClick($event)" /> @@ -20,7 +20,10 @@ indicator-position="none" :arrow="data.baseInfo.length > 1 ? 'always' : 'never'" > - <el-carousel-item v-for="(item, index) in data.baseInfo" :key="index"> + <el-carousel-item + v-for="(item, index) in data.baseInfo" + :key="index" + > <img :src="item.targetPicUrl | httpImage" class="cursor-pointer" @@ -33,7 +36,7 @@ class="s-card-left-isCompare-div compareScore111" :style="{ bottom: '0', - background: getUrl(data.baseInfo[initialIndex].bwType) + background: getUrl(data.baseInfo[initialIndex].bwType), }" > <b>{{ data.baseInfo[initialIndex].compareScore | percentage }}</b> @@ -52,13 +55,23 @@ :autoplay="false" @change="changeCarousel" > - <el-carousel-item v-for="(item, index) in data.picMaxUrl" :key="index + 'img'"> - <img :src="item | httpImage" class="cursor-pointer" @click="detailsClick($event)" /> + <el-carousel-item + v-for="(item, index) in data.picMaxUrl" + :key="index + 'img'" + > + <img + :src="item | httpImage" + class="cursor-pointer" + @click="detailsClick($event)" + /> </el-carousel-item> </el-carousel> <!-- 鏆傛椂璁や负鍙湁浜鸿劯鎶撴媿鐨勬姤璀�, 棣栭〉鏄剧ず灏忓浘, 鍏朵粬鏃堕棿鍧囨樉绀哄ぇ鍥� --> <img - v-else-if="data.targetInfo == null || data.targetInfo[0].targetType !== 'FaceDetect'" + v-else-if=" + data.targetInfo == null || + data.targetInfo[0].targetType !== 'FaceDetect' + " :src="data.picMaxUrl[0] | httpImage" class="cursor-pointer" @click="detailsClick($event)" @@ -71,7 +84,10 @@ /> </div> <div class="s-card-left-box" v-else> - <img :src="data.baseInfo[0].targetPicUrl | httpImage" class="cursor-pointer" /> + <img + :src="data.baseInfo[0].targetPicUrl | httpImage" + class="cursor-pointer" + /> </div> </div> @@ -85,34 +101,52 @@ @mouseleave="cardMouseleave($event)" > <p> - <span class="fontStyle color222">{{ data.picDate | formatTime}}</span> + <span class="fontStyle color222">{{ + data.picDate | formatTime + }}</span> </p> - <p style="margin-bottom: 8px;"> + <p style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> <el-tooltip placement="right" popper-class="atooltip"> <div slot="content"> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule'"> - <span>{{data.taskName}}</span> - <span v-if="item.alarmLevel !== '鎾ら槻'"> {{item.alarmLevel}}</span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'"> + <span>{{ data.taskName }}</span + > + <span v-if="item.alarmLevel !== '鎾ら槻'" + > {{ item.alarmLevel }}</span + > <span v-if="item.linkInfo == '鑱斿姩浠诲姟'"> 鑱斿姩浠诲姟</span> </p> </div> <el-button - style="line-height:17px;border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left" + style=" + line-height: 17px; + border: none; + padding: 0; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + " > <span - v-for="(item,index) in data.alarmRules" - :key="index+'rule1'" - style="text-overflow:ellipsis;max-width:100px" + v-for="(item, index) in data.alarmRules" + :key="index + 'rule1'" + style="text-overflow: ellipsis; max-width: 100px" > - <span class="fontStyle color666">{{data.taskName}}</span> + <span class="fontStyle color666">{{ data.taskName }}</span + > + <span class="fontStyle color666" v-if="item.alarmLevel !== '鎾ら槻'" + > {{ item.alarmLevel }}</span + > <span class="fontStyle color666" - v-if="item.alarmLevel !== '鎾ら槻'" - > {{item.alarmLevel}}</span> - <span class="fontStyle color666" v-if="item.linkInfo == '鑱斿姩浠诲姟'"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </span> </el-button> </el-tooltip> @@ -122,45 +156,61 @@ <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName" - >{{ data.baseInfo[initialIndex].tableName }}</span> + >{{ data.baseInfo[initialIndex].tableName }}</span + > <span class="fontStyle" v-if="data.baseInfo[initialIndex].targetName" - >/ {{ data.baseInfo[initialIndex].targetName }}</span> - <span - class="fontStyle" - v-if="data.baseInfo[initialIndex].labels" - >/ {{ data.baseInfo[initialIndex].labels | idCard}}</span> + >/ {{ data.baseInfo[initialIndex].targetName }}</span + > + <span class="fontStyle" v-if="data.baseInfo[initialIndex].labels" + >/ {{ data.baseInfo[initialIndex].labels | idCard }}</span + > <span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel" - >/ {{ data.baseInfo[initialIndex].monitorLevel }}</span> + >/ {{ data.baseInfo[initialIndex].monitorLevel }}</span + > </p> </div> <el-button - style="line-height:17px;border:none;padding:0;margin:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left" + style=" + line-height: 17px; + border: none; + padding: 0; + margin: 0; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + " > <span - :style="data.baseInfo[initialIndex].bwType === '1' - ? 'color: red;font-size:12px;line-height:20px' - : 'font-size:12px;line-height:20px'" + :style=" + data.baseInfo[initialIndex].bwType === '1' + ? 'color: red;font-size:12px;line-height:20px' + : 'font-size:12px;line-height:20px' + " > <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName" - >{{ data.baseInfo[initialIndex].tableName }}</span> + >{{ data.baseInfo[initialIndex].tableName }}</span + > <span class="fontStyle" v-if="data.baseInfo[initialIndex].targetName" - >/ {{ data.baseInfo[initialIndex].targetName }}</span> - <span - class="fontStyle" - v-if="data.baseInfo[initialIndex].labels" - >/ {{ data.baseInfo[initialIndex].labels | idCard}}</span> + >/ {{ data.baseInfo[initialIndex].targetName }}</span + > + <span class="fontStyle" v-if="data.baseInfo[initialIndex].labels" + >/ {{ data.baseInfo[initialIndex].labels | idCard }}</span + > <span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel" - >/ {{ data.baseInfo[initialIndex].monitorLevel }}</span> + >/ {{ data.baseInfo[initialIndex].monitorLevel }}</span + > </span> </el-button> </el-tooltip> @@ -176,7 +226,14 @@ <i class="iconfont icontianjiaren" @click="toAdd(data)"></i> </el-tooltip> <el-tooltip content="鏀惰棌" placement="top" popper-class="atooltip"> - <i class="iconfont iconshoucang2"></i> + <i + v-if="!data.isCollect" + class="iconfont iconshoucang2" + @click="collect(true)" + ></i> + <span v-else @click="collect(false)" class="iconfont icon_collect" + ></span + > </el-tooltip> </div> </div> @@ -191,23 +248,44 @@ <p :title="data.baseInfo[0].compareScore" class="score" - style="font-family: PingFangSC-Medium;font-size: 20px;color: #3D68E1;letter-spacing: 0.4px;" + style=" + font-family: PingFangSC-Medium; + font-size: 20px; + color: #3d68e1; + letter-spacing: 0.4px; + " > - <span>{{ data.baseInfo[0].compareScore | percentage}}</span> + <span>{{ data.baseInfo[0].compareScore | percentage }}</span> </p> <p - :style="data.baseInfo[0].bwType == '0' ? 'font-size:12px;line-height:20px' : 'color:red;font-size:12px;line-height:20px'" - >{{ data.baseInfo[0].tableName }}</p> + :style=" + data.baseInfo[0].bwType == '0' + ? 'font-size:12px;line-height:20px' + : 'color:red;font-size:12px;line-height:20px' + " + > + {{ data.baseInfo[0].tableName }} + </p> <p :style="data.baseInfo[0].bwType == '0' ? '' : 'color:red'"> - <span>{{ data.baseInfo[0].targetName }}</span> - <span - v-if="data.baseInfo[0].labels" - >/ {{ data.baseInfo[0].labels | idCard}}</span> + <span>{{ data.baseInfo[0].targetName }}</span + > + <span v-if="data.baseInfo[0].labels" + >/ {{ data.baseInfo[0].labels | idCard }}</span + > </p> </div> <div class="card-icon-box"> - <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip" style="margin-left:10px"> - <i class="iconfont iconsousuoren" @click="tosearch(data)" title="鏌ユ壘姝や汉"></i> + <el-tooltip + content="鏌ユ壘姝や汉" + placement="top" + popper-class="atooltip" + style="margin-left: 10px" + > + <i + class="iconfont iconsousuoren" + @click="tosearch(data)" + title="鏌ユ壘姝や汉" + ></i> </el-tooltip> </div> </div> @@ -223,34 +301,54 @@ @mouseleave="cardMouseleave($event)" > <p :title="data.picDate"> - <span class="fontStyle color222">{{ data.picDate | formatTime }}</span> + <span class="fontStyle color222">{{ + data.picDate | formatTime + }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 8px;"> + <p :title="data.cameraAddr" style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> <el-tooltip placement="right" popper-class="atooltip"> <div slot="content"> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule'"> - <span>{{data.taskName}}</span> - <span v-if="item.alarmLevel !== '鎾ら槻'">{{item.alarmLevel}}</span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'"> + <span>{{ data.taskName }}</span + > + <span v-if="item.alarmLevel !== '鎾ら槻'">{{ + item.alarmLevel + }}</span + > <span v-if="item.linkInfo == '鑱斿姩浠诲姟'"> 鑱斿姩浠诲姟</span> </p> </div> <el-button - style="border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left" + style=" + border: none; + padding: 0; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + " > <span - v-for="(item,index) in data.alarmRules" - :key="index+'rule1'" - style="text-overflow:ellipsis;max-width:100px" + v-for="(item, index) in data.alarmRules" + :key="index + 'rule1'" + style="text-overflow: ellipsis; max-width: 100px" > - <span class="fontStyle color666">{{data.taskName}}</span> + <span class="fontStyle color666">{{ data.taskName }}</span + > <span class="fontStyle color666" v-if="item.alarmLevel !== '鎾ら槻'" - >{{item.alarmLevel}}</span> - <span class="fontStyle color666" v-if="item.linkInfo == '鑱斿姩浠诲姟'"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + >{{ item.alarmLevel }}</span + > + <span + class="fontStyle color666" + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </span> </el-button> </el-tooltip> @@ -258,7 +356,11 @@ <div class="right-bottom"> <div v-if="!data.id" class="card-icon-box"> <!-- <i class="iconfont systemxing ml50" title="鏀惰棌" ></i> --> - <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip"> + <el-tooltip + content="鏌ユ壘姝や汉" + placement="top" + popper-class="atooltip" + > <i class="iconfont iconsousuoren ml50" @click="tosearch(data)"></i> </el-tooltip> </div> @@ -270,7 +372,14 @@ <i class="iconfont iconcaidan" @click="detailsClick($event)"></i> </el-tooltip> <el-tooltip content="鏀惰棌" placement="top" popper-class="atooltip"> - <i class="iconfont iconshoucang2" @click="dialogVisible = true"></i> + <i + v-if="!data.isCollect" + class="iconfont iconshoucang2" + @click="collect(true)" + ></i> + <span v-else @click="collect(false)" class="iconfont icon_collect" + ></span + > </el-tooltip> <!-- :class=" data.isAlarm ? 'iconfont systemmm' : 'iconfont systemxing' @@ -280,14 +389,29 @@ <el-tooltip content="璇︽儏" placement="top" popper-class="atooltip"> <i class="iconfont iconcaidan" @click="detailsClick($event)"></i> </el-tooltip> - <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip"> + <el-tooltip + content="鏌ユ壘姝や汉" + placement="top" + popper-class="atooltip" + > <i class="iconfont iconsousuoren" @click="tosearch(data)"></i> </el-tooltip> - <el-tooltip content="鍔犲叆搴曞簱" placement="top" popper-class="atooltip"> + <el-tooltip + content="鍔犲叆搴曞簱" + placement="top" + popper-class="atooltip" + > <i class="iconfont icontianjiaren" @click="toAdd(data)"></i> </el-tooltip> <el-tooltip content="鏀惰棌" placement="top" popper-class="atooltip"> - <i class="iconfont iconshoucang2" @click="dialogVisible = true"></i> + <i + v-if="!data.isCollect" + class="iconfont iconshoucang2" + @click="collect(true)" + ></i> + <span v-else @click="collect(false)" class="iconfont icon_collect" + ></span + > </el-tooltip> </div> </div> @@ -307,40 +431,72 @@ <p class="score" v-if="VideoPhotoData.uploadType" - style="font-family: PingFangSC-Medium;font-size: 20px;color: #3D68E1;letter-spacing: 0.4px;" + style=" + font-family: PingFangSC-Medium; + font-size: 20px; + color: #3d68e1; + letter-spacing: 0.4px; + " > - <span v-if="data.id">{{ data.compareScore | percentage}}</span> - <span v-else>{{ data.baseInfo[0].compareScore | percentage}}</span> + <span v-if="data.id">{{ data.compareScore | percentage }}</span> + <span v-else>{{ data.baseInfo[0].compareScore | percentage }}</span> </p> <p :title="data.picDate"> - <span class="fontStyle color222">{{ data.picDate | formatTime }}</span> + <span class="fontStyle color222">{{ + data.picDate | formatTime + }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 8px;"> + <p :title="data.cameraAddr" style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> - <el-tooltip placement="right" popper-class="atooltip" v-if="!VideoPhotoData.uploadType"> + <el-tooltip + placement="right" + popper-class="atooltip" + v-if="!VideoPhotoData.uploadType" + > <div slot="content"> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule2'"> - <span class="fontStyle">{{data.taskName}}</span> - <span - class="fontStyle" - v-if="item.alarmLevel !== '鎾ら槻'" - >{{item.alarmLevel}}</span> - <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule2'"> + <span class="fontStyle">{{ data.taskName }}</span + > + <span class="fontStyle" v-if="item.alarmLevel !== '鎾ら槻'">{{ + item.alarmLevel + }}</span + > + <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </p> </div> <el-button - style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left" + style=" + border: none; + padding: 0; + margin: 0px; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + " > - <span v-for="(item,index) in data.alarmRules" :key="index+'rule3'"> - <span class="fontStyle color666">{{data.taskName}}</span> + <span + v-for="(item, index) in data.alarmRules" + :key="index + 'rule3'" + > + <span class="fontStyle color666">{{ data.taskName }}</span + > <span class="fontStyle color666" v-if="item.alarmLevel !== '鎾ら槻'" - >{{item.alarmLevel}}</span> - <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle color666"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + >{{ item.alarmLevel }}</span + > + <span + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + class="fontStyle color666" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </span> </el-button> </el-tooltip> @@ -353,31 +509,52 @@ v-if="data.baseInfo && data.baseInfo[0].targetName != ''" > <div slot="content"> - <p v-for="(item,index) in data.baseInfo" :key="index+'base1'"> - <span class="fontStyle">{{item.tableName}}</span> - <span class="fontStyle" v-if="item.targetName.length">/ {{item.targetName}}</span> - <span - class="fontStyle" - v-if="item.labels.length" - >/ {{item.labels | idCard}}</span> - <span class="fontStyle" v-if="item.labels.length">/ {{item.labels | sex}}</span> + <p v-for="(item, index) in data.baseInfo" :key="index + 'base1'"> + <span class="fontStyle">{{ item.tableName }}</span + > + <span class="fontStyle" v-if="item.targetName.length" + >/ {{ item.targetName }}</span + > + <span class="fontStyle" v-if="item.labels.length" + >/ {{ item.labels | idCard }}</span + > + <span class="fontStyle" v-if="item.labels.length" + >/ {{ item.labels | sex }}</span + > </p> </div> <el-button - style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left" + style=" + border: none; + padding: 0; + margin: 0px; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + " > <span - v-for="(item,index) in data.baseInfo" - :key="index+'base'" - :style="item.bwType == '1' ? 'color:red;font-size:12px;line-height:20px':'font-size:12px;line-height:20px'" + v-for="(item, index) in data.baseInfo" + :key="index + 'base'" + :style=" + item.bwType == '1' + ? 'color:red;font-size:12px;line-height:20px' + : 'font-size:12px;line-height:20px' + " > - <span class="fontStyle">{{item.tableName}}</span> - <span class="fontStyle" v-if="item.targetName.length">/ {{item.targetName}}</span> - <span - class="fontStyle" - v-if="item.labels.length" - >/ {{item.labels | idCard}}</span> - <span class="fontStyle" v-if="item.labels.length">/ {{item.labels |sex }}</span> + <span class="fontStyle">{{ item.tableName }}</span + > + <span class="fontStyle" v-if="item.targetName.length" + >/ {{ item.targetName }}</span + > + <span class="fontStyle" v-if="item.labels.length" + >/ {{ item.labels | idCard }}</span + > + <span class="fontStyle" v-if="item.labels.length" + >/ {{ item.labels | sex }}</span + > </span> </el-button> </el-tooltip> @@ -386,15 +563,28 @@ placement="right" popper-class="atooltip" v-if="data.baseInfo == null" - style="margin-top:5px" + style="margin-top: 5px" > <div slot="content"> - <span :style="'color:red;font-size:14px;line-height:20px'">{{data.showLabels}}</span> + <span :style="'color:red;font-size:14px;line-height:20px'">{{ + data.showLabels + }}</span> </div> <el-button - style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left" + style=" + border: none; + padding: 0; + margin: 0px; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + " > - <span :style=" 'color:red;font-size:14px;line-height:20px'">{{data.showLabels}}</span> + <span :style="'color:red;font-size:14px;line-height:20px'">{{ + data.showLabels + }}</span> </el-button> </el-tooltip> </div> @@ -402,7 +592,11 @@ <div v-if="!data.id" class="card-icon-box"> <!-- 搴曞簱浜哄憳 --> <!-- <i class="iconfont systemxing ml50" title="鏀惰棌" ></i> --> - <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip"> + <el-tooltip + content="鏌ユ壘姝や汉" + placement="top" + popper-class="atooltip" + > <i class="iconfont iconsousuoren ml50" @click="tosearch(data)"></i> </el-tooltip> </div> @@ -412,7 +606,14 @@ <i class="iconfont iconcaidan" @click="detailsClick($event)"></i> </el-tooltip> <el-tooltip content="鏀惰棌" placement="top" popper-class="atooltip"> - <i class="iconfont iconshoucang2"></i> + <i + v-if="!data.isCollect" + class="iconfont iconshoucang2" + @click="collect(true)" + ></i> + <span @click="collect(false)" v-else class="iconfont icon_collect" + ></span + > </el-tooltip> <!-- :class=" data.isAlarm ? 'iconfont systemmm' : 'iconfont systemxing' @@ -440,7 +641,14 @@ <i class="iconfont icontianjiaren" @click="toAdd(data)"></i> </el-tooltip> <el-tooltip content="鏀惰棌" placement="top" popper-class="atooltip"> - <i class="iconfont iconshoucang2"></i> + <i + v-if="!data.isCollect" + class="iconfont iconshoucang2" + @click="collect(true)" + ></i> + <span v-else class="iconfont icon_collect" @click="collect(false)" + ></span + > </el-tooltip> </div> </div> @@ -456,16 +664,24 @@ > <div> <p :title="data.picDate"> - <span class="fontStyle color222">{{ data.picDate | formatTime }}</span> + <span class="fontStyle color222">{{ + data.picDate | formatTime + }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 8px;"> + <p :title="data.cameraAddr" style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule'"> - <span class="fontStyle color666">{{data.taskName}}</span> / - <span class="fontStyle color666">{{item.alarmLevel}}</span> / - <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle color666">鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'"> + <span class="fontStyle color666">{{ data.taskName }}</span + > / + <span class="fontStyle color666">{{ item.alarmLevel }}</span + > / + <span + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + class="fontStyle color666" + >鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </p> </div> </div> @@ -475,76 +691,88 @@ </template> <script> +import { collect } from "@/api/search"; + Date.prototype.Format = function (fmt) { var o = { - "M+": this.getMonth() + 1, //鏈堜唤 - "d+": this.getDate(), //鏃� - "H+": this.getHours(), //灏忔椂 - "m+": this.getMinutes(), //鍒� - "s+": this.getSeconds(), //绉� - "q+": Math.floor((this.getMonth() + 3) / 3), //瀛e害 - "S": this.getMilliseconds() //姣 + "M+": this.getMonth() + 1, //鏈堜唤 + "d+": this.getDate(), //鏃� + "H+": this.getHours(), //灏忔椂 + "m+": this.getMinutes(), //鍒� + "s+": this.getSeconds(), //绉� + "q+": Math.floor((this.getMonth() + 3) / 3), //瀛e害 + S: this.getMilliseconds(), //姣 }; - if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length)); + if (/(y+)/.test(fmt)) + fmt = fmt.replace( + RegExp.$1, + (this.getFullYear() + "").substr(4 - RegExp.$1.length) + ); for (var k in o) - if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length))); + if (new RegExp("(" + k + ")").test(fmt)) + fmt = fmt.replace( + RegExp.$1, + RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length) + ); return fmt; -} +}; export default { mounted() { //window.addEventListener("resize", this.watchWindow); - window.addEventListener("resize", this.getBottom) + window.addEventListener("resize", this.getBottom); }, props: { data: { type: Object, - default: null + default: null, }, showType: { type: String, - default: "search" + default: "search", }, fromCluster: { type: Boolean, - default: false + default: false, }, - searchT: {} + searchT: {}, }, computed: { isId() { - return this.data.id - } + return this.data.id; + }, }, filters: { formatTime(t) { - return new Date(t).Format("yyyy-MM-dd HH:mm:ss") + return new Date(t).Format("yyyy-MM-dd HH:mm:ss"); }, percentage(score) { - return score.toFixed(2) + "%" + return score.toFixed(2) + "%"; }, idCard(v) { try { - let obj = JSON.parse(v) - return obj.idCard + let obj = JSON.parse(v); + return obj.idCard; } catch (error) { - return v.split("/")[1] + return v.split("/")[1]; } }, sex(v) { try { - let obj = JSON.parse(v) - return obj.sex + let obj = JSON.parse(v); + return obj.sex; } catch (error) { - return v.split("/")[0] + return v.split("/")[0]; } }, httpImage(url) { if (!url.length) { - return "" + return ""; } - return '/httpImage/' + url + ((url.indexOf("?") >= 0) ? '&' : '?') + 'width=160' - } + return ( + "/httpImage/" + url + (url.indexOf("?") >= 0 ? "&" : "?") + "width=160" + ); + }, }, data() { return { @@ -552,33 +780,33 @@ initialIndex: 0, carouselIndex: 0, dialogVisible: false, - overflowState: true + overflowState: true, }; }, watch: { data: { handler(val, oldVal) { - this.$forceUpdate() + this.$forceUpdate(); }, - deep: true - } + deep: true, + }, }, methods: { getBottom() { this.$nextTick(() => { - let imgDom = this.$refs.firstImg + let imgDom = this.$refs.firstImg; if (imgDom) { - let num = (imgDom.offsetHeight - imgDom.offsetWidth) / 2 + let num = (imgDom.offsetHeight - imgDom.offsetWidth) / 2; return `${num}px`; } return `4px`; - }) + }); }, getUrl(bwtype) { if (bwtype == 1) { - return `url(${require("@/assets/img/red.png")})` + return `url(${require("@/assets/img/red.png")})`; } else { - return `url(${require("@/assets/img/green.png")})` + return `url(${require("@/assets/img/green.png")})`; } }, changeInitialIndex(index) { @@ -600,24 +828,62 @@ this.$emit("addToBase", item); }, tosearch(item) { - this.searchT - let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id - let imgUrl = item.targetInfo ? item.targetInfo[0].picSmUrl : item.baseInfo[0].targetPicUrl - let compType = 1 // 鏁版嵁鏉ヨ嚜浜巈s + this.searchT; + let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id; + let imgUrl = item.targetInfo + ? item.targetInfo[0].picSmUrl + : item.baseInfo[0].targetPicUrl; + let compType = 1; // 鏁版嵁鏉ヨ嚜浜巈s if (!item.id || item.id == "") { - compType = 0 // 鏁版嵁鏉ヨ嚜浜庡簳搴� + compType = 0; // 鏁版嵁鏉ヨ嚜浜庡簳搴� } - let message + let message; if (this.fromCluster) { - message = 'toCluster?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType + '×tamp=' + new Date().getTime() + '&start=' + this.searchT[0] + '&end=' + this.searchT[1]; + message = + "toCluster?showType=findByPic&targetId=" + + captureId + + "&picSmUrl=" + + imgUrl + + "&compType=" + + compType + + "×tamp=" + + new Date().getTime() + + "&start=" + + this.searchT[0] + + "&end=" + + this.searchT[1]; } else { - message = 'toSearch?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + imgUrl + '&compType=' + compType + '×tamp=' + new Date().getTime() + '&start=' + this.searchT[0] + '&end=' + this.searchT[1]; + message = + "toSearch?showType=findByPic&targetId=" + + captureId + + "&picSmUrl=" + + imgUrl + + "&compType=" + + compType + + "×tamp=" + + new Date().getTime() + + "&start=" + + this.searchT[0] + + "&end=" + + this.searchT[1]; } - window.parent.postMessage({ - msg: message - }, "*") - } - } + window.parent.postMessage( + { + msg: message, + }, + "*" + ); + }, + async collect(val) { + const res = await collect({ + id: this.data.id, + isCollect: val, + }); + if (res && res.success) { + this.data.isCollect = !this.data.isCollect; + } + }, + }, }; </script> <style lang="scss"> @@ -908,4 +1174,9 @@ } } } + +.icon_collect { + color: #3d68e1; + vertical-align: 2px; +} </style> diff --git a/src/components/subComponents/FileUpload/btn.vue b/src/components/subComponents/FileUpload/btn.vue index 7ff2b0e..9f9d27b 100644 --- a/src/components/subComponents/FileUpload/btn.vue +++ b/src/components/subComponents/FileUpload/btn.vue @@ -5,9 +5,9 @@ </template> <script> -import { uploaderMixin, supportMixin } from './common/mixins' +import { uploaderMixin, supportMixin } from "./common/mixins"; -const COMPONENT_NAME = 'uploader-btn' +const COMPONENT_NAME = "uploader-btn"; export default { name: COMPONENT_NAME, @@ -15,36 +15,41 @@ props: { directory: { type: Boolean, - default: false + default: false, }, single: { type: Boolean, - default: false + default: false, }, attrs: { type: Object, default() { - return {} - } + return {}; + }, }, sourceType: { type: Number, - } + }, }, - + mounted() { this.$nextTick(() => { - debugger - let props = {accept:''}; - if(this.sourceType == 1){ - props.accept = '.mp4'; - }else if(this.sourceType == 2){ - props.accept = '.jpg,.jpeg,.png'; + debugger; + let props = { accept: "" }; + if (this.sourceType == 1) { + props.accept = ".mp4"; + } else if (this.sourceType == 2) { + props.accept = ".jpg,.jpeg,.png"; } - this.uploader.uploader.assignBrowse(this.$refs.btn, this.directory, this.single, props) - }) - } -} + this.uploader.uploader.assignBrowse( + this.$refs.btn, + this.directory, + this.single, + props + ); + }); + }, +}; </script> <style> diff --git a/src/components/subComponents/FileUpload/index.vue b/src/components/subComponents/FileUpload/index.vue index 2068da8..224cc34 100644 --- a/src/components/subComponents/FileUpload/index.vue +++ b/src/components/subComponents/FileUpload/index.vue @@ -79,14 +79,12 @@ import SparkMD5 from "spark-md5"; import UploaderBtn from "./btn"; import UploaderList from "./list"; -import UploaderDrop from "./drop"; export default { components: { uploader, UploaderBtn, UploaderList, - UploaderDrop, }, props: { sourceType: { diff --git a/src/components/subComponents/MultiRangeSlider.vue b/src/components/subComponents/MultiRangeSlider.vue index 5bab8e5..1954669 100644 --- a/src/components/subComponents/MultiRangeSlider.vue +++ b/src/components/subComponents/MultiRangeSlider.vue @@ -1,6 +1,8 @@ <template> <div class="timeRangeSliderBox"> - <canvas :id="mainId" :ref="mainId" width="700px" height="260px">鎶辨瓑,鎮ㄧ殑娴忚鍣ㄤ笉鏀寔canvas!璇锋洿鎹㈡祻瑙堝櫒</canvas> + <canvas :id="mainId" :ref="mainId" width="700px" height="260px" + >鎶辨瓑,鎮ㄧ殑娴忚鍣ㄤ笉鏀寔canvas!璇锋洿鎹㈡祻瑙堝櫒</canvas + > <canvas :id="`${mainId}Dummy`" :ref="`${mainId}Dummy`" @@ -11,8 +13,13 @@ @mousedown="mouseDown($event)" @mousemove="mousemove($event)" @mouseup="mouseup($event)" - >鎶辨瓑,鎮ㄧ殑娴忚鍣ㄤ笉鏀寔canvas!璇锋洿鎹㈡祻瑙堝櫒</canvas> - <div class="popup-box" :style="`top:${popPos.y + 10}px;left:${popPos.x - 70}px`" v-if="isPopup"> + >鎶辨瓑,鎮ㄧ殑娴忚鍣ㄤ笉鏀寔canvas!璇锋洿鎹㈡祻瑙堝櫒</canvas + > + <div + class="popup-box" + :style="`top:${popPos.y + 10}px;left:${popPos.x - 70}px`" + v-if="isPopup" + > <div> <b>寮�濮嬫椂闂�:</b> <input @@ -37,7 +44,7 @@ <b>:</b> <input v-model="changeTime.endMin" type="number" placeholder="鍒�" /> </div> - <div style="margin-top:5px;"> + <div style="margin-top: 5px"> <el-button @click="deleteRange">鍒犻櫎</el-button> <el-button @click="cancalPop">鍙栨秷</el-button> <el-button @click="timeAck">纭畾</el-button> @@ -49,7 +56,6 @@ <script> export default { mounted() { - this.initMain(); this.initMainDummy(); }, @@ -71,43 +77,43 @@ isPopup: false, popPos: { x: "", - y: "" + y: "", }, changeTime: { startHour: "", startMin: "", endHour: "", - endMin: "" + endMin: "", }, rangeArrBackup: "", styleClass: { weekTextColor: "", minutePerColor: "#cdcdcd", - minutePerTextColor: "#808080" - } + minutePerTextColor: "#808080", + }, }; }, props: { timeData: { - default: () => { }, - type: Array + default: () => {}, + type: Array, }, mainId: { type: String, - default: "" + default: "", }, itemId: { type: String, - default: "" + default: "", }, itemName: { type: String, - default: "" + default: "", }, edit: { type: Boolean, - default: false - } + default: false, + }, }, watch: { changeTime: { @@ -131,24 +137,27 @@ } if (newVal.startMin > 60) { - newVal.startMin = 0 + newVal.startMin = 0; } if (newVal.startMin < 0) { - newVal.startMin = 60 + newVal.startMin = 60; } if (newVal.endMin > 60) { - newVal.endMin = 0 + newVal.endMin = 0; } if (newVal.endMin < 0) { - newVal.endMin = 0 + newVal.endMin = 0; } - if (parseInt(newVal.startHour) == parseInt(newVal.endHour) && parseInt(newVal.startMin) > parseInt(newVal.endMin)) { - newVal.startMin = 0 + if ( + parseInt(newVal.startHour) == parseInt(newVal.endHour) && + parseInt(newVal.startMin) > parseInt(newVal.endMin) + ) { + newVal.startMin = 0; } }, - deep: true - } + deep: true, + }, }, methods: { timeAck() { @@ -157,14 +166,24 @@ let perM = perH / 60; let tempRangeInfo = this.rangeArr[rangeInfo.ownedIndex].rangeInfo; - tempRangeInfo.maxX = this.changeTime.endHour * perH + this.changeTime.endMin * perM + 50.5; - tempRangeInfo.minX = this.changeTime.startHour * perH + this.changeTime.startMin * perM + 50.5; + tempRangeInfo.maxX = + this.changeTime.endHour * perH + this.changeTime.endMin * perM + 50.5; + tempRangeInfo.minX = + this.changeTime.startHour * perH + + this.changeTime.startMin * perM + + 50.5; tempRangeInfo.width = tempRangeInfo.maxX - tempRangeInfo.minX; for (let i = 0; i < this.gridArr.length; i++) { let num = 0; for (let j = 0; j < this.rangeArr.length; j++) { - if (this.gridArr[i].posIndex === this.rangeArr[j].rangeInfo.posIndex) { - this.gridArr[i].rangeList.splice(num, 1, this.rangeArr[j].rangeInfo); + if ( + this.gridArr[i].posIndex === this.rangeArr[j].rangeInfo.posIndex + ) { + this.gridArr[i].rangeList.splice( + num, + 1, + this.rangeArr[j].rangeInfo + ); num++; } } @@ -310,9 +329,11 @@ return; } this.actRange.rangeInfo.minX = tempMinxX; - this.actRange.rangeInfo.maxX = tempMinxX + this.actRange.rangeInfo.width; + this.actRange.rangeInfo.maxX = + tempMinxX + this.actRange.rangeInfo.width; this.currentPointX = e.offsetX; - let tempRangeList = this.gridArr[this.actRange.rangeInfo.posIndex].rangeList; + let tempRangeList = + this.gridArr[this.actRange.rangeInfo.posIndex].rangeList; this.redraw(); // console.log("move-ed"); } else if ( @@ -327,17 +348,17 @@ if ( this.actRange.rangeInfo.minX <= limit.limitLeft || this.actRange.rangeInfo.minX + this.actRange.rangeInfo.width >= - limit.limitRight + limit.limitRight ) { return; } - let tempX + let tempX; if (this.x < 50) { - tempX = 50 + tempX = 50; } else if (this.x > 650) { - tempX = 650 + tempX = 650; } else { - tempX = this.x + tempX = this.x; } let temp = tempX - this.currentPointX > 0 ? true : false; let newWith = 0; @@ -366,8 +387,8 @@ width: 10, height: 14, posIndex: this.actGrid.posIndex, - ownedIndex: 0 - } + ownedIndex: 0, + }, }; let actRangeIndex = 0; for (let i = 0; i < tempRangeList.length; i++) { @@ -395,9 +416,8 @@ } } } - this.actGrid.rangeList = this.gridArr[ - this.actGrid.posIndex - ].rangeList; + this.actGrid.rangeList = + this.gridArr[this.actGrid.posIndex].rangeList; this.actRange = this.rangeArr[this.actRangeIndex]; this.isCreate = true; } @@ -412,7 +432,7 @@ if ( (this.actRange.rangeInfo.minX <= limit.limitLeft || this.actRange.rangeInfo.minX + this.actRange.rangeInfo.width >= - limit.limitRight) && + limit.limitRight) && this.noLimit > 5 ) { this.isResizeRight = false; @@ -441,7 +461,8 @@ return; } this.actRange.rangeInfo.maxX = this.x > 650 ? 650 : this.x; - this.actRange.rangeInfo.width = this.actRange.rangeInfo.maxX - this.actRange.rangeInfo.minX; + this.actRange.rangeInfo.width = + this.actRange.rangeInfo.maxX - this.actRange.rangeInfo.minX; this.noLimit++; this.redraw(); return; @@ -486,7 +507,7 @@ let behind = this.rangeArr[this.actRangeIndex + 1]; let obj = { limitLeft: 50, - limitRight: 650 + limitRight: 650, }; if (before === undefined && behind === undefined) { return obj; @@ -579,7 +600,7 @@ width: 600, height: 14, posIndex: i, - rangeList: [] + rangeList: [], }; this.gridArr.push(tempGrid); let timePer = 600 / 24; @@ -629,7 +650,7 @@ width: diffRange, height: 14, posIndex: i, - ownedIndex: this.rangeArr.length + ownedIndex: this.rangeArr.length, }; rang[j].rangeInfo = rangeInfo; this.gridArr[i].rangeList.push(rangeInfo); @@ -655,10 +676,10 @@ minuteEnd = minuteEnd < 10 ? "0" + minuteEnd : minuteEnd; let textStart = `${hourStart < 10 ? "0" + hourStart : hourStart}:${ minutetStart === 60 ? "00" : minutetStart - }`; + }`; let textEnd = `${hourEnd < 10 ? "0" + hourEnd : hourEnd}:${ minuteEnd === 60 ? "00" : minuteEnd - }`; + }`; let startPointX = rangeInfo.minX - 14; let startPointY = rangeInfo.maxY + 10; let endPointX = rangeInfo.maxX - 13; @@ -684,7 +705,7 @@ day: i + 1, time_range: (() => { let range = []; - this.rangeArr.forEach(item => { + this.rangeArr.forEach((item) => { if (item.rangeInfo.posIndex === i) { let rangeInfo = item.rangeInfo; let hourStart = parseInt((rangeInfo.minX - 50.5) / (600 / 24)); @@ -702,23 +723,23 @@ minuteEnd = minuteEnd < 10 ? "0" + minuteEnd : minuteEnd; range.push({ start: hourStart + ":" + minutetStart, - end: hourEnd + ":" + minuteEnd + end: hourEnd + ":" + minuteEnd, }); } }); return range; - })() + })(), }); } let obj = { id: this.itemId, name: this.itemName, - time_rule: timeRule + time_rule: timeRule, }; this.$emit("range-update", obj); - } - } + }, + }, }; </script> diff --git a/src/components/wasmPlayer/index.vue b/src/components/wasmPlayer/index.vue index 7d0edc4..aab90e2 100644 --- a/src/components/wasmPlayer/index.vue +++ b/src/components/wasmPlayer/index.vue @@ -176,7 +176,7 @@ return { player: null, playerId: 0, - Camera: new VideoRuleData(isGb), + Camera: new VideoRuleData(this.isGb), showCanvas: true, canvasData: { line: [], diff --git a/src/pages/ai/index/App.vue b/src/pages/ai/index/App.vue index 9f98453..e466408 100644 --- a/src/pages/ai/index/App.vue +++ b/src/pages/ai/index/App.vue @@ -26,7 +26,8 @@ <span class="icon iconfont all-scene"></span> <el-input placeholder="鎼滅储" - v-model="inputText" @change="searchAll" + v-model="inputText" + @change="searchAll" class="input-with-select" > <i class="el-icon-search" slot="prepend"></i> @@ -568,9 +569,9 @@ this.autoRefresh = false; }, methods: { - searchAll(){ - this.getAllApps() - this.getAllSdk() + searchAll() { + this.getAllApps(); + this.getAllSdk(); this.getUnActivedList(1); this.getUnActivedAppList(); }, @@ -695,7 +696,7 @@ }) .catch((e) => { this.isInstall = false; - this.$message.error(e.data); + this.$message.error(e.msg); }); }, downloadApp(app, action) { @@ -730,7 +731,7 @@ let iArry = []; let sArry = []; let nArry = []; - let rsp = await getApps({appName:this.inputText}); + let rsp = await getApps({ appName: this.inputText }); if (rsp && rsp.success) { // 閬嶅巻app鐨勮繃绋嬮噸缃� this.appUpgreading = false; @@ -794,7 +795,7 @@ }; }, getUnActivedList(v) { - getUnActivedSdk({sdkName:this.inputText}).then((res) => { + getUnActivedSdk({ sdkName: this.inputText }).then((res) => { if (res.code == 200) { this.unActivedSDKList = res.data; const len = this.unActivedSDKList.length; @@ -817,7 +818,7 @@ }); }, getUnActivedAppList() { - getUnActivedApp({appName:this.inputText}).then((res) => { + getUnActivedApp({ appName: this.inputText }).then((res) => { if (res.code == 200) { this.unActivedAppList = res.data; this.pickTab(); @@ -844,8 +845,7 @@ _this.$notify.error(res.data.failMsg.failMsg); } }) - .catch((e) => { - }); + .catch((e) => {}); } else if (this.activeTab == "app") { //婵�娲诲簲鐢� actApp(item.id, "") @@ -861,8 +861,7 @@ _this.$notify.error(res.data.failMsg.failMsg); } }) - .catch((e) => { - }); + .catch((e) => {}); } }, onFileUpload(file) { @@ -907,7 +906,7 @@ let installedList = []; let unInstalledList = []; let hasNewVersionList = []; - let res = await findAllSdk({sdkName:this.inputText}); + let res = await findAllSdk({ sdkName: this.inputText }); if (res && res.success) { this.sdkUpgreading = false; diff --git a/src/pages/ai/index/detail.vue b/src/pages/ai/index/detail.vue index 49c80a7..65ae2e3 100644 --- a/src/pages/ai/index/detail.vue +++ b/src/pages/ai/index/detail.vue @@ -158,10 +158,9 @@ /> </div> <div class="desc"> - <el-tooltip :content="item.name" effect="light"> - - <div class="desc-1">{{ item.name }}</div> - </el-tooltip> + <el-tooltip :content="item.name" effect="light"> + <div class="desc-1">{{ item.name }}</div> + </el-tooltip> <div class="desc-2">鐗堟湰 {{ item.productVersion || "2.0.0" }}</div> </div> <div class="right-btn"> @@ -451,10 +450,11 @@ } }) .catch((e) => { + console.log(e); this.isInstall = false; this.$message({ type: "error", - message: e.data, + message: e.msg, }); }); }, diff --git a/src/pages/cameraAccess/components/DataStackInfo.vue b/src/pages/cameraAccess/components/DataStackInfo.vue index 55e70d6..aab0acd 100644 --- a/src/pages/cameraAccess/components/DataStackInfo.vue +++ b/src/pages/cameraAccess/components/DataStackInfo.vue @@ -4,14 +4,26 @@ <el-col :span="12"> <el-form ref="addForm" :model="form" :rules="rules" label-width="88px"> <el-form-item label="鍚嶇О" prop="name" style="width: 440px"> - <el-input v-model="form.name" size="small" :disabled="isDisabled"></el-input> + <el-input + v-model="form.name" + size="small" + :disabled="isDisabled" + ></el-input> </el-form-item> <el-form-item label="绫诲瀷" prop="type" style="width: 440px"> - <el-radio v-model="form.type" :label="1" :disabled="!isAdd">瑙嗛</el-radio> - <el-radio v-model="form.type" :label="2" :disabled="!isAdd">鍥剧墖</el-radio> - <el-radio v-model="form.type" :label="3" :disabled="!isAdd">闊抽</el-radio> - <el-radio v-model="form.type" :label="4" :disabled="!isAdd">鍏朵粬鏁版嵁</el-radio> + <el-radio v-model="form.type" :label="1" :disabled="!isAdd" + >瑙嗛</el-radio + > + <el-radio v-model="form.type" :label="2" :disabled="!isAdd" + >鍥剧墖</el-radio + > + <el-radio v-model="form.type" :label="3" :disabled="!isAdd" + >闊抽</el-radio + > + <el-radio v-model="form.type" :label="4" :disabled="!isAdd" + >鍏朵粬鏁版嵁</el-radio + > </el-form-item> <el-form-item label="澶勭悊鍒嗚鲸鐜�" style="width: 440px"> <el-select @@ -24,19 +36,49 @@ <el-option v-for="item in form.resolutions" :key="`${item.width}*${item.height}`" - :label="`${item.width}*${item.height}` == '0*0' ? '鏈満鍒嗚鲸鐜�' : `${item.width}*${item.height}`" + :label=" + `${item.width}*${item.height}` == '0*0' + ? '鏈満鍒嗚鲸鐜�' + : `${item.width}*${item.height}` + " :value="`${item.width}*${item.height}`" ></el-option> </el-select> </el-form-item> - <el-form-item label="澶勭悊瀹屾垚鍚庤嚜鍔ㄥ垹闄ゆ枃浠�" prop="isAutoDelFile" label-width="200px" style="width: 440px"> - <el-radio v-model="form.isAutoDelFile" :label="true" :disabled="isDisabled">鏄�</el-radio> - <el-radio v-model="form.isAutoDelFile" :label="false" :disabled="isDisabled">鍚�</el-radio> + <el-form-item + label="澶勭悊瀹屾垚鍚庤嚜鍔ㄥ垹闄ゆ枃浠�" + prop="isAutoDelFile" + label-width="200px" + style="width: 440px" + > + <el-radio + v-model="form.isAutoDelFile" + :label="true" + :disabled="isDisabled" + >鏄�</el-radio + > + <el-radio + v-model="form.isAutoDelFile" + :label="false" + :disabled="isDisabled" + >鍚�</el-radio + > </el-form-item> <el-form-item label-width="0px" style="text-align: left"> - <el-button size="small" type="primary" @click="onSubmit('addForm')" :disabled="isDisabled">淇濆瓨</el-button> - <el-button type="danger" size="small" @click="deleteDir" v-if="!isAdd" :disabled="isDisabled" + <el-button + size="small" + type="primary" + @click="onSubmit('addForm')" + :disabled="isDisabled" + >淇濆瓨</el-button + > + <el-button + type="danger" + size="small" + @click="deleteDir" + v-if="!isAdd" + :disabled="isDisabled" >鍒犻櫎鏁版嵁鏍�</el-button > </el-form-item> @@ -62,7 +104,10 @@ :style="`width:80%;height:174px;position: relative;left: -12px;`" v-if="PollData.barCharts && PollData.barCharts.length !== 0" > - <eChartsBar ref="cpuMeneryCharts" :xAxisData="PollData.barCharts"></eChartsBar> + <eChartsBar + ref="cpuMeneryCharts" + :xAxisData="PollData.barCharts" + ></eChartsBar> </div> </div> </el-col> @@ -71,8 +116,16 @@ <!-- 涓婁紶绠$悊 --> <el-divider></el-divider> <div class="upload-menu"> - <span @click="activeName = 'uploaded'" :class="activeName === 'uploaded' ? 'active tab' : 'tab'">宸蹭笂浼�</span> - <span @click="activeName = 'uploading'" :class="activeName === 'uploading' ? 'active tab' : 'tab'">姝e湪涓婁紶</span> + <span + @click="activeName = 'uploaded'" + :class="activeName === 'uploaded' ? 'active tab' : 'tab'" + >宸蹭笂浼�</span + > + <span + @click="activeName = 'uploading'" + :class="activeName === 'uploading' ? 'active tab' : 'tab'" + >姝e湪涓婁紶</span + > <div class="btn-right"> <el-input @@ -83,16 +136,36 @@ size="small" @change="handelSearchInputChange" > - <i class="el-icon-search el-input__icon" style="color: #dcdfe6; padding: 0px" slot="prefix"></i> + <i + class="el-icon-search el-input__icon" + style="color: #dcdfe6; padding: 0px" + slot="prefix" + ></i> </el-input> <!-- 鎵归噺鏆傚仠 --> - <el-tooltip content="鎵归噺鏆傚仠" placement="bottom" popper-class="atooltip"> - <el-button type="text" class="iconfont iconzanting btn" @click="handleFileStatus({}, 0, true)"></el-button> + <el-tooltip + content="鎵归噺鏆傚仠" + placement="bottom" + popper-class="atooltip" + > + <el-button + type="text" + class="iconfont iconzanting btn" + @click="handleFileStatus({}, 0, true)" + ></el-button> </el-tooltip> <!-- 鎵归噺鍒犻櫎 --> - <el-tooltip content="鎵归噺鍒犻櫎" placement="bottom" popper-class="atooltip"> - <el-button type="text" class="el-icon-delete btn" @click="handleFileDelete({}, true)"></el-button> + <el-tooltip + content="鎵归噺鍒犻櫎" + placement="bottom" + popper-class="atooltip" + > + <el-button + type="text" + class="el-icon-delete btn" + @click="handleFileDelete({}, true)" + ></el-button> </el-tooltip> <!-- 鏂囦欢涓婁紶 --> @@ -123,12 +196,16 @@ :header-cell-style="{ background: '#f8f8f8', color: '#222222', - textAlign: 'center' + textAlign: 'center', }" @select="handleSelect" @select-all="handleSelect" > - <el-table-column type="selection" align="center" :selectable="isSelectable"></el-table-column> + <el-table-column + type="selection" + align="center" + :selectable="isSelectable" + ></el-table-column> <el-table-column prop="name" label="鏂囦欢鍚�"> <template slot-scope="{ row }"> <div :class="snapshotClass"> @@ -146,7 +223,9 @@ style="width: 30x; height: 30px; background: #fff" :src="`/files/${row.path.substr(row.path.lastIndexOf('/') + 1)}`" fit="fill" - :preview-src-list="[`/files/${row.path.substr(row.path.lastIndexOf('/') + 1)}`]" + :preview-src-list="[ + `/files/${row.path.substr(row.path.lastIndexOf('/') + 1)}`, + ]" > <div slot="error" :class="snapshotClass"></div> </el-image> @@ -164,13 +243,18 @@ margin-left: 10px; " /> - <a v-else style="line-height: 30px; margin-left: 10px; cursor: pointer" @click="preview(row)">{{ - row.name - }}</a> + <a + v-else + style="line-height: 30px; margin-left: 10px; cursor: pointer" + @click="preview(row)" + >{{ row.name }}</a + > </template> </el-table-column> <el-table-column prop="fileSize" label="澶у皬"> - <template slot-scope="scope">{{ scope.row.size | readFileSizeUnit }}</template> + <template slot-scope="scope">{{ + scope.row.size | readFileSizeUnit + }}</template> </el-table-column> <el-table-column prop="duration" @@ -179,14 +263,29 @@ align="center" v-if="form.type != 2" ></el-table-column> - <el-table-column prop="uploadTime" label="涓婁紶鏃堕棿" show-overflow-tooltip align="center"> - <template slot-scope="scope">{{ scope.row.createTime | moment }}</template> + <el-table-column + prop="uploadTime" + label="涓婁紶鏃堕棿" + show-overflow-tooltip + align="center" + > + <template slot-scope="scope">{{ + scope.row.createTime | moment + }}</template> </el-table-column> - <el-table-column prop="status" label="澶勭悊鐘舵��" show-overflow-tooltip align="center"> + <el-table-column + prop="status" + label="澶勭悊鐘舵��" + show-overflow-tooltip + align="center" + > <template slot-scope="scope"> <div class="lowHash" - v-if="!PollData.stackChannelCount && (scope.row.status == '1' || scope.row.status == '2')" + v-if=" + !PollData.stackChannelCount && + (scope.row.status == '1' || scope.row.status == '2') + " > 鏁版嵁鏍堢畻鍔涗笉瓒� </div> @@ -204,10 +303,18 @@ :disabled="scope.row.status == 2" class="el-icon-top btn" @click="handleSortFile(1, scope.row.id)" - :style="scope.row.id === fileList[0].id ? 'visibility:hidden' : 'visibility:initial'" + :style=" + scope.row.id === fileList[0].id + ? 'visibility:hidden' + : 'visibility:initial' + " ></el-button> <!-- 鏆傚仠 --> - <el-tooltip content="鏆傚仠澶勭悊" placement="bottom" popper-class="atooltip"> + <el-tooltip + content="鏆傚仠澶勭悊" + placement="bottom" + popper-class="atooltip" + > <el-button type="text" :disabled="scope.row.status == 2" @@ -218,7 +325,11 @@ </el-tooltip> <!-- 寮�濮� --> - <el-tooltip content="閲嶆柊寮�濮�" placement="bottom" popper-class="atooltip"> + <el-tooltip + content="閲嶆柊寮�濮�" + placement="bottom" + popper-class="atooltip" + > <el-button type="text" :disabled="scope.row.status == 2" @@ -229,7 +340,11 @@ </el-tooltip> <!-- 閲嶆柊澶勭悊 --> - <el-tooltip content="閲嶆柊澶勭悊" placement="bottom" popper-class="atooltip"> + <el-tooltip + content="閲嶆柊澶勭悊" + placement="bottom" + popper-class="atooltip" + > <el-button type="text" :disabled="scope.row.status == 2" @@ -242,15 +357,25 @@ <!-- 鍏朵粬鎿嶄綔 --> <el-dropdown @command="dropdownClick"> <!-- <span class="iconfont icongengduo1 btn"></span> --> - <el-button type="text" :disabled="scope.row.status == 2" class="iconfont icongengduo1 btn"></el-button> + <el-button + type="text" + :disabled="scope.row.status == 2" + class="iconfont icongengduo1 btn" + ></el-button> <el-dropdown-menu slot="dropdown"> - <el-dropdown-item icon="el-icon-edit" :command="{ cb: handleFileRename, data: scope.row }" + <el-dropdown-item + icon="el-icon-edit" + :command="{ cb: handleFileRename, data: scope.row }" >閲嶅懡鍚�</el-dropdown-item > - <el-dropdown-item icon="el-icon-copy-document" :command="{ cb: handleFileMove, data: scope.row }" + <el-dropdown-item + icon="el-icon-copy-document" + :command="{ cb: handleFileMove, data: scope.row }" >绉诲姩/澶嶅埗</el-dropdown-item > - <el-dropdown-item icon="el-icon-delete" :command="{ cb: handleFileDelete, data: scope.row }" + <el-dropdown-item + icon="el-icon-delete" + :command="{ cb: handleFileDelete, data: scope.row }" >鍒犻櫎</el-dropdown-item > </el-dropdown-menu> @@ -280,7 +405,9 @@ <file-uploader :ref="`uploader_${stack.id}`" :key="stack.id" - v-show="activeName === 'uploading' && stack.id == DataStackPool.selectedDir.id" + v-show=" + activeName === 'uploading' && stack.id == DataStackPool.selectedDir.id + " :sourceType="stack.type" /> </template> @@ -290,25 +417,43 @@ 鎮ㄧ殑娴忚鍣ㄤ笉鏀寔 video 鏍囩銆� </video> --> - <wasm-player :rtspUrl="videoUrl" :showArea="false" v-if="videoUrl"></wasm-player> + <wasm-player + :rtspUrl="videoUrl" + :showArea="false" + v-if="videoUrl" + ></wasm-player> <el-image v-if="imgUrl" :src="imgUrl"></el-image> </el-dialog> <el-dialog title="绉诲姩/澶嶅埗" :visible.sync="fileDialog" width="500px"> <p style="margin: 0px 0px 20px 0px">璇烽�夋嫨鎮ㄦ兂澶嶅埗/绮樿创鍒扮殑 鏁版嵁鏍堬細</p> - <span class="iconfont iconwenjian" style="color: #3d68e1; margin-right: 5px"></span> + <span + class="iconfont iconwenjian" + style="color: #3d68e1; margin-right: 5px" + ></span> <el-select v-model="targetDir" placeholder="璇烽�夋嫨鐩爣鏂囦欢澶�" size="mini"> - <el-option v-for="item in dirOptions" :key="item.id" :label="item.name" :value="item.id"> + <el-option + v-for="item in dirOptions" + :key="item.id" + :label="item.name" + :value="item.id" + > <span class="iconfont iconwenjian"></span> <span style="margin-left: 10px">{{ item.name }}</span> </el-option> </el-select> <div style="margin-top: 20px"> - <el-button type="primary" size="mini" @click="cellFileCopy">澶嶅埗</el-button> - <el-button type="primary" size="mini" @click="cellFileMove">绉诲姩</el-button> - <el-button type="info" size="mini" @click="fileDialog = false">鍙栨秷</el-button> + <el-button type="primary" size="mini" @click="cellFileCopy" + >澶嶅埗</el-button + > + <el-button type="primary" size="mini" @click="cellFileMove" + >绉诲姩</el-button + > + <el-button type="info" size="mini" @click="fileDialog = false" + >鍙栨秷</el-button + > </div> </el-dialog> </div> @@ -325,14 +470,15 @@ findAllFileByStackId, renameFile, moveFile, - copyFile -} from "@/api/localVedio" + copyFile, +} from "@/api/localVedio"; +import { getCameraSceneRule } from "@/api/scene"; -import InfoCard from "./infoCard" -import eChartsBar from "@/components/subComponents/eChartsBar" -import FileUploader from "@/components/subComponents/FileUpload" +import InfoCard from "./infoCard"; +import eChartsBar from "@/components/subComponents/eChartsBar"; +import FileUploader from "@/components/subComponents/FileUpload"; -import WasmPlayer from "@/components/wasmPlayer" +import WasmPlayer from "@/components/wasmPlayer"; export default { name: "DataStackInfo", @@ -340,15 +486,15 @@ InfoCard, eChartsBar, FileUploader, - WasmPlayer + WasmPlayer, }, props: { cameraList: { default: () => { - return [] + return []; }, - type: Array - } + type: Array, + }, }, filters: { statusFormat(value) { @@ -358,51 +504,62 @@ 0: "鏆傚仠澶勭悊", 1: "绛夊緟澶勭悊", 2: "澶勭悊涓�", - 9: "澶勭悊瀹屾垚" - } - return statusCode[value] + 9: "澶勭悊瀹屾垚", + }; + return statusCode[value]; }, readFileSizeUnit(value) { - let UNITS = [" B", " KB", " MB", " GB", " TB", " PB", " EB", " ZB", " YB"] - let format = function(value, power) { - return (value / Math.pow(1024, power)).toFixed(2) + UNITS[power] - } + let UNITS = [ + " B", + " KB", + " MB", + " GB", + " TB", + " PB", + " EB", + " ZB", + " YB", + ]; + let format = function (value, power) { + return (value / Math.pow(1024, power)).toFixed(2) + UNITS[power]; + }; - value = parseFloat(value, 10) + value = parseFloat(value, 10); for (var i = 0; i < UNITS.length; i++) { if (value < Math.pow(1024, i)) { if (UNITS[i - 1]) { - return format(value, i - 1) + return format(value, i - 1); } - return value + UNITS[i] + return value + UNITS[i]; } } - return format(value, i - 1) - } + return format(value, i - 1); + }, }, computed: { snapshotClass() { - let classs = ["snapshot"] + let classs = ["snapshot"]; if (this.form.type === 1) { - classs.push("snapshot-video") + classs.push("snapshot-video"); } else if (this.form.type === 2) { - classs.push("snapshot-image") + classs.push("snapshot-image"); } else if (this.form.type === 3) { - classs.push("snapshot-audio") + classs.push("snapshot-audio"); } else { - classs.push("snapshot-files") + classs.push("snapshot-files"); } - return classs + return classs; }, dirOptions() { return this.DataStackPool.dirs.filter((dir) => { - return dir.id !== this.DataStackPool.selectedDir.id - }) - } + return dir.id !== this.DataStackPool.selectedDir.id; + }); + }, }, data() { return { + hasRule: false, videoUrl: "", imgUrl: "", previewDialog: false, @@ -414,14 +571,16 @@ searchInput: "", form: { id: "", - resolution: "" + resolution: "", }, fileList: [], // 璁板綍娣诲姞鐘舵�� isAdd: false, addParentId: "", rules: { - dirName: [{ required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }] + dirName: [ + { required: true, message: "璁惧鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, + ], }, activeName: "uploaded", page: 1, @@ -431,31 +590,43 @@ editRowId: "", timer: 0, targetDir: "", - targetFile: "" - } + targetFile: "", + }; }, mounted() { - this.initFormData() + this.initFormData(); }, beforeDestroy() { - this.taskUid = 0 + this.taskUid = 0; }, methods: { + async getRule() { + const res = await getCameraSceneRule({ + cameraId: this.DataStackPool.selectedDir.id, + }); + if (res && res.success && res.data.rules && res.data.rules.length > 0) { + this.hasRule = true; + console.log(this.hasRule); + } else { + this.hasRule = false; + } + }, checkResolution(val) { - this.form.resolution_width = Number(val.split("*")[0]) - this.form.resolution_height = Number(val.split("*")[1]) + this.form.resolution_width = Number(val.split("*")[0]); + this.form.resolution_height = Number(val.split("*")[1]); }, preview(row) { - this.previewDialog = true + this.previewDialog = true; if (row.type === 1) { - this.videoUrl = "/files/" + row.identifier + ".mp4" + this.videoUrl = "/files/" + row.identifier + ".mp4"; // 涓烘湐榛勪娇鐢ㄦ暟鎹爤瀹氬埗, 娌℃湁MD5 if (row.identifier == "") { - this.videoUrl = row.path.replace("/opt/vasystem", "") + this.videoUrl = row.path.replace("/opt/vasystem", ""); } } else if (row.type === 2) { - this.imgUrl = "/files/" + row.path.substr(row.path.lastIndexOf("/") + 1) + this.imgUrl = + "/files/" + row.path.substr(row.path.lastIndexOf("/") + 1); } }, // 娓呯┖杈撳叆妗� @@ -471,61 +642,61 @@ resolutions: [ { height: 0, - width: 0 - } - ] - } + width: 0, + }, + ], + }; }, // 娣诲姞璁惧 addDir(node) { - this.isAdd = true - this.isDisabled = false - this.initFormData() - this.DataStackPool.clean() - this.fileList = [] + this.isAdd = true; + this.isDisabled = false; + this.initFormData(); + this.DataStackPool.clean(); + this.fileList = []; }, // 鏁版嵁鏍堟枃浠跺す閫変腑鏃讹紝鐢辩埗缁勪欢瑙﹀彂 selectDir(node) { if (node.id === "") { - return + return; } - this.isDisabled = false - this.isAdd = false - this.videoItem = null - this.$refs.addForm.resetFields() + this.isDisabled = false; + this.isAdd = false; + this.videoItem = null; + this.$refs.addForm.resetFields(); // this.initFormData(); // this.$refs.addForm.clearValidate(); - this.form = { ...node } - this.form.resolution = `${node.resolution_width}*${node.resolution_height}` - delete this.form.createTime - delete this.form.updateTime - delete this.form.status + this.form = { ...node }; + this.form.resolution = `${node.resolution_width}*${node.resolution_height}`; + delete this.form.createTime; + delete this.form.updateTime; + delete this.form.status; - this.fileList = [] - this.searchInput = "" - this.page = 1 - this.size = 10 - this.total = 0 - this.multipleSelection = [] // 娓呯┖閫変腑鐘舵�� - this.initFetchListTask() - this.videoUrl = "" - this.imgUrl = "" + this.fileList = []; + this.searchInput = ""; + this.page = 1; + this.size = 10; + this.total = 0; + this.multipleSelection = []; // 娓呯┖閫変腑鐘舵�� + this.initFetchListTask(); + this.videoUrl = ""; + this.imgUrl = ""; }, initFetchListTask() { - const uid = Math.round(Math.random() * 1000) - this.taskUid = uid - this.timingtask(uid) + const uid = Math.round(Math.random() * 1000); + this.taskUid = uid; + this.timingtask(uid); }, timingtask(uid) { if (uid !== this.taskUid || this.form.id === "") { - return + return; } - this.fetchFileList() - let _this = this + this.fetchFileList(); + let _this = this; this.timer = setTimeout(() => { - _this.timingtask(uid) - }, 2 * 1000) + _this.timingtask(uid); + }, 2 * 1000); }, fetchFileList() { findAllFileByStackId({ @@ -533,26 +704,26 @@ stackId: this.form.id, page: this.page, size: this.size, - type: 0 + type: 0, }) .then((rsp) => { if (rsp && rsp.success && rsp.data.total >= 0) { - this.fileList = rsp.data.dataList - this.total = rsp.data.total + this.fileList = rsp.data.dataList; + this.total = rsp.data.total; // 瀹氭椂鍒锋柊浼氭竻绌洪�変腑鐘舵�侊紝鍦ㄨ繖閲屾仮澶� this.fileList.forEach((row) => { //this.polygonDatas.push({snapshot_url:row.snapshot_url}) if (this.multipleSelection.indexOf(row.id) !== -1) { this.$nextTick(() => { - this.$refs.multipleTable.toggleRowSelection(row) - }) + this.$refs.multipleTable.toggleRowSelection(row); + }); } - }) + }); } }) .catch((err) => { - console.log(err) - }) + console.log(err); + }); }, // 淇濆瓨 @@ -561,9 +732,9 @@ if (this.form.name.indexOf("/") >= 0) { this.$notify({ type: "error", - message: "淇濆瓨澶辫触,鏁版嵁鏍堝悕绉颁笉鑳藉寘鍚�'/'锛�" - }) - return + message: "淇濆瓨澶辫触,鏁版嵁鏍堝悕绉颁笉鑳藉寘鍚�'/'锛�", + }); + return; } } this.$refs[formName].validate(async (valid) => { @@ -572,227 +743,239 @@ if (rsp.success) { this.$notify({ type: "success", - message: "鏁版嵁鏍堜俊鎭繚瀛樻垚鍔燂紒" - }) - this.DataStackPool.fetchFiles() + message: "鏁版嵁鏍堜俊鎭繚瀛樻垚鍔燂紒", + }); + this.DataStackPool.fetchFiles(); } else { this.$notify({ type: "error", - message: "鏁版嵁鏍堜俊鎭繚瀛樺け璐ワ紒" - }) + message: "鏁版嵁鏍堜俊鎭繚瀛樺け璐ワ紒", + }); } - }) + }); } - }) + }); }, // 鍒犻櫎鎽勫儚鏈� deleteDir() { this.$confirm("鏄惁鍒犻櫎姝ゆ枃浠跺す锛�", { center: true, cancelButtonClass: "comfirm-class-cancle", - confirmButtonClass: "comfirm-class-sure" + confirmButtonClass: "comfirm-class-sure", }).then(() => { delDir(this.form.id) .then((res) => { if (res.success) { - this.initFormData() + this.initFormData(); this.$notify({ type: "success", - message: "鍒犻櫎鎴愬姛锛�" - }) - this.DataStackPool.fetchFiles() - this.DataStackPool.selectedDir = {} + message: "鍒犻櫎鎴愬姛锛�", + }); + this.DataStackPool.fetchFiles(); + this.DataStackPool.selectedDir = {}; // 鍒犻櫎鍚庢仮澶嶆湭閫変腑鐘舵�� - this.addDir() - this.isAdd = false - this.isDisabled = true + this.addDir(); + this.isAdd = false; + this.isDisabled = true; } else { this.$notify({ type: "error", - message: "鍒犻櫎澶辫触锛�" - }) + message: "鍒犻櫎澶辫触锛�", + }); } }) .catch((err) => { this.$notify({ type: "error", - message: "鍒犻櫎澶辫触锛�" - }) - }) - }) + message: "鍒犻櫎澶辫触锛�", + }); + }); + }); }, handleTabClick(tab, event) { - console.log(tab, event) + console.log(tab, event); }, handleSelect(val) { this.multipleSelection = val.map((row) => { - return row.id - }) + return row.id; + }); }, handelSearchInputChange(val) { - this.multipleSelection = [] + this.multipleSelection = []; }, handleUpload() { - console.log(this.DataStackPool.selectedDir.id) - console.log(this.$refs[`uploader_${this.DataStackPool.selectedDir.id}`][0].$refs.button.$refs.btn.click()) + console.log(this.DataStackPool.selectedDir); + console.log(this.DataStackPool.dirs); + this.$refs[ + `uploader_${this.DataStackPool.selectedDir.id}` + ][0].$refs.button.$refs.btn.click(); }, handleRefrashFileList(val) { - this.page = val - this.multipleSelection = [] - this.fetchFileList() + this.page = val; + this.multipleSelection = []; + this.fetchFileList(); }, handleSizeChange(val) { - this.size = val - this.multipleSelection = [] - this.fetchFileList() + this.size = val; + this.multipleSelection = []; + this.fetchFileList(); }, async handleSortFile(direct, id) { let res = await sortFile({ id: id, - direct: direct - }) + direct: direct, + }); if (res && res.success) { - this.fetchFileList() + this.fetchFileList(); //鏇存柊鐙珛鍦烘櫙鏁版嵁鏍堟枃浠� - console.log(this.$root.$children[0].$children[1].$refs["sepRule"]) - this.$root.$children[0].$children[1].$refs["sepRule"].getStackFiles() + console.log(this.$root.$children[0].$children[1].$refs["sepRule"]); + this.$root.$children[0].$children[1].$refs["sepRule"].getStackFiles(); this.$notify({ type: "success", - message: "鏂囦欢鎺掑簭鎴愬姛锛�" - }) + message: "鏂囦欢鎺掑簭鎴愬姛锛�", + }); } }, async handleFileStatus(row, status, multi = false) { - let ids = this.multipleSelection + let ids = this.multipleSelection; if (!multi) { - ids = [row.id] + ids = [row.id]; } if (!ids.length) { this.$notify({ type: "error", - message: "鏈�変腑鏂囦欢" - }) - return + message: "鏈�変腑鏂囦欢", + }); + return; + } + if (!this.hasRule && status === 1) { + this.$notify({ + type: "error", + message: "鎮ㄨ繕鏈厤缃畻娉曞満鏅�,璇峰厛閰嶇疆", + }); + return; } try { let res = await updateStatus({ ids: ids, - status: status - }) + status: status, + }); if (res && res.success) { - this.fetchFileList() + this.fetchFileList(); this.$notify({ type: "success", - message: "鍒囨崲鏂囦欢澶勭悊鐘舵�佹垚鍔�" - }) + message: "鍒囨崲鏂囦欢澶勭悊鐘舵�佹垚鍔�", + }); } } catch { - console.log("err") + console.log("err"); } }, dropdownClick(cmd) { - cmd.cb(cmd.data) + cmd.cb(cmd.data); }, handleFileDelete(rows, multi = false) { - let _this = this - let ids = this.multipleSelection + let _this = this; + let ids = this.multipleSelection; if (!multi) { - ids = [rows.id] + ids = [rows.id]; } if (!ids.length) { this.$notify({ type: "error", - message: "鏈�変腑鏂囦欢" - }) - return + message: "鏈�変腑鏂囦欢", + }); + return; } this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ鏂囦欢鍚楋紵", { center: true, cancelButtonClass: "comfirm-class-cancle", - confirmButtonClass: "comfirm-class-sure" + confirmButtonClass: "comfirm-class-sure", }) .then(() => { deleteLocalFile({ ids: ids }).then((rsp) => { this.$notify({ type: "error", - message: "鏂囦欢宸插垹闄�" - }) - }) + message: "鏂囦欢宸插垹闄�", + }); + }); }) - .catch(() => {}) + .catch(() => {}); }, handleFileMove(row) { - this.targetDir = "" - this.targetFile = row.id - this.fileDialog = true + this.targetDir = ""; + this.targetFile = row.id; + this.fileDialog = true; }, handleFileRename(row) { - this.editRowId = row.id - clearTimeout(this.timer) - this.timer = null + this.editRowId = row.id; + clearTimeout(this.timer); + this.timer = null; }, cellRenameFile(row) { - this.editRowId = "" + this.editRowId = ""; renameFile({ id: row.id, name: row.name }) .then((rsp) => { if (rsp && rsp.success) { this.$notify({ type: "success", - message: "鏂囦欢閲嶅懡鍚嶆垚鍔�" - }) + message: "鏂囦欢閲嶅懡鍚嶆垚鍔�", + }); } else { this.$notify({ type: "error", - message: "鏂囦欢閲嶅懡鍚嶅け璐�" - }) + message: "鏂囦欢閲嶅懡鍚嶅け璐�", + }); } if (!this.timer) { - this.initFetchListTask() + this.initFetchListTask(); } }) .catch(() => { if (!this.timer) { - this.initFetchListTask() + this.initFetchListTask(); } - }) + }); }, isSelectable(row, rowIndex) { - return row.status !== 2 + return row.status !== 2; }, cellFileCopy() { - copyFile({ id: this.targetFile, stackIds: [this.targetDir] }).then((rsp) => { - if (rsp && rsp.success) { - this.$notify({ - type: "success", - message: "澶嶅埗鎴愬姛" - }) - this.fileDialog = false - } else { - this.$notify({ - type: "error", - message: "澶嶅埗澶辫触" - }) + copyFile({ id: this.targetFile, stackIds: [this.targetDir] }).then( + (rsp) => { + if (rsp && rsp.success) { + this.$notify({ + type: "success", + message: "澶嶅埗鎴愬姛", + }); + this.fileDialog = false; + } else { + this.$notify({ + type: "error", + message: "澶嶅埗澶辫触", + }); + } } - }) + ); }, cellFileMove() { moveFile({ id: this.targetFile, stackId: this.targetDir }).then((rsp) => { if (rsp && rsp.success) { this.$notify({ type: "success", - message: "绉诲姩鎴愬姛" - }) - this.fileDialog = false + message: "绉诲姩鎴愬姛", + }); + this.fileDialog = false; } else { this.$notify({ type: "error", - message: "绉诲姩澶辫触" - }) + message: "绉诲姩澶辫触", + }); } - }) - } - } -} + }); + }, + }, +}; </script> <style lang="scss"> diff --git a/src/pages/cameraAccess/components/SceneRule.vue b/src/pages/cameraAccess/components/SceneRule.vue index b89044f..dea5d2e 100644 --- a/src/pages/cameraAccess/components/SceneRule.vue +++ b/src/pages/cameraAccess/components/SceneRule.vue @@ -316,6 +316,7 @@ // this.eventAudio. }, togglePlayer() { + console.log(this.soundPath); if (!this.soundPath) { this.$notify({ type: "info", @@ -324,7 +325,7 @@ return false; } debugger; - this.eventAudio.src = this.soundPath; + this.eventAudio.src = "/httpImage/" + this.soundPath; if (this.togglePlay) { this.eventAudio.play(); this.togglePlay = false; diff --git a/src/pages/cameraAccess/components/SeparateRules.vue b/src/pages/cameraAccess/components/SeparateRules.vue index bb1e9e3..ca799d2 100644 --- a/src/pages/cameraAccess/components/SeparateRules.vue +++ b/src/pages/cameraAccess/components/SeparateRules.vue @@ -448,6 +448,13 @@ this.swiperIndex = this.$refs.swiper.swiper.activeIndex; }, drawBaseImg() { + if (!this.Camera.cameraId) { + this.$notify({ + type: "warning", + message: "璇峰厛閫夋嫨鎽勫儚鏈�", + }); + return; + } if (Array.isArray(this.$refs.canvas)) { if (this.$refs.canvas.length > 0) { this.$refs.canvas[0].showModal(); diff --git a/src/pages/cameraAccess/components/TimeSlider.vue b/src/pages/cameraAccess/components/TimeSlider.vue index f84883f..d2a384e 100644 --- a/src/pages/cameraAccess/components/TimeSlider.vue +++ b/src/pages/cameraAccess/components/TimeSlider.vue @@ -2,7 +2,11 @@ <div class="sub-time-box"> <div class="btn-control"> <div class="el-tabs-edit"> - <span v-if="!editSlider" class="add-btn" @click="handleTabsEdit('', 'edit')"> + <span + v-if="!editSlider" + class="add-btn" + @click="handleTabsEdit('', 'edit')" + > <i class="el-icon-edit"></i> 缂栬緫 </span> @@ -18,9 +22,20 @@ </span> </div> </div> - <el-tabs v-model="activeTab" type="border-card" editable @edit="handleTabsEdit"> - <el-tab-pane v-for="item in VideoManageData.TimeRules" :key="item.id" :name="item.id"> - <span slot="label" @click="tabClick(item)" style="width: 100px">{{ item.name }}</span> + <el-tabs + v-model="activeTab" + type="border-card" + editable + @edit="handleTabsEdit" + > + <el-tab-pane + v-for="item in VideoManageData.TimeRules" + :key="item.id" + :name="item.id" + > + <span slot="label" @click="tabClick(item)" style="width: 100px">{{ + item.name + }}</span> <multi-range-slider :timeData="JSON.parse(item.time_rule)" :mainId="`${item.id}_${type}`" @@ -35,19 +50,19 @@ </template> <script> -import MultiRangeSlider from "@/components/subComponents/MultiRangeSlider" -import { saveTimeRule, deleteTimeRule } from "@/api/timeRule" +import MultiRangeSlider from "@/components/subComponents/MultiRangeSlider"; +import { saveTimeRule, deleteTimeRule } from "@/api/timeRule"; export default { name: "TimeSlider", components: { - MultiRangeSlider + MultiRangeSlider, }, props: { type: { default: "", - type: String - } + type: String, + }, }, data() { return { @@ -62,29 +77,62 @@ { day: 4, time_range: [{ start: "00:00", end: "24:00" }] }, { day: 5, time_range: [{ start: "00:00", end: "24:00" }] }, { day: 6, time_range: [{ start: "00:00", end: "24:00" }] }, - { day: 7, time_range: [{ start: "00:00", end: "24:00" }] } + { day: 7, time_range: [{ start: "00:00", end: "24:00" }] }, ], - isAdding: false - } + isAdding: false, + }; }, mounted() { // window.addEventListener('resize', this.windowSizeChange) }, methods: { handleTabsEdit(tabId, action) { - let tabs = this.VideoManageData.TimeRules + let tabs = this.VideoManageData.TimeRules; if (action === "add") { if (this.isAdding) { - return + return; } else { - this.isAdding = true - let newRule = { - id: "", - name: "鏃堕棿娈�" + this.VideoManageData.TimeRules.length, - time_rule: this.allDay + this.isAdding = true; + let name = "鏃堕棿娈�1"; + + for ( + let index = this.VideoManageData.TimeRules.length; + index > 0; + index-- + ) { + const sliceIndex = + this.VideoManageData.TimeRules[index - 1].name.indexOf("鏃堕棿娈�"); + + if (sliceIndex != -1) { + const number = +this.VideoManageData.TimeRules[ + index - 1 + ].name.slice(sliceIndex + 3); + + console.log(number); + console.log(typeof number); + console.log(typeof NaN); + + if ( + typeof number === "number" && + !Number.isNaN(number) && + number != 0 + ) { + console.log("--------------"); + + name = "鏃堕棿娈�" + (number + 1); + + break; + } + } } - this.updateTimeRule(newRule) + let newRule = { + id: "", + name: name, + time_rule: this.allDay, + }; + + this.updateTimeRule(newRule); } } if (action === "remove") { @@ -92,60 +140,66 @@ this.$notify({ title: "璀﹀憡", message: "姝ゆ椂闂存姝e湪浣跨敤涓紝鏃犳硶鍒犻櫎锛�", - type: "warning" - }) + type: "warning", + }); - return + return; } - this.$confirm("姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ヨ鍒�, 鎵�鍏宠仈鐨勪换鍔″皢浼氬け鏁堬紝鏄惁缁х画?", { - center: true, - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷" - }) + this.$confirm( + "姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ヨ鍒�, 鎵�鍏宠仈鐨勪换鍔″皢浼氬け鏁堬紝鏄惁缁х画?", + { + center: true, + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + } + ) .then(() => { deleteTimeRule({ id: tabId }).then((rsp) => { if (rsp && rsp.success) { - this.VideoManageData.getTimeRule() + this.VideoManageData.getTimeRule(); // this.VideoManageData.TimeRules.splice(2, 1) - this.activeTab = this.VideoManageData.TimeRules[0].id + this.activeTab = this.VideoManageData.TimeRules[0].id; this.$notify({ type: "success", - message: "鍒犻櫎鎴愬姛!" - }) + message: "鍒犻櫎鎴愬姛!", + }); } - }) + }); }) - .catch(() => {}) + .catch(() => {}); } if (action == "edit") { - this.editSlider = true + this.editSlider = true; } if (action == "lock") { - this.editSlider = false + this.editSlider = false; } }, windowSizeChange() { - let timeSlideWidth = document.querySelector(".sub-time-box").clientWidth - this.cavasLength = timeSlideWidth - console.log("鏃堕棿缁勪欢瀹藉害锛�", timeSlideWidth) + let timeSlideWidth = document.querySelector(".sub-time-box").clientWidth; + this.cavasLength = timeSlideWidth; + console.log("鏃堕棿缁勪欢瀹藉害锛�", timeSlideWidth); }, updateTimeRule(rule) { saveTimeRule(rule) .then(async (rsp) => { if (rsp && rsp.success) { - await this.VideoManageData.getTimeRule() - this.isAdding = false + await this.VideoManageData.getTimeRule(); + this.isAdding = false; this.$nextTick(() => { - this.activeTab = this.VideoManageData.TimeRules[this.VideoManageData.TimeRuleSum - 1].id - }) + this.activeTab = + this.VideoManageData.TimeRules[ + this.VideoManageData.TimeRuleSum - 1 + ].id; + }); } else { - this.isAdding = false + this.isAdding = false; } }) .catch(() => { - this.isAdding = false - }) + this.isAdding = false; + }); }, tabClick(item) { if (this.activeTab === item.id) { @@ -154,24 +208,24 @@ cancelButtonText: "鍙栨秷", inputValue: item.name, inputPattern: /^[\S]{1,16}$/, - inputErrorMessage: "鍚嶇О涓嶈兘鍖呭惈绌烘牸" + inputErrorMessage: "鍚嶇О涓嶈兘鍖呭惈绌烘牸", }) .then(({ value }) => { this.updateTimeRule({ id: item.id, name: value, - time_rule: JSON.parse(item.time_rule) - }) + time_rule: JSON.parse(item.time_rule), + }); this.$notify({ type: "success", - message: "鏃堕棿瑙勫垯鍚嶇О淇敼鎴愬姛" - }) + message: "鏃堕棿瑙勫垯鍚嶇О淇敼鎴愬姛", + }); }) - .catch(() => {}) + .catch(() => {}); } - } - } -} + }, + }, +}; </script> <style lang="scss"> .sub-time-box { diff --git a/src/pages/cameraAccess/index/VideoManage.vue b/src/pages/cameraAccess/index/VideoManage.vue index 2f2bd1d..49dd4f0 100644 --- a/src/pages/cameraAccess/index/VideoManage.vue +++ b/src/pages/cameraAccess/index/VideoManage.vue @@ -142,6 +142,7 @@ this.$nextTick(() => { if (this.activeName == "camera-info") { this.$refs.dataStackInfo.selectDir(node); + this.$refs.dataStackInfo.getRule(); } else if (this.activeName == "separate-rule" && node.length !== 0) { this.$refs.sepRule.initCameraData(node.id); } @@ -223,6 +224,7 @@ this.$refs.cameraInfo.selectCamera(this.TreeDataPool.selectedNode); } else if (this.TreeDataPool.treeActiveName == "dataStack") { this.$refs.dataStackInfo.selectDir(this.DataStackPool.selectedDir); + this.$refs.dataStackInfo.getRule(); } } else if (tab.name === "separate-rule") { if (this.TreeDataPool.treeActiveName == "camera") { diff --git a/src/pages/index/components/formAccount.vue b/src/pages/index/components/formAccount.vue index 16ae5a2..d5cdc05 100644 --- a/src/pages/index/components/formAccount.vue +++ b/src/pages/index/components/formAccount.vue @@ -13,6 +13,7 @@ v-model="form.password" placeholder="鑷冲皯涓�6浣嶅瓧绗�" type="password" + show-password ></el-input> </el-form-item> @@ -21,6 +22,7 @@ v-model="form.repassword" placeholder="璇风‘璁ゅ瘑鐮�" type="password" + show-password ></el-input> </el-form-item> </el-form> diff --git a/src/pages/library/components/addBase.vue b/src/pages/library/components/addBase.vue index a4bd69e..286fe33 100644 --- a/src/pages/library/components/addBase.vue +++ b/src/pages/library/components/addBase.vue @@ -357,7 +357,7 @@ } }) .catch((err) => { - this.$notify.error(err.msg); + this.$notify.error(err.msg); }); } }); diff --git a/src/pages/library/components/baseList.vue b/src/pages/library/components/baseList.vue index ef99051..9a70af5 100644 --- a/src/pages/library/components/baseList.vue +++ b/src/pages/library/components/baseList.vue @@ -1,9 +1,17 @@ <template> - <div :style="listWidth ? `width:${listWidth};` : ''" class="out-div el-menu-vertical-demo"> + <div + :style="listWidth ? `width:${listWidth};` : ''" + class="out-div el-menu-vertical-demo" + > <el-collapse v-model="activeNames"> <el-collapse-item name="1" class="el-collapse-item__wrap"> <template slot="title"> - <img v-if="title === '鍚屾搴�'" src="/images/library/鍚屾搴�2.png" alt="" srcset="" /> + <img + v-if="title === '鍚屾搴�'" + src="/images/library/鍚屾搴�2.png" + alt="" + srcset="" + /> <img v-else src="/images/library/鏈湴搴�2.png" alt="" srcset="" /> <span class="m5">{{ title }}</span> <el-tooltip content="娣诲姞鍚屾搴�" placement="top"> @@ -29,11 +37,26 @@ @click.native="clickCategory(index, 'sync', item)" :class="{ activeRow: categoryIndex == 'sync' + index }" > - <el-col :span="12" :class="item.bwType === '1' ? 'c-red' : 'c-green'"> - <p style="text-align: left; margin-left: 5px" class="name-ellipsis" :title="item.tableName"> - <span class="iconfont iconrenyuanku-09" v-if="item.tableType == 'person'"></span> - <span class="iconfont iconcheliangku-09" v-if="item.tableType == 'car'"></span> - <span style="font-size: 14px; font-weight: bold"> {{ item.tableName }}</span> + <el-col + :span="12" + :class="item.bwType === '1' ? 'c-red' : 'c-green'" + > + <p + style="text-align: left; margin-left: 5px" + class="name-ellipsis" + :title="item.tableName" + > + <span + class="iconfont iconrenyuanku-09" + v-if="item.tableType == 'person'" + ></span> + <span + class="iconfont iconcheliangku-09" + v-if="item.tableType == 'car'" + ></span> + <span style="font-size: 14px; font-weight: bold"> + {{ item.tableName }}</span + > </p> </el-col> <el-col :span="10" :offset="1"> @@ -87,10 +110,23 @@ @click.native="clickCategory(index, 'local', item)" :class="{ activeRow: categoryIndex == 'local' + index }" > - <el-col :span="12" :class="item.bwType === '1' ? 'c-red' : 'c-green'"> - <p style="text-align: left; margin-left: 5px" class="name-ellipsis" :title="item.tableName"> - <span class="iconfont iconrenyuanku-09" v-if="item.tableType == 'person'"></span> - <span class="iconfont iconcheliangku-09" v-if="item.tableType == 'car'"></span> + <el-col + :span="12" + :class="item.bwType === '1' ? 'c-red' : 'c-green'" + > + <p + style="text-align: left; margin-left: 5px" + class="name-ellipsis" + :title="item.tableName" + > + <span + class="iconfont iconrenyuanku-09" + v-if="item.tableType == 'person'" + ></span> + <span + class="iconfont iconcheliangku-09" + v-if="item.tableType == 'car'" + ></span> <span> {{ item.tableName }}</span> </p> </el-col> @@ -123,7 +159,7 @@ </div> </template> <script> -import { updateDbTableStatus } from "@/api/baseLibrary" +import { updateDbTableStatus } from "@/api/baseLibrary"; export default { name: "baseList", data() { @@ -133,113 +169,121 @@ categoryIndex: "", syncTableList: [], localTableList: [], - clickBase: {} // 褰撳墠鐐瑰嚮鐨勫簳搴撳璞� - } + clickBase: {}, // 褰撳墠鐐瑰嚮鐨勫簳搴撳璞� + }; }, computed: { isAdmin() { - if (sessionStorage.getItem("userInfo") && sessionStorage.getItem("userInfo") !== "") { - let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username - return loginName === "superadmin" || loginName === "basic" + if ( + sessionStorage.getItem("userInfo") && + sessionStorage.getItem("userInfo") !== "" + ) { + let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username; + return loginName === "superadmin" || loginName === "basic"; } - return false - } + return false; + }, }, mounted() { - this.init() + this.init(); }, methods: { isShow(authority) { - return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1 + return ( + this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1 + ); }, async init(typ) { - await this.BaseManageData.querySyncTables() - this.syncTableList = this.BaseManageData.syncTables + await this.BaseManageData.querySyncTables(); + this.syncTableList = this.BaseManageData.syncTables; if (typ) { - this.clickLast(typ) + this.$emit("getList"); } else { - this.defaultShow() + this.defaultShow(); } - await this.BaseManageData.queryLocalTables() - this.localTableList = this.BaseManageData.localTables + await this.BaseManageData.queryLocalTables(); + this.localTableList = this.BaseManageData.localTables; if (typ) { - this.clickLast(typ) + this.$emit("getList"); } else { - this.defaultShow() + this.defaultShow(); } }, add(type) { - this.$emit("changeShow", null, type) + this.$emit("changeShow", null, type); }, clickLast(type) { // this.$nextTick(() => { // }); - this.clickCategory(this.syncTableList.length - 1, type, this.syncTableList[this.syncTableList.length - 1]) + this.clickCategory( + this.syncTableList.length - 1, + type, + this.syncTableList[this.syncTableList.length - 1] + ); }, clickCategory(index, type, item) { - this.categoryIndex = type + index + this.categoryIndex = type + index; // 璋冪敤鍒囨崲鍙充晶闈㈡澘鐨勫嚱鏁板苟涓斿垏鎹㈢埗缁勪欢涓璱sSelected鐨勫�艰鍙︿竴涓粍浠舵竻闄よ閫変腑鐘舵�� - this.clickBase = item - this.$emit("getList", item, type) - console.log("clickCategory", item, type) + this.clickBase = item; + this.$emit("getList", item, type); }, // 榛樿鏄剧ず绗竴涓簱鐨勬暟鎹� defaultShow() { if (this.syncTableList && this.syncTableList.length) { - this.clickCategory(0, "sync", this.syncTableList[0]) + this.clickCategory(0, "sync", this.syncTableList[0]); } else { if (this.localTableList && this.localTableList.length) { - this.clickCategory(0, "local", this.syncTableList[0]) + this.clickCategory(0, "local", this.syncTableList[0]); } } }, // 娣诲姞鏃堕棿姣旇緝鍑芥暟 dateParse(dateString) { - var SEPARATOR_BAR = "-" - var SEPARATOR_SLASH = "/" - var SEPARATOR_DOT = "." - var dateArray + var SEPARATOR_BAR = "-"; + var SEPARATOR_SLASH = "/"; + var SEPARATOR_DOT = "."; + var dateArray; if (dateString.indexOf(SEPARATOR_BAR) > -1) { - dateArray = dateString.split(SEPARATOR_BAR) + dateArray = dateString.split(SEPARATOR_BAR); } else if (dateString.indexOf(SEPARATOR_SLASH) > -1) { - dateArray = dateString.split(SEPARATOR_SLASH) + dateArray = dateString.split(SEPARATOR_SLASH); } else { - dateArray = dateString.split(SEPARATOR_DOT) + dateArray = dateString.split(SEPARATOR_DOT); } - return new Date(dateArray[0], dateArray[1] - 1, dateArray[2]) + return new Date(dateArray[0], dateArray[1] - 1, dateArray[2]); }, isEmpty(str) { if (!str || str === undefined || str === null) { - return true + return true; } else { - return false + return false; } - } + }, }, props: { listWidth: { default: "224px", - type: String + type: String, }, title: { default: "鍚屾搴�", - type: String + type: String, }, titleB: { default: "鏈湴搴�", - type: String + type: String, }, isSelected: { default: false, - type: Boolean + type: Boolean, }, type: { default: "", - type: String - } - } -} + type: String, + }, + }, +}; </script> <style lang="scss"> .iconStyle1 { diff --git a/src/pages/library/components/carList.vue b/src/pages/library/components/carList.vue index a30dfb2..7be0a09 100644 --- a/src/pages/library/components/carList.vue +++ b/src/pages/library/components/carList.vue @@ -579,7 +579,7 @@ class="inputWidth" > <el-option - v-for="item in VideoPhotoData.dictionary.CARTYPE" + v-for="item in dictionary.nVehicleType" :key="item.value" :label="item.name" :value="item.value" @@ -593,7 +593,7 @@ class="inputWidth" > <el-option - v-for="item in VideoPhotoData.dictionary.BRAND" + v-for="item in dictionary.nVehicleBrand" :key="item.value" :label="item.name" :value="item.value" @@ -607,7 +607,7 @@ class="inputWidth" > <el-option - v-for="item in VideoPhotoData.dictionary.nColor" + v-for="item in dictionary.nVehicleColor" :key="item.value" :label="item.name" :value="item.value" @@ -708,6 +708,7 @@ updateDbTableStatus, deleteDbPersonById, deleteDBtablesById, + dicByType, } from "@/api/baseLibrary"; import axios from "axios"; import fTemplate from "@/components/fTemplate"; @@ -758,10 +759,12 @@ } else { var result = false; if (value.length === 7) { - var express = /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; + var express = + /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; result = express.test(value); } else if (value.length === 8) { - var express2 = /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{5}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; + var express2 = + /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{5}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; result = express2.test(value); } if (result) { @@ -842,6 +845,7 @@ noFaceList: [], }, delBtnLoading: false, + dictionary: {}, }; }, watch: { @@ -851,6 +855,9 @@ "BaseManageData.selectWhites": function (value) { this.blackAngWhite(); }, + }, + created() { + this.dicByType(); }, mounted() { this.getCarList(); @@ -879,10 +886,12 @@ checkCarNo(value) { var result = false; if (value.length === 7) { - var express = /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; + var express = + /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; result = express.test(value); } else if (value.length === 8) { - var express2 = /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{5}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; + var express2 = + /^[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块A-Z]{1}[A-Z]{1}[A-Z0-9]{5}[A-Z0-9鎸傚璀︽腐婢砞{1}$/; result = express2.test(value); } return result; @@ -899,6 +908,12 @@ this.delBtnLoading = false; this.askDeleteShow = false; + }, + async dicByType() { + const res = await dicByType(); + if (res && res.success) { + this.dictionary = res.data; + } }, deleteBase() { deleteDBtablesById({ id: this.baseObject.id }) @@ -1291,7 +1306,8 @@ }, async platesBatch() { var temp = this.plates.split(/[\n,]/g); - var reg = /[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块]{1}[A-Z]{1}[A-Z0-9]{5,6}/; + var reg = + /[浜触娌笣鍐�璞簯杈介粦婀樼殩椴佹柊鑻忔禉璧i剛妗傜敇鏅嬭挋闄曞悏闂借吹绮ら潚钘忓窛瀹佺惣浣块]{1}[A-Z]{1}[A-Z0-9]{5,6}/; for (let i = 0; i < temp.length; i++) { if (temp[i] == "") { temp.splice(i, 1); diff --git a/src/pages/library/components/personList.vue b/src/pages/library/components/personList.vue index b865879..4048acb 100644 --- a/src/pages/library/components/personList.vue +++ b/src/pages/library/components/personList.vue @@ -1173,6 +1173,7 @@ } }, async getPersonList() { + console.log(this.baseObject); this.$nextTick(() => { if (this.baseObject.id && this.baseObject.id !== undefined) { this.BaseManageData.tableId = this.baseObject.id; diff --git a/src/pages/library/index/App.vue b/src/pages/library/index/App.vue index 2aae029..e6a0954 100644 --- a/src/pages/library/index/App.vue +++ b/src/pages/library/index/App.vue @@ -47,30 +47,30 @@ </div> </template> <script> -import baseList from "../components/baseList" -import addBase from "../components/addBase" -import personList from "../components/personList" -import carList from "../components/carList" -const colorRgb = function(s) { - var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/ - var color = s.toLowerCase() +import baseList from "../components/baseList"; +import addBase from "../components/addBase"; +import personList from "../components/personList"; +import carList from "../components/carList"; +const colorRgb = function (s) { + var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; + var color = s.toLowerCase(); if (reg.test(color)) { if (color.length === 4) { - var colorNew = "#" + var colorNew = "#"; for (var i = 1; i < 4; i += 1) { - colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1)) + colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1)); } - color = colorNew + color = colorNew; } - var colorChange = [] + var colorChange = []; for (var i = 1; i < 7; i += 2) { - colorChange.push(parseInt("0x" + color.slice(i, i + 2))) + colorChange.push(parseInt("0x" + color.slice(i, i + 2))); } - return "" + colorChange.join(",") + "" + return "" + colorChange.join(",") + ""; } else { - return color + return color; } -} +}; export default { data() { return { @@ -86,92 +86,103 @@ { name: "搴曞簱绠$悊", path: "/baseManage", - params: {} + params: {}, }, { name: "搴曞簱璇︽儏", path: "/baseManage", - params: {} - } - ] - } + params: {}, + }, + ], + }; }, methods: { getPersonList(item, type) { - this.baseObject = item - this.baseForEdit = item - this.syncType = type + console.log(123); + console.log(item); + console.log(type); + + if (item) { + this.baseObject = item; + this.baseForEdit = item; + this.syncType = type; + } // 鐩存帴璋冪敤瀛愮粍浠跺埛鏂板垪琛ㄧ殑鏂规硶 // 鍒ゆ柇杩欐槸浜哄憳搴撹繕鏄溅杈嗗簱锛屽喅瀹歴howList鐨勫�� this.$nextTick(() => { - if (item.tableType == "person") { - this.showType = "person" - this.$refs.personList.getPersonList() - } else if (item.tableType == "car") { - this.showType = "car" - this.$refs.carList.getCarList() + if (this.baseObject.tableType == "person") { + this.showType = "person"; + this.$refs.personList.getPersonList(); + } else if (this.baseObject.tableType == "car") { + this.showType = "car"; + this.$refs.carList.getCarList(); } - }) - this.breeadCrumb[1].name = "搴曞簱璇︽儏" + }); + this.breeadCrumb[1].name = "搴曞簱璇︽儏"; }, changeToAdd(item, type) { if (item !== null) { - this.baseForEdit = item - this.breeadCrumb[1].name = "搴曞簱淇℃伅" + this.baseForEdit = item; + this.breeadCrumb[1].name = "搴曞簱淇℃伅"; } else { - this.baseForEdit = {} - this.breeadCrumb[1].name = "娣诲姞搴曞簱" + this.baseForEdit = {}; + this.breeadCrumb[1].name = "娣诲姞搴曞簱"; } - this.syncType = type - this.showList = false + this.syncType = type; + this.showList = false; }, initBaseList() { - this.$refs.baseSync.init() - this.BaseManageData.queryTagList() + this.$refs.baseSync.init(); + this.BaseManageData.queryTagList(); }, // 鏌ヨ鍚屾搴撳垪琛ㄦ暟鎹甛鏌ヨ鏈湴搴撳垪琛ㄦ暟鎹� findBaseSync() { - this.BaseManageData.querySyncTables() - this.BaseManageData.queryLocalTables() - this.BaseManageData.queryTagList() + this.BaseManageData.querySyncTables(); + this.BaseManageData.queryLocalTables(); + this.BaseManageData.queryTagList(); }, closeAdd() { - this.showList = true - this.$refs.baseSync.init(this.syncType) - } + this.showList = true; + this.$refs.baseSync.init(this.syncType); + }, }, props: { cameraId: { default: "", - type: String - } + type: String, + }, }, components: { baseList, addBase, personList, - carList + carList, }, mounted() { window.addEventListener("message", (e) => { if (e.data.msg === "changeColor") { - const res = colorRgb(e.data.color) - document.documentElement.style.setProperty("--colorCard", `${e.data.color}`) + const res = colorRgb(e.data.color); + document.documentElement.style.setProperty( + "--colorCard", + `${e.data.color}` + ); } - }) + }); }, created() { - let color = localStorage.getItem("--colorCard") + let color = localStorage.getItem("--colorCard"); if (color) { - document.documentElement.style.setProperty("--colorCard", `${color}`) + document.documentElement.style.setProperty("--colorCard", `${color}`); } else { - color = getComputedStyle(document.documentElement).getPropertyValue("--colorCard") - const res = colorRgb(color) - document.documentElement.style.setProperty("--colorCard-rgb", `${res}`) + color = getComputedStyle(document.documentElement).getPropertyValue( + "--colorCard" + ); + const res = colorRgb(color); + document.documentElement.style.setProperty("--colorCard-rgb", `${res}`); } - } -} + }, +}; </script> <style lang="scss"> .s-base-manage { diff --git a/src/pages/search/index/Searching.vue b/src/pages/search/index/Searching.vue index abcff6f..5f7c7a7 100644 --- a/src/pages/search/index/Searching.vue +++ b/src/pages/search/index/Searching.vue @@ -37,7 +37,7 @@ " ></el-button> </el-tooltip> - <p class="p-label" style="width: 16%"> + <p class="p-label" style="width: 13%"> <b>搴曞簱锛�</b> <el-select v-model="tagValues" @@ -45,9 +45,9 @@ :disabled="isDisabled" collapse-tags size="mini" - style="width: calc(100% - 40px); min-width: 120px" - placeholder="璇烽�夋嫨" + style="width: calc(100% - 40px); min-width: 70px" @change="tagChange" + placeholder="閫夋嫨" > <el-option v-for="item in VideoPhotoData.tabs" @@ -59,7 +59,7 @@ ></el-option> </el-select> </p> - <p class="p-task" style="width: 16%"> + <p class="p-task" style="width: 13%"> <b>鍦烘櫙锛�</b> <el-select v-model="taskValues" @@ -68,8 +68,8 @@ :disabled="typeDisable" collapse-tags size="mini" - style="width: calc(100% - 40px); min-width: 120px" - placeholder="璇烽�夋嫨" + style="width: calc(100% - 40px); min-width: 70px" + placeholder="閫夋嫨" > <!-- <el-option v-for="item in VideoPhotoData.tasks" @@ -89,7 +89,23 @@ ></el-option> </el-select> </p> - <p class="p-level" style="width: 18%"> + + <p class="p-task" style="width: 12%"> + <b>鍏虫敞锛�</b> + <el-select + v-model="collection" + @change="searchingBtn" + size="mini" + style="width: calc(100% - 40px); min-width: 70px" + placeholder="閫夋嫨" + > + <el-option value="" label="鍏ㄩ儴"></el-option> + <el-option value="1" label="宸插叧娉�"></el-option> + <el-option value="0" label="鏈叧娉�"></el-option> + </el-select> + </p> + + <p class="p-level" style="width: 15%"> <b>浜嬩欢绛夌骇锛�</b> <el-select v-model="alarmValues" @@ -99,7 +115,7 @@ collapse-tags size="mini" style="width: calc(100% - 64px); min-width: 120px" - placeholder="璇烽�夋嫨" + placeholder="閫夋嫨" > <el-option v-for="item in VideoPhotoData.dictionary.ALARMLEVEL" @@ -121,13 +137,13 @@ style="width: 99%; min-width: 200px" ></el-date-picker> </p> - <p class="p-input" style="width: 19%"> + <p class="p-input" style="width: 16%"> <el-input - placeholder="璇疯緭鍏ュ唴瀹�" + placeholder="璇疯緭鍏�" prefix-icon="el-icon-search" style=" width: calc(100% - 75px); - min-width: 100px; + min-width: 85px; margin-left: 10px; margin-right: 10px; " @@ -298,6 +314,7 @@ tagValues: [], alarmValues: [], taskValues: [], + collection: "", searchTime: [ this.$moment().format("YYYY-MM-DD 00:00:00"), this.$moment().format("YYYY-MM-DD HH:mm:ss"), @@ -401,7 +418,6 @@ } }, "TreeDataPool.showTreeBox"(value) { - console.log(2); this.getHeight(); if (this.VideoPhotoData.realSmallPath.length > 0) { this.VideoPhotoData.findPersonByPage(); @@ -418,8 +434,6 @@ // }, "TreeDataPool.selectedNodes": { handler: function (newVal, oldVal) { - console.log(3); - if (newVal !== oldVal) { this.VideoPhotoData.treeNodes = newVal; if (this.VideoPhotoData.uploadType) { @@ -433,7 +447,6 @@ }, "DataStackPool.selectedDir": { handler(nodes, oldNodes) { - console.log(4); if (nodes !== oldNodes && nodes.id != "") { // this.VideoPhotoData.treeNodes = nodes.map(i=>{return i.id}); this.VideoPhotoData.treeNodes = [nodes.id]; @@ -667,6 +680,7 @@ this.VideoPhotoData.searchTime = this.format(this.searchTime); //this.VideoPhotoData.inputValue = this.searchText; this.VideoPhotoData.showType = this.showType; + this.VideoPhotoData.collection = this.collection; if (!this.VideoPhotoData.uploadType) { this.VideoPhotoData.uploadDiaplay = false; //this.VideoPhotoData.page = this.currentPage; @@ -739,12 +753,14 @@ clearSearch() { this.tagValues = []; this.taskValues = []; + this.collection = ""; this.alarmValues = []; this.VideoPhotoData.queryTabs = []; this.VideoPhotoData.queryTasks = []; this.VideoPhotoData.queryAlarmlevel = []; this.VideoPhotoData.searchTime = this.getDateInit(); this.VideoPhotoData.inputValue = ""; + this.VideoPhotoData.collection = ""; this.searchTime = this.getDateInit(); if (!this.VideoPhotoData.uploadType) { // this.VideoPhotoData.querySearchList(); diff --git a/src/pages/settings/views/generalSettings.vue b/src/pages/settings/views/generalSettings.vue index ae565c1..2cd47a2 100644 --- a/src/pages/settings/views/generalSettings.vue +++ b/src/pages/settings/views/generalSettings.vue @@ -143,6 +143,7 @@ action="" :http-request="uploadSound" :show-file-list="false" + style="bottom: -94px; left: calc(50% - 217px)" > <div class="info"> 璇峰皢澹伴煶浜嬩欢鏂囦欢鎷栨嫿鍒版澶勶紝鎴�<span class="info-click" @@ -465,7 +466,7 @@ this.getSounds(); }, (err) => { - this.$message.error("澹伴煶涓婁紶澶辫触"); + this.$message.error(err.msg); } ); }, @@ -951,8 +952,6 @@ } .upload-demo { - top: 452px; - left: 2px !important; width: 452px; height: 150px; background: #ffffff; @@ -1135,4 +1134,4 @@ /* color: var(--colorCard); */ color: #4e94ff; } -</style> +</style> \ No newline at end of file diff --git a/src/pages/syslog/views/pollingLog.vue b/src/pages/syslog/views/pollingLog.vue index 92bcb10..2897bf9 100644 --- a/src/pages/syslog/views/pollingLog.vue +++ b/src/pages/syslog/views/pollingLog.vue @@ -131,6 +131,7 @@ show-checkbox check-on-click-node default-expand-all + :default-checked-keys="selectedIDs" ></el-tree> <span slot="footer" class="dialog-footer"> @@ -178,6 +179,7 @@ procID: "", procName: "", pickNum: 0, + selectedIDs: [], pickerOptions: { shortcuts: [ { @@ -237,6 +239,8 @@ }, confirmCamera() { const selectedIDs = this.$refs.cameraTree.getCheckedKeys(); + this.selectedIDs = selectedIDs; + console.log(selectedIDs); this.pickNum = selectedIDs.length; this.procID = selectedIDs.join(","); this.getScheduleLog(); diff --git a/src/pages/visual/components/subComponents/CardItem2.vue b/src/pages/visual/components/subComponents/CardItem2.vue index d100fff..f864b88 100644 --- a/src/pages/visual/components/subComponents/CardItem2.vue +++ b/src/pages/visual/components/subComponents/CardItem2.vue @@ -7,8 +7,8 @@ <div class="card-img-box-compear"> <div class="card-img-box-compear-left" ref="firstImg"> <img - :src="'/httpImage/'+data.targetInfo[0].picSmUrl" - :id="'/compear/'+data.targetInfo[0].picSmUrl" + :src="'/httpImage/' + data.targetInfo[0].picSmUrl" + :id="'/compear/' + data.targetInfo[0].picSmUrl" class="cursor-pointer" @click="detailsClick($event)" /> @@ -20,9 +20,12 @@ indicator-position="none" :arrow="data.baseInfo.length > 1 ? 'always' : 'never'" > - <el-carousel-item v-for="(item, index) in data.baseInfo" :key="index"> + <el-carousel-item + v-for="(item, index) in data.baseInfo" + :key="index" + > <img - :src="'/httpImage/'+item.targetPicUrl" + :src="'/httpImage/' + item.targetPicUrl" class="cursor-pointer" @click="detailsClick($event)" /> @@ -34,7 +37,7 @@ style :style="{ bottom: getBottom(), - background: getUrl(data.baseInfo[initialIndex].bwType) + background: getUrl(data.baseInfo[initialIndex].bwType), }" > <b>{{ `${data.baseInfo[initialIndex].compareScore}%` }}</b> @@ -43,7 +46,10 @@ </div> <!-- 鏅�氭ā寮� --> <div v-else class="s-card-left"> - <div class="s-card-left-box" v-if="data.targetInfo == null || data.targetInfo.length > 0"> + <div + class="s-card-left-box" + v-if="data.targetInfo == null || data.targetInfo.length > 0" + > <el-carousel trigger="click" height="100%" @@ -52,75 +58,165 @@ :autoplay="false" @change="changeCarousel" > - <el-carousel-item v-for="(item, index) in data.picMaxUrl" :key="index + 'img'"> - <img :src="'/httpImage/'+item" class="cursor-pointer" @click="detailsClick($event)" /> + <el-carousel-item + v-for="(item, index) in data.picMaxUrl" + :key="index + 'img'" + > + <img + :src="'/httpImage/' + item" + class="cursor-pointer" + @click="detailsClick($event)" + /> </el-carousel-item> </el-carousel> <img - v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == '' || !data.targetInfo[0].picSmUrl" - :src="'/httpImage/'+data.picMaxUrl[0]" + v-else-if=" + data.targetInfo == null || + data.targetInfo[0].picSmUrl == '' || + !data.targetInfo[0].picSmUrl + " + :src="'/httpImage/' + data.picMaxUrl[0]" class="cursor-pointer" @click="detailsClick($event)" /> <img v-else - :src="'/httpImage/'+data.targetInfo[0].picSmUrl" + :src="'/httpImage/' + data.targetInfo[0].picSmUrl" class="cursor-pointer" @click="detailsClick($event)" /> </div> <div class="s-card-left-box" v-else> <img - :src="'/httpImage/'+data.baseInfo[0].targetPicUrl" + :src="'/httpImage/' + data.baseInfo[0].targetPicUrl" class="cursor-pointer" @click="detailsClick($event)" /> </div> </div> <!-- 鍙充晶鏂囧瓧鍖哄煙 --> - <!-- 澶氬紶搴曞浘鍒囨崲 --> + <!-- 澶氬紶搴曞浘鍒囨崲 --> <div class="s-card-right-isCompare" v-if="showType == 'compare'"> <div - class="person" + class="person" :style="overflowState ? 'overflow: hidden' : 'overflow: auto'" @mouseenter="cardMouseenter($event)" @mouseleave="cardMouseleave($event)" > - <p :title="data.baseInfo[0].compareScore" class="score" v-if="showType == 'findByPic'"> + <p + :title="data.baseInfo[0].compareScore" + class="score" + v-if="showType == 'findByPic'" + > <span v-if="data.id">{{ data.compareScore }}%</span> <span v-else>{{ data.baseInfo[0].compareScore }}%</span> </p> <p :title="data.picDate"> <span class="fontStyle color222">{{ data.picDate }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 0.5rem;"> + <p :title="data.cameraAddr" style="margin-bottom: 0.5rem"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> <el-tooltip placement="right"> <div slot="content"> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule'"> - <span >{{data.taskName}}</span> <span v-if="item.alarmLevel !== '鎾ら槻'" :style="item.defenceState ? 'color:red':''"> {{item.alarmLevel}}</span> <span v-if="item.isLink"> 鑱斿姩浠诲姟</span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'"> + <span>{{ data.taskName }}</span + > <span + v-if="item.alarmLevel !== '鎾ら槻'" + :style="item.defenceState ? 'color:red' : ''" + > {{ item.alarmLevel }}</span + > <span v-if="item.isLink"> 鑱斿姩浠诲姟</span> </p> </div> - <el-button style="line-height:1.0625rem;border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:7.5rem;text-align:left"> - <span v-for="(item,index) in data.alarmRules" :key="index+'rule1'" style="text-overflow:ellipsis;max-width:6.25rem"> - <span class="fontStyle color666">{{data.taskName}}</span> <span class="fontStyle color666" v-if="item.alarmLevel !== '鎾ら槻'" :style="item.defenceState ? 'color:red':''"> {{item.alarmLevel}}</span> <span class="fontStyle color666" v-if="item.isLink"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + <el-button + style=" + line-height: 1.0625rem; + border: none; + padding: 0; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 7.5rem; + text-align: left; + " + > + <span + v-for="(item, index) in data.alarmRules" + :key="index + 'rule1'" + style="text-overflow: ellipsis; max-width: 6.25rem" + > + <span class="fontStyle color666">{{ data.taskName }}</span + > <span + class="fontStyle color666" + v-if="item.alarmLevel !== '鎾ら槻'" + :style="item.defenceState ? 'color:red' : ''" + > {{ item.alarmLevel }}</span + > <span class="fontStyle color666" v-if="item.isLink" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </span> </el-button> </el-tooltip> <el-tooltip placement="right"> <div slot="content"> <p> - <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName">{{ data.baseInfo[initialIndex].tableName }}</span> <span class="fontStyle" v-if="data.baseInfo[initialIndex].personName">/ {{ data.baseInfo[initialIndex].personName }}</span> <span class="fontStyle" v-if="data.baseInfo[initialIndex].sex">/ {{ data.baseInfo[initialIndex].sex }}</span> <span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel">/ {{ data.baseInfo[initialIndex].monitorLevel }}</span> + <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].tableName" + >{{ data.baseInfo[initialIndex].tableName }}</span + > <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].personName" + >/ {{ data.baseInfo[initialIndex].personName }}</span + > <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].sex" + >/ {{ data.baseInfo[initialIndex].sex }}</span + > <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].monitorLevel" + >/ {{ data.baseInfo[initialIndex].monitorLevel }}</span + > </p> </div> - <el-button style="line-height:1.0625rem;border:none;padding:0;margin:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:7.5rem;text-align:left"> + <el-button + style=" + line-height: 1.0625rem; + border: none; + padding: 0; + margin: 0; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 7.5rem; + text-align: left; + " + > <span - :style="data.baseInfo[initialIndex].bwType === '1' - ? 'color: red;font-size:0.75rem;line-height:1.25rem' - : 'font-size:0.75rem;line-height:1.25rem'"> - <span class="fontStyle" v-if="data.baseInfo[initialIndex].tableName">{{ data.baseInfo[initialIndex].tableName }}</span> <span class="fontStyle" v-if="data.baseInfo[initialIndex].personName">/ {{ data.baseInfo[initialIndex].personName }}</span> <span class="fontStyle" v-if="data.baseInfo[initialIndex].sex">/ {{ data.baseInfo[initialIndex].sex }}</span> <span class="fontStyle" v-if="data.baseInfo[initialIndex].monitorLevel">/ {{ data.baseInfo[initialIndex].monitorLevel }}</span> + :style=" + data.baseInfo[initialIndex].bwType === '1' + ? 'color: red;font-size:0.75rem;line-height:1.25rem' + : 'font-size:0.75rem;line-height:1.25rem' + " + > + <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].tableName" + >{{ data.baseInfo[initialIndex].tableName }}</span + > <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].personName" + >/ {{ data.baseInfo[initialIndex].personName }}</span + > <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].sex" + >/ {{ data.baseInfo[initialIndex].sex }}</span + > <span + class="fontStyle" + v-if="data.baseInfo[initialIndex].monitorLevel" + >/ {{ data.baseInfo[initialIndex].monitorLevel }}</span + > </span> </el-button> </el-tooltip> @@ -129,10 +225,20 @@ <el-tooltip class="item" effect="dark" content="璇︽儏" placement="top"> <i class="fontFamily systemmulu" @click="detailsClick($event)"></i> </el-tooltip> - <el-tooltip class="item" effect="dark" content="鏌ユ壘姝や汉" placement="top"> + <el-tooltip + class="item" + effect="dark" + content="鏌ユ壘姝や汉" + placement="top" + > <i class="fontFamily system1"></i> </el-tooltip> - <el-tooltip class="item" effect="dark" content="鍔犲叆鍦板簱" placement="top"> + <el-tooltip + class="item" + effect="dark" + content="鍔犲叆鍦板簱" + placement="top" + > <i class="fontFamily systemyonghutianjia"></i> </el-tooltip> <el-tooltip class="item" effect="dark" content="鏀惰棌" placement="top"> @@ -148,24 +254,55 @@ @mouseenter="cardMouseenter($event)" @mouseleave="cardMouseleave($event)" > - <p :title="data.baseInfo[0].compareScore" class="score" style="font-family: PingFangSC-Medium;font-size: 1.25rem;color: #F53D3D;letter-spacing: 0.4px;"> - <span >{{ data.baseInfo[0].compareScore }}%</span> + <p + :title="data.baseInfo[0].compareScore" + class="score" + style=" + font-family: PingFangSC-Medium; + font-size: 1.25rem; + color: #f53d3d; + letter-spacing: 0.4px; + " + > + <span>{{ data.baseInfo[0].compareScore }}%</span> </p> - <p :style="data.baseInfo[0].bwType == '0' ? 'font-size:0.75rem;line-height:1.25rem' : 'color:red;font-size:0.75rem;line-height:1.25rem'"> + <p + :style=" + data.baseInfo[0].bwType == '0' + ? 'font-size:0.75rem;line-height:1.25rem' + : 'color:red;font-size:0.75rem;line-height:1.25rem' + " + > {{ data.baseInfo[0].tableName }} </p> <p :style="data.baseInfo[0].bwType == '0' ? '' : 'color:red'"> - <span>{{ data.baseInfo[0].personName }}</span> <span v-if="data.baseInfo[0].sex">/ {{ data.baseInfo[0].sex }}</span> + <span>{{ data.baseInfo[0].personName }}</span + > <span v-if="data.baseInfo[0].sex" + >/ {{ data.baseInfo[0].sex }}</span + > </p> </div> <div class="card-icon-box"> - <el-tooltip class="item" effect="dark" content="鏌ユ壘姝や汉" placement="top" style="margin-left:0.625rem"> - <i class="fontFamily system1" @click="tosearch(data)" title="鏌ユ壘姝や汉"></i> - </el-tooltip> - </div> + <el-tooltip + class="item" + effect="dark" + content="鏌ユ壘姝や汉" + placement="top" + style="margin-left: 0.625rem" + > + <i + class="fontFamily system1" + @click="tosearch(data)" + title="鏌ユ壘姝や汉" + ></i> + </el-tooltip> + </div> </div> <!-- 娌℃湁搴曞浘 16锛�9鍥剧墖 --> - <div v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''" class="s-card-right-signal"> + <div + v-else-if="data.targetInfo == null || data.targetInfo[0].picSmUrl == ''" + class="s-card-right-signal" + > <div class="signal-img-dev" :style="overflowState ? 'overflow: hidden' : 'overflow: auto'" @@ -175,44 +312,69 @@ <p :title="data.picDate"> <span class="fontStyle color222">{{ data.picDate }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 8px;"> + <p :title="data.cameraAddr" style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> <el-tooltip placement="right" popper-class="atooltip"> <div slot="content"> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule'"> - <span>{{data.taskName}}</span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'"> + <span>{{ data.taskName }}</span + > <span v-if="item.alarmLevel !== '鎾ら槻'" - :style="item.defenceState ? 'color:red':''" - >{{item.alarmLevel}}</span> + :style="item.defenceState ? 'color:red' : ''" + >{{ item.alarmLevel }}</span + > <span v-if="item.linkInfo == '鑱斿姩浠诲姟'"> 鑱斿姩浠诲姟</span> </p> </div> <el-button - style="border:none;padding:0;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left;background:#0D1A45" + style=" + border: none; + padding: 0; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + background: #0d1a45; + " > <span - v-for="(item,index) in data.alarmRules" - :key="index+'rule1'" - style="text-overflow:ellipsis;max-width:100px" + v-for="(item, index) in data.alarmRules" + :key="index + 'rule1'" + style="text-overflow: ellipsis; max-width: 100px" > - <span class="fontStyle color666">{{data.taskName}}</span> + <span class="fontStyle color666">{{ data.taskName }}</span + > <span class="fontStyle color666" v-if="item.alarmLevel !== '鎾ら槻'" - :style="item.defenceState ? 'color:red':''" - >{{item.alarmLevel}}</span> - <span class="fontStyle color666" v-if="item.linkInfo == '鑱斿姩浠诲姟'"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + :style="item.defenceState ? 'color:red' : ''" + >{{ item.alarmLevel }}</span + > + <span + class="fontStyle color666" + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </span> </el-button> </el-tooltip> </div> </div> - + <!-- 娌℃湁搴曞簱锛岄潪姣斿锛屾櫘閫氭ā寮� --> - <div v-else-if="data.targetInfo && data.targetInfo !== null && data.targetInfo[0].picSmUrl !== '' && data.targetInfo.length <= 1" class="s-card-right-signal"> + <div + v-else-if=" + data.targetInfo && + data.targetInfo !== null && + data.targetInfo[0].picSmUrl !== '' && + data.targetInfo.length <= 1 + " + class="s-card-right-signal" + > <div class="signal-img-dev" :style="overflowState ? 'overflow: hidden' : 'overflow: auto'" @@ -222,7 +384,12 @@ <p class="score" v-if="showType == 'findByPic'" - style="font-family: PingFangSC-Medium;font-size: 20px;color: #3D68E1;letter-spacing: 0.4px;" + style=" + font-family: PingFangSC-Medium; + font-size: 20px; + color: #3d68e1; + letter-spacing: 0.4px; + " > <span v-if="data.id">{{ data.compareScore }}%</span> <span v-else>{{ data.baseInfo[0].compareScore }}%</span> @@ -230,34 +397,61 @@ <p :title="data.picDate"> <span class="fontStyle color222">{{ data.picDate }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 8px;"> + <p :title="data.cameraAddr" style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> - <el-tooltip placement="right" popper-class="atooltip" v-if="showType != 'findByPic'"> + <el-tooltip + placement="right" + popper-class="atooltip" + v-if="showType != 'findByPic'" + > <div slot="content"> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule2'"> - <span class="fontStyle">{{data.taskName}}</span> + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule2'"> + <span class="fontStyle">{{ data.taskName }}</span + > <span class="fontStyle" v-if="item.alarmLevel !== '鎾ら槻'" - :style="item.defenceState ? 'color:red':''" - >{{item.alarmLevel}}</span> - <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + :style="item.defenceState ? 'color:red' : ''" + >{{ item.alarmLevel }}</span + > + <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </p> </div> <el-button - style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left;background:#0D1A45" + style=" + border: none; + padding: 0; + margin: 0px; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + background: #0d1a45; + " > - <span v-for="(item,index) in data.alarmRules" :key="index+'rule3'"> - <span class="fontStyle color666">{{data.taskName}}</span> + <span + v-for="(item, index) in data.alarmRules" + :key="index + 'rule3'" + > + <span class="fontStyle color666">{{ data.taskName }}</span + > <span class="fontStyle color666" v-if="item.alarmLevel !== '鎾ら槻'" - :style="item.defenceState ? 'color:red':''" - >{{item.alarmLevel}}</span> - <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle color666"> 鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + :style="item.defenceState ? 'color:red' : ''" + >{{ item.alarmLevel }}</span + > + <span + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + class="fontStyle color666" + > 鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </span> </el-button> </el-tooltip> @@ -267,25 +461,49 @@ </p>--> <el-tooltip placement="right" popper-class="atooltip"> <div slot="content"> - <p v-for="(item,index) in data.baseInfo" :key="index+'base1'"> - <span class="fontStyle">{{item.tableName}}</span> - <span class="fontStyle">/ {{item.targetName}}</span> - <span class="fontStyle" >/ {{item.labels.split("/")[1]}}</span> - <span class="fontStyle" >/ {{item.labels.split("/")[0]}}</span> + <p v-for="(item, index) in data.baseInfo" :key="index + 'base1'"> + <span class="fontStyle">{{ item.tableName }}</span + > <span class="fontStyle">/ {{ item.targetName }}</span + > + <span class="fontStyle" + >/ {{ item.labels.split("/")[1] }}</span + > + <span class="fontStyle" + >/ {{ item.labels.split("/")[0] }}</span + > </p> </div> <el-button - style="border:none;padding:0;margin:0px;overflow:hidden;text-overflow:ellipsis;cursor:default;width:100%;text-align:left;background:#0D1A45" + style=" + border: none; + padding: 0; + margin: 0px; + overflow: hidden; + text-overflow: ellipsis; + cursor: default; + width: 100%; + text-align: left; + background: #0d1a45; + " > <span - v-for="(item,index) in data.baseInfo" - :key="index+'base'" - :style="item.bwType == '1' ? 'color:red;font-size:12px;line-height:20px':'font-size:12px;line-height:20px'" + v-for="(item, index) in data.baseInfo" + :key="index + 'base'" + :style=" + item.bwType == '1' + ? 'color:red;font-size:12px;line-height:20px' + : 'font-size:12px;line-height:20px' + " > - <span class="fontStyle">{{item.tableName}}</span> - <span class="fontStyle">/ {{item.targetName}}</span> - <span class="fontStyle" >/ {{item.labels.split("/")[1]}}</span> - <span class="fontStyle" >/ {{item.labels.split("/")[0]}}</span> + <span class="fontStyle">{{ item.tableName }}</span + > <span class="fontStyle">/ {{ item.targetName }}</span + > + <span class="fontStyle" + >/ {{ item.labels.split("/")[1] }}</span + > + <span class="fontStyle" + >/ {{ item.labels.split("/")[0] }}</span + > </span> </el-button> </el-tooltip> @@ -304,17 +522,23 @@ <p :title="data.picDate"> <span class="fontStyle color222">{{ data.picDate }}</span> </p> - <p :title="data.cameraAddr" style="margin-bottom: 8px;"> + <p :title="data.cameraAddr" style="margin-bottom: 8px"> <span class="fontStyle color222">{{ data.cameraAddr }}</span> </p> - <p v-for="(item,index) in data.alarmRules" :key="index+'rule'"> - <span class="fontStyle color666">{{data.taskName}}</span> / + <p v-for="(item, index) in data.alarmRules" :key="index + 'rule'"> + <span class="fontStyle color666">{{ data.taskName }}</span + > / <span class="fontStyle color666" - :style="item.defenceState ? 'color:red':''" - >{{item.alarmLevel}}</span> / - <span v-if="item.linkInfo == '鑱斿姩浠诲姟'" class="fontStyle color666">鑱斿姩浠诲姟</span> - <span v-if="index < data.alarmRules.length-1">/ </span> + :style="item.defenceState ? 'color:red' : ''" + >{{ item.alarmLevel }}</span + > / + <span + v-if="item.linkInfo == '鑱斿姩浠诲姟'" + class="fontStyle color666" + >鑱斿姩浠诲姟</span + > + <span v-if="index < data.alarmRules.length - 1">/ </span> </p> </div> </div> @@ -324,23 +548,22 @@ </template> <script> export default { - mounted() { - }, + mounted() {}, props: { data: { type: Object, - default: null + default: null, }, showType: { type: String, - default: "search" - } + default: "search", + }, }, data() { return { initialIndex: 0, carouselIndex: 0, - overflowState: true + overflowState: true, }; }, methods: { @@ -359,18 +582,22 @@ detailsClick(ev) { this.$emit("detailsClick", ev); }, - tosearch(item){ + tosearch(item) { var curWwwPath = window.document.location.href; - var pathname= window.document.location.pathname; + var pathname = window.document.location.pathname; var pos = curWwwPath.indexOf(pathname); - var localhostPath = curWwwPath .substring(0,pos); //ip+port - var href = localhostPath+"/Layout/Searching" - console.log("璺宠浆鍦板潃",href) - let captureId = item.id - var url = item.picSmUrl? item.picSmUrl[0] : item.baseInfo[0].personPicUrl - window.open(href+'?showType=findByPic&captureId=' + captureId + '&picSmUrl=' + url) - } - } + var localhostPath = curWwwPath.substring(0, pos); //ip+port + var href = localhostPath + "/Layout/Searching"; + console.log("璺宠浆鍦板潃", href); + let captureId = item.id; + var url = item.picSmUrl + ? item.picSmUrl[0] + : item.baseInfo[0].personPicUrl; + window.open( + href + "?showType=findByPic&captureId=" + captureId + "&picSmUrl=" + url + ); + }, + }, }; </script> <style lang="scss" scoped> @@ -380,14 +607,14 @@ .color222 { font-family: PingFangSC-Regular; font-size: 0.625rem; - color: #95B7FF; - line-height: 1.125rem + color: #95b7ff; + line-height: 1.125rem; } .color666 { font-family: PingFangSC-Regular; font-size: 0.6875rem; - color: #687BE3; - line-height: 1.25rem + color: #687be3; + line-height: 1.25rem; } </style> @@ -488,7 +715,7 @@ margin-left: 0.625rem; padding-top: 0.625rem; i { - color: #3D68E1; + color: #3d68e1; font-size: 1.25rem !important; padding-right: 0.625rem; cursor: pointer; @@ -555,7 +782,7 @@ position: absolute; bottom: 0px; i { - color: #3D68E1; + color: #3d68e1; font-size: 1.25rem !important; padding-right: 0.625rem; cursor: pointer; @@ -595,7 +822,7 @@ position: absolute; bottom: 0px; i { - color: #3D68E1; + color: #3d68e1; font-size: 1.25rem !important; padding-right: 0.625rem; cursor: pointer; diff --git a/vue.config.js b/vue.config.js index 103c24f..0a103df 100644 --- a/vue.config.js +++ b/vue.config.js @@ -67,8 +67,8 @@ // } }); -const serverUrl = "http://192.168.20.189:7009"; -//const serverUrl = "http://192.168.20.116:7009"; +//const serverUrl = "http://192.168.20.189:7009"; +const serverUrl = "http://192.168.20.116:7009"; const iotdataServerUrl = "http://192.168.8.10:9000"; // const cir = require("circular-dependency-plugin"); -- Gitblit v1.8.0