elective report print + student info

public/collectImgNew/style.css

@@ -18,6 +18,10 @@ body {
   width: 100% !important;
 }
 
+.elective-report-container .elective-report-info-container {
+  bottom: -40px !important;
+}
+
 .max-mainWidth {
   /* A4对应1654px? */
   max-width: 1600px !important;

src/store/getters.js

@@ -8,7 +8,7 @@ const getters = {
   token: state => state.user?.token,
   isLogin: (state, getters) => !!getters.token,
   avatar: state => state.user.avatar,
-  name: state => state.user.name,
+  name: state => state.user.userName,
   nickName: state => state.user.nickName,
   introduction: state => state.user.introduction,
   school: state => state.user.busiSchool?.first(),

src/views/elective/report/index.vue

@@ -5,8 +5,22 @@
       <div v-if="electiveVisible" class="print-hidden text-right mb10">
         <el-button type="primary" icon="el-icon-printer" @click="handlePrint">打印</el-button>
       </div>
-      <div class="width100">
+      <div class="width100 relative">
         <el-image :src="require('@/assets/images/elective/elective_report_cover.png')"></el-image>
+        <div v-if="electiveVisible" class="absolute f24 bold elective-report-info-container">
+          <div class="landing-item">
+            学校：<span>{{ schoolName }}</span>
+          </div>
+          <div class="landing-item">
+            轮次：<span>{{ this.generation.status.year }}学年{{ this.generation.status.roundName }}</span>
+          </div>
+          <div class="landing-item">
+            班级：<span>{{ firstClassName | classTailing }}</span>
+          </div>
+          <div class="landing-item">
+            学生：<span>{{ nickName }}（{{ name }}）</span>
+          </div>
+        </div>
       </div>
       <elective-test-reports></elective-test-reports>
       <report-section-title class="new-page">选科大数据分析</report-section-title>
@@ -41,6 +55,7 @@ import ElectiveEnrollAnalysis from '@/views/elective/report/components/elective-
 import ElectiveAiAnalysis from '@/views/elective/report/components/elective-ai-analysis'
 import { getSelectedBookReport } from '@/api/webApi/elective/selected-subject'
 import ReportSectionTitle from '@/views/elective/report/components/report-section-title'
+import { mapGetters } from 'vuex'
 
 export default {
   name: 'report-index',
@@ -65,6 +80,7 @@ export default {
     }
   },
   computed: {
+    ...mapGetters(['schoolName', 'firstClassName', 'nickName', 'name']),
     showScore() {
       return !this.generation?.status?.scoreInvisible
     }
@@ -99,8 +115,28 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .elective-report-container {
   width: 100%;
+
+  .elective-report-info-container {
+    right: 100px;
+    bottom: 0;
+  }
+
+  .landing-item + .landing-item {
+    margin-top: 10px;
+  }
+
+  .landing-item {
+    display: flex;
+    flex-direction: row;
+
+    span {
+      display: inline-block;
+      flex: 1;
+      border-bottom: 1px solid #666666;
+    }
+  }
 }
 </style>