Commit 1d28a4a2 by 刘海龙

444

parent 9abf8342
<include file="__THEME__/public_header_w3g"/>
<include file="__THEME__/public_header_w3g"/>
<style>
body {
padding: 0 !important;
}
</style>
<div id="app">
<div class="layout_v">
<van-tabs
:border="false"
v-model="tab"
sticky
@change="onTopTab"
line-width="54px"
line-height="4px"
background="white"
color="#A3E460"
title-inactive-color="#333333"
title-active-color="#A3E460">
<van-tab v-for="(opt, index) in options" :key="index">
<span slot="title" v-bind:class="tab == index ? 'tab_text_selected' : 'tab_text_normal'">
{{opt.title}}
</span>
<div class="layout_v" :class="opt.options ? 'order_inner_tab_container' : ''">
<div v-if="opt.options" class="layout_h order_inner_tab" style="background: white;z-index: 220;">
<div v-for="(innerOpt, idx) in opt.options" :key="idx" @click="onInnerTab(idx)"
class="layout_center weight_full"
:class="innerTab == idx ? 'zhenti_tab_selected' : 'zhenti_tab_normal'">{{innerOpt.title}}
</div>
</div>
<template v-for="(item, i) in listItem(opt)">
<!-- 带图 -->
<div v-if="showImage(item)" class="order_image_item layout_v">
<div class="layout_h">
<van-image height="72" width="128" fit="cover" :src="showImage(item)"></van-image>
<div class="layout_v_b weight_full" style="margin-left: 0.75rem;">
<span class="text_14_600 color_333333">{{item['video_name']}}</span>
<span class="text_14_600 color_FF3B3B">¥{{item['old_price']}}</span>
</div>
</div>
<div class="divider" style="margin-top: 1rem;"></div>
<div class="order_action_bar layout_h_b">
<div class="weight_full layout_h self_center">
<span class="text_12_400 color_333333">应付款:</span>
<span class="text_14_600 color_FF3B3B">¥{{item['price']}}</span>
</div>
<div class="layout_h_r">
<div v-if="showSolid(index)" @click="onPay(item, opt)" class="order_action_solid self_center"
style="margin-left: 0.75rem;">去支付
</div>
<div v-if="showHollow(index)" @click="onCancel(item, opt)" class="order_action_hollow self_center">
{{hollowText(index)}}
</div>
</div>
</div>
</div>
<!-- 不带图 -->
<div v-if="!showImage(item)" class="order_image_item layout_v">
<span style="margin-left: 0.75rem;margin-right: 0.75rem;" class="text_14_600 color_333333">{{item['video_title']}}</span>
<span style="margin-left: 0.75rem;" class="text_14_600 color_FF3B3B"
style="margin-top: 0.5rem;">¥{{item['old_price']}}</span>
<div class="divider" style="margin-top: 1rem;"></div>
<div class="order_action_bar layout_h_b">
<div class="weight_full layout_h self_center">
<span class="text_12_400 color_333333">应付款:</span>
<span class="text_14_600 color_FF3B3B">¥{{item['price']}}</span>
</div>
<div class="layout_h_r">
<div v-if="showSolid(index)" @click="onPay(item, opt)" class="order_action_solid self_center"
style="margin-left: 0.75rem;">去支付
</div>
<div v-if="showHollow(index)" @click="onCancel(item, opt)" class="order_action_hollow self_center">
{{hollowText(index)}}
</div>
</div>
</div>
</div>
</template>
<include file="__THEME__/empty_view_w3g"/>
</div>
</van-tab>
</van-tabs>
</div>
</div>
<script>
new Vue({
el: "#app",
data: function () {
return {
tab: 0,
innerTab: 0,
options: [{
title: "待支付",
v: 1,
options: [{
title: "课程订单",
v: 'course',
items: []
}, {
title: "考题订单",
v: 'exams',
items: []
}, {
title: "商城订单",
items: []
}]
}, {
title: "已完成",
v: 3,
options: [{
title: "课程订单",
v: 'course',
items: []
}, {
title: "考题订单",
v: 'exams',
items: []
}, {
title: "商城订单",
items: []
}]
}, {
title: "已取消",
v: 2,
options: [{
title: "课程订单",
v: 'course',
items: []
}, {
title: "考题订单",
v: 'exams',
items: []
}, {
title: "商城订单",
items: []
}]
}]
}
},
mounted: function () {
$("#preloader").hide()
},
computed: {
showHollow: function () {
return function (index) {
return true;
}
},
showSolid: function () {
return function (index) {
return index == 0
}
},
showImage: function () {
return function (item) {
console.log(item);
return item['cover_image'];
}
},
hollowText: function () {
return function (index) {
return index == 0 ? '取消订单' : '删除订单'
}
},
listItem: function () {
return function (opt) {
return opt.options ? opt.options[this.innerTab].items : opt.items
}
},
getOptions: function () {
return function (opt) {
return opt.options ? opt.options[this.innerTab] : []
}
},
showEmpty: function () {
let opt = this.options[this.tab]
if (opt.options) {
return opt.options[this.innerTab].items.length == 0
} else {
return opt.items.length == 0
}
}
},
methods: {
onTopTab: function (tab) {
this.tab = tab;
this.getList();
},
onInnerTab: function (tab) {
this.innerTab = tab;
this.getList();
},
getList: function () {
let options = this.options[this.tab];
let item = options['options'][this.innerTab];
let _this = this;
$.get(U('home/Home/orderList'), {orderby: options['v'], ordertype: item['v'],}, function (data) {
_this.options[_this.tab]['options'][_this.innerTab]['items'] = data;
}, 'json');
},
getQueryVariable: function (variable) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == variable) {
return pair[1];
}
}
return 0;
},
isLogin: function () {
if(MID<=0){
ui.confirm('请先登录', {
yes: function () {
window.location.href = "{:U('basic/Passport/login')}";
}
});
return false;
}
return true;
},
onPay: function (item, opt) {
if (!this.isLogin()) {
return false;
}
if(item['price'] <= 0){
ui.error('不需要您购买');
return false;
}
let url = '';
let formData2 = {};
let option = this.getOptions(opt);
let type = option.v;
if (type === 'course') {
url = "/pay/"+item['order']+".html";
formData2 = {
vid: item['course_id'],
check_type: "{$check_type}",
type: "ConPay",
money: item['price'],
};
}
if (type === 'exams') {
url = "/pay/exams_"+item['order']+".html";
formData2 = {
vid: item['course_id'],
check_type: "{$check_type}",
type: "ConPay",
money: item['price'],
};
}
if (type === 3) {
}
if (url === '') {
ui.error('参数错误');
return false;
}
$.post(U("course/PayVideo/checkPay"), formData2,function(data){
if(data.status == 1){
window.location.href = url;
} else if(data.status == 9){
ui.error(data.info);
window.location.reload();
} else {
ui.error(data.info);
return false;
}
},'json');
},
onCancel: function (item, opt) {
let option = this.getOptions(opt);
let type = option.v;
let form, message = '';
if (opt.v == 1) {
message = '取消';
form = "{:U('home/Home/delCancel')}";
} else {
message = "删除";
form = "{:U('home/Home/delOrder')}";
}
ui.confirm('你确定要'+message+'这个订单?', {
yes: function () {
$.ajax({
type: "POST",
url: form,
data: "ids=" + item['id'] + "&type="+type,
dataType: "json",
success: function (data) {
location.reload();
}
});
}
});
}
},
created: function () {
this.tab = this.getQueryVariable('status');
this.innerTab = 0;
this.getList();
}
})
</script>
<include file="__THEME__/public_footer_w3g"/>
...@@ -20,16 +20,24 @@ ...@@ -20,16 +20,24 @@
<van-tab v-for="(opt, index) in options" :key="index"> <van-tab v-for="(opt, index) in options" :key="index">
<span slot="title" v-bind:class="tab == index ? 'tab_text_selected' : 'tab_text_normal'"> <!-- <span slot="title" v-bind:class="tab == index ? 'tab_text_selected' : 'tab_text_normal'">
{{opt.title}} {{opt.title}}
</span> </span> -->
<div class="layout_v" :class="opt.options ? 'order_inner_tab_container' : ''">
<div v-if="opt.options" class="layout_h order_inner_tab" style="background: white;z-index: 220;">
<div v-for="(innerOpt, idx) in opt.options" :key="idx" @click="onInnerTab(idx)" <div v-for="(innerOpt, idx) in opt.options" :key="idx" @click="onInnerTab(idx)"
class="layout_center weight_full" class="layout_center weight_full"
:class="innerTab == idx ? 'zhenti_tab_selected' : 'zhenti_tab_normal'">{{innerOpt.title}} :class="innerTab == idx ? 'zhenti_tab_selected' : 'zhenti_tab_normal'">{{innerOpt.title}}
</div> </div>
<div class="layout_v" :class="opt.options ? 'order_inner_tab_container' : ''">
<div v-if="opt.options" class="layout_h order_inner_tab" style="background: white;z-index: 220;">
<!-- <div v-for="(innerOpt, idx) in opt.options" :key="idx" @click="onInnerTab(idx)"
class="layout_center weight_full"
:class="innerTab == idx ? 'zhenti_tab_selected' : 'zhenti_tab_normal'">{{innerOpt.title}}
</div> -->
<span slot="title" v-bind:class="tab == index ? 'tab_text_selected' : 'tab_text_normal'">
{{opt.title}}
</span>
</div> </div>
<template v-for="(item, i) in listItem(opt)"> <template v-for="(item, i) in listItem(opt)">
<!-- 带图 --> <!-- 带图 -->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment