Skip to content

Y
yongxinda-h5
提交 361d06ac authored 作者: 刘旭's avatar 刘旭
浏览文件
操作

完成收货地址

上级 e76c77e7
显示空白字符变更
内嵌 并排
正在显示 包含 202 行增加 和 75 行删除
src/api/index.ts
浏览文件 @ 361d06ac
......@@ -21,6 +21,12 @@ export const addressList = () => request('/wx/address/list', 'GET');
// 设置地址
export const cartCheckout = (data: any) => request('/wx/cart/checkout', 'GET', data);
// 保存地址
export const saveAddress = (data: any) => request('/wx/address/save', 'POST', data);
// 删除地址
export const deleteAddress = (id: any) => request('/wx/address/delete', 'POST', { id });
// 提交订单
export const orderSubmit = (data: any) => request('/wx/order/submit', 'POST', data);
......
src/pages.json
浏览文件 @ 361d06ac
......@@ -75,7 +75,7 @@
}, {
"path": "pages/profile/addSite",
"style": {
"navigationBarTitleText": "添加用户地址",
"navigationBarTitleText": "设置用户地址",
"navigationBarBackgroundColor": "#fff"
}
}, {
......
src/pages/goods/index.vue
浏览文件 @ 361d06ac
......@@ -460,8 +460,7 @@ const initDetails = (id: number) => {
}
}
detailData.value = res.data.data;
console.log(detailData.value?.info.detail !== '<p></p>');
console.log(detailData.value, '商品详情数据', detailData.value?.info.detail);
console.log(detailData.value, '商品详情数据');
}
});
}
......
src/pages/profile/addSite.vue
浏览文件 @ 361d06ac
......@@ -3,77 +3,191 @@
<view class="top">
<view class="item">
<view class="left">收货人</view>
<input type="text" placeholder-class="line" placeholder="请填写收货人姓名" />
<input
type="text"
v-model="addressData.name"
placeholder-class="line"
placeholder="请填写收货人姓名"
/>
</view>
<view class="item">
<view class="left">手机号码</view>
<input type="text" placeholder-class="line" placeholder="请填写收货人手机号" />
<input
v-model="addressData.tel"
type="text"
placeholder-class="line"
placeholder="请填写收货人手机号"
/>
</view>
<view class="item" @tap="showRegionPicker">
<view class="left">所在地区</view>
<input disabled type="text" placeholder-class="line" placeholder="省市区县、乡镇等" />
<input
v-model="addressDetails"
disabled
type="text"
placeholder-class="line"
placeholder="省市区县、乡镇等"
/>
</view>
<view class="item address">
<view class="left">详细地址</view>
<textarea type="text" placeholder-class="line" placeholder="街道、楼牌等" />
<textarea
v-model="addressData.addressDetail"
type="text"
placeholder-class="line"
placeholder="街道、楼牌等"
/>
</view>
<!-- <view class="site-clipboard">
<textarea placeholder-class="line" value="" placeholder="粘贴文本,可自动识别姓名和地址等" />
<view class="clipboard">
地址粘贴板
<u-icon name="arrow-down" class="icon" :size="20"></u-icon>
</view>
</view> -->
</view>
<view class="bottom">
<view class="tag">
<view class="left">标签</view>
<view class="right">
<text class="tags">家</text>
<text class="tags">公司</text>
<text class="tags">学校</text>
<view class="tags plus">
<u-icon size="22" name="plus"></u-icon>
</view>
</view>
</view>
<view class="default">
<view class="left">
<view class="set">设置默认地址</view>
<view class="tips">提醒：每次下单会默认推荐该地址</view>
</view>
<view class="right">
<switch color="red" @change="setDefault" />
<u-switch v-model="addressData.isDefault" active-color="red" size="40" />
</view>
</view>
</view>
<u-picker mode="region" ref="uPicker" v-model="show" />
<view style="padding: 6%;">
<u-button type="error" shape="circle" @click="addressSave">保存</u-button>
<u-button v-show="editId" shape="circle" @click="addressDel" style="margin-top: 20rpx;">
删除
</u-button>
</view>
<u-picker mode="region" ref="uPicker" v-model="show" @confirm="confirm" />
<u-modal
v-model="showModel"
:content="content"
show-cancel-button
@confirm="confirmModel"
></u-modal>
</view>
</template>
<script setup lang="ts">
import {
ref
} from 'vue'
import { ref, computed } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { deleteAddress, saveAddress } from '@/api/index';
import { cartCheckout } from '@/api/index'
let show = ref(false);
let showModel = ref(false);
let content = ref('确认删除地址?');
const show = ref(false)
let addressData = ref({
addressDetail: '',
areaCode: '',
city: '',
country: '',
county: '',
isDefault: false,
name: '',
postalCode: '',
province: '',
tel: '',
} as any);
const setDefault = () => {}
// 显示地区
let addressDetails = computed(() => {
return addressData.value.province + addressData.value.city + addressData.value.county;
});
let editId = ref()
onLoad((options?: any) => {
if (JSON.stringify(options) !== '{}') {
addressData.value = JSON.parse(options.data);
// 判断是否显示删除
editId.value = addressData.value?.id
}
});
const showRegionPicker = () => {
// 打开地区选择
let showRegionPicker = () => {
show.value = true;
};
// 设置地区
let confirm = (data: any) => {
addressData.value.areaCode = data.area.code;
addressData.value.province = data.province.name;
addressData.value.city = data.city.name;
addressData.value.county = data.area.name;
};
// 确认删除地址
let confirmModel = () => {
deleteAddress(editId.value).then((res: any) => {
if(res.data.code === 200) {
setTimeout(() => {
let pages = getCurrentPages(); // 当前页面
let beforePage: any = pages[pages.length - 2]; // 上一页
beforePage.$vm.refreshIfNeeded = true
uni.showToast({
title: '删除地址成功',
icon: 'none'
})
uni.navigateBack({
delta: 1,
});
}, 50);
}
});
}
// 保存地址
let addressSave = () => {
if (!addressData.value.name)
return uni.showToast({
title: '请输入收货人',
icon: 'none',
});
let reg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
if (!reg.test(addressData.value.tel))
return uni.showToast({
title: '电话号码为空或格式不对',
icon: 'none',
});
if (!addressData.value.province)
return uni.showToast({
title: '请选择地址',
icon: 'none',
});
if (!addressData.value.addressDetail)
return uni.showToast({
title: '请输入详细地址',
icon: 'none',
});
saveAddress(addressData.value).then((res: any) => {
if (res.data.code === 200) {
setTimeout(() => {
let pages = getCurrentPages(); // 当前页面
let beforePage: any = pages[pages.length - 2]; // 上一页
beforePage.$vm.refreshIfNeeded = true
uni.navigateBack({
delta: 1,
});
}, 50);
}
});
};
// 打开删除地址模态框
let addressDel = () => {
showModel.value = true
};
</script>
<style lang="scss" scoped>
::v-deep .line {
::v-deep .line {
color: $u-light-color;
font-size: 28rpx;
}
}
.wrap {
.wrap {
background-color: #f2f2f2;
.top {
......@@ -140,8 +254,7 @@
.bottom {
margin-top: 20rpx;
padding: 40rpx;
padding-right: 0;
padding: 22rpx;
background-color: #ffffff;
font-size: 28rpx;
......@@ -188,8 +301,9 @@
font-size: 24rpx;
}
.right {}
.right {
}
}
}
}
</style>
src/pages/profile/address.vue
浏览文件 @ 361d06ac
<template>
<view>
<view class="item" v-for="(res, index) in siteList" :key="res.id" @tap="setAddress(res.id)">
<view class="address" v-for="(res, index) in siteList" :key="res.id">
<view class="item" @tap="setAddress(res.id)">
<view class="top">
<view class="name">{{ res.name }}</view>
<view class="phone">{{ res.tel }}</view>
<!-- <view class="tag">
<text v-for="(item, index) in res.tag" :key="index" :class="{red:item.tagText=='默认'}">{{ item.tagText }}</text>
</view> -->
<u-tag
v-show="res.isDefault"
text="默认"
type="error"
size="mini"
style="margin-left: 20rpx;"
/>
</view>
<view class="bottom">
{{ res.province + res.city + res.county + res.addressDetail }}
<!-- <u-icon name="edit-pen" :size="40" color="#999999"></u-icon> -->
</view>
</view>
<u-icon name="edit-pen" color="#3b3b3b" :size="40" @tap="addressEdit(res)" />
</view>
<view class="addSite" @tap="toAddSite">
<view class="add">
<u-icon name="plus" color="#ffffff" class="icon" :size="30"></u-icon>
<u-icon name="plus" color="#ffffff" class="icon" :size="35"></u-icon>
新建收货地址
</view>
</view>
......@@ -24,8 +31,10 @@
<script setup lang="ts">
import { ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import { addressList } from '@/api/index';
const refreshIfNeeded = ref(false);
const siteList = ref([] as any);
// const cartId = ref();
......@@ -34,45 +43,37 @@ const siteList = ref([] as any);
// console.log(cartId.value);
// });
// 新增地址
const toAddSite = () => {
uni.navigateTo({
url: './addSite',
});
};
onShow(() => {
if (refreshIfNeeded.value) {
initAddressLit();
refreshIfNeeded.value = false;
}
});
// 设置地址
const setAddress = (id: any) => {
if (uni.getStorageSync('123')) {
console.log('有');
} else {
console.log('无');
}
setTimeout(() => {
uni.setStorage({
key: 'addressId',
data: id,
});
uni.navigateBack({
delta: 1,
success() {
uni.navigateBack();
},
});
}, 50);
};
const getData = () => {
siteList.value = [
{
id: 1,
tag: [
{
tagText: '默认',
},
{
tagText: '家',
},
],
site: '广东省深圳市宝安区 自由路66号',
},
];
const addressEdit = (res: any) => {
uni.navigateTo({
url: `./addSite?data=${JSON.stringify(res)}&editId=1 `,
});
};
const initAddressLit = () => {
......@@ -82,6 +83,10 @@ const initAddressLit = () => {
};
initAddressLit();
defineExpose({
refreshIfNeeded,
});
</script>
<style lang="scss" scoped>
......@@ -90,9 +95,14 @@ page {
padding: 0 20rpx;
}
.item {
.address {
padding: 40rpx 20rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.item {
.top {
display: flex;
font-weight: bold;
......@@ -144,7 +154,7 @@ page {
width: 600rpx;
line-height: 100rpx;
// position: absolute;
background-color: red;
background-color: #fa3534;
border-radius: 60rpx;
font-size: 30rpx;
......
src/utils/request.ts
浏览文件 @ 361d06ac
......@@ -66,10 +66,8 @@ function request(url: string, method: 'GET' | 'POST' | 'PUT' | 'DELETE', data?:
uni.showToast({
title: '连接服务器失败',
icon: 'none',
success() {
uni.clearStorage();
},
});
uni.clearStorage();
reject(err);
},
});
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论