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 {
@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 {
@apply justify-self-center;
a {
@apply m-auto flex flex-col items-center;
@apply w-[4.6rem] h-[6rem] justify-between;
+1 -1
View File
@@ -2,7 +2,7 @@
<ul class="profile-menu">
<li v-for="(item, i) in menu.profile" :key="i">
<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>
<i :class="item.icon"></i>
<span>{{ item.label }}</span>
+5 -5
View File
@@ -13,10 +13,10 @@
</li>
</ul>
<Button v-bind="btns.save.props" :loading="loading" @click="save()" />
<div>
<!-- <div>
<p>{{ $t("forgetPassword") }}</p>
<Button v-bind="btns.recovery.props" @click="recovery()" />
</div>
</div> -->
</div>
</dialog>
</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;
&::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 {
@@ -98,10 +98,10 @@ watch(computed(() => form), (value, old) => {
}
&>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 {
@apply text-sm text-[#333333];
@apply text-xl text-[#333333];
@apply lg:text-[2em] lg:text-[#b2b2b29b];
}
}
+1 -1
View File
@@ -56,7 +56,7 @@ const numberFormat = (number) =>
<style lang="scss">
.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;
&>img {
+5 -1
View File
@@ -18,9 +18,13 @@
const { swiper, btns } = inject('init')
const { device, dialog } = inject('service')
const product = inject('data')
const token = useCookie('token')
const router = useRouter()
const handleClick = () => {
dialog.show(resolveComponent('ProductDialogReport'), product)
if (token.value)
dialog.show(resolveComponent('ProductDialogReport'), product)
else router.push('/auth/login')
}
</script>
+5 -1
View File
@@ -14,9 +14,13 @@
const { btns } = inject('init')
const product = inject('data')
const { dialog } = inject('service')
const token = useCookie('token')
const router = useRouter()
const handleClick = () => {
dialog.show(resolveComponent('ProductCommentDialogForm'), product)
if (token.value)
dialog.show(resolveComponent('ProductCommentDialogForm'), product)
else router.push('/auth/login')
}
</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]" />
<label :for="key">{{ item.label }}</label>
<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>
<small v-if="errors[key]">{{ errors[key] }}</small>
</li>
@@ -76,8 +76,9 @@ const submit = async () => {
}
const addChip = (i) => {
chips.value[i].addItem(new Event('keydown'), chips.value[i].$data.inputValue, true)
const addChip = (key) => {
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' : '')
@@ -158,6 +159,10 @@ watch(computed(() => form), (value, old) => {
.p-chips-token {
@apply ltr my-1;
.p-chips-token-label {
@apply font-vazir;
}
}
}
}
+2 -1
View File
@@ -2,7 +2,7 @@
<div class="product-menu">
<ul>
<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" />
<span>{{ label }}</span>
</div>
@@ -13,6 +13,7 @@
<script setup>
const { meta } = useRoute()
const dialogRef = inject('dialogRef')
</script>
<style lang="scss">
+2 -2
View File
@@ -1,5 +1,5 @@
export default () => {
const store = useUserStore()
const token = useCookie('token')
return reactive({
btns: {
@@ -41,7 +41,7 @@ export default () => {
},
},
profile: {
to: computed(() => store.token ? '/panel/profile' : '/auth/login'),
to: computed(() => token.value ? '/panel/profile' : '/auth/login'),
props: {
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 ProductDialogMenu from '../components/product/dialog/Menu.vue'
import ProductDialogShare from '../components/product/dialog/Share.vue'
import ProductDialogLineChart from '../components/product/dialog/LineChart.vue'
import ProductDialogReminder from "../components/product/dialog/Reminder.vue";
import ProductDialogMenu from "../components/product/dialog/Menu.vue";
import ProductDialogShare from "../components/product/dialog/Share.vue";
import ProductDialogLineChart from "../components/product/dialog/LineChart.vue";
export default (data) => {
const { dialog, t } = inject('service')
const fevorites = useFavoritesStore()
const cart = useCartStore()
const router = useRouter()
const { dialog, t } = inject("service");
const fevorites = useFavoritesStore();
const cart = useCartStore();
const token = useCookie("token");
const router = useRouter();
const confg = reactive({
btns: {
report: {
props: {
label: t("reportIncorrectSpecs"),
icon: "isax isax-info-circle",
severity: "secondary",
iconPos: "right",
rounded: 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,
}
},
}
const confg = reactive({
btns: {
report: {
props: {
label: t("reportIncorrectSpecs"),
icon: "isax isax-info-circle",
severity: "secondary",
iconPos: "right",
rounded: true,
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",
},
}
},
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,
},
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 + ' T')
})
},
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],
},
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 {
labels,
datasets: [
{
label: '', data, fill: true, tension: 0.4, borderColor: '#379956', backgroundColor: gradient
}
]
}
return {
labels,
datasets: [
{
label: "",
data,
fill: true,
tension: 0.4,
borderColor: "#379956",
backgroundColor: gradient,
},
setChartOptions: () => {
return {
maintainAspectRatio: false,
aspectRatio: 0.6,
plugins: { legend: { display: false } },
scales: { x: { grid: { display: false } } }
}
}
],
};
},
setChartOptions: () => {
return {
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: {
label: t('shareProduct'), icon: "isax isax-share",
click: () => dialog.show(ProductDialogShare, data)
},
reminder: {
label: t('amazingInformation'), icon: "isax isax-notification4",
click: () => dialog.show(ProductDialogReminder, data)
},
chart: {
label: t('priceChart'), icon: "isax isax-chart-2",
click: () => dialog.show(ProductDialogLineChart, data)
},
compare: {
label: t('compareProduct'), icon: "isax isax-row-horizontal4",
click: () => router.push('/compare/' + data.id)
}
},
chart: {
label: t("priceChart"),
icon: "isax isax-chart-2",
click: () => dialog.show(ProductDialogLineChart, data),
},
compare: {
label: t("compareProduct"),
icon: "isax isax-row-horizontal4",
click: () => router.push("/compare/" + data.id),
},
},
options: {
favorite: {
props: {
severity: "secondary",
text: true,
rounded: true,
icon: computed(
() => `isax isax-heart${fevorites.find(data.id) ? "5" : ""}`
),
},
options: {
favorite: {
props: {
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 })
},
click: () => {
if (token.value) fevorites.update(data.id);
else router.push("/auth/login");
},
actions: {
favorite: {
props: {
severity: "secondary", text: true, rounded: true, icon: computed(() => {
const like = fevorites.find(data.id)
return `isax isax-heart${like ? '5' : ''}`
})
},
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)
},
},
cart: {
props: {
icon: "isax isax-shopping-cart",
severity: "secondary",
text: true,
rounded: true,
badges: computed(() => cart.items.length),
},
checkboxes: {
reminder: ["sms", "notif", "email"],
report: [
"incorrectName", "inappropriatePhoto", "incorrectSpecs", "incorrectDesc", "notOriginal", "duplicate",
]
click: () => router.push("/checkout/cart"),
},
menu: {
props: {
icon: "isax isax-more rotate-90",
severity: "secondary",
text: true,
rounded: true,
},
sorts: [
"mostRelevant", "mostVisited", "newest", "bestselling", "cheapest", "mostExpensive", "buyersSuggestion",
]
})
click: () =>
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
provide('config', config)
const { status, data } = await useFetch('/api/headers')
const { status, data, error } = await useFetch('/api/headers')
if (status.value == 'success')
sidebar.props = { menu: data.value }