From 40f5cf2a8c324bf08fd5f0aec2e9da00e5f59f76 Mon Sep 17 00:00:00 2001
From: yubo <autumnal_wind@yeah.net>
Date: 星期六, 11 四月 2026 20:29:40 +0800
Subject: [PATCH] fix(user): 在职员工界面优化

---
 src/views/user/components/JobChangeDialog.vue |  285 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 285 insertions(+), 0 deletions(-)

diff --git a/src/views/user/components/JobChangeDialog.vue b/src/views/user/components/JobChangeDialog.vue
new file mode 100644
index 0000000..060023c
--- /dev/null
+++ b/src/views/user/components/JobChangeDialog.vue
@@ -0,0 +1,285 @@
+<template>
+  <el-dialog
+    title="员工调岗"
+    :visible.sync="dialogVisible"
+    width="50%"
+    @close="handleClose"
+  >
+    <el-form
+      ref="ygdgForm"
+      :model="formData"
+      :rules="rules"
+      label-position="right"
+      label-width="120px"
+    >
+      <el-row>
+        <el-col span="24">
+          <el-form-item label="调岗人员">
+            <input v-model="formData.empIds" type="hidden">
+            <el-input
+              v-model="formData.empNames"
+              type="textarea"
+              :rows="2"
+              readonly
+            />
+          </el-form-item>
+          <el-form-item label="现部门(护卫点)" prop="deptId">
+            <treeselect
+              v-model="formData.deptId"
+              :multiple="false"
+              :options="depts"
+              :clear-value-text="$t('common.clear')"
+              placeholder="请选择部门(护卫点)"
+              style="width:100%"
+              @select="handleDeptSelect"
+            />
+          </el-form-item>
+          <el-form-item label="现岗位" prop="jobId">
+            <el-select
+              v-model="formData.jobId"
+              placeholder="请选择岗位"
+              filterable
+              clearable
+              style="width: 100%"
+              @change="handleJobSelect"
+            >
+              <el-option
+                v-for="item in jobOptions"
+                :key="item.code"
+                :label="item.value"
+                :value="item.code"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="调岗类型" prop="changeType">
+            <el-select
+              v-model="formData.changeType"
+              placeholder="请选择调岗类型"
+              style="width: 100%"
+            >
+              <el-option
+                v-for="dict in changeTypeOptions"
+                :key="dict.dicItemCode"
+                :label="dict.dicItemName"
+                :value="dict.dicItemCode"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="调岗日期" prop="changeDate">
+            <el-date-picker
+              v-model="formData.changeDate"
+              type="date"
+              value-format="yyyy-MM-dd"
+              placeholder="选择日期"
+              style="width: 100%"
+            />
+          </el-form-item>
+          <el-form-item label="理由描述" prop="changeReason">
+            <el-input
+              v-model="formData.changeReason"
+              type="textarea"
+              :rows="3"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="handleConfirm">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import Treeselect from '@riophae/vue-treeselect'
+import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import { getDicJob } from '@/api/position'
+
+export default {
+  name: 'JobChangeDialog',
+  components: {
+    Treeselect
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    employees: {
+      type: Array,
+      default: () => []
+    },
+    depts: {
+      type: Array,
+      default: () => []
+    },
+    changeTypeOptions: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      formData: {
+        empIds: '',
+        empNames: '',
+        oldDeptNames: '',
+        oldJobNames: '',
+        changeType: '',
+        changeDate: '',
+        changeReason: '',
+        jobId: '',
+        newJobName: '',
+        deptId: '',
+        newDeptName: '',
+        allDeptName: ''
+      },
+      rules: {
+        changeType: [
+          { required: true, message: '请选择调岗类型', trigger: 'change' }
+        ],
+        changeDate: [
+          { required: true, message: '请选择调岗日期', trigger: 'change' }
+        ],
+        jobId: [
+          { required: true, message: '请选择现岗位', trigger: 'change' }
+        ],
+        deptId: [
+          { required: true, message: '请选择现部门', trigger: 'change' }
+        ],
+        changeReason: [
+          { max: 500, message: '长度不超过500个字符', trigger: 'blur' }
+        ]
+      },
+      jobOptions: []
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  watch: {
+    employees: {
+      handler(val) {
+        if (val && val.length > 0) {
+          this.initFormData(val)
+        }
+      },
+      immediate: false
+    }
+  },
+  mounted() {
+    this.loadJobOptions()
+  },
+  methods: {
+    // 加载岗位选项
+    loadJobOptions() {
+      getDicJob().then((r) => {
+        this.jobOptions = r.data || []
+      }).catch((error) => {
+        console.error('获取岗位列表失败:', error)
+        this.$message.error('获取岗位列表失败')
+      })
+    },
+
+    // 初始化表单数据
+    initFormData(employees) {
+      const ids = []
+      const names = []
+      const deptNames = []
+      const jobNames = []
+
+      employees.forEach(emp => {
+        ids.push(emp.empId)
+        names.push(emp.empName)
+        deptNames.push(emp.allDeptName)
+        jobNames.push(emp.jobName)
+      })
+
+      // 默认调岗日期为当天
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = String(now.getMonth() + 1).padStart(2, '0')
+      const day = String(now.getDate()).padStart(2, '0')
+      const today = year + '-' + month + '-' + day
+
+      // 默认部门为根部门
+      const rootDept = this.depts && this.depts.length > 0 ? this.depts[0] : null
+      const defaultDeptId = rootDept ? rootDept.deptId : ''
+      const defaultDeptName = rootDept ? rootDept.label : ''
+      const defaultAllDeptName = rootDept ? rootDept.allDeptName : ''
+
+      this.formData = {
+        empIds: ids.join(','),
+        empNames: names.join(','),
+        oldDeptNames: deptNames.join(','),
+        oldJobNames: jobNames.join(','),
+        changeType: '',
+        changeDate: today,
+        changeReason: '',
+        jobId: '',
+        newJobName: '',
+        deptId: defaultDeptId,
+        newDeptName: defaultDeptName,
+        allDeptName: defaultAllDeptName
+      }
+    },
+
+    // 部门选择
+    handleDeptSelect(node) {
+      this.formData.deptId = node.deptId
+      this.formData.newDeptName = node.label
+      this.formData.allDeptName = node.allDeptName
+    },
+
+    // 岗位选择
+    handleJobSelect(val) {
+      const selected = this.jobOptions.find(item => item.code === val)
+      if (selected) {
+        this.formData.newJobName = selected.value
+        this.formData.jobId = selected.code
+      }
+    },
+
+    // 确认提交
+    handleConfirm() {
+      this.$refs.ygdgForm.validate((valid) => {
+        if (valid) {
+          this.$post('hr/empBaseInfo/jobChange', { ...this.formData }).then(() => {
+            this.$message({
+              message: '员工调岗成功',
+              type: 'success'
+            })
+            this.dialogVisible = false
+            this.$emit('success')
+          })
+        }
+      })
+    },
+
+    // 取消
+    handleCancel() {
+      this.dialogVisible = false
+      this.$emit('close')
+    },
+
+    // 关闭对话框
+    handleClose() {
+      if (this.$refs.ygdgForm) {
+        this.$refs.ygdgForm.resetFields()
+      }
+      this.$emit('close')
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>

--
Gitblit v1.8.0