@opendesign-plus-test/components 0.0.1-rc.207 → 0.0.1-rc.208

package/dist/treeshaking/components/user-center/internal/OAppDialog.vue2.mjs

@@ -0,0 +1,446 @@
+import { defineComponent, ref, toRefs, reactive, computed, onBeforeUpdate, openBlock, createBlock, unref, isRef, withCtx, createElementVNode, createElementBlock, toDisplayString, createCommentVNode, createVNode, withModifiers, normalizeStyle, createTextVNode } from "vue";
+import { useMessage, ODialog, OForm, OFormItem, OInput, OButton } from "@opensig/opendesign";
+import { formValidator, validatorEmpty, getCodeRules, validatorEmail, validatorPhone } from "../utils/rules.mjs";
+import _sfc_main$1 from "./OCountdownButton.vue.mjs";
+import Verify from "../verify/Verify.vue.mjs";
+import { isSendCodeEmail, getVerifyImgSize } from "../utils/utils.mjs";
+import { useI18n } from "../../../i18n/index.mjs";
+import { useScreen } from "@opendesign-plus/composables";
+const _hoisted_1 = { class: "header" };
+const _hoisted_2 = { class: "main" };
+const _hoisted_3 = {
+  key: 0,
+  class: "main-content"
+};
+const _hoisted_4 = {
+  key: 0,
+  class: "item-label"
+};
+const _hoisted_5 = {
+  key: 1,
+  class: "old-account"
+};
+const _hoisted_6 = {
+  key: 2,
+  class: "item-label"
+};
+const _hoisted_7 = {
+  key: 4,
+  class: "item-label"
+};
+const _hoisted_8 = {
+  key: 6,
+  class: "item-label"
+};
+const _hoisted_9 = { class: "footer" };
+const _hoisted_10 = {
+  key: 0,
+  class: "divider"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OAppDialog",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: false
+    },
+    config: {
+      type: Object,
+      default: () => ({})
+    },
+    operateKey: {
+      type: String,
+      required: true
+    },
+    // 用户信息（由使用方传入）
+    userInfo: {
+      type: Object,
+      required: true
+    },
+    // API 由使用方传入
+    sendCodePost: {
+      type: Function,
+      required: true
+    },
+    captchaApis: {
+      type: Object,
+      required: true
+    },
+    // 社区标识（滑块验证码主题色等按社区区分）
+    community: {
+      type: String,
+      default: "openeuler"
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const { t } = useI18n();
+    const message = useMessage(null);
+    const { lePadV } = useScreen();
+    const formRef = ref();
+    const props = __props;
+    const verify = ref();
+    const { modelValue, config, operateKey } = toRefs(props);
+    const emit = __emit;
+    const form = reactive({
+      oldaccount: "",
+      oldcode: "",
+      account: "",
+      code: ""
+    });
+    const btnDisabled = computed(() => {
+      var _a;
+      if (operateKey.value === "bind_email" || operateKey.value === "bind_phone") {
+        return !form.account || !form.code;
+      }
+      if (operateKey.value === "modify_email" && !isSendCodeEmail((_a = props.userInfo) == null ? void 0 : _a.email)) {
+        return !form.account || !form.code;
+      }
+      if (operateKey.value === "modify_email" || operateKey.value === "modify_phone") {
+        return !form.oldcode || !form.account || !form.code;
+      }
+      if (operateKey.value === "unbind_phone") {
+        return !form.code;
+      }
+      return false;
+    });
+    const sendCodeFuc = (data) => {
+      return new Promise((resolve, rejects) => {
+        props.sendCodePost(data).then(() => {
+          resolve(true);
+        }).catch((err) => {
+          rejects(err);
+        });
+      });
+    };
+    const oldaccountNum = ref(false);
+    const disableCode = ref(true);
+    const verifySuccessType = ref("");
+    const getcode = (formEl, type) => {
+      if (!formEl) return;
+      verifySuccessType.value = type || "account";
+      formValidator(formEl, verifySuccessType.value).subscribe((valid) => {
+        if (valid) {
+          verify.value.show();
+        }
+      });
+    };
+    const verifySuccess = (data) => {
+      var _a, _b, _c, _d;
+      const param = {
+        account: form[verifySuccessType.value],
+        captchaVerification: data.captchaVerification
+      };
+      if ((_a = config == null ? void 0 : config.value) == null ? void 0 : _a.key.includes("unbind")) {
+        Object.assign(param, { account_type: config.value.account_type });
+      } else {
+        const channel = ((_b = config == null ? void 0 : config.value) == null ? void 0 : _b.account_type.includes("phone")) ? "channel_bind_phone" : "channel_bind_email";
+        Object.assign(param, { channel });
+      }
+      (((_d = (_c = config == null ? void 0 : config.value) == null ? void 0 : _c.code) == null ? void 0 : _d.getCode) || sendCodeFuc)(param).then(() => {
+        message.success({
+          content: t("common.SEND_SUCCESS")
+        });
+        if (verifySuccessType.value === "oldaccount") {
+          oldaccountNum.value = true;
+        } else {
+          disableCode.value = true;
+        }
+      });
+    };
+    const checkCodeCanClick = (formEl) => {
+      if (!form.account) {
+        disableCode.value = true;
+      } else {
+        formValidator(formEl, "account").subscribe((valid) => {
+          var _a;
+          disableCode.value = !valid;
+          (_a = formRef.value) == null ? void 0 : _a.clearValidate("account");
+        });
+      }
+    };
+    const clear = () => {
+      form.oldaccount = "";
+      form.oldcode = "";
+      form.account = "";
+      form.code = "";
+      oldaccountNum.value = false;
+      disableCode.value = true;
+    };
+    const open = () => {
+      var _a, _b;
+      clear();
+      form.oldaccount = config.value.account_type === "email" ? (_a = props.userInfo) == null ? void 0 : _a.email : (_b = props.userInfo) == null ? void 0 : _b.phoneCountry;
+      disableCode.value = config.value.key !== "unbind_phone";
+    };
+    open();
+    onBeforeUpdate(() => {
+      open();
+    });
+    const close = () => {
+      clear();
+      emit("update:modelValue", false);
+    };
+    const confirm = (formEl) => {
+      if (!formEl) return;
+      formValidator(formEl).subscribe((valid) => {
+        var _a;
+        if (valid) {
+          (_a = config == null ? void 0 : config.value) == null ? void 0 : _a.confirm({
+            account_type: config.value.account_type,
+            ...form
+          });
+        }
+      });
+    };
+    const defaultRules = [
+      {
+        validator: validatorEmpty(t),
+        triggers: "change"
+      }
+    ];
+    const validatorSameAccount = (_rule, value, callback) => {
+      var _a;
+      if (value) {
+        if (form.oldaccount && form.oldaccount === value) {
+          const msg = ((_a = config == null ? void 0 : config.value) == null ? void 0 : _a.account_type) === "email" ? t("common.SAME_EMAIL2") : t("common.SAME_PHONE");
+          callback(msg);
+        } else {
+          callback();
+        }
+      }
+    };
+    const rules = getCodeRules(t);
+    const sameAccount = [
+      {
+        validator: validatorSameAccount,
+        triggers: "change"
+      }
+    ];
+    const emailRules = [
+      ...defaultRules,
+      {
+        validator: validatorEmail(t),
+        triggers: "change"
+      },
+      ...sameAccount
+    ];
+    const phoneRules = [
+      ...defaultRules,
+      {
+        validator: validatorPhone(t),
+        triggers: "change"
+      },
+      ...sameAccount
+    ];
+    const accountPlaceholder = computed(
+      () => {
+        var _a, _b;
+        return t(`common.${((_b = (_a = config == null ? void 0 : config.value) == null ? void 0 : _a.account) == null ? void 0 : _b.placeholder) ?? "ENTER_NEW_EMAIL"}`);
+      }
+    );
+    const codePlaceholder = computed(
+      () => {
+        var _a, _b;
+        return t(`common.${((_b = (_a = config == null ? void 0 : config.value) == null ? void 0 : _a.code) == null ? void 0 : _b.placeholder) ?? "ENTER_RECEIVED_CODE"}`);
+      }
+    );
+    const showCode = computed(() => {
+      var _a, _b, _c;
+      const bool = ((_a = config == null ? void 0 : config.value) == null ? void 0 : _a.code) && (config.value.key !== "unbind_phone" || (!((_b = props.userInfo) == null ? void 0 : _b.phoneCountryCode) || ((_c = props.userInfo) == null ? void 0 : _c.phoneCountryCode.includes("+86"))));
+      return bool;
+    });
+    const dlgToggle = (visible) => {
+      if (!visible) {
+        close();
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ODialog), {
+        visible: unref(modelValue),
+        "onUpdate:visible": _cache[10] || (_cache[10] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
+        class: "dialog",
+        style: {
+          "--dlg-body-padding": "58px",
+          "--dlg-padding-body-bottom": 0,
+          "--dlg-width": "690px",
+          "--dlg-radius": "4px",
+          "--o-radius_control-s": 0,
+          "--dlg-edge-gap": "32px",
+          "--dlg-header-gap": "24px",
+          "--dlg-inner-gap": 0
+        },
+        "mask-close": false,
+        onChange: dlgToggle
+      }, {
+        header: withCtx(() => [
+          createElementVNode("h5", _hoisted_1, toDisplayString(unref(t)(`common.${unref(config).header}`)), 1)
+        ]),
+        footer: withCtx(() => [
+          createElementVNode("div", _hoisted_9, [
+            createVNode(unref(OButton), {
+              size: "large",
+              color: "primary",
+              variant: "solid",
+              type: "submit",
+              disabled: btnDisabled.value,
+              onClick: _cache[9] || (_cache[9] = ($event) => confirm(formRef.value))
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("common.CONFIRM")), 1)
+              ]),
+              _: 1
+            }, 8, ["disabled"]),
+            unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_10)) : 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(() => [
+          createElementVNode("div", _hoisted_2, [
+            unref(config).content ? (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(unref(t)(`common.${unref(config).content}`)), 1)) : createCommentVNode("", true),
+            createVNode(unref(OForm), {
+              ref_key: "formRef",
+              ref: formRef,
+              "label-width": "0",
+              "label-align": "top",
+              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",
+              onSubmit: _cache[8] || (_cache[8] = withModifiers(() => {
+              }, ["prevent"]))
+            }, {
+              default: withCtx(() => {
+                var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
+                return [
+                  ((_a = unref(config)) == null ? void 0 : _a.oldaccount) && ((_b = unref(config).oldaccount) == null ? void 0 : _b.label) ? (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(unref(t)(`common.${unref(config).oldaccount.label}`)), 1)) : createCommentVNode("", true),
+                  ((_c = unref(config)) == null ? void 0 : _c.oldaccount) ? (openBlock(), createElementBlock("p", _hoisted_5, toDisplayString(form.oldaccount), 1)) : createCommentVNode("", true),
+                  ((_d = unref(config)) == null ? void 0 : _d.oldcode) && ((_e = unref(config).oldcode) == null ? void 0 : _e.label) ? (openBlock(), createElementBlock("p", _hoisted_6, toDisplayString(unref(t)(`common.${unref(config).oldcode.label}`)), 1)) : createCommentVNode("", true),
+                  ((_f = unref(config)) == null ? void 0 : _f.oldcode) && unref(isSendCodeEmail)(form == null ? void 0 : form.oldaccount) ? (openBlock(), createBlock(unref(OFormItem), {
+                    key: 3,
+                    field: "oldcode",
+                    rules: unref(rules),
+                    style: {
+                      "display": "flex"
+                    }
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(OInput), {
+                        modelValue: form.oldcode,
+                        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => form.oldcode = $event),
+                        modelModifiers: { trim: true },
+                        placeholder: codePlaceholder.value,
+                        class: "form-input",
+                        clearable: false,
+                        size: "large",
+                        maxlength: "6"
+                      }, {
+                        suffix: withCtx(() => [
+                          createVNode(_sfc_main$1, {
+                            modelValue: oldaccountNum.value,
+                            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => oldaccountNum.value = $event),
+                            color: "primary",
+                            size: "small",
+                            onClick: _cache[1] || (_cache[1] = ($event) => getcode(formRef.value, "oldaccount"))
+                          }, null, 8, ["modelValue"])
+                        ]),
+                        _: 1
+                      }, 8, ["modelValue", "placeholder"])
+                    ]),
+                    _: 1
+                  }, 8, ["rules"])) : createCommentVNode("", true),
+                  ((_g = unref(config)) == null ? void 0 : _g.account) && ((_h = unref(config).account) == null ? void 0 : _h.label) ? (openBlock(), createElementBlock("p", _hoisted_7, toDisplayString(unref(t)(`common.${(_j = (_i = unref(config)) == null ? void 0 : _i.account) == null ? void 0 : _j.label}`)), 1)) : createCommentVNode("", true),
+                  ((_k = unref(config)) == null ? void 0 : _k.account) ? (openBlock(), createBlock(unref(OFormItem), {
+                    key: 5,
+                    field: "account",
+                    rules: unref(config).account_type === "email" ? emailRules : phoneRules,
+                    style: {
+                      "display": "flex"
+                    }
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(OInput), {
+                        modelValue: form.account,
+                        "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => form.account = $event),
+                        modelModifiers: { trim: true },
+                        placeholder: accountPlaceholder.value,
+                        class: "form-input",
+                        size: "large",
+                        onInput: _cache[4] || (_cache[4] = ($event) => checkCodeCanClick(formRef.value))
+                      }, null, 8, ["modelValue", "placeholder"])
+                    ]),
+                    _: 1
+                  }, 8, ["rules"])) : createCommentVNode("", true),
+                  ((_l = unref(config)) == null ? void 0 : _l.code) && ((_m = unref(config).code) == null ? void 0 : _m.label) ? (openBlock(), createElementBlock("p", _hoisted_8, toDisplayString(unref(t)(`common.${unref(config).code.label}`)), 1)) : createCommentVNode("", true),
+                  showCode.value ? (openBlock(), createBlock(unref(OFormItem), {
+                    key: 7,
+                    field: "code",
+                    rules: unref(rules),
+                    style: {
+                      "display": "flex"
+                    }
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(OInput), {
+                        modelValue: form.code,
+                        "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => form.code = $event),
+                        modelModifiers: { trim: true },
+                        placeholder: codePlaceholder.value,
+                        class: "form-input",
+                        maxlength: "6",
+                        size: "large"
+                      }, {
+                        suffix: withCtx(() => [
+                          createVNode(_sfc_main$1, {
+                            modelValue: disableCode.value,
+                            "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => disableCode.value = $event),
+                            color: "primary",
+                            size: "small",
+                            onClick: _cache[6] || (_cache[6] = ($event) => getcode(formRef.value))
+                          }, null, 8, ["modelValue"])
+                        ]),
+                        _: 1
+                      }, 8, ["modelValue", "placeholder"])
+                    ]),
+                    _: 1
+                  }, 8, ["rules"])) : createCommentVNode("", true)
+                ];
+              }),
+              _: 1
+            }, 8, ["model"])
+          ]),
+          createVNode(Verify, {
+            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"])
+        ]),
+        _: 1
+      }, 8, ["visible"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/user-center/internal/OAppEmpty.css

@@ -0,0 +1,63 @@
+.hover-icon-rotate .o-icon[data-v-7a03249c] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-7a03249c] {
+    transform: rotate(-180deg);
+}
+}
+.empty-wrap[data-v-7a03249c] {
+  color: var(--o-color-info3);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--o-gap-9, 64px);
+}
+.empty-wrap .o-result[data-v-7a03249c] {
+  --result-image-width: 240px;
+  --result-image-height: 240px;
+}
+@media (max-width: 1440px) {
+.empty-wrap .o-result[data-v-7a03249c] {
+    --result-image-width: 160px;
+    --result-image-height: 160px;
+}
+}
+.empty-wrap.size-small .o-result[data-v-7a03249c] {
+  --result-image-width: 120px;
+  --result-image-height: 120px;
+}
+@media (max-width: 1440px) {
+.empty-wrap.size-small .o-result[data-v-7a03249c] {
+    --result-image-width: 80px;
+    --result-image-height: 80px;
+}
+}
+.empty-wrap[data-v-7a03249c] .o-result-content {
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.empty-wrap[data-v-7a03249c] .o-result-content {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.empty-wrap[data-v-7a03249c] .o-result-content {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.empty-wrap[data-v-7a03249c] .o-result-content {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.empty-wrap[data-v-7a03249c] .o-result-content {
+    font-size: 12px;
+    line-height: 18px;
+}
+}

package/dist/treeshaking/components/{article-anchor/components/ArticleAnchorPc.vue.d.ts → user-center/internal/OAppEmpty.vue.d.ts}

@@ -1,18 +1,21 @@
 type __VLS_Props = {
-    showTitle?: boolean;
-    title?: string;
-    radius?: string;
+    src?: string;
+    size?: 'small' | 'medium' | 'large';
+    height?: string;
 };
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
-        default?(_: {}): any;
+        description?(_: {}): any;
     };
     refs: {};
     rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: "small" | "medium" | "large";
+    height: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/treeshaking/components/user-center/internal/OAppEmpty.vue.mjs

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

package/dist/treeshaking/components/user-center/internal/OAppEmpty.vue2.mjs

@@ -0,0 +1,41 @@
+import { defineComponent, openBlock, createElementBlock, normalizeStyle, normalizeClass, createVNode, unref, withCtx, renderSlot, createTextVNode, toDisplayString } from "vue";
+import { OResult, OFigure } from "@opensig/opendesign";
+import noData from "../../../assets/user-center/images/noData.svg.mjs";
+import { useI18n } from "../../../i18n/index.mjs";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OAppEmpty",
+  props: {
+    src: {},
+    size: { default: "medium" },
+    height: { default: "auto" }
+  },
+  setup(__props) {
+    const { t } = useI18n();
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["empty-wrap", `size-${__props.size}`]),
+        style: normalizeStyle({
+          minHeight: `calc(${__props.height} - var(--o-gap-8, 48px))`
+        })
+      }, [
+        createVNode(unref(OResult), null, {
+          image: withCtx(() => [
+            createVNode(unref(OFigure), {
+              class: "img",
+              src: __props.src ?? unref(noData)
+            }, null, 8, ["src"])
+          ]),
+          default: withCtx(() => [
+            renderSlot(_ctx.$slots, "description", {}, () => [
+              createTextVNode(toDisplayString(unref(t)("common.EMPTY")), 1)
+            ], true)
+          ]),
+          _: 3
+        })
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/user-center/internal/OCommonHeader.css

@@ -0,0 +1,34 @@
+.hover-icon-rotate .o-icon[data-v-6da8051c] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-6da8051c] {
+    transform: rotate(-180deg);
+}
+}
+.common-header[data-v-6da8051c] {
+  /* inline 轴尺寸包含：header 本组件按文档流使用（.header-wrap 为 relative），
+     桌面端英文导航 + 搜索工具条的固有宽度若向外传播，会在窄视口下把整页撑宽
+     （表现为 main 居中偏移出左侧空区、右侧内容被视口裁切）。
+     contain 后 header 自身渲染不变（宽度仍为撑满父级），但不再参与页面固有宽度计算 */
+  contain: inline-size;
+}
+.common-header[data-v-6da8051c] .header {
+  position: relative;
+}
+.common-header[data-v-6da8051c] .header {
+  --o-header-height: var(--layout-header-height, 72px);
+}
+.common-header[data-v-6da8051c] .header-wrap {
+  position: relative;
+}
+.common-header[data-v-6da8051c] .header-nav-content {
+  position: absolute;
+  top: 100%;
+}
+.common-header[data-v-6da8051c] .header-box {
+  position: relative;
+}
+.common-header[data-v-6da8051c] .header-content-mb {
+  position: absolute;
+}