提示框优化 #14

Merged
pengda merged 1 commits from wpd_alert2 into master 7 months ago
  1. 29
      view/templates/admin/formula_list.html

29
view/templates/admin/formula_list.html

@ -94,7 +94,7 @@
<td>{$item.name}</td> <td>{$item.name}</td>
<td>{$item.source}</td> <td>{$item.source}</td>
<td> <td>
<div style="display: flex;flex-wrap: wrap;border-bottom: 1px dashed #ccc;padding-bottom: 10px"> <div class="formula-item" style="display: flex;flex-wrap: wrap;border-bottom: 1px dashed #ccc;padding-bottom: 10px">
{foreach from=$item.formula item=value} {foreach from=$item.formula item=value}
<span class="item" style="flex-basis: auto;white-space: nowrap;padding-left:20px">{$value.name}{if $value.desc}({$value.desc}){/if} {$value.num_str}</span> <span class="item" style="flex-basis: auto;white-space: nowrap;padding-left:20px">{$value.name}{if $value.desc}({$value.desc}){/if} {$value.num_str}</span>
{/foreach} {/foreach}
@ -237,20 +237,23 @@
} }
window.onload = function() { window.onload = function() {
const items = document.querySelectorAll('.item'); const formulaitems = document.querySelectorAll('.formula-item');
let maxWidth = 0; formulaitems.forEach(container => {
const items = container.querySelectorAll('.item');
let maxWidth = 0;
// 获取每个子项的宽度,并计算最大宽度 // 获取每个 container 内部子项的最大宽度
items.forEach(item => { items.forEach(item => {
const itemWidth = item.offsetWidth; const itemWidth = item.offsetWidth;
if (itemWidth > maxWidth) { if (itemWidth > maxWidth) {
maxWidth = itemWidth; maxWidth = itemWidth;
} }
}); });
// 设置所有子项的宽度为最大内容宽度 // 设置所有子项宽度为最大内容宽度
items.forEach(item => { items.forEach(item => {
item.style.flexBasis = maxWidth + 'px'; item.style.flexBasis = maxWidth + 'px';
});
}); });
}; };
</script> </script>

Loading…
Cancel
Save