index.vue 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. <!--
  2. - Copyright (c) 2018-2025, lengleng All rights reserved.
  3. -
  4. - Redistribution and use in source and binary forms, with or without
  5. - modification, are permitted provided that the following conditions are met:
  6. -
  7. - Redistributions of source code must retain the above copyright notice,
  8. - this list of conditions and the following disclaimer.
  9. - Redistributions in binary form must reproduce the above copyright
  10. - notice, this list of conditions and the following disclaimer in the
  11. - documentation and/or other materials provided with the distribution.
  12. - Neither the name of the pig4cloud.com developer nor the names of its
  13. - contributors may be used to endorse or promote products derived from
  14. - this software without specific prior written permission.
  15. - Author: lengleng (wangiegie@gmail.com)
  16. -->
  17. <template>
  18. <div class="execution">
  19. <basic-container>
  20. <avue-crud
  21. ref="crud"
  22. :page="page"
  23. :data="tableData"
  24. :table-loading="tableLoading"
  25. :option="tableOption"
  26. :permission="permissionList"
  27. @on-load="getList"
  28. @refresh-change="refreshChange"
  29. @search-change="searchChange"
  30. @size-change="sizeChange"
  31. @current-change="currentChange"
  32. @row-update="handleUpdate"
  33. @row-save="handleSave"
  34. @row-del="rowDel"/>
  35. </basic-container>
  36. </div>
  37. </template>
  38. <script>
  39. import {addObj, delObj, fetchList, putObj} from '@/api/admin/sys-social-details'
  40. import {tableOption} from '@/const/crud/admin/sys-social-details'
  41. import {mapGetters} from 'vuex'
  42. export default {
  43. name: 'SysSocialDetails',
  44. data() {
  45. return {
  46. searchForm: {},
  47. tableData: [],
  48. page: {
  49. total: 0, // 总页数
  50. currentPage: 1, // 当前页数
  51. pageSize: 20 // 每页显示多少条
  52. },
  53. tableLoading: false,
  54. tableOption: tableOption
  55. }
  56. },
  57. created() {
  58. },
  59. mounted: function () {
  60. },
  61. computed: {
  62. ...mapGetters(['permissions']),
  63. permissionList() {
  64. return {
  65. addBtn: this.vaildData(this.permissions.sys_social_details_add, false),
  66. delBtn: this.vaildData(this.permissions.sys_social_details_del, false),
  67. editBtn: this.vaildData(this.permissions.sys_social_details_edit, false)
  68. }
  69. }
  70. },
  71. methods: {
  72. getList(page, params) {
  73. this.tableLoading = true
  74. fetchList(Object.assign({
  75. current: page.currentPage,
  76. size: page.pageSize
  77. }, params, this.searchForm)).then(response => {
  78. this.tableData = response.data.data.records
  79. this.page.total = response.data.data.total
  80. this.tableLoading = false
  81. })
  82. },
  83. rowDel: function (row, index) {
  84. var _this = this
  85. this.$confirm('是否确认删除ID为' + row.id, '提示', {
  86. confirmButtonText: '确定',
  87. cancelButtonText: '取消',
  88. type: 'warning'
  89. }).then(function () {
  90. return delObj(row.id)
  91. }).then(() => {
  92. _this.$message.success('删除成功')
  93. this.refreshChange()
  94. }).catch(function () {
  95. })
  96. },
  97. handleUpdate: function (row, index, done) {
  98. putObj(row).then(() => {
  99. this.$message.success('修改成功')
  100. this.refreshChange()
  101. done()
  102. })
  103. },
  104. handleSave: function (row, done) {
  105. addObj(row).then(() => {
  106. this.tableData.push(Object.assign({}, row))
  107. this.$message.success('添加成功')
  108. this.refreshChange()
  109. done()
  110. })
  111. },
  112. refreshChange() {
  113. this.getList(this.page)
  114. },
  115. searchChange(form, done) {
  116. this.searchForm = form
  117. this.page.currentPage = 1
  118. this.getList(this.page, form)
  119. done()
  120. },
  121. sizeChange(pageSize) {
  122. this.page.pageSize = pageSize
  123. },
  124. currentChange(current) {
  125. this.page.currentPage = current
  126. }
  127. }
  128. }
  129. </script>