feat: enhance support page with dynamic branding information and contact details

src/app/domains/pos/modules/about/views/root.component.html

@@ -2,9 +2,9 @@
   <section class="mx-auto max-w-3xl overflow-hidden rounded-2xl border border-surface-200 bg-white">
     <div class="bg-gradient-to-l from-emerald-50 via-teal-50 to-cyan-50 p-5 md:p-7">
       <p class="mb-2 inline-flex items-center rounded-full bg-white px-3 py-1 text-xs font-semibold text-emerald-700">
-        {{ brandingInfo.appTitle }}
+        {{ brandingInfo.title }}
       </p>
-      <span class="block mb-4 text-xl font-bold text-surface-900 md:text-3xl">درباره نسخه تیس</span>
+      <span class="block mb-4 text-xl font-bold text-surface-900 md:text-3xl">{{ brandingInfo.fullTitle }}</span>
       <p class="mt-3 max-w-2xl text-sm leading-7 text-surface-700 md:text-base">
         این نسخه برای استفاده روزانه روی دستگاه های PSP بهینه شده است تا عملیات ثبت و صدور صورتحساب‌‌های مالیاتی با سرعت
         بالاتر، پایداری بیشتر و تجربه کاربری ساده تر انجام شود.
@@ -40,7 +40,13 @@
           نسخه برنامه:
           <span class="font-semibold text-surface-900">{{ appVersion() }}</span>
         </div>
-        <button pButton type="button" [outlined]="!hasUpdate()" [disabled]="isCheckingUpdate()" (click)="onUpdateCtaClick()">
+        <button
+          pButton
+          type="button"
+          [outlined]="!hasUpdate()"
+          [disabled]="isCheckingUpdate()"
+          (click)="onUpdateCtaClick()"
+        >
           {{ updateCtaLabel() }}
         </button>
       </div>

src/app/domains/pos/modules/support/views/root.component.html

@@ -1,34 +1,36 @@
 <div class="w-full min-h-[60svh] p-4 md:p-6">
   <section class="mx-auto max-w-3xl overflow-hidden rounded-2xl border border-surface-200 bg-white">
     <div class="bg-gradient-to-l from-sky-50 via-cyan-50 to-teal-50 p-5 md:p-7">
-      <h1 class="text-2xl font-bold text-surface-900 md:text-3xl">پشتیبانی تیس</h1>
+      <span class="block mb-4 text-xl font-bold text-surface-900 md:text-3xl">پشتیبانی {{ brandingInfo.title }}</span>
       <p class="mt-3 max-w-2xl text-sm leading-7 text-surface-700 md:text-base">
         در صورت بروز مشکل در ثبت سفارش، صدور صورتحساب یا تنظیمات دستگاه، تیم پشتیبانی آماده پاسخگویی است. لطفا هنگام
-        تماس، نام پایانه و شماره سریال دستگاه را همراه داشته باشید.
+        تماس، نام پایانه و نام کاربری را همراه داشته باشید.
       </p>
     </div>
 
     <div class="grid gap-3 p-4 md:grid-cols-2 md:gap-4 md:p-6">
       <article class="rounded-xl border border-surface-200 bg-surface-50 p-4">
-        <h2 class="mb-3 text-sm font-bold text-surface-900">شماره های تماس مستقیم</h2>
-        <ul class="space-y-2 text-sm text-surface-700">
-          <li class="flex items-center justify-between gap-2">
-            <span>واحد پشتیبانی 1</span>
-            <a class="font-semibold text-primary" href="tel:02191012345" dir="ltr">021-91012345</a>
-          </li>
-          <li class="flex items-center justify-between gap-2">
-            <span>واحد پشتیبانی 2</span>
-            <a class="font-semibold text-primary" href="tel:02191012346" dir="ltr">021-91012346</a>
-          </li>
-          <li class="flex items-center justify-between gap-2">
-            <span>پاسخگویی اضطراری</span>
-            <a class="font-semibold text-primary" href="tel:09121234567" dir="ltr">0912-123-4567</a>
-          </li>
-        </ul>
+        <span class="block mb-4 text-xl font-bold text-surface-900">شماره های تماس مستقیم</span>
+        @if (brandingInfo!.support.phones?.length) {
+          <ul class="space-y-2 text-sm text-surface-700">
+            @for (phone of brandingInfo.support.phones!; track $index) {
+              <li class="flex items-start justify-between gap-2">
+                <span>{{ phone.title }}</span>
+                <div class="flex flex-col gap-2">
+                  @for (item of phone.phones; track $index) {
+                    <a class="font-semibold text-primary" href="tel:{{ item }}" dir="ltr">{{ item }}</a>
+                  }
+                </div>
+              </li>
+            }
+          </ul>
+        } @else {
+          <p class="text-sm text-surface-700">در حال حاضر شماره تماس مستقیمی برای پشتیبانی اعلام نشده است.</p>
+        }
       </article>
 
       <article class="rounded-xl border border-surface-200 bg-surface-50 p-4">
-        <h2 class="mb-3 text-sm font-bold text-surface-900">راهنمای سریع قبل از تماس</h2>
+        <span class="block mb-4 text-xl font-bold text-surface-900">راهنمای سریع قبل از تماس</span>
         <ul class="space-y-2 text-sm leading-6 text-surface-700">
           <li>اتصال اینترنت دستگاه را بررسی کنید.</li>
           <li>یک بار برنامه را ببندید و دوباره اجرا کنید.</li>

src/app/domains/pos/modules/support/views/root.component.ts

@@ -1,7 +1,10 @@
+import { brandingConfig } from '@/branding/branding.config';
 import { Component } from '@angular/core';
 
 @Component({
   selector: 'pos-support-page',
   templateUrl: './root.component.html',
 })
-export class PosSupportPageComponent {}
+export class PosSupportPageComponent {
+  brandingInfo = brandingConfig;
+}