@opendesign-plus/components 0.0.1-rc.10 → 0.0.1-rc.101

package/dist/treeshaking/components/user-center/internal/OModifyPwd.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,401 @@
+import { useI18n } from "../../../i18n/index.mjs";
+import { EMAIL_REG, PHONE_REG } from "../const/common.const.mjs";
+import { getVerifyImgSize, isSendCodeEmail } from "../utils/utils.mjs";
+import OCountdownButton_default from "./OCountdownButton.mjs";
+import { formValidator, getCodeRules, getPwdRules } from "../utils/rules.mjs";
+import Verify_default from "../verify/Verify.mjs";
+import OPasswordPopInput_default from "./OPasswordPopInput.mjs";
+import { Fragment, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, isRef, normalizeStyle, openBlock, reactive, ref, toDisplayString, toRefs, unref, watchEffect, withCtx } from "vue";
+import { OButton, ODialog, OForm, OFormItem, OInput, useMessage } from "@opensig/opendesign";
+import { useScreen } from "@opendesign-plus/composables";
+// src/components/user-center/internal/OModifyPwd.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "header" };
+var _hoisted_2 = { key: 0 };
+var _hoisted_3 = {
+	key: 0,
+	class: "content-tip"
+};
+var _hoisted_4 = { key: 1 };
+var _hoisted_5 = { class: "footer" };
+var _hoisted_6 = {
+	key: 2,
+	class: "divider"
+};
+var OModifyPwd_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "OModifyPwd",
+	props: {
+		modelValue: {
+			type: Boolean,
+			default: false
+		},
+		userInfo: {
+			type: Object,
+			required: true
+		},
+		clientId: {
+			type: String,
+			required: true
+		},
+		community: {
+			type: String,
+			required: true
+		},
+		oneidUrl: {
+			type: String,
+			required: true
+		},
+		appId: {
+			type: String,
+			required: true
+		},
+		resetPwd: {
+			type: Function,
+			required: true
+		},
+		resetPwdVerify: {
+			type: Function,
+			required: true
+		},
+		sendCodeCaptchaPost: {
+			type: Function,
+			required: true
+		},
+		captchaApis: {
+			type: Object,
+			required: true
+		},
+		rsaEncrypt: {
+			type: Function,
+			required: true
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"binding",
+		"logout"
+	],
+	setup(__props, { emit: __emit }) {
+		const { t } = useI18n();
+		const { lePadV } = useScreen();
+		const props = __props;
+		const { modelValue } = toRefs(props);
+		const emit = __emit;
+		const message = useMessage(null);
+		const formRef = ref();
+		const form = reactive({
+			account: "",
+			code: "",
+			password: "",
+			confirmPwd: ""
+		});
+		const useAccount = ref("");
+		watchEffect(() => {
+			if (modelValue.value) {
+				if (isSendCodeEmail(props.userInfo?.email)) {
+					useAccount.value = "email";
+					form.account = props.userInfo?.email;
+				} else {
+					useAccount.value = "phone";
+					form.account = props.userInfo?.phoneCountry;
+				}
+			}
+		});
+		const changeAccount = () => {
+			if (useAccount.value === "email" && !props.userInfo?.phoneCountry) {
+				emit("binding", "phone");
+				return;
+			}
+			if (useAccount.value === "phone" && !isSendCodeEmail(props.userInfo?.email)) {
+				emit("binding", "email");
+				return;
+			}
+			if (useAccount.value === "email" && props.userInfo?.phoneCountry) {
+				useAccount.value = "phone";
+				form.account = props.userInfo?.phoneCountry;
+			} else if (useAccount.value === "phone" && isSendCodeEmail(props.userInfo?.email)) {
+				useAccount.value = "email";
+				form.account = props.userInfo?.email;
+			} else return;
+			formRef.value?.resetFields("code");
+		};
+		const requiredRules = [{
+			required: true,
+			message: t("common.NOT_EMPTY"),
+			trigger: "blur"
+		}];
+		const rules = getCodeRules(t);
+		const validatorAccount = (value) => {
+			if (value) {
+				if (!EMAIL_REG.test(value) && !PHONE_REG.test(value)) return {
+					type: "danger",
+					message: t("common.ENTER_VAILD_EMAIL_OR_PHONE")
+				};
+			}
+		};
+		const accountRules = [...requiredRules, {
+			validator: validatorAccount,
+			triggers: "blur"
+		}];
+		const passwordRules = [...requiredRules, ...getPwdRules(t)];
+		const validatorConfirmPwd = (value) => {
+			if (value && value !== form.password) return {
+				type: "danger",
+				message: t("common.CONFIRM_NOT_MATCH_PWD")
+			};
+		};
+		const confirmPwdRules = [...requiredRules, {
+			validator: validatorConfirmPwd,
+			triggers: ["change", "blur"]
+		}];
+		const disableCode = ref(false);
+		const verify = ref();
+		const getcode = (formEl) => {
+			if (!formEl) return;
+			formValidator(formEl, "account").subscribe((valid) => {
+				if (valid) verify.value.show();
+				else return false;
+			});
+		};
+		const verifySuccess = (data) => {
+			const param = {
+				channel: "channel_reset_password",
+				account: form.account,
+				captchaVerification: data.captchaVerification,
+				client_id: props.clientId
+			};
+			props.sendCodeCaptchaPost(param).then(() => {
+				disableCode.value = true;
+				message.success({ content: t("common.SEND_SUCCESS") });
+			});
+		};
+		const resetToken = ref("");
+		const nextStep = (formEl) => {
+			formValidator(formEl).subscribe((valid) => {
+				if (valid) {
+					const param = {
+						client_id: props.clientId,
+						account: form.account,
+						code: form.code
+					};
+					props.resetPwdVerify(param).then((res) => {
+						resetToken.value = res.data;
+					});
+				} else return false;
+			});
+		};
+		const close = () => {
+			emit("update:modelValue", false);
+			formRef.value?.resetFields();
+			form.account = "";
+			form.code = "";
+			resetToken.value = "";
+			disableCode.value = false;
+		};
+		const confirm = (formEl) => {
+			formValidator(formEl).subscribe(async (valid) => {
+				if (valid) {
+					const newPwd = await props.rsaEncrypt(form.password);
+					const param = {
+						pwd_reset_token: resetToken.value,
+						new_pwd: newPwd
+					};
+					props.resetPwd(param).then(() => {
+						message.success({ content: t("common.MODIFY_SUCCESS") });
+						const url = `${props.oneidUrl}/login?redirect_uri=${location.href}`;
+						const logoutParam = { community: props.community };
+						if (logoutParam.community === "opengauss") logoutParam.client_id = props.appId;
+						emit("logout", {
+							url,
+							param: logoutParam
+						});
+					}).catch((err) => {
+						if (err?.response?.data?.msg?.code === "E00056") {
+							formRef.value?.resetFields([
+								"code",
+								"password",
+								"confirmPwd"
+							]);
+							form.code = "";
+							resetToken.value = "";
+							disableCode.value = false;
+						}
+					});
+				} else return false;
+			});
+		};
+		const dlgToggle = (visible) => {
+			if (!visible) close();
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createVNode(unref(ODialog), {
+				visible: unref(modelValue),
+				"onUpdate:visible": _cache[9] || (_cache[9] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
+				class: "o-user-center-dialog o-user-center-modify-dialog",
+				style: {
+					"--dlg-body-padding": "58px",
+					"--dlg-padding-body-bottom": 0,
+					"--dlg-width": "690px",
+					"--dlg-radius": "2px",
+					"--o-radius_control-s": 0,
+					"--dlg-edge-gap": "0"
+				},
+				"mask-close": false,
+				onChange: dlgToggle
+			}, {
+				header: withCtx(() => [createElementVNode("h5", _hoisted_1, toDisplayString(unref(t)("common.MODIFY_PASSWORD_NEW")), 1)]),
+				footer: withCtx(() => [createElementVNode("div", _hoisted_5, [
+					!resetToken.value ? (openBlock(), createBlock(unref(OButton), {
+						key: 0,
+						size: "large",
+						color: "primary",
+						variant: "solid",
+						type: "submit",
+						disabled: !form.code,
+						onClick: _cache[7] || (_cache[7] = ($event) => nextStep(formRef.value))
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("common.NEXT_STEP")), 1)]),
+						_: 1
+					}, 8, ["disabled"])) : (openBlock(), createBlock(unref(OButton), {
+						key: 1,
+						size: "large",
+						color: "primary",
+						variant: "solid",
+						onClick: _cache[8] || (_cache[8] = ($event) => confirm(formRef.value)),
+						disabled: !form.password || !form.confirmPwd
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("common.CONFIRM")), 1)]),
+						_: 1
+					}, 8, ["disabled"])),
+					unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_6)) : createCommentVNode("", true),
+					createVNode(unref(OButton), {
+						size: "large",
+						color: "primary",
+						variant: "outline",
+						type: "submit",
+						onClick: close
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("common.CANCEL")), 1)]),
+						_: 1
+					})
+				])]),
+				default: withCtx(() => [createVNode(unref(OForm), {
+					ref_key: "formRef",
+					ref: formRef,
+					"label-width": "0",
+					model: form,
+					style: normalizeStyle([{ "max-width": "480px" }, {
+						"--form-item-display": "block",
+						"--form-label-main-gap": 0,
+						"--o-line_height-tip2": "24px",
+						"--form-label-gap-top": 0,
+						margin: "auto"
+					}]),
+					class: "form"
+				}, {
+					default: withCtx(() => [!resetToken.value ? (openBlock(), createElementBlock("span", _hoisted_2, [
+						useAccount.value ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(useAccount.value === "email" ? unref(t)("common.EMAIL_CHECK") : unref(t)("common.PHONE_CHECK")), 1)) : createCommentVNode("", true),
+						createVNode(unref(OFormItem), {
+							field: "account",
+							rules: accountRules,
+							style: { display: "flex" }
+						}, {
+							default: withCtx(() => [createVNode(unref(OInput), {
+								modelValue: form.account,
+								"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => form.account = $event),
+								placeholder: unref(t)("common.ENTER_YOUR_EMAIL_OR_PHONE"),
+								disabled: true,
+								class: "form-input",
+								size: "large",
+								onInput: _cache[1] || (_cache[1] = ($event) => formRef.value?.resetFields("code"))
+							}, null, 8, ["modelValue", "placeholder"])]),
+							_: 1
+						}),
+						createVNode(unref(OFormItem), {
+							field: "code",
+							rules: unref(rules),
+							style: { display: "flex" }
+						}, {
+							default: withCtx(() => [createVNode(unref(OInput), {
+								modelValue: form.code,
+								"onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => form.code = $event),
+								class: "form-input",
+								size: "large",
+								placeholder: useAccount.value === "email" ? unref(t)("common.INPUT_EMAIL_CODE") : unref(t)("common.INPUT_PHONE_CODE"),
+								maxlength: "6"
+							}, {
+								suffix: withCtx(() => [createVNode(OCountdownButton_default, {
+									modelValue: disableCode.value,
+									"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => disableCode.value = $event),
+									color: "primary",
+									size: "small",
+									onClick: _cache[3] || (_cache[3] = ($event) => getcode(formRef.value))
+								}, null, 8, ["modelValue"])]),
+								_: 1
+							}, 8, ["modelValue", "placeholder"])]),
+							_: 1
+						}, 8, ["rules"]),
+						useAccount.value ? (openBlock(), createElementBlock("a", {
+							key: 1,
+							onClick: changeAccount,
+							class: "content-tip"
+						}, toDisplayString(useAccount.value === "email" ? unref(t)("common.USE_PHONE") : unref(t)("common.USE_EMAIL")), 1)) : createCommentVNode("", true)
+					])) : (openBlock(), createElementBlock("span", _hoisted_4, [
+						createVNode(unref(OFormItem), {
+							class: "pwd-item",
+							field: "password",
+							rules: passwordRules,
+							style: { display: "flex" }
+						}, {
+							default: withCtx(() => [createVNode(OPasswordPopInput_default, {
+								modelValue: form.password,
+								"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => form.password = $event),
+								account: form.account,
+								label: unref(t)("common.NEW_PWD"),
+								false: "",
+								ref: "passwordPopRef"
+							}, null, 8, [
+								"modelValue",
+								"account",
+								"label"
+							])]),
+							_: 1
+						}),
+						createElementVNode("div", null, toDisplayString(unref(t)("common.CONFIRM_PWD")), 1),
+						createVNode(unref(OFormItem), {
+							field: "confirmPwd",
+							rules: confirmPwdRules,
+							style: { display: "flex" }
+						}, {
+							default: withCtx(() => [createVNode(unref(OInput), {
+								modelValue: form.confirmPwd,
+								"onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => form.confirmPwd = $event),
+								class: "form-input",
+								size: "large",
+								placeholder: unref(t)("common.PLEASE_INPUT_PWD"),
+								type: "password"
+							}, null, 8, ["modelValue", "placeholder"])]),
+							_: 1
+						})
+					]))]),
+					_: 1
+				}, 8, ["model"])]),
+				_: 1
+			}, 8, ["visible"]), unref(modelValue) ? (openBlock(), createBlock(Verify_default, {
+				key: 0,
+				ref_key: "verify",
+				ref: verify,
+				mode: "pop",
+				"captcha-type": "blockPuzzle",
+				"img-size": unref(getVerifyImgSize)(),
+				community: __props.community,
+				"captcha-apis": __props.captchaApis,
+				onSuccess: verifySuccess
+			}, null, 8, [
+				"img-size",
+				"community",
+				"captcha-apis"
+			])) : createCommentVNode("", true)], 64);
+		};
+	}
+});
+export { OModifyPwd_vue_vue_type_script_setup_true_lang_default as default };

