complete Complete User Request Submission section RAD-1

2026-01-03 19:14:30 +03:30
commit 7137ec5792
393 changed files with 152602 additions and 0 deletions
@@ -0,0 +1,77 @@
+<script setup>
+const props = defineProps({
+    currentPage: Number,
+    lastPage: Number,
+    total: Number,
+    perPage: Number,
+    links: Array,
+    topScroll: String,
+    onPaginate: { type: Function, required: true }
+});
+
+const paginateHandler = (page) => {
+    console.log(props.topScroll)
+    document.getElementById(props.topScroll).scrollIntoView({behavior: "smooth"});
+    props.onPaginate(page);
+}
+
+const perv = () => {
+    if (props.currentPage > 1) {
+        // document.getElementById(props.topScroll).scrollIntoView({behavior: "smooth"});
+        props.onPaginate(props.currentPage - 1);
+    }
+}
+
+const next = () => {
+    if (props.currentPage < props.lastPage) {
+        // document.getElementById(props.topScroll).scrollIntoView({behavior: "smooth"});
+        props.onPaginate(props.currentPage + 1);
+    }
+}
+</script>
+
+<template>
+    <section class="pagination" v-if="lastPage > 1">
+        <template v-for="(link , index) in links" :key="index">
+            <div class="paginate cursor-pointer"  v-if="link.label == 'قبلی'">
+                <div @click="perv" v-if="link.url">
+                    <i class="fi fi-rr-angle-small-right flex text-xl"></i>
+                </div>
+            </div>
+            <div class="paginate cursor-pointer" v-else-if="link.label == 'بعدی'">
+                <div @click="next" v-if="link.url">
+                    <i class="fi fi-rr-angle-small-left flex text-xl"></i>
+                </div>
+            </div>
+            <div class="paginate cursor-pointer flex items-center" :class="{'!text-white !bg-client-primary' : currentPage == link.label }" v-else>
+                <div @click="paginateHandler(link.label)" v-if="link.url" :href="link.url" class="flex pt-1">{{link.label}}</div>
+                <div v-else href="" class="flex">{{link.label}}</div>
+            </div>
+        </template>
+    </section>
+</template>
+
+<style lang="postcss">
+section.pagination{
+    padding: 1rem;
+    display: flex;
+    align-items: center;
+}
+section.pagination div.paginate:first-child div{
+    border-top-right-radius: .4rem;
+    border-bottom-right-radius: .4rem;
+}
+section.pagination div.paginate:last-child div{
+    border-top-left-radius: .4rem;
+    border-bottom-left-radius: .4rem;
+}
+section.pagination div.paginate div{
+    display: flex;
+    height: 2.2rem;
+    width: 2.2rem;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid #e6e6e6;
+    @apply text-client-Fontcolor
+}
+</style>