fetch(modify):修复角色分配权限

src/views/order-management/order-list/index.vue

@@ -63,10 +63,27 @@
                 v-model="createForm.package_ids"
                 :placeholder="t('orderManagement.createForm.packageIdsPlaceholder')"
                 multiple
+                filterable
+                remote
+                reserve-keyword
+                :remote-method="searchPackages"
+                :loading="packageSearchLoading"
+                clearable
                 style="width: 100%"
               >
-                <!-- TODO: Load actual packages from API -->
-                <ElOption label="套餐示例" :value="1" />
+                <ElOption
+                  v-for="pkg in packageOptions"
+                  :key="pkg.id"
+                  :label="`${pkg.package_name} (¥${(pkg.price / 100).toFixed(2)})`"
+                  :value="pkg.id"
+                >
+                  <div style="display: flex; justify-content: space-between">
+                    <span>{{ pkg.package_name }}</span>
+                    <span style="color: var(--el-text-color-secondary); font-size: 12px">
+                      ¥{{ (pkg.price / 100).toFixed(2) }}
+                    </span>
+                  </div>
+                </ElOption>
               </ElSelect>
             </ElFormItem>
             <ElFormItem
@@ -240,7 +257,7 @@
 <script setup lang="ts">
   import { h } from 'vue'
   import { useI18n } from 'vue-i18n'
-  import { OrderService, CardService, DeviceService } from '@/api/modules'
+  import { OrderService, CardService, DeviceService, PackageManageService } from '@/api/modules'
   import { ElMessage, ElMessageBox, ElTag } from 'element-plus'
   import type { FormInstance, FormRules } from 'element-plus'
   import type {
@@ -253,7 +270,8 @@
     OrderPaymentMethod,
     OrderCommissionStatus,
     StandaloneIotCard,
-    Device
+    Device,
+    PackageResponse
   } from '@/types/api'
   import type { SearchFormItem } from '@/types'
   import { useCheckedColumns } from '@/composables/useCheckedColumns'
@@ -384,6 +402,10 @@
 
   const orderList = ref<Order[]>([])
 
+  // 套餐搜索相关
+  const packageOptions = ref<PackageResponse[]>([])
+  const packageSearchLoading = ref(false)
+
   // IoT卡搜索相关
   const iotCardOptions = ref<StandaloneIotCard[]>([])
   const cardSearchLoading = ref(false)
@@ -392,17 +414,34 @@
   const deviceOptions = ref<Device[]>([])
   const deviceSearchLoading = ref(false)
 
+  // 搜索套餐（根据套餐名称）
+  const searchPackages = async (query: string) => {
+    packageSearchLoading.value = true
+    try {
+      const res = await PackageManageService.getPackages({
+        package_name: query || undefined,
+        page: 1,
+        page_size: 20,
+        status: 1, // 只获取启用的套餐
+        shelf_status: 1 // 只获取已上架的套餐
+      })
+      if (res.code === 0) {
+        packageOptions.value = res.data.items || []
+      }
+    } catch (error) {
+      console.error('Search packages failed:', error)
+      packageOptions.value = []
+    } finally {
+      packageSearchLoading.value = false
+    }
+  }
+
   // 搜索IoT卡（根据ICCID）
   const searchIotCards = async (query: string) => {
-    if (!query) {
-      iotCardOptions.value = []
-      return
-    }
-
     cardSearchLoading.value = true
     try {
       const res = await CardService.getStandaloneIotCards({
-        iccid: query,
+        iccid: query || undefined,
         page: 1,
         page_size: 20
       })
@@ -419,15 +458,10 @@
 
   // 搜索设备（根据设备号device_no）
   const searchDevices = async (query: string) => {
-    if (!query) {
-      deviceOptions.value = []
-      return
-    }
-
     deviceSearchLoading.value = true
     try {
       const res = await DeviceService.getDevices({
-        device_no: query,
+        device_no: query || undefined,
         page: 1,
         page_size: 20
       })
@@ -656,8 +690,29 @@
   // 显示创建订单对话框
   const showCreateDialog = async () => {
     createDialogVisible.value = true
-    // 默认加载20条IoT卡和设备数据
-    await Promise.all([loadDefaultIotCards(), loadDefaultDevices()])
+    // 默认加载20条套餐、IoT卡和设备数据
+    await Promise.all([loadDefaultPackages(), loadDefaultIotCards(), loadDefaultDevices()])
+  }
+
+  // 加载默认套餐列表
+  const loadDefaultPackages = async () => {
+    packageSearchLoading.value = true
+    try {
+      const res = await PackageManageService.getPackages({
+        page: 1,
+        page_size: 20,
+        status: 1, // 只获取启用的套餐
+        shelf_status: 1 // 只获取已上架的套餐
+      })
+      if (res.code === 0) {
+        packageOptions.value = res.data.items || []
+      }
+    } catch (error) {
+      console.error('Load default packages failed:', error)
+      packageOptions.value = []
+    } finally {
+      packageSearchLoading.value = false
+    }
   }
 
   // 加载默认IoT卡列表
@@ -709,7 +764,8 @@
     createForm.iot_card_id = null
     createForm.device_id = null
 
-    // 清空IoT卡和设备搜索结果
+    // 清空套餐、IoT卡和设备搜索结果
+    packageOptions.value = []
     iotCardOptions.value = []
     deviceOptions.value = []
   }