富茂A端打印模板内嵌编辑器
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

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