列表样式修改

src/views/contentManagement/advertisement.vue

@@ -1,101 +1,67 @@
 <template>
-  <div class="institution">
-    <div class="institution-main">
-      <el-form label-position="left" label-width="auto">
-        <el-row :gutter="24">
-          <el-col :span="6">
-            <el-form-item label="发布信息">
-              <el-input
-                v-model="form.searchValue"
-                placeholder="输入标题查找"
-                :prefix-icon="Search"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="发布机构">
-              <el-cascader
-                clearable
-                filterable
-                style="width: 100%"
-                v-model="form.sendDeptId"
-                :options="institutionList"
-                :props="tableProps"
-              />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="4">
-            <el-form-item label="">
-              <el-button type="primary" @click="getContentList">查询</el-button>
-              <el-button type="primary" plain @click="reset">重置</el-button>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-
-      <Table
-        :tableData="tableData"
-        :columns="columns"
-        :showIndex="false"
-        :showSelect="true"
-        :showOperation="true"
-        :pageInfo="pageInfo"
-        @getList="getList"
-        :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-        @select-all-change="selectAllChange"
-        @select-change="selectChange"
-      >
-        <template v-slot:table-title-btn>
-          <div>
-            <!-- <el-button type="primary" @click="add(ruleFormRef)">
+  <PageMain class="vh100">
+    <el-form label-position="left" label-width="auto">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          <el-form-item label="发布信息">
+            <el-input v-model="form.searchValue" placeholder="输入标题查找" :prefix-icon="Search" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="发布机构">
+            <el-cascader clearable filterable style="width: 100%" v-model="form.sendDeptId" :options="institutionList"
+              :props="tableProps" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="4">
+          <el-form-item label="">
+            <el-button type="primary" @click="getContentList">查询</el-button>
+            <el-button type="primary" plain @click="reset">重置</el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
+    <Table height="calc(100% - 56px)" :tableData="tableData" :columns="columns" :showIndex="false" :showSelect="true" :showOperation="true"
+      :pageInfo="pageInfo" @getList="getList" :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
+      @select-all-change="selectAllChange" @select-change="selectChange">
+      <template v-slot:table-title-btn>
+        <div>
+          <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-            <el-button @click="handleAdd">
-              <el-icon><Position /></el-icon>发布新的广告图
-            </el-button>
-          </div>
-        </template>
-        <template v-slot:operation="scope">
-          <el-button
-            type="primary"
-            link
-            @click="editor(scope.operationData.row)"
-          >
-            编辑
-          </el-button>
-          <el-button type="primary" link @click="del(scope.operationData.row)">
-            删除
+          <el-button @click="handleAdd">
+            <el-icon>
+              <Position />
+            </el-icon>发布新的广告图
           </el-button>
-        </template>
-        <template v-slot:search="scope">
-          {{ scope.slotData.label }}
-        </template>
-      </Table>
+        </div>
+      </template>
+      <template v-slot:operation="scope">
+        <el-button type="primary" link @click="editor(scope.operationData.row)">
+          编辑
+        </el-button>
+        <el-button type="primary" link @click="del(scope.operationData.row)">
+          删除
+        </el-button>
+      </template>
+      <template v-slot:search="scope">
+        {{ scope.slotData.label }}
+      </template>
+    </Table>
+  </PageMain>
+  <el-dialog v-model="dialogVisible" title="查看人数" width="1000">
+    <Table :tableData="userTableData" :columns="userColumns" :showIndex="false" :showSelect="false"
+      :showOperation="false" :pageInfo="userPageInfo" @getList="userGetList"
+      :treeProps="{ children: 'children', hasChildren: 'hasChildren' }">
+    </Table>
+  </el-dialog>
+  <el-dialog v-model="imageShow" title="图片查看" width="500">
+    <div class="image-box">
+      <img :src="imageUrl" />
     </div>
-    <el-dialog v-model="dialogVisible" title="查看人数" width="1000">
-      <Table
-        :tableData="userTableData"
-        :columns="userColumns"
-        :showIndex="false"
-        :showSelect="false"
-        :showOperation="false"
-        :pageInfo="userPageInfo"
-        @getList="userGetList"
-        :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-      >
-      </Table>
-    </el-dialog>
-    <el-dialog
-      v-model="imageShow"
-      title="图片查看"
-      width="500"
-    >
-      <div class="image-box">
-        <img :src="imageUrl"/>
-      </div>
-    </el-dialog>
-  </div>
+  </el-dialog>
 </template>
 
 <script setup lang="ts">
