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.
92 lines
2.2 KiB
92 lines
2.2 KiB
<template>
|
|
<!-- 头部 -->
|
|
<el-header class="header">
|
|
<div class="title">数据总览</div>
|
|
</el-header>
|
|
<div style="height: 100vh;">
|
|
<el-row class="cards">
|
|
<el-col :span="14">
|
|
<GoldManagement/>
|
|
</el-col>
|
|
<!-- 右上格子：占12列 -->
|
|
<el-col :span="10">
|
|
<CashManagement/>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row class="graphs">
|
|
<el-col :span="24">
|
|
<div v-if="loading">加载中...</div>
|
|
<GoldGraphMarkets v-else-if="GraphFlag" />
|
|
<GoldGraph v-else />
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import GoldManagement from "@/components/workspace/GoldManagement.vue"
|
|
import CashManagement from "@/components/workspace/CashManagement.vue"
|
|
import GoldGraphMarkets from "@/components/workspace/GoldGraphMarkets.vue";
|
|
import API from "@/util/http.js";
|
|
import {onMounted, ref} from "vue";
|
|
import GoldGraph from "@/components/workspace/GoldGraph.vue";
|
|
|
|
const GraphFlag = ref();
|
|
const loading = ref(true); // 新增加载状态
|
|
|
|
const getAdminData = async function () {
|
|
try {
|
|
loading.value = true; // 开始加载
|
|
const result = await API({url: '/admin/userinfo', data: {}});
|
|
GraphFlag.value = result.markets !== '总部' && result.markets !== '研发部' && result.markets !== 'headquarters'
|
|
|
|
;
|
|
console.log("GraphFlag",GraphFlag.value);
|
|
} catch (error) {
|
|
console.log('请求失败', error);
|
|
} finally {
|
|
loading.value = false; // 无论成功失败都结束加载
|
|
}
|
|
};
|
|
|
|
onMounted(async () => {
|
|
await getAdminData()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
.header {
|
|
/* 将纯色背景替换为线性渐变 */
|
|
background: linear-gradient(
|
|
90deg,
|
|
rgba(228, 240, 252, 1) 20%,
|
|
rgba(190, 218, 247, 1) 50%,
|
|
rgba(228, 240, 252, 1) 100%
|
|
);
|
|
height: 6vh;
|
|
border-radius: 12px;
|
|
margin-bottom: 4px;
|
|
box-shadow: 0 2px 5px rgba(8, 4, 4, 0.1);
|
|
/* 添加阴影增强层次感 */
|
|
z-index: 80;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.title {
|
|
width: 136px;
|
|
color: #040a2d;
|
|
font-family: "PingFang SC";
|
|
font-size: 34px;
|
|
font-style: normal;
|
|
font-weight: 900;
|
|
line-height: 31.79px;
|
|
text-align: center;
|
|
}
|
|
|
|
.graphs {
|
|
padding-bottom: 10px;
|
|
}
|
|
</style>
|