document
.addEventListener
('keydown', function
(event
) {
if
(event
.key === 'Enter'
) {
event
.preventDefault
(); // 阻止默认行为
event
.stopPropagation
(); // 阻止事件冒泡
}
}
);
$(document
).ready
(function
() {
// 获取全局的DataManager实例
const dataManager = window
.parent
.dataManager;
// 初始化页面元素
const
$dingdanSelect =
$('#dingdanSelect'
);
const
$chanpinSelect =
$('#chanpinSelect'
);
const
$zujianSelect =
$('#zujianSelect'
);
const
$bancaiInfo =
$('#bancaiInfo'
);
const
$orderQuantityInput =
$('#orderQuantityInput'
);
const
$submitOrderBtn =
$('#submitOrderBtn'
);
// 新增变量定义
const
$bancaiSelect =
$('#bancaiSelect'
);
const
$addBancaiBtn =
$('#addBancaiBtn'
);
// 定义实体类型常量
const ENTITY_DINGDAN = 'dingdan';
const ENTITY_CHANPIN = 'chanpin';
const ENTITY_ZUJIAN = 'zujian';
const ENTITY_BANCAI = 'bancai';
const ENTITY_CAIZHI = 'caizhi';
const ENTITY_MUPI = 'mupi';
// 存储当前选中的实体ID（使用正确的层级关系）
let currentDingdanId = null; // 订单ID
let currentDingdanChanpinId = null; // 订单-产品关联ID
let currentChanpinZujianId = null; // 产品-组件关联ID
// 初始化页面
initPage
();
// 初始化页面函数
async function initPage
() {
// 注册数据更新回调
dataManager
.registerCallback
('all',
(operation, entity, data
) => {
if
(operation === 'refresh' || operation === 'add' || operation === 'update' || operation === 'delete'
) {
// 只刷新需要更新的部分
if
(entity === ENTITY_DINGDAN
) {
refreshDingdanList
();
} else if
(entity === 'dingdan_chanpin'
) {
if
(currentDingdanId
) {
refreshChanpinList
(currentDingdanId
);
}
} else if
(entity === 'chanpin_zujian'
) {
if
(currentDingdanChanpinId
) {
refreshZujianList
(currentDingdanChanpinId
);
}
}
}
}
);
// 填充订单下拉框
await refreshDingdanList
();
// 填充订单下拉框
await refreshBancaiList
();
// 初始化Select2下拉框
initSelect2Dropdowns
();
// 绑定事件
bindEvents
();
}
// 初始化Select2下拉框
function initSelect2Dropdowns
() {
// 主页面下拉框
$('#dingdanSelect'
).select2
({
theme: 'bootstrap',
placeholder: '请选择订单',
allowClear: true
}
);
$('#chanpinSelect'
).select2
({
theme: 'bootstrap',
placeholder: '请选择产品',
allowClear: true,
disabled: true
}
);
$('#zujianSelect'
).select2
({
theme: 'bootstrap',
placeholder: '请选择组件',
allowClear: true,
disabled: true
}
);
// 初始化板材下拉框
$bancaiSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择板材',
allowClear: true,
}
);
}
// 绑定事件处理函数
function bindEvents
() {
// 订单选择变化
$dingdanSelect
.on
('change', async function
() {
currentDingdanId =
$(this
).val();
if
(currentDingdanId
) {
await refreshChanpinList
(currentDingdanId
);
$('#chanpinSelect'
).prop
('disabled', false
);
$('#addChanpinBtn'
).prop
('disabled', false
);
$('#chanpinSelect'
).select2
('enable'
);
// 重置下级选择
$zujianSelect
.prop
('disabled', true
).empty
();
$zujianSelect
.select2
('destroy'
); // 销毁旧的Select2实例
$zujianSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择组件',
allowClear: true,
disabled: true
}
);
$bancaiInfo
.text
(''
);
$orderQuantityInput
.val(''
).prop
('disabled', true
);
$submitOrderBtn
.prop
('disabled', true
);
$('#addZujianBtn'
).prop
('disabled', true
);
currentDingdanChanpinId = null;
currentChanpinZujianId = null;
} else {
$chanpinSelect
.prop
('disabled', true
).empty
();
$chanpinSelect
.select2
('enable', false
);
$zujianSelect
.prop
('disabled', true
).empty
();
$zujianSelect
.select2
('enable', false
);
$bancaiInfo
.text
(''
);
$orderQuantityInput
.val(''
).prop
('disabled', true
);
$submitOrderBtn
.prop
('disabled', true
);
$('#addChanpinBtn'
).prop
('disabled', true
);
$('#addZujianBtn'
).prop
('disabled', true
);
currentDingdanChanpinId = null;
currentChanpinZujianId = null;
}
}
);
// 产品选择变化（现在选择的是dingdan_chanpin的ID）
$chanpinSelect
.on
('change', async function
() {
currentDingdanChanpinId =
$(this
).val();
if
(currentDingdanChanpinId
) {
await refreshZujianList
(currentDingdanChanpinId
);
$zujianSelect
.prop
('disabled', false
);
$('#addZujianBtn'
).prop
('disabled', false
);
$zujianSelect
.select2
('enable'
);
// 重置下级选择
$bancaiInfo
.text
(''
);
$orderQuantityInput
.val(''
).prop
('disabled', true
);
$submitOrderBtn
.prop
('disabled', true
);
currentChanpinZujianId = null;
} else {
$zujianSelect
.prop
('disabled', true
).empty
();
$zujianSelect
.select2
('enable', false
);
$bancaiInfo
.text
(''
);
$orderQuantityInput
.val(''
).prop
('disabled', true
);
$submitOrderBtn
.prop
('disabled', true
);
$('#addZujianBtn'
).prop
('disabled', true
);
currentChanpinZujianId = null;
}
}
);
// 组件选择事件
$zujianSelect
.on
('change', function
() {
currentChanpinZujianId =
$(this
).val();
// 填充板材下拉框
refreshBancaiList
(currentChanpinZujianId
);
}
);
// 新增订单按钮
$('#addDingdanBtn'
).on
('click', function
() {
showEntityModal
('新增订单', ENTITY_DINGDAN, null, {
number: '',
xiadan: new Date
().toISOString
().split
('T'
)[0],
jiaohuo: ''
}
);
}
);
// 添加产品按钮
$('#addChanpinBtn'
).on
('click', function
() {
if
(!currentDingdanId
) {
alert
('请先选择订单'
);
return;
}
// 确保产品数据已加载
showEntityModal
('添加产品', 'dingdan_chanpin', null, {
dingdan: { id:
parseInt(currentDingdanId
) },
chanpin: { id: '' },
shuliang: 1
}
);
}
);
// 添加组件按钮
$('#addZujianBtn'
).on
('click', function
() {
if
(!currentDingdanChanpinId
) {
alert
('请先选择产品'
);
return;
}
// 获取当前选中的产品ID
const dingdanChanpin = dataManager
.data
.dingdan_chanpins
.find
(
dc => dc
.id == currentDingdanChanpinId
);
if
(!dingdanChanpin || !dingdanChanpin
.chanpin
) {
alert
('未找到产品信息'
);
return;
}
const chanpinId = dingdanChanpin
.chanpin
.id;
showEntityModal
('添加组件', 'chanpin_zujian', null, {
chanpin: { id:
parseInt(chanpinId
) },
zujian: { id: '' },
bancai: { id: '' },
one_howmany: 1
}
);
}
);
// 新增板材按钮事件
$addBancaiBtn
.on
('click', function
() {
showCreateEntityModal
('创建新板材', ENTITY_BANCAI, null, {
houdu: 0
.0
}, 'main'
); // 添加来源标识
}
);
// 提交订单按钮（修复后的逻辑）
$submitOrderBtn
.on
('click', async function
() {
const quantity =
parseInt($orderQuantityInput
.val());
if
(!quantity || quantity <= 0
) {
alert
('请输入有效的订购数量'
);
return;
}
// 获取选中的板材ID
const selectedBancaiId =
$bancaiSelect
.val();
if
(!selectedBancaiId
) {
alert
('请选择板材'
);
return;
}
try {
// 获取当前选中的板材
const bancai = dataManager
.data
.bancais
.find
(b => b
.id == selectedBancaiId
);
if
(!bancai
) {
throw new Error
('未找到选中的板材'
);
}
// 确定订购层级（订单、产品、组件都不是必须的）
let dingdanId = currentDingdanId ?
parseInt(currentDingdanId
) : null;
let chanpinId = null;
let zujianId = null;
// 如果有组件选择
if
(currentChanpinZujianId
) {
const chanpinZujian = dataManager
.data
.chanpin_zujians
.find
(
cz => cz
.id == currentChanpinZujianId
);
if
(chanpinZujian
) {
if
(chanpinZujian
.chanpin
) chanpinId = chanpinZujian
.chanpin
.id;
if
(chanpinZujian
.zujian
) zujianId = chanpinZujian
.zujian
.id;
}
}
// 如果有产品选择（没有组件）
else if
(currentDingdanChanpinId
) {
const dingdanChanpin = dataManager
.data
.dingdan_chanpins
.find
(
dc => dc
.id == currentDingdanChanpinId
);
if
(dingdanChanpin && dingdanChanpin
.chanpin
) {
chanpinId = dingdanChanpin
.chanpin
.id;
}
}
// 检查是否已存在相同的订购记录
const existingOrder = dataManager
.data
.dingdan_bancais
.find
(
db =>
(db
.dingdan ? db
.dingdan
.id == dingdanId : !dingdanId
) &&
(db
.chanpin ? db
.chanpin
.id == chanpinId : !chanpinId
) &&
(db
.zujian ? db
.zujian
.id == zujianId : !zujianId
) &&
db
.bancai
.id == selectedBancaiId
);
if
(existingOrder
) {
// 更新现有记录
await dataManager
.updateEntity
('dingdan_bancai', {
id: existingOrder
.id,
shuliang: quantity
}
);
} else {
// 创建新记录
await dataManager
.addEntity
('dingdan_bancai', {
dingdan: dingdanId ? { id: dingdanId } : null,
chanpin: chanpinId ? { id:
parseInt(chanpinId
) } : null,
zujian: zujianId ? { id:
parseInt(zujianId
) } : null,
bancai: { id:
parseInt(selectedBancaiId
) },
shuliang: quantity
}
);
}
// 更新库存
const existingban = dataManager
.data
.kucuns
.find
(
k => k
.bancai && k
.bancai
.id == selectedBancaiId
);
if
(existingban
) {
await dataManager
.updateEntity
('kucun', {
id: existingban
.id,
shuliang: quantity + existingban
.shuliang
}
);
} else {
await dataManager
.addEntity
("kucun", {
bancai: { id: selectedBancaiId },
shuliang: quantity
}
);
}
alert
('订购成功！'
);
resetForm
();
} catch
(error
) {
console
.error
('订购失败:', error
);
alert
(`订购失败:
${error
.message}`
);
}
}
);
// 模态框保存按钮
$('#saveEntityBtn'
).on
('click', saveEntity
);
// 新建实体按钮（在创建实体模态框中）
$('#saveNewEntityBtn'
).on
('click', saveNewEntity
);
// 绑定板材选择和数量输入事件
$bancaiSelect
.on
('change', checkSubmitCondition
);
$orderQuantityInput
.on
('input', checkSubmitCondition
);
}
// 新增函数：检查提交条件
function checkSubmitCondition
() {
const selectedBancaiId =
$bancaiSelect
.val();
const quantity =
parseInt($orderQuantityInput
.val());
if
(selectedBancaiId
) $orderQuantityInput
.prop
('disabled', false
);
// 只需板材选择和数量有效即可提交
if
(selectedBancaiId && quantity > 0
) {
$submitOrderBtn
.prop
('disabled', false
);
} else {
$submitOrderBtn
.prop
('disabled', true
);
}
}
// 创建进货记录函数（使用正确的ID）问：如何放到 //记录创建订购 回调里
async function createJinhuo
(chanpinId, zujianId, bancaiId, quantity
) {
const jinhuoData = {
dingdan: { id:
parseInt(currentDingdanId
) },
chanpin: { id:
parseInt(chanpinId
) },
zujian: { id:
parseInt(zujianId
) },
bancai: { id:
parseInt(bancaiId
) },
shuliang: quantity,
date: new Date
().toISOString
(),
user: { id: localStorage
.getItem
("userId"
) }
};
await dataManager
.addEntity
('jinhuo', jinhuoData
);
}
// 修改重置表单函数
function resetForm
() {
$orderQuantityInput
.val(''
);
$bancaiSelect
.val(''
).trigger
('change'
);
$submitOrderBtn
.prop
('disabled', true
);
}
// 刷新订单列表
async function refreshDingdanList
() {
const current
Value =
$dingdanSelect
.val();
$dingdanSelect
.empty
().append
('<option
value="">请选择订单</option>'
);
// 获取所有订单
const dingdans = dataManager
.data
.dingdans || [];
// 按下单日期降序排序
dingdans
.sort
((a, b
) => new Date
(b
.xiadan
) - new Date
(a
.xiadan
));
// 填充下拉框
dingdans
.forEach
(dingdan => {
const option =
$('<option>'
)
.val(dingdan
.id
)
.text
(`
${dingdan
.number}
(${formatDate
(dingdan
.xiadan
)}
)`
);
$dingdanSelect
.append
(option
);
}
);
// 恢复之前的选择
if
(current
Value
) {
$dingdanSelect
.val(current
Value
);
}
// 刷新后重新初始化Select2
$dingdanSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择订单',
allowClear: true
}
);
}
// 刷新产品列表（基于订单）
async function refreshChanpinList
(dingdanId,chanpinId
) {
const current
Value =
$chanpinSelect
.val();
$chanpinSelect
.empty
().append
('<option
value="">请选择产品</option>'
);
// 获取订单对应的产品（dingdan_chanpin）
const dingdanChanpins = dataManager
.data
.dingdan_chanpins || [];
const relatedChanpins = dingdanChanpins
.filter
(dc =>
dc
.dingdan && dc
.dingdan
.id == dingdanId
);
var dingdanChanpinId;
relatedChanpins
.forEach
(dc => {
if
(dc
.chanpin?
.id==chanpinId
){
dingdanChanpinId=dc
.id
}
}
)
// 填充下拉框
relatedChanpins
.forEach
(dc => {
if
(dc
.chanpin
) {
const option =
$('<option>'
)
.val(dc
.id
) // 使用dingdan_chanpin的ID
.text
(`
${dc
.chanpin
.bianhao}
(数量:
${dc
.shuliang}
)`
);
$chanpinSelect
.append
(option
);
}
}
);
// 恢复之前的选择
if
(current
Value
) {
$chanpinSelect
.val(current
Value
);
}
if
(dingdanChanpinId
){
$chanpinSelect
.val(dingdanChanpinId
);
}
// 刷新后重新初始化Select2
$chanpinSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择产品',
allowClear: true
}
).prop
('disabled', false
);
$chanpinSelect
.trigger
('change'
);
}
// 刷新组件列表（基于产品）- 修复后的逻辑
async function refreshZujianList
(dingdanChanpinId,zujianId
) {
const current
Value =
$zujianSelect
.val();
$zujianSelect
.empty
().append
('<option
value="">请选择组件</option>'
);
// 获取当前选中的订单-产品关联
const dingdanChanpin = dataManager
.data
.dingdan_chanpins
.find
(
dc => dc
.id == dingdanChanpinId
);
if
(!dingdanChanpin || !dingdanChanpin
.chanpin
) {
return;
}
const chanpinId = dingdanChanpin
.chanpin
.id;
// 获取该产品的所有组件关联
const chanpinZujians = dataManager
.data
.chanpin_zujians
.filter
(
cz => cz
.chanpin && cz
.chanpin
.id == chanpinId
);
var chanpinZujianId;
chanpinZujians
.forEach
(dc => {
if
(dc
.zujian?
.id==zujianId
){
chanpinZujianId=dc
.id
}
}
)
// 填充下拉框
chanpinZujians
.forEach
(cz => {
if
(cz
.zujian
) {
const option =
$('<option>'
)
.val(cz
.id
) // 使用chanpin_zujian的ID
.text
(`
${cz
.zujian
.name}
(产量:
${cz
.one_howmany}
)`
);
$zujianSelect
.append
(option
);
}
}
);
// 恢复之前的选择
if
(current
Value
) {
$zujianSelect
.val(current
Value
);
}
if
(chanpinZujianId
){
$zujianSelect
.val(chanpinZujianId
);
}
// 刷新后重新初始化Select2
$zujianSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择组件',
allowClear: true
}
).prop
('disabled', false
);
$zujianSelect
.trigger
('change'
);
}
async function refreshBancaiList
(chanpinZujianId,bancaiId
) {
const current
Value =
$bancaiSelect
.val();
$bancaiSelect
.empty
().append
('<option
value="">请选择板材</option>'
);
if
(chanpinZujianId
) {
// 根据组件ID加载关联板材
const chanpinZujian = dataManager
.data
.chanpin_zujians
.find
(
cz => cz
.id == chanpinZujianId
);
if
(!chanpinZujian || !chanpinZujian
.bancai
) {
return;
}
const bancai = chanpinZujian
.bancai;
const option =
$('<option>'
)
.val(bancai
.id
)
.text
(formatBancaiInfo
(bancai
));
$bancaiSelect
.append
(option
);
if
(bancaiId
) {
$bancaiSelect
.val(bancaiId
).trigger
('change'
);
}
$bancaiSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择板材',
allowClear: true
}
).prop
('disabled', true
);
$bancaiSelect
.prop
('disabled', true
);
$addBancaiBtn
.prop
('disabled', true
);
$orderQuantityInput
.prop
('disabled', false
);
// 检查提交条件
checkSubmitCondition
();
} else {
// 加载所有板材
const bancais = dataManager
.data
.bancais || [];
bancais
.forEach
(bancai => {
const option =
$('<option>'
)
.val(bancai
.id
)
.text
(formatBancaiInfo
(bancai
));
$bancaiSelect
.append
(option
);
}
);
$addBancaiBtn
.prop
('disabled', false
);
if
(bancaiId
) {
$bancaiSelect
.val(bancaiId
).trigger
('change'
);
}
$bancaiSelect
.select2
({
theme: 'bootstrap',
placeholder: '请选择板材',
allowClear: true
}
).prop
('disabled', false
);
}
}
// 新增函数：格式化板材信息
function formatBancaiInfo
(bancai
) {
let info = `厚度:
${bancai
.houdu}mm, 材质: `;
if
(bancai
.caizhi
) {
info += bancai
.caizhi
.name;
}
if
(bancai
.mupi1
) {
info += `, 木皮1:
${bancai
.mupi1
.name}
${bancai
.mupi1
.you ? '
(油
)' : ''}`;
}
if
(bancai
.mupi2
) {
info += `, 木皮2:
${bancai
.mupi2
.name}
${bancai
.mupi2
.you ? '
(油
)' : ''}`;
}
return info;
}
// 显示实体模态框（添加产品/组件）
function showEntityModal
(title, entityType, entityId, initialData,source="component"
) {
$('#modalTitle'
).text
(title
);
const
$formFields =
$('#formFields'
);
$formFields
.empty
();
// 根据实体类型生成表单字段
switch
(entityType
) {
case ENTITY_DINGDAN:
$formFields
.append
(`
<div class="form-group">
<label>订单编号</label>
<input type="text" class="form-control" name="number"
value="
${initialData
.number || ''}" required>
</div>
<div class="form-group">
<label>下单日期</label>
<input type="date" class="form-control" name="xiadan"
value="
${initialData
.xiadan || ''}" required>
</div>
<div class="form-group">
<label>交货日期</label>
<input type="date" class="form-control" name="jiaohuo"
value="
${initialData
.jiaohuo || ''}">
</div>
`
);
break;
case 'dingdan_chanpin': // 订单产品
const chanpins = dataManager
.data
.chanpins || [];
let chanpinOptions = '<option
value="">选择产品</option>';
chanpinOptions += '<option
value="new">+ 创建新产品</option>';
if
(chanpins
.length > 0
) {
chanpins
.forEach
(cp => {
chanpinOptions += `
<option
value="
${cp
.id}"
${initialData
.chanpin
.id == cp
.id ? 'selected' : ''}>
${cp
.bianhao}
</option>
`;
}
);
}
$formFields
.append
(`
<div class="form-group">
<label>产品</label>
<div class="input-group">
<select class="form-control" name="chanpin" id="chanpinSelectModal" required>
${chanpinOptions}
</select>
<span class="input-group-btn">
<button class="btn btn-info" id="createChanpinBtn">新建</button>
</span>
</div>
</div>
<div class="form-group">
<label>数量</label>
<input type="number" class="form-control" name="shuliang"
value="
${initialData
.shuliang || 1}" min="1" required>
</div>
<input type="hidden" name="dingdan"
value="
${initialData
.dingdan
.id}">
`
);
// 添加新建产品按钮事件
$('#createChanpinBtn'
).on
('click', function
() {
showCreateEntityModal
('创建新产品', ENTITY_CHANPIN, null, {
bianhao: '',
name: ''
}
);
}
);
// 产品选择变化
$('#chanpinSelectModal'
).on
('change', function
() {
if
($(this
).val() === 'new'
) {
showCreateEntityModal
('创建新产品', ENTITY_CHANPIN, null, {
bianhao: '',
}
);
$(this
).val(''
); // 重置选择
}
}
);
break;
case 'chanpin_zujian': // 产品组件
const zujians = dataManager
.data
.zujians || [];
const bancais = dataManager
.data
.bancais || [];
let zujianOptions = '<option
value="">选择组件</option>';
zujianOptions += '<option
value="new">+ 创建新组件</option>';
let bancaiOptions = '<option
value="">选择板材</option>';
bancaiOptions += '<option
value="new">+ 创建新板材</option>';
if
(zujians
.length > 0
) {
zujians
.forEach
(zj => {
zujianOptions += `
<option
value="
${zj
.id}"
${initialData
.zujian
.id == zj
.id ? 'selected' : ''}>
${zj
.name}
</option>
`;
}
);
}
if
(bancais
.length > 0
) {
bancais
.forEach
(bc => {
let bcInfo = `厚度:
${bc
.houdu}mm`;
if
(bc
.caizhi
) bcInfo += `, 材质:
${bc
.caizhi
.name}`;
if
(bc
.mupi1
) bcInfo += `, 木皮1:
${bc
.mupi1
.name}`;
if
(bc
.mupi2
) bcInfo += `, 木皮2:
${bc
.mupi2
.name}`;
bancaiOptions += `
<option
value="
${bc
.id}"
${initialData
.bancai
.id == bc
.id ? 'selected' : ''}>
${bcInfo}
</option>
`;
}
);
}
$formFields
.append
(`
<div class="form-group">
<label>组件</label>
<div class="input-group">
<select class="form-control" name="zujian" id="zujianSelectModal" required>
${zujianOptions}
</select>
<span class="input-group-btn">
<button class="btn btn-info" id="createZujianBtn">新建</button>
</span>
</div>
</div>
<div class="form-group">
<label>板材</label>
<div class="input-group">
<select class="form-control" name="bancai" id="bancaiSelectModal" required>
${bancaiOptions}
</select>
<span class="input-group-btn">
<button class="btn btn-info" id="createBancaiBtn">新建</button>
</span>
</div>
</div>
<div class="form-group">
<label>一张板出多少组件</label>
<input type="number" class="form-control" name="one_howmany"
value="
${initialData
.one_howmany || 1}" min="0
.01" step="0
.01" required>
</div>
<input type="hidden" name="chanpin"
value="
${initialData
.chanpin
.id}">
`
);
// 添加新建按钮事件
$('#createZujianBtn'
).on
('click', function
() {
showCreateEntityModal
('创建新组件', ENTITY_ZUJIAN, null, {
name: ''
}
);
}
);
$('#createBancaiBtn'
).on
('click', function
() {
showCreateEntityModal
('创建新板材', ENTITY_BANCAI, null, {
houdu: 0
.0
}, 'component'
); // 添加来源标识
}
);
// 组件选择变化
$('#zujianSelectModal'
).on
('change', function
() {
if
($(this
).val() === 'new'
) {
showCreateEntityModal
('创建新组件', ENTITY_ZUJIAN, null, {
name: ''
}
);
$(this
).val(''
); // 重置选择
}
}
);
// 板材选择变化
$('#bancaiSelectModal'
).on
('change', function
() {
if
($(this
).val() === 'new'
) {
showCreateEntityModal
('创建新板材', ENTITY_BANCAI, null, {
houdu: 0
.0
}
);
$(this
).val(''
); // 重置选择
}
}
);
break;
}
// 显示模态框
$('#entityModal'
).modal
('show'
);
// 模态框显示后初始化Select2
$('#entityModal'
).on
('shown
.bs
.modal', function
() {
// 产品模态框
if
(entityType === 'dingdan_chanpin'
) {
$('#chanpinSelectModal'
).select2
({
theme: 'bootstrap',
placeholder: '选择产品或创建新产品',
allowClear: true,
width: '
100%'
}
);
}
// 组件模态框
if
(entityType === 'chanpin_zujian'
) {
$('#zujianSelectModal'
).select2
({
theme: 'bootstrap',
placeholder: '选择组件或创建新组件',
allowClear: true,
width: '
100%'
}
);
$('#bancaiSelectModal'
).select2
({
theme: 'bootstrap',
placeholder: '选择板材或创建新板材',
allowClear: true,
width: '
100%'
}
);
}
}
);
alert
// 模态框关闭时只销毁当前模态框内的Select2
$('#entityModal'
).on
('hidden
.bs
.modal', function
() {
$(this
).find
('
.select2-container'
).remove
();
}
);
// 存储当前操作的实体信息
$('#entityModal'
).data
('entity', {
type: entityType,
id: entityId
}
);
}
// 显示创建实体模态框（新产品/新组件/新板材）
function showCreateEntityModal
(title, entityType, entityId, initialData
) {
$('#createEntityModalTitle'
).text
(title
);
const
$formFields =
$('#createEntityFields'
);
$formFields
.empty
();
// 根据实体类型生成表单字段
switch
(entityType
) {
case ENTITY_CHANPIN: // 新产品
$formFields
.append
(`
<div class="form-group">
<label>产品编号</label>
<input type="text" class="form-control" name="bianhao"
value="
${initialData
.bianhao || ''}" required>
</div>
`
);
break;
case ENTITY_ZUJIAN: // 新组件
$formFields
.append
(`
<div class="form-group">
<label>组件名称</label>
<input type="text" class="form-control" name="name"
value="
${initialData
.name || ''}" required>
</div>
`
);
break;
case ENTITY_BANCAI: // 新板材
const caizhis = dataManager
.data
.caizhis || [];
const mupis = dataManager
.data
.mupis || [];
let caizhiOptions = '<option
value="">选择材质</option>';
let mupi1Options = '<option
value="">选择木皮1</option>';
let mupi2Options = '<option
value="">选择木皮2</option>';
if
(caizhis
.length > 0
) {
caizhis
.forEach
(cz => {
caizhiOptions += `<option
value="
${cz
.id}">
${cz
.name}</option>`;
}
);
}
if
(mupis
.length > 0
) {
mupis
.forEach
(mp => {
mupi1Options += `<option
value="
${mp
.id}">
${mp
.name}
${mp
.you ? '
(油
)' : ''}</option>`;
mupi2Options += `<option
value="
${mp
.id}">
${mp
.name}
${mp
.you ? '
(油
)' : ''}</option>`;
}
);
}
$formFields
.append
(`
<div class="form-group">
<label>厚度
(mm
)</label>
<input type="number" class="form-control" name="houdu"
value="
${initialData
.houdu || 0
.0}" step="0
.1" min="0
.1" required>
</div>
<div class="form-group">
<label>材质</label>
<div class="input-group">
<select class="form-control" name="caizhi" required>
${caizhiOptions}
</select>
<span class="input-group-btn">
<button class="btn btn-default" id="createCaizhiBtn">新建</button>
</span>
</div>
</div>
<div class="form-group">
<label>木皮1</label>
<div class="input-group">
<select class="form-control" name="mupi1">
${mupi1Options}
</select>
<span class="input-group-btn">
<button class="btn btn-default" id="createMupiBtn">新建</button>
</span>
</div>
</div>
<div class="form-group">
<label>木皮2</label>
<div class="input-group">
<select class="form-control" name="mupi2">
${mupi2Options}
</select>
<span class="input-group-btn">
<button class="btn btn-default" id="createMupiBtn2">新建</button>
</span>
</div>
</div>
`
);
// 添加新建材质按钮事件
$('#createCaizhiBtn'
).on
('click', function
() {
showCreateEntityModal
('创建新材质', ENTITY_CAIZHI, null, {
name: ''
}
);
}
);
// 添加新建木皮按钮事件
$('#createMupiBtn, #createMupiBtn2'
).on
('click', function
() {
showCreateEntityModal
('创建新木皮', ENTITY_MUPI, null, {
name: '',
you: false
}
);
}
);
break;
case ENTITY_CAIZHI: // 新材质
$formFields
.append
(`
<div class="form-group">
<label>材质名称</label>
<input type="text" class="form-control" name="name"
value="
${initialData
.name || ''}" required>
</div>
`
);
break;
case ENTITY_MUPI: // 新木皮
$formFields
.append
(`
<div class="form-group">
<label>木皮名称</label>
<input type="text" class="form-control" name="name"
value="
${initialData
.name || ''}" required>
</div>
<div class="form-group">
<label>
<input type="checkbox" name="you"
${initialData
.you ? 'checked' : ''}>
是否有油漆
</label>
</div>
`
);
break;
}
// 显示模态框
$('#createEntityModal'
).modal
('show'
);
// 模态框显示后初始化Select2
$('#createEntityModal'
).on
('shown
.bs
.modal', function
() {
if
(entityType === ENTITY_BANCAI
) {
$('select[name="caizhi"], select[name="mupi1"], select[name="mupi2"]'
).select2
({
theme: 'bootstrap',
placeholder: '请选择',
allowClear: true,
width: '
100%'
}
);
}
}
);
// 模态框关闭时只销毁当前模态框内的Select2
$('#entityModal'
).on
('hidden
.bs
.modal', function
() {
$(this
).find
('
.select2-container'
).remove
();
}
);
// 存储当前操作的实体信息
$('#createEntityModal'
).data
('entity', {
type: entityType,
id: entityId
}
);
$('#createEntityModal'
).data
('source', source
);
}
// 保存实体（在添加产品/组件模态框中）
async function saveEntity
() {
const
$saveBtn =
$('#saveEntityBtn'
);
const originalText =
$saveBtn
.text
();
try {
// 显示加载状态
$saveBtn
.prop
('disabled', true
).html
('<i class="fa fa-spinner fa-spin"></i> 保存中
...'
);
const entityInfo =
$('#entityModal'
).data
('entity'
);
const formData = getFormData
('#entityForm'
);
let result;
if
(entityInfo
.id
) {
// 更新实体
result = await dataManager
.updateEntity
(entityInfo
.type, {
id: entityInfo
.id,
...formData
}
);
} else {
// 新增实体
result = await dataManager
.addEntity
(entityInfo
.type, formData
);
}
if
(result
.status === 200
) {
$('#entityModal'
).modal
('hide'
);
// 根据操作类型刷新对应的下拉列表
switch
(entityInfo
.type
) {
case ENTITY_DINGDAN:
await refreshDingdanList
();
break;
case 'dingdan_chanpin':
if
(formData
.dingdan && formData
.dingdan
.id
) {
await refreshChanpinList
(formData
.dingdan
.id,result
.data
.chanpin
.id
);
}
break;
case 'chanpin_zujian':
if
(formData
.chanpin && formData
.chanpin
.id
) {
await refreshZujianList
(formData
.chanpin
.id,result
.data
.zujian
.id
);
}
break;
}
} else {
alert
(`保存失败:
${result
.text}`
);
}
} catch
(error
) {
console
.error
('保存实体时出错:', error
);
alert
(`保存失败:
${error
.message}`
);
} finally {
// 恢复按钮状态
$saveBtn
.prop
('disabled', false
).text
(originalText
);
}
}
// 保存新实体（在创建实体模态框中）
async function saveNewEntity
() {
const
$saveBtn =
$('#saveNewEntityBtn'
);
const originalText =
$saveBtn
.text
();
try {
// 显示加载状态
$saveBtn
.prop
('disabled', true
).html
('<i class="fa fa-spinner fa-spin"></i> 保存中
...'
);
const entityInfo =
$('#createEntityModal'
).data
('entity'
);
const formData = getFormData
('#createEntityForm'
);
// 新增实体
const result = await dataManager
.addEntity
(entityInfo
.type, formData
);
if
(result
.status === 200
) {
$('#createEntityModal'
).modal
('hide'
);
const source =
$('#createEntityModal'
).data
('source'
);
// 根据来源处理不同逻辑
switch
(source
) {
case 'main':
// 主页面创建的板材，刷新主页面下拉框
refreshBancaiList
(null, result
.data
.id
);
break;
case 'component':
// 组件模态框中创建的板材，刷新父模态框
refreshParentDropdown
(entityInfo
.type, result
.data
);
break;
}
} else {
alert
(`创建失败:
${result
.text}`
);
}
} catch
(error
) {
console
.error
('创建实体时出错:', error
);
alert
(`创建失败:
${error
.message}`
);
} finally {
// 恢复按钮状态
$saveBtn
.prop
('disabled', false
).text
(originalText
);
}
}
// 刷新父模态框中的下拉框
function refreshParentDropdown
(entityType, newEntity
) {
// 获取父模态框中的相关下拉框
const
$parentModal =
$('#entityModal'
);
if
(!
$parentModal
.is
(':visible'
)) return;
const parentEntityType =
$parentModal
.data
('entity'
).type;
// 根据实体类型刷新对应的下拉框
if
(parentEntityType === 'dingdan_chanpin' && entityType === ENTITY_CHANPIN
) {
// 刷新产品下拉框
const
$select =
$('#chanpinSelectModal'
);
$select
.append
(`<option
value="
${newEntity
.id}" selected>
${newEntity
.bianhao}</option>`
);
$select
.select2
('destroy'
);
$select
.val(newEntity
.id
).trigger
('change'
);
$select
.select2
({
theme: 'bootstrap',
placeholder: '选择产品或创建新产品',
allowClear: true,
width: '
100%'
}
);
}
else if
(parentEntityType === 'chanpin_zujian'
) {
if
(entityType === ENTITY_ZUJIAN
) {
// 刷新组件下拉框
const
$select =
$('#zujianSelectModal'
);
$select
.append
(`<option
value="
${newEntity
.id}" selected>
${newEntity
.bianhao}</option>`
);
$select
.select2
('destroy'
);
$select
.val(newEntity
.id
).trigger
('change'
);
$select
.select2
({
theme: 'bootstrap',
placeholder: '选择组件或创建新组件',
allowClear: true,
width: '
100%'
}
);
}
else if
(entityType === ENTITY_BANCAI
) {
// 刷新板材下拉框
const
$select =
$('#bancaiSelectModal'
);
$select
.append
(`<option
value="
${newEntity
.id}" selected>
${formatBancaiInfo
(newEntity
)}</option>`
);
$select
.select2
('destroy'
);
$select
.val(newEntity
.id
).trigger
('change'
);
$select
.select2
({
theme: 'bootstrap',
placeholder: '选择板材或创建新板材',
allowClear: true,
width: '
100%'
}
);
}
else if
(entityType === ENTITY_CAIZHI
) {
// 刷新材质下拉框（在板材创建中）
const
$select =
$parentModal
.find
('select[name="caizhi"]'
);
$select
.append
(`<option
value="
${newEntityId}" selected>
${newEntity
.name}</option>`
);
$select
.select2
('destroy'
);
$select
.val(newEntity
.id
).trigger
('change'
);
$select
.select2
({
theme: 'bootstrap',
placeholder: '请选择',
allowClear: true,
width: '
100%'
}
);
}
else if
(entityType === ENTITY_MUPI
) {
// 刷新木皮下拉框（在板材创建中）
const
$select =
$parentModal
.find
('select[name="mupi1"], select[name="mupi2"]'
);
$select
.append
(`<option
value="
${newEntity
.id}" selected>
${newEntity
.name+newEntity
.you?"
(油
)":""}</option>`
);
$select
.select2
('destroy'
);
$select
.val(newEntity
.id
).trigger
('change'
);
$select
.select2
({
theme: 'bootstrap',
placeholder: '请选择',
allowClear: true,
width: '
100%'
}
);
}
}
}
// 获取表单数据
function getFormData
(selector
) {
const formData = {};
$(`
${selector} :input`
).each
(function
() {
const
$input =
$(this
);
const name =
$input
.attr
('name'
);
const type =
$input
.attr
('type'
);
if
(name
) {
if
(type === 'checkbox'
) {
formData[name] =
$input
.prop
('checked'
);
} else if
(type === 'radio'
) {
if
($input
.prop
('checked'
)) {
formData[name] =
$input
.val();
}
} else {
// 处理关联对象
if
(name === 'chanpin' || name === 'zujian' ||
name === 'bancai' || name === 'dingdan' ||
name === 'caizhi' || name === 'mupi1' || name === 'mupi2'
) {
formData[name] = { id:
parseInt($input
.val()) };
} else if
(name === 'one_howmany' || name === 'houdu'
) {
formData[name] = parseFloat
($input
.val());
} else if
(name === 'shuliang'
) {
formData[name] =
parseInt($input
.val());
} else {
formData[name] =
$input
.val();
}
}
}
}
);
return formData;
}
// 日期格式化辅助函数
function formatDate
(dateString
) {
if
(!dateString
) return '';
const date = new Date
(dateString
);
return `
${date
.getFullYear
()}-
${
(date
.getMonth
() + 1
).toString
().padStart
(2, '0'
)}-
${date
.getDate
().toString
().padStart
(2, '0'
)}`;
}
}
);
尽量简化压缩
博客介绍了代码“parseInt($(\#number\).val(), 10)”，其中10表示将结果转换成十进制，且默认就是十进制，该参数可以省略不写。
扫一扫
221
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
