yxk_h5_master/pages/extraWork/addWorkApply.vue

660 lines
19 KiB
Vue
Raw Normal View History

2025-08-28 15:21:09 +08:00
<template>
<view class="page">
<view class="item item_line" style="margin-top: 22upx;">
<view class="itemname redMi">加班人</view>
<view class="itemtext">
<input class="iteminput InputRightMargin" disabled placeholder="请选择加班人" :value="overTimeUser.name"/>
<!-- <input class="iteminput InputRightMargin" disabled placeholder="请选择加班人" @click="selectPeople('jbr')" :value="overTimeUser.name"/> -->
<img src="../../static/img/personlistIcon.png" class="dateIcon" />
</view>
</view>
<view class="item " @click="onShowDatePicker(1)">
<view class="itemname redMi">开始时间</view>
<view class="itemtext">
<view >
<input class="iteminput InputRightMargin" disabled placeholder="请选择开始时间" :value='workInfo.beginTime'/>
<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" disabled placeholder="请选择结束时间" :value='workInfo.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="workInfo.timeArea" @change='dataChange'/>
<view class="itemunit">小时</view>
</view>
</view>
<view class="item item_line item_textarea">
<view class="itemname redMi">加班原因</view>
<textarea class="textarea" placeholder="请详细描述加班原因" v-model="workInfo.reason" @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==-1||workInfo.approveState==0||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:{
beginTime:'', //开始时间
endTime:'', //结束时间
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/overTimeApply/detail',
method:'GET',
params: {
id:option.id,
},
}).then(res => {
if (res.data.code == 0) {
var workInfos = res.data.overTimeApply;
// 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 = {
beginTime:workInfos.begin_time, //开始时间
endTime:workInfos.end_time, //结束时间
timeArea:workInfos.time_area, //加班时间长
reason:workInfos.reason,
id:this.id,
approveState:workInfos.approveState,
process_instance_id:workInfos.process_instance_id
}
uni.setStorage({
key: 'workInfo',
data: {
info:this.workInfo,
imgsrc_list:this.imgsrc_list,
imgsrc_list_local:this.imgsrc_list_local,
targetList:this.targetList,
overTimeUser:this.overTimeUser
},
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||{};
_this.targetList = res.data.targetList||[];
_this.imgsrc_list = res.data.imgsrc_list||[];
_this.imgsrc_list_local = res.data.imgsrc_list_local||[];
}
});
}
},
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/overTimeApply/detail',
method:'GET',
params: {
id:this.id
},
}).then(res => {
if (res.data.code == 0) {
var workInfos = res.data.overTimeApply;
// 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 = {
beginTime:workInfos.begin_time, //开始时间
endTime:workInfos.end_time, //结束时间
timeArea:workInfos.time_area, //加班时间长
reason:workInfos.reason,
id:this.id,
approveState:workInfos.approveState,
process_instance_id:workInfos.process_instance_id
}
uni.setStorage({
key: 'workInfo',
data: {
info:this.workInfo,
imgsrc_list:this.imgsrc_list,
imgsrc_list_local:this.imgsrc_list_local,
targetList:this.targetList,
overTimeUser:this.overTimeUser
},
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.beginTime;
}else if(n==2){
this.value_time=this.workInfo.endTime;
}
this.index = n;
},
onSelected(e) { //选择
this.showPicker = false;
var _this = this;
if (e) {
if(this.index==1){
this.workInfo.beginTime= e.value+":00";
}else if(this.index==2){
this.workInfo.endTime= 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){
var _this = this;
//在这里是抄送人数据。
var carbonCopyRecipients = []
if(this.targetList.length>0){
this.targetList.forEach((vals,index)=>{
carbonCopyRecipients.push(vals.user_id);
});
}
if(!(this.overTimeUser)){
uni.showToast({
title: '请选择加班人',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.beginTime)){
uni.showToast({
title: '请填写开始时间',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.endTime)){
uni.showToast({
title: '请选择结束时间',
duration: 2000,
icon:"none"
});
return false;
}
if(dataToTime(this.workInfo.endTime)<=dataToTime(this.workInfo.beginTime)) {
uni.showToast({
title: '开始时间不能大于结束时间',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.timeArea)){
uni.showToast({
title: '请填写加班时长',
duration: 2000,
icon:"none"
});
return false;
}
if(!(this.workInfo && this.workInfo.reason)){
uni.showToast({
title: '请填写加班原因',
duration: 2000,
icon:"none"
});
return false;
}
// if(!(this.targetList && this.targetList.length>0)){
// uni.showToast({
// title: '请选择发给谁',
// duration: 2000,
// icon:"none"
// });
// return false;
// }
var workInfom = uni.getStorageSync('workInfo');
if(flag == 'tj'){
//提交进行的操作
var url = '/apis/approveFlow/submitApprove'
this.$http.request({
url:url,
data:{
dataType:7,
mainId:workInfom.info.id,
}
}).then(res=>{
if(res.data.code == 0){
uni.removeStorageSync('workInfo');
uni.showToast({
title: '操作成功',
duration: 1000,
icon:"none"
});
setTimeout( function(){
uni.redirectTo({
url: 'extraWork'
});
},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/overTimeApply/tempSaveAndSaveChange'
//调取接口进行保存。
this.$http.request({
url: url,
params:{
dataType:7,
mainId:workInfom.info.id,
beginTime:this.workInfo.beginTime,
endTime:this.workInfo.endTime,
reason:this.workInfo.reason,
timeArea:this.workInfo.timeArea,
overTimeUser:this.overTimeUser.userId,
processInstanceId:workInfom.info.process_instance_id||'',
newApproveList:carbonCopyRecipients,
taglocationappearanceImage:this.imgsrc_list,
id:workInfom.info.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: 'extraWork'
});
return true;
},
}
</script>
<style scoped>
.itemunit{
position: absolute;
right: 0;
top: 0;
height: 92upx;
line-height: 92upx;
color: #999;
font-size: 26upx;
}
</style>