TabFormEditModalTest.vue 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <template>
  2. <TabFormEditModal
  3. v-model:open="openTabEditModal"
  4. :is-restore-data="tabEditViewIsRestoreData"
  5. :window-no="curdWindowNo"
  6. :tab-index="tabIndex"
  7. :type="tabEditViewType"
  8. :model-data-id="tabEditViewRecordId"
  9. width="100%"
  10. :current-page="tabEditViewCurrentPage"
  11. :current-index="tabEditViewCurrentIndex"
  12. :total-records="tabEditViewTotalRecords"
  13. :task-info-id="tabEditViewTaskInfoId"
  14. :workflow-type="tabEditViewWorkflowType"
  15. :mask-closable="false"
  16. @open-tab-form-view="openTabFormViewModal"
  17. />
  18. <TabFormViewModal
  19. v-model:open="openTabViewModal"
  20. :window-no="curdWindowNo"
  21. :tab-index="tabIndex"
  22. :type="tabFormViewType"
  23. :model-data-id="tabFormViewRecordId"
  24. width="100%"
  25. :current-page="tabFormViewCurrentPage"
  26. :current-index="tabFormViewCurrentIndex"
  27. :total-records="tabFormViewTotalRecords"
  28. :task-info-id="tabFormViewTaskInfoId"
  29. :workflow-type="tabFormViewWorkflowType"
  30. :mask-closable="false"
  31. @open-tab-edit-view="openTabEditView"
  32. />
  33. </template>
  34. <script setup>
  35. import { ref } from 'vue';
  36. import TabFormEditModal from '../../src/window1/tabFormEdit/TabFormEditModal.vue';
  37. import TabFormViewModal from '../../src/window1/tabFormView/TabFormViewModal.vue';
  38. const curdWindowNo = ref('20240910_193059');
  39. const tabIndex = ref(0);
  40. const openTabEditModal = ref(true);
  41. const tabEditViewType = ref('create');
  42. const tabEditViewRecordId = ref(null);
  43. const tabEditViewCurrentPage = ref(null);
  44. const tabEditViewCurrentIndex = ref(null);
  45. const tabEditViewTotalRecords = ref(null);
  46. const tabEditViewIsRestoreData = ref(false);
  47. const tabEditViewTaskInfoId = ref(null);
  48. const tabEditViewWorkflowType = ref(null);
  49. const openTabViewModal = ref(false);
  50. const tabFormViewType = ref('view');
  51. const tabFormViewRecordId = ref(null);
  52. const tabFormViewCurrentPage = ref(null);
  53. const tabFormViewCurrentIndex = ref(null);
  54. const tabFormViewTotalRecords = ref(null);
  55. const tabFormViewTaskInfoId = ref(null);
  56. const tabFormViewWorkflowType = ref(null);
  57. /**
  58. * 打开页签视图模式
  59. * @param param 信息
  60. * 属性1: type: 类型,
  61. * 属性1: windowNo: CURD窗口编号,
  62. * 属性2: tabIndex: CURD页签编号,
  63. * 属性3: modelDataId: 数据记录id,
  64. * 属性4: currentPage: 当前记录所在的页码,
  65. * 属性5: currentIndex: 当前记录的排序,
  66. * 属性6: totalRecords: 记录的总数量,
  67. * 属性7: uuid: 窗口唯一Id,
  68. */
  69. const openTabFormViewModal = function(param){
  70. console.log('openTabFormViewModal', param);
  71. tabFormViewType.value = param.type;
  72. curdWindowNo.value = param.windowNo;
  73. tabIndex.value = param.tabIndex;
  74. tabFormViewRecordId.value = param.modelDataId;
  75. tabFormViewCurrentPage.value = param.currentPage;
  76. tabFormViewCurrentIndex.value = param.currentIndex;
  77. tabFormViewTotalRecords.value = param.totalRecords;
  78. openTabEditModal.value = false;
  79. openTabViewModal.value = true;
  80. };
  81. /**
  82. * 打开页签编辑模式
  83. * @param param 信息
  84. * 属性1: type: 类型,
  85. * 属性1: windowNo: CURD窗口编号,
  86. * 属性2: tabIndex: CURD页签编号,
  87. * 属性3: modelDataId: 数据记录id,
  88. * 属性4: currentPage: 当前记录所在的页码,
  89. * 属性5: currentIndex: 当前记录的排序,
  90. * 属性6: totalRecords: 记录的总数量,
  91. * 属性7: uuid: 窗口唯一Id,
  92. */
  93. const openTabEditView = function(param){
  94. tabEditViewType.value = param.type;
  95. curdWindowNo.value = param.windowNo;
  96. tabIndex.value = param.tabIndex;
  97. tabEditViewRecordId.value = param.modelDataId;
  98. tabEditViewCurrentPage.value = param.currentPage;
  99. tabEditViewCurrentIndex.value = param.currentIndex;
  100. tabEditViewTotalRecords.value = param.totalRecords;
  101. tabEditViewIsRestoreData.value = param.isRestoreData;
  102. openTabViewModal.value = false;
  103. openTabEditModal.value = true;
  104. };
  105. </script>