From 4634339bc2a5e190055d215849f561683e08a525 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=83=AD=E5=BA=86=E6=B3=B0?=
 <12369755+htcloud1@user.noreply.gitee.com>
Date: Tue, 18 Aug 2026 21:39:58 +0800
Subject: [PATCH] =?UTF-8?q?feat(executor/people):=20=E6=9F=A5=E7=9C=8B?=
 =?UTF-8?q?=E6=94=B9=E4=B8=BA=E6=96=B0=E9=A1=B5=E9=9D=A2=20(=E5=8F=AA?=
 =?UTF-8?q?=E8=AF=BB,=20=E6=97=A0=E8=B4=A6=E5=8F=B7/=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E5=AD=97=E6=AE=B5)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新建 executor/PersonDetail.vue, 结构与 NewPerson.vue 一致
  (page-card + breadcrumb + el-card form-card + 两列 el-row),
  但只读 + 不显示用户名/初始密码/状态 (6 字段: 姓名/手机号/所属公司/部门/职务/角色)
- router 加 /executor/people/detail/:id → PersonDetail.vue
- People.vue: onView 改为 router.push, 删 view dialog 块 + view/viewOpen refs

Co-Authored-By: Claude <noreply@anthropic.com>
---
 ry-vue3/src/router/index.js                 |   1 +
 ry-vue3/src/views/executor/People.vue       |  18 +--
 ry-vue3/src/views/executor/PersonDetail.vue | 139 ++++++++++++++++++++
 3 files changed, 141 insertions(+), 17 deletions(-)
 create mode 100644 ry-vue3/src/views/executor/PersonDetail.vue

diff --git a/ry-vue3/src/router/index.js b/ry-vue3/src/router/index.js
index d476f38..6fd1f3f 100644
--- a/ry-vue3/src/router/index.js
+++ b/ry-vue3/src/router/index.js
@@ -106,6 +106,7 @@ const routes = [
       { path: 'people', name: 'executor-people', component: () => import('@/views/executor/People.vue'), meta: { title: '人员管理' } },
       { path: 'people/new', name: 'executor-people-new', component: () => import('@/views/executor/NewPerson.vue'), meta: { title: '新建人员' } },
       { path: 'people/edit/:id', name: 'executor-people-edit', component: () => import('@/views/executor/NewPerson.vue'), meta: { title: '编辑人员' } },
+      { path: 'people/detail/:id', name: 'executor-people-detail', component: () => import('@/views/executor/PersonDetail.vue'), meta: { title: '人员详情' } },
       { path: 'account', name: 'executor-account', component: () => import('@/views/executor/Account.vue'), meta: { title: '账号信息' } },
       { path: 'labor', name: 'executor-labor', component: () => import('@/views/executor/Labor.vue'), meta: { title: '劳务凭证' } }
     ]
diff --git a/ry-vue3/src/views/executor/People.vue b/ry-vue3/src/views/executor/People.vue
index 939e88d..a9174e8 100644
--- a/ry-vue3/src/views/executor/People.vue
+++ b/ry-vue3/src/views/executor/People.vue
@@ -101,20 +101,6 @@
         <el-button type="primary" @click="resultVisible = false">关闭</el-button>
       </template>
     </el-dialog>
-
-    <!-- ========== Dialog: 查看 ========== -->
-    <el-dialog v-model="viewOpen" title="人员详情" width="520px">
-      <el-descriptions :column="2" border>
-        <el-descriptions-item label="姓名">{{ view.name }}</el-descriptions-item>
-        <el-descriptions-item label="手机号">{{ view.phone }}</el-descriptions-item>
-        <el-descriptions-item label="所属公司" :span="2">{{ view.orgName }}</el-descriptions-item>
-        <el-descriptions-item label="部门">{{ view.department }}</el-descriptions-item>
-        <el-descriptions-item label="职务">{{ view.position }}</el-descriptions-item>
-        <el-descriptions-item label="角色">{{ translatePersonRole(view.role) }}</el-descriptions-item>
-        <el-descriptions-item label="状态">{{ view.status || '正常' }}</el-descriptions-item>
-      </el-descriptions>
-      <template #footer><el-button @click="viewOpen = false">关闭</el-button></template>
-    </el-dialog>
   </div>
 </template>
 
