��Root Mod By V1rus

Viewing: start.vue

<template>
  <div v-if="loading" class="flex items-center justify-center">
    <SharedLoading/>
  </div>
  <div v-else>
    <div class="w-[95%] mx-auto  lg:w-10/12 min-h-[60vh] flex justify-center items-center">
      <div :dir="locale == 'en' ? 'ltr' : 'rtl'"
           class=" w-full border rounded-xl gap-5   flex justify-start !pt-4 items-center flex-col border-black  p-2 h-[35rem]">
        <div class=" w-full flex flex-col justify-start items-start  ">
          <label class=" block text-sm text-right bold text-black mb-3">
            {{ t('project_name') }} :
          </label>
          <UInput
              v-model="state.name"
              variant="outline"
              class="w-full"
              id="1"
              @keydown="handleKeyDown"
              :inputClass="' w-full !h-10 bg-gray-50 !shadow-none focus:ring-1 rounded-lg focus:ring-orange-600  py-0 text-xs' "
          />
        </div>
        <div class=" w-full flex flex-col justify-start items-start  ">
          <label class=" block text-sm text-right bold text-black mb-3">
            {{ t('Width Strip') }} :
          </label>
          <USelect
              :options="width_strip"
              option-attribute="name"
              class="w-full"
              :selectClass="'  w-full !h-10 bg-gray-50 !shadow-none focus:ring-1 rounded-lg focus:ring-orange-600  py-0 text-xs' "
              id="2"
              @keydown="handleKeyDown"
              v-model="state.width_strip"
          />
        </div>
        <div class=" w-full flex flex-col justify-start items-start  ">
          <label class=" block text-sm text-right bold text-black mb-3">
            {{ t('Thickness Strip') }} :
          </label>
          <USelect
              :options="height_strip"
              option-attribute="name"
              class="w-full"
              id="3"
              @keydown="handleKeyDown"
              :selectClass="'  w-full !h-10 bg-gray-50 !shadow-none focus:ring-1 rounded-lg focus:ring-orange-600  py-0 text-xs' "
              v-model="state.height_strip"
          />
        </div>
        <div class=" w-full flex flex-col justify-start items-start  ">
          <label class=" block text-sm text-right bold text-black mb-3">
            {{ t('description') }} :

          </label>
          <UTextarea
              v-model="state.description"
              variant="outline"
              :rows="4"
              class="w-full"
              @keydown="handleKeyDown"
              id="4"
              :textareaClass="'py-2 bg-gray-50 !shadow-none focus:ring-1 rounded-lg focus:ring-orange-600 text-xs' "
          />
        </div>
        <div class=" w-full  ">
          <UButton
              id="5"
              @keydown="handleKeyDown"
              square
              :loading="state.loading_category"
              @click="isChooseUnitModalOpen = true"
              class="w-full flex px-2 h-10  text-black rounded-lg hover:bg-yellow-500 bg-[#f7941d] items-center justify-center">
                    <span class=" block  px-2  text-sm    ">
                        {{ t('choose_unit') }}
                    </span>
          </UButton>
          <SharedConfirmationDialog :toggle-show-up="isChooseUnitModalOpen"
                                    :message="t('are_you_sure_of_the_dimensions_of_your_used_sheets')"
                                    @on-closed="closeConfirmationAndRedirectToDimensionsRegistrationPage"
                                    @on-confirmed="handleClick('category')"
          />
        </div>
        <div class=" w-full flex flex-wrap justify-start items-center">
          <div :class="locale == 'en' ? 'pr-2' : 'pl-2'" class=" w-6/12  ">
            <UButton
                id="6"
                @keydown="handleKeyDown"
                square
                :loading="state.loading_settings"
                @click="handleClick('settings')"
                class="w-full flex px-2 h-9  text-black rounded-lg hover:bg-gray-300  bg-gray-200 items-center justify-center">
            <span class="block px-2 text-sm">
              {{ t('advanced_settings') }}
            </span>
            </UButton>
          </div>
          <div :class="locale == 'en' ? 'pl-2' : 'pr-2'" class="w-6/12">
            <UButton
                id="7"
                @keydown="handleKeyDown"
                square
                :loading="state.loading_dimensions"
                @click="handleClick('dimensions')"
                class="w-full flex px-2 h-9  text-black rounded-lg hover:bg-gray-300 bg-gray-200 items-center justify-center">
                        <span class=" block  px-2  text-sm    ">
                            {{ t('usable_sheets_dimensions') }}
                        </span>
            </UButton>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
