yinq
/
hwbm-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化机票预订界面，实现机票预订流程申请功能，优化机票查询、导出逻辑。

Browse Source
dev
lh 1 week ago
parent 8fd0209cac
commit 8850c6df45
2 changed files with 130 additions and 40 deletions
Show Stats Download Patch File Download Diff File

158
src/views/oa/crm/flightBooking/edit.vue
Unescape Escape View File

@ -14,11 +14,11 @@
/>
</el-card>
<el-card shadow="never" style="margin-top: 0">
<el-form ref="flightBookingFormRef" :model="form" :loading="buttonLoading" :rules="rules" label-width="120px" :disabled="isFormDisabled">
<el-form ref="flightBookingFormRef" :model="form" :rules="rules" label-width="120px" :disabled="isFormDisabled">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="机票预订编号" prop="applyCode">
<el-input v-model="form.applyCode" placeholder="请输入机票预订编号">
<el-input v-model="form.applyCode" placeholder="请输入机票预订编号" :disabled="true">
<template #append>
<el-button type="primary" @click="generateContractCode" :disabled="isCodeGenerated">生成机票预订编号 </el-button>
</template>
@ -37,7 +37,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="出行日期" prop="travelDate">
<el-date-picker clearable v-model="form.travelDate" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择出行日期">
<el-date-picker clearable v-model="form.travelDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择出行日期">
</el-date-picker>
</el-form-item>
</el-col>
@ -113,7 +113,7 @@ import { getUserList } from '@/api/system/user';
import { CodeRuleEnum, FlowCodeEnum } from '@/enums/OAEnum';
import { getInfo } from '@/api/login';
import FileUpload from '@/components/FileUpload/index.vue';
import { getFlightBooking, delFlightBooking, addFlightBooking, updateFlightBooking, submitAndFlowStart } from '@/api/oa/crm/flightBooking';
import { getFlightBooking, addFlightBooking, updateFlightBooking, submitAndFlowStart } from '@/api/oa/crm/flightBooking';
import { FlightBookingVO, FlightBookingQuery, FlightBookingForm } from '@/api/oa/crm/flightBooking/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@ -144,13 +144,94 @@ const flowInstanceBizExtBo = ref<Record<string, any>>({});
const type = ref(0);
// 添加自定义验证函数
const validateAmount = (rule: any, value: any, callback: any) => {
if (!value) {
callback(new Error('机票金额不能为空'));
return;
}
// 检查是否为数字（包括整数、小数、负数）
const numValue = Number(value);
if (isNaN(numValue)) {
callback(new Error('请输入有效的数字'));
return;
}
// 检查是否为负数（如果需要）
if (numValue < 0) {
callback(new Error('机票金额不能为负数'));
return;
}
// 检查小数位数（最多2位小数）
const strValue = String(value);
const decimalPart = strValue.split('.')[1];
if (decimalPart && decimalPart.length > 2) {
callback(new Error('最多支持两位小数'));
return;
}
callback();
};
// 机票编号生成状态
const isCodeGenerated = ref(false);
/** 查询用户信息下拉框结构 */
const userInfoList = ref([]);
// 存储当前登录用户信息
const currentUser = ref<any>(null);
// 获取当前登录用户信息
const getCurrentUserInfo = async () => {
try {
const userInfo = await getInfo();
currentUser.value = userInfo.data.user;
return currentUser.value;
} catch (error) {
console.error('获取当前登录用户信息失败:', error);
return null;
}
};
// 查询所有用户列表
const getUserInfoListSelect = async () => {
const res = await getUserList({ pageNum: 1, pageSize: 1000 });
userInfoList.value = res.data;
try {
const res = await getUserList({ pageNum: 1, pageSize: 1000 });
userInfoList.value = res.data;
// 将当前用户添加到用户列表中（如果不在列表中）
if (currentUser.value && currentUser.value.userId) {
const userExists = userInfoList.value.some((user: any) => user.userId === currentUser.value.userId);
if (!userExists) {
// 将当前用户添加到列表开头
userInfoList.value.unshift({
userId: currentUser.value.userId,
nickName: currentUser.value.nickName
// 可以添加其他需要的字段
});
}
}
} catch (error) {
proxy?.$modal.msgError('获取用户列表失败');
}
};
// 初始化用户数据（获取当前用户并查询用户列表）
const initUserData = async () => {
// 1. 先获取当前登录用户
await getCurrentUserInfo();
// 2. 再查询所有用户列表
await getUserInfoListSelect();
// 3. 如果是新增模式，设置当前用户为默认乘机人
const id = routeParams.value.id as string | number;
if (!id && routeParams.value.type !== 'update' && routeParams.value.type !== 'view' && routeParams.value.type !== 'approval') {
// 新增模式，设置当前用户为默认乘机人
if (currentUser.value && currentUser.value.userId) {
form.value.passengerId = currentUser.value.userId;
form.value.passengerName = currentUser.value.nickName;
console.log('已设置当前登录用户为默认乘机人:', currentUser.value.nickName);
}
}
};
// 判断表单是否禁用（查看或审批模式）
@ -209,14 +290,17 @@ const data = reactive<PageData<FlightBookingForm, FlightBookingQuery>>({
departureLocation: [{ required: true, message: '出发地点不能为空', trigger: 'blur' }],
arrivalLocation: [{ required: true, message: '到达地点不能为空', trigger: 'blur' }],
flightDiscount: [{ required: true, message: '机票折扣不能为空', trigger: 'blur' }],
flightAmount: [{ required: true, message: '机票金额不能为空', trigger: 'blur' }]
flightAmount: [
{ required: true, message: '机票金额不能为空', trigger: 'blur' },
{ validator: validateAmount, trigger: ['blur', 'change'] } // 添加自定义验证
]
}
});
const { queryParams, form, rules } = toRefs(data);
const flightBookingFormRef = ref<ElFormInstance>();
// 生成合同编号
// 生成机票编号
const generateContractCode = async () => {
if (isCodeGenerated.value) return; // 如果已经生成过，直接返回
try {
@ -240,19 +324,15 @@ watch(
// 自动设置 passengerName
form.value.passengerName = selectedUser.nickName;
}
} else {
// 如果 passengerId 为空，清空 passengerName
form.value.passengerName = '';
}
},
{ immediate: true } // 立即执行一次，用于编辑模式的数据回显
);
/** 提交按钮 */
const submitForm = (status: string, mode: boolean) => {
try {
buttonLoading.value = true;
flightBookingFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
flightBookingFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
try {
// 设置后端发起和不等于草稿状态 直接走流程发起
if (status != 'draft') {
// 后端发起流程模式
@ -268,7 +348,7 @@ const submitForm = (status: string, mode: boolean) => {
};
form.value.flowStatus = 'waiting';
form.value.bookingStatus = '2';
const res = await submitAndFlowStart(form.value).finally(() => (buttonLoading.value = false));
const res = await submitAndFlowStart(form.value);
form.value = res.data;
proxy?.$modal.msgSuccess('操作成功');
proxy?.$tab.closePage();
@ -278,33 +358,40 @@ const submitForm = (status: string, mode: boolean) => {
form.value.bookingStatus = '1';
if (form.value.bookingId) {
await updateFlightBooking(form.value).finally(() => (buttonLoading.value = false));
await updateFlightBooking(form.value);
} else {
await addFlightBooking(form.value).finally(() => (buttonLoading.value = false));
await addFlightBooking(form.value);
}
proxy?.$modal.msgSuccess('暂存成功');
proxy?.$tab.closePage();
router.go(-1);
}
} catch (error) {
// 错误处理
console.error('提交失败:', error);
proxy?.$modal.msgError('操作失败');
} finally {
// 只在验证通过且有请求操作时才设置加载状态为 false
buttonLoading.value = false;
}
});
} finally {
buttonLoading.value = false;
}
} else {
// 验证不通过时，立即恢复按钮状态
buttonLoading.value = false;
proxy?.$modal.msgWarning('s请检查表单填写是否正确');
}
});
};
onMounted(async () => {
nextTick(async () => {
// 获取路由参数
getUserInfoListSelect();
// 初始化用户数据（获取当前用户和用户列表）
proxy?.$modal.loading('正在加载数据，请稍后...');
await initUserData();
routeParams.value = route.query;
const id = routeParams.value.id as string | number;
if (id && (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval')) {
proxy?.$modal.loading('正在加载数据，请稍后...');
const res = await getFlightBooking(id);
Object.assign(form.value, res.data);
proxy?.$modal.closeLoading();
// 编辑模式：如果已有合同编号，禁用生成按钮
if (form.value.applyCode) {
@ -323,13 +410,14 @@ onMounted(async () => {
// } catch (error) {
// console.error('获取用户信息失败:', error);
// }
// // 新增模式：如果已有合同编号，禁用生成按钮
// if (form.value.contractCode) {
// isCodeGenerated.value = true;``
// } else if (form.value.contractFlag === '1') {
// // 如果有合同但没有编号，允许生成
// isCodeGenerated.value = false;
// }
// 新增模式：如果已有机票编号，禁用生成按钮
if (form.value.applyCode) {
isCodeGenerated.value = true;
} else {
// 如果有合同但没有编号，允许生成
isCodeGenerated.value = false;
}
proxy?.$modal.closeLoading();
}
});
});

12
src/views/oa/crm/flightBooking/index.vue
Unescape Escape View File

@ -97,6 +97,8 @@
</el-table-column>
<el-table-column label="流程状态" align="center" prop="flowStatus" v-if="columns[12].visible" />
<el-table-column label="备注" align="center" prop="remark" v-if="columns[13].visible" />
<el-table-column label="创建时间" align="center" prop="createTime" width="100" v-if="columns[17].visible" />
<el-table-column label="更新时间" align="center" prop="updateTime" width="100" v-if="columns[19].visible" />
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top" v-if="scope.row.flowStatus === 'draft' || scope.row.flowStatus === 'back'">
@ -213,11 +215,11 @@ const columns = ref<FieldOption[]>([
{ key: 11, label: `申请状态`, visible: true },
{ key: 12, label: `流程状态`, visible: true },
{ key: 13, label: `备注`, visible: true },
{ key: 14, label: `删除标志`, visible: true },
{ key: 15, label: `创建部门`, visible: true },
{ key: 16, label: `创建者`, visible: true },
{ key: 14, label: `删除标志`, visible: false },
{ key: 15, label: `创建部门`, visible: false },
{ key: 16, label: `创建者`, visible: false },
{ key: 17, label: `创建时间`, visible: true },
{ key: 18, label: `更新者`, visible: true },
{ key: 18, label: `更新者`, visible: false },
{ key: 19, label: `更新时间`, visible: true }
]);
@ -399,7 +401,7 @@ const handleDelete = async (row?: FlightBookingVO) => {
/** 导出按钮操作 */
const handleExport = () => {
proxy?.download(
'oa/flightBooking/export',
'oa/crm/flightBooking/export',
{
...queryParams.value
},

Write Preview
Loading…
Cancel
Save