添加班级提示

src/apis/config.js

@@ -0,0 +1,32 @@
+const map = {
+    680: {
+        name: "广东省祥粤建设职业培训学校",
+        no: "粤ICP备15087219号-2",
+        support: "广东中正教育科技有限公司",
+    },
+    test: {
+        name: "中正云学堂",
+        no: "粤ICP备18088045号-1",
+        support: "广东中正教育科技有限公司",
+    },
+    145: {
+        name: "中正云学堂",
+        no: "粤ICP备18088045号-1",
+        support: "广东中正教育科技有限公司",
+    },
+    520: {
+        name: "勘设云学堂",
+        no: "粤ICP备15087219号-2",
+        support: "广东中正教育科技有限公司",
+        tips1:
+            "中山勘设云学堂是中山市工程勘察设计行业协会和广东省祥粤建设职业培训学校联合打造的网络教育平台。",
+        tips2:
+            "广东省祥粤建设职业培训学校负责师资与培训资质，为中山学员提供考前、继续教育等培训，出具符合广东省要求的继续教育学时证明。",
+    },
+    zz: {
+        name: "中正云学堂",
+        no: "粤ICP备18088045号-1",
+        support: "中正科技",
+    }
+}
+export default map[process.env.ENV_ID]

src/apis/course.js

@@ -28,7 +28,18 @@ export default {
 			params: data
 		})
 	},
