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.

166 lines
3.6 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<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>