failj/ntspi-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Changes

Browse Source
This commit is contained in:
f4ilji
2025-03-13 12:17:27 +05:00
parent 2fa59350cf
commit 7a7ecf7b0d
32 changed files with 571 additions and 311 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/Components/BaseComponents/BaseBuilderUi/Blocks/Contacts/ContactSectionBlock.vue
+2 -1
View File
@@ -8,7 +8,7 @@
</div>
</div>
</div>
<div v-else>
<div v-else-if="!loading & contacts">
<section class="bg-[#F5F5F5] w-full py-10">
<div class="max-w-screen-xl md:flex justify-around w-full mx-auto px-4 md:py-[50px] flex-wrap space-y-7 md:space-y-0">
<ContactGroup v-for="contact in contacts.data.content"
@@ -18,6 +18,7 @@
</div>
</section>
</div>
</template>
<script>
resources/js/Components/BaseComponents/BaseIcon.vue
+23 -24
View File
@@ -1,30 +1,12 @@
<template>
<svg xmlns="http://www.w3.org/2000/svg"
:fill="icon.fill || 'none'"
:viewBox="icon.viewBox || this.viewBox || '0 0 24 24'"
:stroke-width="icon.stroke_width || this.stroke_width || 1.5"
:stroke="icon.stroke || 'currentColor'"
:class="$attrs.class || 'w-6 h-6'"
v-html="icon.path"
>
</svg>
<svg v-bind="svgAttributes" v-html="icon.path"></svg>
</template>
<script>
import slugify from "slugify";
import icons from "@/Components/other/icons.js";
export default {
name: "BaseIcon",
data() {
return {
icon: icons[this.name] || icons['file']
}
},
methods: {
},
props: {
name: {
type: String,
@@ -39,9 +21,26 @@ export default {
type: String
}
},
computed: {
icon() {
return icons[this.transformIconName(this.name)] || icons['file'];
},
svgAttributes() {
return {
xmlns: "http://www.w3.org/2000/svg",
fill: this.icon.fill || 'none',
viewBox: this.icon.viewBox || this.viewBox || '0 0 24 24',
'stroke-width': this.icon.stroke_width || this.stroke_width || 1.5,
stroke: this.icon.stroke || 'currentColor',
class: this.$attrs.class || 'w-6 h-6'
};
}
},
methods: {
transformIconName(iconName) {
return iconName.replace(/^heroicon-(o|c|s|m)-/, '')
.replace(/-(\w)/g, (_, letter) => letter.toUpperCase());
}
}
}
</script>
<style scoped>
</style>
</script>
resources/js/Components/BuilderUi/Pages/PageSubSectionLinks.vue
+12 -8
View File
@@ -4,13 +4,14 @@
<nav v-if="subSectionPages"
class="flex h-[calc(100vh-200px)] flex-col overflow-hidden pr-2 pb-4">
<div class="text-gray-1000 mb-2 text-md font-medium">{{ currentSection }}</div>
<div class="flex gap-x-1">
<div>
<ul class="px-0.5 last-of-type:mb-0 mb-8">
<li v-for="page in subSectionPages.data" :key="page.id" class="my-1.5 flex">
<a :class="{'text-white font-semibold bg-primaryBlue': isSameRoute(page.path), 'text-gray-600 hover:text-[#2C6288]': !isSameRoute(page.path) }"
<a :class="{'text-white font-normal bg-primaryBlue border': isSameRoute(page.path), 'text-gray-600 hover:text-[#2C6288]': !isSameRoute(page.path) }"
:href="(page.is_url) ? page.path : route('page.view', page.path) + '/'"
class="relative duration-300 flex gap-x-1 w-full rounded-md cursor-pointer items-center px-2 py-1 text-left text-sm">
{{
class="duration-300 flex gap-x-2 w-full rounded-md cursor-pointer items-center px-2 py-1.5 text-left text-sm">
<BaseIcon class="w-4" :name="page.icon" />
{{
page.title
}}
</a>
@@ -22,14 +23,15 @@
</div>
</template>
<script>
import {Link} from "@inertiajs/vue3";
import BaseIcon from "@/Components/BaseComponents/BaseIcon.vue";
export default {
name: "PageSubSectionLinks",
components: {Link},
components: {Link, BaseIcon},
data() {
return {
currentNavSection: null,
@@ -50,12 +52,14 @@ export default {
return true
}
},
},
mounted() {
// console.log(IconsMap)
},
props: {
subSectionPages: {
type: Object,
resources/js/Components/ClientMainSlider.vue
+19 -24
View File
@@ -1,6 +1,6 @@
<template>
<div ref="sliderRef" class="relative z-0 min-h-[calc(100vh)] items-center">
<a :href="(!slider.settings.link_text) ? slider.link : '#'" v-for="(slider, index) in slidersCarousel.data" :class="`brightness-[${slider.image.shading}]`"
<a :href="(!slider.settings.link_text) ? slider.link : '#'" v-for="(slider, index) in slidersCarousel.data" :style="{ filter: `brightness(${slider.image.shading})` }"
class="absolute -z-10 h-full w-full before:absolute before:z-10 before:h-full before:w-full ">
<img
alt="Thumbnail"
@@ -35,13 +35,11 @@
>
{{ item.settings.link_text }}
</a>
</div>
</div>
<div v-if="slidersCarousel.data.length >= 2" class="mx-auto max-w-screen-md px-5">
<div class="mt-8 text-gray-500 absolute bottom-[100px]">
<div class="mt-8 text-gray-500 absolute bottom-[50px] left-1/2 transform -translate-x-1/2 lg:bottom-[100px]">
<div class="">
<div class="flex space-x-3 items-center justify-between">
<button @click="prev" class="bg-gray-200 w-8 h-8 hover:bg-gray-300 text-gray-800 font-bold rounded-full">
@@ -50,10 +48,10 @@
</svg>
</button>
<div class="flex space-x-3 w-[100px] items-center font-semibold text-xl text-white">
<div class="flex space-x-3 w-[200px] items-center font-semibold text-xl text-white">
<span>{{ currentIndex + 1 }}</span>
<div class="flex w-full h-1 bg-gray-200 rounded-full overflow-hidden dark:bg-neutral-700" role="progressbar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="flex flex-col justify-center rounded-full overflow-hidden bg-blue-600 text-xs text-white text-center whitespace-nowrap transition duration-500 dark:bg-blue-500 my-slider-progress-bar" :style="{ 'width': `${percentage}%` }"></div>
<div class="flex w-full h-1 bg-gray-200 rounded-full overflow-hidden" role="progressbar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="flex flex-col justify-center rounded-full overflow-hidden bg-blue-600 text-xs text-white text-center whitespace-nowrap transition-all duration-500 ease-in-out" :style="{ 'width': `${progressBarStep}%` }"></div>
</div>
<span>{{ slidersCarousel.data.length }}</span>
</div>
@@ -76,21 +74,26 @@ export default {
props: {
slidersCarousel: {
type: Object,
required: true, // Убедитесь, что пропс передан
required: true,
},
},
data() {
return {
currentIndex: 0,
percentage: 0,
intervalId: null,
slideDuration: 5000 // Продолжительность слайда в миллисекундах
slideDuration: 5000,
}
},
computed: {
totalSlides() {
return this.slidersCarousel && this.slidersCarousel.data ? this.slidersCarousel.data.length : 0;
},
progressBarStep() {
const slides = this.totalSlides
const step = 100 / slides
return (this.currentIndex + 1) * step
}
},
methods: {
next() {
@@ -105,18 +108,9 @@ export default {
this.resetTimer();
}
},
progressStatus() {
if (this.percentage >= 100) {
this.resetTimer();
this.next();
} else {
this.percentage += (100 / (this.slideDuration / 60)); // Увеличиваем процент равномерно
}
},
startTimer() {
this.stopTimer(); // Останавливаем предыдущий таймер, если он есть
this.percentage = 0; // Сбрасываем процент
this.intervalId = setInterval(this.progressStatus, 60); // Запускаем новый таймер
this.intervalId = setInterval(this.next, this.slideDuration); // Запускаем новый таймер
},
stopTimer() {
clearInterval(this.intervalId);
@@ -130,6 +124,9 @@ export default {
this.$emit('slider-mounted', this.$refs.sliderRef);
this.startTimer();
},
beforeUnmount() {
this.stopTimer();
},
}
</script>
@@ -148,6 +145,4 @@ export default {
opacity: 0;
transform: translateY(30px);
}
</style>
Найти еще
</style>
resources/js/Components/other/icons.js
+119 -7
View File
@@ -76,8 +76,6 @@ export default {
stroke_width: 1.5,
stroke: 'currentColor',
},
settings: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75"/>',
viewBox: '0 0 24 24',
@@ -85,9 +83,123 @@ export default {
stroke_width: 1.5,
stroke: 'currentColor',
},
academicCap: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M4.26 10.147a60.438 60.438 0 0 0-.491 6.347A48.62 48.62 0 0 1 12 20.904a48.62 48.62 0 0 1 8.232-4.41 60.46 60.46 0 0 0-.491-6.347m-15.482 0a50.636 50.636 0 0 0-2.658-.813A59.906 59.906 0 0 1 12 3.493a59.903 59.903 0 0 1 10.399 5.84c-.896.248-1.783.52-2.658.814m-15.482 0A50.717 50.717 0 0 1 12 13.489a50.702 50.702 0 0 1 7.74-3.342M6.75 15a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm0 0v-3.675A55.378 55.378 0 0 1 12 8.443m-7.007 11.55A5.981 5.981 0 0 0 6.75 15.75v-1.5" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
adjustmentsHorizontal: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M10.5 6h9.75M10.5 6a1.5 1.5 0 1 1-3 0m3 0a1.5 1.5 0 1 0-3 0M3.75 6H7.5m3 12h9.75m-9.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-3.75 0H7.5m9-6h3.75m-3.75 0a1.5 1.5 0 0 1-3 0m3 0a1.5 1.5 0 0 0-3 0m-9.75 0h9.75" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
adjustmentsVertical: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M6 13.5V3.75m0 9.75a1.5 1.5 0 0 1 0 3m0-3a1.5 1.5 0 0 0 0 3m0 3.75V16.5m12-3V3.75m0 9.75a1.5 1.5 0 0 1 0 3m0-3a1.5 1.5 0 0 0 0 3m0 3.75V16.5m-6-9V3.75m0 3.75a1.5 1.5 0 0 1 0 3m0-3a1.5 1.5 0 0 0 0 3m0 9.75V10.5" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
archiveBoxArrowDown: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5m8.25 3v6.75m0 0-3-3m3 3 3-3M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
archiveBoxXMark: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5m6 4.125 2.25 2.25m0 0 2.25 2.25M12 13.875l2.25-2.25M12 13.875l-2.25 2.25M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
archiveBox: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m20.25 7.5-.625 10.632a2.25 2.25 0 0 1-2.247 2.118H6.622a2.25 2.25 0 0 1-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125Z" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDownCircle: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m9 12.75 3 3m0 0 3-3m-3 3v-7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDownLeft: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 4.5-15 15m0 0h11.25m-11.25 0V8.25" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDownOnSquareStack: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M7.5 7.5h-.75A2.25 2.25 0 0 0 4.5 9.75v7.5a2.25 2.25 0 0 0 2.25 2.25h7.5a2.25 2.25 0 0 0 2.25-2.25v-7.5a2.25 2.25 0 0 0-2.25-2.25h-.75m-6 3.75 3 3m0 0 3-3m-3 3V1.5m6 9h.75a2.25 2.25 0 0 1 2.25 2.25v7.5a2.25 2.25 0 0 1-2.25 2.25h-7.5a2.25 2.25 0 0 1-2.25-2.25v-.75" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDownOnSquare: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDownRight: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m4.5 4.5 15 15m0 0V8.25m0 11.25H8.25" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDownTray: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowDown: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M19.5 13.5 12 21m0 0-7.5-7.5M12 21V3" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowLeftCircle: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="m11.25 9-3 3m0 0 3 3m-3-3h7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowLeftEndOnRectangle: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowLeftStartOnRectangle: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15m-3 0-3-3m0 0 3-3m-3 3H15" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
arrowLeft: {
path: '<path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18" />',
viewBox: '0 0 24 24',
fill: 'none',
stroke_width: 1.5,
stroke: 'currentColor',
},
}