diff --git a/src/App.vue b/src/App.vue index 5778bc0..92704c8 100644 --- a/src/App.vue +++ b/src/App.vue @@ -90,16 +90,15 @@ class="draggable-support-button" :class="{ 'is-dragging': supportDragging }" :style="supportButtonStyle" + title="پشتیبانی" @pointerdown="onSupportPointerDown" @pointermove="onSupportPointerMove" @pointerup="handleSupportPointerUp" @pointercancel="onSupportPointerCancel" > -
- پشتیبانی -
- -
+
+ + پشتیبانی
@@ -168,6 +167,40 @@ const supportLink = computed(() => { const showSupportButton = computed(() => !!supportLink.value) +const supportIcon = computed(() => { + const messenger = (supportMessengerSettings.value.messenger ?? '').toLowerCase() + switch (messenger) { + case 'whatsapp': + return 'vuesax-linear:whatsapp' + case 'telegram': + return 'vuesax-linear:send-2' + case 'bale': + return 'vuesax-linear:messages-2' + default: + return 'vuesax-linear:messages-2' + } +}) + +const supportAccentColor = computed(() => { + const messenger = (supportMessengerSettings.value.messenger ?? '').toLowerCase() + switch (messenger) { + case 'whatsapp': + return '#22c55e' + case 'telegram': + return '#0ea5e9' + case 'bale': + return '#16a34a' + case 'rubika': + return '#7c3aed' + case 'eitaa': + return '#f59e0b' + case 'soroush': + return '#2563eb' + default: + return config.config?.color || '#334155' + } +}) + const { dragging: supportDragging, fabStyle: supportButtonStyle, @@ -176,8 +209,8 @@ const { handlePointerUp: supportPointerUp, handlePointerCancel: onSupportPointerCancel } = useDraggableFloatingButton('khaneghi_support_button_position', { - width: 110, - height: 44, + width: 118, + height: 42, defaultBottomOffset: 120 }) @@ -292,19 +325,48 @@ function update() { z-index: 9999; cursor: grab; user-select: none; - box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); - border-radius: 0.5rem; + border-radius: 9999px; &.is-dragging { cursor: grabbing; - box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22); + } +} + +.support-button-inner { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 9px 14px 9px 12px; + background: #ffffff; + border: 1px solid rgba(15, 23, 42, 0.08); + border-radius: 9999px; + box-shadow: 0 6px 20px rgba(15, 23, 42, 0.14); + color: #1e293b; + font-size: 13px; + font-weight: 600; + line-height: 1; + direction: rtl; + transition: box-shadow 0.2s ease, transform 0.2s ease; + + .support-button-icon { + color: var(--support-accent, #334155); + flex-shrink: 0; } - img { - pointer-events: none; + .support-button-label { + white-space: nowrap; } } +#support-button:not(.is-dragging):hover .support-button-inner { + transform: translateY(-1px); + box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18); +} + +#support-button.is-dragging .support-button-inner { + box-shadow: 0 10px 28px rgba(15, 23, 42, 0.22); +} + @media screen and (min-width: 426px) { .desktopConfig { width: 426px; diff --git a/src/views/base/wallet/index.vue b/src/views/base/wallet/index.vue index f583afe..12f234c 100644 --- a/src/views/base/wallet/index.vue +++ b/src/views/base/wallet/index.vue @@ -295,75 +295,95 @@ v-model:visible="chargeAccountModal" custom-footer :closable="false" + wrap-class-name="wallet-info-modal" > -
-
مشتریان گرامی
-
- جهت شارژ حساب کاربری خود، مبلغ موردنظر را به شماره کارت زیر واریز نموده و از طریق لینک زیر به پشتیبان اطلاع دهید. +
+
+
-
در صورت عدم همخوانی کارت ملی و فیش واریزی کیف پول شارژ نمیشود!
-
(سیده زهرا موسوی)
-
شماره کارت:6037701900311389
- -
شماره شبا: IR 080160000000001143804581
- - +
+

راهنمای شارژ حساب

+

+ جهت شارژ حساب کاربری خود، مبلغ موردنظر را به شماره کارت زیر واریز نموده و از طریق لینک زیر به پشتیبان اطلاع دهید. +

+

+ در صورت عدم همخوانی کارت ملی و فیش واریزی کیف پول شارژ نمی‌شود. +

+
+
(سیده زهرا موسوی)
+
شماره کارت: 6037701900311389
+
شماره شبا: IR 080160000000001143804581
+
+ + پیام به پشتیبانی - -
-
-
همراه گرامی
-
-
جهت شارژ حساب کاربری خود،
-
مبلغ موردنظر را به شماره کارت زیر واریز نموده
-
و به شماره پشتیبانی 09121784258 در برنامه ی بله اطلاع دهید.
-
-
(گنجينه طلاي حاجي ابوالفتح - بانک ملی)
-
شماره کارت: 6037998800496928
-
شماره شبا: IR 110170000000372468150002
-
-
-
مشتریان گرامی
-
- {{ supportMessengerText }}
- +
+

راهنمای شارژ حساب

+

+ جهت شارژ حساب کاربری خود، مبلغ موردنظر را به شماره کارت زیر واریز نموده و به شماره پشتیبانی + 09121784258 + در برنامه بله اطلاع دهید. +

+
+
(گنجینه طلای حاجی ابوالفتح - بانک ملی)
+
شماره کارت: 6037998800496928
+
شماره شبا: IR 110170000000372468150002
+
+
+ +
+

راهنمای شارژ حساب

+

{{ supportMessengerText }}

+ پیام به پشتیبانی - +
-
-
مشتری گرامی
-
-
واریز مبلغ مورد نظر، نهایتاً ظرف مدت ۲۴ ساعت آینده انجام می‌پذیرد.
+
+
+ +
+
+

زمان واریز برداشت

+

+ واریز مبلغ مورد نظر، نهایتاً ظرف مدت ۲۴ ساعت آینده انجام می‌پذیرد. +

@@ -766,4 +786,112 @@ async function handleOnComplete(value: string) { margin: 0 auto; } } + +.wallet-info-modal__body { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + padding: 4px 8px 8px; +} + +.wallet-info-modal__icon { + display: flex; + align-items: center; + justify-content: center; + width: 56px; + height: 56px; + border-radius: 9999px; + background: #ecfdf5; + color: #059669; + margin-bottom: 14px; +} + +.wallet-info-modal__icon--info { + background: #eff6ff; + color: #2563eb; +} + +.wallet-info-modal__title { + margin: 0 0 10px; + font-size: 17px; + font-weight: 700; + color: #0f172a; + line-height: 1.5; +} + +.wallet-info-modal__text { + margin: 0; + font-size: 14px; + line-height: 1.85; + color: #475569; +} + +.wallet-info-modal__warn { + margin: 12px 0 0; + padding: 10px 12px; + border-radius: 10px; + background: #fef2f2; + color: #b91c1c; + font-size: 13px; + line-height: 1.7; +} + +.wallet-info-modal__card-box { + margin-top: 14px; + width: 100%; + padding: 12px 14px; + border-radius: 12px; + background: #f8fafc; + border: 1px solid #e2e8f0; + color: #334155; + font-size: 13px; + line-height: 1.8; + text-align: right; + direction: rtl; +} + +.wallet-info-modal__action { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 8px; + width: 100%; + margin-top: 16px; + padding: 11px 14px; + border-radius: 12px; + font-size: 14px; + font-weight: 600; + text-decoration: none; + transition: background-color 0.2s ease, border-color 0.2s ease; +} + +.wallet-info-modal__action--outline { + color: #0f766e; + background: #f0fdfa; + border: 1px solid #99f6e4; +} + +.wallet-info-modal__action--outline:hover { + background: #ccfbf1; + border-color: #5eead4; +} + +.wallet-info-modal__ok { + height: 44px !important; + border-radius: 12px !important; + font-weight: 600; +} + + +