��Root Mod By V1rus

Viewing: list.vue

<script setup lang="ts">  
// import modules
import { useMainStore } from '~/stores/index';  
// const I18n
const { locale } = useI18n()
const { t } = useI18n()   
// set Meta
definePageMeta({
    title:"Unit Analysis List",
    layout: 'with-out-footer',
    middleware: ['auth'], 
})   
useHead ({
    title: t('Unit Analysis List')  
}) 
// set const global 
const localePath = useLocalePath()
const token = useCookie('token');  
const toast = useToast()
const MainStore = useMainStore() 
const config = useRuntimeConfig();
const isOpen = ref(false);  
const hasvar_1 = ref(false);  
const hasvar_2 = ref(false);  
const loadingEdit = ref(false);  
const loadingPageNext = ref(false);  
const loadingPagepre = ref(false);   
const type = [{
    name: t('Free'),
    value: '0'
  }, {
    name: t('Strip'),
    value: '1' 
  }, {
    name: t('Farsi') ,
    value: '2'
  }, {
    name: t('Groove') ,
    value: '3'
  }
] 
const state = reactive({
    attach_id: undefined,
    length: undefined,
    width: undefined,
    var_1: undefined,
    var_2: undefined,
    count: undefined,
    label: undefined,
    length_one: 1,
    length_two: 1,
    width_one: 1,
    width_two: 1,
    material_id: 1,
    page: 1,
}) 
const requestParams = computed(() => {
  return { 
    page: state.page, 
  };
});
// Fetch List
const { data, pending, error, refresh } = await useAPI('/analyze/list/get', { 
        query: requestParams, 
        immediate: true, 
        server: true, 
        transform: (mountains:any) => {  
          if(0 < JSON.parse(mountains).data.list.data.length){  
              return JSON.parse(mountains).data;  
          }else{
              navigateTo(localePath('/')); 
              return toast.add({ title: t('currently active project') ,color:"orange"})
          }  
        },
        onResponse({ request, response, options }) {
            loadingPageNext.value=false;
            loadingPagepre.value=false;
        }  
  })  

