import { QSpace } from './QSpace-afce9c3e.js';
import { QForm, DefaultAuthLayout, AlignCenterMiddleWrap, LogoNameBox, _sfc_main as _sfc_main$d, QPage } from './QForm-3da35848.js';
import { TouchPan } from './TouchPan-1bf8458c.js';
import { useDarkProps, useDark } from './use-dark-b88930fe.js';
import { createComponent, ref, computed, watch, h, hSlot, hDir, hMergeSlot, nextTick, getCurrentInstance, openBlock, createBlock, withCtx, renderSlot, useSignupStore, unref, isRef, QBtn, createTextVNode, createElementBlock, createVNode, Fragment, renderList, createBaseVNode, toDisplayString, pushScopeId, popScopeId, useRouter, useAuthStore, useQuasar, onUnmounted } from './__federation_expose_Modules-a9c6a6fc.js';
import { _sfc_main as _sfc_main$c } from './DefaultTextField-237675b7.js';
import { idRules, emailRules, nameRules, passwordRules } from './validationUtil-531209ab.js';
import { GoBackLoginLink } from './GoBackLoginLink-aa2265c0.js';
import { QCarouselSlide, QCarousel } from './QCarousel-2ebc5d26.js';
import { _export_sfc } from './_plugin-vue_export-helper-e9a2c33e.js';

const QSplitter = createComponent({
  name: 'QSplitter',

  props: {
    ...useDarkProps,

    modelValue: {
      type: Number,
      required: true
    },
    reverse: Boolean,
    unit: {
      type: String,
      default: '%',
      validator: v => [ '%', 'px' ].includes(v)
    },

    limits: {
      type: Array,
      validator: v => {
        if (v.length !== 2) return false
        if (typeof v[ 0 ] !== 'number' || typeof v[ 1 ] !== 'number') return false
        return v[ 0 ] >= 0 && v[ 0 ] <= v[ 1 ]
      }
    },

    emitImmediately: Boolean,

    horizontal: Boolean,
    disable: Boolean,

    beforeClass: [ Array, String, Object ],
    afterClass: [ Array, String, Object ],

    separatorClass: [ Array, String, Object ],
    separatorStyle: [ Array, String, Object ]
  },

  emits: [ 'update:modelValue' ],

  setup (props, { slots, emit }) {
    const { proxy: { $q } } = getCurrentInstance();
    const isDark = useDark(props, $q);

    const rootRef = ref(null);
    const sideRefs = {
      before: ref(null),
      after: ref(null)
    };

    const classes = computed(() =>
      'q-splitter no-wrap '
      + `${ props.horizontal === true ? 'q-splitter--horizontal column' : 'q-splitter--vertical row' }`
      + ` q-splitter--${ props.disable === true ? 'disabled' : 'workable' }`
      + (isDark.value === true ? ' q-splitter--dark' : '')
    );

    const propName = computed(() => (props.horizontal === true ? 'height' : 'width'));
    const side = computed(() => (props.reverse !== true ? 'before' : 'after'));

    const computedLimits = computed(() => (
      props.limits !== void 0
        ? props.limits
        : (props.unit === '%' ? [ 10, 90 ] : [ 50, Infinity ])
    ));

    function getCSSValue (value) {
      return (props.unit === '%' ? value : Math.round(value)) + props.unit
    }

    const styles = computed(() => ({
      [ side.value ]: {
        [ propName.value ]: getCSSValue(props.modelValue)
      }
    }));

    let __dir, __maxValue, __value, __multiplier, __normalized;

    function pan (evt) {
      if (evt.isFirst === true) {
        const size = rootRef.value.getBoundingClientRect()[ propName.value ];

        __dir = props.horizontal === true ? 'up' : 'left';
        __maxValue = props.unit === '%' ? 100 : size;
        __value = Math.min(__maxValue, computedLimits.value[ 1 ], Math.max(computedLimits.value[ 0 ], props.modelValue));
        __multiplier = (props.reverse !== true ? 1 : -1)
          * (props.horizontal === true ? 1 : ($q.lang.rtl === true ? -1 : 1))
          * (props.unit === '%' ? (size === 0 ? 0 : 100 / size) : 1);

        rootRef.value.classList.add('q-splitter--active');
        return
      }

      if (evt.isFinal === true) {
        if (__normalized !== props.modelValue) {
          emit('update:modelValue', __normalized);
        }

        rootRef.value.classList.remove('q-splitter--active');
        return
      }

      const val = __value
        + __multiplier
        * (evt.direction === __dir ? -1 : 1)
        * evt.distance[ props.horizontal === true ? 'y' : 'x' ];

      __normalized = Math.min(__maxValue, computedLimits.value[ 1 ], Math.max(computedLimits.value[ 0 ], val));

      sideRefs[ side.value ].value.style[ propName.value ] = getCSSValue(__normalized);

      if (props.emitImmediately === true && props.modelValue !== __normalized) {
        emit('update:modelValue', __normalized);
      }
    }

    const sepDirective = computed(() => {
      // if props.disable !== true
      return [ [
        TouchPan,
        pan,
        void 0,
        {
          [ props.horizontal === true ? 'vertical' : 'horizontal' ]: true,
          prevent: true,
          stop: true,
          mouse: true,
          mouseAllDir: true
        }
      ] ]
    });

    function normalize (val, limits) {
      if (val < limits[ 0 ]) {
        emit('update:modelValue', limits[ 0 ]);
      }
      else if (val > limits[ 1 ]) {
        emit('update:modelValue', limits[ 1 ]);
      }
    }

    watch(() => props.modelValue, v => {
      normalize(v, computedLimits.value);
    });

    watch(() => props.limits, () => {
      nextTick(() => {
        normalize(props.modelValue, computedLimits.value);
      });
    });

    return () => {
      const child = [
        h('div', {
          ref: sideRefs.before,
          class: [
            'q-splitter__panel q-splitter__before' + (props.reverse === true ? ' col' : ''),
            props.beforeClass
          ],
          style: styles.value.before
        }, hSlot(slots.before)),

        h('div', {
          class: [
            'q-splitter__separator',
            props.separatorClass
          ],
          style: props.separatorStyle,
          'aria-disabled': props.disable === true ? 'true' : void 0
        }, [
          hDir(
            'div',
            { class: 'q-splitter__separator-area absolute-full' },
            hSlot(slots.separator),
            'sep',
            props.disable !== true,
            () => sepDirective.value
          )
        ]),

        h('div', {
          ref: sideRefs.after,
          class: [
            'q-splitter__panel q-splitter__after' + (props.reverse === true ? '' : ' col'),
            props.afterClass
          ],
          style: styles.value.after
        }, hSlot(slots.after))
      ];

      return h('div', {
        class: classes.value,
        ref: rootRef
      }, hMergeSlot(slots.default, child))
    }
  }
});

