new badge for recommend

src/views/elective/publish/components/steps/fauclty/over-under-badge.vue

@@ -1,7 +1,9 @@
 <template>
-  <el-badge :value="badgeValue" :hidden="!valid" :type="badgeType">
-    <el-tag :type="badgeType" v-if="valid" effect="light">{{ Math.abs(value * 1) }}</el-tag>
-    <span v-else>{{ value }}</span>
+  <el-badge :value="badgeValue" :hidden="!valid" :type="badgeType" class="under-over-badge">
+    <slot>
+      <el-tag :type="badgeType" v-if="valid" effect="light">{{ Math.abs(value * 1) }}</el-tag>
+      <span v-else>{{ value }}</span>
+    </slot>
   </el-badge>
 </template>
 
@@ -54,8 +56,17 @@ export default {
 }
 </script>
 
+<style>
+.under-over-badge .el-tag {
+  padding-left: 12px;
+  padding-right: 12px;
+  min-width: 40px;
+  margin-right: 2px;
+}
+</style>
 <style scoped>
 /deep/ .el-badge__content.is-fixed {
-  top: 8px;
+  top: 9px;
+  right: 15px;
 }
 </style>

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

@@ -16,9 +16,9 @@
         <over-under-badge :value="value"></over-under-badge>
       </template>
       <template #group="{row}">
-        <el-badge class="group" value="荐" :hidden="!row.isRecommend" type="success">
+        <over-under-badge :value="row.isRecommend?1:0" over-text="荐" over-type="success">
           <el-tag size="medium" :type="isGroupOverSetting(row) ? 'danger' : 'warning'">{{ row.groupName }}</el-tag>
-        </el-badge>
+        </over-under-badge>
       </template>
       <template #temp="{row}">
         <span class="btn-blue mr5" @click="toSelectSub(row)">选择</span>
@@ -26,8 +26,8 @@
         <!--        <el-button>查看</el-button>-->
       </template>
       <template #signUp="{row}">
-        <div  v-if="!row.allowSelect">
-          <div v-if="row.selected" >
+        <div v-if="!row.allowSelect">
+          <div v-if="row.selected">
             <span class="btn-red" v-if="!row.rejected" @click="singleCommit('','取消报名')">取消报名</span>
             <span v-else>已拒绝</span>
           </div>
@@ -109,8 +109,8 @@
           trigger="click"
         >
           <div>
-<!--            确定拒绝<span class="f-primary">{{recommendGroup.groupName}}</span>组合么？-->
-<!--            确定拒绝系统给您推荐的<span class="f-primary">{{ recommendGroup.groupName }}</span>组合么？-->
+            <!--            确定拒绝<span class="f-primary">{{recommendGroup.groupName}}</span>组合么？-->
+            <!--            确定拒绝系统给您推荐的<span class="f-primary">{{ recommendGroup.groupName }}</span>组合么？-->
             <el-input
               type="textarea"
               :rows="4"
@@ -123,9 +123,11 @@
               <el-button type="danger" size="mini" @click="handleRejectRecommend">提交</el-button>
             </p>
           </div>
-          <el-button  slot="reference" type="danger">不同意</el-button>
+          <el-button slot="reference" type="danger">不同意</el-button>
         </el-popover>
-        <el-button v-if="activeModels.generation.models.filter(item => {return item.rejected}).length > 0" type="primary" @click="singleCommit('','撤销拒绝报名')">撤销拒绝报名</el-button>
+        <el-button v-if="activeModels.generation.models.filter(item => {return item.rejected}).length > 0"
+                   type="primary" @click="singleCommit('','撤销拒绝报名')">撤销拒绝报名
+        </el-button>
       </div>
     </div>
     <esign-dialog ref="esignDialog"></esign-dialog>
