修改数据看板

src/views/kanBan/components/dataBoardNew/AIApp/chartList/appPub.vue

@@ -37,17 +37,16 @@ export default {
     window.removeEventListener('resize', this.handleResize);
     this.chart && this.chart.dispose();
   },
-  mounted() {
-    // this.initChart();
-    window.addEventListener('resize', this.handleResize);
-  },
   methods: {
     handleResize() {
       this.chart && this.chart.resize();
     },
     initChart() {
-      this.chart = echarts.init(this.$refs.chartDom);
-      this.updateChart();
+      this.$nextTick(() => {
+        this.chart = echarts.init(this.$refs.chartDom);
+        this.updateChart();
+      })
+     
     },
     updateChart() {
      this.allNum = this.chartData.reduce((sum, val) => sum + val.form_count, 0);
@@ -70,6 +69,11 @@ export default {
             label: {
               show: false,
             },
+            itemStyle: {
+              borderRadius: 8,
+              borderColor: '#fff',
+              borderWidth: 2
+            },
             labelLine: {
               show: false
             },

src/views/kanBan/components/dataBoardNew/AIApp/chartList/appUse.vue

@@ -1,6 +1,9 @@
 
 <template>
-  <div ref="chartDom" style="width:100%;height:100%"></div>
+    <div class="chartsT">
+      应用使用分类
+      <div ref="chartDom" style="width:100%;height:100%"></div>
+  </div>
 </template>
 
 <script>
@@ -67,6 +70,11 @@ export default {
             label: {
               show: false,
             },
+            itemStyle: {
+              borderRadius: 8,
+              borderColor: '#fff',
+              borderWidth: 2
+            },
             labelLine: {
               show: false
             },
@@ -100,3 +108,9 @@ export default {
   }
 }
 </script>
+<style>
+.chartsT{
+  width: 100%;
+  height: 100%;
+}
+</style>

src/views/kanBan/components/dataBoardNew/AIApp/index.vue

@@ -3,33 +3,34 @@
     <barList :dataExponentList="dataExponentList"></barList>
     <!-- 第一行 -->
     <div class="AIAppOne">
-      <div class="AIAppOneCon">
-        热门应用Top5
-        <div class="hotCon">
-          <div v-for="(i,index) in alldata[0]" :key="index" class="hotConA">
-            <div class="hotConAA">
-              <span>{{ index + 1 }}</span>
-              <div class="hotConAATxt">{{ i.name }}</div>
+      <div style="display: flex;flex-direction: column;gap: 10px;max-width: 360px;min-width: 314px;">
+        <div class="AIAppOneCon" style="flex: 1;">
+          热门应用Top5
+          <div class="hotCon">
+            <div v-for="(i,index) in alldata[0]" :key="index" class="hotConA">
+              <div class="hotConAA">
+                <span>{{ index + 1 }}</span>
+                <div class="hotConAATxt">{{ i.name }}</div>
+              </div>
+              <div style="color: #3072D8;width: 80px;text-align: right">{{ i.form_count }}次</div>
             </div>
-            <div style="color: #3072D8;width: 80px;text-align: right">{{ i.form_count }}次</div>
           </div>
         </div>
-      </div>
-      <div class="AIAppOneCon">
-        创作者Top5
-        <div class="hotCon">
-          <div v-for="(i,index) in alldata[1]" :key="index" class="hotConA">
-            <div class="hotConAA">
-              <span>{{ index + 1 }}</span>
-              <div class="hotConAATxt">{{ i.username }}</div>
+        <div class="AIAppOneCon" style="flex: 1;">
+          创作者Top5
+          <div class="hotCon">
+            <div v-for="(i,index) in alldata[1]" :key="index" class="hotConA">
+              <div class="hotConAA">
+                <span>{{ index + 1 }}</span>
+                <div class="hotConAATxt">{{ i.username }}</div>
+              </div>
+              <div style="color: #3072D8;width: 80px;text-align: right;">{{ i.form_count }}个</div>
             </div>
-            <div style="color: #3072D8;width: 80px;text-align: right;">{{ i.form_count }}个</div>
           </div>
         </div>
       </div>
-      <div class="AIAppOneCon">
-        应用使用分类
-        <appUse :chartData="alldata[2]"></appUse>
+      <div class="AIAppOneCon" style="flex: 1;">
+        <ParetoChart :chartData="alldata[4]"></ParetoChart>
       </div>
     </div>
 
@@ -38,20 +39,9 @@
         <appPub :chartData="alldata[3]"></appPub>
       </div>
       <div>
-        <ParetoChart :chartData="alldata[4]"></ParetoChart>
+        <appUse :chartData="alldata[2]"></appUse>
       </div>
     </div>
-
-    <!-- <div class="AIAppTwo">
-      <div>
-        应用创建分析
-        <appCreate ></appCreate>
-      </div>
-      <div>
-        应用索引网络
-        <appKey></appKey> 
-      </div>
-    </div> -->
   </div>
 </template>
 
@@ -157,9 +147,10 @@ export default {
 }
 .AIAppOne{
   width: 100%;
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);  /* 3列网格 */
-  height: 400px;
+  /* display: grid;
+  grid-template-columns: repeat(2, 1fr);  3列网格 */
+  height: 598px;
+  display: flex;
   gap: 20px;  /* 间距 */
 }
 .AIAppTwo{
@@ -194,13 +185,13 @@ export default {
   box-sizing: border-box;
   border-radius: 10px;
   margin-top: 10px;
-  gap: 5px;
+  gap: 10px;
 }
 .hotConA{
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 8px 0;
+  padding: 0 0 8px;
   box-sizing: border-box;
   border-bottom:1px #e7e7e7 solid;
 }

src/views/kanBan/components/dataBoardNew/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="body" :style="{padding : useridL ? '20px' : ''}" >
     <div class="barList">
-        <div @click="cutPage(index)" :class="[pageEnd == index ? 'Selected' : '']" v-for="(i, index) in barList"
+        <div style="cursor: pointer;" @click="cutPage(index)" :class="[pageEnd == index ? 'Selected' : '']" v-for="(i, index) in barList"
             :key="index">
             {{ i.name }}
         </div>

src/views/kanBan/components/dataBoardNew/teaMange/chartList/solid.vue

@@ -36,17 +36,17 @@ export default {
     startCom(val) {
       let data = JSON.parse(JSON.stringify(val));
 
-      console.log("this.alltest", this.alltest[0].value);
-      console.log("data.noLook", data.noLook);
+      // console.log("this.alltest", this.alltest[0].value);
+      // console.log("data.noLook", data.noLook);
 
       this.chartData[0].value =
-        (data.noLook / this.alltest[0].value).toFixed(2) * 100;
+        ((data.noLook / this.alltest[0].value)* 100).toFixed(2) ;
       this.chartData[1].value =
-        (data.is / this.alltest[0].value).toFixed(2) * 100 ;
+        ((data.is / this.alltest[0].value)* 100).toFixed(2);
       this.chartData[2].value =
-        (this.alltest[2].value / this.alltest[0].value).toFixed(2) * 100;
+        ((this.alltest[2].value / this.alltest[0].value)* 100).toFixed(2);
 
-      console.log("this.chartData", this.chartData);
+      // console.log("this.chartData", this.chartData);
 
       this.initChart();
     },

src/views/kanBan/components/dataBoardNew/teaMange/index.vue

@@ -8,7 +8,7 @@
                 <pie2 :alldata="dataJ" :alltest="dataExponentList[0]"/>
             </div>
         </div>
-        <div class="DataDiv">
+        <div class="DataDiv" v-if="mergedList.includes(org)">
             获奖表单人数汇总
             <div class="imgArea" style="display: flex;height: 100%;">
                 <barChart :alldata="chartsData"/>
@@ -46,7 +46,18 @@ export default {
             dataExponentList:[],
             dataJ:{},
             isLoadingData:false,
-            chartsData:[]
+            chartsData:[],
+            // 荔园集团下的学校 
+            mergedList: [
+                    "3823a6a5-1b6e-11f0-a66a-005056924926",
+                    "292e34dc-1b6e-11f0-a66a-005056924926",
+                    "21d6b367-1b6e-11f0-a66a-005056924926",
+                    "1a1a172d-1b6e-11f0-a66a-005056924926",
+                    "1197f86b-1b6e-11f0-a66a-005056924926",
+                    "f235659b-1b6d-11f0-a66a-005056924926",
+                    "d87b62d3-1b6d-11f0-a66a-005056924926",
+                    "c25ea59b-1b6d-11f0-a66a-005056924926",
+            ]
         }
     },
     // watch:{

src/views/kanBan/components/dataBoardNew/teaing/chartList/BubbleChart.vue

@@ -2,7 +2,7 @@
 <template>
   <div style="display: flex;flex-direction: column;height: 100%;">
     课堂分布
-    <div ref="chart" style="width: 100%; flex: 1;"></div>
+    <div ref="chart" style="width: 100%; flex: 1;height: 100%;"></div>
   </div>
 </template>
 
@@ -82,6 +82,9 @@ export default {
             return `${params.data[3]}<br/>年级: ${params.data[4]}<br/>课程数量: ${params.data[2]}`;
           }
         },
+        grid: {
+          left: 80
+        },
         legend: { 
           data: [...new Set(this.chartData.map(item => item[0]))],
           right: 10,

src/views/kanBan/components/dataBoardNew/teaing/chartList/aidedDesign.vue

@@ -41,7 +41,7 @@ export default {
       let data = JSON.parse(JSON.stringify(val));
       // console.log('subject',this.subject);
       
-      // console.log('data',data);
+      // console.log('aidedDesigndata',data);
 
       this.innerData[0].value = data.filter(e=> e.state == 5 || e.state == 6).length
       this.innerData[1].value = data.filter(e=> e.state != 5 && e.state != 6).length
@@ -61,10 +61,16 @@ export default {
           value: count // 添加计算的数量
         };
       });
+      this.outerData = this.outerData.filter(e=> e.value)
+      this.pio()
+    },
+    pio(){
+      this.$nextTick(() => {
+        this.chart = echarts.init(this.$refs.chart);
         this.initChart();
+      })
     },
     initChart() {
-      this.chart = echarts.init(this.$refs.chart);
       const options = {
         tooltip: {
           trigger: 'item'
@@ -76,17 +82,17 @@ export default {
         //   // bottom: '3%',
         //   containLabel: true
         // },
-        // legend: {
-        //   bottom:'0%',
-        //   left:'5%',
-        //   right:'5%'
-        // },
+        legend: {
+          bottom:'0%',
+          left:'5%',
+          right:'5%'
+        },
         series: [
           {
             name: '模式分类',
             type: 'pie',
-            center: ['50%', '50%'], // 调整饼图的中心位置
-            radius: ['0%', '40%'],
+            center: ['50%', '40%'], // 调整饼图的中心位置
+            radius: ['0%', '30%'],
             label: {
               show: false,
               position: 'center'
@@ -101,8 +107,8 @@ export default {
           {
             name: '学科分类',
             type: 'pie',
-            center: ['50%', '50%'], // 调整饼图的中心位置
-            radius: ['50%', '80%'],
+            center: ['50%', '40%'], // 调整饼图的中心位置
+            radius: ['40%', '65%'],
             label: {
               show: false
             },

src/views/kanBan/components/dataBoardNew/teaing/chartList/appUseAss.vue

@@ -1,5 +1,9 @@
 <template>
-  <div ref="chartContainer" style="width: 100%; height: 100%;"></div>
+  <div style="height: 100%;width: 100%;">
+    <div v-if="chartData.length" ref="chartContainer" style="width: 100%; height: 100%;"></div>
+    <div v-else style="display: flex;justify-content: center;
+    align-items: center;height: 100%;width: 100%;">暂无数据</div>
+  </div>
 </template>
 
 <script>
@@ -8,30 +12,7 @@ import * as echarts from "echarts";
 export default {
   //   name: 'SubjectScatterChart',
   props: ["alldata", "subject"],
-  // props: {
-  //   // 数据格式：[{ subject: '语文', value: [x, y] }, ...]
-  //   chartData: {
-  //     type: Array,
-  //     default: () => [
-  //       { subject: '语文', value: [10.0, 8.04] },
-  //       { subject: '数学', value: [8.07, 6.95] },
-  //       { subject: '英语', value: [13.0, 7.58] },
-  //     ]
-  //   },
-  //   // 学科颜色配置
-  //   colors: {
-  //     type: Object,
-  //     default: () => ({
-  //       语文: '#5470C6',
-  //       数学: '#91CC75',
-  //       英语: '#EE6666'
-  //     })
-  //   },
-  //   symbolSize: {
-  //     type: Number,
-  //     default: 16
-  //   }
-  // },
+
   data() {
     return {
       chart: null,
@@ -59,7 +40,8 @@ export default {
   },
   methods: {
     startCom(val) {
-      let data = JSON.parse(JSON.stringify(val));
+      let data = JSON.parse(JSON.stringify(val)).filter(e=> e.typeids);
+      
       let subject = JSON.parse(JSON.stringify(this.subject));
 
       data.forEach(e => {
@@ -76,9 +58,8 @@ export default {
           })
           .filter(num => num === 72).length;
       });
+      // console.log('data',data);
 
-      // console.log("val", data);
-      // console.log("subject", subject);
 
       subject.forEach(e => {
         let course = [];
@@ -100,14 +81,17 @@ export default {
         subject: e.name,
         value: [e.aitoolsum, e.worksum]
       }));
+      this.chartData = this.chartData.filter(e=> e.value[0])
       // console.log("this.chartData", this.chartData);
 
       this.initChart();
     },
 
     initChart() {
-      this.chart = echarts.init(this.$refs.chartContainer);
-      this.updateChart();
+      this.$nextTick(() => {
+        this.chart = echarts.init(this.$refs.chartContainer);
+        this.updateChart();
+      })
     },
     generateSeries() {
       // 按学科分组数据
@@ -130,8 +114,8 @@ export default {
           trigger: "item",
           formatter: params => {
             return `${params.seriesName}<br/>
-                    X: ${params.value[0].toFixed(2)}<br/>
-                    Y: ${params.value[1].toFixed(2)}`;
+                    单节课AI迁入数量: ${params.value[0]}<br/>
+                    学生交互量: ${params.value[1]}`;
           }
         },
         legend: {
@@ -142,8 +126,8 @@ export default {
           padding: [10, 10] // 内边距
         },
         grid: {
-          top: '23%',      // 上边距，给图表留出空间
-          left: 70
+          top: '15%',      // 上边距，给图表留出空间
+          left: 50
         },
         xAxis: {
           name: "单节课程AI迁入数量",

src/views/kanBan/components/dataBoardNew/teaing/index.vue

@@ -2,36 +2,39 @@
   <div class="body1" v-loading="isLoading">
     <barList :dataExponentList="dataExponentList"></barList>
     <div class="AIAppOne">
-      <div>
+      <div style="background-color: #fff;">
         <BubbleChart :grades="alldata[1]" :subjects="alldata[2]" :courses="alldata[3]"></BubbleChart>
       </div>
-      <div style="display: flex;flex-direction: column;">
-        课程复用Top5
-         <div class="hotCon">
-          <div v-for="(i,index) in alldata[5]" :key="index" class="hotConA">
-            <div class="hotConAA">
-              <span>{{ index + 1 }}</span>
-              <div class="hotConAATxt">{{ i.title }}</div>
+      <div style="display: flex;flex-direction: column;gap: 10px;padding: 0;">
+          <div class="AIAppOneCon" style="flex: 1;">
+            学生参与Top5
+            <div class="hotCon">
+              <div v-for="(i,index) in alldata[4]" :key="index" class="hotConA">
+                <div class="hotConAA">
+                  <span>{{ index + 1 }}</span>
+                  <div class="hotConAATxt">{{ i.title }}</div>
+                </div>
+                <div style="color: #3072D8;width: 80px;text-align: right">{{ i.num }}次</div>
+              </div>
+            </div>
+          </div>
+          <div class="AIAppOneCon" style="flex: 1;">
+            课程复用Top5
+            <div class="hotCon">
+              <div v-for="(i,index) in alldata[5]" :key="index" class="hotConA">
+                <div class="hotConAA">
+                  <span>{{ index + 1 }}</span>
+                  <div class="hotConAATxt">{{ i.title }}</div>
+                </div>
+                <div style="color: #3072D8;width: 80px;text-align: right">{{ i.opennum }}次</div>
+              </div>
             </div>
-            <div style="color: #3072D8;width: 80px;text-align: right">{{ i.opennum }}次</div>
           </div>
-        </div>
       </div>
+      
     </div>
 
     <div class="AIAppTwo">
-      <div class="AIAppOneCon">
-        学生参与Top5
-        <div class="hotCon">
-          <div v-for="(i,index) in alldata[4]" :key="index" class="hotConA">
-            <div class="hotConAA">
-              <span>{{ index + 1 }}</span>
-              <div class="hotConAATxt">{{ i.title }}</div>
-            </div>
-            <div style="color: #3072D8;width: 80px;text-align: right">{{ i.num }}次</div>
-          </div>
-        </div>
-      </div>
       <div class="AIAppOneCon">
         AI辅助设计分析
         <aidedDesign :alldata="alldata[0]" :subject="alldata[2]"></aidedDesign>
@@ -170,14 +173,14 @@ export default {
   width: 100%;
   display: grid;
   grid-template-columns: repeat(2, 1fr);  /* 3列网格 */
-  height: 550px;
+  min-height: 598px;
   gap: 20px;  /* 间距 */
 }
 .AIAppOne > div{
   padding: 20px;
   border-radius: 10px;
   box-sizing: border-box;
-  background: #fff;
+  /* background: #fff; */
   box-sizing: border-box;
 }
 
@@ -193,7 +196,7 @@ export default {
 .AIAppTwo{
   width: 100%;
   display: grid;
-  grid-template-columns: repeat(3, 1fr);  /* 3列网格 */
+  grid-template-columns: repeat(2, 1fr);  /* 3列网格 */
   height: 500px;
   gap: 20px;  /* 间距 */
 }
@@ -213,13 +216,14 @@ export default {
   padding: 20px 15px;
   box-sizing: border-box;
   border-radius: 8px;
+  gap: 10px;
   margin-top: 10px;
 }
 .hotConA{
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 8px 0;
+  padding: 0 0 8px;
   /* height: 30px; */
   box-sizing: border-box;
   border-bottom:1px #e7e7e7 solid;