1404/11/01-add dynamic config

src/App.vue

@@ -2,101 +2,104 @@
   <div class="desktopConfig w-full right-0 left-0 absolute">
     <div v-if="popVisible" class="top-0 bottom-0 wrap-fix bg-primary z-100 opacity-60">
       <div class="absolute right-0 left-0 bottom-10vh flex flex-col items-center">
-        <div><BasicButton>درباره ما</BasicButton></div>
+        <div>
+          <BasicButton>درباره ما</BasicButton>
+        </div>
         <div></div>
         <div></div>
       </div>
     </div>
-    <transition mode="out-in" name="fade">
-      <AConfigProvider
-        v-if="!showSplash"
-        :theme="{
-          token: {
-            colorPrimary: colors.primary,
-            colorLink: colors.primary,
-            colorLinkActive: colors.primary,
-            colorLinkHover: colors['primary-rgba']
-          }
-        }"
+    <AConfigProvider
+        v-if=" antTheme"
+        :theme="antTheme"
         direction="rtl"
-      >
-        <router-view v-slot="{ Component, route }">
-          <!-- Use any custom transition and  to `fade` -->
-          <transition :name="route.meta.transition || 'fade'">
-            <div>
-              <component :is="Component" />
-            </div>
-          </transition>
-        </router-view>
-      </AConfigProvider>
+    >
+      <transition mode="out-in" name="fade">
 
-      <div v-else class="flex bottom-0 wrap-fix top-0 bg-white z-1000000000000 justify-center">
-        <div class="top-0 wrap-fix h-1/3 w-screen flex">
-          <img :src="img_topGradiant" alt="" class="absolute z-10 w-screen h-full object-cover" />
-          <img :src="img_pattern" alt="" class="absolute w-screen h-full object-none" />
-        </div>
-        <div class="wrap-fix bottom-0 h-1/3 w-screen">
-          <img
-            :src="img_bottomGradiant"
-            alt=""
-            class="absolute z-10 w-screen h-full object-cover"
-          />
-          <img :src="img_pattern" alt="" class="absolute w-screen h-full object-none" />
-        </div>
-        <div class="self-center splash_appear_fade_in">
-          <img :src="config?.config?.avatar" class="h-[20vh]">
+        <div v-if="!showSplash">
+          <router-view v-slot="{ Component, route }">
+            <!-- Use any custom transition and  to `fade` -->
+            <transition :name="route.meta.transition || 'fade'">
 
-<!--          <img :src="logoFull" class="h-[20vh]">-->
-<!--          <img :src="logo" alt="" class="z-100 bg-primary rounded-full w-full aspect-square self-center h-40" />-->
+              <div>
+                <component :is="Component"/>
+              </div>
+            </transition>
+          </router-view>
 
         </div>
-        <div class="fixed w-full bottom-5 home_appear_fade_in_up">
-          <div class="text-center text-xs">نسخه: {{ pkg.version }}</div>
+        <div v-else class="flex bottom-0 wrap-fix top-0 bg-white z-1000000000000 justify-center">
+          <div class="top-0 wrap-fix h-1/3 w-screen flex">
+            <img :src="img_topGradiant" alt="" class="absolute z-10 w-screen h-full object-cover"/>
+            <img :src="img_pattern" alt="" class="absolute w-screen h-full object-none"/>
+          </div>
+          <div class="wrap-fix bottom-0 h-1/3 w-screen">
+            <img
+                :src="img_bottomGradiant"
+                alt=""
+                class="absolute z-10 w-screen h-full object-cover"
+            />
+            <img :src="img_pattern" alt="" class="absolute w-screen h-full object-none"/>
+          </div>
+          <div class="self-center splash_appear_fade_in">
+            <img :src="config?.config?.avatar" class="h-[20vh]">
+
+            <!--          <img :src="logoFull" class="h-[20vh]">-->
+            <!--          <img :src="logo" alt="" class="z-100 bg-primary rounded-full w-full aspect-square self-center h-40" />-->
+
+          </div>
+          <div class="fixed w-full bottom-5 home_appear_fade_in_up">
+            <div class="text-center text-xs">نسخه: {{ pkg.version }}</div>
+          </div>
+          <div class="absolute bottom-10">
+            <a-spin :indicator="indicator" size="small"/>
+          </div>
         </div>
-        <div class="absolute bottom-10">
-          <a-spin :indicator="indicator" size="small" />
-        </div>
-      </div>
-    </transition>
+      </transition>
+
+    </AConfigProvider>
+
+
     <van-dialog
-      v-model:show="versionDialog"
-      class="updateButton"
-      confirm-button-text="به روزرسانی کنید"
-      show-confirm-button
-      @confirm="update()"
+        v-model:show="versionDialog"
+        class="updateButton"
+        confirm-button-text="به روزرسانی کنید"
+        show-confirm-button
+        @confirm="update()"
     >
       <div class="flex flex-col items-center p-2">
         <DotLottieVue
-          class="w-full aspect-square"
-          autoplay
-          loop
-          src="https://lottie.host/cb620e8e-c64a-42e8-a6b5-8844146e5999/nmft7oBO8q.json"
+            class="w-full aspect-square"
+            autoplay
+            loop
+            src="https://lottie.host/cb620e8e-c64a-42e8-a6b5-8844146e5999/nmft7oBO8q.json"
         />
-        <div class="home_appear_fade_in_up mt-2">نسخه جدید  گلد منتشر شد!</div>
+        <div class="home_appear_fade_in_up mt-2">نسخه جدید }ککک منتشر شد!</div>
       </div>
     </van-dialog>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { colors } from './themeConfig'
+import {colors} from './themeConfig'
 import pkg from '../package.json'
-import { useRegisterSW } from 'virtual:pwa-register/vue'
-import { h, onMounted, ref } from 'vue'
-import { update } from 'lodash'
+import {useRegisterSW} from 'virtual:pwa-register/vue'
+import {computed, h, onMounted, ref} from 'vue'
+import {update} from 'lodash'
 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'
+import {LoadingOutlined} from '@ant-design/icons-vue'
 
 import img_bottomGradiant from '@/views/login/assets/img/gr_bottom_white.svg'
 import logoFull from '@/assets/img/logo_full_.png'
-import { DotLottieVue } from '@lottiefiles/dotlottie-vue'
+import {DotLottieVue} from '@lottiefiles/dotlottie-vue'
 import BasicButton from '@/components/BasicPacks/BasicButton.vue'
 import {getConfig} from "@/api/config";
 import {useConfigStore} from "@/store/configStore";
+import { ConfigProvider as AConfigProvider } from 'ant-design-vue'
 
