@opendesign-plus-test/components 0.0.1-rc.213 → 0.0.1-rc.214

package/dist/treeshaking/components/user-center/OAccountSecurity.vue2.mjs

@@ -0,0 +1,293 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, Fragment, createElementVNode, normalizeClass, unref, toDisplayString, createCommentVNode, createVNode, withCtx, createTextVNode } from "vue";
+import { useMessage, OLink } from "@opensig/opendesign";
+import { useI18n } from "../../i18n/index.mjs";
+import { useTheme } from "../../shared/theme.mjs";
+import { useScreen } from "@opendesign-plus/composables";
+import { transformDate, isSendCodeEmail } from "./utils/utils.mjs";
+import ODeleteAccountModal from "./internal/ODeleteAccountModal.vue.mjs";
+import ToBindingTipModal from "./internal/OToBindingTipModal.vue.mjs";
+import OModifyPwd from "./internal/OModifyPwd.vue.mjs";
+import OAppDialog from "./internal/OAppDialog.vue.mjs";
+import LeftArrowLight from "../../assets/user-center/images/left-arrow-light.svg.mjs";
+import LeftArrowDark from "../../assets/user-center/images/left-arrow-dark.svg.mjs";
+const _hoisted_1 = {
+  key: 0,
+  class: "title"
+};
+const _hoisted_2 = { class: "tips-title" };
+const _hoisted_3 = { class: "tips-content" };
+const _hoisted_4 = { class: "tips-desc" };
+const _hoisted_5 = {
+  key: 0,
+  class: "forget-btn"
+};
+const _hoisted_6 = ["src"];
+const _hoisted_7 = { class: "tips" };
+const _hoisted_8 = { class: "tips-title" };
+const _hoisted_9 = { class: "tips-content tips-bg" };
+const _hoisted_10 = ["href"];
+const _hoisted_11 = ["href"];
+const _hoisted_12 = { key: 0 };
+const _hoisted_13 = { class: "tips-title" };
+const _hoisted_14 = { class: "tips-content" };
+const _hoisted_15 = { class: "tips-desc" };
+const _hoisted_16 = ["src"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OAccountSecurity",
+  props: {
+    userInfo: {},
+    mainDomainUrl: {},
+    clientId: {},
+    community: {},
+    oneidUrl: {},
+    appId: {},
+    pwdVisible: { type: Boolean, default: true },
+    deleteAccount: {},
+    bindAccountPost: {},
+    sendCodePost: {},
+    rsaEncrypt: {},
+    captchaApis: {},
+    resetPwd: {},
+    resetPwdVerify: {},
+    sendCodeCaptchaPost: {}
+  },
+  emits: ["refresh", "logout"],
+  setup(__props, { emit: __emit }) {
+    const { t, locale } = useI18n();
+    const message = useMessage(null);
+    const { lePadV } = useScreen();
+    const { isLight } = useTheme();
+    const props = __props;
+    const emit = __emit;
+    const deleteAccountVisible = ref(false);
+    const pwdDialogVisible = ref(false);
+    const isDelete = ref(false);
+    const toBindingAccount = ref("email");
+    const toBindingModalVisible = ref(false);
+    const toBinding = (account) => {
+      toBindingAccount.value = account;
+      toBindingModalVisible.value = true;
+    };
+    const bindingModalVisible = ref(false);
+    const operateKey = ref("bind_email");
+    const config = {
+      bind_email: {
+        key: "bind_email",
+        account_type: "email",
+        field: "change",
+        header: "BIND_EMAIL",
+        account: {
+          label: "EMAIL",
+          placeholder: "INPUT_NEW_EMAIL"
+        },
+        code: {
+          label: "EMAIL_CODE",
+          placeholder: "ENTER_EMAIL_CODE"
+        },
+        confirm: (data) => {
+          bindAccountFuc(data);
+        }
+      },
+      bind_phone: {
+        key: "bind_phone",
+        account_type: "phone",
+        field: "change",
+        header: "BIND_PHONE",
+        account: {
+          label: "PHONE",
+          placeholder: "INPUT_NEW_PHONE"
+        },
+        code: {
+          label: "SMS_CODE",
+          placeholder: "INPUT_PHONE_CODE"
+        },
+        confirm: (data) => {
+          bindAccountFuc(data);
+        }
+      }
+    };
+    const submit = () => {
+      if (!isSendCodeEmail(props.userInfo.email) && !props.userInfo.phone) {
+        toBindingModalVisible.value = true;
+        isDelete.value = true;
+      } else {
+        deleteAccountVisible.value = true;
+      }
+    };
+    const confirm = (params) => {
+      props.deleteAccount(params).then(() => {
+        message.success({
+          content: t(`common.DELETE_SUCCESS`)
+        });
+        deleteAccountVisible.value = false;
+        emit("logout");
+      });
+    };
+    const bindAccountFuc = (data) => {
+      props.bindAccountPost(data).then(() => {
+        message.success({
+          content: t("common.BIND_SUCCESS")
+        });
+        bindingModalVisible.value = false;
+        emit("refresh");
+      });
+    };
+    const protocolList = computed(() => [
+      {
+        url: `${props.mainDomainUrl}/privacy`,
+        urlEn: `${props.mainDomainUrl}/privacy/en`
+      },
+      {
+        url: `${props.mainDomainUrl}/legal`,
+        urlEn: `${props.mainDomainUrl}/legal/en`
+      }
+    ]);
+    const forgetPwd = () => {
+      if (!isSendCodeEmail(props.userInfo.email) && !props.userInfo.phone) {
+        toBindingModalVisible.value = true;
+      } else {
+        pwdDialogVisible.value = true;
+      }
+    };
+    const showDialog = (str, key) => {
+      const _key = `${str}_${key}`;
+      operateKey.value = _key;
+      bindingModalVisible.value = true;
+    };
+    const goBinding = () => {
+      deleteAccountVisible.value = false;
+      isDelete.value = false;
+      if (toBindingAccount.value === "email") {
+        pwdDialogVisible.value = false;
+        showDialog("bind", "email");
+      } else {
+        pwdDialogVisible.value = false;
+        showDialog("bind", "phone");
+      }
+    };
+    const goDeleteBinding = (account) => {
+      toBindingAccount.value = account;
+      toBindingModalVisible.value = true;
+      isDelete.value = true;
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        createElementVNode("div", {
+          class: normalizeClass({ "security-pad": unref(lePadV) })
+        }, [
+          !unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(unref(t)("common.SECURITY")), 1)) : createCommentVNode("", true),
+          __props.pwdVisible ? (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: normalizeClass(["tips", { "tips-inline": unref(lePadV) }])
+          }, [
+            createElementVNode("div", _hoisted_2, toDisplayString(unref(t)("common.LOGIN_PASSWORD")), 1),
+            createElementVNode("div", _hoisted_3, [
+              createElementVNode("span", _hoisted_4, toDisplayString(unref(t)("common.MODIFY_PWD_TIP")), 1),
+              !unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_5, [
+                createVNode(unref(OLink), {
+                  color: "primary",
+                  class: "nowrap",
+                  onClick: forgetPwd
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("common.MODIFY")), 1)
+                  ]),
+                  _: 1
+                })
+              ])) : (openBlock(), createElementBlock("img", {
+                key: 1,
+                src: unref(isLight) ? unref(LeftArrowLight) : unref(LeftArrowDark),
+                alt: "",
+                class: "arrow",
+                onClick: forgetPwd
+              }, null, 8, _hoisted_6))
+            ])
+          ], 2)) : createCommentVNode("", true),
+          createElementVNode("div", _hoisted_7, [
+            createElementVNode("div", _hoisted_8, toDisplayString(unref(t)("common.SIGNED_AGREEMENT")), 1),
+            createElementVNode("div", _hoisted_9, [
+              createElementVNode("span", null, [
+                createElementVNode("a", {
+                  href: unref(locale) === "zh" ? protocolList.value[0].url : protocolList.value[0].urlEn,
+                  target: "_blank"
+                }, toDisplayString(unref(t)("common.PRIVACY_POLICY")), 9, _hoisted_10),
+                createTextVNode(" " + toDisplayString(unref(t)("common.AND")) + " ", 1),
+                createElementVNode("a", {
+                  href: unref(locale) === "zh" ? protocolList.value[1].url : protocolList.value[1].urlEn,
+                  target: "_blank"
+                }, toDisplayString(unref(t)("common.LEGAL_NOTICE")), 9, _hoisted_11),
+                !__props.userInfo.loading ? (openBlock(), createElementBlock("span", _hoisted_12, toDisplayString(unref(t)("common.SIGN")) + toDisplayString(unref(transformDate)(__props.userInfo.privacySignedTime, unref(locale))), 1)) : createCommentVNode("", true)
+              ])
+            ])
+          ]),
+          createElementVNode("div", {
+            class: normalizeClass(["tips", { "tips-inline": unref(lePadV) }])
+          }, [
+            createElementVNode("div", _hoisted_13, toDisplayString(unref(t)("common.DELETE_ACCOUNT_TITLE")), 1),
+            createElementVNode("div", _hoisted_14, [
+              createElementVNode("span", _hoisted_15, toDisplayString(unref(t)("common.DELETE_ACCOUNT_TIPS")), 1),
+              !unref(lePadV) ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: "text-btn red",
+                onClick: submit
+              }, toDisplayString(unref(t)("common.DEREGISTER")), 1)) : (openBlock(), createElementBlock("img", {
+                key: 1,
+                src: unref(isLight) ? unref(LeftArrowLight) : unref(LeftArrowDark),
+                alt: "",
+                class: "arrow",
+                onClick: submit
+              }, null, 8, _hoisted_16))
+            ])
+          ], 2)
+        ], 2),
+        createVNode(ODeleteAccountModal, {
+          modelValue: deleteAccountVisible.value,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => deleteAccountVisible.value = $event),
+          "user-info": __props.userInfo,
+          "client-id": __props.clientId,
+          community: __props.community,
+          "send-code-captcha-post": __props.sendCodeCaptchaPost,
+          "captcha-apis": __props.captchaApis,
+          onSubmit: confirm,
+          onBinding: goDeleteBinding
+        }, null, 8, ["modelValue", "user-info", "client-id", "community", "send-code-captcha-post", "captcha-apis"]),
+        createVNode(OModifyPwd, {
+          modelValue: pwdDialogVisible.value,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => pwdDialogVisible.value = $event),
+          "rsa-encrypt": __props.rsaEncrypt,
+          "user-info": __props.userInfo,
+          "client-id": __props.clientId,
+          community: __props.community,
+          "oneid-url": __props.oneidUrl,
+          "app-id": __props.appId,
+          "reset-pwd": __props.resetPwd,
+          "reset-pwd-verify": __props.resetPwdVerify,
+          "send-code-captcha-post": __props.sendCodeCaptchaPost,
+          "captcha-apis": __props.captchaApis,
+          onBinding: toBinding,
+          onLogout: _cache[2] || (_cache[2] = (payload) => emit("logout", payload))
+        }, null, 8, ["modelValue", "rsa-encrypt", "user-info", "client-id", "community", "oneid-url", "app-id", "reset-pwd", "reset-pwd-verify", "send-code-captcha-post", "captcha-apis"]),
+        createVNode(ToBindingTipModal, {
+          modelValue: toBindingModalVisible.value,
+          "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => toBindingModalVisible.value = $event),
+          account: toBindingAccount.value,
+          onConfirm: goBinding,
+          isDelete: isDelete.value
+        }, null, 8, ["modelValue", "account", "isDelete"]),
+        createVNode(OAppDialog, {
+          modelValue: bindingModalVisible.value,
+          "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => bindingModalVisible.value = $event),
+          config: config[operateKey.value],
+          "operate-key": operateKey.value,
+          "user-info": __props.userInfo,
+          community: __props.community,
+          "send-code-post": __props.sendCodePost,
+          "captcha-apis": __props.captchaApis
+        }, null, 8, ["modelValue", "config", "operate-key", "user-info", "community", "send-code-post", "captcha-apis"])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/user-center/OAccountSetting.css

