修改bug

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

@@ -5,6 +5,7 @@
       <ArtSearchBar
         v-model:filter="searchForm"
         :items="searchFormItems"
+        :show-expand="false"
         @reset="handleReset"
         @search="handleSearch"
       ></ArtSearchBar>
@@ -31,9 +32,6 @@
           :pageSize="pagination.pageSize"
           :total="pagination.total"
           :marginTop="10"
-          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
-          :default-expand-all="false"
-          :pagination="false"
           :actions="getActions"
           :actionsWidth="160"
           @selection-change="handleSelectionChange"
@@ -76,20 +74,15 @@
             <ElRow :gutter="20" v-if="dialogType === 'add'">
               <ElCol :span="12">
                 <ElFormItem label="上级店铺" prop="parent_id">
-                  <ElTreeSelect
+                  <ElCascader
                     v-model="formData.parent_id"
-                    :data="parentShopTreeData"
+                    :options="parentShopCascadeOptions"
+                    :props="cascadeProps"
                     placeholder="一级店铺可不选"
                     filterable
                     clearable
-                    check-strictly
-                    :render-after-expand="false"
-                    :props="{
-                      label: 'shop_name',
-                      value: 'id',
-                      children: 'children'
-                    }"
                     style="width: 100%"
+                    @change="handleParentShopChange"
                   />
                 </ElFormItem>
               </ElCol>
@@ -287,7 +280,6 @@
     ElSwitch,
     ElSelect,
     ElOption,
-    ElTreeSelect,
     ElCascader
   } from 'element-plus'
   import { ref, reactive, computed, nextTick, onMounted } from 'vue'
@@ -312,12 +304,41 @@
   const dialogVisible = ref(false)
   const loading = ref(false)
   const submitLoading = ref(false)
-  const parentShopLoading = ref(false)
-  const parentShopList = ref<ShopResponse[]>([])
-  const parentShopTreeData = ref<ShopResponse[]>([])
   const defaultRoleLoading = ref(false)
   const defaultRoleList = ref<any[]>([])
 
+  // 级联选择相关
+  const parentShopCascadeOptions = ref<any[]>([])
+  const cascadeProps = {
+    lazy: true,
+    checkStrictly: true, // 允许选择任意一级
+    lazyLoad: async (node: any, resolve: any) => {
+      const { level, value } = node
+      // level 0 表示根节点，不传 parent_id；level > 0 传 parent_id
+      const parentId = level === 0 ? undefined : value
+
+      try {
+        const res = await ShopService.getShopsCascade({ parent_id: parentId })
+        if (res.code === 0) {
+          const nodes = (res.data || []).map((item: any) => ({
+            value: item.id,
+            label: item.shop_name,
+            leaf: !item.has_children
+          }))
+          resolve(nodes)
+        } else {
+          resolve([])
+        }
+      } catch (error) {
+        console.error('加载店铺级联数据失败:', error)
+        resolve([])
+      }
+    },
+    value: 'value',
+    label: 'label',
+    children: 'children'
+  }
+
   // 默认角色管理相关状态
   const defaultRolesDialogVisible = ref(false)
   const defaultRolesLoading = ref(false)
@@ -330,6 +351,7 @@
   const initialSearchState = {
     shop_name: '',
     shop_code: '',
+    parent_shop_name: '',
     parent_id: undefined as number | undefined,
     level: undefined as number | undefined,
     status: undefined as number | undefined
@@ -386,24 +408,6 @@
         placeholder: '请输入店铺编号'
       }
     },
-    {
-      label: '上级店铺',
-      prop: 'parent_id',
-      type: 'tree-select',
-      config: {
-        data: parentShopTreeData.value,
-        clearable: true,
-        filterable: true,
-        checkStrictly: true,
-        renderAfterExpand: false,
-        props: {
-          label: 'shop_name',
-          value: 'id',
-          children: 'children'
-        },
-        placeholder: '请选择上级店铺'
-      }
-    },
     {
       label: '状态',
       prop: 'status',
@@ -420,6 +424,7 @@
   const columnOptions = [
     { label: '店铺名称', prop: 'shop_name' },
     { label: '店铺编号', prop: 'shop_code' },
+    { label: '上级店铺', prop: 'parent_shop_name' },
     { label: '所在地区', prop: 'region' },
     { label: '联系人', prop: 'contact_name' },
     { label: '联系电话', prop: 'contact_phone' },
@@ -458,9 +463,6 @@
       formData.init_phone = ''
       formData.default_role_id = undefined
     } else {
-      // 新增模式下重新获取上级店铺列表
-      await loadParentShopList()
-
       formData.id = 0
       formData.shop_name = ''
       formData.shop_code = ''
@@ -499,8 +501,8 @@
           await ShopService.deleteShop(row.id)
           ElMessage.success('删除成功')
           await getShopList()
-          // 删除成功后也更新上级店铺列表
-          await loadParentShopList()
+          // 删除成功后也重新加载顶级店铺
+          await loadTopLevelShops()
         } catch (error) {
           console.error(error)
         }
@@ -524,6 +526,13 @@
       minWidth: 160,
       showOverflowTooltip: true
     },
