+ {{ metric.label }}
+
+
+ {{ metric.value }}
+
@@ -10,60 +10,47 @@
-
-
-
-
-
-
-
-
-
-
-
-
- ![]()
- ![]()
-
-
- ![]()
- ![]()
-
-
-
+
+
+
![]()
-
+ :src="img_bottomGradiant"
+ alt=""
+ class="absolute z-10 w-full h-full object-cover"
+ />
+ ![]()
-
import pkg from '../package.json'
import {useRegisterSW} from 'virtual:pwa-register/vue'
-import {computed, h, onMounted, ref} from 'vue'
+import {computed, h, onMounted, ref, watch} from 'vue'
import img_topGradiant from '@/views/login/assets/img/gr_top_white.svg'
import img_pattern from '@/views/login/assets/img/pattern.svg'
import {LoadingOutlined} from '@ant-design/icons-vue'
@@ -123,9 +110,12 @@ import img_bottomGradiant from '@/views/login/assets/img/gr_bottom_white.svg'
import {DotLottieVue} from '@lottiefiles/dotlottie-vue'
import BasicButton from '@/components/BasicPacks/BasicButton.vue'
import {useConfigStore} from "@/store/configStore";
-import {getProjectFontFamily, getProjectLoginLogo, getProjectSplashBackground, getProjectBrandRed, hasCustomLoginLogoLayout, isBoursecuProject} from "@/utils/config";
+import {getProjectFontFamily, getProjectLoginLogo, getProjectSplashBackground, getProjectBrandRed, hasCustomLoginLogoLayout, isBoursecuProject, resetAppSurfaceBackground} from "@/utils/config";
import {ConfigProvider as AConfigProvider} from 'ant-design-vue'
import BasicIcon from "@/components/BasicPacks/BasicIcon.vue";
+import { useApplyDesktopLayoutClass } from '@/layouts/composables/useAppLayout'
+
+useApplyDesktopLayoutClass()
const {offlineReady, needRefresh, updateServiceWorker} = useRegisterSW()
const config = useConfigStore()
@@ -171,6 +161,12 @@ onMounted(async () => {
}, 2000)
})
+watch(showSplash, (visible) => {
+ if (!visible) {
+ resetAppSurfaceBackground()
+ }
+})
+
const versionDialog = ref(false)
function checkVersion() {
@@ -200,6 +196,7 @@ function update() {
--app-credit-footer-offset: calc(var(--app-credit-bar-inner) + var(--app-safe-bottom));
--app-nav-height: 80px;
--app-bottom-chrome-height: calc(var(--app-nav-height) + var(--app-credit-footer-offset));
+ --app-desktop-sidebar-width: 260px;
--app-add-card-height: 88px;
/* بخشی از کارت کیفپول زیر نوار «افزودن کارت جدید» دیده میشود */
--wallet-card-dock-overlap: 52px;
@@ -210,6 +207,16 @@ function update() {
--app-z-dialog: 5300;
}
+.app-main {
+ width: 100%;
+ min-height: 100vh;
+ opacity: 1 !important;
+}
+
+.desktopConfig {
+ min-height: 100vh;
+}
+
.app-credit-footer {
position: fixed;
bottom: 0;
@@ -249,10 +256,17 @@ function update() {
z-index: 9999;
}
-@media screen and (min-width: 426px) {
+@media screen and (min-width: 426px) and (max-width: 767.98px) {
.desktopConfig {
width: 426px;
position: relative !important;
}
}
+
+html.app-layout--desktop {
+ #support-button {
+ bottom: 12px;
+ right: calc(var(--app-desktop-sidebar-width, 260px) + 20px);
+ }
+}
diff --git a/src/assets/css/boursecu-theme.less b/src/assets/css/boursecu-theme.less
index 2740a3d..b98c440 100644
--- a/src/assets/css/boursecu-theme.less
+++ b/src/assets/css/boursecu-theme.less
@@ -1,4 +1,9 @@
html.project-boursecu {
+ .ant-input-group-addon {
+ background-color: @secondary-color !important;
+ color: @App-primary-color !important;
+ }
+
.text-red,
.text-red-600,
.text-red-700,
diff --git a/src/assets/css/main.less b/src/assets/css/main.less
index 38eb0e3..90bebb4 100644
--- a/src/assets/css/main.less
+++ b/src/assets/css/main.less
@@ -2,9 +2,29 @@
@import (less) './fonts.less';
@import (less) './ant.less';
@import (less) './boursecu-theme.less';
+@import (less) '../../layouts/styles/desktop-shell.less';
+@import (less) '../../layouts/styles/mobile-frame.less';
+@import (less) '../../views/login/desktop/styles/desktop-auth.less';
+@import (less) '../../views/base/user/desktop/styles/desktop-user.less';
+@import (less) '../../views/base/products/desktop/styles/desktop-products.less';
+@import (less) '../../views/base/transactions/desktop/styles/desktop-transactions.less';
+@import (less) '../../views/base/wallet/desktop/styles/desktop-wallet.less';
+@import (less) '../../views/base/priceTrigger/desktop/styles/desktop-price-trigger.less';
+@import (less) '../../views/base/about/desktop/styles/desktop-about.less';
+@import (less) '../../views/base/rules/desktop/styles/desktop-rules.less';
+@import (less) '../../views/base/rules/permissions/desktop/styles/desktop-permissions.less';
+@import (less) '../../views/base/giftCard/desktop/styles/desktop-gift-card.less';
+@import (less) '../../views/base/address/desktop/styles/desktop-address.less';
+@import (less) '../../views/base/educate/desktop/styles/desktop-educate.less';
+@import (less) '../../views/base/aboutUs/desktop/styles/desktop-about-us.less';
+@import (less) '../../views/base/earnMoney/desktop/styles/desktop-earn-money.less';
+@import (less) '../../views/base/physicalReceive/desktop/styles/desktop-physical-receive.less';
+@import (less) '../../views/base/fund/desktop/styles/desktop-fund.less';
+@import (less) '../../views/base/gold/desktop/styles/desktop-gold.less';
html {
scroll-behavior: smooth;
+ background-color: @prefixCls-background-color;
}
body {
@@ -34,7 +54,7 @@ body {
@apply flex justify-center relative;
position: relative;
}
-@media screen and (min-width: 426px) {
+@media screen and (min-width: 426px) and (max-width: 767.98px) {
.van-popup--bottom.van-popup--round {
width: 426px;
left: calc(50vw - 213px);
@@ -44,10 +64,31 @@ body {
position: fixed;
right: 0;
left: 0;
- @media screen and (min-width: 426px) {
+ width: 100%;
+ max-width: 100vw;
+ box-sizing: border-box;
+
+ @media screen and (min-width: 426px) and (max-width: 767.98px) {
width: 426px;
- left: auto;
+ max-width: 426px;
+ left: 50%;
right: auto;
+ transform: translateX(-50%);
+ }
+}
+
+html.app-layout--desktop {
+ @media screen and (min-width: 426px) {
+ .van-popup--bottom.van-popup--round {
+ width: min(480px, calc(100vw - var(--app-desktop-sidebar-width, 260px) - 48px));
+ left: calc(
+ (100vw - var(--app-desktop-sidebar-width, 260px) - min(480px, calc(100vw - var(--app-desktop-sidebar-width, 260px) - 48px))) / 2
+ );
+ }
+ }
+
+ #goftino_w {
+ right: calc(var(--app-desktop-sidebar-width, 260px) + 20px) !important;
}
}
diff --git a/src/components/ListAnim.vue b/src/components/ListAnim.vue
index d091156..2cd105e 100644
--- a/src/components/ListAnim.vue
+++ b/src/components/ListAnim.vue
@@ -33,16 +33,7 @@ $total-items: 6
animation: 1s ease slideInFromRight
animation-fill-mode: both
-//@if($counter < 13)
-// .animate > div
- animation: 1s ease 0s 1 slideInFromRight
- animation-fill-mode: both
-//transform: translateX(100%)
-//@for $i from 1 through $total-items
-// .animate:nth-child(#{$i})
-// animation-delay: .25s * $i
-
-//transform: translateX(100%)
+// Duplicate animation block removed — was leaking styles without a selector
@keyframes slideInFromRight
0%
diff --git a/src/components/SupportContactBar.vue b/src/components/SupportContactBar.vue
new file mode 100644
index 0000000..895f619
--- /dev/null
+++ b/src/components/SupportContactBar.vue
@@ -0,0 +1,38 @@
+
+ ()
+const inflight = new Map>()
+
+export async function runOnceAsync(key: string, fn: () => Promise, force = false): Promise {
+ if (!force && cache.has(key)) {
+ return cache.get(key) as T
+ }
+
+ if (!force && inflight.has(key)) {
+ return inflight.get(key) as Promise
+ }
+
+ const promise = fn()
+ .then((result) => {
+ cache.set(key, result)
+ return result
+ })
+ .finally(() => {
+ if (inflight.get(key) === promise) {
+ inflight.delete(key)
+ }
+ })
+
+ inflight.set(key, promise)
+ return promise
+}
+
+export function resetOnceAsync(key: string) {
+ cache.delete(key)
+ inflight.delete(key)
+}
+
+export function resetOnceAsyncByPrefix(prefix: string) {
+ for (const key of [...cache.keys(), ...inflight.keys()]) {
+ if (key.startsWith(prefix)) {
+ resetOnceAsync(key)
+ }
+ }
+}
diff --git a/src/composables/useProductsCatalog.ts b/src/composables/useProductsCatalog.ts
new file mode 100644
index 0000000..bdb24ce
--- /dev/null
+++ b/src/composables/useProductsCatalog.ts
@@ -0,0 +1,32 @@
+import { getProducts } from '@/api/products'
+import type { Product } from '@/models/products'
+
+/** Shared product catalog — dedupes getProducts() across wallet assets and chart offset. */
+let catalogCache: Product[] | null = null
+let catalogPromise: Promise | null = null
+
+export function getProductsCatalog(force = false): Promise {
+ if (!force && catalogCache) {
+ return Promise.resolve(catalogCache)
+ }
+
+ if (!force && catalogPromise) {
+ return catalogPromise
+ }
+
+ catalogPromise = getProducts()
+ .then((products) => {
+ catalogCache = products ?? []
+ return catalogCache
+ })
+ .finally(() => {
+ catalogPromise = null
+ })
+
+ return catalogPromise
+}
+
+export function clearProductsCatalog() {
+ catalogCache = null
+ catalogPromise = null
+}
diff --git a/src/composables/useWalletAssets.ts b/src/composables/useWalletAssets.ts
index ad20133..8cb9bf4 100644
--- a/src/composables/useWalletAssets.ts
+++ b/src/composables/useWalletAssets.ts
@@ -1,6 +1,6 @@
import { ref } from 'vue'
import { getWalletAssets } from '@/api/wallet'
-import { getProducts } from '@/api/products'
+import { getProductsCatalog } from '@/composables/useProductsCatalog'
import type { WalletAssetsSummary } from '@/models/walletAssets'
import { enrichInventoryCardsWithCatalog } from '@/utils/productAssets'
@@ -17,8 +17,8 @@ export function useWalletAssets() {
return assetsPromise
}
- // سرور مرجع داراییهاست (main_wallet_products هم سمت سرور هندل میشود)؛ کلاینت فقط نمایش میدهد
- assetsPromise = Promise.all([getWalletAssets(), getProducts()])
+ // Reuses cached getProductsCatalog() — same catalog as chart offset logic
+ assetsPromise = Promise.all([getWalletAssets(), getProductsCatalog(force)])
.then(([data, catalog]) => {
assetsSummary.value = {
...data,
diff --git a/src/config-loader.js b/src/config-loader.js
index cdedbf4..a4078c5 100644
--- a/src/config-loader.js
+++ b/src/config-loader.js
@@ -97,6 +97,16 @@
window.__APP_CONFIG__ = config
window.__CONFIG_READY__ = true
+ // Early splash background — full viewport before Vue mounts
+ const projectName = config?.user?.name
+ if (projectName === 'boursecu') {
+ const splashBg = '#133050'
+ document.documentElement.style.backgroundColor = splashBg
+ document.body.style.backgroundColor = splashBg
+ const metaTheme = document.querySelector('meta[name="theme-color"]')
+ if (metaTheme) metaTheme.setAttribute('content', splashBg)
+ }
+
// Resolve the promise
if (configResolve) {
configResolve(config)
diff --git a/src/layouts/AppLayoutShell.vue b/src/layouts/AppLayoutShell.vue
new file mode 100644
index 0000000..2752ab6
--- /dev/null
+++ b/src/layouts/AppLayoutShell.vue
@@ -0,0 +1,12 @@
+
+ ` outside responsive chrome wrappers so child routes are not remounted.
+ * 4. Mobile/Desktop views consume shared state via provide/inject — they must not fetch independently.
+ * 5. Prefer store/composable request dedup (in-flight promise + cached result) for shared data.
+ */
+
+export const RESPONSIVE_HIDDEN_CLASS = 'responsive-pane--hidden'
diff --git a/src/layouts/config/navigation.ts b/src/layouts/config/navigation.ts
new file mode 100644
index 0000000..5186129
--- /dev/null
+++ b/src/layouts/config/navigation.ts
@@ -0,0 +1,29 @@
+import { isBoursecuProject } from '@/utils/config'
+import type { AppNavItem } from '../types'
+
+const BOURSECU_PRIMARY_NAV: AppNavItem[] = [
+ { id: 'buyProduct', routeName: 'buyProduct', label: 'سفارشها', icon: 'vuesax-linear:box' },
+ { id: 'transactions', routeName: 'transactions', label: 'تراکنشها', icon: 'vuesax-linear:receipt-item' },
+ { id: 'home', routeName: 'home', label: 'صفحه اصلی', icon: 'vuesax-linear:home' },
+ { id: 'wallet', routeName: 'wallet', label: 'کیف پول', icon: 'vuesax-linear:wallet-1' },
+ { id: 'user', routeName: 'user', label: 'تنظیمات', icon: 'vuesax-linear:setting-2' },
+]
+
+const DEFAULT_PRIMARY_NAV: AppNavItem[] = [
+ { id: 'home', routeName: 'home', label: 'صفحه اصلی', icon: 'vuesax-linear:home' },
+ { id: 'transactions', routeName: 'transactions', label: 'گزارش', icon: 'vuesax-linear:receipt-item' },
+ { id: 'buyProduct', routeName: 'buyProduct', label: 'محصولات', icon: 'vuesax-linear:coin' },
+ { id: 'wallet', routeName: 'wallet', label: 'کیف پول', icon: 'vuesax-linear:wallet-1' },
+ { id: 'user', routeName: 'user', label: 'تنظیمات', icon: 'vuesax-linear:setting-2' },
+]
+
+export const SECONDARY_NAV: AppNavItem[] = [
+ { id: 'notifyTrigger', routeName: 'notifyTrigger', label: 'هشدار قیمت', icon: 'vuesax-linear:bill' },
+ { id: 'about', routeName: 'about', label: 'درباره ما', icon: 'vuesax-linear:info-circle' },
+ { id: 'rules', routeName: 'rules', label: 'قوانین و مقررات', icon: 'vuesax-linear:task' },
+ { id: 'giftCard', routeName: 'giftCard', label: 'ثبت کارت هدیه', icon: 'vuesax-linear:gift' },
+]
+
+export function getPrimaryNavItems(): AppNavItem[] {
+ return isBoursecuProject() ? BOURSECU_PRIMARY_NAV : DEFAULT_PRIMARY_NAV
+}
diff --git a/src/layouts/constants.ts b/src/layouts/constants.ts
new file mode 100644
index 0000000..409b42f
--- /dev/null
+++ b/src/layouts/constants.ts
@@ -0,0 +1,4 @@
+/** Minimum viewport width for desktop app shell (sidebar layout). */
+export const DESKTOP_LAYOUT_MIN_WIDTH = 768
+
+export const DESKTOP_SIDEBAR_WIDTH = 260
diff --git a/src/layouts/desktop/DesktopAppLayout.vue b/src/layouts/desktop/DesktopAppLayout.vue
new file mode 100644
index 0000000..923698c
--- /dev/null
+++ b/src/layouts/desktop/DesktopAppLayout.vue
@@ -0,0 +1,40 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/layouts/mobile/mobile-layout.less b/src/layouts/mobile/mobile-layout.less
new file mode 100644
index 0000000..9a1b821
--- /dev/null
+++ b/src/layouts/mobile/mobile-layout.less
@@ -0,0 +1,145 @@
+.bottom-appbar {
+ z-index: var(--app-z-nav, 5000);
+ height: var(--app-nav-height, 80px);
+ position: fixed;
+ display: flex;
+ justify-content: space-evenly;
+ background: #fff;
+ bottom: var(--app-credit-footer-offset, 28px);
+ right: 0;
+ left: 0;
+ width: 100%;
+ max-width: 100vw;
+ box-sizing: border-box;
+
+ @media screen and (min-width: 426px) {
+ width: 426px;
+ max-width: 426px;
+ left: 50%;
+ right: auto;
+ transform: translateX(-50%);
+ }
+
+ .tabs {
+ display: flex;
+ height: 100%;
+ width: 100%;
+ background: #fff;
+ justify-content: space-between;
+ position: absolute;
+ bottom: 0;
+ z-index: 400;
+ box-shadow: 0 -2px 4px -2px #0000001a;
+
+ .tab {
+ width: 80px;
+ text-align: center;
+ flex-flow: column;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ align-content: center;
+ }
+
+ .main_in {
+ width: 70px;
+ height: 70px;
+ flex-shrink: 0;
+ align-self: center;
+
+ .circle_in {
+ margin-top: -10px;
+ border-radius: 50%;
+ width: 70px;
+ height: 70px;
+ flex-shrink: 0;
+ z-index: 20;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ align-content: center;
+ flex-wrap: wrap;
+ background-color: @App-primary-color;
+
+ .circle_into {
+ overflow: hidden;
+ @apply bg-primary;
+ border-radius: 50%;
+ width: 56px;
+ height: 56px;
+ flex-shrink: 0;
+ display: flex;
+ justify-content: center;
+ align-content: center;
+ flex-wrap: wrap;
+ border: white 1px solid;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ }
+ }
+ }
+
+ .circle_in.is-white-nav-logo {
+ .circle_into {
+ background: #fff !important;
+ border-color: rgba(0, 0, 0, 0.08);
+ }
+ }
+ }
+ }
+
+ .main {
+ height: 70px;
+ width: 70px;
+ position: relative;
+
+ .circle {
+ border-radius: 50%;
+ height: 70px;
+ width: 70px;
+ z-index: 20;
+ box-shadow: 0 -5px 4px -2px #0000001a;
+ position: absolute;
+ }
+ }
+}
+
+.v-enter-active,
+.v-leave-active {
+ transition: opacity 0.5s ease;
+}
+
+.v-enter-from,
+.v-leave-to {
+ opacity: 0;
+}
+
+.slide-fade-enter-active {
+ transition: all 0.3s ease-out;
+}
+
+.slide-fade-leave-active {
+ transition: all 0.4s cubic-bezier(1, 0.5, 0.8, 1);
+}
+
+.slide-fade-enter-from,
+.slide-fade-leave-to {
+ transform: translateX(20px);
+ opacity: 0;
+}
+
+.main-with-bottom-chrome {
+ height: calc(100vh - 72px - var(--app-credit-footer-offset, 28px));
+}
+
+.main-with-bottom-chrome-inner {
+ height: calc(100vh - 72px - var(--app-credit-footer-offset, 28px));
+}
+
+.main-with-bottom-chrome--no-nav,
+.main-with-bottom-chrome--no-nav .main-with-bottom-chrome-inner {
+ height: calc(100vh - var(--app-credit-footer-offset, 28px));
+}
diff --git a/src/layouts/styles/desktop-shell.less b/src/layouts/styles/desktop-shell.less
new file mode 100644
index 0000000..034a291
--- /dev/null
+++ b/src/layouts/styles/desktop-shell.less
@@ -0,0 +1,126 @@
+@desktop-layout-min: 768px;
+@mobile-frame-max: 767.98px;
+
+/**
+ * Full-width desktop shell — applies on first paint (no JS class needed).
+ * Sidebar-specific wrap-fix offset stays on html.app-layout--desktop.
+ */
+@media screen and (min-width: @desktop-layout-min) {
+ html {
+ width: 100%;
+ overflow-x: hidden;
+ }
+
+ body {
+ display: block;
+ width: 100%;
+ min-width: 100%;
+ margin: 0;
+ padding: 0;
+ }
+
+ #app {
+ width: 100%;
+ max-width: none;
+ min-height: 100vh;
+ }
+
+ .desktopConfig {
+ position: static !important;
+ width: 100% !important;
+ max-width: none !important;
+ min-height: 100vh;
+ left: auto !important;
+ right: auto !important;
+ }
+
+ .wrap-fix {
+ width: auto !important;
+ max-width: none !important;
+ left: 0 !important;
+ right: 0 !important;
+ }
+
+ :root {
+ --app-credit-bar-inner: 0px;
+ --app-credit-footer-offset: 0px;
+ }
+
+ .app-credit-footer {
+ display: none !important;
+ }
+
+ /* Teleport to body escapes parent v-show — hide mobile dock chrome on desktop */
+ .app-dock-add-bar,
+ .wallet-card-slider {
+ display: none !important;
+ }
+
+ .transaction-list,
+ .card-slider-wrap {
+ width: 100% !important;
+ max-width: none !important;
+ left: 0 !important;
+ right: 0 !important;
+ margin-left: 0 !important;
+ margin-right: 0 !important;
+ }
+}
+
+html.app-layout--desktop {
+ @media screen and (min-width: @desktop-layout-min) {
+ .wrap-fix {
+ right: var(--app-desktop-sidebar-width, 260px) !important;
+ }
+ }
+
+ &.app-layout--desktop-no-sidebar .wrap-fix {
+ right: 0 !important;
+ }
+}
+
+/* Splash — always full viewport; never sidebar-offset */
+.app-splash-screen {
+ position: fixed;
+ inset: 0;
+ width: 100vw;
+ min-height: 100vh;
+ max-width: none;
+ left: 0 !important;
+ right: 0 !important;
+ z-index: 1000000000000;
+
+ &__gradient {
+ position: absolute;
+ left: 0;
+ right: 0;
+ width: 100%;
+
+ &--top {
+ top: 0;
+ }
+
+ &--bottom {
+ bottom: 0;
+ }
+ }
+}
+
+html.app-layout--desktop .app-splash-screen {
+ right: 0 !important;
+ left: 0 !important;
+ width: 100vw !important;
+}
+
+/* Login — full viewport on desktop */
+html.app-layout--desktop {
+ .login-page-root,
+ .dauth {
+ width: 100% !important;
+ min-height: 100vh;
+ }
+
+ .dauth__layout {
+ min-height: 100vh;
+ }
+}
diff --git a/src/layouts/styles/mobile-frame.less b/src/layouts/styles/mobile-frame.less
new file mode 100644
index 0000000..1dc33dd
--- /dev/null
+++ b/src/layouts/styles/mobile-frame.less
@@ -0,0 +1,84 @@
+/**
+ * Mobile shell width rules.
+ * Below 426px: full viewport (phones).
+ * 426px–767px: centered 426px frame (tablet-ish mobile).
+ */
+
+html:not(.app-layout--desktop) {
+ /* Teleport to body — dock bar must span viewport, not shrink to content */
+ .app-dock-add-bar,
+ .wallet-card-slider {
+ box-sizing: border-box;
+ }
+
+ @media screen and (max-width: 425.98px) {
+ body {
+ display: block !important;
+ width: 100% !important;
+ overflow-x: hidden;
+ }
+
+ #app,
+ .desktopConfig,
+ .app-main,
+ .main-with-bottom-chrome,
+ .main-with-bottom-chrome-inner {
+ width: 100% !important;
+ max-width: 100vw !important;
+ min-width: 0 !important;
+ margin: 0 !important;
+ }
+
+ .wrap-fix,
+ .bottom-appbar {
+ width: 100% !important;
+ max-width: 100vw !important;
+ left: 0 !important;
+ right: 0 !important;
+ margin: 0 !important;
+ transform: none !important;
+ }
+
+ .app-dock-add-bar,
+ .wallet-card-slider {
+ width: 100% !important;
+ max-width: 100vw !important;
+ left: 0 !important;
+ right: 0 !important;
+ margin: 0 !important;
+ transform: none !important;
+ }
+ }
+
+ @media screen and (min-width: 426px) and (max-width: 767.98px) {
+ body {
+ display: flex !important;
+ justify-content: center;
+ }
+
+ .desktopConfig {
+ width: 426px !important;
+ max-width: 426px !important;
+ }
+
+ .wrap-fix,
+ .bottom-appbar {
+ width: 426px !important;
+ max-width: 426px !important;
+ left: 50% !important;
+ right: auto !important;
+ margin: 0 !important;
+ transform: translateX(-50%) !important;
+ }
+
+ .app-dock-add-bar,
+ .wallet-card-slider {
+ width: 426px !important;
+ max-width: 426px !important;
+ left: 50% !important;
+ right: auto !important;
+ margin: 0 !important;
+ transform: translateX(-50%) !important;
+ }
+ }
+}
diff --git a/src/layouts/types.ts b/src/layouts/types.ts
new file mode 100644
index 0000000..0a9d464
--- /dev/null
+++ b/src/layouts/types.ts
@@ -0,0 +1,6 @@
+export interface AppNavItem {
+ id: string
+ routeName: string
+ label: string
+ icon: string
+}
diff --git a/src/store/settingsStore.ts b/src/store/settingsStore.ts
index 828a20c..7a80678 100644
--- a/src/store/settingsStore.ts
+++ b/src/store/settingsStore.ts
@@ -3,6 +3,7 @@ import { defineStore } from 'pinia'
import { getSettings } from '@/api/configuration'
import { resolveMeltedGoldLabel, resolveMetalTypeLabel } from '@/utils/metalLabels'
import { resolveTradeWeightUnit } from '@/utils/weightUnit'
+import { runOnceAsync } from '@/composables/useOnceAsync'
export interface AppSetting {
id?: number
@@ -45,17 +46,20 @@ export const useSettingsStore = defineStore('settings', () => {
settings.value = merged
}
- async function fetchSettings() {
- try {
- const data = await getSettings()
- if (Array.isArray(data)) {
- mergeSettings(data)
+ async function fetchSettings(force = false) {
+ return runOnceAsync('settings:all', async () => {
+ try {
+ const data = await getSettings()
+ if (Array.isArray(data)) {
+ mergeSettings(data)
+ }
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loaded.value = true
}
- } catch (e) {
- console.log(e)
- } finally {
- loaded.value = true
- }
+ return settings.value
+ }, force)
}
const metalTypeSettingValue = computed(() => getSettingByKey('metal_type'))
diff --git a/src/utils/config.ts b/src/utils/config.ts
index fa96c1e..29aa636 100644
--- a/src/utils/config.ts
+++ b/src/utils/config.ts
@@ -114,7 +114,7 @@ export function getProjectLoginTaglineLines() {
}
return [
- 'بورس مس مرجع هوشمند معاملات',
+ 'مرجع هوشمند معاملات',
' و سرمایهگذاری در صنعت مس',
]
}
@@ -123,6 +123,18 @@ export function getProjectSplashBackground() {
return isBoursecuProject() ? BOURSECU_BRAND_NAV : '#ffffff'
}
+/** Reset splash-time inline backgrounds so mobile overscroll shows white again. */
+export function resetAppSurfaceBackground() {
+ const background = '#ffffff'
+ document.documentElement.style.backgroundColor = background
+ document.body.style.backgroundColor = background
+
+ const metaTheme = document.querySelector('meta[name="theme-color"]')
+ if (metaTheme) {
+ metaTheme.setAttribute('content', background)
+ }
+}
+
export function getProjectFontFamily() {
return getConfigApp('name') === 'boursecu' ? "'dana', sans-serif" : "'iran-sans', sans-serif"
}
@@ -142,6 +154,7 @@ export function applyProjectTheme() {
}
document.documentElement.classList.add('project-boursecu')
+ document.documentElement.style.setProperty('--App-brand-nav', BOURSECU_BRAND_NAV)
document.documentElement.style.setProperty('--App-brand-red', BOURSECU_BRAND_RED)
document.documentElement.style.setProperty('--App-brand-red-50', '#f8ecec')
document.documentElement.style.setProperty('--App-brand-red-100', '#f0d8d8')
diff --git a/src/utils/persianDigits.ts b/src/utils/persianDigits.ts
new file mode 100644
index 0000000..76a9d4e
--- /dev/null
+++ b/src/utils/persianDigits.ts
@@ -0,0 +1,29 @@
+const PERSIAN_DIGITS = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹'] as const
+
+export function toPersianDigits(value: string | number | null | undefined): string {
+ if (value === null || value === undefined) return ''
+ return String(value).replace(/\d/g, (digit) => PERSIAN_DIGITS[Number(digit)] ?? digit)
+}
+
+export function toEnglishDigits(value: string): string {
+ return value.replace(/[۰-۹]/g, (digit) => {
+ const index = PERSIAN_DIGITS.indexOf(digit as (typeof PERSIAN_DIGITS)[number])
+ return index >= 0 ? String(index) : digit
+ })
+}
+
+export function formatFixed(value: string | number | null | undefined, decimals = 2): string {
+ const num = Number(value)
+ if (!Number.isFinite(num)) return toPersianDigits(String(value ?? ''))
+ return toPersianDigits(num.toFixed(decimals))
+}
+
+export function formatPercent(
+ value: number,
+ decimals = 2,
+ options: { showSign?: boolean; suffix?: string } = {},
+): string {
+ const { showSign = false, suffix = '%' } = options
+ const prefix = showSign && value > 0 ? '+' : value < 0 ? '-' : showSign ? '+' : ''
+ return `${prefix}${formatFixed(Math.abs(value), decimals)}${suffix}`
+}
diff --git a/src/utils/productAssets.ts b/src/utils/productAssets.ts
index fb2cd43..ca1b347 100644
--- a/src/utils/productAssets.ts
+++ b/src/utils/productAssets.ts
@@ -1,3 +1,4 @@
+import { toPersianDigits } from '@/utils/persianDigits'
import type { Product } from '@/models/products'
import type { UserWalletLine } from '@/models/wallet'
import type { ProductFile } from '@/utils/file'
diff --git a/src/utils/productPrice.ts b/src/utils/productPrice.ts
index ed67af2..6b021e3 100644
--- a/src/utils/productPrice.ts
+++ b/src/utils/productPrice.ts
@@ -2,13 +2,37 @@ import type { Product } from '@/models/products'
import { getTradeBuyPrice, getTradeSellPrice, lastPrice } from '@/utils/price'
import { isMetalCommodityGroup, isMeltedProductUsingAppPrice, isMeltedTradeGroup } from '@/utils/productCategories'
-function applyPriceOffsetPercent(basePrice: number, offsetPercent?: number | null) {
+export function resolvePriceOffsetRatio(offsetPercent?: number | null) {
const offset = Number(offsetPercent ?? 0)
if (!offset) {
+ return 0
+ }
+
+ // 5 => 5% ، 0.05 => 5% (اعشاری)
+ if (Math.abs(offset) > 0 && Math.abs(offset) < 1) {
+ return offset
+ }
+
+ return offset / 100
+}
+
+export function applyPriceOffsetPercent(basePrice: number, offsetPercent?: number | null) {
+ const ratio = resolvePriceOffsetRatio(offsetPercent)
+ if (!ratio) {
return basePrice
}
- return Math.round(basePrice * (1 + offset / 100))
+ return Math.round(basePrice * (1 + ratio))
+}
+
+/** boursecu chart: قیمت + (قیمت × offset) */
+export function applyChartPriceOffset(basePrice: number, offsetPercent?: number | null) {
+ const ratio = resolvePriceOffsetRatio(offsetPercent)
+ if (!ratio) {
+ return basePrice
+ }
+
+ return Math.round(basePrice + basePrice * ratio)
}
/** قیمت خرید نمایشی محصول (همان مقداری که در لیست و اکشنشیت نشان داده میشود) */
diff --git a/src/views/base/about/components/AboutSectionsContent.vue b/src/views/base/about/components/AboutSectionsContent.vue
new file mode 100644
index 0000000..92bdcea
--- /dev/null
+++ b/src/views/base/about/components/AboutSectionsContent.vue
@@ -0,0 +1,67 @@
+
+
+ aboutSections: ComputedRef
+ isBoursecu: ComputedRef
+ isBoursecuProject: typeof isBoursecuProject
+ getProjectSupportPhoneLink: typeof getProjectSupportPhoneLink
+ getProjectBaleLink: typeof getProjectBaleLink
+}
+
+export const ABOUT_PAGE_CONTEXT_KEY: InjectionKey = Symbol('aboutPageContext')
+
+export function useAboutPage() {
+ const config = useConfigStore()
+ const nameProject = config.config.name_fa
+
+ const isBoursecu = computed(() => isBoursecuProject())
+
+ const aboutSections = computed(() => getAboutSections(nameProject, isBoursecu.value))
+
+ const context: AboutPageContext = {
+ config,
+ aboutSections,
+ isBoursecu,
+ isBoursecuProject,
+ getProjectSupportPhoneLink,
+ getProjectBaleLink,
+ }
+
+ provide(ABOUT_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useAboutPageContext() {
+ const context = inject(ABOUT_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useAboutPageContext must be used within a page that calls useAboutPage()')
+ }
+ return context
+}
diff --git a/src/views/base/about/desktop/DesktopAboutView.vue b/src/views/base/about/desktop/DesktopAboutView.vue
new file mode 100644
index 0000000..cd81c73
--- /dev/null
+++ b/src/views/base/about/desktop/DesktopAboutView.vue
@@ -0,0 +1,50 @@
+
+
+ ![]()
+ ![]()
+
+
-
-
- نسخه: {{ pkg.version }}
-
-
-
+
+
+ ![]()
+
+
+
-
+
+ نسخه: {{ pkg.version }}
+
+
+
+
+
+
+ تماس با پشتیبانی
+
+
+ 
+
+
+
+
+
diff --git a/src/composables/useOnceAsync.ts b/src/composables/useOnceAsync.ts
new file mode 100644
index 0000000..faf1de5
--- /dev/null
+++ b/src/composables/useOnceAsync.ts
@@ -0,0 +1,44 @@
+/**
+ * Deduplicate async work across remounts (e.g. accidental v-if layout switches).
+ * Prefer fixing layout with v-show + parent-level fetch; use this in stores/shared loaders.
+ */
+
+const cache = new Map
+
+
+
+
+
+
+
+
diff --git a/src/layouts/composables/useAppLayout.ts b/src/layouts/composables/useAppLayout.ts
new file mode 100644
index 0000000..1de3af2
--- /dev/null
+++ b/src/layouts/composables/useAppLayout.ts
@@ -0,0 +1,34 @@
+import { useMediaQuery } from '@vueuse/core'
+import { onUnmounted, watch } from 'vue'
+import { DESKTOP_LAYOUT_MIN_WIDTH } from '../constants'
+
+const DESKTOP_LAYOUT_CLASS = 'app-layout--desktop'
+
+export function useDesktopBreakpoint() {
+ return useMediaQuery(`(min-width: ${DESKTOP_LAYOUT_MIN_WIDTH}px)`)
+}
+
+/** Apply html class for global desktop shell styles. Call once from App.vue. */
+export function useApplyDesktopLayoutClass() {
+ const isDesktopLayout = useDesktopBreakpoint()
+
+ const stop = watch(
+ isDesktopLayout,
+ (desktop) => {
+ document.documentElement.classList.toggle(DESKTOP_LAYOUT_CLASS, desktop)
+ },
+ { immediate: true },
+ )
+
+ onUnmounted(() => {
+ stop()
+ document.documentElement.classList.remove(DESKTOP_LAYOUT_CLASS)
+ })
+}
+
+/** @deprecated use useDesktopBreakpoint + useApplyDesktopLayoutClass */
+export function useAppLayout() {
+ const isDesktopLayout = useDesktopBreakpoint()
+ useApplyDesktopLayoutClass()
+ return { isDesktopLayout }
+}
diff --git a/src/layouts/composables/useAppNavigation.ts b/src/layouts/composables/useAppNavigation.ts
new file mode 100644
index 0000000..7a65a9d
--- /dev/null
+++ b/src/layouts/composables/useAppNavigation.ts
@@ -0,0 +1,43 @@
+import { computed, ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+
+export function useAppNavigation() {
+ const router = useRouter()
+ const route = useRoute()
+
+ const popVisible = ref(false)
+ const currentRoute = computed(() => route.name)
+ const hideMenu = computed(() => !!route.meta.hideMenu)
+
+ function isNavActive(routeName: string) {
+ return currentRoute.value === routeName
+ }
+
+ function navItemClass(routeName: string) {
+ return isNavActive(routeName) ? 'text-primary' : 'text-gray-400'
+ }
+
+ function navigateTo(routeName: string) {
+ popVisible.value = false
+ router.push({ name: routeName })
+ }
+
+ function toggleOverflowMenu() {
+ popVisible.value = !popVisible.value
+ }
+
+ function closeOverflowMenu() {
+ popVisible.value = false
+ }
+
+ return {
+ popVisible,
+ currentRoute,
+ hideMenu,
+ isNavActive,
+ navItemClass,
+ navigateTo,
+ toggleOverflowMenu,
+ closeOverflowMenu,
+ }
+}
diff --git a/src/layouts/composables/useResponsiveLayout.ts b/src/layouts/composables/useResponsiveLayout.ts
new file mode 100644
index 0000000..879723e
--- /dev/null
+++ b/src/layouts/composables/useResponsiveLayout.ts
@@ -0,0 +1,21 @@
+import { useMediaQuery } from '@vueuse/core'
+import { DESKTOP_LAYOUT_MIN_WIDTH } from '../constants'
+
+/**
+ * Reactive desktop breakpoint. Use only for UI switching — never tie API calls to this ref.
+ */
+export function useDesktopBreakpoint() {
+ return useMediaQuery(`(min-width: ${DESKTOP_LAYOUT_MIN_WIDTH}px)`)
+}
+
+/**
+ * Guidelines for responsive pages (Vue):
+ *
+ * 1. Call page composables (with onMounted fetch) exactly once in the route `index.vue` shell.
+ * 2. Switch Mobile/Desktop views with `v-show`, not `v-if`, so resize does not destroy children.
+ * 3. Keep `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/layouts/desktop/DesktopNavItem.vue b/src/layouts/desktop/DesktopNavItem.vue
new file mode 100644
index 0000000..729ad61
--- /dev/null
+++ b/src/layouts/desktop/DesktopNavItem.vue
@@ -0,0 +1,25 @@
+
+
+
+
+
diff --git a/src/layouts/desktop/DesktopSidebar.vue b/src/layouts/desktop/DesktopSidebar.vue
new file mode 100644
index 0000000..1f79045
--- /dev/null
+++ b/src/layouts/desktop/DesktopSidebar.vue
@@ -0,0 +1,55 @@
+
+
+
+
+
diff --git a/src/layouts/desktop/desktop-layout.less b/src/layouts/desktop/desktop-layout.less
new file mode 100644
index 0000000..cf0a758
--- /dev/null
+++ b/src/layouts/desktop/desktop-layout.less
@@ -0,0 +1,157 @@
+.desktop-app-layout {
+ display: flex;
+ flex-direction: row;
+ min-height: 100vh;
+ width: 100%;
+ max-width: 100vw;
+ background: @prefixCls-background-color;
+}
+
+.desktop-app-layout__main {
+ flex: 1;
+ min-width: 0;
+ height: 100vh;
+ overflow: hidden;
+}
+
+.desktop-app-layout__main--full {
+ width: 100%;
+}
+
+.desktop-app-layout__content {
+ height: 100vh;
+ width: 100%;
+ min-height: 100vh;
+ overflow-y: auto;
+ overflow-x: hidden;
+ background: @prefixCls-background-color;
+}
+
+.desktop-sidebar {
+ flex-shrink: 0;
+ width: var(--app-desktop-sidebar-width, 260px);
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ background: #fff;
+ position: sticky;
+ top: 0;
+ z-index: 100;
+ padding: 20px 12px 16px;
+ box-sizing: border-box;
+}
+
+.desktop-sidebar--boursecu {
+ background: var(--App-brand-nav, #133050);
+
+ .desktop-sidebar__divider {
+ background: rgba(255, 255, 255, 0.12);
+ }
+
+ .desktop-nav-item {
+ color: rgba(255, 255, 255, 0.72);
+
+ &:hover {
+ background: rgba(255, 255, 255, 0.08);
+ color: #fff;
+ }
+
+ &--active {
+ background: rgba(255, 255, 255, 0.14);
+ color: #fff;
+
+ .desktop-nav-item__icon {
+ color: #fff;
+ }
+ }
+ }
+
+ .desktop-nav-item__icon {
+ color: rgba(255, 255, 255, 0.85);
+ }
+
+ .desktop-sidebar__logo {
+ max-width: 200px;
+ max-height: 80px;
+ }
+}
+
+.desktop-sidebar__brand {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 8px 12px 20px;
+ margin-bottom: 4px;
+}
+
+.desktop-sidebar__logo {
+ max-width: 140px;
+ max-height: 48px;
+ width: auto;
+ height: auto;
+ object-fit: contain;
+}
+
+.desktop-sidebar__section {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+}
+
+.desktop-sidebar__section--secondary {
+ margin-top: auto;
+}
+
+.desktop-sidebar__divider {
+ height: 1px;
+ background: rgba(0, 0, 0, 0.08);
+ margin: 12px 8px;
+}
+
+.desktop-nav-item {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ width: 100%;
+ padding: 10px 12px;
+ border: none;
+ border-radius: 10px;
+ background: transparent;
+ cursor: pointer;
+ text-align: right;
+ font-family: inherit;
+ font-size: 14px;
+ font-weight: 600;
+ color: #6b7280;
+ transition: background 0.15s ease, color 0.15s ease;
+
+ &:hover {
+ background: rgba(0, 0, 0, 0.04);
+ color: @App-primary-color;
+ }
+
+ &--active {
+ background: rgba(0, 0, 0, 0.05);
+ color: @App-primary-color;
+
+ .desktop-nav-item__icon {
+ color: @App-primary-color;
+ }
+ }
+}
+
+.desktop-nav-item__icon {
+ flex-shrink: 0;
+ color: #9ca3af;
+}
+
+.desktop-nav-item__label {
+ flex: 1;
+ line-height: 1.3;
+}
+
+.desktop-sidebar__section--secondary .desktop-nav-item {
+ font-size: 13px;
+ font-weight: 500;
+ padding: 8px 12px;
+}
diff --git a/src/layouts/desktop/styles/desktop-page-common.less b/src/layouts/desktop/styles/desktop-page-common.less
new file mode 100644
index 0000000..f798c40
--- /dev/null
+++ b/src/layouts/desktop/styles/desktop-page-common.less
@@ -0,0 +1,83 @@
+/* Shared desktop page primitives */
+
+.dpage-topbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 14px;
+ color: #6b7280;
+ margin: 6px 0 0;
+ line-height: 1.6;
+ }
+}
+
+.dpage-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dpage-support {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 8px;
+
+ > a:first-child {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__bale {
+ width: 40px;
+ height: 40px;
+ object-fit: contain;
+ flex-shrink: 0;
+ }
+}
diff --git a/src/layouts/mobile/MobileAppLayout.vue b/src/layouts/mobile/MobileAppLayout.vue
new file mode 100644
index 0000000..f7e9ff4
--- /dev/null
+++ b/src/layouts/mobile/MobileAppLayout.vue
@@ -0,0 +1,57 @@
+
+
+
+
+
+
+
+
diff --git a/src/layouts/mobile/MobileBottomNav.vue b/src/layouts/mobile/MobileBottomNav.vue
new file mode 100644
index 0000000..24b4e16
--- /dev/null
+++ b/src/layouts/mobile/MobileBottomNav.vue
@@ -0,0 +1,107 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/layouts/mobile/MobileOverflowMenu.vue b/src/layouts/mobile/MobileOverflowMenu.vue
new file mode 100644
index 0000000..c5b3552
--- /dev/null
+++ b/src/layouts/mobile/MobileOverflowMenu.vue
@@ -0,0 +1,53 @@
+
+
+
+
+
+
+ سفارش ها
+
+
+
+ صفحه اصلی
+
+
+
+ {{ isBoursecu ? 'تراکنش ها' : 'گزارش' }}
+
+
+ صفحه اصلی
+
+
+
+
+
+
+ ![]()
+
+
+
+ محصولات
+
+
+ کیف پول
+
+
+ تنظیمات
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.label }}
+
+
+
+
+
+
+
diff --git a/src/views/base/about/components/AboutSupportActions.vue b/src/views/base/about/components/AboutSupportActions.vue
new file mode 100644
index 0000000..cc9ed7a
--- /dev/null
+++ b/src/views/base/about/components/AboutSupportActions.vue
@@ -0,0 +1,41 @@
+
+
+ {{ section.title }}
+
+
+ {{ paragraph }}
+
+ -
+
- + • {{ item }} + {{ item }} + +
+
+ تماس با پشتیبانی
+
+
+
+
+
+
+
+
diff --git a/src/views/base/about/composables/useAboutPage.ts b/src/views/base/about/composables/useAboutPage.ts
new file mode 100644
index 0000000..aeeb379
--- /dev/null
+++ b/src/views/base/about/composables/useAboutPage.ts
@@ -0,0 +1,48 @@
+import { computed, inject, provide, type InjectionKey, type ComputedRef } from 'vue'
+import { useConfigStore } from '@/store/configStore'
+import {
+ getProjectBaleLink,
+ getProjectSupportPhoneLink,
+ isBoursecuProject,
+} from '@/utils/config'
+import { getAboutSections, type AboutSection } from '../aboutContent'
+
+export interface AboutPageContext {
+ config: ReturnType
+
+
+
+
+
+
diff --git a/src/views/base/about/desktop/styles/desktop-about.less b/src/views/base/about/desktop/styles/desktop-about.less
new file mode 100644
index 0000000..8f940a0
--- /dev/null
+++ b/src/views/base/about/desktop/styles/desktop-about.less
@@ -0,0 +1,234 @@
+/* Premium desktop about page */
+
+.dabout {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dabout__container {
+ max-width: 1080px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dabout-topbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.dabout-layout {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
+ gap: 20px;
+ align-items: start;
+}
+
+.dabout-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dabout-main {
+ padding: 28px;
+
+ &__intro {
+ display: flex;
+ align-items: center;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 20px;
+ border-bottom: 1px solid #eef0f3;
+ }
+
+ &__logo {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 56px;
+ height: 56px;
+ border-radius: 14px;
+ background: rgba(9, 61, 81, 0.08);
+ color: @App-primary-color;
+ flex-shrink: 0;
+ }
+
+ &__project {
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0 0 4px;
+ }
+
+ &__tagline {
+ font-size: 13px;
+ color: #6b7280;
+ margin: 0;
+ }
+}
+
+.dabout-content {
+ &--default {
+ padding: 0;
+ background: transparent;
+ color: #374151;
+ }
+
+ &--boursecu {
+ padding: 20px;
+ border: 1px solid rgba(9, 61, 81, 0.15);
+ border-radius: 12px;
+ background: rgba(9, 61, 81, 0.03);
+ color: @App-primary-color;
+ }
+
+ &__divider {
+ width: 100%;
+ height: 1px;
+ background: #eef0f3;
+ margin: 20px 0;
+ }
+
+ &__title {
+ font-size: 16px;
+ font-weight: 700;
+ color: inherit;
+ margin: 0 0 10px;
+ }
+
+ &__paragraph {
+ font-size: 14px;
+ line-height: 1.9;
+ color: inherit;
+ text-align: justify;
+ margin: 0 0 12px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ &__list {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+ }
+
+ &__list-item {
+ position: relative;
+ padding-right: 16px;
+ font-size: 14px;
+ line-height: 1.7;
+ color: inherit;
+
+ &::before {
+ content: '';
+ position: absolute;
+ right: 0;
+ top: 10px;
+ width: 6px;
+ height: 6px;
+ border-radius: 50%;
+ background: currentColor;
+ opacity: 0.6;
+ }
+ }
+}
+
+.dabout-side {
+ padding: 24px;
+ position: sticky;
+ top: 24px;
+
+ &__title {
+ font-size: 15px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0 0 8px;
+ }
+
+ &__text {
+ font-size: 13px;
+ line-height: 1.7;
+ color: #6b7280;
+ margin: 0 0 20px;
+ }
+}
+
+.dabout-support {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 8px;
+
+ > a:first-child {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__bale {
+ width: 40px;
+ height: 40px;
+ object-fit: contain;
+ flex-shrink: 0;
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .dabout-layout {
+ grid-template-columns: 1fr;
+ }
+
+ .dabout-side {
+ position: static;
+ }
+}
diff --git a/src/views/base/about/index.vue b/src/views/base/about/index.vue
index 87ddebb..929bd0c 100644
--- a/src/views/base/about/index.vue
+++ b/src/views/base/about/index.vue
@@ -1,176 +1,24 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ config.config.name_fa }}
+آشنایی با خدمات و چشمانداز ما
+
-
+}
+
+export const ABOUT_US_PAGE_CONTEXT_KEY: InjectionKey = Symbol('aboutUsPageContext')
+
+export function useAboutUsPage() {
+ const config = useConfigStore()
+
+ const context: AboutUsPageContext = {
+ config,
+ }
+
+ provide(ABOUT_US_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useAboutUsPageContext() {
+ const context = inject(ABOUT_US_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useAboutUsPageContext must be used within a page that calls useAboutUsPage()')
+ }
+ return context
+}
diff --git a/src/views/base/aboutUs/desktop/DesktopAboutUsView.vue b/src/views/base/aboutUs/desktop/DesktopAboutUsView.vue
new file mode 100644
index 0000000..03e9711
--- /dev/null
+++ b/src/views/base/aboutUs/desktop/DesktopAboutUsView.vue
@@ -0,0 +1,41 @@
+
+
-
-
-
- درباره ما
-
-
-
+
- ![]()
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{ section.title }}
-
-
- {{ paragraph }}
-
-
- • {{ item }}
-
-
-
-
-
- تماس با پشتیبانی
-
-
-
-
-
-
-
-
-
- تماس با پشتیبانی
-
-
-
-
-
-
-
-
+
diff --git a/src/views/base/about/mobile/MobileAboutView.vue b/src/views/base/about/mobile/MobileAboutView.vue
new file mode 100644
index 0000000..faae3ec
--- /dev/null
+++ b/src/views/base/about/mobile/MobileAboutView.vue
@@ -0,0 +1,31 @@
+
+
+
+
+
+
diff --git a/src/views/base/aboutUs/components/AboutUsContentPanel.vue b/src/views/base/aboutUs/components/AboutUsContentPanel.vue
new file mode 100644
index 0000000..4959b06
--- /dev/null
+++ b/src/views/base/aboutUs/components/AboutUsContentPanel.vue
@@ -0,0 +1,55 @@
+
+
+
+
+
+ درباره ما
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
diff --git a/src/views/base/aboutUs/composables/useAboutUsPage.ts b/src/views/base/aboutUs/composables/useAboutUsPage.ts
new file mode 100644
index 0000000..f95daa4
--- /dev/null
+++ b/src/views/base/aboutUs/composables/useAboutUsPage.ts
@@ -0,0 +1,27 @@
+import { inject, provide, type InjectionKey } from 'vue'
+import { useConfigStore } from '@/store/configStore'
+
+export interface AboutUsPageContext {
+ config: ReturnType
+
+
+ درباره ما
+ +
+ گروسی گالری بستری امن و آنلاین برای خرید و فروش طلای آبشده فراهم کرده تا کاربران بتوانند سرمایههای خرد خود را به راحتی پسانداز و مدیریت کنند.
+
+
+ هدف ما ایجاد تجربهای سریع، شفاف و کاربرپسند در معاملات طلای آبشده است.
+
+
+
+ 
+
+
+
+
+
+
+
diff --git a/src/views/base/aboutUs/desktop/styles/desktop-about-us.less b/src/views/base/aboutUs/desktop/styles/desktop-about-us.less
new file mode 100644
index 0000000..ccfecf4
--- /dev/null
+++ b/src/views/base/aboutUs/desktop/styles/desktop-about-us.less
@@ -0,0 +1,168 @@
+/* Premium desktop about-us page */
+
+.daboutus {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.daboutus__container {
+ max-width: 860px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.daboutus-topbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.daboutus-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.daboutus-main {
+ padding: 28px;
+ display: flex;
+ flex-direction: column;
+ min-height: 0;
+ max-height: calc(100vh - 180px);
+
+ &__intro {
+ display: flex;
+ align-items: center;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 20px;
+ border-bottom: 1px solid #eef0f3;
+ flex-shrink: 0;
+ }
+
+ &__logo {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 56px;
+ height: 56px;
+ border-radius: 14px;
+ background: rgba(9, 61, 81, 0.08);
+ flex-shrink: 0;
+ overflow: hidden;
+ }
+
+ &__avatar {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ padding: 6px;
+ }
+
+ &__project {
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0 0 4px;
+ }
+
+ &__tagline {
+ font-size: 13px;
+ color: #6b7280;
+ margin: 0;
+ }
+
+ &__scroll {
+ flex: 1;
+ min-height: 0;
+ overflow-y: auto;
+ padding-left: 4px;
+ margin-left: -4px;
+ }
+}
+
+.daboutus-content {
+ padding: 20px;
+ border: 1px solid rgba(9, 61, 81, 0.15);
+ border-radius: 12px;
+ background: rgba(9, 61, 81, 0.03);
+ color: @App-primary-color;
+
+ &__title {
+ font-size: 16px;
+ font-weight: 700;
+ color: inherit;
+ margin: 0 0 12px;
+ }
+
+ &__paragraph {
+ font-size: 14px;
+ line-height: 1.9;
+ color: inherit;
+ text-align: justify;
+ margin: 0 0 12px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ &__enamad {
+ display: flex;
+ justify-content: center;
+ margin-top: 24px;
+ padding-top: 20px;
+ border-top: 1px solid rgba(9, 61, 81, 0.12);
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .daboutus-main {
+ max-height: none;
+ }
+}
diff --git a/src/views/base/aboutUs/index.vue b/src/views/base/aboutUs/index.vue
index 6253846..6978f8a 100644
--- a/src/views/base/aboutUs/index.vue
+++ b/src/views/base/aboutUs/index.vue
@@ -1,64 +1,24 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+ {{ config.config.name_fa }}
+آشنایی با خدمات و چشمانداز ما
+
+
+
-
+
+
+
+
diff --git a/src/views/base/address/components/AddressMobileItem.vue b/src/views/base/address/components/AddressMobileItem.vue
new file mode 100644
index 0000000..6794caf
--- /dev/null
+++ b/src/views/base/address/components/AddressMobileItem.vue
@@ -0,0 +1,94 @@
+
+
-
-
-
- درباره ما
-
-
+
- ![]()
-
-
-
-
- ![]()
-
-
-
-
-
-
-
-
- درباره ما
- - گروسی گالری بستری امن و آنلاین برای خرید و فروش طلای آبشده فراهم کرده تا کاربران بتوانند سرمایههای خرد خود را به راحتی پسانداز و مدیریت کنند.
- هدف ما ایجاد تجربهای سریع، شفاف و کاربرپسند در معاملات طلای آبشده است.
-
-
-
-
-
-
-
-
+
diff --git a/src/views/base/aboutUs/mobile/MobileAboutUsView.vue b/src/views/base/aboutUs/mobile/MobileAboutUsView.vue
new file mode 100644
index 0000000..127917f
--- /dev/null
+++ b/src/views/base/aboutUs/mobile/MobileAboutUsView.vue
@@ -0,0 +1,29 @@
+
+
+
+
+
+
diff --git a/src/views/base/address/components/AddressForm.vue b/src/views/base/address/components/AddressForm.vue
new file mode 100644
index 0000000..be4a7f0
--- /dev/null
+++ b/src/views/base/address/components/AddressForm.vue
@@ -0,0 +1,101 @@
+
+
+
+
+
+ درباره ما
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
+
+ آدرس
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ editId ? 'ویرایش آدرس' : 'ثبت آدرس' }}
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/address/components/Item.vue b/src/views/base/address/components/Item.vue
index a975372..2335245 100644
--- a/src/views/base/address/components/Item.vue
+++ b/src/views/base/address/components/Item.vue
@@ -1,112 +1,155 @@
-
+
+
+
+ {{ item.address }}
+
+
+
+
+
+ {{ formatAddressDate(item.created_at) }}
+
+
+
+
+
+
+ آیا از حذف آدرس اطمینان دارید؟
+
+ تایید
+
+ انصراف
+
+
+
-
-
-
+
+
-
-
+
-
-
diff --git a/src/views/base/address/composables/useAddressPage.ts b/src/views/base/address/composables/useAddressPage.ts
new file mode 100644
index 0000000..3e2731e
--- /dev/null
+++ b/src/views/base/address/composables/useAddressPage.ts
@@ -0,0 +1,145 @@
+import { inject, onMounted, provide, ref, type InjectionKey, type Ref } from 'vue'
+import { cloneDeep } from 'lodash'
+import { type FormInstance, message } from 'ant-design-vue'
+import { createAddress, getCity, updateAddress } from '@/api/address'
+import type { Address } from '@/models/address'
+import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
+import { loading, loadingMore } from '@/utils'
+import { isBazretalaProject } from '@/utils/config'
+import {
+ addressItems,
+ addressProvinceList,
+ initAddressPageData,
+ refreshAddressItems,
+} from './useAddressPageData'
+
+export interface AddressPageContext {
+ provinceList: typeof addressProvinceList
+ cityList: Ref
+ items: typeof addressItems
+ addAddressVisible: Ref
+ editId: Ref
+ address: Ref
+ formRef: Ref
+ loading: typeof loading
+ loadingMore: typeof loadingMore
+ isBazretalaProject: typeof isBazretalaProject
+ resetFields: () => void
+ openAdd: () => void
+ openEdit: (val: Address) => void
+ handleOk: (e?: MouseEvent) => void
+ initItems: () => Promise
+ changeProvince: (obj: { id: number }) => Promise
+}
+
+export const ADDRESS_PAGE_CONTEXT_KEY: InjectionKey =
+ Symbol('addressPageContext')
+
+const emptyAddress = (): Address => ({
+ city: '',
+ province: '',
+ phone: '',
+ address: '',
+ zip: '',
+ default_address: false,
+})
+
+export function useAddressPage() {
+ const isDesktop = useDesktopBreakpoint()
+ const cityList = ref()
+ const addAddressVisible = ref(false)
+ const editId = ref(undefined)
+ const formRef = ref()
+ const address = ref(emptyAddress())
+
+ function resetFields() {
+ editId.value = undefined
+ address.value = emptyAddress()
+ cityList.value = undefined
+ }
+
+ function openAdd() {
+ resetFields()
+ editId.value = undefined
+ addAddressVisible.value = !isDesktop.value
+ }
+
+ async function openEdit(val: Address) {
+ address.value = cloneDeep(val)
+ editId.value = address.value.id
+ if (address.value.province) {
+ const province = addressProvinceList.value.find((item) => item.title === address.value.province)
+ if (province?.id) {
+ cityList.value = await getCity(province.id)
+ }
+ }
+ addAddressVisible.value = true
+ }
+
+ const handleOk = (_e?: MouseEvent) => {
+ formRef.value?.validate().then(async () => {
+ if (editId.value) {
+ await updateAddress(editId.value, address.value)
+ } else {
+ await createAddress(address.value)
+ }
+ await initItems()
+ addAddressVisible.value = false
+ message.success('آدرس با موفقیت ثبت شد')
+ resetFields()
+ }).catch((error) => {
+ console.log('error', error)
+ })
+ }
+
+ async function initItems() {
+ await refreshAddressItems()
+ }
+
+ const changeProvince = async (obj: { id: number }) => {
+ try {
+ loading.value = true
+ cityList.value = undefined
+ address.value.city = undefined
+ cityList.value = await getCity(obj.id)
+ } catch (e) {
+ message.error('خطا در دریافت شهرها')
+ } finally {
+ loading.value = false
+ }
+ }
+
+ onMounted(async () => {
+ await initAddressPageData()
+ })
+
+ const context: AddressPageContext = {
+ provinceList: addressProvinceList,
+ cityList,
+ items: addressItems,
+ addAddressVisible,
+ editId,
+ address,
+ formRef,
+ loading,
+ loadingMore,
+ isBazretalaProject,
+ resetFields,
+ openAdd,
+ openEdit,
+ handleOk,
+ initItems,
+ changeProvince,
+ }
+
+ provide(ADDRESS_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useAddressPageContext() {
+ const context = inject(ADDRESS_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useAddressPageContext must be used within a page that calls useAddressPage()')
+ }
+ return context
+}
diff --git a/src/views/base/address/composables/useAddressPageData.ts b/src/views/base/address/composables/useAddressPageData.ts
new file mode 100644
index 0000000..a90605e
--- /dev/null
+++ b/src/views/base/address/composables/useAddressPageData.ts
@@ -0,0 +1,82 @@
+import { ref } from 'vue'
+import { getProvince, tableAddress } from '@/api/address'
+import type { Address } from '@/models/address'
+import { loading, loadingMore } from '@/utils'
+import { runOnceAsync, resetOnceAsyncByPrefix } from '@/composables/useOnceAsync'
+
+/**
+ * Shared address page datasets — mobile and desktop views read this module state only.
+ */
+let initPromise: Promise | null = null
+const initialized = ref(false)
+
+export const addressItems = ref([])
+export const addressProvinceList = ref([])
+
+export function isAddressPageDataInitialized() {
+ return initialized.value
+}
+
+export async function refreshAddressItems() {
+ try {
+ loading.value = true
+ const data = await tableAddress({ page: 0, limit: 150 })
+ addressItems.value = data.rows
+ } catch (error) {
+ console.error('Address list refresh error:', error)
+ } finally {
+ loading.value = false
+ loadingMore.value = false
+ }
+}
+
+async function loadAddressItems() {
+ const data = await tableAddress({ page: 0, limit: 150 })
+ addressItems.value = data.rows
+}
+
+async function loadProvinces() {
+ addressProvinceList.value = await getProvince()
+}
+
+export async function initAddressPageData(force = false) {
+ if (!force && initialized.value) {
+ return
+ }
+
+ if (!force && initPromise) {
+ return initPromise
+ }
+
+ initPromise = (async () => {
+ try {
+ if (force) {
+ resetAddressPageData()
+ }
+
+ loading.value = true
+
+ await Promise.all([
+ runOnceAsync('address:items', () => loadAddressItems(), force),
+ runOnceAsync('address:provinces', () => loadProvinces(), force),
+ ])
+
+ initialized.value = true
+ } catch (error) {
+ console.error('Address page initialization error:', error)
+ } finally {
+ loading.value = false
+ initPromise = null
+ }
+ })()
+
+ return initPromise
+}
+
+export function resetAddressPageData() {
+ initialized.value = false
+ initPromise = null
+ resetOnceAsyncByPrefix('address:')
+ addressItems.value = []
+ addressProvinceList.value = []
+}
diff --git a/src/views/base/address/desktop/DesktopAddressView.vue b/src/views/base/address/desktop/DesktopAddressView.vue
new file mode 100644
index 0000000..c58bfb3
--- /dev/null
+++ b/src/views/base/address/desktop/DesktopAddressView.vue
@@ -0,0 +1,86 @@
+
+
+
+
+
+
+
+ {{ item.address }}
+ + +
+
+
+
+
+
+
+
+
+
+
+ آیا از حذف آدرس اطمینان دارید؟
+
+ تایید
+
+ انصراف
+
+
-
-
{{item.address }}
+ {{ item.address }}
-
-
-
-
- {{toJalali(item.created_at)}}
-
-
- {{ formatAddressDate(item.created_at) }}
+
+
-
-
-
+
- آیا از حذف آدرس اطمینان دارید؟
-
+ آیا از حذف آدرس اطمینان دارید؟
-
- تایید
-
-
-
- انصراف
+ تایید
+ انصراف
-
+
+
+
+
diff --git a/src/views/base/address/desktop/styles/desktop-address.less b/src/views/base/address/desktop/styles/desktop-address.less
new file mode 100644
index 0000000..b175923
--- /dev/null
+++ b/src/views/base/address/desktop/styles/desktop-address.less
@@ -0,0 +1,307 @@
+/* Premium desktop address page — scoped to desktop shell only */
+
+html.app-layout--desktop {
+ .daddr {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+ }
+
+ .daddr__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+ }
+
+ .daddr-topbar {
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0 0 6px;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 14px;
+ color: #6b7280;
+ margin: 0;
+ max-width: 520px;
+ line-height: 1.6;
+ }
+ }
+
+ .daddr-notice {
+ margin-bottom: 20px;
+ padding: 14px 16px;
+ border-radius: 12px;
+ border: 1px solid rgba(59, 130, 246, 0.15);
+ background: rgba(59, 130, 246, 0.06);
+ color: @App-primary-color;
+ font-size: 13px;
+ line-height: 1.8;
+ text-align: justify;
+ }
+
+ .daddr-grid {
+ display: grid;
+ grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
+ gap: 20px;
+ align-items: start;
+ }
+
+ .daddr-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+ }
+
+ .daddr-form {
+ padding: 24px;
+
+ &__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 20px;
+ }
+
+ &__title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0;
+ }
+
+ &__reset {
+ border: 1px solid #e5e7eb;
+ border-radius: 8px;
+ background: #fff;
+ color: #6b7280;
+ font-size: 12px;
+ font-weight: 600;
+ font-family: inherit;
+ padding: 6px 10px;
+ cursor: pointer;
+ transition: border-color 0.15s ease, color 0.15s ease;
+
+ &:hover {
+ border-color: @App-primary-color;
+ color: @App-primary-color;
+ }
+ }
+
+ &__fields {
+ width: 100%;
+ }
+
+ &__grid {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ }
+
+ &__address-item {
+ margin-bottom: 8px !important;
+ }
+
+ &__submit {
+ width: 100%;
+ margin-top: 8px;
+ }
+ }
+
+ .daddr-list {
+ display: flex;
+ flex-direction: column;
+ min-height: 420px;
+
+ &__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ padding: 20px 24px 0;
+ }
+
+ &__title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0;
+ }
+
+ &__count {
+ font-size: 12px;
+ font-weight: 600;
+ color: #6b7280;
+ background: #f3f4f6;
+ border-radius: 999px;
+ padding: 4px 10px;
+ }
+
+ &__items {
+ padding: 16px 24px 24px;
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+ }
+
+ &__skeletons {
+ padding: 16px 24px 24px;
+ }
+ }
+
+ .daddr-card {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) auto;
+ gap: 12px 16px;
+ padding: 16px 18px;
+ border: 1px solid #eef0f3;
+ border-radius: 12px;
+ background: #fafbfc;
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
+
+ &:hover {
+ border-color: #dbe0e6;
+ box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
+ }
+
+ &__address {
+ grid-column: 1 / -1;
+ font-size: 16px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0;
+ line-height: 1.5;
+ }
+
+ &__meta {
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+ min-width: 0;
+ }
+
+ &__row {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ font-size: 13px;
+ color: #6b7280;
+ }
+
+ &__label {
+ color: #9ca3af;
+ flex-shrink: 0;
+ }
+
+ &__value {
+ color: #374151;
+ font-weight: 600;
+ }
+
+ &__actions {
+ display: flex;
+ align-items: flex-start;
+ gap: 4px;
+ }
+
+ &__icon-btn {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ width: 34px;
+ height: 34px;
+ border: 1px solid #e5e7eb;
+ border-radius: 10px;
+ background: #fff;
+ cursor: pointer;
+ transition: border-color 0.15s ease, background 0.15s ease;
+
+ &:hover {
+ background: #f9fafb;
+ }
+
+ &--danger:hover {
+ border-color: #fecaca;
+ background: #fef2f2;
+ }
+
+ &--edit:hover {
+ border-color: #bbf7d0;
+ background: #f0fdf4;
+ }
+ }
+
+ &__footer {
+ grid-column: 1 / -1;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ padding-top: 10px;
+ border-top: 1px solid #eef0f3;
+ }
+
+ &__date {
+ font-size: 12px;
+ color: #9ca3af;
+ }
+ }
+
+ .daddr-empty {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ padding: 48px 24px;
+ color: #6b7280;
+ text-align: center;
+
+ p {
+ margin: 0;
+ font-size: 14px;
+ }
+
+ &__btn {
+ margin-top: 4px;
+ border: none;
+ border-radius: 10px;
+ background: @App-primary-color;
+ color: #fff;
+ font-size: 13px;
+ font-weight: 600;
+ font-family: inherit;
+ padding: 10px 16px;
+ cursor: pointer;
+ transition: opacity 0.15s ease;
+
+ &:hover {
+ opacity: 0.92;
+ }
+ }
+ }
+
+ @media (max-width: 1023.98px) {
+ .daddr-grid {
+ grid-template-columns: 1fr;
+ }
+ }
+}
diff --git a/src/views/base/address/index.vue b/src/views/base/address/index.vue
index 6d8b584..27add88 100644
--- a/src/views/base/address/index.vue
+++ b/src/views/base/address/index.vue
@@ -1,257 +1,40 @@
-
+
+
+
+
+
+ آدرسها
+ +
+ جهت تحویل فیزیکی محصول در تهران و قم ازطریق معرف اقدام فرمائید یا با شماره امورمالی و حسابداری 09925202099 درارتباط باشید.
+
+
+
+
+
+
+
+
+
+
+
+ {{ editId ? 'ویرایش آدرس' : 'ثبت آدرس جدید' }}
+ +
+
+
+ آدرسهای ثبتشده
+ {{ items.length }} مورد +
+
+
+
+
+
+
+
+
+
+ هنوز آدرسی ثبت نشده است.
+ +
-
-
-
+
+
+
-
-
\ No newline at end of file
diff --git a/src/views/base/address/mobile/MobileAddressView.vue b/src/views/base/address/mobile/MobileAddressView.vue
new file mode 100644
index 0000000..1288fd8
--- /dev/null
+++ b/src/views/base/address/mobile/MobileAddressView.vue
@@ -0,0 +1,72 @@
+
+
+ userStore: ReturnType
+ nameProject: string
+ isTransaction: Ref
+ loading: typeof loading
+ setIsTransaction: (value: boolean) => void
+ copyCode: () => void
+ shareCode: () => void
+ loadEarnMoney: () => Promise
+}
+
+export const EARN_MONEY_PAGE_CONTEXT_KEY: InjectionKey =
+ Symbol('earnMoneyPageContext')
+
+export function useEarnMoneyPage() {
+ const data = ref()
+ const userStore = useUserStore()
+ const nameProject = useConfigStore().config.name_fa
+ const isTransaction = ref(false)
+
+ function setIsTransaction(value: boolean) {
+ isTransaction.value = value
+ }
+
+ function copyCode() {
+ const val = userStore.userInfo?.referral_id
+ navigator.clipboard.writeText(val)
+ message.info('کد رونوشت شد')
+ }
+
+ function shareCode() {
+ const val = getReferralShareText({
+ userName: userStore.userInfo?.name,
+ projectName: nameProject,
+ referralId: userStore.userInfo?.referral_id,
+ })
+ navigator.share({
+ title: getReferralShareTitle(nameProject),
+ text: val,
+ })
+ }
+
+ async function loadEarnMoney() {
+ try {
+ loading.value = true
+ data.value = await getEarnMoney()
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ onMounted(() => {
+ loadEarnMoney()
+ })
+
+ const context: EarnMoneyPageContext = {
+ data,
+ userStore,
+ nameProject,
+ isTransaction,
+ loading,
+ setIsTransaction,
+ copyCode,
+ shareCode,
+ loadEarnMoney,
+ }
+
+ provide(EARN_MONEY_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useEarnMoneyPageContext() {
+ const context = inject(EARN_MONEY_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useEarnMoneyPageContext must be used within a page that calls useEarnMoneyPage()')
+ }
+ return context
+}
diff --git a/src/views/base/earnMoney/desktop/DesktopEarnMoneyView.vue b/src/views/base/earnMoney/desktop/DesktopEarnMoneyView.vue
new file mode 100644
index 0000000..d496308
--- /dev/null
+++ b/src/views/base/earnMoney/desktop/DesktopEarnMoneyView.vue
@@ -0,0 +1,121 @@
+
+
-
-
-
- آدرس ها
-
- ![]()
-
-
-
-
-
-
-
-
-
- جهت تحویل فیزیکی محصول در تهران و قم ازطریق معرف اقدام فرمائید یا با شماره امورمالی و حسابداری 09925202099 درارتباط باشید.
-
-
-
-
-
-
- آدرس
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- ثبت آدرس
-
-
-
-
-
-
+
+
-
-
-
-
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/earnMoney/composables/useEarnMoneyPage.ts b/src/views/base/earnMoney/composables/useEarnMoneyPage.ts
new file mode 100644
index 0000000..2e66a21
--- /dev/null
+++ b/src/views/base/earnMoney/composables/useEarnMoneyPage.ts
@@ -0,0 +1,90 @@
+import { inject, onMounted, provide, ref, type InjectionKey, type Ref } from 'vue'
+import { message } from 'ant-design-vue'
+import { getEarnMoney } from '@/api/earnMoney'
+import type { EarnMoney } from '@/models/earnMoney'
+import { useUserStore } from '@/store/userStore'
+import { useConfigStore } from '@/store/configStore'
+import { getReferralShareText, getReferralShareTitle } from '@/utils/config'
+import { loading } from '@/utils'
+
+export interface EarnMoneyPageContext {
+ data: Ref
+
+
+
+ آدرس ها
+
+ ![]()
+
+
+
+
+
+
+ جهت تحویل فیزیکی محصول در تهران و قم ازطریق معرف اقدام فرمائید یا با شماره امورمالی و حسابداری 09925202099 درارتباط باشید.
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/earnMoney/desktop/styles/desktop-earn-money.less b/src/views/base/earnMoney/desktop/styles/desktop-earn-money.less
new file mode 100644
index 0000000..b3a47fe
--- /dev/null
+++ b/src/views/base/earnMoney/desktop/styles/desktop-earn-money.less
@@ -0,0 +1,244 @@
+/* Premium desktop earn money page */
+
+.dearn {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dearn__container {
+ max-width: 960px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dearn-topbar {
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0 0 6px;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 14px;
+ color: #6b7280;
+ margin: 0;
+ }
+}
+
+.dearn-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dearn-referral {
+ padding: 24px 28px;
+ margin-bottom: 20px;
+
+ &__header {
+ display: flex;
+ align-items: center;
+ gap: 16px;
+ margin-bottom: 20px;
+ padding-bottom: 20px;
+ border-bottom: 1px solid #eef0f3;
+ }
+
+ &__icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 56px;
+ height: 56px;
+ border-radius: 14px;
+ background: #dbeafe;
+ flex-shrink: 0;
+
+ img {
+ width: 28px;
+ height: 28px;
+ object-fit: contain;
+ }
+ }
+
+ &__title {
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0 0 6px;
+ }
+
+ &__desc {
+ font-size: 13px;
+ line-height: 1.6;
+ color: #6b7280;
+ margin: 0;
+ }
+
+ &__code {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 10px;
+ padding: 14px 18px;
+ margin-bottom: 16px;
+ border-radius: 12px;
+ background: #f9fafb;
+ border: 1px dashed #d1d5db;
+ }
+
+ &__code-label {
+ font-size: 12px;
+ color: #6b7280;
+ font-weight: 500;
+ }
+
+ &__code-value {
+ font-size: 18px;
+ font-weight: 700;
+ color: @App-primary-color;
+ letter-spacing: 0.02em;
+ }
+
+ &__actions {
+ display: grid;
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 12px;
+ }
+
+ &__btn {
+ min-height: 44px;
+ }
+}
+
+.dearn-stats {
+ display: grid;
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 16px;
+ margin-bottom: 24px;
+
+ &__card {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 8px;
+ padding: 20px 16px;
+ border-radius: 14px;
+ text-align: center;
+
+ &--users {
+ background: #dbeafe;
+ color: #2563eb;
+ }
+
+ &--gifts {
+ background: #fef9c3;
+ color: #ca8a04;
+ }
+ }
+
+ &__value {
+ font-size: 22px;
+ font-weight: 700;
+ line-height: 1.2;
+ }
+
+ &__label {
+ font-size: 13px;
+ font-weight: 500;
+ opacity: 0.9;
+ }
+}
+
+.dearn-tabs {
+ display: inline-flex;
+ gap: 4px;
+ padding: 4px;
+ margin-bottom: 20px;
+ background: #f3f4f6;
+ border-radius: 12px;
+
+ &__btn {
+ min-width: 140px;
+ padding: 10px 18px;
+ border: none;
+ border-radius: 10px;
+ background: transparent;
+ font-size: 14px;
+ font-weight: 600;
+ color: #6b7280;
+ font-family: inherit;
+ cursor: pointer;
+ transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
+
+ &:hover {
+ color: #374151;
+ }
+
+ &--active {
+ background: #fff;
+ color: @App-primary-color;
+ box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
+ }
+ }
+}
+
+.dearn-list {
+ padding: 20px 24px 24px;
+
+ &__loading,
+ &__items {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ }
+}
+
+.dearn-empty {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ padding: 48px 24px;
+ color: #9ca3af;
+ text-align: center;
+
+ p {
+ margin: 0;
+ font-size: 14px;
+ color: #6b7280;
+ }
+
+ svg,
+ .basic-icon {
+ color: #d1d5db;
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .dearn-stats {
+ grid-template-columns: 1fr;
+ }
+
+ .dearn-referral__actions {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/src/views/base/earnMoney/index.vue b/src/views/base/earnMoney/index.vue
index 16a1bf7..06a4770 100644
--- a/src/views/base/earnMoney/index.vue
+++ b/src/views/base/earnMoney/index.vue
@@ -1,159 +1,24 @@
-
+
+
+
+
+
+
+
+
+
+
+ کسب درآمد
+ +
+
+
+
+ ![]()
+
+
+
+ دعوت دوستان
+هر دعوت موفق 10 سوت طلا هدیه
+
+ کد بازاریابی
+ {{ userStore.userInfo.referral_id }}
+
+
+
+
+ اشتراک گذاری
+
+
+ رونوشت
+
+
+
+
+
+
+ {{ data?.usersSum ?? 0 }} عدد
+ تعداد زیر مجموعه
+
+
+ {{ data?.giftsSum ?? 0 }} سوت
+ میزان کل پاداش ها
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ هنوز پاداشی ثبت نشده است.
+
+
+
+
+
+ هنوز زیرمجموعهای ثبت نشده است.
+
-
+ userFormState: ReturnType>
+ formRef: ReturnType>
+ editPassVisible: ReturnType>
+ setForm: () => void
+ copyCode: () => void
+ resetData: () => void
+ ok: () => void
+}
+
+export const EDUCATE_PAGE_CONTEXT_KEY: InjectionKey = Symbol('educatePageContext')
+
+export function useEducatePage() {
+ const config = useConfigStore()
+ const userStore = useUserStore()
+
+ const userFormState = ref({
+ fname: '',
+ lname: '',
+ mobile: undefined,
+ birth_date: '',
+ phone_number: '',
+ province: '',
+ city: '',
+ n_code: undefined,
+ })
+ const formRef = ref()
+ const editPassVisible = ref(false)
+
+ function setForm() {
+ userFormState.value = userStore.userInfo
+ }
+
+ function copyCode() {
+ const val = userStore.userInfo?.referral_id
+ navigator.clipboard.writeText(val)
+ message.info('کد رونوشت شد')
+ }
+
+ const resetData = () => {
+ formRef.value?.resetFields()
+ userFormState.value = {
+ fname: '',
+ lname: '',
+ mobile: undefined,
+ birth_date: '',
+ phone_number: '',
+ province: '',
+ city: '',
+ n_code: undefined,
+ }
+ }
+
+ function ok() {
+ formRef.value?.validateFields().then(async () => {
+ try {
+ loading.value = true
+ await updateMe(userFormState.value)
+ await userStore.getMyInfo()
+ editPassVisible.value = false
+ message.success('اطلاعات شما با موفقیت به روز رسانی شد')
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ })
+ }
+
+ onMounted(() => {
+ setForm()
+ })
+
+ const context: EducatePageContext = {
+ config,
+ userFormState,
+ formRef,
+ editPassVisible,
+ setForm,
+ copyCode,
+ resetData,
+ ok,
+ }
+
+ provide(EDUCATE_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useEducatePageContext() {
+ const context = inject(EDUCATE_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useEducatePageContext must be used within a page that calls useEducatePage()')
+ }
+ return context
+}
diff --git a/src/views/base/educate/desktop/DesktopEducateView.vue b/src/views/base/educate/desktop/DesktopEducateView.vue
new file mode 100644
index 0000000..4f17b9d
--- /dev/null
+++ b/src/views/base/educate/desktop/DesktopEducateView.vue
@@ -0,0 +1,52 @@
+
+
-
+
-
- کسب درآمد
-
+
-
-
-
\ No newline at end of file
+.earn-money-page-root {
+ min-height: 100%;
+ height: 100%;
+}
+
diff --git a/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue b/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue
new file mode 100644
index 0000000..26001f6
--- /dev/null
+++ b/src/views/base/earnMoney/mobile/MobileEarnMoneyView.vue
@@ -0,0 +1,101 @@
+
+
-
-
-
-
- ![]()
-
-
-
-
-
- دعوت دوستان
-
- هر دعوت موفق 10 سوت طلا هدیه
-
-
- کد بازاریابی
- {{userStore.userInfo.referral_id}}
-
-
- اشتراک گذاری
-
-
- رونوشت
-
-
-
-
-
-
-
- {{data?.usersSum}} عدد
-
- تعداد زیر مجموعه
-
-
-
- {{data?.giftsSum}} سوت
-
- میزان کل پاداش ها
-
-
-
-
-
-
-
-
-
-
-
-
-
- پاداش ها
-
-
- فهرست زیر مجموعه
-
-
-
-
-
-
+
+
+
+
+
+ کسب درآمد
+
+
+
+
+
diff --git a/src/views/base/educate/components/EducateContentPanel.vue b/src/views/base/educate/components/EducateContentPanel.vue
new file mode 100644
index 0000000..ecc428d
--- /dev/null
+++ b/src/views/base/educate/components/EducateContentPanel.vue
@@ -0,0 +1,103 @@
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+ دعوت دوستان
+ هر دعوت موفق 10 سوت طلا هدیه
+
+
+ کد بازاریابی
+ {{ userStore.userInfo.referral_id }}
+
+
+ اشتراک گذاری
+
+
+ رونوشت
+
+
+
+
+
+
+
+ {{ data?.usersSum }} عدد
+
+ تعداد زیر مجموعه
+
+
+
+ {{ data?.giftsSum }} سوت
+
+ میزان کل پاداش ها
+
+
+
+
+ پاداش ها
+
+
+ فهرست زیر مجموعه
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/educate/components/EducateSupportActions.vue b/src/views/base/educate/components/EducateSupportActions.vue
new file mode 100644
index 0000000..a4295cb
--- /dev/null
+++ b/src/views/base/educate/components/EducateSupportActions.vue
@@ -0,0 +1,43 @@
+
+
+ ![]()
+
+
+ ![]()
+
+
+
+ ![]()
+
+
+ ![]()
+
+
+ ![]()
+
+
+
+
+ شیوهٔ ورود و ثبت نام در گروسی گالری
+
+
+ • برای ثبتنام در گروسی گالری، اگر قبلاً حساب کاربری دارید میتوانید از طریق پیامک وارد شوید.
+ • اگر حساب کاربری ندارید، "از این قسمت" وارد صفحه ثبت نام شده و با وارد کردن نام و شماره تلفنی که با کد ملی شما مطابقت دارد، حساب کاربری بسازید.
+ • الزامی به وارد کردن کد معرف نیست. +
+ + • اگر حساب کاربری ندارید، "از این قسمت" وارد صفحه ثبت نام شده و با وارد کردن نام و شماره تلفنی که با کد ملی شما مطابقت دارد، حساب کاربری بسازید.
+ • الزامی به وارد کردن کد معرف نیست. +
+ شارژ کیف پول
+
+
+ • ابتدا کیف پول را در منو انتخاب کرده، مبلغ مورد نظر را وارد نموده و دکمه واریز را انتخاب کنید تا کیف پول شما شارژ شود.
+
+ +
+ شیوهٔ خرید از گروسی گالری
+
+
+ • سپس از بخش «خرید و فروش» انتخاب کنید که طلای آبشده میخواهید یا محصولات دیگر (شامل گوی، شمش یا مکعب).
+ • توجه داشته باشید کارمزد طلای آبشده حدود ۲٪ است و کارمزد ریالی محصولات دیگر در پایین صفحه قیمت درج شده است. +
+ + • توجه داشته باشید کارمزد طلای آبشده حدود ۲٪ است و کارمزد ریالی محصولات دیگر در پایین صفحه قیمت درج شده است. +
+ شیوهٔ فروش در گروسی گالری
+
+
+ • برای فروش محصولاتی که خریداری کردهاید، به بخش «خرید و فروش» مراجعه کرده، محصول موردنظر را انتخاب و گزینه فروش را بزنید تا مبلغ قابل دریافت نمایش داده شود.
+ • مبلغ به کیف پول شما واریز میشود و از طریق پیام پشتیبانی میتوانید درخواست برداشت دهید.
+ • اگر موجودی کیف پول بیش از ۱۰ میلیون تومان باشد، مبلغ تا پایان روز کاری بعد به حساب اعلامشده شما واریز خواهد شد. +
+
+
+ + • مبلغ به کیف پول شما واریز میشود و از طریق پیام پشتیبانی میتوانید درخواست برداشت دهید.
+ • اگر موجودی کیف پول بیش از ۱۰ میلیون تومان باشد، مبلغ تا پایان روز کاری بعد به حساب اعلامشده شما واریز خواهد شد. +
+ شیوهٔ دریافت فیزیکی طلا (ارسال)
+
+
+ • ابتدا موجودی محصول موردنظر را با پشتیبانی در واتساپ هماهنگ کنید.
+ • سپس روی لوگو کلیک کرده، گزینه «برداشت فیزیکی» و بعد «درخواست جدید» را انتخاب کنید.
+ • محصولات خریداریشده و تعداد آنها را مشخص کرده و آدرس خود را ثبت نمایید.
+ • پشتیبانی عکس و وزن محصول را برای شما ارسال میکند.
+ • ارسال بهصورت پسکرایه و بیمهشده انجام میشود.
+
+
+
+ + • سپس روی لوگو کلیک کرده، گزینه «برداشت فیزیکی» و بعد «درخواست جدید» را انتخاب کنید.
+ • محصولات خریداریشده و تعداد آنها را مشخص کرده و آدرس خود را ثبت نمایید.
+ • پشتیبانی عکس و وزن محصول را برای شما ارسال میکند.
+ • ارسال بهصورت پسکرایه و بیمهشده انجام میشود.
+
+ پاداش معرفی
+
+
+ • در صفحه اصلی روی "تنظیمات" کلیک کرده و وارد حساب کاربری خود شوید.
+
+
+ • سپس گزینه «اشتراکگذاری» یا «کپی لینک» را انتخاب کرده و لینک دعوت را برای دوستانتان ارسال کنید.
+ • در صورتی که دوستان شما از طریق لینک شما ثبتنام کنند، بهصورت خودکار ۱ سوت طلا بهعنوان پاداش دریافت خواهید کرد. +
+ + • در صورتی که دوستان شما از طریق لینک شما ثبتنام کنند، بهصورت خودکار ۱ سوت طلا بهعنوان پاداش دریافت خواهید کرد. +
+
+ تماس با پشتیبانی
+
+
+
+
+
+
+
+
+
+
+ تماس با پشتیبانی
+
+
+
+
+
+
diff --git a/src/views/base/educate/composables/useEducatePage.ts b/src/views/base/educate/composables/useEducatePage.ts
new file mode 100644
index 0000000..679e55a
--- /dev/null
+++ b/src/views/base/educate/composables/useEducatePage.ts
@@ -0,0 +1,105 @@
+import { inject, onMounted, provide, ref, type InjectionKey } from 'vue'
+import type { FormInstance } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
+import { updateMe } from '@/api/me'
+import type { User } from '@/models/login'
+import { useConfigStore } from '@/store/configStore'
+import { useUserStore } from '@/store/userStore'
+import { loading } from '@/utils'
+
+export interface EducatePageContext {
+ config: ReturnType
+
+
+
+
diff --git a/src/views/base/educate/desktop/styles/desktop-educate.less b/src/views/base/educate/desktop/styles/desktop-educate.less
new file mode 100644
index 0000000..f4218b1
--- /dev/null
+++ b/src/views/base/educate/desktop/styles/desktop-educate.less
@@ -0,0 +1,231 @@
+/* Premium desktop educate page */
+
+.deducate {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.deducate__container {
+ max-width: 1080px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.deducate-topbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.deducate-layout {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
+ gap: 20px;
+ align-items: start;
+}
+
+.deducate-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.deducate-main {
+ padding: 28px;
+ display: flex;
+ flex-direction: column;
+ min-height: 0;
+ max-height: calc(100vh - 180px);
+
+ &__intro {
+ display: flex;
+ align-items: center;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 20px;
+ border-bottom: 1px solid #eef0f3;
+ flex-shrink: 0;
+ }
+
+ &__logo {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 56px;
+ height: 56px;
+ border-radius: 14px;
+ background: rgba(9, 61, 81, 0.08);
+ color: @App-primary-color;
+ flex-shrink: 0;
+ }
+
+ &__project {
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0 0 4px;
+ }
+
+ &__tagline {
+ font-size: 13px;
+ color: #6b7280;
+ margin: 0;
+ }
+
+ &__scroll {
+ flex: 1;
+ min-height: 0;
+ overflow-y: auto;
+ padding-left: 4px;
+ margin-left: -4px;
+ }
+}
+
+.deducate-content {
+ padding: 20px;
+ border: 1px solid rgba(9, 61, 81, 0.15);
+ border-radius: 12px;
+ background: rgba(9, 61, 81, 0.03);
+ color: @App-primary-color;
+
+ &__avatar-wrap {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 20px;
+ }
+
+ &__avatar {
+ max-height: 120px;
+ width: auto;
+ object-fit: contain;
+ }
+
+ &__section-title {
+ font-size: 15px;
+ font-weight: 700;
+ color: inherit;
+ margin: 0 0 10px;
+ }
+
+ &__text {
+ font-size: 13px;
+ line-height: 1.8;
+ color: inherit;
+ text-align: justify;
+ margin: 0 0 12px;
+ }
+
+ &__image {
+ display: block;
+ width: 100%;
+ max-width: 100%;
+ height: auto;
+ margin: 12px 0 4px;
+ border-radius: 8px;
+ }
+
+ &__divider {
+ width: 100%;
+ height: 1px;
+ background: rgba(9, 61, 81, 0.12);
+ margin: 16px 0;
+ }
+}
+
+.deducate-side {
+ padding: 24px;
+ position: sticky;
+ top: 24px;
+
+ &__title {
+ font-size: 15px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0 0 8px;
+ }
+
+ &__text {
+ font-size: 13px;
+ line-height: 1.7;
+ color: #6b7280;
+ margin: 0 0 20px;
+ }
+}
+
+.deducate-support {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 8px;
+
+ > a:first-child {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__bale {
+ width: 40px;
+ height: 40px;
+ object-fit: contain;
+ flex-shrink: 0;
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .deducate-layout {
+ grid-template-columns: 1fr;
+ }
+
+ .deducate-side {
+ position: static;
+ }
+
+ .deducate-main {
+ max-height: none;
+ }
+}
diff --git a/src/views/base/educate/index.vue b/src/views/base/educate/index.vue
index ae612ab..0744f6b 100644
--- a/src/views/base/educate/index.vue
+++ b/src/views/base/educate/index.vue
@@ -1,208 +1,24 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ config.config.name_fa }}
+آموزش گامبهگام استفاده از خدمات
+
+
+
-
-
-
-
- آموزش نرم افزار
-
-
-
-
+
-
-
-
-
-
-
-
-
-
- ![]()
-
-
-
-
- ![]()
-
-
- ![]()
-
-
- ![]()
-
-
-
-
- شیوهٔ ورود و ثبت نام در گروسی گالری
-
-
- • برای ثبتنام در گروسی گالری، اگر قبلاً حساب کاربری دارید میتوانید از طریق پیامک وارد شوید.
- • اگر حساب کاربری ندارید، "از این قسمت" وارد صفحه ثبت نام شده و با وارد کردن نام و شماره تلفنی که با کد ملی شما مطابقت دارد، حساب کاربری بسازید.
- • الزامی به وارد کردن کد معرف نیست. -
- - • اگر حساب کاربری ندارید، "از این قسمت" وارد صفحه ثبت نام شده و با وارد کردن نام و شماره تلفنی که با کد ملی شما مطابقت دارد، حساب کاربری بسازید.
- • الزامی به وارد کردن کد معرف نیست. -
- شارژ کیف پول
-
-
- • ابتدا کیف پول را در منو انتخاب کرده، مبلغ مورد نظر را وارد نموده و دکمه واریز را انتخاب کنید تا کیف پول شما شارژ شود.
-
- -
- شیوهٔ خرید از گروسی گالری
-
-
- • سپس از بخش «خرید و فروش» انتخاب کنید که طلای آبشده میخواهید یا محصولات دیگر (شامل گوی، شمش یا مکعب).
- • توجه داشته باشید کارمزد طلای آبشده حدود ۲٪ است و کارمزد ریالی محصولات دیگر در پایین صفحه قیمت درج شده است. -
- - • توجه داشته باشید کارمزد طلای آبشده حدود ۲٪ است و کارمزد ریالی محصولات دیگر در پایین صفحه قیمت درج شده است. -
- شیوهٔ فروش در گروسی گالری
-
-
- • برای فروش محصولاتی که خریداری کردهاید، به بخش «خرید و فروش» مراجعه کرده، محصول موردنظر را انتخاب و گزینه فروش را بزنید تا مبلغ قابل دریافت نمایش داده شود.
- • مبلغ به کیف پول شما واریز میشود و از طریق پیام پشتیبانی میتوانید درخواست برداشت دهید.
- • اگر موجودی کیف پول بیش از ۱۰ میلیون تومان باشد، مبلغ تا پایان روز کاری بعد به حساب اعلامشده شما واریز خواهد شد. -
-
-
- - • مبلغ به کیف پول شما واریز میشود و از طریق پیام پشتیبانی میتوانید درخواست برداشت دهید.
- • اگر موجودی کیف پول بیش از ۱۰ میلیون تومان باشد، مبلغ تا پایان روز کاری بعد به حساب اعلامشده شما واریز خواهد شد. -
- شیوهٔ دریافت فیزیکی طلا (ارسال)
-
-
- • ابتدا موجودی محصول موردنظر را با پشتیبانی در واتساپ هماهنگ کنید.
- • سپس روی لوگو کلیک کرده، گزینه «برداشت فیزیکی» و بعد «درخواست جدید» را انتخاب کنید.
- • محصولات خریداریشده و تعداد آنها را مشخص کرده و آدرس خود را ثبت نمایید.
- • پشتیبانی عکس و وزن محصول را برای شما ارسال میکند.
- • ارسال بهصورت پسکرایه و بیمهشده انجام میشود.
-
-
-
- - • سپس روی لوگو کلیک کرده، گزینه «برداشت فیزیکی» و بعد «درخواست جدید» را انتخاب کنید.
- • محصولات خریداریشده و تعداد آنها را مشخص کرده و آدرس خود را ثبت نمایید.
- • پشتیبانی عکس و وزن محصول را برای شما ارسال میکند.
- • ارسال بهصورت پسکرایه و بیمهشده انجام میشود.
-
- پاداش معرفی
-
-
- • در صفحه اصلی روی "تنظیمات" کلیک کرده و وارد حساب کاربری خود شوید.
-
-
-
- • سپس گزینه «اشتراکگذاری» یا «کپی لینک» را انتخاب کرده و لینک دعوت را برای دوستانتان ارسال کنید.
- • در صورتی که دوستان شما از طریق لینک شما ثبتنام کنند، بهصورت خودکار ۱ سوت طلا بهعنوان پاداش دریافت خواهید کرد. -
-
- - • در صورتی که دوستان شما از طریق لینک شما ثبتنام کنند، بهصورت خودکار ۱ سوت طلا بهعنوان پاداش دریافت خواهید کرد. -
-
- تماس با پشتیبانی
-
-
-
-
-
-
-
-
-
-
- تماس با پشتیبانی
-
-
-
-
+
diff --git a/src/views/base/educate/mobile/MobileEducateView.vue b/src/views/base/educate/mobile/MobileEducateView.vue
new file mode 100644
index 0000000..8912b40
--- /dev/null
+++ b/src/views/base/educate/mobile/MobileEducateView.vue
@@ -0,0 +1,27 @@
+
+
+
+
+
+
diff --git a/src/views/base/fund/components/Item.vue b/src/views/base/fund/components/Item.vue
index e5c7e33..9e690f7 100644
--- a/src/views/base/fund/components/Item.vue
+++ b/src/views/base/fund/components/Item.vue
@@ -1,5 +1,9 @@
-
+
+
+
+ آموزش نرم افزار
+
+
+
+
+
+
+
+
+
+
![]()
{{ item.title ?? '-' }}
@@ -21,9 +25,12 @@ import { getProductDisplayImage } from '@/utils/productAssets'
interface Prop {
item: WalletInventoryCard
+ variant?: 'mobile' | 'desktop'
}
-const props = defineProps()
+const props = withDefaults(defineProps(), {
+ variant: 'mobile',
+})
const imageSrc = ref('')
const displayImage = computed(() => imageSrc.value || resolveImage())
diff --git a/src/views/base/fund/composables/useFundPage.ts b/src/views/base/fund/composables/useFundPage.ts
new file mode 100644
index 0000000..d62d318
--- /dev/null
+++ b/src/views/base/fund/composables/useFundPage.ts
@@ -0,0 +1,119 @@
+import { computed, inject, onMounted, provide, type InjectionKey, type Ref } from 'vue'
+import router from '@/router'
+import { loading } from '@/utils'
+import { usePriceWithoutType } from '@/utils/usePrice'
+import { useConfigStore } from '@/store/configStore'
+import { useWalletAssets } from '@/composables/useWalletAssets'
+import type { WalletMetalTotal } from '@/models/walletAssets'
+import { resolveSummaryMetalWeight, fundPageInventoryCards } from '@/utils/productAssets'
+import { useWalletStore } from '@/store/walletStore'
+import {
+ getProjectFundEmptyImage,
+ getProjectFundEmptyText,
+ getProjectFundHeaderBackground,
+ isBazretalaProject,
+} from '@/utils/config'
+import img from '@/assets/img/user_ly1.svg'
+import empty from '@/assets/img/cash_empty.svg'
+
+export interface FundPageContext {
+ isDesktop: Ref
+ nameProject: string
+ meta: ReturnType
+ inventoryCards: ReturnType
+ metalTotals: ReturnType
+ primaryMetalTotal: ReturnType
+ cashWallet: ReturnType
+ totalRialValue: ReturnType
+ countBasedInventory: ReturnType
+ fundHeaderBackground: string
+ fundEmptyImage: string
+ fundEmptyText: string
+ isBazretalaProject: typeof isBazretalaProject
+ formatMetalTotal: (metal: WalletMetalTotal) => string
+ openFundInfo: (productId: number) => void
+ goBack: () => void
+}
+
+export const FUND_PAGE_KEY: InjectionKey = Symbol('fundPage')
+
+export function useFundPage(isDesktop: Ref) {
+ const nameProject = useConfigStore().config.name
+ const { assetsSummary, loadWalletAssets } = useWalletAssets()
+ const walletStore = useWalletStore()
+ const fundHeaderBackground = getProjectFundHeaderBackground(img)
+ const fundEmptyImage = getProjectFundEmptyImage(empty)
+ const fundEmptyText = getProjectFundEmptyText()
+
+ const meta = computed(() => assetsSummary.value?.meta)
+ const inventoryCards = computed(() =>
+ fundPageInventoryCards(assetsSummary.value?.inventory_cards ?? [])
+ )
+ const metalTotals = computed(() => assetsSummary.value?.metal_totals ?? [])
+ const primaryMetalTotal = computed(() => metalTotals.value[0])
+ const cashWallet = computed(() => assetsSummary.value?.cash_wallet ?? 0)
+ const totalRialValue = computed(() => assetsSummary.value?.total_rial_value ?? 0)
+ const countBasedInventory = computed(() =>
+ (assetsSummary.value?.count_products ?? []).reduce(
+ (sum, item) => sum + Number(item.quantity ?? 0),
+ 0
+ )
+ )
+
+ function formatMetalTotal(metal: WalletMetalTotal) {
+ return `${resolveSummaryMetalWeight(metal, inventoryCards.value)}${metal.unit}`
+ }
+
+ function openFundInfo(productId: number) {
+ router.push({ name: 'fund_info', params: { id: productId } })
+ }
+
+ function goBack() {
+ router.back()
+ }
+
+ onMounted(async () => {
+ try {
+ loading.value = true
+ const tasks = [loadWalletAssets(true)]
+ if (isBazretalaProject()) {
+ tasks.push(walletStore.getMyWallet())
+ }
+ await Promise.all(tasks)
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ })
+
+ const context: FundPageContext = {
+ isDesktop,
+ nameProject,
+ meta,
+ inventoryCards,
+ metalTotals,
+ primaryMetalTotal,
+ cashWallet,
+ totalRialValue,
+ countBasedInventory,
+ fundHeaderBackground,
+ fundEmptyImage,
+ fundEmptyText,
+ isBazretalaProject,
+ formatMetalTotal,
+ openFundInfo,
+ goBack,
+ }
+
+ provide(FUND_PAGE_KEY, context)
+ return context
+}
+
+export function useFundPageContext() {
+ const context = inject(FUND_PAGE_KEY)
+ if (!context) {
+ throw new Error('useFundPageContext must be used within useFundPage')
+ }
+ return context
+}
diff --git a/src/views/base/fund/desktop/DesktopFundView.vue b/src/views/base/fund/desktop/DesktopFundView.vue
new file mode 100644
index 0000000..c5882ec
--- /dev/null
+++ b/src/views/base/fund/desktop/DesktopFundView.vue
@@ -0,0 +1,138 @@
+
+
+
+
+
+
diff --git a/src/views/base/fund/desktop/styles/desktop-fund.less b/src/views/base/fund/desktop/styles/desktop-fund.less
new file mode 100644
index 0000000..d4b73eb
--- /dev/null
+++ b/src/views/base/fund/desktop/styles/desktop-fund.less
@@ -0,0 +1,495 @@
+/* Premium desktop fund page */
+
+.dfund {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dfund__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dfund-topbar {
+ display: flex;
+ align-items: flex-start;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+ flex-shrink: 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 14px;
+ color: #6b7280;
+ margin: 6px 0 0;
+ line-height: 1.6;
+ }
+}
+
+.dfund-summary {
+ position: relative;
+ overflow: hidden;
+ border-radius: 16px;
+ margin-bottom: 24px;
+ background: @App-primary-color;
+ color: #fff;
+
+ &--bazretala {
+ background: #000;
+ }
+
+ &__bg {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ opacity: 0.08;
+ pointer-events: none;
+
+ &--cover {
+ inset: 0;
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ opacity: 0.35;
+ }
+ }
+
+ &__content {
+ position: relative;
+ z-index: 1;
+ padding: 24px 28px;
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ gap: 16px 24px;
+ }
+
+ &__title {
+ grid-column: 1 / -1;
+ font-size: 18px;
+ font-weight: 600;
+ margin: 0 0 4px;
+ color: #fff;
+ }
+
+ &__row {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ font-size: 13px;
+
+ span {
+ opacity: 0.85;
+ }
+
+ strong {
+ font-size: 16px;
+ font-weight: 700;
+ }
+
+ &--highlight {
+ grid-column: 1 / -1;
+ padding-top: 8px;
+ border-top: 1px solid rgba(255, 255, 255, 0.2);
+ }
+ }
+}
+
+.dfund-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dfund-inventory {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ padding: 24px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+
+ &__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 20px;
+ }
+
+ &__title {
+ font-size: 16px;
+ font-weight: 600;
+ margin: 0;
+ color: #111827;
+ }
+
+ &__count {
+ font-size: 13px;
+ color: #9ca3af;
+ }
+
+ &__grid {
+ display: grid;
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ gap: 16px;
+ }
+
+ &__card {
+ border: none;
+ background: transparent;
+ padding: 0;
+ cursor: pointer;
+ font-family: inherit;
+ text-align: inherit;
+ width: 100%;
+
+ &:hover .dfund-card {
+ border-color: rgba(15, 23, 42, 0.12);
+ box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
+ }
+ }
+
+ &__empty {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 12px;
+ padding: 48px 24px;
+ text-align: center;
+ color: #6b7280;
+ }
+
+ &__empty-img {
+ width: 160px;
+ max-width: 100%;
+ }
+}
+
+.dfund-card {
+ width: 100%;
+ border: 1px solid rgba(15, 23, 42, 0.08) !important;
+ border-radius: 14px !important;
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
+}
+
+@media (max-width: 1024px) {
+ .dfund-summary__content {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ }
+
+ .dfund-inventory__grid {
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ }
+}
+
+@media (max-width: 768px) {
+ .dfund-inventory__grid {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ }
+}
+
+/* Fund info desktop */
+
+.dfund-info {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dfund-info__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dfund-info-topbar {
+ display: flex;
+ align-items: flex-start;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+ flex-shrink: 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.dfund-info__layout {
+ display: grid;
+ grid-template-columns: 280px minmax(0, 1fr);
+ gap: 20px;
+ align-items: start;
+}
+
+.dfund-info__hero {
+ padding: 28px 24px;
+ text-align: center;
+}
+
+.dfund-info__image {
+ width: 120px;
+ height: 120px;
+ margin: 0 auto 16px;
+ border-radius: 16px;
+ background: #e0f2fe;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ overflow: hidden;
+
+ img {
+ max-width: 80%;
+ max-height: 80%;
+ object-fit: contain;
+ }
+}
+
+.dfund-info__balance {
+ display: flex;
+ align-items: baseline;
+ justify-content: center;
+ gap: 6px;
+}
+
+.dfund-info__balance-value {
+ font-size: 28px;
+ font-weight: 700;
+ color: @App-primary-color;
+}
+
+.dfund-info__balance-unit {
+ font-size: 14px;
+ color: #6b7280;
+}
+
+.dfund-info__balance-label {
+ margin: 8px 0 0;
+ font-size: 13px;
+ color: #9ca3af;
+}
+
+.dfund-info__transactions {
+ padding: 24px;
+}
+
+.dfund-info__transactions-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 16px;
+}
+
+.dfund-info__transactions-title {
+ font-size: 16px;
+ font-weight: 600;
+ margin: 0;
+}
+
+.dfund-info__transactions-count {
+ font-size: 13px;
+ color: #9ca3af;
+}
+
+.dfund-info__transactions-list {
+ max-height: 520px;
+ overflow-y: auto;
+}
+
+/* Fund new desktop */
+
+.dfund-new {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dfund-new__container {
+ max-width: 640px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dfund-new-topbar {
+ display: flex;
+ align-items: flex-start;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+ flex-shrink: 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.dfund-new__card {
+ padding: 32px 28px;
+}
+
+.dfund-new__preview {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 24px;
+}
+
+.dfund-new__preview-img {
+ width: 120px;
+ height: 120px;
+ object-fit: contain;
+ border-radius: 16px;
+ background: #e0f2fe;
+ padding: 16px;
+}
+
+.dfund-new__label {
+ display: block;
+ font-size: 13px;
+ font-weight: 600;
+ color: #374151;
+ margin-bottom: 8px;
+}
+
+.dfund-new__tags {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ margin: 20px 0 28px;
+}
+
+.dfund-new__tag {
+ padding: 8px 14px;
+ border-radius: 999px;
+ border: 1px solid rgba(15, 23, 42, 0.1);
+ background: #f3f4f6;
+ color: #4b5563;
+ font-size: 12px;
+ font-family: inherit;
+ cursor: pointer;
+
+ &--active {
+ background: @App-primary-color;
+ border-color: @App-primary-color;
+ color: #fff;
+ }
+}
+
+.dfund-new__submit {
+ width: 100%;
+}
diff --git a/src/views/base/fund/index.vue b/src/views/base/fund/index.vue
index 5d3ce08..ce9b24f 100644
--- a/src/views/base/fund/index.vue
+++ b/src/views/base/fund/index.vue
@@ -1,170 +1,23 @@
-
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
+ موجودی داراییها
+ +
+ محصولات
+ {{ countBasedInventory }} عدد
+
+
+
+
+ دارایی نقره
+ {{ walletStore.walletInfo?.count_silver ?? 0 }} گرم
+
+
+ دارایی طلایی
+ {{ walletStore.walletInfo?.count_gold_wallet ?? 0 }} گرم
+
+
+
+
+ {{ primaryMetalTotal.label }}
+ {{ formatMetalTotal(primaryMetalTotal) }}
+
+
+
+
+ {{ metal.label }}
+ {{ formatMetalTotal(metal) }}
+
+
+
+
+ مجموع موجودی
+ {{ countBasedInventory }} عدد
+
+
+ دارایی ریالی
+ {{ usePriceWithoutType(cashWallet) }} ریال
+
+
+ معادل ریالی مجموع
+ {{ usePriceWithoutType(totalRialValue) }} ریال
+
+
+
+
+ لیست داراییها
+ {{ inventoryCards.length }} مورد +
+ ![]()
+
+
+ {{ fundEmptyText }}
+
+
+
+
- > =
+ Symbol('fundInfoPage')
+
+export function useFundInfoPage() {
+ const info = ref()
+ const items = ref([])
+ const tableOutput = ref | null>(null)
+ const pagination = ref({})
+ const transactionShow = ref()
+ const editShow = ref()
+ const showDeleteConfirm = ref()
+ const isDeposit = ref()
+ const formRef = ref()
+ const fundStore = useFundUserStore()
+ const walletStore = useWalletStore()
+
+ const infoId: number = parseInt(String(router.currentRoute.value.params.id))
+ const userFormState = reactive({
+ value: undefined,
+ fund_id: infoId,
+ })
+
+ watch(transactionShow, (n) => (!n ? (userFormState.value = undefined) : ''))
+
+ const transButtonDisable = computed(() => {
+ if (!loading.value) {
+ if (userFormState.value !== undefined) {
+ if (isDeposit.value) {
+ return userFormState.value > walletStore?.walletInfo?.gold
+ }
+ return userFormState.value > (info.value?.wallet?.gold ?? 0)
+ }
+ return true
+ }
+ return true
+ })
+
+ const itemImg = computed(() => {
+ switch (info.value?.title) {
+ case 'خرید لوازم منزل':
+ return homeImg
+ case 'هدیه':
+ return giftImg
+ case 'گردش':
+ return circulationImg
+ case 'ازدواج':
+ return loveImg
+ case 'تعمیرات':
+ return repairsImg
+ case 'پس انداز':
+ return savingImg
+ default:
+ return savingImg
+ }
+ })
+
+ function deleteFundConfirm() {
+ if (info.value?.wallet === undefined || info.value?.wallet?.gold === 0) {
+ showDeleteConfirm.value = true
+ } else {
+ message.error('ابتدا گنج خود را خالی کنید')
+ editShow.value = false
+ }
+ }
+
+ async function deleteFundFunction() {
+ try {
+ loading.value = true
+ showDeleteConfirm.value = false
+ await deleteFund(infoId)
+ await fundStore.getMyFund()
+ router.back()
+ message.success('گنج با موفقیت حذف شد')
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ async function initInfo() {
+ try {
+ loading.value = true
+ info.value = await getOneProductWallet(infoId)
+ await initTable()
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ async function initTable() {
+ if (info.value?.wallet) {
+ try {
+ loading.value = true
+ items.value = []
+ Object.assign(pagination.value, { wallet_id: info.value?.wallet?.id })
+ tableOutput.value = await getFundTransactionTable(pagination.value)
+ items.value.push(...tableOutput.value.rows)
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+ }
+
+ async function transaction() {
+ formRef.value?.validateFields().then(async () => {
+ try {
+ loading.value = true
+ userFormState.fund_id = infoId
+ isDeposit.value ? await fundDeposit(userFormState) : await fundWithdraw(userFormState)
+ await initInfo()
+ await fundStore.getMyFund()
+ await walletStore.getMyWallet()
+ message.success(`با موفقیت${isDeposit.value ? ' واریز' : ' برداشت'} شد`)
+ transactionShow.value = false
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ })
+ }
+
+ function goBack() {
+ router.back()
+ }
+
+ onMounted(() => {
+ initInfo()
+ })
+
+ const context = {
+ info,
+ items,
+ transactionShow,
+ editShow,
+ showDeleteConfirm,
+ isDeposit,
+ formRef,
+ userFormState,
+ transButtonDisable,
+ itemImg,
+ walletStore,
+ deleteFundConfirm,
+ deleteFundFunction,
+ transaction,
+ goBack,
+ infoId,
+ }
+
+ provide(FUND_INFO_PAGE_KEY, context)
+ return context
+}
+
+export function useFundInfoPageContext() {
+ const context = inject(FUND_INFO_PAGE_KEY)
+ if (!context) {
+ throw new Error('useFundInfoPageContext must be used within useFundInfoPage')
+ }
+ return context
+}
diff --git a/src/views/base/fund/info/desktop/DesktopFundInfoView.vue b/src/views/base/fund/info/desktop/DesktopFundInfoView.vue
new file mode 100644
index 0000000..89f336a
--- /dev/null
+++ b/src/views/base/fund/info/desktop/DesktopFundInfoView.vue
@@ -0,0 +1,78 @@
+
+
-
-
-
- دارایی ها
-
- ![]()
-
-
-
- موجودی دارایی ها
-
- محصولات:
-
-
- {{ countBasedInventory }} عدد
-
- دارایی نقره:
-
- {{ walletStore.walletInfo?.count_silver ?? 0 }}گرم
-
- دارایی طلایی:
-
-
-
- {{ walletStore.walletInfo?.count_gold_wallet ?? 0 }}گرم
-
- {{ primaryMetalTotal.label }}:
-
-
-
- {{ formatMetalTotal(primaryMetalTotal) }}
-
- {{ metal.label }}:
-
-
- {{ formatMetalTotal(metal) }}
-
- مجموع موجودی:
-
- {{ countBasedInventory }} عدد
-
- دارایی ریالی:
-
- {{ usePriceWithoutType(cashWallet) }}ریال
-
- معادل ریالی مجموع دارایی ها:
-
- {{ usePriceWithoutType(totalRialValue) }}ریال
-
-
+
-
-
-
-
-
-
-
-
- ![]()
-
- {{ fundEmptyText }}
-
-
-
+
diff --git a/src/views/base/fund/info/components/FundEditActions.vue b/src/views/base/fund/info/components/FundEditActions.vue
new file mode 100644
index 0000000..ed5bb91
--- /dev/null
+++ b/src/views/base/fund/info/components/FundEditActions.vue
@@ -0,0 +1,48 @@
+
+
+
+
+
+
+
+
+ بازگشت
+
+
+
+
+
diff --git a/src/views/base/fund/info/components/FundTransactionForm.vue b/src/views/base/fund/info/components/FundTransactionForm.vue
new file mode 100644
index 0000000..41be6aa
--- /dev/null
+++ b/src/views/base/fund/info/components/FundTransactionForm.vue
@@ -0,0 +1,82 @@
+
+ گنج {{ info?.title }}
+
+ ویرایش
+ حذف
+
+
+
+
+
+
+
+
+ بازگشت
+
+
+
+
+
+
+
diff --git a/src/views/base/fund/info/composables/useFundInfoPage.ts b/src/views/base/fund/info/composables/useFundInfoPage.ts
new file mode 100644
index 0000000..cc2c018
--- /dev/null
+++ b/src/views/base/fund/info/composables/useFundInfoPage.ts
@@ -0,0 +1,185 @@
+import { computed, inject, onMounted, provide, reactive, ref, watch, type InjectionKey } from 'vue'
+import router from '@/router'
+import { loading } from '@/utils'
+import { deleteFund, fundDeposit, fundWithdraw, getFundById, getFundTransactionTable } from '@/api/fund'
+import type { FundTransaction } from '@/models/fund'
+import type { TableInput, TableOutput } from '@/models/table'
+import type { Transaction } from '@/models/transaction'
+import type { FormInstance } from 'ant-design-vue'
+import { message } from 'ant-design-vue'
+import { useWalletStore } from '@/store/walletStore'
+import { useFundUserStore } from '@/store/fundStore'
+import { getOneProductWallet } from '@/api/products'
+import type { Product } from '@/models/products'
+import homeImg from '@/assets/img/cash_home.svg'
+import giftImg from '@/assets/img/cash_gift.svg'
+import circulationImg from '@/assets/img/cash_circulation.svg'
+import loveImg from '@/assets/img/cash_love.svg'
+import repairsImg from '@/assets/img/cash_repairs.svg'
+import savingImg from '@/assets/img/cash_saving.svg'
+
+export const FUND_INFO_PAGE_KEY: InjectionKey
+ {{ isDeposit ? 'واریز' : 'برداشت' }}
+
+
+
+ {{ formatGoldWalletBalanceText(walletStore?.walletInfo?.gold ?? 0) }}
+
+ {{ `موجودی قابل برداشت گنج: ${info?.wallet?.gold ?? 0} گرم` }}
+
+
+ موجودی گنج {{ info?.title }}: {{ info?.wallet?.gold }} گرم
+
+
+
+ {{ isDeposit ? 'واریز' : 'برداشت' }}
+
+
+
+
+
diff --git a/src/views/base/fund/info/index.vue b/src/views/base/fund/info/index.vue
index 9d21b76..5e0c3bd 100644
--- a/src/views/base/fund/info/index.vue
+++ b/src/views/base/fund/info/index.vue
@@ -1,305 +1,79 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+
+
+ {{ info?.wallet?.gold ?? 0 }}
+ {{ info?.unit }}
+
+ موجودی گنج {{ info?.title }}
+
+
+
+ تراکنشها
+ {{ items.length }} مورد +
+
+
+
+
-
-
-
-
-
-
-
- بازگشت
-
-
+ > =
+ Symbol('fundNewPage')
+
+const types = [
+ { name: 'خرید لوازم منزل' },
+ { name: 'پس انداز' },
+ { name: 'گردش' },
+ { name: 'ازدواج' },
+ { name: 'تعمیرات' },
+ { name: 'هدیه' },
+]
+
+export function useFundNewPage() {
+ const fundStore = useFundUserStore()
+ const edit_id = computed(() => parseInt(router.currentRoute.value.query.id as string))
+ const name = ref('پس انداز')
+ const { prefixCls } = usePrefix('input_name')
+ const info = ref()
+
+ const itemImg = computed(() => {
+ switch (name.value) {
+ case 'خرید لوازم منزل':
+ return homeImg
+ case 'هدیه':
+ return giftImg
+ case 'گردش':
+ return circulationImg
+ case 'ازدواج':
+ return loveImg
+ case 'تعمیرات':
+ return repairsImg
+ case 'پس انداز':
+ return savingImg
+ default:
+ return savingImg
+ }
+ })
+
+ async function getEditInfo() {
+ try {
+ loading.value = true
+ info.value = await getFundById(edit_id.value)
+ name.value = info.value?.title ?? ''
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ async function ok() {
+ try {
+ loading.value = true
+ if (!name.value) {
+ message.error('ابتدا نام گنج را وارد کنید')
+ return
+ }
+ edit_id.value
+ ? await editFund(edit_id.value, { title: name.value })
+ : await createFund({ title: name.value })
+ await fundStore.getMyFund()
+ message.success(`گنج با موفقیت ${edit_id.value ? 'ویرایش' : 'ساخته'} شد`)
+ router.back()
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ function goBack() {
+ router.back()
+ }
+
+ onMounted(() => {
+ if (edit_id.value) {
+ getEditInfo()
+ }
+ })
+
+ const context = {
+ types,
+ edit_id,
+ name,
+ prefixCls,
+ info,
+ itemImg,
+ ok,
+ goBack,
+ }
+
+ provide(FUND_NEW_PAGE_KEY, context)
+ return context
+}
+
+export function useFundNewPageContext() {
+ const context = inject(FUND_NEW_PAGE_KEY)
+ if (!context) {
+ throw new Error('useFundNewPageContext must be used within useFundNewPage')
+ }
+ return context
+}
diff --git a/src/views/base/fund/newFund/desktop/DesktopFundNewView.vue b/src/views/base/fund/newFund/desktop/DesktopFundNewView.vue
new file mode 100644
index 0000000..fb5acd3
--- /dev/null
+++ b/src/views/base/fund/newFund/desktop/DesktopFundNewView.vue
@@ -0,0 +1,81 @@
+
+
-
-
-
-
-
-
- {{ info?.title }}
-
-
-
-
-
-
- ![]()
- ![]()
- ![]()
- ![]()
- ![]()
- ![]()
-
-
-
- {{ info?.wallet?.gold?? 0 }}
- {{info?.unit}}
- موجودی گنج {{ info?.title }}
-
-
-
- تراکنش ها
-
-
-
-
-
-
- {{ isDeposit ? 'واریز' : 'برداشت' }}
-
-
- {{ formatGoldWalletBalanceText(walletStore?.walletInfo?.gold ?? 0) }}
-
- {{ `موجودی قابل برداشت گنج: ${info?.wallet?.gold ?? 0} گرم` }}
-
- موجودی گنج {{ info.title }}: {{ info?.wallet?.gold }} گرم
-
-
-
- {{ isDeposit ? 'واریز' : 'برداشت' }}
-
+
+
-
-
+
-
-
-
-
-
- بازگشت
+
+
-
-
-
-
-
+
-
-
+
+
diff --git a/src/views/base/fund/info/mobile/MobileFundInfoView.vue b/src/views/base/fund/info/mobile/MobileFundInfoView.vue
new file mode 100644
index 0000000..27a61ae
--- /dev/null
+++ b/src/views/base/fund/info/mobile/MobileFundInfoView.vue
@@ -0,0 +1,63 @@
+
+ گنج {{ info?.title }}
+ ویرایش
- حذف
-
- آیا از حذف گنج خود اطمینان دارید؟
-
+
- حذف
-
-
- انصراف
-
+ آیا از حذف گنج خود اطمینان دارید؟
+
+
+ حذف
+ انصراف
-
+
+
+
+
diff --git a/src/views/base/fund/mobile/MobileFundView.vue b/src/views/base/fund/mobile/MobileFundView.vue
new file mode 100644
index 0000000..a0e182f
--- /dev/null
+++ b/src/views/base/fund/mobile/MobileFundView.vue
@@ -0,0 +1,161 @@
+
+
+
+
+
+
+
+ {{ info?.title }}
+
+
+
+
+
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+
+
+
+ {{ info?.wallet?.gold ?? 0 }}
+ {{ info?.unit }}
+ موجودی گنج {{ info?.title }}
+
+
+ تراکنش ها
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/fund/newFund/composables/useFundNewPage.ts b/src/views/base/fund/newFund/composables/useFundNewPage.ts
new file mode 100644
index 0000000..50eeab2
--- /dev/null
+++ b/src/views/base/fund/newFund/composables/useFundNewPage.ts
@@ -0,0 +1,117 @@
+import { computed, inject, onMounted, provide, ref, type InjectionKey } from 'vue'
+import router from '@/router'
+import { loading } from '@/utils'
+import { usePrefix } from '@/utils/usePrefix'
+import { createFund, editFund, getFundById } from '@/api/fund'
+import { message } from 'ant-design-vue/es'
+import { useFundUserStore } from '@/store/fundStore'
+import type { Fund } from '@/models/fund'
+import homeImg from '@/assets/img/cash_home.svg'
+import giftImg from '@/assets/img/cash_gift.svg'
+import circulationImg from '@/assets/img/cash_circulation.svg'
+import loveImg from '@/assets/img/cash_love.svg'
+import repairsImg from '@/assets/img/cash_repairs.svg'
+import savingImg from '@/assets/img/cash_saving.svg'
+
+export const FUND_NEW_PAGE_KEY: InjectionKey
+
+
+
+ دارایی ها
+
+ ![]()
+
+
+
+ موجودی دارایی ها
+
+ محصولات:
+
+
+ {{ countBasedInventory }} عدد
+
+ دارایی نقره:
+
+
+ {{ walletStore.walletInfo?.count_silver ?? 0 }}گرم
+
+
+ دارایی طلایی:
+
+
+
+
+ {{ walletStore.walletInfo?.count_gold_wallet ?? 0 }}گرم
+
+
+ {{ primaryMetalTotal.label }}:
+
+
+
+ {{ formatMetalTotal(primaryMetalTotal) }}
+
+ {{ metal.label }}:
+
+
+ {{ formatMetalTotal(metal) }}
+
+ مجموع موجودی:
+
+ {{ countBasedInventory }} عدد
+
+ دارایی ریالی:
+
+ {{ usePriceWithoutType(cashWallet) }}ریال
+
+ معادل ریالی مجموع دارایی ها:
+
+ {{ usePriceWithoutType(totalRialValue) }}ریال
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+ {{ fundEmptyText }}
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/fund/newFund/index.vue b/src/views/base/fund/newFund/index.vue
index 529a54e..65d5c1c 100644
--- a/src/views/base/fund/newFund/index.vue
+++ b/src/views/base/fund/newFund/index.vue
@@ -1,194 +1,23 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
-
-
-
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/giftCard/composables/useGiftCardPage.ts b/src/views/base/giftCard/composables/useGiftCardPage.ts
new file mode 100644
index 0000000..b9e7927
--- /dev/null
+++ b/src/views/base/giftCard/composables/useGiftCardPage.ts
@@ -0,0 +1,58 @@
+import { computed, inject, provide, ref, type ComputedRef, type InjectionKey, type Ref } from 'vue'
+import { loading } from '@/utils'
+import { registerCodeGiftCard } from '@/api/giftCard'
+import { message } from 'ant-design-vue'
+
+export interface GiftCardPageContext {
+ form: Ref<{ code: string }>
+ disableButton: ComputedRef
+ loading: typeof loading
+ registerGiftCard: () => Promise
+}
+
+export const GIFT_CARD_PAGE_CONTEXT_KEY: InjectionKey =
+ Symbol('giftCardPageContext')
+
+export function useGiftCardPage() {
+ const form = ref<{ code: string }>({
+ code: '',
+ })
+
+ const disableButton = computed(() => {
+ if (!loading.value) {
+ return !form.value.code || form.value.code.trim().length === 0
+ }
+ return true
+ })
+
+ async function registerGiftCard() {
+ try {
+ loading.value = true
+ await registerCodeGiftCard(form.value.code)
+ message.success('کد کارت هدیه با موفقیت ثبت شد')
+ form.value.code = ''
+ } catch (e: any) {
+ message.error(e?.response?.data?.message || 'خطا در ثبت کد کارت هدیه')
+ } finally {
+ loading.value = false
+ }
+ }
+
+ const context: GiftCardPageContext = {
+ form,
+ disableButton,
+ loading,
+ registerGiftCard,
+ }
+
+ provide(GIFT_CARD_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useGiftCardPageContext() {
+ const context = inject(GIFT_CARD_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useGiftCardPageContext must be used within a page that calls useGiftCardPage()')
+ }
+ return context
+}
diff --git a/src/views/base/giftCard/desktop/DesktopGiftCardView.vue b/src/views/base/giftCard/desktop/DesktopGiftCardView.vue
new file mode 100644
index 0000000..131057e
--- /dev/null
+++ b/src/views/base/giftCard/desktop/DesktopGiftCardView.vue
@@ -0,0 +1,50 @@
+
+
-
-
-
-
-
- {{edit_id? `ویرایش گنج ${name}`: 'صندوق جدید'}}
-
-
-
-
- ![]()
-
-
-
-
-
-
-
-
-
-
-
- {{ item.name }}
-
-
-
-
-
- {{edit_id? 'ویرایش گنج':'ساخت گنج'}}
-
+
-
\ No newline at end of file
+
diff --git a/src/views/base/fund/newFund/mobile/MobileFundNewView.vue b/src/views/base/fund/newFund/mobile/MobileFundNewView.vue
new file mode 100644
index 0000000..1e34d0f
--- /dev/null
+++ b/src/views/base/fund/newFund/mobile/MobileFundNewView.vue
@@ -0,0 +1,74 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/giftCard/components/GiftCardForm.vue b/src/views/base/giftCard/components/GiftCardForm.vue
new file mode 100644
index 0000000..78c81f2
--- /dev/null
+++ b/src/views/base/giftCard/components/GiftCardForm.vue
@@ -0,0 +1,52 @@
+
+
+
+
+
+
+
+ {{ edit_id ? `ویرایش گنج ${name}` : 'صندوق جدید' }}
+
+
+
+ ![]()
+
+
+
+
+
+
+ {{ item.name }}
+
+
+
+
+
+ {{ edit_id ? 'ویرایش گنج' : 'ساخت گنج' }}
+ + کد کارت هدیه خود را در فیلد بالا وارد کنید و سپس دکمه ثبت را بزنید. +
+
+
+
+
+
diff --git a/src/views/base/giftCard/desktop/styles/desktop-gift-card.less b/src/views/base/giftCard/desktop/styles/desktop-gift-card.less
new file mode 100644
index 0000000..e0d81a4
--- /dev/null
+++ b/src/views/base/giftCard/desktop/styles/desktop-gift-card.less
@@ -0,0 +1,186 @@
+/* Premium desktop gift card page */
+
+.dgift {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dgift__container {
+ max-width: 960px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dgift-topbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.dgift-layout {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) minmax(0, 320px);
+ gap: 20px;
+ align-items: start;
+}
+
+.dgift-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dgift-form {
+ padding: 28px;
+
+ &__header {
+ display: flex;
+ align-items: flex-start;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 20px;
+ border-bottom: 1px solid #eef0f3;
+ }
+
+ &__icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 56px;
+ height: 56px;
+ border-radius: 14px;
+ background: rgba(9, 61, 81, 0.08);
+ color: @App-primary-color;
+ flex-shrink: 0;
+ }
+
+ &__title {
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0 0 6px;
+ }
+
+ &__subtitle {
+ font-size: 13px;
+ line-height: 1.6;
+ color: #6b7280;
+ margin: 0;
+ }
+
+ &__hint {
+ font-size: 13px;
+ line-height: 1.7;
+ color: #6b7280;
+ margin: 0 0 16px;
+ }
+
+ &__submit {
+ width: 100%;
+ min-height: 44px;
+ margin-top: 8px;
+ }
+}
+
+.dgift-guide {
+ padding: 24px;
+ position: sticky;
+ top: 24px;
+
+ &__title {
+ font-size: 15px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0 0 16px;
+ }
+
+ &__steps {
+ margin: 0 0 20px;
+ padding: 0 20px 0 0;
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ font-size: 13px;
+ line-height: 1.7;
+ color: #4b5563;
+ }
+
+ &__note {
+ display: flex;
+ gap: 10px;
+ align-items: flex-start;
+ padding: 14px;
+ border-radius: 12px;
+ background: #f9fafb;
+ border: 1px solid #eef0f3;
+ color: #6b7280;
+
+ p {
+ margin: 0;
+ font-size: 12px;
+ line-height: 1.7;
+ }
+
+ svg,
+ .basic-icon {
+ color: @App-primary-color;
+ flex-shrink: 0;
+ margin-top: 2px;
+ }
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .dgift-layout {
+ grid-template-columns: 1fr;
+ }
+
+ .dgift-guide {
+ position: static;
+ }
+}
diff --git a/src/views/base/giftCard/index.vue b/src/views/base/giftCard/index.vue
index 75a5e7f..25adcf0 100644
--- a/src/views/base/giftCard/index.vue
+++ b/src/views/base/giftCard/index.vue
@@ -1,78 +1,24 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ثبت کد کارت هدیه
+کد دریافتی خود را وارد کنید تا اعتبار به حساب شما اضافه شود
+
- (), {})
+const isDesktop = useDesktopBreakpoint()
+const isStandaloneDesktop = computed(() => isDesktop.value && !props.ProductItem)
const isBuy = ref(true)
const tradeProductLabel = computed(() => {
diff --git a/src/views/base/home/components/AppHeader.vue b/src/views/base/home/components/AppHeader.vue
index ca43d94..ebe83b1 100644
--- a/src/views/base/home/components/AppHeader.vue
+++ b/src/views/base/home/components/AppHeader.vue
@@ -1,13 +1,17 @@
کارت هدیه
-
-
-
-
-
-
-
-
+
-
-
-
-
-
-
- کد کارت هدیه خود را در فیلد بالا وارد کنید و سپس دکمه ثبت را بزنید.
-
-
-
- ثبت کد
-
+
diff --git a/src/views/base/giftCard/mobile/MobileGiftCardView.vue b/src/views/base/giftCard/mobile/MobileGiftCardView.vue
new file mode 100644
index 0000000..4dd4816
--- /dev/null
+++ b/src/views/base/giftCard/mobile/MobileGiftCardView.vue
@@ -0,0 +1,18 @@
+
+
+
+
+
+
diff --git a/src/views/base/gold/desktop/styles/desktop-gold.less b/src/views/base/gold/desktop/styles/desktop-gold.less
new file mode 100644
index 0000000..d9e239b
--- /dev/null
+++ b/src/views/base/gold/desktop/styles/desktop-gold.less
@@ -0,0 +1,79 @@
+/* Desktop standalone gold trade page */
+
+.dgold {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+ padding: 28px 36px 40px;
+}
+
+.dgold-topbar {
+ display: flex;
+ align-items: flex-start;
+ gap: 16px;
+ max-width: 720px;
+ margin: 0 auto 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+ flex-shrink: 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.dgold__panel {
+ max-width: 720px;
+ margin: 0 auto;
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+ overflow-y: auto;
+ max-height: calc(100vh - 180px);
+ padding-bottom: 16px;
+}
+
+.dgold__panel .mb-25vh {
+ margin-bottom: 2rem !important;
+}
+
+.dgold__panel .bottom-18 {
+ position: static !important;
+ margin-top: 1rem;
+}
diff --git a/src/views/base/gold/index.vue b/src/views/base/gold/index.vue
index a2399aa..3487c94 100644
--- a/src/views/base/gold/index.vue
+++ b/src/views/base/gold/index.vue
@@ -1,5 +1,16 @@
- کارت هدیه
+
+
+
+
+
+
+
+
@@ -218,6 +276,8 @@ import { getLastPrice } from '@/api/home'
import Icon from '@/components/BasicPacks/BasicIcon.vue'
import { useUserStore } from '@/store/userStore'
import BasicActionSheet from '@/components/BasicPacks/BasicActionSheet.vue'
+import BasicModal from '@/components/BasicPacks/BasicModal.vue'
+import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
import { justNumber } from '@/utils/inputRules'
import GoldSkeleton from '@/views/base/gold/components/GoldSkeleton.vue'
import GoldLoading from '@/components/GoldLoading.vue'
@@ -270,6 +330,8 @@ interface Prop {
}
const props = withDefaults(defineProps
+
+
+
+
+
-
+
ثبت نهایی
+
+
+ ثبت نهایی
+
+
+
+
+
+
@@ -150,7 +161,7 @@
-->
@@ -185,6 +196,52 @@
+
+
+
+ وزن:
+
+
+ {{ form.goldValue }}
+ {{ weightUnit }}
+
+
+ مظنه:
+
+
+ {{ usePriceWithoutType(Math.round(goldPriceValue)) }}
+ ریال
+
+
+ کارمزد:
+
+
+ {{ feeInGrams }}
+ {{ weightUnit }}
+ (معادل {{ equivalentPrice }} ریال)
+
+
+ {{ isBuy ? 'قیمت قابل پرداخت:' : 'مبلغ دریافتی:' }}
+
+
+ {{ usePriceWithoutType(payablePrice.toFixed(0)) }}
+ ریال
+
@@ -197,6 +254,7 @@
-
\ No newline at end of file
+
+
+
diff --git a/src/views/base/home/components/AssetsSection.vue b/src/views/base/home/components/AssetsSection.vue
index d6ccc99..4da29b9 100644
--- a/src/views/base/home/components/AssetsSection.vue
+++ b/src/views/base/home/components/AssetsSection.vue
@@ -1,26 +1,31 @@
-
-
+
+
+
+ >
+
+
-
+ ![]()
+
+ {{ appName }}
+
-
+
+
محصولات:
- {{ countBasedInventory }} عدد
+
{{ primaryMetalTotal.label }}:
{{ formatMetalTotal(primaryMetalTotal) }}
{{ metal.label }}:
- {{ formatMetalTotal(metal) }}
@@ -28,34 +33,50 @@
v-if="metal.metal_id === metalTotals[0]?.metal_id"
icon="vuesax-linear:info-circle"
size="18"
- color="tertiary"
+ :color="iconColor"
@click="$emit('openGoldModal', metal)"
/>
+
+
+
+
+
+
+
diff --git a/src/views/base/home/components/HomeSkeleton.vue b/src/views/base/home/components/HomeSkeleton.vue
index 1e4b861..5311191 100644
--- a/src/views/base/home/components/HomeSkeleton.vue
+++ b/src/views/base/home/components/HomeSkeleton.vue
@@ -1,63 +1,54 @@
-
دارایی ریالی:
{{ usePriceWithoutType(totalRialValue) }} ریال
-
-
-
+
+
-
-
-
-
\ No newline at end of file
diff --git a/src/views/base/home/components/PriceChart.vue b/src/views/base/home/components/PriceChart.vue
index 8d650b8..5f78bf8 100644
--- a/src/views/base/home/components/PriceChart.vue
+++ b/src/views/base/home/components/PriceChart.vue
@@ -1,17 +1,45 @@
-
+
-
+
+
24 ساعت اخیر
هفته گذشته
ماه گذشته
-
+
@@ -19,21 +47,71 @@
\ No newline at end of file
+
+
+
diff --git a/src/views/base/home/components/PriceStats.vue b/src/views/base/home/components/PriceStats.vue
index 59ffe47..6bff178 100644
--- a/src/views/base/home/components/PriceStats.vue
+++ b/src/views/base/home/components/PriceStats.vue
@@ -1,5 +1,11 @@
-
+
بالاترین قیمت امروز
@@ -29,9 +35,17 @@ import { computed } from 'vue'
import { getTradeBuyPrice, getTradeSellPrice } from '@/utils/price'
import { usePriceWithoutType } from '../../../../utils/usePrice'
-const props = defineProps<{
- price: any
-}>()
+const props = withDefaults(
+ defineProps<{
+ price: any
+ layout?: 'default' | 'boursecu'
+ variant?: 'mobile' | 'desktop'
+ }>(),
+ {
+ layout: 'default',
+ variant: 'mobile',
+ }
+)
const highPrice = computed(() => props.price?.up?.buy ?? getTradeBuyPrice(props.price))
const lowPrice = computed(() => props.price?.up?.sell ?? getTradeSellPrice(props.price))
diff --git a/src/views/base/home/components/ReferralSection.vue b/src/views/base/home/components/ReferralSection.vue
index 5799cc2..7f4b328 100644
--- a/src/views/base/home/components/ReferralSection.vue
+++ b/src/views/base/home/components/ReferralSection.vue
@@ -1,35 +1,32 @@
-
- ([])
+const bannersLoading = ref(false)
+let bannersPromise: Promise | null = null
+let bannersLoaded = false
- const loadBanners = async () => {
- try {
- loading.value = true
- const response = await getConstByKey('header_banner')
- if (!response) return
+async function fetchBanners(force = false) {
+ if (!force && bannersLoaded) {
+ return
+ }
- let list = []
- if (typeof response === 'string') {
- list = JSON.parse(response)
- } else if (typeof response === 'object' && !Array.isArray(response) && 'value' in response) {
- list = typeof response.value === 'string' ? JSON.parse(response.value) : response.value
- } else if (Array.isArray(response) && response.length > 0) {
- const first = response[0]
- if (first.value) {
- list = typeof first.value === 'string' ? JSON.parse(first.value) : first.value
- } else if (first.icon) {
- list = response
- }
- }
+ if (!force && bannersPromise) {
+ return bannersPromise
+ }
- banners.value = Array.isArray(list) ? list.filter(b => b.show === true) : []
- } catch (error) {
- console.error('Error loading banners:', error)
- } finally {
- loading.value = false
+ bannersPromise = (async () => {
+ try {
+ bannersLoading.value = true
+ const response = await getConstByKey('header_banner')
+ if (!response) {
+ banners.value = []
+ return
+ }
+
+ let list: unknown[] = []
+ if (typeof response === 'string') {
+ list = JSON.parse(response)
+ } else if (typeof response === 'object' && !Array.isArray(response) && 'value' in response) {
+ const value = (response as { value: unknown }).value
+ list = typeof value === 'string' ? JSON.parse(value) : (value as unknown[])
+ } else if (Array.isArray(response) && response.length > 0) {
+ const first = response[0] as { value?: unknown; icon?: unknown }
+ if (first.value) {
+ list = typeof first.value === 'string' ? JSON.parse(first.value) : (first.value as unknown[])
+ } else if (first.icon) {
+ list = response
}
- }
+ }
- return { banners, loading, loadBanners }
-}
\ No newline at end of file
+ banners.value = Array.isArray(list)
+ ? list.filter((banner) => (banner as { show?: boolean }).show === true)
+ : []
+ bannersLoaded = true
+ } catch (error) {
+ console.error('Error loading banners:', error)
+ } finally {
+ bannersLoading.value = false
+ bannersPromise = null
+ }
+ })()
+
+ return bannersPromise
+}
+
+export function useBanners() {
+ return {
+ banners,
+ loading: bannersLoading,
+ loadBanners: fetchBanners,
+ }
+}
+
+export function loadHomeBanners(force = false) {
+ return fetchBanners(force)
+}
+
+export function resetHomeBanners() {
+ banners.value = []
+ bannersLoaded = false
+ bannersPromise = null
+}
diff --git a/src/views/base/home/composables/useHomePage.ts b/src/views/base/home/composables/useHomePage.ts
new file mode 100644
index 0000000..191439d
--- /dev/null
+++ b/src/views/base/home/composables/useHomePage.ts
@@ -0,0 +1,237 @@
+import { computed, inject, onMounted, onUnmounted, provide, ref, type InjectionKey } from 'vue'
+import router from '@/router'
+import { loading, removeToken } from '@/utils'
+import { useUserStore } from '@/store/userStore'
+import { useWalletStore } from '@/store/walletStore'
+import { useWalletAssets } from '@/composables/useWalletAssets'
+import type { WalletMetalTotal } from '@/models/walletAssets'
+import { formatMetalAssetsInfoText, formatRialAssetsInfoText } from '@/utils/productAssets'
+import { useConfigStore } from '@/store/configStore'
+import { lastPrice, stopLastPricePolling } from '@/utils/price'
+import { message, Modal } from 'ant-design-vue'
+import { getReferralShareText, getReferralShareTitle } from '@/utils/config'
+import { useBanners } from './useBanners'
+import { usePriceChart, type ChartMetalType } from './usePriceChart'
+import type { HomeActionItem } from '../layouts/types'
+import { getHomeLayoutId } from '../layouts/registry'
+import { initHomePageData, resetHomePageData } from './useHomePageData'
+import { resetWalletPageData } from '../../wallet/composables/useWalletPageData'
+import { resetAddressPageData } from '../../address/composables/useAddressPageData'
+import { resetTransactionsPageData } from '../../transactions/composables/useTransactionsPageData'
+import { resetProductsPageData } from '../../products/composables/useProductsPageData'
+
+export interface HomePageContext {
+ loading: typeof loading
+ isGaroosi: ReturnType>
+ limitedPrice: ReturnType
+ showClosedMessage: ReturnType>
+ closedMessage: ReturnType
+ mainActions: ReturnType>
+ banners: ReturnType['banners']
+ priceChartSeries: ReturnType['priceChartSeries']
+ chartSelection: ReturnType['chartSelection']
+ updateChartData: ReturnType['updateChartData']
+ selectedChartMetal: ReturnType['selectedChartMetal']
+ setChartMetal: (metal: ChartMetalType) => void
+ isBoursecuHomeLayout: ReturnType>
+ handleBannerClick: (banner: { typeClick?: string; modalText?: string; link?: string }) => void
+ openGoldModal: (metal: WalletMetalTotal) => void
+ openRialModal: () => void
+}
+
+export const HOME_PAGE_CONTEXT_KEY: InjectionKey = Symbol('homePageContext')
+
+export function useHomePage() {
+ const userStore = useUserStore()
+ const walletStore = useWalletStore()
+ const configStore = useConfigStore()
+ const { assetsSummary, clearWalletAssets } = useWalletAssets()
+
+ const showLogoutConfirm = ref(false)
+ const wholeBalanceVisible = ref(false)
+ const showTextBanner = ref(false)
+ const showShare = ref(false)
+ const TextBanner = ref('')
+
+ const { banners } = useBanners()
+ const {
+ updateChartData,
+ priceChartSeries,
+ chartSelection,
+ selectedChartMetal,
+ setChartMetal,
+ } = usePriceChart()
+ const isBoursecuHomeLayout = computed(() => getHomeLayoutId() === 'boursecu')
+
+ const isGaroosi = computed(() => configStore.config?.name === 'garoosi')
+ const closedMessage = computed(() => userStore.getValueByKey('closed_message'))
+ const showClosedMessage = computed(
+ () => Boolean(closedMessage.value && lastPrice?.value?.price_last === 0)
+ )
+ const limitedPrice = computed(() => walletStore.limitedPrice?.[0])
+ const goldVal = computed(() => lastPrice.value?.price_last ?? 1)
+
+ const mainActions = computed(() => [
+ {
+ name: 'buySell',
+ icon: 'vuesax-linear:money-receive',
+ label: 'خرید و فروش',
+ handler: () => router.push({ name: 'buyProduct' }),
+ },
+ {
+ name: 'deposit',
+ icon: 'vuesax-linear:card-add',
+ label: isGaroosi.value ? 'واریز و برداشت' : 'واریز نقدی',
+ handler: () => router.push({ name: 'wallet', query: { state: 'deposit' } }),
+ },
+ {
+ name: 'balance',
+ icon: 'vuesax-linear:receipt-item',
+ label: 'موجودی',
+ handler: () => {
+ wholeBalanceVisible.value = true
+ },
+ },
+ {
+ name: 'assets',
+ icon: 'vuesax-linear:cup',
+ label: isGaroosi.value ? 'دعوت از دوستان' : 'دارایی ها',
+ handler: () => (isGaroosi.value ? shareCode() : router.push({ name: 'fund' })),
+ },
+ ])
+
+ async function shareCode() {
+ const text = getReferralShareText({
+ userName: userStore.userInfo?.name,
+ projectName: configStore.config.name,
+ referralId: userStore.userInfo?.referral_id,
+ })
+
+ try {
+ await navigator.share({
+ title: getReferralShareTitle(configStore.config.name),
+ text,
+ })
+ } catch {
+ copyCode()
+ }
+ }
+
+ function copyCode() {
+ const code = userStore.userInfo?.referral_id
+ if (code) {
+ navigator.clipboard.writeText(code)
+ message.info('کد رونوشت شد')
+ }
+ }
+
+ async function logout() {
+ userStore.userInfo = undefined
+ walletStore.walletInfo = undefined
+ clearWalletAssets()
+ resetHomePageData()
+ resetWalletPageData()
+ resetAddressPageData()
+ resetTransactionsPageData()
+ resetProductsPageData()
+ removeToken()
+ await router.push({ name: 'login' })
+ window.location.reload()
+ }
+
+ function openGoldModal(metal: WalletMetalTotal) {
+ Modal.confirm({
+ title: formatMetalAssetsInfoText(metal),
+ okText: 'متوجه شدم',
+ centered: true,
+ cancelButtonProps: { style: { display: 'none' } },
+ })
+ }
+
+ function openRialModal() {
+ const summary = assetsSummary.value
+ Modal.confirm({
+ title: formatRialAssetsInfoText(
+ summary?.cash_wallet ?? 0,
+ summary?.assets_rial_value ?? 0
+ ),
+ okText: 'متوجه شدم',
+ centered: true,
+ cancelButtonProps: { style: { display: 'none' } },
+ })
+ }
+
+ function handleBannerClick(banner: { typeClick?: string; modalText?: string; link?: string }) {
+ const handlers: Record void> = {
+ share: () => {
+ showShare.value = true
+ },
+ modal: () => {
+ if (banner.modalText) {
+ TextBanner.value = banner.modalText
+ showTextBanner.value = true
+ }
+ },
+ link: () => {
+ if (banner.link) {
+ if (banner.link.startsWith('http')) {
+ window.open(banner.link, '_blank')
+ } else {
+ router.push(banner.link)
+ }
+ }
+ },
+ }
+ handlers[banner.typeClick ?? '']?.()
+ }
+
+ const context: HomePageContext = {
+ loading,
+ isGaroosi,
+ limitedPrice,
+ showClosedMessage,
+ closedMessage,
+ mainActions,
+ banners,
+ priceChartSeries,
+ chartSelection,
+ updateChartData,
+ selectedChartMetal,
+ setChartMetal,
+ isBoursecuHomeLayout,
+ handleBannerClick,
+ openGoldModal,
+ openRialModal,
+ }
+
+ provide(HOME_PAGE_CONTEXT_KEY, context)
+
+ onUnmounted(() => {
+ stopLastPricePolling()
+ })
+
+ onMounted(() => {
+ // Single shared fetch for mobile + desktop — safe to call on remount (deduped in useHomePageData)
+ void initHomePageData()
+ })
+
+ return {
+ userStore,
+ walletStore,
+ showLogoutConfirm,
+ wholeBalanceVisible,
+ showTextBanner,
+ showShare,
+ TextBanner,
+ goldVal,
+ logout,
+ }
+}
+
+export function useHomePageContext() {
+ const context = inject(HOME_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useHomePageContext must be used within useHomePage')
+ }
+ return context
+}
diff --git a/src/views/base/home/composables/useHomePageData.ts b/src/views/base/home/composables/useHomePageData.ts
new file mode 100644
index 0000000..7c987ad
--- /dev/null
+++ b/src/views/base/home/composables/useHomePageData.ts
@@ -0,0 +1,76 @@
+import { ref } from 'vue'
+import { loading } from '@/utils'
+import { getLastPrices, startLastPricePolling, stopLastPricePolling } from '@/utils/price'
+import { useWalletAssets } from '@/composables/useWalletAssets'
+import { clearProductsCatalog } from '@/composables/useProductsCatalog'
+import { getHomeLayoutId } from '../layouts/registry'
+import { fetchHomeChartPrices, loadHomeMaftolOffset, resetHomePriceChart } from './usePriceChart'
+import { loadHomeBanners, resetHomeBanners } from './useBanners'
+import { loadHomeFunds, resetHomeFunds } from './useUserFunds'
+
+/**
+ * Single entry point for all homepage API calls.
+ * Mobile and desktop layouts must not fetch independently — they consume shared module state.
+ */
+let initPromise: Promise | null = null
+const initialized = ref(false)
+
+export function isHomePageDataInitialized() {
+ return initialized.value
+}
+
+export async function initHomePageData(force = false) {
+ if (!force && initialized.value) {
+ // Resume live price updates when returning to home without refetching datasets
+ startLastPricePolling()
+ return
+ }
+
+ if (!force && initPromise) {
+ return initPromise
+ }
+
+ initPromise = (async () => {
+ try {
+ loading.value = true
+ const { loadWalletAssets } = useWalletAssets()
+
+ await Promise.all([
+ loadHomeFunds(force),
+ loadWalletAssets(force),
+ getLastPrices(),
+ fetchHomeChartPrices(force),
+ startLastPricePolling(),
+ loadHomeBanners(force),
+ ])
+
+ if (getHomeLayoutId() === 'boursecu') {
+ await loadHomeMaftolOffset(force)
+ }
+
+ initialized.value = true
+ } catch (error) {
+ console.error('Home page initialization error:', error)
+ } finally {
+ loading.value = false
+ initPromise = null
+ }
+ })()
+
+ return initPromise
+}
+
+/** Clears homepage caches — call on logout or when a full refresh is required. */
+export function resetHomePageData() {
+ initialized.value = false
+ initPromise = null
+ stopLastPricePolling()
+ resetHomeBanners()
+ resetHomeFunds()
+ resetHomePriceChart()
+ clearProductsCatalog()
+}
+
+export function useHomePageInitState() {
+ return { initialized }
+}
diff --git a/src/views/base/home/composables/usePriceChart.ts b/src/views/base/home/composables/usePriceChart.ts
index 9a56a33..1982ffe 100644
--- a/src/views/base/home/composables/usePriceChart.ts
+++ b/src/views/base/home/composables/usePriceChart.ts
@@ -1,33 +1,225 @@
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
import { getAllPrices } from '@/api/home'
+import type { Product } from '@/models/products'
+import { getProductsCatalog } from '@/composables/useProductsCatalog'
+import { getHomeLayoutId } from '../layouts/registry'
+import { getProductBuyPrice, resolvePriceOffsetRatio } from '@/utils/productPrice'
+import { isKatodMesGroup, isMaftolMesGroup } from '@/utils/productDealMethod'
+import { getTradeBuyPrice, lastPrice } from '@/utils/price'
+
+export type ChartMetalType = 'katod' | 'maftol'
+
+type ChartPoint = [number, number]
+
+/** Module-level chart state — one dataset shared by mobile and desktop PriceChart instances. */
+const priceChartSeries = ref<{ name: string; data: ChartPoint[] }[]>([
+ { name: 'قیمت', data: [] },
+])
+const rawChartPoints = ref([])
+const chartSelection = ref('DAILY')
+const chartLoading = ref(false)
+const selectedChartMetal = ref('katod')
+const maftolChartRatio = ref(0)
+
+let chartFetchPromise: Promise | null = null
+let chartInitialized = false
+let maftolOffsetPromise: Promise | null = null
+let maftolOffsetLoaded = false
+
+function findKatodProduct(products: Product[]) {
+ return (
+ products.find((product) => isKatodMesGroup(product.group_type))
+ ?? products.find((product) => (product.title ?? '').includes('کاتد'))
+ )
+}
+
+function findMaftolProduct(products: Product[]) {
+ return (
+ products.find((product) => isMaftolMesGroup(product.group_type))
+ ?? products.find((product) => (product.title ?? '').includes('مفتول'))
+ )
+}
+
+function applyChartRatio(basePrice: number, ratio: number) {
+ if (!ratio) {
+ return basePrice
+ }
+
+ return Math.round(basePrice + basePrice * ratio)
+}
+
+function deriveMaftolChartRatio(maftolProduct?: Product, katodProduct?: Product) {
+ const offsetRatio = resolvePriceOffsetRatio(maftolProduct?.price_offset_percent)
+ if (offsetRatio) {
+ return offsetRatio
+ }
+
+ if (!maftolProduct) {
+ return 0
+ }
+
+ const basePrice = getTradeBuyPrice(lastPrice.value)
+ const katodPrice = katodProduct ? getProductBuyPrice(katodProduct) : basePrice
+ const maftolPrice = getProductBuyPrice(maftolProduct)
+ const referencePrice = katodPrice || basePrice
+
+ if (!referencePrice || !maftolPrice || referencePrice === maftolPrice) {
+ return 0
+ }
+
+ return (maftolPrice - referencePrice) / referencePrice
+}
+
+function normalizeChartTimestamp(timestamp: number) {
+ return timestamp < 1_000_000_000_000 ? timestamp * 1000 : timestamp
+}
+
+function resolvePricesMap(response: unknown): Record> | null {
+ if (!response || typeof response !== 'object') {
+ return null
+ }
+
+ const body = response as Record
+ const nested = body.data
+
+ if (nested && typeof nested === 'object' && 'prices' in nested) {
+ return (nested as { prices: Record> }).prices
+ }
+
+ if ('prices' in body) {
+ return body.prices as Record>
+ }
+
+ return null
+}
+
+function buildChartPoints(items: Array<{ timestamp: number; value: number }>): ChartPoint[] {
+ return items.map((item) => [
+ normalizeChartTimestamp(item.timestamp),
+ item.value - 1,
+ ])
+}
+
+function syncChartSeries() {
+ const data =
+ getHomeLayoutId() === 'boursecu' && selectedChartMetal.value === 'maftol'
+ ? rawChartPoints.value.map(
+ ([timestamp, value]) =>
+ [timestamp, applyChartRatio(value, maftolChartRatio.value)] as ChartPoint
+ )
+ : rawChartPoints.value
+
+ priceChartSeries.value[0].data = data
+}
+
+watch([selectedChartMetal, maftolChartRatio], () => {
+ syncChartSeries()
+})
+
+async function fetchPrices(force = false) {
+ if (!force && chartInitialized && rawChartPoints.value.length > 0) {
+ syncChartSeries()
+ return
+ }
+
+ if (!force && chartFetchPromise) {
+ return chartFetchPromise
+ }
+
+ chartFetchPromise = (async () => {
+ try {
+ chartLoading.value = true
+ const response = await getAllPrices()
+ const data = resolvePricesMap(response)
+ const selectedData = data?.[chartSelection.value] ?? []
+ rawChartPoints.value = buildChartPoints(selectedData)
+ syncChartSeries()
+ chartInitialized = true
+ } catch (error) {
+ console.error('Error fetching prices:', error)
+ } finally {
+ chartLoading.value = false
+ chartFetchPromise = null
+ }
+ })()
+
+ return chartFetchPromise
+}
+
+async function loadMaftolOffset(force = false) {
+ if (getHomeLayoutId() !== 'boursecu') {
+ maftolChartRatio.value = 0
+ syncChartSeries()
+ return
+ }
+
+ if (!force && maftolOffsetLoaded) {
+ return
+ }
+
+ if (!force && maftolOffsetPromise) {
+ return maftolOffsetPromise
+ }
+
+ maftolOffsetPromise = (async () => {
+ try {
+ const products = await getProductsCatalog(force)
+ const katodProduct = findKatodProduct(products)
+ const maftolProduct = findMaftolProduct(products)
+ maftolChartRatio.value = deriveMaftolChartRatio(maftolProduct, katodProduct)
+ syncChartSeries()
+ maftolOffsetLoaded = true
+ } catch (error) {
+ console.error('Error loading maftol chart ratio:', error)
+ maftolChartRatio.value = 0
+ syncChartSeries()
+ } finally {
+ maftolOffsetPromise = null
+ }
+ })()
+
+ return maftolOffsetPromise
+}
+
+function updateChartData(timeline: string) {
+ chartSelection.value = timeline
+ void fetchPrices(true)
+}
+
+function setChartMetal(metal: ChartMetalType) {
+ selectedChartMetal.value = metal
+}
export function usePriceChart() {
- const priceChartSeries = ref([{ name: 'قیمت', data: [] }])
- const selection = ref('DAILY')
- const chartLoading = ref(false)
+ return {
+ priceChartSeries,
+ chartSelection,
+ chartLoading,
+ selectedChartMetal,
+ maftolChartRatio,
+ updateChartData,
+ fetchPrices,
+ loadMaftolOffset,
+ setChartMetal,
+ }
+}
- const toPersianNumber = (num: number) => {
- return num.toString().replace(/\d/g, (d) => '۰۱۲۳۴۵۶۷۸۹'[d])
- }
+export function fetchHomeChartPrices(force = false) {
+ return fetchPrices(force)
+}
- const fetchPrices = async () => {
- try {
- chartLoading.value = true
- const response = await getAllPrices()
- const data = response.data?.prices
- const selectedData = data[selection.value] || []
- priceChartSeries.value[0].data = selectedData.map((item: any) => [item.timestamp, item.value - 1])
- } catch (error) {
- console.error('Error fetching prices:', error)
- } finally {
- chartLoading.value = false
- }
- }
+export function loadHomeMaftolOffset(force = false) {
+ return loadMaftolOffset(force)
+}
- const updateChartData = (timeline: string) => {
- selection.value = timeline
- fetchPrices()
- }
-
- return { priceChartSeries, chartLoading, updateChartData, fetchPrices }
-}
\ No newline at end of file
+export function resetHomePriceChart() {
+ priceChartSeries.value = [{ name: 'قیمت', data: [] }]
+ rawChartPoints.value = []
+ chartSelection.value = 'DAILY'
+ selectedChartMetal.value = 'katod'
+ maftolChartRatio.value = 0
+ chartInitialized = false
+ chartFetchPromise = null
+ maftolOffsetLoaded = false
+ maftolOffsetPromise = null
+}
diff --git a/src/views/base/home/composables/useUserFunds.ts b/src/views/base/home/composables/useUserFunds.ts
index f85f53d..449d241 100644
--- a/src/views/base/home/composables/useUserFunds.ts
+++ b/src/views/base/home/composables/useUserFunds.ts
@@ -1,22 +1,54 @@
import { ref } from 'vue'
import { useFundUserStore } from '@/store/fundStore'
-export function useUserFunds() {
- const funds = ref([])
- const loading = ref(false)
- const fundStore = useFundUserStore()
+/** Module-level fund list — shared across home layout variants. */
+const funds = ref([])
+const fundsLoading = ref(false)
+let fundsPromise: Promise | null = null
+let fundsLoaded = false
- const loadFunds = async () => {
- try {
- loading.value = true
- const result = await fundStore.getMyFund()
- funds.value = result?.rows || []
- } catch (error) {
- console.error('Error loading funds:', error)
- } finally {
- loading.value = false
- }
+async function fetchFunds(force = false) {
+ if (!force && fundsLoaded) {
+ return
+ }
+
+ if (!force && fundsPromise) {
+ return fundsPromise
+ }
+
+ const fundStore = useFundUserStore()
+
+ fundsPromise = (async () => {
+ try {
+ fundsLoading.value = true
+ const result = await fundStore.getMyFund()
+ funds.value = result?.rows || []
+ fundsLoaded = true
+ } catch (error) {
+ console.error('Error loading funds:', error)
+ } finally {
+ fundsLoading.value = false
+ fundsPromise = null
}
+ })()
- return { funds, loading, loadFunds }
-}
\ No newline at end of file
+ return fundsPromise
+}
+
+export function useUserFunds() {
+ return {
+ funds,
+ loading: fundsLoading,
+ loadFunds: fetchFunds,
+ }
+}
+
+export function loadHomeFunds(force = false) {
+ return fetchFunds(force)
+}
+
+export function resetHomeFunds() {
+ funds.value = []
+ fundsLoaded = false
+ fundsPromise = null
+}
diff --git a/src/views/base/home/desktop/HomeDesktopView.vue b/src/views/base/home/desktop/HomeDesktopView.vue
new file mode 100644
index 0000000..09045a1
--- /dev/null
+++ b/src/views/base/home/desktop/HomeDesktopView.vue
@@ -0,0 +1,17 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopAssetsMetrics.vue b/src/views/base/home/desktop/components/DesktopAssetsMetrics.vue
new file mode 100644
index 0000000..2096e42
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopAssetsMetrics.vue
@@ -0,0 +1,111 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopChartPanel.vue b/src/views/base/home/desktop/components/DesktopChartPanel.vue
new file mode 100644
index 0000000..6dd270c
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopChartPanel.vue
@@ -0,0 +1,27 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopChartSection.vue b/src/views/base/home/desktop/components/DesktopChartSection.vue
new file mode 100644
index 0000000..931fecb
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopChartSection.vue
@@ -0,0 +1,27 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopDefaultActions.vue b/src/views/base/home/desktop/components/DesktopDefaultActions.vue
new file mode 100644
index 0000000..4577d18
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopDefaultActions.vue
@@ -0,0 +1,32 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopGaroosiAssets.vue b/src/views/base/home/desktop/components/DesktopGaroosiAssets.vue
new file mode 100644
index 0000000..48326ec
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopGaroosiAssets.vue
@@ -0,0 +1,30 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopHomeAlerts.vue b/src/views/base/home/desktop/components/DesktopHomeAlerts.vue
new file mode 100644
index 0000000..0a239e7
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopHomeAlerts.vue
@@ -0,0 +1,36 @@
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopHomeHeader.vue b/src/views/base/home/desktop/components/DesktopHomeHeader.vue
new file mode 100644
index 0000000..445dda1
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopHomeHeader.vue
@@ -0,0 +1,49 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopHomeSection.vue b/src/views/base/home/desktop/components/DesktopHomeSection.vue
new file mode 100644
index 0000000..88f4d9a
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopHomeSection.vue
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopHomeShell.vue b/src/views/base/home/desktop/components/DesktopHomeShell.vue
new file mode 100644
index 0000000..7d615ac
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopHomeShell.vue
@@ -0,0 +1,15 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopLivePrice.vue b/src/views/base/home/desktop/components/DesktopLivePrice.vue
new file mode 100644
index 0000000..a69174f
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopLivePrice.vue
@@ -0,0 +1,46 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopQuickActionsPanel.vue b/src/views/base/home/desktop/components/DesktopQuickActionsPanel.vue
new file mode 100644
index 0000000..7ad3d62
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopQuickActionsPanel.vue
@@ -0,0 +1,42 @@
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopReferralPanel.vue b/src/views/base/home/desktop/components/DesktopReferralPanel.vue
new file mode 100644
index 0000000..4ce38fa
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopReferralPanel.vue
@@ -0,0 +1,14 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/layouts/BoursecuDesktopHome.vue b/src/views/base/home/desktop/layouts/BoursecuDesktopHome.vue
new file mode 100644
index 0000000..dffd48e
--- /dev/null
+++ b/src/views/base/home/desktop/layouts/BoursecuDesktopHome.vue
@@ -0,0 +1,51 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/layouts/DefaultDesktopHome.vue b/src/views/base/home/desktop/layouts/DefaultDesktopHome.vue
new file mode 100644
index 0000000..5ee49ba
--- /dev/null
+++ b/src/views/base/home/desktop/layouts/DefaultDesktopHome.vue
@@ -0,0 +1,68 @@
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/styles/desktop-home.less b/src/views/base/home/desktop/styles/desktop-home.less
new file mode 100644
index 0000000..69818c2
--- /dev/null
+++ b/src/views/base/home/desktop/styles/desktop-home.less
@@ -0,0 +1,516 @@
+/* Premium desktop home — SaaS dashboard design tokens */
+
+.dhome {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+ font-feature-settings: 'ss01' on;
+}
+
+.dhome__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dhome-label {
+ display: block;
+ font-size: 11px;
+ font-weight: 600;
+ letter-spacing: 0.06em;
+ color: #9ca3af;
+ margin-bottom: 6px;
+}
+
+.dhome-surface {
+ background: #ffffff;
+ border-radius: 14px;
+ padding: 22px 24px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+ min-width: 0;
+ overflow: hidden;
+
+ .home-referral {
+ margin-top: 0;
+ }
+}
+
+.dhome-section {
+ &__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 16px;
+ }
+
+ &__title {
+ font-size: 13px;
+ font-weight: 600;
+ color: #374151;
+ letter-spacing: -0.01em;
+ }
+}
+
+/* Topbar */
+.dhome-topbar {
+ display: flex;
+ align-items: flex-end;
+ justify-content: space-between;
+ gap: 24px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin-bottom: 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ line-height: 1.2;
+ }
+
+ &__actions {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ }
+}
+
+.dhome-btn-ghost {
+ display: inline-flex;
+ align-items: center;
+ gap: 6px;
+ padding: 8px 12px;
+ border: none;
+ border-radius: 8px;
+ background: transparent;
+ font-size: 13px;
+ font-weight: 500;
+ color: #6b7280;
+ cursor: pointer;
+ transition: color 0.15s ease, background 0.15s ease;
+
+ &:hover {
+ color: #111827;
+ background: rgba(15, 23, 42, 0.04);
+ }
+}
+
+/* Alerts */
+.dhome-alerts {
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+ margin-bottom: 20px;
+}
+
+.dhome-alert {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ padding: 10px 14px;
+ border-radius: 10px;
+ font-size: 12px;
+ font-weight: 500;
+ line-height: 1.5;
+
+ &--warning {
+ background: #fef3f2;
+ color: #b42318;
+ }
+
+ &--info {
+ background: #f0f4ff;
+ color: #344054;
+ }
+}
+
+/* Hero price */
+.dhome-hero-row {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) 300px;
+ gap: 16px;
+ margin-bottom: 16px;
+}
+
+.dhome-hero-price {
+ &__brand {
+ font-size: 13px;
+ color: #6b7280;
+ margin: 0 0 12px;
+ }
+
+ &__value-row {
+ display: flex;
+ align-items: baseline;
+ flex-wrap: wrap;
+ gap: 10px;
+ }
+
+ &__odometer {
+ font-size: 32px !important;
+ font-weight: 600 !important;
+ letter-spacing: -0.03em;
+ color: #111827;
+ direction: ltr;
+ line-height: 1;
+ }
+
+ &__unit {
+ font-size: 14px;
+ font-weight: 500;
+ color: #9ca3af;
+ }
+
+ &__delta {
+ display: inline-flex;
+ align-items: center;
+ padding: 4px 8px;
+ border-radius: 6px;
+ font-size: 12px;
+ font-weight: 600;
+ direction: ltr;
+
+ &--up {
+ background: #ecfdf3;
+ color: #027a48;
+ }
+
+ &--down {
+ background: #fef3f2;
+ color: #b42318;
+ }
+ }
+}
+
+.dhome-price-range {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ gap: 16px;
+ height: 100%;
+
+ &__item {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ }
+
+ &__value {
+ font-size: 18px;
+ font-weight: 600;
+ letter-spacing: -0.02em;
+ direction: ltr;
+ text-align: right;
+ }
+
+ &__value--high {
+ color: #027a48;
+ }
+
+ &__value--low {
+ color: #b42318;
+ }
+
+ &__divider {
+ height: 1px;
+ background: rgba(15, 23, 42, 0.06);
+ }
+}
+
+/* Asset metrics */
+.dhome-metrics {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
+ gap: 12px;
+ margin-bottom: 16px;
+}
+
+.dhome-metric-tile {
+ background: #ffffff;
+ border-radius: 12px;
+ padding: 16px 18px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+ transition: box-shadow 0.15s ease;
+
+ &:hover {
+ box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
+ }
+
+ &__head {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 8px;
+ margin-bottom: 8px;
+ }
+
+ &__label {
+ font-size: 12px;
+ font-weight: 500;
+ color: #6b7280;
+ }
+
+ &__info {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ border: none;
+ border-radius: 6px;
+ background: transparent;
+ color: #9ca3af;
+ cursor: pointer;
+ transition: background 0.15s ease, color 0.15s ease;
+
+ &:hover {
+ background: #f3f4f6;
+ color: #374151;
+ }
+ }
+
+ &__value {
+ font-size: 20px;
+ font-weight: 600;
+ letter-spacing: -0.02em;
+ color: #111827;
+ line-height: 1.2;
+ }
+}
+
+/* Main dashboard grid */
+.dhome-main-grid {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) 272px;
+ gap: 16px;
+ align-items: start;
+}
+
+.dhome-chart {
+ :deep(.bg-gray-50) {
+ background: transparent !important;
+ border-radius: 0;
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+
+ :deep(.w-full.text-center.pt-2) {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 10px;
+ }
+
+ :deep(.chart-metal-segment) {
+ display: inline-flex;
+ background: #f3f4f6;
+ border-radius: 8px;
+ padding: 3px;
+ margin-bottom: 0 !important;
+ flex-shrink: 0;
+ }
+
+ :deep(.chart-metal-segment__item) {
+ border-radius: 6px;
+ font-size: 12px;
+ font-weight: 500;
+ }
+
+ :deep(.chart-timeline-group) {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ gap: 6px;
+ width: 100%;
+ margin-bottom: 4px;
+ }
+
+ :deep(.chart-timeline-group .ant-radio-button-wrapper) {
+ margin: 0;
+ }
+}
+
+/* Quick actions */
+.dhome-actions {
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+}
+
+.dhome-action {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ width: 100%;
+ padding: 11px 10px;
+ border: none;
+ border-radius: 10px;
+ background: transparent;
+ cursor: pointer;
+ text-align: right;
+ font-family: inherit;
+ transition: background 0.15s ease;
+
+ &:hover {
+ background: #f9fafb;
+ }
+
+ &__icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 36px;
+ height: 36px;
+ border-radius: 10px;
+ background: #f3f4f6;
+ color: @App-primary-color;
+ flex-shrink: 0;
+ transition: background 0.15s ease;
+ }
+
+ &:hover &__icon {
+ background: #eef2f6;
+ }
+
+ &__label {
+ flex: 1;
+ font-size: 13px;
+ font-weight: 600;
+ color: #374151;
+ }
+
+ &__chevron {
+ color: #d1d5db;
+ flex-shrink: 0;
+ }
+}
+
+/* Default layout grid */
+.dhome-default-grid {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) 300px;
+ gap: 16px;
+ align-items: start;
+}
+
+.dhome-default-grid__main,
+.dhome-default-grid__side {
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+ min-width: 0;
+}
+
+.dhome-default-actions {
+ display: grid;
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ gap: 8px;
+}
+
+.dhome-default-action {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 10px;
+ padding: 18px 12px;
+ border: none;
+ border-radius: 12px;
+ background: #f9fafb;
+ cursor: pointer;
+ font-family: inherit;
+ transition: background 0.15s ease, transform 0.15s ease;
+
+ &:hover {
+ background: #f3f4f6;
+ transform: translateY(-1px);
+ }
+
+ &__icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 40px;
+ height: 40px;
+ border-radius: 12px;
+ background: #ffffff;
+ color: @App-primary-color;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
+ }
+
+ &__label {
+ font-size: 12px;
+ font-weight: 600;
+ color: #374151;
+ text-align: center;
+ line-height: 1.4;
+ }
+}
+
+/* Garoosi assets strip */
+.dhome-garoosi-assets {
+ display: flex;
+ flex-direction: column;
+ gap: 14px;
+
+ &__item {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ }
+
+ &__label {
+ font-size: 12px;
+ font-weight: 500;
+ color: #6b7280;
+ }
+
+ &__value {
+ font-size: 18px;
+ font-weight: 600;
+ letter-spacing: -0.02em;
+ color: #111827;
+ direction: ltr;
+ text-align: right;
+ }
+
+ &__divider {
+ height: 1px;
+ background: rgba(15, 23, 42, 0.06);
+ }
+}
+
+/* Boursecu subtle accent */
+.dhome--boursecu {
+ .dhome-action__icon {
+ background: rgba(19, 48, 80, 0.06);
+ color: #133050;
+ }
+
+ .dhome-hero-price__odometer {
+ color: #133050;
+ }
+}
+
+@media (max-width: 1024px) {
+ .dhome__container {
+ padding: 24px 28px 36px;
+ }
+
+ .dhome-hero-row,
+ .dhome-main-grid,
+ .dhome-default-grid {
+ grid-template-columns: 1fr;
+ }
+
+ .dhome-default-actions {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ }
+}
diff --git a/src/views/base/home/index.vue b/src/views/base/home/index.vue
index 0c50ce7..bcf810d 100644
--- a/src/views/base/home/index.vue
+++ b/src/views/base/home/index.vue
@@ -1,293 +1,51 @@
-
-
@@ -58,4 +55,76 @@ const copyCode = () => {
message.info('کد رونوشت شد')
}
}
-
\ No newline at end of file
+
+
+
diff --git a/src/views/base/home/components/ShareModal.vue b/src/views/base/home/components/ShareModal.vue
index f1198f5..c1fd5a7 100644
--- a/src/views/base/home/components/ShareModal.vue
+++ b/src/views/base/home/components/ShareModal.vue
@@ -42,10 +42,15 @@ import { message } from 'ant-design-vue'
import { useUserStore } from '@/store/userStore'
import { getReferralShareText, getReferralShareTitle } from '@/utils/config'
-const props = defineProps<{
- show: boolean
- referralId: string
-}>()
+const props = withDefaults(
+ defineProps<{
+ show: boolean
+ referralId?: string
+ }>(),
+ {
+ referralId: '',
+ }
+)
const emit = defineEmits<{
'update:show': [value: boolean]
diff --git a/src/views/base/home/composables/useBanners.ts b/src/views/base/home/composables/useBanners.ts
index de7dfb6..e98a96a 100644
--- a/src/views/base/home/composables/useBanners.ts
+++ b/src/views/base/home/composables/useBanners.ts
@@ -1,37 +1,74 @@
import { ref } from 'vue'
import { getConstByKey } from '@/api/const'
-export function useBanners() {
- const banners = ref([])
- const loading = ref(false)
+/** Module-level banner state — shared by mobile and desktop home layouts. */
+const banners = ref
+
+ رونوشت
+
+ کد معرف:
+ {{ userStore.userInfo?.referral_id }}
+
+
+
+
- کد معرف:
-
-
-
- {{ userStore.userInfo?.referral_id }}
-
-
- دعوت از دوستان
-
-
- رونوشت
-
-
+ دعوت از دوستان
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopBannersPanel.vue b/src/views/base/home/desktop/components/DesktopBannersPanel.vue
new file mode 100644
index 0000000..07bc24a
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopBannersPanel.vue
@@ -0,0 +1,20 @@
+
+
+
+
+
+
+
+
+
+ دارایی طلایی
+
+ {{ (userStore?.userInfo?.wallet?.count_gold ?? 0).toFixed(3) }} گرم
+
+
+
+
+ دارایی ریالی
+
+ {{ usePriceWithoutType(userStore?.userInfo?.wallet?.count_cash ?? 0) }} ریال
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopHomeCard.vue b/src/views/base/home/desktop/components/DesktopHomeCard.vue
new file mode 100644
index 0000000..f95ac1a
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopHomeCard.vue
@@ -0,0 +1,12 @@
+
+
+
+
+ {{ title }}
+
+
+
+ خوش آمدید
++ {{ userStore.userInfo?.name ?? 'کاربر' }} +
+
+
+
+
+ {{ title }}
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopHomeTopbar.vue b/src/views/base/home/desktop/components/DesktopHomeTopbar.vue
new file mode 100644
index 0000000..30183b4
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopHomeTopbar.vue
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
+ {{ userStore.userInfo?.name ?? 'کاربر' }}
+
+ قیمت لحظهای
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopPriceOverview.vue b/src/views/base/home/desktop/components/DesktopPriceOverview.vue
new file mode 100644
index 0000000..8a2468c
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopPriceOverview.vue
@@ -0,0 +1,32 @@
+
+
+
+ {{ config.config?.name_fa }}
+
+
+ {{ useTowDecimal(percentChange) }}%
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopPriceRange.vue b/src/views/base/home/desktop/components/DesktopPriceRange.vue
new file mode 100644
index 0000000..a9bcb3b
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopPriceRange.vue
@@ -0,0 +1,28 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/desktop/components/DesktopQuickActionsGrid.vue b/src/views/base/home/desktop/components/DesktopQuickActionsGrid.vue
new file mode 100644
index 0000000..f1f7524
--- /dev/null
+++ b/src/views/base/home/desktop/components/DesktopQuickActionsGrid.vue
@@ -0,0 +1,40 @@
+
+
+
+
+ بیشترین امروز
+
+ {{ usePriceWithoutType(highPrice) }}
+ ریال
+
+
+
+
+ کمترین امروز
+
+ {{ usePriceWithoutType(lowPrice) }}
+ ریال
+
+
+
+
+
+
+
+
+
+
+
+
+
- = {
+ default: defaultHomeLayoutConfig,
+ boursecu: boursecuHomeLayoutConfig,
+}
+
+const HOME_LAYOUT_COMPONENTS: Record = {
+ default: HomeLayoutRenderer,
+ boursecu: HomeLayoutRenderer,
+}
+
+export const DEFAULT_HOME_LAYOUT_ID: HomeLayoutId = 'default'
+
+export function isHomeLayoutId(value: unknown): value is HomeLayoutId {
+ return typeof value === 'string' && value in HOME_LAYOUT_CONFIGS
+}
+
+export function getHomeLayoutId(): HomeLayoutId {
+ const adminLayout = getConfigApp('home_layout')
+ if (isHomeLayoutId(adminLayout)) {
+ return adminLayout
+ }
+
+ if (isBoursecuProject()) {
+ return 'boursecu'
+ }
+
+ return DEFAULT_HOME_LAYOUT_ID
+}
+
+export function getHomeLayoutConfig(layoutId = getHomeLayoutId()): HomeLayoutConfig {
+ return HOME_LAYOUT_CONFIGS[layoutId] ?? HOME_LAYOUT_CONFIGS[DEFAULT_HOME_LAYOUT_ID]
+}
+
+export function resolveHomeLayoutComponent(layoutId = getHomeLayoutId()): Component {
+ return HOME_LAYOUT_COMPONENTS[layoutId] ?? HOME_LAYOUT_COMPONENTS[DEFAULT_HOME_LAYOUT_ID]
+}
+
+export function registerHomeLayoutConfig(layoutId: HomeLayoutId, config: HomeLayoutConfig) {
+ HOME_LAYOUT_CONFIGS[layoutId] = config
+}
diff --git a/src/views/base/home/layouts/sections/AssetsSectionBlock.vue b/src/views/base/home/layouts/sections/AssetsSectionBlock.vue
new file mode 100644
index 0000000..afc9610
--- /dev/null
+++ b/src/views/base/home/layouts/sections/AssetsSectionBlock.vue
@@ -0,0 +1,16 @@
+
+
+
+ = {
+ limitedPriceAlert: LimitedPriceAlertSection,
+ garoosiAssets: GaroosiAssetsSection,
+ mainActions: MainActionsSection,
+ boursecuQuickActions: BoursecuQuickActionsSection,
+ referral: ReferralSectionBlock,
+ assets: AssetsSectionBlock,
+ marketClosed: MarketClosedSection,
+ currentPrice: CurrentPriceSection,
+ banners: BannersSection,
+ priceChart: PriceChartSection,
+ priceStats: PriceStatsSection,
+}
+
+export function registerHomeSection(id: HomeSectionId, component: Component) {
+ HOME_SECTION_COMPONENTS[id] = component
+}
diff --git a/src/views/base/home/layouts/types.ts b/src/views/base/home/layouts/types.ts
new file mode 100644
index 0000000..28f964c
--- /dev/null
+++ b/src/views/base/home/layouts/types.ts
@@ -0,0 +1,41 @@
+/** چیدمانهای صفحه اصلی — هر پروژه/ادمین میتواند یکی را انتخاب کند */
+export type HomeLayoutId = 'default' | 'boursecu'
+
+export type HomeSectionId =
+ | 'limitedPriceAlert'
+ | 'garoosiAssets'
+ | 'mainActions'
+ | 'boursecuQuickActions'
+ | 'referral'
+ | 'assets'
+ | 'marketClosed'
+ | 'currentPrice'
+ | 'banners'
+ | 'priceChart'
+ | 'priceStats'
+
+export interface HomeQuickActionItem {
+ id: string
+ label: string
+ icon: string
+ route: { name: string; query?: Record }
+}
+
+export interface HomeLayoutSectionConfig {
+ id: HomeSectionId
+ visible?: boolean
+}
+
+export interface HomeLayoutConfig {
+ id: HomeLayoutId
+ wrapperClass?: string
+ outerSections?: HomeLayoutSectionConfig[]
+ sections: HomeLayoutSectionConfig[]
+}
+
+export interface HomeActionItem {
+ name: string
+ icon: string
+ label: string
+ handler: () => void
+}
diff --git a/src/views/base/home/mobile/MobileHomeView.vue b/src/views/base/home/mobile/MobileHomeView.vue
new file mode 100644
index 0000000..68608c4
--- /dev/null
+++ b/src/views/base/home/mobile/MobileHomeView.vue
@@ -0,0 +1,23 @@
+
+
-
-
-
+
-
-
-
+
+
-
+
+
\ No newline at end of file
+
diff --git a/src/views/base/home/layouts/HomeLayoutRenderer.vue b/src/views/base/home/layouts/HomeLayoutRenderer.vue
new file mode 100644
index 0000000..d695353
--- /dev/null
+++ b/src/views/base/home/layouts/HomeLayoutRenderer.vue
@@ -0,0 +1,56 @@
+
+
+
+
-
+
+
-
-
-
-
-
-
-
-
-
+
-
+
-
-
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/layouts/sections/CurrentPriceSection.vue b/src/views/base/home/layouts/sections/CurrentPriceSection.vue
new file mode 100644
index 0000000..f27215d
--- /dev/null
+++ b/src/views/base/home/layouts/sections/CurrentPriceSection.vue
@@ -0,0 +1,7 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/layouts/sections/LimitedPriceAlertSection.vue b/src/views/base/home/layouts/sections/LimitedPriceAlertSection.vue
new file mode 100644
index 0000000..48cb9aa
--- /dev/null
+++ b/src/views/base/home/layouts/sections/LimitedPriceAlertSection.vue
@@ -0,0 +1,28 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/layouts/sections/MainActionsSection.vue b/src/views/base/home/layouts/sections/MainActionsSection.vue
new file mode 100644
index 0000000..2572a0b
--- /dev/null
+++ b/src/views/base/home/layouts/sections/MainActionsSection.vue
@@ -0,0 +1,20 @@
+
+
+
+
+
+
diff --git a/src/views/base/home/layouts/sections/MarketClosedSection.vue b/src/views/base/home/layouts/sections/MarketClosedSection.vue
new file mode 100644
index 0000000..6372e2c
--- /dev/null
+++ b/src/views/base/home/layouts/sections/MarketClosedSection.vue
@@ -0,0 +1,14 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/home/shell/HomePageShell.vue b/src/views/base/home/shell/HomePageShell.vue
new file mode 100644
index 0000000..2e1887d
--- /dev/null
+++ b/src/views/base/home/shell/HomePageShell.vue
@@ -0,0 +1,17 @@
+
+
+
-
-
-
-
-
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- حساب کاربری
-
-
- هشدار قیمت
-
-
- درباره ما
-
-
- قوانین و مقررات
-
-
- ثبت کارت هدیه
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- صفحه اصلی
-
-
- گزارش
-
-
-
-
-
-
- ![]()
-
-
-
-
-
-
- محصولات
-
-
-
- کیف پول
-
-
- تنظیمات
-
-
-
-
-
-
-
-
-
- ثبت
-
-
-
-
- افزودن
-
-
-
-
-
-
-
-
- ![]()
- ![]()
- ![]()
- ![]()
- ![]()
-
-
-
-
-
-
- {{ val.product.title }}
-
-
-
- تعداد موجودی:
-
-
-
-
- {{ val.product.wallet.gold }}
- {{ getProductQuantityUnit(val.product) }}
-
- هر عدد {{ getProductUnitWeightLabel(val.product) }}
-
-
-
- تعداد درخواستی:
-
-
-
-
-
-
- انتخاب آدرس
-
-
-
-
-
-
-
-
- {{ item.province }} / {{ item.city }} / {{ item.address }}
-
-
-
- افزودن آدرس +
- ثبت نهایی
-
-
-
-
-
-
+
+
+
+
diff --git a/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue b/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue
new file mode 100644
index 0000000..478ae3a
--- /dev/null
+++ b/src/views/base/physicalReceive/components/PhysicalReceiveCartRow.vue
@@ -0,0 +1,78 @@
+
+ انتخاب آدرس
+
+
+
+
+
+
+
+
+ {{ addr.province }} / {{ addr.city }} / {{ addr.address }}
+
+
+
+ افزودن آدرس +
+
+ ثبت نهایی
+
+
+
+
+
+
+
diff --git a/src/views/base/physicalReceive/components/RequestItem.vue b/src/views/base/physicalReceive/components/RequestItem.vue
index 6e33dce..1874b4f 100644
--- a/src/views/base/physicalReceive/components/RequestItem.vue
+++ b/src/views/base/physicalReceive/components/RequestItem.vue
@@ -1,26 +1,33 @@
-
+
+
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+ ![]()
+
+
+
+
+
+ {{ item.product.title }}
+
+
+ تعداد موجودی:
+
+
+
+
+ {{ item.product.wallet.gold }}
+ {{ getProductQuantityUnit(item.product) }}
+
+ هر عدد {{ getProductUnitWeightLabel(item.product) }}
+
+
+
+ تعداد درخواستی:
+
+
+
-
-
+
+
+
شماره سند: {{ props.item.id }}
{{ toJalali(props.item.created_at) }}
-
-
- (), {
+ variant: 'mobile',
+})
+
diff --git a/src/views/base/physicalReceive/components/RequestList.vue b/src/views/base/physicalReceive/components/RequestList.vue
index c3557b1..12ee934 100644
--- a/src/views/base/physicalReceive/components/RequestList.vue
+++ b/src/views/base/physicalReceive/components/RequestList.vue
@@ -1,36 +1,14 @@
-
+ items: Ref
+ selectedProduct: Ref
+ selectedProducts: Ref
+ address: Ref
+ selectedAddressID: Ref
+ showAddress: Ref
+ addAddressVisible: Ref
+ handleAdd: () => void
+ handleRemove: (id: number) => void
+ handelFirstSubmit: () => Promise
+ handelsubmit: () => Promise
+ handleAddress: () => void
+}
+
+export const NEW_PHYSICAL_REQUEST_KEY: InjectionKey =
+ Symbol('newPhysicalRequest')
+
+export function useNewPhysicalRequestPage() {
+ const { isDesktop } = usePhysicalReceiveShellContext()
+
+ const items = ref()
+ const baseItems = ref()
+ const selectedAddressID = ref()
+ const selectedProduct = ref()
+ const productsByWalletId = ref>([])
+ const address = ref()
+ const selectedProducts = ref([])
+ const showAddress = ref(false)
+ const addAddressVisible = ref(false)
+
+ function handleAdd() {
+ selectedProducts.value?.push({
+ count: 0,
+ product: items.value?.find((x) => x.id === selectedProduct.value)!,
+ })
+ items.value?.splice(items.value?.findIndex((x) => x.id === selectedProduct.value)!, 1)
+ selectedProduct.value = undefined
+ }
+
+ function handleAddress() {
+ getAddress()
+ addAddressVisible.value = false
+ showAddress.value = true
+ }
+
+ function handleRemove(id: number) {
+ const findItem = baseItems.value?.find((x) => x.id === id)
+ if (findItem) {
+ items.value?.push(findItem)
+ }
+ selectedProducts.value?.splice(
+ selectedProducts.value?.findIndex((x) => x.product.id === id),
+ 1
+ )
+ }
+
+ async function initProductWallet() {
+ try {
+ loading.value = true
+ items.value = (await getProductInventory()).rows
+ baseItems.value = cloneDeep(items.value)
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ async function handelFirstSubmit() {
+ try {
+ const zeroAmount = selectedProducts.value.map((item) => item.count <= 0)
+ if (zeroAmount.includes(true)) {
+ message.error('لطفاً تعداد درخواستی محصول را وارد کنید.')
+ } else {
+ showAddress.value = true
+ }
+ } catch (e) {
+ console.log(e)
+ }
+ }
+
+ async function handelsubmit() {
+ try {
+ loading.value = true
+ productsByWalletId.value = selectedProducts.value.map((val) => ({
+ wallet_id: val.product.wallet.id,
+ value: val.count,
+ }))
+ await physicalReceiveApi({
+ address_id: selectedAddressID.value,
+ wallets: productsByWalletId.value,
+ })
+ await initProductWallet()
+ message.success('درخواست شما با موفقیت ارسال شد')
+ selectedProducts.value = []
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ showAddress.value = false
+ }
+ }
+
+ async function getAddress() {
+ const { rows } = await tableAddress({ page: 0, limit: 150 })
+ address.value = rows
+ }
+
+ onMounted(async () => {
+ await initProductWallet()
+ await getAddress()
+ })
+
+ const context: NewPhysicalRequestContext = {
+ isDesktop,
+ items,
+ selectedProduct,
+ selectedProducts,
+ address,
+ selectedAddressID,
+ showAddress,
+ addAddressVisible,
+ handleAdd,
+ handleRemove,
+ handelFirstSubmit,
+ handelsubmit,
+ handleAddress,
+ }
+
+ provide(NEW_PHYSICAL_REQUEST_KEY, context)
+ return context
+}
+
+export function useNewPhysicalRequestContext() {
+ const context = inject(NEW_PHYSICAL_REQUEST_KEY)
+ if (!context) {
+ throw new Error('useNewPhysicalRequestContext must be used within useNewPhysicalRequestPage')
+ }
+ return context
+}
diff --git a/src/views/base/physicalReceive/composables/usePhysicalReceiveList.ts b/src/views/base/physicalReceive/composables/usePhysicalReceiveList.ts
new file mode 100644
index 0000000..de296e0
--- /dev/null
+++ b/src/views/base/physicalReceive/composables/usePhysicalReceiveList.ts
@@ -0,0 +1,37 @@
+import { inject, onMounted, provide, ref, type InjectionKey, type Ref } from 'vue'
+import { getPhysicalReceiveList } from '@/api/physicalreceive'
+import type { Physicalreceive } from '@/models/physicalreceive'
+import router from '@/router'
+
+export interface PhysicalReceiveListContext {
+ requestItems: Ref
+ openAdd: () => void
+}
+
+export const PHYSICAL_RECEIVE_LIST_KEY: InjectionKey =
+ Symbol('physicalReceiveList')
+
+export function usePhysicalReceiveList() {
+ const requestItems = ref([])
+
+ function openAdd() {
+ router.push('physicalReceive/new')
+ }
+
+ onMounted(async () => {
+ const { rows } = await getPhysicalReceiveList()
+ requestItems.value = rows
+ })
+
+ const context: PhysicalReceiveListContext = { requestItems, openAdd }
+ provide(PHYSICAL_RECEIVE_LIST_KEY, context)
+ return context
+}
+
+export function usePhysicalReceiveListContext() {
+ const context = inject(PHYSICAL_RECEIVE_LIST_KEY)
+ if (!context) {
+ throw new Error('usePhysicalReceiveListContext must be used within usePhysicalReceiveList')
+ }
+ return context
+}
diff --git a/src/views/base/physicalReceive/composables/usePhysicalReceiveShell.ts b/src/views/base/physicalReceive/composables/usePhysicalReceiveShell.ts
new file mode 100644
index 0000000..9ff147f
--- /dev/null
+++ b/src/views/base/physicalReceive/composables/usePhysicalReceiveShell.ts
@@ -0,0 +1,23 @@
+import { inject, provide, type InjectionKey } from 'vue'
+import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
+
+export interface PhysicalReceiveShellContext {
+ isDesktop: ReturnType
+}
+
+export const PHYSICAL_RECEIVE_SHELL_KEY: InjectionKey =
+ Symbol('physicalReceiveShell')
+
+export function usePhysicalReceiveShell() {
+ const isDesktop = useDesktopBreakpoint()
+ provide(PHYSICAL_RECEIVE_SHELL_KEY, { isDesktop })
+ return { isDesktop }
+}
+
+export function usePhysicalReceiveShellContext() {
+ const context = inject(PHYSICAL_RECEIVE_SHELL_KEY)
+ if (!context) {
+ throw new Error('usePhysicalReceiveShellContext must be used within physical receive shell')
+ }
+ return context
+}
diff --git a/src/views/base/physicalReceive/desktop/DesktopNewRequestView.vue b/src/views/base/physicalReceive/desktop/DesktopNewRequestView.vue
new file mode 100644
index 0000000..afadd11
--- /dev/null
+++ b/src/views/base/physicalReceive/desktop/DesktopNewRequestView.vue
@@ -0,0 +1,119 @@
+
+
+
+
+
+
+
+
diff --git a/src/views/base/physicalReceive/desktop/DesktopRequestListView.vue b/src/views/base/physicalReceive/desktop/DesktopRequestListView.vue
new file mode 100644
index 0000000..23f9af0
--- /dev/null
+++ b/src/views/base/physicalReceive/desktop/DesktopRequestListView.vue
@@ -0,0 +1,36 @@
+
+
-
-
-
\ No newline at end of file
+const props = withDefaults(defineProps
-
-
- ![]()
+
+
+
-
+
-
+ ![]()
- {{ item.title }}
-
-
-
+ {{ tx.title }}
{{ item.gold * -1 }} عدد
+ {{ tx.gold * -1 }} عدد
@@ -28,30 +35,30 @@
{{ props.item.sts_str }}
-
- آدرس:
- {{ props.item.address.province }}/{{ props.item.address.city }}/{{ props.item.address.address }}
+
+ {{ props.item.address.province }}/{{ props.item.address.city }}/{{ props.item.address.address }}
+
-
-
-
-
+
-
-
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/physicalReceive/desktop/DesktopPhysicalReceiveChrome.vue b/src/views/base/physicalReceive/desktop/DesktopPhysicalReceiveChrome.vue
new file mode 100644
index 0000000..743d2f0
--- /dev/null
+++ b/src/views/base/physicalReceive/desktop/DesktopPhysicalReceiveChrome.vue
@@ -0,0 +1,32 @@
+
+
+
+
+
+
+
+
+
+ انتخاب محصول
+
+
+ افزودن
+
+
+ + {{ items.length }} محصول با موجودی قابل تحویل +
+
+
+
+ سبد درخواست
+ {{ selectedProducts.length }} مورد +
+
+
+
+
+
+
+
+ محصولی به سبد اضافه نشده است.
+
+
+ ادامه و انتخاب آدرس
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/physicalReceive/desktop/styles/desktop-physical-receive.less b/src/views/base/physicalReceive/desktop/styles/desktop-physical-receive.less
new file mode 100644
index 0000000..8dc8e4d
--- /dev/null
+++ b/src/views/base/physicalReceive/desktop/styles/desktop-physical-receive.less
@@ -0,0 +1,301 @@
+/* Premium desktop physical receive */
+
+.dpr {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dpr__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dpr-topbar {
+ display: flex;
+ align-items: flex-start;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+ flex-shrink: 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 14px;
+ color: #6b7280;
+ margin: 6px 0 0;
+ line-height: 1.6;
+ }
+}
+
+.dpr-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dpr-list {
+ padding: 24px;
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+
+ &__toolbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 20px;
+ }
+
+ &__count {
+ font-size: 14px;
+ color: #6b7280;
+ }
+
+ &__add {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ padding: 10px 18px;
+ border: none;
+ border-radius: 10px;
+ background: @App-primary-color;
+ color: #fff;
+ font-size: 14px;
+ font-weight: 600;
+ font-family: inherit;
+ cursor: pointer;
+
+ &:hover {
+ filter: brightness(0.95);
+ }
+ }
+
+ &__items {
+ display: grid;
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 16px;
+ }
+
+ &__empty {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ min-height: 240px;
+ padding: 32px 16px;
+ color: #6b7280;
+ text-align: center;
+
+ p {
+ margin: 0;
+ font-size: 15px;
+ }
+ }
+
+ &__empty-btn {
+ margin-top: 8px;
+ padding: 10px 20px;
+ border: none;
+ border-radius: 10px;
+ background: @App-primary-color;
+ color: #fff;
+ font-size: 14px;
+ font-weight: 600;
+ font-family: inherit;
+ cursor: pointer;
+ }
+}
+
+.dpr-item {
+ margin: 0 !important;
+ border-radius: 16px !important;
+}
+
+.dpr-new {
+ &__grid {
+ display: grid;
+ grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
+ gap: 20px;
+ align-items: start;
+ }
+
+ &__picker,
+ &__cart {
+ padding: 24px;
+ }
+
+ &__section-title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0 0 16px;
+ }
+
+ &__picker-row {
+ display: flex;
+ gap: 10px;
+ align-items: flex-start;
+ }
+
+ &__hint {
+ margin: 12px 0 0;
+ font-size: 13px;
+ color: #9ca3af;
+ }
+
+ &__cart-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 16px;
+ }
+
+ &__cart-count {
+ font-size: 13px;
+ color: #9ca3af;
+ }
+
+ &__cart-items {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ max-height: 420px;
+ overflow-y: auto;
+ margin-bottom: 20px;
+ }
+
+ &__cart-item {
+ padding: 14px;
+ border-radius: 12px;
+ background: #f9fafb;
+ border: 1px solid rgba(15, 23, 42, 0.05);
+ }
+
+ &__cart-empty {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 10px;
+ min-height: 200px;
+ color: #9ca3af;
+ text-align: center;
+
+ p {
+ margin: 0;
+ font-size: 14px;
+ }
+ }
+
+ &__actions {
+ padding-top: 8px;
+ border-top: 1px solid rgba(15, 23, 42, 0.06);
+ }
+}
+
+.dpr-cart-row__input {
+ width: min(100%, 240px);
+ min-width: 220px;
+ flex-shrink: 0;
+
+ .noname-input,
+ .ant-input-group-wrapper {
+ width: 100%;
+ }
+
+ .ant-input-group-addon {
+ min-width: 4.75rem;
+ padding-inline: 10px;
+ white-space: nowrap;
+ font-size: 12px;
+ font-weight: 600;
+ }
+}
+
+.dpr-address-picker {
+ &--desktop {
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+ }
+
+ &__list {
+ max-height: 320px;
+ overflow-y: auto;
+ }
+
+ &__item {
+ padding: 14px 16px;
+ margin-bottom: 10px;
+ border-radius: 12px;
+ border: 1px solid rgba(15, 23, 42, 0.08);
+ background: #f9fafb;
+ font-size: 14px;
+ }
+
+ &__actions {
+ display: flex;
+ gap: 10px;
+ padding-top: 8px;
+
+ > button:last-child {
+ flex: 1;
+ }
+ }
+}
+
+@media (max-width: 900px) {
+ .dpr-list__items {
+ grid-template-columns: 1fr;
+ }
+
+ .dpr-new__grid {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/src/views/base/physicalReceive/index.vue b/src/views/base/physicalReceive/index.vue
index 6508706..7366885 100644
--- a/src/views/base/physicalReceive/index.vue
+++ b/src/views/base/physicalReceive/index.vue
@@ -1,43 +1,36 @@
-
+
+
+
+
+ هنوز درخواستی ثبت نشده است.
+ +
-
-
-
-
- دریافت فیزیکی
- دریافت فیزیکی-درخواست جدید
+
+
diff --git a/src/views/base/physicalReceive/mobile/MobileNewRequestView.vue b/src/views/base/physicalReceive/mobile/MobileNewRequestView.vue
new file mode 100644
index 0000000..c682b32
--- /dev/null
+++ b/src/views/base/physicalReceive/mobile/MobileNewRequestView.vue
@@ -0,0 +1,76 @@
+
+
+
-
+
-
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/physicalReceive/mobile/MobilePhysicalReceiveChrome.vue b/src/views/base/physicalReceive/mobile/MobilePhysicalReceiveChrome.vue
new file mode 100644
index 0000000..cde7446
--- /dev/null
+++ b/src/views/base/physicalReceive/mobile/MobilePhysicalReceiveChrome.vue
@@ -0,0 +1,21 @@
+
+
+
+ ثبت
+
+
+
+
+
+ افزودن
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/physicalReceive/mobile/MobileRequestListView.vue b/src/views/base/physicalReceive/mobile/MobileRequestListView.vue
new file mode 100644
index 0000000..6024e94
--- /dev/null
+++ b/src/views/base/physicalReceive/mobile/MobileRequestListView.vue
@@ -0,0 +1,23 @@
+
+
+
+
+
+
+
+ دریافت فیزیکی
+ دریافت فیزیکی-درخواست جدید
+
+
+
+
+
+
+
+
diff --git a/src/views/base/priceTrigger/components/Item.vue b/src/views/base/priceTrigger/components/Item.vue
index d07fa2e..512581f 100644
--- a/src/views/base/priceTrigger/components/Item.vue
+++ b/src/views/base/priceTrigger/components/Item.vue
@@ -1,90 +1,145 @@
-
+
+
+
-
-
-
+
+
-
-
+
-
-
diff --git a/src/views/base/priceTrigger/components/PriceTriggerForm.vue b/src/views/base/priceTrigger/components/PriceTriggerForm.vue
new file mode 100644
index 0000000..5042b3d
--- /dev/null
+++ b/src/views/base/priceTrigger/components/PriceTriggerForm.vue
@@ -0,0 +1,63 @@
+
+
+
+
+
+
diff --git a/src/views/base/priceTrigger/composables/usePriceTriggerPage.ts b/src/views/base/priceTrigger/composables/usePriceTriggerPage.ts
new file mode 100644
index 0000000..3252d5e
--- /dev/null
+++ b/src/views/base/priceTrigger/composables/usePriceTriggerPage.ts
@@ -0,0 +1,135 @@
+import { inject, onMounted, provide, reactive, ref, type InjectionKey, type Ref } from 'vue'
+import { cloneDeep } from 'lodash'
+import { type FormInstance, message } from 'ant-design-vue'
+import { createPriceTrigger, getPriceTriggers, updatePriceTrigger } from '@/api/triggerPrice'
+import type { SelectItem } from '@/models/SelectItem'
+import type { PriceTrigger } from '@/models/PriceTrigger'
+import { loading } from '@/utils'
+
+export interface PriceTriggerPageContext {
+ items: Ref
+ addTriggerVisible: Ref
+ editId: Ref
+ form: Ref
+ formRef: Ref
+ loading: typeof loading
+ radioStyle: ReturnType>
+ typeItems: SelectItem[]
+ resetFields: () => void
+ openAdd: () => void
+ openEdit: (val: PriceTrigger) => void
+ initItems: () => Promise
+ ok: () => Promise
+}
+
+export const PRICE_TRIGGER_PAGE_CONTEXT_KEY: InjectionKey =
+ Symbol('priceTriggerPageContext')
+
+export function usePriceTriggerPage() {
+ const items = ref([])
+ const addTriggerVisible = ref(false)
+ const editId = ref(undefined)
+ const formRef = ref()
+
+ const radioStyle = reactive({
+ display: '',
+ height: '30px',
+ lineHeight: '30px',
+ })
+
+ const form = ref({
+ price_condition: '',
+ is_active: true,
+ action: '',
+ target_price: '',
+ })
+
+ const typeItems: SelectItem[] = [
+ { value: 'بزرگتر', key: '>' },
+ { value: 'کوچکتر', key: '<' },
+ { value: 'مساوی', key: '==' },
+ ]
+
+ function resetFields() {
+ form.value = {
+ price_condition: '',
+ is_active: true,
+ action: '',
+ target_price: '',
+ }
+ }
+
+ function openAdd() {
+ resetFields()
+ editId.value = undefined
+ addTriggerVisible.value = true
+ }
+
+ function openEdit(val: PriceTrigger) {
+ form.value = cloneDeep(val)
+ editId.value = form.value.id
+ addTriggerVisible.value = true
+ }
+
+ async function initItems() {
+ try {
+ items.value = []
+ items.value = await getPriceTriggers()
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ }
+
+ async function ok() {
+ await formRef.value?.validateFields().then(async () => {
+ try {
+ loading.value = true
+ if (editId.value) {
+ await updatePriceTrigger(editId.value, form.value)
+ } else {
+ await createPriceTrigger(form.value)
+ }
+ message.success('هشدار با موفقیت ایجاد شد')
+ await initItems()
+ addTriggerVisible.value = false
+ } catch (e) {
+ console.log(e)
+ } finally {
+ loading.value = false
+ }
+ })
+ }
+
+ onMounted(() => {
+ initItems()
+ })
+
+ const context: PriceTriggerPageContext = {
+ items,
+ addTriggerVisible,
+ editId,
+ form,
+ formRef,
+ loading,
+ radioStyle,
+ typeItems,
+ resetFields,
+ openAdd,
+ openEdit,
+ initItems,
+ ok,
+ }
+
+ provide(PRICE_TRIGGER_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function usePriceTriggerPageContext() {
+ const context = inject(PRICE_TRIGGER_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('usePriceTriggerPageContext must be used within a page that calls usePriceTriggerPage()')
+ }
+ return context
+}
diff --git a/src/views/base/priceTrigger/desktop/DesktopPriceTriggerView.vue b/src/views/base/priceTrigger/desktop/DesktopPriceTriggerView.vue
new file mode 100644
index 0000000..06eaaab
--- /dev/null
+++ b/src/views/base/priceTrigger/desktop/DesktopPriceTriggerView.vue
@@ -0,0 +1,78 @@
+
+
+
+
+
+
+
+ {{ usePrice(item.target_price) }}
+ + +
+
+
+
+
+
+
+
+
+
+
+ آیا از حذف هشدار اطمینان دارید؟
+
+ تایید
+
+ انصراف
+
+
-
-
- {{usePrice(item.target_price) }}
+ {{ usePrice(item.target_price) }}
-
+
-
-
- {{toJalali(item.created_at)}}
- {{ toJalali(item.created_at) }}
+
-
-
-
+
- آیا از حذف هشدار اطمینان دارید؟
-
+ آیا از حذف هشدار اطمینان دارید؟
-
- تایید
-
-
-
- انصراف
+ تایید
+ انصراف
-
+
+
+
+
+
+
+ ارسال پیامک
+ ارسال ایمیل
+
+
+
+
+
+ {{ editId ? 'ویرایش هشدار' : 'ثبت هشدار' }}
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/priceTrigger/desktop/styles/desktop-price-trigger.less b/src/views/base/priceTrigger/desktop/styles/desktop-price-trigger.less
new file mode 100644
index 0000000..3faf1a5
--- /dev/null
+++ b/src/views/base/priceTrigger/desktop/styles/desktop-price-trigger.less
@@ -0,0 +1,273 @@
+/* Premium desktop price trigger page */
+
+.dptr {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dptr__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dptr-topbar {
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0 0 6px;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 14px;
+ color: #6b7280;
+ margin: 0;
+ max-width: 520px;
+ line-height: 1.6;
+ }
+}
+
+.dptr-grid {
+ display: grid;
+ grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
+ gap: 20px;
+ align-items: start;
+}
+
+.dptr-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.dptr-form {
+ padding: 24px;
+
+ &__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 20px;
+ }
+
+ &__title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0;
+ }
+
+ &__reset {
+ border: 1px solid #e5e7eb;
+ border-radius: 8px;
+ background: #fff;
+ color: #6b7280;
+ font-size: 12px;
+ font-weight: 600;
+ font-family: inherit;
+ padding: 6px 10px;
+ cursor: pointer;
+ transition: border-color 0.15s ease, color 0.15s ease;
+
+ &:hover {
+ border-color: @App-primary-color;
+ color: @App-primary-color;
+ }
+ }
+}
+
+.dptr-list {
+ display: flex;
+ flex-direction: column;
+ min-height: 420px;
+
+ &__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ padding: 20px 24px 0;
+ }
+
+ &__title {
+ font-size: 16px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0;
+ }
+
+ &__count {
+ font-size: 12px;
+ font-weight: 600;
+ color: #6b7280;
+ background: #f3f4f6;
+ border-radius: 999px;
+ padding: 4px 10px;
+ }
+
+ &__items {
+ padding: 16px 24px 24px;
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+ }
+
+ &__skeletons {
+ padding: 16px 24px 24px;
+ }
+}
+
+.dptr-card {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) auto;
+ gap: 12px 16px;
+ padding: 16px 18px;
+ border: 1px solid #eef0f3;
+ border-radius: 12px;
+ background: #fafbfc;
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
+
+ &:hover {
+ border-color: #dbe0e6;
+ box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
+ }
+
+ &__price {
+ grid-column: 1 / -1;
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0;
+ }
+
+ &__meta {
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+ min-width: 0;
+ }
+
+ &__row {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ font-size: 13px;
+ color: #6b7280;
+ }
+
+ &__label {
+ color: #9ca3af;
+ flex-shrink: 0;
+ }
+
+ &__value {
+ color: #374151;
+ font-weight: 600;
+ }
+
+ &__actions {
+ display: flex;
+ align-items: flex-start;
+ gap: 4px;
+ }
+
+ &__icon-btn {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ width: 34px;
+ height: 34px;
+ border: 1px solid #e5e7eb;
+ border-radius: 10px;
+ background: #fff;
+ cursor: pointer;
+ transition: border-color 0.15s ease, background 0.15s ease;
+
+ &:hover {
+ background: #f9fafb;
+ }
+
+ &--danger:hover {
+ border-color: #fecaca;
+ background: #fef2f2;
+ }
+
+ &--edit:hover {
+ border-color: #bbf7d0;
+ background: #f0fdf4;
+ }
+ }
+
+ &__footer {
+ grid-column: 1 / -1;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ padding-top: 10px;
+ border-top: 1px solid #eef0f3;
+ }
+
+ &__date {
+ font-size: 12px;
+ color: #9ca3af;
+ }
+}
+
+.dptr-empty {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ padding: 48px 24px;
+ color: #6b7280;
+ text-align: center;
+
+ p {
+ margin: 0;
+ font-size: 14px;
+ }
+
+ &__btn {
+ margin-top: 4px;
+ border: none;
+ border-radius: 10px;
+ background: @App-primary-color;
+ color: #fff;
+ font-size: 13px;
+ font-weight: 600;
+ font-family: inherit;
+ padding: 10px 16px;
+ cursor: pointer;
+ transition: opacity 0.15s ease;
+
+ &:hover {
+ opacity: 0.92;
+ }
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .dptr-grid {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/src/views/base/priceTrigger/index.vue b/src/views/base/priceTrigger/index.vue
index 97f1fd6..e512426 100644
--- a/src/views/base/priceTrigger/index.vue
+++ b/src/views/base/priceTrigger/index.vue
@@ -1,198 +1,31 @@
-
+
+
+
+
+
+ هشدار قیمت
+ +
+
+
+
+
+
+
+
+
+ {{ editId ? 'ویرایش هشدار' : 'ثبت هشدار جدید' }}
+ +
+
+
+ هشدارهای فعلی
+ {{ items.length }} مورد +
+
+
+
+
+
+
+
+
+
+ هنوز هشداری ثبت نشده است.
+ +
- >
+ orderSheetKey: ReturnType>
+ selectedProduct: ReturnType>
+ isProductInactive: ReturnType>
+ isAfterCloseTime: ReturnType>
+ openTime: typeof productsOpenTime
+ closeTime: typeof productsCloseTime
+ changeTab: typeof changeProductsTab
+ clickProduct: (item?: Product) => void
+ onProductOrdered: () => void
+ isProductPriceInactive: typeof isProductPriceInactive
+}
+
+export const PRODUCTS_PAGE_CONTEXT_KEY: InjectionKey =
+ Symbol('productsPageContext')
+
+export function useProductsPageProvider() {
+ const showFilter = ref(false)
+ const orderSheetKey = ref(0)
+ const selectedProduct = ref()
+ const isAfterCloseTime = ref(false)
+ const isProductInactive = ref(false)
+
+ watch([productsOpenTime, productsCloseTime], ([open, close]) => {
+ if (!open || !close) return
+ const now = new Date()
+ const currentSeconds = now.getHours() * 3600 + now.getMinutes() * 60 + now.getSeconds()
+ const [oh, om, os] = open.split(':').map(Number)
+ const [ch, cm, cs] = close.split(':').map(Number)
+ const openSeconds = oh * 3600 + om * 60 + os
+ const closeSeconds = ch * 3600 + cm * 60 + cs
+ isAfterCloseTime.value = currentSeconds < openSeconds || currentSeconds > closeSeconds
+ })
+
+ function clickProduct(item?: Product) {
+ if (!item?.show) return
+
+ if (isProductPriceInactive(item)) {
+ showFilter.value = false
+ isProductInactive.value = true
+ return
+ }
+
+ orderSheetKey.value += 1
+ selectedProduct.value = cloneDeep(item)
+ showFilter.value = true
+ }
+
+ function onProductOrdered() {
+ showFilter.value = false
+ }
+
+ watch(showFilter, (open) => {
+ if (!open) {
+ orderSheetKey.value += 1
+ }
+ })
+
+ onMounted(async () => {
+ onProductsPageProviderMounted()
+ await initProductsPageData()
+
+ if (router.currentRoute.value.query.cat === 'coin') {
+ productsActiveKey.value = 'سکه'
+ changeProductsTab()
+ }
+
+ if (router.currentRoute.value.query.state) {
+ if (router.currentRoute.value.query.product) {
+ clickProduct(productsItems.value?.find((x) => x.title === 'سکه'))
+ } else {
+ clickProduct(productsItems.value?.find((x) => x.title === 'آبشده نقدی'))
+ }
+ }
+ })
+
+ onUnmounted(() => {
+ onProductsPageProviderUnmounted()
+ })
+
+ const context: ProductsPageContext = {
+ activekey: productsActiveKey,
+ typeItems: productsTypeItems,
+ items: productsItems,
+ loading,
+ showFilter,
+ orderSheetKey,
+ selectedProduct,
+ isProductInactive,
+ isAfterCloseTime,
+ openTime: productsOpenTime,
+ closeTime: productsCloseTime,
+ changeTab: changeProductsTab,
+ clickProduct,
+ onProductOrdered,
+ isProductPriceInactive,
+ }
+
+ provide(PRODUCTS_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useProductsPageContext() {
+ const context = inject(PRODUCTS_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error(
+ 'useProductsPageContext must be used within a page that calls useProductsPageProvider()',
+ )
+ }
+ return context
+}
+
+/** @deprecated Use useProductsPageProvider in index + useProductsPageContext in views. */
+export function useProductsPage() {
+ return useProductsPageProvider()
+}
diff --git a/src/views/base/products/composables/useProductsPageData.ts b/src/views/base/products/composables/useProductsPageData.ts
new file mode 100644
index 0000000..aaaaf36
--- /dev/null
+++ b/src/views/base/products/composables/useProductsPageData.ts
@@ -0,0 +1,152 @@
+import { ref } from 'vue'
+import { getProductsCatalog } from '@/composables/useProductsCatalog'
+import { loading } from '@/utils'
+import type { Product } from '@/models/products'
+import { loadServiceFeeFromSettings } from '@/utils/serviceFee'
+
+/** Shared products page datasets — mobile/desktop views read this module state only. */
+let initPromise: Promise | null = null
+let productListInterval: ReturnType | undefined
+let providerMountCount = 0
+
+const initialized = ref(false)
+
+export const productsActiveKey = ref('همه')
+export const productsTypeItems = ref([])
+export const productsFirstItems = ref()
+export const productsItems = ref()
+export const productsOpenTime = ref('')
+export const productsCloseTime = ref('')
+
+export function isProductsPageDataInitialized() {
+ return initialized.value
+}
+
+export function changeProductsTab() {
+ if (productsActiveKey.value !== 'همه') {
+ productsItems.value = productsFirstItems.value?.filter(
+ (val) => val.group_type === productsActiveKey.value,
+ )
+ } else {
+ productsItems.value = productsFirstItems.value
+ }
+}
+
+function syncTypeItems(products: Product[]) {
+ products.forEach((val) => {
+ if (!productsTypeItems.value.includes(val.group_type)) {
+ productsTypeItems.value.push(val.group_type)
+ }
+ })
+}
+
+function applyProductsList(products: Product[]) {
+ if (products.length) {
+ productsCloseTime.value = products[0].auto_close_at
+ productsOpenTime.value = products[0].auto_open_at
+ }
+
+ productsFirstItems.value = products
+ syncTypeItems(products)
+ changeProductsTab()
+}
+
+export async function refreshProductsPageData() {
+ try {
+ const fresh = await getProductsCatalog(true)
+ if (!fresh?.length) return
+
+ syncTypeItems(fresh)
+
+ const freshById = new Map(fresh.map((p) => [p.id, p]))
+ const current = productsFirstItems.value
+
+ if (!current?.length) {
+ applyProductsList(fresh)
+ return
+ }
+
+ current.forEach((item) => {
+ const updated = freshById.get(item.id)
+ if (updated) {
+ Object.assign(item, updated)
+ }
+ })
+
+ const currentIds = new Set(current.map((p) => p.id))
+ const hasAdded = fresh.some((p) => !currentIds.has(p.id))
+ const hasRemoved = current.some((p) => !freshById.has(p.id))
+ if (hasAdded || hasRemoved) {
+ applyProductsList(fresh)
+ }
+ } catch (error) {
+ console.error('Products refresh error:', error)
+ }
+}
+
+function startProductListPolling() {
+ if (productListInterval) return
+ productListInterval = setInterval(() => {
+ void refreshProductsPageData()
+ }, 10000)
+}
+
+function stopProductListPolling() {
+ if (productListInterval) {
+ clearInterval(productListInterval)
+ productListInterval = undefined
+ }
+}
+
+export function onProductsPageProviderMounted() {
+ providerMountCount += 1
+}
+
+export function onProductsPageProviderUnmounted() {
+ providerMountCount = Math.max(0, providerMountCount - 1)
+ if (providerMountCount === 0) {
+ stopProductListPolling()
+ }
+}
+
+export async function initProductsPageData(force = false) {
+ if (!force && initialized.value) {
+ startProductListPolling()
+ return
+ }
+
+ if (!force && initPromise) {
+ return initPromise
+ }
+
+ initPromise = (async () => {
+ try {
+ loading.value = true
+ const products = await getProductsCatalog(force)
+ applyProductsList(products ?? [])
+ await loadServiceFeeFromSettings()
+ initialized.value = true
+ startProductListPolling()
+ } catch (error) {
+ console.error('Products page initialization error:', error)
+ } finally {
+ loading.value = false
+ initPromise = null
+ }
+ })()
+
+ return initPromise
+}
+
+export function resetProductsPageData() {
+ initialized.value = false
+ initPromise = null
+ providerMountCount = 0
+ stopProductListPolling()
+ productsActiveKey.value = 'همه'
+ productsTypeItems.value = []
+ productsFirstItems.value = undefined
+ productsItems.value = undefined
+ productsOpenTime.value = ''
+ productsCloseTime.value = ''
+}
diff --git a/src/views/base/products/desktop/DesktopProductsView.vue b/src/views/base/products/desktop/DesktopProductsView.vue
new file mode 100644
index 0000000..7548447
--- /dev/null
+++ b/src/views/base/products/desktop/DesktopProductsView.vue
@@ -0,0 +1,64 @@
+
+
-
-
-
-
-
- هشدارهای فعلی
-
+
-
-
+
+
-
-
-
-
\ No newline at end of file
+.price-trigger-page-root {
+ min-height: 100%;
+ height: 100%;
+}
+
diff --git a/src/views/base/priceTrigger/mobile/MobilePriceTriggerView.vue b/src/views/base/priceTrigger/mobile/MobilePriceTriggerView.vue
new file mode 100644
index 0000000..8b97615
--- /dev/null
+++ b/src/views/base/priceTrigger/mobile/MobilePriceTriggerView.vue
@@ -0,0 +1,58 @@
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
- ارسال پیامک
- ارسال ایمیل
-
-
-
-
-
- {{ editId ? 'ویرایش هشدار' : 'ثبت هشدار' }}
-
-
-
-
- هشدار قیمت
- هشدار قیمت
+
+
+
+
+
+
+
+
diff --git a/src/views/base/products/composables/useProductsPage.ts b/src/views/base/products/composables/useProductsPage.ts
new file mode 100644
index 0000000..07e1c24
--- /dev/null
+++ b/src/views/base/products/composables/useProductsPage.ts
@@ -0,0 +1,147 @@
+import {
+ inject,
+ onMounted,
+ onUnmounted,
+ provide,
+ ref,
+ watch,
+ type InjectionKey,
+} from 'vue'
+import router from '@/router'
+import { loading } from '@/utils'
+import type { Product } from '@/models/products'
+import { cloneDeep } from 'lodash'
+import { isProductPriceInactive } from '@/utils/productPrice'
+import {
+ changeProductsTab,
+ initProductsPageData,
+ onProductsPageProviderMounted,
+ onProductsPageProviderUnmounted,
+ productsActiveKey,
+ productsCloseTime,
+ productsItems,
+ productsOpenTime,
+ productsTypeItems,
+} from './useProductsPageData'
+
+export interface ProductsPageContext {
+ activekey: typeof productsActiveKey
+ typeItems: typeof productsTypeItems
+ items: typeof productsItems
+ loading: typeof loading
+ showFilter: ReturnType
+
+
+
+
+ هشدارهای فعلی
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/products/desktop/components/DesktopProductCard.vue b/src/views/base/products/desktop/components/DesktopProductCard.vue
new file mode 100644
index 0000000..f0c13df
--- /dev/null
+++ b/src/views/base/products/desktop/components/DesktopProductCard.vue
@@ -0,0 +1,81 @@
+
+
+
+
+
diff --git a/src/views/base/products/desktop/styles/desktop-products.less b/src/views/base/products/desktop/styles/desktop-products.less
new file mode 100644
index 0000000..a01b804
--- /dev/null
+++ b/src/views/base/products/desktop/styles/desktop-products.less
@@ -0,0 +1,173 @@
+/* Premium desktop products / orders page */
+
+.dproducts {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.dproducts__container {
+ max-width: 1180px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.dproducts-topbar {
+ margin-bottom: 24px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+
+ &__subtitle {
+ font-size: 13px;
+ color: #6b7280;
+ margin: 8px 0 0;
+ }
+}
+
+.dproducts-tabs {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ margin-bottom: 24px;
+
+ &__btn {
+ padding: 8px 14px;
+ border: 1px solid #e5e7eb;
+ border-radius: 999px;
+ background: #fff;
+ font-size: 13px;
+ font-weight: 600;
+ color: #6b7280;
+ font-family: inherit;
+ cursor: pointer;
+ transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
+
+ &:hover {
+ border-color: #d1d5db;
+ color: #374151;
+ }
+
+ &--active {
+ background: @App-primary-color;
+ border-color: @App-primary-color;
+ color: #fff;
+ }
+ }
+}
+
+.dproducts-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+ gap: 16px;
+}
+
+.dproducts-card {
+ display: flex;
+ flex-direction: column;
+ background: #fff;
+ border: 1px solid #f3f4f6;
+ border-radius: 14px;
+ overflow: hidden;
+ cursor: pointer;
+ text-align: right;
+ font-family: inherit;
+ transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
+
+ &:hover:not(&--disabled) {
+ border-color: #e5e7eb;
+ box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
+ transform: translateY(-1px);
+ }
+
+ &--disabled {
+ cursor: not-allowed;
+ opacity: 0.55;
+ }
+
+ &__image-wrap {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 160px;
+ background: #f9fafb;
+ padding: 20px;
+ }
+
+ &__image {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+
+ &__body {
+ padding: 16px 18px 18px;
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+ }
+
+ &__title {
+ font-size: 15px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0;
+ line-height: 1.4;
+ }
+
+ &__price {
+ font-size: 18px;
+ font-weight: 600;
+ color: @App-primary-color;
+ margin: 0;
+ direction: ltr;
+ text-align: right;
+ }
+
+ &__badge {
+ display: inline-flex;
+ align-self: flex-start;
+ padding: 4px 8px;
+ border-radius: 6px;
+ background: #f3f4f6;
+ font-size: 11px;
+ font-weight: 600;
+ color: #6b7280;
+ }
+}
+
+.dproducts-empty {
+ grid-column: 1 / -1;
+ padding: 48px 24px;
+ text-align: center;
+ color: #6b7280;
+ font-size: 14px;
+}
+
+.dproducts-order-panel {
+ :deep(.ant-modal-content) {
+ border-radius: 16px;
+ overflow: hidden;
+ }
+
+ :deep(.ant-modal-body) {
+ max-height: calc(100vh - 180px);
+ overflow-y: auto;
+ padding: 0 24px 24px;
+ }
+}
diff --git a/src/views/base/products/index.vue b/src/views/base/products/index.vue
index 14f9734..53b7ed0 100644
--- a/src/views/base/products/index.vue
+++ b/src/views/base/products/index.vue
@@ -1,279 +1,112 @@
-
+
+
+
+
+
+
+
+ سفارشها
+ +
+
+
+
+
+
+
+
+ محصولی برای نمایش وجود ندارد.
+
+
- ![]()
-
-
-
-
- همه
- {{ item }}
-
-
+
+
+
+
-
-
+ متوجه شدم
+
+
+
-
-
-
-
-
-
-
-
-
+ nameProject: ComputedRef
+ isBoursecu: ComputedRef
+ rulesTitle: ComputedRef
+ rulesBlocks: ComputedRef
+ getProjectSupportPhoneLink: typeof getProjectSupportPhoneLink
+ getProjectBaleLink: typeof getProjectBaleLink
+}
+
+export const RULES_PAGE_CONTEXT_KEY: InjectionKey = Symbol('rulesPageContext')
+
+export function useRulesPage() {
+ const config = useConfigStore()
+
+ const nameProject = computed(
+ () => config.config?.name_fa || config.config?.name || 'بورس مس',
+ )
+
+ const isBoursecu = computed(() => isBoursecuProject())
+
+ const rulesTitle = computed(() => getRulesTitle(nameProject.value, isBoursecu.value))
+
+ const rulesBlocks = computed(() => getRulesBlocks(nameProject.value, isBoursecu.value))
+
+ const context: RulesPageContext = {
+ config,
+ nameProject,
+ isBoursecu,
+ rulesTitle,
+ rulesBlocks,
+ getProjectSupportPhoneLink,
+ getProjectBaleLink,
+ }
+
+ provide(RULES_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function useRulesPageContext() {
+ const context = inject(RULES_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('useRulesPageContext must be used within a page that calls useRulesPage()')
+ }
+ return context
+}
diff --git a/src/views/base/rules/desktop/DesktopRulesView.vue b/src/views/base/rules/desktop/DesktopRulesView.vue
new file mode 100644
index 0000000..5bc4013
--- /dev/null
+++ b/src/views/base/rules/desktop/DesktopRulesView.vue
@@ -0,0 +1,50 @@
+
+
-
+
+
+
+
+
+
+
-
+
+
+
+
+
+
+
- محصول فعال نیست
+
+ در حال حاضر امکان معامله این محصول وجود ندارد.
-
-
-
-
-
-
-
- متوجه شدم
-
-
-
-
-
-
- متوجه شدم
-
-
-
+
+
+ متوجه شدم
+
+
+
+
-
\ No newline at end of file
+
diff --git a/src/views/base/products/mobile/MobileProductsView.vue b/src/views/base/products/mobile/MobileProductsView.vue
new file mode 100644
index 0000000..2c30f10
--- /dev/null
+++ b/src/views/base/products/mobile/MobileProductsView.vue
@@ -0,0 +1,62 @@
+
+ محصول فعال نیست
-
- در حال حاضر امکان معامله این محصول وجود ندارد.
+
+
-
-
-
+
- مشتریان گرامی
+
+
فروشگاه در حال حاضر بسته است.
+ساعت کاری فروشگاه از {{ openTime }} تا {{ closeTime }} میباشد.
+از همراهی و اعتماد شما سپاسگزاریم.🤍
+
-
-
-
- مشتریان گرامی
-
-
- فروشگاه در حال حاضر بسته است.
-ساعت کاری فروشگاه از {{ openTime }} تا {{ closeTime }} میباشد.
-از همراهی و اعتماد شما سپاسگزاریم.🤍
-
+
+
+
+
+
+
+
+
diff --git a/src/views/base/rules/components/RulesContentPanel.vue b/src/views/base/rules/components/RulesContentPanel.vue
new file mode 100644
index 0000000..a101fd0
--- /dev/null
+++ b/src/views/base/rules/components/RulesContentPanel.vue
@@ -0,0 +1,68 @@
+
+
+ ![]()
+
+
+
+
+
+ همه
+
+ {{ item }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/base/rules/components/RulesSupportActions.vue b/src/views/base/rules/components/RulesSupportActions.vue
new file mode 100644
index 0000000..df00329
--- /dev/null
+++ b/src/views/base/rules/components/RulesSupportActions.vue
@@ -0,0 +1,41 @@
+
+
+ {{ rulesTitle }}
+
+
+
+
+
+ {{ block.title }}
+
+ + {{ rule }} +
+
+
+ تماس با پشتیبانی
+
+
+
+
+
+
+
+
diff --git a/src/views/base/rules/composables/useRulesPage.ts b/src/views/base/rules/composables/useRulesPage.ts
new file mode 100644
index 0000000..7bb7c93
--- /dev/null
+++ b/src/views/base/rules/composables/useRulesPage.ts
@@ -0,0 +1,55 @@
+import { computed, inject, provide, type ComputedRef, type InjectionKey } from 'vue'
+import { useConfigStore } from '@/store/configStore'
+import {
+ getProjectBaleLink,
+ getProjectSupportPhoneLink,
+ isBoursecuProject,
+} from '@/utils/config'
+import { getRulesBlocks, getRulesTitle, type RulesBlock } from '../rulesContent'
+
+export interface RulesPageContext {
+ config: ReturnType
+
+
+
+
+
+
diff --git a/src/views/base/rules/desktop/styles/desktop-rules.less b/src/views/base/rules/desktop/styles/desktop-rules.less
new file mode 100644
index 0000000..9487519
--- /dev/null
+++ b/src/views/base/rules/desktop/styles/desktop-rules.less
@@ -0,0 +1,212 @@
+/* Premium desktop rules page */
+
+.drules {
+ min-height: 100%;
+ background: #f6f7f9;
+ color: #111827;
+}
+
+.drules__container {
+ max-width: 1080px;
+ margin: 0 auto;
+ padding: 28px 36px 40px;
+}
+
+.drules-topbar {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 16px;
+ margin-bottom: 28px;
+ padding-bottom: 24px;
+ border-bottom: 1px solid rgba(15, 23, 42, 0.06);
+
+ &__back {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ border: none;
+ background: transparent;
+ color: #6b7280;
+ font-size: 13px;
+ font-weight: 500;
+ font-family: inherit;
+ cursor: pointer;
+ padding: 8px 0;
+
+ &:hover {
+ color: #111827;
+ }
+ }
+
+ &__meta {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__eyebrow {
+ font-size: 12px;
+ font-weight: 500;
+ color: #9ca3af;
+ margin: 0 0 4px;
+ }
+
+ &__title {
+ font-size: 26px;
+ font-weight: 600;
+ letter-spacing: -0.03em;
+ color: #111827;
+ margin: 0;
+ line-height: 1.2;
+ }
+}
+
+.drules-layout {
+ display: grid;
+ grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
+ gap: 20px;
+ align-items: start;
+}
+
+.drules-surface {
+ background: #fff;
+ border: 1px solid rgba(15, 23, 42, 0.06);
+ border-radius: 16px;
+ box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+}
+
+.drules-main {
+ padding: 28px;
+
+ &__intro {
+ display: flex;
+ align-items: center;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding-bottom: 20px;
+ border-bottom: 1px solid #eef0f3;
+ }
+
+ &__logo {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 56px;
+ height: 56px;
+ border-radius: 14px;
+ background: rgba(9, 61, 81, 0.08);
+ color: @App-primary-color;
+ flex-shrink: 0;
+ }
+
+ &__project {
+ font-size: 18px;
+ font-weight: 700;
+ color: #111827;
+ margin: 0 0 4px;
+ }
+
+ &__tagline {
+ font-size: 13px;
+ color: #6b7280;
+ margin: 0;
+ }
+}
+
+.drules-content {
+ padding: 20px;
+ border: 1px solid rgba(9, 61, 81, 0.12);
+ border-radius: 12px;
+ background: rgba(9, 61, 81, 0.02);
+ color: @App-primary-color;
+
+ &__title {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.6;
+ margin: 0;
+ }
+
+ &__divider {
+ width: 100%;
+ height: 1px;
+ background: rgba(9, 61, 81, 0.12);
+ margin: 16px 0;
+ }
+
+ &__block + &__block {
+ margin-top: 20px;
+ padding-top: 20px;
+ border-top: 1px solid rgba(9, 61, 81, 0.08);
+ }
+
+ &__block-title {
+ font-size: 15px;
+ font-weight: 700;
+ margin: 0 0 12px;
+ color: inherit;
+ }
+
+ &__paragraph {
+ margin: 0 0 14px;
+ font-size: 14px;
+ line-height: 1.9;
+ text-align: justify;
+ color: inherit;
+ word-break: normal;
+ overflow-wrap: break-word;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+}
+
+.drules-side {
+ padding: 24px;
+ position: sticky;
+ top: 24px;
+
+ &__title {
+ font-size: 15px;
+ font-weight: 600;
+ color: #111827;
+ margin: 0 0 8px;
+ }
+
+ &__text {
+ font-size: 13px;
+ line-height: 1.7;
+ color: #6b7280;
+ margin: 0 0 20px;
+ }
+}
+
+.drules-support {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 8px;
+
+ > a:first-child {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__bale {
+ width: 40px;
+ height: 40px;
+ object-fit: contain;
+ flex-shrink: 0;
+ }
+}
+
+@media (max-width: 1023.98px) {
+ .drules-layout {
+ grid-template-columns: 1fr;
+ }
+
+ .drules-side {
+ position: static;
+ }
+}
diff --git a/src/views/base/rules/index.vue b/src/views/base/rules/index.vue
index ac33a20..deab7c7 100644
--- a/src/views/base/rules/index.vue
+++ b/src/views/base/rules/index.vue
@@ -1,193 +1,24 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ nameProject }}
+شرایط استفاده از خدمات و تعهدات کاربران
+
-
+}
+
+export const PERMISSIONS_PAGE_CONTEXT_KEY: InjectionKey =
+ Symbol('permissionsPageContext')
+
+export function usePermissionsPage() {
+ const config = useConfigStore()
+
+ const context: PermissionsPageContext = { config }
+
+ provide(PERMISSIONS_PAGE_CONTEXT_KEY, context)
+ return context
+}
+
+export function usePermissionsPageContext() {
+ const context = inject(PERMISSIONS_PAGE_CONTEXT_KEY)
+ if (!context) {
+ throw new Error('usePermissionsPageContext must be used within a page that calls usePermissionsPage()')
+ }
+ return context
+}
diff --git a/src/views/base/rules/permissions/desktop/DesktopPermissionsView.vue b/src/views/base/rules/permissions/desktop/DesktopPermissionsView.vue
new file mode 100644
index 0000000..c715a9a
--- /dev/null
+++ b/src/views/base/rules/permissions/desktop/DesktopPermissionsView.vue
@@ -0,0 +1,59 @@
+
+
-
-
-
- قوانین و مقررات
-
-
-
+
- ![]()
-
-
-
-
-
-
-
-
-
-
-
-
- {{ rulesTitle }}
-
-
-
-
-
- {{ block.title }}
-
- - {{ rule }} -
-
-
- تماس با پشتیبانی
-
-
-
-
-
-
-
-
-
- تماس با پشتیبانی
-
-
-
-
-
-
-
-
+
diff --git a/src/views/base/rules/mobile/MobileRulesView.vue b/src/views/base/rules/mobile/MobileRulesView.vue
new file mode 100644
index 0000000..82a9ee6
--- /dev/null
+++ b/src/views/base/rules/mobile/MobileRulesView.vue
@@ -0,0 +1,31 @@
+
+
+
+
+
+
diff --git a/src/views/base/rules/permissions/composables/usePermissionsPage.ts b/src/views/base/rules/permissions/composables/usePermissionsPage.ts
new file mode 100644
index 0000000..33192e8
--- /dev/null
+++ b/src/views/base/rules/permissions/composables/usePermissionsPage.ts
@@ -0,0 +1,26 @@
+import { inject, provide, type InjectionKey } from 'vue'
+import { useConfigStore } from '@/store/configStore'
+
+export interface PermissionsPageContext {
+ config: ReturnType
+
+
+
+ قوانین و مقررات
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
+
+