♻️ Refactoring code. 优化代码生成模板

2023-01-07 16:58:13 +08:00
1 parent b995a015b5
commit 1027bccfed
@@ -15,139 +15,140 @@
  - Author: lengleng (wangiegie@gmail.com)
  -->
 <template>
-    <div class="execution">
-        <basic-container>
-            <avue-crud ref="crud"
-                       :page.sync="page"
-                       :data="tableData"
-                       :permission="permissionList"
-                       :table-loading="tableLoading"
-                       :option="tableOption"
-                       @on-load="getList"
-                       @search-change="searchChange"
-                       @refresh-change="refreshChange"
-                       @size-change="sizeChange"
-                       @current-change="currentChange"
-                       @row-update="handleUpdate"
-                       @row-save="handleSave"
-                       @row-del="handleDel">
-                <template slot="menuLeft">
-                    <el-button
-                            v-if="permissions.${moduleName}_${pathName}_export"
-                            class="filter-item"
-                            plain
-                            type="primary"
-                            size="small"
-                            icon="el-icon-download"
-                            @click="exportExcel">导出
-                    </el-button>
-                </template>
-            </avue-crud>
-        </basic-container>
-    </div>
+  <div class="execution">
+    <basic-container>
+      <avue-crud
+        ref="crud"
+        :page.sync="page"
+        :data="tableData"
+        :permission="permissionList"
+        :table-loading="tableLoading"
+        :option="tableOption"
+        @on-load="getList"
+        @search-change="searchChange"
+        @refresh-change="refreshChange"
+        @size-change="sizeChange"
+        @current-change="currentChange"
+        @row-update="handleUpdate"
+        @row-save="handleSave"
+        @row-del="handleDel">
+        <template slot="menuLeft">
+          <el-button
+            v-if="permissions.${moduleName}_${pathName}_export"
+            class="filter-item"
+            plain
+            type="primary"
+            size="small"
+            icon="el-icon-download"
+            @click="exportExcel">导出
+          </el-button>
+        </template>
+      </avue-crud>
+    </basic-container>
+  </div>
 </template>

 <script>
-    import {fetchList, addObj, putObj, delObj} from '@/api/${pathName}'
-    import {tableOption} from '@/const/crud/${pathName}'
-    import {mapGetters} from 'vuex'
+import { fetchList, addObj, putObj, delObj } from '@/api/${pathName}'
+import { tableOption } from '@/const/crud/${pathName}'
+import { mapGetters } from 'vuex'

