普通用户申请成为管理员

This commit is contained in:
遥望-倪浩天 2024-10-10 17:22:41 +08:00
parent 4e3da8bc7b
commit 17f0aca6ff
6 changed files with 384 additions and 12 deletions

View File

@ -0,0 +1,22 @@
import request, {moduleName} from '/@/utils/request';
/**
* 用户申请成为管理员
*/
export const getApplyForAdminPage = (current,size,params) => {
return request({
url: '/api/' + moduleName + '/ui/applyForAdmin/pages',
method: 'get',
params: {
current,
size,
...params
}
});
};
//用户申请成为管理员
export const auditAnApplication = (row) => request({
url: '/api/' + moduleName + '/ui/applyForAdmin/auditAnApplication',
method: 'post',
data: row,
});

View File

@ -221,6 +221,21 @@ export const dynamicRoutes = [
icon: 'ele-SetUp',
},
},
{
path: '/systemManagement/applyForAdmin',
name: 'applyForAdmin',
component: () => import('/@/views/systemManagement/applyForAdmin/index.vue'),
meta: {
title: 'applyForAdmin',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-SetUp',
},
},
],
},
{

View File

@ -1,27 +1,33 @@
<template>
<el-dialog title="User Info" v-model="state.isShowDialog" width="35%" center>
<el-form :model="state.ruleForm" size="default" label-width="90px" :rules="rules" ref="adminAddFormRef">
<el-form-item label="name" >
<el-input v-model="state.ruleForm.name" clearable disabled></el-input>
</el-form-item>
<el-form-item label="email" >
<el-input v-model="state.ruleForm.email" clearable disabled></el-input>
</el-form-item>
<el-form-item label="account" >
<el-input v-model="state.ruleForm.account" clearable disabled></el-input>
<el-form-item label="name" >
<el-input v-model="state.ruleForm.name" clearable disabled></el-input>
</el-form-item>
<el-form-item label="occupation" >
<el-input v-model="state.ruleForm.occupation" clearable disabled></el-input>
<el-form-item label="realName" >
<el-input v-model="state.ruleForm.realName" clearable disabled></el-input>
</el-form-item>
<el-form-item label="country" >
<el-input v-model="state.ruleForm.country" clearable disabled></el-input>
</el-form-item>
<el-form-item label="phone" >
<el-input v-model="state.ruleForm.phone" clearable disabled></el-input>
</el-form-item>
<el-form-item label="organization" >
<el-input v-model="state.ruleForm.organization" clearable disabled></el-input>
</el-form-item>
<el-form-item label="occupation" >
<el-input v-model="state.ruleForm.occupation" clearable disabled></el-input>
</el-form-item>
<el-form-item label="education" >
<el-input v-model="state.ruleForm.education" clearable disabled></el-input>
</el-form-item>
<el-form-item label="researchField" >
<el-input v-model="state.ruleForm.researchField" clearable disabled></el-input>
</el-form-item>
<el-form-item label="Introduction" >
<el-input type="textarea" v-model="state.ruleForm.introduction" clearable disabled></el-input>
</el-form-item>
<el-form-item label="role" >
<el-tag type="info" v-if="state.ruleForm.roleId == '1123598816738675203'">Admin</el-tag>
<el-tag type="info" v-if="state.ruleForm.roleId == '1793193529859244033'">Chief admin</el-tag>

View File

@ -7,7 +7,7 @@
<!-- <el-table-column type="selection" width="60" @select="selectRow" />-->
<el-table-column prop="userName" label="Name" show-overflow-tooltip></el-table-column>
<!-- <el-table-column prop="userEmail" label="E-mail" show-overflow-tooltip></el-table-column>-->
<el-table-column fixed="right" label="particulars" min-width="120">
<el-table-column fixed="right" label="detail" min-width="120">
<template #default="scope">
<el-tag type="info" ref="selectUserDetails" @click="getSelectUserDetails(scope.row)">
<el-icon><ele-Tickets /></el-icon></el-tag>
@ -93,7 +93,7 @@
<el-table :data="state.tableData.data" v-loading="state.tableData.loading" style="width: 100%" @selection-change="selectionChange">
<!-- <el-table-column type="selection" width="60" @select="selectRow" />-->
<el-table-column prop="name" label="Name" show-overflow-tooltip></el-table-column>
<el-table-column fixed="right" label="particulars" min-width="120">
<el-table-column fixed="right" label="detail" min-width="120">
<template #default="scope">
<el-tag type="info" ref="selectUserDetails" @click="getSelectUserDetails(scope.row)">
<el-icon><ele-Tickets /></el-icon></el-tag>

View File

@ -0,0 +1,186 @@
<template>
<el-dialog title="" v-model="state.isShowDialog" width="60%" center>
<template #header="{ close, titleId, titleClass }">
<div class="my-header">
<h4 class="titleClass1">Welcome to apply to become a website administrator</h4>
</div><br>
<div class="my-header">
<h4 class="titleClass2">Looking forward to your wisdom to the growth and development of the community</h4>
</div><br>
<div class="my-header">
<el-divider class="dividerStyle" content-position="center">Account Information</el-divider>
</div>
</template>
<div class="form-container">
<el-form :model="state.formData" size="default" label-width="50%" :rules="rules" ref="adminAddFormRef">
<el-form-item label="name" >
<el-input v-model="state.formData.name" clearable disabled></el-input>
</el-form-item>
<el-form-item label="realName" >
<el-input v-model="state.formData.realName" clearable disabled></el-input>
</el-form-item>
<!-- <el-form-item label="account" >
<el-input v-model="state.formData.account" clearable disabled></el-input>
</el-form-item>-->
<el-form-item label="email" >
<el-input v-model="state.formData.email" clearable disabled></el-input>
</el-form-item>
<el-form-item label="country" >
<el-input v-model="state.formData.country" clearable disabled></el-input>
</el-form-item>
<el-form-item label="organization" >
<el-input v-model="state.formData.organization" clearable disabled></el-input>
</el-form-item>
<el-form-item label="occupation" >
<el-input v-model="state.formData.occupation" clearable disabled></el-input>
</el-form-item>
<!-- <el-form-item label="phone" >
<el-input v-model="state.formData.phone" clearable disabled></el-input>
</el-form-item>-->
<el-form-item label="education" >
<el-input v-model="state.formData.education" clearable disabled></el-input>
</el-form-item>
<el-form-item label="researchField" >
<el-input v-model="state.formData.researchField" clearable disabled></el-input>
</el-form-item>
<el-form-item label="Introduction" >
<el-input type="textarea" v-model="state.formData.introduction" clearable disabled></el-input>
</el-form-item>
<el-form-item label="the reason for refusal" >
<el-input type="textarea" v-model="state.formData.reasons" placeholder="If no, enter the reason for the rejection" clearable ></el-input>
</el-form-item>
<!-- <div class="input-group mb-3 flex-nowrap buttonDiv" style="justify-content: center;">
<el-button class="w-100 mb-2 btn btn-lg rounded-3 Cancelbutton" type="button" @click="">Cancel</el-button>
<el-button class="w-100 mb-2 btn btn-lg rounded-3 btn-primary Submitbutton" type="button" @click="">Submit</el-button>
</div>-->
</el-form>
<div class="buttonDiv">
<span class="dialog-footer">
<el-button type="warning" @click="Reject()"> Refuse </el-button>
<el-button type="success" @click="Pass()" style="margin-left: 40%"> Agree </el-button>
</span>
</div>
<!-- <template #footer>
<span class="dialog-footer">
<el-button @click="closeDialog()">Cancel</el-button>
<el-button type="success" @click="Submit()"> Send </el-button>
</span>
</template>-->
</div>
</el-dialog>
</template>
<script setup>
import {onMounted, reactive, ref} from "vue";
const adminAddFormRef = ref();
import { auditAnApplication } from '/@/api/response/applyForAdmin.js';
import {ElMessage} from "element-plus";
const emit = defineEmits(['callback']);
const state = reactive({
code:"",
captcha: {},
isShowDialog: false,
isLoading:false,
introduction:"",
formData: {
},
})
const Reject = () => {
state.formData.applyForStatus=1
auditAnApplication(state.formData).then(res=>{
ElMessage.success('Audit Completed');
})
closeDialog()
}
const Pass = () => {
state.formData.applyForStatus=2
auditAnApplication(state.formData).then(res=>{
ElMessage.success('Audit Completed');
})
closeDialog()
}
//
const resetField = () => {
adminAddFormRef.value.resetFields();
}
//
const openDialog = (row) => {
console.log(row)
state.formData=row
/*getUserById(row.id).then(res => {
state.formData = res
});*/
state.isShowDialog = true;
};
//
const closeDialog = () => {
state.isShowDialog = false;
//
state.formData.tableData = [];
resetField();
};
//
defineExpose({
openDialog,
});
//
const rules = reactive({
code: [
{
required: true,
message: "Please enter code",
trigger: "change",
},
],
});
</script>
<style scoped>
:deep(.el-input__inner::placeholder) {
font-size: 1rem !important;
}
.codeInput{
width: 70%;
}
.buttonDiv{
margin-top: 4%;
padding-left: 50%;
}
.buttonStyleclose{
color: #19191a;
background-color: #ccd5f1;
margin-right: 30px;
}
.titleClass1{
color: #0a53be;
font-size: 2.5rem;
font-weight: bold; /* 加粗 */
font-style: italic; /* 倾斜 */
}
.titleClass2{
color: #3a7dde;
font-size: 1.0rem;
font-weight: bold; /* 加粗 */
font-style: italic; /* 倾斜 */
}
.form-container {
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
height: 100%; /* 适应父容器高度 */
padding-right: 30%;
}
.dividerStyle{
border-color: #2f63e0; /* 修改分隔线颜色 */
border-width: 2px; /* 修改分隔线宽度 */
}
</style>

View File

@ -0,0 +1,143 @@
<template>
<div class="system-role-container layout-padding">
<div class="system-role-padding layout-padding-auto layout-padding-view">
<el-config-provider :locale="en">
<div class="system-user-search mb15" style="display: flex;margin-left: 10px;margin-top: 10px;">
<el-input size="default" placeholder="please enter account" style="max-width: 200px"
v-model="state.search.email" clearable></el-input>
<el-select class="form-select" size="default" clearable placeholder="Apply For Status"
v-model="state.search.applyForStatus">
<el-option value="0" label="Unreviewed">Unreviewed</el-option>
<el-option value="1" label="Declined">Declined</el-option>
<el-option value="2" label="Passed">Passed</el-option>
</el-select>
<el-button size="default" type="primary" class="ml10" @click="getTableData">
<el-icon>
<ele-Search />
</el-icon>
search
</el-button>
</div>
<el-table :data="state.tableData.data" v-loading="state.tableData.loading"
@selection-change="handleSelectionChange" style="width: 100%">
<!-- <el-table-column prop="account" label="Account" show-overflow-tooltip sortable></el-table-column>-->
<el-table-column prop="email" label="Email" show-overflow-tooltip sortable></el-table-column>
<el-table-column prop="country" label="Country" show-overflow-tooltip sortable></el-table-column>
<el-table-column prop="introduction" label="Introduction" show-overflow-tooltip></el-table-column>
<el-table-column prop="ApplyForStatus" label="Apply For Status" show-overflow-tooltip>
<template #default="scope">
<el-tag type="success" size="small">{{ scope.row.applyForStatus==0?'Unreviewed':scope.row.applyForStatus==1?'Refuse': 'Agree'}}</el-tag>
</template>
</el-table-column>
<el-table-column prop="reasons" label="Reasons" show-overflow-tooltip></el-table-column>
<el-table-column prop="submitTime" label="SubmitTime" show-overflow-tooltip sortable></el-table-column>
<el-table-column prop="auditTime" label="AuditTime" show-overflow-tooltip sortable></el-table-column>
<el-table-column prop="Operate" label="Operate" show-overflow-tooltip>
<template #default="scope">
<!-- <el-button link type="primary" size="small" @click="handleClick">Detail</el-button>-->
<el-button v-if="scope.row.applyForStatus == 0" link type="primary" size="small" @click="auditUser(scope.row)">Review</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="onHandleSizeChange" @current-change="onHandleCurrentChange" class="mt15"
:pager-count="3" :page-sizes="[10, 20, 30]" v-model:current-page="state.tableData.param.pageNum" background
v-model:page-size="state.tableData.param.pageSize" layout="total, sizes, prev, pager, next"
:total="state.tableData.total">
</el-pagination>
</el-config-provider>
</div>
<ApplyForAdmin ref="ApplyForAdminRef"></ApplyForAdmin>
</div>
</template>
<script lang="ts" setup name="systemRole">
import en from 'element-plus/dist/locale/en.mjs'
import { getApplyForAdminPage } from '/@/api/response/applyForAdmin.js';
import ApplyForAdmin from "./audit/ApplyForAdmin.vue"
//
import { defineAsyncComponent, reactive, onMounted, ref } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
const ApplyForAdminRef = ref();
//
const roleDialogRef = ref();
const state = reactive({
status:"0",
multipleSelection: [],
search: {
email:'',
applyForStatus:'',
},
tableData: {
data: [],
total: 0,
loading: false,
param: {
search: '',
pageNum: 1,
pageSize: 10,
},
},
});
const auditUser = (row) => {
ApplyForAdminRef.value.openDialog(row);
}
const handleSelectionChange = (val) => {
state.multipleSelection = val
}
//
const getTableData = () => {
state.tableData.loading = true;
getApplyForAdminPage(state.tableData.param.pageNum, state.tableData.param.pageSize, { "email": state.search.email,"applyForStatus": state.search.applyForStatus}).then(res => {
state.tableData.data = res.records;
/*state.tableData.data.forEach(item => {
let date = item.disasterTime.slice(0, 10);
item.disasterTime = date;
})*/
state.tableData.total = res.total;
})
setTimeout(() => {
state.tableData.loading = false;
}, 500);
};
//
const onHandleSizeChange = (val) => {
state.tableData.param.pageSize = val;
getTableData();
};
//
const onHandleCurrentChange = (val) => {
state.tableData.param.pageNum = val;
getTableData();
};
//
onMounted(() => {
getTableData();
});
</script>
<style scoped lang="scss">
.mt15 {
display: flex;
justify-content: end;
}
.form-select{
margin-left: 10px;
}
.demo-tabs>.el-tabs__content {
padding: 32px;
color: #6b778c;
font-size: 32px;
font-weight: 600;
}
.system-role-container {
.system-role-padding {
padding: 15px;
.el-table {
flex: 1;
}
}
}
</style>