diff --git a/src/api/customer.ts b/src/api/customer.ts
index 5fa9ef4..950c740 100644
--- a/src/api/customer.ts
+++ b/src/api/customer.ts
@@ -14,6 +14,16 @@ export const updateCustomer = async (id: number, obj: Customer) =>
 export const getCustomerTable = async (params: TableInput) =>
   await useAxios.post<Array<Customer>>('/admin/customer/table', params)
 
+export const getOnlineCustomers = async () =>
+  await useAxios.get<{
+    count: number
+    online_within_seconds: number
+    rows: Customer[]
+  }>('/admin/customer/online')
+
+export const getCustomer = async (id: number) =>
+  await useAxios.get<Customer>(`/admin/customer/${id}`)
+
 export const getCustomerAssetsSummary = async (customerId: number) =>
   await useAxios.get<WalletAssetsSummary>(`/admin/customer/${customerId}/assets`)
 
diff --git a/src/assets/style.less b/src/assets/style.less
index c9459a6..d356d63 100644
--- a/src/assets/style.less
+++ b/src/assets/style.less
@@ -10,9 +10,25 @@
   opacity: 0;
 }
 
-.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab{
-  margin: 10px !important;
+/*
+  Do NOT set equal margin on .ant-tabs-tab in RTL — it desyncs the ink-bar
+  from the active tab (Ant measures tab boxes; asymmetric/all-side margins skew it).
+  Use gap on the nav-list instead for consistent spacing everywhere.
+*/
+.ant-tabs > .ant-tabs-nav .ant-tabs-nav-list,
+.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-list {
+  gap: 0.75rem;
 }
+
+.ant-tabs-rtl .ant-tabs-nav .ant-tabs-tab,
+.ant-tabs .ant-tabs-nav .ant-tabs-tab {
+  margin: 0 !important;
+}
+
+.ant-tabs .ant-tabs-nav .ant-tabs-tab {
+  padding: 0.5rem 0.75rem;
+}
+
 /*::-webkit-scrollbar-track {
   background-color: #f2f6ff !important;
 }
diff --git a/src/core/components/BaseTable/src/BaseTable.vue b/src/core/components/BaseTable/src/BaseTable.vue
index 5a0a64f..573274e 100644
--- a/src/core/components/BaseTable/src/BaseTable.vue
+++ b/src/core/components/BaseTable/src/BaseTable.vue
@@ -86,6 +86,7 @@
           :columns="_columns"
           :data-source="data"
           v-bind="_props"
+          :scroll="tableScroll"
           :pagination="false"
           @resizeColumn="handleResizeColumn"
         >
@@ -289,24 +290,9 @@ import {
   availableFilterType,
   MapFilterOpToFaString
 } from '@core/components/BaseTable/hooks/filterOperator'
-//import { mapColumnTypeFilterToFilterType } from '@core/type/baseTable'
-//import { useElementSize } from '@vueuse/core'
-//import { ContentLoader } from 'vue-content-loader'
-//skeleton
-//const skeletonWidth = ref(null)
-/*const skeletonWidthSize = reactive(
-  useElementSize(skeletonWidth, { width: 0, height: 0 }, { box: 'border-box' })
-)*/
-//const skeletonHeight = 357
-/*const skeletonHeight = ref(null)
-const skeletonHeightSize = reactive(
-  useElementSize(skeletonHeight, { width: 0, height: 0 }, { box: 'border-box' })
-)*/
-/*
-watch(skeletonHeightSize, (v) => {
-  console.log('ttt', v)
-})
-*/
+
+/** Wide enough for dense action icon rows (e.g. customers); too-narrow fixed cells bleed into neighbors. */
+const DEFAULT_ACTION_WIDTH = 280
 
 interface Props {
   bordered?: boolean
@@ -328,7 +314,7 @@ const props = withDefaults(defineProps<Props>(), {
   driver: 'laravel-sql',
   mode: 'pro',
   columns: () => [],
-  scroll: () => ({ x: true }), //y: '100%' //y: 600
+  scroll: () => ({ x: true }),
   pageSize: () => [5, 10, 20, 50, 100],
   defaultPageLimit: 10,
   showPaginate: true,
@@ -345,13 +331,30 @@ const filters = ref<Filter[]>([])
 const order = ref<'asc' | 'desc'>('asc')
 const orderColumnKey = ref<string | null>(null)
 const containerRef = ref()
-//const route = useRoute()
 const loading = ref<boolean>(false)
 const tableReady = ref(false)
 let callApiPromise: Promise<void> | null = null
 const _props = computed(() => {
-  return omit(props, ['columns', 'pagination', 'dataSource'])
+  return omit(props, ['columns', 'pagination', 'dataSource', 'scroll'])
 })
+
+const tableScroll = computed(() => ({
+  x: props.scroll?.x ?? true,
+  ...(props.scroll?.y != null ? { y: props.scroll.y } : {})
+}))
+
+function isActionColumn(column: BaseTableColumn) {
+  const rawIndex = column.dataIndex
+  const dataIndex = Array.isArray(rawIndex) ? rawIndex.join('.') : String(rawIndex ?? '')
+  const key = column.key != null ? String(column.key) : ''
+  return (
+    column.slot === 'action' ||
+    key === 'action' ||
+    key === 'row_action' ||
+    dataIndex === 'action' ||
+    dataIndex === 'row_action'
+  )
+}
 const emit = defineEmits<{
   (e: 'register', data: BaseTableEmit): void
 }>()
@@ -469,15 +472,17 @@ const _columns = computed(() => {
     if (!Object.hasOwn(column, 'align')) {
       column.align = 'center'
     }
+    if (isActionColumn(column)) {
+      if (!Object.hasOwn(column, 'fixed') || column.fixed == null) {
+        column.fixed = 'right'
+      }
+      const w = Number(column.width)
+      if (!Object.hasOwn(column, 'width') || column.width == null || !Number.isFinite(w) || w < 200) {
+        column.width = DEFAULT_ACTION_WIDTH
+      }
+    }
     //@ts-ignore
-    column.dataIndex = column.dataIndex.split('.')
-    //if(isArray(column.dataIndex))
-    /*if(!isArray(column.dataIndex)){
-    }*/
-    //column.dataIndex = column.dataIndex.split('.')
-    /*if(){
-      column.dataIndex=
-    }*/
+    column.dataIndex = String(column.dataIndex ?? '').split('.')
   })
   return cols
 })
@@ -699,6 +704,19 @@ defineExpose({
     overflow: auto;
   }
 
+  /* Fixed ops column must fully cover neighbors (RTL left / fixed-right) */
+  .ant-table-cell-fix-right,
+  .ant-table-cell-fix-right.ant-table-cell-fix-last-right {
+    background: var(--admin-bg-elevated, var(--admin-bg-surface, #141414)) !important;
+  }
+
+  html.is-dark & {
+    .ant-table-cell-fix-right,
+    .ant-table-cell-fix-right.ant-table-cell-fix-last-right {
+      background: var(--admin-bg-elevated, #1f1f1f) !important;
+    }
+  }
+
   .table-footer {
     flex-shrink: 0;
   }
diff --git a/src/core/components/BaseTableOld/src/BaseTable.vue b/src/core/components/BaseTableOld/src/BaseTable.vue
index df725ad..aa41e9a 100644
--- a/src/core/components/BaseTableOld/src/BaseTable.vue
+++ b/src/core/components/BaseTableOld/src/BaseTable.vue
@@ -7,6 +7,7 @@
       <!--   relative h-full-->
       <div class="scrollable-container" id="components-affix-demo-target" ref="containerRef">
         <!--- TODO remove AFFix -->
+        <div class="table-toolbar shrink-0 mb-2">
         <AAffix :target="() => containerRef">
           <div class="flex items-center justify-between mb-2">
             <div class="flex items-center gap-1">
@@ -84,10 +85,13 @@
             </div>
           </div>
         </AAffix>
+        </div>
+        <div class="table-body min-h-0 min-w-0 flex-1 overflow-auto">
         <ATable
           :columns="_columns"
           :data-source="data"
           v-bind="_props"
+          :scroll="tableScroll"
           :pagination="false"
           @resizeColumn="handleResizeColumn"
         >
@@ -100,9 +104,10 @@
           </template>
           <!--      <template #loading> sdfsdfsdfsd </template>-->
         </ATable>
+        </div>
         <!--        absolute bottom-0 w-full-->
         <!--        absolute bottom-0-->
-        <div class="flex items-center justify-between mt-5 w-full">
+        <div class="table-footer flex items-center justify-between mt-5 w-full shrink-0">
           <span> {{ totalRecord }} مورد یافت شد </span>
           <div class="flex items-center gap-2 justify-between">
             <APagination
@@ -296,24 +301,9 @@ import {
   availableFilterType,
   MapFilterOpToFaString
 } from '@core/components/BaseTableOld/hooks/filterOperator'
-//import { mapColumnTypeFilterToFilterType } from '@core/type/baseTable'
-//import { useElementSize } from '@vueuse/core'
-//import { ContentLoader } from 'vue-content-loader'
-//skeleton
-//const skeletonWidth = ref(null)
-/*const skeletonWidthSize = reactive(
-  useElementSize(skeletonWidth, { width: 0, height: 0 }, { box: 'border-box' })
-)*/
-//const skeletonHeight = 357
-/*const skeletonHeight = ref(null)
-const skeletonHeightSize = reactive(
-  useElementSize(skeletonHeight, { width: 0, height: 0 }, { box: 'border-box' })
-)*/
-/*
-watch(skeletonHeightSize, (v) => {
-  console.log('ttt', v)
-})
-*/
+
+/** Wide enough for dense action icon rows; too-narrow fixed cells bleed into neighbors. */
+const DEFAULT_ACTION_WIDTH = 280
 
 interface Props {
   bordered?: boolean
@@ -331,7 +321,7 @@ const props = withDefaults(defineProps<Props>(), {
   driver: 'laravel-sql',
   mode: 'pro',
   columns: () => [],
-  scroll: () => ({ x: true }), //y: '100%' //y: 600
+  scroll: () => ({ x: true }),
   pageSize: () => [5, 10, 20, 50, 100],
   defaultPageLimit: 10
 })
@@ -345,11 +335,28 @@ const filters = ref<Filter[]>([])
 const order = ref<'asc' | 'desc'>('asc')
 const orderColumnKey = ref<string | null>(null)
 const containerRef = ref()
-//const route = useRoute()
 const loading = ref<boolean>(false)
 const _props = computed(() => {
-  return omit(props, ['columns', 'pagination', 'dataSource'])
+  return omit(props, ['columns', 'pagination', 'dataSource', 'scroll'])
 })
+
+const tableScroll = computed(() => ({
+  x: props.scroll?.x ?? true,
+  ...(props.scroll?.y != null ? { y: props.scroll.y } : {})
+}))
+
+function isActionColumn(column: BaseTableColumn) {
+  const rawIndex = column.dataIndex
+  const dataIndex = Array.isArray(rawIndex) ? rawIndex.join('.') : String(rawIndex ?? '')
+  const key = column.key != null ? String(column.key) : ''
+  return (
+    column.slot === 'action' ||
+    key === 'action' ||
+    key === 'row_action' ||
+    dataIndex === 'action' ||
+    dataIndex === 'row_action'
+  )
+}
 const emit = defineEmits<{
   (e: 'register', data: BaseTableEmit): void
 }>()
@@ -468,15 +475,17 @@ const _columns = computed(() => {
     if (!Object.hasOwn(column, 'align')) {
       column.align = 'center'
     }
+    if (isActionColumn(column)) {
+      if (!Object.hasOwn(column, 'fixed') || column.fixed == null) {
+        column.fixed = 'right'
+      }
+      const w = Number(column.width)
+      if (!Object.hasOwn(column, 'width') || column.width == null || !Number.isFinite(w) || w < 200) {
+        column.width = DEFAULT_ACTION_WIDTH
+      }
+    }
     //@ts-ignore
-    column.dataIndex = column.dataIndex.split('.')
-    //if(isArray(column.dataIndex))
-    /*if(!isArray(column.dataIndex)){
-    }*/
-    //column.dataIndex = column.dataIndex.split('.')
-    /*if(){
-      column.dataIndex=
-    }*/
+    column.dataIndex = String(column.dataIndex ?? '').split('.')
   })
   return cols
 })
@@ -652,7 +661,6 @@ async function callApi() {
 onMounted(async () => {
   await callApi()
   emit('register', { reload })
-  //console.log('router', route.query)
 })
 
 defineExpose({
@@ -666,11 +674,26 @@ defineExpose({
 .@{prefix} {
   @apply h-full max-w-full flex flex-col min-h-0;
   .scrollable-container {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
     max-width: 100%;
+    min-height: 0;
+    min-width: 0;
+    overflow: hidden;
+  }
+  .table-body {
     flex: 1;
     min-height: 0;
-    overflow-x: auto;
-    overflow-y: auto;
+    min-width: 0;
+    overflow: auto;
+  }
+  .table-footer {
+    flex-shrink: 0;
+  }
+  .ant-table-cell-fix-right,
+  .ant-table-cell-fix-right.ant-table-cell-fix-last-right {
+    background: var(--admin-bg-elevated, var(--admin-bg-surface, #141414)) !important;
   }
   .ant-table-wrapper {
     border: 1px solid var(--admin-border);
diff --git a/src/pages/menuPages/conditionalOrders/components/ConditionalOrderEditorFormBody.vue b/src/pages/menuPages/conditionalOrders/components/ConditionalOrderEditorFormBody.vue
index 3b2ccea..e5bd198 100644
--- a/src/pages/menuPages/conditionalOrders/components/ConditionalOrderEditorFormBody.vue
+++ b/src/pages/menuPages/conditionalOrders/components/ConditionalOrderEditorFormBody.vue
@@ -30,17 +30,17 @@
 
     <a-form-item label="شرط اجرا" name="price_condition" :rules="inputRules()">
       <a-radio-group v-model:value="form.price_condition">
-        <a-radio value="gte">وقتی مظنه به این عدد یا بالاتر رسید</a-radio>
-        <a-radio value="lte">وقتی مظنه به این عدد یا پایین‌تر رسید</a-radio>
+        <a-radio value="gte">مساوی یا بیشتر از مظنه هدف</a-radio>
+        <a-radio value="lte">مساوی یا کمتر از مظنه هدف</a-radio>
       </a-radio-group>
     </a-form-item>
 
-    <a-form-item label="مظنه تریگر" name="trigger_price" :rules="inputRulesNumber()">
+    <a-form-item label="مظنه هدف" name="trigger_price" :rules="inputRulesNumber()">
       <BasicInput
         v-model:value="form.trigger_price"
         type="price"
         addon-before="ریال"
-        placeholder="مثلاً ۸۰۲۰۰۰۰۰۰"
+        placeholder="مثلاً 20,000,0000"
       />
     </a-form-item>
 
@@ -49,11 +49,11 @@
     </a-form-item>
 
     <a-form-item label="اعتبار تا" name="expires_at">
-      <a-date-picker
+      <BaseDatePicker
         v-model:value="expiresAtModel"
         show-time
+        format="YYYY-MM-DD HH:mm:ss"
         class="w-full"
-        value-format="YYYY-MM-DD HH:mm:ss"
         placeholder="تاریخ و ساعت انقضا"
       />
     </a-form-item>
@@ -73,6 +73,7 @@ import { computed, ref } from 'vue'
 import type { FormInstance } from 'ant-design-vue'
 import type { ConditionalOrder } from '@/model/conditionalOrders'
 import { inputRules, inputRulesNumber } from '@/utils/inputRules'
+import BaseDatePicker from '@core/components/BaseDatePicker'
 
 const props = defineProps<{
   form: Partial<ConditionalOrder>
@@ -84,8 +85,8 @@ const props = defineProps<{
 const formRef = ref<FormInstance>()
 
 const expiresAtModel = computed({
-  get: () => props.form.expires_at ?? undefined,
-  set: (v: string | undefined) => {
+  get: () => props.form.expires_at ?? '',
+  set: (v: string | null) => {
     props.form.expires_at = v || null
   },
 })
diff --git a/src/pages/menuPages/conditionalOrders/components/table.vue b/src/pages/menuPages/conditionalOrders/components/table.vue
index ce102ec..a35ff56 100644
--- a/src/pages/menuPages/conditionalOrders/components/table.vue
+++ b/src/pages/menuPages/conditionalOrders/components/table.vue
@@ -4,7 +4,7 @@
       <template #extra>
         <div class="flex items-center gap-2">
           <BaseButton type="primary" size="small" @click="emits('add')">
-            <span>افزودن تریگر</span>
+            <span>افزودن سفارش شرطی</span>
             <BaseIcon icon="vuesax-linear:add" size="16" />
           </BaseButton>
         </div>
diff --git a/src/pages/menuPages/conditionalOrders/hooks/conditionalOrdersColumns.tsx b/src/pages/menuPages/conditionalOrders/hooks/conditionalOrdersColumns.tsx
index 0d89ed9..4d6a31f 100644
--- a/src/pages/menuPages/conditionalOrders/hooks/conditionalOrdersColumns.tsx
+++ b/src/pages/menuPages/conditionalOrders/hooks/conditionalOrdersColumns.tsx
@@ -47,16 +47,16 @@ export const cols: BaseTableColumn[] = [
     key: 'price_condition',
     customRender: ({ record }) =>
       record.price_condition === 'gte' ? (
-        <CustomTag>یا بالاتر</CustomTag>
+        <CustomTag>مساوی یا بیشتر</CustomTag>
       ) : (
-        <CustomTag>یا پایین‌تر</CustomTag>
+        <CustomTag>مساوی یا کمتر</CustomTag>
       ),
   },
   {
-    title: 'مظنه تریگر',
+    title: 'مظنه هدف',
     dataIndex: 'trigger_price',
     key: 'trigger_price',
-    type: 'Number',
+    type: 'Number'
   },
   {
     title: 'مقدار',
diff --git a/src/pages/menuPages/customers/archive/hooks/archiveColumns.tsx b/src/pages/menuPages/customers/archive/hooks/archiveColumns.tsx
index b96f18f..7611f06 100644
--- a/src/pages/menuPages/customers/archive/hooks/archiveColumns.tsx
+++ b/src/pages/menuPages/customers/archive/hooks/archiveColumns.tsx
@@ -57,42 +57,31 @@ export const cols: BaseTableColumn[] = [
     type: 'Text'
   },*/
   {
-    title: 'وضعیت کاربر',
+    title: 'وضعیت',
     dataIndex: 'active',
-    key: 'active',
+    key: 'status',
     type: 'Boolean',
+    width: 132,
+    filterable: false,
+    sortable: false,
     customRender: ({ record }) => {
-      return record.active ? (
-        <div class="flex justify-center">
-          <CustomTag textColor="#25855A" bgColor="#E3F4E9" class={'font-bold px-6'}>
-            فعال
+      const userOk = Boolean(record.active)
+      const tradeOk = Boolean(record.trade_active)
+      return (
+        <div class="flex flex-col items-center gap-1">
+          <CustomTag
+            textColor={userOk ? '#25855A' : '#C53030'}
+            bgColor={userOk ? '#E3F4E9' : '#FECACA'}
+            class="m-0 font-bold !px-2.5 !py-0 text-xs leading-6 whitespace-nowrap"
+          >
+            {userOk ? 'حساب فعال' : 'حساب غیرفعال'}
           </CustomTag>
-        </div>
-      ) : (
-        <div class="flex justify-center">
-          <CustomTag textColor="#C53030" bgColor="#FECACA" class={'font-bold px-6'}>
-            غیر فعال
-          </CustomTag>
-        </div>
-      )
-    }
-  },
-  {
-    title: 'وضعیت سفارش دهی',
-    dataIndex: 'trade_active',
-    key: 'trade_active',
-    type: 'Boolean',
-    customRender: ({ record }) => {
-      return record.trade_active ? (
-        <div class="flex justify-center">
-          <CustomTag textColor="#25855A" bgColor="#E3F4E9" class={'font-bold px-6'}>
-            مجاز
-          </CustomTag>
-        </div>
-      ) : (
-        <div class="flex justify-center">
-          <CustomTag textColor="#C53030" bgColor="#FECACA" class={'font-bold px-6'}>
-            غیر مجاز
+          <CustomTag
+            textColor={tradeOk ? '#25855A' : '#C53030'}
+            bgColor={tradeOk ? '#E3F4E9' : '#FECACA'}
+            class="m-0 font-bold !px-2.5 !py-0 text-xs leading-6 whitespace-nowrap"
+          >
+            {tradeOk ? 'سفارش مجاز' : 'سفارش غیرمجاز'}
           </CustomTag>
         </div>
       )
diff --git a/src/pages/menuPages/customers/base/components/CustomerConditionalOrderTab.vue b/src/pages/menuPages/customers/base/components/CustomerConditionalOrderTab.vue
new file mode 100644
index 0000000..c36b7eb
--- /dev/null
+++ b/src/pages/menuPages/customers/base/components/CustomerConditionalOrderTab.vue
@@ -0,0 +1,296 @@
+<template>
+  <div class="co-tab">
+    <div class="co-grid">
+      <article class="co-panel" :class="{ 'co-panel--on': active, 'co-panel--off': !active }">
+        <header class="co-panel__head">
+          <div>
+            <h3 class="co-panel__title">دسترسی سفارش شرطی</h3>
+            <p class="co-panel__key">مجوز این مشتری</p>
+          </div>
+          <span class="co-badge" :class="active ? 'co-badge--on' : 'co-badge--off'">
+            {{ active ? 'مجاز' : 'محدود' }}
+          </span>
+        </header>
+
+        <div class="co-panel__help">
+          <div class="co-help-line">
+            <span class="co-help-pill co-help-pill--on">روشن</span>
+            <span>منو در اپ دیده می‌شود و مشتری می‌تواند تریگر بسازد.</span>
+          </div>
+          <div class="co-help-line">
+            <span class="co-help-pill co-help-pill--off">خاموش</span>
+            <span>منو مخفی است و ثبت تریگر برای این مشتری بسته می‌شود.</span>
+          </div>
+        </div>
+
+        <div class="co-panel__control">
+          <a-radio-group
+            :value="active ? 'on' : 'off'"
+            button-style="solid"
+            :disabled="activeLoading"
+            class="co-toggle-group"
+            @change="onAccessChange"
+          >
+            <a-radio-button value="on">مجاز</a-radio-button>
+            <a-radio-button value="off">محدود</a-radio-button>
+          </a-radio-group>
+          <a-spin v-if="activeLoading" size="small" />
+        </div>
+      </article>
+
+      <article class="co-panel" :class="{ 'co-panel--muted': !active }">
+        <header class="co-panel__head">
+          <div>
+            <h3 class="co-panel__title">سقف تریگرهای فعال</h3>
+            <p class="co-panel__key">حداکثر pending همزمان</p>
+          </div>
+          <span class="co-badge co-badge--neutral">{{ limitLabel }}</span>
+        </header>
+
+        <p class="co-panel__desc">
+          بعد از اجرا، ناموفق شدن یا انقضای تریگر، یک جای خالی آزاد می‌شود. خالی = بدون سقف.
+        </p>
+
+        <div class="co-panel__control co-panel__control--stack">
+          <div class="co-limit-row">
+            <a-input-number
+              v-model:value="limitDraft"
+              class="co-limit-input"
+              :min="1"
+              :precision="0"
+              :disabled="!active"
+              placeholder="خالی = نامحدود"
+              size="large"
+            />
+            <span class="co-limit-suffix">عدد</span>
+          </div>
+          <a-button
+            type="primary"
+            block
+            size="large"
+            :loading="limitLoading"
+            :disabled="!active || !limitDirty"
+            @click="saveLimit"
+          >
+            ذخیره سقف
+          </a-button>
+        </div>
+      </article>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import { message } from 'ant-design-vue'
+import {
+  changeCustomerConditionalOrderActive,
+  updateCustomerConditionalOrderLimit,
+} from '@/api/customer'
+
+const props = defineProps<{
+  customerId: number
+  conditionalOrderActive?: boolean | number | null
+  conditionalOrderLimit?: number | null
+}>()
+
+const emit = defineEmits<{
+  updated: [
+    payload: {
+      conditional_order_active?: boolean
+      conditional_order_limit?: number | null
+    },
+  ]
+}>()
+
+const activeLoading = ref(false)
+const limitLoading = ref(false)
+const limitDraft = ref<number | null>(null)
+
+const active = computed(() => Boolean(props.conditionalOrderActive))
+
+const savedLimit = computed(() => {
+  const v = props.conditionalOrderLimit
+  return v != null && Number(v) > 0 ? Number(v) : null
+})
+
+const limitLabel = computed(() =>
+  savedLimit.value != null ? `${savedLimit.value} عدد` : 'نامحدود'
+)
+
+const draftNormalized = computed(() => {
+  if (limitDraft.value == null || !Number.isFinite(Number(limitDraft.value))) return null
+  return Math.max(1, Math.floor(Number(limitDraft.value)))
+})
+
+const limitDirty = computed(() => draftNormalized.value !== savedLimit.value)
+
+watch(
+  () => props.conditionalOrderLimit,
+  (v) => {
+    limitDraft.value = v != null && Number(v) > 0 ? Number(v) : null
+  },
+  { immediate: true }
+)
+
+async function onAccessChange(e: { target?: { value?: string } }) {
+  const wantOn = e?.target?.value === 'on'
+  if (wantOn === active.value || !props.customerId || activeLoading.value) return
+
+  activeLoading.value = true
+  try {
+    const res = await changeCustomerConditionalOrderActive(props.customerId)
+    emit('updated', {
+      conditional_order_active: Boolean(
+        res?.conditional_order_active ?? !props.conditionalOrderActive
+      ),
+    })
+    message.success('مجوز سفارش شرطی به‌روز شد')
+  } catch (err) {
+    console.error(err)
+  } finally {
+    activeLoading.value = false
+  }
+}
+
+async function saveLimit() {
+  if (!props.customerId || limitLoading.value || !active.value) return
+
+  limitLoading.value = true
+  try {
+    const limit = draftNormalized.value
+    const res = await updateCustomerConditionalOrderLimit(props.customerId, limit)
+    emit('updated', {
+      conditional_order_limit: res?.conditional_order_limit ?? limit,
+    })
+    message.success('سقف سفارش شرطی ذخیره شد')
+  } catch (e) {
+    console.error(e)
+  } finally {
+    limitLoading.value = false
+  }
+}
+</script>
+
+<style scoped>
+.co-tab {
+  @apply w-full;
+}
+
+.co-grid {
+  @apply grid w-full grid-cols-1 gap-3 lg:grid-cols-2;
+}
+
+.co-panel {
+  @apply flex min-h-52 flex-col rounded-xl border p-4;
+  border-color: var(--admin-border, #303030);
+  background: var(--admin-bg-elevated, var(--admin-surface-muted, #1a1a1a));
+  transition: border-color 0.2s, box-shadow 0.2s;
+}
+
+.co-panel:hover {
+  border-color: color-mix(in srgb, var(--admin-primary, #eab308) 45%, transparent);
+}
+
+.co-panel--on {
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, #25855a 35%, transparent);
+}
+
+.co-panel--off {
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, #c53030 28%, transparent);
+}
+
+.co-panel--muted {
+  @apply opacity-55;
+}
+
+.co-panel__head {
+  @apply mb-3 flex items-start justify-between gap-3;
+}
+
+.co-panel__title {
+  @apply m-0 text-base font-700;
+  color: var(--admin-text, inherit);
+}
+
+.co-panel__key {
+  @apply m-0 mt-1 text-xs;
+  color: var(--admin-text-secondary, #9ca3af);
+}
+
+.co-panel__desc {
+  @apply m-0 mb-4 text-xs leading-5;
+  color: var(--admin-text-secondary, #9ca3af);
+}
+
+.co-panel__help {
+  @apply mb-4 flex flex-col gap-2;
+}
+
+.co-help-line {
+  @apply flex items-start gap-2 text-xs leading-5;
+  color: var(--admin-text-secondary, #9ca3af);
+}
+
+.co-help-pill {
+  @apply shrink-0 rounded px-2 py-0.5 text-[11px] font-700;
+}
+
+.co-help-pill--on {
+  color: #25855a;
+  background: #e3f4e9;
+}
+
+.co-help-pill--off {
+  color: #c53030;
+  background: #fecaca;
+}
+
+.co-badge {
+  @apply shrink-0 rounded-full px-3 py-1 text-xs font-700;
+}
+
+.co-badge--on {
+  color: #25855a;
+  background: #e3f4e9;
+}
+
+.co-badge--off {
+  color: #c53030;
+  background: #fecaca;
+}
+
+.co-badge--neutral {
+  color: var(--admin-text, inherit);
+  background: var(--admin-bg-muted, rgba(255, 255, 255, 0.06));
+}
+
+.co-panel__control {
+  @apply mt-auto flex items-center gap-2;
+}
+
+.co-panel__control--stack {
+  @apply flex-col items-stretch gap-3;
+}
+
+.co-toggle-group {
+  @apply w-full;
+}
+
+.co-toggle-group :deep(.ant-radio-button-wrapper) {
+  @apply flex-1 text-center;
+}
+
+.co-limit-row {
+  @apply flex items-center gap-2;
+}
+
+.co-limit-input {
+  @apply w-full flex-1;
+}
+
+.co-limit-suffix {
+  @apply shrink-0 text-sm;
+  color: var(--admin-text-secondary, #9ca3af);
+}
+</style>
diff --git a/src/pages/menuPages/customers/base/components/CustomerMobileDetailSheet.vue b/src/pages/menuPages/customers/base/components/CustomerMobileDetailSheet.vue
index 7379f58..5ccef72 100644
--- a/src/pages/menuPages/customers/base/components/CustomerMobileDetailSheet.vue
+++ b/src/pages/menuPages/customers/base/components/CustomerMobileDetailSheet.vue
@@ -2,6 +2,7 @@
   <MobileDetailSheet v-model:visible="visibleProxy" :item="item" :title="sheetTitle">
     <template #default="{ item: row }">
       <div class="customer-mobile-sheet">
+        <CustomerPresenceBadge :last-seen-at="row.last_seen_at" />
         <p v-if="row.mobile" class="customer-mobile-sheet__mobile" dir="ltr">{{ row.mobile }}</p>
 
         <div class="customer-mobile-sheet__chips">
@@ -100,7 +101,6 @@
           />
           <MobileDetailRow label="کد معرف" :value="row.referral_id ?? '-'" />
           <MobileDetailRow label="نام معرف" :value="row.referral?.name ?? '-'" />
-          <MobileDetailRow label="آخرین بازدید" :value="lastSeen(row)" value-class="text-xs" />
         </MobileInfoGrid>
       </div>
     </template>
@@ -118,13 +118,13 @@ import MobileDetailRow from '@/components/mobile/MobileDetailRow.vue'
 import MobileDetailSheet from '@/components/mobile/MobileDetailSheet.vue'
 import MobileInfoGrid from '@/components/mobile/MobileInfoGrid.vue'
 import CustomerWalletBalancePanel from '@/components/customer/CustomerWalletBalancePanel.vue'
-import { toJalali } from '@core/utils/useDataTime'
 import {
   accountingProviderSetting,
   customerDirectSmsEnabledSetting,
   initAccountingSettingsFromApi
 } from '@/utils/config'
 import { displayAccountingCode } from '@/utils/accountingCode'
+import CustomerPresenceBadge from '@/pages/menuPages/customers/base/components/CustomerPresenceBadge.vue'
 
 const props = defineProps<{
   visible: boolean
@@ -200,10 +200,6 @@ function confirmToggleTrade(row: Customer) {
   })
 }
 
-function lastSeen(row: Customer) {
-  return row.last_seen_at ? toJalali(row.last_seen_at) : '-'
-}
-
 async function loadChargeTargets() {
   try {
     const res = await getChargeTargets()
@@ -260,6 +256,16 @@ watch(
   color: #b91c1c;
 }
 
+.customer-mobile-sheet__chip.is-online {
+  background: rgba(37, 99, 235, 0.14);
+  color: #1d4ed8;
+}
+
+.customer-mobile-sheet__chip.is-muted {
+  background: rgba(107, 114, 128, 0.14);
+  color: #6b7280;
+}
+
 .customer-mobile-sheet__section {
   width: 100%;
   min-width: 0;
diff --git a/src/pages/menuPages/customers/base/components/CustomerPresenceBadge.vue b/src/pages/menuPages/customers/base/components/CustomerPresenceBadge.vue
new file mode 100644
index 0000000..cc579d2
--- /dev/null
+++ b/src/pages/menuPages/customers/base/components/CustomerPresenceBadge.vue
@@ -0,0 +1,120 @@
+<template>
+  <div class="presence-badge" :class="`presence-badge--${kind}`" :title="hint">
+    <span class="presence-badge__glow" aria-hidden="true" />
+    <span class="presence-badge__dot" aria-hidden="true" />
+    <span class="presence-badge__label">{{ label }}</span>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { getCustomerPresenceKind } from '@/utils/customerPresence'
+import { toJalali } from '@core/utils/useDataTime'
+
+const props = defineProps<{
+  lastSeenAt?: string | Date | null
+}>()
+
+const kind = computed(() => getCustomerPresenceKind(props.lastSeenAt))
+
+const label = computed(() => {
+  if (kind.value === 'online') return 'آنلاین'
+  if (kind.value === 'never') return 'وارد نشده'
+  return props.lastSeenAt ? `آخرین بازدید ${toJalali(props.lastSeenAt as string)}` : 'آفلاین'
+})
+
+const hint = computed(() => {
+  if (kind.value === 'online') return 'اتصال زنده (SSE) فعال است'
+  if (kind.value === 'never') return 'هنوز وارد اپ نشده'
+  return props.lastSeenAt ? toJalali(props.lastSeenAt as string) : ''
+})
+</script>
+
+<style scoped>
+.presence-badge {
+  @apply relative inline-flex items-center gap-2 mt-1.5 px-2.5 py-1 rounded-full w-fit max-w-full;
+  border: 1px solid transparent;
+}
+
+.presence-badge__glow {
+  @apply pointer-events-none absolute inset-0 rounded-full opacity-0;
+}
+
+.presence-badge__dot {
+  @apply relative h-2 w-2 rounded-full shrink-0;
+}
+
+.presence-badge__label {
+  @apply text-xs font-700 truncate;
+}
+
+.presence-badge--online {
+  background: rgba(34, 197, 94, 0.12);
+  border-color: rgba(34, 197, 94, 0.35);
+}
+
+.presence-badge--online .presence-badge__glow {
+  opacity: 1;
+  background: radial-gradient(circle at 30% 50%, rgba(34, 197, 94, 0.25), transparent 70%);
+}
+
+.presence-badge--online .presence-badge__dot {
+  background: #22c55e;
+  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
+  animation: presence-badge-pulse 1.6s ease-out infinite;
+}
+
+.presence-badge--online .presence-badge__label {
+  color: #16a34a;
+}
+
+.presence-badge--offline {
+  background: rgba(156, 163, 175, 0.12);
+  border-color: rgba(156, 163, 175, 0.35);
+}
+
+.presence-badge--offline .presence-badge__dot {
+  background: #9ca3af;
+}
+
+.presence-badge--offline .presence-badge__label {
+  color: #6b7280;
+}
+
+.presence-badge--never {
+  background: rgba(239, 68, 68, 0.1);
+  border-color: rgba(239, 68, 68, 0.3);
+}
+
+.presence-badge--never .presence-badge__dot {
+  background: #ef4444;
+}
+
+.presence-badge--never .presence-badge__label {
+  color: #dc2626;
+}
+
+@keyframes presence-badge-pulse {
+  0% {
+    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
+  }
+  70% {
+    box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
+  }
+  100% {
+    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
+  }
+}
+
+:global(html.is-dark) .presence-badge--online .presence-badge__label {
+  color: #4ade80;
+}
+
+:global(html.is-dark) .presence-badge--offline .presence-badge__label {
+  color: #d1d5db;
+}
+
+:global(html.is-dark) .presence-badge--never .presence-badge__label {
+  color: #f87171;
+}
+</style>
diff --git a/src/pages/menuPages/customers/base/components/CustomerPresenceCell.vue b/src/pages/menuPages/customers/base/components/CustomerPresenceCell.vue
new file mode 100644
index 0000000..21e0e30
--- /dev/null
+++ b/src/pages/menuPages/customers/base/components/CustomerPresenceCell.vue
@@ -0,0 +1,90 @@
+<template>
+  <div class="presence-cell" :class="`presence-cell--${kind}`">
+    <span class="presence-cell__dot" aria-hidden="true" />
+    <span class="presence-cell__label">{{ label }}</span>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { getCustomerPresenceKind } from '@/utils/customerPresence'
+import { toJalali } from '@core/utils/useDataTime'
+
+const props = defineProps<{
+  lastSeenAt?: string | Date | null
+}>()
+
+const kind = computed(() => getCustomerPresenceKind(props.lastSeenAt))
+
+const label = computed(() => {
+  if (kind.value === 'online') return 'آنلاین'
+  if (kind.value === 'never') return 'وارد نشده'
+  return props.lastSeenAt ? toJalali(props.lastSeenAt as string) : '—'
+})
+</script>
+
+<style scoped>
+.presence-cell {
+  @apply flex flex-col items-center justify-center gap-1 py-1 min-w-[5.5rem];
+}
+
+.presence-cell__dot {
+  @apply relative inline-block h-2.5 w-2.5 rounded-full shrink-0;
+}
+
+.presence-cell__label {
+  @apply text-xs font-600 text-center leading-snug;
+  max-width: 7.5rem;
+}
+
+.presence-cell--online .presence-cell__dot {
+  background: #22c55e;
+  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
+  animation: presence-pulse 1.6s ease-out infinite;
+}
+
+.presence-cell--online .presence-cell__label {
+  color: #16a34a;
+}
+
+.presence-cell--offline .presence-cell__dot {
+  background: #9ca3af;
+}
+
+.presence-cell--offline .presence-cell__label {
+  color: #9ca3af;
+  font-size: 0.7rem;
+}
+
+.presence-cell--never .presence-cell__dot {
+  background: #ef4444;
+}
+
+.presence-cell--never .presence-cell__label {
+  color: #ef4444;
+}
+
+@keyframes presence-pulse {
+  0% {
+    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
+  }
+  70% {
+    box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
+  }
+  100% {
+    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
+  }
+}
+
+:global(html.is-dark) .presence-cell--online .presence-cell__label {
+  color: #4ade80;
+}
+
+:global(html.is-dark) .presence-cell--offline .presence-cell__label {
+  color: #d1d5db;
+}
+
+:global(html.is-dark) .presence-cell--never .presence-cell__label {
+  color: #f87171;
+}
+</style>
diff --git a/src/pages/menuPages/customers/base/hooks/customerColumns.tsx b/src/pages/menuPages/customers/base/hooks/customerColumns.tsx
index e442110..f90c0b4 100644
--- a/src/pages/menuPages/customers/base/hooks/customerColumns.tsx
+++ b/src/pages/menuPages/customers/base/hooks/customerColumns.tsx
@@ -1,11 +1,11 @@
 import type { BaseTableColumn } from '@core/type/baseTable'
-import { toJalali } from '@core/utils/useDataTime'
 import CustomTag from '@/components/CustomTag.vue'
 import { usePrice } from '@core/utils/usePrice'
 import { getCashBalance } from '@/components/mobile/utils/wallet'
 import { customerWalletMetalBalanceTitle } from '@/utils/adminMetalLabels'
 import { formatMetalDisplayValue, metalCellValue } from '@/utils/metalWeight'
 import type { AccountingProvider } from '@/utils/config'
+import CustomerPresenceCell from '@/pages/menuPages/customers/base/components/CustomerPresenceCell.vue'
 
 export type CustomerMetalColumn = { metal_id: number; label: string; display_unit?: string }
 
@@ -63,24 +63,12 @@ export function buildCustomerColumns(
       key: 'mobile',
       type: 'Number'
     },
-    {
-      title: 'نوع کاربر',
-      dataIndex: 'type_str',
-      key: 'type_str',
-      type: 'Text'
-    },
     {
       title: 'کد معرف',
       dataIndex: 'referral_id',
       key: 'referral_id',
       type: 'Text'
     },
-    {
-      title: 'نام معرف کاربر',
-      dataIndex: 'referral.name',
-      key: 'referral.name',
-      type: 'Text'
-    },
     {
       title: 'موجودی ریالی (ریال)',
       dataIndex: 'wallet.cash',
@@ -122,53 +110,42 @@ export function buildCustomerColumns(
   return [
     ...baseColumns,
     ...metalColumns,
-/*    {
-      title: 'اخرین بازدید',
+    {
+      title: 'آخرین بازدید',
       dataIndex: 'last_seen_at',
       key: 'last_seen_at',
       type: 'DateTime',
-      customRender(data) {
-        return toJalali(data.record.last_seen_at)
-      }
-    },*/
-    {
-      title: 'وضعیت کاربر',
-      dataIndex: 'active',
-      key: 'active',
-      type: 'Boolean',
-      customRender: ({ record }) => {
-        return record.active ? (
-          <div class="flex justify-center">
-            <CustomTag textColor="#25855A" bgColor="#E3F4E9" class={'font-bold px-6'}>
-              فعال
-            </CustomTag>
-          </div>
-        ) : (
-          <div class="flex justify-center">
-            <CustomTag textColor="#C53030" bgColor="#FECACA" class={'font-bold px-6'}>
-              غیر فعال
-            </CustomTag>
-          </div>
-        )
-      }
+      width: 130,
+      filterable: false,
+      sortable: true,
+      customRender: ({ record }) => <CustomerPresenceCell lastSeenAt={record.last_seen_at} />
     },
     {
-      title: 'وضعیت سفارش دهی',
-      dataIndex: 'trade_active',
-      key: 'trade_active',
-      sortable: false,
+      title: 'وضعیت',
+      dataIndex: 'active',
+      key: 'status',
       type: 'Boolean',
+      width: 132,
+      filterable: false,
+      sortable: false,
       customRender: ({ record }) => {
-        return record.trade_active ? (
-          <div class="flex justify-center">
-            <CustomTag textColor="#25855A" bgColor="#E3F4E9" class={'font-bold px-6'}>
-              مجاز
+        const userOk = Boolean(record.active)
+        const tradeOk = Boolean(record.trade_active)
+        return (
+          <div class="flex flex-col items-center gap-1">
+            <CustomTag
+              textColor={userOk ? '#25855A' : '#C53030'}
+              bgColor={userOk ? '#E3F4E9' : '#FECACA'}
+              class="m-0 font-bold !px-2.5 !py-0 text-xs leading-6 whitespace-nowrap"
+            >
+              {userOk ? 'حساب فعال' : 'حساب غیرفعال'}
             </CustomTag>
-          </div>
-        ) : (
-          <div class="flex justify-center">
-            <CustomTag textColor="#C53030" bgColor="#FECACA" class={'font-bold px-6'}>
-              غیر مجاز
+            <CustomTag
+              textColor={tradeOk ? '#25855A' : '#C53030'}
+              bgColor={tradeOk ? '#E3F4E9' : '#FECACA'}
+              class="m-0 font-bold !px-2.5 !py-0 text-xs leading-6 whitespace-nowrap"
+            >
+              {tradeOk ? 'سفارش مجاز' : 'سفارش غیرمجاز'}
             </CustomTag>
           </div>
         )
diff --git a/src/pages/menuPages/customers/base/index.vue b/src/pages/menuPages/customers/base/index.vue
index 4d1455c..b483696 100644
--- a/src/pages/menuPages/customers/base/index.vue
+++ b/src/pages/menuPages/customers/base/index.vue
@@ -118,6 +118,7 @@
             <div class="admin-stat-muted rounded-lg w-full flex flex-col gap-3 p-3 md:flex-row md:justify-between">
               <div>
                 <div class="font-bold">{{ userInfo.name }}</div>
+                <CustomerPresenceBadge :last-seen-at="userInfo?.last_seen_at" />
                 <div class="mt-1">{{ userInfo?.mobile }}</div>
               </div>
               <div class="flex flex-col justify-center items-center pl-3">
@@ -178,7 +179,6 @@
                 title="حداکثر معرفی"
                 :value="userInfo?.add_user_limit ? `${userInfo?.add_user_limit} نفر` : '_'"
               />
-              <BasicInfoItem title="آخرین بازدید" :value="toJalali(userInfo?.last_seen_at)" />
               <BasicInfoItem title="وضعیت سفارش دهی" class="col-span-2 md:col-span-1">
                 <CustomTag
                   :textColor="userInfo?.trade_active === 1 ? '#25855A' : '#C53030'"
@@ -188,41 +188,6 @@
                   {{ userInfo?.trade_active === 1 ? 'مجاز' : 'غیر مجاز' }}
                 </CustomTag>
               </BasicInfoItem>
-              <template v-if="conditionalOrderEnabled">
-                <BasicInfoItem title="سفارش شرطی" class="col-span-2 md:col-span-1">
-                  <div class="flex flex-wrap items-center gap-2">
-                    <CustomTag
-                      :textColor="userInfo?.conditional_order_active ? '#25855A' : '#C53030'"
-                      :bgColor="userInfo?.conditional_order_active ? '#E3F4E9' : '#FECACA'"
-                      class="font-bold px-4"
-                    >
-                      {{ userInfo?.conditional_order_active ? 'مجاز' : 'غیر مجاز' }}
-                    </CustomTag>
-                    <BaseButton
-                      size="small"
-                      type="default"
-                      :loading="conditionalOrderLoading"
-                      @click="toggleConditionalOrderActive"
-                    >
-                      {{ userInfo?.conditional_order_active ? 'محدود کردن' : 'مجاز کردن' }}
-                    </BaseButton>
-                  </div>
-                </BasicInfoItem>
-                <BasicInfoItem title="سقف سفارش شرطی" class="col-span-2 md:col-span-1">
-                  <div class="flex flex-wrap items-center gap-2">
-                    <span class="font-bold">
-                      {{
-                        userInfo?.conditional_order_limit
-                          ? `${userInfo.conditional_order_limit} عدد`
-                          : 'نامحدود'
-                      }}
-                    </span>
-                    <BaseButton size="small" type="default" @click="editConditionalOrderLimit">
-                      ویرایش سقف
-                    </BaseButton>
-                  </div>
-                </BasicInfoItem>
-              </template>
             </div>
 
             <div v-if="userInfo?.id && isMobile" class="mt-2 space-y-2">
@@ -278,6 +243,19 @@
         <a-tab-pane key="قلک ها" tab="قلک ها">
           <FundsTable ref="fundTable" :customerId="userInfo?.id" />
         </a-tab-pane>
+        <a-tab-pane
+          v-if="conditionalOrderEnabled"
+          key="سفارش شرطی"
+          tab="سفارش شرطی"
+        >
+          <CustomerConditionalOrderTab
+            v-if="userInfo?.id"
+            :customer-id="userInfo.id"
+            :conditional-order-active="userInfo.conditional_order_active"
+            :conditional-order-limit="userInfo.conditional_order_limit"
+            @updated="onConditionalOrderUpdated"
+          />
+        </a-tab-pane>
       </a-tabs>
     </BasicActionSheet>
     <WalletChargeModal
@@ -314,15 +292,17 @@ import { confirmDeleteItem } from '@/utils/confirmModal'
 import { cloneDeep } from 'lodash'
 import type { Item } from '@/model/Item'
 import type { Customer } from '@/model/customer'
-import { createCustomer, deleteCustomer, updateCustomer, changeCustomerConditionalOrderActive, updateCustomerConditionalOrderLimit } from '@/api/customer'
+import { createCustomer, deleteCustomer, getCustomer, updateCustomer } from '@/api/customer'
 import customers from '@/router/routes/customers'
 import { usePrice } from '@core/utils/usePrice'
 import jalaliday from 'jalaliday'
+import { useRoute, useRouter } from 'vue-router'
 import ordersTbl from '@/pages/menuPages/orders/components/table.vue'
 import transactionsTbl from '@/pages/menuPages/transactions/components/table.vue'
 import smsTbl from '@/pages/menuPages/sms/components/table.vue'
 import FundsTable from '@/pages/menuPages/customers/base/components/fundsTable.vue'
 import ReferralsTable from '@/pages/menuPages/customers/base/components/referralsTable.vue'
+import CustomerConditionalOrderTab from '@/pages/menuPages/customers/base/components/CustomerConditionalOrderTab.vue'
 import type { Order } from '@/model/order'
 import Icon from '@core/components/BaseIcon/src/Icon.vue'
 import { isMobile } from '@core/utils/is'
@@ -340,10 +320,9 @@ import {
   initWalletSettingsFromApi
 } from '@/utils/config'
 import { displayAccountingCode, isValidAccountingCode } from '@/utils/accountingCode'
+import CustomerPresenceBadge from '@/pages/menuPages/customers/base/components/CustomerPresenceBadge.vue'
 import { syncCustomerWalletFromPargar, type PargarSyncWalletResult } from '@/api/pargar'
 import PargarWalletSyncAction from './components/PargarWalletSyncAction.vue'
-import { MODAL_ABOVE_ACTION_SHEET_Z_INDEX } from '@/constants/overlayZIndex'
-import { Modal } from 'ant-design-vue'
 
 const fnameHelp: DashboardHelp = {
   description: 'نام کوچک مشتری که در اپ و پنل نمایش داده می‌شود.',
@@ -576,12 +555,42 @@ const resetData = () => {
 const deleteItem = (id: number) => confirmDeleteItem('کاربر', id, deleteCustomer, refreshTable)
 
 //define selects
+const route = useRoute()
+const router = useRouter()
+
+async function openInfoFromQuery() {
+  const raw = route.query.infoId
+  const id = Number(Array.isArray(raw) ? raw[0] : raw)
+  if (!Number.isFinite(id) || id <= 0) return
+  try {
+    loading.value = true
+    const customer = await getCustomer(id)
+    if (customer) await info(customer)
+  } catch (e) {
+    console.error(e)
+    message.error('بارگذاری مشخصات مشتری ممکن نیست')
+  } finally {
+    loading.value = false
+    const nextQuery = { ...route.query }
+    delete nextQuery.infoId
+    await router.replace({ query: nextQuery })
+  }
+}
+
 onMounted(async () => {
   loading.value = true
   await Promise.allSettled([initAccountingSettingsFromApi(), initWalletSettingsFromApi()])
   loading.value = false
 })
 
+watch(
+  () => route.query.infoId,
+  () => {
+    void openInfoFromQuery()
+  },
+  { immediate: true }
+)
+
 //add project modal
 const addUserVisible = ref<boolean>(false)
 const userInfoVisible = ref<boolean>(false)
@@ -603,57 +612,20 @@ const accountingCodeVisible = computed(() => {
   return provider === 'pargar' || provider === 'tahesab'
 })
 
-const conditionalOrderEnabled = conditionalOrderEnabledSetting
-const conditionalOrderLoading = ref(false)
+const conditionalOrderEnabled = computed(() => conditionalOrderEnabledSetting.value)
 
-async function toggleConditionalOrderActive() {
-  if (!userInfo.value?.id || conditionalOrderLoading.value) return
-  conditionalOrderLoading.value = true
-  try {
-    const res = await changeCustomerConditionalOrderActive(userInfo.value.id)
-    userInfo.value.conditional_order_active = Boolean(
-      res?.conditional_order_active ?? !userInfo.value.conditional_order_active
-    )
-    refreshTable()
-    message.success('مجوز سفارش شرطی به‌روز شد')
-  } catch (e) {
-    console.error(e)
-  } finally {
-    conditionalOrderLoading.value = false
+function onConditionalOrderUpdated(payload: {
+  conditional_order_active?: boolean
+  conditional_order_limit?: number | null
+}) {
+  if (!userInfo.value) return
+  if (payload.conditional_order_active !== undefined) {
+    userInfo.value.conditional_order_active = payload.conditional_order_active
   }
-}
-
-function editConditionalOrderLimit() {
-  if (!userInfo.value?.id) return
-  const current = userInfo.value.conditional_order_limit
-  Modal.confirm({
-    title: 'سقف تعداد سفارش شرطی',
-    content: `برای «${userInfo.value.name || userInfo.value.id}» عدد سقف را وارد کنید (خالی = نامحدود). فعلی: ${
-      current ? current : 'نامحدود'
-    }`,
-    okText: 'ذخیره',
-    cancelText: 'انصراف',
-    centered: true,
-    zIndex: MODAL_ABOVE_ACTION_SHEET_Z_INDEX,
-    onOk: async () => {
-      const raw = window.prompt(
-        'سقف تعداد تریگر pending (خالی = نامحدود):',
-        current != null ? String(current) : ''
-      )
-      if (raw === null) return
-      const trimmed = raw.trim()
-      const limit = trimmed === '' ? null : Number(trimmed)
-      if (limit !== null && (!Number.isFinite(limit) || limit < 1)) {
-        message.error('عدد نامعتبر است')
-        return Promise.reject()
-      }
-      const res = await updateCustomerConditionalOrderLimit(userInfo.value!.id, limit)
-      userInfo.value!.conditional_order_limit =
-        res?.conditional_order_limit ?? limit
-      refreshTable()
-      message.success('سقف سفارش شرطی ذخیره شد')
-    },
-  })
+  if (payload.conditional_order_limit !== undefined) {
+    userInfo.value.conditional_order_limit = payload.conditional_order_limit
+  }
+  refreshTable()
 }
 
 const accountingCodeValue = computed(() => {
diff --git a/src/pages/menuPages/customers/index.vue b/src/pages/menuPages/customers/index.vue
index 618eb20..b7368db 100644
--- a/src/pages/menuPages/customers/index.vue
+++ b/src/pages/menuPages/customers/index.vue
@@ -17,25 +17,18 @@
 </template>
 
 <script setup lang="ts">
+import { computed } from 'vue'
 import BasicMenu from '@/components/BasicMenu/index.vue'
 import { useRouterStore } from '@core/stores/router'
 import { get } from 'lodash'
-//import Nature from '@/pages/menuPages/setting/limitedOrder/index.vue'
-//s import test from './limitedOrder'
-//import Budget from '@/pages/menuPages/setting/budget/index.vue'
-//import ProjectType from '@/pages/menuPages/setting/projectType/index.vue'
-//import DocumentType from '@/pages/menuPages/setting/documentType/index.vue'
-// import Management from '@/pages/menuPages/setting/management/index.vue'
-//import Accessibility from '@/pages/menuPages/setting/accessibility/index.vue'
-//import SubmitProcess from '@/pages/menuPages/setting/submitProcess/index.vue'
-//import documentGroup from '@/pages/menuPages/setting/documentGroup/index.vue'
-//import userType from '@/pages/menuPages/setting/userType/index.vue'
 
 const routerStore = useRouterStore()
 const menu = computed(() => {
   const item = routerStore.routes.find((item) => item.name === 'customers')
-  //console.log('aaaa', get(item, 'children[0].children', []))
-  return get(item, 'children[0].children', [])
+  const children = get(item, 'children[0].children', []) as Array<{ meta?: { order?: number } }>
+  return [...children].sort(
+    (a, b) => (a.meta?.order ?? 99) - (b.meta?.order ?? 99)
+  )
 })
 </script>
 
diff --git a/src/pages/menuPages/customers/online/index.vue b/src/pages/menuPages/customers/online/index.vue
new file mode 100644
index 0000000..631e586
--- /dev/null
+++ b/src/pages/menuPages/customers/online/index.vue
@@ -0,0 +1,642 @@
+<template>
+  <div class="online-page h-full min-h-0 flex flex-col overflow-hidden">
+    <div class="online-page__hero shrink-0 mb-4">
+      <div class="flex flex-wrap items-center justify-between gap-3">
+        <div>
+          <h2 class="online-page__title m-0">کاربران آنلاین</h2>
+          <p class="online-page__sub m-0 mt-1">
+            کسانی که الان اپ باز است و اتصال قیمت (SSE) فعال دارند
+          </p>
+        </div>
+        <div class="flex items-center gap-2">
+          <div class="online-page__count">
+            <span class="online-page__count-dot" />
+            <span class="font-700">{{ count }}</span>
+            <span class="text-sm opacity-80">نفر آنلاین</span>
+          </div>
+          <a-button type="primary" size="small" :loading="loading" @click="load">
+            به‌روزرسانی
+          </a-button>
+        </div>
+      </div>
+    </div>
+
+    <a-spin :spinning="loading" class="flex-1 min-h-0">
+      <div v-if="!loading && !rows.length" class="online-page__empty">
+        <span class="online-page__empty-dot" />
+        <p class="m-0 mt-3 font-600">الان کسی آنلاین نیست</p>
+        <p class="m-0 mt-1 text-sm opacity-70">با باز شدن اپ توسط مشتری، اینجا ظاهر می‌شود</p>
+      </div>
+
+      <div v-else class="online-page__grid overflow-y-auto min-h-0 pb-4">
+        <article
+          v-for="row in rows"
+          :key="row.id"
+          class="online-card"
+          role="button"
+          tabindex="0"
+          @click="openSheet(row)"
+          @keydown.enter.prevent="openSheet(row)"
+        >
+          <div class="online-card__top">
+            <span class="online-card__pulse" />
+            <span class="online-card__badge">آنلاین</span>
+          </div>
+          <h3 class="online-card__name m-0">{{ row.name || '—' }}</h3>
+          <p class="online-card__mobile m-0" dir="ltr">{{ row.mobile || '—' }}</p>
+          <div class="online-card__meta">
+            <span>کد {{ row.id }}</span>
+            <span>{{ formatSeen(row.last_seen_at) }}</span>
+          </div>
+
+          <div class="online-card__actions" @click.stop>
+            <a-tooltip placement="bottom">
+              <template #title><span>بایگانی</span></template>
+              <a-popconfirm
+                title="آیا مشتری را بایگانی می کنید؟"
+                ok-text="تایید"
+                cancel-text="رد"
+                placement="topLeft"
+                @confirm="archiveFunction(row.id)"
+              >
+                <Icon class="cursor-pointer" icon="vuesax-linear:archive-tick" color="#e3bf00" />
+              </a-popconfirm>
+            </a-tooltip>
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="changeCustomerActivationFunction(row.id)">
+              <template #title>
+                <span>{{ row.active ? 'غیرفعال کردن حساب کاربری' : 'فعال کردن حساب کاربری' }}</span>
+              </template>
+              <Icon
+                :icon="row.active ? 'vuesax-linear:user-tick' : 'vuesax-linear:user-remove'"
+                :color="row.active ? '#54AD06' : '#ad0627'"
+              />
+            </a-tooltip>
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="openWalletCharge(row)">
+              <template #title><span>شارژ کیف پول</span></template>
+              <Icon icon="vuesax-linear:wallet-add" color="#9333ea" />
+            </a-tooltip>
+            <a-tooltip
+              v-if="tahesabEnabled && !isValidAccountingCode(row.moshtari_code)"
+              placement="bottom"
+              class="cursor-pointer"
+              @click="openTahesabRegister(row)"
+            >
+              <template #title><span>در ته‌حساب ثبت نشده — کلیک برای ثبت</span></template>
+              <Icon icon="vuesax-linear:profile-add" color="#CA8A04" />
+            </a-tooltip>
+            <a-tooltip
+              v-if="pargarEnabled && !isValidAccountingCode(row.pargar_account_id)"
+              placement="bottom"
+              class="cursor-pointer"
+              @click="openPargarRegister(row)"
+            >
+              <template #title><span>در پرگار ثبت نشده — کلیک برای ثبت</span></template>
+              <Icon icon="vuesax-linear:profile-add" color="#7C3AED" />
+            </a-tooltip>
+            <a-tooltip
+              v-if="accountingEnabled"
+              placement="bottom"
+              class="cursor-pointer"
+              @click="openAccountingCodeEdit(row)"
+            >
+              <template #title><span>ویرایش کد حسابداری</span></template>
+              <Icon icon="vuesax-linear:card-edit" color="#0d9488" />
+            </a-tooltip>
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="goInfo(row)">
+              <template #title><span>مشخصات</span></template>
+              <Icon icon="vuesax-linear:stickynote" color="#10913A" />
+            </a-tooltip>
+            <a-tooltip placement="bottom" class="cursor-pointer" @click="openEdit(row)">
+              <template #title><span>ویرایش</span></template>
+              <Icon icon="vuesax-linear:edit" color="#4572E9" />
+            </a-tooltip>
+            <a-tooltip
+              placement="bottom"
+              class="cursor-pointer"
+              @click="changeCustomerOrderActivationFunction(row.id)"
+            >
+              <template #title>
+                <span>{{ row.trade_active ? 'غیر مجاز کردن سفارش دهی' : 'مجاز کردن سفارش دهی' }}</span>
+              </template>
+              <Icon
+                :icon="row.trade_active === 1 ? 'vuesax-linear:box-tick' : 'vuesax-linear:box-remove'"
+                :color="row.trade_active === 1 ? '#54AD06' : '#ad0627'"
+              />
+            </a-tooltip>
+            <a-tooltip
+              v-if="customerDirectSmsEnabled"
+              placement="bottom"
+              class="cursor-pointer"
+              @click="openDirectSms(row)"
+            >
+              <template #title><span>ارسال پیامک</span></template>
+              <Icon icon="vuesax-linear:sms" color="#0ea5e9" />
+            </a-tooltip>
+            <a-tooltip
+              v-if="!row.is_legal"
+              placement="bottom"
+              class="cursor-pointer"
+              @click="openConfirmUser(row)"
+            >
+              <template #title><span>تایید کاربر</span></template>
+              <Icon icon="vuesax-linear:user-search" color="#0d9488" />
+            </a-tooltip>
+          </div>
+        </article>
+      </div>
+    </a-spin>
+
+    <CustomerMobileDetailSheet
+      v-model:visible="sheetVisible"
+      :item="selectedItem"
+      @info="goInfo"
+      @edit="openEdit"
+      @archive="handleArchive"
+      @toggleActive="(item) => changeCustomerActivationFunction(item.id)"
+      @chargeWallet="openWalletCharge"
+      @toggleTrade="(item) => changeCustomerOrderActivationFunction(item.id)"
+      @confirmUser="openConfirmUser"
+      @sendSms="openDirectSms"
+      @editAccounting="openAccountingCodeEdit"
+    />
+
+    <WalletChargeModal
+      v-model:visible="showWalletCharge"
+      :customer-id="chargeCustomerId"
+      @success="load"
+    />
+
+    <CustomerDirectSmsModal v-model:visible="directSmsVisible" :customer="directSmsCustomer" />
+
+    <CustomerAccountingCodeModal
+      v-model:visible="accountingCodeVisible"
+      :customer="accountingCodeCustomer"
+      :provider="accountingProviderSetting"
+      @success="load"
+    />
+
+    <BasicModal
+      v-model:visible="confirmVisible"
+      :width="isMobile ? '92vw' : '50vw'"
+      title="تایید مشتری"
+      @ok="confirmUserFunction"
+      ok-text="تایید"
+      :loading="actionLoading"
+      @close="confirmVisible = false"
+    >
+      <div class="mt-[-10px] mb-10 font-bold">آیا از اطلاعات وارد شده اطمینان دارید؟</div>
+      <div class="grid grid-cols-4 gap-2">
+        <BasicInfoItem title="نام و نام خانوادگی" :value="confirmInfo?.name" />
+        <BasicInfoItem title="شماره همراه" :value="confirmInfo?.mobile" />
+        <BasicInfoItem
+          title="تاریخ تولد"
+          :value="confirmInfo?.birth_date ? toJalaliNoTime(confirmInfo?.birth_date) : '_'"
+        />
+        <BasicInfoItem title="شماره تلفن" :value="confirmInfo?.phone_number ?? '_'" />
+        <BasicInfoItem title="نام استان" :value="confirmInfo?.province" />
+        <BasicInfoItem title="نام شهر" :value="confirmInfo?.city" />
+        <BasicInfoItem title="شماره ملی" :value="confirmInfo?.n_code" />
+      </div>
+    </BasicModal>
+
+    <BasicActionSheet
+      v-model:visible="editVisible"
+      title="ویرایش کاربر"
+      modal-width="55rem"
+      :loading="actionLoading"
+      :showButton="true"
+      :showCancel="true"
+      :showOk="true"
+      ok-text="ثبت"
+      cancel-text="انصراف"
+      @ok="submitEdit"
+      @close="editVisible = false"
+    >
+      <a-form :model="editForm" ref="editFormRef" autocomplete="off">
+        <div class="grid gap-4 md:grid-cols-3">
+          <a-form-item label="نام" name="fname" :rules="inputRules()">
+            <BasicInput v-model:value="editForm.fname" />
+          </a-form-item>
+          <a-form-item label="نام خانوادگی" name="lname" :rules="inputRules()">
+            <BasicInput v-model:value="editForm.lname" />
+          </a-form-item>
+          <a-form-item label="شماره همراه" name="mobile" :rules="inputLenRules(11)">
+            <BasicInput v-model:value="editForm.mobile" type="number" />
+          </a-form-item>
+          <a-form-item label="پسورد" name="password">
+            <BasicInput is-password v-model:value="editForm.password" />
+          </a-form-item>
+          <a-form-item label="تاریخ تولد" name="birth_date">
+            <BaseDatePicker v-model:value="editForm.birth_date" />
+          </a-form-item>
+          <a-form-item label="شماره تلفن" name="phone_number">
+            <BasicInput v-model:value="editForm.phone_number" type="number" />
+          </a-form-item>
+          <a-form-item label="نام استان" name="province">
+            <BasicInput v-model:value="editForm.province" />
+          </a-form-item>
+          <a-form-item label="نام شهر" name="city">
+            <BasicInput v-model:value="editForm.city" />
+          </a-form-item>
+          <a-form-item label="شماره ملی" name="n_code">
+            <BasicInput v-model:value="editForm.n_code" />
+          </a-form-item>
+        </div>
+      </a-form>
+    </BasicActionSheet>
+
+    <TahesabRetryModal
+      v-if="tahesabEnabled"
+      v-model="tahesabRegisterVisible"
+      mode="register-customer"
+      :customer-id="tahesabCustomer?.id"
+      :customer-name="tahesabCustomer?.name"
+      @success="load"
+    />
+    <PargarRetryModal
+      v-if="pargarEnabled"
+      v-model="pargarRegisterVisible"
+      mode="register-customer"
+      :customer-id="pargarCustomer?.id"
+      :customer-name="pargarCustomer?.name"
+      @success="load"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+import { cloneDeep } from 'lodash'
+import type { FormInstance } from 'ant-design-vue'
+import { message, Modal } from 'ant-design-vue'
+import {
+  changeCustomerActivation,
+  changeCustomerArchive,
+  changeCustomerOrderActivation,
+  confirmUser,
+  getOnlineCustomers,
+  updateCustomer
+} from '@/api/customer'
+import type { Customer } from '@/model/customer'
+import { toJalali, toJalaliNoTime } from '@core/utils/useDataTime'
+import Icon from '@core/components/BaseIcon/src/Icon.vue'
+import BasicActionSheet from '@/components/BasicActionSheet.vue'
+import { isMobile } from '@core/utils/is'
+import { MODAL_ABOVE_ACTION_SHEET_Z_INDEX } from '@/constants/overlayZIndex'
+import { inputLenRules, inputRules } from '@/utils/inputRules'
+import CustomerMobileDetailSheet from '@/pages/menuPages/customers/base/components/CustomerMobileDetailSheet.vue'
+import WalletChargeModal from '@/pages/menuPages/customers/base/components/WalletChargeModal.vue'
+import CustomerDirectSmsModal from '@/pages/menuPages/customers/base/components/CustomerDirectSmsModal.vue'
+import CustomerAccountingCodeModal from '@/pages/menuPages/customers/base/components/CustomerAccountingCodeModal.vue'
+import TahesabRetryModal from '@/components/TahesabRetryModal.vue'
+import PargarRetryModal from '@/components/PargarRetryModal.vue'
+import {
+  accountingProviderSetting,
+  customerDirectSmsEnabledSetting,
+  initAccountingSettingsFromApi,
+  initWalletSettingsFromApi,
+  pargarEnabledSetting,
+  tahesabEnabledSetting
+} from '@/utils/config'
+import { isValidAccountingCode } from '@/utils/accountingCode'
+
+const router = useRouter()
+const loading = ref(false)
+const actionLoading = ref(false)
+const rows = ref<Customer[]>([])
+const count = ref(0)
+let pollTimer: ReturnType<typeof setInterval> | null = null
+
+const sheetVisible = ref(false)
+const selectedItem = ref<Customer | null>(null)
+
+const showWalletCharge = ref(false)
+const chargeCustomerId = ref<number>()
+
+const directSmsVisible = ref(false)
+const directSmsCustomer = ref<Customer | null>(null)
+
+const accountingCodeVisible = ref(false)
+const accountingCodeCustomer = ref<Customer | null>(null)
+
+const confirmVisible = ref(false)
+const confirmInfo = ref<Customer>()
+
+const tahesabRegisterVisible = ref(false)
+const tahesabCustomer = ref<Customer>()
+const tahesabEnabled = tahesabEnabledSetting
+const pargarRegisterVisible = ref(false)
+const pargarCustomer = ref<Customer>()
+const pargarEnabled = pargarEnabledSetting
+const customerDirectSmsEnabled = customerDirectSmsEnabledSetting
+
+const accountingEnabled = computed(() => {
+  const provider = accountingProviderSetting.value
+  return provider === 'pargar' || provider === 'tahesab'
+})
+
+const editVisible = ref(false)
+const editFormRef = ref<FormInstance>()
+const editId = ref<number>()
+const editForm = ref<Partial<Customer>>({})
+
+function formatSeen(v?: string | null) {
+  return v ? toJalali(v) : '—'
+}
+
+function openSheet(row: Customer) {
+  selectedItem.value = row
+  sheetVisible.value = true
+}
+
+function goInfo(row: Customer) {
+  sheetVisible.value = false
+  void router.push({ name: 'customerMain_limitedOrder', query: { infoId: String(row.id) } })
+}
+
+function openEdit(row: Customer) {
+  sheetVisible.value = false
+  editId.value = row.id
+  editForm.value = cloneDeep(row)
+  editVisible.value = true
+}
+
+async function submitEdit() {
+  try {
+    await editFormRef.value?.validate()
+    if (!editId.value) return
+    actionLoading.value = true
+    await updateCustomer(editId.value, editForm.value as Customer)
+    message.success('ویرایش با موفقیت انجام شد')
+    editVisible.value = false
+    await load()
+  } catch (e) {
+    console.error(e)
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+function openWalletCharge(row: Customer) {
+  sheetVisible.value = false
+  chargeCustomerId.value = row.id
+  showWalletCharge.value = true
+}
+
+function openDirectSms(row: Customer) {
+  sheetVisible.value = false
+  directSmsCustomer.value = row
+  directSmsVisible.value = true
+}
+
+function openAccountingCodeEdit(row: Customer) {
+  sheetVisible.value = false
+  accountingCodeCustomer.value = row
+  accountingCodeVisible.value = true
+}
+
+function openConfirmUser(row: Customer) {
+  sheetVisible.value = false
+  confirmInfo.value = row
+  confirmVisible.value = true
+}
+
+function openTahesabRegister(row: Customer) {
+  tahesabCustomer.value = row
+  tahesabRegisterVisible.value = true
+}
+
+function openPargarRegister(row: Customer) {
+  pargarCustomer.value = row
+  pargarRegisterVisible.value = true
+}
+
+function handleArchive(row: Customer) {
+  Modal.confirm({
+    title: 'آیا مشتری را بایگانی می کنید؟',
+    okText: 'تایید',
+    cancelText: 'رد',
+    centered: true,
+    zIndex: MODAL_ABOVE_ACTION_SHEET_Z_INDEX,
+    onOk: () => archiveFunction(row.id)
+  })
+}
+
+async function archiveFunction(id?: number) {
+  if (!id) return
+  try {
+    actionLoading.value = true
+    await changeCustomerArchive(id)
+    message.success('مشتری با موفقیت بایگانی شد.')
+    sheetVisible.value = false
+    await load()
+  } catch (e) {
+    console.error(e)
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+async function changeCustomerActivationFunction(id?: number) {
+  if (!id) return
+  try {
+    actionLoading.value = true
+    await changeCustomerActivation(id)
+    message.success('تغییر وضعیت با موفقیت انجام شد')
+    await load()
+  } catch (e) {
+    console.error(e)
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+async function changeCustomerOrderActivationFunction(id?: number) {
+  if (!id) return
+  try {
+    actionLoading.value = true
+    await changeCustomerOrderActivation(id)
+    message.success('تغییر وضعیت سفارش دهی با موفقیت انجام شد')
+    await load()
+  } catch (e) {
+    console.error(e)
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+async function confirmUserFunction() {
+  try {
+    actionLoading.value = true
+    await confirmUser(confirmInfo.value?.id)
+    confirmVisible.value = false
+    message.success('تایید کاربر انجام شد')
+    await load()
+  } catch (e) {
+    console.log(e)
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+async function load() {
+  loading.value = true
+  try {
+    const res = await getOnlineCustomers()
+    rows.value = res?.rows ?? []
+    count.value = res?.count ?? rows.value.length
+    if (selectedItem.value?.id) {
+      selectedItem.value = rows.value.find((r) => r.id === selectedItem.value?.id) ?? null
+      if (!selectedItem.value) sheetVisible.value = false
+    }
+  } catch (e) {
+    console.log(e)
+    message.error('دریافت لیست آنلاین ممکن نیست')
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  void initAccountingSettingsFromApi()
+  void initWalletSettingsFromApi()
+  void load()
+  pollTimer = setInterval(() => {
+    void load()
+  }, 30000)
+})
+
+onUnmounted(() => {
+  if (pollTimer) clearInterval(pollTimer)
+})
+</script>
+
+<style scoped>
+.online-page__hero {
+  padding: 1rem 1.15rem;
+  border-radius: 1rem;
+  border: 1px solid var(--admin-border, rgba(212, 175, 55, 0.35));
+  background: linear-gradient(
+    135deg,
+    rgba(212, 175, 55, 0.12) 0%,
+    rgba(34, 197, 94, 0.08) 55%,
+    transparent 100%
+  );
+}
+
+.online-page__title {
+  font-size: 1.15rem;
+  font-weight: 800;
+  color: var(--admin-text, #f5f5f5);
+}
+
+.online-page__sub {
+  font-size: 0.8rem;
+  color: var(--admin-text-secondary, #a3a3a3);
+}
+
+.online-page__count {
+  @apply flex items-center gap-2 rounded-full px-3 py-1.5 text-sm;
+  background: rgba(34, 197, 94, 0.12);
+  border: 1px solid rgba(34, 197, 94, 0.35);
+  color: #4ade80;
+}
+
+.online-page__count-dot {
+  @apply h-2.5 w-2.5 rounded-full bg-green-500 shrink-0;
+  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
+  animation: online-pulse 1.6s ease-out infinite;
+}
+
+.online-page__empty {
+  @apply flex flex-col items-center justify-center py-16 text-center;
+  color: var(--admin-text-secondary, #a3a3a3);
+}
+
+.online-page__empty-dot {
+  @apply h-3 w-3 rounded-full bg-gray-500 opacity-60;
+}
+
+.online-page__grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr));
+  gap: 0.85rem;
+  max-height: calc(100vh - 14rem);
+}
+
+.online-card {
+  position: relative;
+  padding: 1rem 1rem 0.9rem;
+  border-radius: 0.9rem;
+  border: 1px solid rgba(34, 197, 94, 0.28);
+  background: linear-gradient(160deg, rgba(34, 197, 94, 0.1) 0%, rgba(0, 0, 0, 0.2) 70%);
+  overflow: hidden;
+  cursor: pointer;
+  transition: border-color 0.15s ease, transform 0.15s ease;
+}
+
+.online-card:hover {
+  border-color: rgba(34, 197, 94, 0.55);
+  transform: translateY(-1px);
+}
+
+.online-card::before {
+  content: '';
+  position: absolute;
+  inset-inline-start: 0;
+  top: 0;
+  bottom: 0;
+  width: 3px;
+  background: #22c55e;
+}
+
+.online-card__top {
+  @apply flex items-center gap-2 mb-2;
+}
+
+.online-card__pulse {
+  @apply h-2.5 w-2.5 rounded-full bg-green-500;
+  animation: online-pulse 1.6s ease-out infinite;
+}
+
+.online-card__badge {
+  @apply text-xs font-700;
+  color: #4ade80;
+}
+
+.online-card__name {
+  font-size: 1rem;
+  font-weight: 800;
+  color: var(--admin-text, #f5f5f5);
+}
+
+.online-card__mobile {
+  margin-top: 0.25rem;
+  font-size: 0.85rem;
+  color: var(--admin-gold-light, #d4af37);
+  font-weight: 600;
+}
+
+.online-card__meta {
+  @apply mt-3 flex items-center justify-between gap-2 text-xs;
+  color: var(--admin-text-secondary, #a3a3a3);
+}
+
+.online-card__actions {
+  @apply mt-3 flex flex-wrap items-center justify-center gap-2 pt-2;
+  border-top: 1px solid rgba(255, 255, 255, 0.08);
+}
+
+@keyframes online-pulse {
+  0% {
+    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.55);
+  }
+  70% {
+    box-shadow: 0 0 0 10px rgba(34, 197, 94, 0);
+  }
+  100% {
+    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
+  }
+}
+</style>
diff --git a/src/pages/menuPages/hesabKetab/index.vue b/src/pages/menuPages/hesabKetab/index.vue
index 9adfa37..3f720da 100644
--- a/src/pages/menuPages/hesabKetab/index.vue
+++ b/src/pages/menuPages/hesabKetab/index.vue
@@ -18,14 +18,21 @@
 </template>
 
 <script setup lang="ts">
+import { computed, onMounted } from 'vue'
+import { useRoute } from 'vue-router'
 import BasicMenu from '@/components/BasicMenu/index.vue'
 import { useRouterStore } from '@core/stores/router'
 import { get } from 'lodash'
 import type { RouteRecordRaw } from 'vue-router'
-import { conditionalOrderEnabledSetting } from '@/utils/config'
+import { conditionalOrderEnabledSetting, initWalletSettingsFromApi } from '@/utils/config'
 
 const routerStore = useRouterStore()
 const route = useRoute()
+
+onMounted(() => {
+  void initWalletSettingsFromApi()
+})
+
 const menu = computed(() => {
   const item = routerStore.routes.find((item) => item.name === 'hesabKetab')
   const children = get(item, 'children[0].children', []) as RouteRecordRaw[]
diff --git a/src/pages/menuPages/products/base/components/ProductEditorFormBody.vue b/src/pages/menuPages/products/base/components/ProductEditorFormBody.vue
index b428318..6cc7606 100644
--- a/src/pages/menuPages/products/base/components/ProductEditorFormBody.vue
+++ b/src/pages/menuPages/products/base/components/ProductEditorFormBody.vue
@@ -800,10 +800,6 @@ defineExpose({
   margin-bottom: 1rem;
 }
 
-.product-editor-tabs :deep(.ant-tabs-tab) {
-  padding: 0.5rem 0.75rem;
-}
-
 .product-editor-panel {
   border: 1px solid var(--ant-color-border-secondary, rgba(0, 0, 0, 0.06));
   border-radius: 0.5rem;
diff --git a/src/router/routes/customers.ts b/src/router/routes/customers.ts
index fbf0b1f..eb265ad 100644
--- a/src/router/routes/customers.ts
+++ b/src/router/routes/customers.ts
@@ -35,7 +35,8 @@ const Customers: RouteRecordRaw = {
           meta: {
             // permissionsKey: 'config.limitedOrder',
             icon: 'vuesax-linear:people',
-            title: 'لیست مشتریان'
+            title: 'لیست مشتریان',
+            order: 0
           }
         },
         {
@@ -45,7 +46,18 @@ const Customers: RouteRecordRaw = {
           meta: {
             // permissionsKey: 'user',
             icon: 'vuesax-linear:save-2',
-            title: 'بایگانی'
+            title: 'بایگانی',
+            order: 1
+          }
+        },
+        {
+          name: 'customerMain_online',
+          path: 'online',
+          component: () => import('@/pages/menuPages/customers/online/index.vue'),
+          meta: {
+            icon: 'vuesax-linear:wifi',
+            title: 'کاربران آنلاین',
+            order: 2
           }
         },
         {
@@ -56,7 +68,7 @@ const Customers: RouteRecordRaw = {
             // permissionsKey: 'user',
             icon: 'vuesax-linear:card-tick',
             title: 'احراز هویت',
-
+            order: 3
           }
         }
       ]
diff --git a/src/utils/config.ts b/src/utils/config.ts
index e5326de..944b12f 100644
--- a/src/utils/config.ts
+++ b/src/utils/config.ts
@@ -163,18 +163,9 @@ async function bootstrapSettingsFromApi(): Promise<void> {
     setCachedMainMetal(mainMetalRow?.value)
     const { setCachedMainWalletProductIds } = await import('@/components/mobile/utils/wallet')
     setCachedMainWalletProductIds(parseMainWalletProductIds(mainWalletRow?.value))
-  } catch {
-    storeModeFromSettings = false
-    setBannerEnabledFromSettings(false)
-    setTrackingSystemsEnabledFromSettings(false)
-    setCustomerDirectSmsEnabledFromSettings(false)
-    setConditionalOrderEnabledFromSettings(false)
-    applyAccountingProviderFromRows([])
-    setCachedMainMetal(null)
-    const { setCachedMainWalletProductIds } = await import('@/components/mobile/utils/wallet')
-    setCachedMainWalletProductIds([])
-  } finally {
     settingsBootstrapped = true
+  } catch {
+    // Allow retry on next init* call — do not lock flags to false forever.
   }
 }
 
diff --git a/src/utils/customerPresence.ts b/src/utils/customerPresence.ts
new file mode 100644
index 0000000..a07672f
--- /dev/null
+++ b/src/utils/customerPresence.ts
@@ -0,0 +1,18 @@
+/** هم‌تراز با CustomerPresenceService::ONLINE_THRESHOLD_SECONDS روی سرور */
+export const CUSTOMER_ONLINE_THRESHOLD_MS = 2 * 60 * 1000
+
+export type CustomerPresenceKind = 'online' | 'offline' | 'never'
+
+export function getCustomerPresenceKind(
+  lastSeenAt: string | Date | null | undefined
+): CustomerPresenceKind {
+  if (!lastSeenAt) return 'never'
+  const t = lastSeenAt instanceof Date ? lastSeenAt.getTime() : new Date(lastSeenAt).getTime()
+  if (!Number.isFinite(t)) return 'never'
+  if (Date.now() - t < CUSTOMER_ONLINE_THRESHOLD_MS) return 'online'
+  return 'offline'
+}
+
+export function isCustomerOnline(lastSeenAt: string | Date | null | undefined): boolean {
+  return getCustomerPresenceKind(lastSeenAt) === 'online'
+}