elective report + major introduce batch

src/views/elective/report/components/major-introduce-batch.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="professDetail">
+    <index-card v-for="detail in details" :key="detail.code" :title="majors[detail.code]" class="index-card">
+      <el-divider content-position="left"><span class="f28">专业概况</span></el-divider>
+      <major-introduce-info :major-detail="detail.overview"></major-introduce-info>
+      <el-divider content-position="left"><span class="f28">就业前景</span></el-divider>
+      <major-introduce-job :prospects="detail.prospects"></major-introduce-job>
+    </index-card>
+  </div>
+</template>
+
+<script>
+import { getMajorDetailByCodes } from '@/api/webApi/professlib'
+import IndexCard from '@/views/index/components/index-card'
+import MajorIntroduceInfo from '@/views/career/plan/compoents/major-introduce-info'
+import MajorIntroduceJob from '@/views/career/plan/compoents/major-introduce-job'
+
+export default {
+  name: 'major-introduce-batch',
+  components: { MajorIntroduceJob, MajorIntroduceInfo, IndexCard },
+  inject: ['getOptionalMajors'],
+  data() {
+    return {
+      details: []
+    }
+  },
+  computed: {
+    majors() {
+      const all = this.getOptionalMajors()
+      if (!all.length) return []
+      const distinctMajors = {}
+      all.forEach(item => {
+        if (!item.majors) return
+        const codes = Object.keys(item.majors)
+        if (!codes.length) return
+        codes.forEach(code => {
+          distinctMajors[code] = item.majors[code]
+        })
+      })
+      return distinctMajors
+    }
+  },
+  watch: {
+    'majors': function(newVal) {
+      if (!newVal) return
+      const codes = Object.keys(newVal)
+      if (!codes.length) return
+      this.loadOverviewAndProspects(codes)
+    }
+  },
+  methods: {
+    loadOverviewAndProspects(codes) {
+      getMajorDetailByCodes({ codes: codes.toString() }).then(res => {
+        this.details = res.data
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.index-card + .index-card {
+  margin-top: 20px;
+}
+</style>

src/views/elective/report/index.vue

@@ -8,6 +8,7 @@
       <el-divider><h1>自选专业</h1></el-divider>
       <major-match-optional></major-match-optional>
       <el-divider><h1>专业介绍</h1></el-divider>
+      <major-introduce-batch></major-introduce-batch>
     </div>
   </div>
 </template>
@@ -18,11 +19,12 @@ import ElectiveTestReports from '@/views/elective/report/components/elective-tes
 import GroupSubjectQuery from '@/views/permission/components/group-subject-query'
 import RoundSelect from '@/views/system/user/profile/round-select'
 import MajorMatchOptional from '@/views/elective/report/components/major-match-optional'
+import MajorIntroduceBatch from '@/views/elective/report/components/major-introduce-batch'
 
 export default {
   name: 'report-index',
   extends: RoundSelect,
-  components: { MajorMatchOptional, RoundSelect, GroupSubjectQuery, ElectiveTestReports },
+  components: { MajorIntroduceBatch, MajorMatchOptional, RoundSelect, GroupSubjectQuery, ElectiveTestReports },
   data() {
     // TODO: 报告应该与学年和轮次相关，先暂时渲染出最近的轮次数据
     return {
@@ -51,7 +53,7 @@ export default {
   width: 80vw;
 }
 
-/deep/ .el-divider {
+/deep/ .elective-report-container > .el-divider {
   margin: 40px 0;
 }