393 lines
9.9 KiB
Vue
393 lines
9.9 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="item ">
|
|
<view class="itemname">计划开始时间</view>
|
|
<view class="itemtext">
|
|
<view >
|
|
<input class="iteminput InputRightMargin" disabled placeholder="请选择时间" :value='startTime'/>
|
|
<img src="../../static/img/dateIcon.png" class="dateIcon" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="item" >
|
|
<view class="itemname">计划结束时间</view>
|
|
<view class="itemtext">
|
|
<view >
|
|
<input class="iteminput InputRightMargin" disabled placeholder="请选择时间" :value='endTime'/>
|
|
<img src="../../static/img/dateIcon.png" class="dateIcon" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="item item_line">
|
|
<view class="itemname redMi">保养总用时</view>
|
|
<view class="itemtext">
|
|
<input class="iteminput timeRightMargin" type="number" placeholder="请输入工时" v-model="manHour"/>
|
|
<view class="itemunit">小时</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item item_line">
|
|
<view class="itemname redMi">停机时间</view>
|
|
<view class="itemtext">
|
|
<input class="iteminput timeRightMargin" type="number" placeholder="请输入工时" v-model="offHour"/>
|
|
<view class="itemunit">小时</view>
|
|
</view>
|
|
</view>
|
|
<view class="item item_line">
|
|
<view class="itemname redMi">使用状况</view>
|
|
<view class="itemtext">
|
|
<input class="iteminput InputRightMargin" disabled @click="showSinglePicker" :value="result.level_label" />
|
|
<uni-icons type="arrowright" class="myarrowright"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view class="item item_line item_textarea">
|
|
<view class="itemname">保养总结</view>
|
|
<textarea class="textarea" placeholder="请输入保养总结" v-model="cause"></textarea>
|
|
</view>
|
|
<view class="fixMargin"></view>
|
|
<view class="fixBottom">
|
|
<view class="uni-flex uni-row">
|
|
<view style="-webkit-flex:1;flex: 1;">
|
|
<button type="primary" plain="true" style="width: 90%; background: #fff;" @click="toPrevious()">上一步</button>
|
|
</view>
|
|
<view style="-webkit-flex:1;flex: 1;">
|
|
<button type="primary" style="width: 90%;" @click="toNext()">完成</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<mx-datepicker type="datetime" :value="value_time" :show="showPicker" @confirm="onSelected" @cancel="onSelected"></mx-datepicker>
|
|
<mpvue-picker ref="mpvuePicker" mode="selector" :deepLength="deepLength"
|
|
@onConfirm="pickerConfirm" :pickerValueArray="resultArray"></mpvue-picker>
|
|
<view class="goHome" @click='goMain()'>
|
|
<img src="../../static/img/gohome.png">
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import {mapState,mapMutations} from 'vuex'
|
|
import devBlock from '@/components/xinsoft-dev-block/xinsoft-dev-block.vue'
|
|
import mpvuePicker from '@/components/mpvue-picker/mpvuePicker.vue';
|
|
import mxDatepicker from '@/components/mx-datepicker/mx-datepicker.vue'
|
|
import uniIcons from '@/components/uni-icons/uni-icons.vue'
|
|
export default {
|
|
components: {
|
|
devBlock,mxDatepicker,mpvuePicker,
|
|
uniIcons
|
|
},
|
|
data() {
|
|
return {
|
|
id: '',
|
|
record: {},
|
|
value_time:'',
|
|
showPicker: false,
|
|
startTime:'',
|
|
endTime:'',
|
|
nextTime:'',
|
|
manHour:'',
|
|
cause:'',
|
|
offHour:'',
|
|
deepLength:1,
|
|
resultArray:[],
|
|
result:{
|
|
level_value:'',
|
|
level_label:''
|
|
},
|
|
pickerValueDefault:[0]
|
|
}
|
|
},
|
|
computed: {
|
|
...mapState(['keepDetails']),
|
|
...mapState(['keepPartList'])
|
|
},
|
|
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(res.data.data && res.data.data.record.length>0){
|
|
this.record = res.data.data.record[0];
|
|
this.startTime = this.record.planStarttime;
|
|
this.endTime = this.record.planendtime;
|
|
}
|
|
}
|
|
}).catch(err => {
|
|
console.log(err)
|
|
});
|
|
|
|
//初始化使用状态
|
|
this.$http.request({
|
|
url: '/apis/dict/getDictsByType',
|
|
params: {
|
|
type: 'device_status'
|
|
},
|
|
}).then(res=>{
|
|
if(res.statusCode == '200'){
|
|
var useType = res.data.datas;
|
|
for (let i = 0; i < useType.length; i++) {
|
|
var myVal=
|
|
{
|
|
'label': useType[i].name,
|
|
'value': useType[i].id
|
|
}
|
|
_this.resultArray.push(myVal);
|
|
}
|
|
if(!_this.result.level_value){
|
|
_this.result.level_value = useType[0].id;
|
|
_this.result.level_label = useType[0].name;
|
|
}
|
|
}
|
|
}).catch(err=>{
|
|
console.log(err);
|
|
});
|
|
},
|
|
|
|
methods:{
|
|
...mapMutations(['setkeepPartList']),
|
|
...mapMutations(['setkeepDetails']),
|
|
toPrevious() {
|
|
uni.navigateTo({
|
|
url: "keepStep2?id="+this.id
|
|
});
|
|
},
|
|
pickerConfirm(e){
|
|
this.result.level_label = e.label;
|
|
this.result.level_value = e.value[0];
|
|
},
|
|
showSinglePicker() {
|
|
this.pickerValueDefault = [0];
|
|
this.$refs.mpvuePicker.show();
|
|
},
|
|
onShowDatePicker(n) { //显示
|
|
this.time_index=n;
|
|
if(n==1){
|
|
this.value_time=this.startTime;
|
|
}else if(n==2){
|
|
this.value_time=this.endTime;
|
|
}else if(n==3){
|
|
this.value_time=this.nextTime;
|
|
}
|
|
this.showPicker = true;
|
|
},
|
|
onSelected(e) { //选择
|
|
this.showPicker = false;
|
|
if (e) {
|
|
if(this.time_index==1){
|
|
this.startTime = e.value+":00";
|
|
}else if(this.time_index==2){
|
|
this.endTime = e.value+":00";
|
|
}else if(this.time_index==3){
|
|
this.nextTime = e.value+":00";
|
|
}
|
|
}
|
|
},
|
|
|
|
toNext:function(){
|
|
var _this = this;
|
|
//处理数据 提交 。并且跳转到detail界面。
|
|
var myData = {
|
|
"record_id":this.id,
|
|
"man_hour":parseFloat(this.manHour),
|
|
"content":this.cause,
|
|
"down_hour":parseFloat(this.offHour),
|
|
"status":parseInt(this.result.level_value)
|
|
}
|
|
var keepDetails = [];
|
|
var manHourCost = 0;
|
|
if(this.keepDetails && this.keepDetails.keepDetails){
|
|
this.keepDetails.keepDetails.forEach((vals,index)=>{
|
|
var json = {
|
|
"projectId":vals.proId,
|
|
"manhour":parseInt(vals.manhour)||0,
|
|
"result":vals.result||0,
|
|
"remark":vals.remark||'',
|
|
"manHourCost":parseFloat(vals.manHourCost)||0
|
|
}
|
|
keepDetails.push(json);
|
|
manHourCost += parseFloat(vals.manHourCost||0);
|
|
});
|
|
}
|
|
var keepPartList = [];
|
|
var cost = 0;
|
|
if(this.keepPartList&& this.keepPartList.keepPartList){
|
|
this.keepPartList.keepPartList.forEach((vals,index)=>{
|
|
var json = {
|
|
"partId":vals.id,
|
|
"spart_amount":parseInt(vals.amount),
|
|
"spart_sum":parseInt(vals.amount)*parseFloat(vals.price),
|
|
"remark":'',
|
|
"spartPrice":parseFloat(vals.price)
|
|
}
|
|
keepPartList.push(json);
|
|
cost += parseFloat(vals.spart_sum||0);
|
|
});
|
|
}
|
|
|
|
myData.projectArray = encodeURIComponent(JSON.stringify({
|
|
"dataList":keepDetails
|
|
}));
|
|
myData.partArray = encodeURIComponent(JSON.stringify({
|
|
"dataList":keepPartList
|
|
}));
|
|
myData.manHourCost = manHourCost;
|
|
myData.cost = cost;
|
|
if (myData.man_hour== '') {
|
|
uni.showToast({
|
|
title: '请填写保养工时',
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
return false;
|
|
}
|
|
this.$http.request({
|
|
url: '/apis/upkeepPlan/sbumitRecordDetail',
|
|
params: myData,
|
|
}).then(res => {
|
|
_this.setkeepDetails({});
|
|
_this.setkeepPartList({});
|
|
// console.log(res)
|
|
if (res.data.code == 0) {
|
|
uni.showToast({
|
|
title: '提交成功',
|
|
icon: 'none',
|
|
duration: 1000
|
|
});
|
|
setTimeout(function(){
|
|
uni.navigateTo({
|
|
url: "upkeepDetail?id="+_this.id
|
|
});
|
|
},1000)
|
|
|
|
}else{
|
|
uni.showToast({
|
|
title: res.data.msg||'提交失败，请稍后重试',
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
}
|
|
}).catch(err => {
|
|
uni.showToast({
|
|
title: '提交失败，请稍后重试',
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page {
|
|
background-color: #f5f7f5;
|
|
}
|
|
</style>
|
|
<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: #000;
|
|
}
|
|
|
|
.step2:before {
|
|
content: '2';
|
|
border: 2upx solid #828282;
|
|
}
|
|
|
|
.step2:after,
|
|
.step3:after {
|
|
left: 250upx;
|
|
}
|
|
|
|
.step3:after {
|
|
background-color: #000;
|
|
}
|
|
.step3 {
|
|
margin-left: 34upx;
|
|
color: #000;
|
|
}
|
|
|
|
.step3:before {
|
|
content: '3';
|
|
border: 2upx solid #000;
|
|
}
|
|
.step3:after {
|
|
background-color: transparent;
|
|
}
|
|
.itemunit{
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
height: 92upx;
|
|
line-height: 92upx;
|
|
color: #999;
|
|
font-size: 26upx;
|
|
}
|
|
|
|
</style>
|