From 3c4fee1db116c11d4f04727cfe076d7c94daeaf2 Mon Sep 17 00:00:00 2001
From: yanzhaofeige <yanzhaofeige@qq.com>
Date: Mon, 30 Sep 2024 12:10:57 +0800
Subject: [PATCH] init
---
cpzidc-ui/src/views/index_v1.vue | 98 +++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 98 insertions(+), 0 deletions(-)
diff --git a/cpzidc-ui/src/views/index_v1.vue b/cpzidc-ui/src/views/index_v1.vue
new file mode 100644
index 0000000..d2d2ec6
--- /dev/null
+++ b/cpzidc-ui/src/views/index_v1.vue
@@ -0,0 +1,98 @@
+<template>
+ <div class="dashboard-editor-container">
+
+ <panel-group @handleSetLineChartData="handleSetLineChartData" />
+
+ <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'
+
+const lineChartData = {
+ newVisitis: {
+ expectedData: [100, 120, 161, 134, 105, 160, 165],
+ actualData: [120, 82, 91, 154, 162, 140, 145]
+ },
+ messages: {
+ expectedData: [200, 192, 120, 144, 160, 130, 140],
+ actualData: [180, 160, 151, 106, 145, 150, 130]
+ },
+ purchases: {
+ expectedData: [80, 100, 121, 104, 105, 90, 100],
+ actualData: [120, 90, 100, 138, 142, 130, 130]
+ },
+ shoppings: {
+ expectedData: [130, 140, 141, 142, 145, 150, 160],
+ actualData: [120, 82, 91, 154, 162, 140, 130]
+ }
+}
+
+export default {
+ name: 'Index',
+ components: {
+ PanelGroup,
+ LineChart,
+ RaddarChart,
+ PieChart,
+ BarChart
+ },
+ data() {
+ return {
+ lineChartData: lineChartData.newVisitis
+ }
+ },
+ methods: {
+ handleSetLineChartData(type) {
+ this.lineChartData = lineChartData[type]
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.dashboard-editor-container {
+ padding: 32px;
+ background-color: rgb(240, 242, 245);
+ position: relative;
+
+ .chart-wrapper {
+ background: #fff;
+ padding: 16px 16px 0;
+ margin-bottom: 32px;
+ }
+}
+
+@media (max-width:1024px) {
+ .chart-wrapper {
+ padding: 8px;
+ }
+}
+</style>
--
Gitblit v1.9.3