From bb228ead0110a8626a0d0bceeea74522ff1a0a8f Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期四, 24 九月 2020 10:25:07 +0800 Subject: [PATCH] 数据栈独立场景显示文件底图 --- src/pages/cameraAccess/components/DataStackInfo.vue | 35 ++++++++++++++++++++++++++++++----- 1 files changed, 30 insertions(+), 5 deletions(-) diff --git a/src/pages/cameraAccess/components/DataStackInfo.vue b/src/pages/cameraAccess/components/DataStackInfo.vue index fe622ac..a2ce20f 100644 --- a/src/pages/cameraAccess/components/DataStackInfo.vue +++ b/src/pages/cameraAccess/components/DataStackInfo.vue @@ -105,7 +105,7 @@ </el-tooltip> <!-- 鏂囦欢涓婁紶 --> - <el-button type="primary" size="small" @click="handleUpload"> + <el-button type="primary" size="small" :disabled="!DataStackPool.selectedDir.id" @click="handleUpload"> 涓婁紶 <i class="el-icon-upload el-icon--right"></i> </el-button> @@ -129,10 +129,20 @@ <template slot-scope="{row}"> <div :class="snapshotClass"> <el-image - v-show="row.snapshot_url !== ''" + v-if="row.type==1" style="width: 30x; height: 30px" :src="'/httpImage/' + row.snapshot_url" fit="fill" + :preview-src-list="['/httpImage/' + row.snapshot_url]" + > + <div slot="error" :class="snapshotClass"></div> + </el-image> + <el-image + v-if="row.type==2" + style="width: 30x; height: 30px" + :src="`/files/${row.identifier}.jpg`" + fit="fill" + :preview-src-list="[`/files/${row.identifier}.jpg`]" > <div slot="error" :class="snapshotClass"></div> </el-image> @@ -254,7 +264,8 @@ <!-- 鏂囦欢棰勮 --> <el-dialog title="鏌ョ湅鏂囦欢" :visible.sync="previewDialog" width="500px"> - <video :src="videoUrl" controls style="margin-top: 12px;">鎮ㄧ殑娴忚鍣ㄤ笉鏀寔 video 鏍囩銆�</video> + <video v-if="videoUrl" :src="videoUrl" controls style="margin-top: 12px;">鎮ㄧ殑娴忚鍣ㄤ笉鏀寔 video 鏍囩銆�</video> + <el-image v-if="imgUrl" :src="imgUrl"></el-image> </el-dialog> <el-dialog title="绉诲姩/澶嶅埗" :visible.sync="fileDialog" width="500px"> @@ -364,6 +375,7 @@ data() { return { videoUrl: "", + imgUrl: "", previewDialog: false, fileDialog: false, isDisabled: true, @@ -403,9 +415,13 @@ }, methods: { preview(row) { - if (this.form.type === 1) { - this.previewDialog = true; + this.previewDialog = true; + if (row.type === 1) { + this.videoUrl = "/files/" + row.identifier + ".mp4" + }else if(row.type===2){ + + this.imgUrl = "/files/" + row.identifier + ".jpg" } }, // 娓呯┖杈撳叆妗� @@ -429,6 +445,7 @@ this.fileList = []; }, selectDir(node) { + debugger if (node.id === "") { return } @@ -451,6 +468,8 @@ this.total = 0; this.multipleSelection = []; // 娓呯┖閫変腑鐘舵�� this.initFetchListTask(); + this.videoUrl = ''; + this.imgUrl = ''; }, initFetchListTask() { const uid = Math.round(Math.random() * 1000); @@ -477,6 +496,7 @@ // 瀹氭椂鍒锋柊浼氭竻绌洪�変腑鐘舵�侊紝鍦ㄨ繖閲屾仮澶� 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); @@ -553,6 +573,7 @@ this.multipleSelection = []; }, handleUpload() { + console.log(this.DataStackPool.selectedDir.id) console.log(this.$refs.uploader.$refs.button.$refs.btn.click()) }, handleRefrashFileList(val) { @@ -719,6 +740,10 @@ .el-form-item__label { text-align: left; } + .el-button--primary.is-disabled{ + background-color: #9eb4f0 !important; + border-color: #9eb4f0 !important; + } .label { color: #606266; font-size: 14px; -- Gitblit v1.8.0