From 6bfed913bd3899e7e91fa8e0dc704f98b8f8ead0 Mon Sep 17 00:00:00 2001
From: Junling Bu <linlinjavaer@gmail.com>
Date: Sat, 30 Jun 2018 10:28:46 +0800
Subject: [PATCH] =?UTF-8?q?feat[litemall-admin]:=20=E5=88=A0=E9=99=A4waves?=
 =?UTF-8?q?=EF=BC=8C=E7=AE=80=E5=8C=96=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 litemall-admin/src/directive/sticky.js        | 91 -------------------
 litemall-admin/src/directive/waves/index.js   | 13 ---
 litemall-admin/src/directive/waves/waves.css  | 26 ------
 litemall-admin/src/directive/waves/waves.js   | 42 ---------
 litemall-admin/src/views/goods/attribute.vue  |  8 +-
 litemall-admin/src/views/goods/comment.vue    |  8 +-
 litemall-admin/src/views/goods/goods.vue      |  6 +-
 litemall-admin/src/views/goods/product.vue    |  9 +-
 .../src/views/goods/specification.vue         |  8 +-
 litemall-admin/src/views/mall/brand.vue       |  8 +-
 litemall-admin/src/views/mall/category.vue    |  8 +-
 litemall-admin/src/views/mall/issue.vue       |  8 +-
 litemall-admin/src/views/mall/keyword.vue     |  8 +-
 litemall-admin/src/views/mall/order.vue       |  8 +-
 litemall-admin/src/views/mall/region.vue      |  8 +-
 litemall-admin/src/views/promotion/ad.vue     |  8 +-
 litemall-admin/src/views/promotion/topic.vue  |  8 +-
 litemall-admin/src/views/sys/admin.vue        |  8 +-
 litemall-admin/src/views/sys/os.vue           |  8 +-
 litemall-admin/src/views/user/address.vue     |  8 +-
 litemall-admin/src/views/user/collect.vue     |  8 +-
 litemall-admin/src/views/user/footprint.vue   |  8 +-
 litemall-admin/src/views/user/history.vue     |  8 +-
 litemall-admin/src/views/user/user.vue        |  8 +-
 24 files changed, 40 insertions(+), 291 deletions(-)
 delete mode 100644 litemall-admin/src/directive/sticky.js
 delete mode 100644 litemall-admin/src/directive/waves/index.js
 delete mode 100644 litemall-admin/src/directive/waves/waves.css
 delete mode 100644 litemall-admin/src/directive/waves/waves.js

