From de33c5d48adb55b940df24508e710f389caa7302 Mon Sep 17 00:00:00 2001
From: zq <136432190602163.com>
Date: Wed, 16 Jul 2025 10:44:19 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=86=E9=A1=B5=E7=BB=84=E4=BB=B6=E8=AF=B7?=
 =?UTF-8?q?=E6=B1=82=E9=80=BB=E8=BE=91=E6=8B=86=E5=88=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Page.vue            | 234 +++++++++++-------------------
 src/components/Page2.vue           | 284 ++++++++++++++++++++++++++++++++++++
 src/views/agent/checkOrderList.vue | 285 +++++++++++++++++++++----------------
 3 files changed, 528 insertions(+), 275 deletions(-)
 create mode 100644 src/components/Page2.vue

diff --git a/src/components/Page.vue b/src/components/Page.vue
index 9cedf6f..f1d42c1 100644
--- a/src/components/Page.vue
+++ b/src/components/Page.vue
@@ -1,20 +1,20 @@
 <template>
   <div class="pagination flex gap10">
     <!-- 首页按钮 -->
-    <GuipButton size="form" v-if="showFirstPage" @click="goToFirstPage" :disabled="page === 1">
+    <GuipButton size="form" v-if="showFirstPage" @click="goToFirstPage" :disabled="currentPage === 1">
       首页
     </GuipButton>
 
     <!-- 上一页按钮 -->
-    <GuipButton size="form" v-if="showPrevPage" @click="goToPrevPage" :disabled="page === 1">
+    <GuipButton size="form" v-if="showPrevPage" @click="goToPrevPage" :disabled="currentPage === 1">
       上一页
     </GuipButton>
 
     <!-- 当前页码 -->
-    <span v-if="showCurrentPage">第{{ page }}页</span>
+    <span v-if="showCurrentPage">第{{ currentPage }}页</span>
 
     <!-- 下一页按钮 -->
-    <GuipButton size="form" v-if="showNextPage" @click="goToNextPage" :disabled="!hasNextPage ">
+    <GuipButton size="form" v-if="showNextPage" @click="goToNextPage" :disabled="!hasNextPage">
       下一页
     </GuipButton>
 
@@ -30,7 +30,9 @@
     </div>
 
     <!-- 总记录数 -->
-    <span v-if="showTotalRecords" class="total-records">共{{ totalRecords }}条记录</span>
+    <span v-if="showTotalRecords" class="total-records">
+      共{{ totalRecords }}条记录
+    </span>
   </div>
 </template>
 
