elective student - code clean

src/views/elective/generation/detail.vue

@@ -73,7 +73,7 @@ import ElectiveGenerationFlowLog from '@/views/elective/generation/components/el
 import ElectiveFlowMajor from '@/views/elective/generation/components/elective-flow-major'
 import ElectiveFlowRankDescriptor from '@/views/elective/generation/components/elective-flow-rank-descriptor'
 import ReportTable from '@/views/elective/select/components/elective-table'
-import { getPrimaryElectivesModels, getStudentElectiveModels } from '@/api/webApi/elective/selected-subject'
+import { getStudentElectiveModels } from '@/api/webApi/elective/selected-subject'
 
 export default {
   components: { ReportTable, ElectiveFlowRankDescriptor, ElectiveFlowMajor, ElectiveGenerationFlowLog, MxCondition },

src/views/elective/select/components/elective-ai-table.vue

@@ -5,43 +5,13 @@
         <over-under-badge :value="value"></over-under-badge>
       </template>
       <template #subjects="{row}">
-        <el-row>
-          <el-col :span="8" v-for="subject in row.subjects">
-            <el-popover
-              placement="top"
-              popper-class="zero-padding-popover"
-              trigger="hover"
-            >
-              <div class="fx-column">
-                <el-button plain type="text">{{ subject }}</el-button>
-              </div>
-              <el-tag type="success" slot="reference" class="mr10 mb10">{{ subject[0] }}</el-tag>
-            </el-popover>
-          </el-col>
-        </el-row>
+        <elective-major-thumbnail :group="row"></elective-major-thumbnail>
       </template>
       <template #group="{row}">
-        <el-badge value="荐" :hidden="!row.isRecommend" type="success">
-          <el-tag size="medium" :type="row.allowSelect ? 'warning' : 'danger'">{{ row.groupName }}</el-tag>
-        </el-badge>
+        <elective-table-group-tag :generation="generation" :group="row"></elective-table-group-tag>
       </template>
       <template #colleges="{row}">
-        <el-row>
-          <el-col :span="12" v-for="college in row.colleges" class="mb10 ai-center fx-row">
-            <el-popover
-              placement="top"
-              popper-class="zero-padding-popover"
-              trigger="hover"
-            >
-              <div class="fx-column">
-                <el-button plain type="text">{{ college.major }}</el-button>
-              </div>
-              <el-tag type="success" slot="reference" class="mr10">{{ college.major[0] }}</el-tag>
-            </el-popover>
-            :
-            <span class="text-ellipsis" :title="college.college">{{ college.college }}</span>
-          </el-col>
-        </el-row>
+        <elective-major-college :group="row"></elective-major-college>
       </template>
       <template #report="{row}">
         <el-button @click="toReport('single',row)">查看</el-button>
@@ -53,6 +23,9 @@
 <script>
 import OverUnderBadge from '@/views/elective/publish/components/steps/fauclty/over-under-badge'
 import ElectiveAiReportDialog from '@/views/elective/select/components/elective-ai-report-dialog'
+import ElectiveMajorThumbnail from '@/views/elective/select/components/elective-major-thumbnail'
+import ElectiveMajorCollege from '@/views/elective/select/components/elective-major-college'
+import ElectiveTableGroupTag from '@/views/elective/select/components/elective-table-group-tag'
 
 const resolverModules = require.context('./ai-round-select-resolvers', false, /\.js$/)
 const resolvers = resolverModules.keys().map(key => resolverModules(key).default)
@@ -61,6 +34,9 @@ export default {
   mixins: [...resolvers],
   name: 'elective-ai-table',
   components: {
+    ElectiveTableGroupTag,
+    ElectiveMajorCollege,
+    ElectiveMajorThumbnail,
     ElectiveAiReportDialog,
     OverUnderBadge
   },

src/views/elective/select/components/elective-enroll-info.vue

@@ -1,13 +1,14 @@
 <template>
   <p>
+    <span>您在{{ appliedModel.option.title }}阶段</span>
     <template v-if="!appliedModel.selectedList.length">
-      您在{{ appliedModel.option.title }}阶段未填报志愿
+      <span>未填报志愿</span>
     </template>
     <template v-else-if="appliedModel.selectedList.some(m=>m.rejected)">
-      您在{{ appliedModel.option.title }}阶段拒绝填报志愿
+      <span>拒绝填报志愿</span>
     </template>
     <template v-else>
-      您在{{ appliedModel.option.title }}阶段填报的
+      <span>填报的</span>
       <span v-for="group in appliedModel.selectedList" :key="group.groupId" :class="enrollGroupClass(group)">
         {{ group.groupName }}
       </span>

src/views/elective/select/components/elective-major-college.vue

@@ -0,0 +1,24 @@
+<template>
+  <el-row>
+    <el-col :span="12" v-for="college in group.colleges" class="mb10 ai-center fx-row">
+      <el-popover placement="top" popper-class="zero-padding-popover" trigger="hover">
+        <div class="fx-column">
+          <el-button plain type="text">{{ college.major }}</el-button>
+        </div>
+        <el-tag type="success" slot="reference" class="mr10">{{ college.major[0] }}</el-tag>
+      </el-popover>
+      :<span class="text-ellipsis" :title="college.college">{{ college.college }}</span>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+export default {
+  name: 'elective-major-college',
+  props: ['group']
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/elective/select/components/elective-major-thumbnail.vue

@@ -0,0 +1,23 @@
+<template>
+  <el-row>
+    <el-col :span="8" v-for="subject in group.subjects">
+      <el-popover placement="top" popper-class="zero-padding-popover" trigger="hover">
+        <div class="fx-column">
+          <el-button plain type="text">{{ subject }}</el-button>
+        </div>
+        <el-tag type="success" slot="reference" class="mr10 mb10">{{ subject[0] }}</el-tag>
+      </el-popover>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+export default {
+  name: 'elective-major-thumbnail',
+  props: ['group']
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/elective/select/components/elective-preference-batch.vue

@@ -0,0 +1,48 @@
+<template>
+  <div>
+    <span v-if="selectedList.length">您填报了 {{ allSelectedGroupNames }}</span>
+    <elective-preference-drag :disabled="disabled" :selected-list="selectedList"></elective-preference-drag>
+    <el-button v-if="!disabled" @click="commitBatch" type="primary" :disabled="!enableCommit">提交</el-button>
+  </div>
+</template>
+
+<script>
+import { submitElectiveModels } from '@/api/webApi/elective/selected-subject'
+import ElectivePreferenceDrag from '@/views/elective/select/components/elective-preference-drag'
+
+export default {
+  name: 'elective-preference-batch',
+  components: { ElectivePreferenceDrag },
+  props: ['generation', 'disabled'],
+  computed: {
+    selectedList() {
+      return this.generation.activeModel.selectedList
+    },
+    enableCommit() {
+      return this.selectedList.length == this.generation.status.preferenceCount
+    },
+    allSelectedGroupNames() {
+      return this.selectedList.map(g => g.groupName).join(' ')
+    }
+  },
+  methods: {
+    async commitBatch() {
+      if (this.selectedList.length != this.generation.status.preferenceCount) {
+        this.$message.warning(`需要选择${this.generation.status.preferenceCount}个志愿`)
+        return
+      }
+      await this.$confirm(`确认填报 ${this.allSelectedGroupNames}`)
+      try {
+        await submitElectiveModels({ models: this.selectedList.map(g => g.groupId) })
+        this.$message.success('报名成功')
+      } finally {
+        this.refreshData()
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/elective/select/components/elective-table-group-tag.vue

@@ -0,0 +1,29 @@
+<template>
+  <over-under-badge :value="groupRecommend?1:0" over-text="荐" over-type="success">
+    <el-tag size="medium" :type="groupAllowSelect?'warning':'danger'">{{ group.groupName }}</el-tag>
+  </over-under-badge>
+</template>
+
+<script>
+import OverUnderBadge from '@/views/elective/publish/components/steps/fauclty/over-under-badge'
+export default {
+  name: 'elective-table-group-tag',
+  components: { OverUnderBadge },
+  props: ['generation', 'group'],
+  computed: {
+    selectStep() {
+      return !this.generation.activeOpt.decisionMaking
+    },
+    groupRecommend() {
+      return this.selectStep ? this.group.isRecommend : this.group['nextRecommend']
+    },
+    groupAllowSelect() {
+      return this.selectStep ? this.group.allowSelect : this.group['nextAllowSelect']
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/elective/select/components/elective-table.vue

@@ -14,9 +14,7 @@
         <over-under-badge :value="value"></over-under-badge>
       </template>
       <template #group="{row}">
-        <over-under-badge :value="groupRecommend(row)?1:0" over-text="荐" over-type="success">
-          <el-tag size="medium" :type="groupAllowSelect(row)?'warning':'danger'">{{ row.groupName }}</el-tag>
-        </over-under-badge>
+        <elective-table-group-tag :generation="generation" :group="row"></elective-table-group-tag>
       </template>
       <template #temp="{row}">
         <span class="btn-blue mr5" @click="toSelectSub(row)">选择</span>
@@ -26,47 +24,14 @@
         <elective-preference-command :generation="generation" :group="row"></elective-preference-command>
       </template>
       <template #subjects="{row}">
-        <el-row>
-          <el-col :span="8" v-for="subject in row.subjects">
-            <el-popover
-              placement="top"
-              popper-class="zero-padding-popover"
-              trigger="hover"
-            >
-              <div class="fx-column">
-                <el-button plain type="text">{{ subject }}</el-button>
-              </div>
-              <el-tag type="success" slot="reference" class="mr10 mb10">{{ subject[0] }}</el-tag>
-            </el-popover>
-          </el-col>
-        </el-row>
+        <elective-major-thumbnail :group="row"></elective-major-thumbnail>
       </template>
       <template #colleges="{row}">
-        <el-row>
-          <el-col :span="12" v-for="college in row.colleges" class="mb10 ai-center fx-row">
-            <el-popover
-              placement="top"
-              popper-class="zero-padding-popover"
-              trigger="hover"
-            >
-              <div class="fx-column">
-                <el-button plain type="text">{{ college.major }}</el-button>
-              </div>
-              <el-tag type="success" slot="reference" class="mr10">{{ college.major[0] }}</el-tag>
-            </el-popover>
-            :
-            <span class="text-ellipsis" :title="college.college">{{ college.college }}</span>
-          </el-col>
-        </el-row>
+        <elective-major-college :group="row"></elective-major-college>
       </template>
     </mx-table>
     <elective-preference-info :generation="generation"></elective-preference-info>
-    <!-- 初录 多志愿拖拽 -->
-    <div v-if="enableMultipleDrag">
-      <span v-if="selectedList.length">您填报了 {{ allSelectedGroupNames }}</span>
-      <elective-preference-drag :disabled="!enableSelect" :selected-list="selectedList"></elective-preference-drag>
-      <el-button v-if="enableSelect" @click="commitBatch" type="primary" :disabled="!enableCommit">提交</el-button>
-    </div>
+    <elective-preference-batch :generation="generation" :disabled="!enableSelect"></elective-preference-batch>
     <elective-preference-reject v-if="enableReject" :generation="generation"></elective-preference-reject>
     <elective-esign-dialog ref="esignDialog"></elective-esign-dialog>
     <choose-subject-dialog ref="chooseDialog"></choose-subject-dialog>
@@ -76,21 +41,23 @@
   </div>
 </template>
 <script>
+import consts from '@/common/mx-const'
+import { mapGetters } from 'vuex'
 import MxSelectTranslate from '@/components/Cache/modules/mx-select-translate-mixin.js'
 import ChooseSubjectDialog from '../../../system/user/profile/components/choose-subject-dialog'
 import SelectSubjectReportDialog from '@/views/system/user/profile/components/select-subject-report-dialog'
 import OverUnderBadge from '@/views/elective/publish/components/steps/fauclty/over-under-badge'
-import { submitElectiveModels } from '@/api/webApi/elective/selected-subject'
-import consts from '@/common/mx-const'
-import { mapGetters } from 'vuex'
 import ElectiveEnrollInfo from '@/views/elective/select/components/elective-enroll-info'
-import ElectivePreferenceDrag from './elective-preference-drag'
 import ElectiveToolsMixin from './elective-tools-mixins'
 import ElectivePreferenceInfo from '@/views/elective/select/components/elective-preference-info'
 import ElectivePreferenceReject from '@/views/elective/select/components/elective-preference-reject'
 import ElectivePreferenceCommand from '@/views/elective/select/components/elective-preference-command'
 import ElectiveAiAnalysisDialog from '@/views/elective/select/components/elective-ai-analysis-dialog'
 import ElectiveEsignDialog from '@/views/elective/select/components/elective-esign-dialog'
+import ElectiveMajorThumbnail from '@/views/elective/select/components/elective-major-thumbnail'
+import ElectiveMajorCollege from '@/views/elective/select/components/elective-major-college'
+import ElectivePreferenceBatch from '@/views/elective/select/components/elective-preference-batch'
+import ElectiveTableGroupTag from '@/views/elective/select/components/elective-table-group-tag'
 
 const resolverModules = require.context('./round-select-resolvers', false, /\.js$/)
 const resolvers = resolverModules.keys().map(key => resolverModules(key).default)
@@ -104,6 +71,10 @@ export default {
     optionalMajors: { type: Array, default: () => [] }
   },
   components: {
+    ElectiveTableGroupTag,
+    ElectivePreferenceBatch,
+    ElectiveMajorCollege,
+    ElectiveMajorThumbnail,
     ElectiveEsignDialog,
     ElectiveAiAnalysisDialog,
     ElectivePreferenceCommand,
@@ -158,12 +129,6 @@ export default {
     selectedList() {
       return this.generation.activeModel.selectedList
     },
-    allSelectedGroupNames() {
-      return this.selectedList.map(g => g.groupName).join(' ')
-    },
-    enableCommit() {
-      return this.selectedList.length == this.generation.status.preferenceCount
-    },
     multipleSelect() {
       return this.generation.activeModel.preferenceCount > 1
     },
@@ -181,6 +146,7 @@ export default {
     resolveTablePrefix() {
       return {
         index: {
+
           type: 'index',
           label: '编号'
         },
@@ -283,12 +249,6 @@ export default {
     }
   },
   methods: {
-    groupRecommend(group) {
-      return this.selectStep ? group.isRecommend : group['nextRecommend']
-    },
-    groupAllowSelect(group) {
-      return this.selectStep ? group.allowSelect : group['nextAllowSelect']
-    },
     preventSelectedListChanged() {
       if (!this.enableSelect) return Promise.resolve(true)
       const from = this.generation.activeModel.selectedList
@@ -321,19 +281,6 @@ export default {
     toAiAnalysis() {
       // AI 分析 跳转
       this.$refs.aiDialog.open(this.formatRows)
-    },
-    async commitBatch() {
-      if (this.selectedList.length != this.generation.status.preferenceCount) {
-        this.$message.warning(`需要选择${this.generation.status.preferenceCount}个志愿`)
-        return
-      }
-      await this.$confirm(`确认填报 ${this.allSelectedGroupNames}`)
-      try {
-        await submitElectiveModels({ models: this.selectedList.map(g => g.groupId) })
-        this.$message.success('报名成功')
-      } finally {
-        this.refreshData()
-      }
     }
   }
 }

src/views/elective/select/components/elective-tools-mixins.js

@@ -1,5 +1,17 @@
 export default {
   methods: {
+    initGenerationModels(models, options) {
+      // NOTE: create local selected list & refs !!important
+      models.forEach(gen => {
+        const localSelected = gen.models?.filter(this.isGroupSelected)
+        localSelected?.sort((l, r) => l.selectedRank - r.selectedRank)
+        gen.selectedList = localSelected || []
+        gen.selectedListSnapshot = this.deepClone(gen.selectedList) // 快照，用于对比变更
+        gen.option = Object.values(options).find(opt => opt.value == gen.generation)
+        gen.prevModel = models.find(m => m.generation == gen.generation - 1)
+        gen.nextModel = models.find(m => m.generation == gen.generation + 1)
+      })
+    },
     isModelEnrolled(model) {
       // 代录取
       return model.models?.some(this.isGroupEnrolled)

src/views/system/user/profile/round-select.vue

@@ -151,7 +151,7 @@ export default {
     try {
       this.loading = true
       this.loadStudentSelected()
-      this.getStudentElectiveModels()
+      this.loadStudentElectiveModels()
       this.getOptionalMajors()
       this.getRecommendMajor()
     } finally {
@@ -163,23 +163,15 @@ export default {
       try {
         this.loading = true
         this.loadStudentSelected()
-        this.getStudentElectiveModels()
+        this.loadStudentElectiveModels()
       } finally {
         this.loading = false
       }
     },
-    getStudentElectiveModels() {
+    loadStudentElectiveModels() {
       getStudentElectiveModels().then(res => {
-        // NOTE: create local selected list !!important
-        res.data.forEach(gen => {
-          const localSelected = gen.models?.filter(this.isGroupSelected)
-          localSelected?.sort((l, r) => l.selectedRank - r.selectedRank)
-          gen.selectedList = localSelected || []
-          gen.selectedListSnapshot = this.deepClone(gen.selectedList) // 快照，用于对比变更
-          gen.option = Object.values(this.stepOptions).find(opt => opt.value == gen.generation)
-          gen.prevModel = res.data.find(m => m.generation == gen.generation - 1)
-          gen.nextModel = res.data.find(m => m.generation == gen.generation + 1)
-        })
+        // NOTE: create local selected list & refs !!important
+        this.initGenerationModels(res.data, this.stepOptions)
         this.generationModels = res.data
       })
     },