选科报名更改

mock/modules/elective-subject.js

@@ -2,6 +2,7 @@
 const Mock = require('mockjs')
 
 module.exports = [
+  //  自选专业
   {
     url: '/mock/front/elective/optionalMajors',
     type:'get',
@@ -95,6 +96,7 @@ module.exports = [
       }
     }
   },
+  // 选科报名表状态数据
   {
     url: '/mock/front/elective/studentElectiveModels',
     type:'get',
@@ -335,5 +337,4 @@ module.exports = [
       }
     }
   },
-
 ]

src/views/elective/generation/components/elective-generation-steps.vue

@@ -90,6 +90,7 @@ export default {
       }
 
       if (!this.modelValue) {
+        console.log(this.steps.findIndex(item => item.value == defaultOpt.value) + 1)
         this.activeStep = this.steps.findIndex(item => item.value == defaultOpt.value) + 1
         this.$emit('change', defaultOpt.key)
       }

src/views/system/user/profile/components/esign-dialog.vue

@@ -16,10 +16,10 @@
       <span slot="footer" class="dialog-footer fx-row jc-between">
            <el-popover
              placement="top-start"
-             title="标题"
+             title="协议"
              width="200"
              trigger="click"
-             content="这是一段内容,这是一段内容,这是一段内容,这是一段内容。">
+             content="协议内容">
              <el-button slot="reference">协议</el-button>
         </el-popover>
 

src/views/system/user/profile/components/report-step.vue

@@ -0,0 +1,35 @@
+<template>
+  <el-steps :active="currentStep">
+    <el-step v-for="(step,idx) in formatSteps" :key="step.key" :title="step.title" :status="step.status">
+      <template #title>
+         <span>{{step.title}}</span>
+      </template>
+    </el-step>
+  </el-steps>
+</template>
+<script>
+import config from '@/common/mx-config'
+
+export default {
+  props: {
+    currentStep: {
+      type:Number,
+      default: 2
+    }
+  },
+  data() {
+    return {
+      options: config.electiveGenerationOptions,
+    }
+  },
+  computed: {
+    formatSteps() {
+      if(!this.options.length) return[]
+      return this.options.filter(item => {
+        return option.value
+      })
+    }
+  }
+}
+</script>
+<style></style>

src/views/system/user/profile/components/report-table.vue

@@ -1,28 +1,27 @@
 <template>
-  <el-card>
-    <template #header>
-      <div class="fx-row fx-bet-cen">
-        <span>选科报名表</span>
-        <div>
-          <el-button type="primary" @click="toAiAnalysis" v-if="generation > 0">AI分析</el-button>
-          <el-button>选科历史记录</el-button>
-        </div>
+  <div>
+    <div class="mb10 fx-row fx-end-base">
+      <div>
+        <el-button type="primary" @click="toAiAnalysis" v-if="generation > 0">AI分析</el-button>
+        <el-button>选科历史记录</el-button>
       </div>
-    </template>
+    </div>
+
     <mx-table :propDefines="formatTable.cols" :rows="formatTable.rows">
       <template #rankInGroup="{label, key}">
-        <div   class="fx-column" >
+        <div class="fx-column">
           <span>{{ label }}</span>
           <el-popover
             placement="bottom"
-            trigger="click">
+            trigger="click"
+          >
             <span>组合成绩在填报组合的排名</span>
             <i slot="reference" class="pointer el-icon-question el-icon"></i>
           </el-popover>
         </div>
       </template>
       <template #rankInGrade="{label, key}">
-        <div   class="fx-column" >
+        <div class="fx-column">
           <span>{{ label }}</span>
           <el-popover
             placement="bottom"
@@ -55,7 +54,8 @@
             <el-popover
               placement="top"
               popper-class="zero-padding-popover"
-              trigger="hover">
+              trigger="hover"
+            >
               <div class="fx-column">
                 <el-button plain type="text">{{ subject }}</el-button>
               </div>
@@ -83,19 +83,40 @@
       <el-button @click="commit" type="primary">提交</el-button>
     </div>
     <!--  补录报名和二次补录报名 -->
-    <div v-else >
+    <div v-else>
       <div v-for="item in singleList" class="mb5 mt5">
-        <el-button   @click="commit" type="primary">{{`${item.groupName} : 报名`}}</el-button>
+        <el-button @click="commit" type="primary">{{ `${item.groupName} : 报名` }}</el-button>
       </div>
