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.
 
 
 
gongdan/pages/processList/processList.vue

224 lines
4.7 KiB

<template>
<view class="taskList">
<!-- -->
<u-navbar
title="工序列表"
@leftClick="leftClick"
:safeAreaInsetTop="false"
>
<view class="u-nav-slot" slot="right" @click="show = true">
...
</view>
</u-navbar>
<u-popup :show="show" mode="center" @close="close">
<view>
<u-button type="primary" size="small" text="切换账号" @click="changeUser"></u-button>
</view>
</u-popup>
<view v-if="progressList.length!=0" style="margin-top:44px;">
<view class="taskItem" v-for="(item,index) in progressList" :key="index">
<!-- <view class="title">工序号{{index+1}}</view> -->
<view class="item">
<view class=" rowItem">
<!-- <view>
工序号{{index+1}}
</view> -->
<view>
名称{{item.name}}
</view>
</view>
<view class="code rowItem">
<view>
编码{{info.code?info.code:'-'}}
</view>
<view class="right">
数量{{item.num}}
</view>
</view>
<view class="rowItem">
<view :class="item.status == 1?'status unfinish right':item.status == 2?'status right':'status right finish'">
状态<text>{{ item.status == 1 ? '未完成' : (item.status == 2 ? '进行中' : '已完成')}}</text>
</view>
<view class="lookdetails right" @click="goProgress(item)" v-if="item.is_info == 1&&item.is_start == 1">
开始
</view>
</view>
</view>
</view>
</view>
<view v-else class="empty-list">
<view class="empty-list-content">
<image src="/static/list-empty.png"></image>
<p class="empty-list-text">暂无数据</p>
</view>
</view>
</view>
</template>
<script>
import {getList,logout} from "@/api/user.js"
export default {
data() {
return {
pageNum:1,
pageSize:5,
progressList:[],//展示的数据
allList:[],
show:false,
info:{},
total:0
};
},
methods:{
leftClick(){
uni.reLaunch({
url:'/pages/taskList/taskList'
})
},
close() {
this.show = false
},
getData(){
getList({task_id:this.info.id}).then(res=>{
this.allList = res.data.list
this.total = res.data.total;
this.progressList = this.allList.slice(this.pageNum-1,this.pageSize)
})
},
changeUser(){
logout().then(res=>{
console.log(res)
uni.redirectTo({
url: '/pages/login/login'
})
uni.removeStorage({
key: 'userToken'
})
this.$store.commit('logout')
})
},
goProgress(item){
uni.navigateTo({
url:'/pages/taskDetail/taskDetail?id='+item.id + '&status='+item.status + '&is_start='+ item.is_start +'&heat_num=' +this.info.heat_num +'&taskId='+this.info.id+'&code='+this.info.code
})
}
},
onLoad(option) {
if(uni.getStorageSync('userToken')){
console.log("已登录",option);
this.info = option
this.getData()
}else{
uni.redirectTo({
url:'/pages/login/login'
})
}
},
// 触底的事件
onReachBottom() {
if(this.progressList.length<this.total){
this.pageNum ++
if(this.progressList.length<this.total){
let progressList = this.allList.slice((this.pageNum-1)*this.pageSize,this.pageNum*this.pageSize)
this.progressList.push(...progressList)
}
}
}
}
</script>
<style lang="scss">
/deep/.u-popup__content{
border-radius:20upx;
padding:50upx 70upx;
}
.taskList{
min-height: calc(100vh);
background-color: #F7F8FA;
.taskItem{
background: #FFFFFF;
box-shadow: 0upx 4upx 13upx 0upx rgba(17,21,38,0.06);
padding:30upx 25upx;
margin-bottom:20upx;
.title{
font-size: 36upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #333333;
}
.item{
background: #F6F6F6;
border-radius: 4upx;
padding:25upx 20upx;
margin-top:30upx;
.rowItem{
margin-bottom:25upx;
display: flex;
justify-content: space-between;
align-items: center;
}
.code{
font-size: 28upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #333333;
}
.right{
width:171upx;
}
.num{
font-size: 28upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #0DC0F4;
}
.status{
font-size: 28upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #333333;
text{
color:#FFAD0F;
}
}
.unfinish{
text{
color:red !important;
}
}
.finish{
color:#0DC0F4 !important;
text{
color:green !important;
}
}
.planTime{
font-size: 24upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #999999;
}
.lookdetails{
font-size: 24upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #0076F6;
}
}
}
.empty-list{
padding-top:20%;
text-align: center;
}
}
</style>