lkddi/nexusphp
1
0
Fork 0
mirror of https://github.com/lkddi/nexusphp.git synced 2026-04-24 03:57:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

user-detail

Browse Source
This commit is contained in:
xiaomlove
2021-04-27 19:13:32 +08:00
parent d1b7561aae
commit d2e05c812e
20 changed files with 594 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/src/views/user/detail.vue
+182
View File
@@ -0,0 +1,182 @@
<template>
<div class="page-user-detail" v-loading="loading">
<el-card>
<template #header>
<div class="card-header">
<span>Base Info</span>
</div>
</template>
<table class="table-base-info">
<tr>
<th>Field</th>
<th>Value</th>
<th>Actions</th>
<th>Other</th>
</tr>
<tr>
<td>Username</td>
<td>{{baseInfo.username}}</td>
<td></td>
<td colspan="7">
<div class="other-actions">
<el-button type="primary" size="mini">Reset password</el-button>
<el-button type="primary" size="mini">PM</el-button>
<el-button type="primary" size="mini" @click="handleAssignExam">Assign exam</el-button>
</div>
</td>
</tr>
<tr>
<td>Email</td>
<td>{{baseInfo.email}}</td>
<td><el-button size="mini">Change</el-button></td>
</tr>
<tr>
<td>Added</td>
<td>{{baseInfo.added}}</td>
</tr>
<tr>
<td>Class</td>
<td>{{baseInfo.class_text}}</td>
</tr>
<tr>
<td>Uploaded</td>
<td>{{baseInfo.uploaded}}</td>
<td><el-button size="mini">Add</el-button></td>
</tr>
<tr>
<td>Downloaded</td>
<td>{{baseInfo.downloaded}}</td>
<td><el-button size="mini">Add</el-button></td>
</tr>
<tr>
<td>Bonus</td>
<td>{{baseInfo.bonus}}</td>
<td><el-button size="mini">Add</el-button></td>
</tr>
</table>
</el-card>
<el-card v-if="examInfo">
<template #header>
<div class="card-header">
<span>Exam</span>
</div>
</template>
<el-row>
<el-col :span="12">
<table class="table-base-info">
<tr>
<td>Name</td>
<td>{{examInfo.exam && examInfo.exam.name}}</td>
</tr>
<tr>
<td>Created At</td>
<td>{{examInfo.created_at}}</td>
</tr>
<tr>
<td>Exam Time</td>
<td>{{examInfo.begin}} ~ {{examInfo.end}}</td>
</tr>
<tr>
<td>Status</td>
<td>{{examInfo.status_text}}</td>
</tr>
<tr>
<td>Action</td>
<td>
<el-popconfirm
title="Confirm Remove ?"
@confirm="handleRemoveExam(examInfo.id)"
>
<template #reference>
<el-button type="danger" size="small">Remove</el-button>
</template>
</el-popconfirm>
</td>
</tr>
</table>
</el-col>
<el-col :span="12">
<el-table :data="examInfo.progress_formatted">
<el-table-column prop="name" label="Index"></el-table-column>
<el-table-column prop="require_value_formatted" label="Require"></el-table-column>
<el-table-column prop="current_value_formatted" label="Current"></el-table-column>
<el-table-column prop="result" label="Result">
<template #default="scope">
<el-tag v-if="scope.row.passed" type="success">Pass !</el-tag>
<el-tag v-if="!scope.row.passed" type="danger">Not Pass !</el-tag>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
</el-card>
</div>
</template>
<script>
import { onMounted, reactive, ref, toRefs } from 'vue'
import { ElMessage } from 'element-plus'
import {useRoute, useRouter} from 'vue-router'
import api from '../../utils/api'
export default {
name: "UserDetail",
setup() {
const route = useRoute()
const router = useRouter()
const { id } = route.query
const state = reactive({
loading: false,
baseInfo: {},
examInfo: {},
matchExams: [],
dialogAssignExamFormVisible: false,
assignExamFormData: {
exam_id: '',
timeRange: []
}
})
onMounted(() => {
fetchPageData()
})
const fetchPageData = async () => {
state.loading = true;
let res = await api.getUser(id)
state.loading = false
state.baseInfo = res.data.base_info
state.examInfo = res.data.exam_info
}
const handleRemoveExam = async (id) => {
let res = await api.deleteExamUser(id)
ElMessage.success(res.msg)
await fetchPageData()
}
const handleAssignExam = async () => {
state.dialogAssignExamFormVisible = true;
}
return {
...toRefs(state),
handleRemoveExam,
handleAssignExam
}
}
}
</script>
<style lang="scss" scoped>
.el-card {
margin-bottom: 20px;
}
.table-base-info {
width: 100%;
text-align: left;
tr {
th {
padding-bottom: 10px;
}
td {
padding: 10px 0;
}
}
}
</style>