<template>
|
<view class="box">
|
<!-- 自定义导航栏 -->
|
<view class="navBarBox fix">
|
<!-- 状态栏占位 -->
|
<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view>
|
<!-- 真正的导航栏内容 -->
|
<view style="display: flex; flex-direction: column;">
|
<view class="navBar">
|
<u-icon style=" margin-left: -25px;" name="arrow-left" color="black" size="17" @click="goBack" />
|
<view class="barText">叫应率统计</view>
|
</view>
|
</view>
|
</view>
|
<view class="responseCard">
|
<view class='title'>{{title}}</view>
|
<table class="table">
|
<thead class="head">
|
<tr>
|
<th></th>
|
<th>处理情况</th>
|
<th v-if="unittype == 4">叫应时间</th>
|
<th v-else>转发叫应率</th>
|
<th v-if="unittype == 4">反馈</th>
|
<th v-else>详情</th>
|
</tr>
|
</thead>
|
<tbody class="tableBody">
|
<tr v-for="(item, index) in tableData" :key="index" >
|
<td align="center" width="90px">{{ item.receiveUnit }}</td>
|
<td align="center">{{ item.response }}</td>
|
<td align="center" v-if="unittype == 4" width="85px">{{ item.responseTime }}</td>
|
<td align="center" v-else>{{ item.responsivity }}</td>
|
<td>
|
<u-button
|
v-if="unittype == 4"
|
size="medium"
|
type="text"
|
style="color: blue"
|
@click="toDetail(item)"
|
>查看
|
</u-button>
|
<u-button
|
v-else
|
size="medium"
|
type="text"
|
style="color: sandybrown"
|
@click="toNext(item)"
|
>叫应详情
|
</u-button>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { getResponseDetail,getMeasureDetail } from '../../../api/notice.js'
|
export default {
|
data() {
|
return {
|
page: 'pages/tabBar/count/count',
|
statusBarHeight: '',
|
tableData: [],
|
unittype: null,
|
title: ''
|
}
|
|
},
|
onLoad(options) {
|
let test = options.data && JSON.parse(decodeURIComponent(options.data));
|
console.log("data",test)
|
this.title = test.title;
|
this.tableData = test.appPageResponseByIdRespDTOS;
|
this.unittype = this.tableData[0].unittype;
|
console.log("unittype",this.tableData)
|
this.tableData.forEach((item,index) => {
|
this.tableData[index].response = item.responseStatus ==1 ? '待叫应' :item.responseStatus == 2 ? '已叫应' :'超时未叫应'
|
this.tableData[index].responsivity = item.forwardRate ? item.forwardRate :'--';
|
this.tableData[index].responseTime = item.responseTime ? item.responseTime :'--';
|
})
|
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
|
uni.hideTabBar();
|
},
|
methods: {
|
goBack() {
|
uni.switchTab({
|
url:'/pages/tabBar/current/current'
|
});
|
},
|
toNext(item) {
|
if(item.forwardWarnInfoId != null){
|
const param = {
|
pageIndex: 1,
|
pageSize: 100,
|
searchParams: {
|
warnInfoId: item.forwardWarnInfoId
|
}
|
}
|
getResponseDetail(param).then(res => {
|
if(res.code == 100){
|
this.tableData = res.data.appPageResponseByIdRespDTOS;
|
this.unittype = this.tableData[0].unittype;
|
this.tableData.forEach((item,index) => {
|
this.tableData[index].response = item.responseStatus ==1 ? '待叫应' :item.responseStatus == 2 ? '已叫应' :'超时未叫应'
|
this.tableData[index].responsivity = item.forwardRate ? item.forwardRate :'--'
|
})
|
}
|
})
|
}else {
|
uni.showToast({
|
icon: 'none',
|
title: '暂无下级转发数据',
|
duration: 3000
|
})
|
}
|
},
|
toDetail(item){
|
console.log("d",item)
|
getMeasureDetail({id: item.id}).then(res => {
|
if(res.code == 100){
|
if(res.data.baseMeasures && res.data.baseMeasures.length>0 ){
|
uni.navigateTo({
|
url: `/pages/tabBar/responsivity/showMeasures?data=` + encodeURIComponent(JSON.stringify(res.data))
|
})
|
}else{
|
uni.showToast({
|
icon: 'none',
|
title: '该记录暂无响应措施',
|
duration: 3000
|
})
|
}
|
}
|
})
|
}
|
}
|
}
|
|
</script>
|
|
<style lang='scss' scoped>
|
.box {
|
display: flex;
|
flex-direction: column;
|
width: 100%;
|
height: 100%;
|
}
|
.fix{
|
position: sticky;
|
top: 0;
|
left: 0;
|
right: 0;
|
width: 100%;
|
z-index: 1;
|
}
|
.navBarBox .navBar {
|
background-color:#fff;
|
height: 50px;
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
align-items: center;
|
box-shadow: 0 3px 12px rgba(0,0,0,0.05);
|
}
|
.barText{
|
text-align: center;
|
width: 85%;
|
font-size: 16px;
|
/* text-align: center; */
|
font-weight: 600;
|
}
|
.statusBar{
|
background-color:lightgrey;
|
}
|
.responseCard{
|
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: 20px 12px;
|
}
|
.table{
|
.head{
|
color: white;
|
line-height: 35px;
|
background-color: rgb(66, 157, 218);
|
}
|
.tableBody{
|
color: black;
|
background-color: rgb(207, 223, 241);
|
line-height: 35px;
|
}
|
tr:nth-child(odd+1) {
|
background-color: rgb(207, 223, 241); /* 设置奇数行颜色 */
|
}
|
tr:nth-child(even) {
|
background-color: rgb(233, 239, 248); /* 设置偶数行颜色 */
|
}
|
}
|
.title{
|
text-align: center;
|
font-size: 16px;
|
font-weight: 600;
|
margin-bottom: 20px;
|
}
|
</style>
|
