需求调整
This commit is contained in:
parent
e6ee7505e5
commit
2373004eec
3
app.json
3
app.json
|
|
@ -11,7 +11,8 @@
|
|||
"page/component/search/search",
|
||||
"page/component/myOrders/myOrder",
|
||||
"page/component/refund/refund",
|
||||
"page/component/invoice/invoice"
|
||||
"page/component/invoice/invoice",
|
||||
"page/component/myOrders2/myOrder2"
|
||||
],
|
||||
"window": {
|
||||
"navigationBarTextStyle": "white",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,15 @@
|
|||
// page/component/details/details.js
|
||||
Page({
|
||||
onLoad: function (options) {
|
||||
data: {
|
||||
goods: {},
|
||||
specList: [],
|
||||
selectedSpecs: [], // 用户选择的规格
|
||||
buyNum: 1, // 购买数量
|
||||
showPopup: false, // 控制弹出层显示
|
||||
userInfo: {}, // 用户信息
|
||||
viewGood: "",
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
const goods = {
|
||||
id: options.id,
|
||||
goodName: options.goodName,
|
||||
|
|
@ -8,99 +17,101 @@ Page({
|
|||
goodDetail: options.goodDetail,
|
||||
goodImage: decodeURIComponent(options.goodImage).split(','),
|
||||
};
|
||||
this.setData({ goods });
|
||||
},
|
||||
data: {
|
||||
goods: {},
|
||||
list: [
|
||||
'/image/beizi1.jpg',
|
||||
'/image/beizi1.jpg'
|
||||
],
|
||||
num: 1,
|
||||
totalNum: 0,
|
||||
hasCarts: false,
|
||||
curIndex: 0,
|
||||
show: false,
|
||||
scaleCart: false,
|
||||
userInfo: {},
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
},
|
||||
|
||||
onBuyClick() {
|
||||
const self = this;
|
||||
// 获取用户信息
|
||||
wx.getUserProfile({
|
||||
desc: '用于完善会员资料', // 提示信息，表明获取用户信息的用途
|
||||
success: (res) => {
|
||||
console.log('用户信息:', res.userInfo);
|
||||
|
||||
// 将用户信息保存到data中（或发送给服务器）
|
||||
self.setData({
|
||||
userInfo: res.userInfo
|
||||
});
|
||||
|
||||
// 构建订单信息的 URL
|
||||
const { id, title, image, price } = self.data.goods;
|
||||
const num = self.data.num;
|
||||
const url = `../orders/orders?id=${id}&title=${title}&image=${image[0]}&price=${price}&num=${num}`;
|
||||
|
||||
// 跳转到订单页面
|
||||
wx.navigateTo({
|
||||
url: url,
|
||||
});
|
||||
const specList = [
|
||||
{
|
||||
specId: 1,
|
||||
title: "枕头类型",
|
||||
specValueList: [
|
||||
{ specValueId: 1, specValue: "普通蓬松枕", isSelected: false, goodImage: "/image/zhentou1.jpg" },
|
||||
{ specValueId: 2, specValue: "压缩高级枕", isSelected: false, goodImage: "/image/zhentou2.jpg" }
|
||||
]
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('获取用户信息失败:', err);
|
||||
{
|
||||
specId: 2,
|
||||
title: "枕被套 、床单颜色",
|
||||
specValueList: [
|
||||
{ specValueId: 3, specValue: "贝诺灰", isSelected: false, goodImage: "/image/beizi2.jpg" },
|
||||
{ specValueId: 4, specValue: "开心日记", isSelected: false, goodImage: "/image/beizi3.jpg" },
|
||||
{ specValueId: 5, specValue: "草莓熊", isSelected: false, goodImage: "/image/beizi4.jpg" },
|
||||
{ specValueId: 6, specValue: "乖乖狗", isSelected: false, goodImage: "/image/beizi5.jpg" },
|
||||
{ specValueId: 7, specValue: "蓝心小熊", isSelected: false, goodImage: "/image/beizi6.jpg" },
|
||||
{ specValueId: 8, specValue: "初夏-紫", isSelected: false, goodImage: "/image/beizi7.jpg" }
|
||||
]
|
||||
}
|
||||
];
|
||||
this.setData({ goods, specList, viewGood: goods.goodImage[0] });
|
||||
},
|
||||
|
||||
openPopup() {
|
||||
this.setData({ showPopup: true });
|
||||
},
|
||||
|
||||
handlePopupHide() {
|
||||
this.setData({ showPopup: false });
|
||||
},
|
||||
|
||||
selectSpec(e) {
|
||||
const { specid, id } = e.currentTarget.dataset;
|
||||
let specList = this.data.specList.map(spec => {
|
||||
if (spec.specId === specid) {
|
||||
spec.specValueList = spec.specValueList.map(item => {
|
||||
item.isSelected = item.specValueId == id;
|
||||
return item;
|
||||
});
|
||||
}
|
||||
return spec;
|
||||
});
|
||||
this.setData({ specList, viewGood: e.currentTarget.dataset.goodimage });
|
||||
this.updateSelectedSpecs();
|
||||
},
|
||||
goToHome() {
|
||||
wx.switchTab({
|
||||
url: '/page/component/index' // 使用switchTab跳转到首页（tabbar页面）
|
||||
});
|
||||
},
|
||||
addCount() {
|
||||
let num = this.data.num;
|
||||
num++;
|
||||
this.setData({
|
||||
num: num
|
||||
})
|
||||
updateSelectedSpecs() {
|
||||
const selectedSpecs = this.data.specList.map(spec => {
|
||||
const selectedItem = spec.specValueList.find(item => item.isSelected);
|
||||
return selectedItem ? selectedItem.specValue : null;
|
||||
}).filter(item => item);
|
||||
this.setData({ selectedSpecs });
|
||||
},
|
||||
reduceCount() {
|
||||
let num = this.data.num;
|
||||
if (num > 1) {
|
||||
num--;
|
||||
|
||||
handleBuyNumChange(e) {
|
||||
this.setData({
|
||||
buyNum: e.detail.value
|
||||
});
|
||||
},
|
||||
|
||||
confirmSpecs() {
|
||||
console.log(this.data.selectedSpecs)
|
||||
if (this.data.selectedSpecs.length < this.data.specList.length) {
|
||||
wx.showToast({
|
||||
title: '请选择所有规格',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.setData({
|
||||
num: num
|
||||
})
|
||||
},
|
||||
|
||||
addToCart() {
|
||||
const self = this;
|
||||
const num = this.data.num;
|
||||
let total = this.data.totalNum;
|
||||
this.setData({ showPopup: false });
|
||||
|
||||
self.setData({
|
||||
show: true
|
||||
})
|
||||
setTimeout(function () {
|
||||
self.setData({
|
||||
show: false,
|
||||
scaleCart: true
|
||||
})
|
||||
setTimeout(function () {
|
||||
self.setData({
|
||||
scaleCart: false,
|
||||
hasCarts: true,
|
||||
totalNum: num + total
|
||||
})
|
||||
}, 200)
|
||||
}, 300)
|
||||
// wx.getUserProfile({
|
||||
// desc: '用于完善会员资料',
|
||||
// success: (res) => {
|
||||
// this.setData({ userInfo: res.userInfo });
|
||||
|
||||
},
|
||||
const { id, goodName, goodImage, goodPrice } = this.data.goods;
|
||||
const num = this.data.buyNum;
|
||||
const url = `../orders/orders?id=${id}&title=${goodName}&image=${goodImage[0]}&price=${goodPrice}&num=${num}&specs=${this.data.selectedSpecs.join(',')}`;
|
||||
|
||||
bindTap(e) {
|
||||
const index = parseInt(e.currentTarget.dataset.index);
|
||||
this.setData({
|
||||
curIndex: index
|
||||
})
|
||||
wx.navigateTo({ url });
|
||||
// },
|
||||
// fail: (err) => {
|
||||
// wx.showToast({
|
||||
// title: '获取用户信息失败',
|
||||
// icon: 'none'
|
||||
// });
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
})
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,6 +2,10 @@
|
|||
"usingComponents": {
|
||||
"t-button": "tdesign-miniprogram/button/button",
|
||||
"t-tag": "tdesign-miniprogram/tag/tag",
|
||||
"t-icon": "tdesign-miniprogram/icon/icon"
|
||||
"t-icon": "tdesign-miniprogram/icon/icon",
|
||||
"t-popup": "tdesign-miniprogram/popup/popup",
|
||||
"t-image": "tdesign-miniprogram/image/image",
|
||||
"t-stepper": "tdesign-miniprogram/stepper/stepper",
|
||||
"t-toast": "tdesign-miniprogram/toast/toast"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
<view class="main">
|
||||
<view class="goods-box">
|
||||
<!-- <image src="{{goods.image}}" class="goods-thumb"></image> -->
|
||||
<swiper class="banner" indicator-dots="true" autoplay="true" interval="{{interval}}" duration="{{duration}}" circular="true">
|
||||
<block wx:for="{{goods.goodImage}}" wx:key="index">
|
||||
<swiper-item>
|
||||
|
|
@ -8,18 +7,11 @@
|
|||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
<!-- <navigator open-type="switchTab" url="../cart/cart">
|
||||
<view class="carts-icon {{scaleCart?'on':''}}">
|
||||
<image src="/image/cart2.png"></image>
|
||||
<text class="carts-icon-num" wx:if="{{hasCarts}}">{{totalNum}}</text>
|
||||
</view>
|
||||
</navigator> -->
|
||||
|
||||
<!-- <view class="goods-operation"> -->
|
||||
<view class="goods-info">
|
||||
<view class="left-section">
|
||||
<view class="goods-price">￥ {{goods.goodPrice}}</view>
|
||||
<view class="goods-title">{{goods.goodName}}</view>
|
||||
<view class="goods-detail">{{goods.goodDetail}}</view>
|
||||
</view>
|
||||
<view class="right-section">
|
||||
<t-button open-type="share" t-class="shareBtn" variant="text">
|
||||
|
|
@ -31,35 +23,63 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="goods-buy">
|
||||
<navigator>
|
||||
<view class="left" bindtap="goToHome">
|
||||
<t-icon class="left-return" name="home"></t-icon>
|
||||
<view>首页</view>
|
||||
</navigator>
|
||||
<t-button class="right-buy" theme="light" variant="outline" size="large" shape="round">立即购买</t-button>
|
||||
</view>
|
||||
<!-- 绑定点击事件，显示规格选择弹出框 -->
|
||||
<t-button class="right-buy" theme="light" variant="outline" size="large" shape="round" bindtap="openPopup">立即购买</t-button>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- <text class="goods-operation-add" bindtap="reduceCount">-</text>
|
||||
<text class="goods-operation-num">数量 {{num}}</text>
|
||||
<text class="goods-operation-add" bindtap="addCount">+</text> -->
|
||||
<!-- <navigator url="javascript:void(0);" open-type="false">
|
||||
<button class="goods-to-buy" bindtap="onBuyClick">购买</button>
|
||||
</navigator> -->
|
||||
<!-- <text class="goods-to-cart" bindtap="addToBuy">购买</text> -->
|
||||
<!-- <image src="/image/cart1.png" class="goods-cart-img" bindtap="addToCart"></image> -->
|
||||
<!-- </view> -->
|
||||
<image wx:if="{{show}}" src="/image/cart1.png" class="to-carts-icon"></image>
|
||||
<!-- <view class="goods-stock">{{goods.stock}}</view> -->
|
||||
</view>
|
||||
<!-- <view class="goods-tab-box">
|
||||
<view class="goods-tab-nav {{curIndex === 0 ?'on':''}}" bindtap="bindTap" data-index="0">商品详情</view>
|
||||
<view class="goods-tab-nav {{curIndex === 1 ?'on':''}}" bindtap="bindTap" data-index="1">产品参数</view>
|
||||
<view class="goods-tab-nav {{curIndex === 2 ?'on':''}}" bindtap="bindTap" data-index="2">售后保障</view>
|
||||
<view class="goods-content">
|
||||
<view wx:if="{{curIndex === 0}}">{{goods.goodDetail}}</view>
|
||||
<view wx:if="{{curIndex === 1}}">{{goods.parameter}}</view>
|
||||
<view wx:if="{{curIndex === 2}}">{{goods.service}}</view>
|
||||
<!-- 规格选择弹出框 -->
|
||||
<t-popup visible="{{showPopup}}" placement="bottom" bind:visible-change="handlePopupHide">
|
||||
<view class="popup-container">
|
||||
<view class="popup-close" bindtap="handlePopupHide">
|
||||
<t-icon name="close" size="36rpx" />
|
||||
</view>
|
||||
<view class="popup-sku-header">
|
||||
<t-image t-class="popup-sku-header__img" src="{{viewGood}}" />
|
||||
<view class="popup-sku-header__goods-info">
|
||||
<view class="popup-sku__goods-name">{{goods.goodName}}</view>
|
||||
<view class="goods-price-container">
|
||||
<view class="goods-price">￥ {{goods.goodPrice}}</view>
|
||||
</view>
|
||||
<!-- 已选规格 -->
|
||||
<view class="popup-sku__selected-spec">
|
||||
<view>选择：</view>
|
||||
<view wx:for="{{selectedSpecs}}" wx:key="index">
|
||||
<view class="popup-sku__selected-item">{{item}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-sku-body">
|
||||
<view class="goods-size">默认统一被褥1.5m*2.0m</view>
|
||||
<view class="popup-sku-group-container">
|
||||
<view class="popup-sku-row" wx:for="{{specList}}" wx:key="specId">
|
||||
<view class="popup-sku-row__title">{{item.title}}</view>
|
||||
<view class="popup-sku-row__item-container">
|
||||
<block wx:for="{{item.specValueList}}" wx:key="specValueId" wx:for-item="valueItem">
|
||||
<view class="popup-sku-row__item {{valueItem.isSelected ? 'popup-sku-row__item--active' : ''}}" data-specid="{{item.specId}}" data-id="{{valueItem.specValueId}}" data-val="{{valueItem.specValue}}" data-goodImage="{{valueItem.goodImage}}" bindtap="selectSpec">
|
||||
{{valueItem.specValue}}
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-sku-stepper-stock">
|
||||
<view class="popup-sku-stepper-container">
|
||||
<view class="popup-sku__stepper-title">购买数量</view>
|
||||
<t-stepper value="{{buyNum}}" min="1" max="10" theme="filled" bind:change="handleBuyNumChange" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 绑定点击事件，确认选择规格并跳转到订单页面 -->
|
||||
<view class="single-confirm-btn" bindtap="confirmSpecs">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</t-popup>
|
||||
</view>
|
||||
|
||||
<t-toast id="t-toast" />
|
||||
|
|
@ -4,125 +4,6 @@
|
|||
position: relative;
|
||||
padding: 40rpx 45rpx;
|
||||
color: #454552;
|
||||
/* border-bottom: 30rpx solid #ededed; */
|
||||
}
|
||||
|
||||
.goods-box .goods-thumb {
|
||||
width: 300rpx;
|
||||
height: 300rpx;
|
||||
margin: 35rpx 0 125rpx;
|
||||
}
|
||||
|
||||
.to-carts-icon {
|
||||
position: absolute;
|
||||
right: 70rpx;
|
||||
top: 70rpx;
|
||||
width: 10rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 50%;
|
||||
opacity: .6;
|
||||
-webkit-animation: to_cart .3s ease-out;
|
||||
animation: to_cart .3s ease-out;
|
||||
}
|
||||
|
||||
@-webkit-keyframes to_cart {
|
||||
0% {
|
||||
right: 100rpx;
|
||||
top: 530rpx;
|
||||
-webkit-transform: scale(4);
|
||||
}
|
||||
|
||||
/*60%{
|
||||
top: 20rpx;
|
||||
}*/
|
||||
}
|
||||
|
||||
@keyframes to_cart {
|
||||
0% {
|
||||
right: 100rpx;
|
||||
top: 530rpx;
|
||||
transform: scale(4);
|
||||
}
|
||||
|
||||
/*60%{
|
||||
top: 20rpx;
|
||||
}*/
|
||||
}
|
||||
|
||||
.carts-icon {
|
||||
position: absolute;
|
||||
right: 40rpx;
|
||||
top: 40rpx;
|
||||
width: 75rpx;
|
||||
height: 75rpx;
|
||||
}
|
||||
|
||||
.carts-icon image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.carts-icon.on {
|
||||
-webkit-animation: to_cart_scale .3s ease;
|
||||
animation: to_cart_scale .3s ease;
|
||||
}
|
||||
|
||||
@-webkit-keyframes to_cart_scale {
|
||||
50% {
|
||||
-webkit-transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes to_cart_scale {
|
||||
50% {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
|
||||
.carts-icon-num {
|
||||
position: absolute;
|
||||
left: -15rpx;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
border-radius: 50%;
|
||||
background: #AB956D;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.goods-box .goods-operation {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
padding: 0 50rpx;
|
||||
margin-bottom: 60rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 50rpx;
|
||||
background: #AB956D;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.goods-operation text {
|
||||
display: inline-block;
|
||||
height: 100rpx;
|
||||
}
|
||||
|
||||
.goods-to-buy {
|
||||
margin-top: 5px;
|
||||
width: 80px;
|
||||
height: 40px;
|
||||
font-size: 16px;
|
||||
color: #fff;
|
||||
background-color: rgb(243, 106, 96);
|
||||
box-sizing: border-box;
|
||||
border-radius: 50rpx;
|
||||
}
|
||||
|
||||
.goods-operation-num {
|
||||
width: 160rpx;
|
||||
}
|
||||
|
||||
.banner {
|
||||
|
|
@ -131,37 +12,11 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.goods-operation-add {
|
||||
font-weight: bold;
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.goods-to-cart {
|
||||
width: 210rpx;
|
||||
/* padding-right: 75rpx; */
|
||||
color: black;
|
||||
}
|
||||
|
||||
.goods-cart-img {
|
||||
position: absolute;
|
||||
right: 50rpx;
|
||||
top: 28rpx;
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
}
|
||||
|
||||
.goods-stock {
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.left-section {
|
||||
|
|
@ -171,6 +26,7 @@
|
|||
|
||||
.goods-title {
|
||||
font-size: 40rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.goods-price {
|
||||
|
|
@ -185,52 +41,186 @@
|
|||
}
|
||||
|
||||
.btn-icon {
|
||||
font-size: 20rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.share-text {
|
||||
padding-left: 8rpx;
|
||||
padding-left: 6rpx;
|
||||
padding-top: 8rpx;
|
||||
font-size: 20rpx;
|
||||
font-size: 25rpx;
|
||||
line-height: 24rpx;
|
||||
}
|
||||
.goods-detail{
|
||||
padding-top: 10px;
|
||||
}
|
||||
.goods-size{
|
||||
font-size: 14px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.goods-buy {
|
||||
position: fixed; /* 固定在页面底部 */
|
||||
bottom: 0; /* 距离底部为0 */
|
||||
left: 0; /* 左侧对齐 */
|
||||
width: 100%; /* 宽度占满屏幕 */
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 10rpx 20rpx; /* 添加一些内边距 */
|
||||
background-color: #fff; /* 设置背景颜色 */
|
||||
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1); /* 添加一个阴影 */
|
||||
padding: 10rpx 20rpx;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.left {
|
||||
padding-left: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.left-return {
|
||||
font-size: 32px;
|
||||
flex-grow: 0; /* 防止按钮拉伸 */
|
||||
}
|
||||
|
||||
.right-buy {
|
||||
flex-grow: 0; /* 防止按钮拉伸 */
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
.goods-tab-nav {
|
||||
display: inline-block;
|
||||
width: 33.33%;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
border-bottom: 1rpx solid #ededed;
|
||||
.popup-container {
|
||||
padding: 20rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.popup-close {
|
||||
position: absolute;
|
||||
top: 10rpx;
|
||||
right: 10rpx;
|
||||
}
|
||||
|
||||
.popup-sku-header {
|
||||
display: flex;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.popup-sku-header__goods-info {
|
||||
margin-left: 20rpx;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.popup-sku-header__img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.popup-sku__goods-name {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.goods-price-container {
|
||||
font-size: 30rpx;
|
||||
color: red;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.popup-sku__selected-spec {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.popup-sku-body {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.popup-sku-row__item-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.popup-sku-row__item {
|
||||
flex-basis: 30%;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
color: #c7c7cb;
|
||||
padding: 5rpx;
|
||||
margin-bottom: 10rpx;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.goods-tab-nav.on {
|
||||
color: #bcaa8a;
|
||||
border-bottom: 5rpx solid #bcaa8a;
|
||||
.popup-sku-row__item {
|
||||
padding: 5rpx;
|
||||
margin: 5rpx;
|
||||
text-align: center;
|
||||
border: 1rpx solid #ccc;
|
||||
border-radius: 5rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.goods-content {
|
||||
padding: 40rpx;
|
||||
.popup-sku-row__item--active {
|
||||
border-color: #bcaa8a;
|
||||
border: 1rpx solid rgb(238, 84, 84);
|
||||
}
|
||||
|
||||
|
||||
.popup-sku-row {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.popup-sku-row__title {
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.popup-sku-row__item {
|
||||
display: inline-block;
|
||||
padding: 10rpx 20rpx;
|
||||
margin-right: 10rpx;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 4rpx;
|
||||
font-size: 28rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.popup-sku-stepper-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.popup-sku__stepper-title {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.single-confirm-btn {
|
||||
background-color: #bcaa8a;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 20rpx 0;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 4rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.popup-sku-actions {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.selected-sku-btn {
|
||||
padding: 20rpx;
|
||||
border-radius: 4rpx;
|
||||
font-size: 28rpx;
|
||||
background-color: #bcaa8a;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.popup-sku-disabled {
|
||||
background-color: #ccc;
|
||||
}
|
||||
|
||||
.disabled-sku-selected {
|
||||
color: #ccc;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
|
@ -15,12 +15,13 @@ Page({
|
|||
},
|
||||
onLoad() {
|
||||
var self = this
|
||||
// 获取地址信息
|
||||
// 获取订单status为1的待付款订单
|
||||
wx.request({
|
||||
url: baseUrl + "/order/loadData",
|
||||
method: "POST",
|
||||
data: {
|
||||
userId: 1,
|
||||
status: 1
|
||||
},
|
||||
success(res) {
|
||||
self.setData({
|
||||
|
|
@ -31,7 +32,6 @@ Page({
|
|||
})
|
||||
},
|
||||
onReady() {
|
||||
this.getTotalPrice()
|
||||
},
|
||||
|
||||
onShow: function () {
|
||||
|
|
@ -47,69 +47,4 @@ Page({
|
|||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 计算总价
|
||||
*/
|
||||
getTotalPrice() {
|
||||
let orders = this.data.orders
|
||||
let total = 0
|
||||
for (let i = 0; i < orders.length; i++) {
|
||||
total += orders[i].num * orders[i].price
|
||||
}
|
||||
this.setData({
|
||||
total: total,
|
||||
})
|
||||
},
|
||||
|
||||
toPay() {
|
||||
const self = this
|
||||
|
||||
// 假设订单信息在 this.data.orders 中
|
||||
const orderData = this.data.orders
|
||||
|
||||
wx.showModal({
|
||||
title: "提示",
|
||||
content: "本系统只做演示，支付系统已屏蔽",
|
||||
text: "center",
|
||||
complete() {
|
||||
// 发送订单数据到后端
|
||||
wx.request({
|
||||
url: baseUrl + "/order/addOrUpdate", // 替换为你的后端API地址
|
||||
method: "POST",
|
||||
data: {
|
||||
...orderData,
|
||||
},
|
||||
header: {
|
||||
"Content-Type": "application/json", // 设置请求头
|
||||
},
|
||||
success(res) {
|
||||
if (res.statusCode === 200) {
|
||||
wx.showToast({
|
||||
title: "订单已提交",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
})
|
||||
// 跳转到用户页面
|
||||
wx.switchTab({
|
||||
url: "/page/component/user/user",
|
||||
})
|
||||
} else {
|
||||
wx.showToast({
|
||||
title: "提交失败",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
})
|
||||
}
|
||||
},
|
||||
fail() {
|
||||
wx.showToast({
|
||||
title: "请求失败",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
{
|
||||
"navigationBarTitleText": "订单详情"
|
||||
"navigationBarTitleText": "待付款订单"
|
||||
}
|
||||
|
|
@ -1,21 +1,19 @@
|
|||
<view class="main">
|
||||
<navigator url="../refund/refund">
|
||||
<view class="orders-no-refund">退款 / 售后</view>
|
||||
</navigator>
|
||||
<!-- <view class="orders-no-address">待收货</view> -->
|
||||
|
||||
|
||||
<view class="orders-box">
|
||||
<view wx:for="{{orders}}" wx:key="id" class="orders-list">
|
||||
<image class="orders-thumb" src="{{item.image}}"></image>
|
||||
<view class="orders-pro-name">{{item.title}}</view>
|
||||
<view class="orders-pro-price">￥{{item.price}}</view>
|
||||
<view class="orders-count-num">×{{item.num}}</view>
|
||||
</view>
|
||||
<navigator wx:for="{{orders}}" wx:key="id" url="../orders/orders?id={{item.id}}&title={{item.title}}&price={{item.price}}&num={{item.num}}&image={{item.image}}&specs={{item.specs}}">
|
||||
<view class="orders-list">
|
||||
<image class="orders-thumb" src="{{item.image}}"></image>
|
||||
<view class="orders-info">
|
||||
<view class="orders-info-left">
|
||||
<view class="orders-pro-name">{{item.title}}</view>
|
||||
<view class="order-specs">{{item.specs}}</view>
|
||||
</view>
|
||||
<view class="orders-info-right">
|
||||
<view class="orders-pro-price">￥{{item.price}}</view>
|
||||
<view class="orders-count-num">×{{item.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
|
||||
<!-- <view class="orders-footer">
|
||||
<view class="orders-footer-total">付款合计：￥{{total}}</view>
|
||||
<view class="orders-footer-btn" bindtap="toPay">去付款</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
|
@ -1,31 +1,59 @@
|
|||
@import '../../common/common.wxss';
|
||||
.orders-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
height: 180rpx;
|
||||
border-bottom: 10rpx solid #ededed;
|
||||
}
|
||||
|
||||
.orders-address{
|
||||
position: relative;
|
||||
padding: 20rpx 50rpx 20rpx 35rpx;
|
||||
font-size: 14px;
|
||||
line-height: 25px;
|
||||
border-bottom: 20rpx solid #ededed;
|
||||
color: #adadad;
|
||||
.orders-thumb {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.orders-address::after{
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 60rpx;
|
||||
content: '';
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 4rpx solid #7f7f7f;
|
||||
border-right: 4rpx solid #7f7f7f;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
|
||||
.orders-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.orders-address-name{
|
||||
display: inline-block;
|
||||
width: 300rpx;
|
||||
|
||||
.orders-info-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.orders-no-refund{
|
||||
position: relative;
|
||||
|
||||
.orders-pro-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.order-specs {
|
||||
font-size: 28rpx;
|
||||
color: #888;
|
||||
margin-top: 5rpx;
|
||||
}
|
||||
|
||||
.orders-info-right {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.orders-pro-price {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #AB956D;
|
||||
}
|
||||
|
||||
.orders-count-num {
|
||||
font-size: 28rpx;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.orders-no-refund {
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
font-size: 16px;
|
||||
|
|
@ -34,73 +62,19 @@
|
|||
border-bottom: 20rpx solid #ededed;
|
||||
text-align: center;
|
||||
}
|
||||
.orders-no-address{
|
||||
position: relative;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
font-size: 16px;
|
||||
color: #f56464;
|
||||
border-bottom: 20rpx solid #ededed;
|
||||
text-align: center;
|
||||
}
|
||||
.orders-no-refund::after{
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 34rpx;
|
||||
content: '';
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-top: 4rpx solid #7f7f7f;
|
||||
border-right: 4rpx solid #7f7f7f;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
|
||||
.orders-no-refund::after {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 34rpx;
|
||||
content: '';
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-top: 4rpx solid #7f7f7f;
|
||||
border-right: 4rpx solid #7f7f7f;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.orders-box{
|
||||
padding-bottom: 105rpx;
|
||||
}
|
||||
.orders-list{
|
||||
position: relative;
|
||||
padding:20rpx 20rpx 20rpx 220rpx;
|
||||
height: 180rpx;
|
||||
border-bottom: 1rpx solid #ededed;
|
||||
}
|
||||
.orders-thumb{
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 20rpx;
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
}
|
||||
.orders-list view{
|
||||
line-height: 60rpx;
|
||||
}
|
||||
.orders-pro-price{
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color:red
|
||||
}
|
||||
|
||||
.orders-footer{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 95rpx;
|
||||
line-height: 95rpx;
|
||||
border-top: 1rpx solid #ededed;
|
||||
}
|
||||
.orders-footer .orders-footer-total{
|
||||
display: inline-block;
|
||||
width: 510rpx;
|
||||
padding-left: 30rpx;
|
||||
box-sizing: border-box;
|
||||
color: #a55350;
|
||||
}
|
||||
.orders-footer .orders-footer-btn{
|
||||
display: inline-block;
|
||||
width: 240rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background: #AB956D;
|
||||
.orders-box {
|
||||
padding-bottom: 105rpx;
|
||||
}
|
||||
|
|
@ -9,8 +9,10 @@ Page({
|
|||
price: options.price,
|
||||
num: options.num,
|
||||
image: options.image,
|
||||
specs: options.specs
|
||||
}
|
||||
this.setData({ orders })
|
||||
console.log(this.data.orders)
|
||||
},
|
||||
data: {
|
||||
address: {},
|
||||
|
|
@ -44,63 +46,63 @@ Page({
|
|||
getTotalPrice() {
|
||||
let orders = this.data.orders
|
||||
let total = 0
|
||||
for (let i = 0; i < orders.length; i++) {
|
||||
total += orders[i].num * orders[i].price
|
||||
}
|
||||
total += orders.num * orders.price
|
||||
this.setData({
|
||||
total: total,
|
||||
})
|
||||
},
|
||||
|
||||
toPay() {
|
||||
const self = this
|
||||
|
||||
// 假设订单信息在 this.data.orders 中
|
||||
const orderData = this.data.orders
|
||||
|
||||
// TODO 用户id暂时写死
|
||||
orderData.userId = 1
|
||||
orderData.status = 1
|
||||
console.log(orderData)
|
||||
//先生成订单
|
||||
wx.request({
|
||||
// TODO 未测试
|
||||
url: baseUrl + "/order/addOrUpdate", // 替换为你的后端API地址
|
||||
method: "POST",
|
||||
data: {
|
||||
...orderData,
|
||||
},
|
||||
header: {
|
||||
"Content-Type": "application/json", // 设置请求头
|
||||
},
|
||||
success(res) {
|
||||
if (res.statusCode === 200) {
|
||||
wx.showToast({
|
||||
title: "订单已提交",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
})
|
||||
// 跳转到用户页面
|
||||
wx.switchTab({
|
||||
url: "/page/component/user/user",
|
||||
})
|
||||
} else {
|
||||
wx.showToast({
|
||||
title: "提交失败",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
})
|
||||
}
|
||||
},
|
||||
fail() {
|
||||
wx.showToast({
|
||||
title: "请求失败",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
})
|
||||
},
|
||||
})
|
||||
wx.showModal({
|
||||
title: "提示",
|
||||
content: "本系统只做演示，支付系统已屏蔽",
|
||||
text: "center",
|
||||
complete() {
|
||||
// 发送订单数据到后端
|
||||
wx.request({
|
||||
// TODO 未测试
|
||||
url: baseUrl + "/order/addOrUpdate", // 替换为你的后端API地址
|
||||
method: "POST",
|
||||
data: {
|
||||
...orderData,
|
||||
},
|
||||
header: {
|
||||
"Content-Type": "application/json", // 设置请求头
|
||||
},
|
||||
success(res) {
|
||||
if (res.statusCode === 200) {
|
||||
wx.showToast({
|
||||
title: "订单已提交",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
})
|
||||
// 跳转到用户页面
|
||||
wx.switchTab({
|
||||
url: "/page/component/user/user",
|
||||
})
|
||||
} else {
|
||||
wx.showToast({
|
||||
title: "提交失败",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
})
|
||||
}
|
||||
},
|
||||
fail() {
|
||||
wx.showToast({
|
||||
title: "请求失败",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
})
|
||||
},
|
||||
|
|
|
|||
|
|
@ -11,10 +11,19 @@
|
|||
<view class="orders-box">
|
||||
<view class="orders-list">
|
||||
<image class="orders-thumb" src="{{orders.image}}"></image>
|
||||
<view class="orders-pro-name">{{orders.title}}</view>
|
||||
<view class="orders-pro-price">￥{{orders.price}} ×{{orders.num}}</view>
|
||||
<view class="orders-count-num">免运费</view>
|
||||
<view class="orders-info">
|
||||
<view class="orders-info-left">
|
||||
<view class="orders-pro-name">{{orders.title}}</view>
|
||||
<view class="order-specs">{{orders.specs}}</view>
|
||||
<view class="order-yunf">免运费</view>
|
||||
</view>
|
||||
<view class="orders-info-right">
|
||||
<view class="orders-pro-price">￥{{orders.price}}</view>
|
||||
<view class="orders-count-num">×{{orders.num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<navigator url="../invoice/invoice">
|
||||
<view class="orders-no-address">发票</view>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,79 @@
|
|||
@import '../../common/common.wxss';
|
||||
.orders-list {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
height: 180rpx;
|
||||
border-bottom: 10rpx solid #ededed;
|
||||
}
|
||||
|
||||
.orders-thumb {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.orders-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.orders-info-left {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.order-notes-label {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
margin-right: 10px;
|
||||
/* 标签和输入框之间的间距 */
|
||||
}
|
||||
|
||||
.order-notes-input {
|
||||
flex: 1;
|
||||
/* 输入框占据剩余空间 */
|
||||
padding-left: 10px;
|
||||
margin-right: 10px;
|
||||
font-size: 14px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.orders-pro-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.order-yunf{
|
||||
font-size: 12px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.order-specs {
|
||||
padding-top: 8px;
|
||||
font-size: 28rpx;
|
||||
color: #888;
|
||||
margin-top: 5rpx;
|
||||
}
|
||||
|
||||
.orders-info-right {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.orders-pro-price {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #AB956D;
|
||||
}
|
||||
|
||||
.orders-count-num {
|
||||
font-size: 28rpx;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.orders-address {
|
||||
position: relative;
|
||||
|
|
@ -53,61 +128,11 @@
|
|||
padding-bottom: 105rpx;
|
||||
}
|
||||
|
||||
.orders-list {
|
||||
position: relative;
|
||||
padding: 20rpx 20rpx 20rpx 220rpx;
|
||||
height: 180rpx;
|
||||
border-bottom: 10rpx solid #ededed;
|
||||
}
|
||||
|
||||
.orders-thumb {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 20rpx;
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
.orders-list view {
|
||||
line-height: 60rpx;
|
||||
}
|
||||
|
||||
.order-notes {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
/* 垂直居中对齐 */
|
||||
padding-left: 10px;
|
||||
/* background-color: #f9f9f9; */
|
||||
border-radius: 8px;
|
||||
/* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
|
||||
margin: 20px 0;
|
||||
/* border-bottom: 10rpx solid #ededed; */
|
||||
}
|
||||
.orders-count-num{
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.order-notes-label {
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
margin-right: 10px;
|
||||
/* 标签和输入框之间的间距 */
|
||||
}
|
||||
|
||||
.order-notes-input {
|
||||
flex: 1;
|
||||
/* 输入框占据剩余空间 */
|
||||
padding-left: 10px;
|
||||
margin-right: 10px;
|
||||
font-size: 14px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.order-notes-input::placeholder {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.orders-footer {
|
||||
|
|
@ -134,4 +159,4 @@
|
|||
text-align: center;
|
||||
color: #fff;
|
||||
background: #AB956D;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,10 @@
|
|||
<view class="address-box">
|
||||
<!-- <view class="orders">我的订单</view> -->
|
||||
<view class="address-manage">
|
||||
<navigator url="/page/component/myOrders/myOrder">我的订单</navigator>
|
||||
<navigator url="/page/component/myOrders/myOrder">待付款订单</navigator>
|
||||
</view>
|
||||
<view class="address-manage2">
|
||||
<navigator url="/page/component/myOrders2/myOrder2">待收货订单</navigator>
|
||||
</view>
|
||||
<!-- <view class="orders-list" wx:for="{{orders}}" wx:key="index">
|
||||
<view class="orders-number">订单编号：{{item.number}}</view>
|
||||
|
|
|
|||
|
|
@ -1,120 +1,157 @@
|
|||
@import '../../common/common.wxss';
|
||||
|
||||
.header{
|
||||
position: relative;
|
||||
height: 160rpx;
|
||||
line-height: 100rpx;
|
||||
padding:30rpx 30rpx 30rpx 150rpx;
|
||||
box-sizing: border-box;
|
||||
background: #AB956D;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
}
|
||||
.header .thumb{
|
||||
position: absolute;
|
||||
left: 30rpx;
|
||||
top: 30rpx;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.header .about{
|
||||
float: right;
|
||||
.header {
|
||||
position: relative;
|
||||
height: 160rpx;
|
||||
line-height: 100rpx;
|
||||
padding: 30rpx 30rpx 30rpx 150rpx;
|
||||
box-sizing: border-box;
|
||||
background: #AB956D;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.address-box{
|
||||
border-bottom: 10rpx solid #ededed;
|
||||
color: #999;
|
||||
line-height: 90rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.address-box .address-manage{
|
||||
position: relative;
|
||||
height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
text-align: center;
|
||||
}
|
||||
.address-box .address-manage::after{
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 34rpx;
|
||||
content: '';
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-top: 4rpx solid #7f7f7f;
|
||||
border-right: 4rpx solid #7f7f7f;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.address-box .address-list{
|
||||
padding-left: 30rpx;
|
||||
}
|
||||
.address-box .address-list view{
|
||||
height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
}
|
||||
.address-box .address-list view:last-child{
|
||||
border-bottom: 0;
|
||||
.header .thumb {
|
||||
position: absolute;
|
||||
left: 30rpx;
|
||||
top: 30rpx;
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.orders-box{
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
.header .about {
|
||||
float: right;
|
||||
}
|
||||
.orders{
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
text-align: center;
|
||||
|
||||
.address-box {
|
||||
/* border-bottom: 10rpx solid #ededed; */
|
||||
color: #999;
|
||||
line-height: 90rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.orders-list{
|
||||
padding-left: 30rpx;
|
||||
border-bottom: 20rpx solid #ededed;
|
||||
|
||||
.address-box .address-manage {
|
||||
position: relative;
|
||||
height: 90rpx;
|
||||
border-bottom: 10rpx solid #e9e9e9;
|
||||
text-align: center;
|
||||
}
|
||||
.orders-list:last-child{
|
||||
border-bottom: 0;
|
||||
|
||||
.address-box .address-manage2 {
|
||||
position: relative;
|
||||
height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
text-align: center;
|
||||
}
|
||||
.orders-number{
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
|
||||
.address-box .address-manage::after {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 34rpx;
|
||||
content: '';
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-top: 4rpx solid #7f7f7f;
|
||||
border-right: 4rpx solid #7f7f7f;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.orders-detail{
|
||||
position: relative;
|
||||
height: 120rpx;
|
||||
padding: 35rpx 20rpx 35rpx 170rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
|
||||
.address-box .address-manage2::after {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 34rpx;
|
||||
content: '';
|
||||
width: 16rpx;
|
||||
height: 16rpx;
|
||||
border-top: 4rpx solid #7f7f7f;
|
||||
border-right: 4rpx solid #7f7f7f;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.orders-detail image{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20rpx;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
|
||||
.address-box .address-list {
|
||||
padding-left: 30rpx;
|
||||
}
|
||||
.orders-detail view{
|
||||
line-height: 60rpx;
|
||||
|
||||
.address-box .address-list view {
|
||||
height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
}
|
||||
.orders-detail .orders-status{
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
top: 35rpx;
|
||||
height: 120rpx;
|
||||
line-height: 120rpx;
|
||||
color: #b42f2d;
|
||||
|
||||
.address-box .address-list view:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
.orders-footer{
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
color: #2f2f2f;
|
||||
padding:15rpx 30rpx 15rpx 0;
|
||||
|
||||
.orders-box {
|
||||
color: #999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.orders-footer .orders-btn{
|
||||
float: right;
|
||||
width: 170rpx;
|
||||
height: 60rpx;
|
||||
line-height:60rpx;
|
||||
border-radius: 6rpx;
|
||||
background: #b42f2d;
|
||||
color: #fff;
|
||||
|
||||
.orders {
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.orders-list {
|
||||
padding-left: 30rpx;
|
||||
border-bottom: 20rpx solid #ededed;
|
||||
}
|
||||
|
||||
.orders-list:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.orders-number {
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.orders-detail {
|
||||
position: relative;
|
||||
height: 120rpx;
|
||||
padding: 35rpx 20rpx 35rpx 170rpx;
|
||||
border-bottom: 1rpx solid #e9e9e9;
|
||||
}
|
||||
|
||||
.orders-detail image {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20rpx;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
}
|
||||
|
||||
.orders-detail view {
|
||||
line-height: 60rpx;
|
||||
}
|
||||
|
||||
.orders-detail .orders-status {
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
top: 35rpx;
|
||||
height: 120rpx;
|
||||
line-height: 120rpx;
|
||||
color: #b42f2d;
|
||||
}
|
||||
|
||||
.orders-footer {
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
color: #2f2f2f;
|
||||
padding: 15rpx 30rpx 15rpx 0;
|
||||
}
|
||||
|
||||
.orders-footer .orders-btn {
|
||||
float: right;
|
||||
width: 170rpx;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
border-radius: 6rpx;
|
||||
background: #b42f2d;
|
||||
color: #fff;
|
||||
}
|
||||
Loading…
Reference in New Issue