From 6ae784d2e9f54a4eb75775817a64127c7699e960 Mon Sep 17 00:00:00 2001
From: JayChou <2064936853@qq.com>
Date: Thu, 18 Jul 2024 15:43:02 +0800
Subject: [PATCH] =?UTF-8?q?'=E5=AF=B9=E6=8E=A5=E7=BB=84=E5=A7=94=E4=BC=9A?=
 =?UTF-8?q?=E9=A6=96=E9=A1=B5'?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/components/cardList.vue        |  18 +-
 .../components/components/cardListThree.vue   |   5 +-
 .../components/components/cardListtow.vue     |   6 +-
 .../organizingCommittee.vue                   | 443 ++++++++++--------
 4 files changed, 271 insertions(+), 201 deletions(-)

diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardList.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardList.vue
index 1408786d..aef3a848 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardList.vue
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardList.vue
@@ -9,19 +9,21 @@
         <div class="total">报名人数</div>
         <div class="operate">操作</div>
       </div>
-      <div class="t_item t_con" v-for="(i,index) in props.data" :key="i">
+      <div class="t_item t_con" v-for="(i,index) in props.data" :key="index">
         <div class="ranking">
-          <div class="ol" :class="{ ac: index <= 3 }">{{ index +1 }}</div>
+          <div class="ol" :class="{ ac: index <= 3 }">{{ i.pm}}</div>
         </div>
-        <div class="name">{{ i.name }}</div>
-        <div class="total">{{ i.sum }}</div>
-        <div class="operate">详情</div>
+        <div class="name">{{ i.csyxname }}</div>
+        <div class="total">{{ i.bms }}</div>
+        <div class="operate" @click="goToInfo(i.csyxid)">详情</div>
       </div>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
+  import {useRouter} from 'vue-router'
+  const router = useRouter()
   const props = defineProps({
     data: {
       type: Array,
@@ -59,6 +61,12 @@
       ],
     },
   });
+  const goToInfo = (id:any) => {
+    router.push({
+      path:'/annualcompetitionprojectregistration/administration/audited/AnnualCompetitionProjectRegistrationList',
+      query:{id}
+    })
+  }
 </script>
 
 <style lang="less" scoped>
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListThree.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListThree.vue
index b3008502..28e01a0a 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListThree.vue
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListThree.vue
@@ -17,7 +17,8 @@
         <div class="name">{{ i.name }}</div>
         <div class="total">{{ i.sum }}</div>
         <div class="total">{{ i.sum }}</div>
-        <div class="operate">胡辣汤学院</div>
+        <div class="operate">
+          河南机电职业学院</div>
       </div>
     </div>
   </div>
@@ -117,7 +118,7 @@
         }
 
         .operate {
-          width: 80px;
+          width: 140px;
         }
       }
 
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListtow.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListtow.vue
index 748edb56..d129cf65 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListtow.vue
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/components/cardListtow.vue
@@ -14,8 +14,8 @@
           <div class="ol" :class="{ ac: index <= 3 }">{{ index +1 }}</div>
         </div> -->
         <div class="name">{{ i.name }}</div>
-        <div class="total">{{ i.sum }}</div>
-        <div class="operate">胡辣汤学院</div>
+        <div class="total">{{ i.xh }}</div>
+        <div class="operate">{{ i.szyx }}</div>
       </div>
     </div>
   </div>
@@ -115,7 +115,7 @@
         }
 
         .operate {
-          width: 80px;
+          width: 140px;
         }
       }
 
diff --git a/jeecgboot-vue3-master/src/views/depart/workbench/components/organizingCommittee/organizingCommittee.vue b/jeecgboot-vue3-master/src/views/depart/workbench/components/organizingCommittee/organizingCommittee.vue
index ad6b0b54..ea5eba71 100644
--- a/jeecgboot-vue3-master/src/views/depart/workbench/components/organizingCommittee/organizingCommittee.vue
+++ b/jeecgboot-vue3-master/src/views/depart/workbench/components/organizingCommittee/organizingCommittee.vue
@@ -8,8 +8,8 @@
             <div class="left">比赛届数</div>
             <div class="right"><SvgIcon size="20" name="shizhong" /></div>
           </div>
