From ea298f00f6a8608bf6bafcd7103024047842bcaf Mon Sep 17 00:00:00 2001
From: flower-string <2178503051@qq.com>
Date: Sat, 8 Mar 2025 15:22:29 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20=E6=A1=A3=E6=A1=88=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E5=89=8D=E7=AB=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/api/oa/document.js               |  34 ++
 .../views/oa/peoples/document/FileList.vue    | 221 ++++++++++++
 .../src/views/oa/peoples/document/index.vue   | 278 ++++++++++++++
 .../src/views/oa/peoples/document/update.vue  | 340 ++++++++++++++++++
 .../oa/peoples/status/ProbationApply.vue      | 129 +++++++
 .../oa/peoples/status/ProbationManage.vue     | 198 ++++++++++
 .../src/views/oa/peoples/status/index.vue     |  30 ++
 7 files changed, 1230 insertions(+)
 create mode 100644 ruoyi-ui/src/api/oa/document.js
 create mode 100644 ruoyi-ui/src/views/oa/peoples/document/FileList.vue
 create mode 100644 ruoyi-ui/src/views/oa/peoples/document/index.vue
 create mode 100644 ruoyi-ui/src/views/oa/peoples/document/update.vue
 create mode 100644 ruoyi-ui/src/views/oa/peoples/status/ProbationApply.vue
 create mode 100644 ruoyi-ui/src/views/oa/peoples/status/ProbationManage.vue
 create mode 100644 ruoyi-ui/src/views/oa/peoples/status/index.vue