@@ -137,8 +123,6 @@ const q = reactive({ name: '', phone: '', orgName: '', department: '', position:
 const page = reactive({ pageNum: 1, pageSize: 10, total: 0 })
 
 const importOpen = ref(false)
-const view = ref({})
-const viewOpen = ref(false)
 
 const uploadRef = ref()
 const importFile = ref(null)   // el-upload 选中的原始 File 对象 (file.raw)
@@ -165,7 +149,7 @@ function reset() { Object.assign(q, { name:'',phone:'',orgName:'',department:'',
 function goNew() { router.push('/executor/people/new') }
 function goEdit(row) { router.push(`/executor/people/edit/${row.personId}`) }
 
-function onView(row) { view.value = row; viewOpen.value = true }
+function onView(row) { router.push(`/executor/people/detail/${row.personId}`) }
 
 async function onToggleStatus(row, action) {
   try {
diff --git a/ry-vue3/src/views/executor/PersonDetail.vue b/ry-vue3/src/views/executor/PersonDetail.vue
new file mode 100644
index 0000000..c54ab2c
--- /dev/null
+++ b/ry-vue3/src/views/executor/PersonDetail.vue
@@ -0,0 +1,139 @@
+<template>
+  <!--
+    结构与 executor/NewPerson.vue 一致, 但只读, 不显示用户名/初始密码/状态
+    字段精简: 姓名 / 手机号 / 所属公司 / 部门 / 职务 / 角色
+  -->
+  <div class="page-card person-detail">
+    <!-- 面包屑 -->
+    <div class="breadcrumb">
+      <a @click="goBack">人员管理</a> &gt; 人员详情
+    </div>
+
+    <!-- 详情卡片 -->
+    <el-card v-loading="loadingDetail" shadow="never" class="form-card nested">
+      <el-form :model="form" label-width="120px" class="readonly-form">
+
+        <el-row :gutter="12">
+          <el-col :span="12">
+            <el-form-item label="姓名">
+              <el-input v-model="form.name" readonly />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="手机号">
+              <el-input v-model="form.phone" readonly />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="12">
+          <el-col :span="12">
+            <el-form-item label="所属公司">
+              <el-input v-model="form.orgName" readonly />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="部门">
+              <el-input v-model="form.department" readonly />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="12">
+          <el-col :span="12">
+            <el-form-item label="职务">
+              <el-input v-model="form.position" readonly />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="角色">
+              <!-- 与 sponsor/PersonDetail 一致: el-tag 展示 -->
+              <el-tag :type="form.role === 'admin' ? 'warning' : 'primary'" disable-transitions>
+                {{ translatePersonRole(form.role) }}
+              </el-tag>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+      </el-form>
+    </el-card>
+
+    <!-- 操作按钮 -->
+    <div class="form-actions">
+      <el-button @click="goBack">返回</el-button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onMounted } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import { ElMessage } from 'element-plus'
+import { bizGet } from '@/api/public'
+import { translatePersonRole } from '@/utils/roleMap'
+
+const router = useRouter()
+const route = useRoute()
+
+const loadingDetail = ref(false)
+const personId = route.params.id
+
+const form = reactive({
+  name: '',
+  phone: '',
+  orgName: '',
+  department: '',
+  position: '',
+  role: '',
+})
+
+async function loadDetail() {
+  loadingDetail.value = true
+  try {
+    const res = await bizGet('person', personId)
+    if (res?.code === 200 && res.data) {
+      const d = res.data
+      Object.assign(form, {
+        name: d.name || '',
+        phone: d.phone || '',
+        orgName: d.orgName || '',
+        department: d.department || '',
+        position: d.position || '',
+        role: d.role || '',
+      })
+    } else {
+      ElMessage.error(res?.msg || '加载失败')
+      goBack()
+    }
+  } catch (e) {
+    ElMessage.error(e?.msg || '加载失败')
+    goBack()
+  } finally {
+    loadingDetail.value = false
+  }
+}
+
+function goBack() {
+  router.push({ path: '/executor/people', query: { _t: Date.now() } })
+}
+
+onMounted(loadDetail)
+</script>
+
+<style scoped>
+/* 结构对齐 executor/NewPerson.vue (page-card / form-card nested / form-actions 风格) */
+.person-detail { max-width: 1200px; }
+.page-card { background: #fff; padding: 16px 20px; border-radius: 6px; border: 1px solid #f0f0f0; }
+.breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 16px; }
+.breadcrumb a { color: var(--brand-primary); cursor: pointer; text-decoration: none; }
+.breadcrumb a:hover { color: var(--brand-primary-deep, var(--brand-primary)); }
+
+.form-card.nested { background: transparent; border: none; box-shadow: none; }
+:deep(.form-card .el-card__body) { padding: 24px 28px; }
+
+.form-actions { margin-top: 16px; display: flex; gap: 8px; }
+
+:deep(.el-input__wrapper), :deep(.el-textarea__inner) { border-radius: 4px; }
+/* readonly 输入框视觉降级 (灰色背景) */
+:deep(.el-input.is-readonly .el-input__wrapper) { background-color: #fafafa; box-shadow: none; }
+</style>
\ No newline at end of file