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.
 
 
 
 
 
 

496 lines
12 KiB

<template>
<view id="page">
<view class="Width100 Box BorderBox">
<view class="Content BorderBox Width100">
<top-title :is-show-left="false" :title="'排查'" :rightWidth='120' class="custom_bg">
<!-- <template slot="right">
<image :src="$.imgSrc + '/mine/search.png'" @click="$.open('/pages/mine/setting')"
mode="aspectFit" class="InlineBlock imgIcon"></image>
<image :src="$.imgSrc + '/mine/plus.png'" mode="aspectFit"
@click="$.open('/pages/create/create')" class="InlineBlock imgIcon"></image>
</template> -->
</top-title>
</view>
<view class="query-form" :class="tab==3?'query-form2':''">
<view class="search-box">
<u-search placeholder="请输入名称" v-model="search" actionText="" :showAction="false"
@search="searchData" @clear="searchData"></u-search>
</view>
<view class="tab">
<view class="tab-item" :class="tab === 1 ? 'active' : ''" @click='handleTabClick(1)'>
<text>待办</text>
<text v-if="showNumber" class="number">{{ totalData.UnderInvestigation }}</text>
</view>
<!-- <view class="tab-item" :class="tab === 2 ? 'active' : ''" @click='handleTabClick(2)'>
<text>正在办理</text>
<text class="number">{{ totalData.InGovernance }}</text>
</view> -->
<view class="tab-item" :class="tab === 3 ? 'active' : ''" @click='handleTabClick(3,true)'>
<text>已完成</text>
<text class="number">{{ totalData.InGovernance }}</text>
</view>
</view>
<view class="type-box" v-show="tab==3">
<view class="type-item" :class="queryType == 1 ? 'type-active' : ''" @click="queryTypeChange('1')">
全部
</view>
<view class="type-item" :class="queryType == 2 ? 'type-active' : ''" @click="queryTypeChange('2')">
人工上报
</view>
<view class="type-item" :class="queryType == 3 ? 'type-active' : ''" @click="queryTypeChange('3')">
系统下发
</view>
</view>
</view>
<view class="Content MarginAuto BorderBox">
<no-data v-if="isEmpty" />
<view v-else class="List Width100 BorderBox">
<view class="Unit FontBold BorderBox Width100 MarginT_30rpx BG_FFFFFF" v-for="(item,index) in list"
:key='item.businessId+index' @click='handleClick(item)'>
<!-- <image class="imgleft" :src="item.imgurl || '/static/logo.png'" mode="widthFix"></image> -->
<view class="right">
<view class="title">{{ item.name }}</view>
<view class="type">
<!-- <text v-if="tab === 1">排查</text>
<text v-if="tab === 3">治理</text> -->
<text>{{ item.enumname || '--' }}</text>
<text>{{ item.deadlineStatus || '--' }}</text>
</view>
</view>
<view class="trapezoidal" v-if="item.deadlineType == 1">
超期
</view>
<view class="trapezoidal lin" v-if="item.deadlineType == 2">
临期
</view>
</view>
</view>
<u-loadmore :status="loadmorestatus" v-show="!isEmpty" />
</view>
</view>
<Tabbar name="排查" v-if="tabbarShow"></Tabbar>
</view>
</template>
<script>
import Tabbar from "../../components/tabbar.vue";
import NoData from "../../components/no-data.vue";
import TopTitle from "../../components/top-title";
import $ from "../../common/globalJs/globalJs";
import tabFun from '@/libs/function/tabbar.js'
export default {
// 组件
components: {
NoData,
TopTitle,
Tabbar
},
data() {
return {
loadmorestatus: 'loading',
showNumber: true,
// 公用的js
bgUrl1: '', // 登录信息背景图
list: [],
isEmpty: false,
isMore: true,
page: 1,
tab: 1,
totalData: {
UnderInvestigation: 0,
InGovernance: 0,
Finished: 0,
Unconfirmed: 0,
},
status: '1',
search: '',
tabbarShow: true,
queryType: '1',
pageStatus: ''
}
},
// 页面加载
onLoad(e) {
// this.getList()
},
onShow() {
// tabFun.tabbar()
this.getData()
let pageStatus = this.$.getData('pageStatus')
this.queryType = this.$.getData('pageType')
this.pageStatus = pageStatus
console.log(this.$.getData('pageType'))
if (pageStatus == 1) {
this.handleTabClick(1)
this.$.setData('pageStatus', '0')
} else if (pageStatus == 3) {
this.handleTabClick(3)
this.$.setData('pageStatus', '0')
} else {
this.handleTabClick(1)
}
uni.hideTabBar() //隐藏官方的tabBar
// this.tabbarShow = false
// this.$nextTick(() => {
// this.tabbarShow = true
// })
},
// 计算属性
computed: {
$() {
return $
}
},
// 方法
methods: {
queryTypeChange(e) {
this.queryType = e
this.page = 1;
this.$.setData('pageType', e)
this.list = [];
this.isMore = true
this.getList()
},
handleTabClick(tab, falg = false) {
this.tab = tab;
this.page = 1;
this.list = [];
this.isMore = true
switch (tab) {
case 1:
this.status = '1';
this.queryType = null
break;
// case 2:
// this.status = '20';
// break;
case 3:
if (falg) {
this.queryType = '1'
}
this.status = '2';
break;
}
this.getList()
},
getData() {
this.$request.globalRequest('/hiddenDanger/highDanger/getHighDangerStatusNum', {
nuserid: this.$.getData('token')
}, 'GET').then(res => {
if (res.code === 200) {
// console.log(res.result)
res.result.forEach(item => {
this.totalData[item.status] = item.count
})
} else {
this.$.toast(res.message)
}
})
},
searchData() {
this.page = 1;
this.list = []
this.getList()
},
getList() {
let datas = {
nuserid: this.$.getData('token'),
status: '10',
}
this.loadmorestatus = 'loading'
let query=this.status==2?`pageNum=${this.page}&pageSize=${10}&search=${this.search}&approve=${this.status}&classification=${this.queryType}`:`pageNum=${this.page}&pageSize=${10}&search=${this.search}&approve=${this.status}`
this.$request.globalRequest(
`/hiddenDanger/highDanger/getHigDangerDealt?${query}`,
datas, 'POST')
.then(res => {
this.loadmorestatus = 'loadmore'
uni.stopPullDownRefresh();
if (res.code === 200) {
if (res.result.total === 0) {
this.isEmpty = true;
} else {
this.isEmpty = false;
this.list.push(...res.result.list)
}
if (this.list.length >= res.result.total) {
this.loadmorestatus = 'nomore'
this.isMore = false
}
} else {
this.$.toast(res.message)
}
if (this.status == 1) {
this.$set(this.totalData, 'UnderInvestigation', res.result.total)
}
if (this.status == 2) {
this.$set(this.totalData, 'InGovernance', res.result.total)
}
}).catch((err) => {
this.loadmorestatus = 'nomore'
uni.stopPullDownRefresh();
})
},
handleClick(row) {
console.log(row)
if (this.tab === 1) {
if (row.pcType == 2) {
this.$.open("/pages/investigation/task" + "?id=" + row.businessId + '&sectionId=' + row
.sectionCode +
'&operator=' + row.operator + '&deptId=' + row.handleDept + '&taskName=' + row.name +
'&pcType' + row.pcType + '&sectionName=' + row.sectionName + '&sectionCode=' + row
.sectionCode);
} else {
this.$.open('/pages/map/index?businessId=' + row.businessId +
'&operator=' + row.operator +
'&deptId=' + row.handleDept +
'&pcType=' + row.pcType +
'&type=' + (this.tab == 1 ? 'edit' : 'view') + '&sectionName=' + row.sectionName +
'&sectionCode=' + row.sectionCode + '&taskName=' + row.name)
// this.$.open('/pages/map/index?businessId=' + row.businessId)
}
} else {
// this.$.open('/pages/investigation/complete?id=' + row.businessId + '&type=' + (this.tab == 1 ? 'edit' :
// 'view'))
this.$.open("/pages/investigation/complete" + "?id=" + row.businessId + '&sectionId=' + row
.sectionCode +
'&operator=' + row.operator + '&deptId=' + row.handleDept + '&taskName=' + row.name +
'&pcType' + row.pcType + '&sectionName=' + row.sectionName + '&sectionCode=' + row.sectionCode);
}
},
// 跳转页面
skipPage(even) {
// this.$.open(even)
},
},
onReady() {},
// 页面卸载
onUnload() {
},
// 触发下拉刷新
onPullDownRefresh() {
this.page = 1;
this.list = [];
this.isMore = true
this.getList()
// 延迟关闭刷新动画
// setTimeout(() => {
// uni.stopPullDownRefresh();
// }, 1500);
},
// 页面上拉触底事件的处理函数
onReachBottom() {
if (this.isMore) {
this.page++
this.getList()
}
},
}
</script>
<style>
</style>
<style lang="scss" scoped>
page {
background: #F6F8FA;
}
.imgIcon {
width: 40rpx;
height: 100%;
}
.imgIcon:nth-of-type(2) {
margin-left: 40rpx;
}
.img {
width: 40rpx;
height: 40rpx;
margin-left: 30rpx;
}
.trapezoidal {
position: relative;
display: inline-block;
min-width: 2em;
text-align: center;
padding: 3rpx 20rpx 3rpx 18rpx;
}
.trapezoidal::before,
.trapezoidal::after {
content: '';
position: absolute;
top: 0;
left: 0%;
width: 100%;
height: 100%;
border-radius: 0rpx 0 0 0;
background: #FF1111;
z-index: -1;
transform-origin: bottom;
transform: skew(18deg);
border: 0rpx solid #333;
box-sizing: border-box;
}
.trapezoidal::after {
left: auto;
right: 0;
transform: skew(-0deg);
border-radius: 0 0rpx 0 0;
background-color: #FF1111;
border-left: 0 none;
}
.lin::before,
.lin::after {
background-color: #E68A0B;
}
.query-form {
font-size: 16px;
height: 91px;
background: #ffffff;
box-shadow: 3px 0px 10px #ccc;
color: #666666;
position: sticky;
// top: var(--status-bar-height + 88rpx);
top: calc(var(--status-bar-height) + 88rpx);
z-index: 10;
.tab {
display: flex;
align-items: center;
justify-content: space-around;
.tab-item {
position: relative;
height: 41px;
line-height: 41px;
padding: 0 30rpx 0 30rpx;
border-bottom: 3px solid #fff;
display: flex;
align-items: center;
&.active {
color: rgb(60, 109, 195);
border-color: rgb(60, 109, 195);
}
.number {
font-weight: bold;
font-size: 18px;
margin-left: 10rpx;
}
}
}
.search-box {
padding: 10px 10px 3px;
}
}
.query-form2 {
height: 146px;
.type-box {
display: flex;
align-items: center;
justify-content: space-between;
width: calc(100% - 100rpx);
padding: 0 50rpx;
height: 108rpx;
.type-item {
width: 28%;
border-radius: 200rpx;
height: 50rpx;
text-align: center;
line-height: 50rpx;
font-size: 26rpx;
border: #999999 solid 1rpx;
margin-top: 15rpx;
}
.type-active {
border: #3c6dc3 solid 1rpx;
color: #3c6dc3;
}
}
}
.Box {
padding-top: var(--status-bar-height);
.Content {
width: calc(100% - 48rpx);
padding-bottom: 88rpx;
}
.Unit {
padding: 20rpx 12rpx;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
box-shadow: 1px 1px 3px #ccc;
.trapezoidal {
position: absolute;
top: -0px;
right: 0px;
color: #ffffff;
font-size: 22rpx;
font-weight: normal;
z-index: 1;
}
image {
width: 200rpx;
}
.right {
flex: 1;
padding-left: 30rpx;
.title {
font-size: 16px;
width: 380rpx;
min-height: 60rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.type {
font-size: 14px;
color: #666;
font-weight: normal;
text {
margin-right: 20rpx;
}
}
}
}
}
</style>