优化

src/views/invoicing/consumable/cons_record.vue

@@ -7,18 +7,24 @@
         </el-form-item>
         <el-form-item>
           <el-button type="primary" @click="getTableData">查询</el-button>
-                    <el-button>重置</el-button>
+          <el-button @click="resetHandle">重置</el-button>
         </el-form-item>
       </el-form>
     </div>
     <div class="head-container">
-            <el-table ref="table" :data="clickseetableData.data" v-loading="clickseetableData.loading" row-key="id"
+      <el-table
-                height="66vh">
+        ref="table"
+        :data="clickseetableData.data"
+        v-loading="clickseetableData.loading"
+        row-key="id"
+        height="66vh"
+      >
         <el-table-column label="耗材名称" prop="conName" />
         <el-table-column label="变动库存" prop="amount">
           <template v-slot="scope">
-                        <span :class="{ red: scope.row.bizType == '-' }">{{ scope.row.bizType }}{{ scope.row.amount
+            <span :class="{ red: scope.row.bizType == '-' }"
-                            }}</span>
+              >{{ scope.row.bizType }}{{ scope.row.amount }}</span
+            >
           </template>
         </el-table-column>
         <el-table-column label="现有库存" prop="balance" />
@@ -36,21 +42,31 @@
       </el-table>
     </div>
     <div class="head-container">
-            <el-pagination :total="clickseetableData.total" :current-page="clickseetableData.page + 1"
+      <el-pagination
-                :page-size="clickseetableData.size" layout="total, sizes, prev, pager, next, jumper"
+        :total="clickseetableData.total"
+        :current-page="clickseetableData.page + 1"
+        :page-size="clickseetableData.size"
+        layout="total, sizes, prev, pager, next, jumper"
         @current-change="paginationChangetype"
-                @size-change="e => { clickseetableData.size = e; clickseetableData.page = 0; getTableData() }" />
+        @size-change="
+          e => {
+            clickseetableData.size = e;
+            clickseetableData.page = 0;
+            getTableData();
+          }
+        "
+      />
     </div>
   </div>
 </template>
 
 <script>
-import { gettbConsInfoFlow } from '@/api/consumable'
+import { gettbConsInfoFlow } from "@/api/consumable";
 export default {
   data() {
     return {
       query: {
-                conName: ''
+        conName: ""
       },
       clickseetableData: {
         data: [],
@@ -58,39 +74,45 @@ export default {
         size: 30,
         loading: false,
         total: 0
-            },
       }
+    };
   },
   mounted() {
-        this.getTableData()
+    this.getTableData();
   },
   methods: {
+    resetHandle() {
+      this.clickseetableData.page = 0;
+      this.clickseetableData.size = 30;
+      this.query.conName = "";
+      this.getTableData();
+    },
     pageSizeChange(e) {
-            this.clickseetableData.size = e
+      this.clickseetableData.size = e;
-            this.getTableData()
+      this.getTableData();
     },
     paginationChangetype(e) {
-            this.clickseetableData.page = e - 1
+      this.clickseetableData.page = e - 1;
-            this.getTableData()
+      this.getTableData();
     },
     // 查看查询耗材流水信息
     async getTableData() {
       try {
-                this.clickseetableData.loading = true
+        this.clickseetableData.loading = true;
         const res = await gettbConsInfoFlow({
           page: this.clickseetableData.page,
           size: this.clickseetableData.size,
-                    consId: '',
+          consId: "",
           conName: this.query.conName,
-                    shopId: localStorage.getItem('shopId')
+          shopId: localStorage.getItem("shopId")
-                })
+        });
-                this.clickseetableData.loading = false
+        this.clickseetableData.loading = false;
-                this.clickseetableData.data = res.content
+        this.clickseetableData.data = res.content;
-                this.clickseetableData.total = res.totalElements
+        this.clickseetableData.total = res.totalElements;
       } catch (error) {
-                console.log(error)
+        console.log(error);
       }
     }
   }
-}
+};
 </script>