修改

src/App.vue

@@ -25,7 +25,7 @@ export default {
 </script>
 
 <style>
-@import url("//at.alicdn.com/t/font_2077629_5htvfk5d53o.css");
+@import url("//at.alicdn.com/t/font_2077629_0n6sqaodu4f.css");
 @font-face {
   font-family: "din";
   src: url("./assets/font/DIN-Bold.otf") format("opentype");

src/api/sale/sale.js

@@ -631,5 +631,15 @@ export function GetStudentCompanyYearRate(data) {
   });
 }
 
+//保存vip课程
+export function SetVipCourseApply(data) {
+  return request({
+    url: '/StopStudentClass/SetVipCourseApply',
+    method: 'post',
+    data
+  });
+}
+
+
 
 

src/components/school/student/transfer-order.vue

@@ -67,6 +67,9 @@
               <template v-if="mode == 2">
                 <yueke @select="selectCourse" :select="defaultCourse"></yueke>
               </template>
+              <template v-if="mode == 3">
+                <vipcourse ref="vipCourse" @success="$emit('close')" :stuData="stuData"></vipcourse>
+              </template>
             </q-step>
             <q-step :name="3" title="确认" icon="settings" :done="step > 3">
               <orderForm ref="orderForm" :mode="mode" :schoolList="schoolList" :save-obj="saveObj" :stuData="stuData"
@@ -76,9 +79,14 @@
         </q-card-section>
         <q-card-actions align="right" class="bg-white q-mx-md ">
           <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" v-close-popup />
-          <q-btn @click="$refs.stepper.previous()" color="primary" label="上一步" v-if="step > 1" />
-          <q-btn @click="next" color="primary" label="下一步" v-if="step < 3" />
-          <q-btn label="保存" color="primary" :loading="loading1" @click="saveOrderForm" v-if="step == 3" />
+            <q-btn @click="$refs.stepper.previous()" color="primary" label="上一步" v-if="step > 1" />
+            <template v-if="mode==3&&step == 2">
+              <q-btn label="保存" color="primary" @click="saveCourseForm"/>
+            </template>
+            <template v-else>
+              <q-btn @click="next" color="primary" label="下一步" v-if="step < 3" />
+              <q-btn label="保存" color="primary" :loading="loading1" @click="saveOrderForm" v-if="step == 3" />
+            </template>
         </q-card-actions>
       </q-card>
     </q-dialog>
@@ -103,6 +111,7 @@
   import Course from "./transfer-order/courselist";
   import orderForm from "./transfer-order/order-form";
   import yueke from "./transfer-order/yueke";