-
+	/**
+	  * 
+	  * @param {*} data 
+	  * @returns 
+	  * 班级详情
+	*/
+	getGradeDetail(id) {
+		return request({
+			url: '/grade/grade/class/' + id,
+			method: 'get',
+		})
+	},
 	/**
 	 * 
 	 * @param {*} data 

src/components/buyCourseModal/index.vue

@@ -20,17 +20,11 @@
               :disabled="
                 item.studentNum > 0 && item.studentNum == item.studentUpper
               "
-              :label="
-                item.classEndTime
-                  ? `${item.className} 有效期至：${$tools.timestampToTime(
-                      item.classEndTime
-                    )}，本班还剩${$tools.GetRTime(
-                      item.classEndTime
-                    )}天将结束学习`
-                  : `${item.className}`
-              "
+              :label="item.className"
               :value="item.gradeId"
             >
+              {{ item.className }}
+              <Class-time-tip :classInfo="item"></Class-time-tip>
             </el-option>
           </el-select>
         </div>
@@ -77,6 +71,7 @@
 
 <script>
 import { mapGetters } from "vuex";
+import ClassTimeTip from "@/components/common/ClassTimeTip.vue";
 export default {
   name: "BuyCourseModal",
   computed: {
@@ -236,6 +231,16 @@ export default {
       };
     },
   },
+  computed: {
+    text() {
+      let str = "";
+
+      return str;
+    },
+  },
+  components: {
+    ClassTimeTip,
+  },
 };
 </script>
 

src/components/common/ClassTimeTip.vue

@@ -0,0 +1,52 @@
+<template>
+  <p style="display: inline-block; color: red">
+    <template v-if="info.gradeId">
+      【<span>{{
+        info.status == 0
+          ? "暂未开班"
+          : info.classEndTime
+          ? `有效期至：${$tools.timestampToTime(
+              info.classEndTime
+            )}，本班还剩${$tools.GetRTime(
+              info.classEndTime
+            )}天将结束学习，`
+          : ""
+      }}</span>
+      已报名人数{{ info.studentNumAll }}/{{ info.studentUpper }}人 】
+    </template>
+  </p>
+</template>
+
+<script>
+export default {
+  props: {
+    classInfo: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+    gradeId: {
+      type: Number,
+      default: 0,
+    },
+  },
+  data() {
+    return {
+      info: {},
+    };
+  },
+  created() {
+    if (this.gradeId) {
+      this.$request.getGradeDetail(this.gradeId).then((res) => {
+        this.info = res.data;
+      });
+    } else {
+      this.info = JSON.parse(JSON.stringify(this.classInfo));
+    }
+  },
+};
+</script>
+
+<style>
+</style>

src/components/footer/index.vue

@@ -26,6 +26,8 @@
           >
         </p>
         <p>技术支持：{{ recodeMsg.support }}</p>
+        <p v-if="recodeMsg.tips1">{{ recodeMsg.tips1 }}</p>
+        <p v-if="recodeMsg.tips2">{{ recodeMsg.tips2 }}</p>
       </div>
     </div>
   </div>
@@ -33,10 +35,13 @@
 
 <script>
 import { mapGetters } from "vuex";
+import config from "@/apis/config";
 export default {
   name: "Footer",
   data() {
-    return {};
+    return {
+      recodeMsg: config,
+    };
   },
   computed: {
     ...mapGetters(["footer", "links"]),
@@ -51,37 +56,6 @@ export default {
         return showList;
       };
     },
-    recodeMsg() {
-      switch (process.env.ENV_ID) {
-        case "680":
-        case "test":
-          return {
-            name: "广东省祥粤建设职业培训学校",
-            no: "粤ICP备15087219号-2",
-            support: "广东中正教育科技有限公司",
-          };
-        case "145":
-          return {
-            name: "中正云学堂",
-            no: "粤ICP备18088045号-1",
-            support: "广东中正教育科技有限公司",
-          };
-        case "520":
-          return {
-            name: "勘设云学堂",
-            no: "粤ICP备15087219号-2",
-            support: "广东中正教育科技有限公司",
-          };
-        case "zz":
-          return {
-            name: "中正云学堂",
-            no: "粤ICP备18088045号-1",
-            support: "中正科技",
-          };
-        default:
-          break;
-      }
-    },
   },
 };
 </script>

src/pages/cart/index.vue

@@ -64,10 +64,8 @@
                     </div>
                     <div class="desc">
                       {{ scope.row.projectName }}-{{ scope.row.businessName }}
-                      <!-- <span class="note">
-                        报名截止时间：{{ scope.row.date }}
-                      </span> -->
                     </div>
+
                     <div
                       class="selection"
                       v-if="
@@ -85,16 +83,7 @@
                         <el-option
                           v-for="item in scope.row.gradeList"
                           :key="item.gradeId"
-                          :label="
-                            item.className +
-                            (item.classEndTime
-                              ? `,有效期至：${$tools.timestampToTime(
-                                  item.classEndTime
-                                )},本班还剩 ${$tools.GetRTime(
-                                  item.classEndTime
-                                )} 天将结束学习`
-                              : '')
-                          "
+                          :label="item.className"
                           :value="item.gradeId"
                         >
                         </el-option>
@@ -133,6 +122,7 @@
                         placeholder="请选择报考地区"
                       ></el-cascader>
                     </div>
+                    <Class-time-tip v-if="scope.row.gradeId" :classInfo="GradeListFindItem(scope.row.gradeList,scope.row.gradeId)"></Class-time-tip>
                   </div>
                 </div>
               </template>
@@ -196,6 +186,7 @@
 import Footer from "@/components/footer/index";
 import Header from "@/components/header/index";
 import ToolBar from "@/components/toolbar/index";
+import ClassTimeTip from "@/components/common/ClassTimeTip.vue";
 import { mapMutations } from "vuex";
 export default {
   name: "login",
@@ -203,6 +194,7 @@ export default {
     Footer,
     Header,
     ToolBar,
+    ClassTimeTip,
   },
   data() {
     return {
@@ -257,6 +249,9 @@ export default {
         });
       }
     },
+    GradeListFindItem(gradeList, gradeId) {
+      return gradeList.find((e) => e.gradeId == gradeId);
+    },
     /**
      * 点击select获取对应列表
      */
