代码优化

src/views/biz/onboarding/task/index.vue

@@ -149,8 +149,8 @@
               <span class="title-tip">请选择新员工入职的公司主体、岗位及适用的入职模板</span>
             </div>
 
-            <el-row :gutter="20">
-              <el-col :xs="24" :sm="8">
+            <el-row :gutter="16">
+              <el-col :xs="24" :sm="6">
                 <el-form-item label="所属公司" required>
                   <el-select
                     v-model="form.companyId"
@@ -164,14 +164,29 @@
                 </el-form-item>
               </el-col>
 
-              <el-col :xs="24" :sm="8">
+              <el-col :xs="24" :sm="6">
+                <el-form-item label="所属部门" required>
+                  <el-select
+                    v-model="form.departmentId"
+                    filterable
+                    placeholder="请选择所属部门"
+                    class="full-width"
+                    :disabled="!form.companyId"
+                    @change="onDepartmentChange"
+                  >
+                    <el-option v-for="item in departments" :key="item.id" :label="item.departmentName" :value="item.id" />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+
+              <el-col :xs="24" :sm="6">
                 <el-form-item label="入职岗位" required>
                   <el-select
                     v-model="form.positionId"
                     filterable
                     placeholder="请选择岗位"
                     class="full-width"
-                    :disabled="!form.companyId"
+                    :disabled="!form.departmentId"
                     @change="onPositionChange"
                   >
                     <el-option v-for="item in positions" :key="item.id" :label="item.positionName" :value="item.id" />
@@ -179,7 +194,7 @@
                 </el-form-item>
               </el-col>
 
-              <el-col :xs="24" :sm="8">
+              <el-col :xs="24" :sm="6">
                 <el-form-item label="入职模板" required>
                   <el-select
                     v-model="form.onboardingTemplateId"
@@ -335,6 +350,7 @@
               </div>
               <div class="banner-meta-row">
                 <span>所属公司：<strong>{{ detail.task.companyName || '-' }}</strong></span>
+                <span>所属部门：<strong>{{ detail.task.departmentName || '-' }}</strong></span>
                 <span>入职岗位：<strong>{{ detail.task.positionName || '-' }}</strong></span>
                 <span>入职模板：<strong>{{ detail.task.onboardingTemplateName || '-' }}</strong></span>
               </div>
@@ -878,6 +894,7 @@ import {
 import {
   onboardingTaskApi,
   type OnboardingCompanyOption,
+  type OnboardingDepartmentOption,
   type OnboardingPositionOption,
   type OnboardingTemplate,
   type OnboardingContractTemplate,
@@ -889,6 +906,7 @@ import type { ColumnProps, ProTableInstance } from "@/components/ProTable/interf
 const proTable = ref<ProTableInstance>();
 
 const companies = ref<OnboardingCompanyOption[]>([]);
+const departments = ref<OnboardingDepartmentOption[]>([]);
 const positions = ref<OnboardingPositionOption[]>([]);
 const onboardingTemplates = ref<OnboardingTemplate[]>([]);
 const contractTemplates = ref<OnboardingContractTemplate[]>([]);
@@ -977,6 +995,7 @@ const statusCounts = reactive({
 
 const form = reactive({
   companyId: undefined as number | undefined,
+  departmentId: undefined as number | undefined,
   positionId: undefined as number | undefined,
   onboardingTemplateId: undefined as number | undefined,
   contractVariables: [] as Array<{
@@ -998,6 +1017,21 @@ const columns: ColumnProps<OnboardingTask>[] = [
     minWidth: 200,
     search: { el: "input" }
   },
+  {
+    prop: "companyName",
+    label: "所属公司",
+    minWidth: 160
+  },
+  {
+    prop: "departmentName",
+    label: "所属部门",
+    minWidth: 140
+  },
+  {
+    prop: "positionName",
+    label: "入职岗位",
+    minWidth: 140
+  },
   {
     prop: "taskStatus",
     label: "当前状态",
@@ -1230,11 +1264,26 @@ async function loadCompanies() {
 }
 
 async function onCompanyChange(companyId: number) {
+  form.departmentId = undefined;
   form.positionId = undefined;
   form.onboardingTemplateId = undefined;
   form.contractVariables = [];
+  positions.value = [];
   onboardingTemplates.value = [];
-  const { data } = await onboardingTaskApi.listPositions(companyId);
+  departments.value = [];
+  if (!companyId) return;
+  const { data } = await onboardingTaskApi.listDepartments(companyId);
+  departments.value = data || [];
+}
+
+async function onDepartmentChange(departmentId: number) {
+  form.positionId = undefined;
+  form.onboardingTemplateId = undefined;
+  form.contractVariables = [];
+  positions.value = [];
+  onboardingTemplates.value = [];
+  if (!departmentId) return;
+  const { data } = await onboardingTaskApi.listPositionsByDepartment(departmentId);
   positions.value = data || [];
 }
 
@@ -1242,8 +1291,12 @@ async function onPositionChange(positionId: number) {
   form.onboardingTemplateId = undefined;
   form.contractVariables = [];
   onboardingTemplates.value = [];
-  if (!form.companyId || !positionId) return;
-  const { data } = await onboardingTaskApi.listEnabledOnboardingTemplates(form.companyId, positionId);
+  if (!form.companyId || !form.departmentId || !positionId) return;
+  const { data } = await onboardingTaskApi.listEnabledOnboardingTemplates(
+    form.companyId,
+    form.departmentId,
+    positionId
+  );
   onboardingTemplates.value = data || [];
   if (onboardingTemplates.value.length === 1) {
     form.onboardingTemplateId = onboardingTemplates.value[0].id;
@@ -1282,19 +1335,21 @@ async function onOnboardingTemplateChange(templateId: number) {
 function openCreate() {
   Object.assign(form, {
     companyId: undefined,
+    departmentId: undefined,
     positionId: undefined,
     onboardingTemplateId: undefined,
     contractVariables: [],
     remark: ""
   });
+  departments.value = [];
   positions.value = [];
   onboardingTemplates.value = [];
   createVisible.value = true;
 }
 
 async function createTask() {
-  if (!form.companyId || !form.positionId || !form.onboardingTemplateId) {
-    return ElMessage.warning("请选择所属公司、入职岗位和入职模板");
+  if (!form.companyId || !form.departmentId || !form.positionId || !form.onboardingTemplateId) {
+    return ElMessage.warning("请选择所属公司、所属部门、入职岗位和入职模板");
   }
   const missingVariable = form.contractVariables.find(
     item => item.required && isBlankContractVariableValue(item.variableValue)
@@ -1318,6 +1373,7 @@ async function createTask() {
 
     const linkUrl = `${location.origin}/#/onboarding/fill?token=${result.linkToken}`;
     const selectedCompany = companies.value.find(c => c.id === form.companyId)?.companyName || "";
+    const selectedDepartment = departments.value.find(d => d.id === form.departmentId)?.departmentName || "";
     const selectedPosition = positions.value.find(p => p.id === form.positionId)?.positionName || "";
 
     createdTaskInfo.value = {