+  import vipcourse from "./transfer-order/vipcourse";
   export default {
     props: {
       select: {
@@ -114,7 +123,8 @@
       Course,
       Mode,
       orderForm,
-      yueke
+      yueke,
+      vipcourse
     },
     data() {
       return {
@@ -376,6 +386,10 @@
         this.loading1 = true;
         this.$refs.orderForm.saveOrderInfo();
       },
+      //保存课程
+      saveCourseForm(){
+        this.$refs.vipCourse.saveVipCourse();
+      },
       cancelloading() {
         this.loading1 = false;
       }

src/components/school/student/transfer-order/tickMode.vue

@@ -17,6 +17,13 @@
         <q-icon name="check" class="check-icon" />
       </div>
     </div>
+    <div class="box-businessModel" style="margin-right:0" :class="{ 'checked-border': type == 3 }" @click="chooseChange(3)">
+      <i class="iconfont icon-vipkecheng" style="font-size:38px"></i>
+      <div>VIP课程</div>
+      <div class="right" v-if="type == 3">
+        <q-icon name="check" class="check-icon" />
+      </div>
+    </div>
   </div>
 </template>
 <script>
@@ -46,7 +53,6 @@
     flex-wrap: wrap;
     margin: 0 auto;
     width: 700px;
-    justify-content: space-between;
     margin: 50px 0;
 
     .business-header {
@@ -57,7 +63,7 @@
 
     .box-businessModel {
       cursor: pointer;
-      width: 311px;
+      width: 209px;
       height: 198px;
       background: #f9f9f9;
       border-radius: 5px;
@@ -66,7 +72,7 @@
       flex-direction: column;
       align-items: center;
       position: relative;
-
+      margin-right:20px;
       .right {
         position: absolute;
         right: -20px;

src/components/school/student/transfer-order/vipcourse.vue

+<!--vip课程-->
+<template>
+  <div>
+    <div style="row items-center">
+      <div class="col row wrap">
+        <q-input filled stack-label ref="CourseName" :dense="false" :rules="[val => !!val || '请输入课程名称']"
+          v-model="CourseMsg.CourseName" label="课程名称" class="col-6 q-pr-lg q-pb-lg" />
+        <q-input filled stack-label :dense="false" ref="TotalHour" v-model="CourseMsg.TotalHour"
+          :rules="[val => !!val || '请输入课时']" @keyup.native="checkInteger(CourseMsg,'TotalHour')" class="col-6"
+          label="课时" />
+      </div>
+      <div class="col row wrap">
+        <q-input filled stack-label :dense="false" ref="CoursePrice" maxlength="10"
+          @keyup.native="checkPrice(CourseMsg, 'CoursePrice')" v-model="CourseMsg.CoursePrice"
+          class="col-6 q-pr-lg q-pb-lg" label="价格" :rules="[val => !!val || '请输入价格']" />
+        <q-select filled stack-label option-value="Id" option-label="Name" v-model="CourseMsg.CourseTimeId"
+          ref="CourseTimeId" :options="CourseTimeList" label="上课时段" class="col-6" emit-value map-options />
+      </div>
+      <q-input filled stack-label :dense="false" v-model="CourseMsg.Remarks" type="textarea" class="col-12 q-py-sm"
+        label="备注" />
+    </div>
+  </div>
+  </div>
+</template>
+<script>
+  import {
+    getScrollCourseTimeList
+  } from "../../../../api/course/roll";
+  import {
+    SetVipCourseApply
+  } from "../../../../api/sale/sale";
+
+  export default {
+    props: {
+      stuData: {
+        //学生是否续费
+        type: Object,
+        default: null
+      },
+    },
+    data() {
+      return {
+        CourseMsg: {
+          Id: 0,
+          CourseName: "", //课程名称
+          TotalHour: '', //课时
+          CoursePrice: '', //价格
+          CourseTimeId: 1, //上课时段
+          Remarks: '',
+          StuId: 1
+        },
+        CourseTimeList: [],
+      };
+    },
+    created() {},
+    mounted() {
+      console.log(this.stuData, 'studata');
+      this.getCourseTimeList();
+    },
+    methods: {
+      //关联上课时间段
+      getCourseTimeList() {
+        getScrollCourseTimeList({}).then(res => {
+          if (res.Code == 1) {
+            this.CourseTimeList = res.Data;
+          }
+        });
+      },
+      //保存
+      saveVipCourse() {
+        let StuArr=[];
+        if(this.stuData&&this.stuData.StuList.length>0){
+            this.stuData.StuList.forEach(x=>{
+                StuArr.push(x.StuId);
+            })
+        }
+        this.CourseMsg.StuId = StuArr.toString();
+        this.$refs.CourseName.validate();
+        this.$refs.TotalHour.validate();
+        this.$refs.CoursePrice.validate();
+        if (!this.$refs.CourseName.hasError && !this.$refs.TotalHour.hasError && !this.$refs.CoursePrice.hasError) {
+          SetVipCourseApply(this.CourseMsg).then(res => {
+            if (res.Code == 1) {
+              this.$q.notify({
+                icon: "iconfont icon-chenggong",
+                color: "accent",
+                timeout: 2000,
+                message: "操作成功!",
+                position: "top"
+              });
+              this.$emit("success");
+            }
+          });
+        }
+      }
+    }
+  };
+
+</script>