package/dist/treeshaking/components/user-center/internal/OModifyPwd.vue_vue_type_style_index_0_scoped_5e0452e7_lang.css

@@ -0,0 +1,104 @@
+.hover-icon-rotate .o-icon[data-v-5e0452e7] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-5e0452e7] {
+    transform: rotate(-180deg);
+}
+}
+.header[data-v-5e0452e7] {
+  font-size: 24px;
+  line-height: 32px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.header[data-v-5e0452e7] {
+    font-size: 20px;
+    line-height: 28px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.header[data-v-5e0452e7] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.header[data-v-5e0452e7] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 600px) {
+.header[data-v-5e0452e7] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+.header[data-v-5e0452e7] {
+  font-weight: normal;
+  text-align: center;
+  margin-left: var(--o-gap-4);
+  padding-top: 28px;
+}
+.content-tip[data-v-5e0452e7] {
+  display: inline-block;
+  margin-bottom: 8px;
+}
+.footer[data-v-5e0452e7] {
+  display: flex;
+  justify-content: center;
+  column-gap: var(--o-gap-4);
+  padding-bottom: 28px;
+}
+.footer[data-v-5e0452e7] .o-btn + .o-btn {
+  margin-left: 0;
+}
+
+/* 禁用输入框（身份验证的账号）背景/边框 */
+[data-v-5e0452e7] .o_box-main.o_box-disabled {
+  background-color: var(--o-color-control4-light);
+  border-color: var(--o-color-control4);
+}
+[data-v-5e0452e7] .o_box-main.o_box-disabled:hover {
+  background-color: var(--o-color-control4-light);
+  border-color: var(--o-color-control4);
+}
+[data-v-5e0452e7] .password-form {
+  width: 100%;
+}
+[data-v-5e0452e7] .password-form .o-form-item-main {
+  width: 100%;
+}
+[data-v-5e0452e7] .password-form .o_box-main {
+  width: 100%;
+  box-sizing: border-box;
+}
+
+/* 移动端：文字按钮 + 竖线分隔（与编辑昵称/编辑组织弹窗一致） */
+@media (max-width: 840px) {
+.footer[data-v-5e0452e7] {
+    flex-direction: row-reverse;
+    column-gap: 16px;
+}
+.footer .divider[data-v-5e0452e7] {
+    width: 1px;
+    height: 24px;
+    background-color: var(--o-color-control4);
+}
+.footer .o-btn[data-v-5e0452e7] {
+    --btn-radius: 0;
+    padding-left: 0;
+    padding-right: 0;
+    background-color: transparent;
+    border-color: transparent;
+    color: var(--o-color-info1);
+}
+.footer .o-btn[data-v-5e0452e7]:hover {
+    background-color: transparent;
+    border-color: transparent;
+    color: var(--o-color-info1);
+}
+.footer .o-btn.o-btn-disabled[data-v-5e0452e7] {
+    color: var(--o-color-info4);
+}
+}

package/dist/treeshaking/components/user-center/internal/OPasswordPopInput.mjs

@@ -0,0 +1,6 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
+import OPasswordPopInput_vue_vue_type_script_setup_true_lang_default from "./OPasswordPopInput.vue_vue_type_script_setup_true_lang.mjs";
+import './OPasswordPopInput.vue_vue_type_style_index_0_scoped_1bf14f73_lang.css';
+// src/components/user-center/internal/OPasswordPopInput.vue
+var OPasswordPopInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(OPasswordPopInput_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-1bf14f73"]]);
+export { OPasswordPopInput_default as default };