yxk_h5_master/pages/carUse/addCarUse.vue

632 lines
19 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="page">
<view class="item item_line" style="margin-top: 22upx;">
<view class="itemname">驾驶员</view>
<view class="itemtext">
<input class="iteminput InputRightMargin" placeholder="请填写名称" v-model="workInfo.driver"/>
<!-- <img src="../../static/img/personlistIcon.png" class="dateIcon" /> -->
</view>
</view>
<view class="item ">
<view class="itemname">车号</view>
<view class="itemtext">
<input class="iteminput InputRightMargin" placeholder="请填写车牌号" v-model="workInfo.carNo"/>
</view>
</view>
<view class="item ">
<view class="itemname redMi">公里数</view>
<view class="itemtext">
<input class="iteminput InputRightMargin" placeholder="请填写公里数" v-model="workInfo.distance"/>
</view>
</view>
<view class="item " @click="onShowDatePicker(1)">
<view class="itemname redMi">出发时间</view>
<view class="itemtext">
<view >
<input class="iteminput InputRightMargin" placeholder="请选择出发时间" :value='workInfo.startTime'/>
<img src="../../static/img/dateIcon.png" class="dateIcon" />
</view>
</view>
</view>
<view class="item item_line" @click="onShowDatePicker(2)">
<view class="itemname redMi">预计返回时间</view>
<view class="itemtext">
<view >
<input class="iteminput InputRightMargin" placeholder="请选择预计返回时间" :value='workInfo.backTime'/>
<img src="../../static/img/dateIcon.png" class="dateIcon" />
</view>
</view>
</view>
<view class="item item_line item_textarea">
<view class="itemname redMi">用车事由</view>
<textarea class="textarea" placeholder="请详细描述用车事由" v-model="workInfo.cause" @change='dataChange'></textarea>
</view>
<view class="item item_line item_textarea">
<view class="itemname">目的地</view>
<textarea class="textarea" placeholder="请填写目的地" v-model="workInfo.destination" @change='dataChange'></textarea>
</view>
<!-- <view class="photo_container item_line">
<view class="pzqd">图片</view>
<view class="photo_out">
<view class="imgwrap" v-for="(items,index) in imgsrc_list_local" :key="index">
<view class="myimgBox" @click="reUpload(index)">
<view class="img">
<img class="uploadimg" :src="items" />
<view class="cxsc">重新上传</view>
</view>
</view>
<img src="../../static/img/delete.png" class="deleteimg" @click="deleteImg(index)" />
</view>
<view class="imgwrap" @click="chooseImg()" >
<view class="myimgBox">
<view class="img upload_btn">
<img src="../../static/img/uploadimg.png" />
<view class="sctp">上传图片</view>
</view>
</view>
</view>
</view>
</view> -->
<!-- <view class="item item_line">
<view class="itemname redMi">发给谁</view>
<view class="itemtext" @click="selectPeople()">
<input class="iteminput InputRightMargin" disabled placeholder="选择人员" :value="formatCsrName(targetList)"/>
<img src="../../static/img/personlistIcon.png" class="dateIcon" />
</view>
</view> -->
<view class="fixMargin"></view>
<view class="goHome" @click='goMain("workInfo")'>
<img src="../../static/img/gohome.png">
</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="goAddRepair('zc')" v-if="workInfo.approveState!=0||workInfo.approveState!=-1||workInfo.approveState!=2">暂存</button>
</view>
<view style="-webkit-flex:1;flex: 1;">
<button type="primary" style="width: 90%;" @click="goAddRepair('tj')" :disabled="workInfo.approveState!=0">确认提交</button>
</view>
</view>
</view>
<mx-datepicker type="datetime" :value="value_time" :show="showPicker" @confirm="onSelected" @cancel="onSelected"></mx-datepicker>
<view class="mysearchlist" style="z-index: 10000;">
<chooseUserMulti ref="mysearchlist"
:showsearch.sync="show_search_user"
:itemInfo_.sync="search_value_user">
</chooseUserMulti>
</view>
</view>
</template>
<script>
import { dataToTime } from '@/common/tools.js'
import { getCurrentTime } from '@/common/tools.js'
import { getCurrentDateTime } from '@/common/tools.js'
import {
config
} from '../../request/js/config.js'
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"
import chooseUserMulti from '@/components/xinsoft-search-list/chooseUserMulti.vue'
export default {
components: {
mxDatepicker, mpvuePicker,
uniIcons,chooseUserMulti
},
data() {
return {
config:config,
imgsrc_list: [],
imgsrc_list_local: [],
showPicker: false,
csr:[],
workInfo:{
startTime:'', //开始时间
backTime:'', //结束时间
timeArea:'', //加班时间长
reason:'',
approveState:-1
},
overTimeUser:{},
value_time:'',
index:1,
id:'',
targetList: [],
show_search_user:false,
search_value_user:[],
}
},
onLoad(option) {
var _this = this;
this.id = option.id||'';
//初始化当前 加班人为默认当前登陆人。
var userInfo = uni.getStorageSync('userInfo');
this.overTimeUser = {
userId :userInfo.userId,
name:userInfo.name
}
//如果是编辑,就根据接口获取数据,
if(option.id){
this.$http.request({
url: '/apis/carUse/detail',
method:'GET',
params: {
id:option.id,
},
}).then(res => {
if (res.data.code == 0) {
this.workInfo = res.data.carUseApply;
this.workInfo.carNo = res.data.carUseApply.car_no;
this.workInfo.backTime = res.data.carUseApply.back_time;
this.workInfo.startTime = res.data.carUseApply.start_time;
// this.overTimeUser = {
// userId:workInfos.over_time_user,
// name:workInfos.overTimeUserName
// }
// res.data.approveList.forEach((vals,index)=>{
// var json = {
// user_id:vals.user_id,
// name:vals.name
// }
// this.targetList.push(json);
// });
// for(var i=0;i<res.data.initFileList.length;i++){
// this.imgsrc_list.push(res.data.initFileList[i].filePath);
// this.imgsrc_list_local.push(config.imgURL+res.data.initFileList[i].filePath);
// }
// this.workInfo = {
// startTime:workInfos.begin_time, //开始时间
// backTime:workInfos.end_time, //结束时间
// timeArea:workInfos.time_area, //加班时间长
// reason:workInfos.reason,
// id:this.id,
// process_instance_id:workInfos.process_instance_id
// }
uni.setStorage({
key: 'workInfo',
data: this.workInfo,
success: function () {
}
});
}
}).catch(err => {
uni.showToast({
title: '获取信息失败',
icon: 'none',
duration: 2000
});
});
}else{
//如果不是是新增获取session中的数据。
uni.getStorage({
key: 'workInfo',
success: function (res) {
_this.workInfo = res.data.info||{};
// _this.overTimeUser = res.data.overTimeUser||{};
}
});
}
},
watch:{
search_value_user(newv){
var detail = [];
newv.forEach(item=>{
let obj = {user_id: item.userId, name: item.NAME};
detail.push(obj);
})
if(newv.length>0){
var workInfo = uni.getStorageSync('workInfo');
if(!workInfo){
workInfo = {}
}
this.targetList=detail
workInfo.targetList = this.targetList
uni.setStorage({
key: 'workInfo',
data: workInfo,
success: function () {
}
});
}
}
},
methods: {
getDetail(){
this.$http.request({
url: '/apis/carUse/detail',
method:'GET',
params: {
id:this.id,
},
}).then(res => {
if (res.data.code == 0) {
this.workInfo = res.data.carUseApply;
this.workInfo.carNo = res.data.carUseApply.car_no;
this.workInfo.backTime = res.data.carUseApply.back_time;
this.workInfo.startTime = res.data.carUseApply.start_time;
// this.overTimeUser = {
// userId:workInfos.over_time_user,
// name:workInfos.overTimeUserName
// }
// res.data.approveList.forEach((vals,index)=>{
// var json = {
// user_id:vals.user_id,
// name:vals.name
// }
// this.targetList.push(json);
// });
// for(var i=0;i<res.data.initFileList.length;i++){
// this.imgsrc_list.push(res.data.initFileList[i].filePath);
// this.imgsrc_list_local.push(config.imgURL+res.data.initFileList[i].filePath);
// }
// this.workInfo = {
// startTime:workInfos.begin_time, //开始时间
// backTime:workInfos.end_time, //结束时间
// timeArea:workInfos.time_area, //加班时间长
// reason:workInfos.reason,
// id:this.id,
// process_instance_id:workInfos.process_instance_id
// }
uni.setStorage({
key: 'workInfo',
data: this.workInfo,
success: function () {
}
});
}
}).catch(err => {
uni.showToast({
title: '获取信息失败',
icon: 'none',
duration: 2000
});
});
},
selectPeople(){
this.show_search_user=true;
// uni.navigateTo({
// url: "selectPeople?flag="+flag
// });
},
// formatCsrName(data){
// var returnName = '';
// for(var i=0;i<data.length;i++){
// if(i == 3){
// returnName += data[i].name+'等等';
// break;
// }else{
// returnName += data[i].name+','
// }
// }
// returnName = returnName.substring(0,returnName.length-1);
// return returnName;
// },
//时间选择
onShowDatePicker(n) { //显示
this.showPicker = true;
if(n==1){
this.value_time=this.workInfo.startTime;
}else if(n==2){
this.value_time=this.workInfo.backTime;
}
this.index = n;
},
onSelected(e) { //选择
this.showPicker = false;
var _this = this;
if (e) {
if(this.index==1){
this.workInfo.startTime= e.value+":00";
}else if(this.index==2){
this.workInfo.backTime= e.value+":00";
}
//保存当前修改信息
var workInfo = uni.getStorageSync('workInfo');
if(!workInfo){
workInfo = {}
}
workInfo.info = this.workInfo;
uni.setStorage({
key: 'workInfo',
data: workInfo,
success: function () {
}
});
}
},
dataChange(){
//保存当前修改信息
var workInfo = uni.getStorageSync('workInfo');
if(!workInfo){
workInfo = {}
}
workInfo.info = this.workInfo;
uni.setStorage({
key: 'workInfo',
data: workInfo,
success: function () {
}
});
},
//上传
// chooseImg() {
// this.uploadImg();
// },
// //重新上传
// reUpload(index) {
// this.uploadImg(index);
// },
// uploadImg(indexnum) {
// var _this = this;
// //#ifdef APP-PLUS
// var count_ = 9;
// //#endif
// //#ifndef APP-PLUS
// var count_ = 1;
// //#endif
// if (indexnum != undefined) {
// count_ = 1;
// }
// uni.chooseImage({
// count: count_,
// success: (chooseImageRes) => {
// const tempFilePaths = chooseImageRes.tempFilePaths;
// //#ifdef APP-PLUS
// let imgs = chooseImageRes.tempFilePaths.map((value, index) => {
// return {
// name: "file" + (index + 1), //注意这一行uni的hello的示例中这里为key名+index这样是无法和使用一个固定key名接多个文件的php接口对接上的改为数组下标形式的字符串就解决这个问题了。其效果等同于在html页面上多个同name文件域同时提交表单。
// uri: value
// }
// });
// uni.uploadFile({
// url: config.baseURL + '/apis/file/uploadMulti', //接口地址
// files: imgs,
// fileType: "image",
// name: 'files',
// success: (uploadFileRes) => {
// var arr = [];
// for (var i = 0; i < JSON.parse(uploadFileRes.data).result.length; i++) {
// arr.push(JSON.parse(uploadFileRes.data).result[i].filePath);
// }
// if (indexnum != undefined) { //是重新上传
// _this.imgsrc_list[indexnum] = arr[0]
// _this.imgsrc_list_local[indexnum] = chooseImageRes.tempFilePaths[0]
// } else {
// _this.imgsrc_list = _this.imgsrc_list.concat(arr);
// _this.imgsrc_list_local = _this.imgsrc_list_local.concat(chooseImageRes.tempFilePaths);
// }
// _this.$forceUpdate();
// var workInfo = uni.getStorageSync('workInfo');
// if(!workInfo){
// workInfo = {}
// }
// workInfo.imgsrc_list = _this.imgsrc_list;;
// workInfo.imgsrc_list_local = _this.imgsrc_list_local;
// uni.setStorage({
// key: 'workInfo',
// data: workInfo,
// success: function () {
// }
// });
// },
// fail:function(){
// uni.showToast({
// title:'上传图片失败',
// duration: 2000,
// icon:"none"
// });
// }
// });
// //#endif
// //#ifndef APP-PLUS
// uni.uploadFile({
// url: config.baseURL + '/apis/file/upload', //接口地址
// filePath: tempFilePaths[0],
// fileType: "image",
// name: 'file',
// success: (uploadFileRes) => {
// var arr = [];
// if (indexnum != undefined) { //是重新上传
// _this.imgsrc_list[indexnum] =JSON.parse(uploadFileRes.data).filePath;
// _this.imgsrc_list_local[indexnum] = chooseImageRes.tempFilePaths[0];
// } else {
// _this.imgsrc_list.push(JSON.parse(uploadFileRes.data).filePath)
// _this.imgsrc_list_local.push(chooseImageRes.tempFilePaths)
// }
// _this.$forceUpdate();
// var workInfo = uni.getStorageSync('workInfo');
// if(!workInfo){
// workInfo = {}
// }
// workInfo.imgsrc_list = _this.imgsrc_list;;
// workInfo.imgsrc_list_local = _this.imgsrc_list_local;
// uni.setStorage({
// key: 'workInfo',
// data: workInfo,
// success: function () {
// }
// });
// },
// fail:function(){
// uni.showToast({
// title:'上传图片失败',
// duration: 2000,
// icon:"none"
// });
// }
// });
// //#endif
// }
// });
// },
// //删除图片
// deleteImg(index) {
// this.imgsrc_list.splice(index, 1);
// this.imgsrc_list_local.splice(index, 1);
// this.$forceUpdate();
// var workInfo = uni.getStorageSync('workInfo');
// if(!workInfo){
// workInfo = {}
// }
// workInfo.imgsrc_list = this.imgsrc_list;
// workInfo.imgsrc_list_local = this.imgsrc_list_local;
// uni.setStorage({
// key: 'workInfo',
// data: workInfo,
// success: function () {
// }
// });
// },
//点击暂存和确认提交 需要进行的操作。
goAddRepair(flag){
console.log(this.workInfo)
var _this = this;
if(!(this.workInfo && this.workInfo.startTime)){
uni.showToast({
title: '请选择出发时间',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.distance)){
uni.showToast({
title: '请填写公里数',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.backTime)){
uni.showToast({
title: '请选择返回时间',
duration: 2000,
icon:"none"
});
return false;
}
if(dataToTime(this.workInfo.backTime)<=dataToTime(this.workInfo.startTime)) {
uni.showToast({
title: '出发时间不能大于返回时间',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.cause)){
uni.showToast({
title: '请填写用车事由',
duration: 2000,
icon:"none"
});
return false;
}
if(flag == 'tj'){
//提交进行的操作
var url = '/apis/approveFlow/submitApprove'
this.$http.request({
url: url,
data:{
dataType:5,
mainId:this.id,
}
}).then(res=>{
if(res.data.code == 0){
uni.removeStorageSync('workInfo');
uni.showToast({
title: '操作成功',
duration: 1000,
icon:"none"
});
setTimeout( function(){
uni.redirectTo({
url: 'carUse'
});
},1000)
}else{
uni.showToast({
title: res.data.msg,
duration: 2000,
icon:"none"
});
}
}).catch(err=>{
uni.showToast({
title: '操作失败',
duration: 2000,
icon:"none"
});
});
}else if(flag == 'zc'){
//暂存进行的操作。
var url = 'apis/carUse/saveAddAndChange'
this.$http.request({
url: url,
params:{
startTime:this.workInfo.startTime,
backTime:this.workInfo.backTime,
cause:this.workInfo.cause,
destination:this.workInfo.destination,
driver:this.workInfo.driver,
carNo:this.workInfo.carNo,
distance:this.workInfo.distance,
id:this.id
}
}).then(res=>{
if(res.data.code == 0){
if(this.workInfo.approveState==-1){
this.id = res.data.dataId
}
this.getDetail()
}else{
uni.showToast({
title: res.data.msg,
duration: 2000,
icon:"none"
});
}
}).catch(err=>{
uni.showToast({
title: '操作失败',
duration: 2000,
icon:"none"
});
});
}
},
onBackPress(options) { //取消默认的返回事件.用来返回上一页时重新加载页面,删除本地缓存的巡检操作
uni.removeStorageSync('workInfo');
uni.navigateTo({
url: 'carUse'
});
return true;
},
},
}
</script>
<style scoped>
.itemunit{
position: absolute;
right: 0;
top: 0;
height: 92upx;
line-height: 92upx;
color: #999;
font-size: 26upx;
}
</style>