+    {
+      prop: 'parent_shop_name',
+      label: '上级店铺',
+      width: 150,
+      showOverflowTooltip: true,
+      formatter: (row: ShopResponse) => row.parent_shop_name || '-'
+    },
     {
       prop: 'region',
       label: '所在地区',
@@ -621,7 +630,7 @@
     id: 0,
     shop_name: '',
     shop_code: '',
-    parent_id: undefined as number | undefined,
+    parent_id: undefined as number | number[] | undefined, // 支持级联选择器的数组格式
     region: [] as string[], // 省市区级联数据
     province: '',
     city: '',
@@ -682,54 +691,55 @@
     }
   }
 
-  onMounted(() => {
-    getShopList()
-    loadParentShopList()
-    searchDefaultRoles('') // 加载初始默认角色列表
-  })
-
-  // 加载上级店铺列表(用于新增对话框和搜索栏,获取所有店铺构建树形结构)
-  const loadParentShopList = async (shopName?: string) => {
-    parentShopLoading.value = true
-    try {
-      const params: any = {
-        page: 1,
-        page_size: 9999 // 获取所有数据用于构建树形结构
-      }
-      if (shopName) {
-        params.shop_name = shopName
-      }
-      const res = await ShopService.getShops(params)
-      if (res.code === 0) {
-        const items = res.data.items || []
-        parentShopList.value = items
-        // 构建树形数据
-        parentShopTreeData.value = buildTreeData(items)
-      }
-    } catch (error) {
-      console.error('获取上级店铺列表失败:', error)
-    } finally {
-      parentShopLoading.value = false
+  // 处理级联选择变化
+  const handleParentShopChange = (value: any) => {
+    // 级联选择器返回的是数组，取最后一个值作为 parent_id
+    if (Array.isArray(value) && value.length > 0) {
+      formData.parent_id = value[value.length - 1]
+    } else {
+      formData.parent_id = undefined
     }
   }
 
+  // 加载顶级店铺数据（用于级联选择器初始化）
+  const loadTopLevelShops = async () => {
+    try {
+      const res = await ShopService.getShopsCascade({ parent_id: undefined })
+      if (res.code === 0) {
+        parentShopCascadeOptions.value = (res.data || []).map((item: any) => ({
+          value: item.id,
+          label: item.shop_name,
+          leaf: !item.has_children
+        }))
+      }
+    } catch (error) {
+      console.error('加载顶级店铺失败:', error)
+    }
+  }
+
+  onMounted(() => {
+    getShopList()
+    loadTopLevelShops() // 加载顶级店铺用于级联选择
+    searchDefaultRoles('') // 加载初始默认角色列表
+  })
+
   // 获取店铺列表
   const getShopList = async () => {
     loading.value = true
     try {
       const params = {
-        page: 1,
-        page_size: 9999, // 获取所有数据用于构建树形结构
+        page: pagination.currentPage,
+        page_size: pagination.pageSize,
         shop_name: searchForm.shop_name || undefined,
         shop_code: searchForm.shop_code || undefined,
+        parent_shop_name: searchForm.parent_shop_name || undefined,
         parent_id: searchForm.parent_id,
         level: searchForm.level,
         status: searchForm.status
       }
       const res = await ShopService.getShops(params)
       if (res.code === 0) {
-        const items = res.data.items || []
-        tableData.value = buildTreeData(items)
+        tableData.value = res.data.items || []
         pagination.total = res.data.total || 0
       }
     } catch (error) {
@@ -739,33 +749,6 @@
     }
   }
 
-  // 构建树形数据
-  const buildTreeData = (items: ShopResponse[]) => {
-    const map = new Map<number, ShopResponse & { children?: ShopResponse[] }>()
-    const tree: ShopResponse[] = []
-
-    // 先将所有项放入 map
-    items.forEach((item) => {
-      map.set(item.id, { ...item, children: [] })
-    })
-
-    // 构建树形结构
-    items.forEach((item) => {
-      const node = map.get(item.id)!
-      if (item.parent_id && map.has(item.parent_id)) {
-        // 有父节点，添加到父节点的 children 中
-        const parent = map.get(item.parent_id)!
-        if (!parent.children) parent.children = []
-        parent.children.push(node)
-      } else {
-        // 没有父节点或父节点不存在，作为根节点
-        tree.push(node)
-      }
-    })
-
-    return tree
-  }
-
   const handleRefresh = () => {
     getShopList()
   }
@@ -825,8 +808,12 @@
               default_role_id: formData.default_role_id
             }
 
-            // 可选字段
-            if (formData.parent_id) data.parent_id = formData.parent_id
+            // 可选字段 - parent_id 可能是数组（级联选择器）或数字
+            if (formData.parent_id) {
+              data.parent_id = Array.isArray(formData.parent_id)
+                ? formData.parent_id[formData.parent_id.length - 1]
+                : formData.parent_id
+            }
             if (formData.province) data.province = formData.province
             if (formData.city) data.city = formData.city
             if (formData.district) data.district = formData.district
@@ -856,8 +843,8 @@
 
           dialogVisible.value = false
           await getShopList()
-          // 提交成功后也更新上级店铺列表
-          await loadParentShopList()
+          // 提交成功后也重新加载顶级店铺
+          await loadTopLevelShops()
         } catch (error) {
           console.error(error)
         } finally {