统计分数更新

src/views/student/Code/ProjectDetail/Statistics.vue

@@ -1,26 +1,54 @@
 <template>
   <div>
     <!--得分情况-->
-    <div class="score-box">
-      <div class="card-box">
-        <card>
-          git分支部分规范情况得分
-          <span class="score-text">{{ statistics.branch }}</span>
-        </card>
-      </div>
-      <div class="card-box">
-        <card>
-          git提交部分规范情况得分
-          <span class="score-text">{{ statistics.commitMessage }}</span>
-        </card>
-      </div>
-      <div class="card-box">
-        <card>
-          剩余可允许的不规范提交次数
-          <span class="score-text">{{ statistics.tolerateCommit }}</span>
-        </card>
-      </div>
-    </div>
+    <!--score table-->
+    <section>
+      <b-table :data="data" ref="table">
+        <template slot-scope="props">
+          <b-table-column field="functionScore" label="功能测试得分" sortable>
+            {{ props.row.functionScore }}
+          </b-table-column>
+
+          <b-table-column
+            field="prodUnitScore"
+            label="生产环境单元测试得分"
+            sortable
+          >
+            {{ props.row.prodUnitScore }}
+          </b-table-column>
+
+          <b-table-column
+            field="otherUnitScore"
+            label="其他环境单元测试得分"
+            sortable
+          >
+            {{ props.row.otherUnitScore }}
+          </b-table-column>
+
+          <b-table-column field="branch" label="git分支规范得分" sortable>
+            {{ props.row.branch }}
+          </b-table-column>
+
+          <b-table-column
+            field="commitMessage"
+            label="git提交规范得分"
+            sortable
+          >
+            {{ props.row.commitMessage }}
+          </b-table-column>
+          <b-table-column
+            field="tolerateCommit"
+            label="剩余可允许的不规范提交次数"
+            sortable
+          >
+            {{ props.row.tolerateCommit }}
+          </b-table-column>
+          <b-table-column field="score" label="总评" sortable>
+            {{ props.row.score }}
+          </b-table-column>
+        </template>
+      </b-table>
+    </section>
 
     <!--构建情况-->
     <div class="chart-box">
@@ -47,14 +75,11 @@
 
 <script>
 import Chart from "chart.js";
-import Card from "@/components/Card";
 import { getCodeWorkStatistics } from "@/api/statistics";
 import { getStudentGroup } from "@/api/group";
 
 export default {
-  components: {
-    Card
-  },
+  components: {},
   props: {},
   data() {
     return {
@@ -67,7 +92,19 @@ export default {
       otherUTChartDOM: {},
       otherUTChartData: [],
       functionalTestChartDOM: {},
-      functionalTestChartData: []
+      functionalTestChartData: [],
+      data: [],
+      columns: [
+        { field: "functionScore", label: "功能测试得分" },
+        { field: "prodUnitScore", label: "生产环境单元测试得分" },
+        { field: "otherUnitScore", label: "其他环境单元测试得分" },
+        { field: "branch", label: "git分支部分规范情况得分" },
+        { field: "commitMessage", label: "git提交部分规范情况得分" },
+        { field: "score", label: "总评" },
+        { field: "tolerateCommit", label: "剩余可允许的不规范提交次数" }
+      ],
+      defaultOpenedDetails: [1],
+      showDetailIcon: true
     };
   },
   methods: {
@@ -97,6 +134,9 @@ export default {
         }
       });
       this.buildChart = buildChart;
+    },
+    toggle(row) {
+      this.$refs.table.toggleDetails(row);
     }
   },
   async mounted() {
@@ -135,10 +175,33 @@ export default {
       this.statistics.functionalTestFail
     ];
 
+    // this.data = [
+    //   { id: "functionScore", score: statistics.functionScore },
+    //   { id: "prodUnitScore", score: statistics.prodUnitScore },
+    //   { id: "otherUnitScore", score: statistics.otherUnitScore },
+    //   { id: "branch", score: statistics.branch },
+    //   { id: "commitMessage", score: statistics.commitMessage },
+    //   { id: "score", score: statistics.score },
+    //   { id: "tolerateCommit", score: statistics.tolerateCommit }
+    // ]; // score table
+
     this.drawChart(this.buildChartDOM, this.buildChartData);
     this.drawChart(this.prodUTChartDOM, this.prodUTChartData);
     this.drawChart(this.otherUTChartDOM, this.otherUTChartData);
     this.drawChart(this.functionalTestChartDOM, this.functionalTestChartData);
+    this.data = [
+      {
+        id: "0",
+        functionScore: this.statistics.functionScore,
+        prodUnitScore: this.statistics.prodUnitScore,
+        otherUnitScore: this.statistics.otherUnitScore,
+        branch: this.statistics.branch,
+        commitMessage: this.statistics.commitMessage,
+        score: this.statistics.score,
+        tolerateCommit: this.statistics.tolerateCommit
+      }
+    ];
+    this.$forceUpdate();
   }
 };
 </script>
@@ -146,8 +209,10 @@ export default {
 <style lang="scss" scoped>
 .score-box {
   display: flex;
+  flex-wrap: wrap;
   .card-box {
-    margin: 0 20px;
+    margin: 20px 20px;
+    width: 160px;
   }
   .score-text {
     margin-left: 12px;