-      <div  class="mb5 mt5">
-        <el-button  type="danger">不同意</el-button>
+      <div class="mb5 mt5">
+        <el-popover
+          placement="right"
+          width="300"
+          v-model="popoShow"
+          trigger="click"
+        >
+          <div>
+            <el-input
+              type="textarea"
+              :rows="4"
+              placeholder="请输入原因"
+              v-model="regInfo"
+            >
+            </el-input>
+            <p class="fx-row jc-between mt10">
+              <el-button type="primary" size="mini" @click="popoShow = false">取消</el-button>
+              <el-button type="danger" size="mini">提交</el-button>
+            </p>
+          </div>
+
+          <el-button slot="reference" type="danger">不同意</el-button>
+        </el-popover>
       </div>
     </div>
     <esign-dialog ref="esignDialog"></esign-dialog>
     <choose-subject-dialog ref="chooseDialog"></choose-subject-dialog>
-    <select-subject-report-dialog ref="reportDialog" ></select-subject-report-dialog>
+    <select-subject-report-dialog ref="reportDialog"></select-subject-report-dialog>
     <Ai-dialog ref="aiDialog" :prevPreferences="prevPreferences"></Ai-dialog>
-  </el-card>
+  </div>
 </template>
 <script>
 import AiDialog from './ai-analysis-dialog'
@@ -104,10 +125,11 @@ import TestDrage from './test-drage'
 import ChooseSubjectDialog from './choose-subject-dialog'
 import SelectSubjectReportDialog from '@/views/system/user/profile/components/select-subject-report-dialog'
 import EsignDialog from '@/views/system/user/profile/components/esign-dialog'
