v1.0.2 更新内容

src/views/admin/system/menu/index.vue

@@ -14,8 +14,25 @@
         <!-- 表格头部 -->
         <ArtTableHeader :showZebra="false" v-model:columns="columnChecks" @refresh="handleRefresh">
           <template #left>
+            <el-segmented
+              v-model="yearVal"
+              size="large"
+              :options="segmentedOptions"
+              @change="searchArticleByYear"
+            >
+              <!-- <template #default="scope">
+                <div class="flex flex-col items-center gap-2 p-2">
+                  <div>{{ scope.item.label }}</div>
+                </div>
+              </template> -->
+            </el-segmented>
             <!-- 按钮权限：后端控制模式，使用自定义指令 -->
-            <ElButton v-auth="'system@menu_add'" @click="showModel('menu', null)" v-ripple>
+            <ElButton
+              v-auth="'system@menu_add'"
+              @click="showModel('menu', null)"
+              v-ripple
+              style="margin-left: 20px"
+            >
               添加菜单
             </ElButton>
             <ElButton @click="toggleExpand" v-ripple>
@@ -224,7 +241,7 @@
   import { SearchFormItem } from '@/types'
   import { systemService } from '@/api/systemApi'
   import { UserService } from '@/api/usersApi'
-
+  const yearVal = ref<any>('')
   defineOptions({ name: 'Menus' })
 
   const { hasAuth } = useAuth()
@@ -233,6 +250,20 @@
   const menuList = ref<any[]>([])
 
   const loading = ref(false)
+  const systemsListtab = ref<any>([])
+  const segmentedOptions = computed(() =>
+    Array.isArray(systemsListtab.value)
+      ? systemsListtab.value.map((item: any) => ({ label: item.name, value: item.id }))
+      : []
+  )
+  const getsystemsListtab = async () => {
+    const response = await UserService.getsystemsList()
+    const list = (response as any)?.data?.records ?? (response as any)?.records ?? response ?? []
+    systemsListtab.value = Array.isArray(list) ? list : []
+    if (!yearVal.value && systemsListtab.value.length > 0) {
+      yearVal.value = systemsListtab.value[0].id
+    }
+  }
   //系统
   const systemsList = ref<any>()
   const getsystemsList = async () => {
@@ -467,16 +498,37 @@
   const tableData = ref<AppRouteRecord[]>([])
 
   onMounted(() => {
+    getsystemsListtab()
     getTableData()
   })
-
+  const searchArticleByYear = () => {
+    getTableData()
+  }
+  // const handleSegmentedClick = (item: any) => {
+  //   // 若点击的是当前项也强制刷新
+  //   yearVal.value = item?.value ?? yearVal.value
+  //   getTableData()
+  // }
   const getTableData = async () => {
     loading.value = true
-    // const { res } = await systemService.getMenutreeList()
-    await systemService.getMenutreeList().then((res) => {
-      console.log(res)
-      menuList.value = res
-    })
+    // 清空旧数据，避免视觉上出现追加
+    menuList.value = []
+    tableData.value = []
+    // 并发安全：本次请求标识
+    requestCounter += 1
+    const reqId = requestCounter
+    const params: any = {
+      system_id: yearVal.value || '1'
+    }
+    try {
+      const res = await systemService.getMenutreeList(params)
+      // 若在等待过程中又发起了新请求，则丢弃本次结果
+      if (reqId !== requestCounter) return
+      menuList.value = Array.isArray(res) ? res : []
+    } catch (e) {
+      console.error(e)
+      menuList.value = []
+    }
     // console.log(res)
     // menuList.value = data
 
@@ -660,6 +712,9 @@
   const isExpanded = ref(false)
   const tableRef = ref()
 
+  // 数据请求并发保护计数器
+  let requestCounter = 0
+
   const toggleExpand = () => {
     isExpanded.value = !isExpanded.value
     nextTick(() => {