279 lines
13 KiB
Plaintext
279 lines
13 KiB
Plaintext
@model NP.Model.VMSystem
|
|
<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;">
|
|
@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.IsHidden < 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)
|
|
<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">메뉴유형</label>
|
|
<div class="col-lg-10">
|
|
@Html.HiddenFor(m => m.menu.MenuType)@Html.Partial("./Partial/Radio", Model.menu.MenuType, new ViewDataDictionary() { { "checked", Model.menu.MenuType }, { "special", "menutype" }, { "name", "MenuType" }, { "changeid", "menu_MenuType" } })
|
|
</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 = "IsUse", 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">
|
|
<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>
|
|
@section scriptscdn{
|
|
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
|
|
}
|
|
@section scripts{
|
|
<script>
|
|
var pno = "menu_PMenuNo";
|
|
var pname = "menu_PMenuName"
|
|
var mno = "menu_MenuNo";
|
|
var mname = "menu_MenuName";
|
|
var murl = "menu_MenuUrl";
|
|
var mtype = "menu_MenuType";
|
|
var moder = "menu_MenuOrder";
|
|
var isuse = "menu_IsUse";
|
|
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, $("ul#menutree li[data-pid=" + val(mno) + "]").length + 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("/SystemAX/SaveMenu", "mform", "cbsave", null, true);
|
|
}
|
|
}
|
|
function deletemenu() {
|
|
if (check(mno) || val(mno) == "0") {
|
|
msg("좌측 메뉴구조에서 삭제할 메뉴를 선택하신 후 삭제해주세요.");
|
|
}
|
|
else if (confirm("삭제하시겠습니까?")) {
|
|
if (confirm("해당메뉴를 삭제하면 하위메뉴 및 권한이 동시에 삭제됩니다. 정말 삭제하시겠습니까?")) {
|
|
cap("/SystemAX/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("/SystemAX/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.MenuType, m.MenuOrder, m.IsUse);
|
|
focus("menu_MenuName");
|
|
}
|
|
}
|
|
function rd(_pno, _pname, _no, _name, _url, _mtype, _order, _isuse) {
|
|
alert(_mtype);
|
|
_mtype = _mtype || "0";
|
|
$("#" + pno).val(_pno);
|
|
$("#" + pname).val(_pname);
|
|
$("#" + mno).val(_no);
|
|
$("#" + mname).val(_name);
|
|
$("#" + murl).val(_url);
|
|
$("#" + mtype).val(_mtype);
|
|
$("#" + moder).val(_order);
|
|
$("#" + isuse).val(_isuse);
|
|
$("#IsUse" + _isuse).prop("checked", true);
|
|
$("#MenuType" + _mtype).prop("checked", true);
|
|
}
|
|
</script>
|
|
} |