|
|
<template>
|
|
|
<view class="task-list">
|
|
|
<view class="menu">
|
|
|
<uni-segmented-control :current="currentIndex" :values="menuList" @clickItem="handleMenuChange"
|
|
|
:styleType="menuObj.styleType" :activeColor="menuObj.activeColor">
|
|
|
</uni-segmented-control>
|
|
|
</view>
|
|
|
<!-- <view class="search">
|
|
|
<uni-search-bar v-model="keyword" @blur="onSearch" @clear="onClear" cancelButton="false"
|
|
|
placeholder="请输入搜索内容">
|
|
|
</uni-search-bar>
|
|
|
</view> -->
|
|
|
<view class="dataList">
|
|
|
<view v-for="(item,index) in dataList" :key="index">
|
|
|
<task-card :info="item" :idx="index"></task-card>
|
|
|
</view>
|
|
|
<view v-show="isLoadMore">
|
|
|
<uni-load-more :status="loadStatus" ></uni-load-more>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { getToken } from '@/utils/auth'
|
|
|
import taskCard from '@/components/task-card/task-card.vue'
|
|
|
import {
|
|
|
taskListApi
|
|
|
} from '@/api/task-list'
|
|
|
export default {
|
|
|
name: "Task-list",
|
|
|
components: {
|
|
|
taskCard
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
menuList: ['已接单', '进行中', '已完成'],
|
|
|
currentIndex: 0,
|
|
|
menuObj: {
|
|
|
activeColor: '#007aff',
|
|
|
styleType: 'button',
|
|
|
current: 1
|
|
|
},
|
|
|
pageNo: 1,
|
|
|
pageSize: 10,
|
|
|
isLoadMore:false, //是否加载中
|
|
|
loadStatus:'loading', //加载样式:more-加载前样式,loading-加载中样式,nomore-没有数据样式
|
|
|
dataList: [],
|
|
|
mapStatus: [
|
|
|
{
|
|
|
id: 0,
|
|
|
name: 'RECEIVED'
|
|
|
},
|
|
|
{
|
|
|
id: 1,
|
|
|
name: 'PROCESSING'
|
|
|
},
|
|
|
{
|
|
|
id: 2,
|
|
|
name: 'FINISHED'
|
|
|
}
|
|
|
],
|
|
|
keyword: ''
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
isLogin() {
|
|
|
return !!getToken()
|
|
|
}
|
|
|
},
|
|
|
onLoad(option) {
|
|
|
this.status = option.status || 'RECEIVED'
|
|
|
const obj = this.mapStatus.find(e => e.name == option.status)
|
|
|
this.currentIndex = obj.id
|
|
|
},
|
|
|
onShow() {
|
|
|
if (!this.isLogin) {
|
|
|
uni.navigateTo({ url: '/pages/login' })
|
|
|
} else {
|
|
|
this.getData()
|
|
|
}
|
|
|
},
|
|
|
onReachBottom() {
|
|
|
if(!this.isLoadMore){ //此处判断,上锁,防止重复请求
|
|
|
this.isLoadMore = true
|
|
|
this.pageNo +=1
|
|
|
this.getData()
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
handleMenuChange(e) {
|
|
|
if (this.currentIndex !== e.currentIndex) {
|
|
|
const obj = {
|
|
|
0: 'RECEIVED',
|
|
|
1: 'PROCESSING',
|
|
|
2: 'FINISHED'
|
|
|
}
|
|
|
this.status = obj[e.currentIndex]
|
|
|
this.currentIndex = e.currentIndex
|
|
|
this.dataList = []
|
|
|
this.pageNo = 1
|
|
|
this.getData()
|
|
|
}
|
|
|
},
|
|
|
onSearch() {
|
|
|
this.getData(this.keyword)
|
|
|
},
|
|
|
onClear() {},
|
|
|
// 获取列表数据
|
|
|
getData(val= '') {
|
|
|
const _this = this
|
|
|
_this.isLoadMore = true
|
|
|
|
|
|
const taskType = this.$store.state.user.userInfo.produceGroupType
|
|
|
const params = {
|
|
|
pageNo: this.pageNo,
|
|
|
pageSize: this.pageSize,
|
|
|
taskType,
|
|
|
status: this.status
|
|
|
}
|
|
|
taskListApi(params).then(res => {
|
|
|
const { code, data, msg } = res
|
|
|
if (data.list.length) {
|
|
|
data.list.forEach(e => {
|
|
|
e.status = this.status
|
|
|
})
|
|
|
this.dataList.push(...data.list)
|
|
|
|
|
|
if (data.list < this.pageSize) {
|
|
|
this.loadStatus = 'nomore'
|
|
|
this.isLoadMore = true
|
|
|
|
|
|
} else {
|
|
|
this.isLoadMore = false
|
|
|
}
|
|
|
} else {
|
|
|
this.isLoadMore = true
|
|
|
this.loadStatus = 'nomore'
|
|
|
}
|
|
|
}).catch(error => {
|
|
|
this.isLoadMore = false
|
|
|
if (this.pageNo >1) {
|
|
|
this.pageNo -=1
|
|
|
}
|
|
|
reject(error)
|
|
|
})
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
.task-list {
|
|
|
.menu {
|
|
|
margin: 10px 14px;
|
|
|
}
|
|
|
|
|
|
.search {
|
|
|
margin: 10px 4px;
|
|
|
}
|
|
|
|
|
|
.dataList {
|
|
|
width: 100%;
|
|
|
}
|
|
|
}
|
|
|
</style> |