-    export default {
-        name: '${pathName}',
-        data() {
-            return {
-                searchForm: {},
-                tableData: [],
-                page: {
-                    total: 0, // 总页数
-                    currentPage: 1, // 当前页数
-                    pageSize: 20 // 每页显示多少条
-                },
-                tableLoading: false,
-                tableOption: tableOption
-            }
-        },
-        computed: {
-            ...mapGetters(['permissions']),
-            permissionList() {
-                return {
-                    addBtn: this.vaildData(this.permissions.${moduleName}_${pathName}_add, false),
-                    delBtn: this.vaildData(this.permissions.${moduleName}_${pathName}_del, false),
-                    editBtn: this.vaildData(this.permissions.${moduleName}_${pathName}_edit, false)
-                };
-            }
-        },
-        methods: {
-            // 列表查询
-            getList(page, params) {
-                this.tableLoading = true
-                fetchList(Object.assign({
-                    current: page.currentPage,
-                    size: page.pageSize
-                }, params, this.searchForm )).then(response => {
-                    this.tableData = response.data.data.records
-                    this.page.total = response.data.data.total
-                    this.tableLoading = false
-                }).catch(() => {
-                    this.tableLoading=false
-                })
-            },
-            // 删除
-            handleDel: function (row, index) {
-                this.$confirm('是否确认删除ID为' + row.$pk.lowerAttrName, '提示', {
-                    confirmButtonText: '确定',
-                    cancelButtonText: '取消',
-                    type: 'warning'
-                }).then(function () {
-                    return delObj(row.$pk.lowerAttrName)
-                }).then(data => {
-                    this.$message.success('删除成功')
-                    this.getList(this.page)
-                })
-            },
-            // 更新
-            handleUpdate: function (row, index, done,loading) {
-                putObj(row).then(data => {
-                    this.$message.success('修改成功')
-                    done()
-                    this.getList(this.page)
-                }).catch(() => {
-                    loading();
-                });
-            },
-            // 保存
-            handleSave: function (row, done,loading) {
-                addObj(row).then(data => {
-                    this.$message.success('添加成功')
-                    done()
-                    this.getList(this.page)
-                }).catch(() => {
-                    loading();
-                });
-            },
-            // 每页条数改变事件
-            sizeChange(pageSize){
-                this.page.pageSize = pageSize
-            },
-            // 当前页发生改变事件
-            currentChange(current){
-                this.page.currentPage = current
-            },
-            // 查询事件
-            searchChange(form, done) {
-                this.searchForm = form
-                this.page.currentPage = 1
-                this.getList(this.page, form)
-                done()
-            },
-            // 刷新事件
-            refreshChange() {
-                this.getList(this.page)
-            },
-            //  导出excel
-            exportExcel() {
-                this.downBlobFile('/${moduleName}/${pathName}/export',this.searchForm, '${pathName}.xlsx')
-            }
-        }
+export default {
+  name: '${pathName}',
+  data() {
+    return {
+      searchForm: {},
+      tableData: [],
+      page: {
+        total: 0, // 总页数
+        currentPage: 1, // 当前页数
+        pageSize: 20 // 每页显示多少条
+      },
+      tableLoading: false,
+      tableOption: tableOption
    }
+  },
+  computed: {
+    ...mapGetters(['permissions']),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permissions.${moduleName}_${pathName}_add, false),
+        delBtn: this.vaildData(this.permissions.${moduleName}_${pathName}_del, false),
+        editBtn: this.vaildData(this.permissions.${moduleName}_${pathName}_edit, false)
+      }
+    }
+  },
+  methods: {
+    // 列表查询
+    getList(page, params) {
+      this.tableLoading = true
+      fetchList(Object.assign({
+        current: page.currentPage,
+        size: page.pageSize
+      }, params, this.searchForm)).then(response => {
+        this.tableData = response.data.data.records
+        this.page.total = response.data.data.total
+        this.tableLoading = false
+      }).catch(() => {
+        this.tableLoading = false
+      })
+    },
+    // 删除
+    handleDel: function(row, index) {
+      this.$confirm('是否确认删除ID为' + row.$pk.lowerAttrName, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(function() {
+        return delObj(row.$pk.lowerAttrName)
+      }).then(data => {
+        this.$message.success('删除成功')
+        this.getList(this.page)
+      })
+    },
+    // 更新
+    handleUpdate: function(row, index, done, loading) {
+      putObj(row).then(data => {
+        this.$message.success('修改成功')
+        done()
+        this.getList(this.page)
+      }).catch(() => {
+        loading()
+      })
+    },
+    // 保存
+    handleSave: function(row, done, loading) {
+      addObj(row).then(data => {
+        this.$message.success('添加成功')
+        done()
+        this.getList(this.page)
+      }).catch(() => {
+        loading()
+      })
+    },
+    // 每页条数改变事件
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize
+    },
+    // 当前页发生改变事件
+    currentChange(current) {
+      this.page.currentPage = current
+    },
+    // 查询事件
+    searchChange(form, done) {
+      this.searchForm = form
+      this.page.currentPage = 1
+      this.getList(this.page, form)
+      done()
+    },
+    // 刷新事件
+    refreshChange() {
+      this.getList(this.page)
+    },
+    //  导出excel
+    exportExcel() {
+      this.downBlobFile('/${moduleName}/${pathName}/export', this.searchForm, '${pathName}.xlsx')
+    }
+  }
+}
 </script>
@@ -7,9 +7,9 @@
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
 #foreach($column in $columns)
 #if($column.columnName != $pk.columnName)
-    <el-form-item label="${column.comments}" prop="${column.lowerAttrName}">
-      <el-input v-model="dataForm.${column.lowerAttrName}" placeholder="${column.comments}"></el-input>
-    </el-form-item>
+      <el-form-item label="${column.comments}" prop="${column.lowerAttrName}">
+        <el-input v-model="dataForm.${column.lowerAttrName}" placeholder="${column.comments}"></el-input>
+      </el-form-item>
 #end
 #end
    </el-form>
@@ -21,74 +21,72 @@
 </template>

 <script>
-    import {getObj, addObj, putObj} from '@/api/${pathName}'
+import { getObj, addObj, putObj } from '@/api/${pathName}'