+import ReportStep from './report-step'
 
 export default {
-  props:{
-    generation:{
+  props: {
+    generation: {
       type: Number,
       default: 1 // 模拟报名所处状态， 0为初录
     },
@@ -118,6 +140,7 @@ export default {
   },
   components: {
     SelectSubjectReportDialog,
+    ReportStep,
     EsignDialog,
     TestDrage,
     ChooseSubjectDialog,
@@ -126,7 +149,10 @@ export default {
   mixins: [MxSelectTranslate],
   data() {
     return {
-      prevPreferences:[1], // 选科前一轮报名的group
+      popoShow: false,
+      activeStep: '',
+      regInfo: '',
+      prevPreferences: [1], // 选科前一轮报名的group
       optionalMajors: [],
       dialogVisible: false,
       modelsWrapper: {},
@@ -167,7 +193,7 @@ export default {
         rows.forEach((row) => {
           const descriptors = column.groupDescriptors.find(desc => desc.groupId == row.groupId) ?
             column.groupDescriptors.find(desc => desc.groupId == row.groupId).descriptors : []
-           row[prop] = descriptors.length > 0 ?  descriptors.length > 1 ? `${descriptors[0].value}/${descriptors[1].value}` : `${descriptors[0].value}`  : ''
+          row[prop] = descriptors.length > 0 ? descriptors.length > 1 ? `${descriptors[0].value}/${descriptors[1].value}` : `${descriptors[0].value}` : ''
         })
       })
       const cols = {
@@ -233,7 +259,7 @@ export default {
       //
       const currentGeneration = 1
       // AI 分析 跳转
-      this.$refs.aiDialog.open(this.formatTable,currentGeneration)
+      this.$refs.aiDialog.open(this.formatTable, currentGeneration)
     },
     commit() {
       console.log(this.selectedList)
@@ -250,7 +276,7 @@ export default {
       this.$refs.esignDialog.open()
     },
     toSelect(row) {
-      const count = this.modelsWrapper.models.reduce((prev,cur) => {
+      const count = this.modelsWrapper.models.reduce((prev, cur) => {
         return prev += cur.selected ? 1 : 0
       })
       if (count >= this.preferenceCount) {
@@ -267,11 +293,11 @@ export default {
         type: 'warning'
       }).then(() => {
         row.selected = false
-        const start = this.selectedList.indexOf(this.selectedList.find((selected)=> {
+        const start = this.selectedList.indexOf(this.selectedList.find((selected) => {
           return selected.groupId == row.groupId
         }))
         console.log(start)
-        this.selectedList.splice(start,1)
+        this.selectedList.splice(start, 1)
 
       }).catch(() => {
         this.$message({
@@ -296,7 +322,7 @@ export default {
       this.singleList = this.modelsWrapper.models.filter(item => {
         return item.allowSelect
       })
-      this.$nextTick(()=>this.$refs.drage.init(this.selectedList))
+      this.$nextTick(() => this.$refs.drage.init(this.selectedList))
     },
     initOption(optionalMajors) {
       console.log(optionalMajors)

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

@@ -27,7 +27,13 @@
     <!--  自选专业 推荐专业  -->
     <select-subject class="mt20" :evaluationMajors="evaluationMajors" :optionalMajors="optionalMajors" :list="reportInfo.models"></select-subject>
     <!--  选科报名表  -->
-    <report-table class="mt20"  ref="reportRef" ></report-table>
+    <el-card class="box-card mt20" >
+      <template #header>
+        <elective-generation-steps v-if="allowSelect" v-model="activeStep" :generation="generations"></elective-generation-steps>
+      </template>
+      <report-table   ref="reportRef" ></report-table>
+    </el-card>
+
     <el-card shadow="hover" class="mt20">
       <template #header>意向选科</template>
       <el-row :gutter="20">
@@ -96,12 +102,12 @@
 
 <script>
 import { getStudentSelected, saveStudentSelected } from '@/api/webApi/selection'
-import transferMixin from '@/components/mx-transfer-mixin'
-import consts from '@/common/mx-const'
 import TestEntry from '@/views/elective/test/components/test-entry'
 import TestResult from '@/views/elective/test/components/test-result'
 import SelectSubject from '@/views/system/user/profile/components/select-subject'
 import ReportTable from '@/views/system/user/profile/components/report-table'
+import ElectiveGenerationSteps from '@/views/elective/generation/components/elective-generation-steps'
+import config from '@/common/mx-config'
 import {
   getOptionalMajors,
   getRecommendMajor,
@@ -114,7 +120,7 @@ export default {
       optionalMajors: this.getOptionalMajors
     }
   },
-  components: { SelectSubject, TestResult, TestEntry,ReportTable },
+  components: { SelectSubject, TestResult, TestEntry,ReportTable,ElectiveGenerationSteps },
   name: 'round-select',
   data() {
     return {
@@ -137,12 +143,52 @@ export default {
       },
       //
       selectObj: null,
-      allowSelect: true,
+      allowSelect: false,
       submitting: false,
       propData: {},
+      stepOptions: config.electiveGenerationOptions,
+      activeStep: ''
     }
   },
   computed: {
+    currentOpt() {
+      /// 当前进程代对应的配置项，可能没有值
+      return Object.values(this.stepOptions).find(opt => opt.value == this.selectObj.currentGeneration)
+    },
+    activeOpt() {
+      /// 当前选中的进程代，可能没有值
+      console.log('round select active step changed', this.activeStep)
+      return this.stepOptions[this.activeStep]
+    },
+    // stepOptions() {
+    //   const steps = {}
+    //   const stepOptions = config.electiveGenerationOptions
+    //   for (let key in stepOptions) {
+    //     if(stepOptions[key].value <= this.selectObj.currentGeneration){
+    //       steps['a'+ key] = stepOptions[key]
+    //     }
+    //   }
+    //   return steps
+    // },
+    generations() {
+      if(!this.selectObj) return {}
+      return {
+        // generation key value
+        hiddenGenerations: [],
+        options: this.stepOptions,
+        current: this.selectObj.currentGeneration,
+        currentOpt: this.currentOpt,
+        active: this.active,
+        activeOpt: this.activeOpt,
+        status: {
+          roundName: this.selectObj.name || '',
+          year: this.selectObj.year || '',
+        },
+      }
+    },
+    stepChange(key) {
+      console.log(key)
+    },
     selectGroupOptions() {
       return this.selectObj.groupList?.map(g => ({
         text: g.name,
@@ -180,7 +226,10 @@ export default {
     loadStudentSelected() {
       getStudentSelected().then(res => {
         console.log('getStudentSelected', res)
-        this.selectObj = res.data.selectResult
+        const selectStatus = res.data.selectResult
+        selectStatus.currentGeneration = 6 // 当前所处的状态
+        selectStatus.preferenceCount = 1 // 志愿数
+        this.selectObj = selectStatus
         this.allowSelect = res.data.allowSelect
         this.form.groupId = this.selectObj?.groupId
       })