|
@@ -1,4 +1,4 @@
|
|
|
-import { Button, Cell, Icon, Image, Popup, Toast } from 'vant'
|
|
|
+import { Button, Cell, Icon, Image, Popup, showConfirmDialog, Toast } from 'vant'
|
|
|
import { defineComponent } from 'vue'
|
|
|
import styles from './index.module.less'
|
|
|
import request from '@/helpers/request'
|
|
@@ -24,29 +24,21 @@ export default defineComponent({
|
|
|
data() {
|
|
|
const query = this.$route.query
|
|
|
return {
|
|
|
- activityId: query.activityId,
|
|
|
- recomUserId: query.recomUserId,
|
|
|
- apiSuffix: state.platformType === 'STUDENT' ? '/api-student' : '/api-teacher',
|
|
|
- agreeStatus: false,
|
|
|
- functionList: [],
|
|
|
- memberList: [],
|
|
|
+ functionList: [] as any,
|
|
|
selectMember: {} as any,
|
|
|
- params: {
|
|
|
- page: 1,
|
|
|
- rows: 20
|
|
|
- }
|
|
|
+ users: {} as any
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
userInfo() {
|
|
|
- const users = state.user.data
|
|
|
+ const users = this.users
|
|
|
+
|
|
|
return {
|
|
|
- username: users?.username,
|
|
|
- phone: users?.phone,
|
|
|
- avatar: users?.heardUrl,
|
|
|
- id: users?.userId,
|
|
|
- memberRankSettingId: users?.memberRankSettingId,
|
|
|
- isVip: users?.isVip,
|
|
|
+ username: users?.nickname || '',
|
|
|
+ phone: users?.phone || '',
|
|
|
+ avatar: users?.avatar,
|
|
|
+ id: users?.id,
|
|
|
+ isVip: users?.vipMember,
|
|
|
membershipDays: users?.membershipDays,
|
|
|
membershipEndTime: users?.membershipEndTime
|
|
|
}
|
|
@@ -54,58 +46,86 @@ export default defineComponent({
|
|
|
},
|
|
|
async mounted() {
|
|
|
try {
|
|
|
- const userInfo = await request.get(
|
|
|
- state.platformType === 'TEACHER'
|
|
|
- ? '/api-teacher/teacher/queryUserInfo'
|
|
|
- : '/api-student/student/queryUserInfo'
|
|
|
- )
|
|
|
- setLogin(userInfo.data)
|
|
|
-
|
|
|
- const res = await request.post(`${this.apiSuffix}/memberPriceSettings/vipPermissions`)
|
|
|
- const result = res.data || []
|
|
|
- this.functionList = result.map((item: any) => {
|
|
|
- return {
|
|
|
- title: item.paramName,
|
|
|
- icon: getAssetsHomeFile(`${item.paramValue}.png`)
|
|
|
+ const userInfo = await request.get('/api-student/student/member')
|
|
|
+ this.users = userInfo.data || {}
|
|
|
+ this.functionList = [
|
|
|
+ {
|
|
|
+ title: '五线谱<br />跟播',
|
|
|
+ icon: getAssetsHomeFile(`1.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '演奏指法<br />跟播',
|
|
|
+ icon: getAssetsHomeFile(`2.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '原声/伴奏<br />切换',
|
|
|
+ icon: getAssetsHomeFile(`3.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '播放速度<br />调整',
|
|
|
+ icon: getAssetsHomeFile(`4.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '五线谱选段<br />播放',
|
|
|
+ icon: getAssetsHomeFile(`5.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '智能评测',
|
|
|
+ icon: getAssetsHomeFile(`6.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '评测报告',
|
|
|
+ icon: getAssetsHomeFile(`7.png`)
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '评测音视频<br />云储存',
|
|
|
+ icon: getAssetsHomeFile(`8.png`)
|
|
|
}
|
|
|
- })
|
|
|
-
|
|
|
- const setting = await request.post(`${this.apiSuffix}/memberPriceSettings/list`, {
|
|
|
- data: {
|
|
|
- activityId: Number(this.activityId),
|
|
|
- userId: this.recomUserId
|
|
|
- }
|
|
|
- })
|
|
|
- const { list, ...more } = setting.data
|
|
|
- const settingResult = list || []
|
|
|
- let settingList: any = []
|
|
|
- settingResult.forEach((item: any) => {
|
|
|
- const tempItem = {
|
|
|
- title: '',
|
|
|
- salePrice: item.salePrice,
|
|
|
- originalPrice: item.originalPrice,
|
|
|
- period: item.period,
|
|
|
- id: item.id,
|
|
|
- discount: item.discount,
|
|
|
- discountPrice: item.discountPrice,
|
|
|
- status: false
|
|
|
- }
|
|
|
-
|
|
|
- tempItem.title = memberType[item.period]
|
|
|
+ ]
|
|
|
|
|
|
- item.period !== 'DAY' && settingList.push(tempItem)
|
|
|
- })
|
|
|
+ const { data } = await request.post(`/api-student/cityFeeSetting/member`)
|
|
|
+ this.selectMember = data
|
|
|
|
|
|
- settingList = settingList ? settingList.reverse() : []
|
|
|
- if (settingList.length > 0) {
|
|
|
- settingList[0].status = true
|
|
|
- this.selectMember = settingList[0]
|
|
|
- }
|
|
|
- console.log(settingList)
|
|
|
- this.memberList = settingList
|
|
|
- } catch {}
|
|
|
+ this.paymentOrderUnpaid()
|
|
|
+ } catch {
|
|
|
+ //
|
|
|
+ }
|
|
|
+ //
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 查询未支付订单
|
|
|
+ async paymentOrderUnpaid() {
|
|
|
+ try {
|
|
|
+ const { data } = await request.get('/api-student/userPaymentOrder/unpaid')
|
|
|
+ // 判断是否有待支付订单
|
|
|
+ if (data.id) {
|
|
|
+ showConfirmDialog({
|
|
|
+ message: '您有待支付的订单,是否继续支付',
|
|
|
+ cancelButtonText: '取消订单',
|
|
|
+ confirmButtonText: '继续支付'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ const paymentConfig = data.paymentConfig
|
|
|
+ this.$router.push({
|
|
|
+ path: '/orderDetail',
|
|
|
+ query: {
|
|
|
+ config: JSON.stringify(paymentConfig.paymentConfig),
|
|
|
+ orderNo: paymentConfig.orderNo
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ .catch(async () => {
|
|
|
+ try {
|
|
|
+ await request.post('/api-student/userPaymentOrder/cancelPayment/' + data.orderNo)
|
|
|
+ } catch {
|
|
|
+ //
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ } catch {
|
|
|
+ //
|
|
|
+ }
|
|
|
+ },
|
|
|
calcSalePrice(item: any) {
|
|
|
// discount
|
|
|
if (item.discount === 1) {
|
|
@@ -114,48 +134,44 @@ export default defineComponent({
|
|
|
}
|
|
|
return item.salePrice
|
|
|
},
|
|
|
- onSubmit() {
|
|
|
- const member: any = this.selectMember
|
|
|
- // 判断是否有会员
|
|
|
- const startTime = this.userInfo.isVip
|
|
|
- ? dayjs(this.userInfo.membershipEndTime).toDate()
|
|
|
- : new Date()
|
|
|
- let endTime = new Date()
|
|
|
- if (member.period === 'MONTH') {
|
|
|
- endTime = dayjs(startTime).add(1, 'month').toDate()
|
|
|
- } else if (member.period === 'QUARTERLY') {
|
|
|
- endTime = dayjs(startTime).add(3, 'month').toDate()
|
|
|
- } else if (member.period === 'YEAR_HALF') {
|
|
|
- endTime = dayjs(startTime).add(6, 'month').toDate()
|
|
|
- } else if (member.period === 'YEAR') {
|
|
|
- endTime = dayjs(startTime).add(1, 'year').toDate()
|
|
|
- }
|
|
|
+ // 购买
|
|
|
+ async onSubmit() {
|
|
|
+ try {
|
|
|
+ const selectMember = this.selectMember
|
|
|
+ const params: any = [
|
|
|
+ {
|
|
|
+ goodsId: selectMember.id,
|
|
|
+ goodsNum: 1,
|
|
|
+ goodsType: 'VIP',
|
|
|
+ paymentCashAmount: selectMember.salePrice, // 现金支付金额
|
|
|
+ paymentCouponAmount: 0 // 优惠券金额
|
|
|
+ }
|
|
|
+ ] // 支付参数
|
|
|
|
|
|
- // orderStatus.orderObject.orderType = 'VIP'
|
|
|
- // orderStatus.orderObject.orderName = '小酷Ai' + member.title
|
|
|
- // orderStatus.orderObject.orderDesc = '小酷Ai' + member.title
|
|
|
- // orderStatus.orderObject.actualPrice = this.calcSalePrice(member)
|
|
|
- // orderStatus.orderObject.recomUserId = this.recomUserId
|
|
|
- // orderStatus.orderObject.activityId = this.activityId
|
|
|
- // orderStatus.orderObject.orderNo = ''
|
|
|
- // orderStatus.orderObject.orderList = [
|
|
|
- // {
|
|
|
- // orderType: 'VIP',
|
|
|
- // goodsName: '小酷Ai' + member.title,
|
|
|
- // id: member.id,
|
|
|
- // title: member.title,
|
|
|
- // price: this.calcSalePrice(member),
|
|
|
- // startTime: dayjs(startTime).format('YYYY-MM-DD'),
|
|
|
- // endTime: dayjs(endTime).format('YYYY-MM-DD'),
|
|
|
- // recomUserId: this.recomUserId
|
|
|
- // }
|
|
|
- // ]
|
|
|
- this.$router.push({
|
|
|
- path: '/orderDetail',
|
|
|
- query: {
|
|
|
- orderType: 'VIP'
|
|
|
- }
|
|
|
- })
|
|
|
+ // 创建订单
|
|
|
+ const { data } = await request.post('/api-student/userPaymentOrder/executeOrder', {
|
|
|
+ data: {
|
|
|
+ orderType: 'VIP',
|
|
|
+ paymentCashAmount: this.selectMember.salePrice || 0,
|
|
|
+ paymentCouponAmount: 0,
|
|
|
+ goodsInfos: params,
|
|
|
+ orderName: '团练宝购买',
|
|
|
+ orderDesc: '团练宝购买'
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ console.log(data)
|
|
|
+ this.$router.push({
|
|
|
+ path: '/orderDetail',
|
|
|
+ query: {
|
|
|
+ config: JSON.stringify(data.paymentConfig),
|
|
|
+ orderNo: data.orderNo
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } catch (e: any) {
|
|
|
+ //
|
|
|
+ console.log(e)
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
render() {
|
|
@@ -185,7 +201,9 @@ export default defineComponent({
|
|
|
src="https://daya.ks3-cn-beijing.ksyun.com/202107/ScSTL1D.png"
|
|
|
/>
|
|
|
)}
|
|
|
- <span class={styles.phone} v-html={`(${this.userInfo.phone})`}></span>
|
|
|
+ {this.userInfo.phone && (
|
|
|
+ <span class={styles.phone} v-html={`(${this.userInfo.phone})`}></span>
|
|
|
+ )}
|
|
|
</div>
|
|
|
),
|
|
|
label: () => (
|
|
@@ -211,30 +229,21 @@ export default defineComponent({
|
|
|
</div>
|
|
|
|
|
|
<div class={styles['system-list']}>
|
|
|
- {this.memberList.map((item: any) => (
|
|
|
- <div
|
|
|
- class={[styles['system-item'], item.status && styles.active]}
|
|
|
- onClick={() => {
|
|
|
- this.memberList.forEach((item: any) => {
|
|
|
- item.status = false
|
|
|
- })
|
|
|
- item.status = true
|
|
|
- this.selectMember = item
|
|
|
- }}
|
|
|
- >
|
|
|
- <div class={styles.discountItem}>
|
|
|
- {item.discount == 1 && <img src={iconDiscount} />}
|
|
|
- </div>
|
|
|
- <p class={styles.title}>{item.title}</p>
|
|
|
+ <div class={[styles['system-item'], styles.active]}>
|
|
|
+ <p class={[styles.title, 'van-hairline--bottom']}>
|
|
|
+ {memberType[this.selectMember.cardType]}
|
|
|
+ <span>(6个月)</span>
|
|
|
+ </p>
|
|
|
+ <div class={styles.priceGroup}>
|
|
|
<p class={styles.price}>
|
|
|
<span>¥</span>
|
|
|
- {moneyFormat(this.calcSalePrice(item), '0,0[.]00')}
|
|
|
+ {moneyFormat(this.selectMember.salePrice)}
|
|
|
</p>
|
|
|
<del class={styles.originalPrice}>
|
|
|
- ¥{moneyFormat(item.originalPrice, '0,0[.]00')}
|
|
|
+ ¥{moneyFormat(this.selectMember.originalPrice)}
|
|
|
</del>
|
|
|
</div>
|
|
|
- ))}
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
@@ -246,26 +255,18 @@ export default defineComponent({
|
|
|
</p>
|
|
|
</div>
|
|
|
|
|
|
- {this.functionList.length > 0 && (
|
|
|
- <div class={styles.memberItem}>
|
|
|
- <div class={styles.title}>会员功能</div>
|
|
|
+ <div class={styles.memberItem}>
|
|
|
+ <div class={styles.title}>会员功能</div>
|
|
|
|
|
|
- <div class={styles.member_function}>
|
|
|
- {this.functionList.map((item: any) => (
|
|
|
- <div class={styles.function_item}>
|
|
|
- <Icon name={item.icon} size={34} />
|
|
|
- <div class={styles.function_text} v-html={item.title}></div>
|
|
|
- </div>
|
|
|
- ))}
|
|
|
- </div>
|
|
|
+ <div class={styles.member_function}>
|
|
|
+ {this.functionList.map((item: any) => (
|
|
|
+ <div class={styles.function_item}>
|
|
|
+ <Icon name={item.icon} size={34} />
|
|
|
+ <div class={styles.function_text} v-html={item.title}></div>
|
|
|
+ </div>
|
|
|
+ ))}
|
|
|
</div>
|
|
|
- )}
|
|
|
-
|
|
|
- {/* <ColProtocol
|
|
|
- v-model={this.agreeStatus}
|
|
|
- showHeader
|
|
|
- style={{ paddingLeft: 0, paddingRight: 0, marginBottom: '64px' }}
|
|
|
- /> */}
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class={styles.btnGroup}>
|
|
|
<div class={styles.priceSection}>
|
|
@@ -288,7 +289,7 @@ export default defineComponent({
|
|
|
class={styles.btn}
|
|
|
onClick={this.onSubmit}
|
|
|
>
|
|
|
- 立即支付
|
|
|
+ 立即开通
|
|
|
</Button>
|
|
|
</div>
|
|
|
</div>
|