From dec9b1ee435f4ff74f5929b1432041a299f7ddbf Mon Sep 17 00:00:00 2001
From: BianLzhaoMin <11485688+bianliangzhaomin123@user.noreply.gitee.com>
Date: Tue, 11 Feb 2025 10:13:57 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=AD=A6=E5=91=98=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E4=B8=8B=E8=8F=9C=E5=8D=95--=E7=BB=9F=E8=AE=A1?=
 =?UTF-8?q?=E5=88=86=E6=9E=90=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/aescbc.js                           |   4 +-
 .../components/card-info.vue                  |  61 +++++++
 .../components/chart-info.vue                 | 167 ++++++++++++++++++
 .../statisticalAnalysis/index.vue             |  48 +++++
 vue.config.js                                 |   5 +-
 5 files changed, 281 insertions(+), 4 deletions(-)
 create mode 100644 src/views/educationalTraining/studentManagement/statisticalAnalysis/components/card-info.vue
 create mode 100644 src/views/educationalTraining/studentManagement/statisticalAnalysis/components/chart-info.vue
 create mode 100644 src/views/educationalTraining/studentManagement/statisticalAnalysis/index.vue

diff --git a/src/utils/aescbc.js b/src/utils/aescbc.js
index 3da8d7f..5e8c98e 100644
--- a/src/utils/aescbc.js
+++ b/src/utils/aescbc.js
@@ -6,12 +6,12 @@ const cbc_iv = CryptoJS.enc.Utf8.parse('1234567812345678')
  * 默认参数需要加密
  * @type {boolean}
  */
-const jia_mi = true
+const jia_mi = false
 /**
  * 默认后台会自动加密
  * @type {boolean}
  */