-          <div class="name">第三十届电子科技大赛</div>
-          <div class="total">共12届，当前第12届</div>
+          <div class="name">{{ data.annualCompName }}</div>
+          <div class="total">共{{data.sum}}届，当前第{{data.sum}}届</div>
         </div>
       </div>
     </a-col>
@@ -17,25 +17,29 @@
       ><div class="item">
         <div class="card2">
           <div class="title">
-            <div class="left">参加比赛队伍数</div>
+            <div class="left">比赛报名数</div>
             <div class="right"><SvgIcon size="20" name="content" /></div>
           </div>
-          <div id="chart-content"></div>
-          <div class="total">本月比赛：0</div>
+          <div class="content">{{ data.bmNumber }}</div>
+          <!-- <div id="chart-content"></div> -->
+          <div class="total">
+            <ul>
+              <li>一等:{{ data.ydjNumber }}</li>
+              <li>二等:{{ data.edjNumber }}</li>
+              <li>三等:{{ data.sdjNumber }}</li>
+              <li>四等:{{ data.sidjNumber }}</li>
+              <li>五等:{{ data.wdjNumber }}</li>
+            </ul>
+          </div>
         </div> </div
     ></a-col>
     <a-col :lg="12" :xxl="6"><div class="item">
       <div class="card3">
           <div class="title">
-            <div class="left">参赛人数</div>
+            <div class="left"><span>参赛人数</span><span>个人赛人数</span><span>团队赛人数</span></div>
             <div class="right"><SvgIcon size="20" name="content" /></div>
           </div>
-          <div class="name">1314</div>
-          <div class="total">
-            <div class="one">一等：11</div>
-            <div class="two">二等：1</div>
-            <div class="three">三等：1</div>
-          </div>
+          <div class="name"><span>20</span><span>10</span><span>10</span></div>
         </div>
     </div></a-col>
     <a-col :lg="12" :xxl="6"><div class="item">
@@ -44,8 +48,15 @@
             <div class="left">比赛项目数</div>
             <div class="right"><SvgIcon size="20" name="content" /></div>
           </div>
-          <div class="name">12</div>
-          <div class="total">报名最多的项目是：项目三 地三十届电子科技大赛</div>
+          <div class="name">{{data.bsxmSum}}</div>
+          <div class="card-list">
+            <ul>
+              <li v-for="(item,index) in data.qwtxmList" :key="index">
+             {{ item.xmname }} 报名数: {{ item.xmbmrs }}
+              </li>
+            
+            </ul>
+          </div>
         </div>
     </div></a-col>
   </a-row>
@@ -54,14 +65,17 @@
     <a-col :xxl="12" :xl="12" :lg="24" :md="24" :sm="24"
       ><div class="Participation">
         <a-card title="参赛院系人数排名" style="width: 100%; height: 100%">
-          <cardList />
-        </a-card> </div
+          <cardList :data="data.csyxbmpm"/>
+        </a-card>
+        <div class="setting-btn" @click="getAll">更多</div>
+        </div
     ></a-col>
     <a-col :xxl="12" :xl="12" :lg="24" :md="24" :sm="24"
       ><div class="Participation">
         <a-card title="报名学生列表" style="width: 100%; height: 100%">
-          <cardListTow />
-        </a-card> </div
+          <cardListTow :data="data.bmxsxxList"/>
+        <div class="setting-btn" @click="getAll">更多</div>
+      </a-card> </div
     ></a-col>
   </a-row>
   <a-row :gutter="[24, 32]" style="margin-top: 30px">
@@ -94,12 +108,14 @@
 
 <script lang="ts" setup>
   import { SvgIcon } from '/@/components/Icon';
-  import { onMounted } from 'vue';
+  import { onMounted ,ref} from 'vue';
   import cardList from '../components/cardList.vue';
   import cardListTow from '../components/cardListtow.vue';
   import cardListThree from '../components/cardListThree.vue';
   import echarts from '/@/utils/lib/echarts';
   import { getOrganizingCommittee }from '/@/api/common/api'
