富茂A端打印模板内嵌编辑器
Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 

120 wiersze
3.1 KiB

  1. <template>
  2. <kr-print-designer ref="printDesigner" :temp-value="value" :widget-options="widgets" @save="handleSave" />
  3. </template>
  4. <script>
  5. // import { OutStockOptions, InStockOptions } from '../data/options'
  6. const baseUrl = process.env.VUE_APP_BASE_API;
  7. export default {
  8. data() {
  9. return {
  10. tenantId: '',
  11. templateId: '',
  12. // printData: [],
  13. value: {
  14. title: 'demo',
  15. width: 750,
  16. height: 550,
  17. pageWidth: 750,
  18. pageHeight: 550,
  19. tempItems: [],
  20. },
  21. widgets: [],
  22. }
  23. },
  24. methods: {
  25. handleSave(data) {
  26. const obj = {
  27. contentJsonUpdate: {
  28. id: data.id,
  29. type: data.type,
  30. title: data.title,
  31. width: data.width,
  32. height: data.height,
  33. pageWidth: data.pageWidth,
  34. pageHeight: data.pageHeight,
  35. tempItems: data.tempItems,
  36. },
  37. id: data.id,
  38. tenantId: this.tenantId,
  39. title: data.title,
  40. }
  41. console.log(obj, 'handleSave')
  42. this.addNewModel(obj)
  43. },
  44. // 手动初始话模板数据
  45. initTemp() {
  46. this.$refs.printDesigner.initTemp(this.value, this.widgets)
  47. },
  48. addNewModel(data) {
  49. this.$axios.post(baseUrl + "/print/updateTemplates", data)
  50. .then(res => {
  51. console.log(res, 'res')
  52. if (res.data.code == 200) {
  53. this.$message.success("保存成功!")
  54. // this.$router.back()
  55. } else {
  56. this.$message.error("保存失败!")
  57. }
  58. })
  59. .catch(err => {
  60. console.error(err);
  61. this.$message.error("保存失败!")
  62. });
  63. },
  64. getWidgets(type) {
  65. const url = baseUrl + `/print/printDatas?type=${type}`
  66. this.$axios.get(url)
  67. .then(res => {
  68. console.log(res, 'res')
  69. const arr = []
  70. res.data.data.forEach(item => {
  71. delete item.printComponents.defaultValue
  72. arr.push(item.printComponents)
  73. });
  74. this.widgets = arr
  75. console.log(this.widgets, 'this.widgets ')
  76. //传入值变化后,需要手动初始化模板数据,否则不会同步
  77. this.initTemp()
  78. })
  79. .catch(err => {
  80. console.error(err);
  81. });
  82. },
  83. getPrintData(tenantId, templateId) {
  84. const url = baseUrl + `/print/getTemplate?tenantId=${tenantId}&templateId=${templateId}`
  85. this.$axios.get(url)
  86. .then(res => {
  87. console.log(res, 'res')
  88. this.value = res.data.data.contentJson
  89. if (!this.value.tempItems || !this.value.tempItems.length) {
  90. this.value.tempItems = []
  91. }
  92. this.getWidgets(this.value.type)
  93. })
  94. .catch(err => {
  95. console.error(err);
  96. });
  97. },
  98. },
  99. created() {
  100. // this.printData = this.$route.query.printData
  101. this.tenantId = this.$route.query.tenantId
  102. this.templateId = this.$route.query.templateId
  103. try {
  104. // this.value = this.printData
  105. // this.getWidgets(this.value.type)
  106. this.getPrintData(this.tenantId, this.templateId)
  107. } catch (err) {
  108. console.error(err)
  109. }
  110. },
  111. }
  112. </script>