From ccee429d379e0108b7445f72ade8d97c110a6fb3 Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期二, 09 十一月 2021 18:01:59 +0800 Subject: [PATCH] 问题修复 --- src/pages/cameraAccess/components/DataStackInfo.vue | 233 +++++++++++++++++++++++++++++++--------------------------- 1 files changed, 124 insertions(+), 109 deletions(-) diff --git a/src/pages/cameraAccess/components/DataStackInfo.vue b/src/pages/cameraAccess/components/DataStackInfo.vue index fffe4d0..7b695db 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" @@ -50,7 +65,7 @@ <li> <info-card style="width: 100%;min-width: 440px" - :realtime="PollData.RealTimeSum" + :realtime="PollData.RealTimeValidCount" :polling="PollData.PollValidCount" :dataStack="PollData.stackChannelCount" ></info-card> @@ -105,15 +120,20 @@ </el-tooltip> <!-- 鏂囦欢涓婁紶 --> - <el-button - type="primary" - size="small" - :disabled="!DataStackPool.selectedDir.id" - @click="handleUpload" - > - 涓婁紶 - <i class="el-icon-upload el-icon--right"></i> - </el-button> + <template v-for="stack in DataStackPool.dirs"> + <el-button + :class="`uploader_${stack.id}`" + :key="stack.id" + type="primary" + size="small" + v-show="stack.id == DataStackPool.selectedDir.id" + :disabled="!DataStackPool.selectedDir.id" + @click="handleUpload" + > + 涓婁紶 + <i class="el-icon-upload el-icon--right"></i> + </el-button> + </template> </div> </div> @@ -128,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"> @@ -143,7 +163,7 @@ </el-image> <el-image v-if="row.type==2" - style="width: 30x; height: 30px" + style="width: 30x; height: 30px;background:#fff;" :src="`/files/${row.path.substr(row.path.lastIndexOf('/')+1)}`" fit="fill" :preview-src-list="[`/files/${row.path.substr(row.path.lastIndexOf('/')+1)}`]" @@ -167,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> @@ -217,7 +237,7 @@ :disabled="scope.row.status == 2" class="iconfont iconzhongxinkaishi btn" @click="handleFileStatus(scope.row, 1)" - v-show="scope.row.status === 9" + v-show="scope.row.status === 9 || scope.row.status === -2" ></el-button> </el-tooltip> @@ -252,10 +272,11 @@ <!-- 鍒嗛〉 --> <div class="pagination"> <el-pagination + v-show="activeName=='uploaded'" @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" @@ -263,10 +284,15 @@ ></el-pagination> </div> - <!-- 鏂囦欢涓婁紶缁勪欢 --> - <!-- <file-uploader ref="uploader" v-show="activeName === 'uploading'" :attrs="attrs" /> --> - <file-uploader ref="uploader" v-show="activeName === 'uploading'" /> - + <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" + :sourceType="stack.type" + /> + </template> <!-- 鏂囦欢棰勮 --> <el-dialog title="鏌ョ湅鏂囦欢" :visible.sync="previewDialog" width="500px"> <video v-if="videoUrl" :src="videoUrl" controls style="margin-top: 12px;">鎮ㄧ殑娴忚鍣ㄤ笉鏀寔 video 鏍囩銆�</video> @@ -328,8 +354,9 @@ } }, filters: { - statusFormat (value) { + statusFormat(value) { let statusCode = { + "-2": "澶勭悊寮傚父", "-1": "宸插垹闄�", "0": "鏆傚仠澶勭悊", "1": "绛夊緟澶勭悊", @@ -338,7 +365,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]; @@ -357,7 +384,7 @@ } }, computed: { - snapshotClass () { + snapshotClass() { let classs = ["snapshot"]; if (this.form.type === 1) { classs.push("snapshot-video") @@ -371,13 +398,13 @@ return classs; }, - dirOptions () { + dirOptions() { return this.DataStackPool.dirs.filter(dir => { return dir.id !== this.DataStackPool.selectedDir.id }) } }, - data () { + data() { return { videoUrl: "", imgUrl: "", @@ -389,7 +416,8 @@ multipleSelection: [], searchInput: "", form: { - id: "" + id: "", + resolution: "" }, fileList: [], // 璁板綍娣诲姞鐘舵�� @@ -409,54 +437,37 @@ 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) { - //鏁版嵁鏍堟枃浠舵暟閲忓彉鏇� - //鏇存柊鐙珛鍦烘櫙鏁版嵁鏍堟枃浠� - console.log(this.$root.$children[0].$children[1].$refs['sepRule']); - 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', "image/jpg,image/jpeg,image/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) { this.videoUrl = "/files/" + row.identifier + ".mp4" - } else if (row.type === 2) { + // 涓烘湐榛勪娇鐢ㄦ暟鎹爤瀹氬埗, 娌℃湁MD5 + if (row.identifier == "") { + this.videoUrl = row.path.replace("/opt/vasystem", ""); + } + } else if (row.type === 2) { this.imgUrl = "/files/" + row.path.substr(row.path.lastIndexOf('/') + 1) } }, // 娓呯┖杈撳叆妗� - initFormData () { + initFormData() { this.form = { enable: false, id: "", @@ -468,15 +479,15 @@ }; }, // 娣诲姞璁惧 - 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 } @@ -488,6 +499,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; @@ -502,48 +514,53 @@ 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 () { - 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}) - if (this.multipleSelection.indexOf(row.id) !== -1) { - this.$nextTick(() => { - this.$refs.multipleTable.toggleRowSelection(row); - }) - } - }); - } - }).catch(err => { - console.log(err) - }) - + 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}) + if (this.multipleSelection.indexOf(row.id) !== -1) { + this.$nextTick(() => { + this.$refs.multipleTable.toggleRowSelection(row); + }) + } + }); + } + }).catch(err => { + console.log(err) + }) }, // 淇濆瓨 - onSubmit (formName) { + onSubmit(formName) { + if (formName == 'addForm') { + if (this.form.name.indexOf('/') >= 0) { + this.$notify({ + type: "error", + message: "淇濆瓨澶辫触,鏁版嵁鏍堝悕绉颁笉鑳藉寘鍚�'/'锛�" + }); + return; + } + } this.$refs[formName].validate(async valid => { if (valid) { saveDir(this.form).then(rsp => { @@ -564,7 +581,7 @@ }); }, // 鍒犻櫎鎽勫儚鏈� - deleteDir () { + deleteDir() { this.$confirm("鏄惁鍒犻櫎姝ゆ枃浠跺す锛�", { center: true, cancelButtonClass: "comfirm-class-cancle", @@ -593,34 +610,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) - console.log(this.$refs.uploader.$refs.button.attrs) - console.log(this.$refs.uploader.$refs.button.$refs.btn.click()) + 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 @@ -636,7 +651,7 @@ }) } }, - async handleFileStatus (row, status, multi = false) { + async handleFileStatus(row, status, multi = false) { let ids = this.multipleSelection; if (!multi) { ids = [row.id]; @@ -664,10 +679,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) { @@ -694,17 +709,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) { @@ -727,10 +742,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({ @@ -746,7 +761,7 @@ } }) }, - cellFileMove () { + cellFileMove() { moveFile({ id: this.targetFile, stackId: this.targetDir }).then(rsp => { if (rsp && rsp.success) { this.$notify({ @@ -866,19 +881,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