From c6c12fba04f26d07f6107377f0c8093d780f5e92 Mon Sep 17 00:00:00 2001
From: Administrator <admin>
Date: Fri, 26 Mar 2021 17:35:40 +0800
Subject: [PATCH] 包裹图片，体温，健康码页面优化
---
src/views/parcel/parcelKind.vue | 65 ++++++++++++++++++++------------
1 files changed, 41 insertions(+), 24 deletions(-)
diff --git a/src/views/parcel/parcelKind.vue b/src/views/parcel/parcelKind.vue
index 64fc854..b3189e3 100644
--- a/src/views/parcel/parcelKind.vue
+++ b/src/views/parcel/parcelKind.vue
@@ -25,42 +25,54 @@
:size="size"
:type="type"
@click.stop="handleParcelPic(row)"
+ id="show"
>查看包裹图片
</el-button>
+
+
</template>
</avue-crud>
- <el-dialog
+ <!-- <el-dialog
:visible.sync="dialogTableVisible"
:append-to-body="true"
:close-on-click-modal="false"
@opened="parcelConversation = true"
@close="(parcelConversation = false), (oldParcelSatart = false)" >
<div>
- <el-image :src="'data:image/png;base64,'+imgUrl" :preview-src-list="'data:image/png;base64,'+imgUrl">
+ <el-image :src="'data:image/png;base64,'+imgUrl">
</el-image>
</div>
- </el-dialog>
+ </el-dialog> -->
<!-- <template>
- <div style="width: 100%; height: 100%;">
- <el-image ref="image" v-image-preview :src="'data:image/png;base64,'+imgUrl"/>
+ <div style="width: 100%; height: 100%;" id="divImage">
+ <el-image v-show="flag" ref="image" v-image-preview :src="'data:image/png;base64,'+imgUrl"/>
</div>
</template> -->
+ <template>
+ <div id="imgs">
+ <!-- <el-button v-model="show" :images="images" @change="onChange">查看包裹图片</el-button> -->
+ <el-image :src="'data:image/png;base64,'+imgUrl"/>
+ </div>
+ </template>
</basic-container>
</template>
<script>
import {getKindList, getParcelPic} from "@/api/parcel/parcel";
import {mapGetters} from "vuex";
- import VueDirectiveImagePreviewer from 'vue-directive-image-previewer';
- import 'vue-directive-image-previewer/dist/assets/style.css';
+ //import {ImagePreview} from "@/view/parcel/ImagePreview"
+ // import VueDirectiveImagePreviewer from 'vue-directive-image-previewer';
+ // import 'vue-directive-image-previewer/dist/assets/style.css';
import Vue from 'vue';
- Vue.use(VueDirectiveImagePreviewer, {
- zIndex: 9999, //层级显示
- previewSize: 3 //三倍图
- });
+ import { ImagePreview } from 'vant';
+ //Vue.use(ImagePreview);
+ // Vue.use(VueDirectiveImagePreviewer, {
+ // zIndex: 9999, //层级显示
+ // previewSize: 3 //三倍图
+ // });
export default {
data() {
@@ -68,7 +80,6 @@
form: {},
query: {},
imgUrl:'',
- isShow:true,
loading: true,
dialogTableVisible: false,
parcelConversation:false,
@@ -180,7 +191,8 @@
}
]
},
- data: []
+ data: [],
+ flag: false
};
},
computed: {
@@ -278,20 +290,25 @@
this.selectionClear();
});
},
- // handleParcelPic(row) {
- // getParcelPic(row.imgUrl).then(res => {
- // this.imgUrl = res.data.data.imgBase64;
- // });
- // setTimeout(() => {
- // //代码
- // this.$refs.image.$el.click();
- // }, 1000);
- // },
handleParcelPic(row) {
+ var that = this;
getParcelPic(row.imgUrl).then(res => {
- this.imgUrl = res.data.data.imgBase64;
+ that.imgUrl = res.data.data.imgBase64;
+ this.flag=true;
});
- this.dialogTableVisible=true;
+ // var divImage= document.getElementById("divImage");
+ // console.log(divImage,111);
+ // divImage.innerHTML=divImage.innerHTML+`<el-image ref="image" v-image-preview :src="'data:image/png;base64,'+imgUrl"/>`;
+ // console.log(divImage,111);
+ setTimeout(() => {
+ //代码
+ //that.$refs.image.$el.click();
+ var image=new ImagePreview();
+ image.Image(document.getElementById("imgs"));
+ document.getElementById("show").onclick=function(){
+ image.show(0);
+ }
+ }, 1000);
}
}
};
--
Gitblit v1.9.3