Browse Source

feat(订单): 调整数字输入框宽度和样式

- 修改uv-number-box组件默认inputWidth为80
- 统一各页面数字输入框宽度为200rpx/250rpx
- 优化订单列表样式和布局
- 修复地址校验逻辑和列表加载逻辑
master
前端-胡立永 2 days ago
parent
commit
db42cbab69
5 changed files with 28 additions and 14 deletions
  1. +11
    -7
      mixins/loadList.js
  2. +7
    -2
      pages/index/order.vue
  3. +4
    -2
      pages_order/order/createOrder.vue
  4. +5
    -2
      pages_order/order/firmOrder.vue
  5. +1
    -1
      uni_modules/uv-number-box/components/uv-number-box/props.js

+ 11
- 7
mixins/loadList.js View File

@ -31,24 +31,29 @@ export default {
} }
}, },
onPullDownRefresh() { onPullDownRefresh() {
this.refreshList()
}, },
onReachBottom() { onReachBottom() {
this.loadMore()
}, },
onShow() {
onLoad() {
this.refreshList()
}, },
methods: { methods: {
// 刷新列表 // 刷新列表
refreshList() { refreshList() {
this.pageNo = 1;
this.queryParams.pageNo = 1;
this.hasMore = true; this.hasMore = true;
this.orderList = [];
this.List = [];
this.loadList(); this.loadList();
}, },
// 加载更多 // 加载更多
loadMore() { loadMore() {
console.log(this.hasMore , this.loading);
if (!this.hasMore || this.loading) return; if (!this.hasMore || this.loading) return;
this.pageNo++;
this.queryParams.pageNo++;
this.loadList(); this.loadList();
}, },
@ -67,8 +72,7 @@ export default {
}; };
this.$api(this.mixinsListApi, query(this, params))
.then(res => {
this.$api(this.mixinsListApi, query(this, params), res => {
this.loading = false; this.loading = false;
uni.stopPullDownRefresh(); uni.stopPullDownRefresh();
@ -88,7 +92,7 @@ export default {
} }
// 判断是否还有更多数据 // 判断是否还有更多数据
this.hasMore = newList.length >= this.pageSize;
this.hasMore = newList.length >= this.queryParams.pageSize;
} else { } else {
uni.showToast({ uni.showToast({
title: res.message || '加载失败', title: res.message || '加载失败',


+ 7
- 2
pages/index/order.vue View File

@ -171,13 +171,14 @@ export default {
margin: 20rpx; margin: 20rpx;
box-sizing: border-box; box-sizing: border-box;
border-radius: 16rpx; border-radius: 16rpx;
padding: 30rpx;
padding: 30rpx 0;
.top { .top {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 30rpx; font-size: 30rpx;
padding: 10rpx 30rpx;
.service {} .service {}
@ -190,7 +191,7 @@ export default {
.content { .content {
display: flex; display: flex;
margin: 10rpx 0;
padding: 10rpx 30rpx;
.left { .left {
width: 150rpx; width: 150rpx;
@ -233,11 +234,15 @@ export default {
border: 1px solid #777; border: 1px solid #777;
color: #777; color: #777;
box-sizing: border-box; box-sizing: border-box;
flex-shrink: 0;
height: fit-content;
} }
.b2 { .b2 {
background: linear-gradient(178deg, $uni-color, #d34f4f); background: linear-gradient(178deg, $uni-color, #d34f4f);
color: #fff; color: #fff;
flex-shrink: 0;
height: fit-content;
} }
view { view {


+ 4
- 2
pages_order/order/createOrder.vue View File

@ -73,7 +73,9 @@
</view> </view>
<view class="stepper"> <view class="stepper">
<uv-number-box button-size="60" v-model="item.selectNum"
<uv-number-box button-size="60rpx"
inputWidth="250rpx"
v-model="item.selectNum"
:max="item.num"></uv-number-box> :max="item.num"></uv-number-box>
</view> </view>
@ -553,7 +555,7 @@
&::v-deep .uv-number-box__input { &::v-deep .uv-number-box__input {
color: $uni-color !important; color: $uni-color !important;
width: 100rpx !important;
width: 200rpx !important;
} }
} }


+ 5
- 2
pages_order/order/firmOrder.vue View File

@ -42,7 +42,10 @@
<text class="price-unit">/{{info.unit || ''}}</text> <text class="price-unit">/{{info.unit || ''}}</text>
</view> </view>
<view class="selectNum"> <view class="selectNum">
<uv-number-box v-model="info.selectNum"></uv-number-box>
<uv-number-box v-model="info.selectNum"
button-size="60rpx"
inputWidth="200rpx"
></uv-number-box>
</view> </view>
</view> </view>
</view> </view>
@ -263,7 +266,7 @@
// //
submitOrder(skipAddressCheck = false) { submitOrder(skipAddressCheck = false) {
if (!skipAddressCheck && this.addressTotal === 0) {
if (!this.address.id) {
const addressForm = this.$refs.addressForm; const addressForm = this.$refs.addressForm;
// //
const isValid = addressForm.parameterVerification(addressForm.addressDetail); const isValid = addressForm.parameterVerification(addressForm.addressDetail);


+ 1
- 1
uni_modules/uv-number-box/components/uv-number-box/props.js View File

@ -51,7 +51,7 @@ export default {
// 输入框宽度,单位为px // 输入框宽度,单位为px
inputWidth: { inputWidth: {
type: [String, Number], type: [String, Number],
default: 35
default: 80
}, },
// 是否显示减少按钮 // 是否显示减少按钮
showMinus: { showMinus: {


Loading…
Cancel
Save