{"version":3,"file":"Index-BkzkcMiB.js","sources":["../../../resources/js/Pages/Blog/Index.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport AppLayout from \"@/Layouts/AppLayout.vue\";\nimport {Link} from '@inertiajs/vue3';\nimport {formatDate} from \"@/Composables/formatDate\";\nimport {route} from \"@/Composables/route\";\nimport {trans} from \"@/Composables/trans\";\nimport {hasPermission} from \"@/Composables/hasPermission\";\nimport {BlogIndexResponse} from \"@/types\";\n\ndefineProps<BlogIndexResponse>();\n\nconst extractFirstImageUrl = (content: string): string => {\n    const regex = /<img[^>]+src=\"([^\">]+)\"/g;\n    const match = regex.exec(content);\n\n    return match ? match[1] : '';\n};\n</script>\n\n<template>\n    <app-layout :title=\"trans('meta.blog.index.title')\" :description=\"trans('meta.blog.index.description')\">\n        <section class=\"py-5 pt-lg-8 pb-lg-8 bg-primary\">\n            <b-container>\n                <div class=\"mb-4 mb-lg-0 text-center text-lg-start\">\n                    <h1 class=\"mb-1 mb-lg-3 text-white-stable\">\n                        {{ trans('blog.blog.blog') }}\n                    </h1>\n                    <p class=\"lead mb-0 text-white-stable\">\n                        {{ trans('blog.blog.intro_text') }}\n                    </p>\n                </div>\n            </b-container>\n        </section>\n        <section class=\"mb-xl-9 my-4\">\n            <b-container>\n                <div class=\"d-flex align-items-center justify-content-between mb-4\">\n                  <span class=\"mb-0 me-2\">\n                    <i class=\"bi bi-archive-fill text-primary me-1\"></i>\n                    {{ trans('blog.blog.current_page') }}\n                    <span class=\"badge text-bg-dark rounded-pill\">\n                      {{ posts.meta.current_page }}/{{ posts.meta.last_page }}\n                    </span>\n                  </span>\n                    <Link\n                        v-if=\"hasPermission('post_create')\"\n                        :href=\"route('blog.create')\"\n                        class=\"btn btn-dark\"\n                    >\n                        {{ trans('blog.blog.add_new_post') }}\n                    </Link>\n                </div>\n                <b-alert\n                    :model-value=\"posts.data.length === 0\"\n                    variant=\"primary\"\n                    class=\"mb-4\"\n                >\n                    <i class=\"bi bi-exclamation-triangle-fill me-3\"></i>\n                    {{ trans('blog.blog.no_post_found') }}\n                </b-alert>\n                <b-row class=\"gy-lg-7 gy-5\">\n                    <b-col v-for=\"post in posts.data\" :key=\"post.slug\" cols=\"12\" md=\"6\" lg=\"4\">\n                        <article>\n                            <figure class=\"mb-4 zoom-img\">\n                                <Link :href=\"route('blog.show', { blog: post.slug })\">\n                                    <b-img\n                                        v-if=\"extractFirstImageUrl(post.content)\"\n                                        :src=\"extractFirstImageUrl(post.content)\"\n                                        :alt=\"post.title\"\n                                        class=\"img-fluid rounded-3\"\n                                        lazy\n                                    />\n                                    <b-img\n                                        v-else\n                                        src=\"/assets/images/no-image.jpg\"\n                                        :alt=\"post.title\"\n                                        class=\"img-fluid rounded-3\"\n                                        lazy\n                                    />\n                                </Link>\n                            </figure>\n                            <div\n                                v-for=\"category in post.categories\"\n                                :key=\"category.id\"\n                                class=\"badge bg-primary-subtle text-primary-emphasis rounded-pill text-uppercase me-1\"\n                            >\n                                {{ category.name }}\n                            </div>\n                            <h3 class=\"my-3 lh-base h4\">\n                                <Link :href=\"route('blog.show', { blog: post.slug })\" class=\"text-reset\">\n                                    {{ post.title }}\n                                </Link>\n                            </h3>\n                            <div class=\"d-flex align-items-center justify-content-between mb-3 mb-md-0\">\n                                <div class=\"d-flex align-items-center\">\n                                    <b-img\n                                        src=\"/assets/avatars/nQH86ZlHV78.jpg\"\n                                        alt=\"Avatar\"\n                                        class=\"avatar avatar-xs rounded-circle\"\n                                        lazy\n                                    />\n                                    <div class=\"ms-2\">\n                                        Emily Parker\n                                    </div>\n                                </div>\n                                <div class=\"ms-3\">\n                                    {{ formatDate(post.created_at) }}\n                                </div>\n                            </div>\n                        </article>\n                    </b-col>\n                    <b-col cols=\"12\">\n                        <nav v-if=\"posts.meta.last_page > 1\">\n                            <ul class=\"pagination justify-content-center\">\n                                <li\n                                    v-for=\"page in posts.links\"\n                                    :key=\"page.label\"\n                                    :class=\"['page-item', page.active ? 'active' : '']\"\n                                >\n                                    <Link v-if=\"page.url\" :href=\"page.url\" class=\"page-link\" v-html=\"page.label\"/>\n                                    <span v-else class=\"page-link\" v-html=\"page.label\"/>\n                                </li>\n                            </ul>\n                        </nav>\n                    </b-col>\n                </b-row>\n            </b-container>\n        </section>\n    </app-layout>\n</template>\n"],"names":["extractFirstImageUrl","content","match"],"mappings":"gtDAWM,MAAAA,EAAwBC,GAA4B,CAEhD,MAAAC,EADQ,2BACM,KAAKD,CAAO,EAEzB,OAAAC,EAAQA,EAAM,CAAC,EAAI,EAC9B"}