<div class="layui-fluid layui-anim febs-anim" id="febs-aiDependency-add" lay-title="新增">
|
<div class="layui-row febs-container">
|
<div class="layui-col-md12">
|
<div class="layui-fluid" id="aiDependency-add">
|
<form class="layui-form" action="" lay-filter="aiDependency-add-form">
|
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
|
<ul class="layui-tab-title">
|
<li class="layui-this">基础信息</li>
|
</ul>
|
<div class="layui-tab-content">
|
<div class="layui-tab-item layui-show">
|
<div class="layui-row layui-col-space10 layui-form-item">
|
<div class="layui-col-lg6">
|
<label class="layui-form-label febs-form-item-require">分类:</label>
|
<div class="layui-input-block">
|
<div id="product-category"></div>
|
</div>
|
</div>
|
</div>
|
<!-- 调试按钮 -->
|
<div class="layui-row layui-col-space10 layui-form-item">
|
<div class="layui-col-lg6">
|
<div class="layui-input-block">
|
<button type="button" class="layui-btn layui-btn-primary" id="debug-category">获取选中分类信息</button>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10 layui-form-item">
|
<div class="layui-col-lg6">
|
<label class="layui-form-label febs-form-item-require">前置产品:</label>
|
<div class="layui-input-block">
|
<select name="prerequisiteProductId" id="prerequisiteProductId" lay-verify="required" lay-filter="prerequisiteProductId">
|
<option value="">请先选择产品分类</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10 layui-form-item">
|
<div class="layui-col-lg6">
|
<label class="layui-form-label febs-form-item-require">目标产品:</label>
|
<div class="layui-input-block">
|
<select name="targetProductId" id="targetProductId" lay-verify="required" lay-filter="targetProductId" >
|
<option value="">请先选择产品分类</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<div class="layui-row layui-col-space10 layui-form-item">
|
<div class="layui-col-lg6">
|
<label class="layui-form-label febs-form-item-require">解锁分数:</label>
|
<div class="layui-input-block">
|
<input type="number" name="requiredScore" lay-verify="required" min="0"
|
placeholder="请输入解锁分数" autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
<div class="layui-form-item febs-hide">
|
<button class="layui-btn" lay-submit="" lay-filter="aiDependency-add-form-submit" id="submit">保存</button>
|
</div>
|
</form>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
<!-- 表格操作栏 end -->
|
<script data-th-inline="javascript">
|
layui.use(['febs', 'form', 'formSelects', 'validate', 'treeSelect', 'eleTree','dropdown', 'laydate', 'layedit', 'upload', 'element', 'table', 'xmSelect','jquery'], function () {
|
var $ = layui.jquery,
|
febs = layui.febs,
|
layer = layui.layer,
|
table = layui.table,
|
formSelects = layui.formSelects,
|
treeSelect = layui.treeSelect,
|
form = layui.form,
|
laydate = layui.laydate,
|
eleTree = layui.eleTree,
|
$view = $('#aiDependency-add'),
|
layedit = layui.layedit,
|
upload = layui.upload,
|
validate = layui.validate,
|
element = layui.element;
|
|
// 初始化产品分类 - 使用xmSelect组件
|
var category = xmSelect.render({
|
el: '#product-category',
|
language: 'zn',
|
prop : {
|
value : 'id',
|
children : 'child'
|
},
|
iconfont: {
|
parent: 'hidden',
|
},
|
tips: '请选择',
|
filterable: true,
|
radio: true,
|
clickClose: true,
|
tree: {
|
show: true,
|
//非严格模式
|
strict: false,
|
},
|
data: [],
|
on: function(data) {
|
console.log('xmSelect内置on事件触发:', data);
|
console.log('xmSelect内置on事件触发:', category.getValue('valueStr'));
|
handleCategorySelect(data);
|
}
|
});
|
|
// 加载分类数据
|
febs.get(ctx + 'admin/productCategory/categoryTree', null, function(res) {
|
if (res.code === 200 && res.data) {
|
category.update({
|
data: res.data,
|
autoRow: true,
|
});
|
} else {
|
febs.alert.error('加载分类数据失败');
|
}
|
handleCategorySelect();
|
});
|
|
// 统一的分类选择处理函数
|
function handleCategorySelect(data) {
|
try {
|
console.log('===== handleCategorySelect函数开始执行 =====');
|
console.log('传入的data参数:', data);
|
|
// 方法1:获取完整的选中数据对象
|
var selectedData = category.getValue();
|
console.log('1. 完整选中数据:', selectedData);
|
console.log('完整数据类型:', Array.isArray(selectedData) ? '数组' : typeof selectedData);
|
|
// 方法2:尝试直接从data参数中获取选中值
|
var dataValue = data && data.arr && data.arr[0] ? data.arr[0].id : null;
|
console.log('2. 从data参数获取值:', dataValue);
|
|
// 方法3:检查DOM元素是否显示了选中的值
|
var domContent = $('#product-category').value;
|
console.log('3. DOM显示的选中内容:', domContent);
|
|
// 确定分类ID - 优先从selectedData数组中获取
|
var categoryId = null;
|
if (Array.isArray(selectedData) && selectedData.length > 0 && selectedData[0]) {
|
// xmSelect通常返回对象数组,每个对象包含value和name属性
|
categoryId = selectedData[0].value;
|
console.log('从selectedData数组中提取到分类ID:', categoryId);
|
} else if (dataValue) {
|
categoryId = dataValue;
|
console.log('从data参数中提取到分类ID:', categoryId);
|
}
|
|
console.log('最终确定的分类ID:', categoryId);
|
|
// 清空之前的选项
|
$('#prerequisiteProductId').html('<option value="">请选择前置产品</option>');
|
$('#targetProductId').html('<option value="">请选择目标产品</option>');
|
|
// 只有当categoryId有效时才加载产品列表
|
if (categoryId !== undefined && categoryId !== null && String(categoryId).trim() !== '') {
|
console.log('分类ID有效,开始加载产品列表');
|
loadProductList(categoryId);
|
} else {
|
// 未选择分类时的处理
|
console.log('未选择有效分类ID');
|
$('#prerequisiteProductId').html('<option value="">请先选择分类</option>');
|
$('#targetProductId').html('<option value="">请先选择分类</option>');
|
}
|
|
form.render('select');
|
console.log('===== handleCategorySelect函数执行结束 =====');
|
} catch (e) {
|
console.error('处理分类选择时出错:', e);
|
console.error('错误堆栈:', e.stack);
|
}
|
}
|
|
// 前置产品选择事件
|
form.on('select(prerequisiteProductId)', function(data) {
|
validateProductSelection();
|
});
|
|
// 目标产品选择事件
|
form.on('select(targetProductId)', function(data) {
|
validateProductSelection();
|
});
|
|
// 验证前置产品和目标产品不能相同
|
function validateProductSelection() {
|
var prerequisiteProductId = $('#prerequisiteProductId').val();
|
var targetProductId = $('#targetProductId').val();
|
console.log('===== validateProductSelection函数执行 =====', prerequisiteProductId, targetProductId);
|
|
if (prerequisiteProductId && targetProductId && prerequisiteProductId === targetProductId) {
|
febs.alert.warn('前置产品和目标产品不能相同');
|
$('#targetProductId').val('');
|
form.render('select');
|
}
|
}
|
|
// 根据分类加载产品列表
|
function loadProductList(categoryId) {
|
console.log('===== 开始加载产品列表 =====');
|
console.log('传入的分类ID:', categoryId);
|
console.log('分类ID类型:', typeof categoryId);
|
|
// 确保categoryId为字符串类型
|
var safeCategoryId = String(categoryId || '').trim();
|
console.log('处理后的安全分类ID:', safeCategoryId);
|
|
// 构建请求数据
|
var requestData = {productCategoryId: safeCategoryId};
|
console.log('发送的请求数据:', requestData);
|
|
$.ajax({
|
url: ctx + 'admin/product/listByCategory',
|
type: 'post',
|
dataType: 'json',
|
contentType: 'application/json;charset=utf-8',
|
data: JSON.stringify(requestData),
|
beforeSend: function(xhr) {
|
console.log('准备发送AJAX请求到:', ctx + 'admin/product/listByCategory');
|
console.log('请求头设置为application/json');
|
},
|
success: function(res) {
|
console.log('===== 产品列表加载响应 =====');
|
console.log('响应状态:', res ? '有数据' : '空数据');
|
if (res) {
|
console.log('响应状态码:', res.code);
|
console.log('响应数据:', res.data);
|
}
|
|
var preProductSelect = $('#prerequisiteProductId');
|
var targetProductSelect = $('#targetProductId');
|
|
// 清空现有选项
|
preProductSelect.html('<option value="">请选择前置产品</option>');
|
targetProductSelect.html('<option value="">请选择目标产品</option>');
|
|
if (res && res.code === 200 && res.data) {
|
// 检查数据类型,适配不同的数据结构
|
var products = Array.isArray(res.data) ? res.data : (res.data.records || []);
|
|
console.log('处理后产品数据数组:', products);
|
console.log('产品数量:', products.length);
|
|
if (products.length > 0) {
|
console.log('开始构建产品选项...');
|
$.each(products, function(index, item) {
|
if (item && item.id !== undefined && item.name !== undefined) {
|
console.log('添加产品选项:', item.id, '-', item.name);
|
preProductSelect.append('<option value="' + item.id + '">' + item.name + '</option>');
|
targetProductSelect.append('<option value="' + item.id + '">' + item.name + '</option>');
|
} else {
|
console.log('跳过无效产品项:', item);
|
}
|
});
|
console.log('重新渲染选择框');
|
form.render('select');
|
} else {
|
console.log('该分类下暂无产品');
|
preProductSelect.html('<option value="">该分类下暂无产品</option>');
|
targetProductSelect.html('<option value="">该分类下暂无产品</option>');
|
}
|
} else {
|
console.log('接口返回异常或无数据');
|
preProductSelect.html('<option value="">加载失败,请重试</option>');
|
targetProductSelect.html('<option value="">加载失败,请重试</option>');
|
}
|
},
|
error: function(xhr, status, error) {
|
console.error('===== 加载产品列表失败 =====');
|
console.error('HTTP状态:', xhr.status);
|
console.error('状态文本:', status);
|
console.error('错误信息:', error);
|
console.error('响应文本:', xhr.responseText);
|
|
$('#prerequisiteProductId').html('<option value="">加载失败,请重试</option>');
|
$('#targetProductId').html('<option value="">加载失败,请重试</option>');
|
form.render('select');
|
},
|
complete: function() {
|
console.log('===== AJAX请求完成 =====');
|
}
|
});
|
}
|
|
form.on('submit(aiDependency-add-form-submit)', function (data) {
|
data.field.productCategoryId = category.getValue('valueStr');
|
$.ajax({
|
'url':ctx + 'admin/aiDependency/add',
|
'type':'post',
|
'dataType':'json',
|
'headers' : {'Content-Type' : 'application/json;charset=utf-8'}, //接口json格式
|
'traditional': true,//ajax传递数组必须添加属性
|
'data':JSON.stringify(data.field),
|
'success':function (data) {
|
if(data.code==200){
|
layer.closeAll();
|
febs.alert.success(data.message);
|
$('#febs-aiDependency').find('#query').click();
|
}else{
|
febs.alert.warn(data.message);
|
}
|
},
|
'error':function () {
|
febs.alert.warn('服务器繁忙');
|
}
|
})
|
return false;
|
});
|
|
});
|
</script>
|