BaseCurdEditor.js 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. import BaseCurd from './BaseCurd'
  2. const operatorTypes = [{
  3. id: 1,
  4. name: '新增',
  5. method: 'POST'
  6. }, {
  7. id: 2,
  8. name: '修改',
  9. method: 'PUT'
  10. }, {
  11. id: 3,
  12. name: '查看'
  13. }]
  14. export default (Target) => ({
  15. name: 'BaseCurdEditor',
  16. extends: BaseCurd(Target),
  17. data: () => ({
  18. visible: false,
  19. data: null,
  20. oData: null,
  21. operatorTypeId: 1,
  22. refFormName: 'form',
  23. activeCollapseName: '1'
  24. }),
  25. computed: {
  26. operatorType () {
  27. return operatorTypes[this.operatorTypeId - 1]
  28. }
  29. },
  30. methods: {
  31. onOpen (data) {
  32. return Promise.resolve()
  33. },
  34. onGetDetail () {
  35. return Promise.resolve()
  36. },
  37. afterGetDetail (model) {},
  38. beforeSave () {
  39. return Promise.resolve()
  40. },
  41. onSave () {},
  42. open (data, isView) {
  43. this.onOpen(data).then(() => {
  44. if (data) {
  45. this.operatorTypeId = isView ? operatorTypes[2].id : operatorTypes[1].id
  46. this.oData = data
  47. this.getDetail(data)
  48. } else {
  49. this.operatorTypeId = operatorTypes[0].id
  50. this.model = this.initModel()
  51. this.clearFormValid()
  52. }
  53. this.visible = true
  54. })
  55. },
  56. initModel () {
  57. this.data = new Target(this)
  58. },
  59. getDetail (data) {
  60. this.onGetDetail().then(() => {
  61. this.$$request(this.$$api.getDetail, data, Target).then(data => {
  62. data = data || {}
  63. this.data = data
  64. this.clearFormValid()
  65. this.afterGetDetail(data)
  66. }).catch(console.error).finally(() => {})
  67. })
  68. },
  69. clearFormValid () {
  70. this.$nextTick(() => {
  71. let formEl = this.getForm()
  72. formEl && formEl.resetFields()
  73. })
  74. },
  75. save () {
  76. const formEl = this.getForm()
  77. formEl && formEl.validate(flag => {
  78. if (!flag) {
  79. return
  80. }
  81. this.beforeSave().then(() => {
  82. this.$$request(Target.$$api.save, this.data, this.operatorType.method, Target).then((data) => {
  83. if (data) {
  84. this.$notify({
  85. title: '成功',
  86. message: '保存成功',
  87. type: 'success',
  88. position: 'bottom-right'
  89. })
  90. this.onSave()
  91. this.$emit('saved', this.data)
  92. this.close()
  93. }
  94. }).catch(console.error).finally(() => {})
  95. })
  96. })
  97. },
  98. onSaveBtnClick () {
  99. this.save()
  100. },
  101. onCloseBtnClick () {
  102. this.close()
  103. },
  104. close () {
  105. this.visible = false
  106. this.$emit('close')
  107. },
  108. getForm () {
  109. return this.$refs[this.refFormName]
  110. }
  111. }
  112. })