@@ -178,14 +144,17 @@ const typeformatter = (row: any, column: any, cellValue: any) => {
 };
 const columns = [
   { prop: "name", label: "发布消息", formatter: typeformatter, width: 500 },
-  { prop: "deptName", label: "广告图",
+  {
+    prop: "deptName", label: "广告图",
     formatter: (row: any, column: any, cellValue: any) => {
-      return () => h("img", {src:row.previewUrl, onClick: () => {
+      return () => h("img", {
+        src: row.previewUrl, onClick: () => {
           imageShow.value = true
           imageUrl.value = row.previewUrl
-        }}, );
+        }
+      },);
     },
-   },
+  },
 
   { prop: "deptName", label: "发布机构" },
   // { prop: "id", label: "工号" },
@@ -357,6 +326,7 @@ onMounted(() => {
   color: #409eff;
   cursor: pointer;
 }
+
 :deep(.routerlick) {
   h4 {
     margin: 0 !important;
@@ -367,6 +337,7 @@ onMounted(() => {
   p {
     margin: 0 !important;
   }
+
   .content {
     // width: 200px;
     // background-color: hotpink;
@@ -378,13 +349,16 @@ onMounted(() => {
     line-clamp: 2;
     -webkit-box-orient: vertical;
   }
+
   .time {
     display: flex;
-    > span {
+
+    >span {
       flex: none;
       display: flex;
     }
-    > span:nth-child(2) {
+
+    >span:nth-child(2) {
       margin: 0 20px;
     }
   }
@@ -394,27 +368,13 @@ onMounted(() => {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  > div {
-    display: flex;
-  }
-}
-.institution {
-  background: #fff;
-  width: 100%;
-  // height: 100%;
-  // padding: 20px;
-  box-sizing: border-box;
-  display: flex;
 
-  .institution-main {
-    flex: 1;
-    // width: 80%;
-    padding: 20px;
-    box-sizing: border-box;
+  >div {
+    display: flex;
   }
 }
 
-.image-box{
+.image-box {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -427,6 +387,7 @@ onMounted(() => {
   align-items: center;
   margin-left: 15px;
 }
+
 .custom-tree-node {
   flex: 1;
   display: flex;
@@ -435,8 +396,10 @@ onMounted(() => {
   font-size: 14px;
   padding-right: 8px;
 }
+
 :deep(.el-message-box__container) {
   width: 100% !important;
+
   .el-message-box__message {
     width: 100% !important;
   }

src/views/contentManagement/message.vue

@@ -1,92 +1,60 @@
 <template>
-  <div class="institution">
-    <div class="institution-main">
-      <el-form label-position="left" label-width="auto">
-        <el-row :gutter="24">
-          <el-col :span="6">
-            <el-form-item label="消息内容">
-              <el-input
-                v-model="form.searchValue"
-                placeholder="输入消息标题，内容"
-                :prefix-icon="Search"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="6">
-            <el-form-item label="发布机构">
-              <el-cascader
-                clearable
-                style="width: 100%"
-                v-model="form.sendDeptId"
-                :options="institutionList"
-                :props="tableProps"
-              />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="4">
-            <el-form-item label="">
-              <el-button type="primary" @click="getContentList">查询</el-button>
-              <el-button type="primary" plain @click="reset">重置</el-button>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-
-      <Table
-        :tableData="tableData"
-        :columns="columns"
-        :showIndex="false"
-        :showSelect="false"
-        :showOperation="true"
-        :pageInfo="pageInfo"
-        @getList="getList"
-        :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-        @select-all-change="selectAllChange"
-        @select-change="selectChange"
-      >
-        <template v-slot:table-title-btn>
-          <div>
-            <!-- <el-button type="primary" @click="add(ruleFormRef)">
+  <PageMain class="vh100">
+    <el-form label-position="left" label-width="auto">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          <el-form-item label="消息内容">
+            <el-input v-model="form.searchValue" placeholder="输入消息标题，内容" :prefix-icon="Search" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="发布机构">
+            <el-cascader clearable style="width: 100%" v-model="form.sendDeptId" :options="institutionList"
+              :props="tableProps" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="4">
+          <el-form-item label="">
+            <el-button type="primary" @click="getContentList">查询</el-button>
+            <el-button type="primary" plain @click="reset">重置</el-button>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+
+    <Table height="calc(100% - 56px)" :tableData="tableData" :columns="columns" :showIndex="false" :showSelect="false" :showOperation="true"
+      :pageInfo="pageInfo" @getList="getList" :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
+      @select-all-change="selectAllChange" @select-change="selectChange">
+      <template v-slot:table-title-btn>
+        <div>
+          <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-            <el-button
-              @click="router.push({ path: '/content/message/messageEdit' })"
-              ><el-icon><Position /></el-icon>发布新的通知</el-button
-            >
-          </div>
-        </template>
-        <template v-slot:operation="scope">
-          <el-button
-            type="primary"
-            link
-            @click="editor(scope.operationData.row)"
-          >
-            编辑
-          </el-button>
-          <el-button type="primary" link @click="del(scope.operationData.row)">
-            删除
-          </el-button>
-        </template>
-        <template v-slot:search="scope">
-          {{ scope.slotData.label }}
-        </template>
-      </Table>
-    </div>
-    <el-dialog v-model="dialogVisible" title="查看人数" width="1000">
-      <Table
-        :tableData="userTableData"
-        :columns="userColumns"
-        :showIndex="false"
-        :showSelect="false"
-        :showOperation="false"
-        :pageInfo="userPageInfo"
-        @getList="userGetList"
-        :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-      >
-      </Table>
-    </el-dialog>
-  </div>
+          <el-button @click="router.push({ path: '/content/message/messageEdit' })"><el-icon>
+              <Position />
+            </el-icon>发布新的通知</el-button>
+        </div>
+      </template>
+      <template v-slot:operation="scope">
+        <el-button type="primary" link @click="editor(scope.operationData.row)">
+          编辑
+        </el-button>
+        <el-button type="primary" link @click="del(scope.operationData.row)">
+          删除
+        </el-button>
+      </template>
+      <template v-slot:search="scope">
+        {{ scope.slotData.label }}
+      </template>
+    </Table>
+  </PageMain>
+  <el-dialog v-model="dialogVisible" title="查看人数" width="1000">
+    <Table :tableData="userTableData" :columns="userColumns" :showIndex="false" :showSelect="false"
+      :showOperation="false" :pageInfo="userPageInfo" @getList="userGetList"
+      :treeProps="{ children: 'children', hasChildren: 'hasChildren' }">
+    </Table>
+  </el-dialog>
 </template>
 
 <script setup lang="ts">
@@ -217,7 +185,7 @@ const contentId = ref("");
 function openDialog(item: any) {
   contentId.value = item.id;
   dialogVisible.value = true;
-  userTableData.value=[]
+  userTableData.value = []
   getContenUser();
 }
 function getContenUser() {
@@ -342,6 +310,7 @@ onMounted(() => {
   color: #409eff;
   cursor: pointer;
 }
+
 :deep(.routerlick) {
   h4 {
     margin: 0 !important;
@@ -352,6 +321,7 @@ onMounted(() => {
   p {
     margin: 0 !important;
   }
+
   .content {
     // width: 200px;
     // background-color: hotpink;
@@ -363,13 +333,16 @@ onMounted(() => {
     line-clamp: 2;
     -webkit-box-orient: vertical;
   }
+
   .time {
     display: flex;
-    > span {
+
+    >span {
       flex: none;
       display: flex;
     }
-    > span:nth-child(2) {
+
+    >span:nth-child(2) {
       margin: 0 20px;
     }
   }
@@ -379,25 +352,12 @@ onMounted(() => {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  > div {
+
+  >div {
     display: flex;
   }
 }
-.institution {
-  background: #fff;
-  width: 100%;
-  // height: 100%;
-  // padding: 20px;
-  box-sizing: border-box;
-  display: flex;
 
-  .institution-main {
-    flex: 1;
-    // width: 80%;
-    padding: 20px;
-    box-sizing: border-box;
-  }
-}
 :deep(.el-dropdown-link) {
   cursor: pointer;
   color: var(--el-color-primary);
@@ -405,6 +365,7 @@ onMounted(() => {
   align-items: center;
   margin-left: 15px;
 }
+
 .custom-tree-node {
   flex: 1;
   display: flex;
@@ -413,8 +374,10 @@ onMounted(() => {
   font-size: 14px;
   padding-right: 8px;
 }
+
 :deep(.el-message-box__container) {
   width: 100% !important;
+
   .el-message-box__message {
     width: 100% !important;
   }

src/views/marketingManagement/lottery.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="lottery">
+  <PageMain class="vh100">
     <el-form class="form" :model="form">
       <el-row :gutter="20">
         <el-col :span="8">
@@ -22,10 +22,10 @@
         </el-col>
       </el-row>
     </el-form>
-    <el-button class="publish" type="primary" icon="Position" @click="createActive">发布新活动</el-button>
+    <el-button type="primary" icon="Position" @click="createActive">发布新活动</el-button>
     <el-table
       :data="tableData"
-      height="580"
+      height="calc(100% - 132px)"
       style="width: 100%"
     >
       <el-table-column prop="actName" label="活动信息" width="300"></el-table-column>
@@ -71,7 +71,7 @@
         </template>
       </el-table-column>
     </el-table>
-    <div style="display: flex; justify-content: center; margin-top: 15px">
+    <div style="display: flex; justify-content: end; margin-top: 10px">
       <el-pagination
         v-model:current-page="currentPage"
         v-model:page-size="pageSize"
@@ -82,7 +82,7 @@
         @current-change="handleCurrentChange"
       />
     </div>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -227,11 +227,5 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
-.lottery {
-  width: calc(100% - 40px);
-  margin: 20px;
-  .publish{
-    margin-bottom: 20px;
-  }
-}
+
 </style>

src/views/marketingManagement/record.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="record">
+  <PageMain class="vh100">
     <el-form :model="form" label-width="100">
       <el-row :gutter="20">
         <el-col :span="8">
@@ -49,12 +49,10 @@
         </el-col>
       </el-row>
     </el-form>
-    <p>
       <el-button type="primary" @click="exportData">导出数据</el-button>
-    </p>
     <el-table
       :data="tableData"
-      height="580"
+      height="calc(100% - 182px)"
       style="width: 100%"
       row-key="id"
       @selection-change="handleChange"
@@ -73,7 +71,7 @@
       <el-table-column prop="awardName" label="奖品名称" ></el-table-column>
       <el-table-column prop="h" label="中奖数量" ></el-table-column>
     </el-table>
-    <div style="display: flex; justify-content: center; margin-top: 15px">
+    <div style="display: flex; justify-content: end; margin-top: 10px">
       <el-pagination
         v-model:current-page="currentPage"
         v-model:page-size="pageSize"
@@ -84,7 +82,7 @@
         @current-change="handleCurrentChange"
       />
     </div>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -187,9 +185,5 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
-.record{
-  width: 100%;
-  padding: 20px;
-  background: white;
-}
+
 </style>

src/views/operationManagement/channel.vue

@@ -522,6 +522,10 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+:deep(.el-input-group__append) {
+  color: #fff;
+  background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
+}
 .member-tree {
   :deep(.el-tree-node) {
     height: 32px;

src/views/operationManagement/team.vue

@@ -524,6 +524,10 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+:deep(.el-input-group__append) {
+  color: #fff;
+  background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
+}
 .member-tree {
   :deep(.el-tree-node) {
     height: 32px;

src/views/operationManagement/telemarketing.vue

@@ -540,6 +540,10 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+:deep(.el-input-group__append) {
+  color: #fff;
+  background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
+}
 .member-tree {
   :deep(.el-tree-node) {
     height: 32px;

src/views/personnel/memberManagement.vue

@@ -739,6 +739,10 @@ function manySetDeptUser() {
 :deep( .el-tree-node>.el-tree-node__content .el-icon) {
   color: #666;
 }
+:deep(.el-input-group__append) {
+  color: #fff;
+  background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
+}
 
 :deep(.el-table__inner-wrapper:before) {
   display: none

src/views/personnel/roleManagement.vue

@@ -1,40 +1,33 @@
 <template>
   <PageMain class="vh100">
-    <div class="flex  ">
-      <div class="flex f-c" style="width: 300px;">
-        <ElInput v-model="roleName" placeholder="角色名称查找" type="text" tabindex="1">
-          <template #prefix>
-            <SvgIcon name="i-ri:user-3-fill" />
+    <div class="flex  h-full">
+      <div class="w-282px h-full relative flex-shrink-0 member-tree box-border">
+        <el-input v-model="roleName" class="w-250px m-l-8px" placeholder="角色名称查找" @keyup.enter="handleSearch">
+          <template #append>
+            <el-button icon="Search" link @click="handleSearch" />
           </template>
-        </ElInput>
-        <div class="flex a-c mt-2">
-          <ElButton type="primary" @click="addRole">
-            <el-icon>
-              <Plus />
-            </el-icon>添加
-          </ElButton>
-          <ElButton type="primary" @click="handleSearch">查找</ElButton>
-        </div>
-        <div style="height: calc(100vh - 300px); overflow: auto;">
+        </el-input>
+        <div style="height: calc(100% - 80px); overflow: auto;" class="m-t-14px">
           <div v-for="item in searchList" :key="item.id" :class="roleId == item.id ? 'on' : 'role-item'"
-            @click="chooseRole(item)">
-            <p>{{ item.name }}</p>
-            <p>
-              <span>{{ item.remark || "--" }}</span>
-            </p>
+            @click="chooseRole(item)" class="h-64px w-266px p-[0_8px] flex flex-col items-start justify-center">
+            <div class="text-16px color-[#333]">{{ item.name }}</div>
+            <div class="text-14px color-[#666] m-t-4px">{{ item.remark || "--" }}</div>
           </div>
         </div>
+        <div class="flex justify-center">
+          <el-button plain type="primary" icon="plus" @click="addRole">添加</el-button>
+        </div>
       </div>
-      <div class="flex f-c flex-1 ml-12">
-        <div class="flex j-s a-c" style="margin-top: 20px;">
-          <span class="strong">角色管理</span>
+      <div class="w-[calc(100%-282px)]">
+        <div class="flex m-r--16px m-t-4px h-52px justify-between items-center p-b-20px p-l-24px p-r-24px b-b-(1px solid #EEEEEE)" >
+          <div class="text-20px color-[#333] font-500" >角色管理</div>
           <div>
             <ElButton type="primary" @click="roleSubmit(roleRef)">提交</ElButton>
             <ElButton type="danger" @click="deleteRole">删除</ElButton>
           </div>
         </div>
-        <h5>基本信息</h5>
-        <ElForm :model="roleInfo" :rules="roleRules" ref="roleRef" label-width="auto" size="" style="max-width: 500px;">
+        <div class="text-18px color-[#333] font-500 h-20px leading-20px p-l-24px m-t-32px">基本信息</div>
+        <ElForm class="p-l-24px m-t-24px" :model="roleInfo" :rules="roleRules" ref="roleRef" label-width="auto" size="" style="max-width: 500px;">
           <ElFormItem prop="name" label="角色名称">
             <ElInput v-model="roleInfo.name" placeholder="输入20个字以内的角色名称" type="text" tabindex="1">
             </ElInput>
@@ -48,14 +41,16 @@
             </ElInput>
           </ElFormItem>
         </ElForm>
-        <ElDivider></ElDivider>
+        <div class="p-[0_8px_0_24px]">
+          <ElDivider></ElDivider>
+        </div>
         <div>
-          <h5>角色权限
-            <span style=" font-size: 12px; font-weight: 400;color: #ccc;">
+          <div class="m-t-32px h-20px text-18px color-[#333] font-500 p-l-24px flex items-center leading-[1]">角色权限
+            <span class="m-l-12px text-14px color-[#666]" >
               (该角色享有的后台模块功能权限剩余数据权限)
             </span>
-          </h5>
-          <el-tabs :tab-position="'left'" class="demo-tabs">
+          </div>
+          <el-tabs :tab-position="'left'" class="demo-tabs m-t-24px">
             <el-tab-pane label="菜单/操作权限" style="height: 340px;overflow-y: auto;">
               <ElTree :data="treeData" ref="permsRef" :props="defaultProps" show-checkbox node-key="id"
                 :default-expand-all="true" :default-checked-keys="checkedKeys" @check="handleCheckChange">
@@ -497,56 +492,32 @@ onMounted(() => {
 </script>
 
 <style lang="scss" scoped>
-.roleitem {
-  padding: 20px;
-  cursor: pointer;
-  background: white;
+:deep(.main-container){
+  padding: 16px;
 }
-
-.roleitem:hover {
-  background: #b4b2b2;
-  transition: 0.2s;
-}
-
-.active {
-  background: #b4b2b2;
+:deep(.el-input-group__append) {
+  color: #fff;
+  background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
 }
-
-p {
-  margin: 0;
+.member-tree {
+  &::after {
+    content: '';
+    position: absolute;
+    height: calc(100% + 40px);
+    width: 1px;
+    background-color: #EEEEEE;
+    top: -16px;
+    right: 0;
+    bottom: -16px;
+  }
 }
-
 .role-item {
-  box-sizing: border-box;
-  padding: 0 10px;
-  margin-top: 10px;
   cursor: pointer;
-
-  >p {
-    span {
-      font-size: 10px;
-      color: #b4b2b2;
-    }
-  }
-
-  // >p:last-child{
-  //   // margin: 5px 0;
-
-  // }
 }
 
 .on {
-  box-sizing: border-box;
-  padding: 0 10px;
-  margin-top: 10px;
   cursor: pointer;
-  background: rgb(242 242 242);
-
-  >p {
-    span {
-      font-size: 10px;
-      color: #b4b2b2;
-    }
-  }
+  background: #F4FAFF;
+  border-right: 1px solid #0083FF;
 }
 </style>

src/views/representative/member.vue

@@ -1,143 +1,141 @@
 <template>
-  <div class="institution">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-      <el-tab-pane :label="'待审核' + '(' + countObj?.noAuditCount + ')'" name="hold">
-        <div class="institution-main">
-          <el-form label-position="left" label-width="auto">
-            <el-row :gutter="24">
-              <el-col :span="6">
-                <el-form-item label="成员信息">
-                  <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="归属机构">
-                  <el-cascader clearable style="width: 100%" v-model="info.deptId" :options="institutionList"
-                    :props="tableProps" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="状态">
-                  <el-select clearable style="width: 100%" v-model="info.status">
-                    <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-
-              <el-col :span="4">
-                <el-form-item label="">
-                  <el-button type="primary" @click="salesmanAuth">查询</el-button>
-                  <el-button type="primary" plain @click="reset">重置</el-button>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-
-          <Table :tableData="tableData" :columns="columns" :showIndex="false" :showSelect="true" :pageInfo="pageInfo"
-            @getList="getList" :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-            @select-all-change="selectAllChange" @select-change="selectChange">
-            <template v-slot:table-title-btn>
-              <div>
-                <!-- <el-button type="primary" @click="add(ruleFormRef)">
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="h-full" @tab-click="handleClick">
+      <el-tab-pane :label="'待审核' + '(' + countObj?.noAuditCount + ')'" name="hold" class="h-full">
+        <el-form label-position="left" label-width="auto">
+          <el-row :gutter="24">
+            <el-col :span="6">
+              <el-form-item label="成员信息">
+                <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="归属机构">
+                <el-cascader clearable style="width: 100%" v-model="info.deptId" :options="institutionList"
+                  :props="tableProps" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="状态">
+                <el-select clearable style="width: 100%" v-model="info.status">
+                  <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="4">
+              <el-form-item label="">
+                <el-button type="primary" @click="salesmanAuth">查询</el-button>
+                <el-button type="primary" plain @click="reset">重置</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+
+        <Table height="calc(100% - 56px)" :tableData="tableData" :columns="columns" :showIndex="false"
+          :showSelect="true" :pageInfo="pageInfo" @getList="getList"
+          :treeProps="{ children: 'children', hasChildren: 'hasChildren' }" @select-all-change="selectAllChange"
+          @select-change="selectChange">
+          <template v-slot:table-title-btn>
+            <div>
+              <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-                <el-dropdown placement="bottom-start">
-                  <el-button>
-                    批量操作<el-icon class="el-icon--right">
-                      <arrow-down />
-                    </el-icon>
-                  </el-button>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item>审核</el-dropdown-item>
-                      <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </div>
-            </template>
-            <template v-slot:operation="scope">
-              <el-button type="primary" link @click="toExamine(scope.operationData.row, 'success')">
-                审核通过
-              </el-button>
-              <el-button type="primary" link @click="toExamine(scope.operationData.row, 'error')">
-                审核不通过
-              </el-button>
-              <el-button type="primary" link @click="editor(scope.operationData.row)">
-                详情
-              </el-button>
-            </template>
-            <template v-slot:search="scope">
-              {{ scope.slotData.label }}
-            </template>
-          </Table>
-        </div>
+              <el-dropdown placement="bottom-start">
+                <el-button>
+                  批量操作<el-icon class="el-icon--right">
+                    <arrow-down />
+                  </el-icon>
+                </el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item>审核</el-dropdown-item>
+                    <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+          </template>
+          <template v-slot:operation="scope">
+            <el-button type="primary" link @click="toExamine(scope.operationData.row, 'success')">
+              审核通过
+            </el-button>
+            <el-button type="primary" link @click="toExamine(scope.operationData.row, 'error')">
+              审核不通过
+            </el-button>
+            <el-button type="primary" link @click="editor(scope.operationData.row)">
+              详情
+            </el-button>
+          </template>
+          <template v-slot:search="scope">
+            {{ scope.slotData.label }}
+          </template>
+        </Table>
       </el-tab-pane>
-      <el-tab-pane :label="'审核不通过' + '(' + countObj?.failAuditCount + ')'" name="pass">
-        <div class="institution-main">
-          <el-form label-position="left" label-width="auto">
-            <el-row :gutter="24">
-              <el-col :span="6">
-                <el-form-item label="成员信息">
-                  <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="归属机构">
-                  <el-cascader clearable style="width: 100%" v-model="info.deptId" :options="institutionList"
-                    :props="tableProps" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="状态">
-                  <el-select clearable style="width: 100%" v-model="info.status">
-                    <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-
-              <el-col :span="4">
-                <el-form-item label="">
-                  <el-button type="primary" @click="salesmanAuth">查询</el-button>
-                  <el-button type="primary" plain @click="reset">重置</el-button>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-
-          <Table :tableData="tableData" :columns="columns" :showIndex="false" :showSelect="true" :pageInfo="pageInfo"
-            @getList="getList" :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-            @select-all-change="selectAllChange" @select-change="selectChange">
-            <template v-slot:table-title-btn>
-              <div>
-                <!-- <el-button type="primary" @click="add(ruleFormRef)">
+      <el-tab-pane :label="'审核不通过' + '(' + countObj?.failAuditCount + ')'" name="pass" class="h-full">
+        <el-form label-position="left" label-width="auto">
+          <el-row :gutter="24">
+            <el-col :span="6">
+              <el-form-item label="成员信息">
+                <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="归属机构">
+                <el-cascader clearable style="width: 100%" v-model="info.deptId" :options="institutionList"
+                  :props="tableProps" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="状态">
+                <el-select clearable style="width: 100%" v-model="info.status">
+                  <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="4">
+              <el-form-item label="">
+                <el-button type="primary" @click="salesmanAuth">查询</el-button>
+                <el-button type="primary" plain @click="reset">重置</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+
+        <Table height="calc(100% - 56px)" :tableData="tableData" :columns="columns" :showIndex="false"
+          :showSelect="true" :pageInfo="pageInfo" @getList="getList"
+          :treeProps="{ children: 'children', hasChildren: 'hasChildren' }" @select-all-change="selectAllChange"
+          @select-change="selectChange">
+          <template v-slot:table-title-btn>
+            <div>
+              <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-                <el-dropdown placement="bottom-start">
-                  <el-button>
-                    批量操作<el-icon class="el-icon--right">
-                      <arrow-down />
-                    </el-icon>
-                  </el-button>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item>审核</el-dropdown-item>
-                      <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </div>
-            </template>
-            <template v-slot:operation="scope">
-              <el-button type="primary" link @click="editor(scope.operationData.row)">
-                详情
-              </el-button>
-            </template>
-            <template v-slot:search="scope">
-              {{ scope.slotData.label }}
-            </template>
-          </Table>
-        </div>
+              <el-dropdown placement="bottom-start">
+                <el-button>
+                  批量操作<el-icon class="el-icon--right">
+                    <arrow-down />
+                  </el-icon>
+                </el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item>审核</el-dropdown-item>
+                    <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+          </template>
+          <template v-slot:operation="scope">
+            <el-button type="primary" link @click="editor(scope.operationData.row)">
+              详情
+            </el-button>
+          </template>
+          <template v-slot:search="scope">
+            {{ scope.slotData.label }}
+          </template>
+        </Table>
       </el-tab-pane>
     </el-tabs>
 
@@ -150,7 +148,7 @@
         </div>
       </template>
     </el-dialog>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -457,28 +455,6 @@ onMounted(() => {
   }
 }
 
-.institution {
-  background: #fff;
-  width: 100%;
-  // height: 100%;
-  // padding: 20px;
-  box-sizing: border-box;
-  display: flex;
-
-  :deep(.demo-tabs) {
-    width: 100%;
-    padding: 20px;
-    box-sizing: border-box;
-  }
-
-  // .institution-main {
-  //   flex: 1;
-  //   // width: 80%;
-  //   padding: 20px;
-  //   box-sizing: border-box;
-  // }
-}
-
 :deep(.el-dropdown-link) {
   cursor: pointer;
   color: var(--el-color-primary);

src/views/representative/quoteApproval.vue

@@ -1,5 +1,4 @@
 <template>
-  <div>
     <PageMain class="vh100">
       <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
         <el-tab-pane :label="`待审核（${pendingReviewlength}）`" name="pendingReview">
@@ -39,7 +38,6 @@
     <ruleFeeDialogEdit :ruleFeeVisible="ruleFeeEditVisible" :headerTitle="ruleFeeHeaderTitle"
       :agreementInfo="AgreementInfo" :RulesInfo="ruleInfo" :costitemEditInfo="costitemEditInfo" @save="ruleFeeEditSave"
       @cancel="ruleFeeEditVisible = false" operationType="audit" @rejectOperation="rejectOperation" @auditOperation="auditOperation" />
-  </div>
 </template>
 
 <script lang="ts" setup>

src/views/representative/salesman.vue

@@ -1,131 +1,129 @@
 <template>
-  <div class="institution">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-      <el-tab-pane :label="'待审核' + '(' + countObj?.noAuditCount + ')'" name="hold">
-        <div class="institution-main">
-          <el-form label-position="left" label-width="auto">
-            <el-row :gutter="24">
-              <el-col :span="6">
-                <el-form-item label="成员信息">
-                  <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="归属机构">
-                  <el-select v-model="form.leaderId" placeholder="归属机构" clearable>
-                    <el-option v-for="item in memberList" :key="item.id" :label="item.name" :value="item.id" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-
-              <el-col :span="4">
-                <el-form-item label="">
-                  <el-button type="primary">查询</el-button>
-                  <el-button type="primary" plain @click="reset">重置</el-button>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-
-          <Table :tableData="tableData" :columns="columns" :showIndex="false" :showSelect="true" :pageInfo="pageInfo"
-            @getList="getList" :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-            @select-all-change="selectAllChange" @select-change="selectChange">
-            <template v-slot:table-title-btn>
-              <div>
-                <!-- <el-button type="primary" @click="add(ruleFormRef)">
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane :label="'待审核' + '(' + countObj?.noAuditCount + ')'" name="hold" class="h-full">
+        <el-form label-position="left" label-width="auto">
+          <el-row :gutter="24">
+            <el-col :span="6">
+              <el-form-item label="成员信息">
+                <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="归属机构">
+                <el-select v-model="form.leaderId" placeholder="归属机构" clearable>
+                  <el-option v-for="item in memberList" :key="item.id" :label="item.name" :value="item.id" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="4">
+              <el-form-item label="">
+                <el-button type="primary">查询</el-button>
+                <el-button type="primary" plain @click="reset">重置</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+
+        <Table height="calc(100% - 56px)" :tableData="tableData" :columns="columns" :showIndex="false"
+          :showSelect="true" :pageInfo="pageInfo" @getList="getList"
+          :treeProps="{ children: 'children', hasChildren: 'hasChildren' }" @select-all-change="selectAllChange"
+          @select-change="selectChange">
+          <template v-slot:table-title-btn>
+            <div>
+              <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-                <el-dropdown placement="bottom-start">
-                  <el-button>
-                    批量操作<el-icon class="el-icon--right">
-                      <arrow-down />
-                    </el-icon>
-                  </el-button>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item>审核</el-dropdown-item>
-                      <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </div>
-            </template>
-            <template v-slot:operation="scope">
-              <el-button type="primary" link @click="toExamine(scope.operationData.row, 'success')">
-                审核通过
-              </el-button>
-              <el-button type="primary" link @click="toExamine(scope.operationData.row, 'error')">
-                审核不通过
-              </el-button>
-              <el-button type="primary" link @click="editor(scope.operationData.row)">
-                详情
-              </el-button>
-            </template>
-            <template v-slot:search="scope">
-              {{ scope.slotData.label }}
-            </template>
-          </Table>
-        </div>
+              <el-dropdown placement="bottom-start">
+                <el-button>
+                  批量操作<el-icon class="el-icon--right">
+                    <arrow-down />
+                  </el-icon>
+                </el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item>审核</el-dropdown-item>
+                    <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+          </template>
+          <template v-slot:operation="scope">
+            <el-button type="primary" link @click="toExamine(scope.operationData.row, 'success')">
+              审核通过
+            </el-button>
+            <el-button type="primary" link @click="toExamine(scope.operationData.row, 'error')">
+              审核不通过
+            </el-button>
+            <el-button type="primary" link @click="editor(scope.operationData.row)">
+              详情
+            </el-button>
+          </template>
+          <template v-slot:search="scope">
+            {{ scope.slotData.label }}
+          </template>
+        </Table>
       </el-tab-pane>
-      <el-tab-pane :label="'审核不通过' + '(' + countObj?.failAuditCount + ')'" name="pass">
-        <div class="institution-main">
-          <el-form label-position="left" label-width="auto">
-            <el-row :gutter="24">
-              <el-col :span="6">
-                <el-form-item label="成员信息">
-                  <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="归属机构">
-                  <el-select v-model="form.leaderId" placeholder="归属机构" clearable>
-                    <el-option v-for="item in memberList" :key="item.id" :label="item.name" :value="item.id" />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-
-              <el-col :span="4">
-                <el-form-item label="">
-                  <el-button type="primary">查询</el-button>
-                  <el-button type="primary" plain @click="reset">重置</el-button>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-
-          <Table :tableData="tableData" :columns="columns" :showIndex="false" :showSelect="true" :pageInfo="pageInfo"
-            @getList="getList" :treeProps="{ children: 'children', hasChildren: 'hasChildren' }"
-            @select-all-change="selectAllChange" @select-change="selectChange">
-            <template v-slot:table-title-btn>
-              <div>
-                <!-- <el-button type="primary" @click="add(ruleFormRef)">
+      <el-tab-pane :label="'审核不通过' + '(' + countObj?.failAuditCount + ')'" name="pass" class="h-full">
+        <el-form label-position="left" label-width="auto">
+          <el-row :gutter="24">
+            <el-col :span="6">
+              <el-form-item label="成员信息">
+                <el-input v-model="formAccessibility.firstName" placeholder="输入成员信息查找" :prefix-icon="Search" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="归属机构">
+                <el-select v-model="form.leaderId" placeholder="归属机构" clearable>
+                  <el-option v-for="item in memberList" :key="item.id" :label="item.name" :value="item.id" />
+                </el-select>
+              </el-form-item>
+            </el-col>
+
+            <el-col :span="4">
+              <el-form-item label="">
+                <el-button type="primary">查询</el-button>
+                <el-button type="primary" plain @click="reset">重置</el-button>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+
+        <Table height="calc(100% - 56px)" :tableData="tableData" :columns="columns" :showIndex="false"
+          :showSelect="true" :pageInfo="pageInfo" @getList="getList"
+          :treeProps="{ children: 'children', hasChildren: 'hasChildren' }" @select-all-change="selectAllChange"
+          @select-change="selectChange">
+          <template v-slot:table-title-btn>
+            <div>
+              <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-                <el-dropdown placement="bottom-start">
-                  <el-button>
-                    批量操作<el-icon class="el-icon--right">
-                      <arrow-down />
-                    </el-icon>
-                  </el-button>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item>审核</el-dropdown-item>
-                      <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </div>
-            </template>
-            <template v-slot:operation="scope">
-              <el-button type="primary" link @click="editor(scope.operationData.row)">
-                详情
-              </el-button>
-            </template>
-            <template v-slot:search="scope">
-              {{ scope.slotData.label }}
-            </template>
-          </Table>
-        </div>
+              <el-dropdown placement="bottom-start">
+                <el-button>
+                  批量操作<el-icon class="el-icon--right">
+                    <arrow-down />
+                  </el-icon>
+                </el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item>审核</el-dropdown-item>
+                    <!-- <el-dropdown-item v-on:click="manySetDeptUser()">设置负责人</el-dropdown-item> -->
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+          </template>
+          <template v-slot:operation="scope">
+            <el-button type="primary" link @click="editor(scope.operationData.row)">
+              详情
+            </el-button>
+          </template>
+          <template v-slot:search="scope">
+            {{ scope.slotData.label }}
+          </template>
+        </Table>
       </el-tab-pane>
     </el-tabs>
 
@@ -138,7 +136,7 @@
         </div>
       </template>
     </el-dialog>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -435,28 +433,6 @@ onMounted(() => {
   }
 }
 
-.institution {
-  // height: 100%;
-  // padding: 20px;
-  box-sizing: border-box;
-  display: flex;
-  width: 100%;
-  background: #fff;
-
-  :deep(.demo-tabs) {
-    box-sizing: border-box;
-    width: 100%;
-    padding: 20px;
-  }
-
-  // .institution-main {
-  //   flex: 1;
-  //   // width: 80%;
-  //   padding: 20px;
-  //   box-sizing: border-box;
-  // }
-}
-
 :deep(.el-dropdown-link) {
   display: flex;
   align-items: center;

src/views/sale/commission.vue

@@ -1,31 +1,16 @@
 <template>
   <div>
     <PageMain class="vh100">
-      <ElForm
-        :inline="false"
-        :model="formInline"
-        class="demo-form-inline"
-        label-width="100px"
-      >
+      <ElForm :inline="false" :model="formInline" class="demo-form-inline" label-width="100px">
         <ElRow :gutter="20">
           <ElCol :md="8">
             <ElFormItem label="分销员姓名">
-              <el-input
-                v-model="formInline.distributor"
-                placeholder="请输入姓名查找"
-                clearable
-                class="el-inputs"
-              />
+              <el-input v-model="formInline.distributor" placeholder="请输入姓名查找" clearable class="el-inputs" />
             </ElFormItem>
           </ElCol>
           <ElCol :md="8">
             <ElFormItem label="分销员手机号">
-              <el-input
-                v-model="formInline.distributorMobile"
-                placeholder="请输入手机号查找"
-                clearable
-                class="el-inputs"
-              />
+              <el-input v-model="formInline.distributorMobile" placeholder="请输入手机号查找" clearable class="el-inputs" />
             </ElFormItem>
           </ElCol>
           <!-- <ElCol :md="8">
@@ -40,15 +25,8 @@
           </ElCol> -->
           <ElCol :md="8">
             <ElFormItem label="签单时间">
-              <el-date-picker
-                v-model="joinTimeRange"
-                type="daterange"
-                range-separator="至"
-                start-placeholder="开始时间"
-                end-placeholder="结束时间"
-                size="default"
-                format="YYYY-MM-DD"
-              />
+              <el-date-picker v-model="joinTimeRange" type="daterange" range-separator="至" start-placeholder="开始时间"
+                end-placeholder="结束时间" size="default" format="YYYY-MM-DD" />
             </ElFormItem>
           </ElCol>
           <ElCol :md="6">
@@ -58,8 +36,7 @@
                   <template #icon>
                     <SvgIcon name="i-ep:search" />
                   </template>
-                  查询</el-button
-                >
+                  查询</el-button>
                 <el-button type="default" @click="resetForm">重置</el-button>
               </div>
             </ElFormItem>
@@ -69,63 +46,35 @@
       <div>
         <el-button type="default" @click="exportExcel">导出</el-button>
       </div>
-      <div style="height: 559px;">
-        <el-table :data="tableData">
-          <el-table-column prop="orderNo" label="订单编号" width="180">
-            <template #default="{ row }">
-              <el-link
-                type="primary"
-                @click="handleOrderClick(row.orderNo, row)"
-              >
-                {{ row.orderNo }}
-              </el-link>
-            </template>
-          </el-table-column>
-          <el-table-column prop="premium" label="保费金额" width="180" />
-          <el-table-column prop="salesman" label="业务员" width="150" />
-          <el-table-column
-            prop="salesmanMobile"
-            label="业务员手机号"
-            width="180"
-          />
-          <el-table-column prop="signingTime" label="签单时间" width="180" />
-          <el-table-column prop="distributor" label="分销员" width="100" />
-          <el-table-column
-            prop="distributorMobile"
-            label="分销员手机号"
-            width="180"
-          />
+      <el-table :data="tableData" height="calc(100% - 180px)">
+        <el-table-column prop="orderNo" label="订单编号" width="180">
+          <template #default="{ row }">
+            <el-link type="primary" @click="handleOrderClick(row.orderNo, row)">
+              {{ row.orderNo }}
+            </el-link>
+          </template>
+        </el-table-column>
+        <el-table-column prop="premium" label="保费金额" width="180" />
+        <el-table-column prop="salesman" label="业务员" width="150" />
+        <el-table-column prop="salesmanMobile" label="业务员手机号" width="180" />
+        <el-table-column prop="signingTime" label="签单时间" width="180" />
+        <el-table-column prop="distributor" label="分销员" width="100" />
+        <el-table-column prop="distributorMobile" label="分销员手机号" width="180" />
 
-          <el-table-column prop="commission" label="分销员金额" width="180" />
+        <el-table-column prop="commission" label="分销员金额" width="180" />
 
-          <el-table-column
-            prop="distributionLevel"
-            label="分销员等级"
-            width="100"
-          >
+        <el-table-column prop="distributionLevel" label="分销员等级" width="100">
           <template #default="{ row }">
-             {{ row.distributionLevel==1?'一级分销':row.distributionLevel==2?'二级分销':'三级分销' }}
-            </template>
+            {{ row.distributionLevel == 1 ? '一级分销' : row.distributionLevel == 2 ? '二级分销' : '三级分销' }}
+          </template>
         </el-table-column>
-          <el-table-column
-            prop="distributionRatio"
-            label="分销比例"
-            width="180"
-          />
-        </el-table>
-      </div>
+        <el-table-column prop="distributionRatio" label="分销比例" width="180" />
+      </el-table>
 
       <div class="pagination-wrapper">
-        <el-pagination
-          v-model:current-page="pageInfo.pageNum"
-          v-model:page-size="pageInfo.pageSize"
-          :page-sizes="[10, 20, 30, 50, 100]"
-          :total="pageInfo.total"
-          layout="total, sizes, prev, pager, next, jumper"
-          background
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-        />
+        <el-pagination v-model:current-page="pageInfo.pageNum" v-model:page-size="pageInfo.pageSize"
+          :page-sizes="[10, 20, 30, 50, 100]" :total="pageInfo.total" layout="total, sizes, prev, pager, next, jumper"
+          background @size-change="handleSizeChange" @current-change="handleCurrentChange" />
       </div>
     </PageMain>
   </div>
@@ -235,7 +184,7 @@ const handleCurrentChange = (newPage: number) => {
 const handleOrderClick = (orderNo: string, row: any) => {
   const resolved = router.resolve({
     path: `/additionalOrder/order/orderDetail`,
-     query: { 
+    query: {
       id: row.orderNo  // 查询参数，id 的值为 row.orderNo
     }
   });
@@ -276,21 +225,25 @@ watch(
 .el-inputs {
   width: 100% !important;
 }
+
 ::v-deep.el-table td.el-table__cell div i {
   display: none;
 }
+
 ::v-deep.el-table .caret-wrapper {
   display: none;
 }
+
 :deep(.current-style) {
   color: #339dff;
   position: relative;
   padding-left: 20px;
 }
+
 .pagination-wrapper {
   display: flex;
   justify-content: flex-end; // 右对齐
   width: 100%;
-  padding: 20px 0;
+  padding-top: 10px;
 }
 </style>

src/views/sale/review.vue

@@ -1,24 +1,18 @@
 <template>
-  <div class="order">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
-      <el-tab-pane name="first">
+  <PageMain class="vh100">
+    <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleClick">
+      <el-tab-pane name="first" class="h-full">
         <template #label> 待审核（{{ total1 }}） </template>
         <el-form label-width="100" label-position="left" :model="form">
           <el-row :gutter="20">
             <el-col :span="8">
               <el-form-item label="姓名">
-                <el-input
-                  v-model="form.name"
-                  placeholder="请输入姓名查找"
-                ></el-input>
+                <el-input v-model="form.name" placeholder="请输入姓名查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="手机号">
-                <el-input
-                  v-model="form.mobile"
-                  placeholder="请输入手机号查找"
-                ></el-input>
+                <el-input v-model="form.mobile" placeholder="请输入手机号查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
@@ -28,16 +22,8 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="申请时间">
-                <el-date-picker
-                  v-model="joinTimeRange"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="joinTimeRange" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="24" style="display: flex; justify-content: flex-end">
@@ -46,7 +32,7 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="tableData1" style="margin-top: 24px" hight="500">
+        <el-table :data="tableData1" style="margin-top: 8px" height="calc(100% - 188px)">
           <el-table-column label="姓名" prop="name" width="200">
           </el-table-column>
           <el-table-column label="手机号" prop="mobile"></el-table-column>
@@ -56,29 +42,22 @@
                 scope.row.typeAttr == "5"
                   ? "团队"
                   : scope.row.typeAttr == "6"
-                  ? "个代"
-                  : scope.row.typeAttr == "7"
-                  ? "渠道"
-                  : scope.row.typeAttr== "8"
-                  ? "电销组"
-                  : "--"
+                    ? "个代"
+                    : scope.row.typeAttr == "7"
+                      ? "渠道"
+                      : scope.row.typeAttr == "8"
+                        ? "电销组"
+                        : "--"
               }}
             </template>
           </el-table-column>
           <el-table-column label="所属机构" prop="deptName"></el-table-column>
-          <el-table-column
-            label="推荐上级"
-            prop="referrerName"
-          ></el-table-column>
+          <el-table-column label="推荐上级" prop="referrerName"></el-table-column>
           <el-table-column label="申请时间" prop="applyTime"></el-table-column>
           <el-table-column label="操作" fixed="right" width="200">
             <template #default="scope">
               <!-- <el-button link type="primary">审核通过</el-button> -->
-              <el-popconfirm
-                title="确定审核通过?"
-                :hide-icon="true"
-                @confirm="review(scope.row)"
-              >
+              <el-popconfirm title="确定审核通过?" :hide-icon="true" @confirm="review(scope.row)">
                 <template #reference>
                   <el-button type="text">审核通过</el-button>
                 </template>
@@ -86,23 +65,14 @@
               <!-- <el-button link type="primary" @click="handleEdit(scope.row)"
                 >驳回</el-button
               > -->
-              <el-popconfirm
-                width="220"
-                title="审核驳回"
-                @confirm="reviewReject(scope.row)"
-              >
+              <el-popconfirm width="220" title="审核驳回" @confirm="reviewReject(scope.row)">
                 <template #reference>
                   <el-button type="text">驳回</el-button>
                 </template>
-                <template #default="{}"> </template>
+                <template #default="{ }"> </template>
                 <template #actions="{ confirm, cancel }">
-                  <el-input
-                    v-model="remark"
-                    style="width: 100%; margin: 10px 0"
-                    :rows="2"
-                    type="textarea"
-                    placeholder="请输入驳回原因"
-                  />
+                  <el-input v-model="remark" style="width: 100%; margin: 10px 0" :rows="2" type="textarea"
+                    placeholder="请输入驳回原因" />
                   <el-button size="small" @click="cancel">取消</el-button>
                   <el-button type="danger" size="small" @click="confirm">
                     确认驳回
@@ -113,35 +83,23 @@
           </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>
+          <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 name="second">
+      <el-tab-pane name="second" class="h-full">
         <template #label> 审核通过（{{ total2 }}） </template>
         <el-form label-width="100" label-position="left" :model="form">
           <el-row :gutter="20">
             <el-col :span="8">
               <el-form-item label="姓名">
-                <el-input
-                  v-model="form.name"
-                  placeholder="请输入姓名查找"
-                ></el-input>
+                <el-input v-model="form.name" placeholder="请输入姓名查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="手机号">
-                <el-input
-                  v-model="form.mobile"
-                  placeholder="请输入手机号查找"
-                ></el-input>
+                <el-input v-model="form.mobile" placeholder="请输入手机号查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
@@ -151,16 +109,8 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="申请时间">
-                <el-date-picker
-                  v-model="joinTimeRange"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="joinTimeRange" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="8">
@@ -170,16 +120,8 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="审核时间">
-                <el-date-picker
-                  v-model="reviewTimeRange"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="reviewTimeRange" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="timeChange" />
               </el-form-item>
             </el-col>
 
@@ -189,7 +131,7 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="tableData2" style="margin-top: 24px" hight="500">
+        <el-table :data="tableData2" style="margin-top: 8px" height="calc(100% - 188px)">
           <el-table-column label="审核人" prop="auditPerson" width="200">
           </el-table-column>
           <el-table-column label="审核时间" prop="applyTime"></el-table-column>
@@ -202,52 +144,37 @@
                 scope.row.typeAttr == "5"
                   ? "团队"
                   : scope.row.typeAttr == "6"
-                  ? "个代"
-                  : scope.row.typeAttr == "7"
-                  ? "渠道"
-                  : scope.row.typeAttr== "8"
-                  ? "电销组"
-                  : "--"
+                    ? "个代"
+                    : scope.row.typeAttr == "7"
+                      ? "渠道"
+                      : scope.row.typeAttr == "8"
+                        ? "电销组"
+                        : "--"
               }}
             </template>
           </el-table-column>
           <el-table-column label="所属机构" prop="deptName"></el-table-column>
-          <el-table-column
-            label="推荐上级"
-            prop="referrerName"
-          ></el-table-column>
+          <el-table-column label="推荐上级" prop="referrerName"></el-table-column>
           <el-table-column label="申请时间" prop="applyTime"></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>
+          <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 name="third">
+      <el-tab-pane name="third" class="h-full">
         <template #label> 审核不通过（{{ total3 }}） </template>
         <el-form label-width="100" label-position="left" :model="form">
           <el-row :gutter="20">
             <el-col :span="8">
               <el-form-item label="姓名">
-                <el-input
-                  v-model="form.name"
-                  placeholder="请输入姓名查找"
-                ></el-input>
+                <el-input v-model="form.name" placeholder="请输入姓名查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="手机号">
-                <el-input
-                  v-model="form.mobile"
-                  placeholder="请输入手机号查找"
-                ></el-input>
+                <el-input v-model="form.mobile" placeholder="请输入手机号查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
@@ -257,16 +184,8 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="申请时间">
-                <el-date-picker
-                  v-model="joinTimeRange"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="joinTimeRange" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="8">
@@ -276,16 +195,9 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="审核时间">
-                <el-date-picker
-                  v-model="form.recordingTime"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="form.recordingTime" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
+                  @change="timeChange" />
               </el-form-item>
             </el-col>
 
@@ -295,98 +207,49 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="tableData3" style="margin-top: 24px" height="500">
-          <el-table-column
-            label="审核人"
-            prop="auditPerson"
-            width="120"
-          ></el-table-column>
-          <el-table-column
-            label="审核时间"
-            prop="auditTime"
-            width="220"
-          ></el-table-column>
-          <el-table-column
-            label="驳回原因"
-            prop="remark"
-            width=""
-            show-overflow-tooltip
-          ></el-table-column>
-          <el-table-column
-            label="姓名"
-            prop="name"
-            width="120"
-          ></el-table-column>
-          <el-table-column
-            label="手机号"
-            prop="mobile"
-            width="120"
-          ></el-table-column>
-          <el-table-column
-            label="类型"
-            prop="typeAttr"
-            width="120"
-          >
-        <template #default="scope">
+        <el-table :data="tableData3" style="margin-top: 8px"  height="calc(100% - 188px)">
+          <el-table-column label="审核人" prop="auditPerson" width="120"></el-table-column>
+          <el-table-column label="审核时间" prop="auditTime" width="220"></el-table-column>
+          <el-table-column label="驳回原因" prop="remark" width="" show-overflow-tooltip></el-table-column>
+          <el-table-column label="姓名" prop="name" width="120"></el-table-column>
+          <el-table-column label="手机号" prop="mobile" width="120"></el-table-column>
+          <el-table-column label="类型" prop="typeAttr" width="120">
+            <template #default="scope">
               {{
                 scope.row.typeAttr == "5"
                   ? "团队"
                   : scope.row.typeAttr == "6"
-                  ? "个代"
-                  : scope.row.typeAttr == "7"
-                  ? "渠道"
-                  : scope.row.typeAttr== "8"
-                  ? "电销组"
-                  : "--"
+                    ? "个代"
+                    : scope.row.typeAttr == "7"
+                      ? "渠道"
+                      : scope.row.typeAttr == "8"
+                        ? "电销组"
+                        : "--"
               }}
             </template>
           </el-table-column>
-          <el-table-column
-            label="所属机构"
-            prop="deptName"
-            width="120"
-          ></el-table-column>
-          <el-table-column
-            label="推荐上级"
-            prop="referrerName"
-            width="120"
-          ></el-table-column>
-          <el-table-column
-            label="申请时间"
-            prop="applyTime"
-            width="220"
-          ></el-table-column>
+          <el-table-column label="所属机构" prop="deptName" width="120"></el-table-column>
+          <el-table-column label="推荐上级" prop="referrerName" width="120"></el-table-column>
+          <el-table-column label="申请时间" prop="applyTime" width="220"></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>
+          <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-tab-pane name="fourthly">
+      <el-tab-pane name="fourthly" class="h-full">
         <template #label> 自动审核{{ total4 }}） </template>
         <el-form label-width="100" label-position="left" :model="form">
           <el-row :gutter="20">
             <el-col :span="8">
               <el-form-item label="姓名">
-                <el-input
-                  v-model="form.name"
-                  placeholder="请输入姓名查找"
-                ></el-input>
+                <el-input v-model="form.name" placeholder="请输入姓名查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
               <el-form-item label="手机号">
-                <el-input
-                  v-model="form.mobile"
-                  placeholder="请输入手机号查找"
-                ></el-input>
+                <el-input v-model="form.mobile" placeholder="请输入手机号查找"></el-input>
               </el-form-item>
             </el-col>
             <el-col :span="8">
@@ -396,16 +259,8 @@
             </el-col>
             <el-col :span="8">
               <el-form-item label="申请时间">
-                <el-date-picker
-                  v-model="joinTimeRange"
-                  type="daterange"
-                  range-separator="至"
-                  start-placeholder="开始时间"
-                  end-placeholder="结束时间"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                  @change="timeChange"
-                />
+                <el-date-picker v-model="joinTimeRange" type="daterange" range-separator="至" start-placeholder="开始时间"
+                  end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="timeChange" />
               </el-form-item>
             </el-col>
             <el-col :span="24" style="display: flex; justify-content: flex-end">
@@ -414,7 +269,7 @@
             </el-col>
           </el-row>
         </el-form>
-        <el-table :data="tableData4" style="margin-top: 24px" height="500">
+        <el-table :data="tableData4" style="margin-top: 8px"  height="calc(100% - 188px)">
           <el-table-column label="审核人" prop="auditPerson" width="200">
           </el-table-column>
           <el-table-column label="审核时间" prop="auditTime"></el-table-column>
@@ -427,36 +282,27 @@
                 scope.row.typeAttr == "5"
                   ? "团队"
                   : scope.row.typeAttr == "6"
-                  ? "个代"
-                  : scope.row.typeAttr == "7"
-                  ? "渠道"
-                  : scope.row.typeAttr== "8"
-                  ? "电销组"
-                  : "--"
+                    ? "个代"
+                    : scope.row.typeAttr == "7"
+                      ? "渠道"
+                      : scope.row.typeAttr == "8"
+                        ? "电销组"
+                        : "--"
               }}
             </template>
           </el-table-column>
           <el-table-column label="所属机构" prop="deptName"></el-table-column>
-          <el-table-column
-            label="推荐上级"
-            prop="referrerName"
-          ></el-table-column>
+          <el-table-column label="推荐上级" prop="referrerName"></el-table-column>
           <el-table-column label="申请时间" prop="applyTime"></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="total4"
-            @size-change="handleSizeChange"
-            @current-change="handleCurrentChange"
-          ></el-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="total4" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-tab-pane>
     </el-tabs>
-  </div>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
@@ -500,7 +346,7 @@ const tableProps = ref({
   checkStrictly: true,
 });
 let option = ref([]);
-const timeChange = (val) => {};
+const timeChange = (val) => { };
 // 搜索
 const search = () => {
   switch (type.value) {
@@ -708,17 +554,10 @@ watch(
 </script>
 
 <style scoped lang="scss">
-.order {
-  width: 100%;
-  height: calc(100vh - 120px);
-  background: #ffffff;
-  padding: 24px;
-  overflow-y: auto;
-  .pagination {
-    margin-top: 24px;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-  }
+.pagination {
+  margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
 }
 </style>