Browse Source

🎈 perf: 优化账号搜索逻辑

Pchen. 8 months ago
parent
commit
7d58ed806e
1 changed files with 26 additions and 6 deletions
  1. 26 6
      src/pages/lepao/accountList/index.vue

+ 26 - 6
src/pages/lepao/accountList/index.vue

@@ -30,12 +30,12 @@
 
 
       <a-row class="queryForm">
       <a-row class="queryForm">
         <a-col :flex="1">
         <a-col :flex="1">
-          <a-form :model="queryData" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }"
+          <a-form :model="queryDataForm" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }"
             label-align="left">
             label-align="left">
             <a-row :gutter="16">
             <a-row :gutter="16">
               <a-col :span="8">
               <a-col :span="8">
                 <a-form-item field="area" label="跑区">
                 <a-form-item field="area" label="跑区">
-                  <a-select v-model="queryData.area" placeholder="请选择乐跑跑区" default-value="">
+                  <a-select v-model="queryDataForm.area" placeholder="请选择乐跑跑区" default-value="">
                     <a-option value="">所有</a-option>
                     <a-option value="">所有</a-option>
                     <a-option v-for="(item, index) in area" :key="index" :value="item">
                     <a-option v-for="(item, index) in area" :key="index" :value="item">
                       {{ item }}
                       {{ item }}
@@ -45,22 +45,22 @@
               </a-col>
               </a-col>
               <a-col :span="8">
               <a-col :span="8">
                 <a-form-item field="email" label="用户邮箱">
                 <a-form-item field="email" label="用户邮箱">
-                  <a-input v-model="queryData.email" allow-clear/>
+                  <a-input v-model="queryDataForm.email" allow-clear />
                 </a-form-item>
                 </a-form-item>
               </a-col>
               </a-col>
               <a-col :span="8">
               <a-col :span="8">
                 <a-form-item field="username" label="账号名称">
                 <a-form-item field="username" label="账号名称">
-                  <a-input v-model="queryData.username" allow-clear/>
+                  <a-input v-model="queryDataForm.username" allow-clear />
                 </a-form-item>
                 </a-form-item>
               </a-col>
               </a-col>
               <a-col :span="8">
               <a-col :span="8">
                 <a-form-item field="student_num" label="学号">
                 <a-form-item field="student_num" label="学号">
-                  <a-input v-model="queryData.student_num" allow-clear/>
+                  <a-input v-model="queryDataForm.student_num" allow-clear />
                 </a-form-item>
                 </a-form-item>
               </a-col>
               </a-col>
               <a-col :span="8">
               <a-col :span="8">
                 <a-form-item field="area" label="账号状态">
                 <a-form-item field="area" label="账号状态">
-                  <a-select v-model="queryData.state" :options="state" placeholder="请选择账号状态" :default-value="-1" />
+                  <a-select v-model="queryDataForm.state" :options="state" placeholder="请选择账号状态" :default-value="-1" />
                 </a-form-item>
                 </a-form-item>
               </a-col>
               </a-col>
             </a-row>
             </a-row>
@@ -294,6 +294,13 @@ import { isElectron } from '@/utils/electron'
 
 
 const email = ref([])
 const email = ref([])
 
 
+const queryDataForm = reactive({
+  area: '',
+  student_num: '',
+  email: '',
+  username: '',
+  state: -1
+})
 const queryData = reactive({
 const queryData = reactive({
   area: '',
   area: '',
   student_num: '',
   student_num: '',
@@ -302,6 +309,7 @@ const queryData = reactive({
   state: -1
   state: -1
 })
 })
 
 
+
 const pagination = reactive({
 const pagination = reactive({
   total: 0,
   total: 0,
   current: 1, // 默认从第1页开始
   current: 1, // 默认从第1页开始
@@ -343,14 +351,26 @@ const state = [
 
 
 const search = () => {
 const search = () => {
   pagination.current = 1
   pagination.current = 1
+
+  queryData.area = queryDataForm.area
+  queryData.student_num = queryDataForm.student_num
+  queryData.email = queryDataForm.email
+  queryData.username = queryDataForm.username
+
   getAccountsAsync()
   getAccountsAsync()
 }
 }
 
 
 const reset = () => {
 const reset = () => {
+  queryDataForm.area = ''
+  queryDataForm.student_num = ''
+  queryDataForm.email = ''
+  queryDataForm.username = ''
+
   queryData.area = ''
   queryData.area = ''
   queryData.student_num = ''
   queryData.student_num = ''
   queryData.email = ''
   queryData.email = ''
   queryData.username = ''
   queryData.username = ''
+
   getAccountsAsync()
   getAccountsAsync()
 }
 }