优化商品列表

.env.development

@@ -5,7 +5,7 @@ ENV = 'development'
 # VUE_APP_BASE_API = '/dev-api'
 # VUE_APP_BASE_API = 'http://192.168.1.22:9104'
 # VUE_APP_BASE_API = 'http://192.168.1.26:9104'
-VUE_APP_BASE_API = 'https://mai-b.caimei365.com'
+ VUE_APP_BASE_API = 'https://mai-b.caimei365.com'
 
 # vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
 # to control whether the babel-plugin-dynamic-import-node plugin is enabled.

src/layout/components/Navbar.vue

@@ -7,8 +7,8 @@
     <div class="right-menu">
       <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
         <div class="avatar-wrapper">
-          <!-- <img src="@/assets/avatar1.gif" class="user-avatar"> -->
           <span class="admin-name">{{ adminName }}</span>
+          <img src="@/assets/avatar.jpg" class="user-avatar">
           <i class="el-icon-caret-bottom" />
         </div>
         <el-dropdown-menu slot="dropdown">
@@ -24,7 +24,6 @@
       <template v-if="device!=='mobile'">
         <screenfull id="screenfull" class="right-menu-item hover-effect" />
       </template>
-
     </div>
   </div>
 </template>
@@ -124,13 +123,13 @@ export default {
     }
 
     .avatar-container {
-      margin-right: 30px;
+      margin-right: 20px;
 
       .avatar-wrapper {
         margin-top: 5px;
         position: relative;
         .admin-name{
-          font-size: 16px;
+          font-size: 14px;
           color:#97a8be;
           line-height: 46px;
           float:left;

src/utils/request.js

@@ -49,8 +49,9 @@ service.interceptors.response.use(
       Message({
         message: res.msg || 'Error',
         type: 'error',
-        duration: 5 * 1000
+        duration: 3 * 1000
       })
+      console.log(res)
       // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
       if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
         // to re-login
@@ -71,17 +72,18 @@ service.interceptors.response.use(
   },
   error => {
     const reg = new RegExp(/504|503|500|400/)
+    console.log(error)
     if (reg.test(error.message) || error.message === 'Network Error') {
       Message({
         message: '网络连接超时，请检查网络！',
         type: 'error',
-        duration: 5 * 1000
+        duration: 3 * 1000
       })
     } else {
       Message({
         message: error.message,
         type: 'error',
-        duration: 5 * 1000
+        duration: 3 * 1000
       })
     }
     return Promise.reject(error)

src/views/goods/list-commonly.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container">
+  <div class="app-container" style="padding: 0 20px;padding-bottom: 0;">
 
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="0"><router-link to="/goods/list">全部商品</router-link></el-menu-item>
@@ -9,19 +9,35 @@
     </el-menu>
 
     <div class="filter-container" style="margin-top:20px;">
-      <el-input v-model="listQuery.id" placeholder="商品ID" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.productName" placeholder="商品名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.shopName" placeholder="供应商名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <template v-for="item in classify">
-          <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
-        </template>
-      </el-select>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-sort" @click="batchSaveSort">批量更新排序</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-circle-plus-outline">
-        <router-link :to="'/goods/list/select/'+ activeIndex">添加商品</router-link>
-      </el-button>
+      <el-form class="demo-form-inline goods-list">
+        <el-form-item label="商品ID:" style="width:225px;float: left;margin-bottom: 8px;">
+          <el-input v-model="listQuery.id" placeholder="请输入商品ID" maxlength="30" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品名称:" style="width:240px;float: left;">
+          <el-input v-model="listQuery.productName" placeholder="请输入商品名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="供应商名称:" style="width:250px;float: left;">
+          <el-input v-model="listQuery.shopName" placeholder="请输入供应商名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品分类:" style="width:200px;float: left;">
+          <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+            <template v-for="item in classify">
+              <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
+            </template>
+          </el-select>
+        </el-form-item>
+        <el-form-item style="width:95px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
+        </el-form-item>
+        <el-form-item style="width:150px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-sort" @click="batchSaveSort">批量更新排序</el-button>
+        </el-form-item>
+        <el-form-item style="width:120px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-circle-plus-outline">
+            <router-link :to="'/goods/list/select/'+ activeIndex">添加商品</router-link>
+          </el-button>
+        </el-form-item>
+      </el-form>
     </div>
 
     <el-table
@@ -157,6 +173,8 @@ export default {
 </script>
 
 <style scoped>
-
+.goods-list .el-form-item{
+  margin-bottom: 8px;
+}
 </style>
 

src/views/goods/list-preferential.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container">
+  <div class="app-container" style="padding: 0 20px;">
 
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="0"><router-link to="/goods/list">全部商品</router-link></el-menu-item>
@@ -8,20 +8,36 @@
       <el-menu-item v-if="modules && modules.thirdModulesName" index="3"><router-link to="/goods/list/commonly">{{ modules.thirdModulesName }}</router-link></el-menu-item>
     </el-menu>
 
-    <div class="filter-container" style="margin-top:20px;">
-      <el-input v-model="listQuery.id" placeholder="商品ID" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.productName" placeholder="商品名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.shopName" placeholder="供应商名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <template v-for="item in classify">
-          <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
-        </template>
-      </el-select>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-sort" @click="batchSaveSort">批量更新排序</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-circle-plus-outline">
-        <router-link :to="'/goods/list/select/'+ activeIndex">添加商品</router-link>
-      </el-button>
+    <div class="filter-container" style="margin-top:20px;padding-bottom: 0;">
+      <el-form class="demo-form-inline goods-list">
+        <el-form-item label="商品ID:" style="width:225px;float: left;margin-bottom: 8px;">
+          <el-input v-model="listQuery.id" placeholder="请输入商品ID" maxlength="30" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品名称:" style="width:240px;float: left;">
+          <el-input v-model="listQuery.productName" placeholder="请输入商品名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="供应商名称:" style="width:250px;float: left;">
+          <el-input v-model="listQuery.shopName" placeholder="请输入供应商名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品分类:" style="width:200px;float: left;">
+          <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+            <template v-for="item in classify">
+              <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
+            </template>
+          </el-select>
+        </el-form-item>
+        <el-form-item style="width:95px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
+        </el-form-item>
+        <el-form-item style="width:150px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-sort" @click="batchSaveSort">批量更新排序</el-button>
+        </el-form-item>
+        <el-form-item style="width:120px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-circle-plus-outline">
+            <router-link :to="'/goods/list/select/'+ activeIndex">添加商品</router-link>
+          </el-button>
+        </el-form-item>
+      </el-form>
     </div>
 
     <el-table
@@ -157,6 +173,8 @@ export default {
 </script>
 
 <style scoped>
-
+.goods-list .el-form-item{
+  margin-bottom: 8px;
+}
 </style>
 

src/views/goods/list-preferred.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container">
+  <div class="app-container" style="padding: 0 20px;">
 
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="0"><router-link to="/goods/list">全部商品</router-link></el-menu-item>
@@ -8,20 +8,36 @@
       <el-menu-item v-if="modules && modules.thirdModulesName" index="3"><router-link to="/goods/list/commonly">{{ modules.thirdModulesName }}</router-link></el-menu-item>
     </el-menu>
 
-    <div class="filter-container" style="margin-top:20px;">
-      <el-input v-model="listQuery.id" placeholder="商品ID" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.productName" placeholder="商品名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.shopName" placeholder="供应商名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <template v-for="item in classify">
-          <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
-        </template>
-      </el-select>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-sort" @click="batchSaveSort">批量更新排序</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-circle-plus-outline">
-        <router-link :to="'/goods/list/select/'+ activeIndex">添加商品</router-link>
-      </el-button>
+    <div class="filter-container" style="margin-top:20px;padding-bottom: 0;">
+      <el-form class="demo-form-inline goods-list">
+        <el-form-item label="商品ID:" style="width:225px;float: left;margin-bottom: 8px;">
+          <el-input v-model="listQuery.id" placeholder="请输入商品ID" maxlength="30" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品名称:" style="width:240px;float: left;">
+          <el-input v-model="listQuery.productName" placeholder="请输入商品名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="供应商名称:" style="width:250px;float: left;">
+          <el-input v-model="listQuery.shopName" placeholder="请输入供应商名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品分类:" style="width:200px;float: left;">
+          <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+            <template v-for="item in classify">
+              <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
+            </template>
+          </el-select>
+        </el-form-item>
+        <el-form-item style="width:95px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
+        </el-form-item>
+        <el-form-item style="width:150px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-sort" @click="batchSaveSort">批量更新排序</el-button>
+        </el-form-item>
+        <el-form-item style="width:120px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-circle-plus-outline">
+            <router-link :to="'/goods/list/select/'+ activeIndex">添加商品</router-link>
+          </el-button>
+        </el-form-item>
+      </el-form>
     </div>
 
     <el-table
@@ -156,7 +172,9 @@ export default {
 }
 </script>
 
-<style scoped>
-
+<style lang="scss" scoped>
+.goods-list .el-form-item{
+    margin-bottom: 8px;
+  }
 </style>
 

src/views/goods/list-select.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container">
+  <div class="app-container" style="padding: 0 20px;">
 
     <el-menu :default-active="moduleId" class="el-menu-demo" mode="horizontal">
       <el-menu-item v-if="moduleId===1 && modules && modules.firstModulesName" index="1">{{ modules.firstModulesName }}</el-menu-item>
@@ -8,19 +8,34 @@
     </el-menu>
 
     <div class="filter-container" style="margin-top:20px;">
-      <el-input v-model="listQuery.id" placeholder="商品ID" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.productName" placeholder="商品名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.shopName" placeholder="供应商名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <template v-for="item in classify">
-          <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
-        </template>
-      </el-select>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
-        搜索
-      </el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-check" @click="confirmChoose()">确定选择</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-close" @click="toggleSelection()">取消选择</el-button>
+      <el-form class="demo-form-inline goods-list">
+
+        <el-form-item label="商品ID:" style="width:225px;float: left;margin-bottom: 8px;">
+          <el-input v-model="listQuery.id" placeholder="请输入商品ID" maxlength="30" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品名称:" style="width:240px;float: left;">
+          <el-input v-model="listQuery.productName" placeholder="请输入商品名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="供应商名称:" style="width:250px;float: left;">
+          <el-input v-model="listQuery.shopName" placeholder="请输入供应商名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品分类:" style="width:200px;float: left;">
+          <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+            <template v-for="item in classify">
+              <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
+            </template>
+          </el-select>
+        </el-form-item>
+        <el-form-item style="width:100px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
+        </el-form-item>
+        <el-form-item style="width:130px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-check" @click="confirmChoose()">确定选择</el-button>
+        </el-form-item>
+        <el-form-item style="width:130px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-close" @click="toggleSelection()">取消选择</el-button>
+        </el-form-item>
+      </el-form>
     </div>
 
     <el-table
@@ -176,4 +191,7 @@ export default {
   i[type=success]{
     color:#67C23A;
   }
+  .goods-list .el-form-item{
+  margin-bottom: 8px;
+}
 </style>

src/views/goods/list.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container">
+  <div class="app-container" style="padding: 0 20px;">
 
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
       <el-menu-item index="0"><router-link to="/goods/list">全部商品</router-link></el-menu-item>
@@ -8,34 +8,58 @@
       <el-menu-item v-if="modules && modules.thirdModulesName" index="3"><router-link to="/goods/list/commonly">{{ modules.thirdModulesName }}</router-link></el-menu-item>
     </el-menu>
 
-    <div class="filter-container" style="margin-top:20px;">
-      <el-input v-model="listQuery.id" placeholder="商品ID" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.productName" placeholder="商品名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-input v-model="listQuery.shopName" placeholder="供应商名称" style="width: 120px;" class="filter-item" @keyup.enter.native="handleFilter" />
-      <el-select v-model="listQuery.validFlag" placeholder="商品状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <el-option label="已上架" value="1" />
-        <el-option label="已下架" value="2" />
-      </el-select>
-      <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <template v-for="item in classify">
-          <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
-        </template>
-      </el-select>
-      <el-select v-if="modules && modules.firstModulesName" v-model="listQuery.preferredProduct" :placeholder="modules.firstModulesName" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <el-option :label="modules.firstModulesName" value="1" />
-        <el-option :label="'非' + modules.firstModulesName" value="0" />
-      </el-select>
-      <el-select v-if="modules && modules.secondModulesName" v-model="listQuery.preferentialProduct" :placeholder="modules.secondModulesName" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <el-option :label="modules.secondModulesName" value="1" />
-        <el-option :label="'非' + modules.secondModulesName" value="0" />
-      </el-select>
-      <el-select v-if="modules && modules.thirdModulesName" v-model="listQuery.commonlyProduct" :placeholder="modules.thirdModulesName" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
-        <el-option :label="modules.thirdModulesName" value="1" />
-        <el-option :label="'非' + modules.thirdModulesName" value="0" />
-      </el-select>
-      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
-        搜索
-      </el-button>
+    <div class="filter-container" style="padding: 20px 0;">
+      <el-form class="demo-form-inline goods-list">
+        <el-form-item label="商品ID:" style="width:225px;float: left;margin-bottom: 8px;">
+          <el-input v-model="listQuery.id" placeholder="请输入商品ID" maxlength="30" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品名称:" style="width:240px;float: left;">
+          <el-input v-model="listQuery.productName" placeholder="请输入商品名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="供应商名称:" style="width:250px;float: left;">
+          <el-input v-model="listQuery.shopName" placeholder="请输入供应商名称" style="width: 150px;" class="filter-item" @keyup.enter.native="handleFilter" />
+        </el-form-item>
+        <el-form-item label="商品状态:" style="width:190px;float: left;">
+          <el-select v-model="listQuery.validFlag" placeholder="商品状态" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+            <el-option label="全部" value="" />
+            <el-option label="已上架" value="1" />
+            <el-option label="已下架" value="2" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="商品分类:" style="width:200px;float: left;">
+          <el-select v-model="listQuery.classifyID" placeholder="商品分类" clearable style="width: 110px" class="filter-item" value="" @change="handleFilter">
+            <template v-for="item in classify">
+              <el-option v-if="item.status*1 === 1" :key="item.id" :label="item.classifyName" :value="item.id" />
+            </template>
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="modules && modules.firstModulesName" :label="modules.firstModulesName+':'" style="width:180px;float: left;">
+          <el-select v-model="listQuery.preferredProduct" placeholder="请选择" clearable style="width: 90px" class="filter-item" value="" @change="handleFilter">
+            <!-- <el-option label="全部" value="" /> -->
+            <el-option label="是" value="1" />
+            <el-option label="否" value="0" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="modules && modules.secondModulesName" :label="modules.secondModulesName+':'" style="width:180px;float: left;">
+          <el-select v-model="listQuery.preferentialProduct" placeholder="请选择" clearable style="width: 90px" class="filter-item" value="" @change="handleFilter">
+            <!-- <el-option label="全部" value="" /> -->
+            <el-option label="是" value="1" />
+            <el-option label="否" value="0" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="modules && modules.thirdModulesName" :label="modules.thirdModulesName+':'" style="width:200px;float: left;">
+          <el-select v-model="listQuery.commonlyProduct" placeholder="请选择" clearable style="width: 90px" class="filter-item" value="" @change="handleFilter">
+            <!-- <el-option label="全部" value="" /> -->
+            <el-option label="是" value="1" />
+            <el-option label="否" value="0" />
+          </el-select>
+        </el-form-item>
+        <el-form-item style="width:100px;float: left;">
+          <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
+            搜索
+          </el-button>
+        </el-form-item>
+      </el-form>
     </div>
 
     <el-table
@@ -50,7 +74,7 @@
     >
       <el-table-column align="center" label="序号" width="35">
         <template slot-scope="scope">
-          <span style="white-space:nowrap">{{ scope.$index }}</span>
+          <span style="white-space:nowrap">{{ scope.$index+1 }}</span>
         </template>
       </el-table-column>
       <el-table-column label="商品ID" align="center" prop="id" width="50" />
@@ -260,9 +284,12 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
   i[type=success]{
     color:#67C23A;
   }
+  .goods-list .el-form-item{
+    margin-bottom: 8px;
+  }
 </style>
 

src/views/other/password.vue

@@ -12,7 +12,7 @@
       </el-form-item>
     </el-form>
     <div slot="footer" class="dialog-footer" style="width:1px;margin:0 auto;padding:40px 0 80px 0;">
-      <el-button type="primary" style="width: 100px;" :loading="loadingbut" @click="onSubmite('dataForm')">{{ loadingbuttext }}</el-button>
+      <el-button v-loading.fullscreen.lock="fullscreenLoading" type="primary" style="width: 100px;" @click="onSubmite()">保存</el-button>
     </div>
   </div>
 </template>
@@ -22,8 +22,7 @@ import { changePassword } from '@/api/other'
 export default {
   data() {
     return {
-      loadingbut: false,
-      loadingbuttext: '保存',
+      fullscreenLoading: false,
       from: {
         oldPassword: '',
         password: '',
@@ -72,14 +71,15 @@ export default {
           }
           const Formobj = { organizeID: this.$store.getters.organizeID }
           const params = Object.assign(Formobj, this.from)
-          this.loadingbut = true
-          this.loadingbuttext = '保存中...'
+          this.fullscreenLoading = true
           changePassword(params).then(response => {
             this.$message({ message: response.msg, type: 'success', center: true })
-            this.loadingbut = false
-            this.loadingbuttext = '保存'
             this.$store.dispatch('user/logout')
             this.$router.push('/login')
+          }).catch(() => {
+            setTimeout(() => {
+              this.fullscreenLoading = false
+            }, 2000)
           })
         }
       })
@@ -89,38 +89,5 @@ export default {
 </script>
 
 <style lang="scss">
-.avatar-uploader .el-upload {
-  border: 1px dashed #d9d9d9;
-  border-radius: 6px;
-  cursor: pointer;
-  position: relative;
-  overflow: hidden;
-}
-.avatar-uploader .el-upload:hover {
-  border-color: #409EFF;
-}
-.avatar-uploader-icon {
-  font-size: 28px;
-  color: #8c939d;
-  width: 178px;
-  height: 178px;
-  line-height: 178px;
-  text-align: center;
-}
-.avatar {
-  width: 178px;
-  height: 178px;
-  display: block;
-}
-.el-form-item__label{
-    text-align: right !important;
-}
-.form-el-upload{
-  width: 180px;
-}
-.el-upload__tip{
-  line-height: 20px;
-  color: red;
-  text-align: left;
-}
+
 </style>