fix: inner edit table delete func

src/App.vue

@@ -1,45 +1,44 @@
-<template>
-  <a-locale-provider :locale="locale">
-    <div id="app">
-      <router-view/>
-    </div>
-  </a-locale-provider>
-</template>
-<script>
-  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
-  import enquireScreen from '@/utils/device'
-
-  export default {
-    data () {
-      return {
-        locale: zhCN,
-      }
-    },
-    created () {
-      let that = this
-      enquireScreen(deviceType => {
-        console.log('deviceType', deviceType)
-        // tablet
-        if (deviceType === 0) {
-          that.$store.commit('TOGGLE_DEVICE', 'tablet')
-          that.$store.commit('CLOSE_SIDEBAR', false)
-        }
-        // mobile
-        else if (deviceType === 1) {
-          that.$store.commit('TOGGLE_DEVICE', 'mobile')
-          that.$store.commit('CLOSE_SIDEBAR', false)
-        }
-        else {
-          that.$store.commit('TOGGLE_DEVICE', 'desktop')
-          that.$store.commit('TOGGLE_SIDEBAR', true)
-        }
-
-      })
-    }
-  }
-</script>
-<style>
-  #app {
-    height: 100%;
-  }
+<template>
+  <a-locale-provider :locale="locale">
+    <div id="app">
+      <router-view/>
+    </div>
+  </a-locale-provider>
+</template>
+<script>
+  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
+  import enquireScreen from '@/utils/device'
+
+  export default {
+    data () {
+      return {
+        locale: zhCN,
+      }
+    },
+    created () {
+      let that = this
+      enquireScreen(deviceType => {
+        // tablet
+        if (deviceType === 0) {
+          that.$store.commit('TOGGLE_DEVICE', 'tablet')
+          that.$store.commit('CLOSE_SIDEBAR', false)
+        }
+        // mobile
+        else if (deviceType === 1) {
+          that.$store.commit('TOGGLE_DEVICE', 'mobile')
+          that.$store.commit('CLOSE_SIDEBAR', false)
+        }
+        else {
+          that.$store.commit('TOGGLE_DEVICE', 'desktop')
+          that.$store.commit('TOGGLE_SIDEBAR', true)
+        }
+
+      })
+    }
+  }
+</script>
+<style>
+  #app {
+    height: 100%;
+  }
 </style>

src/components/chart/TransferBar.vue

@@ -1,59 +1,64 @@
-<template>
-  <div :style="{ padding: '0 0 32px 32px' }">
-    <h4 :style="{ marginBottom: '20px' }">{{ title }}</h4>
-    <v-chart
-      height="254"
-      :data="data"
-      :scale="scale"
-      :forceFit="true"
-      :padding="['auto', 'auto', '40', '50']">
-      <v-tooltip />
-      <v-axis />
-      <v-bar position="x*y"/>
-    </v-chart>
-  </div>
-</template>
-
-<script>
-  const tooltip = [
-    'x*y',
-    (x, y) => ({
-      name: x,
-      value: y
-    })
-  ]
-  const scale = [{
-    dataKey: 'x',
-    title: '日期(天)',
-    alias: '日期(天)',
-    min: 2
-  }, {
-    dataKey: 'y',
-    title: '流量(Gb)',
-    alias: '流量(Gb)',
-    min: 1
-  }]
-
-  export default {
-    name: "Bar",
-    props: ['title'],
-    data () {
-      return {
-        data: [],
-        scale,
-        tooltip
-      }
-    },
-    created () {
-      this.getMonthBar()
-    },
-    methods: {
-      getMonthBar() {
-        this.$http.get('/analysis/month-bar')
-          .then(res => {
-            this.data = res.result
-          })
-      }
-    }
-  }
+<template>
+  <div :style="{ padding: '0 0 32px 32px' }">
+    <h4 :style="{ marginBottom: '20px' }">{{ title }}</h4>
+    <v-chart
+      height="254"
+      :data="data"
+      :scale="scale"
+      :forceFit="true"
+      :padding="['auto', 'auto', '40', '50']">
+      <v-tooltip />
+      <v-axis />
+      <v-bar position="x*y"/>
+    </v-chart>
+  </div>
+</template>
+
+<script>
+  const tooltip = [
+    'x*y',
+    (x, y) => ({
+      name: x,
+      value: y
+    })
+  ]
+  const scale = [{
+    dataKey: 'x',
+    title: '日期(天)',
+    alias: '日期(天)',
+    min: 2
+  }, {
+    dataKey: 'y',
+    title: '流量(Gb)',
+    alias: '流量(Gb)',
+    min: 1
+  }]
+
+  export default {
+    name: "Bar",
+    props: {
+      title: {
+        type: String,
+        default: ''
+      }
+    },
+    data () {
+      return {
+        data: [],
+        scale,
+        tooltip
+      }
+    },
+    created () {
+      this.getMonthBar()
+    },
+    methods: {
+      getMonthBar() {
+        this.$http.get('/analysis/month-bar')
+          .then(res => {
+            this.data = res.result
+          })
+      }
+    }
+  }
 </script>

