perf: 优化pfx密码密码输入框,让浏览器不自动填写密码

pull/229/head
xiaojunnuo 2024-10-22 11:22:59 +08:00
parent 3db216f515
commit ffeede38af
3 changed files with 32 additions and 2 deletions

View File

@ -50,7 +50,7 @@ export abstract class CertApplyBasePlugin extends AbstractTaskPlugin {
@TaskInput({ @TaskInput({
title: "PFX证书密码", title: "PFX证书密码",
component: { component: {
name: "a-input-password", name: "input-password",
vModel: "value", vModel: "value",
}, },
required: false, required: false,
@ -227,7 +227,7 @@ export abstract class CertApplyBasePlugin extends AbstractTaskPlugin {
* "successNotify": true, * "successNotify": true,
* "pfxPassword": "123456" * "pfxPassword": "123456"
*/ */
const checkInputChanges = ["domains", "sslProvider", "privateKeyType", "dnsProviderType", "dnsProviderAccess", "pfxPassword"]; const checkInputChanges = ["domains", "sslProvider", "privateKeyType", "dnsProviderType", "pfxPassword"];
const oldInput = JSON.stringify(pick(this.lastStatus?.input, checkInputChanges)); const oldInput = JSON.stringify(pick(this.lastStatus?.input, checkInputChanges));
const thisInput = JSON.stringify(pick(this, checkInputChanges)); const thisInput = JSON.stringify(pick(this, checkInputChanges));
inputChanged = oldInput !== thisInput; inputChanged = oldInput !== thisInput;

View File

@ -0,0 +1,28 @@
<template>
<a-input class="cd-input-password" :class="{ show: showRef }">
<template #suffix>
<fs-icon class="pointer" :icon="computedIcon" @click="showRef = !showRef" />
</template>
</a-input>
</template>
<script lang="ts" setup>
import { computed, ref } from "vue";
const showRef = ref(false);
const computedIcon = computed(() => {
return showRef.value ? "ion:eye-outline" : "ion:eye-off-outline";
});
</script>
<style lang="less">
.cd-input-password {
text-security: disc;
-webkit-text-security: disc;
.fs-iconify {
font-size: 16px;
}
&.show {
text-security: none;
-webkit-text-security: none;
}
}
</style>

View File

@ -5,6 +5,7 @@ import OutputSelector from "/@/components/plugins/common/output-selector/index.v
import DnsProviderSelector from "/@/components/plugins/cert/dns-provider-selector/index.vue"; import DnsProviderSelector from "/@/components/plugins/cert/dns-provider-selector/index.vue";
import DomainsVerifyPlanEditor from "/@/components/plugins/cert/domains-verify-plan-editor/index.vue"; import DomainsVerifyPlanEditor from "/@/components/plugins/cert/domains-verify-plan-editor/index.vue";
import AccessSelector from "/@/views/certd/access/access-selector/index.vue"; import AccessSelector from "/@/views/certd/access/access-selector/index.vue";
import InputPassword from "./common/input-password.vue";
export * from "./cert/index.js"; export * from "./cert/index.js";
export default { export default {
install(app: any) { install(app: any) {
@ -16,5 +17,6 @@ export default {
app.component("SynologyDeviceIdGetter", SynologyIdDeviceGetter); app.component("SynologyDeviceIdGetter", SynologyIdDeviceGetter);
app.component("RemoteSelect", RemoteSelect); app.component("RemoteSelect", RemoteSelect);
app.component("CertDomainsGetter", CertDomainsGetter); app.component("CertDomainsGetter", CertDomainsGetter);
app.component("InputPassword", InputPassword);
} }
}; };