const _sfc_main$b = {
  __name: 'SignupSplitter',
  setup(__props) {
    const localValue = ref(50);
    return (_ctx, _cache) => {
      return openBlock(), createBlock(QSplitter, {
        modelValue: localValue.value,
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => localValue.value = $event),
        limits: [50, 50],
        class: "default-splitter",
        "separator-class": "no-pointer-events"
      }, {
        before: withCtx(() => [renderSlot(_ctx.$slots, "before")]),
        after: withCtx(() => [renderSlot(_ctx.$slots, "after")]),
        _: 3
      }, 8, ["modelValue"]);
    };
  }
};

const _sfc_main$a = {
  __name: 'SignupIdInput',
  setup(__props) {
    const signupStore = useSignupStore();
    const id = computed({
      get: () => signupStore.id,
      set: v => signupStore.setId(v)
    });
    const text_field = ref(null);
    const onFocusout = () => {
      signupStore.checkDuplicatedId();
    };
    watch(signupStore.$state.duplicateIdList, () => {
      text_field.value.validate();
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$c, {
        ref_key: "text_field",
        ref: text_field,
        modelValue: unref(id),
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => isRef(id) ? id.value = $event : null),
        label: "ID",
        rules: [...unref(idRules), v => !unref(signupStore).$state.duplicateIdList.includes(v) || '* id is duplicated'],
        onFocusout: onFocusout
      }, null, 8, ["modelValue", "rules"]);
    };
  }
};

const _sfc_main$9 = {
  __name: 'SignupEmailInput',
  setup(__props) {
    const signupStore = useSignupStore();
    const email = computed({
      get: () => signupStore.email,
      set: value => signupStore.setEmail(value)
    });
    const text_field = ref(null);
    const onFocusout = () => {
      signupStore.checkDuplicatedEmail();
    };
    watch(signupStore.$state.duplicateEmailList, () => {
      text_field.value.validate();
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$c, {
        ref_key: "text_field",
        ref: text_field,
        modelValue: unref(email),
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => isRef(email) ? email.value = $event : null),
        label: "Email",
        rules: [...unref(emailRules), v => !unref(signupStore).$state.duplicateEmailList.includes(v) || '* this email is already used'],
        onFocusout: onFocusout
      }, null, 8, ["modelValue", "rules"]);
    };
  }
};

