1

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

+div<template>
+  <q-dialog
+    v-model="persistent"
+    persistent
+    content-class="bg-grey-1"
+    transition-show="scale"
+    transition-hide="scale"
+    class="addactivetype"
+    @hide="$emit('close')"
+  >
+    <q-card style="width: 800px;max-width:800px;">
+      <q-card-section class="row items-center q-pb-none">
+        <div class="text-h6">转订单</div>
+        <q-space />
+        <q-btn icon="close" flat round dense v-close-popup />
+      </q-card-section>
+      <q-card-section class="q-pt-none scroll" style="max-height: 70vh">
+        <q-stepper v-model="step" ref="stepper" color="primary" animated flat>
+          <q-step :name="1" title="选择班级" icon="settings" :done="step > 1">
+            <div class="row">
+              <q-select
+                v-model="OrderMsg.ClassId"
+                :options="ClassList"
+                filled
+                use-input
+                label="选择班级"
+                option-label="ClassName"
+                option-value="ClassId"
+                ref="ClassName"
+                class="col-6"
+                emit-value
+                map-options
+                @filter="filterClass"
+              >
+                <template v-slot:no-option>
+                  <q-item>
+                    <q-item-section class="text-grey">
+                      未找到相关数据
+                    </q-item-section>
+                  </q-item>
+                </template>
+              </q-select>
+            </div>
+          </q-step>
+          <q-step :name="2" title="选择课程" icon="settings" :done="step > 2">
+            <div class="row">
+              <q-select
+                v-model="OrderMsg.HelpEnterId"
+                :options="EmployeeList"
+                filled
+                use-input
+                label="选择课程"
+                option-label="EmployeeName"
+                option-value="Id"
+                ref="EmployeeName"
+                class="col-6 q-pb-lg"
+                emit-value
+                map-options
+                @filter="classFilterClass"
+              >
+                <template v-slot:no-option>
+                  <q-item>
+                    <q-item-section class="text-grey">
+                      未找到相关数据
+                    </q-item-section>
+                  </q-item>
+                </template>
+              </q-select>
+            </div>
+          </q-step>
+          <q-step :name="3" title="选择" :done="step > 3">
+            <q-table
+              :data="data.StuList"
+              :columns="columns"
+              flat
+              row-key="StuId"
+            >
+              <template v-slot:body-cell-IsRenewGuest="props">
+                <q-td :props="props">
+                  <span v-if="props.row.IsRenewGuest === 0">否</span>
+                  <span v-if="props.row.IsRenewGuest === 1">是</span>
+                </q-td>
+              </template>
+              <template v-slot:bottom> </template>
+            </q-table>
+          </q-step>
+
+          <q-step :name="4" title="确认" icon="settings" :done="step > 4">
+            <div class="row">
+              <q-input
+                filled
+                stack-label
+                :dense="false"
+                v-model="OrderMsg.GuestNum"
+                class="col-12"
+                label="人数"
+                disable
+              />
+            </div>
+          </q-step>
+        </q-stepper>
+      </q-card-section>
+      <q-card-actions align="right" class="bg-white">
+        <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="$refs.stepper.next()"
+          color="primary"
+          label="下一步"
+          v-if="step <4"
+        />
+        <q-btn label="保存" color="primary" @click="" v-if="step == 4" />
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
+</template>
+
+<script>
+import {
+  getClassPruductList,//
+  setClassOrder,
+  getOrderGuestRenewState
+} from "../../../api/sale/sale";
+import {
+    getClassDropDownList,//获取班级下拉列表
+  } from '../../../api/school/index'
+export default {
+  props: {
+    select: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      persistent: true,
+      step: 1,
+      data: {},
+      columns: [
+        {
+          name: "StuName",
+          label: "名称",
+          field: "StuName",
+          align: "left"
+        },
+        {
+          name: "StuTel",
+          label: "电话",
+          align: "left",
+          field: "StuTel"
+        },
+        {
+          name: "IsRenewGuest",
+          label: "是否续费",
+          field: "IsRenewGuest",
+          align: "left"
+        }
+      ],
+      OrderMsg: {
+        ClassId: 0, //班级编号
+        GuestNum: 0, //人数
+        B2CRatio: 0,
+        B2CReNewRatio: 0,
+        CustomerId: 0, //市场专员
+        Unit_Price: 0,
+        PreferPrice: 0,
+        OrderSource: 0,
+        SaleRemark: "",
+        Class_Price: 0, //单价
+        OrderId: 0,
+        OrderType: 0, //订单类型(1-班级课程订单，2-留学就业订单)
+        SourceId: 0, //来源编号
+        HelpEnterId: 0, //协助老师编号
+        GeneralOccupation: "", //一般同行
+        EduOccupation: "", //教育同行
+        IsLessPrice: 0, //是否少价 0 不少 1 少
+        LessPrice: 0, //少价金额
+        PerLessMoney: 0, //每人少价金额
+        OrderNature: 1, //订单性质
+        OldPreferPrice: 0, //原实际应收
+        IsChaBan: 0, //是否插班报入(1-是)
+        CourseId: "", //课程编号
+        StartClassHours: 0, //已上课时
+        EffectTime: "", //生效时间
+        UpOrderId: 0, //前置订单编号
+        JoinType: 1, //订单报入类型
+        DiscountMoney: 0, //优惠金额
+        PerDiscountMoney: 0 //每人优惠金额
+      },
+      ClassList:[],
+      allClassList:[],
+    };
+  },
+  mounted() {
+    this.getOrderGuestRenewState();
+    this.getClass();
+  },
+  methods: {
+    getOrderGuestRenewState() {
+      const ids = this.select.map(e => e.StuId).toString();
+      getOrderGuestRenewState({ StuIds: ids }).then(res => {
+        console.log("res", res);
+        this.data = res.Data;
+      });
+    },
+    //获取班级下拉
+      getClass() {
+        getClassDropDownList({
+          CourseId: 0,
+          IsAddDefault: 0, //添加默认选项
+        }).then(res => {
+          if (res.Code == 1) {
+            var jsonData = res.Data;
+            jsonData.unshift({
+              ClassId: 0,
+              ClassName: "不限"
+            })
+            if (jsonData && jsonData.length > 0) {
+              this.ClassList = JSON.parse(JSON.stringify(jsonData));
+              this.allClassList = JSON.parse(JSON.stringify(jsonData));;
+            }
+          }
+        });
+      },
+      //筛选班级
+      filterClass(val, update) {
+        update(() => {
+          if (val === '') {
+            this.ClassList = JSON.parse(JSON.stringify(this.allClassList))
+          } else {
+            const needle = val.toLowerCase()
+            this.ClassList = this.allClassList.filter(v => v.ClassName.toLowerCase().indexOf(needle) > -1)
+          }
+        })
+      },
+  }
+};
+</script>
+<style scoped></style>