linweidong
/
besure_app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style：产品入库-产品/托盘码选择框样式优化

Browse Source
master
黄伟杰 19 hours ago
parent 31059c65e7
commit d7cb0d2a8b
1 changed files with 48 additions and 31 deletions
Show Stats Download Patch File Download Diff File

79
src/pages_function/pages/productInbound/productConfirm.vue
Unescape Escape View File

@ -33,16 +33,21 @@
<view v-if="relateTask && taskId" class="form-field"> <view v-if="relateTask && taskId" class="form-field">
<text class="form-label">{{ t('productInbound.product') }}<text class="required-star">*</text></text> <text class="form-label">{{ t('productInbound.product') }}<text class="required-star">*</text></text>
<view class="task-product-search-row"> <view class="task-product-search-row">
<input <view class="scan-input-wrap">
id="product-inbound-task-product-scan-input" <input
v-model="taskProductScanInput" id="product-inbound-task-product-scan-input"
class="task-product-scan-input" v-model="taskProductScanInput"
type="text" class="task-product-scan-input"
:placeholder="t('productInbound.selectProduct')" type="text"
confirm-type="done" :placeholder="t('productInbound.selectProduct')"
@input="onTaskProductScanInput" confirm-type="done"
@confirm="onTaskProductScanConfirm" @input="onTaskProductScanInput"
/> @confirm="onTaskProductScanConfirm"
/>
<view class="scan-input-icon">
<uni-icons type="scan" size="20" color="#9ca3af"></uni-icons>
</view>
</view>
<view class="task-product-select-field" @click="goSelectTaskProduct"> <view class="task-product-select-field" @click="goSelectTaskProduct">
<text class="task-product-select-text">{{ t('productInbound.selectProductTitle') }}</text> <text class="task-product-select-text">{{ t('productInbound.selectProductTitle') }}</text>
</view> </view>
@ -52,16 +57,21 @@
<view v-if="!relateTask" class="form-field"> <view v-if="!relateTask" class="form-field">
<text class="form-label">{{ t('productInbound.product') }}<text class="required-star">*</text></text> <text class="form-label">{{ t('productInbound.product') }}<text class="required-star">*</text></text>
<view class="task-product-search-row"> <view class="task-product-search-row">
<input <view class="scan-input-wrap">
id="product-inbound-product-scan-input" <input
v-model="productScanInput" id="product-inbound-product-scan-input"
class="task-product-scan-input" v-model="productScanInput"
type="text" class="task-product-scan-input"
:placeholder="t('productInbound.selectProduct')" type="text"
confirm-type="done" :placeholder="t('productInbound.selectProduct')"
@input="onProductScanInput" confirm-type="done"
@confirm="onProductScanConfirm" @input="onProductScanInput"
/> @confirm="onProductScanConfirm"
/>
<view class="scan-input-icon">
<uni-icons type="scan" size="20" color="#9ca3af"></uni-icons>
</view>
</view>
<view class="task-product-select-field" @click="goSelectProduct"> <view class="task-product-select-field" @click="goSelectProduct">
<text class="task-product-select-text">{{ t('productInbound.selectProductTitle') }}</text> <text class="task-product-select-text">{{ t('productInbound.selectProductTitle') }}</text>
</view> </view>
@ -112,16 +122,21 @@
<text v-if="selectedPallets.length" class="label-tip">{{ t('productInbound.selectedPalletCount', { count: selectedPallets.length }) }}</text> <text v-if="selectedPallets.length" class="label-tip">{{ t('productInbound.selectedPalletCount', { count: selectedPallets.length }) }}</text>
</view> </view>
<view class="task-product-search-row"> <view class="task-product-search-row">
<input <view class="scan-input-wrap">
id="product-inbound-pallet-scan-input" <input
v-model="palletScanInput" id="product-inbound-pallet-scan-input"
class="task-product-scan-input" v-model="palletScanInput"
type="text" class="task-product-scan-input"
:placeholder="palletCode || t('productInbound.selectPallet')" type="text"
confirm-type="done" :placeholder="palletCode || t('productInbound.selectPallet')"
@input="onPalletScanInput" confirm-type="done"
@confirm="onPalletScanConfirm" @input="onPalletScanInput"
/> @confirm="onPalletScanConfirm"
/>
<view class="scan-input-icon">
<uni-icons type="scan" size="20" color="#9ca3af"></uni-icons>
</view>
</view>
<view class="task-product-select-field" @click="goSelectPallet"> <view class="task-product-select-field" @click="goSelectPallet">
<text class="task-product-select-text">{{ t('productInbound.selectPalletTitle') }}</text> <text class="task-product-select-text">{{ t('productInbound.selectPalletTitle') }}</text>
</view> </view>
@ -784,7 +799,9 @@ onShow(async () => {
.select-placeholder { font-size: 28rpx; color: #9ca3af; } .select-placeholder { font-size: 28rpx; color: #9ca3af; }
.select-subtext { font-size: 24rpx; color: #6b7280; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .select-subtext { font-size: 24rpx; color: #6b7280; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-product-search-row { display: flex; align-items: center; gap: 16rpx; } .task-product-search-row { display: flex; align-items: center; gap: 16rpx; }
.task-product-scan-input { flex: 1; min-width: 0; height: 70rpx; padding: 0 22rpx; background: #f8fafc; border: 1rpx solid #e5e7eb; border-radius: 14rpx; box-sizing: border-box; font-size: 28rpx; color: #1f2937; } .scan-input-wrap { position: relative; flex: 1; min-width: 0; }
.task-product-scan-input { width: 100%; height: 70rpx; padding: 0 64rpx 0 22rpx; background: #f8fafc; border: 1rpx solid #e5e7eb; border-radius: 14rpx; box-sizing: border-box; font-size: 28rpx; color: #1f2937; }
.scan-input-icon { position: absolute; right: 20rpx; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.task-product-select-field { flex-shrink: 0; width: 160rpx; min-height: 70rpx; padding: 0 18rpx; background: #1f4b79; border-radius: 14rpx; box-sizing: border-box; display: flex; align-items: center; justify-content: center; } .task-product-select-field { flex-shrink: 0; width: 160rpx; min-height: 70rpx; padding: 0 18rpx; background: #1f4b79; border-radius: 14rpx; box-sizing: border-box; display: flex; align-items: center; justify-content: center; }
.task-product-select-text { flex: 1; min-width: 0; font-size: 26rpx; font-weight: 600; color: #ffffff; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .task-product-select-text { flex: 1; min-width: 0; font-size: 26rpx; font-weight: 600; color: #ffffff; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.info-panel { margin-top: 22rpx; padding: 20rpx; background: #f8fafc; border: 1rpx solid #e8eef6; border-radius: 16rpx; } .info-panel { margin-top: 22rpx; padding: 20rpx; background: #f8fafc; border: 1rpx solid #e8eef6; border-radius: 16rpx; }

Write Preview
Loading…
Cancel
Save