From b91cded52dd666e1b795ec0c6ca8056d9d55318b Mon Sep 17 00:00:00 2001
From: significative <163999932+significative@users.noreply.github.com>
Date: Tue, 9 Jul 2024 14:55:40 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B7=A5=E4=BD=9C=E5=8F=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/chDepartment/index.vue         | 496 ++++++++++++++----
 .../components/chDepartment/options.js        | 230 +++++++-
 .../workbench/components/chExpert/index.vue   | 296 +++++++++++
 .../workbench/components/chSchool/index.vue   | 455 ++++++++++++++++
 .../depart/workbench/components/index.ts      |   4 +-
 .../src/views/depart/workbench/index.vue      |   4 +-
 6 files changed, 1378 insertions(+), 107 deletions(-)
 create mode 100644 jeecgboot-vue3-master/src/views/depart/workbench/components/chExpert/index.vue
 create mode 100644 jeecgboot-vue3-master/src/views/depart/workbench/components/chSchool/index.vue

diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/index.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/index.vue
index b2435b1e..fd1eb8a4 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/index.vue
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/index.vue
@@ -1,108 +1,185 @@
 <template>
     <div class="department">
         <div class="header">
-            <div class="card">
-                <div class="top">
-                    <div class="text">
-                        本年度已开展比赛数
+            <a-row :gutter="[16, 16]" type="flex" justify="space-between" style="width: 100%;">
+                <a-col :xs="12" :xl="6">
+                    <div class="card">
+                        <div class="top">
+                            <div class="text">
+                                本年度已开展比赛数
+                            </div>
+                            <Icon icon="mainHome-time|svg" :size="20" />
+                        </div>
+                        <div class="center">
+                            <div class="text">
+                                67
+                            </div>
+                        </div>
+                        <div class="bottom">
+                            <div class="bot_card">国赛：12</div>
+                            <div class="bot_card">省赛：12</div>
+                            <div class="bot_card">校赛：24</div>
+                        </div>
                     </div>
-                    <Icon icon="mainHome-time|svg" :size="20" />
-                </div>
-                <div class="center">
-                    <div class="text">
-                        67
+                </a-col>
+                <a-col :xs="12" :xl="6">
+
+                    <div class="card">
+                        <div class="top">
+                            <div class="text">
+                                本年度参加比赛队伍数
+                            </div>
+                            <Icon icon="mainHome-mp|svg" :size="20" />
+                        </div>
+                        <div class="center">
+                            <div class="text">
+                                1262
+                            </div>
+                        </div>
+                        <div class="bottom">
+                            <div class="bot_card">国赛：120</div>
+                            <div class="bot_card">省赛：1230</div>
+                            <div class="bot_card">校赛：24</div>
+                        </div>
                     </div>
-                </div>
-                <div class="bottom">
-                    <div class="bot_card">国赛：12</div>
-                    <div class="bot_card">省赛：12</div>
-                    <div class="bot_card">校赛：24</div>
-                </div>
-            </div>
-            <div class="card">
-                <div class="top">
-                    <div class="text">
-                        本年度参加比赛队伍数
+                </a-col>
+                <a-col :xs="12" :xl="6">
+                    <div class="card">
+                        <div class="top">
+                            <div class="text">
+                                正在进行的比赛数
+                            </div>
+                            <Icon icon="mainHome-down|svg" :size="20" />
+                        </div>
+                        <div class="center">
+                            <div class="text" style="color: #74D472;">
+                                45
+                            </div>
+                        </div>
+                        <div class="bottom">
+                            <div class="bot_card">国赛：9</div>
+                            <div class="bot_card">省赛：13</div>
+                            <div class="bot_card">校赛：26</div>
+                        </div>
                     </div>
-                    <Icon icon="mainHome-mp|svg" :size="20" />
-                </div>
-                <div class="center">
-                    <div class="text">
-                        1262
+                </a-col>
+                <a-col :xs="12" :xl="6">
+                    <div class="card2">
+                        <div class="top">
+                            <div class="text">
+                                已经完成的比赛
+                            </div>
+                            <Icon icon="mainHome-time|svg" :size="20" />
+                        </div>
+                        <div class="center">
+                            <div class="percent">
+                                78%
+                            </div>
+                            <div>
+                                <a-progress stroke-linecap="square" :percent="78" :show-info="false" />
+                            </div>
+                        </div>
+                        <div class="bottom">
+                            <div class="text">
+                                已完成的比赛11
+                            </div>
+                            <div class="text">
+                                未完成的比赛11
+                            </div>
+                        </div>
                     </div>
-                </div>
-                <div class="bottom">
-                    <div class="bot_card">国赛：120</div>
-                    <div class="bot_card">省赛：1230</div>
-                    <div class="bot_card">校赛：24</div>
-                </div>
-            </div>
-            <div class="card">
-                <div class="top">
-                    <div class="text">
-                        正在进行的比赛数
-                    </div>
-                    <Icon icon="mainHome-down|svg" :size="20" />
-                </div>
-                <div class="center">
-                    <div class="text" style="color: #74D472;">
-                        45
-                    </div>
-                </div>
-                <div class="bottom">
-                    <div class="bot_card">国赛：9</div>
-                    <div class="bot_card">省赛：13</div>
-                    <div class="bot_card">校赛：26</div>
-                </div>
-            </div>
-
-
-            <div class="card2">
-                <div class="top">
-                    <div class="text">
-                        已经完成的比赛
-                    </div>
-                    <Icon icon="mainHome-time|svg" :size="20" />
-                </div>
-                <div class="center">
-                    <div class="percent">
-                        78%
-                    </div>
-                    <div>
-                        <a-progress stroke-linecap="square" :percent="78" :show-info="false" />
-                    </div>
-                </div>
-                <div class="bottom">
-                    <div class="text">
-                        已完成的比赛11
-                    </div>
-                    <div class="text">
-                        未完成的比赛11
-                    </div>
-                </div>
-            </div>
+                </a-col>
+            </a-row>
         </div>
 
         <div class="content">
