394 lines
9.4 KiB
Vue
394 lines
9.4 KiB
Vue
<template>
|
||
<view class="deetailPage">
|
||
<headers :showBack="true">
|
||
<view class="headerName">
|
||
进度管理系统
|
||
</view>
|
||
</headers>
|
||
<view class="content">
|
||
<view class="title">
|
||
任务内容
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor"><text class="textFlex">分部分项工程名称：</text> <span class="textStyle">{{itemFrom.taskName}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">区域：<span class="textStyle">{{itemFrom.qualityRegionName}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">计划开始日期：<span class="textStyle">{{itemFrom.startDate}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">计划完成日期：<span class="textStyle">{{itemFrom.finishDate}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">实际开始日期：<span class="textStyle">{{itemFrom.actualStartDate}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">实际完成日期：<span class="textStyle">{{itemFrom.actualFinishDate}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">负责人：<span class="textStyle">{{itemFrom.dutyUserName}}</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">进度：<span class="textStyle">{{itemFrom.progressRatio}}%</span></view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">执行状态：<span
|
||
class="textStyle">{{itemFrom.status==0?'未开始':itemFrom.status==1?'进行中':itemFrom.status==2?'已完成':'已逾期'}}</span>
|
||
</view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">开始预警：<span class="textStyle"
|
||
:class="{'greenText': itemFrom.beginWarning === 1, 'blueText': itemFrom.beginWarning === 2, 'redText': itemFrom.beginWarning === 3}">{{itemFrom.beginWarning==1?'提前':itemFrom.beginWarning==2?'正常':'逾期'}}</span>
|
||
</view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">结束预警：<span class="textStyle"
|
||
:class="{'greenText': itemFrom.endWarning === 1, 'blueText': itemFrom.endWarning === 2, 'redText': itemFrom.endWarning === 3}">{{itemFrom.endWarning==1?'提前':itemFrom.endWarning==2?'正常':'逾期'}}</span>
|
||
</view>
|
||
</view>
|
||
<view class="type">
|
||
<view class="textColor">备注：<span class="textStyle">{{itemFrom.remark}}</span></view>
|
||
</view>
|
||
<view class="title">
|
||
进度记录
|
||
</view>
|
||
<view class="record-content">
|
||
<view class="record-item" v-for="(item,index) in progressRecordList" :key="index" @click="toRecordDetail(item)">
|
||
<image src="@/static/supplierImg/g1.png" mode=""></image>
|
||
<view class="item-text">
|
||
<text>上报人：{{item.uploadUserName || ""}}</text>
|
||
<text>{{item.uploadDate || ""}}</text>
|
||
</view>
|
||
<view class="record-status" :class="item.auditType == 2?'pass-status':item.auditType == 3?'noPass-status':'isPending-status'">
|
||
{{item.auditType == 2
|
||
? "审核通过"
|
||
: item.auditType == 3
|
||
? "已驳回"
|
||
: "审核中"}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="line"></view> -->
|
||
<!-- <view class="title" style="margin-top: 40rpx;">
|
||
材料用量
|
||
</view>
|
||
<view class="container">
|
||
<view class="table-header">
|
||
<view class="header-cell">材料类型</view>
|
||
<view class="header-cell">计划用量</view>
|
||
<view class="header-cell">实际用量</view>
|
||
</view>
|
||
<view class="table-body">
|
||
<view class="table-row" v-for="(item, index) in tableData" :key="index">
|
||
<view class="table-cell" :title="item.name">{{ item.name? (item.name + '('+ item.unit +')') : "" }}</view>
|
||
<view class="table-cell">{{ item.planUsage || "" }}</view>
|
||
<view class="table-cell">{{ item.actualUsage || "" }}</view>
|
||
</view>
|
||
</view>
|
||
</view> -->
|
||
|
||
<view class="closeProgess" v-if="itemFrom.status==2">
|
||
任务已闭合
|
||
</view>
|
||
<view class="addProgess" @click="addProgessBtn"
|
||
v-if="itemFrom.dutyUserId === userInfo.userId && itemFrom.status!==2">
|
||
上报进度
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
progressRecordList: [],
|
||
itemFrom: {},
|
||
userInfo: {},
|
||
tableData: [],
|
||
projectSn: '',
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
this.itemFrom = JSON.parse(option.itemFrom);
|
||
console.log("进入详情",this.itemFrom)
|
||
if (this.itemFrom.status === 0) {
|
||
this.startTask();
|
||
}
|
||
this.userInfo = JSON.parse(uni.getStorageSync('userInfo'));
|
||
this.projectSn = JSON.parse(uni.getStorageSync('projectDetail')).projectSn;
|
||
},
|
||
// onUnload(option) {
|
||
// this.itemFrom = JSON.parse(option.itemFrom);
|
||
// this.userInfo = JSON.parse(uni.getStorageSync('userInfo'));
|
||
// this.projectSn = JSON.parse(uni.getStorageSync('projectDetail')).projectSn;
|
||
// // 进行数据刷新操作，比如重新请求接口获取最新数据
|
||
// this.getMarList();
|
||
// },
|
||
onShow() {
|
||
console.log("返回上传")
|
||
// this.getMarList()
|
||
this.getListDetail()
|
||
this.getProgressRecord();
|
||
},
|
||
methods: {
|
||
// 跳转到记录详情
|
||
toRecordDetail(item){
|
||
uni.navigateTo({
|
||
url: './recordDetail?obj=' + JSON.stringify(item)
|
||
})
|
||
},
|
||
//获取进度记录
|
||
getProgressRecord() {
|
||
let data = {
|
||
taskProgressId: this.itemFrom.id
|
||
}
|
||
this.sendRequest({
|
||
url: 'xmgl/xzTaskProgressContent/list',
|
||
method: 'get',
|
||
data,
|
||
success: res => {
|
||
this.progressRecordList = res.result;
|
||
}
|
||
})
|
||
},
|
||
//点击上报
|
||
addProgessBtn() {
|
||
// uni.navigateTo({
|
||
// url: './addFrom?id=' + this.itemFrom.id
|
||
// })
|
||
uni.navigateTo({
|
||
url: './addFrom?item=' + encodeURIComponent(JSON.stringify(this.itemFrom))
|
||
})
|
||
},
|
||
// 开始任务
|
||
startTask() {
|
||
let data = {
|
||
id: this.itemFrom.id,
|
||
status: 1
|
||
}
|
||
this.sendRequest({
|
||
url: 'xmgl/xzTaskProgress/startTask',
|
||
method: 'post',
|
||
data,
|
||
success: res => {
|
||
console.log("开始任务",res)
|
||
// this.getListDetail()
|
||
this.itemFrom.status = 1
|
||
}
|
||
})
|
||
},
|
||
//获取材料用量
|
||
getMarList() {
|
||
let data = {
|
||
taskProgressId: this.itemFrom.id,
|
||
projectSn: this.projectSn
|
||
}
|
||
this.sendRequest({
|
||
url: 'xmgl/xzTaskProgressMaterialRel/detailList',
|
||
method: 'get',
|
||
data,
|
||
success: res => {
|
||
if (res.result.length > 0) {
|
||
this.tableData = res.result
|
||
}
|
||
|
||
}
|
||
})
|
||
},
|
||
// 获取详情
|
||
getListDetail() {
|
||
let data = {
|
||
id: this.itemFrom.id,
|
||
}
|
||
this.sendRequest({
|
||
url: 'xmgl/xzTaskProgress/queryById',
|
||
method: 'get',
|
||
data,
|
||
success: res => {
|
||
if (res.success) {
|
||
console.log("详情接口", res.result);
|
||
this.itemFrom = res.result
|
||
}
|
||
|
||
}
|
||
})
|
||
},
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less">
|
||
.textColor {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.textFlex{
|
||
width: 55%;
|
||
}
|
||
}
|
||
.content {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 16rpx;
|
||
|
||
.title {
|
||
margin: 20rpx;
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.type {
|
||
color: #9f9f9f;
|
||
margin: 40rpx 20rpx 0 20rpx;
|
||
font-size: 28rpx;
|
||
|
||
.textStyle {
|
||
float: right;
|
||
color: #000;
|
||
}
|
||
|
||
}
|
||
|
||
.record-content{
|
||
.record-item{
|
||
display: flex;
|
||
background-color: #F6F6F6;
|
||
border-radius: 6rpx;
|
||
padding: 15rpx;
|
||
image{
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin-top: 5rpx;
|
||
margin-left: 20rpx;
|
||
margin-right: 70rpx;
|
||
}
|
||
.item-text{
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-right: auto;
|
||
text:nth-child(1){
|
||
margin-bottom: 20rpx;
|
||
}
|
||
}
|
||
.record-status{
|
||
width: 100rpx;
|
||
height: 40rpx;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: white;
|
||
border-radius: 30rpx;
|
||
}
|
||
.pass-status{
|
||
background-color: #5382F6;
|
||
}
|
||
.noPass-status{
|
||
background-color: #EB3B43;
|
||
}
|
||
.isPending-status{
|
||
background-color: #999;
|
||
}
|
||
}
|
||
.record-item:not(:last-child){
|
||
margin-bottom: 40rpx;
|
||
}
|
||
}
|
||
|
||
.line {
|
||
border-bottom: 1px solid #e6e6e6;
|
||
margin-top: 60rpx;
|
||
}
|
||
|
||
.container {
|
||
width: 100%;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
font-size: 28rpx;
|
||
margin-top: 40rpx;
|
||
}
|
||
|
||
.table-header {
|
||
display: flex;
|
||
background-color: #f7f8fa;
|
||
|
||
text-align: center;
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
|
||
}
|
||
|
||
.header-cell {
|
||
flex: 1;
|
||
border: 1px solid #f0f0f0;
|
||
}
|
||
|
||
.table-body {
|
||
display: flex;
|
||
flex-direction: column;
|
||
text-align: center;
|
||
|
||
}
|
||
|
||
.table-row {
|
||
display: flex;
|
||
|
||
height: 70rpx;
|
||
line-height: 70rpx;
|
||
}
|
||
|
||
.table-cell {
|
||
flex: 1;
|
||
border: 1px solid #f0f0f0;
|
||
width: 50rpx;
|
||
white-space: nowrap;
|
||
/* 防止换行 */
|
||
overflow: hidden;
|
||
/* 超出部分隐藏 */
|
||
text-overflow: ellipsis;
|
||
/* 超出部分显示省略号 */
|
||
}
|
||
|
||
.addProgess {
|
||
width: 50%;
|
||
background: #5181f6;
|
||
text-align: center;
|
||
margin: auto;
|
||
height: 60rpx;
|
||
color: #fff;
|
||
border-radius: 40rpx;
|
||
line-height: 60rpx;
|
||
margin-top: 110rpx;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.closeProgess {
|
||
width: 50%;
|
||
text-align: center;
|
||
margin: auto;
|
||
height: 60rpx;
|
||
border-radius: 40rpx;
|
||
line-height: 60rpx;
|
||
margin-top: 110rpx;
|
||
font-size: 28rpx;
|
||
background: #f7f8fa;
|
||
color: #8c8c8c;
|
||
}
|
||
|
||
.greenText {
|
||
color: green !important;
|
||
}
|
||
|
||
.blueText {
|
||
color: #5181f6 !important;
|
||
}
|
||
|
||
.redText {
|
||
color: red !important;
|
||
}
|
||
}
|
||
</style>
|