gxwebsoft/template-nuxt4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新版官网模板

Browse Source
This commit is contained in:
赵忠林
2026-04-29 01:33:33 +08:00
commit 0d82386f8f
341 changed files with 64526 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

220
app/pages/admin/applications/expert.vue Normal file
View File

@@ -0,0 +1,220 @@
<template>
<div class="admin-applications-expert">
<!-- 复用专家审核，这里是专家申请管理入口 -->
<div class="page-header">
<h3>专家申请管理</h3>
<a-space>
<a-button type="primary" @click="navigateTo('/admin/experts/review')">前往审核</a-button>
<a-button @click="loadData">刷新</a-button>
</a-space>
</div>
<div class="stats-row">
<div class="stat-item blue">
<div class="stat-num">{{ stats.total }}</div>
<div class="stat-label">总申请</div>
</div>
<div class="stat-item orange">
<div class="stat-num">{{ stats.pending }}</div>
<div class="stat-label">待审核</div>
</div>
<div class="stat-item green">
<div class="stat-num">{{ stats.approved }}</div>
<div class="stat-label">已通过</div>
</div>
<div class="stat-item red">
<div class="stat-num">{{ stats.rejected }}</div>
<div class="stat-label">已拒绝</div>
</div>
</div>
<!-- 申请材料模板下载 -->
<div class="template-card">
<h4>申请材料模板</h4>
<p>以下为专家申请所需材料的模板文件，请申请人按要求填写并提交。</p>
<div class="template-list">
<div class="template-item">
<span class="template-icon">📄</span>
<span class="template-name">专家申请表（个人签字）</span>
<a-button size="small" type="primary">下载模板</a-button>
</div>
<div class="template-item">
<span class="template-icon">📋</span>
<span class="template-name">专家申请说明文件</span>
<a-button size="small" type="primary">下载模板</a-button>
</div>
</div>
</div>
<!-- 近期申请列表 -->
<div class="table-card">
<div class="table-header">
<span class="table-title">近期申请记录</span>
<a-button size="small" @click="navigateTo('/admin/experts/review')">查看全部并审核 →</a-button>
</div>
<a-table
:columns="columns"
:data-source="recentApplications"
:loading="loading"
:pagination="false"
row-key="id"
size="middle"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'status'">
<a-tag :color="getStatusColor(record.status)">{{ getStatusText(record.status) }}</a-tag>
</template>
<template v-if="column.key === 'action'">
<a-button size="small" @click="navigateTo('/admin/experts/review')">审核</a-button>
</template>
</template>
</a-table>
</div>
</div>
</template>
<script lang="ts" setup>
definePageMeta({ layout: 'admin' })
useHead({ title: '专家申请管理' })
const loading = ref(false)
const stats = reactive({ total: 12, pending: 3, approved: 8, rejected: 1 })
const columns = [
{ title: '申请人', dataIndex: 'name', key: 'name' },
{ title: '单位', dataIndex: 'organization', key: 'organization' },
{ title: '研究领域', dataIndex: 'researchArea', key: 'researchArea' },
{ title: '申请时间', dataIndex: 'applyTime', key: 'applyTime' },
{ title: '状态', key: 'status', width: 100 },
{ title: '操作', key: 'action', width: 80 },
]
const recentApplications = ref([
{ id: 1, name: '张某某', organization: '广西大学', researchArea: '区域经济', applyTime: '2024-12-18', status: 'pending' },
{ id: 2, name: '李某某', organization: '广西社科院', researchArea: '产业政策', applyTime: '2024-12-17', status: 'pending' },
{ id: 3, name: '王某某', organization: '广西师范大学', researchArea: '金融经济', applyTime: '2024-12-15', status: 'approved' },
])
function getStatusColor(status: string) {
const map: Record<string, string> = { pending: 'orange', approved: 'green', rejected: 'red' }
return map[status] || 'default'
}
function getStatusText(status: string) {
const map: Record<string, string> = { pending: '待审核', approved: '已通过', rejected: '已拒绝' }
return map[status] || status
}
async function loadData() {
// TODO: 接入API
}
</script>
<style scoped>
.admin-applications-expert { display: flex; flex-direction: column; gap: 16px; }
.page-header {
display: flex;
align-items: center;
justify-content: space-between;
background: #fff;
border-radius: 10px;
padding: 14px 20px;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.page-header h3 {
font-size: 16px;
font-weight: 700;
color: #1f2937;
margin: 0;
}
.stats-row {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
}
.stat-item {
background: #fff;
border-radius: 12px;
padding: 20px;
text-align: center;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.stat-item.blue { border-top: 3px solid #3b82f6; }
.stat-item.orange { border-top: 3px solid #f97316; }
.stat-item.green { border-top: 3px solid #22c55e; }
.stat-item.red { border-top: 3px solid #ef4444; }
.stat-num {
font-size: 32px;
font-weight: 800;
color: #1f2937;
}
.stat-label {
font-size: 13px;
color: #9ca3af;
margin-top: 4px;
}
.template-card, .table-card {
background: #fff;
border-radius: 12px;
padding: 20px;
box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.template-card h4, .table-header {
font-size: 15px;
font-weight: 600;
color: #1f2937;
margin: 0 0 8px;
}
.table-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
}
.table-title {
font-size: 15px;
font-weight: 600;
color: #1f2937;
}
.template-card p {
font-size: 13px;
color: #6b7280;
margin: 0 0 12px;
}
.template-list {
display: flex;
flex-direction: column;
gap: 8px;
}
.template-item {
display: flex;
align-items: center;
gap: 10px;
padding: 10px 14px;
background: #f9fafb;
border-radius: 8px;
}
.template-icon { font-size: 16px; }
.template-name {
flex: 1;
font-size: 14px;
color: #374151;
}
</style>