280 lines
13 KiB
Plaintext
280 lines
13 KiB
Plaintext
@model NP.Model.VMMM
|
|
<div class="row">
|
|
<div class="col-sm-5">
|
|
<section class="panel panel-default">
|
|
<header class="panel-heading font-bold">메뉴 트리</header>
|
|
<div class="panel-body" id="treebox" style="overflow-y: auto;">
|
|
<div style="">
|
|
<ul class="box" id="menutree" style="display: none; list-style: none; padding: 10px 20px;">
|
|
@foreach (var m in Model.menus)
|
|
{
|
|
var visible = ViewBag.mtree.ToString().Contains("/" + (m.pmenuno) + "/");
|
|
var opended = ViewBag.mtree.ToString().Contains("/" + m.menuno + "/");
|
|
<li data-id="@m.menuno" data-pid="@m.pmenuno" class="@(m.menulevel > 0 ? "draggable" : "") @(m.ccount > 0 ? "isparent" : "") mg-l-@(m.menulevel) @(opended ? "opened" : m.menulevel == 0 || visible ? "" : "initdata")">
|
|
<a href="#" class="navicon"><span class="glyphicon glyphicon-@(m.ccount > 0 ? ((opended ? "minus" : "plus") + "-sign") : "asterisk")"></span></a>
|
|
<a href="#" class="naviname" onclick="smenu(this);">@m.menuname</a>
|
|
</li>
|
|
if (m.menulevel > 0 && m.ishid < 1)
|
|
{
|
|
@:
|
|
<li class="drop-desc drop-bottom"> </li>
|
|
}
|
|
}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="col-sm-7">
|
|
<section class="panel panel-default" id="menuinfobox">
|
|
<header class="panel-heading font-bold">메뉴등록</header>
|
|
<div class="panel-body">
|
|
<form id="mform" method="post" class="form-horizontal" enctype="multipart/form-data">
|
|
@Html.Hidden("mno")
|
|
@Html.HiddenFor(m => m.savedata)
|
|
@Html.HiddenFor(m => m.tabidx)
|
|
<div class="form-group">
|
|
<label class="col-lg-2 control-label">상위메뉴명</label>
|
|
<div class="col-lg-10">
|
|
@Html.HiddenFor(m => m.menu.pmenuno)@Html.TextBoxFor(m => m.menu.pmenuname, new { @placeholder = "상위메뉴를 선택하세요.", @class = "readinput form-control" })
|
|
</div>
|
|
</div>
|
|
<div class="line line-dashed line-lg pull-in"></div>
|
|
<div class="form-group">
|
|
<label class="col-lg-2 control-label">메뉴명</label>
|
|
<div class="col-lg-10">
|
|
@Html.HiddenFor(m => m.menu.menuno)@Html.TextBoxFor(m => m.menu.menuname, new { @class = "form-control" })
|
|
</div>
|
|
</div>
|
|
<div class="line line-dashed line-lg pull-in"></div>
|
|
<div class="form-group">
|
|
<label class="col-lg-2 control-label">메뉴URL</label>
|
|
<div class="col-lg-10">
|
|
@Html.TextBoxFor(m => m.menu.menuurl, new { @class = "form-control" })
|
|
</div>
|
|
</div>
|
|
<div class="line line-dashed line-lg pull-in"></div>
|
|
<div class="form-group">
|
|
<label class="col-lg-2 control-label">메뉴순서</label>
|
|
<div class="col-lg-10">
|
|
@Html.TextBoxFor(m => m.menu.menuorder, new { @class = "int form-control" })
|
|
</div>
|
|
</div>
|
|
<div class="line line-dashed line-lg pull-in"></div>
|
|
<div class="form-group">
|
|
<label class="col-lg-2 control-label">사용여부</label>
|
|
<div class="col-lg-10">
|
|
@Html.HiddenFor(m => m.menu.isuse)
|
|
@Html.Radio(new NP.Model.InputRadio() { Name = "iseuse", Selected = "1", Special = NP.Model.ENUM.Special.IsUse, ChangeId = "menu_isuse" })
|
|
</div>
|
|
</div>
|
|
<div class="line line-dashed line-lg pull-in"></div>
|
|
<div class="form-group">
|
|
<label class="col-lg-2 control-label">좌측메뉴에서 제외</label>
|
|
<div class="col-lg-10">
|
|
@Html.HiddenFor(m => m.menu.ishid)
|
|
@Html.Radio(new NP.Model.InputRadio() { Name = "ishid", Selected = "0", Special = NP.Model.ENUM.Special.IsExclude, ChangeId = "menu_ishid" })
|
|
</div>
|
|
</div>
|
|
<div class="line line-dashed line-lg pull-in"></div>
|
|
<div class="form-group">
|
|
<div class="col-sm-offset-2">
|
|
<a href="#" class="btn btn-info" id="btnchild" onclick="addnew();">하위메뉴추가</a>
|
|
<a href="#" class="btn btn-primary" id="btnsave" onclick="save();">저장</a>
|
|
<a href="#" class="btn btn-danger" id="btndelete" onclick="deletemenu();">삭제</a>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<style type="text/css">
|
|
ul#menutree li{margin-bottom: 3px;}
|
|
ul#menutree li span.glyphicon{font-size: 17px;}
|
|
ul#menutree li.mg-l-1{margin-top: 5px; border-top: 1px solid #ddd}
|
|
</style>
|
|
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
|
|
<script>
|
|
var pno = "menu_pmenuno";
|
|
var pname = "menu_pmenuname"
|
|
var mno = "menu_menuno";
|
|
var mname = "menu_menuname";
|
|
var murl = "menu_menuurl";
|
|
var moder = "menu_menuorder";
|
|
var isuse = "menu_isuse";
|
|
var ishid = "menu_ishid";
|
|
var _dragging = false;
|
|
function addnew() {
|
|
if (check(mno) || val(mno) === "0") {
|
|
msg("좌측 메뉴구조에서 상위메뉴를 선택한 후 메뉴추가를 해주세요.");
|
|
}
|
|
else {
|
|
$("ul#menutree li").removeClass("focus");
|
|
$("ul#menutree li[data-id=" + val(mno) + "]").addClass("focus");
|
|
rd(val(mno), val(mname), 0, "", "", 0, 1, 0);
|
|
focus(mname);
|
|
}
|
|
}
|
|
function save() {
|
|
if (check(pno) || val(pno) === "0") {
|
|
msg("좌측 메뉴구조에서 상위메뉴를 선택한 후 메뉴추가를 해주세요.");
|
|
}
|
|
else if (check(mname) || val(mname) === "") {
|
|
msg("메뉴명을 입력하세요.");
|
|
}
|
|
else if (confirm(val(mno) === "0" || val(mno) === "" ? "저장하시겠습니까?" : "수정하시겠습니까?")) {
|
|
$("#SaveData").val("");
|
|
cap("/acommon/SaveMenu", "mform", "cbsave", null, true);
|
|
}
|
|
}
|
|
function deletemenu() {
|
|
if (check(mno) || val(mno) == "0") {
|
|
msg("좌측 메뉴구조에서 삭제할 메뉴를 선택하신 후 삭제해주세요.");
|
|
}
|
|
else if (confirm("삭제하시겠습니까?")) {
|
|
if (confirm("해당메뉴를 삭제하면 하위메뉴 및 권한이 동시에 삭제됩니다. 정말 삭제하시겠습니까?")) {
|
|
cap("/acommon/DeleteMenu", "mform", "cbdel", null, true);
|
|
}
|
|
}
|
|
}
|
|
function cleardesc() {
|
|
$("#menutree div.drop-desc").css("background-color", "inherit");
|
|
$("#menutree li").css("background-color", "inherit");
|
|
}
|
|
//$(window).load(function () {
|
|
|
|
//뒤로가기하면, hidden 값들은 최종 바인딩시점의 값을 유지한다, (ajax에 의해 변경된 hidden 요소의 값은 유지되지 못한다.)
|
|
//hashback의 값이 initial 이 아니면 뒤로가기로 접근된 것이다.
|
|
//따라서 필요한 경우 initial 이 아닐경우 post 처리 해서 온전상 화면을 만들 수도 있겠다.
|
|
//또한, 뒤로가기 시 온전한 이전 ajax상태를 유지해야할 경우는 ajax 시점에 location.href.hash = "#" + hidden 값들 처리하고 load event의 initial 아닐 때 수동으로 데이터 바인딩 해줄 수도 있겠다.
|
|
//alert($("#hashback").val());
|
|
//});
|
|
$(document).ready(function () {
|
|
$("#menutree").show();
|
|
//$("#menutree li.draggable").draggable({
|
|
// start: function (event, ui) {
|
|
// $(this).draggable("option", "revert", true);
|
|
// $("#menutree li").css("zIndex", 10);
|
|
// $(this).css("zIndex", 100);
|
|
// _dragging = true;
|
|
// $("#SaveData").val($(this).attr("data-id"));
|
|
// $(".drop-desc").show();
|
|
// },
|
|
// stop: function () {
|
|
// _dragging = false;
|
|
// cleardesc();
|
|
// $(".drop-desc").hide();
|
|
// }
|
|
//});
|
|
//$("#menutree .drop-desc, #menutree li").droppable({
|
|
// drop: function (event, ui) {
|
|
// setv("mno", $("#SaveData").val());
|
|
// if ($(this).hasClass("drop-desc")) {
|
|
// if (confirm($(this).prev("li").find("a.naviname").text() + "의 아래로 이동하시겠습니까?")) {
|
|
// $("#SaveData").val($("#SaveData").val() + ":" + $(this).prev("li").attr("data-pid") + ":" + $(this).prev("li").attr("data-id"));
|
|
// //cap("/ZAXSystem/U2F2ZU1lbnU", "mform", "cbsave2", null, true);
|
|
// }
|
|
// }
|
|
// else {
|
|
// if (confirm($(this).find("a.naviname").text() + "의 하위메뉴로 이동하시겠습니까?")) {
|
|
// $("#SaveData").val($("#SaveData").val() + ":" + $(this).attr("data-id") + ":0");
|
|
// //cap("/ZAXSystem/U2F2ZU1lbnU", "mform", "cbsave2", null, true);
|
|
// }
|
|
// }
|
|
// },
|
|
// over: function () {
|
|
// cleardesc();
|
|
// if ($(this).hasClass("drop-desc")) {
|
|
// $(this).css("background-color", "#357ebd");
|
|
// }
|
|
// else {
|
|
// $(this).css("background-color", "#357ebd");
|
|
// }
|
|
// }
|
|
//});
|
|
$("#menutree li.isparent a.navicon").on("click", function () {
|
|
if ($(this).parent().hasClass("opened")) {
|
|
hideli("menutree", $(this).parent().attr("data-id"));
|
|
}
|
|
else {
|
|
showli("menutree", $(this).parent().attr("data-id"));
|
|
}
|
|
});
|
|
|
|
//저장 후 메뉴 포커싱
|
|
var vbmno = '@ViewBag.mno';
|
|
if (vbmno !== '0') {
|
|
_vbmno = vbmno;
|
|
$("#menutree li[data-id=" + vbmno + "]").addClass("focus");
|
|
//메뉴트리 collapse
|
|
//if (($("#menutree li[data-id='" + vbmno + "']").attr("data-pid") || '') != '') {
|
|
// collapse($("#menutree li[data-id='" + vbmno + "']").attr("data-pid"));
|
|
//}
|
|
//collapse(vbmno);
|
|
}
|
|
$("li.initdata").hide();
|
|
$("#isuse" + $("#menu_isuse").val()).prop("checked", true);
|
|
});
|
|
var _vbmno;
|
|
function collapse(ppid) {
|
|
var thispid = $("#menutree li[data-id='" + ppid + "']").attr("data-pid");
|
|
$("#menutree li[data-id='" + thispid + "'] a span").removeClass("glyphicon-plus-sign").addClass("glyphicon-minus-sign");
|
|
if ((thispid || '') != '') {
|
|
$("#menutree li[data-pid='" + thispid + "']").show().removeClass("initdata").addClass("opened");
|
|
collapse(thispid);
|
|
}
|
|
else {
|
|
$("#menutree li[data-id='" + ppid + "']").show().removeClass("initdata").addClass("opened");
|
|
}
|
|
}
|
|
function cbdel() {
|
|
if (capOK) {
|
|
$("#mno").val(0)
|
|
timesubmit();
|
|
}
|
|
}
|
|
function cbsave() {
|
|
if (capOK) {
|
|
if (val(mno) === "0") {
|
|
$("#mno").val(capResult.obj)
|
|
}
|
|
else {
|
|
$("#mno").val(val(mno))
|
|
}
|
|
timesubmit();
|
|
}
|
|
}
|
|
function cbsave2() {
|
|
if (capOK) {
|
|
timesubmit();
|
|
}
|
|
}
|
|
function smenu(a) {
|
|
if (!_dragging) {
|
|
$("ul#menutree li").removeClass("focus");
|
|
$(a).parents().addClass("focus");
|
|
$("#mno").val($(a).parent().attr("data-id"));
|
|
cap("/acommon/GetMenu", "mform", "cbsmenu", null, true);
|
|
}
|
|
}
|
|
function cbsmenu() {
|
|
if (capOK) {
|
|
var m = capResultObj;
|
|
rd(m.pmenuno, isempty(m.pmenuname) ? "최상위메뉴" : m.pmenuname, m.menuno, m.menuname, m.menuurl, m.menuorder, m.isuse, m.ishid);
|
|
focus("menu_menuname");
|
|
}
|
|
}
|
|
function rd(_pno, _pname, _no, _name, _url, _order, _isuse, _ishid) {
|
|
$("#" + pno).val(_pno);
|
|
$("#" + pname).val(_pname);
|
|
$("#" + mno).val(_no);
|
|
$("#" + mname).val(_name);
|
|
$("#" + murl).val(_url);
|
|
$("#" + moder).val(_order);
|
|
$("#" + isuse).val(_isuse);
|
|
$("#isuse" + _isuse).prop("checked", true);
|
|
$("#" + ishid).val(_ishid);
|
|
$("#ishid" + _ishid).prop("checked", true);
|
|
}
|
|
</script> |