144 lines
3.3 KiB
Vue
144 lines
3.3 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<panel-group />
|
|
<el-card style="margin-bottom: 32px">
|
|
<div slot="header">
|
|
<span>快捷功能</span>
|
|
</div>
|
|
<el-row :gutter="10">
|
|
<el-col
|
|
:xs="8"
|
|
:sm="6"
|
|
:xl="4"
|
|
v-for="item in quickList"
|
|
:key="item.id"
|
|
class="pointer"
|
|
style="margin-bottom: 20px; padding-top: 20px; text-align: center"
|
|
>
|
|
<router-link :to="item.path">
|
|
<el-avatar
|
|
:size="80"
|
|
src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
|
|
></el-avatar>
|
|
<div style="margin: 10px 0">{{ item.title }}</div>
|
|
</router-link>
|
|
</el-col>
|
|
</el-row>
|
|
</el-card>
|
|
<el-row style="background: #fff">
|
|
<el-card>
|
|
<div slot="header">
|
|
<span>数据统计</span>
|
|
</div>
|
|
<columnar-chart :chart-data="lineChartData" />
|
|
</el-card>
|
|
</el-row>
|
|
<!-- <el-row style="background: #fff; padding: 16px 16px 0; margin-bottom: 32px">
|
|
<line-chart :chart-data="lineChartData" />
|
|
</el-row>
|
|
<el-row :gutter="32">
|
|
<el-col :xs="24" :sm="24" :lg="8">
|
|
<div class="chart-wrapper">
|
|
<raddar-chart />
|
|
</div>
|
|
</el-col>
|
|
<el-col :xs="24" :sm="24" :lg="8">
|
|
<div class="chart-wrapper">
|
|
<pie-chart />
|
|
</div>
|
|
</el-col>
|
|
<el-col :xs="24" :sm="24" :lg="8">
|
|
<div class="chart-wrapper">
|
|
<bar-chart />
|
|
</div>
|
|
</el-col>
|
|
</el-row> -->
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import PanelGroup from "./dashboard/PanelGroup";
|
|
import LineChart from "./dashboard/LineChart";
|
|
import RaddarChart from "./dashboard/RaddarChart";
|
|
import PieChart from "./dashboard/PieChart";
|
|
import BarChart from "./dashboard/BarChart";
|
|
import ColumnarChart from "./dashboard/ColumnarChart";
|
|
|
|
export default {
|
|
name: "Index",
|
|
components: {
|
|
PanelGroup,
|
|
LineChart,
|
|
RaddarChart,
|
|
PieChart,
|
|
BarChart,
|
|
ColumnarChart,
|
|
},
|
|
data() {
|
|
return {
|
|
lineChartData: {
|
|
expertData: [15, 45],
|
|
patentData: [40, 30],
|
|
achievementsData: [20, 45],
|
|
demandData: [45, 40],
|
|
dockingData: [15, 50],
|
|
},
|
|
quickList: [
|
|
{
|
|
title: "专家审核",
|
|
path: "/examine/expertList",
|
|
},
|
|
{
|
|
title: "企业审核",
|
|
path: "/examine/enterpriseList",
|
|
},
|
|
{
|
|
title: "机构审核",
|
|
path: "/examine/researchList",
|
|
},
|
|
{
|
|
title: "实验室审核",
|
|
path: "/examine/laboratoryList",
|
|
},
|
|
{
|
|
title: "经纪人审核",
|
|
path: "/examine/agentList",
|
|
},
|
|
{
|
|
title: "成果审核",
|
|
path: "",
|
|
},
|
|
{
|
|
title: "需求审核",
|
|
path: "",
|
|
},
|
|
{
|
|
title: "企业产品审核",
|
|
path: "",
|
|
},
|
|
],
|
|
};
|
|
},
|
|
methods: {},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.dashboard-editor-container {
|
|
background-color: rgb(255, 255, 255);
|
|
position: relative;
|
|
|
|
.chart-wrapper {
|
|
background: #fff;
|
|
padding: 16px 16px 0;
|
|
margin-bottom: 32px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1024px) {
|
|
.chart-wrapper {
|
|
padding: 8px;
|
|
}
|
|
}
|
|
</style>
|