365 lines
14 KiB
JavaScript
365 lines
14 KiB
JavaScript
var oTable;
|
|
var aPos;
|
|
|
|
$(document).ready(function () {
|
|
var dataTables = {
|
|
init: function init() {
|
|
this.bindUIActions();
|
|
},
|
|
bindUIActions: function bindUIActions() {
|
|
this.table = this.handleDataTables();
|
|
},
|
|
handleDataTables: function handleDataTables() {
|
|
return $('#myTable').DataTable({
|
|
language: {
|
|
paginate: {
|
|
previous: '<i class="fa fa-lg fa-angle-left"></i>',
|
|
next: '<i class="fa fa-lg fa-angle-right"></i>'
|
|
}
|
|
},
|
|
autoWidth: false,
|
|
ajax: {
|
|
url: 'api/usersList.ashx',
|
|
dataSrc: 'userlist'
|
|
},
|
|
rowId: 'user_uid',
|
|
deferRender: true,
|
|
initComplete: function () {
|
|
|
|
$('#myTable').on('click', 'a', function () {
|
|
buttonClick(this);
|
|
});
|
|
|
|
$('#myTable').on('change', 'input[name="selectedRow[]"]', function () {
|
|
checkboxClick(this);
|
|
});
|
|
},
|
|
columns: [{ data: 'user_name', className: 'align-middle' }, { data: 'user_id', className: 'align-middle' }, { data: 'user_email', className: 'align-middle' }, { data: 'user_lastlogin', className: 'align-middle' }, { data: 'user_uid', className: 'align-middle text-right', orderable: false, searchable: false }],
|
|
columnDefs: [{
|
|
targets: 0,
|
|
render: function render(data, type, row, meta) {
|
|
return '<a href="#' + row.user_uid + '" class="tile tile-img mr-1">\n <img class="img-fluid" src="' + row.user_picurl + '" alt="Card image cap">\n </a>\n <a href="#' + row.user_uid + '">' + row.user_name + '</a>';
|
|
}
|
|
}, {
|
|
targets: 4,
|
|
render: function render(data, type, row, meta) {
|
|
return '<a id="table-btn" class="btn btn-sm btn-secondary" href="javascript: return false;" data-method="edit" data-uid="' + row.user_uid + '"><i class="fa fa-pencil-alt"></i></a>\n <a id="table-btn" class="btn btn-sm btn-secondary" href="javascript: return false;" data-method="del" data-uid="' + row.user_uid + '"><i class="far fa-trash-alt"></i></a>';
|
|
}
|
|
}]
|
|
});
|
|
}
|
|
};
|
|
|
|
dataTables.init();
|
|
|
|
function buttonClick(obj) {
|
|
$("#elab_select option").remove();
|
|
|
|
$.ajax({
|
|
url: "api/elab-userslist.ashx",
|
|
type: "POST",
|
|
data: null,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret === "yes") {
|
|
$("#elab_select").append($("<option></option>").attr("value", "").text("請選擇要加入的E白板帳號... "));
|
|
|
|
$.each(data.userslist, function (i, item) {
|
|
$("#elab_select").append($("<option></option>").attr("value", item.userid).text(item.username + ' (' + item.mail + ')'));
|
|
});
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('网絡或伺服器发生错误，请稍后重试!');
|
|
}
|
|
});
|
|
|
|
oTable = $('#myTable').dataTable();
|
|
|
|
var type = obj.getAttribute('data-method');
|
|
var uid = obj.getAttribute('data-uid');
|
|
|
|
aPos = oTable.fnGetPosition($('#' + uid)[0]);
|
|
|
|
$("#user_uid").val(uid);
|
|
|
|
$("#method").val(type);
|
|
|
|
if (type === 'del') {
|
|
if (confirm('確定刪除此筆資料?')) {
|
|
var formData = {
|
|
uid: uid,
|
|
method: 'delete'
|
|
};
|
|
|
|
$.ajax({
|
|
url: "api/userData.ashx",
|
|
type: "POST",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
|
|
var row = oTable.api().row($("#" + uid)).remove().draw(false);
|
|
alert('刪除成功');
|
|
} else {
|
|
alert(data.message);
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('网絡或伺服器发生错误，请稍后重试!');
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
if (type === 'edit') {
|
|
var formData = {
|
|
method: 'get',
|
|
uid: uid
|
|
};
|
|
|
|
$.ajax({
|
|
url: "api/userData.ashx",
|
|
type: "POST",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret === "yes") {
|
|
if (data.data.user_type === "N") {
|
|
$("input[name=user_type][value='N']").prop("checked", true);
|
|
$("#sys").hide();
|
|
$("#elab").show();
|
|
$("#elab_select").append($("<option></option>").attr("value", data.data.user_id).text(data.data.user_name + ' (' + data.data.user_email + ')'));
|
|
$("#elab_select").val(data.data.user_id);
|
|
$("#elab_select").prop('disabled', true);
|
|
} else {
|
|
$("input[name=user_type][value='Y']").prop("checked", true);
|
|
$("#sys").show();
|
|
$("#elab").hide();
|
|
$("#sys_name").val(data.data.user_name);
|
|
$("#sys_id").val(data.data.user_id);
|
|
$("#sys_email").val(data.data.user_email);
|
|
$("#sys_pwd").val(data.data.user_pwd);
|
|
|
|
$('#sys_name').prop('readonly', true);
|
|
$('#sys_id').prop('readonly', true);
|
|
}
|
|
|
|
$("input[name=user_type]").prop("disabled", true);
|
|
|
|
$('#user_perm').val(data.data.user_perm);
|
|
|
|
$('#myModal').modal('toggle');
|
|
} else {
|
|
alert(data.message);
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('网絡或伺服器发生错误，请稍后重试!');
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
$('#btn-add').click(function () {
|
|
$("#elab_select option").remove();
|
|
|
|
$.ajax({
|
|
url: "api/elab-userslist.ashx",
|
|
type: "POST",
|
|
data: null,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
$("#elab_select").append($("<option></option>").attr("value", "").text("請選擇要加入的E白板帳號... "));
|
|
|
|
$.each(data.userslist, function (i, item) {
|
|
$("#elab_select").append($("<option></option>").attr("value", item.userid).text(item.username + ' (' + item.mail + ')'));
|
|
});
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('网絡或伺服器发生错误，请稍后重试!');
|
|
}
|
|
});
|
|
|
|
oTable = $('#myTable').dataTable();
|
|
$("#method").val("add");
|
|
$("#sys").hide();
|
|
$("input[name=user_type][value='N']").prop("checked", true);
|
|
|
|
$('#myModal').modal('toggle');
|
|
|
|
$('#sys_name').prop('readonly', false);
|
|
$('#sys_id').prop('readonly', false);
|
|
$("#elab_select").prop('disabled', false);
|
|
$("input[name=user_type]").prop("disabled", false);
|
|
|
|
$("input[name=user_type][value='Y']").prop("checked", true).trigger("change");
|
|
$("input[name=user_type][value='N']").prop("disabled", true);
|
|
$("#sys_id").val('').trigger('change');
|
|
$("#sys_pwd").val('').trigger('change');
|
|
$("#sys_email").val('').trigger('change');
|
|
|
|
});
|
|
|
|
$("#myModal").on("hidden.bs.modal", function () {
|
|
clearChildren(document.getElementById('myModal'));
|
|
$('#sys_name').prop('readonly', false);
|
|
$('#sys_id').prop('readonly', false);
|
|
$("#elab_select").prop('disabled', false);
|
|
$("input[name=user_type]").prop("disabled", false);
|
|
});
|
|
|
|
function clearChildren(element) {
|
|
for (var i = 0; i < element.childNodes.length; i++) {
|
|
var e = element.childNodes[i];
|
|
if (e.tagName) switch (e.tagName.toLowerCase()) {
|
|
case 'input':
|
|
switch (e.type) {
|
|
case "radio":
|
|
case "checkbox": e.checked = false; break;
|
|
case "button":
|
|
case "submit":
|
|
case "image": break;
|
|
default: if (e.type !== "checkbox") { e.value = ''; } break;
|
|
}
|
|
break;
|
|
case 'select': e.selectedIndex = 0; break;
|
|
case 'textarea': e.innerHTML = ''; break;
|
|
default: clearChildren(e);
|
|
}
|
|
}
|
|
|
|
$(element).children().find('textarea').each(function () {
|
|
$(this).val('');
|
|
});
|
|
|
|
$(element).children().find('select').each(function () {
|
|
$(this).prop('selectedIndex', 0);
|
|
});
|
|
}
|
|
|
|
$('input[type=radio][name=user_type]').change(function () {
|
|
if (this.value === 'N') {
|
|
$("#sys").hide();
|
|
$("#elab").show();
|
|
}
|
|
else if (this.value === 'Y') {
|
|
$("#sys").show();
|
|
$("#elab").hide();
|
|
}
|
|
});
|
|
|
|
$('#saveBtn').click(function () {
|
|
var errmsg = "";
|
|
|
|
if ($('input:radio:checked[name="user_type"]').val() === 'N' && $('select[name="elab_select"]').val() === '') {
|
|
errmsg += "請選擇要加入的E白板帳號! \n";
|
|
}
|
|
|
|
if ($('input:radio:checked[name="user_type"]').val() === 'Y' && $('#sys_name').val() === '') {
|
|
errmsg += "請輸入姓名! \n";
|
|
}
|
|
|
|
if ($('input:radio:checked[name="user_type"]').val() === 'Y' && $('#sys_id').val() === '') {
|
|
errmsg += "請輸入帳號! \n";
|
|
}
|
|
|
|
var emailRule = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z]+$/;
|
|
|
|
if ($('input:radio:checked[name="user_type"]').val() === 'Y' && $('#sys_email').val().search(emailRule) === -1) {
|
|
errmsg += "請輸入正確的Email! \n";
|
|
}
|
|
|
|
if ($('input:radio:checked[name="user_type"]').val() === 'Y' && $('#sys_pwd').val() === '' && $('#method').val() === 'add') {
|
|
errmsg += "請輸入密碼! \n";
|
|
}
|
|
|
|
if ($('#user_perm').val() === "") {
|
|
errmsg += "請選擇帳號的權限! \n";
|
|
}
|
|
|
|
|
|
if (errmsg.length > 0) {
|
|
alert(errmsg);
|
|
return;
|
|
}
|
|
|
|
var method = $('#method').val();
|
|
var user_type = $('input:radio:checked[name="user_type"]').val();
|
|
var elab_select = $('select[name="elab_select"]').val();
|
|
var sys_name = $('#sys_name').val();
|
|
var sys_id = $('#sys_id').val();
|
|
var sys_email = $('#sys_email').val();
|
|
var sys_pwd = $('#sys_pwd').val();
|
|
var user_perm = $('#user_perm').val();
|
|
var user_uid = $('#user_uid').val();
|
|
|
|
var formData = {
|
|
method: method,
|
|
type: user_type,
|
|
elab_select: elab_select,
|
|
sys_name: sys_name,
|
|
sys_id: sys_id,
|
|
sys_email: sys_email,
|
|
sys_pwd: sys_pwd,
|
|
user_perm: user_perm,
|
|
uid: user_uid
|
|
};
|
|
|
|
$.ajax({
|
|
url: "api/userData.ashx",
|
|
type: "POST",
|
|
data: formData,
|
|
success: function (data, textStatus, jqXHR) {
|
|
if (data.ret == "yes") {
|
|
|
|
|
|
alert("儲存成功");
|
|
|
|
if (method == "add") {
|
|
var obj = {
|
|
'user_name': data.data.user_name,
|
|
'user_id': data.data.user_id,
|
|
'user_email': data.data.user_email,
|
|
'user_lastlogin': '尚未登入',
|
|
'user_uid': data.data.user_uid,
|
|
'user_picurl': data.data.user_picurl
|
|
}
|
|
|
|
oTable.fnAddData(obj);
|
|
$('#myModal').modal('toggle');
|
|
}
|
|
|
|
if (method === "edit") {
|
|
oTable.fnUpdate(data.data.user_email, aPos, 2);
|
|
$('#myModal').modal('toggle');
|
|
}
|
|
|
|
//if (data_method == "edit") {
|
|
// oTable.fnUpdate(data.data.class_name, aPos, 2);
|
|
// oTable.fnUpdate(data.data.classArea_name, aPos, 3);
|
|
// oTable.fnUpdate(data.data.class_credit, aPos, 4);
|
|
// oTable.fnUpdate(data.data.class_instructor, aPos, 5);
|
|
// oTable.fnUpdate(data.data.class_fee, aPos, 6);
|
|
// //oTable.fnUpdate(data.data.class_signuprange, aPos, 7);
|
|
//}
|
|
|
|
//if (data_method == "add") {
|
|
// var obj = { 'DT_RowId': data.data.DT_RowId, 'class_edit': data.data.class_edit, 'class_no': data.data.class_no, 'class_name': data.data.class_name, 'classArea_name': data.data.classArea_name, 'class_credit': data.data.class_credit, 'class_instructor': data.data.class_instructor, 'class_fee': data.data.class_fee, 'class_signuprange': data.data.class_signuprange }
|
|
// var rowIndex = oTable.fnAddData(obj);
|
|
// var val = '<div class="checkbox"><label><input type="checkbox" name="classCompulsory[]" value="' + data.data.class_no + '"/>' + data.data.class_no + " " + data.data.class_name + '</label></div>';
|
|
// var chkbtn = $(val);
|
|
// chkbtn.appendTo('#chooseCompulsory');
|
|
//}
|
|
|
|
//$('#myModal').modal('toggle');
|
|
//clearChildren(document.getElementById('myModal'));
|
|
} else {
|
|
alert(data.message);
|
|
}
|
|
},
|
|
error: function (jqXHR, textStatus, errorThrown) {
|
|
alert('网絡或伺服器发生错误，请稍后重试!');
|
|
}
|
|
});
|
|
});
|
|
}); |