src/components/layout/LayoutMain.vue

@@ -1,13 +1,14 @@
 <template>
   <a-layout class="layout">
 
-    <a-drawer v-if="device === 'mobile'"
-              wrapClassName="drawer-sider"
-              placement="left"
-              @close="() => this.collapsed = false"
-              :closable="false"
-              :visible="collapsed"
-      >
+    <a-drawer 
+      v-if="device === 'mobile'"
+      wrapClassName="drawer-sider"
+      placement="left"
+      @close="() => this.collapsed = false"
+      :closable="false"
+      :visible="collapsed"
+    >
       <sider-menu
         mode="inline"
         :menus="menus"
@@ -43,8 +44,8 @@
   import SiderMenu from '@/components/menu/SiderMenu'
   import LayoutHeader from './LayoutHeader'
   import LayoutFooter from './LayoutFooter'
-  import { asyncRouterMap } from '@/router/index'
-  import { mapState } from 'vuex'
+  import {asyncRouterMap} from '@/router/index'
+  import {mapState} from 'vuex'
 
   export default {
     name: "LayoutView",
@@ -53,7 +54,7 @@
       LayoutHeader,
       LayoutFooter
     },
-    data () {
+    data() {
       return {
         // light, dark
         menuTheme: 'light',
@@ -63,10 +64,8 @@
         menus: []
       }
     },
-    created () {
+    created() {
       this.menus = asyncRouterMap
-
-      console.log( this.collapsed )
     },
     computed: {
       ...mapState({
@@ -76,7 +75,7 @@
       })
     },
     methods: {
-      toggle () {
+      toggle() {
         this.collapsed = !this.collapsed;
       },
     }
@@ -238,6 +237,7 @@
   .table-alert {
     margin-bottom: 16px;
   }
+
   .content {
 
     .search {

src/components/menu/MiniSiderMenu.vue

@@ -1,71 +0,0 @@
-<template>
-  <a-layout-sider 
-    :class="['sider', isMobile ? null : 'shadow', theme ]" 
-    width="256px" 
-    :collapsible="collapsible"
-    v-model="collapsed" 
-    :trigger="null">
-    <div class="logo">
-      <router-link :to="{name:'dashboard'}">
-        <img src="~@/assets/logo.svg" alt="logo">
-        <h1>Ant Design Pro</h1>
-      </router-link>
-    </div>
-    <s-menu
-      :collapsed="collapsed"
-      :menu="menus"
-      :theme="theme"
-      @select="onSelect"
-      :mode="mode"
-      style="padding: 16px 0px;"></s-menu>
-  </a-layout-sider>
-</template>
-
-<script>
-  import ALayoutSider from "ant-design-vue/es/layout/Sider"
-  import SMenu from './index'
-
-  export default {
-    name: "SiderMenu",
-    components: { ALayoutSider, SMenu },
-    props: {
-      mode: {
-        type: String,
-        required: false,
-        default: 'inline'
-      },
-      theme: {
-        type: String,
-        required: false,
-        default: 'dark'
-      },
-      collapsible: {
-        type: Boolean,
-        required: false,
-        default: false
-      },
-      collapsed: {
-        type: Boolean,
-        required: false,
-        default: false
-      },
-      menus: {
-        type: Array,
-        required: true
-      }
-    },
-    created () {
-
-    },
-    computed: {
-      isMobile () {
-        return this.$store.state.app.device !== 'desktop'
-      }
-    },
-    methods: {
-      onSelect (obj) {
-        this.$emit('menuSelect', obj)
-      }
-    }
-  }
-</script>

src/components/menu/NavMenu.vue

@@ -1,36 +0,0 @@
-<template>
-  <a-menu
-    theme="dark"
-    mode="inline"
-    :defaultSelectedKeys="['1']">
-
-    <template v-for="menu in menus">
-      <s-submenu :menu="menu" :key="menu.id"></s-submenu>
-    </template>
-
-  </a-menu>
-</template>
-
-<script>
-import SubMenu from './SubMenu'
-import { asyncRouterMap } from '../../router/index'
-
-export default {
-  name: "NavMenu",
-  components: {
-      "s-submenu": SubMenu
-  },
-  data() {
-    return {
-      menus: []
-    }
-  },
-  created() {
-    this.menus = asyncRouterMap
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/components/menu/SubMenu.vue

@@ -1,32 +0,0 @@
-<template>
-  <a-menu-item :key="menu.id" v-if="!menu.children && $router.matcher.match({ name: menu.permission }).matched.length">
-    <router-link :to="{ name: menu.name, params: { pageNo: '1' } }">
-      <a-icon v-if="menu.meta.icon" :type="menu.meta.icon"></a-icon>
-      <span>{{ menu.meta.title }}</span>
-    </router-link>
-  </a-menu-item>
-  <a-sub-menu :key="menu.id" v-else>
-    <span slot="title"><a-icon :type="menu.meta.icon" v-if="menu.meta.icon" /><span>{{ menu.meta.title }}</span></span>
-    <template v-for="submenu in menu.children">
-      <s-submenu :key="submenu.id" :menu="submenu"></s-submenu>
-    </template>
-  </a-sub-menu>
-</template>
-
-<script>
-import SubMenu from './SubMenu'
-
-export default {
-    name: "SubMenu",
-  components: {
-      "s-submenu": SubMenu
-  },
-  props: {
-    menu: {},
-    collapsed: {
-      type: Boolean,
-      default: false
-    }
-  }
-}
-</script>

src/components/table/StandardTable.vue

@@ -1,250 +1,252 @@
-<template>
-  <div class="standard-table">
-    <div class="alert">
-      <a-alert type="info" :show-icon="true">
-        <div slot="message">
-          已选择&nbsp;<a style="font-weight: 600">{{ selectedRows.length }}</a>&nbsp;&nbsp;
-          <template v-for="(item, index) in needTotalList" v-if="item.needTotal">
-            {{ item.title }} 总计&nbsp;
-            <a :key="index" style="font-weight: 600">
-              {{ item.customRender ? item.customRender(item.total) : item.total }}
-            </a>&nbsp;&nbsp;
-          </template>
-          <a style="margin-left: 24px" @click="onClearSelected">清空</a>
-        </div>
-      </a-alert>
-    </div>
-    <a-table
-      :size="size"
-      :bordered="bordered"
-      :loading="loading"
-      :columns="columns"
-      :dataSource="current"
-      :rowKey="rowKey"
-      :pagination="pagination"
-      :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: updateSelect }"
-    >
-    </a-table>
-  </div>
-</template>
-
-<script>
-  export default {
-    name: "StandardTable",
-    // props: ['bordered', 'loading', 'columns', 'data', 'rowKey', 'pagination', 'selectedRows'],
-    props: {
-
-      /**
-       * 数据加载函数，返回值必须是 Promise
-       * 默认情况下必须传递 data 参数；
-       *    如果使用本地数据渲染表格，业务代码中将获取本地数据包装为 Promise 即可。
-       *
-       * currentData 用于向外暴露表格当前渲染的数据，
-       * 业务开发中也可以直接修改 currentData，从而重新渲染表格（仅推荐用于客户端排序、数据过滤等场景）
-       */
-      data: {
-        type: Function,
-        required: true
-      },
-      dataSource: {
-        type: Array,
-        default () {
-          return []
-        }
-      },
-      columns: {
-        type: Array,
-        required: true
-      },
-/*      pagination: {
-        type: Object,
-        default () {
-          return {}
-        }
-      },*/
-      pageSize: {
-        type: Number,
-        default: 10
-      },
-      pageNum: {
-        type: Number,
-        default: 1
-      },
-      pageSizeOptions: {
-        type: Array,
-        default () {
-          return ['10', '20', '30', '40', '50']
-        }
-      },
-      responseParamsName: {
-        type: Object,
-        default () {
-          return {}
-        }
-      },
-      bordered: {
-        type: Boolean,
-        default: false
-      },
-      /**
-       * 表格大小风格，default, middle, small
-       */
-      size: {
-        type: String,
-        default: 'default'
-      },
-      rowKey: {
-        type: String
-      },
-      selectedRows: {
-        type: Array
-      }
-    },
-    data () {
-      return {
-        needTotalList: [],
-        selectedRowKeys: [],
-
-        loading: true,
-
-        total: 0,
-        pageNumber: this.pageNum,
-        currentPageSize: this.pageSize,
-        defaultCurrent: 1,
-        sortParams: {},
-
-        current: [],
-        pagination: {},
-        paramsName: {},
-      }
-    },
-    created () {
-      //数据请求参数配置
-      this.paramsName = Object.assign(
-        {},
-        {
-          pageNumber: "pageNo",
-          pageSize: "pageSize",
-          total: "totalCount",
-          results: "data",
-          sortColumns: "sortColumns"
-        },
-        this.responseParamsName
-      );
-
-      this.needTotalList = this.initTotalList(this.columns)
-
-      // load data
-      this.loadData( { pageNum: this.pageNumber } )
-    },
-    methods: {
-      updateSelect (selectedRowKeys, selectedRows) {
-        this.selectedRowKeys = selectedRowKeys
-        let list = this.needTotalList
-        this.needTotalList = list.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce((sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-        this.$emit('change', selectedRowKeys, selectedRows)
-      },
-      initTotalList (columns) {
-        const totalList = []
-        columns.forEach(column => {
-          if (column.needTotal) {
-            totalList.push({ ...column, total: 0 })
-          }
-        })
-        return totalList
-      },
-
-      loadData (params) {
-        let that = this
-        that.loading = true
-        params = Object.assign({}, params)
-        const remoteParams = Object.assign({}, that.sortParams)
-        remoteParams[that.paramsName.pageNumber] = params.pageNum || that.pageNumber
-        remoteParams[that.paramsName.pageSize] = params.pageSize || that.currentPageSize
-
-        if (params.pageNum) {
-          that.pageNumber = params.pageNum
-        }
-        if (params.pageSize) {
-          that.currentPageSize = params.pageSize
-        }
-
-        let dataPromise = that.data(remoteParams)
-
-        dataPromise.then( response => {
-          if (!response) {
-            that.loading = false
-            return
-          }
-          let results = response[that.paramsName.results]
-          results = (results instanceof Array && results) || []
-
-          that.current = results
-
-          that.$emit("update:currentData", that.current.slice())
-          that.$emit("dataloaded", that.current.slice())
-
-          that.total = response[that.paramsName.total] * 1
-          that.pagination = that.pager()
-          that.loading = false
-        }, () => {
-          // error callback
-          that.loading = false
-        })
-      },
-      // eslint-disable-next-line
-      onPagerChange (page, pageSize) {
-        this.pageNumber = page
-        this.loadData({ pageNum: page })
-      },
-      onPagerSizeChange (current, size) {
-        this.currentPageSize = size
-        /*
-        if (current === this.pageNumber) this.loadData()
-        console.log('page-size-change', current, size)
-        */
-      },
-      onClearSelected () {
-        this.selectedRowKeys = []
-        this.updateSelect([], [])
-      },
-      pager () {
-        return {
-          total: this.total,
-          showTotal: total => `共有 ${total} 条`,
-          showSizeChanger: true,
-          pageSizeOptions: this.pageSizeOptions,
-          pageSize: this.pageSize,
-          defaultCurrent: this.defaultCurrent,
-          onChange: this.onPagerChange,
-          onShowSizeChange: this.onPagerSizeChange
-        }
-      }
-    },
-    watch: {
-      'selectedRows': function (selectedRows) {
-        this.needTotalList = this.needTotalList.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce( (sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-      }
-    }
-  }
-</script>
-
-<style scoped>
-    .alert {
-        margin-bottom: 16px;
-    }
+<template>
+  <div class="standard-table">
+    <div class="alert">
+      <a-alert type="info" :show-icon="true">
+        <div slot="message">
+          已选择&nbsp;<a style="font-weight: 600">{{ selectedRows.length }}</a>&nbsp;&nbsp;
+          <template v-for="(item, index) in needTotalList" v-if="item.needTotal">
+            {{ item.title }} 总计&nbsp;
+            <a :key="index" style="font-weight: 600">
+              {{ item.customRender ? item.customRender(item.total) : item.total }}
+            </a>&nbsp;&nbsp;
+          </template>
+          <a style="margin-left: 24px" @click="onClearSelected">清空</a>
+        </div>
+      </a-alert>
+    </div>
+    <a-table
+      :size="size"
+      :bordered="bordered"
+      :loading="loading"
+      :columns="columns"
+      :dataSource="current"
+      :rowKey="rowKey"
+      :pagination="pagination"
+      :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: updateSelect }"
+    >
+    </a-table>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "StandardTable",
+    // props: ['bordered', 'loading', 'columns', 'data', 'rowKey', 'pagination', 'selectedRows'],
+    props: {
+
+      /**
+       * 数据加载函数，返回值必须是 Promise
+       * 默认情况下必须传递 data 参数；
+       *    如果使用本地数据渲染表格，业务代码中将获取本地数据包装为 Promise 即可。
+       *
+       * currentData 用于向外暴露表格当前渲染的数据，
+       * 业务开发中也可以直接修改 currentData，从而重新渲染表格（仅推荐用于客户端排序、数据过滤等场景）
+       */
+      data: {
+        type: Function,
+        required: true
+      },
+      dataSource: {
+        type: Array,
+        default () {
+          return []
+        }
+      },
+      columns: {
+        type: Array,
+        required: true
+      },
+/*      pagination: {
+        type: Object,
+        default () {
+          return {}
+        }
+      },*/
+      pageSize: {
+        type: Number,
+        default: 10
+      },
+      pageNum: {
+        type: Number,
+        default: 1
+      },
+      pageSizeOptions: {
+        type: Array,
+        default () {
+          return ['10', '20', '30', '40', '50']
+        }
+      },
+      responseParamsName: {
+        type: Object,
+        default () {
+          return {}
+        }
+      },
+      bordered: {
+        type: Boolean,
+        default: false
+      },
+      /**
+       * 表格大小风格，default, middle, small
+       */
+      size: {
+        type: String,
+        default: 'default'
+      },
+      rowKey: {
+        type: String,
+        default: ''
+      },
+      selectedRows: {
+        type: Array,
+        default: null
+      }
+    },
+    data () {
+      return {
+        needTotalList: [],
+        selectedRowKeys: [],
+
+        loading: true,
+
+        total: 0,
+        pageNumber: this.pageNum,
+        currentPageSize: this.pageSize,
+        defaultCurrent: 1,
+        sortParams: {},
+
+        current: [],
+        pagination: {},
+        paramsName: {},
+      }
+    },
+    created () {
+      //数据请求参数配置
+      this.paramsName = Object.assign(
+        {},
+        {
+          pageNumber: "pageNo",
+          pageSize: "pageSize",
+          total: "totalCount",
+          results: "data",
+          sortColumns: "sortColumns"
+        },
+        this.responseParamsName
+      );
+
+      this.needTotalList = this.initTotalList(this.columns)
+
+      // load data
+      this.loadData( { pageNum: this.pageNumber } )
+    },
+    methods: {
+      updateSelect (selectedRowKeys, selectedRows) {
+        this.selectedRowKeys = selectedRowKeys
+        let list = this.needTotalList
+        this.needTotalList = list.map(item => {
+          return {
+            ...item,
+            total: selectedRows.reduce((sum, val) => {
+              return sum + val[item.dataIndex]
+            }, 0)
+          }
+        })
+        this.$emit('change', selectedRowKeys, selectedRows)
+      },
+      initTotalList (columns) {
+        const totalList = []
+        columns.forEach(column => {
+          if (column.needTotal) {
+            totalList.push({ ...column, total: 0 })
+          }
+        })
+        return totalList
+      },
+
+      loadData (params) {
+        let that = this
+        that.loading = true
+        params = Object.assign({}, params)
+        const remoteParams = Object.assign({}, that.sortParams)
+        remoteParams[that.paramsName.pageNumber] = params.pageNum || that.pageNumber
+        remoteParams[that.paramsName.pageSize] = params.pageSize || that.currentPageSize
+
+        if (params.pageNum) {
+          that.pageNumber = params.pageNum
+        }
+        if (params.pageSize) {
+          that.currentPageSize = params.pageSize
+        }
+
+        let dataPromise = that.data(remoteParams)
+
+        dataPromise.then( response => {
+          if (!response) {
+            that.loading = false
+            return
+          }
+          let results = response[that.paramsName.results]
+          results = (results instanceof Array && results) || []
+
+          that.current = results
+
+          that.$emit("update:currentData", that.current.slice())
+          that.$emit("dataloaded", that.current.slice())
+
+          that.total = response[that.paramsName.total] * 1
+          that.pagination = that.pager()
+          that.loading = false
+        }, () => {
+          // error callback
+          that.loading = false
+        })
+      },
+      // eslint-disable-next-line
+      onPagerChange (page, pageSize) {
+        this.pageNumber = page
+        this.loadData({ pageNum: page })
+      },
+      onPagerSizeChange (current, size) {
+        this.currentPageSize = size
+        /*
+        if (current === this.pageNumber) this.loadData()
+        console.log('page-size-change', current, size)
+        */
+      },
+      onClearSelected () {
+        this.selectedRowKeys = []
+        this.updateSelect([], [])
+      },
+      pager () {
+        return {
+          total: this.total,
+          showTotal: total => `共有 ${total} 条`,
+          showSizeChanger: true,
+          pageSizeOptions: this.pageSizeOptions,
+          pageSize: this.pageSize,
+          defaultCurrent: this.defaultCurrent,
+          onChange: this.onPagerChange,
+          onShowSizeChange: this.onPagerSizeChange
+        }
+      }
+    },
+    watch: {
+      'selectedRows': function (selectedRows) {
+        this.needTotalList = this.needTotalList.map(item => {
+          return {
+            ...item,
+            total: selectedRows.reduce( (sum, val) => {
+              return sum + val[item.dataIndex]
+            }, 0)
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+    .alert {
+        margin-bottom: 16px;
+    }
 </style>

src/views/list/TableInnerEditList.vue

@@ -84,6 +84,7 @@
       size="default"
       :columns="columns"
       :data="loadData"
+      :showAlertInfo="true"
       :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onChange }"
     >
       <template v-for="(col, index) in columns" v-if="col.scopedSlots" :slot="col.dataIndex" slot-scope="text, record, index">
@@ -107,9 +108,9 @@
             </a-popconfirm>
           </span>
           <span v-else>
-            <a @click="() => edit(record, index)">修改</a>
+            <a class="edit" @click="() => edit(record)">修改</a>
             <a-divider type="vertical" />
-            <a @click="() => delete(record, index)">删除</a>
+            <a class="delete" @click="() => del(record)">删除</a>
           </span>
         </div>
       </template>
@@ -194,9 +195,29 @@
       },
       edit (row) {
         row.editable = true
-        row = Object.assign({}, row)
+        // row = Object.assign({}, row)
         this.$refs.table.updateEdit()
       },
+      // eslint-disable-next-line
+      del (row) {
+        this.$confirm({
+          title: '警告',
+          content: '真的要删除吗?',
+          okText: '删除',
+          okType: 'danger',
+          cancelText: '取消',
+          onOk() {
+            console.log('OK');
+            // 在这里调用删除接口
+            return new Promise((resolve, reject) => {
+              setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
+            }).catch(() => console.log('Oops errors!'));
+          },
+          onCancel() {
+            console.log('Cancel');
+          },
+        });
+      },
       save (row) {
         delete row.editable
         this.$refs.table.updateEdit()

src/views/list/TableList.vue

@@ -1,290 +1,291 @@
-<template>
-  <a-card :bordered="false">
-    <div :class="advanced ? 'search' : null">
-      <a-form layout="horizontal">
-        <div :class="advanced ? null : 'fold'">
-          <a-row :gutter="48">
-            <a-col :md="8" :sm="24">
-              <a-form-item
-                label="规则编号"
-                :labelCol="{span: 5}"
-                :wrapperCol="{span: 18, offset: 1}"
-              >
-                <a-input placeholder="请输入"/>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item
-                label="使用状态"
-                :labelCol="{span: 5}"
-                :wrapperCol="{span: 18, offset: 1}"
-              >
-                <a-select placeholder="请选择">
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item
-                label="调用次数"
-                :labelCol="{span: 5}"
-                :wrapperCol="{span: 18, offset: 1}"
-              >
-                <a-input-number style="width: 100%" placeholder="请输入"/>
-              </a-form-item>
-            </a-col>
-          </a-row>
-
-          <a-row :gutter="48" v-if="advanced">
-            <a-col :md="8" :sm="24">
-              <a-form-item
-                label="更新日期"
-                :labelCol="{span: 5}"
-                :wrapperCol="{span: 18, offset: 1}">
-                <a-date-picker style="width: 100%" placeholder="请输入更新日期"/>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item
-                label="使用状态"
-                :labelCol="{span: 5}"
-                :wrapperCol="{span: 18, offset: 1}">
-                <a-select placeholder="请选择">
-                  <a-select-option value="1">关闭</a-select-option>
-                  <a-select-option value="2">运行中</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :md="8" :sm="24">
-              <a-form-item
-                label="描述"
-                :labelCol="{span: 5}"
-                :wrapperCol="{span: 18, offset: 1}"
-              >
-                <a-input placeholder="请输入"/>
-              </a-form-item>
-            </a-col>
-          </a-row>
-        </div>
-
-        <span style="float: right; margin-top: 3px;">
-          <a-button type="primary">查询</a-button>
-          <a-button style="margin-left: 8px">重置</a-button>
-          <a @click="toggleAdvanced" style="margin-left: 8px">
-            {{ advanced ? '收起' : '展开' }}
-            <a-icon :type="advanced ? 'up' : 'down'"/>
-          </a>
-        </span>
-      </a-form>
-    </div>
-
-    <s-table
-      size="default"
-      :columns="columns"
-      :data="loadData"
-      :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onChange }"
-    >
-      <span slot="action" slot-scope="text, record">
-        <a @click="handleEdit(record)">编辑</a>
-        <a-divider type="vertical" />
-        <a-dropdown>
-          <a class="ant-dropdown-link">
-            更多 <a-icon type="down" />
-          </a>
-          <a-menu slot="overlay">
-            <a-menu-item>
-              <a href="javascript:;">详情</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">禁用</a>
-            </a-menu-item>
-            <a-menu-item>
-              <a href="javascript:;">删除</a>
-            </a-menu-item>
-          </a-menu>
-        </a-dropdown>
-      </span>
-    </s-table>
-
-    <a-modal
-      title="操作"
-      :width="800"
-      v-model="visible"
-      @ok="handleOk"
-    >
-      <a-form :autoFormCreate="(form)=>{this.form = form}">
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label='规则编号'
-          hasFeedback
-          validateStatus='success'
-        >
-          <a-input placeholder='规则编号' v-model="mdl.no" id='no' />
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label='服务调用次数'
-          hasFeedback
-          validateStatus='success'
-        >
-          <a-input-number :min="1" id="callNo" v-model="mdl.callNo" style="width: 100%" />
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label='状态'
-          hasFeedback
-          validateStatus='warning'
-        >
-          <a-select defaultValue='1' v-model="mdl.status">
-            <a-select-option value='1'>Option 1</a-select-option>
-            <a-select-option value='2'>Option 2</a-select-option>
-            <a-select-option value='3'>Option 3</a-select-option>
-          </a-select>
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label='描述'
-          hasFeedback
-          help='请填写一段描述'
-        >
-          <a-textarea :rows="5" v-model="mdl.description" placeholder="..." id='description'/>
-        </a-form-item>
-
-        <a-form-item
-          :labelCol="labelCol"
-          :wrapperCol="wrapperCol"
-          label='更新时间'
-          hasFeedback
-          validateStatus='error'
-        >
-          <a-date-picker
-            style="width: 100%"
-            showTime
-            format="YYYY-MM-DD HH:mm:ss"
-            placeholder="Select Time"
-          />
-        </a-form-item>
-
-      </a-form>
-    </a-modal>
-
-  </a-card>
-</template>
-
-<script>
-  import STable from '@/components/table/'
-  import ATextarea from "ant-design-vue/es/input/TextArea";
-
-  export default {
-    name: "TableList",
-    components: {
-      ATextarea,
-      STable
-    },
-    data () {
-      return {
-        visible: false,
-        labelCol: {
-          xs: { span: 24 },
-          sm: { span: 5 },
-        },
-        wrapperCol: {
-          xs: { span: 24 },
-          sm: { span: 12 },
-        },
-        form: null,
-        mdl: {},
-
-        // 高级搜索 展开/关闭
-        advanced: false,
-        // 查询参数
-        queryParam: {},
-        // 表头
-        columns: [
-          {
-            title: '规则编号',
-            dataIndex: 'no'
-          },
-          {
-            title: '描述',
-            dataIndex: 'description'
-          },
-          {
-            title: '服务调用次数',
-            dataIndex: 'callNo',
-            sorter: true,
-            needTotal: true,
-            customRender: (text) => text + ' 次'
-          },
-          {
-            title: '状态',
-            dataIndex: 'status',
-            needTotal: true
-          },
-          {
-            title: '更新时间',
-            dataIndex: 'updatedAt',
-            sorter: true
-          },
-          {
-            table: '操作',
-            dataIndex: 'action',
-            width: '150px',
-            scopedSlots: { customRender: 'action' },
-          }
-        ],
-        // 加载数据方法 必须为 Promise 对象
-        loadData: parameter => {
-          return this.$http.get('/service', {
-            params: Object.assign(parameter, this.queryParam)
-          }).then(res => {
-            return res.result
-          })
-        },
-
-        selectedRowKeys: [],
-        selectedRows: []
-      }
-    },
-    methods: {
-      handleEdit (record) {
-        this.mdl = Object.assign({}, record)
-        console.log(this.mdl)
-        this.visible = true
-      },
-      handleOk () {
-
-      },
-      onChange (selectedRowKeys, selectedRows) {
-        this.selectedRowKeys = selectedRowKeys
-        this.selectedRows = selectedRows
-      },
-      toggleAdvanced () {
-        this.advanced = !this.advanced
-      },
-    },
-    watch: {
-      /*
-      'selectedRows': function (selectedRows) {
-        this.needTotalList = this.needTotalList.map(item => {
-          return {
-            ...item,
-            total: selectedRows.reduce( (sum, val) => {
-              return sum + val[item.dataIndex]
-            }, 0)
-          }
-        })
-      }
-      */
-    }
-  }
+<template>
+  <a-card :bordered="false">
+    <div :class="advanced ? 'search' : null">
+      <a-form layout="horizontal">
+        <div :class="advanced ? null : 'fold'">
+          <a-row :gutter="48">
+            <a-col :md="8" :sm="24">
+              <a-form-item
+                label="规则编号"
+                :labelCol="{span: 5}"
+                :wrapperCol="{span: 18, offset: 1}"
+              >
+                <a-input placeholder="请输入"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="8" :sm="24">
+              <a-form-item
+                label="使用状态"
+                :labelCol="{span: 5}"
+                :wrapperCol="{span: 18, offset: 1}"
+              >
+                <a-select placeholder="请选择">
+                  <a-select-option value="1">关闭</a-select-option>
+                  <a-select-option value="2">运行中</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="8" :sm="24">
+              <a-form-item
+                label="调用次数"
+                :labelCol="{span: 5}"
+                :wrapperCol="{span: 18, offset: 1}"
+              >
+                <a-input-number style="width: 100%" placeholder="请输入"/>
+              </a-form-item>
+            </a-col>
+          </a-row>
+
+          <a-row :gutter="48" v-if="advanced">
+            <a-col :md="8" :sm="24">
+              <a-form-item
+                label="更新日期"
+                :labelCol="{span: 5}"
+                :wrapperCol="{span: 18, offset: 1}">
+                <a-date-picker style="width: 100%" placeholder="请输入更新日期"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="8" :sm="24">
+              <a-form-item
+                label="使用状态"
+                :labelCol="{span: 5}"
+                :wrapperCol="{span: 18, offset: 1}">
+                <a-select placeholder="请选择">
+                  <a-select-option value="1">关闭</a-select-option>
+                  <a-select-option value="2">运行中</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="8" :sm="24">
+              <a-form-item
+                label="描述"
+                :labelCol="{span: 5}"
+                :wrapperCol="{span: 18, offset: 1}"
+              >
+                <a-input placeholder="请输入"/>
+              </a-form-item>
+            </a-col>
+          </a-row>
+        </div>
+
+        <span style="float: right; margin-top: 3px;">
+          <a-button type="primary">查询</a-button>
+          <a-button style="margin-left: 8px">重置</a-button>
+          <a @click="toggleAdvanced" style="margin-left: 8px">
+            {{ advanced ? '收起' : '展开' }}
+            <a-icon :type="advanced ? 'up' : 'down'"/>
+          </a>
+        </span>
+      </a-form>
+    </div>
+
+    <s-table
+      size="default"
+      :columns="columns"
+      :data="loadData"
+      :showAlertInfo="true"
+      :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onChange }"
+    >
+      <span slot="action" slot-scope="text, record">
+        <a @click="handleEdit(record)">编辑</a>
+        <a-divider type="vertical" />
+        <a-dropdown>
+          <a class="ant-dropdown-link">
+            更多 <a-icon type="down" />
+          </a>
+          <a-menu slot="overlay">
+            <a-menu-item>
+              <a href="javascript:;">详情</a>
+            </a-menu-item>
+            <a-menu-item>
+              <a href="javascript:;">禁用</a>
+            </a-menu-item>
+            <a-menu-item>
+              <a href="javascript:;">删除</a>
+            </a-menu-item>
+          </a-menu>
+        </a-dropdown>
+      </span>
+    </s-table>
+
+    <a-modal
+      title="操作"
+      :width="800"
+      v-model="visible"
+      @ok="handleOk"
+    >
+      <a-form :autoFormCreate="(form)=>{this.form = form}">
+
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label='规则编号'
+          hasFeedback
+          validateStatus='success'
+        >
+          <a-input placeholder='规则编号' v-model="mdl.no" id='no' />
+        </a-form-item>
+
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label='服务调用次数'
+          hasFeedback
+          validateStatus='success'
+        >
+          <a-input-number :min="1" id="callNo" v-model="mdl.callNo" style="width: 100%" />
+        </a-form-item>
+
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label='状态'
+          hasFeedback
+          validateStatus='warning'
+        >
+          <a-select defaultValue='1' v-model="mdl.status">
+            <a-select-option value='1'>Option 1</a-select-option>
+            <a-select-option value='2'>Option 2</a-select-option>
+            <a-select-option value='3'>Option 3</a-select-option>
+          </a-select>
+        </a-form-item>
+
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label='描述'
+          hasFeedback
+          help='请填写一段描述'
+        >
+          <a-textarea :rows="5" v-model="mdl.description" placeholder="..." id='description'/>
+        </a-form-item>
+
+        <a-form-item
+          :labelCol="labelCol"
+          :wrapperCol="wrapperCol"
+          label='更新时间'
+          hasFeedback
+          validateStatus='error'
+        >
+          <a-date-picker
+            style="width: 100%"
+            showTime
+            format="YYYY-MM-DD HH:mm:ss"
+            placeholder="Select Time"
+          />
+        </a-form-item>
+
+      </a-form>
+    </a-modal>
+
+  </a-card>
+</template>
+
+<script>
+  import STable from '@/components/table/'
+  import ATextarea from "ant-design-vue/es/input/TextArea";
+
+  export default {
+    name: "TableList",
+    components: {
+      ATextarea,
+      STable
+    },
+    data () {
+      return {
+        visible: false,
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 5 },
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 12 },
+        },
+        form: null,
+        mdl: {},
+
+        // 高级搜索 展开/关闭
+        advanced: false,
+        // 查询参数
+        queryParam: {},
+        // 表头
+        columns: [
+          {
+            title: '规则编号',
+            dataIndex: 'no'
+          },
+          {
+            title: '描述',
+            dataIndex: 'description'
+          },
+          {
+            title: '服务调用次数',
+            dataIndex: 'callNo',
+            sorter: true,
+            needTotal: true,
+            customRender: (text) => text + ' 次'
+          },
+          {
+            title: '状态',
+            dataIndex: 'status',
+            needTotal: true
+          },
+          {
+            title: '更新时间',
+            dataIndex: 'updatedAt',
+            sorter: true
+          },
+          {
+            table: '操作',
+            dataIndex: 'action',
+            width: '150px',
+            scopedSlots: { customRender: 'action' },
+          }
+        ],
+        // 加载数据方法 必须为 Promise 对象
+        loadData: parameter => {
+          return this.$http.get('/service', {
+            params: Object.assign(parameter, this.queryParam)
+          }).then(res => {
+            return res.result
+          })
+        },
+
+        selectedRowKeys: [],
+        selectedRows: []
+      }
+    },
+    methods: {
+      handleEdit (record) {
+        this.mdl = Object.assign({}, record)
+        console.log(this.mdl)
+        this.visible = true
+      },
+      handleOk () {
+
+      },
+      onChange (selectedRowKeys, selectedRows) {
+        this.selectedRowKeys = selectedRowKeys
+        this.selectedRows = selectedRows
+      },
+      toggleAdvanced () {
+        this.advanced = !this.advanced
+      },
+    },
+    watch: {
+      /*
+      'selectedRows': function (selectedRows) {
+        this.needTotalList = this.needTotalList.map(item => {
+          return {
+            ...item,
+            total: selectedRows.reduce( (sum, val) => {
+              return sum + val[item.dataIndex]
+            }, 0)
+          }
+        })
+      }
+      */
+    }
+  }
 </script>

src/views/profile/basic/Index.vue

@@ -19,13 +19,17 @@
 
       <div class="title">退货商品</div>
       <s-table
-        style="margin-bottom: 24px" :columns="goodsColumns" :data="loadGoodsData">
+        style="margin-bottom: 24px" 
+        :columns="goodsColumns" 
+        :data="loadGoodsData">
 
       </s-table>
 
       <div class="title">退货进度</div>
       <s-table
-        style="margin-bottom: 24px" :columns="scheduleColumns" :data="loadScheduleData">
+        style="margin-bottom: 24px" 
+        :columns="scheduleColumns" 
+        :data="loadScheduleData">
 
         <template
           slot="status"
@@ -91,7 +95,7 @@
           }
         ],
         // 加载数据方法 必须为 Promise 对象
-        loadGoodsData: parameter => {
+        loadGoodsData: () => {
           return new Promise((resolve => {
             resolve({
               data: [
@@ -166,7 +170,7 @@
             key: 'cost'
           }
         ],
-        loadScheduleData: parameter => {
+        loadScheduleData: () => {
           return new Promise((resolve => {
             resolve({
               data: [