You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
251 lines
6.4 KiB
251 lines
6.4 KiB
<template>
|
|
<view>
|
|
<Head isBack :text="tabList[type].label" />
|
|
<view class="statistics-container">
|
|
<view class="card">
|
|
<view class="titles" v-if="type === 'addressEvent' || type === 'addressMobileEvents'">地点：{{ data.address }}</view>
|
|
<view class="titles" v-if="type === 'mobileEvent'">姓名：{{ data.name }}</view>
|
|
<view class="sub-tit" v-if="type === 'mobileEvent'">联系电话：{{ data.mobile }}</view>
|
|
<view class="sub-tit" v-if="type === 'addressEvent'">类别：{{ data.categoryName }}</view>
|
|
<view class="sub-tit">
|
|
投诉次数：
|
|
<text class="count-num">{{ data.amount }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="card">
|
|
<view class="event-list">
|
|
<view class="event-item" @tap="gotoPage" :data-id="item.icEventId" v-for="(item, index) in list" :key="index">
|
|
<view>
|
|
<view class="userInfo">
|
|
<view class="name">{{ item.name }} {{ item.mobile }}</view>
|
|
<view class="status">{{ item.statusName }}</view>
|
|
</view>
|
|
<view class="address">
|
|
<view class="grid">{{ item.gridName }}</view>
|
|
<view class="time">{{ item.createdTime }}</view>
|
|
</view>
|
|
<view class="desc">
|
|
{{ item.eventContent }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import Head from '../../../../components/Head';
|
|
import { dwdEventList } from '../../../../utils/statisticsApi';
|
|
const app = getApp();
|
|
export default {
|
|
components: {
|
|
Head
|
|
},
|
|
data() {
|
|
return {
|
|
tabList: {
|
|
addressEvent: {
|
|
label: '同地点同类型',
|
|
value: 'addressEvent'
|
|
},
|
|
addressMobileEvents: {
|
|
label: '同区域不同类型',
|
|
value: 'addressMobileEvents'
|
|
},
|
|
mobileEvent: {
|
|
label: '同一人员',
|
|
value: 'mobileEvent'
|
|
}
|
|
},
|
|
|
|
type: '',
|
|
|
|
data: {
|
|
address: '',
|
|
name: '',
|
|
mobile: '',
|
|
categoryName: '',
|
|
amount: ''
|
|
},
|
|
|
|
list: [],
|
|
pageNo: 1,
|
|
total: 0,
|
|
label: ''
|
|
};
|
|
},
|
|
onLoad(options) {
|
|
this.setData({
|
|
type: options.type,
|
|
data: options.data ? JSON.parse(options.data) : ''
|
|
});
|
|
this.getList();
|
|
},
|
|
onReachBottom() {
|
|
if (this.list.length < this.total) {
|
|
this.setData({
|
|
pageNo: this.pageNo + 1
|
|
});
|
|
this.getList();
|
|
}
|
|
},
|
|
methods: {
|
|
getList() {
|
|
let params = {
|
|
pageNo: this.pageNo,
|
|
pageSize: 10
|
|
};
|
|
let detail = this.data;
|
|
if (this.type === 'addressEvent') {
|
|
params.secondIdList = [detail.categoryId];
|
|
}
|
|
if (this.type === 'addressEvent' || this.type === 'addressMobileEvents') {
|
|
params.content = detail.address;
|
|
}
|
|
if (this.type === 'mobileEvent') {
|
|
params.mobile = detail.mobile;
|
|
}
|
|
dwdEventList(params).then((res) => {
|
|
this.setData({
|
|
total: res.data.total,
|
|
list: this.list.concat(res.data.list)
|
|
});
|
|
});
|
|
},
|
|
|
|
gotoPage({
|
|
currentTarget: {
|
|
dataset: { id }
|
|
}
|
|
}) {
|
|
uni.navigateTo({
|
|
url: '/subpages/statistics/pages/event/detail/detail?id=' + id
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style>
|
|
.statistics-container {
|
|
padding: 20rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
.card {
|
|
background: #fff;
|
|
border-radius: 20rpx;
|
|
padding: 30rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
.title {
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
margin-bottom: 60rpx;
|
|
}
|
|
.bold {
|
|
font-weight: bold;
|
|
}
|
|
.blue {
|
|
color: #3a80e7;
|
|
}
|
|
.log-item {
|
|
border-bottom: 1px solid #eaeaea;
|
|
padding: 30rpx 0;
|
|
}
|
|
.log-item .user {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.log-item .icon {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
}
|
|
.log-item .name {
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
.log-item .address {
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #999999;
|
|
}
|
|
.log-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
page {
|
|
background: #f7f7f7;
|
|
}
|
|
.titles {
|
|
font-size: 34rpx;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
margin-bottom: 30rpx;
|
|
}
|
|
.sub-tit {
|
|
margin-bottom: 25rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
color: #666666;
|
|
}
|
|
.count-num {
|
|
font-size: 40rpx;
|
|
font-weight: bold;
|
|
color: #ff783c;
|
|
}
|
|
.event-list .event-item:first-child {
|
|
padding-top: 0;
|
|
}
|
|
.event-list .event-item {
|
|
border-bottom: 1px solid #eaeaea;
|
|
padding: 30rpx 0;
|
|
}
|
|
.event-list .event-item .userInfo {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 15rpx;
|
|
}
|
|
.event-list .event-item .userInfo .name {
|
|
font-size: 34rpx;
|
|
font-weight: bold;
|
|
color: #333333;
|
|
}
|
|
.event-list .event-item .userInfo .status {
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #13c8bd;
|
|
}
|
|
.event-list .event-item .address {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.event-list .event-item .address .grid {
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
}
|
|
|
|
.event-list .event-item .address .time {
|
|
font-size: 26rpx;
|
|
font-weight: 500;
|
|
color: #c1c1c1;
|
|
}
|
|
.event-list .event-item .desc {
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
line-height: 48rpx;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 3;
|
|
-webkit-box-orient: vertical;
|
|
height: 144rpx;
|
|
}
|
|
</style>
|
|
|