liangxin/xdd-uniapp-new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Task：收礼相关接口

Browse Source
This commit is contained in:
linxi
2025-02-21 18:25:34 +08:00
parent 425821ecf7
commit f0a4a0edf9
6 changed files with 441 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
api/gift.js
+24
View File
@@ -16,3 +16,27 @@ export function getGiftCardSendOrder(key, data) {
return request.post("/giftCard/create/" + key, data);
}
/**
* 礼品详情
* @param {*} data
*/
export function getGiftCardDetail(data) {
return request.get("/giftCard/info", data);
}
/**
* 领取礼品卡
* @param {*} data
*/
export function getGiftCardReceive(data) {
return request.post("/giftCard/receive", data);
}
/**
* 礼品卡赠礼须知
* @param {*} data
*/
export function getGiftCardSendNotice(data) {
return request.get("/giftCard/giftNotice", data);
}
pages/shop/GoodsCon/index.vue
+1 -1
View File
@@ -1424,7 +1424,7 @@ export default {
}
if(news === 2) {
uni.navigateTo({
url: '/pkg_user/views/gift/gift?cartId=' + res.data.cartId + '&couponId=' + that.couponId
url: '/pkg_user/views/gift/gift?cartId=' + res.data.cartId + '&couponId=' + (that.couponId ? that.couponId : '')
})
}
if(news === 0) {
pkg_user/views/gift/components/AddressDialog.vue
+287
View File
@@ -0,0 +1,287 @@
<template>
<u-popup :show="show" mode="center" round="16">
<view class="dialog-container">
<view class="dialog-title">填写收货地址</view>
<u-form :model="form" ref="uForm" labelPosition="left">
<u-form-item label="姓名" prop="name" borderBottom>
<u-input v-model="form.name" placeholder="请输入姓名" border="none"/>
</u-form-item>
<u-form-item label="联系电话" prop="phone" borderBottom>
<u-input v-model="form.phone" placeholder="请输入联系电话" border="none"/>
</u-form-item>
<u-form-item label="所在地区" prop="region" borderBottom>
<CitySelect
ref="cityselect"
:defaultValue="addressText"
@callback="result"
:items="district"
></CitySelect>
</u-form-item>
<u-form-item label="详细地址" prop="address" borderBottom>
<u-input v-model="form.address" placeholder="请输入详细地址" border="none" />
</u-form-item>
</u-form>
<view class="dialog-footer">
<u-button type="primary" color="#C52733" shape="circle" @click="handleSave">立即保存</u-button>
</view>
</view>
</u-popup>
</template>
<script>
import CitySelect from '@/components/CitySelect'
import { getAddress, getCity, postAddress, analysisAddress } from '@/api/user'
import { isWeixin } from '@/utils'
export default {
components: {
CitySelect
},
data() {
return {
district: [],
id: 0,
// 是否选择地址模式：0-不是，1-来源订单创建页面，2-来源购物车
choosMode: 0,
userAddress: {
realName: '',
phone: '',
detail: '',
isDefault: 0
},
address: {},
isWechat: isWeixin(),
addressText: "",
pageKeyId: Object.freeze('userAddressEdit'),
addressInput: '',
show: false,
showRegionPicker: false,
form: {
name: '',
phone: '',
region: '',
address: ''
},
rules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' }
],
phone: [
{ required: true, message: '请输入联系电话', trigger: 'blur' },
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码', trigger: 'blur' }
],
region: [
{ required: true, message: '请选择所在地区', trigger: 'change' }
],
address: [
{ required: true, message: '请输入详细地址', trigger: 'blur' }
]
}
}
},
methods: {
open() {
this.show = true
this.getUserAddress()
this.getCityList()
},
result() {
},
handleRegionConfirm(e) {
this.form.region = e.province.label + ' ' + e.city.label + ' ' + e.area.label
},
handleSave() {
this.$refs.uForm.validate(valid => {
if (valid) {
// 这里处理保存逻辑
this.$emit('save', this.form)
this.show = false
}
})
},
//获取当前定位地址
getCurAddress() {
var that = this;
//定位
uni.showLoading({
title: '定位中...'
});
//this.getLocation();
uni.getLocation({
type: 'wgs84',
success: function (res) {
let latitude = res.latitude;
let longitude = res.longitude;
console.log('latitude:' + latitude + 'longitude:' + longitude)
// #ifdef H5
Vue.jsonp(
'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude + '&key=' + config.key,
{
//callbackName: 'QQmap',
output: 'jsonp',
}).then(json => {
// Success.
uni.hideLoading();
that.addressText =
json.result.ad_info.province + " " + json.result.ad_info.city + " " + json.result.ad_info.district;
that.address.province = json.result.ad_info.province;
that.address.city = json.result.ad_info.city;
that.address.district = json.result.ad_info.district;
that.$set(that.userAddress, 'detail', json.result.formatted_addresses.recommend);
//that.userAddress.detail = json.result.formatted_addresses.recommend;
// that.$refs.cityselect.adjustDefaultValue();
//设置city_id
var pIdx = that.getIndex(that.address.province, that.district);
if (pIdx > -1) {
var citys = that.district[pIdx].c;
var cIdx = that.getIndex(that.address.city, citys);
if (cIdx > -1) {
var city = citys[cIdx];
that.address.city_id = city.v;
console.log('city_id:' + city.v);
}
}
}).catch(err => {
// Failed.
console.log('地址解析失败:' + JSON.stringify(err));
uni.hideLoading();
})
// #endif
// #ifndef H5
uni.request({
url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=' + latitude + ',' + longitude + '&key=' + config.key,
success: function (res) {
// console.log('res:'+JSON.stringify(res.data));
uni.hideLoading();
that.addressText =
res.data.result.ad_info.province + " " + res.data.result.ad_info.city + " " + res.data.result.ad_info.district;
that.address.province = res.data.result.ad_info.province;
that.address.city = res.data.result.ad_info.city;
that.address.district = res.data.result.ad_info.district;
//that.userAddress.detail = res.data.result.formatted_addresses.recommend;
that.$set(that.userAddress, 'detail', res.data.result.formatted_addresses.recommend);
// that.$refs.cityselect.adjustDefaultValue();
//设置city_id
var pIdx = that.getIndex(that.address.province, that.district);
if (pIdx > -1) {
var citys = that.district[pIdx].c;
var cIdx = that.getIndex(that.address.city, citys);
if (cIdx > -1) {
var city = citys[cIdx];
that.address.city_id = city.v;
console.log('city_id:' + city.v);
}
}
},
fail: function (res) {
console.log('地址解析失败');
uni.hideLoading();
},
complete: function () {
}
});
// #endif
},
fail: function (res) {
uni.hideLoading();
// uni.showToast({
// title:'城市定位失败:'+JSON.stringify(res),
// icon:'none',
// duration:2000
// })
}
});
},
getCityList: function () {
let that = this;
getCity()
.then(res => {
that.district = res.data;
that.ready = true;
if (this.id) {
//设置city_id
var pIdx = that.getIndex(that.address.province, that.district);
if (pIdx > -1) {
var citys = that.district[pIdx].c;
var cIdx = that.getIndex(that.address.city, citys);
if (cIdx > -1) {
var city = citys[cIdx];
that.address.city_id = city.v;
console.log('city_id:' + city.v);
}
}
}
})
.catch(err => {
that.$dialog.error(err.msg);
});
},
getUserAddress: function () {
if (!this.id) return false;
let that = this;
getAddress(that.id).then(res => {
that.userAddress = res.data;
that.addressText = res.data.province + " " + res.data.city + " " + res.data.district;
that.address.province = res.data.province;
that.address.city = res.data.city;
that.address.district = res.data.district;
if (that.district.length > 0) {
//设置city_id
var pIdx = that.getIndex(that.address.province, that.district);
if (pIdx > -1) {
var citys = that.district[pIdx].c;
var cIdx = that.getIndex(that.address.city, citys);
if (cIdx > -1) {
var city = citys[cIdx];
that.address.city_id = city.v;
console.log('city_id:' + city.v);
}
}
}
});
},
getAddress() {
},
}
}
</script>
<style scoped>
.dialog-container {
width: 600rpx;
padding: 40rpx;
background-color: #fff;
border-radius: 16rpx;
}
.dialog-title {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-bottom: 40rpx;
}
.dialog-footer {
margin-top: 40rpx;
}
</style>
pkg_user/views/gift/components/GiftCard.vue
+98 -5
View File
@@ -1,35 +1,127 @@
<template>
<view class="mask">
<view class="gift-card-modal" :style="{backgroundColor: '#C52733'}">
<view class="gift-card-modal" >
<image class="bg-image" :src="card.cover" mode="aspectFit|aspectFill|widthFix" lazy-load="false"></image>
<view class="image-wrap">
<image class="pro-image" :src="card.giftProducts[0].productImage" mode="aspectFit|aspectFill|widthFix" lazy-load="false" @error="" @load="">
</image>
</view>
<view class="wrap-box">
</view>
<view class="auto-text-color">
{{ card.message || '礼笺轻启，礼藏心意' }}
</view>
<!-- 弹窗内容 -->
<view class="address-btn v12-white v12-primary-text">
<view class="address-btn v12-white v12-primary-text" @click="setAddress">
填写地址并收下
</view>
<view class="share-btn v12-white v12-primary-text">
<view class="share-btn v12-white v12-primary-text" v-if="card.canTransfer !== 0">
点击转增给好友
</view>
<view class="tips">
<view class="tip-text v12-mr-1">
未领取礼包，将于24小时后自动
</view>
<u-icon @click="showTips" name="error-circle" color="#fff" size="28rpx"></u-icon>
</view>
</view>
<giftTips ref="giftTips" :richText="giftNotice"></giftTips>
<AddressDialog ref="addressDialog" ></AddressDialog>
</view>
</template>
<script>
import { getGiftCardSendNotice } from '@/api/gift'
import giftTips from './giftTips.vue'
import AddressDialog from './AddressDialog.vue'
export default {
name: 'GiftCard',
components: {
giftTips,
AddressDialog
},
props: {
// 组件属性
card: {
type: Object,
default: () => {}
}
},
data() {
return {
// 组件数据
giftNotice: ''
}
},
methods: {
setAddress() {
this.$refs.addressDialog.open()
},
async showTips() {
// 获取发礼提示
getGiftCardSendNotice().then(res => {
this.$refs.giftTips.showTips = true
this.giftNotice = res.data
})
},
}
}
</script>
<style scoped>
.bg-image{
width: 586rpx;
height: 704rpx;
position: absolute;
top: 0;
}
.tips{
display: flex;
align-items: center;
margin-top: 40rpx;
position: absolute;
bottom: 50rpx;
}
.tip-text{
font-family: Source Han Sans SC;
font-weight: 500;
font-size: 28rpx;
color: #fff;
opacity: 0.6;
line-height: 36rpx;
}
.wrap-box{
width: 296rpx;
height: 296rpx;
}
.image-wrap{
width: 296rpx;
height: 296rpx;
border: 10rpx solid #FDF0D3;
border-radius: 30rpx;
position: absolute;
top: -60px;
}
.pro-image{
width: 296rpx;
height: 296rpx;
border-radius: 30rpx;
}
.auto-text-color {
color: #fff;
font-size: 24rpx;
opacity: 0.9;
}
.share-btn{
width: fit-content;
padding: 15rpx 30rpx;
border-radius: 100rpx;
font-size: 24rpx;
margin-top: 30rpx;
margin-top: 40rpx;
z-index: 999;
}
.address-btn{
width: fit-content;
@@ -37,7 +129,8 @@ export default {
border-radius: 100rpx;
font-size: 32rpx;
font-weight: bold;
margin-top: 30rpx;
margin-top: 40rpx;
z-index: 999;
}
.gift-card-modal {
position: absolute;
pkg_user/views/gift/gift.vue
+12 -20
View File
@@ -80,7 +80,7 @@
<u-switch v-model="canTransfe" ></u-switch>
</view>
</view>
<button v-if="isPayOk" open-type="share" class="share-btn" @click="shareToFriend">
<button v-if="isPayOk" open-type="share" class="share-btn" >
<view class="v12-font-28 v12-primary-text v12-align-center">
<u-icon :name="webUrl + '/icon/gift-primary.png'" size="18"></u-icon>
点击送给朋友</view>
@@ -157,15 +157,22 @@ export default {
payPassword: '',
payType: '',
isPayOk: false,
giftKey: '',
}
},
onLoad(opts) {
console.log(opts, 'gift');
this.cartId = opts.cartId
this.couponId = opts.couponId
this.getGift()
},
computed: mapGetters(["userInfo"]),
onShareAppMessage() {
return {
title: '送朋友',
path: `/pkg_user/views/gift/receive?code=${this.giftKey}`,
imageUrl: this.goodsInfo.productInfo.image
}
},
methods: {
pwdPopFinish(payPwd) {
this.payPassword = payPwd;
@@ -176,7 +183,6 @@ export default {
this.confirmGift(false)
},
onCoverConfirm(cover) {
console.log(cover);
this.cover = cover.name
this.templateId = cover.id
this.selectedCover = cover.image
@@ -223,7 +229,9 @@ export default {
});
const params = {
orderKey: this.orderKey,
from: 'routine',
cartId: this.cartId,
couponId: this.couponId,
templateId: this.templateId,
message : this.message,
cover: this.selectedCover,
@@ -267,6 +275,7 @@ export default {
duration: 2000
});
this.isPayOk = true;
this.giftKey = data.giftCard.code;
break;
case "WECHAT_H5_PAY":
// H5支付
@@ -305,23 +314,6 @@ export default {
this.$refs.payPwdPop.clear();//清空支付密码
this.$refs.payPwdPop.close();//关闭支付密码弹窗
});
},
shareToFriend() {
uni.share({
provider: 'weixin',
scene: 'WXSceneSession', // 分享到好友
type: 0, // 0:文字 1:图片 2:音乐 3:视频 4:小程序
title: '送你一份礼物', // 分享标题
summary: '我精心挑选了一份礼物送给你，快来领取吧！', // 分享描述
href: 'https://your-domain.com/gift', // 分享链接
imageUrl: this.goodsInfo.productInfo.image, // 分享图片
success: (res) => {
console.log('分享成功', res);
},
fail: (err) => {
console.log('分享失败', err);
}
});
}
}
}
pkg_user/views/gift/receive.vue
+19 -1
View File
@@ -1,14 +1,32 @@
<template>
<view>
<GiftCard/>
<GiftCard :card="giftCard"/>
</view>
</template>
<script>
import GiftCard from './components/GiftCard.vue'
import { getGiftCardDetail } from '@/api/gift'
export default {
components: {
GiftCard
},
data() {
return {
giftCard: {}
}
},
onLoad(opts) {
this.getGiftCard(opts.code)
},
methods: {
async getGiftCard(code) {
const res = await getGiftCardDetail({
code: code
})
this.giftCard = res.data
},
}
}
</script>