const {t, locale} = useI18n();

definePageMeta({
  title: 'start',
  middleware: ['auth'],
});

useHead({
  title: t('new_analysis')
});
const router = useRouter();
let isChooseUnitModalOpen = ref(false);
const projectsDB = useLocalForage('projects')
const sheetsDB = useLocalForage('sheets')
const toast = useToast()
const localePath = useLocalePath()
let loading = ref(true);
const height_strip = [{
  name: t('Single'),
  value: 'single'
}, {
  name: t('Double'),
  value: 'double'
}
]
const width_strip = [{
  name: t('1 Mile'),
  value: '1'
}, {
  name: t('2 Mile'),
  value: '2'
}]

const state = reactive({
  loading_category: false,
  loading_settings: false,
  loading_dimensions: false,
  name: t('project_1'),
  width_strip: '1',
  height_strip: 'single',
  description: '',
})
onMounted(async () => {
  const item: any = await projectsDB.getItem('new')
  if (item) {
    const res = await JSON.parse(item);
    if (res) {
      state.name = res.name;
      state.description = res.description;
      state.height_strip = res.height_strip;
      state.width_strip = res.width_strip;
    }
  }

  loading.value = false;
})

const closeConfirmationAndRedirectToDimensionsRegistrationPage = () => {
  isChooseUnitModalOpen.value = false;
  router.push("/analyze/dimensions");
}

const handleClick = async (type: any) => {

  if (!state.name) {
    return toast.add({title: t('Project name field is required'), color: "orange"})
  }

  await projectsDB.setItem('new', JSON.stringify({
    name: state.name,
    description: state.description,
    width_strip: state.width_strip,
    height_strip: state.height_strip
  }));

  if (type == 'category') {
    const sheet: any = await sheetsDB.getItem('new')
    if (!sheet) {
      return toast.add({
        title: t('First, complete the section on the dimensions of the sheets to be used'),
        color: "orange"
      })
    }
    state.loading_category = true;

    return window.location.href = locale.value == 'en' ? '/en/analyze/category' : window.location.href = '/analyze/category';

  } else if (type == 'settings') {
    state.loading_settings = true;
    return navigateTo(localePath('/settings'));
  } else if (type == 'dimensions') {
    state.loading_dimensions = true;
    return navigateTo(localePath('/analyze/dimensions'));
  }
}

let validateKeys = (keyCode: string) => {
  return [
    'ArrowUp',
    'ArrowLeft',
    'ArrowRight',
    'ArrowDown',
  ].includes(keyCode);
}


const handleKeyDown = (event: any) => {
  if (event.target.tagName == 'SELECT' && validateKeys(event.code)) {
    event.preventDefault();
  }

  if (validateKeys(event.code)) {
    let id = parseInt(event.target.id);
    let target;

    switch (event.code) {
      case 'ArrowUp':
      case 'ArrowRight':
        if (id > 1) target = id - 1;
        else return;
        break;
      case 'ArrowDown':
      case 'ArrowLeft':
        if (id < 7) target = id + 1;
        else return;
        break;
      default:
    }

    let element = document.getElementById(target.toString());

    element?.focus();
  }


}

</script>
User / IP	: 216.73.217.78
Host / Server	: 195.214.235.115 / npln.ir
System	: Linux damavand.pws-dns.net 5.14.0-503.35.1.el9_5.x86_64 #1 SMP PREEMPT_DYNAMIC Fri Apr 4 05:23:43 EDT 2025 x86_64
���Root Mod By V1rus_Alfa

Viewing: start.vue

��Root Mod By V1rus_Alfa