-            <div class="con_left">
-                <div class="title-box">
-                    <div class="title">部门比赛情况分布</div>
-                </div>
-                <div class="ec-box">
-                    <div id="ec" ref="ec"></div>
-                </div>
-            </div>
-            <div class="con_right">
-                <div class="title-box">
-                    <div class="tit">部门近两年维度积分</div>
-                    <div class="bas"></div>
-                </div>
-            </div>
+            <a-row :gutter="[17, 16]" type="flex" justify="space-between" style="width: 100%;">
+                <a-col :xs="24" :xl="7">
+                    <div class="con_left">
+                        <div class="title-box">
+                            <div class="title">部门比赛情况分布</div>
+                        </div>
+                        <div class="ec-box">
+                            <div id="ec" ref="ec"></div>
+                        </div>
+                    </div>
+                </a-col>
+                <a-col :xs="24" :xl="17">
+                    <div class="con_right">
+                        <div class="title-box">
+                            <div class="tit">部门近两年维度积分</div>
+                            <div class="bas"></div>
+                        </div>
+                        <div class="ec-box">
+                            <!-- 柱状图 -->
+                            <div id="ec_bar" ref="ec_bar"></div>
+                            <div class="infor">
+                                <ul class="card-box">
+                                    <li v-for="i in 12" :key="i">
+                                        <div class="ol">{{ i }}</div>
+                                        <div class="text">奠定基础</div>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </a-col>
+            </a-row>
+
+
         </div>
 
         <div class="footer">
-            <div class="foo_card"></div>
-            <div class="foo_card"></div>
+            <a-row :gutter="[25, 16]" type="flex" justify="space-between" style="width: 100%;">
+                <a-col :xs="24" :xl="12">
+                    <div class="foo_card">
+                        <div class="title">
+                            部门比赛积分排名
+                        </div>
+
+                        <div class="table">
+                            <div class="t_item t_head">
+                                <div class="ranking">排名</div>
+                                <div class="name">比赛名称</div>
+                                <div class="total">比赛积分</div>
+                                <div class="operate">操作</div>
+                            </div>
+                            <div class="t_item t_con" v-for="i in 6" :key="i">
+                                <div class="ranking">
+                                    <div class="ol" :class="{ ac: i <= 3 }">{{ i }}</div>
+                                </div>
+                                <div class="name">国家电网竞赛</div>
+                                <div class="total">7059</div>
+                                <div class="operate">详情</div>
+                            </div>
+                        </div>
+                    </div>
+                </a-col>
+                <a-col :xs="24" :xl="12">
+                    <div class="foo_card">
+                        <div class="title">
+                            部门学生积分排名
+                        </div>
+
+                        <div class="table">
+                            <div class="t_item t_head">
+                                <div class="ranking">排名</div>
+                                <div class="name">参赛选手名</div>
+                                <div class="total">比赛积分</div>
+                                <div class="operate">操作</div>
+                            </div>
+                            <div class="t_item t_con" v-for="i in 6" :key="i">
+                                <div class="ranking">
+                                    <div class="ol" :class="{ ac: i <= 3 }">{{ i }}</div>
+                                </div>
+                                <div class="name">王晨</div>
+                                <div class="total">4221</div>
+                                <div class="operate">详情</div>
+                            </div>
+                        </div>
+                    </div>
+                </a-col>
+            </a-row>
         </div>
     </div>
 </template>
@@ -110,17 +187,72 @@
 import { Progress as AProgress } from 'ant-design-vue';
 import { onMounted, ref } from 'vue';
 import * as echarts from 'echarts';
-import { optionRing } from './options'
+import { optionRing, optionBar } from './options'
 
 const ec = ref()
+const ec_bar = ref()
 onMounted(() => {
     const myChart = echarts.init(ec.value);
     myChart.setOption(optionRing);
+    const bar = echarts.init(ec_bar.value);
+    bar.setOption(optionBar);
+    window.addEventListener('resize', function () {
+        myChart.resize()
+        bar.resize()
+    })
 })
 
 </script>
 
 <style lang="less" scoped>
