|
|
@@ -9,16 +9,16 @@
|
|
|
<view class="list-scroll-view">
|
|
|
<view class="two_1">
|
|
|
<view class="cond_1">
|
|
|
- 默认
|
|
|
+ 全部
|
|
|
</view>
|
|
|
<view class="cond_1">
|
|
|
- 默认
|
|
|
+ 待付款
|
|
|
</view>
|
|
|
<view class="cond_1">
|
|
|
- 默认
|
|
|
+ 待发货
|
|
|
</view>
|
|
|
<view class="cond_1">
|
|
|
- 默认
|
|
|
+ 待发货/消费
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="two_2">
|
|
|
@@ -48,7 +48,15 @@
|
|
|
</view>
|
|
|
<view class="list_3">
|
|
|
<text>共{{item.num}}件商品</text>
|
|
|
- <text>总价¥{{item.money}}</text>
|
|
|
+ <view class="money">
|
|
|
+ <text>总价¥</text>
|
|
|
+ <text>{{item.money}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="list_4">
|
|
|
+ <button type="default" size="mini" plain="true"
|
|
|
+ @click="toCancel(item)">取消订单</button>
|
|
|
+ <button type="warn" size="mini" plain="true" @click="toPay(item)">付款</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -102,6 +110,14 @@
|
|
|
toInput(e) {
|
|
|
const that = this;
|
|
|
that.$set(that.searchInfo, `name`, e.detail.value)
|
|
|
+ },
|
|
|
+ // 取消订单
|
|
|
+ toCancel(e) {
|
|
|
+ console.log(e);
|
|
|
+ },
|
|
|
+ // 付款
|
|
|
+ toPay(e) {
|
|
|
+ console.log(e);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -128,6 +144,7 @@
|
|
|
.two {
|
|
|
position: relative;
|
|
|
flex-grow: 1;
|
|
|
+ background-color: var(--f9Color);
|
|
|
|
|
|
.two_1 {
|
|
|
background-color: var(--fffColor);
|
|
|
@@ -139,13 +156,11 @@
|
|
|
.two_2 {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- padding: 2vw 2vw 0 2vw;
|
|
|
|
|
|
.list {
|
|
|
- width: 95vw;
|
|
|
- border-radius: 5px;
|
|
|
- border: 1px solid red;
|
|
|
+ width: 100vw;
|
|
|
margin: 2vw 0 0 0;
|
|
|
+ background-color: var(--mainColor);
|
|
|
|
|
|
.list_1 {
|
|
|
display: flex;
|
|
|
@@ -154,7 +169,7 @@
|
|
|
padding: 2vw;
|
|
|
|
|
|
.name {
|
|
|
- font-size: var(--font16Size);
|
|
|
+ font-size: var(--font14Size);
|
|
|
|
|
|
text {
|
|
|
margin: 0 1vw 0 0;
|
|
|
@@ -162,7 +177,7 @@
|
|
|
}
|
|
|
|
|
|
.status {
|
|
|
- font-size: var(--font16Size);
|
|
|
+ font-size: var(--font14Size);
|
|
|
color: var(--ff0Color);
|
|
|
}
|
|
|
}
|
|
|
@@ -172,11 +187,11 @@
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
padding: 2vw;
|
|
|
- background-color: var(--f1Color);
|
|
|
+ background-color: var(--f8Color);
|
|
|
|
|
|
.image {
|
|
|
- width: 25vw;
|
|
|
- height: 25vw;
|
|
|
+ width: 20vw;
|
|
|
+ height: 20vw;
|
|
|
margin: 0 2vw 0 0;
|
|
|
}
|
|
|
|
|
|
@@ -186,25 +201,46 @@
|
|
|
flex-grow: 1;
|
|
|
|
|
|
.name {
|
|
|
- font-size: var(--font16Size);
|
|
|
+ font-size: var(--font14Size);
|
|
|
font-weight: bold;
|
|
|
margin: 0 0 2vw 0;
|
|
|
}
|
|
|
|
|
|
.other_1 {
|
|
|
- font-size: var(--font14Size);
|
|
|
+ font-size: var(--font12Size);
|
|
|
color: var(--f85Color);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.money {
|
|
|
- font-size: var(--font14Size);
|
|
|
+ font-size: var(--font12Size);
|
|
|
|
|
|
.num {
|
|
|
text-align: right;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .list_3 {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ padding: 2vw;
|
|
|
+ border-bottom: 0.5vw solid var(--f9Color);
|
|
|
+ font-size: var(--font12Size);
|
|
|
+
|
|
|
+ text {
|
|
|
+ margin: 0 1vw;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .list_4 {
|
|
|
+ padding: 2vw;
|
|
|
+ text-align: right;
|
|
|
+
|
|
|
+ button {
|
|
|
+ margin: 0 1vw 0 2vw;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
zs