应付账款+订单审核 样式修改

src/views/finance/autoAudit.vue

@@ -1,34 +1,34 @@
 <template>
-    <div class="autoAudit">
-        <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
-            <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
-            <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
-            <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
-            <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
-            <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
-            <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
-            <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
-            <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
-            <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
-            <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
-            <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
-            <el-table-column prop="productName" label="险种" width="120"></el-table-column>
-            <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
-            <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
-            <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
-            <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
-            <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
-            <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
-            <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
-            <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
-            <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
-            <el-table-column label="操作" fixed="right" width="80">
-                <template #default="scope">
-                    <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
-                </template>
-            </el-table-column>
-        </el-table>
-    </div>
+  <PageMain class="vh100">
+    <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
+      <el-table-column prop="orderNo" label="订单号" width="120"></el-table-column>
+      <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
+      <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
+      <el-table-column prop="insurName" label="被保人" width="120"></el-table-column>
+      <el-table-column prop="orderType" label="订单类型" width="120"></el-table-column>
+      <el-table-column prop="name" label="业务员信息" width="120"></el-table-column>
+      <el-table-column prop="attrType" label="业务员类型" width="120"></el-table-column>
+      <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
+      <el-table-column prop="quotationTime" label="报价时间" width="120"></el-table-column>
+      <el-table-column prop="dockingPerson" label="对接人" width="120"></el-table-column>
+      <el-table-column prop="agreementName" label="出单协议" width="120"></el-table-column>
+      <el-table-column prop="productName" label="险种" width="120"></el-table-column>
+      <el-table-column prop="sumPremium" label="保费总计" width="120"></el-table-column>
+      <el-table-column prop="equityAmount" label="权益金额" width="120"></el-table-column>
+      <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
+      <el-table-column prop="createTime" label="录单时间" width="120"></el-table-column>
+      <el-table-column prop="createBy" label="录单人" width="120"></el-table-column>
+      <el-table-column prop="payTime" label="支付时间" width="120"></el-table-column>
+      <el-table-column prop="jqPremium" label="交强险" width="120"></el-table-column>
+      <el-table-column prop="syPremium" label="商业险" width="120"></el-table-column>
+      <el-table-column prop="jyPremium" label="驾意险" width="120"></el-table-column>
+      <el-table-column label="操作" fixed="right" width="80">
+        <template #default="scope">
+          <el-button link type="primary" size="small" @click="handleToDetail(scope)">详情</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -42,43 +42,34 @@ const myRouter = useRouter()
 let firstData = ref([])
 
 const initData = () => {
-    api.financeApi.auditList({
-        auditType:  2,
-        auditStatus: 1
-    }).then((res: any) => {
-        if(res.code == 200) {
-            firstData.value = res.data.records
-        } else {
-            ElMessage({
-                message: res.msg,
-                type: 'warning'
-            })
-        }
-    })
+  api.financeApi.auditList({
+    auditType: 2,
+    auditStatus: 1
+  }).then((res: any) => {
+    if (res.code == 200) {
+      firstData.value = res.data.records
+    } else {
+      ElMessage({
+        message: res.msg,
+        type: 'warning'
+      })
+    }
+  })
 }
 
 const handleToDetail = (scope) => {
-    myRouter.push({
-        path: '/finance/auditOrderDetail',
-        query: {
-            id: scope.row.orderNo,
-            isShow: 0
-        }
-    })
+  myRouter.push({
+    path: '/finance/auditOrderDetail',
+    query: {
+      id: scope.row.orderNo,
+      isShow: 0
+    }
+  })
 }
 
 onMounted(() => {
-    initData();
+  initData();
 })
 </script>
 
-<style scoped lang="scss">
-.autoAudit{
-    height: calc(100vh - 130px);
-    width: calc(100% - 24px);
-    margin: 12px auto;
-    padding: 0 12px;
-    background: #FFFFFF;
-    overflow-y: auto;
-}
-</style>
+<style scoped lang="scss"></style>

src/views/payCredit/agentCount.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="agentCount">
-    <el-tabs class="demo-tabs" @tab-click="handleClick">
-      <el-tab-pane name="0">
+  <PageMain class="vh100">
+    <el-tabs class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane name="0" class="h-full">
         <template #label>
           <el-badge :value="total1">
             <span>待审核</span>
@@ -41,18 +41,19 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
+        <el-table :data="firstData" height="calc(100% - 162px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="typeAttr" label="业务员类型">
             <template #default="scope">
               {{
-                scope.row.typeAttr == '5' ? '团队' : scope.row.typeAttr == '6' ? '个代' : scope.row.typeAttr == '7' ? '渠道' : scope.row.typeAttr == '8' ?'电销组':'--'
+                scope.row.typeAttr == '5' ? '团队' : scope.row.typeAttr == '6' ? '个代' : scope.row.typeAttr == '7' ? '渠道' :
+                  scope.row.typeAttr == '8' ? '电销组' : '--'
               }}
             </template>
           </el-table-column>
