|
|
@@ -0,0 +1,311 @@
|
|
|
+{Template header}
|
|
|
+<style>
|
|
|
+ /* 整个表格容器 — 自适应滚动 + 适度居中 */
|
|
|
+ .table-wrapper {
|
|
|
+ max-width: 1280px;
|
|
|
+ margin: 0 auto;
|
|
|
+ background: #ffffff;
|
|
|
+ border-radius: 0px; /* 彻底直角,更素净,也可稍圆角1px?保留直边更简约 */
|
|
|
+ overflow-x: auto;
|
|
|
+ box-shadow: none; /* 无阴影,绝对不花哨 */
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 简约表格核心样式:细边框 + 清晰可读 */
|
|
|
+ .simple-table {
|
|
|
+ width: 100%;
|
|
|
+ border-collapse: collapse;
|
|
|
+ font-size: 0.9rem;
|
|
|
+ line-height: 1.5;
|
|
|
+ background-color: #fff;
|
|
|
+ table-layout: auto; /* 让列宽根据内容自动适应,保持自然 */
|
|
|
+ min-width: 560px; /* 保证宽屏舒适,但允许滚动 */
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 所有单元格共用边框与内边距 */
|
|
|
+ .simple-table th,
|
|
|
+ .simple-table td {
|
|
|
+ border: 1px solid #e2e6e9; /* 极浅灰边框,干净不突兀 */
|
|
|
+ padding: 12px 12px;
|
|
|
+ vertical-align: middle;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 表头样式:浅灰底 + 半粗体 + 适中字号 */
|
|
|
+ .simple-table th {
|
|
|
+ background-color: #f2f4f7;
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 0.85rem;
|
|
|
+ letter-spacing: 0.3px;
|
|
|
+ color: #1f3a4b;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 表格行数据:默认纯白底,不额外加花纹,保持极简 */
|
|
|
+ .simple-table td {
|
|
|
+ background-color: #ffffff;
|
|
|
+ color: #1f2f3a;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 轻微行区分:提升可读性但依然克制(不花哨,仅轻微底色交替) */
|
|
|
+ .simple-table tbody tr:nth-child(even) td {
|
|
|
+ background-color: #fafbfc;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 可选轻量悬浮效果:增加操作反馈但不张扬(符合简约但现代交互) */
|
|
|
+ .simple-table tbody tr:hover td {
|
|
|
+ background-color: #f5f7fa;
|
|
|
+ transition: background 0.15s ease;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* ---------- 输入框样式:干净,适应单元格 ---------- */
|
|
|
+ .simple-table input {
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font-family: inherit;
|
|
|
+ font-size: 0.85rem;
|
|
|
+ padding: 8px 10px;
|
|
|
+ border: 1px solid #cfdde6;
|
|
|
+ border-radius: 4px; /* 轻微圆角,不过于锐利,但算不上花哨,符合基础UI */
|
|
|
+ background-color: #ffffff;
|
|
|
+ transition: border 0.1s ease, background 0.1s;
|
|
|
+ line-height: 1.4;
|
|
|
+ margin: 0;
|
|
|
+ color: #0e2a38;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 数字输入框统一对齐(保留原生控件,但视觉一致) */
|
|
|
+ .simple-table input[type="number"] {
|
|
|
+ -moz-appearance: textfield;
|
|
|
+ }
|
|
|
+ .simple-table input[type="number"]::-webkit-inner-spin-button,
|
|
|
+ .simple-table input[type="number"]::-webkit-outer-spin-button {
|
|
|
+ opacity: 0.5;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 聚焦效果:维持简洁,只改变边框颜色,无外发光 */
|
|
|
+ .simple-table input:focus {
|
|
|
+ outline: none;
|
|
|
+ border-color: #7b8c9e;
|
|
|
+ background-color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* placeholder 字体颜色柔和 */
|
|
|
+ .simple-table input::placeholder {
|
|
|
+ color: #b0bec5;
|
|
|
+ font-weight: normal;
|
|
|
+ font-size: 0.8rem;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 为了单元格内文本与input对齐协调,文本列自然 */
|
|
|
+ .simple-table td span.text-muted {
|
|
|
+ font-weight: normal;
|
|
|
+ color: #2c4b5e;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 注脚小提示(可选,不干扰表格主体) */
|
|
|
+ .table-note {
|
|
|
+ max-width: 1280px;
|
|
|
+ margin: 1rem auto 0 auto;
|
|
|
+ padding: 0.6rem 0.8rem;
|
|
|
+ font-size: 0.75rem;
|
|
|
+ color: #6c7e8f;
|
|
|
+ background-color: transparent;
|
|
|
+ border-top: none;
|
|
|
+ text-align: left;
|
|
|
+ letter-spacing: 0.2px;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<link href="{$theme}js/select2/select2.min.css?v={time()}" rel="stylesheet" />
|
|
|
+<script src="{$theme}js/select2/select2.full.min.js?v={time()}"></script>
|
|
|
+<body>
|
|
|
+<div class="warp">
|
|
|
+<div class="title winnone">修改</div>
|
|
|
+<ul class="setting" >
|
|
|
+<form action="" id="dataform">
|
|
|
+<li class="lengththree">
|
|
|
+ 类目:<select name="category" class="select" style="width: 60%;">
|
|
|
+ {loop typeclass(16) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+<li class="lengththree">
|
|
|
+ 等级:<select name="grade" class="select " style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclass(13) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+
|
|
|
+<li class="lengththree">
|
|
|
+ 头套种类:<select name="lacetype" class="select select_two" style="width: 60%;">
|
|
|
+ <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 class="lengththree">
|
|
|
+ 曲度:<select name="lowe" class="select select_two" style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclassyc(15) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+<li class="lengththree">
|
|
|
+ 颜色:<select name="color" class="select select_two" style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclassyc(8) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+
|
|
|
+<li class="lengththree">
|
|
|
+ 蕾丝颜色:<select name="lacecolor" class="select" style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclassyc(9) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+<li class="lengththree">
|
|
|
+ 长度:<select name="size" class="select select_two" style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclass(14) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+<li class="lengththree">
|
|
|
+ 密度:<select name="density" class="select " style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclassyc(10) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+<li class="lengththree">
|
|
|
+ 头套大小:<select name="haircap" class="select " style="width: 60%;">
|
|
|
+ <option value="">请选择</option>{loop typeclassyc(6) as $val}
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>{/loop}</select>
|
|
|
+</li>
|
|
|
+<li class="lengththree">
|
|
|
+ 人发头套编号:<select name="hairnumber" class="select select_two" style="width: 60%;">
|
|
|
+ <option value="">请选择</option>
|
|
|
+ <option value="-1">无编号</option>
|
|
|
+ {loop typeclassyc(43) as $val}
|
|
|
+
|
|
|
+ <option value="-{$val['id']}-">{$val['title']}</option>
|
|
|
+ {/loop}
|
|
|
+ </select>
|
|
|
+</li>
|
|
|
+
|
|
|
+<li >仓库品名:<input value="" name="zh" type="text" style="width: 70%;"></li>
|
|
|
+</form>
|
|
|
+<button style="padding:2px 15px;border-radius: 3px;background-color: chocolate;color:#fff;border:0 solid #fff" onclick="djss()">点击搜索</button>
|
|
|
+
|
|
|
+
|
|
|
+<input type="hidden" name="id" value="{$id}" />
|
|
|
+<input type="hidden" name="bh_no" value="{$bh_no}" />
|
|
|
+
|
|
|
+<div style="clear:both;"></div>
|
|
|
+<div class="table-wrapper">
|
|
|
+ <table class="simple-table">
|
|
|
+ <!-- 简约表头:含必要列,其中包含两个输入域列 -->
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th width="5px"><input type="checkbox" onclick="checkAll()" name="checkall" value=""></th>
|
|
|
+ <th>仓库名称</th>
|
|
|
+ <th>SKU</th>
|
|
|
+ <th>u9料号</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="xzbhsqd_list">
|
|
|
+
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+</div>
|
|
|
+
|
|
|
+</ul>
|
|
|
+<input type="hidden" name="id" value="{$info['id']}" />
|
|
|
+<div class="button"><font onclick="saveData()">提 交</font> <font class="fh">关 闭</font></div>
|
|
|
+</div>
|
|
|
+
|
|
|
+<script>
|
|
|
+$(function(){
|
|
|
+ $('.select_two').select2({
|
|
|
+ placeholder: "请选择",
|
|
|
+ allowClear: true,
|
|
|
+ });
|
|
|
+})
|
|
|
+function submitForm(data) {
|
|
|
+ window.parent.postMessage({ type: 'SAVE_EVENT', data: data }, '*');
|
|
|
+ $(".fh").click();
|
|
|
+}
|
|
|
+function saveData(){
|
|
|
+ let select_id = [];
|
|
|
+ $("input[name='select_id']").each(function(){
|
|
|
+ if($(this).is(':checked')){
|
|
|
+ select_id.push($(this).val());
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if(select_id.length == 0){
|
|
|
+ layerx.alert('提示', '请选择要修改的记录', function(id) {
|
|
|
+
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ $.post("/goodimglibrary/getgoodbyids",{ids:select_id},function(res){
|
|
|
+ if(res.success){
|
|
|
+ submitForm(res.data);
|
|
|
+ }else{
|
|
|
+ layx.alert('提示', res.msg, function(id) {
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },"json")
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+<script type="text/javascript" src="{$theme}js/jquery.min.js"></script>
|
|
|
+<script type="text/javascript" src="{$theme}js/layer/layer.js"></script>
|
|
|
+<script type="text/javascript" src="{$theme}js/layer/extend/layer.ext.js"></script>
|
|
|
+<script>
|
|
|
+function djss(){
|
|
|
+ var fields = $('#dataform').serializeArray();
|
|
|
+ // 2. 遍历数组,构建一个对象
|
|
|
+ var formObj = {};
|
|
|
+ $.each(fields, function(i, field) {
|
|
|
+ formObj[field.name] = field.value;
|
|
|
+ });
|
|
|
+
|
|
|
+ $.post("/goodimglibrary/selectgood",formObj,function(res){
|
|
|
+ if(res.success){
|
|
|
+ showGood(res.data);
|
|
|
+ }else{
|
|
|
+ layx.alert('提示', res.msg, function(id) {
|
|
|
+ $("#xzbhsqd_list").html('');
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },"json");
|
|
|
+}
|
|
|
+function showGood(data){
|
|
|
+ let tplStr = document.getElementById('edit_content').innerHTML;
|
|
|
+
|
|
|
+ // 4. 传递数据进行渲染,并将结果插入 DOM
|
|
|
+ //let outputHtml = compiledTemplate.fetch({ data: data });
|
|
|
+
|
|
|
+ let outputHtml = ejs.render(tplStr, {data: data});
|
|
|
+ $("#xzbhsqd_list").html(outputHtml);
|
|
|
+}
|
|
|
+function checkAll(){
|
|
|
+ let checkall = $("input[name='checkall']").is(':checked');
|
|
|
+ console.log(checkall);
|
|
|
+ if(checkall){
|
|
|
+ $("input[name='select_id']").prop('checked', true);
|
|
|
+ }else{
|
|
|
+ $("input[name='select_id']").prop('checked', false);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+<script type="text/javascript" src="{$theme}js/ejs.min.js"></script>
|
|
|
+<script id="edit_content" type="text/html">
|
|
|
+ <% for(let key in data) { %>
|
|
|
+ <tr>
|
|
|
+ <td><input type="checkbox" name="select_id" value="<%= data[key]['id'] %>" > </td>
|
|
|
+ <td><%= data[key]['zh'] %> </td>
|
|
|
+ <td><%= data[key]['sku'] %> </td>
|
|
|
+ <td><%= data[key]['jm'] %> </td>
|
|
|
+ </tr>
|
|
|
+ <% } %>
|
|
|
+</script>
|
|
|
+{Template footer}
|