diff --git a/litemall-admin/src/directive/sticky.js b/litemall-admin/src/directive/sticky.js
deleted file mode 100644
index bc234660..00000000
--- a/litemall-admin/src/directive/sticky.js
+++ /dev/null
@@ -1,91 +0,0 @@
-const vueSticky = {}
-let listenAction
-vueSticky.install = Vue => {
-  Vue.directive('sticky', {
-    inserted(el, binding) {
-      const params = binding.value || {}
-      const stickyTop = params.stickyTop || 0
-      const zIndex = params.zIndex || 1000
-      const elStyle = el.style
-
-      elStyle.position = '-webkit-sticky'
-      elStyle.position = 'sticky'
-      // if the browser support css sticky（Currently Safari, Firefox and Chrome Canary）
-      // if (~elStyle.position.indexOf('sticky')) {
-      //     elStyle.top = `${stickyTop}px`;
-      //     elStyle.zIndex = zIndex;
-      //     return
-      // }
-      const elHeight = el.getBoundingClientRect().height
-      const elWidth = el.getBoundingClientRect().width
-      elStyle.cssText = `top: ${stickyTop}px; z-index: ${zIndex}`
-
-      const parentElm = el.parentNode || document.documentElement
-      const placeholder = document.createElement('div')
-      placeholder.style.display = 'none'
-      placeholder.style.width = `${elWidth}px`
-      placeholder.style.height = `${elHeight}px`
-      parentElm.insertBefore(placeholder, el)
-
-      let active = false
-
-      const getScroll = (target, top) => {
-        const prop = top ? 'pageYOffset' : 'pageXOffset'
-        const method = top ? 'scrollTop' : 'scrollLeft'
-        let ret = target[prop]
-        if (typeof ret !== 'number') {
-          ret = window.document.documentElement[method]
-        }
-        return ret
-      }
-
-      const sticky = () => {
-        if (active) {
-          return
-        }
-        if (!elStyle.height) {
-          elStyle.height = `${el.offsetHeight}px`
-        }
-
-        elStyle.position = 'fixed'
-        elStyle.width = `${elWidth}px`
-        placeholder.style.display = 'inline-block'
-        active = true
-      }
-
-      const reset = () => {
-        if (!active) {
-          return
-        }
-
-        elStyle.position = ''
-        placeholder.style.display = 'none'
-        active = false
-      }
-
-      const check = () => {
-        const scrollTop = getScroll(window, true)
-        const offsetTop = el.getBoundingClientRect().top
-        if (offsetTop < stickyTop) {
-          sticky()
-        } else {
-          if (scrollTop < elHeight + stickyTop) {
-            reset()
-          }
-        }
-      }
-      listenAction = () => {
-        check()
-      }
-
-      window.addEventListener('scroll', listenAction)
-    },
-
-    unbind() {
-      window.removeEventListener('scroll', listenAction)
-    }
-  })
-}
-
-export default vueSticky
-
diff --git a/litemall-admin/src/directive/waves/index.js b/litemall-admin/src/directive/waves/index.js
deleted file mode 100644
index 65f9b308..00000000
--- a/litemall-admin/src/directive/waves/index.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import waves from './waves'
-
-const install = function(Vue) {
-  Vue.directive('waves', waves)
-}
-
-if (window.Vue) {
-  window.waves = waves
-  Vue.use(install); // eslint-disable-line
-}
-
-waves.install = install
-export default waves
diff --git a/litemall-admin/src/directive/waves/waves.css b/litemall-admin/src/directive/waves/waves.css
deleted file mode 100644
index af7a7efd..00000000
--- a/litemall-admin/src/directive/waves/waves.css
+++ /dev/null
@@ -1,26 +0,0 @@
-.waves-ripple {
-    position: absolute;
-    border-radius: 100%;
-    background-color: rgba(0, 0, 0, 0.15);
-    background-clip: padding-box;
-    pointer-events: none;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;
-    -webkit-transform: scale(0);
-    -ms-transform: scale(0);
-    transform: scale(0);
-    opacity: 1;
-}
-
-.waves-ripple.z-active {
-    opacity: 0;
-    -webkit-transform: scale(2);
-    -ms-transform: scale(2);
-    transform: scale(2);
-    -webkit-transition: opacity 1.2s ease-out, -webkit-transform 0.6s ease-out;
-    transition: opacity 1.2s ease-out, -webkit-transform 0.6s ease-out;
-    transition: opacity 1.2s ease-out, transform 0.6s ease-out;
-    transition: opacity 1.2s ease-out, transform 0.6s ease-out, -webkit-transform 0.6s ease-out;
-}
\ No newline at end of file
diff --git a/litemall-admin/src/directive/waves/waves.js b/litemall-admin/src/directive/waves/waves.js
deleted file mode 100644
index ac1d8611..00000000
--- a/litemall-admin/src/directive/waves/waves.js
+++ /dev/null
@@ -1,42 +0,0 @@
-import './waves.css'
-
-export default{
-  bind(el, binding) {
-    el.addEventListener('click', e => {
-      const customOpts = Object.assign({}, binding.value)
-      const opts = Object.assign({
-        ele: el, // 波纹作用元素
-        type: 'hit', // hit点击位置扩散center中心点扩展
-        color: 'rgba(0, 0, 0, 0.15)' // 波纹颜色
-      }, customOpts)
-      const target = opts.ele
-      if (target) {
-        target.style.position = 'relative'
-        target.style.overflow = 'hidden'
-        const rect = target.getBoundingClientRect()
-        let ripple = target.querySelector('.waves-ripple')
-        if (!ripple) {
-          ripple = document.createElement('span')
-          ripple.className = 'waves-ripple'
-          ripple.style.height = ripple.style.width = Math.max(rect.width, rect.height) + 'px'
-          target.appendChild(ripple)
-        } else {
-          ripple.className = 'waves-ripple'
-        }
-        switch (opts.type) {
-          case 'center':
-            ripple.style.top = (rect.height / 2 - ripple.offsetHeight / 2) + 'px'
-            ripple.style.left = (rect.width / 2 - ripple.offsetWidth / 2) + 'px'
-            break
-          default:
-            ripple.style.top = (e.pageY - rect.top - ripple.offsetHeight / 2 - document.body.scrollTop) + 'px'
-            ripple.style.left = (e.pageX - rect.left - ripple.offsetWidth / 2 - document.body.scrollLeft) + 'px'
-        }
-        ripple.style.backgroundColor = opts.color
-        ripple.className = 'waves-ripple z-active'
-        return false
-      }
-    }, false)
-  }
-}
-
diff --git a/litemall-admin/src/views/goods/attribute.vue b/litemall-admin/src/views/goods/attribute.vue
index 1544c1c5..a8562cbb 100644
--- a/litemall-admin/src/views/goods/attribute.vue
+++ b/litemall-admin/src/views/goods/attribute.vue
@@ -5,9 +5,9 @@
     <div class="filter-container">
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品ID" v-model="listQuery.goodsId">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -64,13 +64,9 @@
 
 <script>
 import { listGoodsAttribute, createGoodsAttribute, updateGoodsAttribute, deleteGoodsAttribute } from '@/api/goods-attribute'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'GoodsAttribute',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/goods/comment.vue b/litemall-admin/src/views/goods/comment.vue
