yxk_h5_master/pages/eqUpkeep/keepStep1.vue

338 lines
7.3 KiB
Vue
Raw Permalink Normal View History

2025-08-28 15:21:09 +08:00
<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>