<template>
|
<view class="box" :class="{ popupShow: showFilter }">
|
<scroll-view scroll-x class="box_head">
|
<view class="box_head_search">
|
<view class="box_head_search_ipt">
|
<image src="@/static/n/ic_search@2x.png" mode="widthFix"></image>
|
<input
|
v-model="search.title"
|
@blur="querylist"
|
type="text"
|
confirm-type="search"
|
placeholder="搜索任务名称"
|
/>
|
</view>
|
<view class="box_head_search_sha" @click="showFilter = true">
|
<image src="@/static/n/ic_shaixuan@2x.png" mode="widthFix"></image>
|
<text>筛选</text>
|
</view>
|
</view>
|
<view class="box_head_list">
|
<view
|
@click="statusClick(0)"
|
:class="{ active: search.queryType === 0 }"
|
class="box_head_item"
|
>待处理 {{ headData.noticeWaitNum || "" }}</view
|
>
|
<view
|
@click="statusClick(1)"
|
:class="{ active: search.queryType === 1 }"
|
class="box_head_item"
|
>已处理</view
|
>
|
<view
|
@click="statusClick(2)"
|
:class="{ active: search.queryType === 2 }"
|
class="box_head_item"
|
>我发起的</view
|
>
|
<view
|
@click="statusClick(3)"
|
:class="{ active: search.queryType === 3 }"
|
class="box_head_item"
|
>抄送我的 {{ headData.noticeCopyNum || "" }}</view
|
>
|
</view>
|
</scroll-view>
|
<view class="box_list">
|
<view class="chaosong" v-if="search.queryType === 3">
|
<view class="left">
|
<image
|
@click="readySearch(0)"
|
v-if="search.noRead && search.noRead == 1"
|
src="@/static/meeting/icon/ic_choose_sel@2x.png"
|
class="checked"
|
/>
|
<image
|
@click="readySearch(1)"
|
v-else
|
src="@/static/meeting/icon/ic_choose@2x.png"
|
class="checked"
|
/>
|
<text>仅看未读</text>
|
</view>
|
<view class="right" @click="handleReady">全部标记已读</view>
|
</view>
|
<view
|
class="box_list_item"
|
v-for="(item, index) in dataList"
|
@click="handleAppr(item)"
|
:key="index"
|
>
|
<view class="box_list_item_head">
|
<view class="df_ac">
|
<text v-if="item.readed == 0 && search.queryType === 3" class="readed"></text>
|
<text class="tt">{{ item.title }}</text>
|
</view>
|
<view class="info" :class="{ loading: search.queryType === 0 }">{{ item.info }}</view>
|
</view>
|
<view class="box_list_item_nr">
|
<view v-if="item.param1.arriveDate" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.arriveDate }}</text>
|
</view>
|
<view v-if="item.param1.inType" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.inType }}</text>
|
</view>
|
<view v-if="item.param1.totalNum" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.totalNum }}</text>
|
</view>
|
<view v-if="item.param1.carNum" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.carNum }}</text>
|
</view>
|
|
<view v-if="item.param1.name" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.name }}</text>
|
</view>
|
<view v-if="item.param1.area" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.area }}</text>
|
</view>
|
<view v-if="item.param1.cate" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.cate }}</text>
|
</view>
|
<view v-if="item.param1.sTime" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.sTime }}</text>
|
</view>
|
<view v-if="item.param1.eTime" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.eTime }}</text>
|
</view>
|
<view v-if="item.param1.usrNum" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.usrNum }}</text>
|
</view>
|
<view v-if="item.param1.reason" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.reason }}</text>
|
</view>
|
<view v-if="item.param1.carNos" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.carNos }}</text>
|
</view>
|
<view v-if="item.param1.mdd" class="box_list_item_nr_item">
|
<text></text>
|
<text>{{ item.param1.mdd }}</text>
|
</view>
|
<view class="box_list_item_nr_x"></view>
|
<view class="box_list_item_nr_text">
|
<text class="time">{{ item.createDate }}提交</text>
|
<text v-if="search.queryType === 0" class="btn">去处理</text>
|
</view>
|
</view>
|
</view>
|
<view v-if="dataList.length === 0" style="text-align: center">
|
<image
|
src="@/static/empty.png"
|
style="width: 320rpx; margin: 120px auto 0"
|
mode="widthFix"
|
/>
|
<view class="placeholder9 fs24">暂无数据</view>
|
</view>
|
</view>
|
<!-- 筛选 -->
|
<u-popup
|
:show="showFilter"
|
mode="bottom"
|
:round="10"
|
:closeable="true"
|
@close="showFilter = false"
|
>
|
<view class="search">
|
<view class="search_head">筛选</view>
|
<view class="search_list">
|
<view class="search_list_item">
|
<view class="search_list_item_label">创建时间</view>
|
<view class="search_list_item_val">
|
<view
|
class="search_list_item_val_row"
|
@click="tiemShow = true"
|
:style="{ color: modelParam.startDate ? '#000' : '' }"
|
>{{
|
modelParam.startDate ? modelParam.startDate : "开始时间"
|
}}</view
|
>
|
<view class="search_list_item_val_z">-</view>
|
<view
|
class="search_list_item_val_row"
|
@click="tiemShow1 = true"
|
:style="{ color: modelParam.endDate ? '#000' : '' }"
|
>{{
|
modelParam.endDate ? modelParam.endDate : "结束时间"
|
}}</view
|
>
|
</view>
|
</view>
|
<view class="search_list_item">
|
<view class="search_list_item_label">任务类型</view>
|
<view class="search_list_item_cates">
|
<view
|
:class="
|
item.id === modelParam.type
|
? 'search_list_item_cates_row active'
|
: 'search_list_item_cates_row'
|
"
|
v-for="(item, index) in cateList"
|
:key="index"
|
@click="clickItem(index)"
|
>
|
{{ item.name }}
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="search_footer">
|
<view class="search_footer_item" @click="modalReset">重置</view>
|
<view class="search_footer_item t" @click="modalSub">提交</view>
|
</view>
|
</view>
|
</u-popup>
|
<u-datetime-picker
|
:show="tiemShow"
|
v-model="startDate"
|
mode="date"
|
:formatter="formatter"
|
@confirm="confirmLeft"
|
@cancel="tiemShow = false"
|
></u-datetime-picker>
|
<u-datetime-picker
|
:show="tiemShow1"
|
:minDate="
|
modelParam.startDate ? new Date(modelParam.startDate).getTime() : null
|
"
|
v-model="startDate"
|
mode="date"
|
:formatter="formatter"
|
@confirm="confirmRight"
|
@cancel="tiemShow1 = false"
|
></u-datetime-picker>
|
</view>
|
</template>
|
|
<script>
|
import { stagingHead, stagingTaskPage, signReadTask } from '@/api'
|
import dayjs from 'dayjs'
|
export default {
|
data() {
|
return {
|
showFilter: false,
|
search: {
|
queryType: 0
|
},
|
modelParam: {},
|
tiemShow: false,
|
tiemShow1: false,
|
|
pagination: {
|
capacity: 20,
|
page: 0
|
},
|
headData: {},
|
dataList: [],
|
total: 0,
|
cateList: [
|
{ name: '访客申请', id: 0 },
|
{ name: '访客报备', id: 1 },
|
{ name: '用车申请', id: 2 },
|
{ name: '隐患随手拍', id: 3 },
|
{ name: '物流车申请', id: 6 },
|
{ name: '考勤代办', id: 7 },
|
],
|
startDate: dayjs().format('YYYY-MM-DD'),
|
}
|
},
|
// onLoad() {
|
// this.getHeadList()
|
// this.pagination.page = 0
|
// this.getList()
|
// },
|
onReachBottom() {
|
const { total, dataList} = this
|
if(dataList.length < total){
|
this.getList()
|
} else {
|
this.showToast('暂无更多数据')
|
}
|
},
|
onBackPress(options) {
|
setTimeout(()=>{
|
this.$eventBus.$emit('taskBack')
|
})
|
return false
|
},
|
onShow() {
|
this.pagination.page = 0
|
this.dataList = []
|
this.getHeadList()
|
},
|
methods: {
|
formatter(type, value) {
|
if (type === 'year') {
|
return `${value}年`
|
}
|
if (type === 'month') {
|
return `${value}月`
|
}
|
if (type === 'day') {
|
return `${value}日`
|
}
|
if (type === 'hour') {
|
return `${value}时`
|
}
|
if (type === 'minute') {
|
return `${value}分`
|
}
|
return value
|
},
|
statusClick(val) {
|
this.pagination.page = 0
|
this.dataList = []
|
this.$set(this.search, 'queryType', val)
|
this.getList()
|
},
|
readySearch(val) {
|
this.pagination.page = 0
|
this.dataList = []
|
this.$set(this.search, 'noRead', val)
|
this.getList()
|
},
|
modalReset() {
|
this.modelParam = {}
|
this.search = {
|
queryType: 0
|
}
|
this.pagination.page = 0
|
this.dataList = []
|
this.showFilter = false
|
this.getList()
|
},
|
modalSub() {
|
this.search = { ...this.search, ...this.modelParam }
|
this.pagination.page = 0
|
this.dataList = []
|
this.getList()
|
this.showFilter = false
|
},
|
querylist() {
|
this.pagination.page = 0
|
this.dataList = []
|
this.getList()
|
},
|
getList() {
|
const { pagination, search } = this
|
pagination.page++
|
stagingTaskPage({
|
...pagination,
|
model: {
|
...search
|
}
|
}).then(res => {
|
if(res.data && res.data.records){
|
res.data.records.forEach(i => {
|
if (i.param1) {
|
i.param1 = JSON.parse(i.param1)
|
}
|
})
|
}
|
this.dataList = [...this.dataList, ...res.data.records]
|
this.total = res.data.total
|
|
})
|
},
|
getHeadList() {
|
stagingHead({
|
isDetail: '1'
|
}).then(res => {
|
this.headData = res.data
|
this.getList()
|
})
|
},
|
handleReady() {
|
signReadTask({
|
signType: 1
|
}).then(res => {
|
this.getHeadList()
|
})
|
},
|
handleAppr(item) {
|
const { objType, objId, info, readed } = item
|
if (readed === 0) {
|
signReadTask({
|
noticesId: item.id,
|
signType: 0
|
}).then(res => {
|
this.getHeadList()
|
})
|
}
|
if (item.type == 7) {
|
if(item.remark){
|
window.open(item.remark);
|
// window.open('https://atwl.ahzyssl.com/dps/web/wxAuth/loginV2?oaId=atwl&redirectId=index')
|
return
|
}
|
}
|
if (objType === 2) {
|
uni.navigateTo({
|
url: `/pages/staff/vehicle/sendACarDetail?id=${objId}&info=${info}`
|
})
|
} else if (objType === 1) {
|
uni.navigateTo({
|
url: `/pages/staff/task/visitorReport?id=${objId}&objType=${objType}&info=${info}`
|
})
|
} else if (objType === 3) {
|
uni.navigateTo({
|
url: `/pages/staff/task/vDangetAppr?id=${objId}&objType=${objType}&info=${info}`
|
})
|
}else if (objType === 6 || objType === 5) {
|
uni.navigateTo({
|
url: `/pages/staff/task/driver?id=${objId}&objType=${objType}&info=${info}`
|
})
|
}else {
|
uni.navigateTo({
|
url: `/pages/staff/task/visitorApprove?id=${objId}&objType=${objType}&info=${info}`
|
})
|
}
|
},
|
clickItem(index) {
|
if (this.cateList[index].id === this.modelParam.type) {
|
this.$set(this.modelParam, 'type', null)
|
} else {
|
this.$set(this.modelParam, 'type', this.cateList[index].id)
|
}
|
},
|
confirmLeft(e) {
|
setTimeout(() => {
|
this.$set(this.modelParam, 'startDate', uni.$u.timeFormat(e.value, 'yyyy-mm-dd'))
|
})
|
this.tiemShow = false
|
},
|
confirmRight(e) {
|
setTimeout(() => {
|
this.$set(this.modelParam, 'endDate', uni.$u.timeFormat(e.value, 'yyyy-mm-dd'))
|
})
|
this.tiemShow1 = false
|
}
|
}
|
}
|
</script>
|
<style>
|
page {
|
background-color: #f7f7f7 !important;
|
}
|
</style>
|
<style lang="scss" scoped>
|
.box {
|
width: 100%;
|
.box_head {
|
width: 100%;
|
height: 190rpx;
|
padding: 12rpx 30rpx;
|
box-sizing: border-box;
|
background: #ffffff;
|
position: sticky;
|
top: 0;
|
left: 0;
|
.box_head_search {
|
width: 100%;
|
height: 76rpx;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 24rpx;
|
.box_head_search_ipt {
|
flex: 1;
|
height: 100%;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
display: flex;
|
align-items: center;
|
background: #f7f7f7;
|
border-radius: 50rpx;
|
margin-right: 30rpx;
|
image {
|
flex-shrink: 0;
|
width: 28rpx;
|
height: 28rpx;
|
margin-right: 16rpx;
|
}
|
input {
|
flex: 1;
|
height: 100%;
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #b2b2b2;
|
}
|
}
|
.box_head_search_sha {
|
flex-shrink: 0;
|
display: flex;
|
align-items: center;
|
image {
|
width: 28rpx;
|
height: 28rpx;
|
margin-right: 8rpx;
|
}
|
text {
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #333333;
|
}
|
}
|
}
|
.box_head_list {
|
width: 100%;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
.active {
|
border: 2rpx solid #4c99a8 !important;
|
color: #4c99a8 !important;
|
}
|
.box_head_item {
|
text-align: center;
|
flex: 1;
|
height: 60rpx;
|
line-height: 60rpx;
|
box-sizing: border-box;
|
border-radius: 30rpx;
|
border: 2rpx solid #999999;
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #333333;
|
margin-right: 10rpx;
|
&:nth-last-child(1) {
|
margin-right: 0;
|
}
|
}
|
}
|
}
|
.box_list {
|
width: 100%;
|
padding: 30rpx;
|
box-sizing: border-box;
|
.chaosong {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
color: #666666;
|
font-size: 24rpx;
|
margin-bottom: 20rpx;
|
.left {
|
display: flex;
|
align-items: center;
|
.checked {
|
width: 32rpx;
|
height: 32rpx;
|
margin-right: 10rpx;
|
}
|
}
|
}
|
.box_list_item {
|
width: 100%;
|
margin-bottom: 20rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
.box_list_item_head {
|
width: 100%;
|
height: 100rpx;
|
padding: 0 30rpx;
|
box-sizing: border-box;
|
background: linear-gradient(270deg, #fefeff 0%, #e1f7fe 100%);
|
border-radius: 8rpx 8rpx 0rpx 0rpx;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.readed {
|
width: 16rpx;
|
height: 16rpx;
|
border-radius: 50%;
|
background-color: #e0312a;
|
margin-right: 16rpx;
|
}
|
.info {
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #999999;
|
width: 120rpx;
|
text-align: right;
|
}
|
.loading {
|
color: $uni-color-primary;
|
}
|
.success {
|
color: #03c68f;
|
}
|
.error {
|
color: #e0312a;
|
}
|
.tt {
|
font-size: 32rpx;
|
font-weight: 600;
|
color: #222222;
|
}
|
}
|
.box_list_item_nr {
|
padding: 30rpx;
|
width: 100%;
|
box-sizing: border-box;
|
background-color: #ffffff;
|
.box_list_item_nr_x {
|
width: 100%;
|
height: 1rpx;
|
background-color: #e5e5e5;
|
}
|
.box_list_item_nr_text {
|
.time {
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
.btn {
|
padding: 0 32rpx;
|
height: 60rpx;
|
line-height: 60rpx;
|
background: $uni-color-primary;
|
color: #fff;
|
font-size: 26rpx;
|
font-weight: 300;
|
text-align: center;
|
border-radius: 30rpx;
|
}
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
width: 100%;
|
margin-top: 20rpx;
|
}
|
.box_list_item_nr_item {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
margin-bottom: 20rpx;
|
text {
|
&:nth-child(1) {
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #666666;
|
}
|
&:nth-child(2) {
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #333333;
|
}
|
}
|
}
|
}
|
}
|
}
|
.search {
|
width: 100%;
|
padding: 30rpx;
|
box-sizing: border-box;
|
.search_head {
|
width: 100%;
|
text-align: center;
|
font-size: 32rpx;
|
font-weight: 600;
|
color: #222222;
|
}
|
.search_list {
|
width: 100%;
|
margin-top: 34rpx;
|
.search_list_item {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
margin-bottom: 48rpx;
|
.search_list_item_label {
|
font-size: 30rpx;
|
font-weight: 400;
|
color: #222222;
|
margin-bottom: 24rpx;
|
}
|
.search_list_item_cates {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
.active {
|
background: #4c99a8 !important;
|
color: #ffffff !important;
|
}
|
.search_list_item_cates_row {
|
width: 216rpx;
|
height: 64rpx;
|
text-align: center;
|
line-height: 64rpx;
|
background: #f7f7f7;
|
border-radius: 36rpx;
|
margin-right: 20rpx;
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #333333;
|
margin-bottom: 20rpx;
|
&:nth-of-type(3n) {
|
margin-right: 0;
|
}
|
}
|
}
|
.search_list_item_val {
|
width: 100%;
|
height: 64rpx;
|
background: #f7f7f7;
|
border-radius: 36rpx;
|
border: 1rpx solid #e5e5e5;
|
display: flex;
|
align-items: center;
|
.search_list_item_val_row {
|
flex: 1;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
.search_list_item_val_z {
|
flex-shrink: 0;
|
font-size: 26rpx;
|
font-weight: 400;
|
color: #999999;
|
margin: 0 30rpx;
|
}
|
}
|
}
|
}
|
.search_footer {
|
width: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
.t {
|
background: #4c99a8 !important;
|
color: #ffffff !important;
|
}
|
.search_footer_item {
|
flex: 1;
|
height: 88rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 32rpx;
|
font-weight: 400;
|
color: #4c99a8;
|
margin-right: 18rpx;
|
border: 1rpx solid #4c99a8;
|
border-radius: 44rpx;
|
&:last-child {
|
margin: 0 !important;
|
}
|
}
|
}
|
}
|
}
|
</style>
|