@@ -575,7 +570,7 @@ export default {
           }
 
           .desc {
-            margin-top: 10px;
+            margin-top: 4px;
             font-size: 14px;
             font-family: Microsoft YaHei;
             font-weight: 400;
@@ -589,8 +584,8 @@ export default {
           }
 
           .selection {
-            margin-top: 10px;
-            width: 5f00px;
+            margin-top: 6px;
+            width: 500px;
 
             .select {
               width: 400px;

src/pages/goods-detail/course-detail.vue

@@ -452,86 +452,7 @@
         </div>
       </div>
     </el-dialog>
-
-    <el-dialog
-      width="800px"
-      class="select-class"
-      :visible.sync="selectClassModal"
-      :before-close="cancelClassModal"
-    >
-      <div class="select-class__content">
-        <div
-          class="selection"
-          v-if="
-            goodsDetail.templateType == 'class' && goodsDetail.goodsType == 1
-          "
-        >
-          <el-select
-            class="select"
-            v-model="gradeId"
-            placeholder="请选择班级"
-            size="small"
-            @click.native="selectClick(goodsDetail, 'class', goodsId)"
-          >
-            <el-option
-              v-for="item in gradeList"
-              :key="item.gradeId"
-              :disabled="
-                item.studentNum > 0 && item.studentNum == item.studentUpper
-              "
-              :label="
-                item.classEndTime
-                  ? `${item.className} 有效期至：${$tools.timestampToTime(
-                      item.classEndTime
-                    )}，本班还剩${$tools.GetRTime(
-                      item.classEndTime
-                    )}天将结束学习`
-                  : `${item.className}`
-              "
-              :value="item.gradeId"
-            >
-            </el-option>
-          </el-select>
-        </div>
-
-        <div
-          class="selection"
-          v-if="
-            goodsDetail.templateType == 'apply' && goodsDetail.goodsType == 1
-          "
-        >
-          <el-select
-            v-model="educationId"
-            placeholder="请选择考期"
-            size="small"
-            @click.native="selectClick(goodsDetail, 'exam')"
-          >
-            <el-option
-              v-for="item in examineList"
-              :key="item.educationId"
-              :label="item.examineName"
-              :value="item.educationId"
-            >
-            </el-option>
-          </el-select>
-          <el-cascader
-            size="small"
-            :props="props"
-            ref="cascader"
-            :options="provinceList"
-            v-model="examArea"
-            @change="areaChange(goodsDetail)"
-            clearable
-            placeholder="请选择报考地区"
-          ></el-cascader>
-        </div>
-      </div>
-
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="pay">确 定</el-button>
-      </div>
-    </el-dialog>
-
+    <BuyCourseModal ref="selectClassModal"></BuyCourseModal>
     <ToolBar></ToolBar>
     <Footer></Footer>
     <!-- 规格选择 -->
@@ -550,6 +471,7 @@ import Header from "@/components/header/index";
 import ToolBar from "@/components/toolbar/index";
 import GoodsItem from "@/components/goodsItem/index";
 import IndexSkuDialog from "@/components/goodsItem/IndexSkuDialog.vue";
+import BuyCourseModal from "@/components/buyCourseModal/index";
 import { mapMutations } from "vuex";
 export default {
   name: "GoodsDetail",
@@ -559,6 +481,7 @@ export default {
     ToolBar,
     GoodsItem,
     IndexSkuDialog,
+    BuyCourseModal,
   },
   data() {
     return {
@@ -572,7 +495,6 @@ export default {
       goodsId: "",
       checked: false,
       textarea: "",
-      selectClassModal: false,
       videoModalShow: false,
       activeName: "1",
       questionModalData: {
@@ -1386,10 +1308,6 @@ export default {
         chapter.list = res.data;
       });
     },
-    cancelClassModal() {
-      this.selectClassModal = false;
-      this.goodsId = this.$route.params.goodsId;
-    },
     selectClick(goodsDetail, type, goodsId) {
       if (type == "class") {
         //选择班级
@@ -1473,7 +1391,7 @@ export default {
     },
     toPayment(goodsDetail) {
       if (this.goodsDetail.templateType) {
-        this.selectClassModal = true;
+        this.$refs.selectClassModal.showModal(this.goodsDetail);
       } else {
         // let selectGoodsList = JSON.parse(JSON.stringify([this.goodsDetail]));
         let selectGoodsList = JSON.parse(JSON.stringify([goodsDetail]));
@@ -1916,7 +1834,7 @@ export default {
                   font-weight: bold;
                 }
               }
-              i{
+              i {
                 font-size: 32px;
               }
             }
@@ -2536,7 +2454,6 @@ export default {
               height: 40px;
               align-items: center;
               border-bottom: 1px solid #eee;
-
               .item {
                 display: flex;
                 align-items: center;

src/pages/payment/index.vue

@@ -26,6 +26,7 @@
               >
                 商品名称：{{ goodsItem.goodsName }}
                 <span>应付金额：{{ goodsItem.standPrice | toFixed }}元</span>
+                <Class-time-tip :gradeId="goodsItem.gradeId"></Class-time-tip>
               </div>
             </div>
           </div>
@@ -92,6 +93,7 @@
 import Footer from "@/components/footer/index";
 import Header from "@/components/header/index";
 import ToolBar from "@/components/toolbar/index";
+import ClassTimeTip from "@/components/common/ClassTimeTip.vue";
 import { mapGetters, mapMutations } from "vuex";
 export default {
   name: "Payment",
@@ -99,6 +101,7 @@ export default {
     Footer,
     Header,
     ToolBar,
+    ClassTimeTip
   },
   data() {
     return {