125 lines
4.1 KiB
Vue
125 lines
4.1 KiB
Vue
<template>
|
|
<el-card :style="{ height: height +'px' }">
|
|
<div style="text-align: center; padding-top: 30px">
|
|
<b>收银台</b>
|
|
</div>
|
|
<div :style=" { height: height - 60 +'px' }">
|
|
<el-scrollbar wrapClass="scrollbar-wrapper">
|
|
<el-steps :active="active" finish-status="success"
|
|
style="margin-top: 20px; margin-left: auto; margin-right: auto; width: 80%" center>
|
|
<el-step title="提交订单"></el-step>
|
|
<el-step title="完成支付"></el-step>
|
|
</el-steps>
|
|
<div style="margin-top: 20px; margin-left: auto; margin-right: auto; width: 80%;">
|
|
<commit-draft ref="commit" @commit="commit" :orderData="orderData" :systemName="systemName"
|
|
v-show="active===0"></commit-draft>
|
|
<confirm-draft ref="confirm" @confirm="confirm" :orderData="orderData" :systemName="systemName" :order="order"
|
|
v-show="active===1"></confirm-draft>
|
|
<finish-draft ref="finish" @finish="finish" :finishStatus="finishStatus" v-show="active===2"></finish-draft>
|
|
</div>
|
|
</el-scrollbar>
|
|
</div>
|
|
</el-card>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
import { getCommodityDetailByParams } from '@/api/management/goods';
|
|
import { PermissionType } from "@/scripts/ConstDic";
|
|
import { UrlConfig } from '@/router/index';
|
|
import CommitDraft from "./commit";
|
|
import ConfirmDraft from "./confirm";
|
|
import FinishDraft from "./finish";
|
|
import WindowResizeHandler from "@/mixin/WindowResizeHandler";
|
|
|
|
export default {
|
|
name: "LessonDetail",
|
|
components: {
|
|
CommitDraft,
|
|
ConfirmDraft,
|
|
FinishDraft
|
|
},
|
|
mixins: [WindowResizeHandler],
|
|
data() {
|
|
return {
|
|
height: "",
|
|
active: -1,
|
|
order: {},
|
|
title: "",
|
|
finishStatus: "02",
|
|
orderData: {},
|
|
routeDict: {
|
|
0: "commit",
|
|
1: "confirm",
|
|
2: "finish"
|
|
}
|
|
};
|
|
},
|
|
computed: {
|
|
systemName() {
|
|
switch (this.$route.query.permissionType) {
|
|
case PermissionType.LESSON: return '教学系统';
|
|
case PermissionType.EXAM: return '考试系统';
|
|
case PermissionType.SIMULATION: return '仿真系统';
|
|
case PermissionType.SCREEN: return '大屏系统';
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
$route(newVal) {
|
|
this.initLoadPage();
|
|
}
|
|
},
|
|
mounted() {
|
|
this.initLoadPage();
|
|
},
|
|
methods: {
|
|
resizeHandler: function () {
|
|
this.height = this._clientHeight;
|
|
},
|
|
//加载课程信息
|
|
initLoadPage() {
|
|
let data = {
|
|
mapId: this.$route.query.mapId,
|
|
lessonId: this.$route.params.lessonId,
|
|
productType: this.$route.query.permissionType,
|
|
mapProductCode: this.$route.query.prdCode,
|
|
};
|
|
|
|
getCommodityDetailByParams(data).then(response => {
|
|
this.active = 0;
|
|
this.orderData = response.data;
|
|
}).catch(error => {
|
|
this.$messageBox('获取课程信息失败');
|
|
});
|
|
},
|
|
//提交订单后处理
|
|
commit(data) {
|
|
this.active = 1;
|
|
this.order = data;
|
|
},
|
|
//确认支付后处理
|
|
confirm(data) {
|
|
this.active = 2;
|
|
this.finishStatus = data;
|
|
this.$refs.finish.createCountTimer();
|
|
},
|
|
//完成跳转处理
|
|
finish(data) {
|
|
this.active = 0;
|
|
let type = this.$route.query.permissionType;
|
|
if (type === PermissionType.LESSON) {
|
|
this.$router.replace({ path: `${UrlConfig.teach.detail}/${this.$route.params.lessonId}` });
|
|
} else if (type === PermissionType.EXAM) {
|
|
this.$router.replace({ path: `${UrlConfig.exam.course}/${this.orderData.lessonId}` });
|
|
} else if (type === PermissionType.SCREEN) {
|
|
this.$router.replace({ path: `${UrlConfig.dp.detail}/${this.$route.params.lessonId}` });
|
|
} else if (type === PermissionType.SIMULATION) {
|
|
this.$router.replace({ path: `${UrlConfig.demonstration.detail}/${this.$route.params.lessonId}` });
|
|
} else {
|
|
this.$router.replace({ path: `/` });
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script> |