import { defineComponent, ref, reactive, resolveComponent, openBlock, createElementBlock, createElementVNode, withModifiers, createVNode, unref, withCtx, toDisplayString } from "vue";
import { u as useI18n, j as useRouter, k as useAuthService, D as DxForm_1, m as DxGroupItem_1, f as DxSimpleItem_1, g as DxLabel_1, p as DxRequiredRule_1, r as DxEmailRule_1, s as DxStringLengthRule_1, t as DxCompareRule_1, h as DxButtonItem_1, q as DxButtonOptions_1, n as notify } from "./index-67606569.mjs";
const _hoisted_1 = { class: "row justify-content-center mt-4" };
const _hoisted_2 = { class: "col-lg-5 col-md-5" };
const _hoisted_3 = { class: "card bg-secondary border-0 mb-0" };
const _hoisted_4 = { class: "card-body p-5" };
const _hoisted_5 = ["onSubmit"];
const _hoisted_6 = { class: "row mt-3" };
const _hoisted_7 = { class: "col-6 text-left" };
const _hoisted_8 = /* @__PURE__ */ createElementVNode("div", { class: "col-6 text-right" }, null, -1);
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "Signup",
  setup(__props) {
    const { t } = useI18n();
    const isLoading = ref(true);
    const state = reactive({});
    const form = ref(null);
    const router = useRouter();
    const authService = useAuthService();
    const passwordComparison = () => {
      return state.password;
    };
    const onFormSubmit = async () => {
      isLoading.value = true;
      try {
        const error = await authService.register(state);
        if (error) {
          notify(error, "error");
        } else {
          notify(t("message.emailConfimationSent", { email: state.username }), "success");
          router.replace({ name: "login" });
        }
      } finally {
        isLoading.value = false;
      }
    };
    return (_ctx, _cache) => {
      const _component_router_link = resolveComponent("router-link");
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createElementVNode("div", _hoisted_2, [
          createElementVNode("div", _hoisted_3, [
            createElementVNode("div", _hoisted_4, [
              createElementVNode("form", {
                novalidate: "",
                onSubmit: withModifiers(onFormSubmit, ["prevent"])
              }, [
                createVNode(unref(DxForm_1), {
                  ref_key: "form",
                  ref: form,
                  "label-location": "top",
                  "form-data": state,
                  "show-colon-after-label": false
                }, {
                  default: withCtx(() => [
                    createVNode(unref(DxGroupItem_1), {
                      caption: unref(t)("createAccount")
                    }, {
                      default: withCtx(() => [
                        createVNode(unref(DxSimpleItem_1), {
                          "data-field": "first_name",
                          "editor-type": "dxTextBox"
                        }, {
                          default: withCtx(() => [
                            createVNode(unref(DxLabel_1), {
                              text: unref(t)("attributes.first_name")
                            }, null, 8, ["text"]),
                            createVNode(unref(DxRequiredRule_1))
                          ]),
                          _: 1
                        }),
                        createVNode(unref(DxSimpleItem_1), {
                          "data-field": "last_name",
                          "editor-type": "dxTextBox"
                        }, {
                          default: withCtx(() => [
                            createVNode(unref(DxLabel_1), {
                              text: unref(t)("attributes.last_name")
                            }, null, 8, ["text"]),
                            createVNode(unref(DxRequiredRule_1))
                          ]),
                          _: 1
                        }),
                        createVNode(unref(DxSimpleItem_1), {
                          "data-field": "username",
                          "editor-type": "dxTextBox"
                        }, {
                          default: withCtx(() => [
                            createVNode(unref(DxLabel_1), {
                              text: unref(t)("attributes.email")
                            }, null, 8, ["text"]),
                            createVNode(unref(DxRequiredRule_1)),
                            createVNode(unref(DxEmailRule_1))
                          ]),
                          _: 1
                        }),
                        createVNode(unref(DxSimpleItem_1), {
                          "data-field": "cellphone",
                          "editor-type": "dxTextBox",
                          "editor-options": { mask: "(00) 0 0000-0000" },
                          label: { text: unref(t)("attributes.cellphone") }
                        }, {
                          default: withCtx(() => [
                            createVNode(unref(DxRequiredRule_1))
                          ]),
                          _: 1
                        }, 8, ["editor-options", "label"]),
                        createVNode(unref(DxSimpleItem_1), {
                          "data-field": "password",
                          "editor-type": "dxTextBox",
                          "editor-options": { mode: "password" }
                        }, {
                          default: withCtx(() => [
                            createVNode(unref(DxLabel_1), {
                              text: unref(t)("attributes.password")
                            }, null, 8, ["text"]),
                            createVNode(unref(DxRequiredRule_1)),
                            createVNode(unref(DxStringLengthRule_1), {
                              min: 8,
                              message: unref(t)("validation.shortPassword")
                            }, null, 8, ["message"])
                          ]),
                          _: 1
                        }),
                        createVNode(unref(DxSimpleItem_1), {
                          "data-field": "confirmation",
                          "editor-type": "dxTextBox",
                          "editor-options": { mode: "password" }
                        }, {
                          default: withCtx(() => [
                            createVNode(unref(DxLabel_1), {
                              text: unref(t)("attributes.password_confirmation")
                            }, null, 8, ["text"]),
                            createVNode(unref(DxRequiredRule_1)),
                            createVNode(unref(DxCompareRule_1), { "comparison-target": passwordComparison })
                          ]),
                          _: 1
                        })
                      ]),
                      _: 1
                    }, 8, ["caption"]),
                    createVNode(unref(DxButtonItem_1), { "horizontal-alignment": "center" }, {
                      default: withCtx(() => [
                        createVNode(unref(DxButtonOptions_1), {
                          type: "success",
                          "use-submit-behavior": true,
                          text: unref(t)("confirm")
                        }, null, 8, ["text"])
                      ]),
                      _: 1
                    })
                  ]),
                  _: 1
                }, 8, ["form-data"])
              ], 40, _hoisted_5)
            ])
          ]),
          createElementVNode("div", _hoisted_6, [
            createElementVNode("div", _hoisted_7, [
              createVNode(_component_router_link, {
                class: "text-light",
                to: "/"
              }, {
                default: withCtx(() => [
                  createElementVNode("small", null, toDisplayString(unref(t)("haveAccount")), 1)
                ]),
                _: 1
              })
            ]),
            _hoisted_8
          ])
        ])
      ]);
    };
  }
});
export {
  _sfc_main as default
};
