From 6f89c68df4326cb8b4e28859c426b764a666426d Mon Sep 17 00:00:00 2001 From: zhouwenxuan <1175765986@qq.com> Date: 星期三, 19 七月 2023 10:33:29 +0800 Subject: [PATCH] 文件预览 --- pages/tabBar/notice/detail.vue | 62 ++++++++++++++++++++++++++++--- 1 files changed, 56 insertions(+), 6 deletions(-) diff --git a/pages/tabBar/notice/detail.vue b/pages/tabBar/notice/detail.vue index 4b4ffe8..2cda4c5 100644 --- a/pages/tabBar/notice/detail.vue +++ b/pages/tabBar/notice/detail.vue @@ -31,17 +31,28 @@ <text class="textTop"><b>短信内容:</b><i style="background-color: rgb(240, 248, 255);">{{detailData.content}}发布单位:{{detailData.publishingUnit}}</i></text> <view style="display: flex;"> <text class="textTop" style="width: 76px;" ><b>附件内容:</b></text> - <view class="attache"> + <view class="attache" v-if="isAllImg == 'no'"> <view v-for="(item, index) in detailData.attachments" :key="index" > - - <view style="display: flex;margin-top: 10px;" @click="openFile(item)"> + <view style="display: flex;margin-top: 10px;" v-if="item.suffix == 'jpg'|| item.suffix =='jpeg' || item.suffix =='png'"> + <image @click="previewSqs(item)" :src="item.attachment" style="width: 100rpx; height: 100rpx;margin-left: 5rpx;border: 3px solid #ccc;margin-right: 3px;"></image> + </view> + <view style="display: flex;margin-top: 10px;" @click="openFile(item)" v-else> <u-icon name="attach" color="#2979ff" size="20"></u-icon> {{item.attachementName}} </view> - + </view> + </view> + <view class="attache_img" v-else> + <view v-for="(item, index) in detailData.attachments" :key="index" > + <view style="display: flex;margin-top: 10px;" v-if="item.suffix == 'jpg'|| item.suffix =='jpeg' || item.suffix =='png'"> + <image @click="previewSqs(item,index)" :src="item.attachment" style="width: 100rpx; height: 100rpx;margin-left: 5rpx;border: 3px solid #ccc;margin-right: 3px;"></image> + </view> + <view style="display: flex;margin-top: 10px;" @click="openFile(item)" v-else> + <u-icon name="attach" color="#2979ff" size="20"></u-icon> {{item.attachementName}} + </view> </view> </view> </view> - <text class="textTop" v-if="detailData.role == 'leader'"><b>信息提交人:</b>{{detailData.infoSubmitter}}</text> + <text class="textTop" v-if="detailData.role == 'leader'"><b>信息提交人:</b>{{detailData.infoSubmitterRealName}}</text> <view class="textTop" v-if="detailData.role == 'leader'"> <text ><b>审核状态:</b></text> <text v-if="detailData.reviewStatus == 1" class="responseStatus" @@ -99,6 +110,7 @@ // 状态栏高度 statusBarHeight: 0, key: 1, + isAllImg: '', detailData: { id: null, warnInfoId: null, @@ -121,7 +133,7 @@ this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; let test = options.data && JSON.parse(decodeURIComponent(options.data)); this.detailData = test; - console.log("wwwwwwww",this.detailData) + if(this.detailData.role == 'leader' || this.detailData.role == 'infoPeople' ) { this.detailData.attachments = this.detailData.attachment; if (this.detailData.attachments){ @@ -130,6 +142,23 @@ }) } } + if (this.detailData.attachments){ + this.detailData.attachments.forEach((item,index) => { + item.suffix = item.attachementName.substring(item.attachementName.lastIndexOf(".") + 1); + if(item.suffix == 'jpg'|| item.suffix =='jpeg' || item.suffix =='png' ){ + if(this.detailData.role == 'leader' || this.detailData.role == 'infoPeople' ){ + item.attachment = VUE_APP_BASE_URL + item.attachment; + }else { + item.attachment = VUE_APP_BASE_URL + item.attachement; + } + + }else { + this.isAllImg = 'no'; + } + }) + } + console.log("this.isAllImg",this.isAllImg) + console.log("detailData",this.detailData) this.detailData.disaster = test.disasterType == 1 ? '地震': test.disasterType == 2 ? '洪涝' : test.disasterType == 3 ? '气象' : test.disasterType == 4 ? '泥石流': test.disasterType == 5 ? '水旱': '森林草原火灾'; }, methods: { @@ -168,6 +197,22 @@ }) console.log("信息发布") }, + //预览图片 + previewSqs(item,index) { + + let imgs = []; + for (let i = 0; i < this.detailData.attachments.length; i++) { + imgs.push(this.detailData.attachments[i].attachment) + } + console.log("预览",imgs) + uni.previewImage({ + urls: imgs, + current: index, + indicator: 'number', + loop: true + }) + }, + //预览文件 openFile(item) { let fileUrl = ''; console.log("iiii",item) @@ -247,6 +292,11 @@ display: flex; flex-direction: column; } +.attache_img { + flex: 1; + display: flex; + flex-wrap: wrap; +} .responseStatus{ padding:5px; color:#2a2a2a; -- Gitblit v1.9.2