Add AdminSelect, polish tables, and enable order detail print.

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

src/views/orders/components/DesktopOrdersPage.vue

@@ -92,6 +92,18 @@ function handleCashReceipt() {
   goCashReceipt(selectedOrder.value)
 }
 
+function printOrderDetail() {
+  if (!selectedOrder.value) return
+  document.documentElement.classList.add('printing-order-detail')
+  const cleanup = () => {
+    document.documentElement.classList.remove('printing-order-detail')
+    window.removeEventListener('afterprint', cleanup)
+  }
+  window.addEventListener('afterprint', cleanup)
+  window.setTimeout(cleanup, 60_000)
+  window.print()
+}
+
 function runMenuAction(action: 'detail' | 'pricing' | 'checks' | 'cash') {
   const order = menuOrder.value
   if (!order) return
@@ -284,7 +296,11 @@ function runMenuAction(action: 'detail' | 'pricing' | 'checks' | 'cash') {
           <AdminIcon name="sms" :size="16" />
           ارسال پیامک
         </button>
-        <button type="button" class="admin-btn admin-btn--outline admin-btn--sm">
+        <button
+          type="button"
+          class="admin-btn admin-btn--outline admin-btn--sm"
+          @click="printOrderDetail"
+        >
           <AdminIcon name="print" :size="16" />
           چاپ
         </button>

src/views/orders/components/OrderAddModal.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
+import { computed } from 'vue'
 import BaseModal from '@/components/ui/BaseModal.vue'
+import AdminSelect from '@/components/ui/AdminSelect.vue'
 import { useOrdersPageContext } from '@/composables/useOrdersPage'
 
 const {
@@ -11,6 +13,15 @@ const {
   closeAddModal,
   submitAddOrder,
 } = useOrdersPageContext()
+
+const companyOptions = computed(() =>
+  companies.value.map((company) => ({ value: company.id, label: company.name })),
+)
+
+const settlementOptions = [
+  { value: 'check', label: 'چکی' },
+  { value: 'cash', label: 'نقدی' },
+]
 </script>
 
 <template>
@@ -31,19 +42,23 @@ const {
 
       <div class="admin-form__row">
         <div class="admin-form__field">
-          <label for="order-company">شرکت <span class="admin-form__required">*</span></label>
-          <select id="order-company" v-model="form.companyId" class="admin-input">
-            <option v-for="company in companies" :key="company.id" :value="company.id">
-              {{ company.name }}
-            </option>
-          </select>
+          <label>شرکت <span class="admin-form__required">*</span></label>
+          <AdminSelect
+            v-model="form.companyId"
+            block
+            aria-label="انتخاب شرکت"
+            placeholder="انتخاب شرکت"
+            :options="companyOptions"
+          />
         </div>
         <div class="admin-form__field">
-          <label for="order-settlement">روش تسویه</label>
-          <select id="order-settlement" v-model="form.settlementMethod" class="admin-input">
-            <option value="check">چکی</option>
-            <option value="cash">نقدی</option>
-          </select>
+          <label>روش تسویه</label>
+          <AdminSelect
+            v-model="form.settlementMethod"
+            block
+            aria-label="روش تسویه"
+            :options="settlementOptions"
+          />
         </div>
       </div>
 

src/views/orders/components/OrderDetailContent.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed, ref, watch } from 'vue'
 import AdminIcon from '@/components/icons/AdminIcon.vue'
+import AdminSelect from '@/components/ui/AdminSelect.vue'
 import StatusBadge from '@/components/ui/StatusBadge.vue'
 import { formatCurrency, formatMeterage, formatNumber } from '@/utils/format'
 import { RAW_ORDER_STATUS_LABELS, rawStatusLabel } from '@/utils/orderStatus'
@@ -45,6 +46,14 @@ const statusOptions = computed<RawOrderStatus[]>(() =>
     : [...transitions.value],
 )
 
+const statusSelectOptions = computed(() => [
+  { value: '', label: 'انتخاب کنید…' },
+  ...statusOptions.value.map((status) => ({
+    value: status,
+    label: rawStatusLabel(status),
+  })),
+])
+
 const noteRequired = computed(() => manualMode.value)
 const canSubmitStatus = computed(
   () => !!nextStatus.value && (!noteRequired.value || statusNote.value.trim().length > 0),
@@ -83,7 +92,7 @@ function submitStatus() {
         <p class="order-detail__raw-status">{{ rawStatusLabel(order.rawStatus) }}</p>
       </div>
 
-      <div class="order-detail__actions">
+      <div class="order-detail__actions no-print">
         <button type="button" class="admin-btn admin-btn--primary admin-btn--sm" @click="emit('pricing')">
           قیمت‌گذاری سفارش
         </button>
@@ -204,7 +213,7 @@ function submitStatus() {
       </ul>
     </section>
 
-    <section class="order-detail__section order-detail__status">
+    <section class="order-detail__section order-detail__status no-print">
       <div class="order-detail__status-head">
         <h3 class="order-detail__section-title">تغییر وضعیت</h3>
         <label class="order-detail__manual">
@@ -222,13 +231,14 @@ function submitStatus() {
 
       <div v-if="statusOptions.length" class="order-detail__status-form">
         <div class="admin-form__field">
-          <label for="next-status">وضعیت بعدی</label>
-          <select id="next-status" v-model="nextStatus" class="admin-input">
-            <option value="">انتخاب کنید…</option>
-            <option v-for="status in statusOptions" :key="status" :value="status">
-              {{ rawStatusLabel(status) }}
-            </option>
-          </select>
+          <label>وضعیت بعدی</label>
+          <AdminSelect
+            v-model="nextStatus"
+            block
+            aria-label="وضعیت بعدی"
+            placeholder="انتخاب کنید…"
+            :options="statusSelectOptions"
+          />
         </div>
 
         <div class="admin-form__field">