From f5d67b69142c78be1ee996f53b6bb8e4c954761c Mon Sep 17 00:00:00 2001 From: zhouwenxuan <1175765986@qq.com> Date: 星期三, 15 十一月 2023 10:06:38 +0800 Subject: [PATCH] 页面跳转修改 --- pages/tabBar/notice/detail.vue | 261 +++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 209 insertions(+), 52 deletions(-) diff --git a/pages/tabBar/notice/detail.vue b/pages/tabBar/notice/detail.vue index 2cda4c5..83bc644 100644 --- a/pages/tabBar/notice/detail.vue +++ b/pages/tabBar/notice/detail.vue @@ -1,5 +1,5 @@ <template> - <view> + <view style="display: flex;flex-direction: column;height: 100%;"> <!-- 自定义导航栏 --> <view class="navBarBox"> <!-- 状态栏占位 --> @@ -7,41 +7,53 @@ <!-- 真正的导航栏内容 --> <view style="display: flex; flex-direction: column;"> <view class="navBar"> - <u-icon name="arrow-left" color="black" size="17" @click="goBack" /> + <u-icon name="arrow-left" color="black" size="17" style="margin-left: 8px;" @click="goBack" /> <view class="barText">信息详情</view> +<!-- <view > + <u-button type="text" @click="loginOut" style="color: blue;margin-right: 5px;">退出</u-button> + </view> --> </view> - - <view class="divider"></view> </view> </view> <!-- 页面内容 --> - <view style="padding: 10px 15px;display: flex;flex-direction: column;"> + <view class="detailCard" > <text style="font-size: 18px;"><b>标题:</b>{{detailData.title}}</text> - <text class="textTop"><b>类别:</b>{{detailData.disaster}}</text> - <view style="display: flex;align-items: center;" class="textTop"> - <text><b>级别:</b></text> - <u-tag - :color="detailData.warningLevel === 3 ? 'rgb(255, 244, 88)' :detailData.warningLevel === 2 ? 'orange':detailData.warningLevel === 1 ?'red':'blue'" - :text="detailData.warningLevel === 3 ? '黄色' : detailData.warningLevel === 2 ? '橙色': detailData.warningLevel === 1 ?'红色':'蓝色'" - :bg-color="detailData.warningLevel === 3 ? 'rgb(254, 255, 230)' :detailData.warningLevel === 2 ? 'rgb(255, 210, 179)':detailData.warningLevel === 1 ?'rgb(255, 128, 128)':'rgb(121, 150, 255)'" - border-color="white"> - </u-tag> + <view class="levelDisaster"> + <text class="textTop"><b>类别:</b>{{detailData.disaster}}</text> + <view style="display: flex;align-items: center;margin-left: 10%" class="textTop"> + <text><b>级别:</b></text> + <u-tag + :color="detailData.warningLevel === 3 ? 'rgb(211, 211, 0)' :detailData.warningLevel === 2 ? 'orange':detailData.warningLevel === 1 ?'red':'blue'" + :text="detailData.warningLevel === 3 ? '黄色' : detailData.warningLevel === 2 ? '橙色': detailData.warningLevel === 1 ?'红色':'蓝色'" + :bg-color="detailData.warningLevel === 3 ? 'rgb(254, 255, 230)' :detailData.warningLevel === 2 ? 'rgb(255, 210, 179)':detailData.warningLevel === 1 ?'rgb(255, 128, 128)':'rgb(121, 150, 255)'" + border-color="white"> + </u-tag> + </view> </view> - <text class="textTop"><b>发布单位:</b>{{detailData.publishingUnit}}</text> + <text class="textTop" v-if="detailData.forwardPath" style="display: flex;"><b>发布单位:</b> + <text v-for="(item,index) in detailData.forwardPath"> + <text v-if="index !=detailData.forwardPath.length-1"> + {{item}}> + </text> + <text v-else>{{item}}</text> + </text> + </text> + <text class="textTop" v-else><b>发布单位:</b>{{detailData.publishingUnit}}</text> <text class="textTop"><b>短信内容:</b><i style="background-color: rgb(240, 248, 255);">{{detailData.content}}发布单位:{{detailData.publishingUnit}}</i></text> - <view style="display: flex;"> + <view :style="{ height: directViewUrl ? '560px' : '' }" style="margin-top: 20px;"> <text class="textTop" style="width: 76px;" ><b>附件内容:</b></text> - <view class="attache" v-if="isAllImg == 'no'"> - <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)" :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 style="width: 100%; height: 550px;" v-if="directViewUrl"> + <iframe :src="directViewUrl" class="frameStyle"></iframe> + </view> + <view style="width: 100%; height: 550px;" v-if="urls.length > 0"> + <view v-for="(item, index) in urls" :key="index" > + <view style="display: flex;margin-top: 10px;" @click="openFile(item)" > + <u-icon name="attach" color="#2979ff" size="20"></u-icon> <span>{{item.name}}</span> + </view> </view> </view> - <view class="attache_img" v-else> + +<!-- <view class="attache" v-if="isAllImg == 'no'"> <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> @@ -51,8 +63,19 @@ </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.infoSubmitterRealName}}</text> + <text class="textTop" style="margin-top: 30px;" 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" @@ -71,7 +94,7 @@ <text v-else class="responseStatus" style='color: rgb(153, 148, 143);'>已驳回</text> </view> - <view class="textTop" v-else> +<!-- <view class="textTop" v-else> <text ><b>响应状态:</b></text> <text v-if="detailData.responseStatus == 1" class="responseStatus" style='background-color:rgb(247, 108, 125);color: white;'>待叫应</text> @@ -79,7 +102,7 @@ style='background-color:limegreen'>已叫应</text> <text v-else class="responseStatus" style='background-color:rgb(247, 108, 125); color: white;'>超时未叫应</text> - </view> + </view> --> <view v-if="detailData.role == 'leader' && detailData.reviewStatus == 1" class="btn"> <u-button style="background-color:rgb(6, 202, 23);color: white;width: 180px;" @@ -96,6 +119,10 @@ @click="infoSend" >确认发布</u-button> </view> + <!-- //村级显示 --> + </view> + <view class="measures" v-if="unitType == 4"> + <u-button class="resBtn" type="primary" @click="goMeasures" v-if="role == '工作人员'">{{cityMessage}}</u-button> </view> </view> </template> @@ -104,6 +131,7 @@ import VUE_APP_BASE_URL from '../../../common/constant.js' import { submit } from '../../../api/examine.js' import { publishInfo } from '../../../api/information.js' + import { getMeasureDetail } from '../../../api/notice.js' export default { data() { return { @@ -125,15 +153,56 @@ submitData: { id: null, reviewStatus: null - } + }, + role: '', + unitType: '', + directViewUrl: '', + cityMessage: '响应措施反馈', + measureData: {}, + urls: [], + backFlag: '' } }, onLoad:function(options){ + // #ifdef APP-PLUS + const currentWebview = this.$scope.$getAppWebview();//获取当前web-view 此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里vue页面直接使用plus.webview.currentWebview()无效 + setTimeout(function() { + const wv = currentWebview.children()[0]; + console.log(wv); + wv.setStyle({//设置web-view距离顶部的距离以及自己的高度,单位为px + top: 68, + height:300 + }) + }, 1000);//如页面初始化调用需要写延迟 + // #endif + this.role = uni.getStorageSync('roleName'); //获取手机状态栏高度 this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; let test = options.data && JSON.parse(decodeURIComponent(options.data)); this.detailData = test; + this.directViewUrl = this.detailData.directViewUrl; + if(this.detailData.attachments && this.detailData.attachments.length >0){ + this.urls = this.detailData.attachments.map(item => { + return { + url: VUE_APP_BASE_URL + item.attachement, + name: item.attachementName + } + }) + }else if(this.detailData.attachment && this.detailData.attachment.length >0){ + this.urls = this.detailData.attachment.map(item => { + return { + url: VUE_APP_BASE_URL + item.attachment, + name: item.attachmentName + } + }) + } + console.log("urls",this.urls) + + + + // this.directViewUrl = 'https://huaban.com/' + this.unitType = uni.getStorageSync('unittype'); if(this.detailData.role == 'leader' || this.detailData.role == 'infoPeople' ) { this.detailData.attachments = this.detailData.attachment; if (this.detailData.attachments){ @@ -159,14 +228,71 @@ } 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 ? '水旱': '森林草原火灾'; + this.detailData.disaster = test.disasterType == 1 ? '地震': test.disasterType == 2 ? '洪涝' : test.disasterType == 3 ? '气象' : test.disasterType == 4 ? '地质灾害': test.disasterType == 5 ? '水旱': '森林草原火灾'; + if(this.unitType == 4 && this.role == '工作人员'){ + this.getMeasures(); + } + // this.backFlag = uni.getStorageSync('backFlag') + // console.log(this.backFlag,'1111') }, methods: { goBack() { - console.log("1111") - uni.navigateBack({ - url:'./notice/notice' - }); + console.log(uni.getStorageSync('backFlag'),'1111') + if(uni.getStorageSync('backFlag') == 'notice'){ + uni.switchTab({ + url: '/pages/tabBar/notice/notice' + }) + }else if (uni.getStorageSync('backFlag') == 'info') { + uni.switchTab({ + url: '/pages/tabBar/information/information' + }) + }else if (uni.getStorageSync('backFlag') == 'examine') { + uni.switchTab({ + url: '/pages/tabBar/examine/examine' + }) + }else if (uni.getStorageSync('backFlag') == 'current') { + uni.switchTab({ + url: '/pages/tabBar/current/current' + }) + }else if ( uni.getStorageSync('backFlag') == 'response'){ + uni.switchTab({ + url: '/pages/tabBar/response/response' + }) + } + }, + loginOut() { + uni.clearStorageSync(); + uni.clearStorage(); + uni.navigateTo({ + url: '/pages/index/index' + }) + }, + getMeasures(){ + getMeasureDetail({id: this.detailData.id}).then(res => { + if(res.code == 100){ + if(res.data.baseMeasures && res.data.baseMeasures.length>0 ){ + this.cityMessage = '查看措施反馈'; + this.measureData = res.data; + }else { + this.cityMessage = '响应措施反馈'; + } + }else{ + uni.$u.toast(res.msg) + } + }) + }, + goMeasures() { + if(this.cityMessage == '查看措施反馈' ){ + uni.setStorageSync('backMeasures','detail') + this.measureData.id = this.detailData.id + uni.navigateTo({ + url: `/pages/tabBar/responsivity/showMeasures?data=` + encodeURIComponent(JSON.stringify(this.measureData)) + }) + }else { + uni.navigateTo({ + url: `/pages/tabBar/notice/measures?data=` + encodeURIComponent(JSON.stringify(this.detailData)) + }) + } }, //审核通过 approved() { @@ -216,11 +342,12 @@ openFile(item) { let fileUrl = ''; console.log("iiii",item) - if(this.detailData.role == 'leader' || this.detailData.role == 'infoPeople' ){ - fileUrl = VUE_APP_BASE_URL + item.attachment; - }else { - fileUrl = VUE_APP_BASE_URL + item.attachement; - } + // if(this.detailData.role == 'leader' || this.detailData.role == 'infoPeople' ){ + // fileUrl = VUE_APP_BASE_URL + item.attachment; + // }else { + // fileUrl = VUE_APP_BASE_URL + item.attachement; + // } + fileUrl = item.url console.log("urlllllllll",fileUrl) uni.downloadFile({ url: fileUrl, @@ -256,25 +383,28 @@ } </script> -<style> +<style lang="scss" scoped> a{ text-decoration: none; } .navBarBox .navBar { - /* background-color:lightgrey; */ - height: 30px; - display: flex; - flex-direction: row; - /* justify-content: center; */ - align-items: center; -/* padding-top:5px ; */ - padding: 5px 8px; + background-color:#fff; + height: 50px; + display: flex; + flex-direction: row; + justify-content: space-around; + align-items: center; + box-shadow: 0 3px 12px rgba(0,0,0,0.05); } .barText{ - margin-left: 36%; - font-weight: 600; - font-size: 18px; - + margin-left: -20px; + flex: 1; + /* margin-left: 20px; */ + text-align: center; + width: 85%; + font-size: 16px; + /* text-align: center; */ + font-weight: 600; } .navBarBox .navBar .logo { width: 82rpx; @@ -308,6 +438,16 @@ background-color: lightgray; margin-left: 15px; } +.detailCard{ + flex-grow: 1; + display: flex; + flex-direction: column; + background: #fff; + box-shadow: 0 3px 12px rgba(0,0,0,0.05); + margin: 12px 12px 20px; + border-radius: 5px; + padding: 30px 12px; +} .btn{ margin-top: 80px; display: flex; @@ -315,5 +455,22 @@ justify-content: space-around; width: 100%; } +.measures{ + display: flex; + justify-content: flex-end; + padding: 0 12px; + margin-bottom: 20px ; + +} +.frameStyle{ + width: 100%; + height: 550px; + border: 1px solid #dddddc; + margin-top: 5px; +} +.levelDisaster{ + display: flex; + align-items: center; +} </style> -- Gitblit v1.9.2