feat(user): 新增用户管理功能

- 添加用户列表页面,包含搜索、分页等功能
- 实现用户状态切换和详情查看功能
- 新增用户选择组件,用于选择用户
- 优化表格组件,支持自定义列和操作
- 添加面包屑组件,用于展示导航路径
This commit is contained in:
2025-04-28 17:57:16 +08:00
parent 749d285a0d
commit e0868a10af
17 changed files with 1132 additions and 46 deletions

21
src/view/user/index.vue Normal file
View File

@@ -0,0 +1,21 @@
<template>
<div>
<router-view v-slot="{ Component }">
<transition mode="out-in" name="el-fade-in-linear">
<keep-alive :include="routerStore.keepAliveRouters">
<component :is="Component" />
</keep-alive>
</transition>
</router-view>
</div>
</template>
<script setup>
import { useRouterStore } from '@/pinia/modules/router'
const routerStore = useRouterStore()
defineOptions({
name: 'UserManage'
})
</script>

View File

@@ -0,0 +1,106 @@
<template>
<div >
<div class="searchForm">
<searchForm
:search="USER_SEARCH_CONFIG"
@searchData="searchData"
@resetData="resetData"
class="search-box searchForm"
/>
</div>
<div class="gva-table-box">
<Content
@changePage="changePage"
:total="total"
v-model:tabloading="tableLoading"
v-model:currentPage="queryParams.page"
v-model:pageSize="queryParams.pageSize"
:data="tableData"
:config="USER_TABLE_CONFIG"
>
<template #status="{ row }">
<!-- <el-tag :type="tag(row.status).extend">{{ tag(row.status).label }}</el-tag>-->
<el-switch v-model="row.status"
active-value="1"
inactive-value="0"
:loading="statusChangeLoading"
:before-change="() => statusChangeBefore(row)" />
</template>
<template #operate="{ row }">
<el-button type="text" @click="handleDetail(row)">详情</el-button>
<!-- <el-button type="text" @click="handleDelete(row)">删除</el-button>-->
</template>
</Content>
</div>
</div>
</template>
<script setup>
import searchForm from '@/components/searchForm/index.vue'
import Content from '@/components/content/index.vue'
import {list} from '@/api/user/index.js'
import { ref, onMounted } from 'vue'
import { USER_SEARCH_CONFIG, USER_TABLE_CONFIG } from '@/config'
const tableLoading = ref(true), tableData = ref([{status:1}])
const queryParams = ref({
page: 1,
pageSize: 10,
orderId: '',
startTime: '',
endTime: ''
}), total = ref(0)
const statusChangeLoading = ref(false)
// const EMPTY_STR = '- -'
// const tag = (status) => {
// return userStatus.find((item) => item.value === status+'') || { type: '', label: EMPTY_STR }
// }
const searchData = (data) => {
if (data.times) {
data.startTime = data.times[0]
data.endTime = data.times[1]
}
queryParams.value.page = 1
queryParams.value = { ...queryParams.value, ...data }
delete queryParams.value.times
getList()
}
const resetData = () => {
queryParams.value = {
page: 1,
pageSize: 10,
}
getList()
}
onMounted(() => {
getList()
})
async function getList() {
const res = await list(queryParams.value)
if(res.code === 0) {
tableData.value = res.data.list
total.value = res.data.total
}
}
function handleDetail(row) {
}
function changePage(data) {
queryParams.value.pageNum = data
getList()
}
function statusChangeBefore(row) {
console.log(row)
statusChangeLoading.value = true
return new Promise(resolve => {
setTimeout(() => {
statusChangeLoading.value = false
return resolve(true)
},500)
})
}
</script>
<style lang="scss" scoped>
</style>