This commit is contained in:
浅念
2025-06-20 17:05:56 +08:00
parent b2a1d5e84e
commit 1374d1938a
23 changed files with 2248 additions and 180 deletions
+73
View File
@@ -0,0 +1,73 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>USED CAR</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../assets/css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
<div class="layuimini-main">
<fieldset class="table-search-fieldset">
<legend data-i18n="search_info"></legend>
<div style="margin: 10px 10px 10px 10px">
<form class="layui-form layui-form-pane" action="">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label" data-i18n="seach.name"></label>
<div class="layui-input-inline">
<input type="text" name="name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label" data-i18n="seach.status"></label>
<div class="layui-input-inline">
<select name="status" class="layui-input">
<option value="" data-i18n="select"></option>
<option value="1" data-i18n="selectlist.status1"></option>
<option value="0" data-i18n="selectlist.status2"></option>
</select>
</div>
</div>
<div class="layui-inline">
<button type="submit" class="layui-btn layui-btn-normal" lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> <span data-i18n="btn.search"></span></button>
</div>
</div>
</form>
</div>
</fieldset>
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加 </button>
<!-- <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"> 删除 </button> -->
</div>
</script>
<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
<script type="text/html" id="currentTableBar">
<a class="edit" lay-event="edit">编辑</a>
<a class="delete" lay-event="delete">删除</a>
</script>
</div>
</div>
<script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../assets/js/tablei18n.js"></script>
<script src="../assets/js/i18n2.js"></script>
<script src="../assets/public.js"></script>
<script src="../assets/js/attribute.js" type="text/javascript" charset="utf-8"></script>
<script>
</script>
</body>
</html>
+62
View File
@@ -0,0 +1,62 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>USED CAR</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../assets/css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
<div class="layuimini-main">
<fieldset class="table-search-fieldset">
<legend data-i18n="search_info"></legend>
<div style="margin: 10px 10px 10px 10px">
<form class="layui-form layui-form-pane" action="">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label" data-i18n="seach.name"></label>
<div class="layui-input-inline">
<input type="text" name="category_name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<button type="submit" class="layui-btn layui-btn-normal" lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> <span data-i18n="btn.search"></span></button>
</div>
</div>
</form>
</div>
</fieldset>
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加 </button>
<!-- <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"> 删除 </button> -->
</div>
</script>
<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
<script type="text/html" id="currentTableBar">
<a class="edit" lay-event="edit">编辑</a>
<a class="delete" lay-event="delete">删除</a>
</script>
</div>
</div>
<script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../assets/js/tablei18n.js"></script>
<script src="../assets/js/i18n2.js"></script>
<script src="../assets/js/categories.js" type="text/javascript" charset="utf-8"></script>
<script>
</script>
</body>
</html>
+2
View File
@@ -74,9 +74,11 @@
<script type="text/html" id="currentTableBar">
<a class="show" lay-event="show">详情</a>
<a class="sku" lay-event="sku">属性</a>
{{# if(d.info_status==0){ }}
<a class="check" lay-event="check">审核</a>
{{# } }}
<a class="edit" lay-event="edit">编辑</a>
<a class="delete" lay-event="delete">删除</a>
</script>
+73
View File
@@ -0,0 +1,73 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>USED CAR</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../assets/css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
<div class="layuimini-main">
<fieldset class="table-search-fieldset">
<legend data-i18n="search_info"></legend>
<div style="margin: 10px 10px 10px 10px">
<form class="layui-form layui-form-pane" action="">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label" data-i18n="seach.name"></label>
<div class="layui-input-inline">
<input type="text" name="name" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label" data-i18n="seach.status"></label>
<div class="layui-input-inline">
<select name="status" class="layui-input">
<option value="" data-i18n="select"></option>
<option value="1" data-i18n="selectlist.status1"></option>
<option value="0" data-i18n="selectlist.status2"></option>
</select>
</div>
</div>
<div class="layui-inline">
<button type="submit" class="layui-btn layui-btn-normal" lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> <span data-i18n="btn.search"></span></button>
</div>
</div>
</form>
</div>
</fieldset>
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加 </button>
<!-- <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"> 删除 </button> -->
</div>
</script>
<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
<script type="text/html" id="currentTableBar">
<a class="edit" lay-event="edit">编辑</a>
<a class="delete" lay-event="delete">删除</a>
</script>
</div>
</div>
<script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../assets/js/tablei18n.js"></script>
<script src="../assets/js/i18n2.js"></script>
<script src="../assets/public.js"></script>
<script src="../assets/js/sku.js" type="text/javascript" charset="utf-8"></script>
<script>
</script>
</body>
</html>
+152
View File
@@ -0,0 +1,152 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../../assets/css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
.feature-item{
border: 1px solid #ccc;
padding: 10px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="text" name="attribute_name" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="Belongingtype"></label>
<div class="layui-input-block">
<select id="category_id" name="category_id" class="layui-input">
</select>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">是否必传图片</label>
<div class="layui-input-block">
<select name="is_img" class="layui-input">
<option value="0">无图</option>
<option value="1">必传</option>
<option value="2">可选</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">类型</label>
<div class="layui-input-block">
<select name="input_type" lay-filter="input_type" class="layui-input">
<option value="color">color</option>
<option value="text">text</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">属性值</label>
<div class="layui-input-block">
<div class="feature-list" id="featureList" >
</div>
<div style="margin-top: 10px;">
<button type="button" class="layui-btn layui-btn-normal" id="addFeature">
<i class="layui-icon">&#xe654;</i><span data-i18n="btn.add"></span>
</button>
</div>
</div>
</div>
<div class="layui-form-item layui-hide">
<div class="layui-input-block bootm">
<input type="button" lay-submit lay-filter="saveBtn" id="saveBtn" value="确认">
</div>
</div>
</div>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../../assets/public.js" type="text/javascript" charset="utf-8"></script>
<script src="../../assets/js/i18n1.js"></script>
<script>
layui.use(['form'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.$;
categoriespresetfn(form,true)
// 监听类型选择变化
form.on('select(input_type)', function(data){
var type = data.value;
// 清空之前的内容
$('#featureList').empty();
// 重新渲染表单
form.render();
});
// 添加属性值
$('#addFeature').on('click', function(){
var type = $('select[name="input_type"]').val();
var index = $('#featureList .feature-item').length;
var html = `<div class="feature-item">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="text" name="value_name[${index}]" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div></div>`
if(type === 'color') {
html += `<div class="layui-form-item color-value">
<label class="layui-form-label required">颜色值</label>
<div class="layui-input-block">
<input type="text" name="color_code[${index}]" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div></div>`
}
html+= `<div class="layui-input-block" style="margin-left: 0; text-align: right;">
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-feature">
<i class="layui-icon">&#xe640;</i><span data-i18n="btn.delete"></span>
</button>
</div>`
html += '</div>';
$('#featureList').append(html);
window.i18n.updatePageContent();
form.render();
});
// 删除属性值按钮点击事件
$(document).on('click', '.delete-feature', function() {
var type = $('select[name="input_type"]').val();
$(this).closest('.feature-item').remove();
// 重新排序索引
$('#featureList .feature-item').each(function(index) {
$(this).find('input[name^="value_name"]').attr('name', 'value_name[' + index + ']');
if(type === 'color') {
$(this).find('input[name^="color_code"]').attr('name', 'color_code[' + index + ']');
}
});
});
//监听提交
form.on('submit(saveBtn)', function (data) {
var index = layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
}, function () {
// 关闭弹出层
layer.close(index);
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
});
return false;
});
});
</script>
</body>
</html>
+195
View File
@@ -0,0 +1,195 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../../assets/css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
.feature-item{
border: 1px solid #ccc;
padding: 10px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form" lay-filter="edit">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="hidden" name="id" id="idedt" value="" />
<input type="text" name="attribute_name" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="Belongingtype"></label>
<div class="layui-input-block">
<select id="category_id" name="category_id" class="layui-input">
</select>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">是否必传图片</label>
<div class="layui-input-block">
<select name="is_img" class="layui-input">
<option value="0">无图</option>
<option value="1">必传</option>
<option value="2">可选</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">类型</label>
<div class="layui-input-block">
<select name="input_type" lay-filter="input_type" class="layui-input">
<option value="color">color</option>
<option value="text">text</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">属性值</label>
<div class="layui-input-block">
<div class="feature-list" id="featureList" >
</div>
<div style="margin-top: 10px;">
<button type="button" class="layui-btn layui-btn-normal" id="addFeature">
<i class="layui-icon">&#xe654;</i><span data-i18n="btn.add"></span>
</button>
</div>
</div>
</div>
<div class="layui-form-item layui-hide">
<div class="layui-input-block bootm">
<input type="button" lay-submit lay-filter="saveBtn" id="saveBtn" value="确认">
</div>
</div>
</div>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../../assets/public.js" type="text/javascript" charset="utf-8"></script>
<script src="../../assets/js/i18n1.js"></script>
<script>
layui.use(['form'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.$;
categoriespresetfn(form,true)
$("#idedt").val(getQueryString('id'))
self.attributesdetail({
type:'get',
data:{id:getQueryString('id')},
successCallBack: function(result){
if (result.code == 0) {
form.val('edit', result.data)
// 回显属性值
if(result.data.value && result.data.value.length > 0) {
result.data.value.forEach(function(item) {
var type = $('select[name="input_type"]').val();
var index = $('#featureList .feature-item').length;
var html = `<div class="feature-item">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="hidden" name="idp[${index}]" value="${item.id}" />
<input type="text" name="value_name[${index}]" data-i18n-placeholder="pleaseenter" value="${item.value_name}" class="layui-input">
</div></div>`
if(type === 'color') {
html += `<div class="layui-form-item color-value">
<label class="layui-form-label required">颜色值</label>
<div class="layui-input-block">
<input type="text" name="color_code[${index}]" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="${item.color_code}" class="layui-input">
</div></div>`
}
html+= `<div class="layui-input-block" style="margin-left: 0; text-align: right;">
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-feature">
<i class="layui-icon">&#xe640;</i><span data-i18n="btn.delete"></span>
</button>
</div>`
html += '</div>';
$('#featureList').append(html);
});
}
form.render();
};
},
failCallBack: function(result){
alert(result.message);
}
})
// 监听类型选择变化
form.on('select(input_type)', function(data){
var type = data.value;
// 清空之前的内容
$('#featureList').empty();
// 重新渲染表单
form.render();
});
// 添加属性值
$('#addFeature').on('click', function(){
var type = $('select[name="input_type"]').val();
var index = $('#featureList .feature-item').length;
var html = `<div class="feature-item">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="text" name="value_name[${index}]" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div></div>`
if(type === 'color') {
html += `<div class="layui-form-item color-value">
<label class="layui-form-label required">颜色值</label>
<div class="layui-input-block">
<input type="text" name="color_code[${index}]" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div></div>`
}
html+= `<div class="layui-input-block" style="margin-left: 0; text-align: right;">
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-feature">
<i class="layui-icon">&#xe640;</i><span data-i18n="btn.delete"></span>
</button>
</div>`
html += '</div>';
$('#featureList').append(html);
window.i18n.updatePageContent();
form.render();
});
// 删除属性值按钮点击事件
$(document).on('click', '.delete-feature', function() {
var type = $('select[name="input_type"]').val();
$(this).closest('.feature-item').remove();
// 重新排序索引
$('#featureList .feature-item').each(function(index) {
$(this).find('input[name^="value_name"]').attr('name', 'value_name[' + index + ']');
if(type === 'color') {
$(this).find('input[name^="color_code"]').attr('name', 'color_code[' + index + ']');
}
});
});
//监听提交
form.on('submit(saveBtn)', function (data) {
var index = layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
}, function () {
// 关闭弹出层
layer.close(index);
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
});
return false;
});
});
</script>
</body>
</html>
+68
View File
@@ -0,0 +1,68 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../../assets/css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="text" name="category_name" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sort"></label>
<div class="layui-input-block">
<input type="number" name="sort_order" value="0" data-i18n-placeholder="pleaseenter" class="layui-input">
</div>
</div>
<div class="layui-form-item layui-hide">
<div class="layui-input-block bootm">
<input type="button" lay-submit lay-filter="saveBtn" id="saveBtn" value="确认">
</div>
</div>
</div>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../../assets/public.js" type="text/javascript" charset="utf-8"></script>
<script src="../../assets/js/i18n1.js"></script>
<script>
layui.use(['form'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.$;
//监听提交
form.on('submit(saveBtn)', function (data) {
var index = layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
}, function () {
// 关闭弹出层
layer.close(index);
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
});
return false;
});
});
</script>
</body>
</html>
+90
View File
@@ -0,0 +1,90 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../../assets/css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form" lay-filter="edit">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="hidden" name="id" id="idedt" value="" />
<input type="text" name="name" lay-verify="required" lay-reqtext="名称不能为空" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sort"></label>
<div class="layui-input-block">
<input type="number" name="sort" value="" data-i18n-placeholder="pleaseenter" class="layui-input">
</div>
</div>
<div class="layui-form-item layui-hide">
<div class="layui-input-block bootm">
<input type="button" lay-submit lay-filter="saveBtn" id="saveBtn" value="确认">
</div>
</div>
</div>
</div>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../../assets/public.js" type="text/javascript" charset="utf-8"></script>
<script src="../../assets/js/i18n1.js"></script>
<script>
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
layui.use(['form'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.$;
form.render();
$("#idedt").val(getQueryString('id'))
self.categoriesdetail({
type:'get',
data:{id:getQueryString('id')},
successCallBack: function(result){
if (result.code == 0) {
form.val('edit', result.data)
form.render();
};
},
failCallBack: function(result){
alert(result.message);
}
})
//监听提交
form.on('submit(saveBtn)', function (data) {
var index = layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
}, function () {
// 关闭弹出层
layer.close(index);
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
});
return false;
});
});
</script>
</body>
</html>
+195
View File
@@ -0,0 +1,195 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../../assets/css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
.img-3 {
max-width: 36px;
max-height: 36px;
border-radius: 6px;
}
.upload-item img{
height: 40px;
}
.feature-item{
border: 1px solid #e6e6e6;
padding: 10px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="hidden" name="vehicle_id" id="vehicle_id">
<input type="text" name="name" lay-verify="required" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label" data-i18n="seach.status"></label>
<div class="layui-input-block">
<input type="checkbox" id="status" lay-filter="status" lay-skin="switch" lay-text="">
<input type="text" style="display:none" name="status" value="1" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sku.desc"></label>
<div class="layui-input-block">
<div class="feature-list" id="attributelist">
</div>
<div style="margin-top: 10px;">
<button type="button" class="layui-btn layui-btn-normal" id="addAttribute">
<i class="layui-icon">&#xe654;</i><span data-i18n="btn.add"></span>
</button>
</div>
</div>
</div>
<div class="layui-form-item layui-hide">
<div class="layui-input-block bootm">
<input type="button" lay-submit lay-filter="saveBtn" id="saveBtn" value="确认">
</div>
</div>
</div>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../../assets/public.js" type="text/javascript" charset="utf-8"></script>
<script src="../../assets/js/i18n1.js"></script>
<script>
layui.use(['form','upload'], function () {
var form = layui.form,
layer = layui.layer,
upload = layui.upload,
$ = layui.$;
layui.$("#status").attr("checked", layui.$('input[name="status"]').val() != 0);
layui.form.render();
layui.form.on("switch(status)", function(data) {
layui.$('input[name="status"]').val(this.checked ? 1 : 0);
});
$("#vehicle_id").val(getQueryString('vehicle_id'))
// 添加属性按钮点击事件
$('#addAttribute').on('click', function() {
var index = $('#attributelist .feature-item').length;
var html = `<div class="feature-item">
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sku.name"></label>
<div class="layui-input-block">
<select name="attribute_id[${index}]" class="attribute_id layui-input" lay-filter="attributeSelect">
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sku.value"></label>
<div class="layui-input-block">
<select name="value_id[${index}]" class="layui-input value_id" >
</select>
</div>
</div>
<div class="layui-form-item upload-image-item">
<label class="layui-form-label required" data-i18n="Images"></label>
<div class="layui-input-block upload-item">
<img class="img-3" src="../../assets/images/noimg.png" alt="" />
<input type="text" style="display:none" name="img[${index}]" value="" />
<button type="button" class="layui-btn btnup"><i class="layui-icon">&#xe67c;</i><span data-i18n="userlist.uploadig"></span></button>
</div>
</div>
<div class="layui-input-block" style="margin-left: 0; text-align: right;">
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-attribute">
<i class="layui-icon">&#xe640;</i><span data-i18n="btn.delete"></span>
</button>
</div>
</div>`;
var $newAttribute = $(html);
$('#attributelist').append($newAttribute);
// 重新初始化上传按钮
$newAttribute.find('.btnup').each(function(index, item){
var $item = $(item).closest('.upload-item');
upload.render({
elem: item,
url: baseUrl + 'console/upload/image',
accept: 'images',
field: 'image',
done: function(res){
if(res.code == 0){
$item.find('img').attr('src',res.data.image_url);
$item.find('input').val(res.data.image_name);
}
}
});
});
window.i18n.updatePageContent();
attributespresetfn(form, false, $newAttribute);
form.render();
// 默认隐藏图片上传模块
$newAttribute.find('.upload-image-item').hide();
});
// 监听属性名称下拉框变化,attribute_id=1时显示图片上传模块,否则隐藏
form.on('select(attributeSelect)', function(data){
var $featureItem = $(data.elem).closest('.feature-item');
var selectedValue = data.value;
// 获取当前选中option的data-img属性
var $selectedOption = $(data.elem).find('option:selected');
var dataImg = $selectedOption.attr('data-img');
valuespresetfn(form, true, selectedValue, $featureItem);
// 清空图片上传内容
var $uploadItem = $featureItem.find('.upload-image-item .upload-item');
$uploadItem.find('img').attr('src', '../../assets/images/noimg.png');
$uploadItem.find('input[type="text"]').val('');
if (dataImg == '1'||dataImg == '2') {
$featureItem.find('.upload-image-item').show();
} else {
$featureItem.find('.upload-image-item').hide();
}
});
// 删除属性按钮点击事件
$(document).on('click', '.delete-attribute', function() {
$(this).closest('.feature-item').remove();
// 重新排序索引
$('#attributelist .feature-item').each(function(index) {
$(this).find('select[name^="attribute_id"]').attr('name', 'attribute_id[' + index + ']');
$(this).find('select[name^="value_id"]').attr('name', 'value_id[' + index + ']');
$(this).find('input[name^="img"]').attr('name', 'img[' + index + ']');
});
});
//监听提交
form.on('submit(saveBtn)', function (data) {
var index = layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
}, function () {
// 关闭弹出层
layer.close(index);
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
});
return false;
});
});
</script>
</body>
</html>
+243
View File
@@ -0,0 +1,243 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css" media="all">
<link rel="stylesheet" href="../../assets/css/public.css" media="all">
<style>
body {
background-color: #ffffff;
}
.img-3 {
max-width: 36px;
max-height: 36px;
border-radius: 6px;
}
.upload-item img{
height: 40px;
}
.feature-item{
border: 1px solid #e6e6e6;
padding: 10px;
margin-bottom: 10px;
}
</style>
</head>
<body>
<div class="layui-form layuimini-form" lay-filter="edit">
<div class="layui-form-item">
<label class="layui-form-label required" data-i18n="seach.name"></label>
<div class="layui-input-block">
<input type="hidden" name="id" id="idedt" value="" />
<input type="hidden" name="vehicle_id" id="vehicle_id" value="" />
<input type="text" name="name" lay-verify="required" data-i18n-placeholder="pleaseenter" value="" class="layui-input">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label" data-i18n="seach.status"></label>
<div class="layui-input-block">
<input type="checkbox" id="status" lay-filter="status" lay-skin="switch" lay-text="">
<input type="text" style="display:none" name="status" value="1" />
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sku.desc"></label>
<div class="layui-input-block">
<div class="feature-list" id="attributelist"></div>
<div style="margin-top: 10px;">
<button type="button" class="layui-btn layui-btn-normal" id="addAttribute">
<i class="layui-icon">&#xe654;</i><span data-i18n="btn.add"></span>
</button>
</div>
</div>
</div>
<div class="layui-form-item layui-hide">
<div class="layui-input-block bootm">
<input type="button" lay-submit lay-filter="saveBtn" id="saveBtn" value="确认">
</div>
</div>
</div>
</div>
<script src="../../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../../assets/main.js" charset="utf-8"></script>
<script src="../../assets/public.js" type="text/javascript" charset="utf-8"></script>
<script src="../../assets/js/i18n1.js"></script>
<script>
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
layui.use(['form','upload'], function () {
var form = layui.form,
layer = layui.layer,
upload = layui.upload,
$ = layui.$;
form.render();
$("#idedt").val(getQueryString('id'))
$("#vehicle_id").val(getQueryString('vehicle_id'))
self.skudetail({
type:'get',
data:{id:getQueryString('id')},
successCallBack: function(result){
if (result.code == 0) {
var data = result.data;
form.val('edit', result.data)
form.render();
// 字段 状态 status
layui.use(["form"], function() {
layui.$("#status").attr("checked", layui.$('input[name="status"]').val() != 0);
layui.form.render();
layui.form.on("switch(status)", function(data) {
layui.$('input[name="status"]').val(this.checked ? 1 : 0);
});
})
// 属性列表
$('#attributelist').empty();
(data.skuAttributes || []).forEach(function(item, idx){
renderAttributeItem(item, idx);
});
};
},
failCallBack: function(result){
alert(result.message);
}
})
// 动态添加属性项
function renderAttributeItem(data, index) {
var html = `<div class="feature-item">
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sku.name"></label>
<div class="layui-input-block">
<input type="hidden" name="id[]" value="${data.id}">
<select name="attribute_id[${index}]" class="attribute_id layui-input" lay-filter="attributeSelect"></select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label" data-i18n="sku.value"></label>
<div class="layui-input-block">
<select name="value_id[${index}]" class="layui-input value_id"></select>
</div>
</div>
<div class="layui-form-item upload-image-item">
<label class="layui-form-label required" data-i18n="Images"></label>
<div class="layui-input-block upload-item">
<img class="img-3" src="${data && data.img_full ? data.img_full : '../../assets/images/noimg.png'}" alt="" />
<input type="text" style="display:none" name="img[${index}]" value="${data && data.img ? data.img : ''}" />
<button type="button" class="layui-btn btnup"><i class="layui-icon">&#xe67c;</i><span data-i18n="userlist.uploadig"></span></button>
</div>
</div>
<div class="layui-input-block" style="margin-left: 0; text-align: right;">
<button type="button" class="layui-btn layui-btn-danger layui-btn-sm delete-attribute">
<i class="layui-icon">&#xe640;</i><span data-i18n="btn.delete"></span>
</button>
</div>
</div>`;
var $newAttribute = $(html);
$('#attributelist').append($newAttribute);
// 上传按钮
$newAttribute.find('.btnup').each(function(idx, item){
var $item = $(item).closest('.upload-item');
upload.render({
elem: item,
url: baseUrl + 'console/upload/image',
accept: 'images',
field: 'image',
done: function(res){
if(res.code == 0){
$item.find('img').attr('src',res.data.image_url);
$item.find('input').val(res.data.image_name);
}
}
});
});
window.i18n.updatePageContent();
attributespresetfn(form, false, $newAttribute);
form.render();
// 默认隐藏图片上传模块
$newAttribute.find('.upload-image-item').hide();
// 属性名称和属性值回显
setTimeout(function() {
if(data && data.attribute_id){
$newAttribute.find('select[name^="attribute_id"]').val(data.attribute_id);
valuespresetfn(form, true, data.attribute_id, $newAttribute);
setTimeout(function(){
$newAttribute.find('select[name^="value_id"]').val(data.value_id);
form.render('select');
}, 200);
// 如果需要显示图片上传
if(data.img){
$newAttribute.find('.upload-image-item').show();
}
}
}, 1000);
}
// 添加属性按钮
$('#addAttribute').on('click', function() {
var index = $('#attributelist .feature-item').length;
renderAttributeItem({}, index);
});
// 监听属性名称下拉框变化
form.on('select(attributeSelect)', function(data){
var $featureItem = $(data.elem).closest('.feature-item');
var selectedValue = data.value;
var $selectedOption = $(data.elem).find('option:selected');
var dataImg = $selectedOption.attr('data-img');
valuespresetfn(form, true, selectedValue, $featureItem);
// 清空图片上传内容
var $uploadItem = $featureItem.find('.upload-image-item .upload-item');
$uploadItem.find('img').attr('src', '../../assets/images/noimg.png');
$uploadItem.find('input[type="text"]').val('');
if (dataImg == '1'||dataImg == '2') {
$featureItem.find('.upload-image-item').show();
} else {
$featureItem.find('.upload-image-item').hide();
}
});
// 删除属性按钮
$(document).on('click', '.delete-attribute', function() {
$(this).closest('.feature-item').remove();
// 重新排序索引
$('#attributelist .feature-item').each(function(index) {
$(this).find('select[name^="attribute_id"]').attr('name', 'attribute_id[' + index + ']');
$(this).find('select[name^="value_id"]').attr('name', 'value_id[' + index + ']');
$(this).find('input[name^="img"]').attr('name', 'img[' + index + ']');
});
});
//监听提交
form.on('submit(saveBtn)', function (data) {
var index = layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
}, function () {
// 关闭弹出层
layer.close(index);
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
});
return false;
});
});
</script>
</body>
</html>