Initial commit: fabric-trade-admin panel with responsive layouts and UI refinements.

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

src/components/ui/ActiveSwitchCell.vue

@@ -0,0 +1,52 @@
+<script setup lang="ts">
+import BaseSwitch from '@/components/ui/BaseSwitch.vue'
+import { mockPersistToggle, useAsyncToggle } from '@/composables/useAsyncToggle'
+import { confirm } from '@/composables/useConfirm'
+
+const props = defineProps<{
+  id: string
+  modelValue: boolean
+  entityName: string
+  entityType?: string
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [boolean]
+}>()
+
+const { toggle, isLoading, hasError } = useAsyncToggle({
+  onPersist: async () => {
+    await mockPersistToggle()
+  },
+  successMessage: (value) =>
+    value
+      ? `${props.entityType ?? 'مورد'} «${props.entityName}» فعال شد.`
+      : `${props.entityType ?? 'مورد'} «${props.entityName}» غیرفعال شد.`,
+})
+
+async function onChange(next: boolean) {
+  if (next === props.modelValue) return
+
+  if (!next) {
+    const ok = await confirm({
+      title: `غیرفعال‌سازی ${props.entityType ?? 'مورد'}`,
+      message: `آیا از غیرفعال کردن «${props.entityName}» مطمئن هستید؟`,
+      tone: 'danger',
+      confirmLabel: 'غیرفعال کردن',
+    })
+    if (!ok) return
+  }
+
+  const result = await toggle(props.id, props.modelValue)
+  emit('update:modelValue', result)
+}
+</script>
+
+<template>
+  <BaseSwitch
+    :model-value="modelValue"
+    :loading="isLoading(id)"
+    :error="hasError(id)"
+    @update:model-value="onChange"
+  />
+</template>