WebApp【公共组件库】@前端(For Git Submodule)
‘chensiAb’
2025-03-25 3b03f87a02458f719e2eb4bf112a13441b427d14
forms/input/CInputPhoneCode.vue
@@ -1,5 +1,5 @@
/**
 * CInputPhoneCode
 * CInputPhoneCode - 表单项,手机验证码输入框
 * @author Tevin
 */
@@ -37,15 +37,30 @@
        AtButton,
    },
    props: {
        placeholder: String,
        // 表单数据资源(表单组件内部机制专用)
        itemRes: Object,
        autoStart: { type: Boolean, default: true },
        // 占位提示
        placeholder: String,
        // 验证码计时器开始方式
        //   true 点击按钮后立即自动开始
        //   false 后台返回为成功时才开始
        autoStart: {
            type: Boolean,
            default: true,
        },
        // 发送请求,通知后端给手机发验证码
        onCallPhoneCode: Function,
        // 刷新cd后,通知父组件更新图片地址
        onRefreshCD: {
            type: Function,
            default: () => () => null,
        },
    },
    data() {
        return {
            cd: 60,
            holding: false,
            timer: null,
        };
    },
    computed: {
@@ -65,11 +80,13 @@
            const startCD = () => {
                this.holding = true;
                this.cd = 60;
                setInterval(() => {
                clearInterval(this.timer);
                this.timer = setInterval(() => {
                    this.cd -= 1;
                    if (this.cd === 0) {
                        this.holding = false;
                        this.cd = 60;
                        this.onRefreshCD(true);
                    }
                }, 1000);
            };
@@ -82,6 +99,10 @@
                });
            }
        },
        // 重置holding
        $resetHolding() {
            this.holding = false;
        },
    },
};
</script>