修改员工和评委的设置

lrj

4 天以前 6d519474e44855682043d3c40db2c86a6822caca

 web/src/views/employee/index.vue

@@ -16,16 +16,6 @@
            <el-icon><Search /></el-icon>
          </template>
        </el-input>
        <el-select
          v-model="searchForm.role"
          placeholder="选择角色"
          style="width: 150px"
          clearable
        >
          <el-option label="管理员" value="admin" />
          <el-option label="工作人员" value="staff" />
          <el-option label="审核员" value="reviewer" />
        </el-select>
        <el-button type="primary" @click="handleSearch">
          <el-icon><Search /></el-icon>
          搜索
@@ -38,21 +28,18 @@

      <!-- 员工列表 -->
      <el-table :data="tableData" style="width: 100%" v-loading="loading">
        <el-table-column label="头像" width="80" align="center">
          <template #default="{ row }">
            <el-avatar :src="row.avatar" :size="40">
              <el-icon><User /></el-icon>
            </el-avatar>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="员工名称" min-width="120" />
        <el-table-column prop="phone" label="联系电话" width="140" />
        <el-table-column prop="role" label="角色" width="120" align="center">
        <el-table-column prop="roleId" label="角色" width="120" align="center">
          <template #default="{ row }">
            <el-tag :type="getRoleType(row.role)">{{ getRoleText(row.role) }}</el-tag>
            <el-tag :type="getRoleType(row.roleId)">{{ getRoleText(row.roleId) }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="180" />
        <el-table-column prop="createTime" label="创建时间" width="180">
          <template #default="{ row }">
            {{ formatDateTime(row.createTime) }}
          </template>
        </el-table-column>
        <el-table-column label="操作" width="150" fixed="right">
          <template #default="{ row }">
            <div class="table-actions">
@@ -67,107 +54,92 @@
        </el-table-column>
      </el-table>

      <!-- 分页 -->
      <div class="pagination">
        <el-pagination
          v-model:current-page="pagination.page"
          v-model:page-size="pagination.size"
          :page-sizes="[10, 20, 50, 100]"
          :total="pagination.total"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
      <!-- 空状态 -->
      <div v-if="!loading && tableData.length === 0" class="empty-state">
        <el-empty description="暂无员工数据" />
      </div>
    </div>

    <!-- 员工详情对话框 -->
    <EmployeeForm
      v-model:visible="formVisible"
      :employee="currentEmployee"
      @success="handleFormSuccess"
    />
  </div>
</template>

<script setup lang="ts">
import { reactive, ref, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { employeeApi, type Employee } from '@/api/employee'
import EmployeeForm from './EmployeeForm.vue'

const loading = ref(false)
const formVisible = ref(false)
const currentEmployee = ref<Employee | null>(null)

// 搜索表单
const searchForm = reactive({
  name: '',
  role: ''
})

// 分页信息
const pagination = reactive({
  page: 1,
  size: 10,
  total: 0
  name: ''
})

// 表格数据
const tableData = ref([
  {
    id: 1,
    name: '管理员',
    avatar: '',
    phone: '13800138000',
    role: 'admin',
    createTime: '2024-01-01 09:00:00'
  },
  {
    id: 2,
    name: '工作人员A',
    avatar: '',
    phone: '13800138001',
    role: 'staff',
    createTime: '2024-01-02 10:30:00'
  },
  {
    id: 3,
    name: '审核员B',
    avatar: '',
    phone: '13800138002',
    role: 'reviewer',
    createTime: '2024-01-03 14:15:00'
  }
])
const tableData = ref<Employee[]>([])

// 获取角色标签类型
const getRoleType = (role: string) => {
const getRoleType = (roleId: string) => {
  const typeMap: Record<string, string> = {
    'admin': 'danger',
    'staff': 'primary',
    'reviewer': 'success'
    'ADMIN': 'danger',
    'MANAGER': 'warning',
    'STAFF': 'primary',
    'REVIEWER': 'success'
  }
  return typeMap[role] || 'info'
  return typeMap[roleId] || 'info'
}

// 获取角色文本
const getRoleText = (role: string) => {
const getRoleText = (roleId: string) => {
  const textMap: Record<string, string> = {
    'admin': '管理员',
    'staff': '工作人员',
    'reviewer': '审核员'
    'ADMIN': '管理员',
    'MANAGER': '经理',
    'STAFF': '工作人员',
    'REVIEWER': '审核员'
  }
  return textMap[role] || '未知'
  return textMap[roleId] || roleId
}

// 格式化日期时间
const formatDateTime = (dateTime: string | undefined) => {
  if (!dateTime) return '-'
  return new Date(dateTime).toLocaleString('zh-CN', {
    year: 'numeric',
    month: '2-digit',
    day: '2-digit',
    hour: '2-digit',
    minute: '2-digit'
  })
}

// 搜索
const handleSearch = () => {
  pagination.page = 1
  loadData()
}

// 新增员工
const handleAdd = () => {
  ElMessage.info('新增员工功能待开发')
  currentEmployee.value = null
  formVisible.value = true
}

// 编辑员工
const handleEdit = (row: any) => {
  ElMessage.info(`编辑员工：${row.name}`)
const handleEdit = (row: Employee) => {
  currentEmployee.value = row
  formVisible.value = true
}

// 删除员工
const handleDelete = async (row: any) => {
const handleDelete = async (row: Employee) => {
  try {
    await ElMessageBox.confirm(`确定要删除员工"${row.name}"吗？`, '提示', {
      confirmButtonText: '确定',
@@ -175,33 +147,42 @@
      type: 'warning'
    })
    
    loading.value = true
    await employeeApi.deleteEmployee(row.id)
    ElMessage.success('删除成功')
    loadData()
  } catch {
    // 用户取消
    await loadData()
  } catch (error: any) {
    if (error !== 'cancel') {
      ElMessage.error(error.message || '删除失败')
    }
  } finally {
    loading.value = false
  }
}

// 分页大小改变
const handleSizeChange = (size: number) => {
  pagination.size = size
  loadData()
}

// 当前页改变
const handleCurrentChange = (page: number) => {
  pagination.page = page
// 表单提交成功
const handleFormSuccess = () => {
  formVisible.value = false
  loadData()
}

// 加载数据
const loadData = () => {
  loading.value = true
  // TODO: 调用API加载数据
  setTimeout(() => {
    pagination.total = 3
const loadData = async () => {
  try {
    loading.value = true
    const name = searchForm.name.trim()
    
    if (name) {
      tableData.value = await employeeApi.searchEmployees(name)
    } else {
      tableData.value = await employeeApi.getEmployees()
    }
  } catch (error: any) {
    ElMessage.error(error.message || '加载数据失败')
    tableData.value = []
  } finally {
    loading.value = false
  }, 500)
  }
}

onMounted(() => {