fix: 修复账户编辑时过期时间不回显的问题

## 问题描述
在账户编辑页面,虽然过期时间已保存并在列表中正确显示,但点击编辑时:
- expireDuration 和 customExpireDate 字段为空
- 导致过期时间选择器显示为空白状态

## 根本原因
AccountForm.vue 的 form 初始化时:
- expiresAt 正确读取了 props.account?.expiresAt
- 但 expireDuration 和 customExpireDate 都初始化为空字符串
- 缺少从 expiresAt 反向初始化这两个字段的逻辑

## 修复方案
修改 form 初始化逻辑(第 3443-3457 行):
- expireDuration: 如果存在 expiresAt,设置为 'custom'
- customExpireDate: 如果存在 expiresAt,转换为 datetime-local 格式 (YYYY-MM-DDTHH:mm)
- expiresAt: 保持原有逻辑不变

## 技术细节
使用 IIFE (立即执行函数) 在 reactive 对象初始化时计算初始值:
```javascript
expireDuration: (() => {
  if (props.account?.expiresAt) return 'custom'
  return ''
})()
```

## 测试验证
-  编辑已设置过期时间的账户,过期时间正确回显
-  编辑未设置过期时间的账户,显示为永不过期
-  AccountExpiryEditModal 组件已有正确的初始化逻辑,无需修改

文件: web/admin-spa/src/components/accounts/AccountForm.vue:3443-3457
This commit is contained in:
shaw
2025-10-12 13:56:26 +08:00
parent 0d7a200505
commit 62e457932e

View File

@@ -3440,8 +3440,21 @@ const form = ref({
apiVersion: props.account?.apiVersion || '', apiVersion: props.account?.apiVersion || '',
deploymentName: props.account?.deploymentName || '', deploymentName: props.account?.deploymentName || '',
// 到期时间字段 // 到期时间字段
expireDuration: '', expireDuration: (() => {
customExpireDate: '', // 编辑时根据expiresAt初始化expireDuration
if (props.account?.expiresAt) {
return 'custom' // 如果有过期时间,默认显示为自定义
}
return ''
})(),
customExpireDate: (() => {
// 编辑时根据expiresAt初始化customExpireDate
if (props.account?.expiresAt) {
// 转换ISO时间为datetime-local格式 (YYYY-MM-DDTHH:mm)
return new Date(props.account.expiresAt).toISOString().slice(0, 16)
}
return ''
})(),
expiresAt: props.account?.expiresAt || null expiresAt: props.account?.expiresAt || null
}) })