1404/11/04- first

2026-01-24 17:45:54 +03:30
commit edf1824229
554 changed files with 59581 additions and 0 deletions
@@ -0,0 +1,119 @@
+<template>
+  <div>
+    <BasicShowContext title="لیست مدیران">
+      <BaseTable v-bind="tblProps" @register="submit" ref="tbl">
+        <template #extraHeader>
+          <BaseButton type="primary" size="small" class="flex" @click="emits('add')">
+            <div>افزودن مدیر</div>
+            <BaseIcon icon="vuesax-linear:user-add" Size="16px" />
+          </BaseButton>
+        </template>
+        <template #action="{ column, record }">
+          <div class="gap-2 flex justify-center">
+            <!--            <a-tooltip
+              :key="record.active"
+              placement="bottom"
+              class="cursor-pointer"
+              @click="changeUserActivationFunction(record.id)"
+            >
+              <template #title>
+                <span>{{ record.active ? 'غیرفعال کردن' : 'فعال کردن' }}</span>
+              </template>
+              <Icon
+                :icon="record.active ? 'vuesax-linear:tick-circle' : 'vuesax-linear:close-circle'"
+                :color="record.active ? '#54AD06' : '#ad0627'"
+              />
+            </a-tooltip>-->
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="emits('info', record)">
+              <template #title>
+                <span>مشخصات</span>
+              </template>
+              <Icon icon="vuesax-linear:stickynote" color="#10913A" />
+            </a-tooltip>
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="emits('edit', record)">
+              <template #title>
+                <span>ویرایش</span>
+              </template>
+              <Icon icon="vuesax-linear:edit" color="#4572E9" />
+            </a-tooltip>
+            <!--            <a-tooltip
+              placement="bottom"
+              class="cursor-pointer"
+              @click="emits('delete', record.id)"
+            >
+              <template #title>
+                <span>حذف</span>
+              </template>
+              <Icon icon="vuesax-linear:trash" color="#EB3535" />
+            </a-tooltip>-->
+          </div>
+        </template>
+      </BaseTable>
+    </BasicShowContext>
+  </div>
+</template>
+
+<script lang="tsx" setup>
+import type { TableInput } from '@core/type/baseTable'
+import useBaseTable from '@core/components/BaseTableOld/hooks/useBaseTable'
+import { toJalali, toJalaliNoTime } from '@core/utils/useDataTime'
+import { message, Tag } from 'ant-design-vue'
+import CustomTag from '@/components/CustomTag.vue'
+import Icon from '@core/components/BaseIcon/src/Icon.vue'
+import { changeUserActivation, getUserTable } from '@/api/user'
+import { useUserStore } from '@/store/userStore'
+import { cols } from '../hooks/usersColumns'
+import { changeCustomerActivation } from '@/api/customer'
+
+const [submit, reload] = useBaseTable()
+
+//emits
+const emits = defineEmits(['delete', 'edit', 'add', 'info'])
+
+//define table
+const table = ref(null)
+
+//permission
+function checkPermission(temp: string) {
+  const store = useUserStore()
+  return store.canAccess(temp)
+}
+
+const loading = ref<boolean>(false)
+
+async function changeUserActivationFunction(id: number) {
+  try {
+    loading.value = true
+    await changeUserActivation(id)
+    reload()
+    message.success('تغییر وضعیت با موفقیت انجام شد')
+  } catch (e) {
+    console.error(e)
+  } finally {
+    loading.value = false
+  }
+}
+
+const tblProps = ref<any>({
+  columns: cols,
+  api: (params: TableInput) => {
+    return getUserTable(params)
+  }
+  //bordered: true
+})
+
+const fetch = () => {
+  // console.log('sss')
+  reload()
+}
+// const spinTable = (val: boolean) => {
+//   // console.log('sss')
+//   table?.value?.loading.value = val
+// }
+defineExpose({
+  fetch
+  // spinTable
+})
+</script>
+
+<style scoped></style>
@@ -0,0 +1,141 @@
+import type { BaseTableColumn } from '@core/type/baseTable'
+import { toJalaliNoTime, toTime } from '@core/utils/useDataTime'
+import CustomTag from '@/components/CustomTag.vue'
+/*import BudgetSelect from '@/components/BudgetSelect.vue'
+import { useStaticApiListsStore } from '@/store/staticApisStore'
+import type { FilterSelect } from '@/model/filterSelect'
+import type { DocItem } from '@/model/docType'*/
+
+//define store
+//const store = useStaticApiListsStore()
+//document types
+/*let docTypes: DocItem[]*/
+/*onMounted(async () => {
+  docTypes = await store.readyDocTypeList()
+})
+const filteredDocTypes: FilterSelect = docTypes?.map((x: DocItem) => {
+  return {
+    label: x.title,
+    value: x.id
+  }
+})*/
+
+export const cols: BaseTableColumn[] = [
+  {
+    title: 'ردیف',
+    dataIndex: 'id',
+    key: 'id',
+    filterable: false,
+    sortable: false,
+    customRender: (record: any) => {
+      return record.index + 1
+    }
+  },
+  {
+    title: 'کد کاربری',
+    dataIndex: 'id',
+    key: 'id',
+    type: 'Number'
+    // className: 'column-money'
+  },
+  {
+    title: 'نام و نام خانوادگی',
+    dataIndex: 'name',
+    key: 'name',
+    type: 'Text'
+  },
+  {
+    title: 'شماره موبایل',
+    dataIndex: 'mobile',
+    key: 'mobile',
+    type: 'Number'
+  },
+  /*  {
+    title: 'وضعیت',
+    dataIndex: 'active',
+    key: 'active',
+    customRender: ({ record }) => {
+      return record.active ? (
+        <div class="flex justify-center">
+          <CustomTag textColor="#25855A" bgColor="#E3F4E9">
+            فعال
+          </CustomTag>
+        </div>
+      ) : (
+        <div class="flex justify-center">
+          <CustomTag textColor="#C53030" bgColor="#FECACA">
+            غیر فعال
+          </CustomTag>
+        </div>
+      )
+    }
+  },*/
+  /*{
+      title: 'سمت',
+      dataIndex: 'post_user',
+      key: 'post_user',
+      type: 'Text'
+    },
+    {
+      title: 'نقش',
+      dataIndex: 'user_type_record',
+      key: 'user_type_record',
+      type: 'Select',
+      filterable: false,
+      sortable: false,
+      filterComponentProps: {
+        multiple: true
+      },
+      filterField: 'user_type_obj.id',
+      filterComponent: ReadyUserTypeSelect,
+      /!*      customRender: (record: any) => {
+        return record.record.user_type_record?.value
+      }*!/
+      customRender: ({ record }) => {
+        const items = record.is_admin ? (
+          <CustomTag textColor="#25855A" bgColor="#E3F4E9">
+            ادمین
+          </CustomTag>
+        ) : (
+          record.user_type_obj.map((item: { title: any }, index: any) => {
+            if (item) {
+              return (
+                <CustomTag textColor="#25855A" bgColor="#E3F4E9">
+                  {item?.title}
+                </CustomTag>
+              )
+            }
+          })
+        )
+        return <div class="flex justify-center items-center gap-2">{items}</div>
+      }
+    },
+    {
+      title: 'حوزه',
+      dataIndex: 'section',
+      key: 'section'
+    },
+    {
+      title: 'شماره موبایل',
+      dataIndex: 'mobile',
+      type: 'Number',
+      key: 'mobile'
+    },
+    {
+      title: 'تاریخ ثبت',
+      dataIndex: 'created_at',
+      key: 'created_at',
+      type: 'DateTime',
+      customRender: (record: any) => {
+        return toJalaliNoTime(record.record.created_at)
+      }
+    },*/
+  {
+    title: 'عملیات',
+    dataIndex: 'action',
+    key: 'action',
+    slot: 'action',
+    fixed: 'right',
+    filterable: false
+  }
+]
@@ -0,0 +1,255 @@
+<template>
+  <div>
+    <!--    <BasicMainCard>-->
+    <div class="flex w-full h-full">
+      <tbl ref="table" class="w-full h-full" @info="info" @edit="edit" @add="add" />
+
+      <!--        <BasicMenu :menu="menu" width="13rem" @onChange="tabSelected" />
+        <component :is="selectedComponent" class="mr-5" />-->
+      <!--        <BasicShowContext title="پروژه ها"> <Search /> </BasicShowContext>-->
+    </div>
+    <!--    </BasicMainCard>-->
+    <BasicModal
+      v-model:visible="addUserVisible"
+      width="40rem"
+      :title="`${editId ? 'ویرایش' : 'افزودن'} کاربر`"
+      @ok="ok"
+      :loading="loading"
+      @close="addUserVisible = false"
+    >
+      <a-form :model="form" ref="formRef" autocomplete="off">
+        <div class="grid md:grid-cols-2 gap-4">
+          <a-form-item label="نام" name="fname" :rules="inputRules()">
+            <BasicInput v-model:value="form.fname" />
+          </a-form-item>
+          <a-form-item label="نام خانوادگی" name="lname" :rules="inputRules()">
+            <BasicInput v-model:value="form.lname" />
+          </a-form-item>
+          <a-form-item label="شماره همراه" name="mobile" :rules="inputLenRules(11)">
+            <BasicInput v-model:value="form.mobile" type="number" />
+          </a-form-item>
+          <a-form-item v-if="editId" label="رمز عبور" name="password">
+            <BasicInput v-model:value="form.password" is-password type="number" />
+          </a-form-item>
+          <a-form-item v-if="editId" label="تکرار رمز عبور">
+            <BasicInput v-model:value="form.repassword" is-password type="number" />
+          </a-form-item>
+          <a-form-item v-if="editId" label="ارسال پیامک">
+            <a-switch v-model:checked="form.send_sms" >
+              <template #checkedChildren>فعال</template>
+              <template #unCheckedChildren>غیر فعال</template>
+            </a-switch>
+          </a-form-item>
+        </div>
+      </a-form>
+    </BasicModal>
+    <!--    <BasicInfoModal
+      v-model:visible="userInfoVisible"
+      @close="userInfoVisible = false"
+      :title="infoParams.title"
+      :date="infoParams.date"
+      :time="infoParams.time"
+      :type="infoParams.type"
+      itemsTitle="اطلاعات فردی"
+      :name="infoParams.name"
+      :items="infoParams.items"
+    />-->
+  </div>
+</template>
+
+<script setup lang="ts">
+// import BasicInfoModal from '@/components/BasicInfoModal'
+import { inputLenRules, inputRules } from '@/utils/inputRules'
+import { useStaticApiListsStore } from '@/store/staticApisStore'
+import type { Const } from '@/model/const'
+import type { User } from '@/model/user'
+import { createUser, deleteUser, updateUser } from '@/api/user'
+import { ref } from 'vue'
+import tbl from './components/table.vue'
+import type { FormInstance } from 'ant-design-vue'
+import BasicInfoModal from '@/components/BasicInfoModal/index.vue'
+import { message } from 'ant-design-vue/es'
+import type { Info } from '@/components/BasicInfoModal/model/Info'
+import { toJalaliNoTime, toTime } from '@core/utils/useDataTime'
+import { confirmDeleteItem } from '@/utils/confirmModal'
+import { cloneDeep } from 'lodash'
+import type { Item } from '@/model/Item'
+
+//loading
+const loading = ref<boolean>(false)
+
+//define store
+const store = useStaticApiListsStore()
+
+//define tbl
+const table = ref(null)
+const refreshTable = () => table?.value?.fetch()
+
+let updateKey = ref<number>(0)
+
+//role confirm items
+const confirmItems: Array<Item> = [
+  {
+    value: 'بله',
+    key: true
+  },
+  {
+    value: 'خیر',
+    key: false
+  }
+]
+
+//form
+const form = ref<User>({
+  active: true
+})
+const formRef = ref<FormInstance>()
+
+//info
+let infoParams = reactive<Info>({})
+
+function info(val: User) {
+  infoParams.name = val.name
+  infoParams.type = val.mobile
+  infoParams.date = toJalaliNoTime(val.created_at)
+  infoParams.time = toTime(val.created_at)
+  infoParams.itemsTitle = 'اطلاعات کاربری'
+  infoParams.items = [
+    {
+      key: 'تلفن همراه',
+      value: val.mobile ?? '-'
+    },
+    {
+      key: 'کد کاربری',
+      value: val.id ?? '-'
+    }
+  ]
+  userInfoVisible.value = true
+}
+
+//edit
+let editId: number | undefined = undefined
+
+async function edit(record: User) {
+  addUserVisible.value = true
+  editId = record.id
+  form.value = cloneDeep(record)
+}
+
+//add
+async function add() {
+  loading.value = true
+  editId = undefined
+  // await store.getUsersList()
+  addUserVisible.value = true
+  updateKey.value++
+  resetData()
+  loading.value = false
+}
+
+//reset data
+const resetData = () => {
+  formRef.value?.resetFields()
+  form.value = {
+    fname: '',
+    lname: '',
+    active: false,
+    avatar_id: undefined,
+    sts: undefined,
+    id: undefined,
+    mobile: undefined
+  }
+}
+
+//delete
+const deleteItem = (id: number) => confirmDeleteItem('کاربر', id, deleteUser, refreshTable)
+
+/*  Modal.confirm({
+  title: 'آیا از حذف کاربر اطمینان دارید؟',
+  icon: createVNode(ExclamationCircleOutlined),
+  okText: 'تایید',
+  okType: 'danger',
+  centered: true,
+  cancelText: 'انصراف',
+  async onOk() {
+    // console.log('OK');
+    await deleteItem(id)
+  },
+  onCancel() {
+    console.log('Cancel')
+  }
+})*/
+
+/*async function deleteItem(id: number) {
+  try {
+    loading.value = true
+    // table?.value?.spinTable(true)
+    await deleteUser(id)
+    message.success('با موفقیت حذف شد')
+    table?.value?.fetch()
+  } catch (e) {
+    console.log(e)
+    message.error('خطا در حذف')
+  } finally {
+    loading.value = false
+    // table?.value?.spinTable(false)
+  }
+}*/
+
+//define selects
+onMounted(async () => {
+  loading.value = true
+  // await getResponsible()
+  // await getQC()
+  // await getManager()
+  loading.value = false
+})
+
+interface selectsItem {
+  responsibleItems: Array<User> | undefined
+  users: Array<Const> | undefined
+}
+
+//add project modal
+const addUserVisible = ref<boolean>(false)
+const userInfoVisible = ref<boolean>(false)
+
+//submit user
+async function ok() {
+  formRef.value?.validateFields().then(async () => {
+    // console.log('salam', form.value)
+    // return
+    loading.value = true
+    try {
+      if (editId) {
+        if (form.value.password) {
+          if (form.value.password === form.value.repassword) {
+            await updateUser(editId, form.value)
+          } else {
+            message.error('پسورد وارد شده با تکرار پسورد وارد شده یکسان نیست')
+            return
+          }
+        } else {
+          await updateUser(editId, form.value)
+        }
+      } else {
+        await createUser(form.value)
+      }
+      addUserVisible.value = false
+      refreshTable()
+      resetData()
+      message.success('عملیات با موفقیت انجام شد')
+      // await getResponsible()
+      // await getQC()
+      // await getManager()
+    } catch (e) {
+      console.error(e)
+      // message.error('خطا در بارگذاری اطلاعات')
+    } finally {
+      loading.value = false
+    }
+  })
+}
+</script>
+
+<style scoped></style>
@@ -0,0 +1,69 @@
+<svg width="299" height="331" viewBox="0 0 299 331" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.20561 15.7673C1.88291 15.7673 0 17.6502 0 19.9729V292.811C32.2359 284.941 68.9177 280.321 110.014 280.321C166.49 280.321 213.449 285.875 252.336 295.013V19.9729C252.336 17.6502 250.453 15.7673 248.131 15.7673H4.20561Z" fill="url(#paint0_linear_220_20208)"/>
+<rect x="15.772" y="31.5352" width="220.794" height="277.518" rx="4.20561" fill="url(#paint1_linear_220_20208)"/>
+<rect x="30.8423" y="53.262" width="189.252" height="122.991" fill="url(#paint2_linear_220_20208)"/>
+<rect x="31.541" y="195.523" width="189.252" height="18.9217" fill="#F6F6F4"/>
+<rect x="31.541" y="239.674" width="189.252" height="18.9217" fill="#F6F6F4"/>
+<rect x="53.6221" y="12.6143" width="145.093" height="25.2289" fill="#D8DDE2"/>
+<path d="M91.9618 0H160.377L170.328 12.6144H82.0107L91.9618 0Z" fill="#D0D6DC"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M172.67 201.831C176.495 201.921 179.989 199.721 181.492 196.278C182.996 192.833 182.204 188.841 179.495 186.197L155.609 162.745C151.953 159.166 146.025 159.166 142.37 162.745C138.714 166.324 138.714 172.128 142.37 175.707L166.323 199.092C167.998 200.774 170.272 201.755 172.67 201.831Z" fill="#209487"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M83.3257 166.413C67.9334 151.103 65.7138 127.268 78.0229 109.479C90.3321 91.6904 113.744 84.8976 133.949 93.2538C154.153 101.61 165.525 122.789 161.113 143.845C156.701 164.9 137.734 179.972 115.806 179.846C103.59 179.769 91.9058 174.936 83.3257 166.413Z" fill="#209487"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M89.4232 108.715C74.8842 122.991 74.8978 146.115 89.4535 160.374C104.009 174.633 127.6 174.633 142.155 160.374C156.71 146.115 156.724 122.991 142.185 108.715C127.607 94.4529 104.001 94.4529 89.4232 108.715Z" fill="white"/>
+<mask id="mask0_220_20208" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="78" y="98" width="76" height="74">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M89.4232 108.715C74.8842 122.991 74.8978 146.115 89.4535 160.374C104.009 174.633 127.6 174.633 142.155 160.374C156.71 146.115 156.724 122.991 142.185 108.715C127.607 94.4529 104.001 94.4529 89.4232 108.715Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_220_20208)">
+<path d="M149.593 107.996C149.593 143.426 132.334 170.792 107.652 186.247C82.9699 201.701 153.051 176.252 153.051 176.252L166.9 127.492C166.9 127.492 149.593 72.5672 149.593 107.996Z" fill="url(#paint3_linear_220_20208)"/>
+</g>
+<path d="M226.293 307.813L280.051 328.823L292.397 311.161L238.311 298.583L226.293 307.813Z" fill="url(#paint4_linear_220_20208)"/>
+<path d="M223.369 217.847L260.302 220.759L252.1 301.094C252.1 301.094 251.382 301.897 249.639 301.585C247.897 301.273 246.069 300.304 246.069 300.304L240.576 236.439C240.576 236.439 237.399 259.022 237.621 265.375C237.788 270.162 239.425 276.001 240.301 280.996C241.055 285.295 242.641 295.568 242.641 295.568C242.641 295.568 240.767 296.424 239.77 296.617C238.773 296.811 237.495 295.748 237.495 295.748C237.495 295.748 224.546 270.611 224.38 265.838C224.213 261.064 223.369 217.847 223.369 217.847Z" fill="url(#paint5_linear_220_20208)"/>
+<path d="M236.92 295.63C236.92 295.63 235.275 298.592 233.232 300.398C231.188 302.204 227.156 304.36 226.237 305.34C225.317 306.32 226.321 307.763 226.321 307.763L236.204 307.418L244.101 300.738L242.998 294.371L236.92 295.63Z" fill="#209487"/>
+<path d="M253.03 299.06L255.337 305.459C255.337 305.459 251.548 308.393 246.313 309.21C241.078 310.027 237.471 308.772 237.471 308.772C237.471 308.772 236.526 306.868 238.307 306.054C239.125 305.68 240.959 304.126 242.569 302.136C243.296 301.238 246.034 299.304 246.034 299.304L253.03 299.06Z" fill="#209487"/>
+<path d="M269.573 175.965C269.573 175.965 272.6 180.57 274.457 179.338C276.313 178.106 287.9 166.229 287.9 166.229C287.9 166.229 291.347 163.575 291.985 164.206C292.622 164.837 290.835 166.229 290.835 166.229C290.835 166.229 294.596 166.598 295.772 166.598C296.947 166.598 299.419 168.475 297.803 169.106C296.186 169.738 289.916 169.894 289.916 169.894C289.916 169.894 280.396 187.896 275.435 189.173C270.475 190.449 263.64 183.23 263.64 183.23L269.573 175.965Z" fill="#F6F6F4"/>
+<path d="M221.208 176.294C221.208 176.294 219.223 180.358 217.424 179.383C215.626 178.408 205.534 167.766 205.534 167.766C205.534 167.766 202.174 165.708 201.352 166.078C200.53 166.448 202.556 167.766 202.556 167.766C202.556 167.766 197.612 168.167 196.681 168.541C195.751 168.915 194.668 170.061 196.074 170.582C197.481 171.104 202.864 171.474 202.864 171.474C202.864 171.474 210.348 186.263 216.018 187.992C221.688 189.721 226.518 182.908 226.518 182.908L221.208 176.294Z" fill="#F6F6F4"/>
+<path d="M239.566 163.848V156.583C239.566 156.583 235.799 156.773 234.268 154.251C232.737 151.728 232.323 144.57 232.323 144.57L233.477 141.251L244.824 140.771L250.785 145.851L248.009 150.753L247.48 151.695L250.125 162.836L239.566 163.848Z" fill="#F6F6F4"/>
+<mask id="mask1_220_20208" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="232" y="140" width="19" height="24">
+<path d="M239.566 163.848V156.583C239.566 156.583 235.799 156.773 234.268 154.251C232.737 151.728 232.323 144.57 232.323 144.57L233.477 141.251L244.824 140.771L250.785 145.851L248.009 150.753L247.48 151.695L250.125 162.836L239.566 163.848Z" fill="white"/>
+</mask>
+<g mask="url(#mask1_220_20208)">
+<path d="M246.947 149.681C243.594 153.851 237.794 156.766 237.039 156.766C236.284 156.766 241.256 161.996 241.256 161.996L245.301 163.851L251.043 162.634L253.093 156.766L249.474 150.108C249.474 150.108 250.3 145.51 246.947 149.681Z" fill="url(#paint6_linear_220_20208)"/>
+</g>
+<path d="M218.796 179.214L224.372 186.725L227.928 182.969C227.928 182.969 225.223 197.799 224.372 204.911C223.52 212.023 223.362 219.107 223.362 219.107C223.362 219.107 232.29 222.422 238.946 222.979C245.602 223.537 261.096 222.101 261.096 222.101L259.096 180.358L264.899 185.745L271.713 177.877C271.713 177.877 259.983 159.852 257.765 158.801C255.547 157.751 249.381 158.801 249.381 158.801C249.381 158.801 245.005 163.98 243.231 164.052C241.457 164.124 237.521 158.801 237.521 158.801C237.521 158.801 231.233 157.797 229.404 159.852C227.576 161.906 218.796 179.214 218.796 179.214Z" fill="url(#paint7_linear_220_20208)"/>
+<path d="M232.323 144.65C232.323 144.65 233.66 141.276 235.405 141.864C237.057 142.42 238.488 143.744 240.543 144.365C242.598 144.987 242.825 142.195 244.222 142.666C245.618 143.138 244.697 147.245 245.681 148.01C246.665 148.775 246.665 142.666 248.764 144.311C250.862 145.955 246.574 150.584 246.574 150.584C246.574 150.584 247.124 153.428 247.3 153.622C247.476 153.815 247.456 151.552 247.456 151.552C247.456 151.552 249.46 150.783 250.314 147.313C251.168 143.844 251.538 142.462 250.314 139.941C249.091 137.42 248.742 135.446 245.681 134.256C242.619 133.067 240.296 133.532 238.157 134.256C236.017 134.981 234.466 136.419 233.476 137.851C231.169 141.25 232.323 144.65 232.323 144.65Z" fill="#209487"/>
+<defs>
+<linearGradient id="paint0_linear_220_20208" x1="167.995" y1="274.038" x2="167.995" y2="190.603" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F7F7F7"/>
+<stop offset="1" stop-color="#E8EAEB"/>
+</linearGradient>
+<linearGradient id="paint1_linear_220_20208" x1="15.772" y1="31.5352" x2="15.772" y2="309.053" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="0.746404" stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.697577"/>
+</linearGradient>
+<linearGradient id="paint2_linear_220_20208" x1="30.8423" y1="53.262" x2="30.8423" y2="176.253" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E8EAEB"/>
+<stop offset="1" stop-color="#F0F1F1"/>
+</linearGradient>
+<linearGradient id="paint3_linear_220_20208" x1="138.831" y1="114.088" x2="109.601" y2="148.009" gradientUnits="userSpaceOnUse">
+<stop stop-color="#EEEEEE" stop-opacity="0.367499"/>
+<stop offset="1" stop-color="#D8D8D8" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint4_linear_220_20208" x1="211.649" y1="316.125" x2="234.238" y2="353.107" gradientUnits="userSpaceOnUse">
+<stop stop-color="#B7BFC3"/>
+<stop offset="0.487221" stop-color="#D9E2E6"/>
+<stop offset="1" stop-color="#E6EDF3" stop-opacity="0.01"/>
+</linearGradient>
+<linearGradient id="paint5_linear_220_20208" x1="262.971" y1="301.24" x2="260.037" y2="217.202" gradientUnits="userSpaceOnUse">
+<stop stop-color="#A1A7B8"/>
+<stop offset="1" stop-color="#7B8195"/>
+</linearGradient>
+<linearGradient id="paint6_linear_220_20208" x1="248.536" y1="158.972" x2="248.536" y2="151.932" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FBD8D6"/>
+<stop offset="1" stop-color="#EAC0BE" stop-opacity="0.7"/>
+</linearGradient>
+<linearGradient id="paint7_linear_220_20208" x1="192.026" y1="187.89" x2="247.661" y2="246.581" gradientUnits="userSpaceOnUse">
+<stop stop-color="#E5E9F0"/>
+<stop offset="1" stop-color="#D2DAE8"/>
+</linearGradient>
+</defs>
+</svg>
@@ -0,0 +1,36 @@
+<template>
+  <div class="flex items-center main">
+    <div>{{ props.item.province }}</div>
+    <BaseIcon icon="vuesax-linear:arrow-left-1" size=".9rem" />
+    <div>{{ props.item.project }}</div>
+    <BaseIcon icon="vuesax-linear:arrow-left-1" size=".9rem" />
+    <div>{{ props.item.documentGroup }}</div>
+    <BaseIcon icon="vuesax-linear:arrow-left-1" size=".9rem" />
+    <div>{{ props.item.document }}</div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type History from '@/pages/menuPages/customers/search/model/History'
+
+//define props
+interface Prop {
+  item: History
+}
+
+const props = defineProps<Prop>()
+</script>
+
+<style lang="less">
+.main {
+  @apply w-full justify-center;
+  background-color: #f6f6f4;
+  border: solid 1px #b2b2b2;
+  border-radius: @border-radius-base;
+  height: 4rem;
+
+  div {
+    @apply px-1;
+  }
+}
+</style>
@@ -0,0 +1,179 @@
+<template>
+  <div :class="[prefixCls]">
+    <div class="flex-row-reverse flex w-full">
+      <BaseButton type="primary" size="small" iconSize="18px" icon="vuesax-linear:clipboard-export">
+        افزودن پروژه
+      </BaseButton>
+    </div>
+    <div class="md:px-14">
+      <div class="colors-main">
+        <p>در هر بخش یک مورد را انتخاب کنید</p>
+        <div class="grid xl:grid-cols-12">
+          <div class="grid xl:col-span-10 sm:grid-cols-2 md:grid-cols-4">
+            <BasicSelect :items="province" title="استان" style="width: 100%" />
+            <BasicSelect :items="project" title="پروژه" style="width: 100%" />
+            <BasicSelect :items="documentGroup" title="گروه سندی" style="width: 100%" />
+            <BasicSelect :items="documents" title="سند" style="width: 100%" />
+          </div>
+          <div class="relative col-span-2 flex flex-col-reverse">
+            <div class="p-1">
+              <BaseButton
+                type="primary"
+                size="small"
+                iconSize="18px"
+                icon="vuesax-linear:search-normal-1"
+              >
+                جست و جو
+              </BaseButton>
+            </div>
+          </div>
+        </div>
+      </div>
+      <p class="mt-10">آخرین جست و جو</p>
+      <div ref="historyElement" class="grid gap-5" :class="`grid-cols-${countHistoryElementSize}`">
+        <div v-for="val in history.slice(0, countHistoryElementSize)" class="flex self-center">
+          <HistoryCard :item="val" />
+        </div>
+      </div>
+      <!--      <div class="text-center">
+        <img :src="searchIcon" class="h-[7rem] mt-8" />
+      </div>-->
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { usePrefix } from '@core/composable/usePrefix'
+import HistoryCard from '@/pages/menuPages/customers/search/components/HistoryCard.vue'
+import type Item from '@/pages/menuPages/customers/search/model/item'
+import type History from '@/pages/menuPages/customers/search/model/History'
+import searchIcon from '@/pages/menuPages/customers/search/assets/svg/search.svg'
+import { useElementSize } from '@vueuse/core'
+
+//ui historyElement
+const historyElement = ref(null)
+const historyElementSize = reactive(
+  useElementSize(historyElement, { width: 0, height: 0 }, { box: 'border-box' })
+)
+const countHistoryElementSize = ref()
+watch(historyElementSize, (v) => {
+  if (v.width > 1300) {
+    countHistoryElementSize.value = 5
+  } else if (v.width > 1100 && v.width <= 1300) {
+    countHistoryElementSize.value = 4
+  } else countHistoryElementSize.value = 3
+})
+
+//css style
+const { prefixCls } = usePrefix('search-customers')
+
+// items
+const province = ref<Array<Item>>([
+  {
+    value: 'تهران',
+    key: 'Tehran'
+  },
+  {
+    value: 'اصفهان',
+    key: 'Esfahan'
+  },
+  {
+    value: 'خراسان رضوی',
+    key: 'Khorasan Razavi'
+  },
+  {
+    value: 'مازندران',
+    key: 'Mazandaran'
+  }
+])
+const project = ref<Array<Item>>([
+  {
+    value: 'پروژه 1',
+    key: '1'
+  },
+  {
+    value: 'پروژه 2',
+    key: '2'
+  },
+  {
+    value: 'پروژه 3',
+    key: '3'
+  }
+])
+const documentGroup = ref<Array<Item>>([
+  {
+    value: 'گروه 1',
+    key: '1'
+  },
+  {
+    value: 'گروه 2',
+    key: '2'
+  },
+  {
+    value: 'گروه 3',
+    key: '3'
+  }
+])
+const documents = ref<Array<Item>>([
+  {
+    value: 'سند 1',
+    key: '1'
+  },
+  {
+    value: 'سند 2',
+    key: '2'
+  },
+  {
+    value: 'سند 3',
+    key: '3'
+  }
+])
+
+//history test
+
+const history = ref<Array<History>>([
+  {
+    province: 'اصفهان',
+    project: 'پروژه 1',
+    document: 'گروه 1',
+    documentGroup: 'سند 1'
+  },
+  {
+    province: 'اصفهان',
+    project: 'پروژه 1',
+    document: 'گروه 1',
+    documentGroup: 'سند 1'
+  },
+  {
+    province: 'اصفهان',
+    project: 'پروژه 1',
+    document: 'گروه 1',
+    documentGroup: 'سند 1'
+  },
+  {
+    province: 'اصفهان',
+    project: 'پروژه 1',
+    document: 'گروه 1',
+    documentGroup: 'سند 1'
+  },
+  {
+    province: 'اصفهان',
+    project: 'پروژه 1',
+    document: 'گروه 1',
+    documentGroup: 'سند 1'
+  }
+])
+</script>
+
+<style lang="less">
+@prefix: ~'@{prefixCls}-search-projects';
+
+.@{prefix} {
+  .colors-main {
+    @apply mt-5 p-4 border-solid border-1;
+    border-radius: @border-radius-base;
+    background-color: @bg-color-1;
+    border-color: @border-color-1;
+  }
+}
+</style>
@@ -0,0 +1,6 @@
+export default interface History {
+  province: string
+  project: string
+  documentGroup: string
+  document: string
+}
@@ -0,0 +1,4 @@
+export default interface Item {
+  value: String
+  key: String
+}