-    export default {
-    data () {
-      return {
-        visible: false,
-        canSubmit: false,
-        dataForm: {
+export default {
+  data() {
+    return {
+      visible: false,
+      canSubmit: false,
+      dataForm: {
 #foreach($column in $columns)
 #if($column.columnName == $pk.columnName)
-          ${column.lowerAttrName}: 0,
+        ${column.lowerAttrName}: 0,
 #else
-          ${column.lowerAttrName}: ''#if($velocityCount != $columns.size()),#end
-
+        ${column.lowerAttrName}: ''#if($velocityCount != $columns.size()),#end
 #end
 #end
-        },
-        dataRule: {
+      },
+      dataRule: {
 #foreach($column in $columns)
 #if($column.columnName != $pk.columnName)
-          ${column.lowerAttrName}: [
-            { required: true, message: '${column.comments}不能为空', trigger: 'blur' }
-          ]#if($velocityCount != $columns.size()),#end
-
+        ${column.lowerAttrName}: [
+          { required: true, message: '${column.comments}不能为空', trigger: 'blur' }
+        ]#if($velocityCount != $columns.size()),#end
 #end
 #end
-        }
-      }
-    },
-    methods: {
-      init (id) {
-        this.dataForm.${pk.lowerAttrName} = id || 0;
-        this.visible = true;
-        this.canSubmit = true;
-        this.$nextTick(() => {
-          this.$refs['dataForm'].resetFields()
-          if (this.dataForm.${pk.lowerAttrName}) {
-            getObj(this.dataForm.${pk.lowerAttrName}).then(response => {
-                this.dataForm = response.data.data
-            })
-          }
-        })
-      },
-      // 表单提交
-      dataFormSubmit () {
-        #[[this.$refs['dataForm'].validate((valid) => {]]#
-          if (valid) {
-            this.canSubmit = false;
-            if (this.dataForm.${pk.lowerAttrName}) {
-                putObj(this.dataForm).then(data => {
-                    this.$notify.success('修改成功')
-                    this.visible = false
-                    this.$emit('refreshDataList')
-                }).catch(() => {
-                    this.canSubmit = true;
-                });
-            } else {
-                addObj(this.dataForm).then(data => {
-                    this.$notify.success('添加成功')
-                    this.visible = false
-                    this.$emit('refreshDataList')
-                }).catch(() => {
-                    this.canSubmit = true;
-                });
-            }
-          }
-        })
      }
    }
+  },
+  methods: {
+    init(id) {
+      this.dataForm.${pk.lowerAttrName} = id || 0
+      this.visible = true
+      this.canSubmit = true
+      this.$nextTick(() => {
+        this.$refs['dataForm'].resetFields()
+        if (this.dataForm.${pk.lowerAttrName}) {
+          getObj(this.dataForm.${pk.lowerAttrName}).then(response => {
+            this.dataForm = response.data.data
+          })
+        }
+      })
+    },
+    // 表单提交
+    dataFormSubmit() {
+      #[[this.$refs['dataForm'].validate((valid) => {]]#
+        if (valid) {
+          this.canSubmit = false
+          if (this.dataForm.${pk.lowerAttrName}) {
+            putObj(this.dataForm).then(data => {
+              this.$notify.success('修改成功')
+              this.visible = false
+              this.$emit('refreshDataList')
+            }).catch(() => {
+              this.canSubmit = true
+            })
+          } else {
+            addObj(this.dataForm).then(data => {
+              this.$notify.success('添加成功')
+              this.visible = false
+              this.$emit('refreshDataList')
+            }).catch(() => {
+              this.canSubmit = true
+            })
+          }
+        }
+      })
+    }
  }
+}
 </script>
@@ -10,21 +10,21 @@

      <div class="avue-crud">
        <el-table
-                :data="dataList"
-                border
-                v-loading="dataListLoading">
+          :data="dataList"
+          border
+          v-loading="dataListLoading">
          #foreach($column in $columns)
-            <el-table-column
-                    prop="${column.lowerAttrName}"
-                    header-align="center"
-                    align="center"
-                    label="${column.comments}">
-            </el-table-column>
+          <el-table-column
+            prop="${column.lowerAttrName}"
+            header-align="center"
+            align="center"
+            label="${column.comments}">
+          </el-table-column>
          #end
          <el-table-column
-                  header-align="center"
-                  align="center"
-                  label="操作">
+            header-align="center"
+            align="center"
+            label="操作">
            <template slot-scope="scope">
              <el-button v-if="permissions.${moduleName}_${pathName}_edit" type="text" size="small" icon="el-icon-edit" @click="addOrUpdateHandle(scope.row.${pk.lowerAttrName})">修改</el-button>
              <el-button v-if="permissions.${moduleName}_${pathName}_del" type="text" size="small" icon="el-icon-delete" @click="deleteHandle(scope.row.${pk.lowerAttrName})">删除</el-button>
