From e1aa0ecffbabd618c71e4ad94370fb8dffe6ee1c Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期日, 21 一月 2024 20:54:49 +0800 Subject: [PATCH] 优化 --- src/views/intelligentPatrol/studyJudge/index.vue | 206 ++++++++++++++++++++------------------------------- 1 files changed, 81 insertions(+), 125 deletions(-) diff --git a/src/views/intelligentPatrol/studyJudge/index.vue b/src/views/intelligentPatrol/studyJudge/index.vue index 24781fa..46ba559 100644 --- a/src/views/intelligentPatrol/studyJudge/index.vue +++ b/src/views/intelligentPatrol/studyJudge/index.vue @@ -48,7 +48,13 @@ :key="item.id" > <span>鎶ヨ鍥剧墖</span> - <img :src="item" /> + <!-- <img :src="item" /> --> + <el-image + style="width: 240px" + :src="item" + :preview-src-list="[item]" + > + </el-image> <span v-if="index === 0" >鎶ヨ鏃堕棿锛歿{ currentEvent.alarmTime }}</span > @@ -58,7 +64,13 @@ v-for="item in imageList" :key="item.id" > - <img :src="item" /> + <!-- <img :src="item" /> --> + <el-image + style="width: 240px" + :src="item" + :preview-src-list="[item]" + > + </el-image> </div> <el-form ref="currentEvent" @@ -68,9 +80,9 @@ label-position="left" class="left-form" > - <el-form-item label="浜嬩欢缂栧彿:"> - <span>{{ currentEvent.code }}</span> - </el-form-item> + <!-- <el-form-item label="浜嬩欢缂栧彿:"> + <span>{{ currentEvent.code }}</span> + </el-form-item> --> <el-form-item label="浜嬩欢绛夌骇:"> <span>{{ currentEvent.grade }}</span> </el-form-item> @@ -92,57 +104,6 @@ <!-- <iframe src="https://183.245.159.161:8282/OneMap/index.html#/OneMap?code=2&clientVersion=&skin=white&locale=zh&otherAuthor=allowable"></iframe> --> </div> <div class="sjm-content-right"> - <div class="header"> - <el-form - :inline="true" - :model="seachData" - class="demo-form-inline" - > - <el-form-item label="浜嬩欢绫诲瀷"> - <el-cascader - v-model="seachData.gradeId" - :options="eventGradeOptions" - :props="options" - clearable - ></el-cascader> - </el-form-item> - <el-form-item label="鍙戠敓鐐逛綅"> - <el-select - v-model="seachData.videoId" - placeholder="璇烽�夋嫨" - > - <el-option - v-for="item in videoOptions" - :key="item.id" - :label="item.name" - :value="item.id" - ></el-option> - </el-select> - </el-form-item> - <el-form-item label="鎶ヨ鏃堕棿"> - <el-date-picker - v-model="seachData.alarmTime" - type="daterange" - align="right" - unlink-panels - range-separator="鑷�" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - > - </el-date-picker> - </el-form-item> - <el-form-item> - <el-button - type="primary" - @click="getInspectionData" - >鏌ヨ</el-button - > - <el-button type="primary" @click="resetAll" - >閲嶇疆</el-button - > - </el-form-item> - </el-form> - </div> <div class="card-box"> <div class="but-live"> <el-button @@ -157,7 +118,7 @@ > </div> <div class="card-header"> - <span>鎶ヨ璁板綍--{{ currentEvent.algoName }}</span> + <span>鎶ヨ璁板綍--{{ currentEvent.alarmName }}</span> </div> <el-form ref="currentEvent" @@ -272,7 +233,7 @@ </div> </div> </div> - <el-dialog :visible="isShowDialog" title="璋冨害淇℃伅"> + <el-dialog :append-to-body="true" :visible.sync="isShowDialog" title="璋冨害淇℃伅"> <MyDispatch v-if="isShowDialog" :mytype="1" @@ -307,18 +268,19 @@ import { FILE_ORIGINAL_URL } from "@/utils"; import { validateCarNum } from "@/utils/validate"; import MyDispatch from "@/components/dispatch"; -import InspectionTable from "@/views/intelligentPatrol/studyJudge/inspectionTable/index.vue"; +// import InspectionTable from "@/views/intelligentPatrol/studyJudge/inspectionTable/index.vue"; // import MyMap from "@/components/map"; import MyMap from "@/components/map/leafletMap.vue"; -import videoPoint from "@/api/system/videoPoint"; -import { getTypeList } from "@/utils/helper" export default { - components: { MyDispatch, MyMap, InspectionTable }, + components: { MyDispatch, MyMap }, created() { - this.loadVideo(); - this.loadEventGrade(); - this.getInspectionData(); + if (this.info) { + this.currentEvent = this.info; + this.loadData(); + } else { + this.getInspectionData(); + } this.initEventParams(); this.getInspectionCount(); getStoreInfoList({ current: 1, size: 100 }) @@ -342,6 +304,16 @@ this.typeList = res; }) .catch((err) => this.$message.error(err)); + }, + watch: { + '$route'(to, from) { //鐩戝惉璺敱鏄惁鍙樺寲 + if (this.info) { + this.currentEvent = this.info; + this.loadData(); + } else { + this.getInspectionData(); + } + } }, mounted() { this.timer = setInterval(() => { @@ -371,7 +343,7 @@ currentEvent: {}, stateList: [ { - id: 2, + id: 10, label: "涓婃姤", }, { @@ -436,31 +408,9 @@ point: null, mark: null, zoom: null, - eventGradeOptions: [], - videoOptions: [], - options: { - label: 'name', - value: 'id', - }, - seachData: {} }; }, methods: { - loadVideo() { - videoPoint - .getVideoPointList({ - current: 1, - size: 1000 - }) - .then(({ records, total }) => { - this.videoOptions = records; - }) - }, - loadEventGrade() { - getTypeList("1", "02").then((result) => { - this.eventGradeOptions = result; - }) - }, getInspectionCount() { basecase .getInspectionCountData({ @@ -484,57 +434,61 @@ }, getInspectionData() { + let path = this.$route.path let data = { current: this.currentPage, + pageSize: 1, + type: path.substring(path.length - 1, path.length), videoId: this.seachData.videoId, - } + }; if (this.seachData.alarmTime) { - data.beginTime = this.seachData.alarmTime[0] - data.endTime = this.seachData.alarmTime[1] - } if (this.seachData.gradeId) { - data.gradeId = this.seachData.gradeId[1] + data.beginTime = this.seachData.alarmTime[0]; + data.endTime = this.seachData.alarmTime[1]; + } + if (this.seachData.gradeId) { + data.gradeId = this.seachData.gradeId[1]; } basecase .getInspectionData(data) .then(({ records, total }) => { - this.countData.review = total + this.countData.review = total; if (records.length > 0) { this.currentEvent = records[0]; - this.point = { - x: this.currentEvent.longitude, - y: this.currentEvent.latitude, - }; - this.zoom = 18; - this.mark = { title: this.currentEvent.address }; - if (this.currentEvent?.picData) { - this.imageList = this.currentEvent.picData - .split(",") - .map((item) => `${FILE_ORIGINAL_URL}sccg/API/img?fileUrl=${item}`); - } - if ( - this.currentEvent?.alarmTime || - this.currentEvent?.currentAlarmTime - ) { - const { alarmTime, currentAlarmTime } = this.currentEvent; - const continueAlarmTime = - new Date().getTime() - - (currentAlarmTime - ? new Date(currentAlarmTime).getTime() - : new Date(alarmTime).getTime()); - const CONTINUE_DAY = continueAlarmTime / 1000 / 60 / 60 / 24; - const CONTINUE_HOURS = (CONTINUE_DAY - parseInt(CONTINUE_DAY)) * 24; - this.currentEvent.conntinueTime = `${parseInt( - CONTINUE_DAY - )}澶�${parseInt(CONTINUE_HOURS)}灏忔椂`; - } + this.loadData(); } else { - this.currentEvent = {} + this.currentEvent = {}; this.$message("褰撳墠鏌ヨ鏉′欢鏃犳暟鎹�"); } }) .catch((err) => this.$message.error(err)); }, - + loadData() { + this.point = { + x: this.currentEvent.longitude, + y: this.currentEvent.latitude, + }; + this.zoom = 18; + this.mark = { title: this.currentEvent.address }; + if (this.currentEvent?.picData) { + this.imageList = this.currentEvent.picData + .split(",") + .map((item) => `${FILE_ORIGINAL_URL}sccg/API/img?fileUrl=${item}`); + // this.imageList =['https://www.shutterstock.com/image-photo/grandmother-holding-grandson-her-lap-600w-1954531321.jpg','https://www.shutterstock.com/image-photo/grandmother-holding-grandson-her-lap-600w-1954531321.jpg'] + } + if (this.currentEvent?.alarmTime || this.currentEvent?.currentAlarmTime) { + const { alarmTime, currentAlarmTime } = this.currentEvent; + const continueAlarmTime = + new Date().getTime() - + (currentAlarmTime + ? new Date(currentAlarmTime).getTime() + : new Date(alarmTime).getTime()); + const CONTINUE_DAY = continueAlarmTime / 1000 / 60 / 60 / 24; + const CONTINUE_HOURS = (CONTINUE_DAY - parseInt(CONTINUE_DAY)) * 24; + this.currentEvent.conntinueTime = `${parseInt( + CONTINUE_DAY + )}澶�${parseInt(CONTINUE_HOURS)}灏忔椂`; + } + }, // 纭鐐瑰嚮浜嬩欢 handleConfirm() { this.$refs.currentEvent.validate((flag) => { @@ -751,13 +705,15 @@ return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second; }, resetAll() { - this.seachData = {} - } + this.seachData = {}; + }, }, beforeDestroy() { clearInterval(this.timer); this.timer = null; }, + + props: ["info", "seachData"], }; </script> -- Gitblit v1.8.0