You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
141 lines
4.3 KiB
141 lines
4.3 KiB
<script setup>
|
|
import { ref, onMounted, reactive, computed } from "vue";
|
|
import { useRouter } from "vue-router";
|
|
import ElementPlus from "element-plus";
|
|
import { VscGlobe } from 'vue-icons-plus/vsc'
|
|
|
|
const router = useRouter();
|
|
|
|
// 用户对象假的
|
|
const admin = ref({
|
|
adminId: 1,
|
|
name:'客服A',
|
|
area:'新加坡'
|
|
})
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="common-layout">
|
|
<el-container>
|
|
<el-aside style="width: 250px;">
|
|
<div class="logo">
|
|
<img src="../assets/金币管理系统logo.png" alt="logo" style="width: 30px;height: 30px;" />
|
|
<div style="font-size: 16px; font-weight: bold;">海外金币管理系统</div>
|
|
</div>
|
|
<el-menu router="true" background-color="#08193d" active-text-color="#ffd04b" text-color="white"
|
|
class="el-menu-vertical-demo" default-active="2" @open="handleOpen" @close="handleClose">
|
|
<el-menu-item index="/workspace">
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
工作台
|
|
</el-menu-item>
|
|
|
|
<el-sub-menu index="2">
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>财务审核</span>
|
|
</template>
|
|
<el-menu-item index="/rechargeAudit">充值审核</el-menu-item>
|
|
<el-menu-item index="/refundAudit">退款审核</el-menu-item>
|
|
</el-sub-menu>
|
|
|
|
<el-sub-menu index="3">
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>充值管理</span>
|
|
</template>
|
|
<el-menu-item index="/activity">活动管理</el-menu-item>
|
|
<el-menu-item index="/rate">汇率管理</el-menu-item>
|
|
</el-sub-menu>
|
|
|
|
<el-sub-menu index="4">
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>金币充值</span>
|
|
</template>
|
|
<el-menu-item index="/addRecharge">新增充值</el-menu-item>
|
|
<el-menu-item index="/adminRecharge">客服充值明细</el-menu-item>
|
|
<el-menu-item index="/allRecharge">所有充值明细</el-menu-item>
|
|
</el-sub-menu>
|
|
|
|
<el-sub-menu index="5">
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>金币消费</span>
|
|
</template>
|
|
<el-menu-item index="/addConsume">新增消费</el-menu-item>
|
|
<el-menu-item index="/allConsume">所有消费明细</el-menu-item>
|
|
</el-sub-menu>
|
|
|
|
<el-sub-menu index="6">
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>金币退款</span>
|
|
</template>
|
|
<el-menu-item index="/addRefund">新增退款</el-menu-item>
|
|
<el-menu-item index="/allRefund">退款明细</el-menu-item>
|
|
</el-sub-menu>
|
|
|
|
<el-menu-item index="/usergold">
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
客户金币明细
|
|
</el-menu-item>
|
|
|
|
</el-menu>
|
|
</el-aside>
|
|
<el-container>
|
|
<el-header>
|
|
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" :ellipsis="false"
|
|
@select="handleSelect">
|
|
<el-sub-menu index="1" class="admin">
|
|
<template #title>
|
|
<img style="width: 30px;height: 30px; border-radius: 50%;" src="../assets/金币管理系统logo.png" alt="出错了" />
|
|
<span style="margin-left: 10px;">{{ admin.name }}</span>
|
|
</template>
|
|
<el-menu-item index="1-1">查看个人信息</el-menu-item>
|
|
<el-menu-item index="1-2">退出登录</el-menu-item>
|
|
</el-sub-menu>
|
|
<el-menu-item index="2">
|
|
<VscGlobe />
|
|
</el-menu-item>
|
|
</el-menu>
|
|
</el-header>
|
|
<el-main>
|
|
<router-view></router-view>
|
|
</el-main>
|
|
</el-container>
|
|
</el-container>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.admin {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.el-aside {
|
|
background-color: #08193d;
|
|
min-height: 100vh;
|
|
width: 200px;
|
|
}
|
|
|
|
.logo {
|
|
color: white;
|
|
margin: 20px 0px 20px 20px;
|
|
display: flex;
|
|
}
|
|
</style>
|