elective report - + elective test

src/views/elective/report/components/elective-test-reports.vue

@@ -0,0 +1,28 @@
+<template>
+  <div class="fx-column" style="padding: 0 100px">
+    <index-card title="选科测评">
+      <test-result :all-test-results="testResults" :selected-majors="summary.selectedList" readonly></test-result>
+    </index-card>
+    <index-card v-for="test in testResults" :key="test.key" :title="test.title" class="elective-report-card mt20">
+      <test-report :category="test.key" :source="test.result" readonly></test-report>
+    </index-card>
+  </div>
+</template>
+
+<script>
+import TestSummary from '@/views/elective/test/components/test-summary'
+import IndexCard from '@/views/index/components/index-card'
+import TestReport from '@/views/elective/test/components/test-report'
+
+export default {
+  name: 'elective-test-reports',
+  extends: TestSummary,
+  components: { TestReport, IndexCard }
+}
+</script>
+
+<style scoped>
+.elective-report-card > /deep/ .el-card__body {
+  padding: 0;
+}
+</style>

src/views/elective/report/index.vue

@@ -1,12 +1,17 @@
 <template>
   <div class="app-container">
+    <el-divider><h1>选科测评报告</h1></el-divider>
+    <elective-test-reports></elective-test-reports>
   </div>
 </template>
 
 <script>
 
+import ElectiveTestReports from '@/views/elective/report/components/elective-test-reports'
+
 export default {
   name: 'report-index',
+  components: { ElectiveTestReports },
   data() {
     return {}
   }

src/views/elective/test/components/test-report-philosophy.js

@@ -11,6 +11,7 @@ export default {
       for (const data of this.source.datas) {
         const key = data.key
         resolveKeys.push(key)
+        data.stats = data.stats || {}
         dimensionA[key] = data.stats[dimensionA.name]
         dimensionB[key] = data.stats[dimensionB.name]
         tableDefines[key] = { label: data.name }

src/views/elective/test/components/test-report.vue

@@ -4,15 +4,16 @@
       <el-card shadow="hover">
         <template #header v-if="majorTree.length">
           <div class="fx-row fx-bet-cen">
-          <span class="f-999 f12">
-            请从推荐专业门类中选择{{ reportConfig.selectMajorLimit }}个你喜欢的专业类</span>
-            <el-button type="primary" size="small" plain @click="majorPickerDisabled=false">
+            <span class="f-999 f12">
+              请从推荐专业门类中选择{{ reportConfig.selectMajorLimit }}个你喜欢的专业类
+            </span>
+            <el-button v-if="!readonly" type="primary" size="small" plain @click="majorPickerDisabled=false">
               {{ selectMajorText }}
             </el-button>
           </div>
         </template>
         <test-major-picker :major-tree="majorTree" :selected-codes="selectedCodes"
-                           :select-limit="reportConfig.selectMajorLimit" :disabled="majorPickerDisabled"
+                           :select-limit="reportConfig.selectMajorLimit" :disabled="disabled"
                            @submit="handleMajorSubmit" @cancel="majorPickerDisabled=true"></test-major-picker>
       </el-card>
     </slot>
@@ -76,6 +77,12 @@ export default {
   mixins: [ReportMixin],
   name: 'test-report',
   components: { TestMajorPicker, MxTableDynamic, MxChart },
+  props: {
+    readonly: {
+      type: Boolean,
+      default: false
+    }
+  },
   data() {
     return {
       majorTree: [],
@@ -91,6 +98,9 @@ export default {
     },
     selectedCodes() {
       return this.source?.selectedList?.map(s => s.majorCategoryCode) || []
+    },
+    disabled() {
+      return this.majorPickerDisabled || this.readonly
     }
   },
   watch: {
@@ -106,6 +116,10 @@ export default {
   },
   methods: {
     loadMajorCategoryTree() {
+      if (!this.source.matchedCode) {
+        console.log('Prevent `getMatchCategoryTree` request caused by no-matchedCode', this.source)
+        return
+      }
       getMatchCategoryTree({
         matchCode: this.source.matchedCode,
         testType: this.testType

src/views/elective/test/components/test-result.vue

@@ -10,24 +10,21 @@
       <div class="fx-1">
         <span class="f-666">您可以从测评选择的专业分类中进一步选择{{ selectLimit }}个自己喜欢的专业：</span>
       </div>
-      <el-button type="primary" @click="majorPickerDisabled=false" :disabled="!!unfinishedText">
+      <el-button v-if="!readonly" type="primary" @click="majorPickerDisabled=false" :disabled="!!unfinishedText">
         {{ (selectedMajors.length ? '更改专业' : '选择专业') }}
       </el-button>
     </div>
     <el-divider>选科测评的专业选择仅作后续<span class="f-primary pointer">意向选科</span>参考使用</el-divider>
     <test-major-picker v-if="!majorPickerDisabled||selectedCodes.length"
                        :major-tree="dynamicMajorTree" :selected-codes="selectedCodes"
-                       :select-limit="selectLimit" :disabled="majorPickerDisabled"
+                       :select-limit="selectLimit" :disabled="disabled"
                        @submit="handleMajorSubmit" @cancel="majorPickerDisabled=true"></test-major-picker>
   </div>
 </template>
 
 <script>
 import TestMajorPicker from '@/views/elective/test/components/test-major-picker'
-import {
-  getSelectMajorSubjectTree,
-  saveUserSelectedMajor
-} from '@/api/webApi/test-major'
+import { getSelectMajorSubjectTree, saveUserSelectedMajor } from '@/api/webApi/test-major'
 import CacheMixin from '@/components/Cache/mx-cache-mixin'
 
 export default {
@@ -46,6 +43,10 @@ export default {
     selectLimit: {
       type: Number,
       default: 7
+    },
+    readonly: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -84,6 +85,9 @@ export default {
     dynamicMajorTree() {
       // 因为major树会由最新测评结果计算，如果在学生测评期间，major树可能显示不了某些历史选择的专业
       return this.majorPickerDisabled ? this.fullMajorTree : this.majorTree
+    },
+    disabled() {
+      return this.majorPickerDisabled || this.readonly
     }
   },
   watch: {

src/views/elective/test/components/test-summary.vue

@@ -31,20 +31,13 @@ export default {
         occupation: {},
         knowledge: {},
         selectedList: []
-      }
+      },
+      testResults: []
     }
   },
   computed: {
     enumTypeKeys() {
       return Object.keys(this.enumTypes)
-    },
-    testResults() {
-      return this.enumTypeKeys
-        .map(key => ({
-          key: key,
-          result: this.summary[key] || {},
-          title: config.roundSelectTestEntryOptions[key].title
-        }))
     }
   },
   mounted() {
@@ -60,6 +53,12 @@ export default {
         }
       })
       this.summary = res.data || {}
+      this.testResults = this.enumTypeKeys
+        .map(key => ({
+          key: key,
+          result: this.summary[key] || {},
+          title: config.roundSelectTestEntryOptions[key].title
+        }))
     }
   }
 }