+::v-deep #ec_bar .bar_card {
+    width: 120px;
+    height: 116px;
+    background: #FFFFFF;
+    box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.08), 0px 16px 24px 2px rgba(0, 0, 0, 0.04), 0px 6px 30px 5px rgba(0, 0, 0, 0.05);
+    border-radius: 3px 3px 3px 3px;
+    border: 1px solid #DCDCDC;
+    opacity: 0.98;
+    padding-top: 16px;
+    padding-left: 16px;
+
+    .title {
+        height: 20px;
+        font-size: 12px;
+        color: rgba(0, 0, 0, 0.4);
+        line-height: 20px;
+        margin-bottom: 16px;
+    }
+
+    .item {
+        padding-left: 24px;
+        position: relative;
+        height: 20px;
+        font-size: 12px;
+        color: rgba(0, 0, 0, 0.9);
+        line-height: 20px;
+
+        &::after {
+            content: '';
+            display: block;
+            position: absolute;
+            top: 50%;
+            left: 4px;
+            transform: translateY(-50%);
+            width: 8px;
+            height: 8px;
+            background: #0052D9;
+            border-radius: 50%;
+        }
+    }
+}
+
+::v-deep #ec_bar>div[style*="z-index: 9999999;"] {
+    padding: 0 !important;
+    border: none !important;
+    box-shadow: none !important;
+}
+
 .department {
     padding: 16px 16px 0;
 
@@ -134,6 +266,8 @@ onMounted(() => {
         .card,
         .card2 {
             width: 405px;
+            // width: 24.251%;
+            width: 100%;
             height: 182px;
             background: #FFFFFF;
             box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.02), 0px 1px 6px -1px rgba(0, 0, 0, 0.02), 0px 1px 2px 0px rgba(0, 0, 0, 0.03);
@@ -244,7 +378,8 @@ onMounted(() => {
         margin-top: 16px;
 
         .con_left {
-            width: 489px;
+            // width: 489px;
+            width: 100%;
             height: 459px;
             background: #FFFFFF;
             border-radius: 2px 2px 2px 2px;
@@ -281,18 +416,22 @@ onMounted(() => {
         }
 
         .con_right {
-            width: 1160px;
+            // width: 1160px;
+            width: 100%;
             height: 458px;
             background: #FFFFFF;
             box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
             border-radius: 4px 4px 4px 4px;
-            padding-left: 16px;
+            // padding-left: 16px;
+            display: flex;
+            flex-direction: column;
 
             .title-box {
                 height: 57px;
                 display: flex;
                 align-items: center;
                 position: relative;
+                padding-left: 16px;
 
                 .tit {
                     height: 26px;
@@ -304,7 +443,7 @@ onMounted(() => {
                 .bas {
                     position: absolute;
                     bottom: 0;
-                    left: 0;
+                    left: 16px;
                     width: 100%;
                     height: 1px;
                     border: 1px solid rgba(5, 5, 5, 0.06);
@@ -321,6 +460,71 @@ onMounted(() => {
                     }
                 }
             }
+
+            .ec-box {
+                display: flex;
+                justify-content: space-between;
+                flex-grow: 1;
+                column-gap: 22px;
+                padding-left: 39px;
+
+                #ec_bar {
+                    flex-grow: 1;
+
+                }
+
+                .infor {
+                    width: 241px;
+                    display: flex;
+
+                    .card-box {
+                        margin: auto;
+                        width: 100%;
+                        height: 177px;
+                        display: flex;
+                        flex-wrap: wrap;
+                        flex-direction: column;
+                        row-gap: 9px;
+
+                        li {
+                            width: 110px;
+                            height: 22px;
+                            font-size: 14px;
+                            color: rgba(51, 51, 51, 0.88);
+                            line-height: 22px;
+                            display: flex;
+                            justify-content: space-between;
+                            align-items: center;
+
+                            &:nth-child(1)>.ol,
+                            &:nth-child(2)>.ol,
+                            &:nth-child(3)>.ol {
+                                background-color: #314659;
+                                color: #fff;
+                            }
+
+                            .ol {
+                                width: 20px;
+                                height: 20px;
+                                border-radius: 50%;
+                                line-height: 20px;
+                                text-align: center;
+                                background: #F5F5F5;
+                                color: #000000;
+                                font-size: 12px;
+                            }
+
+                            .text {
+                                width: 67px;
+                                font-size: 14px;
+                                color: rgba(51, 51, 51, 0.88);
+                            }
+                        }
+                    }
+
+                }
+            }
+
         }
     }
 
@@ -328,11 +532,107 @@ onMounted(() => {
         margin-top: 21px;
 
         .foo_card {
-            width: 820px;
+            // width: 820px;
+            width: 100%;
             height: 502px;
             background: #FFFFFF;
             box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
             border-radius: 6px 6px 6px 6px;
+            padding: 0 32px;
+
+            .title {
+                padding-left: 23px;
+                height: 57px;
+                line-height: 57px;
+                font-size: 16px;
+                color: rgba(0, 0, 0, 0.85);
+                position: relative;
+
+                &::before {
+                    content: '';
+                    display: block;
+                    position: absolute;
+                    bottom: 0;
+                    left: 0;
+                    width: 100%;
+                    height: 1px;
+                    background-color: rgba(5, 5, 5, 0.06);
+                }
+            }
+
+            .table {
+                width: 100%;
+                padding-left: 32px;
+
+                .t_item {
+                    width: 100%;
+                    height: 54px;
+                    border-bottom: 1px solid #E7E7E7;
+                    display: flex;
+                    align-items: center;
+
+                    .ranking {
+                        // width: 80px;
+                        width: calc((80 / 756) * 100%);
+                    }
+
+                    .name {
+                        // width: 542px;
+                        width: calc((542 / 756) * 100%);
+                    }
+
+                    .total {
+                        // width: 74px;
+                        width: calc((74 / 756) * 100%);
+                    }
+
+                    .operate {
+                        // width: 60px;
+                        width: calc((60 / 756) * 100%);
+                    }
+                }
+
+                .t_head {
+                    font-size: 14px;
+                    color: rgba(0, 0, 0, 0.4);
+                }
+
+                .t_con {
+                    .ranking {
+                        .ol {
+                            width: 24px;
+                            height: 24px;
+                            background: #E7E7E7;
+                            color: rgba(0, 0, 0, 0.9);
+                            font-size: 14px;
+                            line-height: 24px;
+                            text-align: center;
+                            border-radius: 50%;
+
+                            &.ac {
+                                background: #0052D9;
+                                color: rgba(255, 255, 255, 0.9);
+                            }
+                        }
+                    }
+
+                    .name {
+                        font-size: 14px;
+                        color: rgba(0, 0, 0, 0.9);
+                    }
+
+                    .total {
+                        font-size: 14px;
+                        color: rgba(0, 0, 0, 0.9);
+                    }
+
+                    .operate {
+                        font-size: 14px;
+                        color: #0052D9;
+                        cursor: pointer;
+                    }
+                }
+            }
         }
     }
 
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/options.js b/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/options.js
index 5120f947..271d83b0 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/options.js
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/chDepartment/options.js
@@ -1,10 +1,10 @@
 // 部门比赛情况分布 圆环
 export const optionRing = {
-  color: [
-    '#0052D9',
-    '#699EF5',
-    '#B5C7FF',
-  ],
+    color: [
+        '#0052D9',
+        '#699EF5',
+        '#B5C7FF',
+    ],
     legend: {
         x: 'center',
         orient: 'horizontal',
@@ -14,7 +14,7 @@ export const optionRing = {
     series: [
         {
             type: 'pie',
-            center:['50%', '41%'],
+            center: ['50%', '41%'],
             radius: ['35%', '45%'],
             avoidLabelOverlap: false,
             label: {
@@ -38,4 +38,222 @@ export const optionRing = {
             ]
         }
     ]
+};
+
+
+export const optionBar = {
+    tooltip: {
+        trigger: 'axis', // 触发类型为坐标轴触发  
+        axisPointer: {
+            type: 'line',
+            label: {
+                backgroundColor: '#6a7985' // 自定义交叉线标签的背景色  
+            }
+        },
+        formatter: function (params) {
+            let result = '<div class="bar_card">';
+            result += `<div class="title">维度名称</div>`
+            params.forEach(param => {
+                result += `<div class="item" style="color: ${param.color};">
+                    ${param.seriesName}年 ${param.value}    
+                </div>`;
+            });
+            result += '</div>';
+            return result;
+        }
+    },
+    grid: {
+        left: '0%',
+        right: '0%',
+        top: '5%',
+        bottom: '86px',
+        // 如果需要，还可以设置containLabel来控制坐标轴标签是否完全包含在grid区域内  
+        containLabel: true
+    },
+    legend: {
+        data: ['2023', '2024'],
+        bottom: '39px',
+    },
+    xAxis: {
+        data: ['维度一', '维度一', '维度一', '维度一', '维度一', '维度一', '维度一']
+    },
+    yAxis: {
+        type: 'value',
+        min: 0,
+        max: 100,
+    },
+    series: [
+        {
+            name: '2023',
+            type: 'bar',
+            data: [33, 44, 58, 85, 47, 38, 45],
+            barWidth: '20px',
+            itemStyle: {
+                color: '#0052D9',
+            }
+        },
+        {
+            name: '2024',
+            type: 'bar',
+            data: [36, 34, 48, 62, 43, 30, 37],
+            barWidth: '20px',
+            itemStyle: {
+                color: '#699EF5',
+            }
+        },
+    ]
+};
+
+
+var colorArr = ['#fff', '#fff']; //颜色
+var dataArr = [
+   {
+    value: [4000, 700, 3600, 3900, 1800, 4200, 700, 3600, 4200, 700, 3600, 4200, 700, 3600],
+    name: '1',
+    itemStyle: {
+     normal: {
+      lineStyle: {
+       color: '#55d7f2',
+      },
+      shadowColor: '#4A99FF',
+      shadowBlur: 10,
+     },
+    },
+    areaStyle: {
+     normal: {
+      // 单项区域填充样式
+      color: {
+       type: 'linear',
+       x: 1, //右
+       y: 0, //下
+       x2: 1, //左
+       y2: 1, //上
+       colorStops: [
+        {
+         offset: 0,
+         color: '#f0a223',
+        },
+        {
+         offset: 1,
+         color: '#093138',
+        },
+       ],
+       globalCoord: false,
+      },
+      opacity: 1, // 区域透明度
+     },
+    },
+   },
+  ];
+ var indicator = [
+  {
+   text: '前言探索',
+   max: 6000,
+  },
+  {
+   text: '奠定基础',
+   max: 5000,
+  },
+  {
+   text: '知识分析',
+   max: 5000,
+  },
+  {
+   text: '社会责任',
+   max: 5000,
+  },
+  {
+   text: '独立思考',
+   max: 5500,
+  },
+  {
+   text: '拓宽视野',
+   max: 5000,
+  },
+  {
+   text: '激发兴趣',
+   max: 5000,
+  },
+  {
+   text: '沟通协调',
+   max: 5000,
+  },
+  {
+   text: '设计开发',
+   max: 5000,
+  },
+  {
+   text: '研判分析',
+   max: 5000,
+  },
+  {
+   text: '创新能力',
+   max: 5000,
+  },
+  {
+   text: '团队协作',
+   max: 5000,
+  },
+ ];
+
+
+export const optionRadar = {
+    backgroundColor: "transparent",
+    color: colorArr,
+    // legend: {
+    //  orient: "vertical",
+    //  // icon: 'circle', //图例形状
+    //  // data: legendData,
+    //  top: 0,
+    //  left: 20,
+    //  itemWidth: 8, // 图例标记的图形宽度。[ default: 25 ]
+    //  itemHeight: 8, // 图例标记的图形高度。[ default: 14 ]
+    //  itemGap: 22, // 图例每项之间的间隔。[ default: 10 ]横向布局时为水平间隔，纵向布局时为纵向间隔。
+    //  textStyle: {
+    //   fontSize: 12,
+    //   fontWeight: "bold",
+    //   color: "#00E4FF",
+    //  },
+    // },
+    tooltip: {
+        trigger: 'item'
+    },
+    radar: {
+        // shape: 'circle',
+        name: {
+            textStyle: {
+                color: "#9ca4a6",
+                fontSize: 12,
+            },
+        },
+        indicator: indicator,
+        splitArea: {
+            // 坐标轴在 grid 区域中的分隔区域，默认不显示。
+            show: true,
+            areaStyle: {
+                // 分隔区域的样式设置。
+                color: ["rgba(255,255,255,0)", "rgba(255,255,255,0)"], // 分隔区域颜色。分隔区域会按数组中颜色的顺序依次循环设置颜色。默认是一个深浅的间隔色。
+            },
+        },
+        axisLine: {
+            //指向外圈文本的分隔线样式
+            lineStyle: {
+                color: "#2a5f61",
+            },
+        },
+        splitLine: {
+            lineStyle: {
+                color: "#2a5f61", // 分隔线颜色
+                width: 1, // 分隔线线宽
+            },
+        },
+    },
+    series: [
+        {
+            type: "radar",
+            symbolSize: 6,
+            symbol: "circle",
+            data: dataArr,
+        },
+    ],
 };
\ No newline at end of file
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/chExpert/index.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/chExpert/index.vue
new file mode 100644
index 00000000..4738ddc4
--- /dev/null
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/chExpert/index.vue
@@ -0,0 +1,296 @@
+<template>
+    <div class="expert">
+        <a-row :gutter="[16, 16]" type="flex" justify="space-between">
+            <a-col :md="24" :xl="12">
+                <a-row :gutter="[16, 16]" type="flex" justify="space-between">
+                    <a-col :span="12">
+                        <div class="card">
+                            <div class="top">
+                                <div class="text">
+                                    本年度已开展比赛数
+                                </div>
+                                <Icon icon="mainHome-time|svg" :size="20" />
+                            </div>
+                            <div class="center">
+                                <div class="text">
+                                    67
+                                </div>
+                            </div>
+                            <div class="bottom">
+                                <div class="bot_card">国赛：12</div>
+                                <div class="bot_card">省赛：12</div>
+                                <div class="bot_card">校赛：24</div>
+                            </div>
+                        </div>
+                    </a-col>
+                    <a-col :span="12">
+                        <div class="card">
+                            <div class="top">
+                                <div class="text">
+                                    本年度已开展比赛数
+                                </div>
+                                <Icon icon="mainHome-time|svg" :size="20" />
+                            </div>
+                            <div class="center">
+                                <div class="text">
+                                    67
+                                </div>
+                            </div>
+                            <div class="bottom">
+                                <div class="bot_card">国赛：12</div>
+                                <div class="bot_card">省赛：12</div>
+                                <div class="bot_card">校赛：24</div>
+                            </div>
+                        </div>
+                    </a-col>
+                    <a-row style="margin-top: 8px;width: 100%;">
+                        <a-col :span="24">
+                            <div class="foo_card">
+                                <div class="title">
+                                    参与评分的比赛
+                                </div>
+
+                                <div class="table">
+                                    <div class="t_item t_head">
+                                        <div class="ranking">排名</div>
+                                        <div class="name">比赛名称</div>
+                                        <div class="total">比赛状态</div>
+                                        <div class="operate">操作</div>
+                                    </div>
+                                    <div class="t_item t_con" v-for="i in 6" :key="i">
+                                        <div class="ranking">
+                                            <div class="ol" :class="{ ac: i <= 3 }">{{ i }}</div>
+                                        </div>
+                                        <div class="name">国家电网竞赛</div>
+                                        <div class="total">已完赛</div>
+                                        <div class="operate">详情</div>
+                                    </div>
+                                </div>
+                            </div>
+                        </a-col>
+                    </a-row>
+                </a-row>
+
+
+            </a-col>
+            <a-col :md="24" :xl="12">
+                <!-- 带评分 -->
+                <div class="tape-score foo_card">
+                    <div class="title">
+                        参与评分的比赛
+                    </div>
+
+                    <div class="table">
+                        <div class="t_item t_con" v-for="i in 6" :key="i">
+                            <div class="name">金话筒主持人大赛</div>
+                            <div class="total">已完赛</div>
+                            <div class="operate">详情</div>
+                        </div>
+                    </div>
+                </div>
+            </a-col>
+        </a-row>
+    </div>
+</template>
+
+
+<script setup lang="ts">
+</script>
+
+<style lang="less" scoped>
+.expert {
+    padding-top: 16px;
+    padding-left: 16px;
+
+    .card {
+        width: 100%;
+        width: 100%;
+        height: 182px;
+        background: #FFFFFF;
+        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.02), 0px 1px 6px -1px rgba(0, 0, 0, 0.02), 0px 1px 2px 0px rgba(0, 0, 0, 0.03);
+        border-radius: 4px 4px 4px 4px;
+        padding: 20px 24px 0;
+
+        .top {
+            display: flex;
+            justify-content: space-between;
+
+            .text {
+                height: 22px;
+                font-family: Inter, Inter;
+                font-weight: 400;
+                font-size: 14px;
+                color: rgba(0, 0, 0, 0.45);
+                line-height: 22px;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+
+        .center {
+            margin-top: 4px;
+            width: 357px;
+            height: 78px;
+            border-radius: 0px 0px 0px 0px;
+            display: flex;
+            align-items: center;
+
+            .text {
+                height: 38px;
+                font-family: Inter, Inter;
+                font-weight: 400;
+                font-size: 48px;
+                color: rgba(51, 51, 51, 0.88);
+                line-height: 38px;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+
+        .bottom {
+            margin-top: 18px;
+            display: flex;
+            justify-content: space-between;
+
+            .bot_card {
+                width: 91px;
+                height: 22px;
+                font-family: Inter, Inter;
+                font-weight: 400;
+                font-size: 14px;
+                color: rgba(51, 51, 51, 0.88);
+                line-height: 22px;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+    }
+
+
+    .foo_card {
+        width: 100%;
+        height: 502px;
+        background: #FFFFFF;
+        box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
+        border-radius: 6px 6px 6px 6px;
+
+        .title {
+            padding-left: 23px;
+            height: 57px;
+            line-height: 57px;
+            font-size: 16px;
+            color: rgba(0, 0, 0, 0.85);
+            position: relative;
+
+            &::before {
+                content: '';
+                display: block;
+                position: absolute;
+                bottom: 0;
+                left: 0;
+                width: 100%;
+                height: 1px;
+                background-color: rgba(5, 5, 5, 0.06);
+            }
+        }
+
+        .table {
+            width: 100%;
+            padding-left: 32px;
+
+            .t_item {
+                width: 100%;
+                height: 54px;
+                border-bottom: 1px solid #E7E7E7;
+                display: flex;
+                align-items: center;
+
+                .ranking {
+                    width: calc((80 / 756) * 100%);
+                }
+
+                .name {
+                    width: calc((542 / 756) * 100%);
+                }
+
+                .total {
+                    width: calc((74 / 756) * 100%);
+                }
+
+                .operate {
+                    width: calc((60 / 756) * 100%);
+                }
+            }
+
+            .t_head {
+                font-size: 14px;
+                color: rgba(0, 0, 0, 0.4);
+            }
+
+            .t_con {
+                .ranking {
+                    .ol {
+                        width: 24px;
+                        height: 24px;
+                        background: #E7E7E7;
+                        color: rgba(0, 0, 0, 0.9);
+                        font-size: 14px;
+                        line-height: 24px;
+                        text-align: center;
+                        border-radius: 50%;
+
+                        &.ac {
+                            background: #0052D9;
+                            color: rgba(255, 255, 255, 0.9);
+                        }
+                    }
+                }
+
+                .name {
+                    font-size: 14px;
+                    color: rgba(0, 0, 0, 0.9);
+                }
+
+                .total {
+                    font-size: 14px;
+                    color: rgba(0, 0, 0, 0.9);
+                }
+
+                .operate {
+                    font-size: 14px;
+                    color: #0052D9;
+                    cursor: pointer;
+                }
+            }
+        }
+    }
+
+    .tape-score {
+        height: 708px;
+        .table {
+            .t_item {
+                width: 100%;
+                height: 54px;
+                border-bottom: 1px solid #E7E7E7;
+                display: flex;
+                align-items: center;
+
+                .name {
+                    width: calc((542 / 676) * 100%);
+                }
+
+                .total {
+                    width: calc((74 / 676) * 100%);
+                }
+
+                .operate {
+                    width: calc((60 / 676) * 100%);
+                }
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/chSchool/index.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/chSchool/index.vue
new file mode 100644
index 00000000..885ab868
--- /dev/null
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/chSchool/index.vue
@@ -0,0 +1,455 @@
+<template>
+    <div class="school">
+        <a-row :gutter="[16, 16]" type="flex" justify="space-between">
+            <a-col :lg="12" :xl="6" v-for="i in 4" :key="i">
+                <div class="card">
+                    <div class="top">
+                        <div class="text">
+                            本年度已开展比赛数
+                        </div>
+                        <Icon icon="mainHome-time|svg" :size="20" />
+                    </div>
+                    <div class="center">
+                        <div class="text">
+                            67
+                        </div>
+                    </div>
+                    <div class="bottom">
+                        <div class="bot_card">国赛：12</div>
+                        <div class="bot_card">省赛：12</div>
+                        <div class="bot_card">校赛：24</div>
+                    </div>
+                </div>
+            </a-col>
+        </a-row>
+        <a-row :gutter="[16, 16]" type="flex" justify="space-between">
+            <a-col :xs="24" :xl="8">
+                <div class="ec_radar-box">
+                    <div class="title-box">
+                        <div class="tit">年度维度分析</div>
+                        <div class="p">前沿探索</div>
+                        <div class="p">奠定基础</div>
+                    </div>
+                    <div class="ec_radar" ref="ec_radar"></div>
+                </div>
+            </a-col>
+            <a-col :xs="24" :xl="16">
+                <div class="con_right">
+                    <div class="title-box">
+                        <div class="tit">部门近两年维度积分</div>
+                        <div class="bas"></div>
+                    </div>
+                    <div class="ec-box">
+                        <!-- 柱状图 -->
+                        <div id="ec_bar" ref="ec_bar"></div>
+                        <div class="infor">
+                            <ul class="card-box">
+                                <li v-for="i in 12" :key="i">
+                                    <div class="ol">{{ i }}</div>
+                                    <div class="text">奠定基础</div>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </a-col>
+        </a-row>
+
+        <a-row :gutter="[16, 16]" type="flex">
+            <a-col :xs="24" :xl="12">
+                <div class="foo_card">
+                    <div class="title">
+                        部门比赛积分排名
+                    </div>
+
+                    <div class="table">
+                        <div class="t_item t_head">
+                            <div class="ranking">排名</div>
+                            <div class="name">比赛名称</div>
+                            <div class="total">比赛积分</div>
+                            <div class="operate">操作</div>
+                        </div>
+                        <div class="t_item t_con" v-for="i in 6" :key="i">
+                            <div class="ranking">
+                                <div class="ol" :class="{ ac: i <= 3 }">{{ i }}</div>
+                            </div>
+                            <div class="name">国家电网竞赛</div>
+                            <div class="total">7059</div>
+                            <div class="operate">详情</div>
+                        </div>
+                    </div>
+                </div>
+            </a-col>
+            <a-col :xs="24" :xl="12">
+                <div class="foo_card">
+                    <div class="title">
+                        部门学生积分排名
+                    </div>
+
+                    <div class="table">
+                        <div class="t_item t_head">
+                            <div class="ranking">排名</div>
+                            <div class="name">参赛选手名</div>
+                            <div class="total">比赛积分</div>
+                            <div class="operate">操作</div>
+                        </div>
+                        <div class="t_item t_con" v-for="i in 6" :key="i">
+                            <div class="ranking">
+                                <div class="ol" :class="{ ac: i <= 3 }">{{ i }}</div>
+                            </div>
+                            <div class="name">王晨</div>
+                            <div class="total">4221</div>
+                            <div class="operate">详情</div>
+                        </div>
+                    </div>
+                </div>
+            </a-col>
+        </a-row>
+    </div>
+</template>
+
+
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+import * as echarts from 'echarts';
+import { optionRadar, optionBar } from '../chDepartment/options'
+
+const ec_radar = ref()
+const ec_bar = ref()
+onMounted(() => {
+    const myChart = echarts.init(ec_radar.value);
+    myChart.setOption(optionRadar);
+    const bar = echarts.init(ec_bar.value);
+    bar.setOption(optionBar);
+    window.addEventListener('resize', function () {
+        myChart.resize()
+        bar.resize()
+    })
+})
+
+</script>
+
+<style lang="less" scoped>
+.school {
+    padding: 16px 16px 0;
+
+    .card {
+        width: 100%;
+        width: 100%;
+        height: 182px;
+        background: #FFFFFF;
+        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.02), 0px 1px 6px -1px rgba(0, 0, 0, 0.02), 0px 1px 2px 0px rgba(0, 0, 0, 0.03);
+        border-radius: 4px 4px 4px 4px;
+        padding: 20px 24px 0;
+
+        .top {
+            display: flex;
+            justify-content: space-between;
+
+            .text {
+                height: 22px;
+                font-family: Inter, Inter;
+                font-weight: 400;
+                font-size: 14px;
+                color: rgba(0, 0, 0, 0.45);
+                line-height: 22px;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+
+        .center {
+            margin-top: 4px;
+            width: 357px;
+            height: 78px;
+            border-radius: 0px 0px 0px 0px;
+            display: flex;
+            align-items: center;
+
+            .text {
+                height: 38px;
+                font-family: Inter, Inter;
+                font-weight: 400;
+                font-size: 48px;
+                color: rgba(51, 51, 51, 0.88);
+                line-height: 38px;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+
+        .bottom {
+            margin-top: 18px;
+            display: flex;
+            justify-content: space-between;
+
+            .bot_card {
+                width: 91px;
+                height: 22px;
+                font-family: Inter, Inter;
+                font-weight: 400;
+                font-size: 14px;
+                color: rgba(51, 51, 51, 0.88);
+                line-height: 22px;
+                text-align: left;
+                font-style: normal;
+                text-transform: none;
+            }
+        }
+    }
+
+    .ec_radar-box {
+        margin-top: 17px;
+        width: 100%;
+        height: 459px;
+        background: #FFFFFF;
+        border-radius: 2px 2px 2px 2px;
+        display: flex;
+        flex-direction: column;
+
+        .title-box {
+            height: 58px;
+            border-radius: 2px 2px 0px 0px;
+            border-bottom: 1px solid #F0F0F0;
+            display: flex;
+
+            .tit {
+                margin-left: 4%;
+                height: 58px;
+                line-height: 58px;
+                font-size: 16px;
+                color: rgba(0, 0, 0, 0.85);
+            }
+
+            .p {
+                margin-left: 7%;
+                font-size: 12px;
+                color: #333333;
+                height: 27px;
+                align-self: flex-end;
+            }
+        }
+
+        .ec_radar {
+            width: 100%;
+            flex-grow: 1;
+        }
+    }
+
+    .con_right {
+        margin-top: 17px;
+        // width: 1160px;
+        width: 100%;
+        height: 458px;
+        background: #FFFFFF;
+        box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
+        border-radius: 4px 4px 4px 4px;
+        // padding-left: 16px;
+        display: flex;
+        flex-direction: column;
+
+        .title-box {
+            height: 57px;
+            display: flex;
+            align-items: center;
+            position: relative;
+            padding-left: 16px;
+
+            .tit {
+                height: 26px;
+                font-size: 16px;
+                color: #1890FF;
+                text-shadow: 0px 0px 0px #1890FF;
+            }
+
+            .bas {
+                position: absolute;
+                bottom: 0;
+                left: 16px;
+                width: 100%;
+                height: 1px;
+                border: 1px solid rgba(5, 5, 5, 0.06);
+
+                &::before {
+                    content: '';
+                    display: block;
+                    position: absolute;
+                    bottom: 0;
+                    left: 0;
+                    width: 48px;
+                    height: 2px;
+                    background: #1890FF;
+                }
+            }
+        }
+
+        .ec-box {
+            display: flex;
+            justify-content: space-between;
+            flex-grow: 1;
+            column-gap: 22px;
+            padding-left: 39px;
+
+            #ec_bar {
+                flex-grow: 1;
+
+            }
+
+            .infor {
+                width: 241px;
+                display: flex;
+
+                .card-box {
+                    margin: auto;
+                    width: 100%;
+                    height: 177px;
+                    display: flex;
+                    flex-wrap: wrap;
+                    flex-direction: column;
+                    row-gap: 9px;
+
+                    li {
+                        width: 110px;
+                        height: 22px;
+                        font-size: 14px;
+                        color: rgba(51, 51, 51, 0.88);
+                        line-height: 22px;
+                        display: flex;
+                        justify-content: space-between;
+                        align-items: center;
+
+                        &:nth-child(1)>.ol,
+                        &:nth-child(2)>.ol,
+                        &:nth-child(3)>.ol {
+                            background-color: #314659;
+                            color: #fff;
+                        }
+
+                        .ol {
+                            width: 20px;
+                            height: 20px;
+                            border-radius: 50%;
+                            line-height: 20px;
+                            text-align: center;
+                            background: #F5F5F5;
+                            color: #000000;
+                            font-size: 12px;
+                        }
+
+                        .text {
+                            width: 67px;
+                            font-size: 14px;
+                            color: rgba(51, 51, 51, 0.88);
+                        }
+                    }
+                }
+
+            }
+        }
+
+    }
+
+    .foo_card {
+        margin-top: 20px;
+        width: 100%;
+        height: 502px;
+        background: #FFFFFF;
+        box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
+        border-radius: 6px 6px 6px 6px;
+
+        .title {
+            padding-left: 23px;
+            height: 57px;
+            line-height: 57px;
+            font-size: 16px;
+            color: rgba(0, 0, 0, 0.85);
+            position: relative;
+
+            &::before {
+                content: '';
+                display: block;
+                position: absolute;
+                bottom: 0;
+                left: 0;
+                width: 100%;
+                height: 1px;
+                background-color: rgba(5, 5, 5, 0.06);
+            }
+        }
+
+        .table {
+            width: 100%;
+            padding-left: 32px;
+
+            .t_item {
+                width: 100%;
+                height: 54px;
+                border-bottom: 1px solid #E7E7E7;
+                display: flex;
+                align-items: center;
+
+                .ranking {
+                    width: calc((80 / 756) * 100%);
+                }
+
+                .name {
+                    width: calc((542 / 756) * 100%);
+                }
+
+                .total {
+                    width: calc((74 / 756) * 100%);
+                }
+
+                .operate {
+                    width: calc((60 / 756) * 100%);
+                }
+            }
+
+            .t_head {
+                font-size: 14px;
+                color: rgba(0, 0, 0, 0.4);
+            }
+
+            .t_con {
+                .ranking {
+                    .ol {
+                        width: 24px;
+                        height: 24px;
+                        background: #E7E7E7;
+                        color: rgba(0, 0, 0, 0.9);
+                        font-size: 14px;
+                        line-height: 24px;
+                        text-align: center;
+                        border-radius: 50%;
+
+                        &.ac {
+                            background: #0052D9;
+                            color: rgba(255, 255, 255, 0.9);
+                        }
+                    }
+                }
+
+                .name {
+                    font-size: 14px;
+                    color: rgba(0, 0, 0, 0.9);
+                }
+
+                .total {
+                    font-size: 14px;
+                    color: rgba(0, 0, 0, 0.9);
+                }
+
+                .operate {
+                    font-size: 14px;
+                    color: #0052D9;
+                    cursor: pointer;
+                }
+            }
+        }
+    }
+
+
+}
+</style>
\ No newline at end of file
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/index.ts b/jeecgboot-vue3-master/src/views/depart/workbench/components/index.ts
index d403267c..a53775c4 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/index.ts
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/index.ts
@@ -1 +1,3 @@
-export {default as ChDepartment } from './chDepartment/index.vue'
\ No newline at end of file
+export {default as ChDepartment } from './chDepartment/index.vue'
+export {default as ChExpert } from './chExpert/index.vue'
+export {default as ChSchool } from './chSchool/index.vue'
\ No newline at end of file
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/index.vue b/jeecgboot-vue3-master/src/views/depart/workbench/index.vue
index 3324e395..a89ce813 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/index.vue
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/index.vue
@@ -4,9 +4,9 @@
     </div>
 </template>
 <script lang="ts" setup>
-import { ChDepartment } from './components/index'
+import { ChSchool } from './components/index'
 function com(){
-    return ChDepartment
+    return ChSchool
 }
 </script>