layui.use(['form', 'layer'], function () {
// 加载资源
var $ = layui.jquery, layer = layui.layer, form = layui.form;
form.render();
//模板ID
var freeshipping_id = Number($("#freeshipping_id").val());
//地区等级
var area_level = Number($("#area_level").val());
//剩余地区 id数据
var surplus_area_ids = $("#surplus_area_ids").val();
//剩余地区完整数据
var surplus_area = {};
//选中地区完整数据
var selected_area = {};
//提交表单数据
var submit_data = {};
//地区位置标识
var area_target = [0];
//操作类型
var opt_type = 1;
//当前操作序号
var opt_num = 0;
//总操作序号
var opt_total = 0;
//临时数据
var temp_area = {};
//layer弹框的标记
var layer_index;
//layer加载标记
var layer_load;
//ajax是否已经返回数据
var area_data_flag = false;
//是否已经点击提交按钮
var submit_flag = false;
/**
* 获取地区列表 立即执行
*/
(function () {
$.ajax({
type: "post",
url: ns.url('shop/express/getarealist'),
data: {
level: area_level,
},
dataType: 'json',
success: function (data) {
if (freeshipping_id == 0) {
surplus_area = copy_obj(data);
} else {
surplus_area = get_data_by_ids(data, surplus_area_ids);
submit_data = initSubmitData();
for (var num in submit_data) {
selected_area[num] = get_data_by_ids(data, submit_data[num]['area_ids']);
}
}
//改变地区加载标记 关闭弹框 重新渲染数据
area_data_flag = true;
if (layer_load) {
layer.close(layer_load);
if (opt_type == 2) {
// 将临时数据对象清零并重新赋值
temp_area = new Object();
temp_area = copy_obj(selected_area[opt_num]);
}
compile_new_data();
}
}
})
}());
/**
* 未选中数据
*/
function initSurplus(data) {
var area_list = get_area_ids(copy_obj(data));
$('.area_ids').each(function (i, e) {
var surplus_ids = JSON.parse($(e).val());
for (var level = count_obj(surplus_ids); level > 0; level--) {
for (var i in surplus_ids[level]) {
for (var i2 in surplus_ids[level][i]) {
area_list = delData(area_list, level, i, surplus_ids[level][i][i2]);
}
}
}
});
return JSON.stringify(area_list);
}
/**
* 提交数据
*/
function initSubmitData() {
var data = {};
var num = 1;
$('.area_ids').each(function (i, e) {
data[num] = {};
data[num]['area_ids'] = $(e).val();
data[num]['area_names'] = $(e).attr('data-name');
num++;
});
return data;
}
/**
* 删除指定数据
*/
function delData(list, level, pid, id) {
for (var i in list[level]) {
if (list[level] && list[level][pid] && level == 4) {
for (var i2 in list[level][pid]) {
if (list[level][pid][i2] && list[level][pid][i2] == id) {
delete list[level][pid][i2];
compactObj(list[level][pid]);
return list;
}
}
}
if (list[level] && list[level][pid]) {
for (var i2 in list[level][pid]) {
if (list[level][pid][i2] && list[level][pid][i2] == id && count_obj(list[level + 1][id]) == 0) {
delete list[level][pid][i2];
compactObj(list[level][pid]);
return list;
}
}
}
}
return list;
}
/**
* 渲染列表
*/
function compile_list(area_list, level, pid, html) {
if (!area_list[level] || !area_list[level][pid]) return html;
html += '
';
for (var id in area_list[level][pid]['child_list']) {
var item = area_list[level][pid]['child_list'][id];
if (item == undefined) {
continue;
}
var has_num = 0;
if (area_list[level + 1] && area_list[level + 1][id]) has_num = count_obj(area_list[level + 1][id]['child_list']);
var extended = item.extended ? item.extended : item.extended = 0;
var selected = item.selected ? item.selected : item.selected = 0;
var extended_html = extended == 0 ? '+' : '-';
var selected_html = selected == 1 ? 'selected' : '';
area_target[level] = item.id;
area_target = area_target.slice(0, level + 1);
html += '- ';
html += '
';
if (has_num > 0 && item.level != area_level) html += '
' + extended_html + '
';
else html += '
';
html += '
' + item.name + '
';
html += '
×
';
html += '
';
if (extended == 1 && has_num > 0) html += compile_list(area_list, level + 1, id, '');
html += ' ';
}
html += '
';
return html;
}
/**
* 渲染列表数据
*/
function compile_new_data() {
var surplus_html = compile_list(surplus_area, 1, 0, '');
$(".area-modal .all-area .box").html(surplus_html);
var temp_html = compile_list(temp_area, 1, 0, '');
$(".area-modal .selected-area .box").html(temp_html);
}
/**
* 统计对象属性个数
*/
function count_obj(obj) {
var count = 0;
if (!obj) return count;
for (var index in obj) {
count++
}
return count;
}
/**
* 拷贝一个对象
*/
function copy_obj(obj) {
var res = new Object();
for (var i in obj) {
res[i] = obj[i];
}
return res;
}
/**
* 向下遍历改变数据对象的状态
*/
function area_down_alter(area_list, level, pid, alter_res, key) {
if (area_list[level + 1] && area_list[level + 1][pid]) {
for (var id in area_list[level + 1][pid]['child_list']) {
var item = area_list[level + 1][pid]['child_list'][id];
if (item == undefined) {
continue;
}
item[key] = alter_res;
item['choosed'] = alter_res;
if (area_list[level + 2]) area_down_alter(area_list, level + 1, item['id'], alter_res, key);
}
}
}
/**
* 向上遍历改变数据对象的状态
*/
function area_up_alter(area_list, level, target, key) {
if (level > 1) {
var alter_res = 1;
for (var id in area_list[level][target[level - 1]]['child_list']) {
if (!area_list[level][target[level - 1]]['child_list'][id][key]) {
alter_res = 0;
break;
}
}
var choosed = 0;
for (var id in area_list[level][target[level - 1]]['child_list']) {
if (area_list[level][target[level - 1]]['child_list'][id] == undefined) {
continue;
}
if (area_list[level][target[level - 1]]['child_list'][id]['choosed'] == 1) {
choosed = 1;
break;
}
}
area_list[level - 1][target[level - 2]]['child_list'][target[level - 1]][key] = alter_res;
area_list[level - 1][target[level - 2]]['child_list'][target[level - 1]]['choosed'] = choosed;
area_up_alter(area_list, level - 1, target, key);
}
}
/**
* 处理数据
*/
function deal_data(area_list, key) {
var temp = {};
for (var level in area_list) {
var level_temp = {};
for (var pid in area_list[level]) {
var pid_temp = {child_list: {}};
var total_num = 0;
var del_num = 0;
for (var id in area_list[level][pid]['child_list']) {
if (area_list[level][pid]['child_list'][id] == undefined) {
continue;
}
total_num++;
if (area_list[level][pid]['child_list'][id]['choosed'] == 1) {
pid_temp['child_list'][id] = area_list[level][pid]['child_list'][id];
}
if (area_list[level][pid]['child_list'][id][key] == 1) {
delete area_list[level][pid]['child_list'][id];
del_num++;
}
if (pid_temp['child_list'][id]) {
pid_temp['child_list'][id][key] = 0;
pid_temp['child_list'][id]['choosed'] = 0;
}
}
if (count_obj(pid_temp['child_list']) > 0) {
pid_temp['child_num'] = area_list[level][pid]['child_num'] ? area_list[level][pid]['child_num'] : 0;
level_temp[pid] = pid_temp;
}
if (total_num == del_num && total_num > 0) delete area_list[level][pid];
}
if (count_obj(level_temp) > 0) temp[level] = level_temp;
}
return temp;
}
/**
* 合并两个对象
* selected 提供数据的对象
* receive 接收数据的对象
* 思路:如果receive没有就直接添加到receive 如果有就进入下层循环
*/
function combine_data(give, receive) {
for (var level in give) {
if (receive[level]) {
for (var pid in give[level]) {
if (receive[level][pid]) {
for (var id in give[level][pid]['child_list']) {
receive[level][pid]['child_list'][id] = give[level][pid]['child_list'][id];
}
} else {
receive[level][pid] = give[level][pid];
}
}
} else {
receive[level] = give[level];
}
}
}
/**
* 将选中地区结构转换为文字说明
* 思路:选中下级个数同总下级个数相同,说明选中全部,显示当前地区即可,否则要把下级地区也显示出来
*/
function alter_text(area_list, level, pid, html) {
var has_num = 0;
for (var id in area_list[level][pid]['child_list']) {
html += area_list[level][pid]['child_list'][id]['name'];
if (area_list[level + 1] && area_list[level + 1][id]) {
var alter_res = alter_text(area_list, level + 1, id, '');
if (alter_res['has_num'] == area_list[level + 1][id]['child_num']) {
has_num++;
} else {
html += '(';
html += alter_res['html'];
html += ')';
}
} else {
has_num++;
}
html += '、';
}
html = html.substring(0, html.length - 1);
return {
html: html,
has_num: has_num,
};
}
/**
* 编译表格
* 用在两个地方
* 1:在点击保存的时候编译添加和修改的所有模板项
* 2:在刚进入页面的时候初始化数据
*/
function compile_table() {
var html = '';
for (var index in submit_data) {
if (count_obj(submit_data[index]) > 0) {
html += '';
html += '| ';
html += ' ' + submit_data[index]['area_names'];
html += ' ';
html += ' | ';
html += '';
html += '修改';
html += ' | ';
html += '
';
}
}
$("#distributionArea tbody").html(html);
}
/**
* 获取ID数据对象
*/
function get_area_ids(area_list) {
var obj = {};
for (var level in area_list) {
obj[level] = {};
for (var pid in area_list[level]) {
obj[level][pid] = [];
for (var id in area_list[level][pid]['child_list']) {
obj[level][pid].push(id);
}
}
}
return obj;
}
/**
* 改变整个对象的某一属性
*/
function alter_data_attr(area_list, key, value) {
for (var level in area_list) {
for (var pid in area_list[level]) {
for (var id in area_list[level][pid]['child_list']) {
area_list[level][pid]['child_list'][id][key] = value;
}
}
}
}
/**
* 由id得到完整数据
*/
function get_data_by_ids(area_list, ids) {
var obj = JSON.parse(ids);
var temp = {};
for (var level in obj) {
var level_temp = {};
for (var pid in obj[level]) {
var pid_temp = {};
pid_temp['child_list'] = {};
for (var id in obj[level][pid]) {
var area_id = obj[level][pid][id];
pid_temp['child_list'][area_id] = area_list[level][pid]['child_list'][area_id];
}
pid_temp['child_num'] = area_list[level][pid]['child_num'];
level_temp[pid] = pid_temp;
}
temp[level] = level_temp;
}
return temp;
}
/**
* 展开与收起 思路为先改变数据 再重新渲染
*/
$("body").on('click', '.area-list .area-btn', function () {
var li = $(this).parent().parent();
var extended = li.attr('data-extended');
var level = li.attr('data-level');
var pid = li.attr('data-pid');
var id = li.attr('data-id');
var alter_res = extended == 1 ? 0 : 1;
if (surplus_area[level] && surplus_area[level][pid] && surplus_area[level][pid]['child_list'][id]) surplus_area[level][pid]['child_list'][id]['extended'] = alter_res;
if (temp_area[level] && temp_area[level][pid] && temp_area[level][pid]['child_list'][id]) temp_area[level][pid]['child_list'][id]['extended'] = alter_res;
compile_new_data();
});
/**
* 选中与取消 思路同展开与收起 也是先改变数据 再重新渲染
*/
$("body").on('click', '.area-list.all-area ul li .title-div .name-div', function () {
var li = $(this).parent().parent();
var selected = li.attr('data-selected');
var level = li.attr('data-level');
var pid = li.attr('data-pid');
var id = li.attr('data-id');
var target = li.attr('data-target');
target = target.split(',');
var alter_res = selected == 1 ? 0 : 1;
surplus_area[level][pid]['child_list'][id]['selected'] = alter_res;
surplus_area[level][pid]['child_list'][id]['choosed'] = alter_res;
area_down_alter(surplus_area, Number(level), id, alter_res, 'selected');
area_up_alter(surplus_area, Number(level), target, 'selected');
compile_new_data();
});
/**
* 将选中部分添加到已选中 思路为先遍历和处理数据 再渲染两边的列表
*/
$("body").on("click", ".area-modal .add", function () {
// 找到新选中部分
var choose = deal_data(surplus_area, 'selected');
combine_data(choose, temp_area);
compile_new_data();
});
/**
* 归还右边删除部分到左边
* 思路:相当于是执行了两步操作 1:选中 2:反向添加
*/
$("body").on("click", ".area-modal .area-list.selected-area .area-delete", function () {
// 改变状态
var li = $(this).parent().parent();
var level = li.attr('data-level');
var pid = li.attr('data-pid');
var id = li.attr('data-id');
var target = li.attr('data-target');
target = target.split(',');
var alter_res = 1;
temp_area[level][pid]['child_list'][id]['selected'] = alter_res;
temp_area[level][pid]['child_list'][id]['choosed'] = alter_res;
area_down_alter(temp_area, Number(level), id, alter_res, 'selected');
area_up_alter(temp_area, Number(level), target, 'selected');
// 找到 删除 合并
var choose = deal_data(temp_area, 'selected');
combine_data(choose, surplus_area);
compile_new_data();
});
/**
* 获取弹框html
*/
function get_modal_html() {
var modal_html = '';
modal_html += '' +
'' +
'' +
'' +
'
';
return modal_html;
}
/**
* 开始添加操作
*/
$("#distributionArea").on("click", ".js-add-record", function () {
//打开弹框
layer_index = layer.open({
title: '编辑配送区域',
type: 1,
area: ['700px', '542px'], //宽高
content: get_modal_html(),
});
opt_type = 1;
// 重置临时数据对象
temp_area = new Object();
compile_new_data();
if (area_data_flag == false) {
layer_load = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
}
});
/**
* 开始修改操作
*/
$("#distributionArea").on("click", ".opt-update", function () {
// 操作类型为添加
opt_type = 2;
// 确定正在操作的数据序列
opt_num = parseInt($(this).attr('data-selected'));
// 将临时数据对象清零并重新赋值
temp_area = new Object();
temp_area = copy_obj(selected_area[opt_num]);
//打开弹框
layer_index = layer.open({
title: '编辑配送区域',
type: 1,
area: ['700px', '542px'], //宽高
content: get_modal_html(),
});
// 渲染数据
compile_new_data();
if (area_data_flag == false) {
layer_load = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
}
});
/**
* 保存操作
*/
$("body").on("click", ".save-btn", function () {
let boxLength=$('#choice').children().length
if(boxLength==0){
layer.msg('已选地区不能为空', {icon: 5, anim: 6});
return false
}
layer.close(layer_index);
if (count_obj(temp_area) == 0) return;
if (opt_type == 1) {
opt_total++;
opt_num = opt_total;
// 选中地区数据
selected_area[opt_num] = new Object();
// 提交表单数据
submit_data[opt_num] = new Object();
}
submit_data[opt_num]['area_ids'] = new Object();
// 把临时数据变为正式数据
for (var per in temp_area) {
selected_area[opt_num][per] = temp_area[per];
}
submit_data[opt_num]['area_names'] = alter_text(temp_area, 1, 0, '')['html'];
// 编译数据表格
compile_table();
// 获取剩余地区和选中地区的ID数据
surplus_area_ids = JSON.stringify(get_area_ids(surplus_area));
submit_data[opt_num]['area_ids'] = JSON.stringify(get_area_ids(temp_area));
});
/**
* 取消操作
*/
$("body").on("click", ".area-modal .cancel-btn", function () {
layer.close(layer_index);
});
/**
* 删除操作
*/
$("#distributionArea").on("click", ".opt-delete", function () {
// 确定正在删除的数据序列是哪一个
opt_num = parseInt($(this).attr('data-selected'));
//询问框
layer_index = layer.confirm('确定要删除该记录吗', {
btn: ['确定', '取消'] //按钮
}, function () {
alter_data_attr(selected_area[opt_num], 'choosed', 1);
// 归还数据到总数据
combine_data(selected_area[opt_num], surplus_area);
// 销毁当前数据
delete selected_area[opt_num];
//selected_area[opt_num] = new Object();
// 销毁提交数据
delete submit_data[opt_num];
// submit_data[opt_num] = new Object();
// 删除当前行
$("tr[data-selected='" + opt_num + "']").remove();
layer.close(layer_index);
}, function () {
});
});
form.on('submit(save)', function (form_data) {
if (submit_flag == true) return false;
var url = ns.url('freeshipping://shop/freeshipping/add');
if (freeshipping_id) url = ns.url('freeshipping://shop/freeshipping/edit');
//过滤数据
var real_data = new Object();
for (var per in submit_data) {
if (count_obj(submit_data[per]) > 0) {
real_data[per] = submit_data[per];
}
}
var baoyouprice = $("input[name='price']").val();
if (parseFloat(baoyouprice) <= 0) {
layer.msg('包邮金额不能小于0', {icon: 5, anim: 6});
return false;
}
if (count_obj(real_data) == 0) {
layer.msg('至少要设置一个配送地区');
return false;
}
var data_json = {
'price': form_data['field']['price'],
'json': JSON.stringify(real_data),
'freeshipping_id': freeshipping_id,
'surplus_area_ids': surplus_area_ids
};
submit_flag = true;
$.ajax({
type: "post",
url: url,
data: data_json,
dataType: 'json',
success: function (res) {
submit_flag = false;
if (res.code == 0) {
layer.confirm('添加成功', {
title: '操作提示',
btn: ['返回列表', '继续添加'],
closeBtn: 0,
yes: function () {
location.href = ns.url('freeshipping://shop/freeshipping/lists');
},
btn2: function () {
location.href = ns.url('freeshipping://shop/freeshipping/add');
}
});
} else {
layer.msg(res.message);
}
}
});
// return false;
});
/**
* 去除对象中所有符合条件的对象
* @param {Object} obj 来源对象
*/
function compactObj(obj) {
if (!(typeof obj == 'object')) {
return;
}
for (var key in obj) {
if (obj.hasOwnProperty(key)
&& (obj[key] == null || obj[key] == undefined || obj[key] == '')) {
delete obj[key];
}
}
return obj;
}
});