338 lines
7.3 KiB
Vue
338 lines
7.3 KiB
Vue
|
<template>
|
|||
|
<view class="content">
|
|||
|
<view class="step_num">
|
|||
|
<view class="step step1">完善保养项目</view>
|
|||
|
<view class="step step2">确认备件使用情况</view>
|
|||
|
<view class="step step3">保养总结</view>
|
|||
|
</view>
|
|||
|
<view class="project_container">
|
|||
|
<view class="myContentBox myContainer" v-for="(items,index) in details" :key="index">
|
|||
|
<view class="top_container detail_list_top">
|
|||
|
<view class="report_status">保养项目-{{items.code}}</view>
|
|||
|
<view class="edit" @click="edit(index)">编辑</view>
|
|||
|
</view>
|
|||
|
<view style="clear: both;">
|
|||
|
<view class="multi_list_item">
|
|||
|
<view class="list_item">
|
|||
|
<view class="list_item_name">项目:</view>
|
|||
|
<view class="list_item_content">{{items.name}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="multi_list_item">
|
|||
|
<view class="list_item list_item-">
|
|||
|
<view class="list_item_name">工时:</view>
|
|||
|
<view class="list_item_content">{{items.manhour}}小时</view>
|
|||
|
</view>
|
|||
|
<view class="list_item list_item-">
|
|||
|
<view class="list_item_name">结果:</view>
|
|||
|
<view class="list_item_content" v-if="items.result==1">通过</view>
|
|||
|
<view class="list_item_content" v-else-if="items.result=='0'">不通过</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="multi_list_item">
|
|||
|
<view class="list_item list_item-">
|
|||
|
<view class="list_item_name">保养工时费:</view>
|
|||
|
<view class="list_item_content" style="padding-left: 180upx;">{{items.manHourCost || 0}}元</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="multi_list_item">
|
|||
|
<view class="list_item">
|
|||
|
<view class="list_item_name">方法:</view>
|
|||
|
<view class="list_item_content" >{{items.function}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="list_item" >
|
|||
|
<view class="list_item_name" >备注:</view>
|
|||
|
<view class="list_item_content">{{items.remark}}</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="next" @click="toNext()">下一步</view>
|
|||
|
<view class="goHome" @click='goMain()'>
|
|||
|
<img src="../../static/img/gohome.png">
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
<script>
|
|||
|
import {mapState,mapMutations} from 'vuex'
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
id: '',
|
|||
|
details:[]
|
|||
|
}
|
|||
|
},
|
|||
|
computed: {
|
|||
|
...mapState(['keepDetails'])
|
|||
|
},
|
|||
|
onLoad(option) {
|
|||
|
this.id = option.id;
|
|||
|
if(this.id==undefined){
|
|||
|
uni.reLaunch({
|
|||
|
url: 'eqUpkeep'
|
|||
|
});
|
|||
|
return false;
|
|||
|
}
|
|||
|
|
|||
|
var _this = this;
|
|||
|
this.$http.request({
|
|||
|
url: '/apis/upkeepPlan/oneRecordDetail',
|
|||
|
params: {
|
|||
|
recordId: option.id
|
|||
|
},
|
|||
|
}).then(res => {
|
|||
|
if (res.data.code == 0) {
|
|||
|
if(this.keepDetails.keepDetails==undefined){
|
|||
|
if(res.data.data && res.data.data.project.length>0){
|
|||
|
_this.details = res.data.data.project;
|
|||
|
_this.setkeepDetails({id:_this.id,keepDetails:_this.details});
|
|||
|
|
|||
|
var listCards=this.formaterData(res.data.data.part);
|
|||
|
this.setkeepPartList({
|
|||
|
id:_this.id,
|
|||
|
keepPartList:listCards
|
|||
|
});
|
|||
|
}
|
|||
|
}else if(this.keepDetails.id==this.id){
|
|||
|
this.details = this.keepDetails.keepDetails
|
|||
|
this.$forceUpdate();
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
}).catch(err => {
|
|||
|
console.log(err)
|
|||
|
});
|
|||
|
},
|
|||
|
|
|||
|
methods:{
|
|||
|
...mapMutations(['setkeepDetails','setkeepPartList']),
|
|||
|
toNext(){
|
|||
|
uni.navigateTo({
|
|||
|
url: "keepStep2?id="+this.id
|
|||
|
});
|
|||
|
},
|
|||
|
//编辑
|
|||
|
edit(index){
|
|||
|
uni.redirectTo({
|
|||
|
url: "keepEdit?id="+this.id+'&index='+index
|
|||
|
});
|
|||
|
},
|
|||
|
formaterData(data){
|
|||
|
var resData = [];
|
|||
|
data.forEach((vals,index)=>{
|
|||
|
var combineJSON = {
|
|||
|
id: vals.part_id,
|
|||
|
title: vals.spartName,
|
|||
|
titleNumber:'['+vals.code+']',
|
|||
|
contentList: [
|
|||
|
{
|
|||
|
id:1,
|
|||
|
isDouble:true,
|
|||
|
labelName:'规格型号',
|
|||
|
labelContent:vals.type
|
|||
|
},
|
|||
|
{
|
|||
|
id:2,
|
|||
|
isDouble:true,
|
|||
|
labelName:'库位',
|
|||
|
labelContent:vals.locationName
|
|||
|
}
|
|||
|
],
|
|||
|
price:vals.price,
|
|||
|
amount:vals.spart_amount,
|
|||
|
spart_sum:vals.spart_sum
|
|||
|
}
|
|||
|
resData.push(combineJSON);
|
|||
|
});
|
|||
|
return resData;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style scoped>
|
|||
|
.content {
|
|||
|
position: relative;
|
|||
|
min-height: 100%;
|
|||
|
overflow: auto;
|
|||
|
padding-bottom: 140upx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.step_num {
|
|||
|
display: flex;
|
|||
|
flex-direction: row;
|
|||
|
justify-content: center;
|
|||
|
width: 100%;
|
|||
|
height: 80upx;
|
|||
|
background-color: #fff;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.step {
|
|||
|
position: relative;
|
|||
|
font-size: 28upx;
|
|||
|
line-height: 80upx;
|
|||
|
padding-left: 30upx;
|
|||
|
float: left;
|
|||
|
}
|
|||
|
|
|||
|
.step:before {
|
|||
|
position: absolute;
|
|||
|
left: 0px;
|
|||
|
content: '1';
|
|||
|
border: 1px solid #000;
|
|||
|
width: 28upx;
|
|||
|
height: 28upx;
|
|||
|
box-sizing: border-box;
|
|||
|
line-height: 28upx;
|
|||
|
border-radius: 200upx;
|
|||
|
font-size: 20upx;
|
|||
|
text-align: center;
|
|||
|
top: 26upx;
|
|||
|
}
|
|||
|
|
|||
|
.step:after {
|
|||
|
position: absolute;
|
|||
|
content: '';
|
|||
|
width: 30upx;
|
|||
|
height: 2upx;
|
|||
|
background-color: #000;
|
|||
|
top: 40upx;
|
|||
|
left: 200upx;
|
|||
|
}
|
|||
|
|
|||
|
.step2 {
|
|||
|
margin-left: 34upx;
|
|||
|
color: #828282;
|
|||
|
}
|
|||
|
|
|||
|
.step2:before {
|
|||
|
content: '2';
|
|||
|
border: 2upx solid #828282;
|
|||
|
}
|
|||
|
|
|||
|
.step2:after,
|
|||
|
.step3:after {
|
|||
|
left: 250upx;
|
|||
|
background-color: #828282;
|
|||
|
}
|
|||
|
|
|||
|
.step3 {
|
|||
|
margin-left: 34upx;
|
|||
|
color: #828282;
|
|||
|
}
|
|||
|
|
|||
|
.step3:before {
|
|||
|
content: '3';
|
|||
|
border: 2upx solid #828282;
|
|||
|
}
|
|||
|
.step3:after {
|
|||
|
background-color: transparent;
|
|||
|
}
|
|||
|
|
|||
|
.project_container {
|
|||
|
position: relative;
|
|||
|
margin-top: 20upx;
|
|||
|
overflow: auto;
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
.top_container {
|
|||
|
position: relative;
|
|||
|
width: 100%;
|
|||
|
background-color: #fff;
|
|||
|
padding: 30upx 30upx 30upx 30upx;
|
|||
|
box-sizing: border-box;
|
|||
|
color: #333;
|
|||
|
box-shadow: 2px 2px 20upx rgba(0, 0, 0, 0.1);
|
|||
|
}
|
|||
|
|
|||
|
.detail_list_top {
|
|||
|
border-bottom: 1px solid #EDEDED;
|
|||
|
box-shadow: none;
|
|||
|
padding-right: 100upx;
|
|||
|
}
|
|||
|
.edit{
|
|||
|
position: absolute;
|
|||
|
font-size: 28upx;
|
|||
|
color: #3382FF;
|
|||
|
right: 30upx;
|
|||
|
top: 30upx;
|
|||
|
|
|||
|
}
|
|||
|
.report_status {
|
|||
|
line-height: 40upx;
|
|||
|
word-break: break-all;
|
|||
|
font-size: 28upx;
|
|||
|
}
|
|||
|
|
|||
|
.detail_list{
|
|||
|
position: relative;
|
|||
|
background-color: #fff;
|
|||
|
width: 90%;
|
|||
|
margin: auto;
|
|||
|
box-shadow: 1px 1px 20upx rgba(0,0,0,0.1);
|
|||
|
margin-bottom: 30upx;
|
|||
|
overflow: auto;
|
|||
|
}
|
|||
|
.list_item {
|
|||
|
position: relative;
|
|||
|
width: 100%;
|
|||
|
min-height: 70upx;
|
|||
|
padding: 0 30upx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.multi_list_item {
|
|||
|
position: relative;
|
|||
|
overflow: auto;
|
|||
|
}
|
|||
|
|
|||
|
.list_item- {
|
|||
|
width: 50%;
|
|||
|
float: left;
|
|||
|
}
|
|||
|
|
|||
|
.list_item_name {
|
|||
|
position: absolute;
|
|||
|
left: 30upx;
|
|||
|
font-size: 28upx;
|
|||
|
color: #999;
|
|||
|
line-height: 70upx;
|
|||
|
/* width: 120upx; */
|
|||
|
}
|
|||
|
|
|||
|
/* .list_item- .list_item_name {
|
|||
|
width: 120upx ;
|
|||
|
} */
|
|||
|
|
|||
|
.list_item_content {
|
|||
|
position: relative;
|
|||
|
padding: 0 0 0 140upx;
|
|||
|
font-size: 28upx;
|
|||
|
line-height: 70upx;
|
|||
|
color: #333;
|
|||
|
overflow: hidden;
|
|||
|
height: 70upx;
|
|||
|
text-overflow: ellipsis;
|
|||
|
white-space: nowrap
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.next {
|
|||
|
position: absolute;
|
|||
|
left: 5%;
|
|||
|
bottom: 15px;
|
|||
|
width: 90%;
|
|||
|
height: 82upx;
|
|||
|
border-radius: 5px;
|
|||
|
text-align: center;
|
|||
|
color: #fff;
|
|||
|
line-height: 82upx;
|
|||
|
background-color: #3382FF;
|
|||
|
|
|||
|
}
|
|||
|
</style>
|