details_dialog_shell.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <!DOCTYPE html>
  2. <html class="procuremen-details-dialog">
  3. <head>
  4. {include file="common/meta" /}
  5. <title>详情</title>
  6. </head>
  7. <body class="inside-header inside-aside is-dialog procuremen-details-dialog">
  8. {include file="procuremen/details_fragment" /}
  9. <script>
  10. require(['jquery'], function ($) {
  11. function measureDetailsContentHeight() {
  12. var $wrap = $('.procuremen-details-wrap');
  13. if (!$wrap.length) {
  14. return Math.ceil(document.body.scrollHeight || 0);
  15. }
  16. var wrapH = Math.ceil($wrap.outerHeight(true) || 0);
  17. var scrollH = Math.ceil(document.body.scrollHeight || 0);
  18. return Math.max(wrapH, scrollH);
  19. }
  20. function applyDetailsLayerLayout() {
  21. try {
  22. var index = parent.Layer.getFrameIndex(window.name);
  23. if (!index) {
  24. return;
  25. }
  26. var $parentWin = parent.$(parent.window);
  27. var $layer = parent.$('#layui-layer' + index);
  28. if (!$layer.length) {
  29. return;
  30. }
  31. var viewH = $parentWin.height();
  32. var titleH = $layer.find('.layui-layer-title').outerHeight() || 42;
  33. var btnH = $layer.find('.layui-layer-btn').outerHeight() || 0;
  34. var contentH = measureDetailsContentHeight();
  35. if (contentH < 120) {
  36. return;
  37. }
  38. var isMax = $layer.hasClass('layui-layer-max');
  39. var edge = isMax ? 8 : 24;
  40. var availableH = Math.max(320, viewH - titleH - btnH - edge);
  41. var iframeH = Math.min(contentH + 12, availableH);
  42. var layerH = titleH + btnH + iframeH;
  43. var top = isMax ? 0 : Math.max(0, Math.floor((viewH - layerH) / 2));
  44. parent.Layer.style(index, {
  45. height: layerH,
  46. top: top
  47. });
  48. var $content = $layer.find('.layui-layer-content');
  49. $content.css({
  50. height: iframeH + 'px',
  51. overflow: 'hidden',
  52. padding: 0,
  53. margin: 0
  54. });
  55. $layer.find('iframe').css({
  56. height: iframeH + 'px',
  57. width: '100%',
  58. display: 'block',
  59. border: 0
  60. });
  61. var needScroll = contentH + 12 > iframeH;
  62. $('html, body').css({
  63. height: needScroll ? iframeH + 'px' : 'auto',
  64. minHeight: '0',
  65. maxHeight: needScroll ? iframeH + 'px' : 'none',
  66. overflowX: 'hidden',
  67. overflowY: needScroll ? 'auto' : 'visible',
  68. WebkitOverflowScrolling: 'touch',
  69. background: '#fff'
  70. });
  71. } catch (e) {
  72. }
  73. }
  74. function scheduleDetailsLayerLayout() {
  75. applyDetailsLayerLayout();
  76. setTimeout(applyDetailsLayerLayout, 80);
  77. setTimeout(applyDetailsLayerLayout, 220);
  78. setTimeout(applyDetailsLayerLayout, 480);
  79. }
  80. function bindLayerResize() {
  81. try {
  82. var index = parent.Layer.getFrameIndex(window.name);
  83. if (!index) {
  84. return;
  85. }
  86. var $layer = parent.$('#layui-layer' + index);
  87. $layer.find('.layui-layer-maxmin').off('click.procuremenDetails').on('click.procuremenDetails', function () {
  88. scheduleDetailsLayerLayout();
  89. });
  90. } catch (e) {
  91. }
  92. }
  93. $(function () {
  94. scheduleDetailsLayerLayout();
  95. bindLayerResize();
  96. $(window).off('resize.procuremenDetails').on('resize.procuremenDetails', function () {
  97. scheduleDetailsLayerLayout();
  98. });
  99. if (typeof window.ResizeObserver !== 'undefined') {
  100. var $wrap = $('.procuremen-details-wrap');
  101. if ($wrap.length) {
  102. var ro = new ResizeObserver(function () {
  103. scheduleDetailsLayerLayout();
  104. });
  105. ro.observe($wrap[0]);
  106. }
  107. }
  108. });
  109. });
  110. </script>
  111. </body>
  112. </html>