video_app/me/payOrder/new/index.vue

372 lines
11 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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>