@@ -39,47 +41,52 @@ import GuipButton from '@/components/GuipButton.vue';
 
 export default {
   name: 'Pagination',
-  components:{GuipButton},
+  components: { GuipButton },
   props: {
-    // 接口URL
-    apiUrl: {
-      type: String,
-      required: true
+    // 当前页码
+    currentPage: {
+      type: Number,
+      default: 1
+    },
+    // 是否有下一页
+    hasNextPage: {
+      type: Boolean,
+      default: false
+    },
+    // 总记录数
+    totalRecords: {
+      type: [Number, String],
+      default: 0
     },
     // 每页条数
     pageSize: {
       type: Number,
       default: 10
     },
-    // 其他请求参数
-    extraParams: {
-      type: Object,
-      default: () => ({})
+    // 是否正在加载
+    isLoading: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
     return {
-      page: 1,
-      jumpPage: 1,
-      end_page:0,
-      hasNextPage: false,
-      minId: null,
-      maxId: null,
-      totalRecords: 0,
-      buttonType:'',
-      totalPages: 1,
-      isLoading: false,
-      token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
+      jumpPage: this.currentPage,
+      endPage: false
     }
   },
   computed: {
+    // 总页数
+    totalPages() {
+      return Math.ceil(this.totalRecords / this.pageSize)
+    },
     // 是否显示首页按钮
     showFirstPage() {
-      return this.page > 2
+      return this.currentPage > 2;
     },
     // 是否显示上一页按钮
     showPrevPage() {
-      return this.page > 1
+      return this.currentPage > 1 || this.endPage
     },
     // 是否显示当前页码
     showCurrentPage() {
@@ -87,11 +94,11 @@ export default {
     },
     // 是否显示下一页按钮
     showNextPage() {
-      return this.hasNextPage 
+      return this.hasNextPage && !this.endPage
     },
     // 是否显示尾页按钮
     showLastPage() {
-      return !(this.end_page > 0) || this.hasNextPage 
+      return !this.endPage
     },
     // 是否显示跳转
     showJump() {
@@ -99,157 +106,78 @@ export default {
     },
     // 是否显示总记录数
     showTotalRecords() {
-      return this.totalRecords > 0
+      return Number(this.totalRecords) > 0
     }
   },
-  created() {
-    this.fetchData()
+  watch: {
+    currentPage(newVal) {
+      this.jumpPage = newVal
+    }
   },
   methods: {
-    // 构建请求参数
-    buildParams() {
-      const params = {
-        pagesize: this.pageSize,
-        page:this.page,
-        ...this.extraParams
-      }
-   
-      // 如果不是第一页，添加maxid或minid
-      if (this.page > 1) {
-        if (this.page === this.totalPages) {
-          // 从尾页往前翻
-          params.maxid = this.maxId
-        } else {
-          // 正常翻页
-          if (this.buttonType == 'prev') {
-            params.maxid = this.maxId
-          } else {
-            params.minid = this.minId
-          }
-        }
-      }
-      if(this.end_page > 0){
-       delete params.page
-       delete params.maxid
-       delete params.minid
-       params.end_page = this.end_page
-      }else{
-        delete params.end_page
-      }
-
-      console.log(params,'params======');
-      return params
-    },
-
-    // 获取数据
-    async fetchData() {
-      console.log('-----执行了');
-      this.isLoading = true
-      this.$emit('changeLoad',true)
-      try {
-        this.$http('POST', this.apiUrl, this.buildParams(), {
-          headers: {
-            'Auth': this.token
-          }
-        }).then(response => {
-          const data = response.data
-          this.hasNextPage = data.is_has_next_page
-          this.minId = data.minid || null
-          this.maxId = data.maxid || null
-          this.totalRecords = data.total_records || 0
-          if(this.totalRecords > 0){
-            // 计算总页数
-            this.totalPages = Math.ceil(this.totalRecords / this.pageSize)
-            this.page = this.totalPages || 1
-            this.jumpPage = this.page 
-          }
-          // 通知父组件数据更新
-          this.$emit('update', data)
-          this.$emit('changeLoad',false)
-        })
-      } catch (error) {
-        console.error('分页请求失败:', error)
-        this.$emit('error', error)
-        this.$emit('changeLoad',false)
-      } finally {
-        this.isLoading = false
-        this.$emit('changeLoad',false)
-      }
-    },
-
     // 跳转到首页
     goToFirstPage() {
-      if (this.page === 1) return
-      this.page = 1
-      this.jumpPage = 1
-      this.end_page = 0;
-      this.buttonType = ''
-      this.fetchData()
+      if (this.currentPage === 1 || this.isLoading) return
+      this.endPage = false
+      this.$emit('page-change', {
+        page: 1,
+        endPage: false,
+        direction: 'first'
+      })
     },
 
     // 跳转到上一页
     goToPrevPage() {
-      if (this.page <= 1) return
-      this.page--
-      this.jumpPage = this.page
-      this.end_page = 0;
-      this.buttonType = 'prev'
-      this.fetchData()
+      if (this.currentPage <= 1 || this.isLoading) return
+      this.endPage = false
+      this.$emit('page-change', {
+        page: this.currentPage - 1,
+        endPage: false,
+        direction: 'prev'
+      })
     },
 
     // 跳转到下一页
     goToNextPage() {
-      if (!this.hasNextPage)return
-      this.page++
-      this.end_page = 0;
-      this.jumpPage = this.page
-      this.buttonType = 'next'
-      this.fetchData()
+      if (!this.hasNextPage || this.isLoading) return
+      this.endPage = false
+      this.$emit('page-change', {
+        page: this.currentPage + 1,
+        endPage: false,
+        direction: 'next'
+      })
     },
 
     // 跳转到尾页
     goToLastPage() {
-      // if (this.page === this.totalPages) return
-      // this.page = this.totalPages
-      // this.jumpPage = this.totalPages
-      this.end_page = 1;
-      this.buttonType = ''
-      this.fetchData()
+      if (this.endPage || this.isLoading) return
+      this.endPage = true
+      this.$emit('page-change', {
+        page: this.totalPages,
+        endPage: true,
+        direction: 'last'
+      })
     },
 
     // 处理跳转
     handleJump() {
       let page = parseInt(this.jumpPage)
+      if (isNaN(page)) page = 1
 
-      if (isNaN(page) || page < 1) {
-        page = 1
+      // 限制最大页数
+      if (page > this.totalPages) {
+        page = this.totalPages
+        this.jumpPage = page
       }
-      //  else if (page > this.totalPages) {
-      //   page = this.totalPages
-      // }
 
-      if (page === this.page) return
+      if (page === this.currentPage || this.isLoading) return
 
-      this.page = page
-      this.jumpPage = page
-      this.fetchData()
-    }
-  },
-  watch: {
-    apiUrl() {
-      this.page = 1
-      this.fetchData()
-    },
-    pageSize() {
-      this.page = 1
-      this.fetchData()
-    },
-    extraParams: {
-      deep: true,
-      handler() {
-        this.page = 1
-        this.fetchData()
-      }
+      this.endPage = false
+      this.$emit('page-change', {
+        page,
+        endPage: false,
+        direction: 'jump'
+      })
     }
   }
 }
diff --git a/src/components/Page2.vue b/src/components/Page2.vue
new file mode 100644
index 0000000..15bac36
--- /dev/null
+++ b/src/components/Page2.vue
@@ -0,0 +1,284 @@
+<template>
+  <div class="pagination flex gap10">
+    <!-- 首页按钮 -->
+    <GuipButton size="form" v-if="showFirstPage" @click="goToFirstPage" :disabled="page === 1">
+      首页
+    </GuipButton>
+
+    <!-- 上一页按钮 -->
+    <GuipButton size="form" v-if="showPrevPage" @click="goToPrevPage" :disabled="page === 1">
+      上一页
+    </GuipButton>
+
+    <!-- 当前页码 -->
+    <span v-if="showCurrentPage">第{{ page }}页</span>
+
+    <!-- 下一页按钮 -->
+    <GuipButton size="form" v-if="showNextPage" @click="goToNextPage" :disabled="!hasNextPage">
+      下一页
+    </GuipButton>
+
+    <!-- 尾页按钮 -->
+    <GuipButton size="form" v-if="showLastPage" @click="goToLastPage">
+      尾页
+    </GuipButton>
+
+    <!-- 跳转输入 -->
+    <div class="page-jump flex gap10" v-if="showJump">
+      <input type="number" v-model.number="jumpPage" min="1" :max="totalPages">
+      <GuipButton size="form" @click="handleJump">跳转</GuipButton>
+    </div>
+
+    <!-- 总记录数 -->
+    <span v-if="showTotalRecords" class="total-records">共{{ totalRecords }}条记录</span>
+  </div>
+</template>
+
+<script>
+import GuipButton from '@/components/GuipButton.vue';
+// 父组件使用
+// <!-- <Page
+//                         :api-url="'/agentnew/ajax_get_check_order_list'" 
+//                         :page-size="10"
+//                         @update="handleUpdate"
+//                         @error="handleError"
+//                         @changeLoad="changeLoad"
+//                     /> -->
+export default {
+  name: 'Pagination',
+  components: { GuipButton },
+  props: {
+    // 接口URL
+    apiUrl: {
+      type: String,
+      required: true
+    },
+    // 每页条数
+    pageSize: {
+      type: Number,
+      default: 10
+    },
+    // 其他请求参数
+    extraParams: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      page: 1,
+      jumpPage: 1,
+      end_page: 0,
+      hasNextPage: false,
+      minId: null,
+      maxId: null,
+      totalRecords: 0,
+      buttonType: '',
+      totalPages: 1,
+      token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
+    }
+  },
+  computed: {
+    // 是否显示首页按钮
+    showFirstPage() {
+      return this.page > 2
+    },
+    // 是否显示上一页按钮
+    showPrevPage() {
+      return this.page > 1
+    },
+    // 是否显示当前页码
+    showCurrentPage() {
+      return true
+    },
+    // 是否显示下一页按钮
+    showNextPage() {
+      return this.hasNextPage
+    },
+    // 是否显示尾页按钮
+    showLastPage() {
+      return !(this.end_page > 0) || this.hasNextPage
+    },
+    // 是否显示跳转
+    showJump() {
+      return true
+    },
+    // 是否显示总记录数
+    showTotalRecords() {
+      return this.totalRecords > 0
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    // 构建请求参数
+    buildParams() {
+      const params = {
+        pagesize: this.pageSize,
+        page: this.page,
+        ...this.extraParams
+      }
+
+      // 如果不是第一页，添加maxid或minid
+      if (this.page > 1) {
+        if (this.page === this.totalPages) {
+          // 从尾页往前翻
+          params.maxid = this.maxId
+        } else {
+          // 正常翻页
+          if (this.buttonType == 'prev') {
+            params.maxid = this.maxId
+          } else {
+            params.minid = this.minId
+          }
+        }
+      }
+      if (this.end_page > 0) {
+        delete params.page
+        delete params.maxid
+        delete params.minid
+        params.end_page = this.end_page
+      } else {
+        delete params.end_page
+      }
+
+      console.log(params, 'params======');
+      return params
+    },
+
+    // 获取数据
+    async fetchData() {
+      console.log('-----执行了');
+      this.$emit('changeLoad', true)
+      try {
+        this.$http('POST', this.apiUrl, this.buildParams(), {
+          headers: {
+            'Auth': this.token
+          }
+        }).then(response => {
+          const data = response.data
+          this.hasNextPage = data.is_has_next_page
+          this.minId = data.minid || null
+          this.maxId = data.maxid || null
+          this.totalRecords = data.total_records || 0
+          if (this.totalRecords > 0) {
+            // 计算总页数
+            this.totalPages = Math.ceil(this.totalRecords / this.pageSize)
+            this.page = this.totalPages || 1
+            this.jumpPage = this.page
+            this.end_page = 1;
+          }
+          // 通知父组件数据更新
+          this.$emit('update', data)
+          this.$emit('changeLoad', false)
+        })
+      } catch (error) {
+        console.error('分页请求失败:', error)
+        this.$emit('error', error)
+        this.$emit('changeLoad', false)
+      } finally {
+        this.$emit('changeLoad', false)
+      }
+    },
+
+    // 跳转到首页
+    goToFirstPage() {
+      if (this.page === 1) return
+      this.page = 1
+      this.jumpPage = 1
+      this.end_page = 0;
+      this.buttonType = ''
+      this.fetchData()
+    },
+
+    // 跳转到上一页
+    goToPrevPage() {
+      if (this.page <= 1) return
+      this.page--
+      this.jumpPage = this.page
+      this.end_page = 0;
+      this.buttonType = 'prev'
+      this.fetchData()
+    },
+
+    // 跳转到下一页
+    goToNextPage() {
+      if (!this.hasNextPage) return
+      this.page++
+      this.end_page = 0;
+      this.jumpPage = this.page
+      this.buttonType = 'next'
+      this.fetchData()
+    },
+
+    // 跳转到尾页
+    goToLastPage() {
+      // if (this.page === this.totalPages) return
+      // this.page = this.totalPages
+      // this.jumpPage = this.totalPages
+      this.end_page = 1;
+      this.buttonType = ''
+      this.fetchData()
+    },
+
+    // 处理跳转
+    handleJump() {
+      let page = parseInt(this.jumpPage)
+
+      if (isNaN(page) || page < 1) {
+        page = 1
+      }
+      //  else if (page > this.totalPages) {
+      //   page = this.totalPages
+      // }
+
+      if (page === this.page) return
+
+      this.page = page
+      this.jumpPage = page
+      this.fetchData()
+    }
+  },
+  watch: {
+    apiUrl() {
+      this.page = 1
+      this.fetchData()
+    },
+    pageSize() {
+      this.page = 1
+      this.fetchData()
+    },
+    extraParams: {
+      deep: true,
+      handler() {
+        this.page = 1
+        this.fetchData()
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.pagination {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin: 20px 0;
+  gap: 10px;
+}
+
+.page-jump input {
+  width: 50px;
+  padding: 5px;
+  border: 1px solid #ddd;
+  border-radius: 3px;
+  text-align: center;
+}
+
+.total-records {
+  margin-left: 10px;
+  color: #666;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/agent/checkOrderList.vue b/src/views/agent/checkOrderList.vue
index 5afe886..c3c0464 100644
--- a/src/views/agent/checkOrderList.vue
+++ b/src/views/agent/checkOrderList.vue
@@ -7,16 +7,29 @@
 
         <div class="elementWrap mb-10">
             <el-form>
+                <div class="flex-between operateBtns">
+                    <b>筛选及导出列表</b>
+                    <div class="flex gap24">
+                        <GuipButton size="table" type="ignore" @click="resetSearchParams">清空</GuipButton>
+                        <GuipButton size="table" type="system" @click="getFilterParams">筛选</GuipButton>
+                        <GuipButton size="table" type="primary">导出</GuipButton>
+                    </div>
+                </div>
                 <div class="flex">
                     <p class="mr-12">时间范围</p>
-                    <el-date-picker class="mr-32" v-model="searchDate" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
+                    <el-date-picker class="mr-32" v-model="searchDate" type="daterange" range-separator="至"
+                        start-placeholder="开始日期" end-placeholder="结束日期">
                     </el-date-picker>
 
-                    <GuipSelect class="mr-32" label="服务类型" v-model="searchType" :options="siteList"  valueKey="uid" labelKey="name" @change="changeSearchSite()"  defaultValue="" placeholder="不限" clearable />
+                    <GuipSelect class="mr-32" label="服务类型" v-model="searchType" :options="siteList" valueKey="uid"
+                        labelKey="name" defaultValue="" placeholder="不限" clearable />
 
-                    <GuipSelect class="mr-32" label="站点" v-model="searchUid" :options="siteList"  valueKey="uid" labelKey="name" @change="changeSearchSite()"  defaultValue="" placeholder="不限" clearable />
-                    
-                    <GuipSelect class="mr-32" width="100px" label="报告状态" v-model="searchStatus" :options="searchStatusList"  valueKey="uid" labelKey="name" @change="changeSearchSite()" :extraItem="{label:'全部',value:'all'}"  defaultValue="" placeholder="不限" clearable />
+                    <GuipSelect class="mr-32" label="站点" v-model="searchUid" :options="siteList" valueKey="uid"
+                        labelKey="name" defaultValue="" placeholder="不限" clearable />
+
+                    <GuipSelect class="mr-32" width="100px" label="报告状态" v-model="searchStatus"
+                        :options="searchStatusList" valueKey="uid" labelKey="name"
+                        :extraItem="{ label: '全部', value: 'all' }" defaultValue="" placeholder="不限" clearable />
                 </div>
             </el-form>
         </div>
@@ -28,15 +41,19 @@
                     <div class="flex" style="justify-content: space-between;">
                         <div class="flex">
                             <h3 class="checktitle mr-24">查重列表</h3>
-                            <GuipSelect class="mr-32" label="报告格式" v-model="searchUid" :options="siteList"  valueKey="uid" labelKey="name" @change="changeSearchSite()"  defaultValue="" placeholder="不限" clearable />
+                            <GuipSelect class="mr-32" label="报告格式" v-model="searchUid" :options="siteList"
+                                valueKey="uid" labelKey="name" @change="changeSearchSite()" defaultValue=""
+                                placeholder="不限" clearable />
                         </div>
-                        <GuipInput label="订单号" v-model="searchTid" @blur="changeSearchTid()" placeholder="请输入订单号" ref="GuipInput" />
-                        
+                        <GuipInput label="订单号" v-model="searchTid" @blur="changeSearchTid()" placeholder="请输入订单号"
+                            ref="GuipInput" />
+
                     </div>
 
                     <PromptText class="my-32" text='订单提示：电商订单，提交检测后会自动发货，请勿手动发货、代收款订单，退款须由平台操作，不可私自退款' :type="2" />
 
-                    <GuipTable :tableData="orderList" ref="multipleTable" autoColumn="true" :loading="tableLoading" max-height="400px">
+                    <GuipTable :tableData="orderList" ref="multipleTable" autoColumn="true" :loading="tableLoading"
+                        max-height="400px">
                         <el-table-column prop="sitename" label="站点" fixed="left" min-width="60px">
                             <template slot-scope="scope">
                                 <div class="flex">
@@ -51,7 +68,7 @@
                             <template slot-scope="scope">
                                 <div class="flex">
                                     <p>{{ scope.row.sale_id }}</p>
-                                    <GuipToolTip class="ml-7" v-if="scope.row.ispublic==1" content="自供货">
+                                    <GuipToolTip class="ml-7" v-if="scope.row.ispublic == 1" content="自供货">
                                         <img class="wh-16" src="@/assets/self_supply.svg" />
                                     </GuipToolTip>
                                 </div>
@@ -69,26 +86,28 @@
                         </el-table-column>
                         <el-table-column prop="tids" label="订单号" min-width="220px">
                             <template slot-scope="scope">
-                                <div class="flex" v-if="scope.row.status==1">
-                                    <GuipToolTip :content="'下载报告 作者：'+scope.row.author + ' 标题：' + scope.row.title">
-                                        <a :href="'http://'+scope.row.domain+'/report/tid/'+tid+'/sid/'+scope.row.sale_id" target="_blank" v-for="tid in scope.row.tids" :key="tid">{{ tid }}</a>
+                                <div class="flex" v-if="scope.row.status == 1">
+                                    <GuipToolTip :content="'下载报告 作者：' + scope.row.author + ' 标题：' + scope.row.title">
+                                        <a :href="'http://' + scope.row.domain + '/report/tid/' + tid + '/sid/' + scope.row.sale_id"
+                                            target="_blank" v-for="tid in scope.row.tids" :key="tid">{{ tid }}</a>
                                     </GuipToolTip>
                                 </div>
                                 <div class="" v-else>
                                     <p v-for="tid in scope.row.tids" :key="tid">
                                         {{ tid }}
                                         <GuipToolTip content="待发货">
-                                            <img v-if="scope.row.pay_type==11 && scope.row.pdd_is_wait_deliver_goods[tid]==true" class="wh-16 ml-7" src="@/assets/wait_deliver_goods.svg" />
+                                            <img v-if="scope.row.pay_type == 11 && scope.row.pdd_is_wait_deliver_goods[tid] == true"
+                                                class="wh-16 ml-7" src="@/assets/wait_deliver_goods.svg" />
                                         </GuipToolTip>
                                     </p>
-                                    
+
                                 </div>
                             </template>
                         </el-table-column>
                         <el-table-column prop="author" label="作者">
                             <template slot-scope="scope">
                                 <div class="flex">
-                                    <GuipToolTip :content="'作者：'+scope.row.author + ' 标题：' + scope.row.title">
+                                    <GuipToolTip :content="'作者：' + scope.row.author + ' 标题：' + scope.row.title">
                                         <p>{{ scope.row.author }}</p>
                                     </GuipToolTip>
                                 </div>
@@ -109,7 +128,7 @@
                         <el-table-column prop="similarity" label="相似度">
                             <template slot-scope="scope">
                                 <div class="flex">
-                                    <p v-if="scope.row.similarity>0">{{ scope.row.similarity }}%</p>
+                                    <p v-if="scope.row.similarity > 0">{{ scope.row.similarity }}%</p>
                                     <p v-else>-</p>
                                 </div>
                             </template>
@@ -119,25 +138,30 @@
                         <el-table-column prop="status_desc" label="状态" min-width="150px">
                             <template slot-scope="scope">
                                 <div class="flex">
-                                    <div v-if="scope.row.status==1" class="status-item divgreen">
+                                    <div v-if="scope.row.status == 1" class="status-item divgreen">
                                         <span class="fontgreen">{{ scope.row.status_desc }}</span>
                                     </div>
-                                    <div v-else-if="scope.row.status==3 || scope.row.status==11 || scope.row.status==12" class="status-item divblue">
+                                    <div v-else-if="scope.row.status == 3 || scope.row.status == 11 || scope.row.status == 12"
+                                        class="status-item divblue">
                                         <span class="fontblue">{{ scope.row.status_desc }}</span>
                                     </div>
-                                    <div v-else-if="scope.row.status==2 || scope.row.status==10 || scope.row.status==4" class="status-item divred">
+                                    <div v-else-if="scope.row.status == 2 || scope.row.status == 10 || scope.row.status == 4"
+                                        class="status-item divred">
                                         <span class="fontred">{{ scope.row.status_desc }}</span>
                                     </div>
-                                    <div v-else-if="scope.row.status==0 || scope.row.status==8" class="status-item divgray">
+                                    <div v-else-if="scope.row.status == 0 || scope.row.status == 8"
+                                        class="status-item divgray">
                                         <span class="fontgray">{{ scope.row.status_desc }}</span>
                                     </div>
-                                    <div v-else-if="scope.row.status==5" class="status-item divorange">
+                                    <div v-else-if="scope.row.status == 5" class="status-item divorange">
                                         <span class="fontorange">{{ scope.row.status_desc }}</span>
                                     </div>
-                                    <div v-else-if="scope.row.status==6 || scope.row.status==7" class="status-item divpurple">
+                                    <div v-else-if="scope.row.status == 6 || scope.row.status == 7"
+                                        class="status-item divpurple">
                                         <span class="fontpurple">{{ scope.row.status_desc }}</span>
                                     </div>
-                                    <GuipToolTip v-if="scope.row.status==1 && scope.row.is_downloaded_report==1" content="已下载报告标识">
+                                    <GuipToolTip v-if="scope.row.status == 1 && scope.row.is_downloaded_report == 1"
+                                        content="已下载报告标识">
                                         <img class="wh-16 ml-7" src="@/assets/downloaded.svg" />
                                     </GuipToolTip>
 
@@ -146,33 +170,24 @@
                         </el-table-column>
                         <el-table-column label="操作" fixed="right" min-width="120px">
                             <template slot-scope="scope">
-                            <div class="flex">
-                                <el-button v-if="scope.row.status==1" @click="showConfirmDelReport(scope.row)" type="text">删报告</el-button>
-                            </div>
+                                <div class="flex">
+                                    <el-button v-if="scope.row.status == 1" @click="showConfirmDelReport(scope.row)"
+                                        type="text">删报告</el-button>
+                                </div>
                             </template>
                         </el-table-column>
                     </GuipTable>
-                    <!-- <Page :total-records="orderListTotalRecords"
-                    :is-has-next-page="isHasNextPage"
-                    :page-size="orderListPageSize"
-                    :current-page="orderListCurrentPage"
-                    :next-min-id="orderListNextMinId"
-                    :prev-max-id="orderListPrevMaxId"
-                    @page-change="handlePageChange"></Page> -->
-                    <Page
-                        :api-url="'/agentnew/ajax_get_check_order_list'" 
-                        :page-size="10"
-                        @update="handleUpdate"
-                        @error="handleError"
-                        @changeLoad="changeLoad"
-                    />
+                    <Page :current-page="orderListCurrentPage" :has-next-page="isHasNextPage"
+                        :total-records="orderListTotalRecords" :page-size="orderListPageSize" :is-loading="tableLoading"
+                        @page-change="handlePageChange" />
+                   
                 </el-form>
             </div>
-            <GuipDialog :dialogVisible="dialogVisibleDelReport" title="删除报告" confirmText="删除" cancelText="取消" :show-close-button="false"
-                :show-cancel-button="true" @confirm="confirmDelReport" @cancel="handleCancel"
+            <GuipDialog :dialogVisible="dialogVisibleDelReport" title="删除报告" confirmText="删除" cancelText="取消"
+                :show-close-button="false" :show-cancel-button="true" @confirm="confirmDelReport" @cancel="handleCancel"
                 @close="handleClose" @dialogVisibleChange="dialogVisibleChange">
                 <!-- 自定义内容 -->
-                <p class="mx-24 mt12 flex">是否删除  ID:{{ delReportId }}  报告？删除后无法恢复</p>
+                <p class="mx-24 mt12 flex">是否删除 ID:{{ delReportId }} 报告？删除后无法恢复</p>
             </GuipDialog>
         </div>
     </div>
@@ -183,6 +198,7 @@
 import GuipTable from '@/components/GuipTable.vue';
 import GuipSelect from '@/components/GuipSelect.vue';
 import GuipInput from '@/components/GuipInput.vue';
+import GuipButton from '@/components/GuipButton.vue';
 import GuipToolTip from '@/components/GuipToolTip.vue';
 import GuipDialog from '@/components/GuipDialog.vue';
 import Page from '@/components/Page.vue';
@@ -193,6 +209,7 @@ export default {
     components: {
         GuipTable,
         GuipSelect,
+        GuipButton,
         GuipInput,
         GuipToolTip,
         GuipDialog,
@@ -204,7 +221,7 @@ export default {
             // AUTH
             token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
             // 表格加载
-            tableLoading: true,
+            tableLoading: false,
             // 订单列表
             orderList: [],
             orderListTotalRecords: 0,
@@ -231,73 +248,85 @@ export default {
         }
     },
     mounted() {
-        // this.getOrderList()
+        this.getOrderList()
     },
     methods: {
-        changeLoad(load){
-            this.tableLoading = load
+        getFilterParams(){
+            console.log(this.searchDate,'searchDate===');
+            // this.getOrderList({
+            //     searchDate:this.searchDate,
+            //     searchStatus:this.searchStatus,
+            //     searchType:this.searchType,
+            // })
+            
         },
-        handleUpdate(data) {
-            this.orderList = data.list;
-            this.searchStatusList = data.search_check_status
-            this.orderListTotalRecords = data.total_records
-
+        resetSearchParams(){
+            this.searchDate = ''
+            this.searchStatus = ''
+            this.searchType = ''
+            // 或者使用 $set
         },
         handleError(error) {
             console.error('分页错误:', error)
             // 可以在这里显示错误提示
         },
-        getOrderList() {
-            var params = {
-                page: this.orderListCurrentPage,
-                pagesize: this.orderListPageSize,
-                minid: this.orderListNextMinId,
-                maxid: this.orderListPrevMaxId,
-                end_page: this.orderListEndPage,
-                jump_to_page: this.orderListJumpToPage,
-            }
-            if (this.searchTid) {
-                params = {};
-                params.tid = this.searchTid
-            }
-
+        getOrderList(params) {
             this.tableLoading = true
-            const that = this
-            that.orderList = []
-            this.$http('POST', '/agentnew/ajax_get_check_order_list', params,{
-                headers:{
-                    'Auth': this.token
+            try {
+                const requestParams = {
+                    pagesize: this.orderListPageSize,
+                    page: this.orderListCurrentPage,
+                    ...params
                 }
-            }).then(response => {
-                this.tableLoading = false
-                this.$nextTick(() => {
-                    that.orderList = response.data.list
-                    this.searchStatusList = response.data.search_check_status
-                    
-                    this.orderListTotalRecords = response.data.total_records
-                    this.orderListNextMinId = response.data.minid
-                    this.orderListPrevMaxId = response.data.maxid
-
-                    this.isHasNextPage = response.data.is_has_next_page
-                    console.log(this.isHasNextPage, 'isHasNextPage')
+                console.log(requestParams, 'requestParams===');
+                this.$http('POST', '/agentnew/ajax_get_check_order_list', requestParams, {
+                    headers: {
+                        'Auth': this.token
+                    }
+                }).then(response => {
+                    this.tableLoading = false
+                    this.$nextTick(() => {
+                        this.orderList = response.data.list
+                        this.searchStatusList = response.data.search_check_status
+                        this.orderListTotalRecords = response.data.total_records
+                        // 更新minId和maxId
+                        if (response.data.minid) this.orderListNextMinId = response.data.minid
+                        if (response.data.maxid) this.orderListPrevMaxId = response.data.maxid
+                        this.isHasNextPage = response.data.is_has_next_page;
+                        if (this.orderListTotalRecords > 0) {
+                            // 计算总页数
+                            this.orderListCurrentPage = Math.ceil(this.orderListTotalRecords / this.orderListPageSize)
+                            // this.page = this.totalPages || 1
+                            // this.jumpPage = this.page 
+                            // this.end_page = 1;
+                        }
+                        // console.log(this.isHasNextPage, 'isHasNextPage')
+                    })
+                }).catch(error => {
+                    console.error(error, 'error')
                 })
-            }).catch(error => {
-                console.error(error, 'error')
-            })
+
+
+            } catch (error) {
+                console.error('数据加载失败:', error)
+            } finally {
+                this.tableLoading = false
+            }
         },
+
         getPayImg(pay_type) {
-            return require('@/assets/pay/pay_'+pay_type+'.svg');
+            return require('@/assets/pay/pay_' + pay_type + '.svg');
         },
         getChannelImg(src) {
-            return require('@/assets/channel_'+src+'.svg');
+            return require('@/assets/channel_' + src + '.svg');
         },
         changeSearchSite() {
             console.log(this.searchUid)
-            this.getOrderList()
+            // this.getOrderList()
         },
         changeSearchTid() {
-            console.log(this.searchTid)
-            this.getOrderList()
+            console.log(this.searchTid,'this.searchTid')
+            this.getOrderList({tid:this.searchTid})
         },
         // 弹框相关方法---start
         showConfirmDelReport(row) {
@@ -338,33 +367,27 @@ export default {
         },
         // 弹框相关方法---end
 
-        handlePageChange(params) {
-            // 根据参数调用API获取新数据
-            console.log('分页参数:', params);
-            
-            // 更新当前页码
-            this.orderListCurrentPage = params.page;
-            
-            // 更新minid/maxid（根据实际API返回）
-            if (params.isNext) {
-                // 从API响应中获取新的orderListNextMinId
-                this.orderListNextMinId = params.minid;
-            }
-            
-            if (params.isPrev) {
-                // 从API响应中获取新的orderListPrevMaxId
-                this.orderListPrevMaxId = params.maxid;
-            }
-
-            if (params.isLast) {
-                this.orderListEndPage = params.isLast;
+        handlePageChange({ page, endPage, direction }) {
+            console.log(endPage, 'endPage===');
+            this.orderListCurrentPage = page
+
+            const params = { page }
+
+            // 根据翻页方向设置参数
+            if (direction === 'prev') {
+                params.maxid = this.orderListPrevMaxId
+                if (this.orderListNextMinId) params.minid = null
+            } else if (direction === 'next') {
+                params.minid = this.orderListNextMinId
+                if (this.orderListPrevMaxId) params.maxid = null
+            } else if (direction === 'last') {
+                params.end_page = 1
+                params.page = null
+                params.minid = null
+                params.maxid = null
             }
 
-            if (params.isJump) {
-                this.orderListJumpToPage = params.page;
-            }
-
-            this.getOrderList()
+            this.getOrderList(params)
         }
     },
     computed: {
@@ -394,6 +417,10 @@ export default {
     background: #fff;
 }
 
+.operateBtns {
+    padding: 17px 0;
+}
+
 ::v-deep .custom-popover {
     position: fixed !important;
     // max-height: 290px;
@@ -408,6 +435,7 @@ export default {
     height: 16px;
     z-index: 1;
 }
+
 .mb-10 {
     margin-bottom: 10px;
 }
@@ -415,12 +443,15 @@ export default {
 .mr-12 {
     margin-right: 12px;
 }
+
 .mr-24 {
     margin-right: 24px;
 }
+
 .mr-32 {
     margin-right: 32px;
 }
+
 .my-32 {
     margin-bottom: 32px;
     margin-top: 32px;
@@ -430,6 +461,7 @@ a {
     text-decoration: none;
     color: #006AFF;
 }
+
 a:hover {
     text-decoration: underline;
 }
@@ -449,7 +481,7 @@ a:hover {
     z-index: 0;
     padding: 2px 10px;
     border-radius: 4px;
-    
+
 }
 
 .divgreen {
@@ -457,6 +489,7 @@ a:hover {
     box-sizing: border-box;
     border: 1px solid rgba(0, 194, 97, 0.6);
 }
+
 .fontgreen {
     font-family: Microsoft YaHei UI;
     font-size: 14px;
@@ -466,11 +499,13 @@ a:hover {
     letter-spacing: 0.08em;
     color: #0DAF49;
 }
+
 .divblue {
     background: #F2F7FF;
     box-sizing: border-box;
     border: 1px solid #BFDAFF;
 }
+
 .fontblue {
     font-family: Microsoft YaHei UI;
     font-size: 14px;
@@ -486,6 +521,7 @@ a:hover {
     box-sizing: border-box;
     border: 1px solid #FFA39E;
 }
+
 .fontred {
     font-family: Microsoft YaHei UI;
     font-size: 14px;
@@ -495,28 +531,34 @@ a:hover {
     letter-spacing: 0.08em;
     color: #FF4D4F;
 }
+
 .divgray {
     background: #F6F7FA;
     box-sizing: border-box;
     border: 1px solid #DFE2E6;
 }
-.fontgray { 
+
+.fontgray {
     color: #626573;
 }
+
 .divorange {
     background: #FFFBF2;
     box-sizing: border-box;
     border: 1px solid rgba(251, 131, 45, 0.38);
 }
+
 .fontorange {
     color: #FB832D;
 }
+
 .divpurple {
     background: #F9F2FF;
     box-sizing: border-box;
     border: 1px solid rgba(126, 118, 253, 0.28);
 }
-.fontpurple { 
+
+.fontpurple {
     color: #6258FF;
 }
 
@@ -530,9 +572,8 @@ a:hover {
     /* text/text_1 */
     color: #1E2226;
 }
+
 .el-form-item {
     margin-bottom: 0px
 }
-
-
 </style>
\ No newline at end of file