radicall/resources/js/Admin/store/Pet.js

import { defineStore } from 'pinia'
import axios from "axios";
import { Inertia } from '@inertiajs/inertia'

export const usePetStore = defineStore('PetStore', {
    state: () => ({
        createForm: {
            name: '',
            type: '',
            gender: '',
            breed: '',
            weight: '',
            sterilized: '',
            birthday: '',
            owner_id: '',
        },

        typeOptions: [
            { label: 'سگ', value: 'سگ' },
            { label: 'گربه', value: 'گربه' },
            { label: 'پرنده', value: 'پرنده' },
            { label: 'خرگوش', value: 'خرگوش' },
            { label: 'همستر', value: 'همستر' },
            { label: 'خوکچه هندی', value: 'خوکچه هندی' },
            { label: 'لاک پشت', value: 'لاک پشت' },
            { label: 'مار', value: 'مار' },
            { label: 'مارمولک', value: 'مارمولک' },
            { label: 'سایر', value: 'سایر' },
        ],
        genderOptions: [
            { label: 'نر', value: 'نر' },
            { label: 'ماده', value: 'ماده' },
            { label: 'نامشخص', value: 'نامشخص' },
        ],
        sterilizedOptions: [
            { label: 'عقیم شده', value: true },
            { label: 'عقیم نشده', value: false },
        ],
        loaderCreateForm: false,
        is_edit_form: false,
        errorsCreateForm: [],
        is_edit_id: null,
        filters: {},

        columns: [
            {
                key: 'name',
                title: 'نام',
            },
            {
                key: 'type',
                title: 'نوع',
                filter: {
                    type: 'multiselect',
                    options: [
                        { label: 'سگ', value: 'سگ' },
                        { label: 'گربه', value: 'گربه' },
                        { label: 'پرنده', value: 'پرنده' },
                        { label: 'خرگوش', value: 'خرگوش' },
                        { label: 'همستر', value: 'همستر' },
                        { label: 'خوکچه هندی', value: 'خوکچه هندی' },
                        { label: 'لاک پشت', value: 'لاک پشت' },
                        { label: 'مار', value: 'مار' },
                        { label: 'مارمولک', value: 'مارمولک' },
                        { label: 'سایر', value: 'سایر' },
                    ],
                    placeholder: 'انتخاب نوع...'
                }
            },
            {
                key: 'gender',
                title: 'جنسیت',
                slot: 'gender',
                filter: {
                    type: 'dropdown',
                    options: [
                        { label: 'نر', value: 'نر' },
                        { label: 'ماده', value: 'ماده' },
                        { label: 'نامشخص', value: 'نامشخص' },
                    ],
                    placeholder: 'انتخاب جنسیت...'
                }
            },
            {
                key: 'breed',
                title: 'نژاد',
                render: (data) => data.breed ?? 'ثبت نشده',
            },
            {
                key: 'weight',
                title: 'وزن',
                render: (data) => data.weight + ' کیلوگرم' ?? 'ثبت نشده',
            },
            {
                key: 'sterilized',
                title: 'عقیم‌سازی',
                slot: 'sterilized',
                render: (data) => this.getSterilized(data.sterilized),
            },
            {
                key: 'age',
                title: 'سن',
                hasSort: true,
                width: 140,
                render:(data) => data?.age ?? 'ثبت نشده',
            },
            {
                key: 'owner',
                title: 'صاحب',
                width: 200,
                slot: 'owner',
            },
            {
                key: 'actions',
                title: 'عملیات',
                hasSort: false,
                slot: true,
            },
        ],
        endpoints: {
            index: '/admin/pets',
            create: '/admin/pets/create',
            store: '/admin/pets',
            edit: (id) => `/admin/pets/${id}/edit`,
            update: (id) => `/admin/pets/${id}`,
            delete: (id) => `/admin/pets/${id}`,
            bulkDelete: '/admin/pets-bulk-delete',
            export: '/admin/pets-export-data'
        }
    }),

    getters: {
        buttonLabel: (state) => {
            return state.is_edit_id ? 'ویرایش کیس' : 'ثبت و ایجاد کیس جدید';
        },
        pageTitle: (state) => {
            return state.is_edit_id ? 'ویرایش کیس' : 'افزودن کیس جدید';
        },
        indexPageTitle: (state) => {
            return 'نمایش همه کیس ها';
        }
    },

    actions: {
        update_and_store() {
            const url = this.is_edit_id ?
                this.endpoints.update(this.is_edit_id) :
                this.endpoints.store;
            const method = this.is_edit_id ? 'patch' : 'post';
            this.loaderCreateForm = true;
            axios({
                method: method,
                url: url,
                data: this.createForm
            }).then(res => {
                this.errorsCreateForm = []
                this.loaderCreateForm = false;
                if (this.is_edit_id) {
                    Inertia.get(this.endpoints.edit(this.is_edit_id));
                } else {
                    this.resetCreateForm();
                    Inertia.get(this.endpoints.create);
                }
            }).catch(error => {
                this.loaderCreateForm = false;
                this.errorsCreateForm = error.response.data?.errors ?? [];
            });
        },

        resetCreateForm() {
            this.createForm = {
                name: '',
                type: '',
                gender: '',
                breed: '',
                weight: '',
                sterilized: '',
                birthday: '',
                owner_id: '',
            }
            this.is_edit_id = null;
            this.errorsCreateForm = [];
        },

        setEditData(data) {
            this.is_edit_id = data.id;
            Object.keys(this.createForm).forEach(field => {
                if (field === 'sterilized') {
                    this.createForm[field] = data.sterilized !== null && data.sterilized !== undefined ? data.sterilized : '';
                } else {
                    this.createForm[field] = data[field] || '';
                }
            });
        },

        deleteRecord(id) {
            return new Promise((resolve, reject) => {
                axios.delete(this.endpoints.delete(id))
                    .then(response => {
                        Inertia.get(this.endpoints.index);
                        resolve(response);
                    })
                    .catch(error => {
                        reject(error);
                    });
            });
        },

        bulkDelete(ids) {
            return new Promise((resolve, reject) => {
                axios.post(this.endpoints.bulkDelete, { ids })
                    .then(response => {
                        Inertia.get(this.endpoints.index);
                        resolve(response);
                    })
                    .catch(error => {
                        reject(error);
                    });
            });
        },

        exportData(filters = {}) {
            const query = new URLSearchParams(filters).toString();
            window.open(`${this.endpoints.export}?${query}`, '_blank');
        },

        search(params) {
            return Inertia.get(this.endpoints.index, params, {
                preserveState: false
            });
        },

        navigateToPage(page) {
            return Inertia.get(this.endpoints.index, { page }, { preserveState: true });
        },

        getSterilized(sterilized) {
            const sterilizedMap = {
                true: 'info',
                false: 'secondary'
            };
            return sterilizedMap[sterilized] || 'secondary';
        },

        updateFilters(newFilters) {
            this.filters = { ...newFilters };
            this.search({ ...this.filters });
        },

        clearFilters() {
            this.filters = {};
            this.search();
        },

        updateFilterValue(key, value) {
            this.filters[key] = value;
        },

        applyFilters() {
            this.search({ ...this.filters });
        },

        convertFiltersToArrayParams(filters) {
            const params = {};
            Object.keys(filters).forEach(key => {
                if (Array.isArray(filters[key]) && filters[key].length > 0) {
                    filters[key].forEach((value, index) => {
                        params[`${key}[${index}]`] = value;
                    });
                } else if (!Array.isArray(filters[key]) && filters[key]) {
                    params[key] = filters[key];
                }
            });
            return params;
        },
        parseStringToArray(value) {
            if (Array.isArray(value)) {
                return value.filter(item => item !== '' && item != null);
            }
            if (value && typeof value === 'string' && value.trim() !== '') {
                return value.split(',').map(item => item.trim()).filter(item => item !== '');
            }
            return [];
        },
    }
})