Skip to content

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

完成下单收尾

上级 123cd46e
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 681 行增加 和 15 行删除
src/api/index.ts
浏览文件 @ 5728bdc6
......@@ -8,3 +8,21 @@ export const indexDetails = (data: any) => request('/wx/goods/detail', 'GET', da
// 加入购物车
export const addCart = (data: any) => request('/wx/cart/add', 'POST', data)
// 立即购买
export const fastaddCart = (data: any) => request('/wx/cart/fastadd', 'POST', data)
// 获取购买页面信息，地址，规格
export const checkoutCart = (data: any) => request('/wx/cart/checkout', 'GET', data)
// 地址
export const addressList = () => request('/wx/address/list', 'GET')
// 设置地址
export const cartCheckout = (data: any) => request('/wx/cart/checkout', 'GET', data)
// 提交订单
export const orderSubmit = (data: any) => request('/wx/order/submit', 'POST', data)
// 提交订单详细信息
export const orderDetail = (data: any) => request('/wx/order/detail', 'POST', data)
\ No newline at end of file
src/api/login.ts
浏览文件 @ 5728bdc6
import { request } from '@/utils/request'
// 登录
export const login = (data: any) => request('/wx/auth/login', 'POST', data)
\ No newline at end of file
export const login = (data: any) => request('/wx/auth/login_by_mobile', 'POST', data)
\ No newline at end of file
src/pages.json
浏览文件 @ 5728bdc6
......@@ -65,6 +65,24 @@
"navigationBarBackgroundColor": "#fff",
"onReachBottomDistance": 55
}
}, {
"path": "pages/order/checkout",
"style": {
"navigationBarTitleText": "",
"navigationBarBackgroundColor": "#fff"
}
}, {
"path": "pages/profile/address",
"style": {
"navigationBarTitleText": "用户地址",
"navigationBarBackgroundColor": "#fff"
}
}, {
"path": "pages/profile/addSite",
"style": {
"navigationBarTitleText": "添加用户地址",
"navigationBarBackgroundColor": "#fff"
}
}
],
"tabBar": {
......
src/pages/cart/index.vue
浏览文件 @ 5728bdc6
......@@ -236,6 +236,7 @@ const valChange = (e: any, item: any) => {
const initCartIndex = () => {
toLogin();
getCartIndex().then((res: any) => {
console.log(res);
cartList.value = res.data.data.cartList;
totalPrice.value = res.data.data.cartTotal.checkedGoodsAmount.toFixed(2);
allGoods.value = getAllList();
......
src/pages/goods/index.vue
浏览文件 @ 5728bdc6
差异被折叠。
src/pages/login/login.vue
浏览文件 @ 5728bdc6
......@@ -20,7 +20,7 @@ import { reactive } from 'vue';
import { login } from '@/api/login';
import inputLogin from '@/components/inputLogin.vue';
let inputData = reactive({
inputValue: 'user123' as any,
inputValue: '15616168157' as any,
iconfont: 'icon-a-ziyuan16',
placeholder: '手机号码',
type: 'text',
......@@ -63,8 +63,8 @@ let clickNextStep = () => {
};
// user123
let initLogin = async (username: number, password: string) => {
let res: any = await login({ username, password });
let initLogin = async (mobile: number, password: string) => {
let res: any = await login({ mobile, password });
if (res.data.errno == 0) {
uni.setStorage({
key: 'token',
......@@ -74,7 +74,7 @@ let initLogin = async (username: number, password: string) => {
url: '../profile/index',
success() {
uni.setStorage({
key: 'username',
key: 'mobile',
data: inputData.inputValue,
success() {
uni.showToast({
......
src/pages/order/checkout.vue 0 → 100644
浏览文件 @ 5728bdc6
<template>
<view class="container">
<!-- 收货地址 -->
<view class="address" @tap="tapAddresss">
<view class="top">
<text>收货地址</text>
<u-icon name="arrow-right"></u-icon>
</view>
<view class="bottom">
<view class="">
<text style="margin-right: 10rpx;">{{ buyNowData?.checkedAddress.name }}</text>
<text>{{ buyNowData?.checkedAddress.tel }}</text>
</view>
<text>{{ buyNowData?.checkedAddress.addressDetail }}</text>
</view>
</view>
<!-- 商品详情 -->
<view v-for="(item, index) in buyNowData?.checkedGoodsList" class="details">
<u-image width="140rpx" height="200rpx" :src="item.picUrl" class="img"></u-image>
<view class="right">
<view class="name">
{{ item.goodsName }}
</view>
<view class="tag" v-for="(item1, index1) in item.specifications.length" :key="index1">
<u-tag :text="item.specifications[index1]" type="info" size="mini" style="margin-right: 2rpx;" />
</view>
<view class="sum-price">
<text>￥{{ item.price.toFixed(2) }}</text>
<text style="color: #969799; font-size: 12px;">x{{ item.number }}</text>
</view>
</view>
</view>
<!-- list -->
<view class="list">
<view class="item-list">
<view class="label">商品金额</view>
<view class="item-price">￥{{ buyNowData?.goodsTotalPrice.toFixed(2) }}</view>
</view>
<view class="item-list">
<view class="label">邮费</view>
<view class="item-price">￥{{ buyNowData?.freightPrice.toFixed(2) }}</view>
</view>
<!-- <view class="item-list">
<view class="label">优惠券</view>
<view class="item-price">￥12</view>
</view> -->
<view class="item-list-end">
<view class="label">订单备注</view>
<u-input v-model="remarks" />
</view>
</view>
<!-- 提交订单 -->
<view class="footer">
<view>
<text style="font-size: 30rpx;">总计</text>
<text
style="margin-right: 24rpx; color: #ee0a24; font-size: 30rpx; font-weight: 600;">￥{{ buyNowData?.orderTotalPrice.toFixed(2) }}</text>
<u-button type="error" size="medium" shape="circle" @tap="onsubmit">结算</u-button>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import {
onLoad,
onShow
} from '@dcloudio/uni-app';
import {
ref
} from 'vue'
import {
checkoutCart,
orderDetail,
orderSubmit
} from '@/api/index'
const buyNowId = ref(uni.getStorageSync('buyNowId'))
const buyNowData = ref()
const remarks = ref() // 订单备注
// onLoad(() => {
// initCheckoutCart(buyNowId.value)
// })
// 设置地址
const tapAddresss = () => {
uni.navigateTo({
url: `../profile/address?cartId=${buyNowId.value}`
})
}
// 结算
const onsubmit = () => {
let data: object = {
addressId: uni.getStorageSync('addressId'),
cartId: uni.getStorageSync('cartId'),
couponId: uni.getStorageSync('couponId'),
grouponLinkId: 0,
grouponRulesId: uni.getStorageSync('grouponRulesId'),
message: remarks.value,
userCouponId: 0
}
// 提交订单
orderSubmit(data).then((res: any) => {
console.log(res);
orderDetail({
orderId: res.data.data.orderId
}).then((res1: any) => {
console.log(res1, '订单详情信息');
uni.switchTab({
url: '../profile/index'
})
})
})
}
// 初始化数据
const initCheckoutCart = (cartId: number) => {
let couponId = uni.getStorageSync('couponId')
let userCouponId = uni.getStorageSync('userCouponId')
let grouponRulesId = uni.getStorageSync('grouponRulesId')
let addressId = uni.getStorageSync('addressId')
checkoutCart({
cartId,
couponId,
userCouponId,
grouponRulesId,
addressId
}).then((res: any) => {
buyNowData.value = res.data.data
let storage: any = {
addressId: res.data.data.addressId,
cartId: res.data.data.cartId,
couponId: res.data.data.couponId,
userCouponId: res.data.data.userCouponId,
grouponRulesId: res.data.data.grouponRulesId
}
Object.keys(storage).forEach((prop: any) => {
const el: any = storage[prop];
uni.setStorage({
key: prop,
data: el
})
});
console.log(buyNowData.value, '购买数据');
})
}
onShow(() => {
initCheckoutCart(buyNowId.value)
})
</script>
<style lang="scss" scoped>
.container {
.address {
width: 100%;
padding: 20rpx 32rpx;
border-top: 2rpx solid #e8e8e8;
background-color: #fff;
margin-bottom: 20rpx;
.top {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 10rpx;
}
.bottom {
font-size: 24rpx;
color: #969799;
line-height: 36rpx;
}
}
.details {
width: 100%;
padding: 16rpx 32rpx;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
background-color: #fff;
.img {
margin-right: 20rpx;
}
.tag {
margin-top: 1%;
margin-bottom: 13%;
}
.right {
width: 80%;
.sum-price {
display: flex;
justify-content: space-between;
}
}
}
.list {
width: 100%;
display: flex;
background-color: #fff;
flex-direction: column;
.item-list {
width: 100%;
padding: 20rpx 32rpx;
display: flex;
justify-content: space-between;
.label {
width: 30%;
}
.item-price {
color: #db3d3c;
}
}
.item-list-end {
padding: 20rpx 32rpx;
display: flex;
justify-content: flex-start;
flex-direction: row;
align-items: center;
.label {
width: 30%;
}
}
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
height: 100rpx;
background-color: #fff;
display: flex;
justify-content: flex-end;
align-items: center;
padding: 0 32rpx;
}
}
</style>
src/pages/profile/addSite.vue 0 → 100644
浏览文件 @ 5728bdc6
<template>
<view class="wrap">
<view class="top">
<view class="item">
<view class="left">收货人</view>
<input type="text" placeholder-class="line" placeholder="请填写收货人姓名" />
</view>
<view class="item">
<view class="left">手机号码</view>
<input type="text" placeholder-class="line" placeholder="请填写收货人手机号" />
</view>
<view class="item" @tap="showRegionPicker">
<view class="left">所在地区</view>
<input disabled type="text" placeholder-class="line" placeholder="省市区县、乡镇等" />
</view>
<view class="item address">
<view class="left">详细地址</view>
<textarea 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" />
</view>
</view>
</view>
<u-picker mode="region" ref="uPicker" v-model="show" />
</view>
</template>
<script setup lang="ts">
import {
ref
} from 'vue'
import { cartCheckout } from '@/api/index'
const show = ref(false)
const setDefault = () => {}
const showRegionPicker = () => {
show.value = true;
}
</script>
<style lang="scss" scoped>
::v-deep .line {
color: $u-light-color;
font-size: 28rpx;
}
.wrap {
background-color: #f2f2f2;
.top {
background-color: #ffffff;
border-top: solid 2rpx $u-border-color;
padding: 22rpx;
.item {
display: flex;
font-size: 32rpx;
line-height: 100rpx;
align-items: center;
border-bottom: solid 2rpx $u-border-color;
.left {
width: 180rpx;
}
input {
text-align: left;
}
}
.address {
padding: 20rpx 0;
textarea {
// width: 100%;
height: 150rpx;
background-color: #f7f7f7;
line-height: 60rpx;
margin: 40rpx auto;
padding: 20rpx;
}
}
.site-clipboard {
padding-right: 40rpx;
textarea {
// width: 100%;
height: 150rpx;
background-color: #f7f7f7;
line-height: 60rpx;
margin: 40rpx auto;
padding: 20rpx;
}
.clipboard {
display: flex;
justify-content: center;
align-items: center;
font-size: 26rpx;
color: $u-tips-color;
height: 80rpx;
.icon {
margin-top: 6rpx;
margin-left: 10rpx;
}
}
}
}
.bottom {
margin-top: 20rpx;
padding: 40rpx;
padding-right: 0;
background-color: #ffffff;
font-size: 28rpx;
.tag {
display: flex;
.left {
width: 160rpx;
}
.right {
display: flex;
flex-wrap: wrap;
.tags {
width: 140rpx;
padding: 16rpx 8rpx;
border: solid 2rpx $u-border-color;
text-align: center;
border-radius: 50rpx;
margin: 0 10rpx 20rpx;
display: flex;
font-size: 28rpx;
align-items: center;
justify-content: center;
color: $u-content-color;
line-height: 1;
}
.plus {
//padding: 10rpx 0;
}
}
}
.default {
margin-top: 50rpx;
display: flex;
justify-content: space-between;
border-bottom: solid 2rpx $u-border-color;
line-height: 64rpx;
.tips {
font-size: 24rpx;
}
.right {}
}
}
}
</style>
src/pages/profile/address.vue
浏览文件 @ 5728bdc6
<template>
<view>
<view class="item" v-for="(res, index) in siteList" :key="res.id" @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> -->
</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>
<view class="addSite" @tap="toAddSite">
<view class="add">
<u-icon name="plus" color="#ffffff" class="icon" :size="30"></u-icon>新建收货地址
</view>
</view>
</view>
</template>
<script>
<script setup lang="ts">
import {
onLoad
} from '@dcloudio/uni-app';
import {
ref
} from 'vue'
import {
addressList,
cartCheckout
} from '@/api/index'
const siteList = ref([] as any)
const cartId = ref()
onLoad((options: any) => {
cartId.value = JSON.parse(options.cartId)
console.log(cartId.value);
})
// 新增地址
const toAddSite = () => {
uni.navigateTo({
url: './addSite'
});
}
// 设置地址
const setAddress = (id: any) => {
if(uni.getStorageSync('123')) {
console.log('有');
} else {
console.log('无');
}
setTimeout(() => {
uni.setStorage({
key: 'addressId',
data: id
})
uni.navigateBack({
delta: 1
})
}, 50);
}
const getData = () => {
siteList.value = [{
id: 1,
tag: [{
tagText: '默认'
},
{
tagText: '家'
}
],
site: '广东省深圳市宝安区 自由路66号'
}];
}
const initAddressLit = () => {
addressList().then((res: any) => {
siteList.value = res.data.data.list
})
}
initAddressLit()
</script>
<style>
<style lang="scss" scoped>
page {
background-color: #fff;
padding: 0 20rpx;
}
.item {
padding: 40rpx 20rpx;
.top {
display: flex;
font-weight: bold;
font-size: 34rpx;
.phone {
margin-left: 60rpx;
}
.tag {
display: flex;
font-weight: normal;
align-items: center;
text {
display: block;
width: 60rpx;
height: 34rpx;
line-height: 34rpx;
color: #ffffff;
font-size: 20rpx;
border-radius: 6rpx;
text-align: center;
margin-left: 30rpx;
background-color: rgb(49, 145, 253);
}
.red {
background-color: red
}
}
}
.bottom {
display: flex;
margin-top: 20rpx;
font-size: 28rpx;
justify-content: space-between;
color: #999999;
}
}
.addSite {
position: fixed;
bottom: 30rpx;
left: 80rpx;
display: flex;
justify-content: space-around;
width: 600rpx;
line-height: 100rpx;
// position: absolute;
background-color: red;
border-radius: 60rpx;
font-size: 30rpx;
.add {
display: flex;
align-items: center;
color: #ffffff;
.icon {
margin-right: 10rpx;
}
}
}
</style>
src/utils/config.ts
浏览文件 @ 5728bdc6
......@@ -2,7 +2,7 @@ const CONFIG: any = {
// 开发环境配置
development: {
assetsPath: 'http://192.168.2.210:8080', // 静态资源路径
baseUrl: 'http://193.112.67.73:81', // 后台接口请求地址
baseUrl: 'http://192.168.0.23:80', // 后台接口请求地址
hostUrl: 'http://192.168.2.210:8080', // H5地址(前端运行地址)
websocketUrl: '', // websocket服务端地址
},
......
src/utils/request.ts
浏览文件 @ 5728bdc6
import config from './config';
import { nextTick } from 'vue';
const baseUrl = config.baseUrl;
// 封装公共申请办法
......@@ -8,7 +9,7 @@ function request(url: string, method: 'GET' | 'POST' | 'PUT' | 'DELETE', data?:
if (uni.getStorageSync('token') !== undefined && uni.getStorageSync('token') !== '') {
header = {
'content-type': 'application/json',
'X-Litemall-Token': uni.getStorageSync('token')
'X-Litemall-Token': uni.getStorageSync('token'),
};
} else {
let pages = getCurrentPages();
......@@ -32,13 +33,30 @@ function request(url: string, method: 'GET' | 'POST' | 'PUT' | 'DELETE', data?:
header: header,
success(res: any) {
uni.hideLoading();
if (res.statusCode == 200) {
if (res.data.code == 200) {
resolve(res);
} else if (res.data.code == 501) {
console.log(res);
nextTick(() => {
uni.reLaunch({
url: '/pages/login/login',
success() {
uni.showToast({
title: res.data.msg,
icon: 'none',
});
},
fail(err) {
console.log(err);
}
});
});
} else {
console.log(res);
//其余异样
uni.showToast({
title: res.data.errmsg,
icon: 'none'
title: res.data.error,
icon: 'none',
});
reject(res);
}
......@@ -48,10 +66,10 @@ function request(url: string, method: 'GET' | 'POST' | 'PUT' | 'DELETE', data?:
//申请失败
uni.showToast({
title: '连接服务器失败',
icon: 'none'
icon: 'none',
});
reject(err);
}
},
});
});
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论