@@ -216,11 +218,11 @@ export default {
       })
       if (approved.length) {
         // 查找在哪一阶段被录取 ？ 根据selected 和 approved 都为true
-        const model =this.generation.activeModels.filter(model => {
-          const flag = model.models.some(item=> {
+        const model = this.generation.activeModels.filter(model => {
+          const flag = model.models.some(item => {
             return item.selected && item.approved
           })
-          if(flag) return model
+          if (flag) return model
         })
         console.log(model)
         const admissionAgent = Object.values(this.generation.options).find(item => item.value == model[0].generation - 1)
@@ -270,7 +272,7 @@ export default {
     flagShow() {
       const stepMatched = this.generation.active == this.generation.current
       const selectStep = !this.generation.activeOpt.decisionMaking
-      return stepMatched && selectStep && !this.readonly  && !this.activeModels.isAdmission
+      return stepMatched && selectStep && !this.readonly && !this.activeModels.isAdmission
     },
     aiButtonShow() {
       if (!this.generation.activeOpt) return false
@@ -383,7 +385,7 @@ export default {
       const generationModels = this.generation.activeModels.last()?.models || []
       return this.generation.roundGroups.map(rg => {
         const row = generationModels.find(item => item.groupId == rg.groupId) || {}
-        row.allowSelectTips =  row.rejected ? '已拒绝' : row.allowSelect ? '报名中' :  row.selected ? '已报名' : row.disabledReason || '无法报名'
+        row.allowSelectTips = row.rejected ? '已拒绝' : row.allowSelect ? '报名中' : row.selected ? '已报名' : row.disabledReason || '无法报名'
         const matchedMajors = this.optionalMajors.filter(college => college.matchedGroupIds.includes(row.groupId))
         row.colleges = matchedMajors.map(m => ({ college: m.collegeName, major: m.majorCategoryName }))
         row.subjects = matchedMajors.map(m => m['majorCategoryName'])
@@ -396,7 +398,7 @@ export default {
         ...this.resolveDynamicTable,
         ...this.resolveTableSuffix
       }
-    },
+    }
   },
   methods: {
     getModelsByStep() {
@@ -424,15 +426,15 @@ export default {
       // AI 分析 跳转
       this.$refs.aiDialog.open(this.formatRows)
     },
-    singleCommit(row,tips) {
-      const type =  row == '' ? tips : '提交报名'
+    singleCommit(row, tips) {
+      const type = row == '' ? tips : '提交报名'
       // 补录及之后
       this.$confirm(`是否要${type}`, {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then(() => {
-        const arrRow = row == '' ?  []  : [row]
+        const arrRow = row == '' ? [] : [row]
         submitElectiveModels({
           models: arrRow
           // esign:this.base64Img
@@ -452,11 +454,11 @@ export default {
     commit(row) {
       // 初录
       const real = this.activeModels.generation.selectedList.filter(item => {
-          return item.selected == true
+        return item.selected == true
       })
       if (real.length < this.generation.status.preferenceCount) {
-          this.$message.warning(`需要选择${this.generation.status.preferenceCount}个志愿`)
-          return
+        this.$message.warning(`需要选择${this.generation.status.preferenceCount}个志愿`)
+        return
       }
       this.$confirm(`是否要提交报名`, {
         confirmButtonText: '确定',
@@ -530,7 +532,7 @@ export default {
         return
       }
       const rejectRow = this.activeModels.generation.models.filter(item => item.allowSelect)
-      await this.$confirm(`是否拒绝报名${rejectRow.map(item=> item.groupName).join(',')}？`)
+      await this.$confirm(`是否拒绝报名${rejectRow.map(item => item.groupName).join(',')}？`)
       // 可以报名的组合都拒绝
       rejectRecommend({
         models: rejectRow
@@ -549,12 +551,12 @@ export default {
 }
 </script>
 <style scoped>
-.cell .el-tag {
-  margin-right: 2px;
-}
+/*.cell .el-tag {*/
+/*  margin-right: 2px;*/
+/*}*/
 
-.group /deep/ .el-badge__content.is-fixed {
-  top: 8px;
-  right: 14px;
-}
+/*.group /deep/ .el-badge__content.is-fixed {*/
+/*  top: 8px;*/
+/*  right: 14px;*/
+/*}*/
 </style>

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

@@ -42,8 +42,7 @@
 
     <el-dialog :visible.sync="helpVideo.visible">
       <mx-video v-if="helpVideo.visible" :src="helpVideo.src" :ali-id-type="helpVideo.aliIdType"
-                class="mt15"
-      ></mx-video>
+                class="mt15"></mx-video>
     </el-dialog>
   </div>
 </template>
@@ -143,9 +142,9 @@ export default {
           ...this.selectObj,
           roundName: this.selectObj.name || ''
         },
-        models: this.generationModels,
-        activeModels: this.activeModels,
-        activeModel: this.activeModel
+        models: this.generationModels, // 全量generation model集合
+        activeModels: this.activeModels, // 从开始到active代的generation model集合
+        activeModel: this.activeModel // active代的generation model
       }
     }
   },