From 93a26507f76156fa65aead1515c430688c089e1d Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期一, 22 二月 2021 15:49:01 +0800 Subject: [PATCH] 新版目录树样式调试及状态更新调试;朔黄批量导入列表调试;视频检索页面添加处理参数,添加标注接口添加参数;分页器展示优化,默认检索时间调整;转储设备接口调试 --- src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue | 122 ++++++++++++++++++++++++++-------------- 1 files changed, 79 insertions(+), 43 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue index f1556b5..2d8b3dd 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue @@ -117,17 +117,17 @@ <div class="header-bar clearfix"> <div class="left"> <div> - <el-select v-model="watch" size="mini"> + <el-select v-model="IsFollow" size="mini" @change="filterSearchData"> <el-option value label="鍏ㄩ儴"></el-option> - <el-option value="1" label="鏈叧娉�"></el-option> - <el-option value="2" label="宸插叧娉�"></el-option> + <el-option :value="false" label="鏈叧娉�"></el-option> + <el-option :value="true" label="宸插叧娉�"></el-option> </el-select> </div> <div> - <el-select v-model="settle" size="mini"> + <el-select v-model="IsOperate" size="mini" @change="filterSearchData"> <el-option value label="鍏ㄩ儴"></el-option> - <el-option value="1" label="鏈鐞�"></el-option> - <el-option value="2" label="宸插鐞�"></el-option> + <el-option value="0" label="鏈鐞�"></el-option> + <el-option value="1" label="宸插鐞�"></el-option> </el-select> </div> </div> @@ -187,6 +187,7 @@ </el-col> </el-row> <el-pagination + class="pagination-center" background @size-change="handleTabSizeChange" @current-change="handleCurrentChange" @@ -216,6 +217,7 @@ </el-table-column> </el-table> <el-pagination + class="pagination-center" @size-change="handleTableSizeChange" @current-change="handleCurrentChange" :current-page.sync="curTablePage" @@ -236,7 +238,6 @@ <span>鎾斁瑙嗛</span> </div> </div> - <video-analyze :videoDetails="selectedVideo" /> </el-dialog> </div> @@ -252,11 +253,13 @@ components: { VideoAnalyze }, - data () { + data() { return { - CLIP: 'http://192.168.20.113/', + CLIP: 'http://', keyword: '', - searchTime: [this.$moment(new Date().getTime() - 3600 * 1000 * 24 * 5).format("YYYY-MM-DD HH:mm:ss"), this.$moment(new Date()).format("YYYY-MM-DD HH:mm:ss")], + IsFollow: '', + //searchTime: [this.$moment(new Date().getTime() - 3600 * 1000 * 24 * 5).format("YYYY-MM-DD HH:mm:ss"), this.$moment(new Date()).format("YYYY-MM-DD HH:mm:ss")], + searchTime: [new Date(2020,0,1,0,0,0),new Date(2020,11,31,23,59,59)], curTabPage: 1, curTablePage: 1, tabPageSize: 8, @@ -268,7 +271,7 @@ pickerOptions: { shortcuts: [{ text: '浠婂ぉ', - onClick (picker) { + onClick(picker) { const end = new Date(); const start = new Date(); start.setHours(0, 0, 0); @@ -276,7 +279,7 @@ } }, { text: '鏄ㄥぉ', - onClick (picker) { + onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24); @@ -287,7 +290,7 @@ } }, { text: '杩戜笁澶�', - onClick (picker) { + onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 3); @@ -295,7 +298,7 @@ } }, { text: '杩戜竴鍛�', - onClick (picker) { + onClick(picker) { const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); @@ -309,8 +312,8 @@ highLevelConfigs: [], showAdvance: true, fixedOneLineHeight: 40, - watch: '', settle: '', + IsOperate: '', showType: 'menu', tableData: [ { name: 'SS4B115_06_B鑺備簩绔徃鏈哄_20201115_091500.mp4', size: '17.66M', updateTime: '2020-11-04 15:41', createTime: '2020-11-04 15:41' }, @@ -320,7 +323,6 @@ { id: 'ss1', no: 'SS4B115', frequency: '8084', time: '2020-09-21 20:45:08', driver: '寮犱笁', marks: ['鏈懠鍞ゃ�佸懠鍞や笉鏍囧噯', '瀛︿範鍙告満鏈簲绛�'], markType: 1, tags: ['杩涘嚭绔�', '鍙告満绂诲矖'], follow: true }, { id: 'ss2', no: 'SS4B115', frequency: '8084', time: '2020-09-21 20:45:08', driver: '寮犱笁', marks: [], markType: 0, tags: ['杩涘嚭绔�', '鍙告満绂诲矖'], follow: false } ], - videoDialogVisible: false, hiddenDanger: 1, labelDialogVisible: false, @@ -329,38 +331,47 @@ }, watch: { checkedConfigs: { - handler (n, o) { + handler(n, o) { this.filterSearchData() }, deep: true } }, - mounted () { + mounted() { this.init(); }, methods: { - handleTabSizeChange (size) { - debugger + handleTabSizeChange(size) { this.tabPageSize = size; this.filterSearchData() }, - handleTableSizeChange (size) { + handleTableSizeChange(size) { this.tablePageSize = size; this.filterSearchData() }, - handleCurrentChange () { + handleCurrentChange() { this.filterSearchData() }, //浜岀骇鏌ヨ - filterSearchData () { + filterSearchData() { let _this = this; + let isFollow = ''; + if (this.IsFollow === '') { + isFollow = '' + } else if (!!this.IsFollow) { + isFollow = '1' + } else { + isFollow = '0' + } let query = { KeyWord: this.keyword, StartDate: this.searchTime[0], EndDate: this.searchTime[1], - PageIndex: this.showType == 'list' ? this.curTablePage : this.showType == 'list', + PageIndex: this.showType == 'list' ? this.curTablePage : this.curTabPage, PageSize: this.showType == 'list' ? this.tablePageSize : this.tabPageSize, - IsDetail: this.showType == 'list' + IsDetail: this.showType == 'list', + IsFollow: isFollow, + IsOperate: this.IsOperate }; let filterQuerys = []; this.checkedConfigs.forEach(config => { @@ -386,7 +397,7 @@ }) }, //涓�绾ф煡璇� - init () { + init() { let _this = this; let query = { KeyWord: this.keyword, @@ -394,7 +405,9 @@ EndDate: this.searchTime[1], PageIndex: this.showType == 'list' ? this.curTablePage : this.showType == 'list', PageSize: this.showType == 'list' ? this.tablePageSize : this.tabPageSize, - IsDetail: this.showType == 'list' + IsDetail: this.showType == 'list', + IsFollow: this.IsFollow, + IsOperate: this.IsOperate, }; this.optionalConfigs = []; this.highLevelConfigs = []; @@ -415,6 +428,12 @@ obj.id = config.Node[key] return obj }); + // config.data = config.Node.map((item) => { + // let obj = {}; + // obj.name = item[0]; + // obj.id = item[1]; + // return obj; + // }); config.id = config.ID; config.title = config.NameZn; config.data.forEach(item => { @@ -442,7 +461,7 @@ }) }, - toggleFollow (data) { + toggleFollow(data) { data.IsFollow = !data.IsFollow; this.updataVideo(data); if (data.IsFollow) { @@ -452,26 +471,27 @@ }); } }, - updataVideo (data) { + updataVideo(data) { let _this = this; updateVideoAnalyze(data).then(res => { //浜岀骇鏌ヨ }); }, - checkVideoDetail (data) { + checkVideoDetail(data) { let _this = this; _this.selectedVideo = data; _this.videoDialogVisible = true; - }, - checkFollow () { }, - checkType (type) { + checkFollow() { + + }, + checkType(type) { this.showType = type; this.filterSearchData() }, - clearCheckedConfigs () { + clearCheckedConfigs() { this.checkedConfigs.forEach(config => { config.isShow = true; config.data.forEach(d => { @@ -481,7 +501,7 @@ this.checkedConfigs = []; this.showAdvance = true; }, - removeCheckedConfig (config) { + removeCheckedConfig(config) { config.isShow = true; if (config.IsAdvanced) { this.showAdvance = true; @@ -492,7 +512,7 @@ let index = this.checkedConfigs.findIndex(one => one.id == config.id); this.checkedConfigs.splice(index, 1); }, - checkOption (config, option) { + checkOption(config, option) { if (option) { option.isChecked = true; } @@ -509,20 +529,20 @@ }, - cancleMultCheck (config) { + cancleMultCheck(config) { config.isMultCheck = false; config.data.forEach(opt => { opt.isChecked = false; }); }, - handleSelect (key, keyPath) { + handleSelect(key, keyPath) { }, - showMore (config) { + showMore(config) { config.isShowMore = !config.isShowMore; this.$refs[`options${config.id}`][0].style.height = config.isShowMore ? this.$refs[`options${config.id}`][0].scrollHeight + 'px' : this.fixedOneLineHeight + 'px'; }, - toggleMultCheck (config) { + toggleMultCheck(config) { config.isMultCheck = !config.isMultCheck; this.optionalConfigs.forEach(conf => { if (conf.id == config.id) { @@ -531,7 +551,7 @@ conf.isMultCheck = false; }) }, - dataSearch () { + dataSearch() { console.log(this.checkedConfigs); this.$forceUpdate(); }, @@ -543,6 +563,9 @@ <style lang="scss"> .search-for-video-analyze { padding: 20px 30px; + .flex-box { + display: flex; + } .filter-area { .input-area { display: flex; @@ -733,11 +756,20 @@ border-radius: 5px; height: 350px; .video-wrap { - background: aliceblue; border-radius: 3px; + width: 100%; + padding-top: 56.25%; + height: 0; + position: relative; img { + position: absolute; + top: 0; width: 100%; - border-radius: 3px; + height: 100%; + object-fit: contain; + // width: 100%; + // max-height: 200px; + // border-radius: 3px; } } .video-info { @@ -790,6 +822,10 @@ cursor: pointer; } } + .pagination-center{ + text-align: center; + margin: 10px auto; + } } .dialog-video { z-index: 2096 !important; -- Gitblit v1.8.0