商品列表重置

src/views/business/goods/index.vue

@@ -1,23 +1,25 @@
 <template>
   <div class="app-container coupon-list">
     <el-form v-show="showSearch" :model="queryParams" ref="queryForm" :inline="true" size="small">
-      <el-form-item label="商品名称">
+      <el-form-item label="商品名称" prop="title">
         <el-input
           v-model="queryParams.title"
           placeholder="请输入商品名称"
           clearable
+          @clear="queryParams.pageNum = 1;getList()"
           @keyup.enter.native="queryParams.pageNum = 1;getList()"
         />
       </el-form-item>
-      <el-form-item label="商品ID">
+      <el-form-item label="商品ID" prop="goodsId">
         <el-input
           v-model="queryParams.goodsId"
           placeholder="请输入商品ID"
           clearable
+          @clear="queryParams.pageNum = 1;getList()"
           @keyup.enter.native="queryParams.pageNum = 1;getList()"
         />
       </el-form-item>
-      <el-form-item label="商品分类">
+      <el-form-item label="商品分类" prop="categoryId">
        <el-select
           v-model="queryParams.categoryId"
           placeholder="请选择商品分类"
@@ -27,7 +29,7 @@
           <el-option :label="item.name" :value="item.categoryId" v-for="(item, index) in goodsCategoryItemsList" :key="index" />
         </el-select>
       </el-form-item>
-      <el-form-item label="商品标签">
+      <el-form-item label="商品标签" prop="tagId">
         <el-select
           v-model="queryParams.tagId"
           placeholder="请选择商品标签"
@@ -37,7 +39,7 @@
           <el-option :label="item.name" :value="item.tagId" v-for="(item, index) in goodsTagItemsList" :key="index" />
         </el-select>
       </el-form-item>
-      <el-form-item label="上架状态">
+      <el-form-item label="上架状态" prop="status">
         <el-select v-model="queryParams.status" placeholder="请选择商品状态" clearable @change="queryParams.pageNum = 1;getList()">
           <el-option label="全部" value="" />
           <el-option label="待上架" value="init" />
@@ -45,28 +47,28 @@
           <el-option label="已下架" value="off" />
         </el-select>
       </el-form-item>
-      <el-form-item label="是否支持兑换">
+      <el-form-item label="是否支持兑换" prop="exchangeShow">
         <el-select v-model="queryParams.exchangeShow" placeholder="请选择是否支持兑换" clearable @change="queryParams.pageNum = 1;getList()">
           <el-option label="全部" value="" />
           <el-option label="支持兑换" value="1" />
           <el-option label="不支持兑换" value="0" />
         </el-select>
       </el-form-item>
-      <el-form-item label="采购价格">
+      <el-form-item label="采购价格" prop="minCost">
         <el-input v-model="queryParams.minCost" placeholder="最低采购价格" clearable @keyup.enter.native="queryParams.pageNum = 1;getList()" />
       </el-form-item>
-      <el-form-item label="-">
+      <el-form-item label="-" prop="maxCost">
         <el-input v-model="queryParams.maxCost" placeholder="最高采购价格" clearable @keyup.enter.native="queryParams.pageNum = 1;getList()" />
       </el-form-item>
-      <el-form-item label="价格">
+      <el-form-item label="价格" prop="minValue">
         <el-input v-model="queryParams.minValue" placeholder="最低价格" clearable @keyup.enter.native="queryParams.pageNum = 1;getList()" />
       </el-form-item>
-      <el-form-item label="-">
+      <el-form-item label="-" prop="maxValue">
         <el-input v-model="queryParams.maxValue" placeholder="最高价格" clearable @keyup.enter.native="queryParams.pageNum = 1;getList()" />
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" @click="queryParams.pageNum = 1;getList()">搜索</el-button>
-        <el-button icon="el-icon-refresh" @click="getList(true)">重置</el-button>
+        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
     <el-row :gutter="10" class="mb8">
@@ -186,11 +188,13 @@ export default {
         this.goodsCategoryItemsList = res && res.data
       })
     },
+
     getGoodsTagItems(){
       goodsTagItems({}).then(res => {
         this.goodsTagItemsList = res && res.data
       })
     },
+
     getList(reset) {
       if (this.loading) {
         return
@@ -221,6 +225,13 @@ export default {
         this.loading = false
       })
     },
+
+    // 重置
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.getList();
+    },
+
     setStatus(item, status) {
       this.$confirm(`确认${status === 'on' ? '上架' : '下架'}商品 “${item.title}” 吗？`, `${status === 'on' ? '上架' : '下架'}商品`, {
         confirmButtonText: '确定',
@@ -238,6 +249,7 @@ export default {
         })
       })
     },
+
     del(item) {
       this.$confirm(`确认删除商品 “${item.title}” 吗？`, '删除商品', {
         confirmButtonText: '确定',