+  import {useRouter} from 'vue-router'
+  const router = useRouter()
   const throttle = (fn: any) => {
     let timer: any;
     return function () {
@@ -113,183 +129,188 @@
       }, 1000);
     };
   };
+  const data = ref<any>({})
   const getOrganizingCommitteeEvent = async () => {
     const res = await getOrganizingCommittee()
+    data.value = res
     console.log(res);
     
   }
   getOrganizingCommitteeEvent()
-  const initContent = () => {
-    const myChart = echarts.init(document.getElementById('chart-content'));
-    const option = {
-      backgroundColor: 'transparent',
-      title: [
-        {
-          text: '111',
-        },
-      ],
-      tooltip: {
-        trigger: 'axis',
-        axisPointer: {
-          lineStyle: {
-            color: '#57617B',
-          },
-        },
-      },
-      grid: {
-        left: '20px',
-        right: '0',
-        bottom: '0',
-        top: '20px',
-        containLabel: false,
-      },
-      xAxis: [
-        {
-          type: 'category',
-          show: false,
-          axisLine: {
-            lineStyle: {
-              color: '#44607C',
-            },
-          },
-          axisLabel: {
-            show: false,
-            margin: 10,
-            textStyle: {
-              fontSize: 14,
-              color: '#D5CBE8',
-              fontWeight: 700,
-            },
-          },
-          axisTick: {
-            show: false,
-          },
-          data: ['一月','二月','三月','四月','五月'],
-        },
-      ],
-      yAxis: [
-        {
-          type: 'value',
-          name: '单位（%）',
-          axisTick: {
-            show: false,
-          },
-          axisLine: {
-            lineStyle: {
-              color: 'none',
-            },
-          },
-          axisLabel: {
-            margin: 10,
-            show: false,
-            textStyle: {
-              fontSize: 14,
-              color: '#3681B5',
-              fontWeight: 700,
-            },
-          },
-          splitLine: {
-            show: false,
-            lineStyle: {
-              color: '#57617B',
-            },
-          },
-        },
-      ],
-      series: [
-        {
-          name: '比赛队伍',
-          type: 'line',
-          smooth: true,
-          stack: '总量',
-          symbol: 'circle',
-          symbolSize: 5,
-          showSymbol: false,
-          animationDelay: 2000,
-          animationDuration: 1000,
-          // markPoint: {
-          //   symbol:
-          //     'path://M783.136 180.064C771.872 168.832 757.152 160 742.4 160L281.6 160C266.848 160 252.128 168.832 240.864 180.064 229.632 191.328 224 209.248 224 224l0 460.8c0 14.752 5.632 26.272 16.864 37.536C252.128 733.568 266.848 736 281.6 736l115.2 0 115.2 115.2 115.2-115.2 115.2 0c14.752 0 29.472-2.432 40.736-13.664C794.368 711.072 800 699.552 800 684.8L800 224C800 209.248 794.368 191.328 783.136 180.064z',
-          //   symbolOffset: [0, '-100%'],
-          //   symbolSize: 35, //这里可以改变大小
-          //   data: [
-          //     {
-          //       type: 'max',
-          //       name: '最大值',
-          //     },
-          //   ],
-          //   label: {
-          //     offset: [0, -3],
-          //   },
-          //   animationDelay: 3000,
-          //   animationDuration: 1000,
-          // },
-          lineStyle: {
-            normal: {
-              width: 3,
-              color: {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 1,
-                y2: 0,
-                colorStops: [
-                  {
-                    offset: 0,
-                    color: '#5eb2ff', // 0% 处的颜色
-                  },
-                  {
-                    offset: 1,
-                    color: '#5eb2ff', // 100% 处的颜色
-                  },
-                ],
-                globalCoord: false, // 缺省为 false
-              },
-              opacity: 0.9,
-            },
-          },
-          areaStyle: {
-            normal: {
-              color: new echarts.graphic.LinearGradient(
-                0,
-                0,
-                0,
-                1,
-                [
-                  {
-                    offset: 0,
-                    color: '#5eb2ff',
-                  },
-                  {
-                    offset: 0.8,
-                    color: '#5eb2ff',
-                  },
-                ],
-                false
-              ),
-              shadowColor: '#5eb2ff',
-              shadowBlur: 10,
-            },
-          },
-          // itemStyle: {
-          //   normal: {
-          //     color: '#3A5493',
-          //     borderColor: '',
-          //     borderWidth: 12,
-          //   },
-          // },
-          data: [23,12,45,9,30],
-        },
-      ],
-    };
-    myChart.setOption(option);
-    let resize = throttle(() => {
-      myChart.resize();
-    });
-    window.addEventListener('resize', resize);
-  };
+  const getAll = () => {
+    router.push('/annualcompetitionprojectregistration/administration/audited/AnnualCompetitionProjectRegistrationList')
+  }
+  // const initContent = () => {
+  //   const myChart = echarts.init(document.getElementById('chart-content'));
+  //   const option = {
+  //     backgroundColor: 'transparent',
+  //     title: [
+  //       {
+  //         text: '111',
+  //       },
+  //     ],
+  //     tooltip: {
+  //       trigger: 'axis',
+  //       axisPointer: {
+  //         lineStyle: {
+  //           color: '#57617B',
+  //         },
+  //       },
+  //     },
+  //     grid: {
+  //       left: '20px',
+  //       right: '0',
+  //       bottom: '0',
+  //       top: '20px',
+  //       containLabel: false,
+  //     },
+  //     xAxis: [
+  //       {
+  //         type: 'category',
+  //         show: false,
+  //         axisLine: {
+  //           lineStyle: {
+  //             color: '#44607C',
+  //           },
+  //         },
+  //         axisLabel: {
+  //           show: false,
+  //           margin: 10,
+  //           textStyle: {
+  //             fontSize: 14,
+  //             color: '#D5CBE8',
+  //             fontWeight: 700,
+  //           },
+  //         },
+  //         axisTick: {
+  //           show: false,
+  //         },
+  //         data: ['一月','二月','三月','四月','五月'],
+  //       },
+  //     ],
+  //     yAxis: [
+  //       {
+  //         type: 'value',
+  //         name: '单位（%）',
+  //         axisTick: {
+  //           show: false,
+  //         },
+  //         axisLine: {
+  //           lineStyle: {
+  //             color: 'none',
+  //           },
+  //         },
+  //         axisLabel: {
+  //           margin: 10,
+  //           show: false,
+  //           textStyle: {
+  //             fontSize: 14,
+  //             color: '#3681B5',
+  //             fontWeight: 700,
+  //           },
+  //         },
+  //         splitLine: {
+  //           show: false,
+  //           lineStyle: {
+  //             color: '#57617B',
+  //           },
+  //         },
+  //       },
+  //     ],
+  //     series: [
+  //       {
+  //         name: '比赛队伍',
+  //         type: 'line',
+  //         smooth: true,
+  //         stack: '总量',
+  //         symbol: 'circle',
+  //         symbolSize: 5,
+  //         showSymbol: false,
+  //         animationDelay: 2000,
+  //         animationDuration: 1000,
+  //         // markPoint: {
+  //         //   symbol:
+  //         //     'path://M783.136 180.064C771.872 168.832 757.152 160 742.4 160L281.6 160C266.848 160 252.128 168.832 240.864 180.064 229.632 191.328 224 209.248 224 224l0 460.8c0 14.752 5.632 26.272 16.864 37.536C252.128 733.568 266.848 736 281.6 736l115.2 0 115.2 115.2 115.2-115.2 115.2 0c14.752 0 29.472-2.432 40.736-13.664C794.368 711.072 800 699.552 800 684.8L800 224C800 209.248 794.368 191.328 783.136 180.064z',
+  //         //   symbolOffset: [0, '-100%'],
+  //         //   symbolSize: 35, //这里可以改变大小
+  //         //   data: [
+  //         //     {
+  //         //       type: 'max',
+  //         //       name: '最大值',
+  //         //     },
+  //         //   ],
+  //         //   label: {
+  //         //     offset: [0, -3],
+  //         //   },
+  //         //   animationDelay: 3000,
+  //         //   animationDuration: 1000,
+  //         // },
+  //         lineStyle: {
+  //           normal: {
+  //             width: 3,
+  //             color: {
+  //               type: 'linear',
+  //               x: 0,
+  //               y: 0,
+  //               x2: 1,
+  //               y2: 0,
+  //               colorStops: [
+  //                 {
+  //                   offset: 0,
+  //                   color: '#5eb2ff', // 0% 处的颜色
+  //                 },
+  //                 {
+  //                   offset: 1,
+  //                   color: '#5eb2ff', // 100% 处的颜色
+  //                 },
+  //               ],
+  //               globalCoord: false, // 缺省为 false
+  //             },
+  //             opacity: 0.9,
+  //           },
+  //         },
+  //         areaStyle: {
+  //           normal: {
+  //             color: new echarts.graphic.LinearGradient(
+  //               0,
+  //               0,
+  //               0,
+  //               1,
+  //               [
+  //                 {
+  //                   offset: 0,
+  //                   color: '#5eb2ff',
+  //                 },
+  //                 {
+  //                   offset: 0.8,
+  //                   color: '#5eb2ff',
+  //                 },
+  //               ],
+  //               false
+  //             ),
+  //             shadowColor: '#5eb2ff',
+  //             shadowBlur: 10,
+  //           },
+  //         },
+  //         // itemStyle: {
+  //         //   normal: {
+  //         //     color: '#3A5493',
+  //         //     borderColor: '',
+  //         //     borderWidth: 12,
+  //         //   },
+  //         // },
+  //         data: [23,12,45,9,30],
+  //       },
+  //     ],
+  //   };
+  //   myChart.setOption(option);
+  //   let resize = throttle(() => {
+  //     myChart.resize();
+  //   });
+  //   window.addEventListener('resize', resize);
+  // };
   onMounted(() => {
-    initContent();
+    // initContent();
     const myChart = echarts.init(document.getElementById('chart'));
     const option = {
       tooltip: {},
@@ -376,10 +397,19 @@
         width: 100%;
         height: 80px;
       }
+      .content{
+        font-size: 42px;
+        font-weight: 600;
+      }
       .total{
-        margin-top: 10px;
+        margin-top: 30px;
         font-size: 12px;
         color: #000;
+        ul{
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+        }
       }
     }
     .card3 {
@@ -392,9 +422,12 @@
         width: 100%;
         justify-content: space-between;
         .left {
+          flex: 1;
           font-size: 14px;
           color: #fff;
           color: rgba(0, 0, 0, 0.45);
+          display: flex;
+          justify-content: space-between;
         }
       }
 
@@ -402,7 +435,10 @@
         font-size: 42px;
         font-weight: 500;
         color: #000;
-        margin-top: 10px;
+        margin-top: 30px;
+        display: flex;
+        justify-content: space-between;
+        padding-right: 20px;
       }
       .total{
         margin-top: 20px;
@@ -414,6 +450,7 @@
       }
     }
     .card4 {
+      position: relative;
       width: 100%;
       height: 100%;
       background-color: #fff;
@@ -441,12 +478,36 @@
         color: #000;
 
       }
+      .card-list{
+        position: absolute;
+        width: 200px;
+        right: 55px;
+        top: 20px;
+        height: calc(100% - 40px);
+        ul{
+          height: 100%;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: space-between;
+          li{
+            margin: 5px 0;
+          }
+        }
+      }
     }
   }
   .Participation {
+    position: relative;
     width: 100%;
     height: 502px;
     background-color: #fff;
+    .setting-btn{
+      position: absolute;
+      right: 20px;
+      top: 20px;
+      color: #018ffb;
+      cursor: pointer;
+    }
   }
   .content-card {
     width: 100%;