@@ -35,14 +35,14 @@

      <div class="avue-crud__pagination">
        <el-pagination
-                @size-change="sizeChangeHandle"
-                @current-change="currentChangeHandle"
-                :current-page="pageIndex"
-                :page-sizes="[10, 20, 50, 100]"
-                :page-size="pageSize"
-                :total="totalPage"
-                background
-                layout="total, sizes, prev, pager, next, jumper">
+          @size-change="sizeChangeHandle"
+          @current-change="currentChangeHandle"
+          :current-page="pageIndex"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="pageSize"
+          :total="totalPage"
+          background
+          layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>
      </div>
      <!-- 弹窗, 新增 / 修改 -->
@@ -52,81 +52,81 @@
 </template>

 <script>
-  import {fetchList, delObj} from '@/api/${pathName}'
-  import TableForm from './${pathName}-form'
-  import {mapGetters} from 'vuex'
-  export default {
-    data () {
-      return {
-        dataForm: {
-          key: ''
-        },
-        searchForm: {},
-        dataList: [],
-        pageIndex: 1,
-        pageSize: 10,
-        totalPage: 0,
-        dataListLoading: false,
-        addOrUpdateVisible: false
-      }
+import { fetchList, delObj } from '@/api/${pathName}'
+import TableForm from './${pathName}-form'
+import { mapGetters } from 'vuex'
+export default {
+  data() {
+    return {
+      dataForm: {
+        key: ''
+      },
+      searchForm: {},
+      dataList: [],
+      pageIndex: 1,
+      pageSize: 10,
+      totalPage: 0,
+      dataListLoading: false,
+      addOrUpdateVisible: false
+    }
+  },
+  components: {
+    TableForm
+  },
+  computed: {
+    ...mapGetters(['permissions'])
+  },
+  created() {
+    this.getDataList()
+  },
+  methods: {
+    // 获取数据列表
+    getDataList() {
+      this.dataListLoading = true
+      fetchList(Object.assign({
+        current: this.pageIndex,
+        size: this.pageSize
+      })).then(response => {
+        this.dataList = response.data.data.records
+        this.totalPage = response.data.data.total
+      })
+      this.dataListLoading = false
    },
-    components: {
-      TableForm
-    },
-    created () {
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val
+      this.pageIndex = 1
      this.getDataList()
    },
-    computed: {
-      ...mapGetters(['permissions'])
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val
+      this.getDataList()
    },
-    methods: {
-      // 获取数据列表
-      getDataList () {
-        this.dataListLoading = true
-        fetchList(Object.assign({
-          current: this.pageIndex,
-          size: this.pageSize
-        })).then(response => {
-          this.dataList = response.data.data.records
-          this.totalPage = response.data.data.total
-        })
-        this.dataListLoading = false
-      },
-      // 每页数
-      sizeChangeHandle (val) {
-        this.pageSize = val
-        this.pageIndex = 1
+    // 新增 / 修改
+    addOrUpdateHandle(id) {
+      this.addOrUpdateVisible = true
+      #[[this.$nextTick(() => {]]#
+        this.$refs.addOrUpdate.init(id)
+      })
+    },
+    // 删除
+    deleteHandle(id) {
+      this.$confirm('是否确认删除ID为' + id, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(function() {
+        return delObj(id)
+      }).then(data => {
+        this.$message.success('删除成功')
        this.getDataList()
-      },
-      // 当前页
-      currentChangeHandle (val) {
-        this.pageIndex = val
-        this.getDataList()
-      },
-      // 新增 / 修改
-      addOrUpdateHandle (id) {
-        this.addOrUpdateVisible = true
-        #[[this.$nextTick(() => {]]#
-          this.$refs.addOrUpdate.init(id)
-        })
-      },
-      // 删除
-      deleteHandle (id) {
-        this.$confirm('是否确认删除ID为' + id, '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(function () {
-          return delObj(id)
-        }).then(data => {
-          this.$message.success('删除成功')
-          this.getDataList()
-        })
-      },
-      //  导出excel
-      exportExcel() {
-        this.downBlobFile('/${moduleName}/${pathName}/export', this.searchForm,'${pathName}.xlsx')
-      }
+      })
+    },
+    //  导出excel
+    exportExcel() {
+      this.downBlobFile('/${moduleName}/${pathName}/export', this.searchForm, '${pathName}.xlsx')
    }
  }
+}
 </script>