-const jie_mi = true
+const jie_mi = false
 /**
  * 加密
  * @param word
diff --git a/src/views/educationalTraining/studentManagement/statisticalAnalysis/components/card-info.vue b/src/views/educationalTraining/studentManagement/statisticalAnalysis/components/card-info.vue
new file mode 100644
index 0000000..6fea10d
--- /dev/null
+++ b/src/views/educationalTraining/studentManagement/statisticalAnalysis/components/card-info.vue
@@ -0,0 +1,61 @@
+<template>
+  <div style="margin-bottom: 12px">
+    <el-row type="flex" justify="space-around">
+      <el-col :span="6" v-for="(item, index) in cardList" :key="index">
+        <div class="grid-content bg-purple">
+          <div>
+            <span>{{ item.card_num }}</span>
+            <span style="font-size: 14px">次</span>
+          </div>
+
+          <div>{{ item.card_title }}</div>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      cardList: [
+        {
+          card_num: 999,
+          card_title: '学习任务',
+        },
+        {
+          card_num: 999,
+          card_title: '考试任务',
+        },
+        {
+          card_num: 999,
+          card_title: '培训任务',
+        },
+      ],
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.grid-content {
+  min-height: 120px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.3);
+  border-radius: 8px;
+
+  & div:first-child span:first-child {
+    font-size: 20px;
+    font-weight: bold;
+    letter-spacing: 2px;
+  }
+
+  & div:last-child {
+    margin-top: 12px;
+  }
+}
+</style>
diff --git a/src/views/educationalTraining/studentManagement/statisticalAnalysis/components/chart-info.vue b/src/views/educationalTraining/studentManagement/statisticalAnalysis/components/chart-info.vue
new file mode 100644
index 0000000..39200bf
--- /dev/null
+++ b/src/views/educationalTraining/studentManagement/statisticalAnalysis/components/chart-info.vue
@@ -0,0 +1,167 @@
+<template>
+    <div :style="{ height: height, width: width }" />
+</template>
+
+<script>
+import * as echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '@/views/dashboard/mixins/resize.js'
+
+export default {
+    mixins: [resize],
+    props: {
+        width: {
+            type: String,
+            default: '100%',
+        },
+        height: {
+            type: String,
+            default: '500px',
+        },
+        autoResize: {
+            type: Boolean,
+            default: true,
+        },
+        chartData: {
+            type: Object,
+            required: true,
+        },
+    },
+    data() {
+        return {
+            chart: null,
+        }
+    },
+    watch: {
+        chartData: {
+            deep: true,
+            handler(val) {
+                this.setOptions(val)
+            },
+        },
+    },
+    mounted() {
+        this.$nextTick(() => {
+            this.initChart()
+        })
+    },
+    beforeDestroy() {
+        if (!this.chart) {
+            return
+        }
+        this.chart.dispose()
+        this.chart = null
+    },
+    methods: {
+        initChart() {
+            this.chart = echarts.init(this.$el, 'macarons')
+            this.setOptions(this.chartData)
+        },
+        setOptions({ expectedData, actualData } = {}) {
+            this.chart.setOption({
+                xAxis: {
+                    data: [
+                        '一月',
+                        '二月',
+                        '三月',
+                        '四月',
+                        '五月',
+                        '六月',
+                        '七月',
+                        '八月',
+                        '九月',
+                        '十月',
+                        '十一月',
+                        '十二月',
+                    ],
+                    boundaryGap: false,
+                    axisTick: {
+                        show: false,
+                    },
+                },
+                grid: {
+                    left: 10,
+                    right: 10,
+                    bottom: 40, // 增大底部空间，避免遮挡
+                    top: 30, // 如果需要，可以增加顶部空白
+                    containLabel: true,
+                },
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross',
+                    },
+                    padding: [5, 10],
+                },
+                yAxis: {
+                    axisTick: {
+                        show: false,
+                    },
+                },
+                legend: {
+                    data: ['学习任务', '考试任务', '培训任务'],
+                },
+                series: [
+                    {
+                        name: '学习任务',
+                        itemStyle: {
+                            normal: {
+                                color: '#1890ff',
+                                lineStyle: {
+                                    color: '#1890ff',
+                                    width: 2,
+                                },
+                            },
+                        },
+                        smooth: false,
+                        type: 'line',
+                        data: [20, 30, 12, 10, 30, 13, 20, 30, 12, 10, 30, 13],
+                        animationDuration: 2800,
+                        animationEasing: 'cubicInOut',
+                    },
+                    {
+                        name: '考试任务',
+                        smooth: false,
+                        type: 'line',
+                        itemStyle: {
+                            normal: {
+                                color: '#2fc25b',
+                                lineStyle: {
+                                    color: '#2fc25b',
+                                    width: 2,
+                                },
+                                // areaStyle: {
+                                //     color: '#f3f8ff',
+                                // },
+                            },
+                        },
+                        data: [20, 20, 12, 30, 30, 13, 100, 30, 12, 50, 30, 13],
+                        animationDuration: 2800,
+                        animationEasing: 'quadraticOut',
+                    },
+                    {
+                        name: '培训任务',
+                        smooth: false,
+                        type: 'line',
+                        itemStyle: {
+                            normal: {
+                                color: '#facc14',
+                                lineStyle: {
+                                    color: '#facc14',
+                                    width: 2,
+                                },
+                                // areaStyle: {
+                                //     color: '#f3f8ff',
+                                // },
+                            },
+                        },
+                        data: [20, 30, 12, 33, 30, 13, 20, 30, 22, 10, 30, 13],
+                        animationDuration: 2800,
+                        animationEasing: 'quadraticOut',
+                    },
+                ],
+            })
+        },
+    },
+}
+</script>
diff --git a/src/views/educationalTraining/studentManagement/statisticalAnalysis/index.vue b/src/views/educationalTraining/studentManagement/statisticalAnalysis/index.vue
new file mode 100644
index 0000000..8e07d1a
--- /dev/null
+++ b/src/views/educationalTraining/studentManagement/statisticalAnalysis/index.vue
@@ -0,0 +1,48 @@
+<template>
+    <!-- 统计分析 -->
+    <div class="app-container statistical-container">
+        <el-form :model="queryParams" ref="queryForm" size="small" inline>
+            <el-form-item>
+                <el-date-picker v-model="queryParams.years" type="year" placeholder="选择年"></el-date-picker>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
+            </el-form-item>
+        </el-form>
+
+        <!-- 上方卡片 -->
+        <CardInfo />
+
+        <!-- 图表 -->
+        <ChartInfo />
+    </div>
+</template>
+
+<script>
+import CardInfo from './components/card-info'
+import ChartInfo from './components/chart-info'
+export default {
+    components: {
+        CardInfo,
+        ChartInfo,
+    },
+    data() {
+        return {
+            queryParams: {
+                years: '',
+            },
+        }
+    },
+
+    methods: {
+        handleQuery() {},
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.statistical-container {
+    display: flex;
+    flex-direction: column;
+}
+</style>
diff --git a/vue.config.js b/vue.config.js
index 13c485b..4cc5ba5 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -38,9 +38,10 @@ module.exports = {
         // target: `http://localhost:18080`,
         // target: 'http://192.168.0.176:18080',
         // target: 'http://192.168.0.58:19090', // 杰
-        target: 'http://192.168.0.14:18080', // 测试环境
+        // target: 'http://192.168.0.14:18080', // 测试环境
         // target: 'http://218.21.27.6:1999/prod-api', // 生产环境
-        // target: 'http://192.168.0.38:18080', // 郝
+        // target: 'http://192.168.0.38:18080', // 郝志权
+        target: 'http://192.168.2.122:18080', // 梁超
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: '',