CRM请假
This commit is contained in:
jiangyanshan
318
src/pages/business/CRM/leave/reviewDetail.vue
Normal file
318
src/pages/business/CRM/leave/reviewDetail.vue
Normal file
@@ -0,0 +1,318 @@
|
||||
<template>
|
||||
<view class="con-body">
|
||||
<view class="con-bg">
|
||||
<!-- 头部 -->
|
||||
<customHeader ref="customHeaderRef" :title="'审批详情'" :leftFlag="true" :rightFlag="false">
|
||||
</customHeader>
|
||||
|
||||
<!-- 高度来避免头部遮挡 -->
|
||||
<view class="top-height"></view>
|
||||
|
||||
<view class="white-bg">
|
||||
<view class="example">
|
||||
<view v-if="baseFormData.applyType != '请假'" style="display: flex;font-size: 14px;padding-top: 32rpx;
|
||||
background-color: #03aa0315;height: 76rpx;">
|
||||
<view class="r-left">
|
||||
<label style="color: #03aa03;font-size: 34rpx;
|
||||
padding: 32rpx;background-color: #dcd8d933;">
|
||||
{{ baseFormData.days.replace('.0', '') }} 天</label>
|
||||
</view>
|
||||
<view style="margin-top: -20rpx;">
|
||||
<view class="r-right" style="margin-left: 30rpx;">
|
||||
{{ baseFormData.startDate }}
|
||||
至
|
||||
{{ baseFormData.endDate }}
|
||||
</view>
|
||||
<view class="r-right" style="margin-left: 30rpx;color: #00000095;">
|
||||
{{ baseFormData.reason }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<uni-forms ref="baseForm" :modelValue="baseFormData" :label-width="80" style="margin-top: 10rpx;">
|
||||
<uni-forms-item :label="baseFormData.applyType == '请假' ? '请假模式' : '销假模式'"
|
||||
:class="baseFormData.applyType == '请假' ? 'leaveApple' : 'backLeave'">
|
||||
<uni-easyinput v-model="baseFormData.typeName" class="inputborder" :disabled="true"
|
||||
style="text-align: center;" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="开始日期" :class="baseFormData.applyType == '请假' ? 'leaveApple' : 'backLeave'">
|
||||
<uni-easyinput v-model="baseFormData.startDate" class="inputborder" :disabled="true"
|
||||
style="text-align: center;" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item v-show="baseFormData.typeval == '1'" label="结束日期"
|
||||
:class="baseFormData.applyType == '请假' ? 'leaveApple' : 'backLeave'">
|
||||
<uni-easyinput v-model="baseFormData.endDate" class="inputborder" :disabled="true"
|
||||
style="text-align: center;" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="开始时间" v-show="baseFormData.typeval != '1'"
|
||||
:class="baseFormData.applyType == '请假' ? 'leaveApple' : 'backLeave'">
|
||||
<uni-easyinput v-model="baseFormData.startTime" class="inputborder" :disabled="true"
|
||||
style="text-align: center;" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="结束时间" v-show="baseFormData.typeval != '1'"
|
||||
:class="baseFormData.applyType == '请假' ? 'leaveApple' : 'backLeave'">
|
||||
<uni-easyinput v-model="baseFormData.endTime" class="inputborder" :disabled="true"
|
||||
style="text-align: center;" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item :label="baseFormData.applyType == '请假' ? '请假天数' : '销假天数'"
|
||||
:class="baseFormData.applyType == '请假' ? 'leaveApple' : 'backLeave'">
|
||||
<uni-easyinput v-model="baseFormData.days" class="inputborder" :disabled="true"
|
||||
style="text-align: center;" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="详细说明"
|
||||
:class="baseFormData.applyType == '请假' ? 'leaveApple custom-label-height' : 'backLeave custom-label-height'">
|
||||
<uni-easyinput type="textarea" v-model="baseFormData.reason" :disabled="true" />
|
||||
</uni-forms-item>
|
||||
<view class="border-bottom" style="width: 100%;"></view>
|
||||
<view style="margin-top: 20rpx;">
|
||||
<uni-forms-item label="审核意见" class="custom-label-height">
|
||||
<uni-easyinput type="textarea" v-model="rejectReason" />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</uni-forms>
|
||||
</view>
|
||||
<view class="footer-con" style="display: flex;" v-if="baseFormData.reviewerId != 0">
|
||||
<button class="btn-warning" type="warning" @click="submit('驳回')" size="mini">驳回</button>
|
||||
<button class="btn-success" type="success" @click="submit('同意')" size="mini">同意</button>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
onMounted,
|
||||
reactive
|
||||
} from 'vue'
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
import customHeader from '@/components/customHeader.vue'
|
||||
import customTabs from '@/components/customTabs.vue';
|
||||
import {
|
||||
addReviewLeave
|
||||
} from '@/api/crm/activity/activity';
|
||||
|
||||
// 表单ref
|
||||
let baseForm = ref(null);
|
||||
|
||||
let rejectReason = ref(null);
|
||||
|
||||
let baseFormData = reactive({
|
||||
typeName: "全天",
|
||||
typeval: 1,
|
||||
startDate: getDate(Date.now()),
|
||||
endDate: getDate(Date.now()),
|
||||
days: 1,
|
||||
reason: '',
|
||||
startTime: '08:30',
|
||||
endTime: '12:30',
|
||||
});
|
||||
|
||||
onLoad((options) => {
|
||||
rejectReason.value = ""
|
||||
if (options.data) {
|
||||
baseFormData = JSON.parse(decodeURIComponent(options.data))
|
||||
change()
|
||||
|
||||
baseFormData.days = baseFormData.days.toString()
|
||||
baseFormData.leaveDays = baseFormData.leaveDays.replace('.0', '')
|
||||
|
||||
if (baseFormData.reviewerIdR != null) {
|
||||
rejectReason.value = baseFormData.rejectReason
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
// 查询详情
|
||||
let item = ref({});
|
||||
const submit = async (status) => {
|
||||
if (status == '驳回' && (rejectReason.value == null || rejectReason.value == "")) {
|
||||
uni.showToast({
|
||||
title: '请填写驳回原因',
|
||||
duration: 2000
|
||||
});
|
||||
} else {
|
||||
let param = {
|
||||
reviewStatus: status == '同意' ? '完成' : '驳回',
|
||||
reviewResult: status == '同意' ? '通过' : '驳回',
|
||||
rejectReason: rejectReason.value,
|
||||
applyType: baseFormData.applyType,
|
||||
leaveId: baseFormData.leaveId,
|
||||
backId: baseFormData.backId,
|
||||
days: baseFormData.days,
|
||||
}
|
||||
addReviewLeave(param).then(
|
||||
res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
duration: 2000
|
||||
});
|
||||
setTimeout(function () {
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
uni.$emit('isRefresh');
|
||||
}
|
||||
})
|
||||
}, 500);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function getDate(dateval) {
|
||||
const date = new Date(dateval)
|
||||
const year = date.getFullYear()
|
||||
const month = date.getMonth() + 1
|
||||
const day = date.getDate()
|
||||
return `${year}-${addZero(month)}-${addZero(day)}`
|
||||
}
|
||||
|
||||
function addZero(num) {
|
||||
if (num < 10) {
|
||||
num = `0${num}`
|
||||
}
|
||||
return num
|
||||
}
|
||||
|
||||
let change = () => {
|
||||
if (baseFormData.typeval != 1) {
|
||||
if (baseFormData.typeval == 2) {
|
||||
baseFormData.startTime = '08:30'
|
||||
baseFormData.endTime = '12:30'
|
||||
|
||||
baseFormData.typeName = '前半个班次'
|
||||
} else {
|
||||
baseFormData.startTime = '13:00'
|
||||
baseFormData.endTime = '17:00'
|
||||
|
||||
baseFormData.typeName = '后半个班次'
|
||||
}
|
||||
|
||||
baseFormData.days = 0.5
|
||||
} else {
|
||||
let start = baseFormData.startDate
|
||||
let end = baseFormData.endDate
|
||||
baseFormData.days = getDayDiff(start, end);
|
||||
|
||||
baseFormData.typeName = '全天'
|
||||
}
|
||||
|
||||
baseFormData.days = baseFormData.days.toString()
|
||||
}
|
||||
|
||||
// 计算两个日期的天数差
|
||||
function getDayDiff(startDate, endDate) {
|
||||
// 处理日期格式（兼容iOS）
|
||||
const start = startDate.replace(/-/g, '/');
|
||||
const end = endDate.replace(/-/g, '/');
|
||||
|
||||
const date1 = new Date(start).getTime();
|
||||
const date2 = new Date(end).getTime();
|
||||
|
||||
if (date2 < date1) {
|
||||
return 0
|
||||
}
|
||||
|
||||
// 计算天数差（含边界值+1天）
|
||||
return Math.floor(Math.abs(date2 - date1) / (24 * 3600 * 1000)) + 1;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.white-bg {
|
||||
width: 690rpx;
|
||||
margin: 0;
|
||||
border-radius: 8px 8px 0 0;
|
||||
}
|
||||
|
||||
.white-bg.white-bg-2 {
|
||||
border-radius: 0;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
:deep(.tabs-header) {
|
||||
/* background: none !important; */
|
||||
border-bottom: none !important;
|
||||
margin: 0 auto;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
:deep(.tab-item) {
|
||||
color: #919191;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
/* flex:none; */
|
||||
/* margin: 0 -50rpx; */
|
||||
/* padding: 0 50rpx; */
|
||||
}
|
||||
|
||||
:deep(.tab-item:first-child) {
|
||||
text-align: right;
|
||||
margin-left: 230rpx;
|
||||
}
|
||||
|
||||
:deep(.tab-item:last-child) {
|
||||
text-align: left;
|
||||
margin-right: 230rpx;
|
||||
}
|
||||
|
||||
:deep(.tab-item.active) {
|
||||
color: #3384DF;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
:deep(.tab-item.active::after) {
|
||||
width: 100rpx;
|
||||
height: 8rpx;
|
||||
}
|
||||
|
||||
:deep(.is-disabled) {
|
||||
background-color: rgba(255, 255, 255, 1) !important;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
background-color: #67d23a;
|
||||
border: 1px solid #67d23a;
|
||||
color: #fff;
|
||||
/* padding: 0rpx 60rpx; */
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
background-color: #f6b23c;
|
||||
border: 1px solid #f6b23c;
|
||||
color: #fff;
|
||||
/* padding: 0rpx 60rpx; */
|
||||
}
|
||||
|
||||
.leaveApple {
|
||||
background-color: rgba(103, 194, 58, 0.2);
|
||||
}
|
||||
|
||||
.backLeave {
|
||||
background-color: rgba(230, 162, 60, 0.2);
|
||||
}
|
||||
|
||||
:deep(.uni-forms-item__label) {
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
:deep(.custom-label-height .uni-forms-item__label) {
|
||||
height: 190rpx;
|
||||
}
|
||||
|
||||
::v-deep .uni-easyinput__content-textarea {
|
||||
height: 166rpx !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user