chang icons of boursemes

Co-authored-by: Cursor <cursoragent@cursor.com>

src/views/base/home/components/HomeQuickActionBox.vue

@@ -17,12 +17,18 @@ const isBoursecu = isBoursecuProject()
 <template>
   <button
     type="button"
-    class="home-quick-action-box flex flex-col items-center justify-center gap-2 rounded-xl border-2 p-3 min-h-[96px] w-full"
+    class="home-quick-action-box flex flex-col items-center justify-center gap-2 rounded-xl border-2 p-1 min-h-[96px] w-full"
     :class="{ 'home-quick-action-box--boursecu': isBoursecu }"
     @click="$emit('click')"
   >
-    <div class="flex h-11 w-11 shrink-0 items-center justify-center">
-      <Icon class="text-primary" :icon="action.icon" size="28" />
+    <div class="flex h-12 w-12 shrink-0 items-center justify-center">
+      <img
+        v-if="action.iconSrc"
+        :src="action.iconSrc"
+        alt=""
+        class="h-full w-full object-contain project-icon-image"
+      />
+      <Icon v-else class="text-primary" :icon="action.icon" size="28" />
     </div>
     <span class="text-primary text-xs font-bold text-center leading-5">{{ action.label }}</span>
   </button>
@@ -38,4 +44,8 @@ const isBoursecu = isBoursecuProject()
   background-color: #eff5f3;
   border-color: #d4e3de;
 }
+
+.project-icon-image {
+  transform: scale(1.75);
+}
 </style>

src/views/base/home/desktop/components/DesktopQuickActionsPanel.vue

@@ -32,7 +32,13 @@ function navigate(action: HomeQuickActionItem) {
         @click="navigate(action)"
       >
         <span class="dhome-action__icon">
-          <BasicIcon :icon="action.icon" size="18" />
+          <img
+            v-if="action.iconSrc"
+            :src="action.iconSrc"
+            alt=""
+            class="dhome-action__icon-image"
+          />
+          <BasicIcon v-else :icon="action.icon" size="18" />
         </span>
         <span class="dhome-action__label">{{ action.label }}</span>
         <BasicIcon icon="vuesax-linear:arrow-left" size="14" class="dhome-action__chevron" />

src/views/base/home/desktop/styles/desktop-home.less

@@ -374,6 +374,14 @@
     color: @App-primary-color;
     flex-shrink: 0;
     transition: background 0.15s ease;
+    overflow: visible;
+  }
+
+  &__icon-image {
+    width: 18px;
+    height: 18px;
+    object-fit: contain;
+    transform: scale(2.2);
   }
 
   &:hover &__icon {

src/views/base/home/layouts/configs/boursecuQuickActions.ts

@@ -1,3 +1,4 @@
+import { getBoursecuActionIconSrc } from '@/utils/config'
 import type { HomeQuickActionItem } from '../types'
 
 export const boursecuQuickActions: HomeQuickActionItem[] = [
@@ -5,36 +6,42 @@ export const boursecuQuickActions: HomeQuickActionItem[] = [
     id: 'buySell',
     label: 'خرید و فروش',
     icon: 'vuesax-linear:money-receive',
+    iconSrc: getBoursecuActionIconSrc('buySell'),
     route: { name: 'buyProduct' },
   },
   {
     id: 'wallet',
     label: 'واریز و برداشت',
     icon: 'vuesax-linear:wallet-1',
+    iconSrc: getBoursecuActionIconSrc('wallet'),
     route: { name: 'wallet' },
   },
   {
     id: 'assets',
     label: 'دارایی ها',
     icon: 'vuesax-linear:cup',
+    iconSrc: getBoursecuActionIconSrc('assets'),
     route: { name: 'fund' },
   },
   {
     id: 'transactions',
     label: 'تراکنش ها',
     icon: 'vuesax-linear:receipt-item',
+    iconSrc: getBoursecuActionIconSrc('transactions'),
     route: { name: 'transactions' },
   },
   {
     id: 'physicalReceive',
     label: 'تحویل فیزیکی',
     icon: 'vuesax-linear:direct-inbox',
+    iconSrc: getBoursecuActionIconSrc('physicalReceive'),
     route: { name: 'physicalReceive' },
   },
   {
     id: 'convert',
     label: 'تبدیل',
     icon: 'vuesax-linear:refresh-circle',
+    iconSrc: getBoursecuActionIconSrc('convert'),
     route: { name: 'buyProduct' },
   },
-]
+]

src/views/base/home/layouts/types.ts

@@ -18,6 +18,7 @@ export interface HomeQuickActionItem {
   id: string
   label: string
   icon: string
+  iconSrc?: string
   route: { name: string; query?: Record<string, string> }
 }
 

src/views/base/user/composables/useUserPage.ts

@@ -14,12 +14,13 @@ import { updateMe, updatePass } from '@/api/me'
 import { useUserStore } from '@/store/userStore'
 import { getUserAvatarUrl } from '@/utils/file'
 import { useConfigStore } from '@/store/configStore'
-import { getConfigApp, getReferralShareText, getReferralShareTitle } from '@/utils/config'
+import { getConfigApp, getReferralShareText, getReferralShareTitle, isBoursecuProject, getBoursecuActionIconSrc } from '@/utils/config'
 
 export interface UserMenuAction {
   id: string
   label: string
   icon: string
+  iconSrc?: string
   onClick: () => void
   visible: boolean
 }
@@ -138,6 +139,7 @@ export function useUserPage() {
         id: 'physicalReceive',
         label: 'تحویل فیزیکی',
         icon: 'vuesax-linear:direct-inbox',
+        iconSrc: isBoursecuProject() ? getBoursecuActionIconSrc('physicalReceive') : undefined,
         onClick: () => router.push({ name: 'physicalReceive' }),
         visible: projectName !== 'bazretala',
       },

src/views/base/user/desktop/DesktopUserView.vue

@@ -71,7 +71,13 @@
               @click="action.onClick"
             >
               <span class="duser-actions__icon">
-                <BasicIcon :icon="action.icon" size="18" />
+                <img
+                  v-if="action.iconSrc"
+                  :src="action.iconSrc"
+                  alt=""
+                  class="duser-actions__icon-image"
+                />
+                <BasicIcon v-else :icon="action.icon" size="18" />
               </span>
               <span class="duser-actions__label">{{ action.label }}</span>
               <BasicIcon

src/views/base/user/desktop/styles/desktop-user.less

@@ -230,6 +230,14 @@
     background: #f3f4f6;
     color: #374151;
     flex-shrink: 0;
+    overflow: visible;
+  }
+
+  &__icon-image {
+    width: 18px;
+    height: 18px;
+    object-fit: contain;
+    transform: scale(2.2);
   }
 
   &__label {

src/views/base/user/mobile/MobileUserView.vue

@@ -74,7 +74,13 @@
             @click="action.onClick"
           >
             <div class="flex">
-              <BasicIcon :icon="action.icon" class="absolute right-8" />
+              <img
+                v-if="action.iconSrc"
+                :src="action.iconSrc"
+                alt=""
+                class="user-menu-icon-image absolute right-8"
+              />
+              <BasicIcon v-else :icon="action.icon" class="absolute right-8" />
               <div>{{ action.label }}</div>
             </div>
           </BasicButton>
@@ -108,4 +114,11 @@ const {
   overflow-y: auto;
   max-height: 100vh;
 }
+
+.user-menu-icon-image {
+  width: 18px;
+  height: 18px;
+  object-fit: contain;
+  transform: scale(2.2);
+}
 </style>