a75d583c7602801e3682485e3bd8793a2cba75b2.svn-base 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. import JEditableTable from '@/components/jeecg/JEditableTable'
  2. import { VALIDATE_NO_PASSED, getRefPromise, validateFormAndTables } from '@/utils/JEditableTableUtil'
  3. import { httpAction, getAction } from '@/api/manage'
  4. export const JEditableTableMixin = {
  5. components: {
  6. JEditableTable
  7. },
  8. data() {
  9. return {
  10. title: '操作',
  11. visible: false,
  12. form: this.$form.createForm(this),
  13. confirmLoading: false,
  14. model: {},
  15. labelCol: {
  16. xs: { span: 24 },
  17. sm: { span: 6 }
  18. },
  19. wrapperCol: {
  20. xs: { span: 24 },
  21. sm: { span: 18 }
  22. }
  23. }
  24. },
  25. methods: {
  26. /** 获取所有的editableTable实例 */
  27. getAllTable() {
  28. if (!(this.refKeys instanceof Array)) {
  29. throw this.throwNotArray('refKeys')
  30. }
  31. let values = this.refKeys.map(key => getRefPromise(this, key))
  32. return Promise.all(values)
  33. },
  34. /** 遍历所有的JEditableTable实例 */
  35. eachAllTable(callback) {
  36. // 开始遍历
  37. this.getAllTable().then(tables => {
  38. tables.forEach((item, index) => {
  39. if (typeof callback === 'function') {
  40. callback(item, index)
  41. }
  42. })
  43. })
  44. },
  45. /** 当点击新增按钮时调用此方法 */
  46. add() {
  47. //update-begin-author:lvdandan date:20201113 for:LOWCOD-1049 JEditaTable,子表默认添加一条数据,addDefaultRowNum设置无效 #1930
  48. return new Promise((resolve) => {
  49. this.tableReset();
  50. resolve();
  51. }).then(() => {
  52. if (typeof this.addBefore === 'function') this.addBefore()
  53. // 默认新增空数据
  54. let rowNum = this.addDefaultRowNum
  55. if (typeof rowNum !== 'number') {
  56. rowNum = 1
  57. console.warn('由于你没有在 data 中定义 addDefaultRowNum 或 addDefaultRowNum 不是数字,所以默认添加一条空数据,如果不想默认添加空数据,请将定义 addDefaultRowNum 为 0')
  58. }
  59. this.eachAllTable((item) => {
  60. item.add(rowNum)
  61. })
  62. if (typeof this.addAfter === 'function') this.addAfter(this.model)
  63. this.edit({})
  64. })
  65. //update-end-author:lvdandan date:20201113 for:LOWCOD-1049 JEditaTable,子表默认添加一条数据,addDefaultRowNum设置无效 #1930
  66. },
  67. /** 当点击了编辑(修改)按钮时调用此方法 */
  68. edit(record) {
  69. if(record && '{}'!=JSON.stringify(record)){
  70. this.tableReset();
  71. }
  72. if (typeof this.editBefore === 'function') this.editBefore(record)
  73. this.visible = true
  74. this.activeKey = this.refKeys[0]
  75. this.form.resetFields()
  76. this.model = Object.assign({}, record)
  77. if (typeof this.editAfter === 'function') this.editAfter(this.model)
  78. },
  79. /** 关闭弹窗,并将所有JEditableTable实例回归到初始状态 */
  80. close() {
  81. this.visible = false
  82. this.$emit('close')
  83. },
  84. //清空子表table的数据
  85. tableReset(){
  86. this.eachAllTable((item) => {
  87. item.clearRow()
  88. })
  89. },
  90. /** 查询某个tab的数据 */
  91. requestSubTableData(url, params, tab, success) {
  92. tab.loading = true
  93. getAction(url, params).then(res => {
  94. let { result } = res
  95. let dataSource = []
  96. if (result) {
  97. if (Array.isArray(result)) {
  98. dataSource = result
  99. } else if (Array.isArray(result.records)) {
  100. dataSource = result.records
  101. }
  102. }
  103. tab.dataSource = dataSource
  104. typeof success === 'function' ? success(res) : ''
  105. }).finally(() => {
  106. tab.loading = false
  107. })
  108. },
  109. /** 发起请求,自动判断是执行新增还是修改操作 */
  110. request(formData) {
  111. let url = this.url.add, method = 'post'
  112. if (this.model.id) {
  113. url = this.url.edit
  114. //method = 'put'
  115. }
  116. this.confirmLoading = true
  117. httpAction(url, formData, method).then((res) => {
  118. if (res.success) {
  119. this.$message.success(res.message)
  120. this.$emit('ok')
  121. this.close()
  122. } else {
  123. this.$message.warning(res.message)
  124. }
  125. }).finally(() => {
  126. this.confirmLoading = false
  127. })
  128. },
  129. /* --- handle 事件 --- */
  130. /** ATab 选项卡切换事件 */
  131. handleChangeTabs(key) {
  132. // 自动重置scrollTop状态,防止出现白屏
  133. getRefPromise(this, key).then(editableTable => {
  134. editableTable.resetScrollTop()
  135. })
  136. },
  137. /** 关闭按钮点击事件 */
  138. handleCancel() {
  139. this.close()
  140. },
  141. /** 确定按钮点击事件 */
  142. handleOk() {
  143. /** 触发表单验证 */
  144. this.getAllTable().then(tables => {
  145. /** 一次性验证主表和所有的次表 */
  146. return validateFormAndTables(this.form, tables)
  147. }).then(allValues => {
  148. if (typeof this.classifyIntoFormData !== 'function') {
  149. throw this.throwNotFunction('classifyIntoFormData')
  150. }
  151. let formData = this.classifyIntoFormData(allValues)
  152. // 发起请求
  153. return this.request(formData)
  154. }).catch(e => {
  155. if (e.error === VALIDATE_NO_PASSED) {
  156. // 如果有未通过表单验证的子表,就自动跳转到它所在的tab
  157. this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
  158. } else {
  159. console.error(e)
  160. }
  161. })
  162. },
  163. /* --- throw --- */
  164. /** not a function */
  165. throwNotFunction(name) {
  166. return `${name} 未定义或不是一个函数`
  167. },
  168. /** not a array */
  169. throwNotArray(name) {
  170. return `${name} 未定义或不是一个数组`
  171. }
  172. }
  173. }