fix: $dialog and table-list modal

Author: sendya

src/api/manage.js

@@ -60,3 +60,11 @@ export function saveService (parameter) {
     data: parameter
   })
 }
+
+export function saveSub (sub) {
+  return request({
+    url: '/sub',
+    method: sub.id === 0 ? 'post' : 'put',
+    data: sub
+  })
+}

src/components/Table/index.js

@@ -85,6 +85,10 @@ export default {
           pageNo: val
         })
       })
+      // change pagination, reset total data
+      this.needTotalList = this.initTotalList(this.columns)
+      this.selectedRowKeys = []
+      this.selectedRows = []
     },
     pageNum (val) {
       Object.assign(this.localPagination, {
@@ -110,7 +114,6 @@ export default {
       pageSize: this.pageSize,
       showSizeChanger: this.showSizeChanger
     }) || false
-    console.log('this.localPagination', this.localPagination)
     this.needTotalList = this.initTotalList(this.columns)
     this.loadData()
   },
@@ -149,7 +152,6 @@ export default {
         ...filters
       }
       )
-      console.log('parameter', parameter)
       const result = this.data(parameter)
       // 对接自己的通用数据接口需要修改下方代码中的 r.pageNo, r.totalCount, r.data
       // eslint-disable-next-line
@@ -178,7 +180,6 @@ export default {
           } catch (e) {
             this.localPagination = false
           }
-          console.log('loadData -> this.localPagination', this.localPagination)
           this.localDataSource = r.data // 返回结果中的数组数据
           this.localLoading = false
         })
@@ -280,7 +281,6 @@ export default {
       if (k === 'rowSelection') {
         if (showAlert && this.rowSelection) {
           // 如果需要使用alert，则重新绑定 rowSelection 事件
-          console.log('this.rowSelection', this.rowSelection)
           props[k] = {
             ...this.rowSelection,
             selectedRows: this.selectedRows,

src/core/lazy_use.js

@@ -50,6 +50,7 @@ import Viser from 'viser-vue'
 
 // ext library
 import VueCropper from 'vue-cropper'
+import Dialog from '@/components/Dialog'
 import MultiTab from '@/components/MultiTab'
 import PageLoading from '@/components/PageLoading'
 import PermissionHelper from '@/utils/helper/permission'
@@ -106,6 +107,7 @@ Vue.prototype.$error = Modal.error
 Vue.prototype.$warning = Modal.warning
 
 Vue.use(Viser)
+Vue.use(Dialog) // this.$dialog func
 Vue.use(MultiTab)
 Vue.use(PageLoading)
 Vue.use(PermissionHelper)

src/locales/index.js

@@ -17,6 +17,7 @@ const messages = {
 }
 
 const i18n = new VueI18n({
+  silentTranslationWarn: true,
   locale: defaultLang,
   fallbackLocale: defaultLang,
   messages

src/mock/services/auth.js

@@ -4,7 +4,7 @@ import { builder, getBody } from '../util'
 const username = ['admin', 'super']
 // 强硬要求 ant.design 相同密码
 // '21232f297a57a5a743894a0e4a801fc3',
-const password = ['8914de686ab28dc22f30d3d8e107ff6c'] // admin, ant.design
+const password = ['8914de686ab28dc22f30d3d8e107ff6c', '21232f297a57a5a743894a0e4a801fc3'] // admin, ant.design
 
 const login = (options) => {
   const body = getBody(options)

src/permission.js

@@ -25,6 +25,7 @@ router.beforeEach((to, from, next) => {
     } else {
       // check login user.roles is null
       if (store.getters.roles.length === 0) {
+        // request login userInfo
         store
           .dispatch('GetInfo')
           .then(res => {

src/views/list/BasicList.vue

@@ -29,7 +29,7 @@
       </div>
 
       <div class="operate">
-        <a-button type="dashed" style="width: 100%" icon="plus" @click="$refs.taskForm.add()">添加</a-button>
+        <a-button type="dashed" style="width: 100%" icon="plus" @click="add">添加</a-button>
       </div>
 
       <a-list size="large" :pagination="{showSizeChanger: true, showQuickJumper: true, pageSize: 5, total: 50}">
@@ -70,6 +70,7 @@
 </template>
 
 <script>
+// 演示如何使用 this.$dialog 封装 modal 组件
 import TaskForm from './modules/TaskForm'
 import Info from './components/Info'
 
@@ -139,15 +140,48 @@ export default {
     }
   },
   methods: {
+    add () {
+      this.$dialog(TaskForm,
+        // component props
+        {
+          record: {},
+          on: {
+            ok () {
+              console.log('ok 回调')
+            },
+            cancel () {
+              console.log('cancel 回调')
+            },
+            close () {
+              console.log('modal close 回调')
+            }
+          }
+        },
+        // modal props
+        {
+          title: '新增',
+          width: 700,
+          centered: true,
+          maskClosable: false
+        })
+    },
     edit (record) {
       console.log('record', record)
-      // mockdata
-      record.taskName = '测试'
-      // mockend
       this.$dialog(TaskForm,
         // component props
         {
-          record
+          record,
+          on: {
+            ok () {
+              console.log('ok 回调')
+            },
+            cancel () {
+              console.log('cancel 回调')
+            },
+            close () {
+              console.log('modal close 回调')
+            }
+          }
         },
         // modal props
         {