mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-07 08:46:40 +08:00
fix: sync login autofill fields
This commit is contained in:
@@ -57,6 +57,9 @@ let mfaDialogController: ReturnType<typeof openSharedDialog> | null = null
|
|||||||
// 用户名称输入框
|
// 用户名称输入框
|
||||||
const usernameInput = ref()
|
const usernameInput = ref()
|
||||||
|
|
||||||
|
// 登录自动填充同步的延时任务
|
||||||
|
const autofillSyncTimerIds: number[] = []
|
||||||
|
|
||||||
// 语言选择菜单
|
// 语言选择菜单
|
||||||
const langMenu = ref(false)
|
const langMenu = ref(false)
|
||||||
|
|
||||||
@@ -121,6 +124,44 @@ const pluginAuthProviders = computed(() =>
|
|||||||
)
|
)
|
||||||
const showPasskeyLogin = computed(() => !!systemPasskeyProvider.value?.enabled)
|
const showPasskeyLogin = computed(() => !!systemPasskeyProvider.value?.enabled)
|
||||||
|
|
||||||
|
// 获取登录表单中的原生账号和密码输入框。
|
||||||
|
function getLoginCredentialInputs() {
|
||||||
|
const formElement = refForm.value?.$el as HTMLFormElement | undefined
|
||||||
|
const root = formElement || document
|
||||||
|
|
||||||
|
return {
|
||||||
|
username: root.querySelector<HTMLInputElement>('input[name="username"]'),
|
||||||
|
password: root.querySelector<HTMLInputElement>('input[name="password"]'),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 将密码管理器写入 DOM 的账号密码同步回响应式表单。
|
||||||
|
function syncLoginCredentialValues() {
|
||||||
|
const { username, password } = getLoginCredentialInputs()
|
||||||
|
|
||||||
|
if (username && username.value !== form.value.username) {
|
||||||
|
form.value.username = username.value
|
||||||
|
}
|
||||||
|
|
||||||
|
if (password && password.value !== form.value.password) {
|
||||||
|
form.value.password = password.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 清理尚未执行的登录自动填充同步任务。
|
||||||
|
function clearLoginAutofillSyncTimers() {
|
||||||
|
autofillSyncTimerIds.forEach(timerId => window.clearTimeout(timerId))
|
||||||
|
autofillSyncTimerIds.length = 0
|
||||||
|
}
|
||||||
|
|
||||||
|
// 延迟多次同步自动填充值,兼容只对聚焦字段派发事件的密码管理器。
|
||||||
|
function scheduleLoginAutofillSync() {
|
||||||
|
clearLoginAutofillSyncTimers()
|
||||||
|
syncLoginCredentialValues()
|
||||||
|
autofillSyncTimerIds.push(window.setTimeout(syncLoginCredentialValues, 50))
|
||||||
|
autofillSyncTimerIds.push(window.setTimeout(syncLoginCredentialValues, 250))
|
||||||
|
}
|
||||||
|
|
||||||
// 生成 MFA 共享弹窗使用的最新 props。
|
// 生成 MFA 共享弹窗使用的最新 props。
|
||||||
function getMfaDialogProps() {
|
function getMfaDialogProps() {
|
||||||
return {
|
return {
|
||||||
@@ -667,6 +708,7 @@ onUnmounted(() => {
|
|||||||
manualAbortController.abort()
|
manualAbortController.abort()
|
||||||
manualAbortController = null
|
manualAbortController = null
|
||||||
}
|
}
|
||||||
|
clearLoginAutofillSyncTimers()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -733,6 +775,8 @@ onUnmounted(() => {
|
|||||||
autocomplete="username"
|
autocomplete="username"
|
||||||
:rules="[requiredValidator]"
|
:rules="[requiredValidator]"
|
||||||
hide-details
|
hide-details
|
||||||
|
@input="scheduleLoginAutofillSync"
|
||||||
|
@change="scheduleLoginAutofillSync"
|
||||||
/>
|
/>
|
||||||
</VCol>
|
</VCol>
|
||||||
<!-- password -->
|
<!-- password -->
|
||||||
@@ -748,6 +792,8 @@ onUnmounted(() => {
|
|||||||
:rules="[requiredValidator]"
|
:rules="[requiredValidator]"
|
||||||
hide-details
|
hide-details
|
||||||
@click:append-inner="isPasswordVisible = !isPasswordVisible"
|
@click:append-inner="isPasswordVisible = !isPasswordVisible"
|
||||||
|
@input="scheduleLoginAutofillSync"
|
||||||
|
@change="scheduleLoginAutofillSync"
|
||||||
/>
|
/>
|
||||||
</VCol>
|
</VCol>
|
||||||
<VCol cols="12" class="py-0">
|
<VCol cols="12" class="py-0">
|
||||||
|
|||||||
Reference in New Issue
Block a user