-const { offlineReady, needRefresh, updateServiceWorker } = useRegisterSW()
-const config=useConfigStore()
+const {offlineReady, needRefresh, updateServiceWorker} = useRegisterSW()
+const config = useConfigStore()
 const indicator = h(LoadingOutlined, {
   style: {
     fontSize: '24px'
@@ -104,8 +107,22 @@ const indicator = h(LoadingOutlined, {
   spin: true
 })
 const showSplash = ref(true)
+
+const antTheme = computed(() => {
+  if (!config.config?.color) return null
+
+  return {
+    token: {
+      colorPrimary: "#ff0000",
+      colorLink: config.config.color,
+      colorLinkActive: config.config.color,
+      colorLinkHover: config.config.color,
+    },
+  }
+})
 onMounted(async () => {
- await config.getConfigData()
+  await config.getConfigData()
+  console.log(config.config.color)
   checkVersion()
   setTimeout(() => {
     showSplash.value = false
@@ -117,7 +134,7 @@ const versionDialog = ref<boolean>(false)
 function checkVersion() {
   const version = localStorage.getItem('version')
   // if (true) {
-  if (!version){
+  if (!version) {
     update()
   }
   if (version != pkg.version) {
@@ -135,7 +152,7 @@ function update() {
 
 <style lang="less">
 .updateButton .van-dialog__confirm .van-button__text {
-  color: @primary-color !important;
+  color: @App-primary-color !important;
   font-weight: 600;
   font-size: 15px;
 }

src/assets/css/ant.less

@@ -0,0 +1,216 @@
+/* =================== متغیرها =================== */
+
+/* =================== Buttons =================== */
+.ant-btn-primary {
+  background-color: @App-primary-color !important;
+  border-color: @App-primary-color !important;
+  color: #fff !important;
+
+  &:hover {
+    background-color: @App-primary-color !important;
+    border-color: @App-primary-color !important;
+    color: #fff !important;
+
+  }
+
+  &:active {
+    background-color: @App-primary-color !important;
+    border-color: @App-primary-color !important;
+    color: #fff !important;
+
+  }
+
+  &:disabled {
+    background-color: #f5f5f5 !important;
+    border-color: #d9d9d9 !important;
+    cursor: not-allowed !important;
+
+  }
+}
+
+//.ant-btn {
+//  &:hover {
+//    border-color: @App-primary-color !important;
+//    box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+//    color: @App-primary-color !important;
+//  }
+//
+//  &.ant-input-focused {
+//    border-color: @App-primary-color !important;
+//    box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+//    color: @App-primary-color !important;
+//  }
+//
+//  &:focus {
+//    border-color: @App-primary-color !important;
+//    box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+//    color: @App-primary-color !important;
+//  }
+//}
+.ant-btn-default:hover,
+.ant-btn-default:focus {
+  border-color: @App-primary-color !important;
+  color: @App-primary-color !important;
+}
+/* =================== Links =================== */
+.ant-typography a,
+.ant-typography a:hover,
+.ant-typography a:active {
+  color: @App-primary-color !important;
+}
+
+/* =================== Badge =================== */
+.ant-badge-status-processing {
+  background-color: @App-primary-color !important;
+}
+
+/* =================== Input =================== */
+//.ant-input,
+//.ant-input:hover,
+//.ant-input-focused,
+//.ant-input:focus {
+//  border-color: @App-primary-color !important;
+//  box-shadow: 0 0 0 2px rgba(10,27,55,0.2) !important; /* fallback برای hover */
+//}
+.ant-input {
+  &:hover {
+    border-color: @App-primary-color !important;
+    box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+  }
+
+  &.ant-input-focused {
+    border-color: @App-primary-color !important;
+    box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+  }
+
+  &:focus {
+    border-color: @App-primary-color !important;
+    box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+  }
+}
+.ant-input-affix-wrapper:focus, .ant-input-affix-wrapper-focused{
+  border-color: @App-primary-color !important;
+  box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+}
+
+/* =================== Select =================== */
+.ant-select-focused,
+.ant-select:hover,
+.ant-select-selection {
+  border-color: @App-primary-color !important;
+  box-shadow: none
+}
+.ant-select:not(.ant-select-disabled):hover .ant-select-selector{
+  border-color: @App-primary-color !important;
+  box-shadow: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+}
+
+
+/* =================== Radio =================== */
+.ant-radio-checked .ant-radio-inner {
+  border-color: @App-primary-color !important;
+  background-color: @App-primary-color !important;
+}
+.ant-radio-group-solid .ant-radio-button-wrapper-checked{
+  border-color: @App-primary-color !important;
+  background-color: @App-primary-color !important;
+}
+.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover::before{
+  background-color: @App-primary-color !important;
+
+}
+
+/* =================== Checkbox =================== */
+.ant-checkbox-checked .ant-checkbox-inner {
+  border-color: @App-primary-color !important;
+  background-color: @App-primary-color !important;
+}
+
+/* =================== Switch =================== */
+.ant-switch-checked {
+  background-color: @App-primary-color !important;
+}
+
+/* =================== Tag =================== */
+//.ant-tag-blue {
+//  background-color: @App-primary-color !important;
+//  color: #fff !important;
+//  border-color: @App-primary-color !important;
+//}
+
+/* =================== Slider =================== */
+.ant-slider-track {
+  background-color: @App-primary-color !important;
+}
+.ant-slider-handle {
+  border-color: @App-primary-color !important;
+}
+
+/* =================== Menu =================== */
+.ant-menu-item-selected {
+  background-color: @App-primary-color !important;
+}
+.ant-menu-item-selected a {
+  color: #fff !important;
+}
+
+/* =================== Pagination =================== */
+.ant-pagination-item-active {
+  background-color: @App-primary-color !important;
+  border-color: @App-primary-color !important;
+}
+
+/* =================== Tooltip =================== */
+.ant-tooltip-arrow-content {
+  background-color: @App-primary-color !important;
+}
+
+/* =================== Tabs =================== */
+.ant-tabs-tab-active {
+  color: @App-primary-color !important;
+}
+
+/* =================== Card =================== */
+.ant-card-head-title a {
+  color: @App-primary-color !important;
+}
+
+/* =================== Steps =================== */
+.ant-steps-item-process .ant-steps-item-icon,
+.ant-steps-item-finish .ant-steps-item-icon {
+  background-color: @App-primary-color !important;
+}
+
+/* =================== Alert =================== */
+.ant-alert-success .ant-alert-icon,
+.ant-alert-info .ant-alert-icon,
+.ant-alert-warning .ant-alert-icon,
+.ant-alert-error .ant-alert-icon {
+  color: @App-primary-color !important;
+}
+
+/* =================== Divider =================== */
+//.ant-divider-horizontal {
+//  border-top-color: @App-primary-color !important;
+//}
+
+/* =================== Checkbox / Radio Hover =================== */
+.ant-checkbox:hover .ant-checkbox-inner,
+.ant-radio:hover .ant-radio-inner {
+  border-color: @App-primary-color !important;
+}
+
+/* =================== Disabled =================== */
+.ant-checkbox-disabled .ant-checkbox-inner,
+.ant-radio-disabled .ant-radio-inner {
+  background-color: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+  border-color: 0 0 0 2px color-mix(in srgb, @App-primary-color 20%, transparent) !important;
+}
+
+.ant-spin-dot-item {
+  background-color: @App-primary-color !important;
+}
+
+.ant-spin-dot i {
+  background-color: @App-primary-color !important;
+}

src/assets/css/main.less

@@ -1,5 +1,6 @@
 @import (less) './var.less';
 @import (less) './fonts.less';
+@import (less) './ant.less';
 
 html {
   scroll-behavior: smooth;
@@ -133,7 +134,7 @@ body {
     background-color: #fff;
     //display: none;
     outline: none;
-    border: 1px solid #0A1B37 !important;
+    border: 1px solid @App-primary-color !important;
   }
 }
 
@@ -331,18 +332,18 @@ body {
 }
 .ant-radio-group-solid
 .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover{
-  color: #0A1B37 !important;
+  color:@App-primary-color !important;
 }
 .ant-input-group-addon{
-  background-color: #0A1B37 !important;
-  color: #e0be7f !important;
+  background-color: @App-primary-color !important;
+  color: @secondary-color !important;
 }
 .ant-slider-track{
-  background-color: #0A1B37 !important;
+  background-color:@App-primary-color !important;
 
 }
 .ant-slider-handle {
-  background-color: #0A1B37 !important;
+  background-color: @App-primary-color !important;
 
 }
 

src/assets/css/var.less

@@ -1,8 +1,13 @@
 @prefixCls: 'noname';
 
-@primary-color: #0A1B37;
-@secondary-color: #0A1B37;
+@App-primary-color: var(--App-primary-color);
+@secondary-color:  var(--App-secondary-color);
 @prefixCls-font-family: 'iran-sans';
-@prefixCls-background-color: #fff;
+@prefixCls-background-color:  var(--App-background-color);
 
 @border-radius-base: 8px;
+:root {
+  --App-primary-color: #0A1B37;
+  --App-secondary-color: #e0be7f;
+  --App-background-color: #ffffff;
+}

src/components/BasicPacks/BaseDatePicker/src/datePick/style/index.less

@@ -180,7 +180,7 @@
       bottom: -@border-width-base;
       height: 2px;
       margin-left: @input-padding-horizontal-base;
-      background: @primary-color;
+      background: @App-primary-color;
       opacity: 0;
       transition: all @animation-duration-slow ease-out;
       pointer-events: none;
@@ -288,7 +288,7 @@
 
     // https://github.com/ant-design/ant-design/issues/23687
     .@{picker-prefix-cls}-preset > .@{ant-prefix}-tag-blue {
-      color: @primary-color;
+      color: @App-primary-color;
       background: @primary-1;
       border-color: @primary-3;
       cursor: pointer;

src/components/BasicPacks/BaseDatePicker/src/datePick/style/panel.less

@@ -15,7 +15,7 @@
     outline: none;
 
     &-focused {
-      border-color: @primary-color;
+      border-color: @App-primary-color;
     }
   }
 
@@ -78,7 +78,7 @@
         }
 
         &:hover {
-          color: @primary-color;
+          color: @App-primary-color;
         }
       }
     }
@@ -194,7 +194,7 @@
         bottom: 0;
         left: 0;
         z-index: 1;
-        border: @border-width-base @border-style-base @primary-color;
+        border: @border-width-base @border-style-base @App-primary-color;
         border-radius: @border-radius-base;
         content: '';
       }
@@ -214,7 +214,7 @@
     &-in-view&-range-start .@{cellClassName},
     &-in-view&-range-end .@{cellClassName} {
       color: @text-color-inverse;
-      background: @primary-color;
+      background: @App-primary-color;
     }
 
     &-in-view&-range-start:not(&-range-start-single),
@@ -520,7 +520,7 @@
 
       &-selected td,
       &-selected:hover td {
-        background: @primary-color;
+        background: @App-primary-color;
 
         &.@{picker-prefix-cls}-cell-week {
           color: fade(@text-color-inverse, 50%);

src/components/BasicPacks/BasicSelect.vue

@@ -105,7 +105,7 @@ const handleChange = (e: any) => {
   //padding: 5px;
   /*  .ant-select {
     .ant-select-selector {
-      border-color: @primary-color;
+      border-color: @App-primary-color;
       border-radius: @border-radius-base;
     }
   }*/

src/config-loader.js

@@ -0,0 +1,181 @@
+(function() {
+  'use strict';
+  //debugger
+
+
+  // Store config in window object
+  window.__APP_CONFIG__ = window.__APP_CONFIG__ || {};
+  window.__CONFIG_READY__ = false;
+
+  // Create a promise that will be resolved when config is loaded
+  let configResolve;
+  let configReject;
+  window.__CONFIG_PROMISE__ = new Promise((resolve, reject) => {
+    configResolve = resolve;
+    configReject = reject;
+  });
+
+  // API endpoint for config - you can change this URL
+  // You can also set it via a data attribute: <script src="/config-loader.js" data-config-url="https://your-api.com/config"></script>
+  //const scriptTag = document.currentScript || document.querySelector('script[src*="config-loader.js"]');
+  //const customUrl = scriptTag ? scriptTag.getAttribute('data-config-url') : null;
+  const CONFIG_URL = 'https://nerkh.gold/get_user' //customUrl || window.location.origin + '/api/config';
+
+  // Timeout to ensure main.ts loads even if config fails (5 seconds)
+  const CONFIG_TIMEOUT = 5000;
+  let configTimeoutId;
+  let mainScriptLoaded = false;
+
+  // Fetch config from server
+  async function loadConfig() {
+    try {
+      const response = await fetch(CONFIG_URL, {
+        method: 'GET',
+        headers: {
+          'Accept': 'application/json',
+        },
+        cache: 'no-cache'
+      });
+
+      if (!response.ok) {
+        throw new Error('Failed to fetch config: ' + response.status);
+      }
+
+      // Check if response is actually JSON
+      const contentType = response.headers.get('content-type');
+      if (!contentType || !contentType.includes('application/json')) {
+        const text = await response.text();
+        throw new Error('Response is not JSON. Received: ' + text.substring(0, 100));
+      }
+
+      const config = await response.json();
+
+      // Store config in window object
+      window.__APP_CONFIG__ = config;
+      window.__CONFIG_READY__ = true;
+      if (config?.user?.name_fa) {
+        document.title = config.user.name + '-'+config.user.name_fa;
+      }
+      // ---------- Dynamic Favicon ----------
+      if (config?.user?.avatar) {
+        const faviconUrl = config.user.avatar;
+
+        // remove existing favicon(s)
+        const existingIcons = document.querySelectorAll('link[rel*="icon"]');
+        existingIcons.forEach(icon => icon.remove());
+
+        // create new favicon
+        const link = document.createElement('link');
+        link.rel = 'icon';
+        link.type = 'image/png'; // یا image/x-icon
+        link.href = faviconUrl + '?v=' + Date.now();
+
+        document.head.appendChild(link);
+      }
+      // Resolve the promise
+      if (configResolve) {
+        configResolve(config);
+      }
+
+      // Dispatch custom event to notify that config is ready
+      window.dispatchEvent(new CustomEvent('configReady', { detail: config }));
+
+      console.log('Config loaded successfully:', config);
+
+      // Clear timeout if config loaded successfully
+      if (configTimeoutId) {
+        clearTimeout(configTimeoutId);
+        configTimeoutId = null;
+      }
+
+      // Load main.ts after config is ready
+      loadMainScript();
+    } catch (error) {
+      console.warn('Config loader: Could not fetch config from', CONFIG_URL);
+      console.warn('Error details:', error.message);
+      console.warn('This is normal if the endpoint does not exist yet. App will continue with empty config.');
+      // Set default empty config on error
+      window.__APP_CONFIG__ = {};
+      window.__CONFIG_READY__ = true;
+
+      // Resolve the promise even on error (with empty config)
+      if (configResolve) {
+        configResolve({});
+      }
+
+      window.dispatchEvent(new CustomEvent('configError', { detail: error }));
+
+      // Clear timeout if error occurred
+      if (configTimeoutId) {
+        clearTimeout(configTimeoutId);
+        configTimeoutId = null;
+      }
+
+      // Load main.ts even on error (with empty config)
+      loadMainScript();
+    }
+  }
+
+  // Function to dynamically load main.ts script
+  function loadMainScript() {
+    //const config= window.__APP_CONFIG__
+    // Check if main.ts is already loaded
+    if (mainScriptLoaded || document.querySelector('script[src="/src/main.ts"]')) {
+      return;
+    }
+
+    mainScriptLoaded = true;
+
+    /*const manifestLink = document.createElement("link")
+    manifestLink.rel = "manifest"
+    manifestLink.id= "manifestsdfsdfsdfsdfsdfsdf"
+    manifestLink.href = `https://nerkh.gold/get_user/${config.user.id}/monifist.json`
+
+    document.head.appendChild(manifestLink)*/
+
+
+    import('/src/main.ts').then(() => {
+      console.log('Main script loaded and executed');
+    });
+
+    /*const script = document.createElement('script');
+    script.type = 'module';
+    script.src = '/src/main.ts';
+    script.async = true;*/
+
+    // Handle script load errors
+    /*script.onerror = function() {
+      console.error('Failed to load main.ts script');
+      mainScriptLoaded = false;
+    };
+
+    script.onload = function() {
+      console.log('Main script loaded successfully');
+    };
+
+    document.body.appendChild(script);*/
+
+    //console.log('Main script loading started...');
+  }
+
+  // Set timeout to ensure main.ts loads even if config fails
+  configTimeoutId = setTimeout(function() {
+    if (!mainScriptLoaded) {
+      console.warn('Config loader: Timeout reached. Loading main.ts with empty config.');
+      // Set default empty config
+      window.__APP_CONFIG__ = window.__APP_CONFIG__ || {};
+      window.__CONFIG_READY__ = true;
+
+      // Resolve promise with empty config
+      if (configResolve) {
+        configResolve({});
+      }
+
+      loadMainScript();
+    }
+  }, CONFIG_TIMEOUT);
+
+  // Start loading config immediately
+  loadConfig();
+})();
+

src/main.ts

@@ -1,7 +1,7 @@
 import 'ant-design-vue/dist/antd.less'
 import './assets/css/main.less'
 import 'virtual:uno.css'
-import { computed, createApp, ref, watch } from 'vue'
+import {computed, createApp, nextTick, ref, watch} from 'vue'
 import { createPinia } from 'pinia'
 import '@unocss/reset/tailwind-compat.css'
 import VueApexCharts from 'vue3-apexcharts'
@@ -16,6 +16,7 @@ import { getMe } from '@/api/me'
 import type { NavigationGuardNext, RouteLocationNormalized } from 'vue-router'
 import { useAuthStore } from '@/store/useAuthStore'
 
+
 const app = createApp(App)
 app.use(createPinia())
 app.use(VueLazyLoad, {
@@ -42,6 +43,7 @@ const currentRoute = computed(() => {
 })
 
 async function start() {
+
   // console.log('ffffffffffffffffffffffffffffffffffffffffff')
   if (getToken()) {
     // await userStore.getMyInfo()
@@ -51,6 +53,7 @@ async function start() {
   }
 
 }
+const win = window as Window & { isWhatsappBtnAdded?: boolean };
 
 export function setTruth() {
   fingerPosition = true
@@ -177,11 +180,25 @@ router.beforeEach(async (to, from, next) => {
     }
   }
 })
-
 app.mount('#app')
 // if (currentRoute.value !== '/') {
 //     await start()
 // }
+
+nextTick(() => {
+  const color = window.__APP_CONFIG__?.user?.color
+  const secondary_color = window.__APP_CONFIG__?.user?.secondary_color
+
+
+  if (!color) {
+    console.warn('Primary color not found')
+    return
+  }
+  console.log('APP_CONFIG:', window.__APP_CONFIG__.user.color)
+  document.documentElement.style.setProperty('--App-primary-color', color)
+  document.documentElement.style.setProperty('--App-secondary-color', secondary_color)
+
+})
 watch(currentRoute, async () => userStore.userInfo ? '' : await start())
 
 

src/store/configStore.ts

@@ -1,21 +1,24 @@
-import { computed, ref } from 'vue'
+import {computed, ref} from 'vue'
 // import { get } from 'lodash'
-import { defineStore } from 'pinia'
-import { getMe } from '@/api/me'
-import type { User } from '@/models/login'
-import { useWalletStore } from '@/store/walletStore'
+import {defineStore} from 'pinia'
+import {getMe} from '@/api/me'
+import type {User} from '@/models/login'
+import {useWalletStore} from '@/store/walletStore'
 import {authenticateWithFingerprint, setFingerPrint} from '@/utils'
-import type { PWallet } from '@/models/wallet'
+import type {PWallet} from '@/models/wallet'
 import {getConfig} from "@/api/config";
 
 
 export const useConfigStore = defineStore('config', () => {
-  const config=ref()
-async function getConfigData(){
-      let temp=await getConfig()
-      config.value=temp.user
-    console.log(config.value)
-}
+    const config = ref()
+
+    async function getConfigData() {
+
+        let temp = window.__APP_CONFIG__
+        config.value = temp.user
+        console.log(config.value)
+    }
+
     return {
         config,
         getConfigData

src/themeConfig.ts

@@ -1,10 +1,14 @@
 import pkg from '../package.json'
 import colors from './baseColor.json'
+import { getConfigApp} from "@/utils/config";
 
 /** base config **/
 /** api document **/
 // export const baseURL: string = 'https://api.gholaktala.ir/'
-export const baseURL: string = 'https://samin.gold/api/'
+const projectBase = getConfigApp('node_server')
+const projectName = getConfigApp('name')
+
+export const baseURL: string = projectBase
 // export const baseURL: string = 'https://api-gholaktala.z23.ir/'
 // const baseUploadURL: string = '/site/file'
 // const uploadURL: string = baseURL + baseUploadURL
@@ -12,7 +16,7 @@ export const baseURL: string = 'https://samin.gold/api/'
 const prefixCls: string = 'noname'
 // const version: string = pkg.version
 // const tokenName: string = 'gholaktala_app_token'
-const tokenName: string = 'samingold_app_token'
+const tokenName: string = `${projectName}_app_token`
 
 const baseButtonIconSize = '24'
 // const appName = { fa: 'بدون نام', en: 'noname' }

src/utils/config.ts

@@ -0,0 +1,9 @@
+
+export function getConfigApp(key: string) {
+  const config = window.__APP_CONFIG__ ? window.__APP_CONFIG__.user:{}
+
+  if (config) {
+    return config[key]
+  }
+  return null
+}

src/views/base/about/index.vue

@@ -24,16 +24,16 @@
               <div class="mt-3">
                 با وجود گسترش فناوری‌های نوین در همه حوزه‌ها، ما در شرکت پخش طلای حاجی ابوالفتح با
                 تلفیق تجربه سنتی خود در بازار طلا و با دانش تخصصی خود و با بهره‌گیری از سوابق موفق
-                قبلی در حوزه فینتک، اقدام به ایجاد  گلد نمودیم.
+                قبلی در حوزه فینتک، اقدام به ایجاد {{ nameProject }} نمودیم.
               </div>
               <div class="mt-3">
-                مهم‌ترین ارزش پیشنهادی  گلد، امکان پس انداز تدریجی طلا با سرمایه‌های خرد و بدون
-                پرداخت هزینه‌های جانبی است و در این راستا گلد دات آی آر تمام تلاش خود را نموده است تا از
+                مهم‌ترین ارزش پیشنهادی  {{ nameProject }}، امکان پس انداز تدریجی طلا با سرمایه‌های خرد و بدون
+                پرداخت هزینه‌های جانبی است و در این راستا {{ nameProject }} تمام تلاش خود را نموده است تا از
                 ابتدای سال 1401 با رونمایی محصول اولیه، برای همه افراد با هر سطحی از دارایی، بستری
                 امن و مطمئن ایجاد نماید.
               </div>
               <div class="mt-3">
-                علاوه بر این  گلد به عنوان یک واحد فناور از سال 1403 با رونمایی نسخه کاملا آنلاین
+                علاوه بر این  {{ nameProject }} به عنوان یک واحد فناور از سال 1403 با رونمایی نسخه کاملا آنلاین
                 و نرم افزاری وارد فاز جدیدی از خرید و فروش طلای آب شده، شده است.
               </div>
               <div class="w-full h-1px my-3 bg-tertiary"></div>
@@ -72,6 +72,7 @@ import { updateMe } from '@/api/me'
 import { useUserStore } from '@/store/userStore'
 import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
 import img_pattern from "@/views/login/assets/img/pattern.svg";
+import {useConfigStore} from "@/store/configStore";
 
 const userFormState = ref<User>({
   fname: '',
@@ -85,6 +86,7 @@ const userFormState = ref<User>({
 })
 const formRef = ref<FormInstance>()
 const userStore = useUserStore()
+const nameProject= useConfigStore().config.name_fa
 
 // const editPassVisible = ref<boolean>(false)
 const editPassVisible = ref<boolean>(false)
@@ -106,12 +108,12 @@ function shareCode() {
   const val = `⭐️الان طلا بخر؛ آخر ماه سودشو ببر!
 با خرید طلای آبشده در مقدارهای کم ولی مستمر، سود بیشتری ببر!
 
-این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای گلد دات آی آر جا نمونید.
+این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای ${nameProject} جا نمونید.
 روی لینک زیر کلیک کنید و ثبت نام خود را تکمیل کنید.
 
 gold.ir/login?id=${userStore.userInfo?.referral_id}`
   navigator.share({
-    title: 'گلد دات آی آر',
+    title: nameProject,
     text: val
   })
   // message.info('کد رونوشت شد')

src/views/base/earnMoney/index.vue

@@ -8,7 +8,7 @@
     </div>
   </div>
   <div class="p-4">
-    <div class="text-center p-3 border-solid  border-1 rounded-[8px] border-[#0A1B37] ">
+    <div class="text-center p-3 border-solid  border-1 rounded-[8px] border-primary ">
       <div class="flex  items-center">
         <div class=" bg-[#DBEAFE] h-10 w-10 rounded-100% flex justify-center items-center">
           <img :src="coin" />
@@ -97,6 +97,7 @@ import GiftCard from '@/views/base/earnMoney/components/GiftCard.vue'
 const data = ref<EarnMoney>()
 
 const userStore = useUserStore()
+const nameProject= useConfigStore().config.name_fa
 
 const isTransaction = ref<boolean>(false)
 
@@ -117,12 +118,12 @@ function shareCode() {
   const val = `⭐️الان طلا بخر؛ آخر ماه سودشو ببر!
 با خرید طلای آبشده در مقدارهای کم ولی مستمر، سود بیشتری ببر!
 
-این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای گلد دات آی آر جا نمونید.
+این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای ${nameProject} جا نمونید.
 روی لینک زیر کلیک کنید و ثبت نام خود را تکمیل کنید.
 
 gold.ir/login?id=${userStore.userInfo?.referral_id}`
   navigator.share({
-    title: ' گلد',
+    title: nameProject,
     text: val
   })
   // message.info('کد رونوشت شد')

src/views/base/fund/newFund/index.vue

@@ -40,7 +40,7 @@
           <div v-for="item in types"
                class="border-1 px-3 py-2 flex-nowrap rounded text-xs color-transition background-color-transition"
                :key="item.name"
-               :class="item.name === name? 'bg-[#0A1B37] text-white':'bg-gray-200 text-gray-600'"
+               :class="item.name === name? 'bg-primary text-white':'bg-gray-200 text-gray-600'"
                @click="name = item.name">
             {{ item.name }}
           </div>

src/views/base/gold/index.vue

@@ -46,14 +46,14 @@
           <bg_main />
           <div class="z-100 relative">
             <a-form-item>
-              <BasicInput v-model:value="form.goldCash" addon-before="ریال" addon-bg-color="#0A1B37"
+              <BasicInput v-model:value="form.goldCash" addon-before="ریال" :addon-bg-color="useConfigStore().config.color"
                           addon-text-color="white"
                           place-holder="ارزش کل"
                           size="large"
                           type="price" @onchange="calculateGold" />
             </a-form-item>
             <a-form-item :rules="[justNumber()]">
-              <BasicInput v-model:value="form.goldValue" addon-before="گرم" addon-bg-color="#0A1B37"
+              <BasicInput v-model:value="form.goldValue" addon-before="گرم" :addon-bg-color="useConfigStore().config.color"
                           addon-text-color="white"
                           place-holder="مقدار طلا"
                           size="large" type="text" inputmode="decimal" @onchange="calculateCash" />
@@ -234,6 +234,7 @@ import { getTransactionTable } from '@/api/transaction'
 import { getLastPrices, getUpPrice, lastPrice, setIntervalGetAllPrice, stopPriceInterval } from '@/utils/price'
 import type { Product } from '@/models/products'
 import { useFundUserStore } from '@/store/fundStore'
+import {useConfigStore} from "@/store/configStore";
 // import Bg_main from "@/components/bg_main.vue";
 
 const infoVisible = ref(false)
@@ -615,7 +616,7 @@ async function ok() {
   background: blue;
 }*/
 .completeButtonStyle .van-dialog__confirm .van-button__content {
-  background: #0A1B37;
+  background: @App-primary-color;
   color: white;
 }
 

src/views/base/home/index-old.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="">
     <!--    <div class="bg-primary h-30 mt-[-3rem] z-100000000000"></div>-->
-    <div class="fixed h-[60vh] bg-[#0A1B37] w-screen">
+    <div class="fixed h-[60vh] bg-primary w-screen">
       <div class="flex w-full justify-around mt-18">
         <div class="text-center">
           <div class="text-[#E5D7CE] text-xs ">موجودی کیف طلا</div>

src/views/base/home/index.vue

@@ -108,12 +108,12 @@
               <div class="flex mt-2 justify-center text-tertiary w-full z-20">
                 دارایی طلایی:
                 <div class="text-l mr-2 font-bold">{{ (userStore?.userInfo?.wallet?.count_gold ?? 0).toFixed(3)}}گرم</div>
-                <BasicIcon @click="openGoldModal" icon="vuesax-linear:info-circle" size="18" color="orange" />
+                <BasicIcon @click="openGoldModal" icon="vuesax-linear:info-circle" size="18" color="tertiary" />
               </div>
               <div class="flex mt-2 justify-center text-tertiary w-full z-20">
                 دارایی ریالی:
                 <div class="text-l mr-2 font-bold">{{ usePriceWithoutType(userStore?.userInfo?.wallet?.count_cash ?? 0) }}ریال</div>
-                <BasicIcon @click="openRialModal" icon="vuesax-linear:info-circle" size="18" color="orange" />
+                <BasicIcon @click="openRialModal" icon="vuesax-linear:info-circle" size="18" color="tertiary" />
               </div>
             </div>
             <!--              <div class="flex  justify-center mt-2 w-full z-20">
@@ -189,7 +189,7 @@
         >
 
           <div class="w-full items-center flex flex-col">
-            <div class="text-gray-600">قیمت خرید از گلد دات آی آر</div>
+            <div class="text-gray-600">قیمت خرید از {{ useConfigStore().config.name_fa }}</div>
             <div v-if="price" class="flex gap-1 mt-3 text-xs items-center">
               <!--              <div id="odometer" class="font-bold text-2xl odometer animated fadeIn">
                               &lt;!&ndash;                {{ usePriceWithoutType(useCounterAnim(price.price_last) ?? 0) }}&ndash;&gt;
@@ -214,7 +214,7 @@
             </div>
           </div>
         </div>
-        <div class="flex mt-5 gap-1 bg-primary text-[#CEA34C] font-bold justify-center rounded-lg py-5"
+        <div class="flex mt-5 gap-1 bg-primary text-tertiary font-bold justify-center rounded-lg py-5"
              @click="router.push({ name: 'buyProduct', query: { cat: 'coin'} })">
           <div>خرید و فروش</div>
         </div>
@@ -462,6 +462,7 @@ import { useFundUserStore } from '@/store/fundStore'
 import {Modal} from "ant-design-vue";
 import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
 import {message} from "ant-design-vue/es";
+import {useConfigStore} from "@/store/configStore";
 
 const userStore = useUserStore()
 const walletStore = useWalletStore()
@@ -480,7 +481,7 @@ const tableOutput = ref<TableOutput<Fund> | null>(null)
 const inventory = ref<number>(0)
 const sumGold = ref<number>(0)
 const fundStore = useFundUserStore()
-
+const config=useConfigStore()
 async function initTable() {
   try {
     loading.value = true
@@ -669,7 +670,7 @@ const priceChartOptions = ref({
       show: false
     }
   },
-  colors: ['#0A1B37'],
+  colors: [config.config.color],
   fill: {
     type: 'gradient',
     gradient: {

src/views/base/home/indexgolak.vue

@@ -451,6 +451,7 @@ import { getActivatedCards } from '@/api/wallet'
 import banner1 from '@/assets/img/banner/banner1.png'
 import banner2 from '@/assets/img/banner/banner2.png'
 import BasicButton from '@/components/BasicPacks/BasicButton.vue'
+import {useConfigStore} from "@/store/configStore";
 
 const userStore = useUserStore()
 const walletStore = useWalletStore()
@@ -620,7 +621,7 @@ const priceChartOptions = ref({
       show: false
     }
   },
-  colors: ['#0A1B37'],
+  colors: [useConfigStore().config.color],
   fill: {
     type: 'gradient',
     gradient: {

src/views/base/index.vue

@@ -221,7 +221,7 @@ function setRoute(val: string) {
         justify-content: center;
         align-content: center;
         flex-wrap: wrap;
-        background-color: #0A1B37;
+        background-color: @App-primary-color;
 
 
 

src/views/base/products/components/DealProduct.vue

@@ -4,12 +4,12 @@
       <!--      <div @click="isBuy = false" class="w-full text-center" :class="!isBuy?'text-primary':'text-gray-400'">خرید طلا</div>
             <div @click="isBuy = true" class="w-full text-center" :class="isBuy?'text-primary':'text-gray-400'">فروش طلا</div>-->
       <div class="flex justify-evenly w-full px-2 h-11 items-center bg-gray-50 relative rounded ">
-        <div :class="isBuy?'text-secondary':'text-gray-400'" class="w-full text-center z-2"
+        <div :class="isBuy?'text-tertiary':'text-gray-400'" class="w-full text-center z-2"
              @click.stop="setIsBuy(true) "
              :style="!props?.ProductItem?.open_buy ? 'pointer-events: none; opacity: 0.5;' : ''">
           خرید {{ props?.ProductItem?.title }}
         </div>
-        <div :class="!isBuy?'text-secondary':'text-gray-400'" class="w-full text-center z-2"
+        <div :class="!isBuy?'text-tertiary':'text-gray-400'" class="w-full text-center z-2"
              @click.stop="setIsBuy(false) "
              :style="!props?.ProductItem?.open_sell ? 'pointer-events: none; opacity: 0.5;' : ''"
         >
@@ -682,7 +682,7 @@ async function ok() {
   background: blue;
 }*/
 .completeButtonStyle .van-dialog__confirm .van-button__content {
-  background: #0A1B37;
+  background: @App-primary-color;
   color: white;
 }
 
@@ -715,7 +715,7 @@ async function ok() {
   right: 100%;
   transform: translate(100%, 0);
 }
-.text-secondary{
-  color: #d3a233 !important;
-}
+//.text-secondary{
+//  color: #d3a233 !important;
+//}
 </style>

src/views/base/rules/index.vue

@@ -20,7 +20,7 @@
               class="mt-5 text-5 border-solid border-2 border-primary text-primary rounded-[12px] p-4"
             >
               <div class="font-bold text-sm text-primary">
-                قوانین و مقررات معاملات طلا در بستر گلد دات آی آر
+                قوانین و مقررات معاملات طلا در بستر {{  nameProject }}
               </div>
               <div class="w-full h-1px my-3 bg-secondary"></div>
               <div class="mt-5 text-xs leading-5">
@@ -28,23 +28,23 @@
                 صورت پذیرش آن اقدام به ثبت‌نام نمایند.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • کاربران گلد دات آی آر می‌پذیرند که کلیه‌ی فعالیت‌های آن‌ها در گلد دات آی آر، در چارچوب قوانین
+                • کاربران {{  nameProject }} می‌پذیرند که کلیه‌ی فعالیت‌های آن‌ها در {{ nameProject }}، در چارچوب قوانین
                 جمهوری اسلامی ایران بوده و هیچ گونه فعالیتی خارج از این چارچوب انجام نخواهد شد.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • احراز هویت برای استفاده از خدمات گلد دات آی آر ضروری بوده و کاربران موظفند اطلاعات صحیح
+                • احراز هویت برای استفاده از خدمات {{  nameProject }} ضروری بوده و کاربران موظفند اطلاعات صحیح
                 خود را بارگذاری نمایند؛ بدیهی است در صورت وجود هرگونه تخلف در احراز هویت، مسئولیت به
-                عهده‌ی فرد متخلف بوده و گلد دات آی آر حق توقف ارائه خدمات به کاربر مذکور و ارجاع موارد
+                عهده‌ی فرد متخلف بوده و {{  nameProject }} حق توقف ارائه خدمات به کاربر مذکور و ارجاع موارد
                 تخلف به مراجع ذی‌صلاح را خواهد داشت.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • گلد دات آی آر خود را ملزم به حفظ اطلاعات شخصی کاربران در چارچوب قوانین قضایی کشور
+                • {{  nameProject }}خود را ملزم به حفظ اطلاعات شخصی کاربران در چارچوب قوانین قضایی کشور
                 می‌داند.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • کاربران گلد دات آی آر تعهد می‌دهند که از قرار دادن حساب خود در اختیار دیگران خودداری
+                • کاربران {{  nameProject }}  تعهد می‌دهند که از قرار دادن حساب خود در اختیار دیگران خودداری
                 نمایند. از خدمات سایت، تنها برای حساب شخصی خود استفاده نموده و مسئولیت استفاده از
-                خدمات گلد دات آی آر برای فردی دیگر، به عهده کاربر خواهد بود. شماره حساب اعلام شده به سایت
+                خدمات {{  nameProject }} برای فردی دیگر، به عهده کاربر خواهد بود. شماره حساب اعلام شده به سایت
                 باید متعلق به کاربر بوده و کاربران مجاز به دادن شماره حساب متعلق به اشخاص دیگر
                 نیستند.
               </div>
@@ -55,7 +55,7 @@
               <div class="mt-5 text-xs leading-5">
                 • هرگونه سهل‌انگاری کاربران در حفظ اطلاعات شخصی و امنیتی از جمله: رمز عبور کاربر،
                 سرقت گوشی کاربر، سرقت کارت ملی و مدارک شناسایی کاربر، سپردن مدارک شخصی و موبایل به
-                فرد ثالث و ... به عهده‌ی شخص کاربر بوده و گلد دات آی آر هیچ گونه مسئولیتی در این موارد
+                فرد ثالث و ... به عهده‌ی شخص کاربر بوده و {{ nameProject }} هیچ گونه مسئولیتی در این موارد
                 نخواهد داشت.
               </div>
               <div class="mt-5 text-xs leading-5">
@@ -63,45 +63,45 @@
                 شود.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • گلد دات آی آر این اطمینان را می‌دهد که دارایی‌های کاربران را نزد خود به امانت و به
+                • {{  nameProject }} این اطمینان را می‌دهد که دارایی‌های کاربران را نزد خود به امانت و به
                 بهترین شکل و با بالاترین استانداردهای امنیتی ممکن حفظ نماید؛ در صورت بروز هرگونه
-                مشکل امنیتی، گلد دات آی آر متعهد به جبران خسارت خواهد بود.
+                مشکل امنیتی، {{ nameProject }} متعهد به جبران خسارت خواهد بود.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • به عنوان پلتفرم معاملات برخط فلزات گران‌بها، هیچ‌گونه مسئولیتی در قبال تصمیمات
-                اقتصادی فی مابین کاربران و سود و زیان حاصل از آن بر عهده گلد دات آی آر نمی‌باشد.
+                اقتصادی فی مابین کاربران و سود و زیان حاصل از آن بر عهده {{ nameProject }} نمی‌باشد.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • گلد دات آی آر حق اصلاح و تغییر قوانین و مقررات ذکر شده در این صفحه را چه به صورت کلی و
+                • {{  nameProject }} حق اصلاح و تغییر قوانین و مقررات ذکر شده در این صفحه را چه به صورت کلی و
                 چه به صورت جزئی دارد و نسخه نهایی را در این صفحه در معرض دید قرار می‌دهد. استفاده از
-                خدمات گلد دات آی آر پس از اعمال تغییرات، به معنای پذیرش همه تغییرات می‌باشد.
+                خدمات {{  nameProject }} پس از اعمال تغییرات، به معنای پذیرش همه تغییرات می‌باشد.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • از لحظه خرید کاربران تا زمان تحویل طلای خریداری شده، مسئولیت حفظ و نگهداری اصل طلا
-                بر عهده گلد دات آی آر می‌باشد.
+                بر عهده {{  nameProject }} می‌باشد.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • کاربران گلد دات آی آر اذعان می‌دارند که از ریسک‌های اقتصادی مربوط به سرمایه‌گذاری در
+                • کاربران {{  nameProject }} اذعان می‌دارند که از ریسک‌های اقتصادی مربوط به سرمایه‌گذاری در
                 حوزه طلا مطلع بوده و با علم بر این موضوع اقدام به تبادل و سرمایه‌گذاری می‌کنند.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • گلد دات آی آر متعهد می‌شود در حد توان از حریم شخصی شما محافظت کند و در این راستا،
+                • {{  nameProject }} متعهد می‌شود در حد توان از حریم شخصی شما محافظت کند و در این راستا،
                 تکنولوژی مورد نیاز در سایت و پلتفرم را برای هر چه مطمئن‌تر و امن‌تر شدن استفاده شما،
                 توسعه دهد.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • در صورت بروز نوسان شدید در قیمت طلا و هرگونه رویداد برهم‌زننده نظم حاکم بر بازار
-                طلا، گلد دات آی آر می‌تواند برای خرید و فروش طلا توسط کاربر سقف تعیین کند تا دو طرف متضرر
+                طلا، {{  nameProject }} می‌تواند برای خرید و فروش طلا توسط کاربر سقف تعیین کند تا دو طرف متضرر
                 نشوند.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • گلد دات آی آر مجاز است بدون اطلاع قبلی و به صلاح‌دید شخصی نسبت به توقف سفارش‌گیری جدید،
+                • {{ nameProject }} مجاز است بدون اطلاع قبلی و به صلاح‌دید شخصی نسبت به توقف سفارش‌گیری جدید،
                 معاملات (از جمله سفارش‌های باز) را متوقف کند؛ بدیهی است که کلیه سفارش‌های تکمیل‌شده
                 قبل از توقف سفارش‌گیری، پردازش و تحویل داده خواهد شد.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • در صورت بروز هرگونه اختلال در اینترنت و خدمات زیرساخت به دلایل حاکمیتی، هیچ‌گونه
-                مسئولیتی به عهده گلد دات آی آر نمی‌باشد.
+                مسئولیتی به عهده {{ nameProject }} نمی‌باشد.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • درخواست برداشت ریال از حساب کاربری در سریع‌ترین زمان ممکن پس از ثبت، بررسی خواهد
@@ -115,35 +115,35 @@
               </div>
               <div class="mt-5 text-xs leading-5">
                 • اگر کاربر تحت هر عنوان اشتباهاً یا من غیر حق، وجوهی را به حساب کاربر منظور یا در
-                محاسبات خود هر نوع اشتباهی نماید، گلد دات آی آر هر زمان مجاز و مختار است راساً و مستقلاً و
+                محاسبات خود هر نوع اشتباهی نماید، {{ nameProject }} هر زمان مجاز و مختار است راساً و مستقلاً و
                 بدون انجام هیچ‌گونه تشریفات اداری و قضایی و دریافت اجازه کتبی از متعهد (صاحب حساب)
                 در رفع اشتباه و برداشت از حساب‌های وی اقدام نماید و تشخیص نسبت به وقوع اشتباه یا
                 پرداخت بدون حق و لزوم برداشت از حساب معتبر خواهد بود و کاربر حق هرگونه اعتراض و
-                ادعایی را در خصوص نحوه عملکرد گلد دات آی آر از هر جهت از خود ساقط می‌نماید.
+                ادعایی را در خصوص نحوه عملکرد {{ nameProject }} از هر جهت از خود ساقط می‌نماید.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • در صورت بروز هرگونه مشکل یا ابهام در هر یک از معاملات (مانند دستکاری قیمت، اختلال
-                در وب‌سرویس‌ها، انجام معامله خارج از دامنه نوسان و ...)، گلد دات آی آر حق دارد مستقلاً آن
+                در وب‌سرویس‌ها، انجام معامله خارج از دامنه نوسان و ...)، {{ nameProject }} حق دارد مستقلاً آن
                 معامله را ابطال کرده و دارایی‌های هر یک از طرفین را به حساب خودشان عودت دهد. بدیهی
-                است در صورتی که اشکال از سمت گلد دات آی آر  باشد، شرکت موظف خواهد بود که جبران خسارت نماید
+                است در صورتی که اشکال از سمت {{ nameProject }}  باشد، شرکت موظف خواهد بود که جبران خسارت نماید
                 و در غیر این صورت، کاربر حق هرگونه اعتراض و ادعایی در خصوص نحوه عملکرد از هر جهت را
                 از خود ساقط می‌نماید.
               </div>
               <div class="mt-5 text-xs leading-5">
-                • در صورت فوت یا حجر کاربر، گلد دات آی آر پیرو قوانین جمهوری اسلامی ایران می‌باشد. کاربر
-                با علم و اطلاع از مقررات این بند نسبت به افتتاح حساب کاربری در گلد دات آی آر  اقدام نموده و
+                • در صورت فوت یا حجر کاربر، {{ nameProject }} پیرو قوانین جمهوری اسلامی ایران می‌باشد. کاربر
+                با علم و اطلاع از مقررات این بند نسبت به افتتاح حساب کاربری در {{ nameProject }}  اقدام نموده و
                 کاربر، اشخاص ثالث، ورثه یا قائم‌مقام قانونی ایشان حق اعتراض و یا ادعایی در آینده در
                 این خصوص نخواهند داشت.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • هزینه خدمات و کارمزد تراکنش‌های مالی انجام شده در مطابق با توضیحات ارائه شده در
-                صفحه راهنمای استفاده از گلد دات آی آر گلد می‌باشد.
+                صفحه راهنمای استفاده از {{ nameProject }} می‌باشد.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • تمامی علائم تجاری، طرح‌های گرافیکی، رابط کاربری، رابط بصری، عکس، لوگو، کدهای
-                نرم‌افزار، ساختار، نحوه بیان، تنظیم مطالب و محتوای موجود در گلد دات آی آر و شبکه‌های متعلق
-                به گلد دات آی آر و به‌طور کلی، سایر حقوق و امتیازات مربوطه منحصراً در مالکیت گلد دات آی آر
-                می‌باشد و هیچ شخصی حق استفاده از آن را بدون رضایت گلد دات آی آر ندارد.
+                نرم‌افزار، ساختار، نحوه بیان، تنظیم مطالب و محتوای موجود در {{ nameProject }} و شبکه‌های متعلق
+                به {{ nameProject }} و به‌طور کلی، سایر حقوق و امتیازات مربوطه منحصراً در مالکیت {{ nameProject }}
+                می‌باشد و هیچ شخصی حق استفاده از آن را بدون رضایت {{ nameProject }} ندارد.
               </div>
               <div class="mt-5 text-xs leading-5">
                 • اگر هر یک از مفاد این موافقت‌نامه بر اساس هر قانون لازم‌الاجرا، نامعتبر یا غیرقابل
@@ -188,6 +188,7 @@ import { message } from 'ant-design-vue'
 import { updateMe } from '@/api/me'
 import { useUserStore } from '@/store/userStore'
 import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
+import {useConfigStore} from "../../../store/configStore";
 
 const userFormState = ref<User>({
   fname: '',
@@ -201,7 +202,7 @@ const userFormState = ref<User>({
 })
 const formRef = ref<FormInstance>()
 const userStore = useUserStore()
-
+const nameProject= useConfigStore().config.name_fa
 // const editPassVisible = ref<boolean>(false)
 const editPassVisible = ref<boolean>(false)
 
@@ -222,12 +223,12 @@ function shareCode() {
   const val = `⭐️الان طلا بخر؛ آخر ماه سودشو ببر!
 با خرید طلای آبشده در مقدارهای کم ولی مستمر، سود بیشتری ببر!
 
-این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای  گلد داتت آی آر جا نمونید.
+این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای   ${nameProject}   جا نمونید.
 روی لینک زیر کلیک کنید و ثبت نام خود را تکمیل کنید.
 
 gold.ir/login?id=${userStore.userInfo?.referral_id}`
   navigator.share({
-    title: ' گلد',
+    title:  nameProject ,
     text: val
   })
   // message.info('کد رونوشت شد')

src/views/base/rules/permissions/permissions.vue

@@ -51,6 +51,7 @@ import { message } from 'ant-design-vue'
 import { updateMe } from '@/api/me'
 import { useUserStore } from '@/store/userStore'
 import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
+import {useConfigStore} from "@/store/configStore";
 
 const userFormState = ref<User>({
   fname: '',
@@ -64,6 +65,7 @@ const userFormState = ref<User>({
 })
 const formRef = ref<FormInstance>()
 const userStore = useUserStore()
+const nameProject= useConfigStore().config.name_fa
 
 // const editPassVisible = ref<boolean>(false)
 const editPassVisible = ref<boolean>(false)
@@ -85,12 +87,12 @@ function shareCode() {
   const val = `⭐️الان طلا بخر؛ آخر ماه سودشو ببر!
 با خرید طلای آبشده در مقدارهای کم ولی مستمر، سود بیشتری ببر!
 
-این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای  گلد جا نمونید.
+این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای  ${nameProject} جا نمونید.
 روی لینک زیر کلیک کنید و ثبت نام خود را تکمیل کنید.
 
 gold.ir/login?id=${userStore.userInfo?.referral_id}`
   navigator.share({
-    title: ' گلد',
+    title: nameProject,
     text: val
   })
   // message.info('کد رونوشت شد')

src/views/base/user/index.vue

@@ -277,6 +277,7 @@ import { message } from 'ant-design-vue'
 import { updateMe, updatePass } from '@/api/me'
 import { useUserStore } from '@/store/userStore'
 import BaseDatePicker from '@/components/BasicPacks/BaseDatePicker'
+import {useConfigStore} from "@/store/configStore";
 const userFormState = ref<User>({
   fname: '',
   lname: '',
@@ -291,6 +292,7 @@ const userPassForm = ref<Password>({
 const formRef = ref<FormInstance>()
 const formPassRef = ref<FormInstance>()
 const userStore = useUserStore()
+const nameProject= useConfigStore().config.name_fa
 
 // const editPassVisible = ref<boolean>(false)
 const editPassVisible = ref<boolean>(false)
@@ -340,12 +342,12 @@ function shareCode() {
   const val = `⭐️الان طلا بخر؛ آخر ماه سودشو ببر!
 با خرید طلای آبشده در مقدارهای کم ولی مستمر، سود بیشتری ببر!
 
-این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای  گلد دات آی آر جا نمونید.
+این دعوت نامه از طرف "${userStore.userInfo?.name}" عزیز برای شما ارسال شده تا شما هم از بازار طلای  ${nameProject} جا نمونید.
 روی لینک زیر کلیک کنید و ثبت نام خود را تکمیل کنید.
 
 gold.ir/login?id=${userStore.userInfo?.referral_id}`
   navigator.share({
-    title: ' گلد دات آی آر',
+    title: nameProject,
     text: val
   })
   // message.info('کد رونوشت شد')

src/views/base/wallet/index.vue

@@ -37,7 +37,7 @@
               <BasicInput
                 v-model:value="form.value"
                 addon-before="ریال"
-                addon-bg-color="#0A1B37"
+                :addon-bg-color="useConfigStore().config.color"
                 addon-text-color="white"
                 place-holder="مبلغ"
                 size="large"
@@ -345,6 +345,7 @@ import SkeletonLoading from './components/SkeletonLoading.vue'
 import BaseDatePicker from "@/components/BasicPacks/BaseDatePicker";
 import img from "@/assets/img/user_ly1.svg";
 import BasicModal from "@/components/BasicPacks/BasicModal.vue";
+import {useConfigStore} from "@/store/configStore";
 const isDeposit = ref<boolean>(true)
 const walletStore = useWalletStore()
 const userStore = useUserStore()

src/views/login/components/Login.vue

@@ -118,7 +118,7 @@
           </div>
         </BasicButton>
         <div class="flex gap-1 justify-center mt-5 text-xs" @click="$emit('register',true)">اگر حساب کاربری ندارید
-          <div class="font-bold text-[#0A1B37]">از این قسمت</div>
+          <div class="font-bold text-primary">از این قسمت</div>
           ثبت نام کنید.
         </div>
       </a-form-item>

src/views/login/components/Register.vue

@@ -39,7 +39,7 @@
           </div>
         </BasicButton>
         <div class="flex gap-1 justify-center mt-5 text-xs" @click="$emit('register',false)">اگر حساب کاربری دارید
-          <div class="font-bold text-[#0A1B37]">از این قسمت</div>
+          <div class="font-bold text-primary">از این قسمت</div>
           وارد شوید.
         </div>
       </a-form-item>

src/vite-env.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="vite/client" />
+
+declare global {
+  interface Window {
+    __APP_CONFIG__?: Record<string, any>;
+  }
+}
+
+export {};