陈裕财
4 years ago
10 changed files with 0 additions and 1944 deletions
-
325src/views/order/addUsersIndex.vue
-
84src/views/order/components/orderSkeleton.vue
-
284src/views/order/createOrder.vue
-
299src/views/order/enterprise.vue
-
164src/views/order/flagShip.vue
-
367src/views/order/index.scss
-
207src/views/order/index.vue
-
15src/views/order/list.vue
-
65src/views/order/paySuccess.vue
-
134src/views/order/renewIndex.vue
@ -1,325 +0,0 @@ |
|||||
<template> |
|
||||
<div class="full_continer"> |
|
||||
<div class="banner"> |
|
||||
<p>购买流程: 1.选择模块 》2.确认订单 》 3.支付 》 4.完成</p> |
|
||||
</div> |
|
||||
|
|
||||
<div class="flux_continer"> |
|
||||
<div class="content"> |
|
||||
<div class="top_desc"> |
|
||||
<h2>升级所有已购买产品可用人数</h2> |
|
||||
<p>团队名: {{userInfo.branchName?userInfo.branchName:userInfo.branchId}}</p> |
|
||||
</div> |
|
||||
<div class="version_all"> |
|
||||
<div class="enterprise"> |
|
||||
<div class="buy_count"> |
|
||||
<h2> |
|
||||
购买总人数 |
|
||||
<span>(10人起购) 当前企业已有<font color="red">{{branchUsersCpd.maxUsers}}</font>个账户可用 </span> |
|
||||
</h2> |
|
||||
|
|
||||
<div class="buy_count_items"> |
|
||||
<el-input type="number" style="width:30%;" v-model="data.ousers" :min="10" @change="formOusersChange"></el-input> |
|
||||
|
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="buy_count"> |
|
||||
<h2> |
|
||||
产品明细 |
|
||||
<span> 增加人数将自动分配人员额度给企业已购买的产品，涉及的产品明细如下 </span> |
|
||||
</h2> |
|
||||
|
|
||||
<div class="buy_count_items"> |
|
||||
<el-table |
|
||||
size="larget" |
|
||||
border |
|
||||
:data="orders.modules" |
|
||||
style="width: 100%" > |
|
||||
<!-- |
|
||||
<el-table-column |
|
||||
prop="name" |
|
||||
label="产品类型" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
<span style="margin-left: 10px">{{ scope.row.mcate == '1' ? '智慧协同办公系统' : |
|
||||
scope.row.mcate == '2' ? '项目管理' : '商城'}}</span> |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
--> |
|
||||
<el-table-column |
|
||||
prop="name" |
|
||||
label="产品名称" min-width="150" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
<div class="avatar-container"> |
|
||||
<div class="avatar-wrapper"> |
|
||||
<img v-if=" scope.row.logoUrl" class="user-avatar" :src="scope.row.logoUrl"> |
|
||||
<span class="username"> {{scope.row.name}}</span> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="ousers" |
|
||||
label="可使用人数" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="musers" |
|
||||
label="计价人数" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="orginFee" |
|
||||
label="原价" |
|
||||
min-width="120"> |
|
||||
<template slot-scope="scope"> |
|
||||
￥{{scope.row.orginFee}} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="finalFee" |
|
||||
label="折扣价" |
|
||||
min-width="120"> |
|
||||
<template slot-scope="scope"> |
|
||||
￥{{scope.row.finalFee}} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="pay_way"> |
|
||||
<h2>支付方式</h2> |
|
||||
<div class="pay_way_items"> |
|
||||
<div class="oItem" @click="selectPayWay(item)" v-for="(item, index) in payWayOptions" :key="index"> |
|
||||
<img :src="item.icon"> |
|
||||
<span>{{item.label}}</span> |
|
||||
<i v-if="item.isChecked" class="select el-icon-success"></i> |
|
||||
</div> |
|
||||
</div> |
|
||||
<el-input size="larget" style="width:30%;" v-model="data.phone" class="phone" placeholder="输入手机号"></el-input> |
|
||||
</div> |
|
||||
|
|
||||
<div class="pay_allAmount"> |
|
||||
<h2>订单总额</h2> |
|
||||
<p class="allAmount">￥<b>{{orders.order?orders.order.ofinalFee:''}}</b>/{{data.label}}</p> |
|
||||
<el-checkbox v-model="data.checked">同意</el-checkbox> <a style="font-size: 14px;color: #409EFF">《服务协议》</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<el-button :loading="load.add" @click="createOrder" size="larget" class="submit" type="primary"> |
|
||||
提交 |
|
||||
</el-button> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<el-dialog |
|
||||
title="微信支付" |
|
||||
:visible.sync="weixinPayVisible" |
|
||||
:show-close="false" |
|
||||
@close="closeDialog" |
|
||||
width="350px" |
|
||||
> |
|
||||
<qriously :value="codeUrl" :size="300" /> |
|
||||
</el-dialog> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
|
|
||||
import {getAllMenuModule, getBuyMenuModule} from '@/api/mdp/sys/modules' |
|
||||
import {modulesOfIcon} from "@/components/ModulesMenu/modulesOfIcon"; |
|
||||
import {createAddUsersOrder,calcAddUsersOrder} from '@/api/mdp/sys/order'; |
|
||||
|
|
||||
import aliPayImg from '@/assets/image/module/alipay.png'; |
|
||||
import weixinPayImg from '@/assets/image/module/weixin.png'; |
|
||||
|
|
||||
import { getBranchInterestsDetail } from '@/api/branch'; |
|
||||
import { mapGetters } from 'vuex' |
|
||||
import {aliPay, weixinPay, checkWxPayStatus} from '@/api/mdp/pay/pay' |
|
||||
|
|
||||
export default { |
|
||||
components: { }, |
|
||||
|
|
||||
computed: { |
|
||||
...mapGetters([ 'userInfo' ]), |
|
||||
|
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
|
|
||||
payWayOptions: [ |
|
||||
{ |
|
||||
label: '支付宝', |
|
||||
val: '2', |
|
||||
icon: aliPayImg, |
|
||||
isChecked: true |
|
||||
}, |
|
||||
{ |
|
||||
label: '微信', |
|
||||
val: '1', |
|
||||
icon: weixinPayImg, |
|
||||
isChecked: false |
|
||||
} |
|
||||
], |
|
||||
load:{add:false,calc:false,list:false}, |
|
||||
orders:{ |
|
||||
modules: null, |
|
||||
order:null, |
|
||||
}, |
|
||||
data:{ |
|
||||
phone:'', |
|
||||
name:'', |
|
||||
ousers:10, |
|
||||
payType:'1', |
|
||||
checked:true,//是否同意协议 |
|
||||
}, |
|
||||
|
|
||||
branchUsersCpd:{istatus:'1',maxUsers:50,ilvlId:'2',ilvlName:'黄金会员'}, |
|
||||
weixinPayVisible: false, |
|
||||
codeUrl: "" |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
|
|
||||
formOusersChange(val){ |
|
||||
this.calcOrder(); |
|
||||
}, |
|
||||
calcOrder:function() { |
|
||||
if(!this.data.ousers){ |
|
||||
return; |
|
||||
} |
|
||||
var params={ousers:this.data.ousers} |
|
||||
calcAddUsersOrder(params).then(res=>{ |
|
||||
this.orders.order=res.data.data |
|
||||
var modules=res.data.modules |
|
||||
var defIcon=modulesOfIcon[0] |
|
||||
modules.forEach(i=>{ |
|
||||
var e=modulesOfIcon.find(k=>k.id==i.moduleId) |
|
||||
if(e && e.id){ |
|
||||
i.logoUrl = e.logoUrl; |
|
||||
}else{ |
|
||||
i.logoUrl=defIcon.logoUrl |
|
||||
} |
|
||||
}) |
|
||||
this.orders.modules=modules |
|
||||
}) |
|
||||
}, |
|
||||
selectPayWay(item) { |
|
||||
this.data.payType = item.val; |
|
||||
this.payWayOptions.forEach(element => { |
|
||||
element.isChecked = false; |
|
||||
if(item.val == element.val) { |
|
||||
element.isChecked = true; |
|
||||
} |
|
||||
}); |
|
||||
}, |
|
||||
createOrder() { |
|
||||
//来源 |
|
||||
this.data.osource = "1"; |
|
||||
//订单类型 |
|
||||
this.data.otype = "1"; |
|
||||
//备注 |
|
||||
this.data.remark = ""; |
|
||||
this.data.name = "模块开通订单" |
|
||||
this.load.add = true; |
|
||||
createAddUsersOrder(this.data).then(res => { |
|
||||
if(res.data.tips.isOk){ |
|
||||
//获取订单号 |
|
||||
let orderId = res.data.data.id; |
|
||||
if(this.data.payType == '2') { |
|
||||
this.toAliPay(orderId); |
|
||||
return; |
|
||||
} |
|
||||
if(this.data.payType == '1') { |
|
||||
this.toWeixinPay(orderId); |
|
||||
return; |
|
||||
} |
|
||||
}else{ |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).catch(err => { |
|
||||
this.$notify.error(err.msg); |
|
||||
}).finally(() => { |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
toAliPay(orderId) { |
|
||||
let params = { |
|
||||
id: orderId, |
|
||||
otype: 1, |
|
||||
returnUrl: `${window.location.protocol+"//"+window.location.host}/${process.env.CONTEXT}/${process.env.VERSION}/#/my/order/paySuccess` |
|
||||
} |
|
||||
aliPay(params).then(res => { |
|
||||
if(res.data.tips.isOk) { |
|
||||
const div = document.createElement("divform"); |
|
||||
div.innerHTML = res.data.data.htmlStr; |
|
||||
document.body.appendChild(div); |
|
||||
document.forms[0].submit(); |
|
||||
}else { |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).finally(() => { |
|
||||
setTimeout(() => { |
|
||||
this.load.add = false; |
|
||||
}, 2000); |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
toWeixinPay(orderId) { |
|
||||
let params = { |
|
||||
id: orderId, |
|
||||
otype: 1, |
|
||||
returnUrl: "" |
|
||||
} |
|
||||
weixinPay(params).then(res => { |
|
||||
if(res.data.tips.isOk) { |
|
||||
this.codeUrl = res.data.data.codeUrl; |
|
||||
this.weixinPayVisible = true; |
|
||||
this.timer = setInterval(() => { |
|
||||
this.queryOrderStatus(orderId) |
|
||||
}, 3000) |
|
||||
}else { |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).finally(() => { |
|
||||
setTimeout(() => { |
|
||||
this.load.add = false; |
|
||||
}, 2000); |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
//查询订单支付状态 |
|
||||
queryOrderStatus(orderId) { |
|
||||
console.log("查询订单"); |
|
||||
checkWxPayStatus({'orderId': orderId, "otype": "1"}).then(res => { |
|
||||
if(res.data.tips.isOk) { |
|
||||
this.$router.push({path:'/my/order/paySuccess', query:{total_amount: this.data.amount, out_trade_no: orderId}}); |
|
||||
clearInterval(this.timer); |
|
||||
}else { |
|
||||
} |
|
||||
}).finally(() => { |
|
||||
|
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
closeDialog() { |
|
||||
clearInterval(this.timer); |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
mounted(){ |
|
||||
this.calcOrder(); |
|
||||
getBranchInterestsDetail().then(res=>{ |
|
||||
this.branchUsersCpd=res.data.data |
|
||||
}) |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './index.scss'; |
|
||||
</style> |
|
||||
@ -1,84 +0,0 @@ |
|||||
<template> |
|
||||
<el-skeleton style="width: 100%; margin-top: 20px;" animated > |
|
||||
<template slot="template"> |
|
||||
<div> |
|
||||
<el-skeleton-item variant="h1" style="width: 10%" /> |
|
||||
</div> |
|
||||
<el-skeleton-item variant="p" style="width: 20%; margin-top: 20px;" /> |
|
||||
<div style="margin-top: 20px;"> |
|
||||
<el-skeleton-item variant="h1" style="width: 10%" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="display: flex; margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="image" style="width: 220px; height: 110px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="image" style="width: 240px; height: 110px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="h1" style="width: 10%" /> |
|
||||
<el-skeleton-item variant="span" style="width: 10%; margin: 0 30px;" /> |
|
||||
<el-skeleton-item variant="span" style="width: 10%; margin-right: 30px;" /> |
|
||||
<el-skeleton-item variant="span" style="width: 10%" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="display: flex; margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="h1" style="width: 10%" /> |
|
||||
<el-skeleton-item variant="span" style="width: 10%; margin: 0 30px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="text " style="width: 200px; height: 120px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="text " style="width: 200px; height: 120px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="text " style="width: 200px; height: 120px; margin-right: 20px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="text " style="width: 200px; height: 120px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="text " style="width: 200px; height: 120px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="text " style="width: 200px; height: 120px; margin-right: 20px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="display: flex; margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
<el-skeleton-item variant="image" style="width: 180px; height: 200px; margin-right: 20px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="h1" style="width: 32%" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="h1" style="width: 10%" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="text" style="width: 50px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<div style="margin-top: 30px;"> |
|
||||
<el-skeleton-item variant="text" style="width: 100px;" /> |
|
||||
</div> |
|
||||
|
|
||||
<el-skeleton-item style="margin-top: 30px; width: 100px;" variant="button" /> |
|
||||
|
|
||||
</template> |
|
||||
</el-skeleton> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
|
|
||||
</style> |
|
||||
@ -1,284 +0,0 @@ |
|||||
<template> |
|
||||
<div class="full_continer"> |
|
||||
<div class="banner"> |
|
||||
<p>购买流程: 1.选择模块 》 <span style="color:red;">2.确认订单 》</span> 3.支付 》 4.完成</p> |
|
||||
</div> |
|
||||
<div class="flux_continer"> |
|
||||
<div class="content"> |
|
||||
<div class="order_detail"> |
|
||||
<h2>订单详情</h2> |
|
||||
<div class="order_box"> |
|
||||
<div class="content"> |
|
||||
<div class="middle"> |
|
||||
<div class="desc"> |
|
||||
<el-descriptions size="larget" :column="3"> |
|
||||
<el-descriptions-item label="购买版本">企业版 ( {{data.ousers}} 人 )</el-descriptions-item> |
|
||||
<el-descriptions-item label="企业">{{data.order && data.order.obranchName?data.order.obranchName: ''}}</el-descriptions-item> |
|
||||
<!-- <el-descriptions-item label="手机号码">18826103122</el-descriptions-item> --> |
|
||||
<el-descriptions-item label="支付方式">{{data.payType == '2' ? '支付宝' : '微信'}}</el-descriptions-item> |
|
||||
</el-descriptions> |
|
||||
</div> |
|
||||
<div class="table"> |
|
||||
<el-table |
|
||||
size="larget" |
|
||||
border |
|
||||
:data="data.modules" |
|
||||
style="width: 100%" |
|
||||
height="250"> |
|
||||
<!-- |
|
||||
<el-table-column |
|
||||
prop="name" |
|
||||
label="产品类型" |
|
||||
> |
|
||||
<template slot-scope="scope"> |
|
||||
<span style="margin-left: 10px">{{ scope.row.mcate == '1' ? '智慧协同办公系统' : |
|
||||
scope.row.mcate == '2' ? '项目管理' : '商城'}}</span> |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
--> |
|
||||
<el-table-column |
|
||||
prop="name" |
|
||||
label="产品名称" min-width="150" |
|
||||
> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="ousers" |
|
||||
label="可用人数" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="musers" |
|
||||
label="计价人数" |
|
||||
min-width="120"> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="orginFee" |
|
||||
label="原价" |
|
||||
min-width="120"> |
|
||||
<template slot-scope="scope"> |
|
||||
￥{{scope.row.orginFee}} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
<el-table-column |
|
||||
prop="finalFee" |
|
||||
label="折扣价" |
|
||||
min-width="120"> |
|
||||
<template slot-scope="scope"> |
|
||||
￥{{scope.row.finalFee}} |
|
||||
</template> |
|
||||
</el-table-column> |
|
||||
</el-table> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="bottom"> |
|
||||
<span class="allAmount"> |
|
||||
总金额: <b>{{data.order?data.order.ofinalFee:''}}￥</b> |
|
||||
</span> |
|
||||
<el-button size="larget" @click="returnPage">上一步</el-button> |
|
||||
<el-button size="larget" type="primary" :loading="load.add" @click="createOrder">确认支付</el-button> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<el-dialog |
|
||||
title="微信支付" |
|
||||
:visible.sync="weixinPayVisible" |
|
||||
:show-close="false" |
|
||||
@close="closeDialog" |
|
||||
width="350px" |
|
||||
> |
|
||||
<qriously :value="codeUrl" :size="300" /> |
|
||||
|
|
||||
|
|
||||
</el-dialog> |
|
||||
|
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
|
|
||||
import { mapGetters } from 'vuex'; |
|
||||
import {createOrder} from '@/api/mdp/sys/order' |
|
||||
import {aliPay, weixinPay, checkWxPayStatus} from '@/api/mdp/pay/pay' |
|
||||
|
|
||||
export default { |
|
||||
|
|
||||
|
|
||||
computed: { |
|
||||
...mapGetters([ |
|
||||
'userInfo' |
|
||||
]), |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
data: {}, |
|
||||
load:{add:false,}, |
|
||||
weixinPayVisible: false, |
|
||||
codeUrl: "" |
|
||||
} |
|
||||
}, |
|
||||
methods: { |
|
||||
returnPage() { |
|
||||
this.$router.back(); |
|
||||
}, |
|
||||
|
|
||||
createOrder() { |
|
||||
//来源 |
|
||||
this.data.osource = "1"; |
|
||||
//订单类型 |
|
||||
this.data.otype = "1"; |
|
||||
//备注 |
|
||||
this.data.remark = ""; |
|
||||
this.data.name = "模块开通订单" |
|
||||
this.load.add = true; |
|
||||
var params={...this.data} |
|
||||
params.order=null |
|
||||
params.modules=null |
|
||||
|
|
||||
createOrder(params).then(res => { |
|
||||
if(res.data.tips.isOk){ |
|
||||
//获取订单号 |
|
||||
let orderId = res.data.data.id; |
|
||||
if(this.data.payType == '2') { |
|
||||
this.toAliPay(orderId); |
|
||||
return; |
|
||||
} |
|
||||
if(this.data.payType == '1') { |
|
||||
this.toWeixinPay(orderId); |
|
||||
return; |
|
||||
} |
|
||||
}else{ |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).catch(err => { |
|
||||
this.$notify.error(err.msg); |
|
||||
}).finally(() => { |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
toAliPay(orderId) { |
|
||||
let params = { |
|
||||
id: orderId, |
|
||||
otype: 1, |
|
||||
returnUrl: `${window.location.protocol+"//"+window.location.host}/${process.env.CONTEXT}/${process.env.VERSION}/#/my/order/paySuccess` |
|
||||
} |
|
||||
aliPay(params).then(res => { |
|
||||
if(res.data.tips.isOk) { |
|
||||
const div = document.createElement("divform"); |
|
||||
div.innerHTML = res.data.data.htmlStr; |
|
||||
document.body.appendChild(div); |
|
||||
document.forms[0].submit(); |
|
||||
}else { |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).finally(() => { |
|
||||
setTimeout(() => { |
|
||||
this.load.add = false; |
|
||||
}, 2000); |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
toWeixinPay(orderId) { |
|
||||
let params = { |
|
||||
id: orderId, |
|
||||
otype: 1, |
|
||||
returnUrl: "" |
|
||||
} |
|
||||
weixinPay(params).then(res => { |
|
||||
if(res.data.tips.isOk) { |
|
||||
this.codeUrl = res.data.data.codeUrl; |
|
||||
this.weixinPayVisible = true; |
|
||||
this.timer = setInterval(() => { |
|
||||
this.queryOrderStatus(orderId) |
|
||||
}, 3000) |
|
||||
}else { |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).finally(() => { |
|
||||
setTimeout(() => { |
|
||||
this.load.add = false; |
|
||||
}, 2000); |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
//查询订单支付状态 |
|
||||
queryOrderStatus(orderId) { |
|
||||
console.log("查询订单"); |
|
||||
checkWxPayStatus({'orderId': orderId, "otype": "1"}).then(res => { |
|
||||
if(res.data.tips.isOk) { |
|
||||
this.$router.push({path:'/my/order/paySuccess', query:{total_amount: this.data.amount, out_trade_no: orderId}}); |
|
||||
clearInterval(this.timer); |
|
||||
}else { |
|
||||
} |
|
||||
}).finally(() => { |
|
||||
|
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
closeDialog() { |
|
||||
clearInterval(this.timer); |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
created() { |
|
||||
let data = JSON.parse(window.localStorage.getItem("BUY_MODULES")); |
|
||||
this.data = data; |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './index.scss'; |
|
||||
.order_detail { |
|
||||
margin-top: 30px; |
|
||||
.order_box { |
|
||||
margin-top: 30px; |
|
||||
width: 100%; |
|
||||
max-height: 500px; |
|
||||
border: 1px solid #E3E4E6; |
|
||||
.content { |
|
||||
.header { |
|
||||
height: 60px; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
padding-left: 20px; |
|
||||
border-bottom: 2px solid #F4F5F8; |
|
||||
} |
|
||||
.middle { |
|
||||
.desc { |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
flex-wrap: wrap; |
|
||||
span { |
|
||||
margin-right: 60px; |
|
||||
margin-bottom: 20px; |
|
||||
color: #606060; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.bottom { |
|
||||
padding: 20px; |
|
||||
display: flex; |
|
||||
justify-content: flex-end; |
|
||||
align-items: center; |
|
||||
.allAmount { |
|
||||
margin-right: 40px; |
|
||||
b { |
|
||||
font-size: 24px; |
|
||||
color: #FA5A55; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
|
|
||||
</style> |
|
||||
@ -1,299 +0,0 @@ |
|||||
<template> |
|
||||
<div class="enterprise"> |
|
||||
<div class="sys_type"> |
|
||||
<div class="sys_desc"> |
|
||||
<h2>选择产品</h2> |
|
||||
<div class="selectItem"> |
|
||||
<div class="item" :class="{active: active == 'xmgl' }" @click="active = 'xmgl'"> |
|
||||
<span>项目管理系统</span> |
|
||||
</div> |
|
||||
<div class="item" :class="{active: active == 'oa' }" @click="active = 'oa'"> |
|
||||
<span>智慧协同办公系统</span> |
|
||||
</div> |
|
||||
<div class="item" :class="{active: active == 'mall' }" @click="active = 'mall'"> |
|
||||
<span>电商定制系统</span> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="sys_modules" v-if="this.modules != null"> |
|
||||
<div v-for="(item, index) in modules[active]" :key="index"> |
|
||||
<div v-if="ooper==='2' && item.billMode!=='0' && item.isBuy" class="module"> |
|
||||
<div class="head" :class="{active: item.isChecked == true}" @click="selectItem(item, index)"> |
|
||||
<div class="module_top"> |
|
||||
<img :src="item.logoUrl" alt=""> |
|
||||
<span>{{item.name}}</span> |
|
||||
</div> |
|
||||
<div v-if="item.isBuy" class="module_bottom"> |
|
||||
<i v-if="item.isChecked" class="selected el-icon-success"></i> |
|
||||
<span> <font color="red"> 待续费 </font> <font title="到期" style="font-size:10px;"> {{formatDate(item.endTime)}} </font></span> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div v-else-if="ooper!=='2' && item.billMode!=='0' " class="module"> |
|
||||
<div class="head" :class="{active: item.isChecked == true}" @click="selectItem(item, index)"> |
|
||||
<div class="module_top"> |
|
||||
<img :src="item.logoUrl" alt=""> |
|
||||
<span>{{item.name}}</span> |
|
||||
</div> |
|
||||
<div v-if=" item.billMode==='0'" class="module_bottom"> |
|
||||
<span> <font color="red">免费 </font> <font color="blue">已开通</font></span> |
|
||||
</div> |
|
||||
<div v-else-if="item.isBuy" class="module_bottom"> |
|
||||
<span> <font color="blue">已开通</font></span> |
|
||||
</div> |
|
||||
<div v-else class="module_bottom" > |
|
||||
<i v-if="item.isChecked" class="selected el-icon-success"></i> |
|
||||
<span> <font color="red">待开通</font></span> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="buy_count"> |
|
||||
<h2> |
|
||||
购买总人数 |
|
||||
<span>(10人起购,请按企业(团队)总人数填写，企业(团队)总人数代表了企业在唛盟平台可开立免费账户的总个数)</span> |
|
||||
</h2> |
|
||||
|
|
||||
<div class="buy_count_items"> |
|
||||
<el-input-number v-if="branchUsersCpd.ilvlId>1" v-model="form.ousers" :min="branchUsersCpd.maxUsers" @change="formOusersChange"></el-input-number> |
|
||||
|
|
||||
<el-input-number v-else v-model="form.ousers" :min="10" @change="formOusersChange"></el-input-number> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="buy_date"> |
|
||||
<h2>期限选择</h2> |
|
||||
<div class="buy_date_items"> |
|
||||
<div class="oItem" @click="selectBuyDate(item)" v-for="(item, index) in odaysOptions" :key="index"> |
|
||||
<div class="header"> |
|
||||
{{item.label}} |
|
||||
<i v-if="item.isChecked" class="select el-icon-success"></i> |
|
||||
</div> |
|
||||
<div class="bottom"> |
|
||||
<img v-if="item.isHot" src="@/assets/image/module/hot.png" alt=""> |
|
||||
<p>￥{{item.price}}/人天</p> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="pay_way"> |
|
||||
<h2>支付方式</h2> |
|
||||
<div class="pay_way_items"> |
|
||||
<div class="oItem" @click="selectPayWay(item)" v-for="(item, index) in payWayOptions" :key="index"> |
|
||||
<img :src="item.icon"> |
|
||||
<span>{{item.label}}</span> |
|
||||
<i v-if="item.isChecked" class="select el-icon-success"></i> |
|
||||
</div> |
|
||||
</div> |
|
||||
<el-input size="larget" v-model="form.phone" class="phone" placeholder="输入手机号"></el-input> |
|
||||
</div> |
|
||||
|
|
||||
<div class="pay_allAmount"> |
|
||||
<h2>订单总额</h2> |
|
||||
<p class="allAmount">￥<b>{{orders.order?orders.order.ofinalFee:''}}</b>/{{form.label}}</p> |
|
||||
<el-checkbox v-model="form.checked">同意</el-checkbox> <a style="font-size: 14px;color: #409EFF">《服务协议》</a> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
|
|
||||
import { mapGetters } from 'vuex'; |
|
||||
import {getAllMenuModule, getBuyMenuModule} from '@/api/mdp/sys/modules' |
|
||||
import {calcOrder} from '@/api/mdp/sys/order' |
|
||||
|
|
||||
import aliPay from '@/assets/image/module/alipay.png'; |
|
||||
import weixinPay from '@/assets/image/module/weixin.png' |
|
||||
import Decimal from "decimal.js" // 具体文件中引入 |
|
||||
import getDecimal from '@/utils/decimalUtil.js' |
|
||||
|
|
||||
import { getBranchInterestsDetail } from '@/api/branch'; |
|
||||
|
|
||||
export default { |
|
||||
props: ['modules', 'ooper'], |
|
||||
data() { |
|
||||
return { |
|
||||
menuLoading: false, |
|
||||
active: "xmgl", |
|
||||
payWayOptions: [ |
|
||||
{ |
|
||||
label: '支付宝', |
|
||||
val: '2', |
|
||||
icon: aliPay, |
|
||||
isChecked: true |
|
||||
}, |
|
||||
{ |
|
||||
label: '微信', |
|
||||
val: '1', |
|
||||
icon: weixinPay, |
|
||||
isChecked: false |
|
||||
} |
|
||||
], |
|
||||
odaysOptions: [ |
|
||||
{ |
|
||||
label: '1年', |
|
||||
val: '360', |
|
||||
isHot: true, |
|
||||
isChecked: true, |
|
||||
price: '2' |
|
||||
}, |
|
||||
{ |
|
||||
label: '6个月', |
|
||||
val: '180', |
|
||||
isHot: false, |
|
||||
isChecked: false, |
|
||||
price: '2' |
|
||||
}, |
|
||||
{ |
|
||||
label: '3个月', |
|
||||
val: '90', |
|
||||
isHot: false, |
|
||||
isChecked: false, |
|
||||
price: '2' |
|
||||
}, |
|
||||
], |
|
||||
form: { |
|
||||
moduleIds:[], |
|
||||
payType: '1', |
|
||||
odays: '360', |
|
||||
label:'1年', |
|
||||
ousers:10, |
|
||||
phone: '', |
|
||||
checked: false, |
|
||||
}, |
|
||||
orders:{order:{ofinalFee:0},modules:[]}, |
|
||||
branchUsersCpd:{istatus:'1',maxUsers:50,ilvlId:'2',ilvlName:'黄金会员'} |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
computed: { |
|
||||
...mapGetters([ |
|
||||
'userInfo' |
|
||||
]), |
|
||||
}, |
|
||||
|
|
||||
watch: { |
|
||||
|
|
||||
'form.ousers':function(val,oldValue){ |
|
||||
this.calcOrder(); |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
formatDate(dateStr){ |
|
||||
if(dateStr){ |
|
||||
return dateStr.substring(0,10) |
|
||||
}else{ |
|
||||
return ''; |
|
||||
} |
|
||||
}, |
|
||||
formOusersChange(val){ |
|
||||
if(this.branchUsersCpd && this.branchUsersCpd.istatus=='1'){ |
|
||||
if(val<=this.branchUsersCpd.maxUsers){ |
|
||||
this.form.ousers=this.branchUsersCpd.maxUsers |
|
||||
this.$notify({position:"bottom-left",message:"您当前已拥有创建"+this.branchUsersCpd.maxUsers+"个账户资格，企业总人数不能低于"+this.branchUsersCpd.maxUsers,type:"warning"}) |
|
||||
|
|
||||
return false; |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
}, |
|
||||
calcOrder:function() { |
|
||||
if(!this.form.moduleIds || this.form.moduleIds.length==0){ |
|
||||
if(this.orders && this.orders.order){ |
|
||||
this.orders={order:{ofinalFee:0},moduleIds:[]} |
|
||||
} |
|
||||
return; |
|
||||
} |
|
||||
this.form.ooper=this.ooper; |
|
||||
calcOrder(this.form).then(res=>{ |
|
||||
var tips = res.data.tips; |
|
||||
if(tips.isOk){ |
|
||||
this.orders.order=res.data.data |
|
||||
this.orders.modules=res.data.modules |
|
||||
this.odaysOptions.forEach(i=>{ |
|
||||
i.price=parseInt(this.orders.order.ofinalFee/this.form.ousers/this.form.odays ) |
|
||||
}) |
|
||||
}else{ |
|
||||
this.$notify({position:"bottom-left",message:tips.msg,type:"error"}) |
|
||||
} |
|
||||
|
|
||||
}) |
|
||||
}, |
|
||||
selectItem(item) { |
|
||||
|
|
||||
if(this.ooper!='2' && item.isBuy){ |
|
||||
this.$notify({position:"bottom-left",message:"【"+item.name+"】已购买，如需调整，请进入【我的订单->加购】 处理",type:"warning"}) |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
if( item.billMode==='0'){ |
|
||||
this.$notify({position:"bottom-left",message:"【"+item.name+"】为免费开通，无须下单。",type:"warning"}) |
|
||||
return false; |
|
||||
} |
|
||||
item.isChecked=!item.isChecked; |
|
||||
if(item.isChecked==false){ |
|
||||
this.form.moduleIds=this.form.moduleIds.filter(i=>i!=item.id) |
|
||||
}else if(item.isChecked==true && !this.form.moduleIds.some(i=>i==item.id)){ |
|
||||
this.form.moduleIds.push(item.id) |
|
||||
} |
|
||||
this.calcOrder(); |
|
||||
}, |
|
||||
|
|
||||
selectPayWay(item) { |
|
||||
this.form.payType = item.val; |
|
||||
this.payWayOptions.forEach(element => { |
|
||||
element.isChecked = false; |
|
||||
if(item.val == element.val) { |
|
||||
element.isChecked = true; |
|
||||
} |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
selectBuyDate(item) { |
|
||||
this.form.odays = item.val; |
|
||||
this.odaysOptions.forEach(element => { |
|
||||
element.isChecked = false; |
|
||||
if(item.val == element.val) { |
|
||||
element.isChecked = true; |
|
||||
} |
|
||||
}); |
|
||||
this.form.odays=item.val |
|
||||
this.form.label=item.label |
|
||||
this.calcOrder(); |
|
||||
}, |
|
||||
|
|
||||
|
|
||||
getData() { |
|
||||
let obj = { |
|
||||
...this.orders, |
|
||||
...this.form, |
|
||||
opper:this.ooper, |
|
||||
} |
|
||||
return obj; |
|
||||
}, |
|
||||
}, |
|
||||
|
|
||||
mounted() { |
|
||||
this.form.phone = this.userInfo.phoneno; |
|
||||
getBranchInterestsDetail().then(res=>{ |
|
||||
Object.assign(this.branchUsersCpd,res.data.data); |
|
||||
if(this.branchUsersCpd.branchId && this.branchUsersCpd.istatus=='1'){ |
|
||||
this.form.ousers=this.branchUsersCpd.maxUsers |
|
||||
//this.calcOrder(); |
|
||||
} |
|
||||
|
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss"> |
|
||||
@import './index.scss'; |
|
||||
</style> |
|
||||
@ -1,164 +0,0 @@ |
|||||
<template> |
|
||||
<div class="flagShip"> |
|
||||
<h2>购买信息</h2> |
|
||||
<span class="desc">填写你的联系方式，我们产品顾问将会尽快联系你。</span> |
|
||||
<el-form class="form" label-position="left" ref="form" :model="form" :rules="rules" label-width="80px"> |
|
||||
<el-form-item label="联系人" prop="contacts"> |
|
||||
<el-input class="inp" v-model="form.contacts"></el-input> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<el-form-item label="联系电话" prop="phone"> |
|
||||
<el-input class="inp" v-model="form.phone"></el-input> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<el-form-item label="使用人数"> |
|
||||
<el-select class="inp" v-model="form.usePeoples" placeholder="使用人数"> |
|
||||
<el-option |
|
||||
v-for="item in usePeopleOptions" |
|
||||
:key="item.value" |
|
||||
:label="item.label" |
|
||||
:value="item.value"> |
|
||||
</el-option> |
|
||||
</el-select> |
|
||||
</el-form-item> |
|
||||
|
|
||||
<el-form-item label="服务需求"> |
|
||||
<el-select class="inp" multiple v-model="form.needs" placeholder="服务需求"> |
|
||||
<el-option |
|
||||
v-for="item in needOptions" |
|
||||
:key="item.value" |
|
||||
:label="item.label" |
|
||||
:value="item.value"> |
|
||||
</el-option> |
|
||||
</el-select> |
|
||||
</el-form-item> |
|
||||
<span>想要我们提供哪些服务（可多选）</span> |
|
||||
</el-form> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
data() { |
|
||||
// 自定义验证 |
|
||||
const validPhone = (rule, value, callback) => { |
|
||||
const reg = /^1([38][0-9]|4[014-9]|[59][0-35-9]|6[2567]|7[0-8])\d{8}$/ |
|
||||
if (!value) { |
|
||||
callback(new Error('请输入电话号码')) |
|
||||
} else if (!reg.test(value)) { //判断用户输入的值是否符合规则 |
|
||||
callback(new Error('请输入正确的11位手机号码')) |
|
||||
} else { |
|
||||
callback() |
|
||||
} |
|
||||
} |
|
||||
return { |
|
||||
usePeopleOptions: [ |
|
||||
{ |
|
||||
label: '51-100', |
|
||||
value: '51-100' |
|
||||
}, |
|
||||
{ |
|
||||
label: '101-500', |
|
||||
value: '101-500' |
|
||||
}, |
|
||||
{ |
|
||||
label: '501-1000', |
|
||||
value: '501-1000' |
|
||||
}, |
|
||||
{ |
|
||||
label: '1000以上', |
|
||||
value: '1000以上' |
|
||||
} |
|
||||
], |
|
||||
needOptions: [ |
|
||||
{ |
|
||||
label: '预约演示', |
|
||||
value: '预约演示' |
|
||||
}, |
|
||||
{ |
|
||||
label: '产品报价', |
|
||||
value: '产品报价' |
|
||||
}, |
|
||||
{ |
|
||||
label: '部署方式', |
|
||||
value: '部署方式' |
|
||||
}, |
|
||||
{ |
|
||||
label: '新增功能', |
|
||||
value: '新增功能' |
|
||||
}, |
|
||||
{ |
|
||||
label: '其它', |
|
||||
value: '其它' |
|
||||
} |
|
||||
], |
|
||||
form: { |
|
||||
phone: '', |
|
||||
contacts: '', |
|
||||
usePeoples: '', |
|
||||
needs: [], |
|
||||
}, |
|
||||
rules: { |
|
||||
contacts: [ |
|
||||
{ required: true, message: '请输入联系人', trigger: 'blur' }, |
|
||||
], |
|
||||
phone: [ |
|
||||
{ required: true, trigger: 'blur', validator: validPhone } |
|
||||
], |
|
||||
usePeoples: [ |
|
||||
{ required: true, message: '请选择使用人数', trigger: 'blur' }, |
|
||||
], |
|
||||
needs: [ |
|
||||
{ required: true, message: '请选择服务需求', trigger: 'blur' }, |
|
||||
], |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
getData() { |
|
||||
//验证表单 |
|
||||
return new Promise((resolve, reject) => { |
|
||||
this.$refs['form'].validate((valid) => { |
|
||||
if (valid) { |
|
||||
resolve(this.form); |
|
||||
} else { |
|
||||
reject(new Error('前检查表单项是否填写正确')) |
|
||||
} |
|
||||
}); |
|
||||
}) |
|
||||
}, |
|
||||
clearForm() { |
|
||||
this.form.phone = ""; |
|
||||
this.form.contacts = ""; |
|
||||
this.form.usePeoples = ""; |
|
||||
this.form.needs = []; |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
.flagShip { |
|
||||
margin-top: 30px; |
|
||||
h2 { |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
.desc { |
|
||||
color: #7D7D7D; |
|
||||
} |
|
||||
.form { |
|
||||
margin-top: 40px; |
|
||||
.inp { |
|
||||
width: 280px; |
|
||||
} |
|
||||
|
|
||||
span { |
|
||||
margin-left: 78px; |
|
||||
color: #7D7D7D; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -1,367 +0,0 @@ |
|||||
.full_continer { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
overflow: hidden; |
|
||||
position: relative; |
|
||||
.banner { |
|
||||
margin-top: 35px; |
|
||||
height: 32px; |
|
||||
text-align: center; |
|
||||
border-bottom: 32px solid; |
|
||||
border-image: -webkit-linear-gradient(-180deg, rgba(255,255,255,0.00) 0%,#D8E0F5 40%, rgba(255,255,255,0.00) 99%) 2 2 2 2; |
|
||||
p { |
|
||||
line-height: 32px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
h2 { |
|
||||
font-size: 28px; |
|
||||
font-family: PingFang SC; |
|
||||
font-weight: bold; |
|
||||
color: #303030; |
|
||||
} |
|
||||
|
|
||||
.flux_continer { |
|
||||
width: 80%; |
|
||||
height: 100%; |
|
||||
margin: 0 auto; |
|
||||
.content { |
|
||||
.top_desc { |
|
||||
h2 { |
|
||||
margin-top: 60px; |
|
||||
} |
|
||||
p { |
|
||||
margin-top: 34px; |
|
||||
color: #7D7D7D; |
|
||||
font-size: 20px; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.version { |
|
||||
margin-top: 38px; |
|
||||
.version_item { |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
.oItem:nth-child(2) { |
|
||||
background-color: #F8F6F4; |
|
||||
} |
|
||||
.oItem { |
|
||||
position: relative; |
|
||||
margin-top: 24px; |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
width: 220px; |
|
||||
height: 110px; |
|
||||
margin-right: 20px; |
|
||||
border-radius: 5px; |
|
||||
background-color: #F4F5F8; |
|
||||
cursor: pointer; |
|
||||
img { |
|
||||
width: 110px; |
|
||||
height: 110px; |
|
||||
} |
|
||||
.desc { |
|
||||
margin-left: 8px; |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
justify-content: center; |
|
||||
align-items: center; |
|
||||
font-size: 16px; |
|
||||
p:nth-child(2) { |
|
||||
margin-top: 8px; |
|
||||
font-size: 14px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.select { |
|
||||
font-size: 30px; |
|
||||
position: absolute; |
|
||||
right: 5px; |
|
||||
top: 2px; |
|
||||
color: #409EFF; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.submit { |
|
||||
margin-top: 35px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
.enterprise { |
|
||||
.sys_type { |
|
||||
margin-top: 52px; |
|
||||
.sys_desc { |
|
||||
display: flex; |
|
||||
height: 46px; |
|
||||
width: 100%; |
|
||||
h2 { |
|
||||
margin-right: 44px; |
|
||||
line-height: 46px; |
|
||||
} |
|
||||
.selectItem { |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
.item { |
|
||||
display: flex; |
|
||||
margin-right: 60px; |
|
||||
height: 46px; |
|
||||
align-items: center; |
|
||||
cursor: pointer; |
|
||||
font-size: 18px; |
|
||||
} |
|
||||
.active { |
|
||||
font-size: 22px; |
|
||||
color: rgb(116, 155, 242); |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
.sys_modules { |
|
||||
margin-top: 30px; |
|
||||
display: flex; |
|
||||
flex-wrap: wrap; |
|
||||
.active { |
|
||||
border: 2px solid rgb(116, 155, 242) !important; |
|
||||
} |
|
||||
.module { |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
background: #FFFFFF; |
|
||||
margin-right: 30px; |
|
||||
margin-top:30px; |
|
||||
.head { |
|
||||
width: 180px; |
|
||||
height: 200px; |
|
||||
border: 1px solid #E3E4E6; |
|
||||
border-radius: 8px; |
|
||||
position: relative; |
|
||||
cursor: pointer; |
|
||||
.module_top { |
|
||||
display: flex; |
|
||||
height: 170px; |
|
||||
flex-direction: column; |
|
||||
justify-content: center; |
|
||||
align-items: center; |
|
||||
text-align: center; |
|
||||
img { |
|
||||
width: 90px; |
|
||||
height: 90px; |
|
||||
margin-top: 20px; |
|
||||
} |
|
||||
span { |
|
||||
color: #606060; |
|
||||
margin-top: 20px; |
|
||||
font-size: 18px; |
|
||||
} |
|
||||
} |
|
||||
.module_bottom { |
|
||||
.selected { |
|
||||
font-size: 30px; |
|
||||
position: absolute; |
|
||||
right: 10px; |
|
||||
top:5px; |
|
||||
color: #409EFF; |
|
||||
} |
|
||||
span{ |
|
||||
font-size: 14px; |
|
||||
position: absolute; |
|
||||
left: 10px; |
|
||||
top: 5px; |
|
||||
color: #409EFF; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
|
|
||||
.footer { |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.buy_count { |
|
||||
margin-top: 32px; |
|
||||
h2 { |
|
||||
span { |
|
||||
font-size: 18px; |
|
||||
margin-left: 5px; |
|
||||
color: #C7C7C7; |
|
||||
} |
|
||||
} |
|
||||
.buy_count_items { |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
margin-top: 30px; |
|
||||
.oItem { |
|
||||
margin-right: 30px; |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
width: 200px; |
|
||||
height: 120px; |
|
||||
border: 2px solid #E3E4E6; |
|
||||
justify-content: center; |
|
||||
border-radius: 6px; |
|
||||
.item_header { |
|
||||
height: 40px; |
|
||||
width: 100%; |
|
||||
text-align: center; |
|
||||
line-height: 30px; |
|
||||
color: #606060; |
|
||||
border-bottom: 2px solid #E3E4E6; |
|
||||
} |
|
||||
.item_bottom { |
|
||||
width: 100%; |
|
||||
text-align: center; |
|
||||
line-height: 60px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.buy_date { |
|
||||
margin-top: 50px; |
|
||||
h2 { |
|
||||
margin-bottom: 30px; |
|
||||
} |
|
||||
.buy_date_items { |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
.oItem { |
|
||||
display: flex; |
|
||||
flex-direction: column; |
|
||||
width: 200px; |
|
||||
height: 144px; |
|
||||
border-radius: 8px; |
|
||||
margin-right: 30px; |
|
||||
border: 2px solid #E3E4E6; |
|
||||
cursor: pointer; |
|
||||
.header { |
|
||||
position: relative; |
|
||||
height: 44px; |
|
||||
width: 100%; |
|
||||
text-align: center; |
|
||||
line-height: 44px; |
|
||||
color: #424141; |
|
||||
border-bottom: 2px solid #E3E4E6; |
|
||||
.select { |
|
||||
font-size: 30px; |
|
||||
position: absolute; |
|
||||
right: 10px; |
|
||||
top: 5px; |
|
||||
color: #409EFF; |
|
||||
} |
|
||||
} |
|
||||
.bottom { |
|
||||
height: 100px; |
|
||||
width: 100%; |
|
||||
position: relative; |
|
||||
display: flex; |
|
||||
justify-content: center; |
|
||||
flex-direction: column; |
|
||||
align-items: center; |
|
||||
img { |
|
||||
width: 113px; |
|
||||
height: 40px; |
|
||||
} |
|
||||
p { |
|
||||
margin-top: 12px; |
|
||||
} |
|
||||
.normal { |
|
||||
margin-top: 57px; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.pay_way { |
|
||||
margin-top: 50px; |
|
||||
h2 { |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
.pay_way_items { |
|
||||
display: flex; |
|
||||
.oItem { |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
align-items: center; |
|
||||
width: 200px; |
|
||||
height: 80px; |
|
||||
margin-right: 30px; |
|
||||
border: 2px solid #E3E4E6; |
|
||||
border-radius: 8px; |
|
||||
margin-top: 5px; |
|
||||
position: relative; |
|
||||
cursor: pointer; |
|
||||
img { |
|
||||
width: 50px; |
|
||||
height: 50px; |
|
||||
margin: 13px 18px 13px 40px; |
|
||||
} |
|
||||
.select { |
|
||||
font-size: 30px; |
|
||||
position: absolute; |
|
||||
right: 5px; |
|
||||
top: 5px; |
|
||||
color: #409EFF; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.phone { |
|
||||
margin-top: 10px !important; |
|
||||
width: 440px; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.pay_allAmount { |
|
||||
margin-top: 30px; |
|
||||
h2 { |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
.allAmount { |
|
||||
font-size: 22px; |
|
||||
font-weight: bold; |
|
||||
color: #FA5A55; |
|
||||
margin-bottom: 20px; |
|
||||
b { |
|
||||
font-size: 38px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
|
|
||||
.avatar-container { |
|
||||
height: 50px; |
|
||||
display: flex; |
|
||||
align-items: center; |
|
||||
.avatar-wrapper { |
|
||||
cursor: pointer; |
|
||||
display: flex; |
|
||||
flex-direction: row; |
|
||||
align-items: center; |
|
||||
.user-avatar { |
|
||||
height: 34px; |
|
||||
width: 34px; |
|
||||
border-radius: 50%; |
|
||||
margin-right: 12px; |
|
||||
} |
|
||||
.username{ |
|
||||
color: #7D7D7D; |
|
||||
font-size: 18px; |
|
||||
margin-right: 2px; |
|
||||
} |
|
||||
.el-icon-caret-bottom { |
|
||||
font-size: 22px; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
@ -1,207 +0,0 @@ |
|||||
<template> |
|
||||
<div class="full_continer"> |
|
||||
<div class="banner"> |
|
||||
<p>购买流程: 1.选择模块 》2.确认订单 》 3.支付 》 4.完成</p> |
|
||||
</div> |
|
||||
|
|
||||
<div class="flux_continer"> |
|
||||
|
|
||||
<orderSkeleton v-if="menuLoading" /> |
|
||||
|
|
||||
<div class="content" v-else> |
|
||||
<div class="top_desc"> |
|
||||
<h2>购买订单</h2> |
|
||||
<p>团队名: {{userInfo.branchName?userInfo.branchName:userInfo.branchId}}</p> |
|
||||
</div> |
|
||||
|
|
||||
<div class="version"> |
|
||||
<h2>选择版本</h2> |
|
||||
<div class="version_item"> |
|
||||
<div @click="selectVersion(item)" class="oItem" v-for="(item, index) in version" :key="index"> |
|
||||
<img :src='item.img'> |
|
||||
<div class="desc"> |
|
||||
<p>{{item.name}}</p> |
|
||||
<p>{{item.desc}}</p> |
|
||||
</div> |
|
||||
<i v-if="item.isChecked" class="select el-icon-success"></i> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
|
|
||||
<div class="version_all"> |
|
||||
<flag-ship ref="flagship" v-if="currentSelectVersion == '旗舰版'"></flag-ship> |
|
||||
<enterprise ref="enterprise" :modules="modules" v-if="currentSelectVersion == '企业版'" :ooper="'1'"></enterprise> |
|
||||
</div> |
|
||||
|
|
||||
<el-button :loading="submitLoading" @click="submitOrder" size="larget" class="submit" type="primary"> |
|
||||
{{currentSelectVersion == '企业版' ? '提交订单' : '提交信息'}} |
|
||||
</el-button> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
|
|
||||
//图标 |
|
||||
import EnterpriseVersionIcon from '@/assets/image/module/mo_enterprise.png' |
|
||||
import FlagShipIcon from '@/assets/image/module/mo_flagship.png' |
|
||||
//组件 |
|
||||
import FlagShip from './flagShip' |
|
||||
import Enterprise from './enterprise' |
|
||||
import orderSkeleton from './components/orderSkeleton' |
|
||||
import {getAllMenuModule, getBuyMenuModule} from '@/api/mdp/sys/modules' |
|
||||
import {modulesOfIcon} from "@/components/ModulesMenu/modulesOfIcon"; |
|
||||
import {createFlagShipOrder} from '@/api/mdp/sys/order'; |
|
||||
|
|
||||
import { mapGetters } from 'vuex' |
|
||||
|
|
||||
export default { |
|
||||
components: {FlagShip, Enterprise, orderSkeleton}, |
|
||||
|
|
||||
computed: { |
|
||||
...mapGetters([ 'userInfo' ]), |
|
||||
|
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
version: [ |
|
||||
{ |
|
||||
name: '企业版', |
|
||||
desc: '(10人起购)', |
|
||||
isChecked: true, |
|
||||
img: EnterpriseVersionIcon |
|
||||
}, |
|
||||
{ |
|
||||
name: '旗舰版', |
|
||||
desc: '(50人起购)', |
|
||||
isChecked: false, |
|
||||
img: FlagShipIcon |
|
||||
} |
|
||||
], |
|
||||
currentSelectVersion: '企业版', |
|
||||
menuLoading: false, |
|
||||
modules: null, |
|
||||
submitLoading: false, |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
selectVersion(item) { |
|
||||
this.currentSelectVersion = item.name; |
|
||||
this.version.forEach(element => { |
|
||||
element.isChecked = false; |
|
||||
if(item.name == element.name) { |
|
||||
element.isChecked = true; |
|
||||
} |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
submitOrder() { |
|
||||
//验证参数 |
|
||||
if(this.currentSelectVersion == "企业版") { |
|
||||
let data = this.$refs.enterprise.getData(); |
|
||||
//验证手机号是否填写 |
|
||||
if(data.phone == "" || data.phone == null || data.phone == undefined) { |
|
||||
this.$notify({ |
|
||||
message: '请输入手机号', |
|
||||
type: 'warning' |
|
||||
}); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
//验证是否同意服务协议 |
|
||||
if(!data.checked) { |
|
||||
this.$notify({ |
|
||||
message: '请先同意服务协议', |
|
||||
type: 'warning' |
|
||||
}); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
//保存购买模块信息到本地 |
|
||||
if(data.moduleIds.length <= 0) { |
|
||||
this.$notify({ |
|
||||
message: '请选择要购买的模块', |
|
||||
type: 'warning' |
|
||||
}); |
|
||||
return |
|
||||
} |
|
||||
|
|
||||
window.localStorage.setItem("BUY_MODULES", JSON.stringify(data)) |
|
||||
this.$router.push('/my/order/create') |
|
||||
}else { |
|
||||
let flagData = this.$refs.flagship.getData(); |
|
||||
flagData.then((res) => { |
|
||||
//创建订单 |
|
||||
res.needs = JSON.stringify(res.needs); |
|
||||
this.submitLoading = true; |
|
||||
createFlagShipOrder(res).then(res => { |
|
||||
if(res.data.tips.isOk){ |
|
||||
this.$notify.success("信息已提交，稍后我们将会联系您"); |
|
||||
this.$refs.flagship.clearForm(); |
|
||||
}else{ |
|
||||
this.$notify.error(res.data.tips.msg); |
|
||||
} |
|
||||
}).catch(err => { |
|
||||
this.$notify.error(err.msg); |
|
||||
}).finally(() => { |
|
||||
this.submitLoading = false; |
|
||||
}) |
|
||||
}).catch(err => { |
|
||||
|
|
||||
}) |
|
||||
|
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
//获取所有模块 |
|
||||
getAllModules() { |
|
||||
this.menuLoading = true |
|
||||
getAllMenuModule({}).then(res => { |
|
||||
let tempData = res.data.data; |
|
||||
tempData.forEach(i=>{ |
|
||||
i.isChecked=false |
|
||||
i.musers=10 |
|
||||
i.isBuy=false |
|
||||
i.endTime='' |
|
||||
}) |
|
||||
getBuyMenuModule({}).then(res2 => { |
|
||||
let branchModules = res2.data.data; |
|
||||
tempData.forEach(k => { |
|
||||
branchModules.forEach(element => { |
|
||||
if(k.id == element.moduleId && element.status=='1') { |
|
||||
k.isBuy = true; |
|
||||
k.musers=element.musers |
|
||||
k.endTime=element.endTime |
|
||||
} |
|
||||
}); |
|
||||
modulesOfIcon.forEach(element => { |
|
||||
if(k.id == element.id) { |
|
||||
k.logoUrl = element.logoUrl; |
|
||||
} |
|
||||
}); |
|
||||
}) |
|
||||
let xmMenus = tempData.filter(res => {return res.mcate == '2'}) |
|
||||
let oaMunus = tempData.filter(res => {return res.mcate == '1'}) |
|
||||
let mallMenus = tempData.filter(res => {return res.mcate == '3'}) |
|
||||
this.modules = { |
|
||||
"xmgl": xmMenus, |
|
||||
"oa" : oaMunus, |
|
||||
"mall": mallMenus |
|
||||
} |
|
||||
}) |
|
||||
}).finally(() => this.menuLoading = false) |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
mounted(){ |
|
||||
this.getAllModules(); |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './index.scss'; |
|
||||
</style> |
|
||||
@ -1,15 +0,0 @@ |
|||||
<template> |
|
||||
<div> |
|
||||
订单列表 |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style> |
|
||||
|
|
||||
</style> |
|
||||
@ -1,65 +0,0 @@ |
|||||
<template> |
|
||||
<div class="result"> |
|
||||
<el-result icon="success"> |
|
||||
<template slot="title"> |
|
||||
<p style="font-size: 24px;">恭喜您，支付成功！</p> |
|
||||
</template> |
|
||||
<template class="subTitle" slot="subTitle"> |
|
||||
<p style="margin-bottom: 6px;font-size: 16px;">您已成功支付￥ {{params.total_amount}} 元</p> |
|
||||
<p style="margin-bottom: 6px;font-size: 16px;">订单号：{{params.out_trade_no}} （查看订单）</p> |
|
||||
</template> |
|
||||
<template slot="extra"> |
|
||||
<el-button type="primary" size="larget" @click="goBuyAgain()">继续购买</el-button> |
|
||||
<el-button size="larget" @click="returnHome()">返回首页</el-button> |
|
||||
</template> |
|
||||
</el-result> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
params: {}, |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
created() { |
|
||||
const href = window.location.href; |
|
||||
this.params = this.urlParamsHash(href); |
|
||||
console.log(this.params, "params"); |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
returnHome() { |
|
||||
this.$router.push({path:'/dashboard'}) |
|
||||
}, |
|
||||
|
|
||||
goBuyAgain() { |
|
||||
this.$router.push({path:'/my/order/index'}) |
|
||||
}, |
|
||||
|
|
||||
urlParamsHash(url) { |
|
||||
var params = {} |
|
||||
var h |
|
||||
var hash = url.slice(url.indexOf('?') + 1).split('&') |
|
||||
for(var i = 0; i < hash.length; i++) { |
|
||||
h = hash[i].split('=') |
|
||||
params[h[0]] = h[1] |
|
||||
} |
|
||||
return params; |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
.result { |
|
||||
height: 600px; |
|
||||
display: flex; |
|
||||
justify-content: center; |
|
||||
align-items: center; |
|
||||
} |
|
||||
|
|
||||
</style> |
|
||||
@ -1,134 +0,0 @@ |
|||||
<template> |
|
||||
<div class="full_continer"> |
|
||||
<div class="banner"> |
|
||||
<p>购买流程: 1.选择模块 》2.确认订单 》 3.支付 》 4.完成</p> |
|
||||
</div> |
|
||||
|
|
||||
<div class="flux_continer"> |
|
||||
|
|
||||
<orderSkeleton v-if="menuLoading" /> |
|
||||
|
|
||||
<div class="content" v-else> |
|
||||
<div class="top_desc"> |
|
||||
<h2>续费订单</h2> |
|
||||
<p>团队名: {{userInfo.branchName?userInfo.branchName:userInfo.branchId}}</p> |
|
||||
</div> |
|
||||
<div class="version_all"> |
|
||||
<enterprise ref="enterprise" :modules="modules" :ooper="'2'"></enterprise> |
|
||||
</div> |
|
||||
<el-button :loading="submitLoading" @click="submitOrder" size="larget" class="submit" type="primary"> |
|
||||
提交订单 |
|
||||
</el-button> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
//组件 |
|
||||
import Enterprise from './enterprise' |
|
||||
import orderSkeleton from './components/orderSkeleton' |
|
||||
import {getAllMenuModule, getBuyMenuModule} from '@/api/mdp/sys/modules' |
|
||||
import {modulesOfIcon} from "@/components/ModulesMenu/modulesOfIcon"; |
|
||||
|
|
||||
import { mapGetters } from 'vuex' |
|
||||
|
|
||||
export default { |
|
||||
components: {Enterprise, orderSkeleton}, |
|
||||
|
|
||||
computed: { |
|
||||
...mapGetters([ 'userInfo' ]), |
|
||||
|
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
menuLoading: false, |
|
||||
modules: null, |
|
||||
submitLoading: false, |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
submitOrder() { |
|
||||
let data = this.$refs.enterprise.getData(); |
|
||||
//验证手机号是否填写 |
|
||||
if(data.phone == "" || data.phone == null || data.phone == undefined) { |
|
||||
this.$notify({ |
|
||||
message: '请输入手机号', |
|
||||
type: 'warning' |
|
||||
}); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
//验证是否同意服务协议 |
|
||||
if(!data.checked) { |
|
||||
this.$notify({ |
|
||||
message: '请先同意服务协议', |
|
||||
type: 'warning' |
|
||||
}); |
|
||||
return; |
|
||||
} |
|
||||
|
|
||||
//保存购买模块信息到本地 |
|
||||
if(data.moduleIds.length <= 0) { |
|
||||
this.$notify({ |
|
||||
message: '请选择要购买的模块', |
|
||||
type: 'warning' |
|
||||
}); |
|
||||
return |
|
||||
} |
|
||||
|
|
||||
window.localStorage.setItem("BUY_MODULES", JSON.stringify(data)) |
|
||||
this.$router.push('/my/order/create') |
|
||||
}, |
|
||||
|
|
||||
//获取所有模块 |
|
||||
getAllModules() { |
|
||||
this.menuLoading = true |
|
||||
getAllMenuModule({}).then(res => { |
|
||||
let tempData = res.data.data; |
|
||||
tempData.forEach(i=>{ |
|
||||
i.isChecked=false |
|
||||
i.musers=10 |
|
||||
i.isBuy=false |
|
||||
i.endTime='' |
|
||||
}) |
|
||||
getBuyMenuModule({}).then(res2 => { |
|
||||
let branchModules = res2.data.data; |
|
||||
tempData.forEach(k => { |
|
||||
branchModules.forEach(element => { |
|
||||
if(k.id == element.moduleId && element.status=='1') { |
|
||||
k.isBuy = true; |
|
||||
k.musers=element.musers |
|
||||
k.endTime=element.endTime |
|
||||
} |
|
||||
}); |
|
||||
modulesOfIcon.forEach(element => { |
|
||||
if(k.id == element.id) { |
|
||||
k.logoUrl = element.logoUrl; |
|
||||
} |
|
||||
}); |
|
||||
}) |
|
||||
let xmMenus = tempData.filter(res => {return res.mcate == '2'}) |
|
||||
let oaMunus = tempData.filter(res => {return res.mcate == '1'}) |
|
||||
let mallMenus = tempData.filter(res => {return res.mcate == '3'}) |
|
||||
this.modules = { |
|
||||
"xmgl": xmMenus, |
|
||||
"oa" : oaMunus, |
|
||||
"mall": mallMenus |
|
||||
} |
|
||||
}) |
|
||||
}).finally(() => this.menuLoading = false) |
|
||||
} |
|
||||
|
|
||||
}, |
|
||||
|
|
||||
mounted(){ |
|
||||
this.getAllModules(); |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss" scoped> |
|
||||
@import './index.scss'; |
|
||||
</style> |
|
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue