修复bug和更改会员界面

This commit is contained in:
yanran200730
2024-10-30 22:01:46 +08:00
parent e920251718
commit 56ee90ed30
6 changed files with 70 additions and 88 deletions

View File

@@ -20,42 +20,15 @@
<div @click="tabIndex = 0, currIndex = 0, getPriceList(1)" :class="[tabIndex === 0 ? 'active' : '']">
<span>金币充值</span>
</div>
<div @click="tabIndex = 1, currIndex = 0" :class="[tabIndex === 1 ? 'active' : '']">
<span>基础功能</span>
<div @click="tabIndex = 1, currIndex = 0, getPriceList(0)" :class="[tabIndex === 1 ? 'active' : '']">
<span>年度会员</span>
</div>
<div @click="tabIndex = 2, currIndex = 0, getPriceList(2)" :class="[tabIndex === 2 ? 'active' : '']">
<span>高级功能</span>
</div>
</div>
<div class="tab-content" v-if="tabIndex === 1">
<div class="title">金币充值</div>
<div class="tab-content__item--wrapper">
<el-form :model="form" label-position="top" ref="form" label-width="100px" class="form" style="width: 100%;">
<el-form-item
prop="mallName"
label="当前绑定店铺"
style="width: 100%;"
:rules="[{ required: true, message: '请先登录拼多多跨境卖家中心', trigger: 'blur' }]">
<el-input readonly placeholder="请先登录拼多多跨境卖家中心" v-model="form.mallName"></el-input>
</el-form-item>
<el-form-item
prop="mallId"
v-show="false"
style="width: 100%;"
:rules="[{ message: '请输入店铺ID', trigger: 'blur' }]">
<el-input placeholder="请输入店铺ID" v-model="form.mallId"></el-input>
</el-form-item>
<el-form-item
prop="code"
label="激活码"
:rules="[{ required: true, message: '请输入激活码', trigger: 'blur' }]">
<el-input placeholder="请输入激活码" v-model="form.code"></el-input>
</el-form-item>
</el-form>
</div>
</div>
<div class="tab-content" v-if="tabIndex === 0">
<div class="title">基础功能</div>
<div class="title">金币充值</div>
<div class="tab-content__item--wrapper">
<div
class="tab-content__item"
@@ -72,7 +45,29 @@
<i>¥</i>
<span>{{ price.originPrice }}</span>
</div>
<p>{{ price.coin }}金币</p>
<p>{{ price.coin }}/每年</p>
</div>
</div>
</div>
<div class="tab-content" v-if="tabIndex === 1">
<div class="title">年度会员</div>
<div class="tab-content__item--wrapper">
<div
class="tab-content__item"
:class="[currIndex === i ? 'active' : '']"
v-for="(price, i) in priceList"
:key="i"
@click="currIndex = i, getQrcode(price)">
<h3>{{ price.title }}</h3>
<div class="price">
<i>¥</i>
<span>{{ price.price }}</span>
</div>
<div class="original-price">
<i>¥</i>
<span>{{ price.originPrice }}</span>
</div>
<!-- <p>{{ price.coin }}/每年</p> -->
</div>
</div>
</div>
@@ -99,8 +94,8 @@
</div>
</div>
</div>
<div class="title" v-if="tabIndex !== 1">支付方式</div>
<div class="bottom" v-if="tabIndex !== 1">
<div class="title">支付方式</div>
<div class="bottom">
<div class="bottom-left">
<div class="code">
<vue-qr v-if="qrcode" :text="qrcode" :size="110" :margin="0" :logoSrc="wechatLogo"/>
@@ -123,15 +118,6 @@
</div>
</div>
</div>
<div class="bottom" v-else>
<div class="bottom-left">
</div>
<div class="bottom-right">
<div class="pay-btn">
<el-button round size="mini" type="warning" @click="onConfirm">确定</el-button>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -203,45 +189,13 @@
}
})
},
show () {
this.isShow = true
},
hide () {
this.isShow = false
},
onConfirm () {
this.$refs.form.validate((valid) => {
if (valid) {
this.$http.post(`/api/coupon/getDetail`, null, {
params: {
code: this.form.code
}
}).then(res => {
if (res.code == 0) {
let msg = this.getMessage(res.data.type);
this.$confirm(msg, '温馨提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'info'
}).then(() => {
this.$http.post(`/api/order/upgradeByCode`, null, {
params: {
...this.form
}
}).then(res => {
if (res.code == 0) {
this.$message.success('激活成功')
this.$store.dispatch('getUserInfo')
this.isShow = false
}
})
})
}
})
}
})
}
}
}
@@ -280,7 +234,7 @@
top: 50%;
left: 50%;
z-index: 11;
min-width: 840px;
min-width: 916px;
// height: 620px;
padding: 40px 40px;
transform: translate(-50%, -50%);

View File

@@ -117,8 +117,10 @@ export const customProvider = function () {
{
tid: 'providerModule1.image',
title: '图片',
data: 'https://foruda.gitee.com/avatar/1677050350324030848/5400665_ccsimple_1591166830.png!avatar200',
type: 'image'
type: 'image',
options: {
src: 'http://lyshunong.oss-cn-beijing.aliyuncs.com/image/material/a6e14259412606502e49f1abd866039.png',
}
}
])
])