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 | 395 ++++++++++++++++++++++++++++++++++++++++++++------------
1 files changed, 310 insertions(+), 85 deletions(-)
diff --git a/pages/tabBar/notice/detail.vue b/pages/tabBar/notice/detail.vue
index 36f4794..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,51 +7,94 @@
<!-- 真正的导航栏内容 -->
<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>
- <text class="textTop"><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;">
- <text class="textTop" style="width: 76px;" ><b>附件内容：</b></text>
- <view class="attache">
- <view v-for="(item, index) in detailData.attachments" :key="index" >
-
- <view style="display: flex;margin-top: 10px;" @click="openFile(item)">
- <u-icon name="attach" color="#2979ff" size="20"></u-icon> {{item.attachementName}}
- </view>
-
- </view>
+ <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" v-if="detailData.role == 'leader'"><b>信息提交人：</b>{{detailData.infoSubmitter}}</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="{ height: directViewUrl ? '560px' : '' }" style="margin-top: 20px;">
+ <text class="textTop" style="width: 76px;" ><b>附件内容：</b></text>
+ <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" 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>
+ </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" 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"
style='color: red;'>待审核</text>
<text v-else-if="detailData.reviewStatus == 2" class="responseStatus"
- style='color: rgb(17, 204, 33);'>已审核通过</text>
+ style='color: rgb(17, 204, 33);'>审核通过</text>
<text v-else class="responseStatus"
style='color: rgb(153, 148, 143);'>已驳回</text>
</view>
- <view class="textTop" v-else>
+ <view class="textTop" v-else-if="detailData.role == 'infoPeople'">
+ <text ><b>审核状态：</b></text>
+ <text v-if="detailData.reviewStatus == 1" class="responseStatus"
+ style='color: red;'>待审核</text>
+ <text v-else-if="detailData.reviewStatus == 2" class="responseStatus"
+ style='color: rgb(17, 204, 33);'>审核通过</text>
+ <text v-else class="responseStatus"
+ style='color: rgb(153, 148, 143);'>已驳回</text>
+ </view>
+<!-- <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>
@@ -59,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;"
@@ -70,6 +113,16 @@
@click="reject"
>审核驳回</u-button>
</view>
+ <view v-if="detailData.role == 'infoPeople' && detailData.reviewStatus == 2" class="btn">
+ <u-button
+ style="background-color:rgb(6, 202, 23);color: white;width: 180px;"
+ @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>
@@ -77,12 +130,15 @@
<script>
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 {
// 状态栏高度
statusBarHeight: 0,
key: 1,
+ isAllImg: '',
detailData: {
id: null,
warnInfoId: null,
@@ -97,33 +153,146 @@
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;
- console.log("wwwwwwww",this.detailData)
- if(this.detailData.role == 'leader') {
+
+ 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){
this.detailData.attachments.forEach((item,index) => {
item.attachementName = this.detailData.attachment[index].attachmentName;
})
}
-
-
}
- this.detailData.disaster = test.disasterType == 1 ? '地震': test.disasterType == 2 ? '洪涝' : test.disasterType == 3 ? '气象' : test.disasterType == 4 ? '泥石流': test.disasterType == 5 ? '水旱': '森林草原火灾';
+ 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 ? '水旱': '森林草原火灾';
+ 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() {
@@ -145,24 +314,44 @@
}
})
},
+ //信息发布
+ infoSend() {
+ publishInfo({id: this.detailData.id}).then(res => {
+ if(res.code==100) {
+ this.goBack();
+ }
+ })
+ 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)
- if(item.role == 'leader'){
- fileUrl = VUE_APP_BASE_URL + item.attachment;
- console.log("url",fileUrl)
- }else {
- fileUrl = VUE_APP_BASE_URL + item.attachement;
- console.log("url",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: encodeURI('http://192.168.0.38:8086/uploadtest/2023/naturalDisaster/Warninginfo/0620/abc051b6ee66402d98e7b27216662d17.pdf'),
- header: {
- 'Content-type': 'application/json',
- 'tk':uni.getStorageSync('tk'),
- 'uid': uni.getStorageSync('uid')
- },
+ url: fileUrl,
+ header: {},
success:function(res){
console.log("下载res",res);
var filePath = res.tempFilePath;
@@ -170,49 +359,52 @@
const eidx = filePath.lastIndexOf(')');
// 用于处理文档打开问题(ps：第一次打开 第二次无法打开问题)
if (sidx > -1 && eidx > -1) {
- const restr = filePath.substr(sidx, eidx - sidx + 1);
- filePath = filePath.replace(restr, '');
+ const restr = filePath.substr(sidx, eidx - sidx + 1);
+ filePath = filePath.replace(restr, '');
}
// plus.runtime.openFile(filePath)
uni.openDocument({
- filePath: escape(filePath),
- success:function(){
- console.log('成功')
- },
- fail:function(){
- uni.showToast({
- icon: 'none',
- title: '暂不支持此类型',
- duration: 2000
- })
- }
- })
- }
- })
- }
+ filePath: filePath,
+ success:function(){
+ console.log('成功')
+ },
+ fail:function(){
+ uni.showToast({
+ icon: 'none',
+ title: '暂不支持此类型',
+ duration: 2000
+ })
+ }
+ })
+ }
+ })
+ }
}
}
</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;
@@ -230,6 +422,11 @@
display: flex;
flex-direction: column;
}
+.attache_img {
+ flex: 1;
+ display: flex;
+ flex-wrap: wrap;
+}
.responseStatus{
padding:5px;
color:#2a2a2a;
@@ -241,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;
@@ -248,4 +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