From 56fefc5023550b24df05684f8908bc1cbaec1a9c Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期一, 16 十一月 2020 15:51:55 +0800 Subject: [PATCH] 数据栈添加分辨率信息维护 --- src/pages/cameraAccess/components/DataStackInfo.vue | 137 +++++++++++++++++++++++---------------------- 1 files changed, 70 insertions(+), 67 deletions(-) diff --git a/src/pages/cameraAccess/components/DataStackInfo.vue b/src/pages/cameraAccess/components/DataStackInfo.vue index cad4022..a4801b3 100644 --- a/src/pages/cameraAccess/components/DataStackInfo.vue +++ b/src/pages/cameraAccess/components/DataStackInfo.vue @@ -13,7 +13,22 @@ <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 + v-model="form.resolution" + placeholder="鏈満鍒嗚鲸鐜�" + style="position: absolute;left: 0;" + size="small" + @change="checkResolution" + > + <el-option + v-for="item in form.resolutions" + :key="`${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" @@ -133,7 +148,7 @@ @select="handleSelect" @select-all="handleSelect" > - <el-table-column type="selection" width="50" 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"> @@ -172,7 +187,7 @@ >{{row.name}}</a> </template> </el-table-column> - <el-table-column prop="fileSize" label="澶у皬" width="120"> + <el-table-column prop="fileSize" label="澶у皬"> <template slot-scope="scope">{{scope.row.size | readFileSizeUnit}}</template> </el-table-column> <el-table-column prop="duration" label="鏃堕暱" show-overflow-tooltip align="center"></el-table-column> @@ -261,7 +276,7 @@ @size-change="handleSizeChange" @current-change="handleRefrashFileList" :current-page="page" - :page-sizes="[5, 10, 15, 20]" + :page-sizes="[10, 20, 50, 100]" :page-size="size" style="position:absolute;right:10px;bottom:5px" :total="total" @@ -271,8 +286,12 @@ <template v-for="stack in DataStackPool.dirs"> <!-- 鏂囦欢涓婁紶缁勪欢 --> - <file-uploader :ref="`uploader_${stack.id}`" :key="stack.id" v-show="activeName === 'uploading' && stack.id == DataStackPool.selectedDir.id" :attrs="attrs" /> - <!-- <file-uploader ref="uploader" v-show="activeName === 'uploading'" /> --> + <file-uploader + :ref="`uploader_${stack.id}`" + :key="stack.id" + v-show="activeName === 'uploading' && stack.id == DataStackPool.selectedDir.id" + :sourceType="stack.type" + /> </template> <!-- 鏂囦欢棰勮 --> <el-dialog title="鏌ョ湅鏂囦欢" :visible.sync="previewDialog" width="500px"> @@ -335,7 +354,7 @@ } }, filters: { - statusFormat (value) { + statusFormat(value) { let statusCode = { "-1": "宸插垹闄�", "0": "鏆傚仠澶勭悊", @@ -345,7 +364,7 @@ } return statusCode[value]; }, - readFileSizeUnit (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]; @@ -364,7 +383,7 @@ } }, computed: { - snapshotClass () { + snapshotClass() { let classs = ["snapshot"]; if (this.form.type === 1) { classs.push("snapshot-video") @@ -378,13 +397,13 @@ return classs; }, - dirOptions () { + dirOptions() { return this.DataStackPool.dirs.filter(dir => { return dir.id !== this.DataStackPool.selectedDir.id }) } }, - data () { + data() { return { videoUrl: "", imgUrl: "", @@ -396,7 +415,8 @@ multipleSelection: [], searchInput: "", form: { - id: "" + id: "", + resolution: "" }, fileList: [], // 璁板綍娣诲姞鐘舵�� @@ -416,42 +436,31 @@ timer: 0, targetDir: "", targetFile: "", - attrs: { - accept: "" - } }; }, - mounted () { + mounted() { this.initFormData(); console.log(this.PollData.barCharts) }, - beforeDestroy () { + beforeDestroy() { this.taskUid = 0; }, watch: { 'fileList.length': { - handler (n, o) { + handler(n, o) { //鏁版嵁鏍堟枃浠舵暟閲忓彉鏇� //鏇存柊鐙珛鍦烘櫙鏁版嵁鏍堟枃浠� this.$root.$children[0].$children[1].$refs['sepRule'].getStackFiles(); } }, - 'form.type': { - handler (n, o) { - console.log(n, o) - if (n == 1) { - //浠呮敮鎸佷笂浼犺棰� - this.$set(this.attrs, 'accept', ".mp4"); - } else if (n == 2) { - //鍥剧墖 - this.$set(this.attrs, 'accept', ".jpg,.jpeg,.png"); - } - } - } }, methods: { - preview (row) { + checkResolution(val){ + this.form.resolution_width = Number(val.split('*')[0]); + this.form.resolution_height = Number(val.split('*')[1]); + }, + preview(row) { this.previewDialog = true; if (row.type === 1) { @@ -462,7 +471,7 @@ } }, // 娓呯┖杈撳叆妗� - initFormData () { + initFormData() { this.form = { enable: false, id: "", @@ -474,19 +483,18 @@ }; }, // 娣诲姞璁惧 - addDir (node) { + addDir(node) { this.isAdd = true; this.isDisabled = false; this.initFormData(); this.DataStackPool.clean(); this.fileList = []; }, - selectDir (node) { - + selectDir(node) { if (node.id === "") { return } - + console.log('閫夋嫨鏁版嵁鏍�',node) this.isDisabled = false; this.isAdd = false; this.videoItem = null; @@ -494,6 +502,7 @@ // 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; @@ -508,30 +517,26 @@ this.videoUrl = ''; this.imgUrl = ''; }, - initFetchListTask () { + initFetchListTask() { const uid = Math.round(Math.random() * 1000); this.taskUid = uid; this.timingtask(uid); }, - timingtask (uid) { + timingtask(uid) { if (uid !== this.taskUid || this.form.id === "") { return; } - this.fetchFileList(); - let _this = this; this.timer = setTimeout(() => { _this.timingtask(uid); }, 2 * 1000); }, - fetchFileList () { + fetchFileList() { findAllFileByStackId({ name: this.searchInput, stackId: this.form.id, page: this.page, size: this.size, type: 0 }).then(rsp => { if (rsp && rsp.success && rsp.data.total >= 0) { this.fileList = rsp.data.dataList; - this.total = rsp.data.total; - // 瀹氭椂鍒锋柊浼氭竻绌洪�変腑鐘舵�侊紝鍦ㄨ繖閲屾仮澶� this.fileList.forEach(row => { //this.polygonDatas.push({snapshot_url:row.snapshot_url}) @@ -545,11 +550,10 @@ }).catch(err => { console.log(err) }) - }, // 淇濆瓨 - onSubmit (formName) { + onSubmit(formName) { this.$refs[formName].validate(async valid => { if (valid) { saveDir(this.form).then(rsp => { @@ -570,7 +574,7 @@ }); }, // 鍒犻櫎鎽勫儚鏈� - deleteDir () { + deleteDir() { this.$confirm("鏄惁鍒犻櫎姝ゆ枃浠跺す锛�", { center: true, cancelButtonClass: "comfirm-class-cancle", @@ -599,33 +603,32 @@ }); }); }, - handleTabClick (tab, event) { + handleTabClick(tab, event) { console.log(tab, event); }, - handleSelect (val) { + handleSelect(val) { this.multipleSelection = val.map(row => { return row.id; }); }, - handelSearchInputChange (val) { + handelSearchInputChange(val) { this.multipleSelection = []; }, - handleUpload () { + handleUpload() { console.log(this.DataStackPool.selectedDir.id) - debugger console.log(this.$refs[`uploader_${this.DataStackPool.selectedDir.id}`][0].$refs.button.$refs.btn.click()) }, - handleRefrashFileList (val) { + handleRefrashFileList(val) { this.page = val; this.multipleSelection = []; this.fetchFileList(); }, - handleSizeChange (val) { + handleSizeChange(val) { this.size = val; this.multipleSelection = []; this.fetchFileList(); }, - async handleSortFile (direct, id) { + async handleSortFile(direct, id) { let res = await sortFile({ id: id, direct: direct @@ -641,7 +644,7 @@ }) } }, - async handleFileStatus (row, status, multi = false) { + async handleFileStatus(row, status, multi = false) { let ids = this.multipleSelection; if (!multi) { ids = [row.id]; @@ -669,10 +672,10 @@ console.log("err") } }, - dropdownClick (cmd) { + dropdownClick(cmd) { cmd.cb(cmd.data); }, - handleFileDelete (rows, multi = false) { + handleFileDelete(rows, multi = false) { let _this = this; let ids = this.multipleSelection; if (!multi) { @@ -699,17 +702,17 @@ }).catch(() => { }) }, - handleFileMove (row) { + handleFileMove(row) { this.targetDir = ""; this.targetFile = row.id; this.fileDialog = true; }, - handleFileRename (row) { + handleFileRename(row) { this.editRowId = row.id; clearTimeout(this.timer); this.timer = null; }, - cellRenameFile (row) { + cellRenameFile(row) { this.editRowId = ""; renameFile({ id: row.id, name: row.name }).then(rsp => { if (rsp && rsp.success) { @@ -732,10 +735,10 @@ } }) }, - isSelectable (row, rowIndex) { + isSelectable(row, rowIndex) { return row.status !== 2 }, - cellFileCopy () { + cellFileCopy() { copyFile({ id: this.targetFile, stackIds: [this.targetDir] }).then(rsp => { if (rsp && rsp.success) { this.$notify({ @@ -751,7 +754,7 @@ } }) }, - cellFileMove () { + cellFileMove() { moveFile({ id: this.targetFile, stackId: this.targetDir }).then(rsp => { if (rsp && rsp.success) { this.$notify({ @@ -871,19 +874,19 @@ vertical-align: middle; } .snapshot-video { - background: url('/images/cameraAccess/video.png'); + background: url("/images/cameraAccess/video.png"); background-repeat: round; } .snapshot-image { - background: url('/images/cameraAccess/image.png'); + background: url("/images/cameraAccess/image.png"); background-repeat: round; } .snapshot-audio { - background: url('/images/cameraAccess/audio.png'); + background: url("/images/cameraAccess/audio.png"); background-repeat: round; } .snapshot-files { - background: url('/images/cameraAccess/files.png'); + background: url("/images/cameraAccess/files.png"); background-repeat: round; } } -- Gitblit v1.8.0