erp/template/erp/goodimglibrary.html

{Template header}
<style>
 /* 锁定背景页面滚动，防止弹窗出现时背景页还能滚动 */
body.lock-scroll {
  overflow: hidden;
}

/* 设置对话框背景遮罩 */
dialog::backdrop {
  background: rgba(0, 0, 0, 0.8);
}

/* 确保放大后的图片不会超出视口 */
#dialog-img {
  max-width: 90vw;
  max-height: 90vh;
  display: block;
}

/* 关闭按钮样式 */
#close-btn {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 24px;
  background: none;
  border: none;
  color: white;
  cursor: pointer;
}


  
</style>
<body>
<div class="warp">
<div class="fixed">
<ul class="search">
<li>类目：<select name="category" class="select">
<option value="">请选择</option>{loop typeclass(16) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>等级：<select name="grade" class="select">
<option value="">请选择</option>{loop typeclass(13) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>颜色：<select name="color" class="select">
<option value="">请选择</option>{loop typeclassyc(8) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>曲度：<select name="lowe" class="select">
<option value="">请选择</option>{loop typeclassyc(15) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>头套种类：<select name="lacetype" class="select">
<option value="">请选择</option><option value="146">13*4 Lace Front wigs</option>
{loop typeclassyc(18) as $val}
{if $val['id']!=146}
<option value="-{$val['id']}-">{$val['title']}</option>
{/if}
{/loop}
</select></li>
<li>蕾丝颜色：<select name="lacecolor" class="select">
<option value="">请选择</option>{loop typeclassyc(9) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>长度：<select name="size" class="select">
<option value="">请选择</option>{loop typeclass(14) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>密度：<select name="density" class="select">
<option value="">请选择</option>{loop typeclassyc(10) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>头套大小：<select name="haircap" class="select">
<option value="">请选择</option>{loop typeclassyc(6) as $val}
<option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select></li>
<li>人发头套编号：<select name="hairnumber" class="select">
    <option value="">请选择</option>
    <option value="-1">无编号</option>
    {loop typeclassyc(43) as $val}
    
    <option value="-{$val['id']}-">{$val['title']}</option>
    {/loop}
    </select>
</li>
<li>SKU：<input value="" name="sku" type="text" style="width:350px"></li>
<li>商品名称：<input value="" name="title" type="text" style="width:350px"></li>
<li>仓库品名：<input value="" name="zh" type="text" style="width:350px"></li>
<li><span>确 定</span></li>

</ul>
<div class="control">
  <a href="javascript:void(0);" class="window" data-h="/goodimglibrary/get_info_number/" data-t="通过【订单编号】添加图片/视频">通过【订单编号】添加图片/视频</a>
</div>
<table class="datatitle data" border="0" style="border-collapse:collapse;">
<tr>
<td><label onClick="swapCheck()"><input name="checkbox" type="checkbox" class="regular-checkbox"></label></td>
<td>SKU</td>
<td>商品名称</td>
<td>仓库品名</td>
<td>更新时间</td>
<td>图片|视频</td>
</tr>
</table>
</div>
<table class="datatext data" border="0" style="border-collapse:collapse;">
</table>
<div class="bomf"></div>
</div>
<!-- 对话框元素，默认是隐藏的 -->
<dialog id="image-dialog" role="dialog" aria-modal="true">
<img id="dialog-img" src="" alt="">
<button id="close-btn">×</button>
</dialog>
    
<script>
var dataurl = "/goodimglibrary";
var editurl = "/goodimglibrary/edit/";
var editdj = 1;
var editt = " 货品图片 - 编辑";

var customon = 1;
function custom(){
$(".data tr").each(function() {
$(this).find('td:eq(0)').css("width","1%");
$(this).find('td:eq(1)').css("width","13%");
$(this).find('td:eq(2)').css("width","13%");
$(this).find('td:eq(3)').css("width","13%");
$(this).find('td:eq(4)').css("width","9%");
$(this).find('td:eq(5)').css("width","50%");


});}

const dialog = document.getElementById('image-dialog');
const dialogImg = document.getElementById('dialog-img');
const closeBtn = document.getElementById('close-btn');

// 点击图片，打开对话框
// img.addEventListener('click', () => {
//   console.log(img)
//   dialogImg.src = img.data('ulr'); // 将缩略图的src赋给对话框中的图片
//   dialog.showModal();      // 显示对话框
// });
function showBigImg(that) {
    dialogImg.src = $(that).attr('src'); // 将缩略图的src赋给对话框中的图片
    dialog.showModal();      // 显示对话框
}


// 点击关闭按钮，关闭对话框
closeBtn.addEventListener('click', () => {
  dialog.close();
});

// 点击对话框的遮罩层（非图片区域），也可以关闭
dialog.addEventListener('click', (e) => {
  if (e.target === dialog) {
    dialog.close();
  }
});

// 监听对话框的打开和关闭事件，用于锁定和恢复背景页滚动
dialog.addEventListener('show', () => {
  document.body.classList.add('lock-scroll');
});
dialog.addEventListener('close', () => {
  document.body.classList.remove('lock-scroll');
});
</script>
{Template footer}