From 76e9bb6df786f5d63b3ece31958bd989b3e6a9db Mon Sep 17 00:00:00 2001
From: Administrator <admin>
Date: Mon, 29 Mar 2021 09:36:20 +0800
Subject: [PATCH] 违禁品包裹图片预览优化
---
src/views/parcel/parcel.vue | 29 ++++++++++++++++++-----------
1 files changed, 18 insertions(+), 11 deletions(-)
diff --git a/src/views/parcel/parcel.vue b/src/views/parcel/parcel.vue
index 8d64188..6d30f8a 100644
--- a/src/views/parcel/parcel.vue
+++ b/src/views/parcel/parcel.vue
@@ -33,17 +33,14 @@
</template>
</avue-crud>
- <el-dialog
- :visible.sync="dialogTableVisible"
- :append-to-body="true"
- :close-on-click-modal="false"
- @opened="parcelConversation = true"
- @close="(parcelConversation = false), (oldParcelSatart = false)" >
+ <template>
<div>
- <el-image :src="'data:image/png;base64,'+imgUrl" :preview-src-list="'data:image/png;base64,'+imgUrl">
- </el-image>
+ <el-image-viewer
+ v-if="showViewer"
+ :on-close="closeViewer"
+ :url-list="['data:image/png;base64,'+imgUrl]" />
</div>
- </el-dialog>
+ </template>
</basic-container>
</template>
@@ -51,12 +48,16 @@
<script>
import {getList, getDetail, getParcelPic} from "@/api/parcel/parcel";
import {mapGetters} from "vuex";
+ import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
export default {
+ name:'index',
+ components: { ElImageViewer },
data() {
return {
form: {},
query: {},
+ showViewer: false, // 显示查看器
imgUrl:'',
loading: true,
dialogTableVisible: false,
@@ -309,10 +310,16 @@
});
},
handleParcelPic(row) {
+ var that=this;
getParcelPic(row.imgUrl).then(res => {
- this.imgUrl = res.data.data.imgBase64;
+ that.imgUrl = res.data.data.imgBase64;
+ //that.$refs.preview.clickHandler();
+ this.showViewer = true
});
- this.dialogTableVisible=true;
+ },
+ // 关闭查看器
+ closeViewer() {
+ this.showViewer = false
}
}
};
--
Gitblit v1.9.3