diff --git a/ruoyi-ui/src/api/oa/document.js b/ruoyi-ui/src/api/oa/document.js
new file mode 100644
index 0000000..ad65479
--- /dev/null
+++ b/ruoyi-ui/src/api/oa/document.js
@@ -0,0 +1,34 @@
+import request from '@/utils/request'
+
+// 查询用户文件列表
+export function listDocument(userId) {
+  return request({
+    url: '/oa/files/' + userId,
+    method: 'get',
+  })
+}
+
+/**
+ * 查询所有用户档案
+ */
+export function QueryDocument(query) {
+  return request({
+    url: '/oa/files/list',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 为用户添加文件
+ */
+export function addFile(userId, fileList) {
+  return request({
+    url: '/oa/files',
+    method: 'post',
+    data: {
+      userId,
+      fileList
+    }
+  })
+}
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/oa/peoples/document/FileList.vue b/ruoyi-ui/src/views/oa/peoples/document/FileList.vue
new file mode 100644
index 0000000..bc9ba7d
--- /dev/null
+++ b/ruoyi-ui/src/views/oa/peoples/document/FileList.vue
@@ -0,0 +1,221 @@
+<template>
+  <div class="file-manager">
+    <!-- 操作栏 -->
+    <div class="operation-bar" v-if="!readOnly">
+      <el-button type="primary" size="mini" @click="handleAdd">添加文件</el-button>
+      <el-button type="danger" size="mini" :disabled="selectedFiles.length === 0" @click="handleDelete">删除选中</el-button>
+      <el-button size="mini" @click="handlePrint">打印列表</el-button>
+      
+      <div class="selection-count" v-if="selectedFiles.length > 0">
+        已选 {{ selectedFiles.length }} 个文件
+      </div>
+    </div>
+
+    <!-- 文件表格 -->
+    <el-table
+      v-loading="loading"
+      :data="fileList"
+      style="width: 100%"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" :selectable="checkSelectable"></el-table-column>
+      <el-table-column prop="fileName" label="文件名" min-width="200">
+        <template #default="{row}">
+          <div class="file-name-cell">
+            <i :class="fileIcon(row.fileType)" class="file-icon"></i>
+            <span>{{ row.fileName }}</span>
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="fileType" label="类型" width="120">
+        <template #default="{row}">
+          <el-tag effect="plain">{{ row.fileType }}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column prop="fileSize" label="大小" width="120">
+        <template #default="{row}">{{ formatSize(row.fileSize) }}</template>
+      </el-table-column>
+      <el-table-column prop="uploadTime" label="上传时间" width="180">
+        <template #default="{row}">{{ formatDate(row.uploadTime) }}</template>
+      </el-table-column>
+      <el-table-column label="操作" width="150" fixed="right" v-if="!readOnly">
+        <template #default="{row}">
+          <el-button size="mini" type="text" @click="handlePreview(row)">预览</el-button>
+          <el-button size="mini" type="text" @click="handleDownload(row)">下载</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 添加文件对话框 -->
+    <el-dialog title="添加文件" :visible.sync="showAddDialog" width="30%">
+      <el-upload
+        class="upload-demo"
+        drag
+        :action="uploadUrl"
+        :before-upload="beforeUpload"
+        :on-success="handleUploadSuccess"
+        multiple
+      >
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <div class="el-upload__tip" slot="tip">支持格式：doc/docx/pdf/jpg/png，单个文件不超过50MB</div>
+      </el-upload>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'UserFileManager',
+  props: {
+    userId: {
+      type: [Number, String],
+      required: true
+    },
+    readOnly: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      fileList: [],
+      selectedFiles: [],
+      showAddDialog: false,
+      uploadUrl: `/api/files/upload?userId=${this.userId}`
+    }
+  },
+  watch: {
+    userId: {
+      immediate: true,
+      handler(newVal) {
+        if (newVal) this.loadFiles()
+      }
+    }
+  },
+  methods: {
+    async loadFiles() {
+      try {
+        this.loading = true
+        const res = await this.$axios.get(`/api/files/${this.userId}`)
+        this.fileList = res.data
+      } catch (error) {
+        this.$message.error('文件加载失败')
+      } finally {
+        this.loading = false
+      }
+    },
+
+    handleSelectionChange(selection) {
+      this.selectedFiles = selection
+    },
+
+    handleAdd() {
+      this.showAddDialog = true
+    },
+
+    async handleDelete() {
+      try {
+        const ids = this.selectedFiles.map(f => f.id)
+        await this.$confirm(`确定删除选中的 ${ids.length} 个文件吗？`, '提示', {
+          type: 'warning'
+        })
+        
+        await this.$axios.delete('/api/files', { data: { ids } })
+        this.$message.success('删除成功')
+        this.loadFiles()
+      } catch (error) {
+        if (error !== 'cancel') {
+          this.$message.error('删除失败')
+        }
+      }
+    },
+
+    handleUploadSuccess(res) {
+      if (res.code === 200) {
+        this.fileList.unshift(res.data)
+        this.$message.success('上传成功')
+        this.showAddDialog = false
+      }
+    },
+
+    beforeUpload(file) {
+      const isValidType = ['image/jpeg', 'image/png', 'application/pdf'].includes(file.type)
+      const isLt50M = file.size / 1024 / 1024 < 50
+      
+      if (!isValidType) {
+        this.$message.error('不支持的文件格式!')
+        return false
+      }
+      if (!isLt50M) {
+        this.$message.error('文件大小不能超过50MB!')
+        return false
+      }
+      return true
+    },
+
+    fileIcon(type) {
+      const iconMap = {
+        'pdf': 'el-icon-document',
+        'doc': 'el-icon-document-check',
+        'docx': 'el-icon-document-check',
+        'jpg': 'el-icon-picture',
+        'png': 'el-icon-picture'
+      }
+      return iconMap[type.toLowerCase()] || 'el-icon-document'
+    },
+
+    formatSize(size) {
+      if (size > 1024 * 1024) {
+        return (size / 1024 / 1024).toFixed(1) + 'MB'
+      } else if (size > 1024) {
+        return (size / 1024).toFixed(1) + 'KB'
+      }
+      return size + 'B'
+    },
+
+    formatDate(timestamp) {
+      return new Date(timestamp).toLocaleString()
+    },
+
+    checkSelectable(row) {
+      return !this.readOnly
+    }
+  }
+}
+</script>
+
+<style scoped>
+.file-manager {
+  padding: 20px;
+}
+
+.operation-bar {
+  margin-bottom: 15px;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.selection-count {
+  margin-left: auto;
+  color: #666;
+  font-size: 14px;
+}
+
+.file-name-cell {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.file-icon {
+  font-size: 18px;
+  color: #409EFF;
+}
+
+.upload-demo {
+  text-align: center;
+}
+</style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/oa/peoples/document/index.vue b/ruoyi-ui/src/views/oa/peoples/document/index.vue
new file mode 100644
index 0000000..0d98bd2
--- /dev/null
+++ b/ruoyi-ui/src/views/oa/peoples/document/index.vue
@@ -0,0 +1,278 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="姓名" prop="nickname">
+        <el-input
+          clearable
+          v-model="queryParams.nickname"
+          placeholder="根据姓名查询"
+        ></el-input>
+      </el-form-item>
+      <el-form-item label="性别" prop="sex">
+        <el-select v-model="queryParams.sex" placeholder="请选择性别">
+          <el-option label="男" value="0"></el-option>
+          <el-option label="女" value="1"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="学历" prop="highestDegree">
+        <el-input
+            v-model="queryParams.highestDegree"
+            placeholder="请输入学历"
+            clearable
+            @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+            type="warning"
+            plain
+            icon="el-icon-download"
+            size="mini"
+            @click="handleExport"
+            v-hasPermi="['system:onboarding:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="peopleList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" align="center" type="index"/>
+      <el-table-column label="姓名" align="center" prop="nickName"/>
+      <el-table-column label="性别" align="center" prop="sex">
+        <template slot-scope="scope">
+          <span v-if="scope.row.sex === '0'">男</span>
+          <span v-else>女</span>
+        </template>
+      </el-table-column>
+     
+      <el-table-column label="部门" align="center" prop="dept.deptName"/>
+      <el-table-column label="入职日期" align="center" prop="joiningDate" width="180">
+        <template slot-scope="scope">
+          <span>{{scope.row.joiningDate!==null?scope.row.joiningDate:'未完成审批流程'}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
+        <template slot-scope="scope">
+          <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-add"
+              @click="openAddFile(scope.row)"
+          >添加文件</el-button>
+          <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-detail"
+              @click="handleDetail(scope.row)"
+          >详情</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+    />
+
+    <el-drawer
+      title="人员详情"
+      :visible.sync="open"
+      size="600px"
+      direction="rtl"
+      append-to-body
+    >
+      <!-- 操作按钮组 -->
+      <template #title>
+        <div class="drawer-header" v-if="!readOnly">
+          <span class="el-drawer__title">人员详情</span>
+          <div class="action-buttons">
+            <el-button type="primary" size="mini" @click="handleAdd">添加</el-button>
+            <el-button type="danger" size="mini" @click="handleDelete">删除</el-button>
+            <el-button size="mini" @click="handlePrint">打印</el-button>
+          </div>
+        </div>
+      </template>
+
+      <!-- 内容区域 -->
+      <div class="drawer-content">
+        <!-- 多选操作 -->
+        <div class="selection-info" v-if="selectedItems.length">
+          已选择 {{ selectedItems.length }} 项
+        </div>
+
+        <!-- 详细信息列表 -->
+        <el-list :model="form" class="info-list">
+          <el-checkbox-group v-model="selectedItems">
+            <section class="info-section">
+              <el-list-item v-for="item in fileList" :key="item.id">
+                <template #default>
+                  <div class="list-item-container">
+                    <el-checkbox :label="item.label" class="list-checkbox"/>
+                    <div class="info-label">{{ item.label }}：</div>
+                    <div class="info-value">{{ item.value }}</div>
+                  </div>
+                </template>
+              </el-list-item>
+            </section>
+          </el-checkbox-group>
+        </el-list>
+      </div>
+    </el-drawer>
+
+    <el-dialog :open="addFileDialog" title="添加文件">
+      <el-form :model="fileForm" label-width="80px">
+        
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listOnboarding, getOnboarding, delOnboarding, addOnboarding, updateOnboarding } from "@/api/oa/onboarding";
+import {addUser, listUser, tempRole} from "@/api/system/user";
+
+export default {
+  name: "Onboarding",
+  dicts: ['joining_status'],
+  data() {
+    return {
+      // 按钮loading
+      buttonLoading: false,
+      selectedItems: [],
+      readonly: true,
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 入职管理表格数据
+      onboardingList: [],
+      peopleList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      addFileDialog: false,
+      fileForm: {},
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        nickname: '',
+        sex: '',
+        userId: undefined,
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        userName: [
+          { required: true, message: "系统账号不能为空", trigger: "blur" }
+        ],
+        nickName: [
+          { required: true, message: "姓名不能为空", trigger: "blur" }
+        ],
+      },
+      fileList: [],
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 新增入职员工界面 */
+    // toAddOnboarding(){
+    //   this.$router.push({
+    //     path: '/people/addOnboarding',
+    //   })
+    // },
+    /** 查询人员列表列表 */
+    getList() {
+      this.loading = true;
+      listUser(this.queryParams).then(response => {
+        console.log(response);
+        this.peopleList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        onboardingId: undefined,
+        idPhoto: undefined,
+        userId: undefined,
+        createBy: undefined,
+        createTime: undefined,
+        updateBy: undefined,
+        updateTime: undefined,
+        remark: undefined,
+        delFlag: undefined
+      };
+      this.resetForm("form");
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    openAddFile(row) {
+      console.log(row);
+      this.open = true;
+      this.readOnly = false;
+    },
+    openDetail(row) {
+      console.log(row);
+      this.open = true;
+      this.readOnly = true;
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.handleQuery();
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.onboardingId)
+      this.single = selection.length!==1
+      this.multiple = !selection.length
+    },
+    addFile() {
+
+    },
+    deleteFiles() {
+
+    },
+    /** 导出按钮操作 */
+    handleExport() {
+      this.download('system/onboarding/export', {
+        ...this.queryParams
+      }, `onboarding_${new Date().getTime()}.xlsx`)
+    }
+  }
+};
+</script>
diff --git a/ruoyi-ui/src/views/oa/peoples/document/update.vue b/ruoyi-ui/src/views/oa/peoples/document/update.vue
new file mode 100644
index 0000000..c20354e
--- /dev/null
+++ b/ruoyi-ui/src/views/oa/peoples/document/update.vue
@@ -0,0 +1,340 @@
+<template>
+  <div class="main" v-loading="loading">
+    <div class="container">
+      <el-tabs v-model="activeName" @tab-click="handleClick">
+        <el-tab-pane label="基本信息" name="first">
+          <div class="">
+            <div style="display: flex;justify-content: space-between">
+              <h1 class="">员工入职登记信息表</h1>
+              <div style="display: flex;justify-content:center;align-items: center">
+                <el-button type="primary"  @click="saveFormToOnboarding">
+                  <i class="el-icon-check"></i>保存
+                </el-button>
+              </div>
+            </div>
+
+            <div class="">
+              <h2 class="">基础信息</h2>
+              <div style="display: flex">
+                <div>
+                  <image-upload v-model="form.idPhoto" style="display: flex;justify-content:center;flex-direction: column;align-items: center;"/>
+                </div>
+                <div class="">
+                  <div class="">
+                    <el-row :gutter="15" style="margin:0px 30px">
+                      <el-form ref="form" :model="form" :rules="rules">
+                        <el-col :span="12">
+                          <el-form-item label="姓名" required >
+                            <el-input v-model="form.nickName" placeholder="请输入姓名" />
+                          </el-form-item>
+                          <el-form-item label="系统账号" required >
+                            <el-input v-model="form.userName" placeholder="请输入办公系统账号" />
+                          </el-form-item>
+                          <el-form-item label="入职部门" required>
+                            <el-select v-model="form.deptId" placeholder="请选择归属部门" class="w-full">
+                              <el-option
+                                v-for="item in deptOptions"
+                                :label="item.label" :value="item.id" />
+                            </el-select>
+                          </el-form-item>
+                          <el-form-item label="身份证号" required>
+                            <el-input v-model="form.idCard" placeholder="请输入身份证号" />
+                          </el-form-item>
+                          <el-form-item label="电话" required>
+                            <el-input v-model="form.phonenumber" placeholder="请输入电话" />
+                          </el-form-item>
+                          <!--                  <el-form-item label="职位">-->
+                          <!--                    <el-select v-model="form.position" placeholder="请选择职位" class="w-full">-->
+                          <!--                      <el-option label="开发工程师" value="developer" />-->
+                          <!--                      <el-option label="产品经理" value="pm" />-->
+                          <!--                      <el-option label="设计师" value="designer" />-->
+                          <!--                    </el-select>-->
+                          <!--                  </el-form-item>-->
+                          <el-form-item label="入职日期" required>
+                            <el-date-picker
+                              v-model="form.joiningDate"
+                              type="date"
+                              placeholder="请选择入职日期"
+                              class="w-full"
+                              value-format="yyyy-MM-dd"
+                            />
+                          </el-form-item>
+                        </el-col>
+                        <el-col :span="12">
+                          <el-form-item label="性别" required>
+                            <el-radio-group v-model="form.sex">
+                              <el-radio label="0">男</el-radio>
+                              <el-radio label="1">女</el-radio>
+                            </el-radio-group>
+                          </el-form-item>
+
+                          <el-form-item label="银行卡号" required >
+                            <el-input placeholder="请输入银行卡号" v-model="form.bankCard"></el-input>
+                          </el-form-item>
+
+                          <el-form-item label="最高学历" required>
+                            <el-radio-group v-model="form.highestDegree">
+                              <el-radio label="初中">初中</el-radio>
+                              <el-radio label="高中">高中</el-radio>
+                              <el-radio label="大专">大专</el-radio>
+                              <el-radio label="本科">本科</el-radio>
+                              <el-radio label="硕士">硕士</el-radio>
+                              <el-radio label="博士">博士</el-radio>
+                            </el-radio-group>
+                          </el-form-item>
+
+                          <el-form-item label="民族">
+                            <el-select v-model="form.ethnicity" placeholder="请选择民族" class="w-full">
+                              <el-option label="汉族" value="han" />
+                              <el-option label="少数民族" value="minority" />
+                            </el-select>
+                          </el-form-item>
+
+                          <el-form-item label="出生日期" required>
+                            <el-date-picker
+                              v-model="form.birthDate"
+                              type="date"
+                              placeholder="请选择出生日期"
+                              class="w-full"
+                              value-format="yyyy-MM-dd"
+                            />
+                          </el-form-item>
+
+                          <el-form-item label="邮箱">
+                            <el-input v-model="form.email" placeholder="请输入邮箱" />
+                          </el-form-item>
+
+                          <el-form-item label="转正日期">
+                            <el-date-picker
+                              v-model="form.confirmDate"
+                              type="date"
+                              placeholder="请选择转正日期"
+                              class="w-full"
+                              value-format="yyyy-MM-dd"
+                            />
+                          </el-form-item>
+                        </el-col>
+                      </el-form>
+                    </el-row>
+                  </div>
+
+                </div>
+              </div>
+            </div>
+            <el-divider></el-divider>
+            <div class="border-b pb-4">
+              <el-tabs>
+                <el-tab-pane label="扩展信息">
+                  <div class="grid grid-cols-3 gap-6">
+                    <el-form ref="form" :model="form" :rules="rules">
+                      <el-row :gutter="18">
+                        <el-col span="8">
+                          <el-form-item label="婚姻状况">
+                            <el-radio-group v-model="form.maritalStatus">
+                              <el-radio label="未婚">未婚</el-radio>
+                              <el-radio label="已婚">已婚</el-radio>
+                            </el-radio-group>
+                          </el-form-item>
+                          <el-form-item label="政治面貌">
+                            <el-radio-group v-model="form.politicalStatus">
+                              <el-radio label="群众">群众</el-radio>
+                              <el-radio label="党员">党员</el-radio>
+                              <el-radio label="预备党员">预备党员</el-radio>
+                              <el-radio label="团员">团员</el-radio>
+                            </el-radio-group>
+                          </el-form-item>
+                        </el-col>
+                        <el-col span="8">
+                          <el-form-item label="身高">
+                            <el-input v-model="form.height" placeholder="请输入身高（单位厘米）" />
+                          </el-form-item>
+                          <el-form-item label="体重">
+                            <el-input v-model="form.weight" placeholder="请输入体重（单位千克）" />
+                          </el-form-item>
+                        </el-col>
+                        <el-col span="8">
+                          <el-form-item label="编制类型" >
+                            <el-radio-group v-model="form.staffType">
+                              <el-radio label="实习">实习</el-radio>
+                              <el-radio label="试用">试用</el-radio>
+                              <el-radio label="正式">正式</el-radio>
+                              <el-radio label="兼职">兼职</el-radio>
+                            </el-radio-group>
+                          </el-form-item>
+                        </el-col>
+                      </el-row>
+                    </el-form>
+                  </div>
+                </el-tab-pane>
+                <el-tab-pane label="户籍信息">
+                  <el-form ref="form" :model="form" :rules="rules">
+                    <el-form-item label="家庭住址">
+                      <el-input v-model="form.address" placeholder="请输入家庭住址" />
+                    </el-form-item>
+                  </el-form>
+                </el-tab-pane>
+                <el-tab-pane label="紧急联系人">
+                  <el-form ref="form" :model="form" :rules="rules">
+                    <el-form-item label="紧急联系人1">
+                      <el-input v-model="form.emergencyContact1" placeholder="请输入紧急联系人手机号" />
+                    </el-form-item>
+                    <el-form-item label="紧急联系人2">
+                      <el-input v-model="form.emergencyContact2" placeholder="请输入紧急联系人手机号" />
+                    </el-form-item>
+                  </el-form>
+                </el-tab-pane>
+                <el-tab-pane label="其他">
+                  <div class="p-4">其他内容(待拓展)</div>
+                </el-tab-pane>
+              </el-tabs>
+            </div>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="补充资料上传" name="second">
+          <div>
+            <div style="display: flex;justify-content: flex-end;align-items: center">
+              <el-button type="primary"  @click="saveFormToOnboarding">
+                <i class="el-icon-check"></i>保存
+              </el-button>
+            </div>
+
+            <el-row :gutter="15">
+              <el-col span="15">
+                <el-form ref="form" :model="form" :rules="rules">
+
+                  <el-form-item label="是否完成招聘与面试">
+                    <el-radio-group v-model="form.recruitmentCompleted">
+                      <el-radio :label="0">未完成</el-radio>
+                      <el-radio :label="1">已完成</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="是否发放offer">
+                    <el-radio-group v-model="form.offerIssued">
+                      <el-radio :label="0">未发放</el-radio>
+                      <el-radio :label="1">已发放</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="是否签约合同">
+                    <el-radio-group v-model="form.contractSigned">
+                      <el-radio :label="0">未完成</el-radio>
+                      <el-radio :label="1">已完成</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="是否提交入职材料">
+                    <el-radio-group v-model="form.documentsSubmitted">
+                      <el-radio :label="0">未提交</el-radio>
+                      <el-radio :label="1">已提交</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="是否完成入职培训">
+                    <el-radio-group v-model="form.orientationCompleted">
+                      <el-radio :label="0">未完成</el-radio>
+                      <el-radio :label="1">已完成</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+                  <el-form-item label="入职状态">
+                    <el-select v-model="form.joiningStatus" placeholder="请选择入职状态">
+                      <el-option
+                        v-for="dict in dict.type.joining_status"
+                        :key="dict.value"
+                        :label="dict.label"
+                        :value="parseInt(dict.value)"
+                      ></el-option>
+                    </el-select>
+                  </el-form-item>
+
+                  <el-form-item label="是否完成入职准备（权限分配工位分配等）">
+                    <el-radio-group v-model="form.workConditionsPrepared">
+                      <el-radio :label="0">未完成</el-radio>
+                      <el-radio :label="1">已完成</el-radio>
+                    </el-radio-group>
+                  </el-form-item>
+
+                  <el-form-item label="备注">
+                    <el-input v-model="form.remark" placeholder="请输入备注" type="textarea"></el-input>
+                  </el-form-item>
+
+                </el-form>
+
+              </el-col>
+
+            </el-row>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+  </div>
+</template>
+
+<script>
+import {getOnboarding, updateOnboarding} from "@/api/oa/onboarding";
+import {deptTreeSelect} from "@/api/system/user";
+
+export default {
+  // dicts: ['joining_status'],
+  data() {
+    return {
+
+      activeName:"first",
+      loading:false,
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        onboardingId: [
+          { required: true, message: "入职记录ID不能为空", trigger: "blur" }
+        ],
+        highestDegree: [
+          { required: true, message: "最高学历不能为空", trigger: "blur" }
+        ],
+      },
+      deptOptions:[]
+    };
+
+  },
+
+  created() {
+    this.getDeptList();
+    this.getOnboardingById(this.$route.params.onboardingId);
+  },
+  methods: {
+    getDeptList(){
+      deptTreeSelect().then(response => {
+        this.deptOptions = response.data[0].children;
+      });
+    },
+    getOnboardingById(id){
+      getOnboarding(id).then(response => {
+        this.form = response.data;
+      })
+    },
+    saveFormToOnboarding(){
+      this.loading = true;
+      updateOnboarding(this.form).then(response => {
+        this.$modal.msgSuccess("新增成功");
+        this.loading = false;
+        this.goBack()
+      })
+    },
+    /** 返回页面 */
+    goBack() {
+      // 关闭当前标签页并返回上个页面
+      this.$tab.closePage(this.$route)
+      this.$router.back()
+    },
+  }
+};
+</script>
+
+<style scoped>
+.main{
+  padding: 10px;
+  background-color: #f6f6f6;
+}
+.container{
+  margin: 10px;
+  padding: 10px;
+  background-color: white;
+  border-radius: 10px;
+}
+</style>
diff --git a/ruoyi-ui/src/views/oa/peoples/status/ProbationApply.vue b/ruoyi-ui/src/views/oa/peoples/status/ProbationApply.vue
new file mode 100644
index 0000000..6270c1e
--- /dev/null
+++ b/ruoyi-ui/src/views/oa/peoples/status/ProbationApply.vue
@@ -0,0 +1,129 @@
+<template>
+  <div class="app-container apply-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>转正申请</span>
+        <el-tag :type="statusType">{{ statusText }}</el-tag>
+      </div>
+
+      <el-steps :active="activeStep" finish-status="success">
+        <el-step title="填写申请" />
+        <el-step title="部门审批" />
+        <el-step title="HR确认" />
+      </el-steps>
+
+      <el-form :model="form" :rules="rules" ref="form" class="apply-form">
+        <el-form-item label="试用总结" prop="summary">
+          <el-input
+            type="textarea"
+            :rows="5"
+            v-model="form.summary"
+            placeholder="请总结试用期间的工作成果、收获与不足"
+          />
+        </el-form-item>
+
+        <el-form-item label="附件材料">
+          <el-upload
+            action="/api/upload"
+            multiple
+            :limit="3"
+            :file-list="fileList"
+            :on-success="handleUploadSuccess"
+          >
+            <el-button icon="el-icon-upload">上传文件</el-button>
+            <div class="el-upload__tip">支持PDF/DOC/PPT格式，单个文件不超过20MB</div>
+          </el-upload>
+        </el-form-item>
+
+        <el-form-item>
+          <el-button type="primary" @click="submitForm">提交申请</el-button>
+          <el-button @click="saveDraft">保存草稿</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+
+    <!-- 申请记录 -->
+    <el-card class="box-card history-card">
+      <div slot="header">申请记录</div>
+      <el-table :data="historyList">
+        <el-table-column prop="applyDate" label="申请时间" width="180" />
+        <el-table-column prop="status" label="状态">
+          <template slot-scope="scope">
+            <el-tag :type="statusMap[scope.row.status].type">
+              {{ statusMap[scope.row.status].label }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="comment" label="审批意见" />
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+// import { getApplyInfo, submitApply } from '@/api/user/probation'
+
+export default {
+  name: 'ProbationApply',
+  data() {
+    return {
+      activeStep: 1,
+      form: {
+        summary: '',
+        attachments: []
+      },
+      rules: {
+        summary: [
+          { required: true, message: '请输入试用总结', trigger: 'blur' },
+          { min: 100, message: '总结内容不少于100字', trigger: 'blur' }
+        ]
+      },
+      fileList: [],
+      historyList: [],
+      statusMap: {
+        0: { label: '草稿', type: 'info' },
+        1: { label: '待审批', type: 'warning' },
+        2: { label: '已通过', type: 'success' },
+        3: { label: '已驳回', type: 'danger' }
+      }
+    }
+  },
+  computed: {
+    statusType() {
+      return this.historyList[0]?.status ? this.statusMap[this.historyList[0].status].type : 'info'
+    },
+    statusText() {
+      return this.historyList[0]?.status ? this.statusMap[this.historyList[0].status].label : '未申请'
+    }
+  },
+  methods: {
+    submitForm() {
+      this.$refs.form.validate(valid => {
+        if (valid) {
+          // submitApply(this.form).then(() => {
+          //   this.$message.success('申请已提交')
+          //   this.loadHistory()
+          // })
+        }
+      })
+    },
+    handleUploadSuccess(res) {
+      this.form.attachments.push(res.data)
+    },
+    loadHistory() {
+      // getApplyInfo().then(res => {
+      //   this.historyList = res.data
+      // })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.apply-form {
+  margin-top: 20px;
+}
+.history-card {
+  margin-top: 20px;
+}
+</style>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/oa/peoples/status/ProbationManage.vue b/ruoyi-ui/src/views/oa/peoples/status/ProbationManage.vue
new file mode 100644
index 0000000..834d9d1
--- /dev/null
+++ b/ruoyi-ui/src/views/oa/peoples/status/ProbationManage.vue
@@ -0,0 +1,198 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="姓名" prop="nickname">
+        <el-input
+          clearable
+          v-model="queryParams.nickname"
+          placeholder="根据姓名查询"
+        ></el-input>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="试用状态">
+          <el-option label="试用中" value="0"></el-option>
+          <el-option label="待审核" value="1"></el-option>
+          <el-option label="已转正" value="2"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="部门" prop="deptId">
+        <el-select
+          v-model="queryParams.deptId"
+          placeholder="选择部门"
+          clearable
+        >
+          <el-option
+            v-for="dept in deptOptions"
+            :key="dept.deptId"
+            :label="dept.deptName"
+            :value="dept.deptId"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-check"
+          size="mini"
+          @click="handleBatchRegular"
+          :disabled="multiple"
+        >批量转正</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="probationList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" align="center" type="index"/>
+      <el-table-column label="姓名" align="center" prop="nickName"/>
+      <el-table-column label="性别" align="center" prop="sex">
+        <template slot-scope="scope">
+          <span>{{ scope.row.sex === '0' ? '男' : '女' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="部门" align="center" prop="dept.deptName"/>
+      <el-table-column label="试用期限" align="center" width="200">
+        <template slot-scope="scope">
+          <div>{{ scope.row.probationStart }} ~ {{ scope.row.probationEnd }}</div>
+          <el-tag :type="getRemainingDaysStatus(scope.row.remainingDays)">
+            剩余{{ scope.row.remainingDays }}天
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="状态" align="center">
+        <template slot-scope="scope">
+          <el-tag :type="statusMap[scope.row.status].type">
+            {{ statusMap[scope.row.status].label }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleRegular(scope.row)"
+            v-if="scope.row.status === '0'"
+          >转正</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleDetail(scope.row)"
+          >详情</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 转正对话框 -->
+    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="500px">
+      <el-form :model="form" label-width="80px">
+        <el-form-item label="生效日期">
+          <el-date-picker
+            v-model="form.effectiveDate"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="选择转正日期"
+          />
+        </el-form-item>
+        <el-form-item label="转正意见">
+          <el-input
+            type="textarea"
+            :rows="4"
+            v-model="form.remark"
+            placeholder="请输入转正意见"
+          />
+        </el-form-item>
+      </el-form>
+      <span slot="footer">
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="submitRegular">确认</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// import { getProbationList, batchRegular } from '@/api/hr/probation'
+
+export default {
+  name: 'ProbationManage',
+  data() {
+    return {
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        nickname: '',
+        status: '',
+        deptId: null
+      },
+      statusMap: {
+        '0': { label: '试用中', type: 'warning' },
+        '1': { label: '待审核', type: 'info' },
+        '2': { label: '已转正', type: 'success' }
+      },
+      probationList: [],
+      deptOptions: [],
+      multiple: true,
+      dialogVisible: false,
+      dialogTitle: '',
+      form: {
+        userIds: [],
+        effectiveDate: '',
+        remark: ''
+      }
+    }
+  },
+  methods: {
+    getList() {
+      // getProbationList(this.queryParams).then(res => {
+      //   this.probationList = res.rows
+      //   this.total = res.total
+      // })
+    },
+    handleRegular(row) {
+      this.form = {
+        userIds: [row.userId],
+        effectiveDate: '',
+        remark: ''
+      }
+      this.dialogTitle = `转正操作 - ${row.nickName}`
+      this.dialogVisible = true
+    },
+    handleBatchRegular() {
+      this.form.userIds = this.selectedIds
+      this.dialogTitle = `批量转正 (${this.selectedIds.length}人)`
+      this.dialogVisible = true
+    },
+    submitRegular() {
+      // batchRegular(this.form).then(() => {
+      //   this.$message.success('操作成功')
+      //   this.dialogVisible = false
+      //   this.getList()
+      // })
+    },
+    getRemainingDaysStatus(days) {
+      if (days > 7) return 'success'
+      if (days > 3) return 'warning'
+      return 'danger'
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/oa/peoples/status/index.vue b/ruoyi-ui/src/views/oa/peoples/status/index.vue
new file mode 100644
index 0000000..d077e0e
--- /dev/null
+++ b/ruoyi-ui/src/views/oa/peoples/status/index.vue
@@ -0,0 +1,30 @@
+<template>
+  <div class="container">
+    <!-- 人事管理界面 -->
+    <div v-if="userRole === 'HR'">
+      <ProbationManage />
+    </div>
+
+    <!-- 员工申请界面 -->
+    <div v-else>
+      <ProbationApply />
+    </div>
+  </div>
+</template>
+
+<script>
+import ProbationApply from "./ProbationApply";
+import ProbationManage from "./ProbationManage";
+
+export default {
+  data() {
+    return {
+      userRole: 'HR', // 实际应从登录信息获取
+    }
+  },
+  components: {
+    ProbationApply,
+    ProbationManage,
+  }
+}
+</script>
\ No newline at end of file