index d37950a7..f2a7366f 100644
--- a/litemall-admin/src/views/goods/comment.vue
+++ b/litemall-admin/src/views/goods/comment.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品ID" v-model="listQuery.valueId">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <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-edit" @click="handleCreate">添加</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -98,13 +98,9 @@
 <script>
 import { listComment, createComment, updateComment, deleteComment } from '@/api/comment'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Comment',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/goods/goods.vue b/litemall-admin/src/views/goods/goods.vue
index 5ebbf359..3af144a6 100644
--- a/litemall-admin/src/views/goods/goods.vue
+++ b/litemall-admin/src/views/goods/goods.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品名称" v-model="listQuery.name">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -209,14 +209,12 @@
 <script>
 import { listGoods, updateGoods, deleteGoods } from '@/api/goods'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 import BackToTop from '@/components/BackToTop'
 import Editor from '@tinymce/tinymce-vue'
 
 export default {
   name: 'Goods',
   components: { BackToTop, Editor },
-  directives: { waves },
   data() {
     return {
       list: [],
diff --git a/litemall-admin/src/views/goods/product.vue b/litemall-admin/src/views/goods/product.vue
index f6e301b3..4fa88657 100644
--- a/litemall-admin/src/views/goods/product.vue
+++ b/litemall-admin/src/views/goods/product.vue
@@ -5,8 +5,8 @@
     <div class="filter-container">
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品ID" v-model="listQuery.goodsId">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <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-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -101,13 +101,8 @@
 import { listProduct, updateProduct } from '@/api/product'
 import { createStorage } from '@/api/storage'
 
-import waves from '@/directive/waves' // 水波纹指令
-
 export default {
   name: 'Product',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/goods/specification.vue b/litemall-admin/src/views/goods/specification.vue
index 96ce4bb1..942eddb9 100644
--- a/litemall-admin/src/views/goods/specification.vue
+++ b/litemall-admin/src/views/goods/specification.vue
@@ -5,8 +5,8 @@
     <div class="filter-container">
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品ID" v-model="listQuery.goodsId">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -67,13 +67,9 @@
 
 <script>
 import { listGoodsSpecification, updateGoodsSpecification } from '@/api/goods-specification'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'GoodsSpecification',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/mall/brand.vue b/litemall-admin/src/views/mall/brand.vue
index a3a89bc8..383edbe0 100644
--- a/litemall-admin/src/views/mall/brand.vue
+++ b/litemall-admin/src/views/mall/brand.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入品牌商名称" v-model="listQuery.name">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <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-edit" @click="handleCreate">添加</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -139,13 +139,9 @@
 <script>
 import { listBrand, createBrand, updateBrand, deleteBrand } from '@/api/brand'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Brand',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/mall/category.vue b/litemall-admin/src/views/mall/category.vue
index 818561e8..fd6ec781 100644
--- a/litemall-admin/src/views/mall/category.vue
+++ b/litemall-admin/src/views/mall/category.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入类目名称" v-model="listQuery.name">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -152,13 +152,9 @@
 <script>
 import { listCategory, listCatL1, createCategory, updateCategory, deleteCategory } from '@/api/category'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Category',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/mall/issue.vue b/litemall-admin/src/views/mall/issue.vue
index 7da53200..9153a253 100644
--- a/litemall-admin/src/views/mall/issue.vue
+++ b/litemall-admin/src/views/mall/issue.vue
@@ -5,9 +5,9 @@
     <div class="filter-container">
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入问题" v-model="listQuery.question">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -58,13 +58,9 @@
 
 <script>
 import { listIssue, createIssue, updateIssue, deleteIssue } from '@/api/issue'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Issue',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/mall/keyword.vue b/litemall-admin/src/views/mall/keyword.vue
index 5789e0cb..0581f5cf 100644
--- a/litemall-admin/src/views/mall/keyword.vue
+++ b/litemall-admin/src/views/mall/keyword.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入跳转链接" v-model="listQuery.url">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <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-edit" @click="handleCreate">添加</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -117,13 +117,9 @@
 
 <script>
 import { listKeyword, createKeyword, updateKeyword, deleteKeyword } from '@/api/keyword'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Keyword',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/mall/order.vue b/litemall-admin/src/views/mall/order.vue
index 3c71eb18..bb2307cd 100644
--- a/litemall-admin/src/views/mall/order.vue
+++ b/litemall-admin/src/views/mall/order.vue
@@ -7,8 +7,8 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入订单编号" v-model="listQuery.orderSn">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <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-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -103,13 +103,9 @@
 
 <script>
 import { listOrder, shipOrder, refundOrder } from '@/api/order'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Order',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/mall/region.vue b/litemall-admin/src/views/mall/region.vue
index d3cebe8d..63afd885 100644
--- a/litemall-admin/src/views/mall/region.vue
+++ b/litemall-admin/src/views/mall/region.vue
@@ -7,8 +7,8 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入行政区域编码" v-model="listQuery.code">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <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-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -46,13 +46,9 @@
 
 <script>
 import { listRegion } from '@/api/region'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Keyword',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/promotion/ad.vue b/litemall-admin/src/views/promotion/ad.vue
index 0235b069..fff49302 100644
--- a/litemall-admin/src/views/promotion/ad.vue
+++ b/litemall-admin/src/views/promotion/ad.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入广告内容" v-model="listQuery.content">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <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-edit" @click="handleCreate">添加</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -115,13 +115,9 @@
 <script>
 import { listAd, createAd, updateAd, deleteAd } from '@/api/ad'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Ad',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/promotion/topic.vue b/litemall-admin/src/views/promotion/topic.vue
index cefa7f6b..13e427cd 100644
--- a/litemall-admin/src/views/promotion/topic.vue
+++ b/litemall-admin/src/views/promotion/topic.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable  class="filter-item" style="width: 200px;" placeholder="请输入专题子标题" v-model="listQuery.subtitle">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <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-edit" @click="handleCreate">添加</el-button>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload" :loading="downloadLoading">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -115,16 +115,12 @@
 <script>
 import { listTopic, createTopic, updateTopic, deleteTopic } from '@/api/topic'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 import BackToTop from '@/components/BackToTop'
 import Editor from '@tinymce/tinymce-vue'
 
 export default {
   name: 'Topic',
   components: { BackToTop, Editor },
-  directives: {
-    waves
-  },
   data() {
     return {
       list: undefined,
diff --git a/litemall-admin/src/views/sys/admin.vue b/litemall-admin/src/views/sys/admin.vue
index e20a7fb3..c12ab813 100644
--- a/litemall-admin/src/views/sys/admin.vue
+++ b/litemall-admin/src/views/sys/admin.vue
@@ -5,9 +5,9 @@
     <div class="filter-container">
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入管理员名称" v-model="listQuery.username">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -68,13 +68,9 @@
 <script>
 import { listAdmin, createAdmin, updateAdmin, deleteAdmin } from '@/api/admin'
 import { createStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Admin',
-  directives: {
-    waves
-  },
   data() {
     var validatePass = (rule, value, callback) => {
       if (value === '') {
diff --git a/litemall-admin/src/views/sys/os.vue b/litemall-admin/src/views/sys/os.vue
index eb76bad7..62edf3a9 100644
--- a/litemall-admin/src/views/sys/os.vue
+++ b/litemall-admin/src/views/sys/os.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入对象名称" v-model="listQuery.name">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary"  icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -72,13 +72,9 @@
 
 <script>
 import { listStorage, createStorage, updateStorage, deleteStorage } from '@/api/storage'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Storage',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/user/address.vue b/litemall-admin/src/views/user/address.vue
index 9fc75ce0..a0bf45ef 100644
--- a/litemall-admin/src/views/user/address.vue
+++ b/litemall-admin/src/views/user/address.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入收货人名称" v-model="listQuery.name">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -104,13 +104,9 @@
 <script>
 import { listAddress, createAddress, updateAddress, deleteAddress } from '@/api/address'
 import { listSubRegion } from '@/api/region'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'UserAddress',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/user/collect.vue b/litemall-admin/src/views/user/collect.vue
index fd247999..0cd72018 100644
--- a/litemall-admin/src/views/user/collect.vue
+++ b/litemall-admin/src/views/user/collect.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品ID" v-model="listQuery.valueId">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -67,13 +67,9 @@
 
 <script>
 import { listCollect, createCollect, updateCollect, deleteCollect } from '@/api/collect'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'Collect',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/user/footprint.vue b/litemall-admin/src/views/user/footprint.vue
index 8aee4bf0..8b8ca69c 100644
--- a/litemall-admin/src/views/user/footprint.vue
+++ b/litemall-admin/src/views/user/footprint.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品ID" v-model="listQuery.goodsId">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -67,13 +67,9 @@
 
 <script>
 import { listFootprint, createFootprint, updateFootprint, deleteFootprint } from '@/api/footprint'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'FootPrint',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/user/history.vue b/litemall-admin/src/views/user/history.vue
index 1a89a3ab..5d13c814 100644
--- a/litemall-admin/src/views/user/history.vue
+++ b/litemall-admin/src/views/user/history.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入搜索历史关键字" v-model="listQuery.keyword">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -66,13 +66,9 @@
 
 <script>
 import { listHistory, createHistory, updateHistory, deleteHistory } from '@/api/history'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'History',
-  directives: {
-    waves
-  },
   data() {
     return {
       list: null,
diff --git a/litemall-admin/src/views/user/user.vue b/litemall-admin/src/views/user/user.vue
index f0c68ad6..e26087a5 100644
--- a/litemall-admin/src/views/user/user.vue
+++ b/litemall-admin/src/views/user/user.vue
@@ -7,9 +7,9 @@
       </el-input>
       <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入手机号" v-model="listQuery.mobile">
       </el-input>
-      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">查找</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">查找</el-button>
       <el-button class="filter-item" type="primary" @click="handleCreate" icon="el-icon-edit">添加</el-button>
-      <el-button class="filter-item" type="primary" :loading="downloadLoading" v-waves icon="el-icon-download" @click="handleDownload">导出</el-button>
+      <el-button class="filter-item" type="primary" :loading="downloadLoading" icon="el-icon-download" @click="handleDownload">导出</el-button>
     </div>
 
     <!-- 查询结果 -->
@@ -116,13 +116,9 @@
 
 <script>
 import { fetchList, createUser, updateUser } from '@/api/user'
-import waves from '@/directive/waves' // 水波纹指令
 
 export default {
   name: 'User',
-  directives: {
-    waves
-  },
   data() {
     var validatePass = (rule, value, callback) => {
       if (value === '') {