// Methods
const handelPage = (type:any) => { 
  if(type == 'increment'){ 
    loadingPageNext.value=true;
    state.page = state.page + 1 
    refresh();
  }else if( state.page != 1 ){
    loadingPagepre.value=true;
    state.page = state.page - 1
    refresh();
  }
}
const ToggleCollapse = (id:number) => {
  document.querySelector('#body_collapse_'+id)!.classList.toggle('hidden');  
  document.querySelector('#header_collapse_'+id)!.classList.toggle(locale.value == 'en' ? '-rotate-90' : 'rotate-90');   
}
const ToggleModal = (obj:any) => {   
  state.attach_id =obj['id'];
  state.label =obj['label'];
  state.width =obj['width'];
  state.length =obj['length'];
  state.var_1 =obj['var_1'];
  state.var_2 =obj['var_2'];
  state.count =obj['count'];
  state.length_one =obj['length_one'];
  state.length_two =obj['length_two'];
  state.width_one =obj['width_one'];
  state.width_two =obj['width_two'];
  state.material_id =obj['material_id'];
  isOpen.value  = true;
  if(obj['var_1'] && obj['var_1'] != 0){
    hasvar_1.value  = true;
  }
  if(obj['var_2'] && obj['var_2'] != 0){
    hasvar_2.value  = true;
  }
} 
// EditAttach request 
async function EditAttach () { 
    if(!state.width){ return toast.add({ title: t('Length_Alert') ,color:"orange"})}
    if(!state.count ){ return toast.add({ title: t('Number_Alert') ,color:"orange"})}
    if(!state.length ){ return toast.add({ title: t('Width_Alert') ,color:"orange"})}
    if(!state.material_id ){ return toast.add({ title: t('Material_Alert') ,color:"orange"})}
    if(!state.attach_id ){ return toast.add({ title: t('desired_Alert') ,color:"orange"})}
    loadingEdit.value=true;
    await useFetch(config.public.API_URL+'/analyze/list/edit-attach', {
        method: 'POST',
        body: {
            attach_id:state.attach_id,
            label:state.label,
            width:state.width,
            length:state.length,
            var_1:state.var_1,
            var_2:state.var_2,
            count:state.count,
            length_one:state.length_one,
            length_two:state.length_two,
            width_one:state.width_one, 
            width_two:state.width_two,
            material_id:state.material_id,
        } ,
        onRequest({ request, options }) { 
            options.headers =   {};
            options.headers.Accept = 'application/json'
            options.headers.authorization = 'Bearer '+token.value
        }, 
        onResponseError({ request, response, options }) {  
            if(response.status  == 401){
              navigateTo(localePath('/login')); 
            } 
        },
        onResponse({ request, response, options }) {
            if(response.status  == 422){ 
                return toast.add({ title: response._data.message ,color:"orange"})
            }  
        } 
    }) 
    loadingEdit.value=false;
    isOpen.value=false;
    refresh(); 
} 
// Delete request 
async function handelAllDelete () { 
  Delete(0,'list')
}
async function Delete (id:any,type:any) {  
    loadingEdit.value=true;
    await useAPI( '/analyze/list/delete', {
        method: 'POST',
        body: {
            ids:id,
            type:type, 
        }, 
        immediate: true, 
        server: true   
    }) 
    loadingEdit.value=false; 
    refresh(); 
}
</script>
<template> 
    <div class="  "> 
        <UModal   v-model="isOpen" class=" !top-0"> 
              <div :dir="$i18n.locale == 'en' ? 'ltr' : 'rtl'" class=" flex justify-between items-center p-2">
                  <span class=" block bold text-xs truncate !top-0 !bottom-auto !justify-start ">
                        {{ t('Edit the piece') }}
                  </span>
                  <UButton color="gray" variant="ghost" icon="i-heroicons-x-mark-20-solid" class="-my-1" @click="isOpen = false" />
              </div> 
              <div :dir="$i18n.locale == 'en' ? 'ltr' : 'rtl'" class="  h-96  mb-6 mt-3 px-4 pt-3   max-h-full overflow-y-auto " > 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500 bg-white  text-xs "> 
                        {{ t('Length') }}
                        </label> 
                        <div class="w-8/12">
                          <UInput
                          :loading="false"  
                          variant="outline" 
                          :inputClass="' w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7 pl-2 py-0 text-xs' "  
                          v-on:keypress="MainStore.NumbersOnly"
                          v-model="state.length" 
                          />
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs  ">
                            {{ t('Width') }}
                        </label> 
                        <div class="w-8/12">
                          <UInput
                          :loading="false"  
                          variant="outline" 
                          :inputClass="'  w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7 pl-2 py-0 text-xs' "  
                          v-on:keypress="MainStore.NumbersOnly"
                          v-model="state.width"   
                          />
                        </div>
                  </div> 
                  <template v-if="hasvar_1 == true"> 
                    <div class=" flex justify-start items-center w-full mb-3">
                          <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                            {{ t('Variable One') }}
                          </label> 
                          <div class="w-8/12">
                            <UInput
                            :loading="false"  
                            variant="outline" 
                            :inputClass="'  w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7 pl-2 py-0 text-xs' "  
                            v-on:keypress="MainStore.NumbersOnly"
                            v-model="state.var_1"   
                            />
                          </div>
                    </div> 
                  </template>
                  <template v-if="hasvar_2 == true"> 
                    <div class=" flex justify-start items-center w-full mb-3">
                          <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                            {{ t('Variable Two') }}
                          </label> 
                          <div class="w-8/12">
                            <UInput
                            :loading="false"  
                            variant="outline" 
                            :inputClass="'  w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7 pl-2 py-0 text-xs' "  
                            v-on:keypress="MainStore.NumbersOnly"
                            v-model="state.var_2"   
                            />
                          </div>
                    </div> 
                  </template>
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                            {{ t('count') }}
                        </label> 
                        <div class="w-8/12">
                          <UInput
                          :loading="false"  
                          variant="outline" 
                          :inputClass="' w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7 pl-2 py-0 text-xs' "  
                          v-on:keypress="MainStore.NumbersOnly"
                          v-model="state.count"    
                          />
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                           {{ t('Name') }}
                        </label> 
                        <div class="w-8/12">
                          <UInput  
                          :loading="false"  
                          variant="outline" 
                          :inputClass="' w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7 pl-2 py-0 text-xs' "  
                          v-model="state.label"    
                          />
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                           {{ t('Material') }}
                        </label> 
                        <div class="w-8/12">
                          <USelect 
                            :options="data.materials"
                            v-model="state.material_id" 
                            :option-attribute="$i18n.locale == 'en' ? 'title_en' : 'title'" 
                            valueAttribute="id" 
                            :selectClass="'w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7  py-0 text-xs' "  
                            /> 
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                           {{ t('Top') }}
                        </label> 
                        <div class="w-8/12">
                          <USelect 
                            :options="type" 
                            v-model="state.width_one"    
                            option-attribute="name"
                            :selectClass="'w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7  py-0 text-xs' "  
                            /> 
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                            {{ t('Down') }}
                        </label> 
                        <div class="w-8/12">
                          <USelect 
                            :options="type"
                            v-model="state.width_two"
                            option-attribute="name"
                            :selectClass="'w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7  py-0 text-xs' "  
                            /> 
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                           {{ t('Left') }}
                        </label> 
                        <div class="w-8/12">
                          <USelect 
                            :options="type"
                            v-model="state.length_one"
                            option-attribute="name"
                            :selectClass="'w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7  py-0 text-xs' "  
                            /> 
                        </div>
                  </div> 
                  <div class=" flex justify-start items-center w-full mb-3">
                        <label :class="$i18n.locale == 'en' ? ' text-left' : ' text-right'" class="block  w-3/12 text-gray-500  bg-white  text-xs ">
                           {{ t('Right') }}
                        </label> 
                        <div class="w-8/12">
                          <USelect 
                            :options="type"
                            v-model="state.length_two"
                            option-attribute="name"
                            :selectClass="'w-full !shadow-none focus:ring-1 rounded-sm focus:ring-orange-600 h-7  py-0 text-xs' "  
                            /> 
                        </div>
                  </div> 
              </div>    
              <div class="  flex justify-around mb-2 items-center ">
                  <UButton  
                      @click="isOpen = false" 
                      square 
                      class="w-5/12 flex px-2 text-white rounded  bg-blue-700 items-center justify-center">  
                      <span class=" block  px-2  text-xs truncate  ">
                          {{ t('Cancel') }}
                      </span> 
                  </UButton>
                  <UButton  
                      square 
                      :loading="loadingEdit" 
                      @click="EditAttach()"
                      class="w-5/12 flex px-2 text-white rounded  bg-main-700 items-center justify-center">  
                      <span class=" block  px-2  text-xs truncate  ">
                           {{ t('payment_5') }}
                      </span> 
                  </UButton>
              </div>  
        </UModal> 
        <section class=" pt-1 mt-1 mb-10 relative"> 
            <ul>
              <li  class=" w-full border-b-2     " v-for="row in data.list.data" :key="row.id">
                <section  :dir="$i18n.locale == 'en' ? 'ltr' : 'rtl'"  class=" px-2 cursor-pointer flex justify-between items-center">
                    <div class=" flex justify-start items-center">
                      <div @click="ToggleCollapse(row.id)" class="h-20 w-20 "  >
                        <img :src="row.unit?.image_3_d && row.unit.image_3_d ? config.public.FILE_URL+row.unit.image_3_d.address : '/apple-touch-icon.png'" class="w-32 border h-full  mx-auto" alt="کات یونیکس | وب اپلیکیشن آنالیز یونیت" >
                      </div>
                      <label :class="$i18n.locale == 'en' ? 'ml-2 text-left' : 'mr-2 text-right'" v-text="row.name" @click="ToggleCollapse(row.id)" class=" block  pb-2   w-[10rem] truncate   text-main-700 cursor-pointer text-sm "> 
                      </label>  
                    </div>
                    <div class="flex justify-end items-center pb-2"> 
                      <ULink  
                          square 
                          :to="row.unit_id ? localePath('/unit/edit/'+row.id) : localePath('/unit/make/update/'+row.id)" 
                          class=" flex items-center !bg-white !text-red-600  !shadow-none hover:!bg-white justify-center">  
                          <UIcon  name="i-heroicons-pencil-square"  class="text-main-700  cursor-pointer ml-5 text-xl"  />
                      </ULink>
                      <ULink  
                          square 
                          :to="localePath('/unit/setting/'+row.id)"
                          class=" flex items-center !bg-white !text-red-600  !shadow-none hover:!bg-white justify-center">  
                          <UIcon  name="i-heroicons-cog-6-tooth"  class="text-green-600  cursor-pointer ml-4 text-xl"  />
                      </ULink>
                      <UButton  
                          square 
                          :loading="loadingEdit" 
                          @click="Delete([row.id],'list')"
                          class=" flex items-center !bg-white !text-red-600  !shadow-none hover:!bg-white justify-center">  
                          <UIcon  name="i-heroicons-trash"  class="text-red-600  cursor-pointer ml-2  text-xl"  />
                      </UButton>
                    
                      <UIcon @click="ToggleCollapse(row.id)" :id="'header_collapse_'+row.id"  name="i-heroicons-chevron-down-20-solid" :class="$i18n.locale == 'en' ? '-rotate-90' : 'rotate-90'" class="text-gray-500  transition-all  text-2xl"  /> 
                    </div>
                </section>
                <section :id="'body_collapse_'+row.id" class=" hidden  border-t transition-all" >
                  <div :dir="$i18n.locale == 'en' ? 'ltr' : 'rtl'" class="w-full border-b  h-7  flex   justify-between items-center"  v-for="slice in row.attach">
                    <div class=" cursor-pointer  w-[7%] h-full  flex justify-center items-center border-l"> 
                      <UButton  
                        square  
                        @click="Delete([slice.id],'attach')" 
                        class=" flex items-center !bg-white !text-red-600  !shadow-none hover:!bg-white justify-center">  
                        <UIcon  name="i-heroicons-trash"  class="text-red-600  cursor-pointer  text-sm"  />
                      </UButton> 
                    </div>
                    <div class=" cursor-pointer w-[7%] h-full  flex justify-center items-center border-l"> 
                      <UIcon @click="ToggleModal(slice)" name="i-heroicons-pencil-square"  class="text-green-600 text-sm"  />
                    </div>
                    <div class=" w-[22%]  h-full  flex justify-start items-center border-l">
                      <template v-if="(slice.label_en || slice.label)">
                        <span :class="$i18n.locale == 'en' ? 'ml-2 text-left' : 'mr-2 text-right'" v-text="$i18n.locale == 'en' ? slice.label_en : slice.label " class=" text-gray-500 pr-1  text-[.55rem] "> 
                        </span> 
                      </template>
                      <template v-else>
                        <span :class="$i18n.locale == 'en' ? 'ml-2 text-left' : 'mr-2 text-right'" v-text=" t('Custom Slice')" class=" text-gray-500 pr-1  text-[.55rem] "> 
                        </span> 
                      </template>
                    </div>
                    <div class=" w-[7%] flex justify-center items-center  h-full border-l">
                      <span class=" text-gray-500  text-[.55rem] "  v-text="slice.width_one == '1' ? 'N'  : slice.width_one == '2'  ? 'F' : slice.width_one == '3'  ? 'SH' : '-'" ></span> 
                    </div>
                    <div class=" w-[7%] flex justify-center items-center  h-full border-l">
                      <span class=" text-gray-500  text-[.55rem] "  v-text="slice.width_two == '1' ? 'N'  : slice.width_two == '2'  ? 'F' : slice.width_two == '3'  ? 'SH' : '-'"  ></span> 
                    </div>
                    <div class=" w-[7%] flex justify-center items-center  h-full border-l">
                      <span class=" text-gray-500  text-[.55rem] " v-text="slice.length_one == '1' ? 'N'  : slice.length_one == '2'  ? 'F' : slice.length_one == '3'  ? 'SH' : '-'" ></span> 
                    </div>
                    <div class=" w-[7%] flex justify-center items-center  h-full border-l">
                      <span class=" text-gray-500 text-[.55rem] "  v-text="slice.length_two == '1' ? 'N'  : slice.length_two == '2'  ? 'F' : slice.length_two == '3'  ? 'SH' : '-'" ></span> 
                    </div>
                    <div class=" w-[13%] flex justify-center items-center h-full border-l">
                      <span class=" text-gray-500  text-[.55rem] " v-html="slice.material ? $i18n.locale == 'en' ? slice.material.title_en : slice.material.title : '---'"> 
                      </span> 
                    </div>
                    <div :class="$i18n.locale == 'en' ? ' justify-start' : ' justify-end'" class=" w-[24%] flex   pl-1 items-center h-full">
                      <div dir="ltr"  class=" w-9/12 justify-start flex  items-center ">
                            <span  :class="!slice.var_1 ? 'w-4/12' : 'w-2/12'" class="block    text-gray-500  text-center text-[.6rem] ">
                             {{ slice.length }}
                            </span>
                            <span  :class="!slice.var_1 ? 'w-2/12' : 'w-1/12'" class="block     text-gray-500  text-center text-[.6rem] ">
                            *
                            </span>
                            <span :class="!slice.var_1 ? 'w-3/12' : 'w-2/12'" class="block    text-gray-500  text-center text-[.6rem] ">
                             {{ slice.width }}
                            </span>
                            <template v-if="slice.var_1 && slice.var_1 != 0"> 
                                <span class="block   w-1/12  text-gray-500  text-center text-[.6rem] ">
                                    *
                                </span>
                                <span class="block  w-2/12 text-gray-500  text-center text-[.6rem] ">
                                {{ slice.var_1 }}
                                </span>
                            </template>
                            <template v-if="slice.var_2 && slice.var_2 != 0"> 
                                <span class="block   w-1/12  text-gray-500  text-center text-[.6rem] ">
                                    *
                                </span>
                                <span class="block  w-2/12 text-gray-500  text-center text-[.6rem] ">
                                {{ slice.var_2 }}
                                </span>
                            </template>
                            <span class="block  w-1/12 text-gray-500   text-center text-[.6rem] ">
                            =
                            </span>
                            <span class="block  w-2/12 text-gray-500 text-center text-[.6rem] ">
                            {{ slice.count }}
                            </span>
                        </div>
                    </div>
                  </div>
                </section>
              </li>
              <li class=" mt-2">
                <ClientOnly>
                  <div class="flex  w-full flex-col items-center">
                      <div :class="(data.list.prev_page_url && data.list.next_page_url)? 'justify-between' : data.list.prev_page_url ? 'justify-start' : data.list.next_page_url ? 'justify-end' : 'justify-between'	"  class=" flex w-[95%]  items-center mt-2 xs:mt-0">
                        <!-- Buttons -->
                        <UButton :loading="loadingPagepre" v-if="data.list.prev_page_url	" @click="handelPage('decrement')" class="flex items-center justify-center px-3 h-8 text-sm   text-white bg-main-700 rounded    ">
                            <svg class="w-3.5 h-3.5 me-2 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
                              <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 5H1m0 0 4 4M1 5l4-4"/>
                            </svg>
                            {{ t('Prev') }}
                        </UButton>
                        <UButton :loading="loadingPageNext" v-if="data.list.next_page_url" @click="handelPage('increment')" type="button" class="flex items-center justify-center px-3 h-8 text-sm   text-white bg-main-700 border-0   rounded     "> 
                            {{ t('Next') }}
                            <svg class="w-3.5 h-3.5 ms-2 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 10">
                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 5h12m0 0L9 1m4 4L9 9"/>
                          </svg>
                        </UButton>
                      </div> 
                      <!-- Help text -->
                      <span class="text-sm text-gray-700  mt-2 " :dir="$i18n.locale == 'en' ? 'ltr' : 'rtl'"  >
                          {{ t('Showing') }} <span class=" bold text-gray-900 ">{{data.list.from}}</span> {{ t('to') }} <span class=" bold text-gray-900  ">{{data.list.to}}</span> {{ t('of') }} <span class=" bold text-gray-900  ">{{data.list.total}}</span> {{ t('Entries') }}
                      </span>
                    </div> 
                </ClientOnly>
              </li>
              <li class=" flex justify-center items-center mt-2"> 
                <UButton   
                  square  
                  @click="handelAllDelete"
                  :loading="loadingEdit" 
                  class=" flex items-center bg-red-700 text-white text-sm bold px-4   !shadow-none  justify-center rounded  ">  
                  حذف همه
                </UButton>  
              </li>
            </ul>   
        </section> 
        
        <UnitListFooter /> 
    </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: list.vue

��Root Mod By V1rus_Alfa
