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.
147 lines
3.6 KiB
147 lines
3.6 KiB
<template>
|
|
<view class="container">
|
|
<!-- 导航栏 -->
|
|
<u-navbar leftText="返回" title="任务中心" :placeholder="true" leftIconColor=" #409eff" @leftClick="backHomeClick" />
|
|
|
|
<!-- 分段器 -->
|
|
<u-subsection :list="statusList" keyName="label" :current="curNow" @change="sectionChange"></u-subsection>
|
|
|
|
<view class="tasklist">
|
|
<view v-for="item in list" :key="item.id">
|
|
<u-gap height="10" bgColor="#fff"></u-gap>
|
|
<taskcard :info="item" :dict="{'statusMap': statusMap}"></taskcard>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 加载更多 -->
|
|
<u-loadmore :status="loading" :line="true" />
|
|
|
|
<!-- 消息提示 -->
|
|
<u-toast ref="msg"></u-toast>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import taskcard from '@/components/yx-card/taskcard.vue'
|
|
import {
|
|
mapState
|
|
} from 'vuex'
|
|
// import dictData from '@/common/dict.js'
|
|
export default {
|
|
name: "Task",
|
|
components: {
|
|
taskcard
|
|
},
|
|
data() {
|
|
return {
|
|
curNow: 0,
|
|
loading: 'loadmore',
|
|
list: [{
|
|
id: 10001,
|
|
title: "#001任务名称",
|
|
status: 1,
|
|
productName: "xxx产品",
|
|
hours: 80,
|
|
number: 30,
|
|
creator: '管理员',
|
|
createtime: '2023-10-01 09:58:51',
|
|
pointer: '小王',
|
|
finishtime: '2023-10-11 19:58:51',
|
|
}],
|
|
page: 0,
|
|
pageSize: 10
|
|
}
|
|
},
|
|
onLoad() {
|
|
// this.$base.test();
|
|
this.loadData();
|
|
},
|
|
// 上拉触底事件
|
|
onReachBottom() {
|
|
this.loadData();
|
|
},
|
|
methods: {
|
|
backHomeClick() {
|
|
console.log("back home");
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
});
|
|
// uni.navigateBack({
|
|
// delta: 999,
|
|
// success: () => {
|
|
// console.log("success");
|
|
// },
|
|
// fail: (e) => {
|
|
// // console.log(getCurrentPages());
|
|
// console.log(e.errMsg);
|
|
// }
|
|
// });
|
|
},
|
|
sectionChange(index) {
|
|
this.list = [{
|
|
id: 10001,
|
|
title: "#001任务名称",
|
|
status: 1,
|
|
productName: "xxx产品",
|
|
hours: 80,
|
|
number: 30,
|
|
creator: '管理员',
|
|
createtime: '2023-10-01 09:58:51',
|
|
pointer: '小王',
|
|
finishtime: '2023-10-11 19:58:51',
|
|
}];
|
|
this.curNow = index;
|
|
this.loadData();
|
|
},
|
|
loadData() {
|
|
let status = this.statusList[this.curNow].value;
|
|
// console.log(this.statusMap);
|
|
this.mockData();
|
|
},
|
|
mockData() {
|
|
// 模拟数据请求
|
|
if (this.page >= 3) return;
|
|
this.loading = 'loading';
|
|
this.page = ++this.page;
|
|
setTimeout(() => {
|
|
let obj = this.list[0];
|
|
let length = this.page * this.pageSize;
|
|
this.list = this.$base.fillArrayWithObject(obj, length);
|
|
// console.log(this.list);
|
|
if (this.page >= 3) this.loading = 'nomore';
|
|
else this.loading = 'loading';
|
|
}, 2000);
|
|
}
|
|
},
|
|
computed: {
|
|
...mapState('dict', {
|
|
taskStatus: state => state.dictData.taskStatus,
|
|
}),
|
|
statusList() {
|
|
// console.log(this.taskStatus);
|
|
return this.taskStatus;
|
|
},
|
|
statusMap() {
|
|
return this.statusList.reduce((result, item) => {
|
|
result[item.value] = item.label;
|
|
return result;
|
|
}, {});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.tasklist {
|
|
background-color: #f9f9f9;
|
|
// font-family: $custom-ttf;
|
|
|
|
.item {
|
|
padding: 24rpx 0;
|
|
color: $u-content-color;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
</style>
|