apply debug changes

This commit is contained in:
mohadese namavar
2024-07-07 14:16:58 +04:30
parent cb86fa4278
commit c1762c0083
11 changed files with 321 additions and 210 deletions
+2 -1
View File
@@ -46,9 +46,10 @@ const style = (bg) => `background: linear-gradient(143.73deg, ${bg.from} 5.62%,
} }
ul { ul {
@apply rtl grid grid-rows-2 grid-flow-col gap-[1.9rem] w-max mx-auto lg:gap-0 lg:gap-y-8; @apply rtl grid grid-rows-2 grid-flow-col justify-items-center gap-[1.9rem] w-max mx-auto lg:gap-0 lg:gap-y-8;
li { li {
@apply justify-self-center;
a { a {
@apply m-auto flex flex-col items-center; @apply m-auto flex flex-col items-center;
@apply w-[4.6rem] h-[6rem] justify-between; @apply w-[4.6rem] h-[6rem] justify-between;
+1 -1
View File
@@ -2,7 +2,7 @@
<ul class="profile-menu"> <ul class="profile-menu">
<li v-for="(item, i) in menu.profile" :key="i"> <li v-for="(item, i) in menu.profile" :key="i">
<template v-if="i != 2 || user?.profile?.confirmToSales"> <template v-if="i != 2 || user?.profile?.confirmToSales">
<component :is="item.link ? 'router-link': 'div'" :to="'/panel/' + item.url" @click="handleClick(item.key)" <component :is="item.url ? 'router-link': 'div'" :to="'/panel/' + item.url" @click="handleClick(item.key)"
v-ripple> v-ripple>
<i :class="item.icon"></i> <i :class="item.icon"></i>
<span>{{ item.label }}</span> <span>{{ item.label }}</span>
+5 -5
View File
@@ -13,10 +13,10 @@
</li> </li>
</ul> </ul>
<Button v-bind="btns.save.props" :loading="loading" @click="save()" /> <Button v-bind="btns.save.props" :loading="loading" @click="save()" />
<div> <!-- <div>
<p>{{ $t("forgetPassword") }}</p> <p>{{ $t("forgetPassword") }}</p>
<Button v-bind="btns.recovery.props" @click="recovery()" /> <Button v-bind="btns.recovery.props" @click="recovery()" />
</div> </div> -->
</div> </div>
</dialog> </dialog>
</template> </template>
@@ -77,7 +77,7 @@ watch(computed(() => form), (value, old) => {
@apply w-full lg:w-[61.6rem] lg:h-[36.9rem] bg-white rounded-t-2xl lg:rounded-2xl flex p-6 lg:p-4 lg:pl-6 relative; @apply w-full lg:w-[61.6rem] lg:h-[36.9rem] bg-white rounded-t-2xl lg:rounded-2xl flex p-6 lg:p-4 lg:pl-6 relative;
&::after { &::after {
@apply content-['_'] absolute inset-x-0 bottom-28 h-3 shadow-[0px_-2px_5px_#0000000a] lg:shadow-none; @apply content-['_'] absolute inset-x-0 bottom-16 h-3 shadow-[0px_-2px_5px_#0000000a] lg:shadow-none;
} }
&>img { &>img {
@@ -98,10 +98,10 @@ watch(computed(() => form), (value, old) => {
} }
&>button:nth-of-type(1) { &>button:nth-of-type(1) {
@apply self-end -mt-2 -ml-2; @apply self-end -ml-5 -mt-5 lg:-mt-2 lg:-ml-2;;
.p-button-icon { .p-button-icon {
@apply text-sm text-[#333333]; @apply text-xl text-[#333333];
@apply lg:text-[2em] lg:text-[#b2b2b29b]; @apply lg:text-[2em] lg:text-[#b2b2b29b];
} }
} }
+1 -1
View File
@@ -56,7 +56,7 @@ const numberFormat = (number) =>
<style lang="scss"> <style lang="scss">
.product-card { .product-card {
box-shadow: 0px 2px 10px 0px #87C29A; box-shadow: 0px 2px 14px 0px #e5eef5;
@apply bg-white rounded-[0.6rem] border flex flex-col relative; @apply bg-white rounded-[0.6rem] border flex flex-col relative;
&>img { &>img {
+5 -1
View File
@@ -18,9 +18,13 @@
const { swiper, btns } = inject('init') const { swiper, btns } = inject('init')
const { device, dialog } = inject('service') const { device, dialog } = inject('service')
const product = inject('data') const product = inject('data')
const token = useCookie('token')
const router = useRouter()
const handleClick = () => { const handleClick = () => {
dialog.show(resolveComponent('ProductDialogReport'), product) if (token.value)
dialog.show(resolveComponent('ProductDialogReport'), product)
else router.push('/auth/login')
} }
</script> </script>
+5 -1
View File
@@ -14,9 +14,13 @@
const { btns } = inject('init') const { btns } = inject('init')
const product = inject('data') const product = inject('data')
const { dialog } = inject('service') const { dialog } = inject('service')
const token = useCookie('token')
const router = useRouter()
const handleClick = () => { const handleClick = () => {
dialog.show(resolveComponent('ProductCommentDialogForm'), product) if (token.value)
dialog.show(resolveComponent('ProductCommentDialogForm'), product)
else router.push('/auth/login')
} }
</script> </script>
+8 -3
View File
@@ -13,7 +13,7 @@
<component :is="item.is" ref="chips" :id="key" v-bind="item.props" v-model="form[key]" /> <component :is="item.is" ref="chips" :id="key" v-bind="item.props" v-model="form[key]" />
<label :for="key">{{ item.label }}</label> <label :for="key">{{ item.label }}</label>
<template v-if="['positive', 'negative'].includes(key)"> <template v-if="['positive', 'negative'].includes(key)">
<Button icon="isax isax-add" severity="secondary" text @click="addChip(i)" /> <Button icon="isax isax-add" severity="secondary" text @click="addChip(key)" />
</template> </template>
<small v-if="errors[key]">{{ errors[key] }}</small> <small v-if="errors[key]">{{ errors[key] }}</small>
</li> </li>
@@ -76,8 +76,9 @@ const submit = async () => {
} }
const addChip = (i) => { const addChip = (key) => {
chips.value[i].addItem(new Event('keydown'), chips.value[i].$data.inputValue, true) const index = ['title', 'positive', 'negative'].indexOf(key)
chips.value[index]?.addItem(new Event('keydown'), chips.value[index].$data.inputValue, true)
} }
const starsClass = (i) => (i > (form?.point || 0) ? 'opacity-25' : '') const starsClass = (i) => (i > (form?.point || 0) ? 'opacity-25' : '')
@@ -158,6 +159,10 @@ watch(computed(() => form), (value, old) => {
.p-chips-token { .p-chips-token {
@apply ltr my-1; @apply ltr my-1;
.p-chips-token-label {
@apply font-vazir;
}
} }
} }
} }
+2 -1
View File
@@ -2,7 +2,7 @@
<div class="product-menu"> <div class="product-menu">
<ul> <ul>
<li v-for="({ icon, label, click }, i) in meta.init.menu" :key="i" > <li v-for="({ icon, label, click }, i) in meta.init.menu" :key="i" >
<div @click="click" v-ripple> <div @click="click(dialogRef)" v-ripple>
<i :class="icon" /> <i :class="icon" />
<span>{{ label }}</span> <span>{{ label }}</span>
</div> </div>
@@ -13,6 +13,7 @@
<script setup> <script setup>
const { meta } = useRoute() const { meta } = useRoute()
const dialogRef = inject('dialogRef')
</script> </script>
<style lang="scss"> <style lang="scss">
+2 -2
View File
@@ -1,5 +1,5 @@
export default () => { export default () => {
const store = useUserStore() const token = useCookie('token')
return reactive({ return reactive({
btns: { btns: {
@@ -41,7 +41,7 @@ export default () => {
}, },
}, },
profile: { profile: {
to: computed(() => store.token ? '/panel/profile' : '/auth/login'), to: computed(() => token.value ? '/panel/profile' : '/auth/login'),
props: { props: {
icon: "isax isax-user", rounded: true, severity: "secondary", text: true, icon: "isax isax-user", rounded: true, severity: "secondary", text: true,
}, },
+289 -193
View File
@@ -1,206 +1,302 @@
import ProductDialogReminder from '../components/product/dialog/Reminder.vue' import ProductDialogReminder from "../components/product/dialog/Reminder.vue";
import ProductDialogMenu from '../components/product/dialog/Menu.vue' import ProductDialogMenu from "../components/product/dialog/Menu.vue";
import ProductDialogShare from '../components/product/dialog/Share.vue' import ProductDialogShare from "../components/product/dialog/Share.vue";
import ProductDialogLineChart from '../components/product/dialog/LineChart.vue' import ProductDialogLineChart from "../components/product/dialog/LineChart.vue";
export default (data) => { export default (data) => {
const { dialog, t } = inject('service') const { dialog, t } = inject("service");
const fevorites = useFavoritesStore() const fevorites = useFavoritesStore();
const cart = useCartStore() const cart = useCartStore();
const router = useRouter() const token = useCookie("token");
const router = useRouter();
const confg = reactive({ const confg = reactive({
btns: { btns: {
report: { report: {
props: { props: {
label: t("reportIncorrectSpecs"), label: t("reportIncorrectSpecs"),
icon: "isax isax-info-circle", icon: "isax isax-info-circle",
severity: "secondary", severity: "secondary",
iconPos: "right", iconPos: "right",
rounded: true, rounded: true,
text: true, text: true,
}
},
arrows: [
{ icon: "isax isax-arrow-right-3", rounded: true, swiper: true },
{ icon: "isax isax-arrow-left-2", rounded: true, swiper: true },
],
close: {
props: { icon: 'isax isax-close-circle', severity: 'secondary', rounded: true, text: true }
},
shares: {
copyLink: {
props: {
label: t("copyLink"), icon: "isax isax-document-copy", severity: "secondary", iconPos: "right", outlined: true,
}
},
telegram: {
props: {
label: t("telegram"), icon: "isax isax-send-2", severity: "primary", iconPos: "right",
}
},
whatsapp: {
props: {
label: t("whatsapp"), icon: "isax isax-call4", severity: "success", iconPos: "right",
}
}
},
submit: {
props: {
label: t('submitComment'), outlined: true
}
},
sort: {
createdAt: {
props: {
label: t("newest"), severity: "secondary", text: true,
}
},
point: {
props: {
label: t("mostUseful"), severity: "secondary", text: true,
}
},
}
}, },
swiper: { },
gallery: { pagination: { dynamicBullets: true }, modules: [SwiperPagination] }, arrows: [
similars: { { icon: "isax isax-arrow-right-3", rounded: true, swiper: true },
slidesPerView: 'auto', { icon: "isax isax-arrow-left-2", rounded: true, swiper: true },
modules: [SwiperNavigation], ],
navigation: { close: {
prevEl: "div>button[swiper]:first-of-type", props: {
nextEl: "div>button[swiper]:last-of-type", icon: "isax isax-close-circle",
}, severity: "secondary",
} rounded: true,
text: true,
}, },
chart: { },
setChartData: (prices, dates) => { shares: {
var ctx = document.getElementsByTagName('canvas')[0].getContext('2d') copyLink: {
var gradient = ctx.createLinearGradient(0, 0, 0, 400) props: {
gradient.addColorStop(0, 'rgba(1, 86, 153, 0.62') label: t("copyLink"),
gradient.addColorStop(1, 'rgba(1, 86, 153, 0)') icon: "isax isax-document-copy",
const labels = [] severity: "secondary",
const data = [] iconPos: "right",
prices outlined: true,
.filter((item) => { },
return ( },
new Date(item.date) >= new Date(dates.from) && telegram: {
new Date(item.date) <= new Date(dates.to) props: {
) label: t("telegram"),
}) icon: "isax isax-send-2",
.forEach(({ date, price }) => { severity: "primary",
labels.push( iconPos: "right",
new Date(date).toLocaleDateString('fa', { month: 'long', year: 'numeric' }) },
) },
data.push(price + ' T') whatsapp: {
}) props: {
label: t("whatsapp"),
icon: "isax isax-call4",
severity: "success",
iconPos: "right",
},
},
},
submit: {
props: {
label: t("submitComment"),
outlined: true,
},
},
sort: {
createdAt: {
props: {
label: t("newest"),
severity: "secondary",
text: true,
},
},
point: {
props: {
label: t("mostUseful"),
severity: "secondary",
text: true,
},
},
},
},
swiper: {
gallery: {
pagination: { dynamicBullets: true },
modules: [SwiperPagination],
},
similars: {
slidesPerView: "auto",
modules: [SwiperNavigation],
navigation: {
prevEl: "div>button[swiper]:first-of-type",
nextEl: "div>button[swiper]:last-of-type",
},
},
},
chart: {
setChartData: (prices, dates) => {
var ctx = document.getElementsByTagName("canvas")[0].getContext("2d");
var gradient = ctx.createLinearGradient(0, 0, 0, 400);
gradient.addColorStop(0, "rgba(1, 86, 153, 0.62)");
gradient.addColorStop(1, "rgba(1, 86, 153, 0)");
const labels = [];
const data = [];
prices
// .filter((item) => {
// return (
// new Date(item.date) >= new Date(dates.from) &&
// new Date(item.date) <= new Date(dates.to)
// )
// })
.forEach(({ date, price }) => {
labels.push(
new Date(date).toLocaleDateString("fa", {
month: "long",
year: "numeric",
})
);
data.push(price);
});
return { return {
labels, labels,
datasets: [ datasets: [
{ {
label: '', data, fill: true, tension: 0.4, borderColor: '#379956', backgroundColor: gradient label: "",
} data,
] fill: true,
} tension: 0.4,
borderColor: "#379956",
backgroundColor: gradient,
}, },
setChartOptions: () => { ],
return { };
maintainAspectRatio: false, },
aspectRatio: 0.6, setChartOptions: () => {
plugins: { legend: { display: false } }, return {
scales: { x: { grid: { display: false } } } maintainAspectRatio: false,
} aspectRatio: 0.6,
} plugins: { legend: { display: false } },
scales: {
x: { grid: { display: false } },
y: {
display: true,
title: {
display: true,
text: "Toman",
},
},
},
};
},
},
menu: {
share: {
label: t("shareProduct"),
icon: "isax isax-share",
click: () => dialog.show(ProductDialogShare, data),
},
reminder: {
label: t("amazingInformation"),
icon: "isax isax-notification4",
click: (dialogRef) => {
if (token.value) dialog.show(ProductDialogReminder, data);
else {
dialogRef.close();
router.push("/auth/login");
}
}, },
menu: { },
share: { chart: {
label: t('shareProduct'), icon: "isax isax-share", label: t("priceChart"),
click: () => dialog.show(ProductDialogShare, data) icon: "isax isax-chart-2",
}, click: () => dialog.show(ProductDialogLineChart, data),
reminder: { },
label: t('amazingInformation'), icon: "isax isax-notification4", compare: {
click: () => dialog.show(ProductDialogReminder, data) label: t("compareProduct"),
}, icon: "isax isax-row-horizontal4",
chart: { click: () => router.push("/compare/" + data.id),
label: t('priceChart'), icon: "isax isax-chart-2", },
click: () => dialog.show(ProductDialogLineChart, data) },
}, options: {
compare: { favorite: {
label: t('compareProduct'), icon: "isax isax-row-horizontal4", props: {
click: () => router.push('/compare/' + data.id) severity: "secondary",
} text: true,
rounded: true,
icon: computed(
() => `isax isax-heart${fevorites.find(data.id) ? "5" : ""}`
),
}, },
options: { click: () => {
favorite: { if (token.value) fevorites.update(data.id);
props: { else router.push("/auth/login");
severity: "secondary", text: true, rounded: true,
icon: computed(() =>
`isax isax-heart${fevorites.find(data.id) ? '5' : ''}`
)
},
click: () => fevorites.update(data.id)
},
cart: {
props: {
icon: "isax isax-shopping-cart", severity: "secondary", text: true, rounded: true,
badges: computed(() => cart.items.length)
},
click: () => router.push('/checkout/cart')
},
menu: {
props: {
icon: "isax isax-more rotate-90", severity: "secondary", text: true, rounded: true,
},
click: () => dialog.show(ProductDialogMenu, confg.menu, { dismissableMask: true })
},
}, },
actions: { },
favorite: { cart: {
props: { props: {
severity: "secondary", text: true, rounded: true, icon: computed(() => { icon: "isax isax-shopping-cart",
const like = fevorites.find(data.id) severity: "secondary",
return `isax isax-heart${like ? '5' : ''}` text: true,
}) rounded: true,
}, badges: computed(() => cart.items.length),
click: () => fevorites.update(data.id),
},
share: {
props: {
icon: "isax isax-share", severity: "secondary", text: true, rounded: true,
},
click: () => dialog.show(ProductDialogShare, data)
},
reminder: {
props: {
icon: "isax isax-notification4", severity: "secondary", text: true, rounded: true,
},
click: () => dialog.show(ProductDialogReminder, data)
},
chart: {
props: {
icon: "isax isax-chart-2", severity: "secondary", text: true, rounded: true,
},
click: () => dialog.show(ProductDialogLineChart, data)
},
compare: {
props: {
icon: "isax isax-row-horizontal4", severity: "secondary", text: true, rounded: true,
},
click: () => router.push('/compare/' + data.id)
},
}, },
checkboxes: { click: () => router.push("/checkout/cart"),
reminder: ["sms", "notif", "email"], },
report: [ menu: {
"incorrectName", "inappropriatePhoto", "incorrectSpecs", "incorrectDesc", "notOriginal", "duplicate", props: {
] icon: "isax isax-more rotate-90",
severity: "secondary",
text: true,
rounded: true,
}, },
sorts: [ click: () =>
"mostRelevant", "mostVisited", "newest", "bestselling", "cheapest", "mostExpensive", "buyersSuggestion", dialog.show(ProductDialogMenu, confg.menu, { dismissableMask: true }),
] },
}) },
actions: {
favorite: {
props: {
severity: "secondary",
text: true,
rounded: true,
icon: computed(() => {
const like = fevorites.find(data.id);
return `isax isax-heart${like ? "5" : ""}`;
}),
},
click: () => {
if (token.value) fevorites.update(data.id);
else router.push("/auth/login");
},
},
share: {
props: {
icon: "isax isax-share",
severity: "secondary",
text: true,
rounded: true,
},
click: () => dialog.show(ProductDialogShare, data),
},
reminder: {
props: {
icon: "isax isax-notification4",
severity: "secondary",
text: true,
rounded: true,
},
click: () => {
if (token.value)
dialog.show(ProductDialogReminder, data)
else router.push('/auth/login')
}
},
chart: {
props: {
icon: "isax isax-chart-2",
severity: "secondary",
text: true,
rounded: true,
},
click: () => dialog.show(ProductDialogLineChart, data),
},
compare: {
props: {
icon: "isax isax-row-horizontal4",
severity: "secondary",
text: true,
rounded: true,
},
click: () => router.push("/compare/" + data.id),
},
},
checkboxes: {
reminder: ["sms", "notif", "email"],
report: [
"incorrectName",
"inappropriatePhoto",
"incorrectSpecs",
"incorrectDesc",
"notOriginal",
"duplicate",
],
},
sorts: [
"mostRelevant",
"mostVisited",
"newest",
"bestselling",
"cheapest",
"mostExpensive",
"buyersSuggestion",
],
});
return confg; return confg;
} };
+1 -1
View File
@@ -15,7 +15,7 @@ const { config } = useAttrs()
const { header = true, navigation = true } = config.mobile const { header = true, navigation = true } = config.mobile
provide('config', config) provide('config', config)
const { status, data } = await useFetch('/api/headers') const { status, data, error } = await useFetch('/api/headers')
if (status.value == 'success') if (status.value == 'success')
sidebar.props = { menu: data.value } sidebar.props = { menu: data.value }