From d5fe0b27048b64c9904d1f8332422ce718787ba0 Mon Sep 17 00:00:00 2001 From: odc.xiaohui <xiaohui@Q1> Date: 星期三, 14 十二月 2022 16:03:20 +0800 Subject: [PATCH] 2022-12-14 肖辉 用户管理模块-新建用户密码校验修改 智能巡查模块-预警研判样式修改 --- src/views/intelligentPatrol/studyJudge/index.vue | 415 +++++++++++++++++++++++++++++++--------------------------- 1 files changed, 221 insertions(+), 194 deletions(-) diff --git a/src/views/intelligentPatrol/studyJudge/index.vue b/src/views/intelligentPatrol/studyJudge/index.vue index 70710da..6b983fd 100644 --- a/src/views/intelligentPatrol/studyJudge/index.vue +++ b/src/views/intelligentPatrol/studyJudge/index.vue @@ -1,161 +1,202 @@ <template> <div class="study-judge"> - <div class="study-judge-header"> - <span - >鎮ㄦ湁<span @click="openDialogTable">{{ countData.review }}</span - >鏉″緟瀹℃牳鎶ヨ淇℃伅,浠婃棩绔嬫{{ countData.register }}鏉�,鍐嶅涔爗{ - countData.study - }}鏉�</span - > - </div> + <!-- <div class="study-judge-header">--> + <!-- <span--> + <!-- >鎮ㄦ湁{{ countData.review }}鏉″緟瀹℃牳鎶ヨ淇℃伅,浠婃棩绔嬫{{--> + <!-- countData.register--> + <!-- }}鏉�,鍐嶅涔爗{ countData.study }}鏉�</span--> + <!-- >--> + <!-- </div>--> <div class="study-judge-main"> - <div class="sjm-header"> - <div class="sjm-header-left"> - <span class="moni-name">鐩戞帶鐐逛綅鍚嶇О: {{ currentEvent.name }} </span> - <span class="moni-area">{{ currentEvent.street }}</span> - <span>{{ currentEvent.address }}</span> - </div> - <div class="sjm-header-right"> - <el-button size="small" @click="createVideo(currentEvent, 'live')" - >瀹炴椂棰勮 - </el-button> - <el-button size="small" @click="createVideo(currentEvent, 'playback')" - >褰曞儚鍥炴斁 - </el-button> - </div> - </div> + <!-- <div class="sjm-header">--> + <!-- <div class="sjm-header-left">--> + <!-- <span class="moni-name">鐩戞帶鐐逛綅鍚嶇О: {{ currentEvent.name }} </span>--> + <!-- <span class="moni-area">{{ currentEvent.street }}</span>--> + <!-- <span>{{ currentEvent.address }}</span>--> + <!-- </div>--> + <!-- <div class="sjm-header-right">--> + <!-- <el-button size="small" @click="createVideo(currentEvent, 'live')"--> + <!-- >瀹炴椂棰勮</el-button--> + <!-- >--> + <!-- <el-button size="small" @click="createVideo(currentEvent, 'playback')"--> + <!-- >褰曞儚鍥炴斁</el-button--> + <!-- >--> + <!-- </div>--> + <!-- </div>--> <div class="sjm-content"> <div class="sjm-content-left"> + <!-- <div class="sjm-header-left">--> + <!-- <span class="moni-name">鐩戞帶鐐逛綅鍚嶇О: {{ currentEvent.name }} </span>--> + <!-- <span class="moni-area">{{ currentEvent.street }}</span>--> + <!-- <span>{{ currentEvent.address }}</span>--> + <!-- </div>--> + <span + >鎮ㄦ湁{{ countData.review }}鏉″緟瀹℃牳鎶ヨ淇℃伅,浠婃棩绔嬫{{ + countData.register + }}鏉�,鍐嶅涔爗{ countData.study }}鏉�</span + > + <div class="sjm-header-left"> + <span class="moni-name">鐩戞帶鐐逛綅鍚嶇О: {{ currentEvent.name }} </span> + <span class="moni-area">{{ currentEvent.street }}</span> + <span>{{ currentEvent.address }}</span> + </div> <div - class="img-item" - v-for="(item, index) in imageList" - :key="item.id" + class="img-item" + v-for="(item, index) in imageList" + :key="item.id" > <span>鎶ヨ鍥剧墖</span> <img :src="item" /> <span v-if="index === 0" - >鎶ヨ鏃堕棿锛歿{ currentEvent.alarmTime }}</span + >鎶ヨ鏃堕棿锛歿{ currentEvent.alarmTime }}</span > </div> <div class="img-item" v-for="item in imageList" :key="item.id"> <img :src="item" /> </div> - </div> - <div class="sjm-content-center"> - <div class="map"> - <MyMap :point="point" :zoom="zoom" :mark="mark"></MyMap> - - <!-- <iframe - style="height: 488px; min-width: 460px" - src="https://183.245.159.161:8282/OneMap/index.html#/OneMap?code=2&clientVersion=&skin=white&locale=zh&otherAuthor=allowable" - ></iframe> --> - </div> - </div> - <div class="sjm-content-right"> - <div class="card-box"> - <div class="card-header"> - <span>鎶ヨ璁板綍--{{ currentEvent.algoName }}</span> - </div> - <el-form + <el-form ref="currentEvent" label-width="120px" :model="eventInfoData" :rules="rules" + label-position="left" + class="left-form"> + <el-form-item label="浜嬩欢缂栧彿:"> + <span>{{ currentEvent.code }}</span> + </el-form-item> + <el-form-item label="浜嬩欢绛夌骇:"> + <span>{{ currentEvent.grade }}</span> + </el-form-item> + <el-form-item label="棣栨鎶ヨ鏃堕棿:"> + <span>{{ currentEvent.alarmTime }}</span> + </el-form-item> + <el-form-item label="鏈�杩戞姤璀︽椂闂�:"> + <span>{{ currentEvent.currentAlarmTime }}</span> + </el-form-item> + <el-form-item label="鎸佺画鏃堕棿:"> + <span>{{ currentEvent.conntinueTime }}</span> + </el-form-item> + </el-form> + </div> + <div class="sjm-content-center"> + <div class="map"> + <MyMap></MyMap> + </div> + <!-- <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="card-box"> + <div class="but-live"> + <el-button size="small" @click="createVideo(currentEvent, 'live')" + >瀹炴椂棰勮</el-button + > + <el-button size="small" @click="createVideo(currentEvent, 'playback')" + >褰曞儚鍥炴斁</el-button + > + </div> + <div class="card-header"> + <span>鎶ヨ璁板綍--{{ currentEvent.algoName }}</span> + </div> + <el-form + ref="currentEvent" + label-width="120px" + :model="eventInfoData" + :rules="rules" > - <el-form-item label="浜嬩欢缂栧彿:"> - <span>{{ currentEvent.code }}</span> - </el-form-item> - <el-form-item label="浜嬩欢绛夌骇:"> - <span>{{ currentEvent.grade }}</span> - </el-form-item> - <el-form-item label="棣栨鎶ヨ鏃堕棿:"> - <span>{{ currentEvent.alarmTime }}</span> - </el-form-item> - <el-form-item label="鏈�杩戞姤璀︽椂闂�:"> - <span>{{ currentEvent.currentAlarmTime }}</span> - </el-form-item> - <el-form-item label="鎸佺画鏃堕棿:"> - <span>{{ currentEvent.conntinueTime }}</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>--> + <!-- <el-form-item label="棣栨鎶ヨ鏃堕棿:">--> + <!-- <span>{{ currentEvent.alarmTime }}</span>--> + <!-- </el-form-item>--> + <!-- <el-form-item label="鏈�杩戞姤璀︽椂闂�:">--> + <!-- <span>{{ currentEvent.currentAlarmTime }}</span>--> + <!-- </el-form-item>--> + <!-- <el-form-item label="鎸佺画鏃堕棿:">--> + <!-- <span>{{ currentEvent.conntinueTime }}</span>--> + <!-- </el-form-item>--> <el-form-item label="鍏宠仈搴楅摵" prop="store"> <el-select - v-model="eventInfoData.store" - clearable - @change="selectStoreChange" - placeholder="璇烽�夋嫨鍏宠仈搴楅摵" + v-model="eventInfoData.store" + clearable + @change="selectStoreChange" + placeholder="璇烽�夋嫨鍏宠仈搴楅摵" > <el-option - v-for="store in storeList" - :value="store.id" - :label="store.storeName" - :key="store.id" + v-for="store in storeList" + :value="store.id" + :label="store.storeName" + :key="store.id" /> </el-select> </el-form-item> <el-form-item v-if="eventInfoData.store" label="搴楅摵寰楀垎:"> <span>{{ - selectStoreChange(eventInfoData.store).storeScore - }}</span> + selectStoreChange(eventInfoData.store).storeScore + }}</span> </el-form-item> <el-form-item label="澶勭悊鎰忚:" prop="state"> <el-radio-group v-model="eventInfoData.state"> <el-radio - :label="item.id" - v-for="item in stateList" - :key="item.id" - >{{ item.label }} - </el-radio> + :label="item.id" + v-for="item in stateList" + :key="item.id" + >{{ item.label }}</el-radio + > </el-radio-group> </el-form-item> <el-form-item label="澶х被鍚嶇О:" prop="categoryId"> <el-select - v-model="eventInfoData.categoryId" - placeholder="璇烽�夋嫨澶х被鍚嶇О" - @change="categoryChange" + v-model="eventInfoData.categoryId" + placeholder="璇烽�夋嫨澶х被鍚嶇О" + @change="categoryChange" > <el-option - v-for="category in categoryOptions" - :key="category.id" - :value="category.id" - :label="category.name" + v-for="category in categoryOptions" + :key="category.id" + :value="category.id" + :label="category.name" /> </el-select> </el-form-item> <el-form-item label="灏忕被鍚嶇О:" prop="typeId"> <el-select - v-model="eventInfoData.typeId" - placeholder="璇烽�夋嫨灏忕被鍚嶇О" + v-model="eventInfoData.typeId" + placeholder="璇烽�夋嫨灏忕被鍚嶇О" > <el-option - v-for="type in typeOptions" - :key="type.id" - :value="type.id" - :label="type.name" + v-for="type in typeOptions" + :key="type.id" + :value="type.id" + :label="type.name" /> </el-select> </el-form-item> <el-form-item label="杞︾墝鍙�:" prop="carNumber"> <el-input - v-model="eventInfoData.carNumber" - placeholder="璇峰~鍐欒溅鐗屽彿鐮�" + v-model="eventInfoData.carNumber" + placeholder="璇峰~鍐欒溅鐗屽彿鐮�" ></el-input> </el-form-item> <el-form-item label="澶囨敞:" prop="description"> <el-input - type="textarea" - :rows="5" - v-model="eventInfoData.description" + type="textarea" + :rows="5" + v-model="eventInfoData.description" ></el-input> </el-form-item> <el-form-item> <el-button - :disabled="currentPage === 1" - @click="pageChange('prev')" - >涓婁竴鏉� - </el-button> + :disabled="currentPage === 1" + @click="pageChange('prev')" + >涓婁竴鏉�</el-button + > <el-button @click.native.prevent="handleConfirm" - >纭 - </el-button> + >纭</el-button + > <el-button @click="pageChange('next')">涓嬩竴鏉�</el-button> </el-form-item> </el-form> @@ -165,25 +206,22 @@ </div> <el-dialog :visible="isShowDialog" title="璋冨害淇℃伅"> <MyDispatch - v-if="isShowDialog" - :mytype="1" - @getDispatchData="confirmInspection" - :isGetData="true" - @changeDialog="closeDialog" + v-if="isShowDialog" + :mytype="1" + @getDispatchData="confirmInspection" + :isGetData="true" + @changeDialog="closeDialog" ></MyDispatch> </el-dialog> <el-dialog - :visible.sync="dialogCreate" - title="鏌ョ湅瑙嗛" - v-show="dialogCreate" - :before-close="handleClose2" + :visible.sync="dialogCreate" + title="鏌ョ湅瑙嗛" + v-show="dialogCreate" + :before-close="handleClose2" > <div class="dom" style="width: 100%; height: 600px; position: relative"> <div id="dom1" class="dom1"></div> </div> - </el-dialog> - <el-dialog :visible.sync="isShowTable" title="鎶ヨ淇℃伅" width="1200px"> - <inspection-table /> </el-dialog> </div> </template> @@ -195,43 +233,42 @@ 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 MyMap from "@/components/map"; export default { - components: { MyDispatch, MyMap, InspectionTable }, + components: { MyDispatch, MyMap }, created() { this.getInspectionData(); this.initEventParams(); basecase - .getInspectionCountData() - .then((res) => { - this.countData = res; - }) - .catch((err) => this.$message.error(err)); + .getInspectionCountData() + .then((res) => { + this.countData = res; + }) + .catch((err) => this.$message.error(err)); getStoreInfoList({ current: 1, size: 100 }) - .then(({ list }) => { - this.storeList = list; - }) - .catch((err) => { - this.$message.error(err); - }); + .then(({ list }) => { + this.storeList = list; + }) + .catch((err) => { + this.$message.error(err); + }); baseInfo - .getCategoryList() - .then((res) => { - this.categoryOptions = res; - }) - .catch((err) => this.$message.error(err)); + .getCategoryList() + .then((res) => { + this.categoryOptions = res; + }) + .catch((err) => this.$message.error(err)); baseInfo - .getTypeList() - .then((res) => { - this.typeList = res; - }) - .catch((err) => this.$message.error(err)); + .getTypeList() + .then((res) => { + this.typeList = res; + }) + .catch((err) => this.$message.error(err)); }, mounted() { this.timer = setInterval(() => { @@ -257,7 +294,6 @@ review: 0, register: 0, }, - isShowTable: false, currentEvent: {}, stateList: [ { @@ -323,15 +359,9 @@ domId: "dom1", ctrl: "ctrl1", playType: "live", - point: null, - mark: null, - zoom: null, }; }, methods: { - openDialogTable() { - this.isShowTable = true; - }, pageChange(type) { if (type === "next") { this.currentPage += 1; @@ -343,38 +373,32 @@ getInspectionData() { basecase - .getInspectionData({ current: this.currentPage }) - .then(({ records }) => { - this.currentEvent = records[0]; - this.point = { - x: this.currentEvent.longitude, - y: this.currentEvent.latitude, - }; - this.zoom = 19; - this.mark = { title: this.currentEvent.address }; - if (this.currentEvent?.picData) { - this.imageList = this.currentEvent.picData - .split(",") - .map((item) => `${FILE_ORIGINAL_URL}${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)}灏忔椂`; - } - }) - .catch((err) => this.$message.error(err)); + .getInspectionData({ current: this.currentPage }) + .then(({ records }) => { + this.currentEvent = records[0]; + if (this.currentEvent?.picData) { + this.imageList = this.currentEvent.picData + .split(",") + .map((item) => `${FILE_ORIGINAL_URL}${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)}灏忔椂`; + } + }) + .catch((err) => this.$message.error(err)); }, // 纭鐐瑰嚮浜嬩欢 @@ -417,13 +441,13 @@ const eventParams = Object.assign({}, this.eventInfoData); delete eventParams.store; basecase - .confirmInspection({ ...eventParams, ...data }) - .then(() => { - this.$message.success("鎿嶄綔鎴愬姛"); - this.getInspectionData(); - this.initEventParams(); - }) - .catch((err) => this.$message.error(err)); + .confirmInspection({ ...eventParams, ...data }) + .then(() => { + this.$message.success("鎿嶄綔鎴愬姛"); + this.getInspectionData(); + this.initEventParams(); + }) + .catch((err) => this.$message.error(err)); }, closeDialog() { @@ -515,14 +539,14 @@ // }); _this.ws - .createCtrl(params) - .then((res) => { - this.$message.success("鍒涘缓鎴愬姛"); - console.log("res", res); - }) - .catch((e) => { - console.log("error;", e); - }); + .createCtrl(params) + .then((res) => { + this.$message.success("鍒涘缓鎴愬姛"); + console.log("res", res); + }) + .catch((e) => { + console.log("error;", e); + }); if (ctrlType == "playback") { const end = new Date(); @@ -625,6 +649,7 @@ margin-left: 4vw; } } + .sjm-header-right { flex: 1; display: flex; @@ -643,11 +668,12 @@ .sjm-content-left { line-height: 4.8vh; - + .left-form> ::v-deep.el-form-item__label{ + font-size: 16px!important; + } .img-item { display: flex; flex-direction: column; - img { width: 15vw; height: 20vh; @@ -659,11 +685,12 @@ } } - .sjm-content-center { - width: calc(100% - 800px); - } .sjm-content-right { .card-box { + .but-live{ + padding-left: 48px; + line-height: 4.8vh; + } .card-header { padding-left: 48px; line-height: 4.8vh; @@ -675,7 +702,7 @@ .el-form { ::v-deep .el-form-item { - margin-bottom: 15px; + margin-bottom: 5px; } ::v-deep .el-form-item__label { @@ -689,7 +716,7 @@ } .map { - height: 100%; + height: 488px; min-width: 460px; } </style> -- Gitblit v1.8.0