<template>
|
<view class="content">
|
<view class="bgColor2 shadow1 pb-19" style="position: sticky;top: 0;z-index: 999;">
|
<view class="h-96 flex a-center fs-27 j-between txt-center font-w400 color1">
|
<view @click="changeType(1)" class="flex1 bgColor2 relative" :class="type == 1 && 'color2 font-bold'">
|
<view class="relative zIndex1000">
|
处理记录
|
</view>
|
<view v-if="type == 1" class="bgColor1"></view>
|
</view>
|
<view @click="changeType(2)" class="flex1 bgColor2 relative" :class="type == 2 && 'color2 font-bold'">
|
<view class="relative zIndex1000">
|
问题驳回池
|
</view>
|
<view v-if="type == 2" class="bgColor1"></view>
|
</view>
|
</view>
|
<view class="flex a-center j-between mx-27 pl-38 border2">
|
<view class="flex a-center flex1">
|
<image src="../../static/search.png" mode="widthFix" class="w-31 h-31 shrink0 mr-13" />
|
<input v-model="searchParams.keyword" class="fs-27 flex1" placeholder="输入姓名、联系电话关键字搜索" />
|
</view>
|
<view @click="searchList" class="fs-23 lh-69 txt-center px-29 br-48 my-4 mx-4 bgcolor88">搜索</view>
|
</view>
|
</view>
|
<view v-if="list.length == 0 && status == 'noMore'" class="mt-200">
|
<image src="../../static/空空如也@2x.png" mode="widthFix" class="w100"></image>
|
<view class="txt-center mt-94 fs-27 color9">
|
暂无数据
|
</view>
|
</view>
|
<view v-else class="pl-31 pr-31">
|
<view class="mt-31 br-19 bgColor3 shadow2 oh pb-31" v-for="(item,index) in list" :key="item.id"
|
@click="toDetailProgress(item)">
|
<view class="pt-21 pl-27 pr-27 flex a-center j-between fs-27 font-bold">
|
<view class="">
|
诉求号：{{ item.serialNumber || '' }}
|
</view>
|
<view class="color3 flex a-center">
|
<view v-if="status == '2'"
|
class="fs-23 font-w500 flex a-center pl-10 pr-12 mr-17 bgColor7 h-50 br-8 color8">
|
<view class="w-27 h-27 color3 bgColor2 txt-center br-18 fs-20 flex a-center j-center mr-17">
|
i
|
</view>
|
已超时{{ item.overTimeDays }}天
|
</view>
|
{{ statusObj[item.status] }}
|
</view>
|
</view>
|
<view v-if="[5,6].includes(item.status)" class="mt-40 fs-23 pl-40 pr-40">
|
<view class="flex j-between a-center">
|
<view class="color4">
|
上报人：<text class="color5">{{ item.reporter || '' }}</text>
|
</view>
|
<view class="color4">
|
所属部门：<text class="color5">{{ item.departmentName || '' }}</text>
|
</view>
|
</view>
|
<view class="mt-15">
|
<view class="color4">
|
提交时间：<text class="color5">{{ item.reportTime | formatTime }}</text>
|
</view>
|
</view>
|
</view>
|
<view class="mt-27 ml-40 mr-40 br-19 bgColor4 pt-34 pb-34 fs-27 pl-27 pr-27 flex a-center j-between">
|
<text>{{ item.location || '' }}</text>
|
<image src="../../static/position@2x.png" class="w-31 h-31 ml-10 shrink0"></image>
|
</view>
|
<view class="ml-40 mr-40 mt-31 flex j-between a-center fs-27 txt-center">
|
<view class="">
|
<view class="font-bold">
|
问题类型
|
</view>
|
<view class="tip">
|
{{ item.problemType || '' }}
|
</view>
|
</view>
|
<view class="">
|
<view class="font-bold">
|
群众姓名
|
</view>
|
<view class="mt-10">
|
{{ item.name || '' }}
|
</view>
|
</view>
|
<view class="flex a-center">
|
<view style="text-align: left;">
|
<view class="font-bold">
|
联系电话
|
</view>
|
<view class="mt-10">
|
{{ item.contactNumber || '' }}
|
</view>
|
</view>
|
<image @click.stop="callPhone(item.contactNumber)" src="../../static/tell.png"
|
class="w-58 h-58 shrink0 " />
|
</view>
|
</view>
|
<view class="mt-31 border1">
|
<view class="left"></view>
|
<view class="right"></view>
|
<view v-if="type == 1">
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>添加办理进度数</view>
|
<view class="font-bold">{{item.progressCount}}</view>
|
</view>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>已下派次数</view>
|
<view class="font-bold">{{item.assignmentCount}}</view>
|
</view>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>已上报次数</view>
|
<view class="font-bold">{{item.reportCount}}</view>
|
</view>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>创建时间</view>
|
<view class="font-bold">{{ item.createTime | formatTime }}</view>
|
</view>
|
</view>
|
<view v-else>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>申请时间</view>
|
<view class="font-bold">{{ item.applyTime | formatTime }}</view>
|
</view>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>申请人</view>
|
<view class="flex a-center">
|
<view class="font-bold">{{item.reporter}} {{item.reporterPhone}}</view>
|
<image @click.stop="callPhone(item.reporterPhone)" src="../../static/tell.png"
|
class="w-58 h-58 shrink0 ml-19" />
|
</view>
|
</view>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>审批时间</view>
|
<view class="font-bold">{{ item.auditTime | formatTime }}</view>
|
</view>
|
<view class="flex a-center j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view>审批人</view>
|
<view class="flex a-center">
|
<view class="font-bold">{{item.auditorName}} {{item.auditorPhone}}</view>
|
<image @click.stop="callPhone(item.auditorPhone)" src="../../static/tell.png"
|
class="w-58 h-58 shrink0 ml-19" />
|
</view>
|
</view>
|
<view class="flex j-between lh-38 mt-29 ml-38 mr-23 fs-27">
|
<view class="shrink0">驳回理由</view>
|
<view style="max-width: 458rpx; text-align: right;font-weight: bold;">
|
{{item.rejectReason}}
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="safe-b pt-20"></view>
|
</view>
|
</template>
|
|
<script>
|
import dayjs from '@/uni_modules/uview-ui/libs/util/dayjs.js'
|
import {
|
getProcessingList,
|
getRejectList
|
} from './service.js'
|
export default {
|
data() {
|
return {
|
type: 1,
|
searchParams: {
|
pageNum: 1,
|
pageSize: 10,
|
keyword: ''
|
},
|
list: [],
|
status: 'loadMore',
|
statusObj: {
|
// 0-正在办理 1-延期办理 2-超时办理 3-已办结 4-群众撤销 5-上报待审核 6-上级驳回
|
'0': '正在办理',
|
'1': '延期办理',
|
'2': '超时办理',
|
'3': '已办结',
|
'4': '群众撤销',
|
'5': '上报待审核',
|
'6': '上级驳回',
|
'7': '延期待审核',
|
'8': '已办结'
|
},
|
}
|
},
|
onReachBottom() {
|
if (this.status == 'loadMore') {
|
this.searchParams.pageNum += 1
|
this.fetchList(this.searchParams, (e) => {
|
this.list = [...this.list, ...e.records]
|
if (this.list.length == e.total) {
|
this.status = 'noMore'
|
} else {
|
this.status = 'loadMore'
|
}
|
})
|
}
|
},
|
filters: {
|
formatTime(val) {
|
if (!val) return ''
|
return dayjs(val).format('YYYY-MM-DD HH:mm:ss')
|
}
|
},
|
onShow() {
|
this.searchParams.pageNum = 1
|
this.fetchList(this.searchParams, (e) => {
|
this.list = e.records || []
|
if (this.list.length == e.total) {
|
this.status = 'noMore'
|
} else {
|
this.status = 'loadMore'
|
}
|
})
|
},
|
methods: {
|
searchList() {
|
if (this.searchParams.keyword == '') {
|
uni.showToast({
|
title: '请输入关键字搜索',
|
icon: 'none',
|
mask: true
|
})
|
return
|
}
|
this.searchParams.pageNum = 1
|
this.fetchList(this.searchParams, (e) => {
|
this.list = e.records || []
|
if (this.list.length == e.total) {
|
this.status = 'noMore'
|
} else {
|
this.status = 'loadMore'
|
}
|
})
|
},
|
callPhone(phoneNumber) {
|
uni.makePhoneCall({
|
phoneNumber
|
});
|
},
|
toDetailProgress(item) {
|
uni.navigateTo({
|
url: `/pages/supervision/supervision-progress?id=${item.id}`
|
})
|
},
|
fetchList(params, callback) {
|
if (this.status == 'loading') return
|
this.status = 'loading';
|
[getProcessingList, getRejectList][this.type - 1](params).then(res => {
|
if (res.code == 200) {
|
callback(res.data)
|
}
|
})
|
},
|
// 切换状态筛选
|
changeType(type) {
|
this.type = type
|
this.searchParams = {
|
pageNum: 1,
|
pageSize: 10,
|
}
|
this.fetchList(this.searchParams, (e) => {
|
this.list = e.records || []
|
if (this.list.length == e.total) {
|
this.status = 'noMore'
|
} else {
|
this.status = 'loadMore'
|
}
|
})
|
},
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.border2 {
|
background: #FFFFFF;
|
border-radius: 38rpx;
|
border: 2rpx solid #DADADA;
|
}
|
|
.bgcolor88 {
|
background: linear-gradient(270deg, #FC8D55 0%, #FF4948 100%);
|
color: #fff;
|
}
|
|
.content {
|
height: 100%;
|
background-color: #f7f7f7;
|
}
|
|
.tip {
|
height: 40rpx;
|
background-color: #FFFBE6;
|
border: 2rpx solid #FFF1B8;
|
border-radius: 8rpx;
|
color: #FAAD14;
|
text-align: center;
|
line-height: 40rpx;
|
margin-top: 8rpx;
|
font-size: 23rpx;
|
padding: 0 10rpx;
|
min-width: 88rpx;
|
}
|
|
.shadow1 {
|
box-shadow: 0rpx 12rpx 15rpx 0rpx rgba(0, 0, 0, 0.1);
|
}
|
|
.shadow2 {
|
box-shadow: 0rpx 0rpx 27rpx 0rpx rgba(0, 0, 0, 0.1);
|
}
|
|
.color1 {
|
color: #4C4C4C;
|
}
|
|
.color2 {
|
color: #232323;
|
}
|
|
.color3 {
|
color: #FF4948;
|
}
|
|
.color4 {
|
color: #929191;
|
}
|
|
.color5 {
|
color: #000;
|
}
|
|
.color6 {
|
color: #666666;
|
}
|
|
.color7 {
|
color: #727272;
|
}
|
|
.color8 {
|
color: #fff;
|
}
|
|
.color9 {
|
color: #999999;
|
}
|
|
.color10 {
|
color: #636363;
|
}
|
|
.bgColor1 {
|
background: linear-gradient(270deg, #FFB318 0%, #FF330D 100%);
|
width: 58rpx;
|
height: 12rpx;
|
border-radius: 6rpx;
|
position: absolute;
|
left: 0;
|
right: 0;
|
bottom: -5rpx;
|
margin: auto;
|
}
|
|
.bgColor2 {
|
background-color: #fff;
|
}
|
|
.bgColor3 {
|
background: linear-gradient(180deg, #FFDCDB 0%, rgba(255, 255, 255, 0) 138rpx, #fff 100%);
|
}
|
|
.bgColor4 {
|
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%);
|
}
|
|
.bgColor5 {
|
background: #F3F3F3;
|
}
|
|
.bgColor6 {
|
background: linear-gradient(270deg, #FC8D55 0%, #FF4948 100%);
|
}
|
|
.bgColor7 {
|
background: #FF4948;
|
}
|
|
.border1 {
|
border-top: 2rpx solid #EDEEEF;
|
position: relative;
|
|
.left {
|
width: 40rpx;
|
height: 40rpx;
|
background-color: #F4F4F4;
|
border-radius: 50%;
|
position: absolute;
|
left: -20rpx;
|
top: -20rpx;
|
}
|
|
.right {
|
width: 40rpx;
|
height: 40rpx;
|
background-color: #F4F4F4;
|
border-radius: 50%;
|
position: absolute;
|
right: -20rpx;
|
top: -20rpx;
|
}
|
}
|
</style>
|
