ChoChoX/backmanagerweb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增readme

Browse Source
This commit is contained in:
ChoChoX
2026-06-26 10:25:52 +08:00
parent ccc9cb717a
commit 37e2e8df74
4 changed files with 433 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/api/employee.js
View File

@@ -1,4 +1,5 @@
import request from './request'
import { DEPARTMENT_LIST } from '../constants/departments'
// 获取员工列表
export const getEmployeeList = (params, config) => {
@@ -29,3 +30,15 @@ export const updateEmployee = (id, data) => {
export const deleteEmployeeAPI = (id) => {
return request.delete(`/employees/${id}`)
}
/**
* 获取部门列表
*
* 当前返回本地常量（与后端数据库一致）。
* 当后端部署了 GET /api/departments 接口后，将下方注释替换为：
*
* export const getDepartmentList = () => request.get('/departments')
*/
export const getDepartmentList = () => {
return Promise.resolve({ code: 0, message: 'ok', data: DEPARTMENT_LIST })
}

83
src/components/employee.vue
View File

@@ -7,11 +7,14 @@ import {
getEmployeeList,
createEmployee,
updateEmployee,
deleteEmployeeAPI
deleteEmployeeAPI,
getDepartmentList,
getSimpleEmployeeList
} from '../api/employee'
import { hasPermission, getUserInfo } from '../store/user'
import { formatDateTime, formatDate } from '../utils/date'
import { createUser } from '../api/user'
import { DEPARTMENT_NAME_LIST } from '../constants/departments'
const form = reactive({
name: '',
@@ -43,6 +46,8 @@ const currentDetail = ref(null)
// 分页相关
const currentPage = ref(1)
const pageSize = ref(10)
const total = ref(0)
const totalPages = ref(0)
// 新增用户相关状态
const showCreateUserForm = ref(false)
@@ -57,24 +62,15 @@ const userForm = reactive({
})
// 部门列表
const departmentOptions = [
'信息技术部', '总经理办公室', '招商部', '采购部', '运营部', '财务部',
'销售部', '技术部', '市场部', '仓储部', '人事部', '行政部'
]
const departmentOptions = ref([...DEPARTMENT_NAME_LIST])
// 学历列表
const educationOptions = ['高中', '专科', '本科', '硕士', '博士']
// 分页后的数据
const paginatedData = computed(() => {
const start = (currentPage.value - 1) * pageSize.value
const end = start + pageSize.value
return searchResults.value.slice(start, end)
})
// 分页后的数据（服务端已分页，searchResults 即为当前页数据）
const paginatedData = computed(() => searchResults.value)
onMounted(() => {
fetchData()
})
// onMounted 已在下方合并（同时加载部门列表）
// 监听筛选变化
watch([filterStatus], () => {
@@ -82,17 +78,28 @@ watch([filterStatus], () => {
handleSearch()
})
// 监听搜索结果变化，重置页码
watch(searchResults, () => {
currentPage.value = 1
})
// 监听筛选变化时重置页码（服务端分页：已由 filterStatus watch 处理）
// watch(searchResults 不再重置页码，避免翻页后被重置回第 1 页
// 获取员工列表
const fetchData = async () => {
const fetchData = async (page) => {
loading.value = true
const res = await getEmployeeList()
const params = {
page: page || currentPage.value,
pageSize: pageSize.value
}
const res = await getEmployeeList(params)
if (res.code === 0 || res.code === 200) {
searchResults.value = res.data.list || res.data
if (res.data && Array.isArray(res.data.list)) {
// 服务端分页响应
searchResults.value = res.data.list
total.value = res.data.total
totalPages.value = res.data.totalPages
} else if (Array.isArray(res.data)) {
// 兼容直接返回数组的场景（如 mock）
searchResults.value = res.data
total.value = res.data.length
}
}
showSearchResults.value = true
loading.value = false
@@ -106,8 +113,11 @@ const handleSearch = async () => {
cancelCreateUser()
}
currentPage.value = 1
loading.value = true
const params = {
page: 1,
pageSize: pageSize.value,
status: filterStatus.value !== '' ? filterStatus.value : undefined
}
if (search.value) {
@@ -121,7 +131,14 @@ const handleSearch = async () => {
}
const res = await getEmployeeList(params)
if (res.code === 0 || res.code === 200) {
searchResults.value = res.data.list || res.data
if (res.data && Array.isArray(res.data.list)) {
searchResults.value = res.data.list
total.value = res.data.total
totalPages.value = res.data.totalPages
} else if (Array.isArray(res.data)) {
searchResults.value = res.data
total.value = res.data.length
}
}
showSearchResults.value = true
loading.value = false
@@ -134,7 +151,7 @@ const resetSearch = () => {
showSearchResults.value = false
showAddForm.value = false
currentPage.value = 1
fetchData()
fetchData(1)
}
// 清空搜索
@@ -234,7 +251,7 @@ const saveEmployee = async () => {
})
}
} catch (e) {
ElMessage.error(e?.message || '操作失败，请稍后重试')
ElMessage.error(e?.response?.data?.message || e?.message || '操作失败，请稍后重试')
}
}
@@ -250,7 +267,7 @@ const deleteEmployee = async (id) => {
ElMessage.success('删除成功')
fetchData()
} catch (e) {
ElMessage.error(e?.message || '删除失败，请稍后重试')
ElMessage.error(e?.response?.data?.message || e?.message || '删除失败，请稍后重试')
}
})
}
@@ -274,9 +291,10 @@ const closeDetail = () => {
currentDetail.value = null
}
// 页码变化
// 页码变化（服务端分页：重新请求后端）
const handleCurrentChange = (val) => {
currentPage.value = val
fetchData(val)
}
// 打开用户创建表单（从员工新增后调用）
@@ -293,6 +311,15 @@ const openUserForm = (employee) => {
userForm.employee_id = employee.id
}
// 加载部门列表 + 员工列表
onMounted(async () => {
const res = await getDepartmentList()
if (res.code === 0 || res.code === 200) {
departmentOptions.value = res.data.map(d => d.description) || DEPARTMENT_NAME_LIST
}
fetchData(1)
})
// 保存用户（从员工页面创建）
const saveUserFromEmployee = async () => {
if (!userForm.username) {
@@ -382,7 +409,7 @@ const showSalary = computed(() => ['总经理办公室', '财务部'].includes(g
<div v-else>
<div class="list-header">
<span class="total-count">共找到 {{ searchResults.length }} 条记录</span>
<span class="total-count">共找到 {{ total }} 条记录</span>
</div>
<el-table :data="paginatedData" v-loading="loading" border style="width: 100%" @row-dblclick="handleRowDblClick" row-class-name="clickable-row">
@@ -428,7 +455,7 @@ const showSalary = computed(() => ['总经理办公室', '财务部'].includes(g
<el-pagination
v-model:current-page="currentPage"
:page-size="pageSize"
:total="searchResults.length"
:total="total"
layout="prev, pager, next"
prev-text="上一页"
next-text="下一页"

86
src/components/user.vue
View File

@@ -9,9 +9,10 @@ import {
updateUser,
deleteUserAPI
} from '../api/user'
import { getEmployeeList } from '../api/employee'
import { getSimpleEmployeeList, getDepartmentList } from '../api/employee'
import { hasPermission } from '../store/user'
import { formatDateTime } from '../utils/date'
import { DEPARTMENT_LIST } from '../constants/departments'
const form = reactive({
username: '',
@@ -37,16 +38,11 @@ const currentDetail = ref(null)
// 分页相关
const currentPage = ref(1)
const pageSize = ref(10)
const total = ref(0)
const totalPages = ref(0)
// 部门列表
const deptList = ref([
{ id: 1, name: 'admin', description: '信息技术部' },
{ id: 2, name: 'general_manager', description: '总经理办公室' },
{ id: 3, name: 'franchise_manager', description: '招商部' },
{ id: 4, name: 'operations_manager', description: '运营部' },
{ id: 5, name: 'procurement_manager', description: '采购部' },
{ id: 6, name: 'finance', description: '财务部' }
])
// 部门列表（动态加载，回退到常量）
const deptList = ref([...DEPARTMENT_LIST])
// 员工列表
const employeeList = ref([])
@@ -54,40 +50,53 @@ const employeeList = ref([])
onMounted(() => {
fetchData()
fetchEmployees()
loadDepartments()
})
// 加载部门列表
const loadDepartments = async () => {
const res = await getDepartmentList()
if (res.code === 0 || res.code === 200) {
deptList.value = res.data || DEPARTMENT_LIST
}
}
// 监听筛选变化
watch([filterType, filterStatus], () => {
currentPage.value = 1
handleSearch()
})
// 监听搜索结果变化
watch(searchResults, () => {
currentPage.value = 1
})
// 监听搜索结果变化（服务端分页：不重置页码，避免翻页后被重置回第 1 页）
// 分页后的数据
const paginatedData = computed(() => {
const start = (currentPage.value - 1) * pageSize.value
const end = start + pageSize.value
return searchResults.value.slice(start, end)
})
// 分页后的数据（服务端已分页）
const paginatedData = computed(() => searchResults.value)
// 获取员工列表
// 获取员工列表（用于下拉选择，改用 simple 接口：无数据范围限制，仅返还在职员工基本信息）
const fetchEmployees = async () => {
const res = await getEmployeeList()
const res = await getSimpleEmployeeList()
if (res.code === 0 || res.code === 200) {
employeeList.value = res.data.list || res.data
employeeList.value = res.data
}
}
// 获取用户列表
const fetchData = async () => {
const fetchData = async (page) => {
loading.value = true
const res = await getUserList()
const params = {
page: page || currentPage.value,
pageSize: pageSize.value
}
const res = await getUserList(params)
if (res.code === 0 || res.code === 200) {
searchResults.value = res.data.list || res.data
if (res.data && Array.isArray(res.data.list)) {
searchResults.value = res.data.list
total.value = res.data.total
totalPages.value = res.data.totalPages
} else if (Array.isArray(res.data)) {
searchResults.value = res.data
total.value = res.data.length
}
}
showSearchResults.value = true
loading.value = false
@@ -100,8 +109,11 @@ const handleSearch = async () => {
cancelAdd()
}
currentPage.value = 1
loading.value = true
const params = {
page: 1,
pageSize: pageSize.value,
department_id: filterType.value || undefined,
is_active: filterStatus.value !== '' ? filterStatus.value : undefined
}
@@ -117,7 +129,14 @@ const handleSearch = async () => {
}
const res = await getUserList(params)
if (res.code === 0 || res.code === 200) {
searchResults.value = res.data.list || res.data
if (res.data && Array.isArray(res.data.list)) {
searchResults.value = res.data.list
total.value = res.data.total
totalPages.value = res.data.totalPages
} else if (Array.isArray(res.data)) {
searchResults.value = res.data
total.value = res.data.length
}
}
showSearchResults.value = true
loading.value = false
@@ -187,7 +206,7 @@ const saveUser = async () => {
}
cancelAdd()
fetchData()
fetchData(1)
} catch (error) {
ElMessage.error(error.response?.data?.message || error.message || '操作失败')
}
@@ -203,7 +222,7 @@ const deleteUser = async (id) => {
try {
await deleteUserAPI(id)
ElMessage.success('删除成功')
fetchData()
fetchData(1)
} catch (error) {
ElMessage.error(error.response?.data?.message || error.message || '删除失败')
}
@@ -225,7 +244,7 @@ const clearSearch = () => {
showSearchResults.value = false
showAddForm.value = false
currentPage.value = 1
fetchData()
fetchData(1)
}
// 双击行查看详情
@@ -240,9 +259,10 @@ const closeDetail = () => {
currentDetail.value = null
}
// 页码变化
// 页码变化（服务端分页：重新请求后端）
const handleCurrentChange = (val) => {
currentPage.value = val
fetchData(val)
}
// 检查权限
@@ -298,7 +318,7 @@ const canManage = computed(() => hasPermission('user', 'manage'))
<div v-else>
<div class="list-header">
<span class="total-count">共找到 {{ searchResults.length }} 条记录</span>
<span class="total-count">共找到 {{ total }} 条记录</span>
</div>
<el-table :data="paginatedData" v-loading="loading" border style="width: 100%"
@@ -340,7 +360,7 @@ const canManage = computed(() => hasPermission('user', 'manage'))
<el-pagination
v-model:current-page="currentPage"
:page-size="pageSize"
:total="searchResults.length"
:total="total"
layout="prev, pager, next"
prev-text="上一页"
next-text="下一页"