From e6443cf405d4e950abe35a29e6c133d097fc1ad5 Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期一, 04 十二月 2023 17:46:01 +0800 Subject: [PATCH] 100路视频 --- src/views/intelligentPatrol/illegalSearch/index.vue | 164 +++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 124 insertions(+), 40 deletions(-) diff --git a/src/views/intelligentPatrol/illegalSearch/index.vue b/src/views/intelligentPatrol/illegalSearch/index.vue index 258b3a3..39538a8 100644 --- a/src/views/intelligentPatrol/illegalSearch/index.vue +++ b/src/views/intelligentPatrol/illegalSearch/index.vue @@ -6,14 +6,15 @@ <el-form ref="condition" :model="form" label-width="100px"> <el-form-item :label=item.label :key=item.id v-for="item in headerList" :prop="item.prop"> <el-input v-if="item.type === 'input'" v-model="form[item.prop]" :placeholder="item.placeholder"></el-input> - <el-cascader v-if="item.type === 'cascader'" :options="item.options" :props="{ value: 'id', label: 'regionName' }" - v-model="form[item.prop]" :placeholder="item.placeholder"></el-cascader> + <el-cascader v-if="item.type === 'cascader'" :options="item.options" + :props="{ value: 'id', label: 'regionName' }" v-model="form[item.prop]" + :placeholder="item.placeholder"></el-cascader> <el-select v-if="item.type === 'select'" v-model="form[item.prop]" :placeholder="item.placeholder"> - <el-option v-for="option in item.options" :value="option.id" :key="option.id" :label="option.name"></el-option> + <el-option v-for="option in item.options" :value="option.id" :key="option.id" + :label="option.name"></el-option> </el-select> - <el-date-picker v-if="item.type === 'timepick'" type="datetimerange" v-model="form[item.prop]" start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" value-format="yyyy-MM-dd HH:mm:ss" - ></el-date-picker> + <el-date-picker v-if="item.type === 'timepick'" type="datetimerange" v-model="form[item.prop]" + start-placeholder="寮�濮嬫棩鏈�" end-placeholder="缁撴潫鏃ユ湡" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker> </el-form-item> </el-form> </div> @@ -32,9 +33,12 @@ </div> </div> <!-- 鏁版嵁灞曠ず --> - <el-table ref="multipleTable" - :header-cell-style="{ background: '#06122c', 'font-size': '12px', color: '#4b9bb7', 'font-weight': '650', 'line-height': '45px' }" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + <el-table + border + stripe + ref="multipleTable" + :header-cell-style="{ 'background':'#F5F5F5','font-weight': '650', 'line-height': '45px' }" + :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> <el-table-column type="selection" min-width="5"> </el-table-column> <el-table-column prop="code" label="浜嬩欢缂栧彿" min-width="10"> @@ -68,6 +72,28 @@ </el-table-column> </el-table> </div> + <div class="tools"> + <div class="funs"> + <!-- <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" + :value="item.value" :disabled="item.disabled"> + </el-option> + </el-select> + </div> --> + </div> + <div class="pagination"> + <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum" + :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev" @next-click="handleNext"> + </el-pagination> + </div> + </div> </main> <footer> <!-- 鏌ョ湅鍏蜂綋淇℃伅 --> @@ -84,6 +110,8 @@ import basecase from "@/api/operate/basecase"; import department from "@/api/system/department"; import { getVideoPoint } from "@/api/operate/storeManagement"; +import baseInfo from "@/api/baseInfo"; +import {getTypeList} from "@/utils/helper" export default { components: { @@ -95,16 +123,23 @@ // 鑾峰彇缁勭粐鍒楄〃 department.getDepartmentList() - .then(res => { - this.headerList[0].options = res; - }) - .catch(err => this.$message.error(err)) + .then(res => { + this.headerList[0].options = res; + }) + .catch(err => this.$message.error(err)) getVideoPoint({ current: 1, size: 100 }) - .then(({ records }) => { - this.headerList[4].options = records; - }) - .catch(err => this.$message.error(err)) + .then(({ records }) => { + this.headerList[4].options = records; + }) + .catch(err => this.$message.error(err)) + + baseInfo.getCategoryList().then((result)=>{ + this.headerList[2].options = result; + }) + getTypeList("1","02").then((result)=>{ + this.headerList[8].options = result; + }) }, data() { @@ -114,6 +149,7 @@ info: null, currentPage: 1, pageSize: 10, + totalNum: null, headerList: [ { id: 1, @@ -138,7 +174,8 @@ value: '', placeholder: '璇疯緭鍏ヨ繚瑙勭被鍨�', prop: 'typeId', - type: 'input' + type: 'select', + options: [] }, { id: 4, @@ -163,6 +200,7 @@ value: '', placeholder: '璇疯緭鍏ュ鏍哥姸鎬�', type: 'select', + prop: 'state', options: [{ id: 7, name: '鏈鏍�' }, { id: 8, name: '宸茬粡瀹℃牳' }, { id: 9, name: '缁撴' }] }, { @@ -187,7 +225,8 @@ value: '', placeholder: '璇疯緭鍏ヤ簨浠剁瓑绾�', prop: 'gradeId', - type: 'input' + type: 'select', + options: [] }, ], form: { @@ -208,10 +247,11 @@ methods: { getTableData(params) { basecase.getViolationList({ current: this.currentPage, pageSize: this.pageSize, ...params }) - .then(({ records }) => { - this.tableData = records; - }) - .catch(err => this.$message.error(err)) + .then(({ records, total }) => { + this.tableData = records; + this.totalNum = total; + }) + .catch(err => this.$message.error(err)) }, searchTableData() { @@ -250,11 +290,48 @@ this.info = data this.dialogView = true }, - + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + const { alarmTime, organization } = this.form; + const [startTime, endTime] = alarmTime ?? [null, null]; + const [communityId, streetId] = organization ?? [null, null]; + const params = Object.assign({}, this.form); + delete params.alarmTime; + delete params.organization; + this.currentPage = page; + this.getTableData({ startTime, streetId, communityId, endTime, ...params }); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + const { alarmTime, organization } = this.form; + const [startTime, endTime] = alarmTime ?? [null, null]; + const [communityId, streetId] = organization ?? [null, null]; + const params = Object.assign({}, this.form); + delete params.alarmTime; + delete params.organization; + this.currentPage = page; + this.getTableData({ startTime, streetId, communityId, endTime, ...params }); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + const { alarmTime, organization } = this.form; + const [startTime, endTime] = alarmTime ?? [null, null]; + const [communityId, streetId] = organization ?? [null, null]; + const params = Object.assign({}, this.form); + delete params.alarmTime; + delete params.organization; + this.currentPage = page; + this.getTableData({ startTime, streetId, communityId, endTime, ...params }); + }, exportTableData() { - basecase.exportViolationData({ current: 1 }) + const { alarmTime, organization } = this.form; + const [startTime, endTime] = alarmTime ?? [null, null]; + const [communityId, streetId] = organization ?? [null, null]; + const params = Object.assign({}, this.form); + delete params.alarmTime; + delete params.organization; + basecase.exportViolationData( { current: 1, startTime, streetId, communityId, endTime, ...params }) .then((res) => { - console.log(res) this.$message.success('鎿嶄綔鎴愬姛'); // let res = basecase.exportUserOperationLogAjax({ // startLogTime: transDate(this.searchQuery.date[0], "YYYY-MM-DD"), @@ -291,14 +368,14 @@ <style lang="scss" scoped> .illegal-search { text-align: left; - margin: 10px 20px; + padding: 10px 20px; color: #4b9bb7; - + border: 1px solid #ccc; header { - background-color: #09152f; + background-color: white; .headerContent { - padding: 20px 40px; + //padding: 20px 40px; display: flex; justify-content: space-between; align-items: center; @@ -320,7 +397,7 @@ } main { - background-color: #09152f; + background-color: #ffffff; margin-top: 20px; padding-bottom: 50px; @@ -335,22 +412,24 @@ padding: 0 20px; .el-button { - background-color: #17324c; - border: 1px solid #17324c; - color: #4b9bb7; + background-color: #2f91ec; + //border: 1px solid #17324c; + color: #ffffff; } } - .el-table{ - color: #4b9bb7; + + .el-table { + // color: #4b9bb7; } + .tools { display: flex; justify-content: space-between; align-items: center; - padding: 0 20px; + //padding: 0 20px; .funs-sp { - border: 1px solid #17324c; + border: 1px solid #DCDFE6; } .funs { @@ -371,6 +450,11 @@ &::v-deep .el-input__inner { border: none; - background-color: #09152f; - }}}}}} + // background-color: #09152f; + } + } + } + } + } +} </style> -- Gitblit v1.8.0