增加页面，修改邀请页面名称以及相关跳转
This commit is contained in:
372
me/payOrder/new/index.vue
Normal file
372
me/payOrder/new/index.vue
Normal file
@@ -0,0 +1,372 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<view class="my-stauts main-bg"></view>
|
||||
<view class="u-relative top">
|
||||
<view class="u-absolute u-flex u-row-center u-flex-col color-fff">
|
||||
<view class="u-font-32">积分账户</view>
|
||||
<view class="u-font-60 u-m-t-40 font-bold">{{userInfo.member_points||0}}</view>
|
||||
<view class="u-flex w-full btns u-m-t-60 u-row-between u-text-center">
|
||||
<view class="btn u-p-l-40 u-p-r-40 u-p-t-10 u-p-b-10" @click="$u.route('/pages/user/money/recharge')">去充值
|
||||
</view>
|
||||
<view class="btn u-p-l-40 u-p-r-40 u-p-t-10 u-p-b-10" @click="$u.route('/pages/index/integral/detail')">查看明细
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="w-full" src="/static/image/index/top-bg.png" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="u-flex u-row-between u-p-30" @click="switchPage('/pages/gift/gift')">
|
||||
<view class="u-flex" >
|
||||
<image style="width: 84rpx;" src="/static/image/index/gift.png" mode="widthFix"></image>
|
||||
<view class="u-m-l-20">
|
||||
<view class="color-000 u-font-32">积分抽奖</view>
|
||||
<view class="u-font-24 color-999 u-m-t-10">职分性赏，好礼始不停</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-icon name="arrow-right" color="#999"></u-icon>
|
||||
</view>
|
||||
<view class="u-m-t-50">
|
||||
<view class="u-flex u-row-center ">
|
||||
<view class="u-relative u-flex hot">
|
||||
<image style="width: 48rpx;" src="" mode="widthFix"></image>
|
||||
<view class="u-absolute">
|
||||
<image style="width: 40rpx;" src="" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-l-40 u-p-r-40 sen-text-color u-font-32 font-bold">热门兑换</view>
|
||||
<view class="u-relative u-flex hot" style="transform: rotateY(180deg);">
|
||||
<image style="width: 48rpx;" src="" mode="widthFix"></image>
|
||||
<view class="u-absolute">
|
||||
<image style="width: 40rpx;" src="" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-p-30 like">
|
||||
<view class="u-flex u-flex-wrap u-m-t-24 u-row-between u-p-b-60">
|
||||
<view v-for="(item,index) in goods" @click="toGoods(item)" :key="index" class="item u-flex u-flex-col">
|
||||
<u-image class="image" width="325" height="270" :src="item.cover" mode=""></u-image>
|
||||
<view class="u-p-20 desc">
|
||||
<view class=" color-333 u-font-28 u-line-2" style="min-height: 64rpx;">
|
||||
{{item.pgoods_name}}
|
||||
</view>
|
||||
<view class="u-flex u-m-t-18 u-row-between">
|
||||
<view class="u-flex ">
|
||||
<image style="width: 32rpx;" src="" mode="widthFix"></image>
|
||||
<view class="price u-font-28 font-bold u-m-l-6">
|
||||
{{item.pgoods_price}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-font-24 color-999">{{item.pgoods_storage}}份</view>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-18">
|
||||
<!-- <my-button @click="openTransfer(item)" shape="cirlce" size="mini">立即兑换</my-button> -->
|
||||
<my-button @click="toGoods(item)" shape="cirlce" size="mini">立即兑换</my-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="loveAjax&&!goods.length" class="u-flex u-row-center w-full">
|
||||
<my-empty text="暂无商品"></my-empty>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<image src="@/me/static/ymf/1b3d78fa5f92af069751ea64d493c0d85050b1e03cc5b-tPC378.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/390e926273eea85c894e613d42c9931ee2cd1f0a200fd-ApyNVV.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/79cbb0e34c24915f1883feaa3cf3179b0a1ceb1362a18-unU6xQ.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/cb319b604e49b816971b708b1231321318e0023610d8c-I24hXU.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/cf2d172a6da494b2e577f699254a780907b7c222246d7-ehahn1.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/eaae3095c9e433fb8a015aaebbe52047009dd863ff2b9-igSItK.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/f3c60c6f31c74bdf38ba2d8993bcb443ab9bc335cc875-xfx4CJ.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/c93b4cc9363d52cba140f7239516344ece9388141079a4-do8mFc.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/031da1e7f043de5d5e1ee355994a93e5ec983aca44dc-sZf0Vl_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/c4e6c5023b94de32df2f51d9ebd633790cc6125a88e4-TIyAcR_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/f7da7a8ca57f9f0d56bbb3d7be1d1c86f96304ce4b3a-iVbD8U_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/2e521eee5a8c80ea6879028ee866c5d0531bc4f1d5e48-Bh95lN_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/38cf4e97e52b50be9dcdcdc1352c497e1acc9266cd52-aUOrxn_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/73170e6a596b72538dbe743b06ef8b96e4885aff5b4c3-MsouS7_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/e9f9cb6b95c21c714015f15c372f595367aa553f443a-WpOCNo_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/f5d96faaa94cb0151a5c95db44e27b80ed6eeac5cb32-rApi2S_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/0e114b9ac6afc2b4c0f29520178be64915a111e218a8b5-mbMpg2_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/4783f7272bf31eeafbe1362605477de14b7cd3da24b0-ggkAnW_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/8dce1d3c3a8287c35bc1bf394048d57a64acfa047d4e-6wXnWE_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/ff919b6254e376cc902c89afdcc194ac2ab39c93793b-8TdL1Z_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/3c9a5848127a67f98e25176a042511b89afd31daccc2f-5EHbxD_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/6c9e57bcbcb047039a8edb30ecdd3b912bac99555a8fc-9EK0oO_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/78a020586cfbb791918b767520a8ff3c2ab9660f1ee1b-GX4zcc_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/babf535567728d84346fbb13348e94aae3ec8f82106e2-QKPJoe_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/d1e4d760358ba0733faee6bcad1e23cb4a1d6d76ba290-O3hUrf_fw240webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/dcb5a4b0b1060b569f9fc618e6e2708b584f7def1cadf-R7jpIr_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/e4330f184149f502f4948ce3b60059edaffc9c3d94ca4-B11p5c_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/fa22e2a27871e5f8841e8abb12cc4347a6b9440816068-3XsAnJ_fw658webp.webp" mode=""></image>
|
||||
</view>
|
||||
<u-modal title="" @confirm="confirm(i,e)" v-model="show" :show-cancel-button="true" cancel-color="#A3A3A3"
|
||||
confirm-color="#f9c687" cancel-text="取消兑换" confirm-text="确认兑换" mode="center">
|
||||
<view class="font-bold u-font-30 u-text-center u-p-30">
|
||||
是否使用{{selGoods.goodPrice||0}}积分兑换权益
|
||||
</view>
|
||||
</u-modal>
|
||||
<u-toast ref="uToast"></u-toast>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
page: 1,
|
||||
selGoods: '',
|
||||
show: false,
|
||||
goods: [],
|
||||
tuanAjax: false,
|
||||
loveAjax: false,
|
||||
userInfo:{
|
||||
member_points:100
|
||||
}
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
},
|
||||
watch: {
|
||||
userInfo(newValue, oldValue) {
|
||||
console.log('user change');
|
||||
if(oldValue==''){
|
||||
this.getuser()
|
||||
}
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.init()
|
||||
uni.stopPullDownRefresh()
|
||||
},
|
||||
onLoad() {
|
||||
},
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
init(){
|
||||
this.getuser()
|
||||
this.page = 1
|
||||
this.getGoods()
|
||||
this.addressList()
|
||||
},
|
||||
wxLogin(){
|
||||
const _this=this
|
||||
uni.getProvider({
|
||||
service: 'oauth',
|
||||
success: (res) => {
|
||||
if (~res.provider.indexOf('weixin')) { //支持微信、qq和微博等
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
"onlyAuthorize": false, // 微信登录仅请求授权认证
|
||||
success: (loginRes) => {
|
||||
uni.getUserInfo({
|
||||
provider: 'weixin',
|
||||
success: (userInfoRes) => {
|
||||
let obj = {
|
||||
code: loginRes.code,
|
||||
// rawData: userInfoRes
|
||||
// .rawData,
|
||||
signature: userInfoRes
|
||||
.signature,
|
||||
iv: userInfoRes
|
||||
.iv,
|
||||
encryptedData: userInfoRes
|
||||
.encryptedData,
|
||||
}
|
||||
console.log(obj);
|
||||
this.$api({
|
||||
url: this.$url.user.login,
|
||||
method:'POST',
|
||||
data: obj
|
||||
}).then(res=>{
|
||||
uni.setStorageSync('token', res.data
|
||||
.token)
|
||||
uni.setStorageSync('userInfo', res
|
||||
.data.userinfo)
|
||||
_this.init()
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log(
|
||||
'获取信息失败',
|
||||
err);
|
||||
}
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('获取信息失败', err);
|
||||
}
|
||||
})
|
||||
} else {
|
||||
console.log('请先安装微信APP');
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('请先安装微信APP', err);
|
||||
}
|
||||
})
|
||||
},
|
||||
getuser(){
|
||||
this.$api({
|
||||
url: 'index/user'
|
||||
}).then(res => {
|
||||
this.userInfo = res.data.user
|
||||
})
|
||||
},
|
||||
addressList() {
|
||||
this.$api({
|
||||
url: this.$url.addressList.addressList
|
||||
}).then(res => {
|
||||
this.arr = res.data.addresslist
|
||||
})
|
||||
},
|
||||
getGoods() {
|
||||
this.$api({
|
||||
url: this.$url.index.index
|
||||
}).then(res => {
|
||||
this.goods = (res.data.pointgoodslist || []).map(v=>{
|
||||
return {...v,cover:this.$config.serveImgUrl+v.pgoods_image}
|
||||
})
|
||||
})
|
||||
},
|
||||
confirm(i, e) {
|
||||
this.$api({
|
||||
url: this.$url.exchange.exchange,
|
||||
method: "POST",
|
||||
data: {
|
||||
id: this.selGoods.pgoods_id,
|
||||
aid: this.arr?.[0]?.address_id || '',
|
||||
// pointoa_telphone: this.arr?.[0]?.address_tel_phone || ''
|
||||
}
|
||||
}).then(res => {
|
||||
console.log('dh', res)
|
||||
this.$refs.uToast.show({
|
||||
title: res.info,
|
||||
type: res.code == 1 ? 'success' : 'error',
|
||||
back: res.code == 1 ? true : false
|
||||
})
|
||||
})
|
||||
},
|
||||
openTransfer(item) {
|
||||
this.selGoods = item
|
||||
this.show = true
|
||||
},
|
||||
toGoods(item) {
|
||||
console.log(item);
|
||||
this.$u.route({
|
||||
url: '/pages/goods/goods',
|
||||
params: {
|
||||
id: item.pgoods_id
|
||||
}
|
||||
})
|
||||
},
|
||||
toCate(i, item) {
|
||||
// this.$u.route('/pages/index/flash?type='+i+'&id='+item.id)
|
||||
this.$u.route({
|
||||
url: '/pages/index/changci',
|
||||
params: {
|
||||
...item,
|
||||
type: i
|
||||
}
|
||||
})
|
||||
},
|
||||
changeKey(key, val) {
|
||||
this[key] = val
|
||||
},
|
||||
toPage(item) {
|
||||
const {
|
||||
url,
|
||||
type
|
||||
} = item
|
||||
if (type) {
|
||||
uni.switchTab({
|
||||
url
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.hot {
|
||||
.u-absolute {
|
||||
left: 24rpx;
|
||||
top: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.btns {
|
||||
padding-left: 100rpx;
|
||||
padding-right: 100rpx;
|
||||
|
||||
.btn {
|
||||
border: 1px solid #fff;
|
||||
border-radius: 100rpx;
|
||||
min-width: 200rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.u-font-60 {
|
||||
font-size: 60rpx;
|
||||
}
|
||||
|
||||
.top {
|
||||
.u-absolute {
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.goods {
|
||||
.color-000 {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.u-absolute {
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.color-s-white {
|
||||
color: #FCFCFC;
|
||||
}
|
||||
|
||||
.like {
|
||||
.item {
|
||||
margin-bottom: 40rpx;
|
||||
|
||||
.desc {
|
||||
width: 325rpx;
|
||||
|
||||
.tag {
|
||||
padding: 10rpx;
|
||||
border-radius: 8rpx;
|
||||
background-color: #A792E2;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #C45243;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.w-50 {
|
||||
width: 50%;
|
||||
}
|
||||
</style>
|
||||
689
me/payOrder/new/newindex.vue
Normal file
689
me/payOrder/new/newindex.vue
Normal file
@@ -0,0 +1,689 @@
|
||||
<template>
|
||||
<view class="template-default">
|
||||
<!-- 顶部自定义导航 -->
|
||||
<tn-nav-bar fixed alpha customBack>
|
||||
<view slot="back" class='tn-custom-nav-bar__back'
|
||||
@click="goBack">
|
||||
<text class='icon tn-icon-left'></text>
|
||||
<text class='icon tn-icon-home-capsule-fill'></text>
|
||||
</view>
|
||||
</tn-nav-bar>
|
||||
<view>
|
||||
<image src="@/me/static/ymf/1b3d78fa5f92af069751ea64d493c0d85050b1e03cc5b-tPC378.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/390e926273eea85c894e613d42c9931ee2cd1f0a200fd-ApyNVV.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/79cbb0e34c24915f1883feaa3cf3179b0a1ceb1362a18-unU6xQ.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/cb319b604e49b816971b708b1231321318e0023610d8c-I24hXU.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/cf2d172a6da494b2e577f699254a780907b7c222246d7-ehahn1.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/eaae3095c9e433fb8a015aaebbe52047009dd863ff2b9-igSItK.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/f3c60c6f31c74bdf38ba2d8993bcb443ab9bc335cc875-xfx4CJ.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/c93b4cc9363d52cba140f7239516344ece9388141079a4-do8mFc.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/031da1e7f043de5d5e1ee355994a93e5ec983aca44dc-sZf0Vl_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/c4e6c5023b94de32df2f51d9ebd633790cc6125a88e4-TIyAcR_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/f7da7a8ca57f9f0d56bbb3d7be1d1c86f96304ce4b3a-iVbD8U_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/2e521eee5a8c80ea6879028ee866c5d0531bc4f1d5e48-Bh95lN_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/38cf4e97e52b50be9dcdcdc1352c497e1acc9266cd52-aUOrxn_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/73170e6a596b72538dbe743b06ef8b96e4885aff5b4c3-MsouS7_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/e9f9cb6b95c21c714015f15c372f595367aa553f443a-WpOCNo_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/f5d96faaa94cb0151a5c95db44e27b80ed6eeac5cb32-rApi2S_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/0e114b9ac6afc2b4c0f29520178be64915a111e218a8b5-mbMpg2_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/4783f7272bf31eeafbe1362605477de14b7cd3da24b0-ggkAnW_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/8dce1d3c3a8287c35bc1bf394048d57a64acfa047d4e-6wXnWE_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/ff919b6254e376cc902c89afdcc194ac2ab39c93793b-8TdL1Z_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/3c9a5848127a67f98e25176a042511b89afd31daccc2f-5EHbxD_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/6c9e57bcbcb047039a8edb30ecdd3b912bac99555a8fc-9EK0oO_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/78a020586cfbb791918b767520a8ff3c2ab9660f1ee1b-GX4zcc_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/babf535567728d84346fbb13348e94aae3ec8f82106e2-QKPJoe_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/d1e4d760358ba0733faee6bcad1e23cb4a1d6d76ba290-O3hUrf_fw240webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/dcb5a4b0b1060b569f9fc618e6e2708b584f7def1cadf-R7jpIr_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/e4330f184149f502f4948ce3b60059edaffc9c3d94ca4-B11p5c_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/fa22e2a27871e5f8841e8abb12cc4347a6b9440816068-3XsAnJ_fw658webp.webp" mode=""></image>
|
||||
</view>
|
||||
|
||||
<view class="wrapper">
|
||||
<view class="candles">
|
||||
<view class="light__wave"></view>
|
||||
<view class="candle1">
|
||||
<view class="candle1__body">
|
||||
<view class="candle1__eyes">
|
||||
<view class="candle1__eyes-one"></view>
|
||||
<view class="candle1__eyes-two"></view>
|
||||
</view>
|
||||
<view class="candle1__mouth"></view>
|
||||
</view>
|
||||
<view class="candle1__stick"></view>
|
||||
</view>
|
||||
<view class="candle2">
|
||||
<view class="candle2__body">
|
||||
<view class="candle2__eyes">
|
||||
<view class="candle2__eyes-one"></view>
|
||||
<view class="candle2__eyes-two"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="candle2__stick"></view>
|
||||
</view>
|
||||
<view class="candle2__fire"></view>
|
||||
<view class="sparkles-one"></view>
|
||||
<view class="sparkles-two"></view>
|
||||
<view class="candle__smoke-one">
|
||||
</view>
|
||||
<view class="candle__smoke-two">
|
||||
</view>
|
||||
</view>
|
||||
<view class="floor">
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="text-shine tn-flex tn-flex-row-center tn-text-xxl tn-text-bold" style="margin-top: 60vh;">
|
||||
这里空空如也
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import template_page_mixin from '@/libs/mixin/template_page_mixin.js'
|
||||
export default {
|
||||
name: 'TemplateDefault',
|
||||
mixins: [template_page_mixin],
|
||||
data(){
|
||||
return {}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.template-default{
|
||||
}
|
||||
|
||||
|
||||
/* 胶囊*/
|
||||
.tn-custom-nav-bar__back {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
background-color: rgba(0, 0, 0, 0.15);
|
||||
border-radius: 1000rpx;
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.5);
|
||||
color: #FFFFFF;
|
||||
font-size: 18px;
|
||||
|
||||
.icon {
|
||||
display: block;
|
||||
flex: 1;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: " ";
|
||||
width: 1rpx;
|
||||
height: 110%;
|
||||
position: absolute;
|
||||
top: 22.5%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
transform: scale(0.5);
|
||||
transform-origin: 0 0;
|
||||
pointer-events: none;
|
||||
box-sizing: border-box;
|
||||
opacity: 0.7;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
/* 蜡烛 start*/
|
||||
.wrapper {
|
||||
background: red;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: scale(1.5, 1.5) translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.floor {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 350px;
|
||||
height: 5px;
|
||||
background: #673C63;
|
||||
transform: translate(-50%, -50%);
|
||||
box-shadow: 0px 2px 5px #111;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.candles {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 250px;
|
||||
height: 150px;
|
||||
transform: translate(-50%, -100%);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.candle1 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 35px;
|
||||
height: 100px;
|
||||
background: #fff;
|
||||
border: 3px solid #673C63;
|
||||
border-bottom: 0px;
|
||||
border-radius: 3px;
|
||||
transform-origin: center right;
|
||||
transform: translate(60%, -25%);
|
||||
box-shadow: -2px 0px 0px #95c6f2 inset;
|
||||
animation: expand-body 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle1__stick, .candle2__stick {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
width: 3px;
|
||||
height: 15px;
|
||||
background: #673C63;
|
||||
border-radius: 8px;
|
||||
transform: translate(-50%, -100%);
|
||||
}
|
||||
|
||||
.candle2__stick {
|
||||
height: 12px;
|
||||
transform-origin: bottom center;
|
||||
animation: stick-animation 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle1__eyes, .candle2__eyes {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
width: 35px;
|
||||
height: 30px;
|
||||
transform: translate(-50%, 0%);
|
||||
}
|
||||
|
||||
.candle1__eyes-one {
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 20%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 100%;
|
||||
background: #673C63;
|
||||
transform: translate(-70%, 0%);
|
||||
animation: blink-eyes 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle1__eyes-two {
|
||||
position: absolute;
|
||||
left: 70%;
|
||||
top: 20%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 100%;
|
||||
background: #673C63;
|
||||
transform: translate(-70%, 0%);
|
||||
animation: blink-eyes 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle1__mouth {
|
||||
position: absolute;
|
||||
left: 40%;
|
||||
top: 20%;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
border-radius: 20px;
|
||||
background: #673C63;
|
||||
transform: translate(-50%, -50%);
|
||||
animation: uff 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle__smoke-one {
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 50%;
|
||||
width: 30px;
|
||||
height: 3px;
|
||||
background: grey;
|
||||
transform: translate(-50%, -50%);
|
||||
animation: move-left 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle__smoke-two {
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 40%;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 10px;
|
||||
background: grey;
|
||||
transform: translate(-50%, -50%);
|
||||
animation: move-top 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle2 {
|
||||
position: absolute;
|
||||
left: 20%;
|
||||
top: 65%;
|
||||
width: 47px;
|
||||
height: 60px;
|
||||
background: #fff;
|
||||
border: 3px solid #673C63;
|
||||
border-bottom: 0px;
|
||||
border-radius: 3px;
|
||||
transform: translate(60%, -15%);
|
||||
transform-origin: center right;
|
||||
box-shadow: -2px 0px 0px #95c6f2 inset;
|
||||
animation: shake-left 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle2__eyes-one {
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 50%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
display: inline-block;
|
||||
border: 0px solid #673C63;
|
||||
border-radius: 100%;
|
||||
float: left;
|
||||
background: #673C63;
|
||||
transform: translate(-80%, 0%);
|
||||
animation: changeto-lower 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle2__eyes-two {
|
||||
position: absolute;
|
||||
left: 70%;
|
||||
top: 50%;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
display: inline-block;
|
||||
border: 0px solid #673C63;
|
||||
border-radius: 100%;
|
||||
float: left;
|
||||
background: #673C63;
|
||||
transform: translate(-80%, 0%);
|
||||
animation: changeto-greater 3s infinite linear;
|
||||
}
|
||||
|
||||
.light__wave {
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left: 35%;
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
border-radius: 100%;
|
||||
z-index: 0;
|
||||
transform: translate(-25%, -50%) scale(2.5, 2.5);
|
||||
border: 2px solid rgba(255, 255, 255, 0.2);
|
||||
animation: expand-light 3s infinite linear;
|
||||
}
|
||||
|
||||
.candle2__fire {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 40%;
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 20px;
|
||||
border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
|
||||
background: #FF9800;
|
||||
transform: translate(-50%, -50%);
|
||||
animation: dance-fire 3s infinite linear;
|
||||
}
|
||||
|
||||
@keyframes blink-eyes {
|
||||
0%,35% {
|
||||
opacity: 1;
|
||||
transform: translate(-70%, 0%);
|
||||
}
|
||||
36%,39% {
|
||||
opacity: 0;
|
||||
transform: translate(-70%, 0%);
|
||||
}
|
||||
40% {
|
||||
opacity: 1;
|
||||
transform: translate(-70%, 0%);
|
||||
}
|
||||
50%,65% {
|
||||
transform: translate(-140%, 0%);
|
||||
}
|
||||
66% {
|
||||
transform: translate(-70%, 0%);
|
||||
}
|
||||
}
|
||||
@keyframes expand-body {
|
||||
0%,40% {
|
||||
transform: scale(1, 1) translate(60%, -25%);
|
||||
}
|
||||
45%,55% {
|
||||
transform: scale(1.1, 1.1) translate(60%, -28%);
|
||||
}
|
||||
60% {
|
||||
transform: scale(0.89, 0.89) translate(60%, -25%);
|
||||
}
|
||||
65% {
|
||||
transform: scale(1, 1) translate(60%, -25%);
|
||||
}
|
||||
70% {
|
||||
transform: scale(0.95, 0.95) translate(60%, -25%);
|
||||
}
|
||||
75% {
|
||||
transform: scale(1, 1) translate(60%, -25%);
|
||||
}
|
||||
}
|
||||
@keyframes uff {
|
||||
0%,40% {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
50%,54% {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
left: 30%;
|
||||
}
|
||||
59% {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
left: 20%;
|
||||
}
|
||||
62% {
|
||||
width: 2px;
|
||||
height: 2px;
|
||||
left: 20%;
|
||||
}
|
||||
67% {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
left: 30%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes move-left {
|
||||
0%,59%,100% {
|
||||
width: 0px;
|
||||
left: 40%;
|
||||
}
|
||||
60% {
|
||||
width: 30px;
|
||||
left: 30%;
|
||||
}
|
||||
68% {
|
||||
width: 0px;
|
||||
left: 20%;
|
||||
}
|
||||
}
|
||||
@keyframes move-top {
|
||||
0%,64%,100% {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 0%;
|
||||
}
|
||||
65% {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
top: 40%;
|
||||
left: 40%;
|
||||
}
|
||||
80% {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
top: 20%;
|
||||
}
|
||||
}
|
||||
@keyframes shake-left {
|
||||
0%,40% {
|
||||
left: 20%;
|
||||
transform: translate(60%, -15%);
|
||||
}
|
||||
50%,54% {
|
||||
left: 20%;
|
||||
transform: translate(60%, -15%);
|
||||
}
|
||||
59% {
|
||||
left: 20%;
|
||||
transform: translate(60%, -15%);
|
||||
}
|
||||
62% {
|
||||
left: 18%;
|
||||
transform: translate(60%, -15%);
|
||||
}
|
||||
65% {
|
||||
left: 21%;
|
||||
transform: translate(60%, -15%);
|
||||
}
|
||||
67% {
|
||||
left: 20%;
|
||||
transform: translate(60%, -15%);
|
||||
}
|
||||
75% {
|
||||
left: 20%;
|
||||
transform: scale(1.15, 0.85) translate(60%, -15%);
|
||||
background: #fff;
|
||||
border-color: #673C63;
|
||||
}
|
||||
91% {
|
||||
left: 20%;
|
||||
transform: scale(1.18, 0.82) translate(60%, -10%);
|
||||
background: #F44336;
|
||||
border-color: #F44336;
|
||||
box-shadow: -2px 0px 0px #F44336 inset;
|
||||
}
|
||||
92% {
|
||||
left: 20%;
|
||||
transform: scale(0.85, 1.15) translate(60%, -15%);
|
||||
}
|
||||
95% {
|
||||
left: 20%;
|
||||
transform: scale(1.05, 0.95) translate(60%, -15%);
|
||||
}
|
||||
97% {
|
||||
left: 20%;
|
||||
transform: scale(1, 1) translate(60%, -15%);
|
||||
}
|
||||
}
|
||||
@keyframes stick-animation {
|
||||
0%,40% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: translate(-50%, -100%);
|
||||
}
|
||||
50%,54% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: translate(-50%, -100%);
|
||||
}
|
||||
59% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: translate(-50%, -100%);
|
||||
}
|
||||
62% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: rotateZ(-15deg) translate(-50%, -100%);
|
||||
}
|
||||
65% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: rotateZ(15deg) translate(-50%, -100%);
|
||||
}
|
||||
70% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: rotateZ(-5deg) translate(-50%, -100%);
|
||||
}
|
||||
72% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: rotateZ(5deg) translate(-50%, -100%);
|
||||
}
|
||||
74%,84% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: rotateZ(0deg) translate(-50%, -100%);
|
||||
}
|
||||
85% {
|
||||
transform: rotateZ(180deg) translate(0%, 120%);
|
||||
}
|
||||
92% {
|
||||
left: 50%;
|
||||
top: 0%;
|
||||
transform: translate(-50%, -100%);
|
||||
}
|
||||
}
|
||||
@keyframes expand-light {
|
||||
10%,29%,59%,89% {
|
||||
transform: translate(-25%, -50%) scale(0, 0);
|
||||
border: 2px solid rgba(255, 255, 255, 0);
|
||||
}
|
||||
90%,20%,50% {
|
||||
transform: translate(-25%, -50%) scale(1, 1);
|
||||
}
|
||||
95%,96%,26%,27%,56%,57% {
|
||||
transform: translate(-25%, -50%) scale(2, 2);
|
||||
border: 2px solid rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
0%,28%,58%,100% {
|
||||
transform: translate(-25%, -50%) scale(2.5, 2.5);
|
||||
border: 2px solid rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
}
|
||||
@keyframes dance-fire {
|
||||
59%,89% {
|
||||
left: 40%;
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
90%,0%,7%,15%,23%,31%,39%,47%,55% {
|
||||
left: 40.8%;
|
||||
width: 16px;
|
||||
height: 20px;
|
||||
background: #FFC107;
|
||||
}
|
||||
94%,3%,11%,19%,27%,35%,43%,51%,58% {
|
||||
left: 41.2%;
|
||||
width: 16px;
|
||||
height: 20px;
|
||||
background: #FF9800;
|
||||
}
|
||||
}
|
||||
@keyframes changeto-lower {
|
||||
0%,70%,90% {
|
||||
padding: 0px;
|
||||
display: inline-block;
|
||||
border-radius: 100%;
|
||||
background: #673C63;
|
||||
border-width: 0 0 0 0;
|
||||
border: 0px solid #673C63;
|
||||
transform: translate(-90%, 0%);
|
||||
}
|
||||
71%,89% {
|
||||
background: none;
|
||||
border: solid #673C63;
|
||||
border-radius: 0px;
|
||||
border-width: 0 2px 2px 0;
|
||||
display: inline-block;
|
||||
padding: 1px;
|
||||
float: left;
|
||||
transform-origin: bottom left;
|
||||
transform: rotate(-45deg) translate(-50%, -65%);
|
||||
-webkit-transform: rotate(-45deg) translate(-50%, -65%);
|
||||
}
|
||||
}
|
||||
@keyframes changeto-greater {
|
||||
0%,70%,90% {
|
||||
top: 50%;
|
||||
padding: 0px;
|
||||
display: inline-block;
|
||||
border-radius: 100%;
|
||||
background: #673C63;
|
||||
border-width: 0 0 0 0;
|
||||
border: 0px solid #673C63;
|
||||
transform: translate(-80%, 0%);
|
||||
}
|
||||
71%,89% {
|
||||
top: 30%;
|
||||
background: none;
|
||||
border: solid #673C63;
|
||||
border-radius: 0px;
|
||||
border-width: 0 2px 2px 0;
|
||||
display: inline-block;
|
||||
padding: 1px;
|
||||
float: left;
|
||||
transform-origin: bottom left;
|
||||
transform: rotate(135deg) translate(-80%, 20%);
|
||||
-webkit-transform: rotate(135deg) translate(-80%, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
/*敬请期待 start*/
|
||||
.text-shine {
|
||||
background: linear-gradient(to right, #080808 0, #fff 10%, #080808 20%);
|
||||
background-position: 0;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
animation: shine 4s infinite linear;
|
||||
animation-fill-mode: forwards;
|
||||
-webkit-text-size-adjust: none;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
@-moz-keyframes shine {
|
||||
0% {
|
||||
background-position: 0;
|
||||
}
|
||||
60% {
|
||||
background-position: 280px;
|
||||
}
|
||||
100% {
|
||||
background-position: 280px;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes shine {
|
||||
0% {
|
||||
background-position: 0;
|
||||
}
|
||||
60% {
|
||||
background-position: 280px;
|
||||
}
|
||||
100% {
|
||||
background-position: 280px;
|
||||
}
|
||||
}
|
||||
@-o-keyframes shine {
|
||||
0% {
|
||||
background-position: 0;
|
||||
}
|
||||
60% {
|
||||
background-position: 280px;
|
||||
}
|
||||
100% {
|
||||
background-position: 280px;
|
||||
}
|
||||
}
|
||||
@keyframes shine {
|
||||
0% {
|
||||
background-position: 0;
|
||||
}
|
||||
60% {
|
||||
background-position: 280px;
|
||||
}
|
||||
100% {
|
||||
background-position: 280px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -1,31 +1,63 @@
|
||||
<template>
|
||||
<view style="padding: 20rpx 0;">
|
||||
<view class="u-p-l-20 u-p-r-20">
|
||||
|
||||
<!-- <view>
|
||||
<image src="@/me/static/ymf/1b3d78fa5f92af069751ea64d493c0d85050b1e03cc5b-tPC378.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/390e926273eea85c894e613d42c9931ee2cd1f0a200fd-ApyNVV.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/79cbb0e34c24915f1883feaa3cf3179b0a1ceb1362a18-unU6xQ.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/cb319b604e49b816971b708b1231321318e0023610d8c-I24hXU.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/cf2d172a6da494b2e577f699254a780907b7c222246d7-ehahn1.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/eaae3095c9e433fb8a015aaebbe52047009dd863ff2b9-igSItK.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/f3c60c6f31c74bdf38ba2d8993bcb443ab9bc335cc875-xfx4CJ.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/c93b4cc9363d52cba140f7239516344ece9388141079a4-do8mFc.png" mode=""></image>
|
||||
<image src="@/me/static/ymf/031da1e7f043de5d5e1ee355994a93e5ec983aca44dc-sZf0Vl_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/c4e6c5023b94de32df2f51d9ebd633790cc6125a88e4-TIyAcR_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/f7da7a8ca57f9f0d56bbb3d7be1d1c86f96304ce4b3a-iVbD8U_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/2e521eee5a8c80ea6879028ee866c5d0531bc4f1d5e48-Bh95lN_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/38cf4e97e52b50be9dcdcdc1352c497e1acc9266cd52-aUOrxn_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/73170e6a596b72538dbe743b06ef8b96e4885aff5b4c3-MsouS7_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/e9f9cb6b95c21c714015f15c372f595367aa553f443a-WpOCNo_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/f5d96faaa94cb0151a5c95db44e27b80ed6eeac5cb32-rApi2S_fw1200.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/0e114b9ac6afc2b4c0f29520178be64915a111e218a8b5-mbMpg2_fw1200.jpg" mode=""></image>
|
||||
<image src="@/me/static/ymf/4783f7272bf31eeafbe1362605477de14b7cd3da24b0-ggkAnW_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/8dce1d3c3a8287c35bc1bf394048d57a64acfa047d4e-6wXnWE_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/ff919b6254e376cc902c89afdcc194ac2ab39c93793b-8TdL1Z_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/3c9a5848127a67f98e25176a042511b89afd31daccc2f-5EHbxD_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/6c9e57bcbcb047039a8edb30ecdd3b912bac99555a8fc-9EK0oO_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/78a020586cfbb791918b767520a8ff3c2ab9660f1ee1b-GX4zcc_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/babf535567728d84346fbb13348e94aae3ec8f82106e2-QKPJoe_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/d1e4d760358ba0733faee6bcad1e23cb4a1d6d76ba290-O3hUrf_fw240webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/dcb5a4b0b1060b569f9fc618e6e2708b584f7def1cadf-R7jpIr_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/e4330f184149f502f4948ce3b60059edaffc9c3d94ca4-B11p5c_fw658webp.webp" mode=""></image>
|
||||
<image src="@/me/static/ymf/fa22e2a27871e5f8841e8abb12cc4347a6b9440816068-3XsAnJ_fw658webp.webp" mode=""></image>
|
||||
</view> -->
|
||||
|
||||
<!-- 视频简介 -->
|
||||
<view class="info flex align-center justify-center">
|
||||
<view class="info-box flex align-center">
|
||||
<view class="info-box-l">
|
||||
<view class="ymf-info flex align-center justify-center">
|
||||
<view class="ymf-info-box flex align-center">
|
||||
<view class="ymf-info-box-l">
|
||||
<image :src="titleImg" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="info-box-r">
|
||||
<view class="info-box-r-t">
|
||||
<view class="ymf-info-box-r">
|
||||
<view class="ymf-info-box-r-t">
|
||||
{{type==1?name:courseDetailsName}}
|
||||
</view>
|
||||
<view class="info-box-r-b flex align-center" v-if="type == 1">
|
||||
<view class="ymf-info-box-r-b flex align-center" v-if="type == 1">
|
||||
全集价格：
|
||||
<view class="flex align-center">
|
||||
<image style="width: 38rpx;height: 38rpx;margin-right: 10rpx;"
|
||||
src="../../static/images/me/jindou.png" mode="">
|
||||
</image>
|
||||
{{parsePrice(zongPrice)}}
|
||||
{{ymfparsePrice(zongPrice)}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-box-r-b flex align-center" v-else>
|
||||
<view class="ymf-info-box-r-b flex align-center" v-else>
|
||||
单集价格：
|
||||
<view class="flex align-center">
|
||||
<image style="width: 38rpx;height: 38rpx;margin-right: 10rpx;"
|
||||
src="../../static/images/me/jindou.png" mode="">
|
||||
</image>
|
||||
{{parsePrice(price)}}
|
||||
{{ymfparsePrice(price)}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -41,13 +73,13 @@
|
||||
<image style="width: 38rpx;height: 38rpx;margin-right: 10rpx;"
|
||||
src="../../static/images/me/jindou.png" mode="">
|
||||
</image>
|
||||
{{parsePrice(zongPrice)}}
|
||||
{{ymfparsePrice(zongPrice)}}
|
||||
</view>
|
||||
<view class="price-box-price flex align-center" v-else>
|
||||
<image style="width: 38rpx;height: 38rpx;margin-right: 10rpx;"
|
||||
src="../../static/images/me/jindou.png" mode="">
|
||||
</image>
|
||||
{{parsePrice(price)}}
|
||||
{{ymfparsePrice(price)}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -71,19 +103,19 @@
|
||||
</u-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="illustrate flex align-center justify-center">
|
||||
<view class="illustrate-box flex align-center">
|
||||
<view class="ymf-illustrate flex align-center justify-center">
|
||||
<view class="ymf-illustrate-box flex align-center">
|
||||
<u-checkbox v-model="checked" :size="40" shape="circle"></u-checkbox>
|
||||
<text @click="checked = !checked">我已经阅读并同意</text>
|
||||
<view @click="goXieyi()" class="illustrate-box-txt">
|
||||
<view @click="ymfgoXieyi()" class="ymf-illustrate-box-txt">
|
||||
《付费须知说明》
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 支付 -->
|
||||
<view class="submit flex align-center justify-center">
|
||||
<view class="submit-box flex align-center justify-center" @click="getOrderInfo()">
|
||||
支付 ¥{{type==1?parsePrice(zongPrice):parsePrice(price)}}
|
||||
<view class="submit-box flex align-center justify-center" @click="ymfgetOrderInfo()">
|
||||
支付 ¥{{type==1?ymfparsePrice(zongPrice):ymfparsePrice(price)}}
|
||||
</view>
|
||||
</view>
|
||||
<u-toast ref="uToast" />
|
||||
@@ -100,7 +132,7 @@
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
courseId: '', //整部视频id
|
||||
ymfCourseId: '', //整部视频id
|
||||
courseDetailsId: '', //单集id
|
||||
titleImg: '', //图片
|
||||
courseDetailsName: '', //名称
|
||||
@@ -241,7 +273,7 @@
|
||||
// #endif
|
||||
if (option.info) {
|
||||
let info = JSON.parse(decodeURIComponent(option.info))
|
||||
this.courseId = info.courseId
|
||||
this.ymfCourseId = info.ymfCourseId
|
||||
this.courseDetailsId = info.courseDetailsId
|
||||
this.titleImg = info.titleImg
|
||||
this.courseDetailsName = info.courseDetailsName
|
||||
@@ -253,7 +285,7 @@
|
||||
},
|
||||
methods: {
|
||||
//去付费须知说明
|
||||
goXieyi() {
|
||||
ymfgoXieyi() {
|
||||
uni.navigateTo({
|
||||
url: '/me/setting/payXieYi'
|
||||
})
|
||||
@@ -262,11 +294,11 @@
|
||||
* @param {Number} price
|
||||
* 价格保留两位小数
|
||||
*/
|
||||
parsePrice(price) {
|
||||
ymfparsePrice(price) {
|
||||
return price.toFixed(2)
|
||||
},
|
||||
//生成订单
|
||||
getOrderInfo() {
|
||||
ymfgetOrderInfo() {
|
||||
if (this.checked == false) {
|
||||
this.$refs.uToast.show({
|
||||
title: '请阅读并同意《付费须知说明》',
|
||||
@@ -275,14 +307,14 @@
|
||||
return
|
||||
}
|
||||
let data = {
|
||||
courseId: this.courseId
|
||||
ymfCourseId: this.ymfCourseId
|
||||
}
|
||||
if (this.type != 1) { //购买单集
|
||||
data.courseDetailsId = this.courseDetailsId
|
||||
}
|
||||
this.$Request.getT('/app/order/insertCourseOrders', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.payOrder(res.data.orders.ordersId)
|
||||
this.ymfpayOrder(res.data.orders.ordersId)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
@@ -296,7 +328,7 @@
|
||||
/**
|
||||
* @param {Object} orderId 订单id
|
||||
*/
|
||||
payOrder(orderId) {
|
||||
ymfpayOrder(orderId) {
|
||||
let that = this
|
||||
if (that.payAway == 4) { //抖音支付
|
||||
uni.showLoading({
|
||||
@@ -435,7 +467,7 @@
|
||||
orderId: orderId,
|
||||
}).then(red => {
|
||||
if (red.code == 0) {
|
||||
that.callPay(red.data);
|
||||
that.ymfcallPay(red.data);
|
||||
} else {
|
||||
that.isPay = true
|
||||
uni.showToast({
|
||||
@@ -454,7 +486,7 @@
|
||||
}).then(red => {
|
||||
if (red.code == 0) {
|
||||
console.log(red, '+++++++++++++++++++++')
|
||||
that.setPayment('wxpay', JSON.stringify(red.data));
|
||||
that.ymfsetPayment('wxpay', JSON.stringify(red.data));
|
||||
} else {
|
||||
that.isPay = true
|
||||
uni.showToast({
|
||||
@@ -467,7 +499,7 @@
|
||||
break;
|
||||
case 2: //支付宝
|
||||
// #ifdef H5
|
||||
that.$Request.postT("/app/aliPay/payOrder", {
|
||||
that.$Request.postT("/app/aliPay/ymfpayOrder", {
|
||||
orderId: orderId,
|
||||
classify: 2
|
||||
}).then(red => {
|
||||
@@ -485,12 +517,12 @@
|
||||
});
|
||||
// #endif
|
||||
// #ifdef APP-PLUS
|
||||
that.$Request.postT("/app/aliPay/payOrder", {
|
||||
that.$Request.postT("/app/aliPay/ymfpayOrder", {
|
||||
orderId: orderId,
|
||||
classify: 1
|
||||
}).then(red => {
|
||||
if (red.code == 0) {
|
||||
that.setPayment('alipay', red.data);
|
||||
that.ymfsetPayment('alipay', red.data);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: red.msg,
|
||||
@@ -501,7 +533,7 @@
|
||||
// #endif
|
||||
break;
|
||||
default: //零钱
|
||||
that.$Request.postT("/app/order/payOrders", {
|
||||
that.$Request.postT("/app/order/ymfpayOrders", {
|
||||
orderId: orderId,
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
@@ -538,19 +570,19 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
callPay: function(response) {
|
||||
ymfcallPay: function(response) {
|
||||
if (typeof WeixinJSBridge === "undefined") {
|
||||
if (document.addEventListener) {
|
||||
document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(response), false);
|
||||
document.addEventListener('WeixinJSBridgeReady', this.ymfonBridgeReady(response), false);
|
||||
} else if (document.attachEvent) {
|
||||
document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(response));
|
||||
document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(response));
|
||||
document.attachEvent('WeixinJSBridgeReady', this.ymfonBridgeReady(response));
|
||||
document.attachEvent('onWeixinJSBridgeReady', this.ymfonBridgeReady(response));
|
||||
}
|
||||
} else {
|
||||
this.onBridgeReady(response);
|
||||
this.ymfonBridgeReady(response);
|
||||
}
|
||||
},
|
||||
onBridgeReady: function(response) {
|
||||
ymfonBridgeReady: function(response) {
|
||||
let that = this;
|
||||
if (!response.package) {
|
||||
return;
|
||||
@@ -587,7 +619,7 @@
|
||||
}
|
||||
);
|
||||
},
|
||||
setPayment(name, order) {
|
||||
ymfsetPayment(name, order) {
|
||||
let that = this;
|
||||
uni.requestPayment({
|
||||
provider: name,
|
||||
@@ -620,15 +652,15 @@
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.illustrate {
|
||||
.ymf-illustrate {
|
||||
width: 100%;
|
||||
margin: 30rpx 0;
|
||||
|
||||
.illustrate-box {
|
||||
.ymf-illustrate-box {
|
||||
width: 686rpx;
|
||||
}
|
||||
|
||||
.illustrate-box-txt {
|
||||
.ymf-illustrate-box-txt {
|
||||
color: #5173F8;
|
||||
}
|
||||
|
||||
@@ -638,11 +670,11 @@
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.info {
|
||||
.ymf-info {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
|
||||
.info-box {
|
||||
.ymf-info-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
border-radius: 24rpx;
|
||||
@@ -650,7 +682,7 @@
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.info-box-l {
|
||||
.ymf-info-box-l {
|
||||
width: 200rpx;
|
||||
height: 150rpx;
|
||||
border-radius: 8rpx;
|
||||
@@ -662,14 +694,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
.info-box-r {
|
||||
.ymf-info-box-r {
|
||||
margin-left: 30rpx;
|
||||
|
||||
.info-box-r-t {
|
||||
.ymf-info-box-r-t {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.info-box-r-b {
|
||||
.ymf-info-box-r-b {
|
||||
margin-top: 20rpx;
|
||||
color: #5074FF;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user