const _sfc_main$8 = {
  __name: 'SignupUsernameInput',
  setup(__props) {
    const signupStore = useSignupStore();
    const username = computed({
      get: () => signupStore.name,
      set: value => signupStore.setName(value)
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$c, {
        modelValue: unref(username),
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => isRef(username) ? username.value = $event : null),
        label: "Username",
        rules: unref(nameRules)
      }, null, 8, ["modelValue", "rules"]);
    };
  }
};

const _sfc_main$7 = {
  __name: 'SignupPasswordInput',
  setup(__props) {
    const signupStore = useSignupStore();
    const password = computed({
      get: () => signupStore.password,
      set: value => signupStore.setPassword(value)
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$c, {
        modelValue: unref(password),
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => isRef(password) ? password.value = $event : null),
        label: "Password",
        type: "password",
        rules: unref(passwordRules)
      }, null, 8, ["modelValue", "rules"]);
    };
  }
};

const _sfc_main$6 = {
  __name: 'SignupPasswordConfirmInput',
  setup(__props) {
    const signupStore = useSignupStore();
    const passwordConfirm = computed({
      get: () => signupStore.passwordConfirm,
      set: value => signupStore.setPasswordConfirm(value)
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$c, {
        modelValue: unref(passwordConfirm),
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => isRef(passwordConfirm) ? passwordConfirm.value = $event : null),
        label: "Password confirm",
        type: "password",
        rules: [v => !!v || '* Password confirm is required', v => v === unref(signupStore).password || '* Password confirm must be same as password']
      }, null, 8, ["modelValue", "rules"]);
    };
  }
};

const _sfc_main$5 = {
  __name: 'DefaultBtn',
  props: {
    color: {
      type: String,
      default: "secondary"
    },
    disabled: {
      type: Boolean,
      default: false
    },
    type: {
      type: String,
      default: "button"
    }
  },
  emits: ["click"],
  setup(__props) {
    const props = __props;
    return (_ctx, _cache) => {
      return openBlock(), createBlock(QBtn, {
        class: "default-btn",
        type: props.type,
        color: __props.color,
        disabled: props.disabled,
        unelevated: "",
        "no-caps": "",
        onClick: _cache[0] || (_cache[0] = $event => _ctx.$emit('click'))
      }, {
        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
        _: 3
      }, 8, ["type", "color", "disabled"]);
    };
  }
};

const _sfc_main$4 = {
  __name: 'SignupRegisterButton',
  setup(__props) {
    return (_ctx, _cache) => {
      return openBlock(), createBlock(_sfc_main$5, {
        class: "full-width",
        color: "primary",
        type: "submit"
      }, {
        default: withCtx(() => [createTextVNode(" Register ")]),
        _: 1
      });
    };
  }
};

const icon1 = "/assets/ic-1-2c71e1ad.svg";

const icon2 = "/assets/ic-2-f5762e31.svg";

const icon3 = "/assets/ic-3-0a7d0821.svg";

const SignupCarousel_vue_vue_type_style_index_0_scoped_1661564f_lang = '';

const _withScopeId = n => (pushScopeId("data-v-1661564f"), n = n(), popScopeId(), n);
const _hoisted_1$2 = {
  class: "q-pa-md"
};
const _hoisted_2$1 = ["src"];
const _hoisted_3 = /*#__PURE__*/_withScopeId(() => /*#__PURE__*/createBaseVNode("div", {
  class: "q-px-md"
}, null, -1));
const _hoisted_4 = {
  class: "q-mt-md text-center"
};
const _hoisted_5 = {
  class: "relative text-h5 text-left item-title"
};
const _hoisted_6 = {
  class: "text-body text-left item-description"
};
const _sfc_main$3 = {
  __name: 'SignupCarousel',
  setup(__props) {
    const slide = ref('0');
    const slideItems = [{
      icon: icon1,
      title: 'Choose, set, go! for your forecasting model training',
      description: 'Algorithms and hyper-parameters as options'
    }, {
      icon: icon2,
      title: 'Comparison, automatic best model selection and serving at once',
      description: 'Manual model selection is also available'
    }, {
      icon: icon3,
      title: 'Manage and monitor your serving endpoints',
      description: 'Status of serving endpoints, API docs, etc.'
    }];
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1$2, [createVNode(QCarousel, {
        modelValue: slide.value,
        "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => slide.value = $event),
        swipeable: "",
        animated: "",
        infinite: "",
        "control-color": "custom-arrow",
        arrows: "",
        "transition-next": "slide-left",
        "transition-prev": "slide-right",
        height: "116px",
        class: "bg-transparent text-white"
      }, {
        default: withCtx(() => [(openBlock(), createElementBlock(Fragment, null, renderList(slideItems, (item, index) => {
          return createVNode(QCarouselSlide, {
            key: index,
            name: index + '',
            class: "row no-wrap flex-center"
          }, {
            default: withCtx(() => [createBaseVNode("img", {
              src: item.icon,
              size: "116px"
            }, null, 8, _hoisted_2$1), _hoisted_3, createBaseVNode("div", _hoisted_4, [createBaseVNode("div", _hoisted_5, toDisplayString(item.title), 1), createBaseVNode("div", _hoisted_6, toDisplayString(item.description), 1)])]),
            _: 2
          }, 1032, ["name"]);
        }), 64))]),
        _: 1
      }, 8, ["modelValue"])]);
    };
  }
};
const SignupCarousel = /*#__PURE__*/_export_sfc(_sfc_main$3, [['__scopeId', "data-v-1661564f"]]);