@@ -0,0 +1,230 @@
+.hover-icon-rotate .o-icon[data-v-423d3be1] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-423d3be1] {
+    transform: rotate(-180deg);
+}
+}
+.user-info-setting[data-v-423d3be1] {
+  border-bottom: 1px solid var(--o-color-control4);
+}
+@media (max-width: 840px) {
+.user-info-setting[data-v-423d3be1] {
+    border-bottom: none;
+}
+}
+.title[data-v-423d3be1] {
+  font-size: var(--font-size1);
+  line-height: var(--line-height1);
+  font-weight: 600;
+  color: var(--o-color-info1);
+  margin-bottom: 12px;
+}
+.login-setting[data-v-423d3be1] {
+  font-size: 14px;
+  line-height: 22px;
+  font-weight: normal;
+  color: var(--o-color-info2);
+  padding-bottom: var(--layout-gap2);
+  border-bottom: 1px solid var(--o-color-control4);
+  margin-bottom: var(--layout-gap2);
+}
+@media (max-width: 840px) {
+.login-setting[data-v-423d3be1] {
+    border-bottom: none;
+}
+}
+.section-label[data-v-423d3be1] {
+  font-size: var(--font-size3);
+  line-height: var(--line-height3);
+  font-weight: 600;
+  margin-top: var(--layout-gap2);
+  margin-bottom: var(--layout-gap2);
+}
+
+/* 移动端：白色卡片行（与三方账号绑定一致） */
+.setting-content-pad[data-v-423d3be1] {
+  background-color: var(--o-color-fill2);
+  padding-bottom: 0;
+  border-radius: 4px;
+  margin-top: 4px;
+  padding: 0 16px;
+}
+.setting-content-pad .opt-item[data-v-423d3be1] {
+  width: 100%;
+  /* 重置基础规则的 max-width:592px，移动端卡片行始终通栏（与三方账号绑定一致） */
+  max-width: 100%;
+  height: 52px;
+  line-height: normal;
+  margin: 0;
+  border-bottom: 1px solid var(--o-color-control4);
+}
+.setting-content-pad .opt-item[data-v-423d3be1]:last-child {
+  border-bottom: none;
+}
+.setting-content-pad .opt-item .left-content[data-v-423d3be1] {
+  flex: 1;
+  align-items: center;
+  margin-left: 0;
+}
+.setting-content-pad .opt-item .left-content .content-info[data-v-423d3be1] {
+  /* 基础规则的 flex-grow:1 会占满剩余空间导致值紧贴标签（auto margin 失效），
+     移动端需与三方账号绑定行一致：值靠右、紧贴箭头 */
+  flex-grow: 0;
+  margin-left: auto;
+  margin-right: 0;
+  justify-content: flex-end;
+}
+.setting-content-pad .opt-item .left-content .content-label[data-v-423d3be1] {
+  color: var(--o-color-info1);
+}
+.opt-item[data-v-423d3be1] {
+  margin: var(--layout-gap2) 0;
+  line-height: 40px;
+  display: flex;
+  width: 592px;
+  justify-content: space-between;
+  color: var(--o-color-info1);
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.opt-item[data-v-423d3be1] {
+    width: 480px;
+}
+}
+.opt-item .opt-label[data-v-423d3be1] {
+  color: var(--o-color-info1);
+}
+.opt-item .o-link + .o-link[data-v-423d3be1] {
+  margin-left: var(--o-spacing-h4);
+}
+.opt-item .left-content .content-label[data-v-423d3be1],
+.opt-item .left-content .content-info[data-v-423d3be1] {
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.opt-item .left-content .content-label[data-v-423d3be1],
+  .opt-item .left-content .content-info[data-v-423d3be1] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.opt-item .left-content .content-label[data-v-423d3be1],
+  .opt-item .left-content .content-info[data-v-423d3be1] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.opt-item .left-content .content-label[data-v-423d3be1],
+  .opt-item .left-content .content-info[data-v-423d3be1] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.opt-item .left-content .content-label[data-v-423d3be1],
+  .opt-item .left-content .content-info[data-v-423d3be1] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.opt-item .left-content .content-label[data-v-423d3be1] {
+  min-width: 120px;
+  color: var(--o-color-info2);
+  padding-left: 8px;
+}
+.opt-item .left-content[data-v-423d3be1] {
+  /* 用户信息值 */
+}
+.opt-item .left-content .content-info[data-v-423d3be1],
+.opt-item .left-content .opt-label[data-v-423d3be1] {
+  color: var(--o-color-info2);
+}
+.opt-item .left-content .content-info[data-v-423d3be1] {
+  flex-grow: 1;
+  margin-right: 16px;
+}
+.opt-item .left-content .content-label-en[data-v-423d3be1] {
+  min-width: 160px;
+  padding-left: 8px;
+}
+.opt-item .left-content .mask-icon[data-v-423d3be1]:hover {
+  color: var(--o-color-link2);
+}
+.opt-item.lang-en[data-v-423d3be1] {
+  width: 592px;
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.opt-item.lang-en[data-v-423d3be1] {
+    width: 480px;
+}
+}
+.icon[data-v-423d3be1] {
+  font-size: 24px;
+  line-height: 1;
+}
+.center[data-v-423d3be1] {
+  display: flex;
+  align-items: center;
+}
+.center .unbind[data-v-423d3be1] {
+  margin-right: 16px;
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.center .unbind[data-v-423d3be1] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.center .unbind[data-v-423d3be1] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.center .unbind[data-v-423d3be1] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.center .unbind[data-v-423d3be1] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.center .unbind[data-v-423d3be1] .o-link-label {
+  color: var(--o-color-info3);
+  transition: none;
+  background: none;
+  background-size: 0;
+}
+.skeleton-text[data-v-423d3be1] {
+  --skeleton-item-gap: 0px;
+  --skeleton-height: 32px;
+  width: 440px;
+}
+[data-v-423d3be1] .o-link-normal {
+  --link-color-hover: var(--o-color-link2);
+}
+@media screen and (max-width: 1440px) {
+.skeleton-text[data-v-423d3be1] {
+    --skeleton-height: 28px;
+}
+}
+@media screen and (max-width: 1200px) {
+.skeleton-text[data-v-423d3be1] {
+    --skeleton-height: 24px;
+}
+}
+@media screen and (max-width: 840px) {
+.skeleton-text[data-v-423d3be1] {
+    --skeleton-height: 24px;
+}
+}

package/dist/treeshaking/components/user-center/OAccountSetting.vue.d.ts

@@ -0,0 +1,25 @@
+import { QueryCodeParams, BindAccountParams } from './types/usercenter.interface';
+import { IObject } from './types/interface';
+import { CaptchaApisT } from './types/captcha';
+type __VLS_Props = {
+    userInfo: IObject;
+    phoneUnbindable?: boolean;
+    phoneVisible?: boolean;
+    community?: string;
+    bindAccountPost: (data: BindAccountParams) => Promise<any>;
+    modifyAccountPost: (body: any, params?: any) => Promise<any>;
+    sendUnbindCodePost: (data: QueryCodeParams) => Promise<any>;
+    sendCodePost: (data: QueryCodeParams) => Promise<any>;
+    unbindAccountPost: (data: BindAccountParams) => Promise<any>;
+    captchaApis: CaptchaApisT;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    refresh: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onRefresh?: ((...args: any[]) => any) | undefined;
+}>, {
+    community: string;
+    phoneUnbindable: boolean;
+    phoneVisible: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/treeshaking/components/user-center/OAccountSetting.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from "./OAccountSetting.vue2.mjs";
+import './OAccountSetting.css';
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
+const _OAccountSetting = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-423d3be1"]]);
+export {
+  _OAccountSetting as default
+};