fix(StorageCellsSummary): 修复格口操作流程中的问题和样式

- 添加关闭弹窗时重置格口的功能
- 调整弹窗高度和样式以适应不同状态
- 优化密码验证失败和格口不可用的提示
- 修复数据刷新后默认选中格口类型的逻辑
- 增加操作失败时的错误处理和提示持续时间
This commit is contained in:
dzq 2025-12-25 17:18:37 +08:00
parent 8abfd0d094
commit b471155bb9
1 changed files with 52 additions and 11 deletions

View File

@ -80,6 +80,7 @@
v-model:show="popupVisible"
position="bottom"
round
:close-on-click-overlay="false"
:style="popupStyle"
@close="handlePopupCancel">
@ -156,7 +157,8 @@ import { showToast } from 'vant'
import {
availableStorageCells,
storeItemApi,
openByPassword
openByPassword,
resetByPassword
} from '@/common/apis/cabinet'
import type { AvailableStorageCellDTO } from '@/common/apis/cabinet/type'
import { usePopupState } from '@/common/composables/usePopupState'
@ -217,7 +219,6 @@ const {
showCancelButton,
transitionTo,
handlePasswordInputChange,
handlePopupCancel,
handleKeyboardInput,
handleKeyboardDelete,
handleKeyboardClose
@ -227,13 +228,14 @@ const {
const popupStyle = computed(() => {
const baseStyle = {
padding: '32px',
background: '#fff'
background: '#fff',
height: 'calc(100vh - 120px)',
}
if (keyboardVisible.value) {
return {
...baseStyle,
maxHeight: 'calc(100vh - 360px)',
height: 'calc(100vh - 80px)',
overflow: 'auto'
}
}
@ -288,6 +290,11 @@ async function refresh() {
const response = await availableStorageCells(props.shopId)
cellsData.value = response.data || []
emit('refresh')
const availableTypes = cellTypeStats.value.filter(stat => stat.count > 0)
if (availableTypes.length > 0) {
selectedCellType.value = availableTypes[0].type
}
} catch (err) {
error.value = err as Error
emit('error', err as Error)
@ -347,15 +354,48 @@ async function handleDepositFlow() {
showToast({
message: (err as any)?.message || '操作失败',
type: 'fail',
duration: 3000
duration: 5000,
overlay: true
})
transitionTo({ type: 'idle' })
} finally {
depositLoading.value = false
//
await refresh()
}
}
//
async function handlePopupCancel() {
const state = currentState.value
//
if (state.type === 'password-verify') {
try {
await resetByPassword({
shopId: props.shopId,
password: state.correctPassword
})
showToast({
message: '格口已重置',
type: 'success'
})
} catch (err) {
console.error('重置格口失败:', err)
showToast({
message: '重置格口失败',
type: 'fail'
})
}
}
//
transitionTo({ type: 'idle' })
//
await refresh()
}
async function handlePopupConfirm() {
const state = currentState.value
@ -395,18 +435,18 @@ async function performOpenByPassword(password: string, action: 'deposit' | 'retr
message: '格口已打开',
type: 'success'
})
//
await refresh()
} catch (err) {
console.error('打开格口失败:', err)
showToast({
message: (err as any)?.message || '操作失败',
message: '密码错误',
type: 'fail',
duration: 3000
duration: 4000,
overlay: true
})
} finally {
transitionTo({ type: 'idle' })
//
await refresh()
}
}
@ -442,7 +482,8 @@ function handleCellTypeSelect(stat: { type: number; count: number }) {
showToast({
message: '该类型格口暂不可用',
type: 'fail',
duration: 1500
duration: 5000,
overlay: true
})
return
}