const SignupFeaturesTitle_vue_vue_type_style_index_0_scoped_18d59dad_lang = '';

const _sfc_main$2 = {};
const _hoisted_1$1 = {
  class: "signup-features text-white text-center"
};
function _sfc_render(_ctx, _cache) {
  return openBlock(), createElementBlock("div", _hoisted_1$1, " Features ");
}
const SignupFeaturesTitle = /*#__PURE__*/_export_sfc(_sfc_main$2, [['render', _sfc_render], ['__scopeId', "data-v-18d59dad"]]);

const _sfc_main$1 = {
  __name: 'SignupForm',
  setup(__props) {
    const router = useRouter();
    const authStore = useAuthStore();
    const signupStore = useSignupStore();
    const $q = useQuasar();
    const form = ref(null);
    const onSubmit = () => {
      authStore.register().then(() => {
        $q.notify({
          color: "warning",
          message: "registered successfully.\n you need to activate your account by contacting the administrator.",
          icon: "check"
        });
        router.push("/login");
      }).catch(err => {
        if (err.response.status === 409) {
          signupStore.addDuplicateId(signupStore.id);
          form.value.validate();
          return;
        }
        $q.notify({
          color: "negative",
          message: "failed to register, if this problem persists, please contact the administrator.",
          icon: "report_problem"
        });
        return Promise.reject(err);
      });
    };
    onUnmounted(() => {
      signupStore.reset();
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(QForm, {
        ref_key: "form",
        ref: form,
        class: "signup-input-group q-mx-auto",
        onSubmit: onSubmit
      }, {
        default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
        _: 3
      }, 512);
    };
  }
};

const SignupPage_vue_vue_type_style_index_0_scoped_48597b6a_lang = '';

const _hoisted_1 = {
  class: "flex full-height signup-left-background"
};
const _hoisted_2 = {
  class: "flex full-height"
};
const _sfc_main = {
  __name: 'SignupPage',
  setup(__props) {
    const signupStore = useSignupStore();
    signupStore.reset();
    return (_ctx, _cache) => {
      return openBlock(), createBlock(DefaultAuthLayout, null, {
        default: withCtx(() => [createVNode(QPage, {
          id: "D1__signupPage"
        }, {
          default: withCtx(() => [createVNode(_sfc_main$b, {
            class: "window-height"
          }, {
            before: withCtx(() => [createBaseVNode("div", _hoisted_1, [createVNode(AlignCenterMiddleWrap, null, {
              default: withCtx(() => [createVNode(SignupFeaturesTitle), createVNode(QSpace, {
                class: "q-py-sm"
              }), createVNode(SignupCarousel), createVNode(QSpace, {
                class: "q-py-xl"
              })]),
              _: 1
            })])]),
            after: withCtx(() => [createBaseVNode("div", _hoisted_2, [createVNode(AlignCenterMiddleWrap, null, {
              default: withCtx(() => [createVNode(LogoNameBox), createVNode(QSpace, {
                class: "q-py-md q-mt-xs"
              }), createVNode(_sfc_main$d, {
                title: "Register"
              }), createVNode(QSpace, {
                class: "q-py-md q-mt-xs"
              }), createVNode(_sfc_main$1, null, {
                default: withCtx(() => [createVNode(_sfc_main$a), createVNode(_sfc_main$9), createVNode(_sfc_main$8), createVNode(_sfc_main$7), createVNode(_sfc_main$6), createVNode(QSpace, {
                  class: "q-pt-xs"
                }), createVNode(_sfc_main$4)]),
                _: 1
              }), createVNode(QSpace, {
                class: "q-py-md q-mt-xs"
              }), createVNode(GoBackLoginLink)]),
              _: 1
            })])]),
            _: 1
          })]),
          _: 1
        })]),
        _: 1
      });
    };
  }
};
const SignupPage = /*#__PURE__*/_export_sfc(_sfc_main, [['__scopeId', "data-v-48597b6a"]]);

export { SignupPage as default };
