279 lines
9.7 KiB
JavaScript
279 lines
9.7 KiB
JavaScript
var tmpNestableObj;
|
|
var tmpNestableItem;
|
|
|
|
$(document).ready(function () {
|
|
|
|
loadMediaCard();
|
|
|
|
$('#optionItemDialogSaveBtn').click(function () {
|
|
var method = $('#method').val();
|
|
var mediaItem_uid = $('#mediaItem_uid').val();
|
|
var optionItem_uid = $('#optionItem_uid').val();
|
|
var mediaItem_name = $('#mediaItem_name').val();
|
|
|
|
if (method == 'add') {
|
|
if (mediaItem_name == '') {
|
|
alert('請輸入項目名稱!');
|
|
return;
|
|
}
|
|
|
|
var formData = {
|
|
optionItem_uid: optionItem_uid,
|
|
mediaItem_name: mediaItem_name,
|
|
method: method
|
|
}
|
|
|
|
$.ajax({
|
|
url: "/AuthApi/addEditDelSpec",
|
|
type: "post",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
var obj = data.mediaItem;
|
|
|
|
tmpNestableObj.children().append(optionItemHtml(obj));
|
|
|
|
$('#optionItemModal').modal('toggle');
|
|
|
|
} else {
|
|
alert(data.message);
|
|
|
|
if (data.err_code == "99999") {
|
|
location.href = "/Root/Login";
|
|
}
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('網路或伺服器發生錯誤，請稍後重試!');
|
|
}
|
|
});
|
|
}
|
|
|
|
if (method == 'edit') {
|
|
if (mediaItem_name == '') {
|
|
alert('請輸入項目名稱!');
|
|
return;
|
|
}
|
|
|
|
var formData = {
|
|
mediaItem_uid: mediaItem_uid,
|
|
optionItem_uid: optionItem_uid,
|
|
mediaItem_name: mediaItem_name,
|
|
method: method
|
|
}
|
|
|
|
$.ajax({
|
|
url: "/AuthApi/addEditDelSpec",
|
|
type: "post",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
var obj = data.mediaItem;
|
|
|
|
tmpNestableItem.text(obj.mediaItem_name);
|
|
|
|
$('#optionItemModal').modal('toggle');
|
|
|
|
} else {
|
|
alert(data.message);
|
|
|
|
if (data.err_code == "99999") {
|
|
location.href = "/Root/Login";
|
|
}
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('網路或伺服器發生錯誤，請稍後重試!');
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
});
|
|
});
|
|
|
|
function loadMediaCard() {
|
|
var formData = {
|
|
option_uid: 'media'
|
|
}
|
|
|
|
$.ajax({
|
|
url: "/AuthApi/queryMediaSpecs",
|
|
type: "post",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
var obj = data.mediaSpecList;
|
|
var items = "";
|
|
$.each(obj, function (index, item) {
|
|
$('#card_group').append(cardHtml(item));
|
|
$('#' + item.optionItem_uid).nestable();
|
|
|
|
$('#' + item.optionItem_uid).on('change', function () {
|
|
nestableChange(this);
|
|
});
|
|
});
|
|
|
|
//items = '<ol class="dd-list">' + items + '</ol >';
|
|
|
|
//$('#nestable05').children().html(items);
|
|
|
|
// $('#nestable05').nestable();
|
|
|
|
// $('#nestable05').on('change', function () {
|
|
// nestableChange(this);
|
|
//});
|
|
|
|
} else {
|
|
alert(data.message);
|
|
|
|
if (data.err_code == "99999") {
|
|
location.href = "/Root/Login";
|
|
}
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('網路或伺服器發生錯誤，請稍後重試!');
|
|
}
|
|
});
|
|
}
|
|
|
|
function cardHtml(mediaOption) {
|
|
var html = "";
|
|
html += "<!-- grid column -->";
|
|
html += "<div class=\"col-lg-6\">";
|
|
html += " <!-- .card -->";
|
|
html += " <div class=\"card card-fluid\">";
|
|
html += " <div class=\"card-header border-bottom-0\"> " + mediaOption.optionItem_name + " </div><!-- .nestable -->";
|
|
html += " <div id=\"" + mediaOption.optionItem_uid + "\" class=\"dd\" data-toggle=\"sortable\" data-max-depth=\"1\" data-type=\"" + mediaOption.optionItem_uid + "\">";
|
|
html += " <!-- .dd-list -->";
|
|
html += " <ol class=\"dd-list\">";
|
|
html += " <li></li>";
|
|
|
|
$.each(mediaOption.mediaSpecList, function (index, item) {
|
|
html += optionItemHtml(item);
|
|
});
|
|
|
|
|
|
html += " </ol><!-- /.dd-list -->";
|
|
html += " </div><!-- /.nestable -->";
|
|
html += " <!-- .card-footer -->";
|
|
html += " <div class=\"card-footer\">";
|
|
html += " <a href=\"javascript: void(0);\" onclick=\"addItem(this)\" data-type=\"" + mediaOption.optionItem_uid + "\" class=\"card-footer-item justify-content-start\"><span><i class=\"fa fa-plus-circle mr-1\"></i> Add Menu Item</span></a>";
|
|
html += " </div><!-- /.card-footer -->";
|
|
html += " </div><!-- /.card -->";
|
|
html += "</div><!-- /grid column -->";
|
|
|
|
return html;
|
|
}
|
|
|
|
function optionItemHtml(item) {
|
|
var html = "<li class=\"dd-item\" data-id=\"".concat(item.mediaItem_uid, "\">\n <div class=\"dd-handle\">\n <span class=\"drag-indicator\"></span>\n <div data-name=\"option_name\">").concat(item.mediaItem_name, "</div>\n <div class=\"dd-nodrag btn-group ml-auto\">\n <button class=\"btn btn-sm btn-secondary\" data-parent-uid=\"").concat(item.optionItem_uid, "\" data-uid=\"").concat(item.mediaItem_uid, "\" onclick=\"editBtnClick(this);\">Edit</button>\n <button class=\"btn btn-sm btn-secondary\" data-parent-uid=\"").concat(item.optionItem_uid, "\" data-uid=\"").concat(item.mediaItem_uid, "\" onclick=\"delBtnClick(this);\" ><i class=\"far fa-trash-alt\"></i></button>\n </div>\n </li>");
|
|
return html;
|
|
}
|
|
|
|
function addItem(obj) {
|
|
//alert($(obj).attr("data-type"));
|
|
|
|
$('#optionItem_name').val($(obj).parent().parent().find('.card-header.border-bottom-0').text());
|
|
$('#method').val('add');
|
|
$('#optionItem_uid').val($(obj).attr("data-type"));
|
|
$('#optionItemModal').modal('toggle');
|
|
|
|
tmpNestableObj = $(obj).parent().parent().find('.dd');
|
|
|
|
|
|
}
|
|
|
|
function editBtnClick(obj) {
|
|
tmpNestableItem = $(obj).parent().parent().find("[data-name='option_name']");
|
|
var optionItem_name = $(obj).parent().parent().find("[data-name='option_name']").text();
|
|
var option_name = $(obj).parent().parent().parent().parent().parent().parent().find('.card-header.border-bottom-0').text();
|
|
|
|
$('#method').val('edit');
|
|
$('#option_name').val(option_name);
|
|
$('#optionItem_uid').val($(obj).attr("data-parent-uid"));
|
|
$('#mediaItem_uid').val($(obj).attr("data-uid"));
|
|
$('#optionItemModal').modal('toggle');
|
|
|
|
|
|
|
|
$('#mediaItem_name').val(optionItem_name).trigger("change");
|
|
|
|
$('#optionItemModal').modal('toggle');
|
|
}
|
|
|
|
function delBtnClick(obj) {
|
|
|
|
|
|
if (confirm('確定刪除此筆資料? 刪掉後，網紅中有勾選此項目的此項目紀錄會消失，新增一筆相同名稱的項目也無法復原!')) {
|
|
if (confirm('再次確認要刪除此筆資料?')) {
|
|
tmpNestableItem = $(obj).parent().parent().find("[data-name='option_name']");
|
|
var optionItem_name = $(obj).parent().parent().find("[data-name='option_name']").text();
|
|
var option_name = $(obj).parent().parent().parent().parent().parent().parent().find('.card-header.border-bottom-0').text();
|
|
var optionItem_uid = $(obj).attr("data-parent-uid");
|
|
var mediaItem_uid = $(obj).attr("data-uid");
|
|
|
|
var formData = {
|
|
mediaItem_uid: mediaItem_uid,
|
|
optionItem_uid: optionItem_uid,
|
|
method: 'del'
|
|
}
|
|
|
|
$.ajax({
|
|
url: "/AuthApi/addEditDelSpec",
|
|
type: "post",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
tmpNestableItem.parent().remove();
|
|
|
|
} else {
|
|
alert(data.message);
|
|
|
|
if (data.err_code == "99999") {
|
|
location.href = "/Root/Login";
|
|
}
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('網路或伺服器發生錯誤，請稍後重試!');
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
|
|
function nestableChange(obj) {
|
|
//alert($(obj).attr("data-type"));
|
|
//alert(window.JSON.stringify($(obj).nestable('serialize')));
|
|
|
|
var optionItem_uid = $(obj).attr("data-type");
|
|
var order_json = window.JSON.stringify($(obj).nestable('serialize'));
|
|
|
|
var formData = {
|
|
optionItem_uid: optionItem_uid,
|
|
order_json: order_json
|
|
}
|
|
|
|
$.ajax({
|
|
url: "/AuthApi/mediaSpecOrder",
|
|
type: "post",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
|
|
|
|
} else {
|
|
//alert(data.message);
|
|
|
|
if (data.err_code == "99999") {
|
|
location.href = "/Root/Login";
|
|
}
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('網路或伺服器發生錯誤，請稍後重試!');
|
|
}
|
|
});
|
|
} |