|
|
<template>
|
|
|
<view class="page-container">
|
|
|
<NavBar :title="'确认备件入库'" />
|
|
|
|
|
|
<!-- 已选备件 -->
|
|
|
<view class="sparepart-section">
|
|
|
<view class="section-title-bar">
|
|
|
<view class="section-bar-line"></view>
|
|
|
<text class="section-title">已选备件</text>
|
|
|
</view>
|
|
|
<view class="sparepart-card">
|
|
|
<view class="card-top">
|
|
|
<view class="card-image-wrap">
|
|
|
<image
|
|
|
v-if="sparepartImage"
|
|
|
:src="sparepartImage"
|
|
|
class="card-image"
|
|
|
mode="aspectFill"
|
|
|
/>
|
|
|
<view v-else class="card-image-empty">
|
|
|
<text class="empty-img-icon">📦</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="card-info-right">
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">备件名称:</text>
|
|
|
<text class="info-name">{{ textValue(sparepart.name) }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">规格:</text>
|
|
|
<text class="info-value">{{ textValue(sparepart.standard || sparepart.deviceSpec) }}</text>
|
|
|
</view>
|
|
|
<view class="info-item">
|
|
|
<text class="info-label">当前总库存:</text>
|
|
|
<text class="info-value stock-highlight">{{ sparepart.count != null ? sparepart.count : 0 }}{{ textUnit(sparepart.unitName || sparepart.minStockUnitName || '个') }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="card-bottom">
|
|
|
<view class="detail-row two-col">
|
|
|
<view class="detail-col">
|
|
|
<text class="detail-label">采购单位:</text>
|
|
|
<text class="detail-value">{{ textValue(sparepart.purchaseUnitName) }}</text>
|
|
|
</view>
|
|
|
<view class="detail-col">
|
|
|
<text class="detail-label">库存单位:</text>
|
|
|
<text class="detail-value">{{ textValue(sparepart.unitName || sparepart.minStockUnitName || '个') }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="detail-row">
|
|
|
<text class="detail-label">换算关系:</text>
|
|
|
<text class="detail-value">1{{ textValue(sparepart.purchaseUnitName) }}={{ textValue(sparepart.purchaseUnitConvertQuantity) }}{{ stockUnitLabel(sparepart) }}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 仓库/库区 -->
|
|
|
<view class="section-title-bar" style="padding-top: 24rpx;">
|
|
|
<view class="section-bar-line"></view>
|
|
|
<text class="section-title">仓库/库区</text>
|
|
|
</view>
|
|
|
<view class="select-row-card warehouse-area-card">
|
|
|
<view class="warehouse-area-rows">
|
|
|
<view class="warehouse-area-row">
|
|
|
<text class="warehouse-area-label">仓库</text>
|
|
|
<view class="warehouse-area-dropdown" @click="toggleWarehouseDropdown">
|
|
|
<view class="dropdown-input">
|
|
|
<text :class="['dropdown-value', { placeholder: !selectedWarehouse }]">
|
|
|
{{ selectedWarehouse ? selectedWarehouse.label : '请选择' }}
|
|
|
</text>
|
|
|
<text class="dropdown-arrow">▼</text>
|
|
|
</view>
|
|
|
<view v-if="showWarehouseDropdown" class="dropdown-panel">
|
|
|
<view class="dropdown-scroll">
|
|
|
<view
|
|
|
v-for="item in warehouseOptions"
|
|
|
:key="item.value"
|
|
|
class="dropdown-item"
|
|
|
:class="{ active: selectedWarehouse?.value === item.value }"
|
|
|
@click.stop="handleSelectWarehouse(item)"
|
|
|
>
|
|
|
<text class="dropdown-item-text">{{ item.label }}</text>
|
|
|
<text v-if="selectedWarehouse?.value === item.value" class="dropdown-check">✓</text>
|
|
|
</view>
|
|
|
<view v-if="!warehouseOptions.length" class="dropdown-empty">暂无数据</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="warehouse-area-row">
|
|
|
<text class="warehouse-area-label">库区</text>
|
|
|
<view class="warehouse-area-dropdown" @click="toggleAreaDropdown">
|
|
|
<view class="dropdown-input">
|
|
|
<text :class="['dropdown-value', { placeholder: !selectedArea }]">
|
|
|
{{ selectedArea ? selectedArea.label : (loadingAreas ? '加载中...' : '请选择') }}
|
|
|
</text>
|
|
|
<text class="dropdown-arrow">▼</text>
|
|
|
</view>
|
|
|
<view v-if="showAreaDropdown" class="dropdown-panel">
|
|
|
<view class="dropdown-scroll">
|
|
|
<view
|
|
|
v-for="item in areaOptions"
|
|
|
:key="item.value"
|
|
|
class="dropdown-item"
|
|
|
:class="{ active: selectedArea?.value === item.value }"
|
|
|
@click.stop="handleSelectArea(item)"
|
|
|
>
|
|
|
<text class="dropdown-item-text">{{ item.label }}</text>
|
|
|
<text v-if="selectedArea?.value === item.value" class="dropdown-check">✓</text>
|
|
|
</view>
|
|
|
<view v-if="!areaOptions.length" class="dropdown-empty">暂无数据</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 入库数量 -->
|
|
|
<view class="section-title-bar" style="padding-top: 24rpx;">
|
|
|
<view class="section-bar-line"></view>
|
|
|
<text class="section-title">入库数量</text>
|
|
|
</view>
|
|
|
<view class="qty-input-card">
|
|
|
<view class="form-field">
|
|
|
<text class="form-label">入库数量</text>
|
|
|
<input
|
|
|
v-model="inboundQty"
|
|
|
class="form-input"
|
|
|
placeholder="请输入"
|
|
|
confirm-type="done"
|
|
|
/>
|
|
|
<text class="form-suffix-text">单位:{{ textValue(sparepart.purchaseUnitName) }}</text>
|
|
|
</view>
|
|
|
<view class="convert-row">
|
|
|
<text class="convert-label-inline">折算后库存数量:</text>
|
|
|
<text class="convert-value-inline">{{ calculatedStock }}</text>
|
|
|
<text class="convert-unit-inline">{{ stockUnitLabel(sparepart) }}</text>
|
|
|
</view>
|
|
|
<view class="convert-formula-inline">
|
|
|
{{ inboundQty || 0 }}{{ textValue(sparepart.purchaseUnitName) }} × {{ textValue(sparepart.purchaseUnitConvertQuantity) }}{{ stockUnitLabel(sparepart) }} = {{ calculatedStock }}{{ stockUnitLabel(sparepart) }}
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 供应商 -->
|
|
|
<view class="section-title-bar" style="padding-top: 24rpx;">
|
|
|
<view class="section-bar-line"></view>
|
|
|
<text class="section-title">供应商</text>
|
|
|
</view>
|
|
|
<view class="select-row-card">
|
|
|
<view class="full-dropdown">
|
|
|
<text :class="{ placeholder: !defaultSupplierName }">
|
|
|
{{ defaultSupplierName || '未配置默认供应商' }}
|
|
|
</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 底部确认按钮 -->
|
|
|
<view class="bottom-actions">
|
|
|
<view class="bottom-btn cancel-btn" @click="handleCancel">取消</view>
|
|
|
<view class="bottom-btn confirm-btn" @click="handleConfirm">确认</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
import { ref, computed } from 'vue'
|
|
|
import { onShow, onHide } from '@dcloudio/uni-app'
|
|
|
import NavBar from '@/components/common/NavBar.vue'
|
|
|
import { getWarehouseSimpleList, getWarehouseAreaSimpleList } from '@/api/mes/moldget'
|
|
|
import { getSparepartDetail, getSparepartStockCount } from '@/api/mes/sparepart'
|
|
|
|
|
|
const sparepart = ref({})
|
|
|
const inboundQty = ref(null)
|
|
|
const supplierId = ref(undefined)
|
|
|
const supplierName = ref('')
|
|
|
|
|
|
// 仓库下拉
|
|
|
const warehouseOptions = ref([])
|
|
|
const selectedWarehouse = ref(null)
|
|
|
const showWarehouseDropdown = ref(false)
|
|
|
|
|
|
// 库区下拉
|
|
|
const areaOptions = ref([])
|
|
|
const selectedArea = ref(null)
|
|
|
const showAreaDropdown = ref(false)
|
|
|
const loadingAreas = ref(false)
|
|
|
|
|
|
const sparepartImage = computed(() => {
|
|
|
const images = sparepart.value.images
|
|
|
if (!images) return ''
|
|
|
if (Array.isArray(images)) return String(images[0] || '')
|
|
|
return String(images).split(',')[0]?.trim() || ''
|
|
|
})
|
|
|
|
|
|
const calculatedStock = computed(() => {
|
|
|
const qty = Number(inboundQty.value) || 0
|
|
|
const ratio = Number(sparepart.value.purchaseUnitConvertQuantity) || 0
|
|
|
return qty * ratio
|
|
|
})
|
|
|
|
|
|
const defaultSupplierName = computed(() => {
|
|
|
const suppliers = sparepart.value.suppliers
|
|
|
const defaultId = sparepart.value.defaultSupplierId
|
|
|
if (!suppliers || !suppliers.length) return ''
|
|
|
if (defaultId) {
|
|
|
const found = suppliers.find(s => s.supplierId === defaultId || s.id === defaultId)
|
|
|
if (found) return found.supplierName || ''
|
|
|
}
|
|
|
const firstDefault = suppliers.find(s => s.defaultStatus === 1)
|
|
|
return firstDefault?.supplierName || ''
|
|
|
})
|
|
|
|
|
|
function textValue(v) {
|
|
|
if (v === 0) return '0'
|
|
|
if (v == null) return '-'
|
|
|
const s = String(v).trim()
|
|
|
return s || '-'
|
|
|
}
|
|
|
|
|
|
function textUnit(v) {
|
|
|
if (v === 0) return '0'
|
|
|
if (v == null) return ''
|
|
|
return String(v).trim()
|
|
|
}
|
|
|
|
|
|
function stockUnitLabel(item) {
|
|
|
return item.unitName || item.minStockUnitName || '个'
|
|
|
}
|
|
|
|
|
|
function handleCancel() {
|
|
|
uni.navigateBack()
|
|
|
}
|
|
|
|
|
|
function handleConfirm() {
|
|
|
if (!inboundQty.value || Number(inboundQty.value) <= 0) {
|
|
|
uni.showToast({ title: '请输入入库数量', icon: 'none' })
|
|
|
return
|
|
|
}
|
|
|
if (!selectedWarehouse.value) {
|
|
|
uni.showToast({ title: '请选择仓库', icon: 'none' })
|
|
|
return
|
|
|
}
|
|
|
if (!selectedArea.value) {
|
|
|
uni.showToast({ title: '请选择库区', icon: 'none' })
|
|
|
return
|
|
|
}
|
|
|
|
|
|
// 构建入库项,存入 globalData 列表
|
|
|
const item = {
|
|
|
// 备件信息
|
|
|
productId: sparepart.value.id,
|
|
|
productName: sparepart.value.name || '',
|
|
|
productBarCode: sparepart.value.barCode || '',
|
|
|
productUnitName: sparepart.value.unitName || sparepart.value.minStockUnitName || '',
|
|
|
purchaseUnitName: sparepart.value.purchaseUnitName || '',
|
|
|
purchaseUnitConvertQuantity: Number(sparepart.value.purchaseUnitConvertQuantity) || 1,
|
|
|
// 入库信息
|
|
|
inputCount: Number(inboundQty.value),
|
|
|
count: Number(inboundQty.value) * (Number(sparepart.value.purchaseUnitConvertQuantity) || 1),
|
|
|
// 供应商
|
|
|
supplierId: sparepart.value.defaultSupplierId,
|
|
|
supplierName: defaultSupplierName.value,
|
|
|
// 仓库库区
|
|
|
warehouseId: selectedWarehouse.value.value,
|
|
|
warehouseName: selectedWarehouse.value.label,
|
|
|
areaId: selectedArea.value.value,
|
|
|
areaName: selectedArea.value.label,
|
|
|
// 原始 sparepart 引用(供展示用)
|
|
|
_sparepart: { ...sparepart.value }
|
|
|
}
|
|
|
|
|
|
// 存入 globalData 列表
|
|
|
if (!getApp().globalData._sparepartInboundItems) {
|
|
|
getApp().globalData._sparepartInboundItems = []
|
|
|
}
|
|
|
getApp().globalData._sparepartInboundItems.push(item)
|
|
|
|
|
|
uni.showToast({ title: '已添加: ' + (sparepart.value.name || ''), icon: 'success', duration: 1200 })
|
|
|
setTimeout(() => {
|
|
|
// 扫码进入(delta=1) vs 选择进入(delta=2,需跳过select页)
|
|
|
const fromScan = getApp().globalData._sparepartFromScan
|
|
|
getApp().globalData._sparepartFromScan = false
|
|
|
uni.navigateBack({ delta: fromScan ? 1 : 2 })
|
|
|
}, 800)
|
|
|
}
|
|
|
|
|
|
// 仓库
|
|
|
function toggleWarehouseDropdown() {
|
|
|
showWarehouseDropdown.value = !showWarehouseDropdown.value
|
|
|
}
|
|
|
function handleSelectWarehouse(item) {
|
|
|
selectedWarehouse.value = item
|
|
|
showWarehouseDropdown.value = false
|
|
|
selectedArea.value = null
|
|
|
areaOptions.value = []
|
|
|
loadAreas(item.value)
|
|
|
}
|
|
|
async function loadWarehouses() {
|
|
|
try {
|
|
|
const res = await getWarehouseSimpleList()
|
|
|
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
|
|
|
warehouseOptions.value = data.map((w) => ({
|
|
|
value: w.id,
|
|
|
label: w.name || String(w.id || '')
|
|
|
}))
|
|
|
} catch (e) {
|
|
|
console.error('loadWarehouses error', e)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// 库区
|
|
|
function toggleAreaDropdown() {
|
|
|
if (!selectedWarehouse.value) {
|
|
|
uni.showToast({ title: '请先选择仓库', icon: 'none' })
|
|
|
return
|
|
|
}
|
|
|
showAreaDropdown.value = !showAreaDropdown.value
|
|
|
}
|
|
|
function handleSelectArea(item) {
|
|
|
selectedArea.value = item
|
|
|
showAreaDropdown.value = false
|
|
|
}
|
|
|
async function loadAreas(warehouseId) {
|
|
|
if (!warehouseId) return
|
|
|
loadingAreas.value = true
|
|
|
areaOptions.value = []
|
|
|
try {
|
|
|
const res = await getWarehouseAreaSimpleList(warehouseId)
|
|
|
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
|
|
|
areaOptions.value = data.map((a) => ({
|
|
|
value: a.id,
|
|
|
label: a.name || a.areaName || String(a.id || '')
|
|
|
}))
|
|
|
} catch (e) {
|
|
|
console.error('loadAreas error', e)
|
|
|
} finally {
|
|
|
loadingAreas.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
onShow(async () => {
|
|
|
// 从 globalData 读取选择的备件
|
|
|
const selectResult = getApp().globalData?._sparepartBeforeConfirm
|
|
|
if (selectResult) {
|
|
|
sparepart.value = selectResult
|
|
|
inboundQty.value = null
|
|
|
getApp().globalData._sparepartBeforeConfirm = null
|
|
|
// 获取详情补充库存等信息
|
|
|
if (selectResult.id) {
|
|
|
try {
|
|
|
const res = await getSparepartDetail(selectResult.id)
|
|
|
const detail = res?.data || res
|
|
|
if (detail) {
|
|
|
sparepart.value = { ...sparepart.value, ...detail }
|
|
|
loadStockCount()
|
|
|
}
|
|
|
} catch (e) {
|
|
|
console.error('获取备件详情失败:', e)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
loadWarehouses()
|
|
|
})
|
|
|
|
|
|
async function loadStockCount() {
|
|
|
const id = sparepart.value.id
|
|
|
if (!id) return
|
|
|
try {
|
|
|
const res = await getSparepartStockCount(id)
|
|
|
sparepart.value.count = (res?.data ?? res) != null ? Number(res?.data ?? res) : 0
|
|
|
} catch (e) {
|
|
|
console.error('获取库存失败:', e)
|
|
|
sparepart.value.count = 0
|
|
|
}
|
|
|
}
|
|
|
|
|
|
onHide(() => {
|
|
|
showWarehouseDropdown.value = false
|
|
|
showAreaDropdown.value = false
|
|
|
})
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.page-container {
|
|
|
min-height: 100vh;
|
|
|
background: #f5f6f8;
|
|
|
padding-bottom: calc(120rpx + env(safe-area-inset-bottom));
|
|
|
}
|
|
|
|
|
|
.sparepart-section { padding: 0; }
|
|
|
.section-title-bar { display: flex; align-items: center; gap: 10rpx; padding: 24rpx 24rpx 18rpx; }
|
|
|
.section-bar-line { width: 6rpx; height: 32rpx; border-radius: 3rpx; background: #2563eb; flex-shrink: 0; }
|
|
|
.section-title { font-size: 30rpx; font-weight: 700; color: #1a1a1a; }
|
|
|
|
|
|
.sparepart-card {
|
|
|
background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx 20rpx;
|
|
|
box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.04);
|
|
|
}
|
|
|
|
|
|
.card-top { display: flex; position: relative; }
|
|
|
.card-image-wrap {
|
|
|
width: 160rpx; height: 160rpx; border-radius: 12rpx; overflow: hidden;
|
|
|
background: #f8fafc; border: 1rpx solid #f0f0f0; flex-shrink: 0; margin-right: 20rpx;
|
|
|
}
|
|
|
.card-image { width: 100%; height: 100%; }
|
|
|
.card-image-empty { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #f8fafc; }
|
|
|
.empty-img-icon { font-size: 56rpx; opacity: 0.3; }
|
|
|
|
|
|
.card-info-right { flex: 1; min-width: 0; }
|
|
|
.info-item { display: flex; align-items: center; margin-bottom: 8rpx; }
|
|
|
.info-label { font-size: 26rpx; color: #6b7280; flex-shrink: 0; }
|
|
|
.info-name { font-size: 30rpx; font-weight: 700; color: #0f172a; }
|
|
|
.info-value { font-size: 26rpx; color: #374151; }
|
|
|
.stock-highlight { font-size: 30rpx; font-weight: 700; color: #1f2937; }
|
|
|
|
|
|
.card-bottom { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; }
|
|
|
.detail-row { display: flex; align-items: center; margin-bottom: 14rpx;
|
|
|
&:last-child { margin-bottom: 0; }
|
|
|
&.two-col { justify-content: space-between; }
|
|
|
}
|
|
|
.detail-col { display: flex; align-items: center; flex: 1; }
|
|
|
.detail-label { font-size: 24rpx; color: #9ca3af; flex-shrink: 0; }
|
|
|
.detail-value { font-size: 24rpx; color: #4b5563; }
|
|
|
|
|
|
.qty-input-card {
|
|
|
background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx;
|
|
|
box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.04);
|
|
|
}
|
|
|
.form-field { display: flex; flex-direction: column; gap: 12rpx; }
|
|
|
.form-label { font-size: 26rpx; color: #4b5563; font-weight: 500; }
|
|
|
.form-input { width: 100%; height: 88rpx; padding: 0 24rpx; font-size: 28rpx; color: #374151; background: #f8fafc; border-radius: 14rpx; box-sizing: border-box; }
|
|
|
.form-suffix-text { display: block; margin-top: 10rpx; font-size: 24rpx; color: #9ca3af; }
|
|
|
|
|
|
.convert-row { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; display: flex; align-items: center; }
|
|
|
.convert-label-inline { font-size: 26rpx; color: #6b7280; }
|
|
|
.convert-value-inline { font-size: 36rpx; font-weight: 700; color: #1f2937; margin-left: auto; }
|
|
|
.convert-unit-inline { font-size: 24rpx; color: #64748b; margin-left: 8rpx; }
|
|
|
.convert-formula-inline { margin-top: 10rpx; font-size: 22rpx; color: #9ca3af; }
|
|
|
|
|
|
.select-row-card {
|
|
|
position: relative; display: flex; align-items: center; justify-content: space-between;
|
|
|
background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx 20rpx;
|
|
|
box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.04);
|
|
|
.dropdown-panel {
|
|
|
position: absolute; top: 100%; left: 0; right: 0; z-index: 200; margin-top: 4rpx;
|
|
|
background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx;
|
|
|
box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1); overflow: hidden;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.full-dropdown { display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 28rpx; color: #374151;
|
|
|
.placeholder { color: #9ca3af; }
|
|
|
}
|
|
|
|
|
|
.warehouse-area-card { align-items: flex-start; }
|
|
|
.warehouse-area-rows { width: 100%; display: flex; flex-direction: column; gap: 16rpx; }
|
|
|
.warehouse-area-row { display: flex; align-items: center; }
|
|
|
.warehouse-area-label { width: 80rpx; font-size: 26rpx; color: #6b7280; flex-shrink: 0; }
|
|
|
.warehouse-area-dropdown { flex: 1; min-width: 0; position: relative;
|
|
|
.dropdown-panel {
|
|
|
position: absolute; top: 100%; left: 0; right: 0; z-index: 100; margin-top: 4rpx;
|
|
|
background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx;
|
|
|
box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1); overflow: hidden;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.dropdown-input { display: flex; align-items: center; height: 64rpx; padding: 0 20rpx; border: 1rpx solid #e0e0e0; border-radius: 10rpx; background: #f9fafb; }
|
|
|
.dropdown-value { flex: 1; font-size: 27rpx; color: #333; &.placeholder { color: #bbb; } }
|
|
|
.dropdown-arrow { font-size: 20rpx; color: #999; flex-shrink: 0; }
|
|
|
.dropdown-panel { position: absolute; top: 68rpx; left: 0; right: 0; z-index: 200; background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx; box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1); overflow: hidden; }
|
|
|
.dropdown-scroll { max-height: 360rpx; overflow-y: auto; }
|
|
|
.dropdown-item { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; border-bottom: 1rpx solid #f0f0f0;
|
|
|
&:last-child { border-bottom: 0; }
|
|
|
&.active { background: #f0f5ff; }
|
|
|
}
|
|
|
.dropdown-item-text { font-size: 27rpx; color: #333; }
|
|
|
.dropdown-check { font-size: 28rpx; color: #2563eb; font-weight: 700; }
|
|
|
.dropdown-empty { padding: 32rpx; text-align: center; color: #999; font-size: 26rpx; }
|
|
|
|
|
|
.bottom-actions {
|
|
|
position: fixed; left: 0; right: 0; bottom: 0; display: flex; gap: 18rpx;
|
|
|
padding: 18rpx 24rpx calc(18rpx + env(safe-area-inset-bottom));
|
|
|
background: #ffffff; box-shadow: 0 -8rpx 24rpx rgba(15, 23, 42, 0.06); z-index: 99;
|
|
|
}
|
|
|
.bottom-btn { flex: 1; height: 84rpx; line-height: 84rpx; text-align: center; border-radius: 16rpx; font-size: 30rpx; font-weight: 600;
|
|
|
&:active { opacity: 0.85; }
|
|
|
}
|
|
|
.cancel-btn { background: #eef2f7; color: #475569; }
|
|
|
.confirm-btn { background: #1f4b79; color: #ffffff; }
|
|
|
</style>
|