Day58(28)-F:\vs_ai_work\vue-tlias-management
ElementPlus
员工管理
<div class="container">
<el-button type="primary" @click="">+新增员工</el-button>
<el-button type="danger" @click="">-批量删除</el-button>
</div>
<div class="comtainer">
<el-table :data="empList" border style="width: 100%">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column prop="name" label="姓名" width="120" align="center" />
<el-table-column prop="gender" label="性别" width="120" align="center" >
<template #default="scope">
{{ scope.row.gender==1?'男':'女' }}
</template>
</el-table-column>
<el-table-column prop="image" label="头像" width="120" align="center" >
<template #default="scope">
<img :src="scope.row.image" alt="" height="40px">
</template>
</el-table-column>
<el-table-column prop="deptName" label="所属部门" width="120" align="center" />
<el-table-column prop="job" label="职位" width="120" align="center" >
<template #default="scope">
<span v-if="scope.row.job==1">班主任</span>
<span v-if="scope.row.job==2">讲师</span>
<span v-if="scope.row.job==3">学工主管</span>
<span v-if="scope.row.job==4">教研主管</span>
<span v-if="scope.row.job==5">咨询师</span>
<span v-else>其他</span>
</template>
</el-table-column>
<el-table-column prop="entryDate" label="入职日期" width="180" align="center" />
<el-table-column prop="updateTime" label="最后操作时间" width="200" align="center" />
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button type="primary" size="small" @click=""><el-icon><EditPen /></el-icon>编辑</el-button>
<el-button type="danger" size="small" @click=""><el-icon><DeleteFilled /></el-icon>删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="container">
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[5,10, 20, 30, 50,75,100]"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
emp.js
import request from "@/utils/request";
//查询员工列表数据
export const queryPageApi = (name,gender,begin,end,page,pageSize)=>
request.get(/emps?name=${name}&gender=${gender}&begin=${begin}&end=${end}&page=${page}&pageSize=${pageSize});
//新增
//根据ID查询部门数据
//修改
//删除

浙公网安备 33010602011771号