@@ -69,11 +70,11 @@
               <el-button link type="primary" size="small" @click="agentPass(scope.row)">申请通过</el-button>
               <el-popover placement="top" width="300" trigger="click" :visible="scope.row.agentShow">
                 <template #reference>
-                  <el-button @click="scope.row.agentShow   = true" link type="primary" size="small">驳回</el-button>
+                  <el-button @click="scope.row.agentShow = true" link type="primary" size="small">驳回</el-button>
                 </template>
                 <el-input type="textarea" v-model="agentReason" maxlength="200"></el-input>
                 <div style="display: flex; align-items: center; justify-content: flex-end; margin-top: 10px">
-                  <el-button size="small" @click="scope.row.agentShow   = false">取消</el-button>
+                  <el-button size="small" @click="scope.row.agentShow = false">取消</el-button>
                   <el-button type="danger" size="small" @click="handleAgentConfirm(scope.row)">确定驳回</el-button>
                 </div>
               </el-popover>
@@ -86,7 +87,7 @@
             @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="1">
+      <el-tab-pane name="1" class="h-full">
         <template #label>
           <el-badge :value="total2">
             <span>审核通过</span>
@@ -126,18 +127,19 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="secondData" style="width: 100%; margin-top: 20px;">
+        <el-table :data="secondData" height="calc(100% - 162px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="typeAttr" label="业务员类型">
             <template #default="scope">
               {{
-                scope.row.typeAttr == '5' ? '团队' : scope.row.typeAttr == '6' ? '个代' : scope.row.typeAttr == '7' ? '渠道' : scope.row.typeAttr == '8' ?'电销组':'--'
+                scope.row.typeAttr == '5' ? '团队' : scope.row.typeAttr == '6' ? '个代' : scope.row.typeAttr == '7' ? '渠道' :
+                  scope.row.typeAttr == '8' ? '电销组' : '--'
               }}
             </template>
           </el-table-column>
@@ -156,7 +158,7 @@
             @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="2">
+      <el-tab-pane name="2" class="h-full">
         <template #label>
           <el-badge :value="total3">
             <span>审核不通过</span>
@@ -196,18 +198,19 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="thirdData" style="width: 100%; margin-top: 20px;">
+        <el-table :data="thirdData" height="calc(100% - 162px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="typeAttr" label="业务员类型">
             <template #default="scope">
               {{
-                scope.row.typeAttr == '5' ? '团队' : scope.row.typeAttr == '6' ? '个代' : scope.row.typeAttr == '7' ? '渠道' : scope.row.typeAttr == '8' ?'电销组':'--'
+                scope.row.typeAttr == '5' ? '团队' : scope.row.typeAttr == '6' ? '个代' : scope.row.typeAttr == '7' ? '渠道' :
+                  scope.row.typeAttr == '8' ? '电销组' : '--'
               }}
             </template>
           </el-table-column>
@@ -266,7 +269,7 @@
         <el-button type="primary" @click="handleConfirmAudit">审核通过</el-button>
       </div>
     </el-dialog>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -415,53 +418,44 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
