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.
377 lines
11 KiB
377 lines
11 KiB
<script setup>
|
|
// 导航栏在这
|
|
// 这也是登录后的index
|
|
import { ref, onMounted, reactive, computed, watch } from 'vue'
|
|
import { useRouter } from 'vue-router'
|
|
import ElementPlus from 'element-plus'
|
|
import { VscGlobe } from 'vue-icons-plus/vsc'
|
|
import { ElMessage } from 'element-plus'
|
|
import axios from 'axios'
|
|
import { ElMessageBox } from 'element-plus'
|
|
import API from '@/util/http'
|
|
import dmmn from '../assets/动漫美女.png'
|
|
import { useRoute } from 'vue-router'
|
|
import { storeToRefs } from 'pinia'
|
|
import { useAreaStore } from '@/store/area'
|
|
const router = useRouter()
|
|
const imgrule1 = dmmn
|
|
const messageVisible = ref(false)
|
|
const areaStore = useAreaStore()
|
|
const { currentArea, updateArea } = storeToRefs(areaStore)
|
|
//这是获取用户信息的接口
|
|
const adminData = ref({
|
|
name: ''
|
|
})
|
|
const getAdminData = async function () {
|
|
try {
|
|
const result = await API({ url: '/admin/userinfo', data: {} })
|
|
adminData.value = result
|
|
console.log('请求成功', result)
|
|
console.log('用户信息', adminData.value)
|
|
} catch (error) {
|
|
console.log('请求失败', error)
|
|
}
|
|
}
|
|
// 获取地区
|
|
const areas = ref([])
|
|
const getAreas = async function () {
|
|
try {
|
|
const result = await API({ url: '/recharge/user/search', data: {} })
|
|
areas.value = result.data
|
|
console.log('请求成功', result)
|
|
} catch (error) {
|
|
console.log('请求失败', error)
|
|
}
|
|
}
|
|
// 查看个人信息弹出框
|
|
const openMessage = function () {
|
|
messageVisible.value = true
|
|
}
|
|
const closeMessage = function () {
|
|
messageVisible.value = false
|
|
}
|
|
const message = function () {
|
|
openMessage()
|
|
}
|
|
|
|
// 获取machineId
|
|
|
|
function logout() {
|
|
const machineId = localStorage.getItem('machineId')
|
|
console.log('machineId:', machineId)
|
|
localStorage.removeItem('token')
|
|
// localStorage.clear();
|
|
router.push('/login?machineId=' + machineId)
|
|
//添加刷新页面的代码
|
|
// window.location.reload();
|
|
ElMessage.success('退出成功')
|
|
}
|
|
|
|
// 挂载
|
|
onMounted(async function () {
|
|
// 获取用户信息
|
|
getAdminData()
|
|
// 获取地区
|
|
getAreas()
|
|
})
|
|
// 处理地区点击事件
|
|
const changeDataByArea = (item) => {
|
|
areaStore.updateArea(item)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="common-layout">
|
|
<el-container>
|
|
<el-aside
|
|
style="
|
|
width: 15%;
|
|
min-width: 180px;
|
|
position: fixed; /* 固定位置 */
|
|
top: 0;
|
|
left: 0;
|
|
height: 100vh; /* 高度占满视口 */
|
|
z-index: 100; /* 确保侧边栏在其他元素之上 */
|
|
"
|
|
>
|
|
<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"
|
|
>
|
|
<el-menu-item
|
|
index="/workspace"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 2 ||
|
|
adminData.permission == 3 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
工作台
|
|
</el-menu-item>
|
|
|
|
<el-sub-menu
|
|
index="2"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 3 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<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"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 3 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<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"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 2 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>充值</span>
|
|
</template>
|
|
|
|
<el-sub-menu index="5">
|
|
<template #title>金币充值</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>
|
|
|
|
<el-sub-menu
|
|
index="6"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 2 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>消费</span>
|
|
</template>
|
|
<el-sub-menu index="7">
|
|
<template #title>金币消费</template>
|
|
<el-menu-item index="/addConsume">新增消费</el-menu-item>
|
|
<el-menu-item index="/allConsume">所有消费明细</el-menu-item>
|
|
</el-sub-menu>
|
|
</el-sub-menu>
|
|
|
|
<el-sub-menu
|
|
index="8"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 2 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<template #title>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
<span>退款</span>
|
|
</template>
|
|
<el-sub-menu index="9">
|
|
<template #title>金币退款</template>
|
|
<el-menu-item index="/addRefund">新增退款</el-menu-item>
|
|
<el-menu-item index="/allRefund">退款明细</el-menu-item>
|
|
</el-sub-menu>
|
|
</el-sub-menu>
|
|
<el-sub-menu index="10">
|
|
<template #title
|
|
><el-icon> <Folder /> </el-icon>金豆模块</template
|
|
>
|
|
<el-menu-item index="/addGoldenBeen">金豆充值</el-menu-item>
|
|
<el-menu-item index="/goldenBeenDetail">金豆充值明细</el-menu-item>
|
|
<el-menu-item index="/onLineDetail">线上充值明细</el-menu-item>
|
|
<el-menu-item index="/goldenBeenConsum">金豆消费明细</el-menu-item>
|
|
<el-menu-item index="/goldenBeenBalance">客户金豆余额</el-menu-item>
|
|
</el-sub-menu>
|
|
<el-menu-item
|
|
index="/usergold"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 2 ||
|
|
adminData.permission == 3 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
客户金币明细
|
|
</el-menu-item>
|
|
|
|
<el-menu-item
|
|
index="/usergoldInfo"
|
|
v-if="
|
|
adminData.permission == 1 ||
|
|
adminData.permission == 2 ||
|
|
adminData.permission == 3 ||
|
|
adminData.permission == 5
|
|
"
|
|
>
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
客户金币余额
|
|
</el-menu-item>
|
|
|
|
<el-menu-item index="/permissions" v-if="adminData.permission == 1">
|
|
<el-icon>
|
|
<Folder />
|
|
</el-icon>
|
|
权限管理
|
|
</el-menu-item>
|
|
</el-menu>
|
|
</el-aside>
|
|
<el-container style="margin-left: 15%; min-width: 180px">
|
|
<!-- 修改 el-header 样式 -->
|
|
<el-header
|
|
style="
|
|
position: fixed;
|
|
top: 0;
|
|
left: 15%;
|
|
right: 0;
|
|
z-index: 101;
|
|
background: white;
|
|
"
|
|
>
|
|
<el-menu class="el-menu-demo" mode="horizontal" :ellipsis="false">
|
|
<el-sub-menu index="1" class="area">
|
|
<template #title>
|
|
<VscGlobe />
|
|
<!-- {{ currentArea }} -->
|
|
</template>
|
|
<!-- <el-menu-item
|
|
v-for="(item, index) in areas"
|
|
:key="index"
|
|
@click="changeDataByArea(item)"
|
|
>
|
|
{{ item }}
|
|
</el-menu-item> -->
|
|
</el-sub-menu>
|
|
</el-menu>
|
|
<el-menu class="el-menu-demo" mode="horizontal" :ellipsis="false">
|
|
<el-sub-menu index="1" class="admin">
|
|
<template #title>
|
|
<el-image
|
|
:src="imgrule1"
|
|
alt="错误"
|
|
style="width: 50px; height: 50px"
|
|
/>
|
|
<span style="margin-left: 10px">{{ adminData.name }}</span>
|
|
</template>
|
|
<el-menu-item @click="message()">查看个人信息</el-menu-item>
|
|
<el-menu-item index="1-2" @click="logout">退出登录</el-menu-item>
|
|
</el-sub-menu>
|
|
</el-menu>
|
|
</el-header>
|
|
<!-- 修改 el-main 样式 -->
|
|
<el-main style="margin-top: 60px">
|
|
<!-- 60px 是 el-header 的大致高度,可根据实际情况调整 -->
|
|
<router-view></router-view>
|
|
</el-main>
|
|
</el-container>
|
|
</el-container>
|
|
</div>
|
|
<!-- 查看个人信息 -->
|
|
<el-dialog v-model="messageVisible" title="查看个人信息" width="500px">
|
|
<el-form :model="adminData">
|
|
<el-form-item label="用户姓名" label-width="100px" label-position="left">
|
|
<span class="message-font">{{ adminData.name }}</span>
|
|
</el-form-item>
|
|
<el-form-item label="精网号" label-width="100px" label-position="left">
|
|
<span class="message-font">{{ adminData.jwcode }}</span>
|
|
</el-form-item>
|
|
<el-form-item label="地区" label-width="100px" label-position="left">
|
|
<span class="message-font">{{ adminData.area }}</span>
|
|
</el-form-item>
|
|
<el-form-item label="注册时间" label-width="100px" label-position="left">
|
|
<span class="message-font">{{ adminData.createTime }}</span>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button text @click="closeMessage()">关闭</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.message-font {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.admin {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.el-aside {
|
|
background-color: #08193d;
|
|
min-height: 100vh;
|
|
width: 200px;
|
|
}
|
|
|
|
.logo {
|
|
color: white;
|
|
margin: 20px 0px 20px 20px;
|
|
display: flex;
|
|
}
|
|
.el-menu {
|
|
border: none; /* 去除边框 */
|
|
padding: 0; /* 去除内边距 */
|
|
}
|
|
.el-menu-demo {
|
|
float: right; /* 将菜单向右浮动 */
|
|
}
|
|
</style>
|