|
|
@@ -0,0 +1,136 @@
|
|
|
+<template>
|
|
|
+ <ContentWrap>
|
|
|
+ <div class="table-container">
|
|
|
+ <el-table v-loading="loading" :data="list">
|
|
|
+ <el-table-column type="index" width="50" />
|
|
|
+ <!-- <el-table-column label="用户编号" align="center" key="id" prop="id" />
|
|
|
+ <el-table-column
|
|
|
+ label="账号"
|
|
|
+ align="center"
|
|
|
+ prop="username"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ /> -->
|
|
|
+ <el-table-column
|
|
|
+ label="姓名"
|
|
|
+ align="center"
|
|
|
+ prop="nickname"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ label="工作间"
|
|
|
+ align="center"
|
|
|
+ key="deptName"
|
|
|
+ prop="deptName"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ />
|
|
|
+ <el-table-column label="手机号码" align="center" prop="mobile" width="120" />
|
|
|
+ <el-table-column label="是否达成毕业条件" align="center" prop="isGraduate">
|
|
|
+ <template #default="scope">
|
|
|
+ <dict-tag :type="DICT_TYPE.SYSTEM_STUDENT_GRADUATE_STATUS" :value="scope.row.isGraduate" />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="人脸详情" align="center" prop="photoUrl">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-image
|
|
|
+ lazy
|
|
|
+ class="h-80px w-80px"
|
|
|
+ style="width: 40px; height:40px;margin-right: 5px"
|
|
|
+ :src="scope.row.photoUrl"
|
|
|
+ :preview-src-list="[scope.row.photoUrl]"
|
|
|
+ preview-teleported
|
|
|
+ :zoom-rate="1.2"
|
|
|
+ :max-scale="7"
|
|
|
+ :min-scale="0.2"
|
|
|
+ :initial-index="4"
|
|
|
+ fit="cover"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="创建时间"
|
|
|
+ align="center"
|
|
|
+ prop="createTime"
|
|
|
+ :formatter="dateFormatter"
|
|
|
+ width="180"
|
|
|
+ />
|
|
|
+ <el-table-column label="操作" align="center" width="190">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="flex items-center justify-center">
|
|
|
+ <el-button type="text" @click="openUserAchievement(scope.row.id)">
|
|
|
+ 成果详情
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <Pagination
|
|
|
+ :total="total"
|
|
|
+ v-model:page="queryParams.pageNo"
|
|
|
+ v-model:limit="queryParams.pageSize"
|
|
|
+ @pagination="getList"
|
|
|
+ />
|
|
|
+ </ContentWrap>
|
|
|
+
|
|
|
+</template>
|
|
|
+<script lang="ts" setup>
|
|
|
+import { DICT_TYPE } from '@/utils/dict'
|
|
|
+import { dateFormatter } from '@/utils/formatTime'
|
|
|
+import * as UserApi from '@/api/system/user'
|
|
|
+import { defineProps } from 'vue';
|
|
|
+import { useRouter } from 'vue-router';
|
|
|
+
|
|
|
+defineOptions({ name: 'SystemUser' })
|
|
|
+
|
|
|
+const props = defineProps<{
|
|
|
+ id: string; // 根据需要修改类型
|
|
|
+}>();
|
|
|
+
|
|
|
+const loading = ref(true) // 列表的加载中
|
|
|
+const total = ref(0) // 列表的总页数
|
|
|
+const list = ref([]) // 列表的数
|
|
|
+const queryParams = reactive({
|
|
|
+ pageNo: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ username: undefined,
|
|
|
+ mobile: undefined,
|
|
|
+ status: undefined,
|
|
|
+ deptId: props.id,
|
|
|
+ createTime: [],
|
|
|
+})
|
|
|
+
|
|
|
+const router = useRouter()
|
|
|
+const openUserAchievement = (id) => {
|
|
|
+ router.push({ name: 'UserAchievement', query: { id: id} });
|
|
|
+}
|
|
|
+
|
|
|
+/** 查询列表 */
|
|
|
+const getList = async () => {
|
|
|
+ loading.value = true
|
|
|
+ try {
|
|
|
+ queryParams.deptId = props.id
|
|
|
+ const data = await UserApi.getStudentPage(queryParams)
|
|
|
+ list.value = data.list
|
|
|
+ total.value = data.total
|
|
|
+ } finally {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+/** 初始化 */
|
|
|
+onMounted(() => {
|
|
|
+ getList()
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.table-container .el-table {
|
|
|
+ border: none !important; /* 移除表格的外边框 */
|
|
|
+}
|
|
|
+
|
|
|
+.table-container .el-table th,
|
|
|
+.table-container .el-table td {
|
|
|
+ border: none !important; /* 移除表头和单元格的边框 */
|
|
|
+}
|
|
|
+</style>
|
