ZBLOG

else if ('0BJECTS' == init.type) { if (!document.getElementById('outerBox')) { const outerBox = document.createElement('div'); outerBox.id = 'outerBox'; Object.assign(outerBox.style, { border: '2px solid #00...

为了将 outerBox 加入到 self.setBody 中,而不影响已有的 vlParent,你可以将 outerBox 作为一个新的元素添加到 self 的 body 内部。首先,需要确保你的 self 允许同时包含多个子元素。如果是这样,可以像下面这样修改代码:

  1. 创建一个容器:在 self.setBody() 中创建一个新容器,用于包含 vlParentouterBox
  2. 添加这两个容器:将 vlParent 和刚创建的容器分别添加到这个新容器中。

以下是修改后的代码示例:

  1. else if ('0BJECTS' == init.type) {
  2. if (!document.getElementById('outerBox')) {
  3. const outerBox = document.createElement('div');
  4. outerBox.id = 'outerBox';
  5. Object.assign(outerBox.style, {
  6. border: '2px solid #000',
  7. padding: '19px',
  8. borderRadius: '5px',
  9. width: '300px'
  10. });
  11. const tabsContainer = document.createElement('div');
  12. Object.assign(tabsContainer.style, {
  13. display: 'flex',
  14. marginBottom: '19px'
  15. });
  16. const tabs = [
  17. { name: '逾期', content: '逾期内容' },
  18. { name: '未逾期', content: '未逾期内容' }
  19. ];
  20. const contentContainer = document.createElement('div');
  21. Object.assign(contentContainer.style, {
  22. border: '1px solid #000',
  23. padding: '19px'
  24. });
  25. const switchTab = (tab, content) => {
  26. tabsContainer.querySelectorAll('.tab').forEach(t => t.classList.remove('active-tab'));
  27. tab.classList.add('active-tab');
  28. contentContainer.textContent = content;
  29. };
  30. tabs.forEach(({ name, content }) => {
  31. const tab = document.createElement('div');
  32. tab.textContent = name;
  33. tab.classList.add('tab');
  34. tab.addEventListener('click', () => switchTab(tab, content));
  35. tabsContainer.appendChild(tab);
  36. });
  37. switchTab(tabsContainer.querySelector('.tab'), tabs[0].content);
  38. outerBox.appendChild(tabsContainer);
  39. outerBox.appendChild(contentContainer);
  40. document.body.appendChild(outerBox);
  41. const style = document.createElement('style');
  42. style.innerHTML = `
  43. .tab {
  44. padding: 10px;
  45. cursor: pointer;
  46. border: 1px solid #000;
  47. margin-right: 5px;
  48. color: #000;
  49. background-color: #fff;
  50. }
  51. .active-tab {
  52. background-color: #000;
  53. color: #fff;
  54. }
  55. `;
  56. document.head.appendChild(style);
  57. }
  58. let self = new Fieldset(init.useLang ? lang(init.title) : init.title);
  59. let me = this;
  60. // 创建一个新的外部容器
  61. let combinedLayout = new VLayout().setVerticalAlign('top');
  62. // 添加 vlParent 到 combinedLayout
  63. var vlParent = new VLayout().setVerticalAlign('top');
  64. self.setBody(combinedLayout); // 将 combinedLayout 设置为 self 的主体
  65. if (window.isOuterOperator != null && window.isOuterOperator != undefined && window.isOuterOperator == true) {
  66. if (init.code === 'loan') {
  67. if (canl("data clearance:customerinfo:overdue info")) {
  68. config.layout.addMember(self);
  69. } else {
  70. config.layout.addMember(self);
  71. }
  72. }
  73. }
  74. for (var i = 0, N = init.child.length; i < N; i++) {
  75. var initObject = init.child[i];
  76. var vl = this.initlayout(initObject.child, initObject.path, editable);
  77. vl.setCSSProperty("paddingBottom", "5px");
  78. if (N > 0 && i >= 1) {
  79. vl.setCSSProperty("borderTop", "2px solid #E3E3E3");
  80. vl.setCSSProperty("paddingTop", "10px");
  81. }
  82. if (initObject.type === 'OBJECTS_OUT_COLLECTION') {
  83. me.customerOutCollection.layout.addMember(vl);
  84. me.customerOutCollection.count++;
  85. } else {
  86. vlParent.addMember(vl);
  87. }
  88. }
  89. // 将 vlParent 和 outerBox 添加到 combinedLayout
  90. combinedLayout.addMember(vlParent);
  91. combinedLayout.addMember(document.getElementById('outerBox')); // 确保此 ID 存在以便添加
  92. }

修改说明:

  • 创建了一个新的布局(combinedLayout),并将其设置为 self.setBody() 的主体。
  • 分别将原来的 vlParent 和新的外部盒子(通过 ID 获取)加入到了这个新的布局中。

这样,您就能够实现将两个部分同时放入布局而不会相互干扰。


内容由零声教学AI助手提供,问题来源于学员提问

本站部分文章来源于网络,版权归原作者所有,如有侵权请联系站长删除。
转载请注明出处:https://golang.0voice.com/?id=22378

分享:
扫描分享到社交APP
上一篇
下一篇
发表列表
游客 游客
此处应有掌声~
评论列表

还没有评论,快来说点什么吧~

联系我们

在线咨询: 点击这里给我发消息

微信号:3007537140

上班时间: 10:30-22:30

关注我们
x

注册

已经有帐号?