Skip to content

梁建民 / wmsApp

Go to a project
Commit 1b365cc1 by liangjianmin
Options

style(scanTally, SearchBoxWithPicker): 调整样式以提升界面一致性和可读性 

- 更新 scanTally 页面中多个文本和按钮的字体大小及布局，增强视觉效果
- 修改 SearchBoxWithPicker 组件的样式，提升搜索框和选择器的可用性
- 统一调整相关元素的高度和间距，改善用户体验
parent e511c4b1
Expand all
Inline Side-by-side
Showing with 22 additions and 22 deletions
components/SearchBoxWithPicker.vue
...@@ -121,19 +121,19 @@ ...@@ -121,19 +121,19 @@
<style scoped lang="scss"> <style scoped lang="scss">
.search-box-container { .search-box-container {
height: 60rpx; height: 80rpx;
background: #ffffff; background: #ffffff;
border-radius: 10rpx; border-radius: 10rpx;
padding: 0 18rpx; padding: 0 18rpx;
.picker-wrapper { .picker-wrapper {
width: 160rpx; width: 180rpx;
height: 100%; height: 100%;
border-right: 1px solid #f0f0f2; border-right: 1px solid #f0f0f2;
padding: 0 12rpx 0 0; padding: 0 12rpx 0 0;
.picker-text { .picker-text {
font-size: 24rpx; font-size: 30rpx;
color: #292b33; color: #292b33;
font-weight: 600; font-weight: 600;
} }
...@@ -141,9 +141,9 @@ ...@@ -141,9 +141,9 @@
.picker-arrow { .picker-arrow {
width: 0; width: 0;
height: 0; height: 0;
border-left: 8rpx solid transparent; border-left: 10rpx solid transparent;
border-right: 8rpx solid transparent; border-right: 10rpx solid transparent;
border-top: 11rpx solid #666; border-top: 13rpx solid #666;
margin-left: 12rpx; margin-left: 12rpx;
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
transform-origin: center 30%; transform-origin: center 30%;
...@@ -169,7 +169,7 @@ ...@@ -169,7 +169,7 @@
} }
.search-icon { .search-icon {
font-size: 30rpx; font-size: 36rpx;
color: #919399; color: #919399;
margin-left: 10rpx; margin-left: 10rpx;
margin-right: 14rpx; margin-right: 14rpx;
...@@ -178,13 +178,13 @@ ...@@ -178,13 +178,13 @@
.search-input { .search-input {
flex: 1; flex: 1;
font-size: 24rpx; font-size: 30rpx;
color: #484b59; color: #484b59;
height: 100%; height: 100%;
} }
.clear-icon { .clear-icon {
font-size: 30rpx; font-size: 36rpx;
color: #c6c7cc; color: #c6c7cc;
margin-left: 10rpx; margin-left: 10rpx;
flex-shrink: 0; flex-shrink: 0;
......
pages/scanTally/index.vue
...@@ -162,7 +162,7 @@ ...@@ -162,7 +162,7 @@
</view> </view>
</view> </view>
</view> </view>
<view class="status-num row rowCenter verCenter" style="color: #1969f9;font-size: 23rpx;margin-top: 20rpx;">{{ swiperCurr + 1 }}/{{ zyGoodsData.length }}</view> <view class="status-num row rowCenter verCenter" style="color: #1969f9;font-size: 30rpx;margin-top: 20rpx;">{{ swiperCurr + 1 }}/{{ zyGoodsData.length }}</view>
</view> </view>
</swiper-item> </swiper-item>
</swiper> </swiper>
...@@ -243,22 +243,22 @@ ...@@ -243,22 +243,22 @@
</view> </view>
<view class="item row verCenter"> <view class="item row verCenter">
<text class="label">采购员：</text> <text class="label">采购员：</text>
<text class="tt">{{ tallyDetail.purchase_user }}/{{ tallyDetail.purchase_department_name }}</text> <text class="desc" style="max-width: 491rpx;white-space: nowrap;">{{ tallyDetail.purchase_user }}/{{ tallyDetail.purchase_department_name }}</text>
</view> </view>
<view class="item row verCenter" style="flex: 0 0 100%;"> <view class="item row verCenter" style="flex: 0 0 100%;">
<text class="label">客户：</text> <text class="label">客户：</text>
<text class="text" style="font-weight: bold;max-width: 491rpx;">{{ tallyDetail.customer_name }}</text> <text class="text" style="font-weight: bold;max-width: 491rpx;">{{ tallyDetail.customer_name }}</text>
</view> </view>
<view class="item row" style="flex: 0 0 100%;" v-if="tallyDetail.customer_material_number"> <view class="item row" style="flex: 0 0 100%;" v-if="tallyDetail.customer_material_number">
<text class="label" style="width: 112rpx;">客户物料编码：</text> <text class="label" style="width: 150rpx;">客户物料编码：</text>
<text class="tt" style="max-width: 491rpx;">{{ tallyDetail.customer_material_number }}</text> <text class="tt" style="max-width: 491rpx;">{{ tallyDetail.customer_material_number }}</text>
</view> </view>
<view class="item row" style="flex: 0 0 100%;" v-if="tallyDetail.pack_requeire"> <view class="item row" style="flex: 0 0 100%;" v-if="tallyDetail.pack_requeire">
<text class="label" style="width: 112rpx;">包装要求：</text> <text class="label" style="width: 150rpx;">包装要求：</text>
<text class="tt" style="max-width: 491rpx;color: red;">{{ tallyDetail.pack_requeire }}</text> <text class="tt" style="max-width: 491rpx;color: red;">{{ tallyDetail.pack_requeire }}</text>
</view> </view>
<view class="item row" style="flex: 0 0 100%;" v-if="tallyDetail.is_need_three_qc"> <view class="item row" style="flex: 0 0 100%;" v-if="tallyDetail.is_need_three_qc">
<text class="label" style="width: 112rpx;">需三方送检：</text> <text class="label" style="width: 150rpx;">需三方送检：</text>
<text class="tt" style="max-width: 491rpx;color: red;">需三方送检</text> <text class="tt" style="max-width: 491rpx;color: red;">需三方送检</text>
</view> </view>
<view class="item row verCenter" style="flex: 0 0 100%;"> <view class="item row verCenter" style="flex: 0 0 100%;">
...@@ -277,7 +277,7 @@ ...@@ -277,7 +277,7 @@
<!-- 理货表单 --> <!-- 理货表单 -->
<view class="form-input"> <view class="form-input">
<view class="tally-tips-row" v-if="tallyIsTips"> <view class="tally-tips-row" v-if="tallyIsTips">
<text style="color: red;font-size:16rpx;">⚠注意：理货数与待理货数不一致</text> <text style="color: red;font-size:24rpx;">⚠注意：理货数与待理货数不一致</text>
</view> </view>
<view class="row bothSide verCenter input-box-wrap"> <view class="row bothSide verCenter input-box-wrap">
<view> <view>
...@@ -346,7 +346,7 @@ ...@@ -346,7 +346,7 @@
</template> </template>
<view class="default row rowCenter verCenter" @click="chooseTallyImage()" v-if="tallyImageList.length < maxImageCount"><text class="iconfont icon-a-juxing3"></text></view> <view class="default row rowCenter verCenter" @click="chooseTallyImage()" v-if="tallyImageList.length < maxImageCount"><text class="iconfont icon-a-juxing3"></text></view>
</view> </view>
<p style="color: red;font-size: 17rpx;margin-bottom: 10rpx;" v-if="tallyDetail.is_watch == 1">选中包含有采购需看货的物料，建议上传理货照片！</p> <p style="color: red;font-size: 24rpx;margin-bottom: 10rpx;" v-if="tallyDetail.is_watch == 1">选中包含有采购需看货的物料，建议上传理货照片！</p>
<view class="print row verCenter" @click="tallyPicFlag = !tallyPicFlag; tallyFormParams.is_mobile_default_img = tallyPicFlag ? 1 : 0;"> <view class="print row verCenter" @click="tallyPicFlag = !tallyPicFlag; tallyFormParams.is_mobile_default_img = tallyPicFlag ? 1 : 0;">
<text class="check-box-icon" :class="{ curr: tallyPicFlag }"></text> <text class="check-box-icon" :class="{ curr: tallyPicFlag }"></text>
<text class="tt">整单照片</text> <text class="tt">整单照片</text>
...@@ -379,27 +379,27 @@ ...@@ -379,27 +379,27 @@
<text class="tt">{{ tallyDetail.mpq }}</text> <text class="tt">{{ tallyDetail.mpq }}</text>
</view> </view>
<view class="item row verCenter" style="flex: 0 0 100%;"> <view class="item row verCenter" style="flex: 0 0 100%;">
<text class="label" style="width: 128rpx;">单位长宽高：</text> <text class="label" style="width: 180rpx;">单位长宽高：</text>
<text class="tt" style="max-width: 100%;">{{ tallyDetail.unit_length }}&nbsp;*{{ tallyDetail.unit_width }}&nbsp;*{{ tallyDetail.unit_high }}</text> <text class="tt" style="max-width: 100%;">{{ tallyDetail.unit_length }}&nbsp;*{{ tallyDetail.unit_width }}&nbsp;*{{ tallyDetail.unit_high }}</text>
</view> </view>
<view class="item row verCenter"> <view class="item row verCenter">
<text class="label" style="width: 113rpx;">单位净重：</text> <text class="label" style="width: 160rpx;">单位净重：</text>
<text class="tt">{{ tallyDetail.unit_net_weight }}</text> <text class="tt">{{ tallyDetail.unit_net_weight }}</text>
</view> </view>
<view class="item row verCenter"> <view class="item row verCenter">
<text class="label" style="width: 113rpx;">单位毛重：</text> <text class="label" style="width: 160rpx;">单位毛重：</text>
<text class="tt">{{ tallyDetail.unit_gross_weight }}</text> <text class="tt">{{ tallyDetail.unit_gross_weight }}</text>
</view> </view>
<view class="item row verCenter" style="flex: 0 0 100%;"> <view class="item row verCenter" style="flex: 0 0 100%;">
<text class="label" style="width: 128rpx;">标准包装长宽高：</text> <text class="label" style="width: 210rpx;">标准包装长宽高：</text>
<text class="tt" style="max-width: 100%;">{{ tallyDetail.standard_length }}&nbsp;*{{ tallyDetail.standard_width }}&nbsp;*{{ tallyDetail.standard_high }}</text> <text class="tt" style="max-width: 100%;">{{ tallyDetail.standard_length }}&nbsp;*{{ tallyDetail.standard_width }}&nbsp;*{{ tallyDetail.standard_high }}</text>
</view> </view>
<view class="item row verCenter"> <view class="item row verCenter">
<text class="label" style="width: 113rpx;">标准包装净重：</text> <text class="label" style="width: 180rpx;">标准包装净重：</text>
<text class="tt">{{ tallyDetail.standard_net_weight }}</text> <text class="tt">{{ tallyDetail.standard_net_weight }}</text>
</view> </view>
<view class="item row verCenter"> <view class="item row verCenter">
<text class="label" style="width: 113rpx;">标准包装毛重：</text> <text class="label" style="width: 180rpx;">标准包装毛重：</text>
<text class="tt">{{ tallyDetail.standard_gross_weight }}</text> <text class="tt">{{ tallyDetail.standard_gross_weight }}</text>
</view> </view>
<view class="item row verCenter"> <view class="item row verCenter">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment