��Root Mod By V1rus

Viewing: start.vue

<script setup lang="ts">
const {t, locale} = useI18n()
definePageMeta({
  title: 'Start',
  middleware: ['auth'],
})
useHead({
  title: t('Start')
})
const router = useRouter();
const direction = locale.value === 'en' ? 'ltr' : 'rtl';
let isChooseUnitModalOpen = ref(false);
const projectsDB = useLocalForage('projects')
const sheetsDB = useLocalForage('sheets')
const toast = useToast()
const localePath = useLocalePath()
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: '',
  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;
    }
  }
})

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

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

  if (!state.name) {
    return toast.add({title: t('Project name feild 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 navigateTo(localePath('/analyze/category'));
  } else if (type == 'settings') {
    state.loading_settings = true;
    return navigateTo(localePath('/setting'));
  } else if (type == 'dimensions') {
    state.loading_dimensions = true;
    return navigateTo(localePath('/analyze/dimensions'));
  }
}

</script>
<template>
  <div class="w-[95%] mx-auto  lg:w-10/12 min-h-[60vh] flex justify-center items-center">
    <div :dir="$i18n.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"
            :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' "
            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"
            :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"
            :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
            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('ChooseUnit') }}
                    </span>
        </UButton>
        <UModal v-model="isChooseUnitModalOpen" :dir="direction">
          <UCard :ui="{ ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }">
            <div class="modal-content-container p-2 px-4">
              <div class="w-full mb-8">
                <div class="mb-8 relative mx-auto w-full">
                  <h3>
                    {{ t('are_you_sure_of_the_dimensions_of_your_used_sheets') }}
                  </h3>
                </div>
                <div class="w-full px-3 flex justify-between">
                  <UButton color="green"
                           variant="solid"
                           :label="t('yes')"
                           icon="i-heroicons-check"
                           @click="handleClick('category')"
                  />

                  <UButton color="red"
                           variant="solid"
                           :label="t('no')"
                           icon="i-heroicons-x-mark-20-solid"
                           @click="handleCloseModalAndRedirect"
                  />
                </div>
              </div>
            </div>
          </UCard>
        </UModal>
      </div>
      <div class=" w-full flex flex-wrap justify-start items-center">
        <div :class="$i18n.locale == 'en' ? 'pr-2' : 'pl-2'" class=" w-6/12  ">
          <UButton
              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('SettingsStart') }}
                        </span>
          </UButton>
        </div>
        <div :class="$i18n.locale == 'en' ? 'pl-2' : 'pr-2'" class=" w-6/12  ">
          <UButton
              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('Dimensions') }}
                        </span>
          </UButton>
        </div>
      </div>
    </div>
  </div>
</template>
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
