From 3f34d376d35e0fefa3432b0203417a6f90ed3444 Mon Sep 17 00:00:00 2001
From: 13404089107 <puwei@sinata.cn>
Date: 星期二, 25 二月 2025 09:00:17 +0800
Subject: [PATCH] Merge branch 'master' of http://120.76.84.145:10101/gitblit/r/H5/threeSide
---
H5/pages/progress/progress.vue | 433 +++++++++++++++++++++++++++++------------------------
1 files changed, 235 insertions(+), 198 deletions(-)
diff --git a/H5/pages/progress/progress.vue b/H5/pages/progress/progress.vue
index f05de26..6c0edb0 100644
--- a/H5/pages/progress/progress.vue
+++ b/H5/pages/progress/progress.vue
@@ -1,33 +1,35 @@
<template>
- <view class="px-31 pt-38">
- <view class="br-19 bs-1 pt-21 pb-35 px-27 bgcolor2">
+ <view v-if="Object.keys(info) != 0" class="px-31 pt-38">
+ <view v-if="type" class="br-19 bs-1 pt-21 pb-35 px-27 bgcolor2">
<view class="flex a-center j-between fs-23 lh-33 font-bold">
- <view>诉求号：7843523454</view>
- <view class="color1">正在办理</view>
+ <view>诉求号：{{ info.serialNumber }}</view>
+ <view class="color1">{{ ["正在办理", "延期办理", "超时办理", "已办结", "群众撤销", "上报待审核", "上级驳回"][info.status] }}</view>
</view>
<view class="mx-13 mt-33 pt-35 pb-33 px-27 br-19 flex a-center j-between bgcolor1">
- <view class="fs-27 lh-38 color2">江苏省常州市溧阳市牛顿大道172号</view>
+ <view class="fs-27 lh-38 color2">{{ info.detailedAddress }}</view>
<image src="@/static/detailImg/dwei.png" class="w-31 h-31 shrink0" />
</view>
<view class="flex a-center j-between mt-31 mx-13">
<view class="flex-column a-center">
<view class="fs-27 lh-38 font-bold">问题类型</view>
- <view class="mt-8 fs-23 lh-42 txt-center px-31 font-w400 color3 bgcolor3 border1">教育</view>
+ <view class="mt-8 fs-23 lh-42 txt-center px-31 font-w400 color3 bgcolor3 border1">
+ {{ info.problemType }}
+ </view>
</view>
<view class="flex-column a-center">
<view class="fs-27 lh-38 font-bold">群众</view>
- <view class="fs-27 lh-38 mt-10">沙振</view>
+ <view class="fs-27 lh-38 mt-10">{{ info.name }}</view>
</view>
<view class="flex-column a-center">
<view class="fs-27 lh-38 font-bold">联系电话</view>
- <view class="fs-27 lh-38 mt-10">14225874426</view>
+ <view class="fs-27 lh-38 mt-10">{{ info.contactNumber }}</view>
</view>
</view>
</view>
- <view class="progress">
+ <view v-if="info.complaintProgresses.length != 0" class="progress">
<view class="proCard">
- <view class="proItem" v-for="(item,index) in 3" :key="index">
+ <view class="proItem" v-for="(item, index) in info.complaintProgresses" :key="item.id">
<view class="mr-31 flex flex-column a-center">
<view class="dot">
<view class="box"></view>
@@ -35,231 +37,266 @@
<view class="proLine">
</view>
</view>
- <view>
+ <view class="flex1">
<view class="flex a-center j-between mb-10">
- <view class="name">李雷</view>
- <view class="time">2024年9月29日11:09:09</view>
+ <view class="name">{{ item.createByName }}</view>
+ <view class="time">{{ item.createTime }}</view>
</view>
- <view class="context">处理进度说明处理进度说明处理进度说明处理进
- 度说明处理进度说明处理进度说明处理进度说明处理进度说明</view>
+ <view class="context">{{ item.describe }}</view>
<view class="proImg">
- <view class="imgOrVedio" v-for="(item,index) in 4" :key="index">
- <image
- src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
- class="img shrink0" mode="aspectFill">
- </image>
- <view class="openVideo" v-if="item==4">
+ <view class="imgOrVedio" v-for="(item, index) in item.imgUrl.split(',')" :key="index">
+ <image :src="item" class="img shrink0" mode="aspectFill" />
+ <view
+ class="absolute mt-19 w-140 h-140 bgcolor5 top0 left0 br-8 flex a-center j-center">
+ <image @tap="viewImage(item)" src="@/static/Appeal/amplify.png" class="w-19 h-19" />
+ </view>
+ </view>
+ <view class="imgOrVedio" v-for="(item, index) in item.video.split(',')" :key="index">
+ <video id="myVideo" class="w-140 h-140 mt-19 shrink0" disabled :controls="false"
+ :show-center-play-btn="false" :src="item" />
+ <view class="videoOpen" @click.stop="openVideo(item)">
<image src="../../static/detailImg/open.png" class="video shrink0"
mode="aspectFill">
</image>
</view>
-
</view>
</view>
</view>
</view>
</view>
</view>
- <view @tap="toAdd" class="mt-38 fs-35 lh-96 br-48 txt-center font-bold bgcolor6 color4">添加办理进度</view>
+ <view v-if="type" @tap="toAdd" class="mt-38 fs-35 lh-96 br-48 txt-center font-bold bgcolor6 color4">添加办理进度
+ </view>
<view class="safe-box"></view>
</view>
</template>
<script>
- import {
- getList,
- getComplaintDetail
- } from './service'
- export default {
- data() {
- return {
- id: ''
- }
- },
- onLoad(params) {
- this.id = params.id
- getList({
- "pageNum": 1,
- "pageSize": 10
- }).then(res => {
-
+import {
+ getComplaintDetail
+} from './service'
+export default {
+ data() {
+ return {
+ id: '',
+ info: {},
+ type: true,
+ }
+ },
+ onLoad(params) {
+ this.id = params.id
+ if (params.type) {
+ this.type = false
+ uni.setNavigationBarTitle({
+ title: '办理进度'
+ })
+ }
+ getComplaintDetail({
+ id: params.id
+ }).then(res => {
+ this.info = res.data
+ })
+ },
+ methods: {
+ toAdd() {
+ uni.navigateTo({
+ url: `/pages/add-progress/index?id=${this.id}`
})
},
- methods: {
- toAdd() {
- uni.navigateTo({
- url: `/pages/add-progress/index`
- })
- }
- }
+ viewImage(item) {
+ uni.previewImage({
+ urls: [item]
+ })
+ },
+ // 去大屏播放视频
+ openVideo(url) {
+ uni.navigateTo({
+ url: `/pages/work-detail/maxVideo?url=${url}`
+ })
+ },
}
+}
</script>
<style scoped lang="scss">
- .bs-1 {
- box-shadow: 0rpx 0rpx 27rpx 0rpx rgba(0, 0, 0, 0.1);
+.bs-1 {
+ box-shadow: 0rpx 0rpx 27rpx 0rpx rgba(0, 0, 0, 0.1);
+}
+
+.color1 {
+ color: #FF4948;
+}
+
+.color2 {
+ color: rgba(0, 0, 0, .8);
+}
+
+.color3 {
+ color: #FAAD14;
+}
+
+.color4 {
+ color: #FFFFFF;
+}
+
+.bgcolor1 {
+ background: linear-gradient(270deg, rgba(255, 241, 0, 0.5) 0%, rgba(255, 249, 172, 0.25) 48%, rgba(255, 255, 255, 0.2) 100%, #FFFFFF 100%);
+}
+
+.bgcolor2 {
+ background: linear-gradient(180deg, #FFDCDB 0%, rgba(255, 255, 255, 0) 25%);
+}
+
+.bgcolor3 {
+ background: #FFFBE6;
+}
+
+.bgcolor4 {
+ background: #F8F8F8;
+}
+
+.bgcolor5 {
+ background: rgba(0, 0, 0, .23);
+}
+
+.bgcolor6 {
+ background: linear-gradient(270deg, #FC8D55 0%, #FF4948 100%);
+}
+
+.border1 {
+ border: 2rpx solid #FFF1B8;
+}
+
+.border2 {
+ border: 2rpx solid #F8F8F8;
+}
+
+.safe-box {
+ height: env(safe-area-inset-bottom);
+}
+
+.progress {
+ border-radius: 27rpx;
+ margin-top: 38.46rpx;
+ background: #FFFFFF;
+ box-shadow: 0rpx 0rpx 27rpx 0rpx rgba(0, 0, 0, 0.1);
+ padding: 34rpx 31rpx;
+
+ .title {
+ font-weight: 600;
+ font-size: 27rpx;
+ color: rgba(0, 0, 0, 0.88);
+ line-height: 38rpx;
+ text-shadow: 0px 0px 27px rgba(0, 0, 0, 0.1);
+ margin-bottom: 48rpx;
}
- .color1 {
- color: #FF4948;
- }
+ .proCard {
+ .proItem {
+ display: flex;
+ padding-bottom: 38rpx;
- .color2 {
- color: rgba(0, 0, 0, .8);
- }
-
- .color3 {
- color: #FAAD14;
- }
-
- .color4 {
- color: #FFFFFF;
- }
-
- .bgcolor1 {
- background: linear-gradient(270deg, rgba(255, 241, 0, 0.5) 0%, rgba(255, 249, 172, 0.25) 48%, rgba(255, 255, 255, 0.2) 100%, #FFFFFF 100%);
- }
-
- .bgcolor2 {
- background: linear-gradient(180deg, #FFDCDB 0%, rgba(255, 255, 255, 0) 25%);
- }
-
- .bgcolor3 {
- background: #FFFBE6;
- }
-
- .bgcolor4 {
- background: #F8F8F8;
- }
-
- .bgcolor5 {
- background: rgba(0, 0, 0, .23);
- }
-
- .bgcolor6 {
- background: linear-gradient(270deg, #FC8D55 0%, #FF4948 100%);
- }
-
- .border1 {
- border: 2rpx solid #FFF1B8;
- }
-
- .border2 {
- border: 2rpx solid #F8F8F8;
- }
-
- .safe-box {
- height: env(safe-area-inset-bottom);
- }
-
- .progress {
- border-radius: 27rpx;
- margin-top: 38.46rpx;
- background: #FFFFFF;
- box-shadow: 0rpx 0rpx 27rpx 0rpx rgba(0, 0, 0, 0.1);
- padding: 34rpx 31rpx;
-
- .title {
- font-weight: 600;
- font-size: 27rpx;
- color: rgba(0, 0, 0, 0.88);
- line-height: 38rpx;
- text-shadow: 0px 0px 27px rgba(0, 0, 0, 0.1);
- margin-bottom: 48rpx;
- }
-
- .proCard {
- .proItem {
+ .dot {
+ width: 19rpx;
+ height: 19rpx;
+ background: linear-gradient(180deg, #FD8D3C 0%, #FA541C 100%);
+ box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(252, 141, 85, 0.4);
+ border-radius: 50%;
+ margin: 10rpx 0;
display: flex;
- padding-bottom: 38rpx;
+ align-items: center;
+ justify-content: center;
- .dot {
- width: 19rpx;
- height: 19rpx;
- background: linear-gradient(180deg, #FD8D3C 0%, #FA541C 100%);
- box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(252, 141, 85, 0.4);
+ .box {
+ width: 7rpx;
+ height: 7rpx;
+ background-color: #fff;
border-radius: 50%;
- margin: 10rpx 0;
+ }
+ }
+
+ .proLine {
+ flex: 1;
+ width: 4rpx;
+ background: rgba(0, 0, 0, 0.06);
+ border-radius: 3rpx;
+ }
+
+
+ .name {
+ font-weight: 400;
+ font-size: 27rpx;
+ color: rgba(0, 0, 0, 0.8);
+ line-height: 38rpx;
+ }
+
+ .time {
+ font-weight: 400;
+ font-size: 23rpx;
+ color: rgba(0, 0, 0, 0.4);
+ line-height: 33rpx;
+ }
+
+ .context {
+ font-size: 27rpx;
+ color: rgba(0, 0, 0, 0.8);
+ line-height: 38rpx;
+ }
+
+ .proImg {
+ display: flex;
+ flex-wrap: wrap;
+
+ .imgOrVedio {
+ margin-right: 17rpx;
+ position: relative;
+
+ .img {
+ width: 140rpx;
+ height: 140rpx;
+ border-radius: 8rpx;
+ margin-top: 19rpx;
+ }
+ }
+
+ .videoOpen {
+ position: absolute;
+ top: 10rpx;
+ left: 0;
+ z-index: 99;
+ width: 140rpx;
+ height: 140rpx;
+ border-radius: 8rpx;
display: flex;
align-items: center;
justify-content: center;
+ margin-top: 19rpx;
- .box {
- width: 7rpx;
- height: 7rpx;
- background-color: #fff;
- border-radius: 50%;
+ .video {
+ z-index: 999;
+ width: 140rpx;
+ height: 140rpx;
}
- }
-
- .proLine {
- flex: 1;
- width: 4rpx;
- background: rgba(0, 0, 0, 0.06);
- border-radius: 3rpx;
- }
-
-
- .name {
- font-weight: 400;
- font-size: 27rpx;
- color: rgba(0, 0, 0, 0.8);
- line-height: 38rpx;
- }
-
- .time {
- font-weight: 400;
- font-size: 23rpx;
- color: rgba(0, 0, 0, 0.4);
- line-height: 33rpx;
- }
-
- .context {
- font-size: 27rpx;
- color: rgba(0, 0, 0, 0.8);
- line-height: 38rpx;
- }
-
- .proImg {
- display: flex;
- flex-wrap: wrap;
-
- .imgOrVedio {
- margin-right: 17rpx;
- position: relative;
-
- .img {
- width: 140rpx;
- height: 140rpx;
- border-radius: 8rpx;
- margin-top: 19rpx;
- }
-
- .openVideo {
- position: absolute;
- top: 19rpx;
- left: 0;
- width: 140rpx;
- height: 140rpx;
- border-radius: 8rpx;
- display: flex;
- align-items: center;
- justify-content: center;
-
- .video {
- width: 140rpx;
- height: 140rpx;
- }
- }
- }
- }
- }
-
- .proItem:last-child {
- .proLine {
- display: none;
}
}
}
+
+ .proItem:last-child {
+ .proLine {
+ display: none;
+ }
+ }
}
+}
+
+.videoImg {
+ width: 140.38rpx;
+ height: 140.38rpx;
+ border-radius: 7.69rpx;
+ position: relative;
+}
+
+#myVideo {
+ z-index: 1;
+}
</style>
\ No newline at end of file
--
Gitblit v1.7.1