-.agentCount {
-  height: calc(100vh - 130px);
-  width: calc(100% - 24px);
-  margin: 12px auto;
-  padding: 12px;
-  background: #FFFFFF;
-  overflow-y: auto;
+.icon_s {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-left: 20px;
+  color: #00a0f4;
+  cursor: pointer;
 
-  .icon_s {
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    margin-left: 20px;
-    color: #00a0f4;
-    cursor: pointer;
-
-    .is_icon {
-      transition: ease 0.2s;
-    }
-
-    .is_down {
-      transform: rotate(180deg);
-    }
+  .is_icon {
+    transition: ease 0.2s;
   }
 
-  .pagination {
-    margin-top: 20px;
-    display: flex;
-    justify-content: flex-end;
+  .is_down {
+    transform: rotate(180deg);
   }
+}
 
-  .upload-btn {
-    :deep(.el-button) {
-      width: 80px;
-      height: 80px;
-      font-size: 30px;
-      color: #ccc;
-    }
-  }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
 
-  :deep(.el-badge__content.is-fixed) {
-    right: calc(var(--el-badge-size) / 2 - 10px);
-    top: 50%;
+.upload-btn {
+  :deep(.el-button) {
+    width: 80px;
+    height: 80px;
+    font-size: 30px;
+    color: #ccc;
   }
+}
 
-  :deep(.el-badge__content--danger) {
-    background-color: #D40000;
-  }
+:deep(.el-badge__content.is-fixed) {
+  right: calc(var(--el-badge-size) / 2 - 10px);
+  top: 50%;
+}
+
+:deep(.el-badge__content--danger) {
+  background-color: #D40000;
 }
 </style>

src/views/payCredit/generanView.vue

@@ -1,104 +1,90 @@
 <template>
-    <div class="generanView">
-        <el-form v-model="form" label-width="100">
-            <el-row :gutter="20">
-                <el-col :span="8">
-                    <el-form-item label="业务员">
-                        <el-input placeholder="请输入" v-model="form.salesman"></el-input>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                    <el-form-item label="业务员类型">
-                        <el-select v-model="form.attrType">
-                            <el-option value="1" label="前线人员"></el-option>
-                            <el-option value="2" label="后线人员"></el-option>
-                            <el-option value="3" label="合伙人"></el-option>
-                            <el-option value="4" label="工作室管理员"></el-option>
-                            <el-option value="5" label="团队"></el-option>
-                            <el-option value="6" label="个代"></el-option>
-                            <el-option value="7" label="电销"></el-option>
-                            <el-option value="8" label="渠道"></el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                    <el-form-item label="统计日期">
-                        <el-date-picker
-                            v-model="form.createTime"
-                            type="daterange"
-                            range-separator="至"
-                            start-placeholder="开始时间"
-                            end-placeholder="结束时间"
-                            format="YYYY-MM-DD"
-                            value-format="YYYY-MM-DD"
-                        />
-                    </el-form-item>
-                </el-col>
-                <el-col :span="8"></el-col>
-                <el-col :span="8"></el-col>
-                <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
-                    <el-button type="primary" @click="handleSearch">查询</el-button>
-                    <el-button type="primary" plain @click="handleReset">重置</el-button>
-                </el-col>
-            </el-row>
-        </el-form>
-        <el-row :gutter="20" justify="space-between" style="padding: 0 40px; margin-top: 20px">
-            <el-col :span="6">
-                <div class="count">{{ formData.salespersonCount }}人</div>
-                <div class="name">业务员</div>
-            </el-col>
-            <el-col :span="6">
-                <div class="count">￥{{ formData.payableSum }}</div>
-                <div class="name">应付总计</div>
-            </el-col>
-            <el-col :span="6">
-                <div class="count">{{ formData.paidSum }}</div>
-                <div class="name">已付总计</div>
-            </el-col>
-            <el-col :span="6">
-                <div class="count">￥{{ formData.notPaidSum }}</div>
-                <div class="name">未付总计</div>
-            </el-col>
-        </el-row>
-        <el-table
-            :data="tableData"
-            style="margin-top: 20px"
-        >
-            <el-table-column prop="name" label="业务员姓名"></el-table-column>
-            <el-table-column prop="mobile" label="业务员手机号"></el-table-column>
-            <el-table-column prop="workNumber" label="业务员工号"></el-table-column>
-            <el-table-column prop="attrType" label="业务员类型">
-                <template #default="scope">
-                    {{ scope.row.attrType == '1'?'前线人员':scope.row.attrType == '2'?'后线人员':scope.row.attrType == '3'?'合伙人':scope.row.attrType == '4'?'工作室管理员':scope.row.attrType == '5'?'团队':scope.row.attrType == '6'?'个代':scope.row.attrType == '7'?'电销':scope.row.attrType == '8'?'渠道':'' }}
-                </template>
-            </el-table-column>
-            <el-table-column prop="organizationName" label="归属"></el-table-column>
-            <el-table-column prop="deptName" label="所属机构"></el-table-column>
-            <el-table-column prop="sumAmount" label="应付总计"></el-table-column>
-            <el-table-column prop="sumAmountPaid" label="已付金额"></el-table-column>
-            <el-table-column prop="sumAmountUnpaid" label="未付金额"></el-table-column>
-        </el-table>
-        <div class="pagination">
-            <el-pagination
-                v-model:current-page="pages"
-                v-model:page-size="size"
-                :page-sizes="[10, 20, 30, 40]"
-                layout="total, sizes, prev, pager, next, jumper"
-                :total="total"
-                @size-change="handleSizeChange"
-                @current-change="handleCurrentChange"
-            ></el-pagination>
-        </div>
+  <PageMain class="vh100">
+    <el-form v-model="form" label-width="100">
+      <el-row :gutter="20">
+        <el-col :span="8">
+          <el-form-item label="业务员">
+            <el-input placeholder="请输入" v-model="form.salesman"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="业务员类型">
+            <el-select v-model="form.attrType">
+              <el-option value="1" label="前线人员"></el-option>
+              <el-option value="2" label="后线人员"></el-option>
+              <el-option value="3" label="合伙人"></el-option>
+              <el-option value="4" label="工作室管理员"></el-option>
+              <el-option value="5" label="团队"></el-option>
+              <el-option value="6" label="个代"></el-option>
+              <el-option value="7" label="电销"></el-option>
+              <el-option value="8" label="渠道"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="统计日期">
+            <el-date-picker v-model="form.createTime" type="daterange" range-separator="至" start-placeholder="开始时间"
+              end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8"></el-col>
+        <el-col :span="8"></el-col>
+        <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+          <el-button type="primary" @click="handleSearch">查询</el-button>
+          <el-button type="primary" plain @click="handleReset">重置</el-button>
+        </el-col>
+      </el-row>
+    </el-form>
+    <el-row :gutter="20" justify="space-between" style="padding: 0 40px; margin-top: 20px">
+      <el-col :span="6">
+        <div class="count">{{ formData.salespersonCount }}人</div>
+        <div class="name">业务员</div>
+      </el-col>
+      <el-col :span="6">
+        <div class="count">￥{{ formData.payableSum }}</div>
+        <div class="name">应付总计</div>
+      </el-col>
+      <el-col :span="6">
+        <div class="count">{{ formData.paidSum }}</div>
+        <div class="name">已付总计</div>
+      </el-col>
+      <el-col :span="6">
+        <div class="count">￥{{ formData.notPaidSum }}</div>
+        <div class="name">未付总计</div>
+      </el-col>
+    </el-row>
+    <el-table :data="tableData" height="calc(100% - 232px)" style="margin-top: 20px">
+      <el-table-column prop="name" label="业务员姓名"></el-table-column>
+      <el-table-column prop="mobile" label="业务员手机号"></el-table-column>
+      <el-table-column prop="workNumber" label="业务员工号"></el-table-column>
+      <el-table-column prop="attrType" label="业务员类型">
+        <template #default="scope">
+          {{ scope.row.attrType == '1' ? '前线人员' : scope.row.attrType == '2' ? '后线人员' : scope.row.attrType ==
+            '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType ==
+              '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8' ? '渠道' : '' }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="organizationName" label="归属"></el-table-column>
+      <el-table-column prop="deptName" label="所属机构"></el-table-column>
+      <el-table-column prop="sumAmount" label="应付总计"></el-table-column>
+      <el-table-column prop="sumAmountPaid" label="已付金额"></el-table-column>
+      <el-table-column prop="sumAmountUnpaid" label="未付金额"></el-table-column>
+    </el-table>
+    <div class="pagination">
+      <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+        layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"></el-pagination>
     </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
 import api from '@/api'
 
 let form = ref({
-    salesman: '',
-    attrType: '',
-    createTime: []
+  salesman: '',
+  attrType: '',
+  createTime: []
 })
 let formData = ref({})
 let tableData = ref([])
@@ -108,75 +94,69 @@ let pages = ref(1)
 let size = ref(10)
 let total = ref(0)
 const handleSizeChange = (e) => {
-    size.value = e
-    initData()
+  size.value = e
+  initData()
 }
 const handleCurrentChange = (e) => {
-    pages.value = e
-    initData()
+  pages.value = e
+  initData()
 }
 const handleSearch = () => {
-    pages.value = 1
-    size.value = 10
-    initData()
+  pages.value = 1
+  size.value = 10
+  initData()
 }
 const handleReset = () => {
-    pages.value = 1
-    size.value = 10
-    form.value = {
-        salesman: '',
-        attrType: '',
-        createTime: []
-    }
-    initData()
+  pages.value = 1
+  size.value = 10
+  form.value = {
+    salesman: '',
+    attrType: '',
+    createTime: []
+  }
+  initData()
 }
 
 const initData = () => {
-    api.financeApi.getPayableStatistics({
-        salesman: form.value.salesman,
-        attrType: form.value.attrType,
-        createTimeStart: form.value.createTime?.[0],
-        createTimeEnd: form.value.createTime?.[1]
-    }).then((res: any) => {
-        formData.value = res.data
-    })
-    api.financeApi.userAccountList({
-        salesman: form.value.salesman,
-        attrType: form.value.attrType,
-        createTimeStart: form.value.createTime?.[0],
-        createTimeEnd: form.value.createTime?.[1]
-    }).then((res: any) => {
-        if(res.code == 200) {
-            tableData.value = res.data.records
-            total.value = res.data.total
-        }
-    })
+  api.financeApi.getPayableStatistics({
+    salesman: form.value.salesman,
+    attrType: form.value.attrType,
+    createTimeStart: form.value.createTime?.[0],
+    createTimeEnd: form.value.createTime?.[1]
+  }).then((res: any) => {
+    formData.value = res.data
+  })
+  api.financeApi.userAccountList({
+    salesman: form.value.salesman,
+    attrType: form.value.attrType,
+    createTimeStart: form.value.createTime?.[0],
+    createTimeEnd: form.value.createTime?.[1]
+  }).then((res: any) => {
+    if (res.code == 200) {
+      tableData.value = res.data.records
+      total.value = res.data.total
+    }
+  })
 }
 
 onMounted(() => {
-    initData();
+  initData();
 })
 
 </script>
 
 <style scoped lang="scss">
-.generanView{
-    height: calc(100vh - 134px);
-    width: calc(100% - 24px);
-    margin: 12px auto;
-    padding: 12px;
-    background: #FFFFFF;
-    overflow-y: auto;
-    .pagination{
-        margin-top: 20px;
-        display: flex;
-        justify-content: flex-end;
-    }
-    .count{
-        font-size: 30px;
-    }
-    .name{
-        color: #666666;
-    }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.count {
+  font-size: 30px;
+}
+
+.name {
+  color: #666666;
 }
 </style>

src/views/payCredit/index.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="payCredit">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-      <el-tab-pane name="3">
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane name="3" class="h-full">
         <template #label>
           <el-badge :value="total4">
             <span>待领取</span>
@@ -50,20 +50,21 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="firstData4" style="width: 100%; margin-top: 20px;">
+        <el-table :data="firstData4" height="calc(100% - 194px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="userJzgInfoId" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
             <template #default="scope">
               {{ scope.row.attrType == '1' ? '前线人员' : scope.row.attrType == '2' ? '后线人员' : scope.row.attrType ==
-                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType ==
-                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8'?'渠道':'' }}
+                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType
+                  ==
+                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8' ? '渠道' :'' }}
             </template>
           </el-table-column>
           <el-table-column prop="managerName" label="管理人"></el-table-column>
@@ -86,7 +87,7 @@
             @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="0">
+      <el-tab-pane name="0" class="h-full">
         <template #label>
           <el-badge :value="total1">
             <span>待付款</span>
@@ -135,20 +136,21 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="firstData1" style="width: 100%; margin-top: 20px;">
+        <el-table :data="firstData1" height="calc(100% - 194px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="userJzgInfoId" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
             <template #default="scope">
               {{ scope.row.attrType == '1' ? '前线人员' : scope.row.attrType == '2' ? '后线人员' : scope.row.attrType ==
-                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType ==
-                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8'?'渠道':'' }}
+                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType
+                  ==
+                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8' ? '渠道' :'' }}
             </template>
           </el-table-column>
           <el-table-column prop="managerName" label="管理人"></el-table-column>
@@ -180,7 +182,7 @@
             @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="1">
+      <el-tab-pane name="1" class="h-full">
         <template #label>
           <el-badge :value="total2">
             <span>已付款</span>
@@ -229,20 +231,21 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="firstData2" style="width: 100%; margin-top: 20px;">
+        <el-table :data="firstData2" height="calc(100% - 194px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="userJzgInfoId" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
             <template #default="scope">
               {{ scope.row.attrType == '1' ? '前线人员' : scope.row.attrType == '2' ? '后线人员' : scope.row.attrType ==
-                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType ==
-                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8'?'渠道':'' }}
+                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType
+                  ==
+                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8' ? '渠道' :'' }}
             </template>
           </el-table-column>
           <el-table-column prop="managerName" label="管理人"></el-table-column>
@@ -262,7 +265,7 @@
             @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
-      <el-tab-pane name="2">
+      <el-tab-pane name="2" class="h-full">
         <template #label>
           <el-badge :value="total3">
             <span>拒绝付款</span>
@@ -311,20 +314,21 @@
                   start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" />
               </el-form-item>
             </el-col>
-            <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
+            <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
               <el-button type="primary" @click="handleSearch">搜索</el-button>
               <el-button plain @click="handleReset">重置</el-button>
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="firstData3" style="width: 100%; margin-top: 20px;">
+        <el-table :data="firstData3" height="calc(100% - 194px)" style="width: 100%; margin-top: 20px;">
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="userJzgInfoId" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
             <template #default="scope">
               {{ scope.row.attrType == '1' ? '前线人员' : scope.row.attrType == '2' ? '后线人员' : scope.row.attrType ==
-                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType ==
-                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8'?'渠道':'' }}
+                '3' ? '合伙人' : scope.row.attrType == '4' ? '工作室管理员' : scope.row.attrType == '5' ? '团队' : scope.row.attrType
+                  ==
+                  '6' ? '个代' : scope.row.attrType == '7' ? '电销' : scope.row.attrType == '8' ? '渠道' :'' }}
             </template>
           </el-table-column>
           <el-table-column prop="managerName" label="管理人"></el-table-column>
@@ -395,7 +399,7 @@
         <el-button type="primary" @click="handleAccountSubmit">确定</el-button>
       </template>
     </el-dialog>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -673,53 +677,44 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
-.payCredit {
-  height: calc(100vh - 130px);
-  width: calc(100% - 24px);
-  margin: 12px auto;
-  padding: 12px;
-  background: #FFFFFF;
-  overflow-y: auto;
+.icon_s {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-left: 20px;
+  color: #00a0f4;
+  cursor: pointer;
 
-  .icon_s {
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    margin-left: 20px;
-    color: #00a0f4;
-    cursor: pointer;
-
-    .is_icon {
-      transition: ease 0.2s;
-    }
-
-    .is_down {
-      transform: rotate(180deg);
-    }
+  .is_icon {
+    transition: ease 0.2s;
   }
 
-  .pagination {
-    margin-top: 20px;
-    display: flex;
-    justify-content: flex-end;
+  .is_down {
+    transform: rotate(180deg);
   }
+}
 
-  .upload-btn {
-    :deep(.el-button) {
-      width: 80px;
-      height: 80px;
-      font-size: 30px;
-      color: #ccc;
-    }
-  }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
 
-  :deep(.el-badge__content.is-fixed) {
-    right: calc(var(--el-badge-size) / 2 - 10px);
-    top: 50%;
+.upload-btn {
+  :deep(.el-button) {
+    width: 80px;
+    height: 80px;
+    font-size: 30px;
+    color: #ccc;
   }
+}
 
-  :deep(.el-badge__content--danger) {
-    background-color: #D40000;
-  }
+:deep(.el-badge__content.is-fixed) {
+  right: calc(var(--el-badge-size) / 2 - 10px);
+  top: 50%;
+}
+
+:deep(.el-badge__content--danger) {
+  background-color: #D40000;
 }
 </style>

src/views/payCredit/myTask.vue

@@ -1,205 +1,166 @@
 <template>
-    <div class="myTask">
-        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-            <el-tab-pane :label="`已领取（${total1}）`" name="first">
-                <el-form v-model="firstForm" label-width="100">
-                    <el-row :gutter="20">
-                        <el-col :span="8">
-                            <el-form-item label="业务员">
-                                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员工号">
-                                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员类型">
-                                <el-select v-model="firstForm" placeholder="请选择" clearable>
-                                    <el-option label="1" value="1"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="提现时间">
-                                <el-date-picker
-                                    v-model="firstForm"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8"></el-col>
-                        <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
-                            <el-button type="primary">搜索</el-button>
-                            <el-button plain>重置</el-button>
-                        </el-col>
-                    </el-row>
-                </el-form>
-                <p style="font-size: 14px; color: #606266">应付总额：￥30000.00</p>
-                <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
-                    <el-table-column prop="" label="业务员"></el-table-column>
-                    <el-table-column prop="" label="业务员类型"></el-table-column>
-                    <el-table-column prop="" label="管理人"></el-table-column>
-                    <el-table-column prop="" label="提现金额"></el-table-column>
-                    <el-table-column prop="" label="账户余额"></el-table-column>
-                    <el-table-column prop="" label="银行卡号"></el-table-column>
-                    <el-table-column prop="" label="银行"></el-table-column>
-                    <el-table-column prop="" label="姓名"></el-table-column>
-                    <el-table-column prop="" label="开户行"></el-table-column>
-                    <el-table-column label="操作" fixed="right" width="200">
-                        <template #default="scope">
-                            <el-button link type="primary" size="small">领取</el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination
-                        v-model:current-page="pages"
-                        v-model:page-size="size"
-                        :page-sizes="[10, 20, 30, 40]"
-                        layout="total, sizes, prev, pager, next, jumper"
-                        :total="total1"
-                        @size-change="handleSizeChange"
-                        @current-change="handleCurrentChange"
-                    ></el-pagination>
-                </div>
-            </el-tab-pane>
-            <el-tab-pane :label="`已付款（${total2}）`" name="second">
-                <el-form v-model="firstForm" label-width="100">
-                    <el-row :gutter="20">
-                        <el-col :span="8">
-                            <el-form-item label="业务员">
-                                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员类型">
-                                <el-select v-model="firstForm" placeholder="请选择" clearable>
-                                    <el-option label="1" value="1"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="提现时间">
-                                <el-date-picker
-                                    v-model="firstForm"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8"></el-col>
-                        <el-col :span="8"></el-col>
-                        <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
-                            <el-button type="primary">搜索</el-button>
-                            <el-button plain>重置</el-button>
-                        </el-col>
-                    </el-row>
-                </el-form>
-                <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
-                    <el-table-column prop="" label="业务员"></el-table-column>
-                    <el-table-column prop="" label="业务员类型"></el-table-column>
-                    <el-table-column prop="" label="管理人"></el-table-column>
-                    <el-table-column prop="" label="提现金额"></el-table-column>
-                    <el-table-column prop="" label="账户余额"></el-table-column>
-                    <el-table-column prop="" label="银行卡号"></el-table-column>
-                    <el-table-column prop="" label="银行"></el-table-column>
-                    <el-table-column prop="" label="姓名"></el-table-column>
-                    <el-table-column prop="" label="开户行"></el-table-column>
-                    <el-table-column label="操作" fixed="right" width="200">
-                        <template #default="scope">
-                            <el-button link type="primary" size="small">领取</el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination
-                        v-model:current-page="pages"
-                        v-model:page-size="size"
-                        :page-sizes="[10, 20, 30, 40]"
-                        layout="total, sizes, prev, pager, next, jumper"
-                        :total="total2"
-                        @size-change="handleSizeChange"
-                        @current-change="handleCurrentChange"
-                    ></el-pagination>
-                </div>
-            </el-tab-pane>
-            <el-tab-pane :label="`拒绝付款（${total3}）`" name="third">
-                <el-form v-model="firstForm" label-width="100">
-                    <el-row :gutter="20">
-                        <el-col :span="8">
-                            <el-form-item label="业务员">
-                                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="业务员类型">
-                                <el-select v-model="firstForm" placeholder="请选择" clearable>
-                                    <el-option label="1" value="1"></el-option>
-                                </el-select>
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8">
-                            <el-form-item label="提现时间">
-                                <el-date-picker
-                                    v-model="firstForm"
-                                    type="daterange"
-                                    range-separator="至"
-                                    start-placeholder="开始时间"
-                                    end-placeholder="结束时间"
-                                    format="YYYY-MM-DD"
-                                    value-format="YYYY-MM-DD"
-                                />
-                            </el-form-item>
-                        </el-col>
-                        <el-col :span="8"></el-col>
-                        <el-col :span="8"></el-col>
-                        <el-col :span="8" style="display: flex; align-items: center; justify-content: flex-end">
-                            <el-button type="primary">搜索</el-button>
-                            <el-button plain>重置</el-button>
-                        </el-col>
-                    </el-row>
-                </el-form>
-                <el-table :data="firstData" style="width: 100%; margin-top: 20px;">
-                    <el-table-column prop="" label="业务员"></el-table-column>
-                    <el-table-column prop="" label="业务员类型"></el-table-column>
-                    <el-table-column prop="" label="管理人"></el-table-column>
-                    <el-table-column prop="" label="提现金额"></el-table-column>
-                    <el-table-column prop="" label="账户余额"></el-table-column>
-                    <el-table-column prop="" label="银行卡号"></el-table-column>
-                    <el-table-column prop="" label="银行"></el-table-column>
-                    <el-table-column prop="" label="姓名"></el-table-column>
-                    <el-table-column prop="" label="开户行"></el-table-column>
-                    <el-table-column label="操作" fixed="right" width="200">
-                        <template #default="scope">
-                            <el-button link type="primary" size="small">领取</el-button>
-                        </template>
-                    </el-table-column>
-                </el-table>
-                <div class="pagination">
-                    <el-pagination
-                        v-model:current-page="pages"
-                        v-model:page-size="size"
-                        :page-sizes="[10, 20, 30, 40]"
-                        layout="total, sizes, prev, pager, next, jumper"
-                        :total="total3"
-                        @size-change="handleSizeChange"
-                        @current-change="handleCurrentChange"
-                    ></el-pagination>
-                </div>
-            </el-tab-pane>
-        </el-tabs>
-    </div>
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane :label="`已领取（${total1}）`" name="first" class="h-full">
+        <el-form v-model="firstForm" label-width="100">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="业务员">
+                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员工号">
+                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员类型">
+                <el-select v-model="firstForm" placeholder="请选择" clearable>
+                  <el-option label="1" value="1"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="提现时间">
+                <el-date-picker v-model="firstForm" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8"></el-col>
+            <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
+              <el-button type="primary">搜索</el-button>
+              <el-button plain>重置</el-button>
+            </el-col>
+          </el-row>
+        </el-form>
+        <p style="font-size: 14px; color: #606266">应付总额：￥30000.00</p>
+        <el-table :data="firstData" height="calc(100% - 196px)" style="width: 100%; margin-top: 20px;">
+          <el-table-column prop="" label="业务员"></el-table-column>
+          <el-table-column prop="" label="业务员类型"></el-table-column>
+          <el-table-column prop="" label="管理人"></el-table-column>
+          <el-table-column prop="" label="提现金额"></el-table-column>
+          <el-table-column prop="" label="账户余额"></el-table-column>
+          <el-table-column prop="" label="银行卡号"></el-table-column>
+          <el-table-column prop="" label="银行"></el-table-column>
+          <el-table-column prop="" label="姓名"></el-table-column>
+          <el-table-column prop="" label="开户行"></el-table-column>
+          <el-table-column label="操作" fixed="right" width="200">
+            <template #default="scope">
+              <el-button link type="primary" size="small">领取</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total1" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane :label="`已付款（${total2}）`" name="second" class="h-full">
+        <el-form v-model="firstForm" label-width="100">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="业务员">
+                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员类型">
+                <el-select v-model="firstForm" placeholder="请选择" clearable>
+                  <el-option label="1" value="1"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="提现时间">
+                <el-date-picker v-model="firstForm" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8"></el-col>
+            <el-col :span="8"></el-col>
+            <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
+              <el-button type="primary">搜索</el-button>
+              <el-button plain>重置</el-button>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table :data="firstData" height="calc(100% - 144px)" style="width: 100%; margin-top: 20px;">
+          <el-table-column prop="" label="业务员"></el-table-column>
+          <el-table-column prop="" label="业务员类型"></el-table-column>
+          <el-table-column prop="" label="管理人"></el-table-column>
+          <el-table-column prop="" label="提现金额"></el-table-column>
+          <el-table-column prop="" label="账户余额"></el-table-column>
+          <el-table-column prop="" label="银行卡号"></el-table-column>
+          <el-table-column prop="" label="银行"></el-table-column>
+          <el-table-column prop="" label="姓名"></el-table-column>
+          <el-table-column prop="" label="开户行"></el-table-column>
+          <el-table-column label="操作" fixed="right" width="200">
+            <template #default="scope">
+              <el-button link type="primary" size="small">领取</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total2" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane :label="`拒绝付款（${total3}）`" name="third" class="h-full">
+        <el-form v-model="firstForm" label-width="100">
+          <el-row :gutter="20">
+            <el-col :span="8">
+              <el-form-item label="业务员">
+                <el-input v-model="firstForm" placeholder="请输入" clearable></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="业务员类型">
+                <el-select v-model="firstForm" placeholder="请选择" clearable>
+                  <el-option label="1" value="1"></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="提现时间">
+                <el-date-picker v-model="firstForm" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="8"></el-col>
+            <el-col :span="8"></el-col>
+            <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
+              <el-button type="primary">搜索</el-button>
+              <el-button plain>重置</el-button>
+            </el-col>
+          </el-row>
+        </el-form>
+        <el-table :data="firstData" height="calc(100% - 144px)" style="width: 100%; margin-top: 20px;">
+          <el-table-column prop="" label="业务员"></el-table-column>
+          <el-table-column prop="" label="业务员类型"></el-table-column>
+          <el-table-column prop="" label="管理人"></el-table-column>
+          <el-table-column prop="" label="提现金额"></el-table-column>
+          <el-table-column prop="" label="账户余额"></el-table-column>
+          <el-table-column prop="" label="银行卡号"></el-table-column>
+          <el-table-column prop="" label="银行"></el-table-column>
+          <el-table-column prop="" label="姓名"></el-table-column>
+          <el-table-column prop="" label="开户行"></el-table-column>
+          <el-table-column label="操作" fixed="right" width="200">
+            <template #default="scope">
+              <el-button link type="primary" size="small">领取</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
+            layout="total, sizes, prev, pager, next, jumper" :total="total3" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -207,9 +168,9 @@
 
 let activeName = ref('first')
 const handleClick = () => {
-    pages.value = 1
-    size.value = 10
-    firstForm.value = null
+  pages.value = 1
+  size.value = 10
+  firstForm.value = null
 }
 
 // 待审核
@@ -232,31 +193,26 @@ const handleCurrentChange = (page) => {
 </script>
 
 <style scoped lang="scss">
-.myTask{
-    height: calc(100vh - 134px);
-    width: calc(100% - 24px);
-    margin: 12px auto;
-    padding: 12px;
-    background: #FFFFFF;
-    overflow-y: auto;
-    .icon_s{
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        margin-left: 20px;
-        color: #00a0f4;
-        cursor: pointer;
-        .is_icon{
-            transition: ease 0.2s;
-        }
-        .is_down{
-            transform: rotate(180deg);
-        }
-    }
-    .pagination{
-        margin-top: 20px;
-        display: flex;
-        justify-content: flex-end;
-    }
+.icon_s {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-left: 20px;
+  color: #00a0f4;
+  cursor: pointer;
+
+  .is_icon {
+    transition: ease 0.2s;
+  }
+
+  .is_down {
+    transform: rotate(180deg);
+  }
+}
+
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  justify-content: flex-end;
 }
 </style>