cxc-szcx-uniapp/pages/views/renliziyuan/qingjiaxinxi/application.vue
2025-04-02 21:04:33 +08:00

361 lines
8.7 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="{'gray':store.isgray==1}">
<view class="form">
<view class="f-row aic jcb input_box">
<view class="title">
职工姓名
</view>
<input v-model="realname" disabled />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
工作单位:
</view>
<input v-model="depart" disabled />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
联系方式:
</view>
<input v-model="phone" />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
请假类型:
</view>
<tree-select :dataSource="dataSource" v-model="type" dataValue="name" @change="queryHisDate" />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
请假时间:
</view>
<cxc-szcx-dateRangeSelect mode="range" v-model="rangeDate" :startDate="startDate" :isSearch="false"></cxc-szcx-dateRangeSelect>
</view>
<picker @change="bindType" :value="leaderIndex" :range="leaderArr" range-key="realname">
<view class="f-row aic jcb box">
<view class="title">
{{examineleader}}
</view>
<view class="f-row aic">
<view :class="[{'choose':leaderIndex==null},{'choosed':leaderIndex!=null}]">
{{leaderIndex!=null?leaderArr[leaderIndex].realname:'请选择'}}
</view>
<uni-icons type="bottom" color="#333333"></uni-icons>
</view>
</view>
</picker>
<view class="f-row aic jcb input_box">
<view class="title">
出发地
</view>
<input v-model="departure" placeholder="请输入" nplaceholder-style="font-size: 28rpx;color: #999999;" />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
目的地:
</view>
<input v-model="destination" placeholder="请输入" nplaceholder-style="font-size: 28rpx;color: #999999;" />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
请假事由:
</view>
<input v-model="reason" placeholder="请输入" placeholder-style="font-size: 28rpx;color: #999999;" />
</view>
<view class="f-row aic jcb input_box">
<view class="title">
上传附件:
</view>
<uni-file-picker @select="select" :image-styles="imageStyles" />
</view>
</view>
<view class="btn f-col aic">
<view @click="qjAdd">
提交
</view>
</view>
</view>
</template>
<script setup>
import {
ref,
getCurrentInstance
} from 'vue';
import {
startMutilProcessApi,
getCategoryItemsApi,
} from '@/api/api.js';
import {
qjAddApi,
queryZwmcAndExaApi,
queryHisDateApi
} from '@/api/leaveApi.js';
import {
queryDepByCode,
queryZbDepByLdhth
} from '@/api/depart.js'
import {
onLoad
} from '@dcloudio/uni-app'
import {
useStore
} from '@/store';
import treeSelect from "@/components/treeSelect/treeSelect.vue"
const store = useStore()
const {
proxy
} = getCurrentInstance()
/**职工姓名*/
const realname = ref(store.userinfo.realname)
/**工作单位*/
const depart = ref('')
/**工作单位*/
const orgCode = ref('')
/**联系方式*/
const phone = ref(store.userinfo.phone)
/**请假类型*/
const type = ref('')
const dataSource = ref([])
/**请假时间*/
const rangeDate = ref([null, null])
const startDate = ref('')
/**审批领导*/
const leaderArr = ref([])
const leaderIndex = ref(null)
/**判断显示审批 / 分管领导*/
const examineleader = ref(true)
/**职位层级*/
const zwcj = ref('')
/**出发地*/
const departure = ref('')
/**目的地*/
const destination = ref('')
/**请假事由*/
const reason = ref('')
/**附件路径*/
const path = ref([])
const baseUrl = import.meta.env.VITE_REQUEST_BASE_URL + '/jeecg-boot/sys/common/upload/'
const imageStyles = {
width: 64,
height: 64,
border: {
color: "#dce7e1",
width: 2,
style: 'dashed',
radius: '2px'
}
}
/**返回的最新一条请假结束时间*/
const resDate = ref('')
onLoad(() => {
loadData()
})
const select = (e) => {
const tempFilePaths = e.tempFilePaths
for (let i = 0; i < e.tempFilePaths.length; i++) {
let photoPath = '职工请假/' + depart.value + '/' + store.userinfo.realname
uni.uploadFile({
url: baseUrl,
filePath: e.tempFilePaths[i],
name: 'file',
formData: {
appPath: photoPath
},
success: (res) => {
path.value.push(JSON.parse(res.data).message)
}
});
}
}
const qjAdd = () => {
if (!phone.value.trim()) return proxy.$toast('请输入联系方式')
if (!type.value) return proxy.$toast('请选择请假类型')
if (!rangeDate.value || rangeDate.value.every(item => item === null)) return proxy.$toast('请选择请假时间')
if (leaderIndex.value == null) return proxy.$toast('请选择' + examineleader.value)
if (!departure.value.trim()) return proxy.$toast('请输入出发地')
if (!destination.value.trim()) return proxy.$toast('请输入目的地')
if (!reason.value.trim()) return proxy.$toast('请输入请假事由')
qjAddApi({
sysOrgCode: orgCode.value,
username: store.userinfo.username,
phone: phone.value,
type: type.value,
begintime: rangeDate.value[0],
endtime: rangeDate.value[1],
examineleader: leaderArr.value[leaderIndex.value].username,
departure: departure.value,
destination: destination.value,
reason: reason.value,
zwmc: zwcj.value,
path: path.value.toString()
}).then((res) => {
if (res.success) {
startMutilProcess(res.message)
} else {
proxy.$toast(res.message);
}
})
}
const startMutilProcess = (id) => {
startMutilProcessApi({
flowCode: "dev_cxc_qxj",
id,
formUrl: "modules/qxj/modules/CxcQxjBpmModel",
formUrlMobile: "leaveApplication" //对应main.js里全局注册createApp()里的 app.component('leaveApplication',index)
}).then((res) => {
if (res.success) {
proxy.$toast(res.message)
setTimeout(() => {
uni.navigateBack()
}, 2000)
}
}).catch((err) => {
console.log(err);
})
}
const loadData = () => {
getCategoryItemsApi('1838487445813645313').then((res) => { //请假类型
if (res.success) {
dataSource.value = res.result
}
})
queryZbDepByLdhth(store.userinfo.workNo).then((res) => { //获取工作单位
depart.value = res.departName
orgCode.value = res.orgCode
})
queryZwmcAndExaApi(store.userinfo.username).then((res) => { //本人职位及审批领导列表
if (res.success) {
leaderArr.value = res.result.list
zwcj.value = res.result.zwmc
if (zwcj.value == '单位专家' || zwcj.value == '基层正职' || zwcj.value == '高级主管') {
examineleader.value = '分管领导';
} else {
examineleader.value = '审批领导';
}
} else {
proxy.$toast(res.message);
}
})
queryHisDateApi(store.userinfo.username).then((res) => {
resDate.value = res ? new Date(res) : null; // 如果 res 存在,转换为 Date 对象
queryHisDate();
});
}
const queryHisDate = () => {
const today = new Date(); // 获取当前日期
if (resDate.value) {
// 如果 res 存在
if (type.value != '干部离返濮报备') {
startDate.value = getNextDay(resDate.value); // startDate 为 res 的第二天
}else{
startDate.value = null;
}
rangeDate.value = [getNextDay(resDate.value < today ? today : resDate.value), getNextDay(getNextDay(
resDate.value < today ? today : resDate.value))]
} else {
// 如果 res 不存在
rangeDate.value = [getNextDay(today), getNextDay(today)]
}
}
// 获取传入日期的第二天
const getNextDay = (date) => {
const nextDay = new Date(date);
nextDay.setDate(nextDay.getDate() + 1); // 设置为第二天
const year = nextDay.getFullYear();
const month = (nextDay.getMonth() + 1).toString().padStart(2, '0');
const day = nextDay.getDate().toString().padStart(2, '0');
return `${year}-${month}-${day}`;
};
const bindType = (e) => {
leaderIndex.value = e.detail.value
}
</script>
<style>
page {
background-color: #fff;
}
</style>
<style lang="scss" scoped>
.btn {
border-top: 1px solid #EFEFEF;
height: 120rpx;
justify-content: center;
position: fixed;
bottom: 0;
width: 100vw;
view {
width: 690rpx;
height: 88rpx;
background: #01508B;
border-radius: 16rpx;
font-size: 28rpx;
color: #FFFFFF;
text-align: center;
line-height: 88rpx;
}
}
.input_box {
height: 100rpx;
.title {
font-size: 28rpx;
color: #333333;
}
input {
flex: 1;
height: 100%;
text-align: right;
font-size: 28rpx;
color: #333333;
}
}
.form {
padding: 0 30rpx;
background-color: #fff;
.title {
font-size: 28rpx;
color: #333333;
}
.box {
height: 100rpx;
}
.box:not(:last-child) {
border-bottom: 1px solid #EFEFEF;
}
.choose {
font-size: 28rpx;
color: #999999;
}
.choosed {
font-size: 28rpx;
color: #333333;
}
}
</style>