Commit d406c80d by fengshuonan

添加部门完善

parent 7c797cca
@layout("/common/_container.html"){ @layout("/common/_dialog.html",{plugins:["laydate","sweet-alert","layer"],js:["/assets/modular/system/dept/dept_add.js"]}){
<div class="ibox float-e-margins"> <div class="container-fluid">
<div class="ibox-content"> <form id="deptForm" \@submit="submitForm">
<div class="form-horizontal" id="deptInfoForm">
<input type="hidden" id="id" value="">
<div class="row"> <div class="row">
<div class="col-sm-6 b-r"> <div class="col-6">
<#input id="simplename" name="部门名称" underline="true"/> <div class="form-group">
<h5>部门名称 <span class="text-danger">*</span></h5>
<#input id="fullname" name="部门全称" underline="true"/> <div class="controls">
<input v-model="simpleName" type="text" class="form-control">
<#input id="description" name="备注" underline="true"/>
</div> </div>
<div class="col-sm-6">
<#input id="num" name="排序" underline="true"/>
<#input id="pName" name="上级部门" readonly="readonly" hidden="pid"
clickFun="DeptInfoDlg.showDeptSelectTree(); return false;"
style="background-color: #ffffff !important;"/>
</div> </div>
<div class="form-group">
<h5>部门全称 <span class="text-danger">*</span></h5>
<div class="controls">
<input v-model="fullName" type="text" class="form-control">
</div> </div>
<!-- 父级部门的选择框 -->
<div id="parentDeptMenu" class="menuContent"
style="display: none; position: absolute; z-index: 200;">
<ul id="parentDeptMenuTree" class="ztree tree-box" style="width: 245px !important;"></ul>
</div> </div>
<div class="form-group">
<div class="row btn-group-m-t"> <h5>备注 <span class="text-danger">*</span></h5>
<div class="col-sm-10"> <div class="controls">
<#button btnCss="info" name="提交" id="ensure" icon="fa-check" clickFun="DeptInfoDlg.addSubmit()"/> <input v-model="description" type="text" class="form-control">
<#button btnCss="danger" name="取消" id="cancel" icon="fa-eraser" clickFun="DeptInfoDlg.close()"/>
</div> </div>
</div> </div>
</div> </div>
<div class="col-6">
<div class="form-group">
<h5>排序</h5>
<div class="controls">
<input v-model="sort" type="text" class="form-control">
</div> </div>
</div>
<div class="form-group">
<h5>上级部门 <span class="text-danger">*</span></h5>
<div class="controls">
<input v-model="pName" id="detpName" \@click="showDeptSelectTree" type="text" class="form-control" autocomplete="off">
<input v-model="pid" type="hidden" class="form-control">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="text-xs-right">
<button class="btn btn-info normal-button-width" \@click="ensure">提交</button>
<button class="btn btn-inverse normal-button-width m-l-10" \@click="close">取消</button>
</div>
</div>
</div>
</form>
</div> </div>
<script src="${ctxPath}/static/modular/system/dept/dept_info.js"></script>
@} @}
/**
* 用户详情对话框(可用于添加和修改对话框)
*/
var DeptInfoDlg = {
data: {
simpleName: "",
fullName: "",
description: "",
sort: "",
pid: "",
pName: ""
}
};
/**
* 关闭此对话框
*/
DeptInfoDlg.close = function () {
parent.layer.close(window.parent.Dept.layerIndex);
};
/**
* 验证表单
*/
DeptInfoDlg.validateForm = function () {
var data = DeptInfoDlg.data;
if (!data.simpleName) {
return "请输入部门名称";
}
if (!data.fullName) {
return "请输入上级部门名称";
}
if (!data.pid) {
return "请选择上级部门";
}
return true;
};
/**
* 提交添加用户
*/
DeptInfoDlg.addSubmit = function () {
var ajax = new $ax(Feng.ctxPath + "/dept/add", function (data) {
parent.Feng.success("添加成功!");
window.parent.Dept.table.refresh();
DeptInfoDlg.close();
}, function (data) {
parent.Feng.error("添加失败!" + data.responseJSON.message + "!");
});
ajax.set(DeptInfoDlg.data);
ajax.start();
};
$(function () {
DeptInfoDlg.app = new Vue({
el: '#deptForm',
data: DeptInfoDlg.data,
methods: {
submitForm: function (e) {
e.preventDefault();
},
showDeptSelectTree: function () {
var formName = encodeURIComponent("parent.DeptInfoDlg.app.pName");
var formId = encodeURIComponent("parent.DeptInfoDlg.app.pid");
var treeUrl = encodeURIComponent(Feng.ctxPath + "/dept/tree");
layer.open({
type: 2,
title: '部门选择',
area: ['300px', '400px'],
content: Feng.ctxPath + '/system/commonTree?formName=' + formName + "&formId=" + formId + "&treeUrl=" + treeUrl
});
},
ensure: function () {
var result = DeptInfoDlg.validateForm();
if (result === true) {
DeptInfoDlg.addSubmit();
} else {
Feng.alert(result);
}
},
close: function () {
DeptInfoDlg.close();
}
}
});
});
/**
* 初始化部门详情对话框
*/
var DeptInfoDlg = {
deptInfoData : {},
zTreeInstance : null,
validateFields: {
simplename: {
validators: {
notEmpty: {
message: '部门名称不能为空'
}
}
},
fullname: {
validators: {
notEmpty: {
message: '部门全称不能为空'
}
}
},
pName: {
validators: {
notEmpty: {
message: '上级名称不能为空'
}
}
}
}
};
/**
* 清除数据
*/
DeptInfoDlg.clearData = function() {
this.deptInfoData = {};
}
/**
* 设置对话框中的数据
*
* @param key 数据的名称
* @param val 数据的具体值
*/
DeptInfoDlg.set = function(key, val) {
this.deptInfoData[key] = (typeof value == "undefined") ? $("#" + key).val() : value;
return this;
}
/**
* 设置对话框中的数据
*
* @param key 数据的名称
* @param val 数据的具体值
*/
DeptInfoDlg.get = function(key) {
return $("#" + key).val();
}
/**
* 关闭此对话框
*/
DeptInfoDlg.close = function() {
parent.layer.close(window.parent.Dept.layerIndex);
}
/**
* 点击部门ztree列表的选项时
*
* @param e
* @param treeId
* @param treeNode
* @returns
*/
DeptInfoDlg.onClickDept = function(e, treeId, treeNode) {
$("#pName").attr("value", DeptInfoDlg.zTreeInstance.getSelectedVal());
$("#pid").attr("value", treeNode.id);
}
/**
* 显示部门选择的树
*
* @returns
*/
DeptInfoDlg.showDeptSelectTree = function() {
var pName = $("#pName");
var pNameOffset = $("#pName").offset();
$("#parentDeptMenu").css({
left : pNameOffset.left + "px",
top : pNameOffset.top + pName.outerHeight() + "px"
}).slideDown("fast");
$("body").bind("mousedown", onBodyDown);
}
/**
* 隐藏部门选择的树
*/
DeptInfoDlg.hideDeptSelectTree = function() {
$("#parentDeptMenu").fadeOut("fast");
$("body").unbind("mousedown", onBodyDown);// mousedown当鼠标按下就可以触发,不用弹起
}
/**
* 收集数据
*/
DeptInfoDlg.collectData = function() {
this.set('id').set('simplename').set('fullname').set('description').set('num').set('pid');
}
/**
* 验证数据是否为空
*/
DeptInfoDlg.validate = function () {
$('#deptInfoForm').data("bootstrapValidator").resetForm();
$('#deptInfoForm').bootstrapValidator('validate');
return $("#deptInfoForm").data('bootstrapValidator').isValid();
}
/**
* 提交添加部门
*/
DeptInfoDlg.addSubmit = function() {
this.clearData();
this.collectData();
if (!this.validate()) {
return;
}
//提交信息
var ajax = new $ax(Feng.ctxPath + "/dept/add", function(data){
Feng.success("添加成功!");
window.parent.Dept.table.refresh();
DeptInfoDlg.close();
},function(data){
Feng.error("添加失败!" + data.responseJSON.message + "!");
});
ajax.set(this.deptInfoData);
ajax.start();
}
/**
* 提交修改
*/
DeptInfoDlg.editSubmit = function() {
this.clearData();
this.collectData();
if (!this.validate()) {
return;
}
//提交信息
var ajax = new $ax(Feng.ctxPath + "/dept/update", function(data){
Feng.success("修改成功!");
window.parent.Dept.table.refresh();
DeptInfoDlg.close();
},function(data){
Feng.error("修改失败!" + data.responseJSON.message + "!");
});
ajax.set(this.deptInfoData);
ajax.start();
}
function onBodyDown(event) {
if (!(event.target.id == "menuBtn" || event.target.id == "parentDeptMenu" || $(
event.target).parents("#parentDeptMenu").length > 0)) {
DeptInfoDlg.hideDeptSelectTree();
}
}
$(function() {
Feng.initValidator("deptInfoForm", DeptInfoDlg.validateFields);
var ztree = new $ZTree("parentDeptMenuTree", "/dept/tree");
ztree.bindOnClick(DeptInfoDlg.onClickDept);
ztree.init();
DeptInfoDlg.zTreeInstance = ztree;
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment