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/taskDetail/taskDetail.vue

474 lines
12 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" class="specialPop" @close="close">
<view>
<u-button type="primary" size="small" text="切换账号" @click="changeUser"></u-button>
</view>
</u-popup>
<view style="margin-top:44px;">
<view style="padding:0 24upx;">
<u-cell-group>
<u-cell size="large" center title="炉号" :value="info.heat_num" :titleStyle="{color:'#0076F6'}"></u-cell>
<u-cell size="large" title="不良品选项" center
v-if="contentInfo.rejects!='null'?true:(info.status==3?false:true)"
:disabled="info.status==3?true:false" @click="sheetShow = true">
<view slot="value" style="flex:1;position: relative; " class="u-slot-value">
{{contentInfo.rejects!='null'?contentInfo.rejects:''}}
<u-icon name="arrow-down" :class="!contentInfo.rejects?'isEmpty':'notEmpty'"
color="#333333" size="21"></u-icon>
</view>
</u-cell>
<u-cell size="large" title="不良品数量" center>
<view slot="value" class="u-slot-value">
<u--input
placeholder="请输入不良品数量"
border="none"
style="background: #ffffff;"
:disabled="info.status==3?true:false"
v-model="contentInfo.rejects_num"
clearable
></u--input>
</view>
</u-cell>
<u-cell size="large" :key="index" v-for="(item,index) in contentInfo.content" :titleStyle="{color:'#E03023'}" class="specialLabel" :title="item.key" center :value="item.value"></u-cell>
<u-cell size="large" title="待质检数量" :value="contentInfo.member_num.toString()" center></u-cell>
<u-cell size="large" title="合格数量" center :value="contentInfo.qualified_num.toString()"></u-cell>
<u-cell size="large" title="不合格数量" center :value="contentInfo.no_qualified_num.toString()"></u-cell>
<u-cell size="large" title="状态" center :value="contentInfo.statusName"></u-cell>
<u-cell size="large" title="用时" center :value="contentInfo.use_time"></u-cell>
<u-cell size="large" title="重要提示" :titleStyle="{color:'#E03023'}" center v-if="contentInfo.needing_remake" :value="contentInfo.needing_remake"></u-cell>
<u-cell size="large" title="附件" center>
<view slot="value" class="u-slot-value fujian" @click="downLoad(contentInfo.file)" style="display: flex;align-items: center;">
<image src="../../static/img.png" v-if="contentInfo.file_suffix=='png'" mode=""></image>
<image src="../../static/pdf.png" v-if="contentInfo.file_suffix=='pdf'" mode=""></image>
<!-- <text style="overflow: hidden;width:400upx;text-overflow: ellipsis;">{{contentInfo.file}}</text> -->
<text style="color:#0076F6;text-decoration: underline;margin-left:10upx;">查看</text>
</view>
</u-cell>
<u-cell size="large" title="拍照" center class="img" :border="false">
<view slot="value" class="u-slot-value">
<u-upload
:fileList="fileList"
@afterRead="afterRead"
@delete="deletePic"
name="5"
:disabled="info.status==3?true:false"
:previewFullImage="true"
multiple
:maxCount="3"
></u-upload>
</view>
</u-cell>
</u-cell-group>
</view>
<view class="submitContent" v-if="info.status!=3">
<u--input
placeholder="请输入完成数量"
border="surround"
v-model="num"
:disabled="info.status==3?true:false"
class="input"
shape="circle"
></u--input>
<u-button
:disabled="num?false:true"
@click="submitHandle">确定完成(已用时{{submitTimesNum}}秒)</u-button>
</view>
</view>
<u-popup :show="sheetShow" mode="bottom" class="rejectDialog" @close="rejectHandle">
<view>
<u-checkbox-group
v-model="checkboxValue1"
placement="row"
@change="checkboxChange"
class="checkboxflex"
>
<u-checkbox
:customStyle="{marginBottom: '8px'}"
v-for="(item, index) in checkboxList1"
:key="index"
:label="item.name"
:name="item.name"
>
</u-checkbox>
</u-checkbox-group>
<u-button type="primary" text="确定" @click.native.stop="besure" style="margin-top: 50upx;"></u-button>
</view>
</u-popup>
<u-popup :show="startVisible" mode="center" class="specialPop" :closeOnClickOverlay="false">
<view>
<view style="font-size: 32upx;color:#E03023;text-align: center;">
重要提示
</view>
<view style="font-size: 28upx;color:#333333;margin-top: 30upx;">
{{contentInfo.needing_remake}}
</view>
<u-button type="primary" size="small"
@click="closeHandle"
:text="countDownTime <= 0?'关闭':countDownTime+'s后关闭'"
:disabled="countDownTime <= 0?false:true"
style="margin-top: 50upx;"></u-button>
</view>
</u-popup>
</view>
</template>
<script>
import {getDeails,logout,submitHandle,confirmProcedureHandle} from "@/api/user.js"
export default {
data() {
return {
info:{},
show:false,
contentInfo:{
rejects:'',
rejects_num:0,
statusName:null,
member_num:0,
qualified_num:0,
no_qualified_num:0,
use_time:null,
content:[],
needing_remake:"",
file_suffix:'',
file:''
},
sheetShow:false,
checkboxValue1:[],
checkboxList1: [],
fileList:[],
num:null,
startVisible:false,
timer:null,
countDownTime:4,
submitTimer:null,
submitTimesNum:0
};
},
methods:{
submitHandle(){
console.log(this.fileList)
let imgs = this.fileList.map(item=>{
return item.path
})
console.log(imgs)
let params={
id:this.info.id,
num:this.num,
rejects:this.contentInfo.rejects,
rejects_num:this.contentInfo.rejects_num,
imgs:imgs.join(',')
}
console.log(params)
submitHandle(params).then(res=>{
if(res.code==200){
uni.showToast({
icon: 'none',
mask: true,
title: '操作成功'
})
uni.redirectTo({
url:'/pages/processList/processList?id='+this.info.taskId+'&heat_num=' +this.info.heat_num
})
}
})
},
closeHandle(){
this.startVisible=false;
this.submitTimer = setInterval(() => {
this.submitTimesNum ++;
},1000)
},
uploadFilePromise(url) {
return new Promise((resolve, reject) => {
uni.uploadFile({
url: 'http://aps-api.njrzwl.cn/app/uploadFile',
filePath: url,
name: 'file',
success: res => {
// 这里res是普通对象,但是res.data为JSON字符串,需要转一下
const result = JSON.parse(res.data);
resolve(result);
}
});
});
},
downLoad(item) {
if (this.contentInfo.file_suffix == 'pdf') {
uni.downloadFile({
url: item,
success: (data) => {
if (data.statusCode === 200) {
uni.saveFile({
tempFilePath: data.tempFilePath,
success: function(res) {
uni.showToast({
icon: 'none',
mask: true,
title: '文件已保存' + res.savedFilePath,
duration: 3000
});
setTimeout(() => {
uni.openDocument({
filePath: res.savedFilePath,
success: function(res) {
console.log('文档打开成功')
}
})
}, 3000)
}
})
}
},
fail: () => {
uni.showToast({
icon: 'none',
mask: true,
title: '失败请重新下载'
})
}
});
} else {
uni.previewImage({
urls: [item]
})
}
},
async afterRead(event) {
const item = event.file[0];
const url = item.url;
let result = await this.uploadFilePromise(url);
this.fileList.push({url:result.data.imgUrl,path:result.data.path})
},
deletePic(e) {
this.fileList.splice(e.index, 1);
},
checkboxChange(n) {
this.checkboxValue1 = n
console.log('change', this.checkboxValue1);
},
besure(){
this.contentInfo.rejects = this.checkboxValue1.join(",")
this.sheetShow = false
},
rejectHandle(){
this.sheetShow = false
},
close() {
this.show = false
},
changeUser(){
logout().then(res=>{
console.log(res)
uni.redirectTo({
url: '/pages/login/login'
})
uni.removeStorage({
key: 'userToken'
})
this.$store.commit('logout')
})
},
confirmProcedureHandle(id){
confirmProcedureHandle({id:id}).then(res=>{
if(res.code==200){
this.getDeails(id)
}
})
},
getDeails(id){
getDeails({id:id}).then(res=>{
this.contentInfo.rejects_num = res.data.rejects_num;
this.contentInfo.content = res.data.content
this.contentInfo.member_num = res.data.procedure_member.member_num
this.contentInfo.qualified_num = res.data.procedure_member.qualified_num
this.contentInfo.no_qualified_num = res.data.procedure_member.no_qualified_num
this.contentInfo.file_suffix = res.data.file_suffix
this.contentInfo.file = res.data.file
let status = res.data.procedure_member.status;
switch (status) {
case 0:
this.contentInfo.statusName = '未开始';
break;
case 1:
this.contentInfo.statusName = '待质检';
break;
case 2:
this.contentInfo.statusName = '质检不通过';
break;
case 3:
this.contentInfo.statusName = '已完成';
break;
}
this.contentInfo.use_time = res.data.procedure_member.use_time
this.contentInfo.needing_remake = res.data.needing_remake
this.checkboxList1 = res.data.rejects_list;
if(res.data.rejects!='null'){
res.data.rejects.split(",").forEach(item=>{
this.checkboxValue1.push(item)
})
}
this.contentInfo.rejects = res.data.rejects
if(res.data.procedure_member.imgs_url){
res.data.procedure_member.imgs_url.forEach(i=>{
this.fileList.push({url:i.url,path:i.path})
})
}
if(this.contentInfo.needing_remake&&this.info.status!=3){
this.startVisible = true;
this.timer = setInterval(() => {
this.countDownTime --;
if (this.countDownTime <= 0) {
clearInterval(this.timer);
}
},1000)
}else{
this.submitTimer = setInterval(() => {
this.submitTimesNum ++;
},1000)
}
console.log(this.contentInfo)
})
},
leftClick(){
uni.navigateTo({
url:'/pages/processList/processList?code='+this.info.code+'&id='+this.info.taskId+'&heat_num=' +this.info.heat_num
})
},
},
onLoad(option) {
if(uni.getStorageSync('userToken')){
console.log(option,"0000")
this.info = option
this.confirmProcedureHandle(option.id)
// this.getDeails(option.id)
}else{
uni.redirectTo({
url:'/pages/login/login'
})
}
},
destroyed() {
clearInterval(this.submitTimer)
}
}
</script>
<style lang="scss">
.specialPop{
/deep/.u-popup__content{
border-radius:20upx;
padding:50upx 70upx;
max-width: 60%;
min-width: 30%;
}
}
.rejectDialog{
/deep/.u-popup__content{
border-radius:20upx;
padding:50upx 70upx;
// width: 100%;
}
}
.taskList{
min-height: calc(100vh);
background-color: #ffffff;
/deep/.u-cell__body__content{
flex:none !important;
}
/deep/.u-cell__body{
padding: 24upx 0px;
}
/deep/.u-cell__title{
width:239upx;
}
/deep/.u-cell__title-text{
color:#666666
}
}
.checkboxflex{
display: flex;
justify-content: space-between;
}
.img{
/deep/.u-cell--center{
align-items: flex-start;
}
}
.fujian{
image{
width:50upx;
height: 50upx;
}
}
.submitContent{
padding:20upx 24upx;
background: #FFFFFF;
border: 1px solid #EAEAEA;
box-shadow: 0px -4px 18px 0px rgba(17,21,38,0.06);
.input{
color: #999999;
font-size: 30upx;
/deep/.uni-input-wrapper{
text-align: center;
}
}
button{
height: 80upx;
line-height: 80upx;
background: #0076F6;
border-radius: 45upx;
font-size: 30upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #FFFFFF;
margin-top:20upx;
}
}
.isEmpty{
position:absolute;
top:-11px;
right:0;
}
.notEmpty{
position:absolute;
top:0px;
right:0;
}
.specialLabel /deep/.u-cell__value{
color:#E03023
}
</style>