diff --git a/view/templates/admin/formula_list.html b/view/templates/admin/formula_list.html index ca5ecb2..f072a48 100644 --- a/view/templates/admin/formula_list.html +++ b/view/templates/admin/formula_list.html @@ -96,7 +96,7 @@
{foreach from=$item.formula item=value} - {$value.name}{if $value.desc}({$value.desc}){/if} {$value.num_str} + {$value.name}{if $value.desc}({$value.desc}){/if} {$value.num_str} {/foreach}

{$item.method}

@@ -236,23 +236,44 @@ }); } + function adjustFlexWidth(container) { + const items = container.querySelectorAll('.item'); + let maxWidth = 0; + + // 获取每个容器内子项的最大宽度 + items.forEach(item => { + const itemWidth = item.offsetWidth; + if (itemWidth > maxWidth) { + maxWidth = itemWidth; + } + }); + + // 设置所有子项宽度为最大内容宽度 + items.forEach(item => { + item.style.flexBasis = maxWidth + 'px'; + }); + } + window.onload = function() { - const formulaitems = document.querySelectorAll('.formula-item'); - formulaitems.forEach(container => { + const containers = document.querySelectorAll('.formula-item'); + + containers.forEach(container => { + const initialWidth = container.offsetWidth; + + // 初始判断是否已换行 const items = container.querySelectorAll('.item'); - let maxWidth = 0; + const totalItemsWidth = Array.from(items).reduce((acc, item) => acc + item.offsetWidth, 0); - // 获取每个 container 内部子项的最大宽度 - items.forEach(item => { - const itemWidth = item.offsetWidth; - if (itemWidth > maxWidth) { - maxWidth = itemWidth; - } - }); + if (totalItemsWidth > initialWidth) { + adjustFlexWidth(container); // 换行时计算最大宽度 + } - // 设置所有子项宽度为最大内容宽度 - items.forEach(item => { - item.style.flexBasis = maxWidth + 'px'; + // 监听窗口大小变化,动态调整 + window.addEventListener('resize', () => { + const newWidth = container.offsetWidth; + if (totalItemsWidth > newWidth) { + adjustFlexWidth(container); // 换行时更新 + } }); }); };