@{
ViewBag.Title = "OperationSalary";
}
@*kendo upload*@
<link href="~/SourceResBase/KendoUI/styles/kendo.common.min.css" rel="stylesheet" />
<link href="~/SourceResBase/KendoUI/styles/kendo.rtl.min.css" rel="stylesheet" />
<link href="~/SourceResBase/KendoUI/styles/kendo.default.min.css" rel="stylesheet" />
@*<link href="~/SourceResBase/KendoUI/styles/kendo.blueopal.min.css" rel="stylesheet" />*@ @*这里显示树菜单显示为蓝色*@
<link href="~/SourceResBase/KendoUI/styles/kendo.common.min.css" rel="stylesheet" />
<script src="~/SourceResBase/KendoUI/js/jszip.min.js"></script>
@*<script src="~/SourceResBase/KendoUI/js/kendo.all.js"></script>*@
<script src="~/SourceResBase/KendoUI/js/kendo.all.min.js"></script>
<script src="~/SourceResBase/KendoUI/js/console.js"></script>
<script src="~/SourceResBase/KendoUI/js/cultures/kendo.culture.zh-CN.min.js"></script>
@*<script src="~/SourceResBase/KendoUI/js/messages/kendo.messages.zh-CN.min.js"></script>*@
@*kendo upload*@
<link href="~/SourceResBase/KendoUI/css/trueview/S.css" rel="stylesheet" />
<style type="text/css">
body {
margin: 0px;
padding: 0px;
}
#ShowNav {
height: auto;
}
.ImportNav {
display: none;
/*background-color: #eee;*/
height: 500px;
padding-top: 25px;
/*border:1px solid red;*/
}
.ImportBottonNav {
padding: 30px 0px 0px 30px;
width: 150px;
height: 150px;
border: 1px solid red;
}
#TopNav {
width: 100%;
height: 35px; /*border:1px solid red;*/
padding-left: 100px;
}
#TopNav div {
float: right;
}
#treeview .k-sprite {
background-image: url('../../SourceResBase/KendoUI/css/trueview/coloricons-sprite.png');
}
.folder {
background-position: 0 -16px;
}
#RightOneNav {
width: 100%;
height: auto;
min-height: 200px;
}
#ShowGride {
clear: both;
}
#ShowGride table td {
min-width: 18px;
}
/*.ShowFiles {
width: 60%;
float: left;
}*/
.BtnNav {
height: 50px;
}
.BtnNav div {
float: left;
}
/*.ShowFilesBtnC {
width: 15%;
height: 52px;
line-height: 52px;
float: right;
}
.ShowFilesBtnR {
width: 15%;
height: 52px;
line-height: 52px;
float: right;
}*/
</style>
<script>
</script>
<div class="nav">
<div class="row row-offcanvas row-offcanvas-left">
<div class="col-xs-12 col-sm-3 sidebar-offcanvas" id="sidebar">
<div class="list-group">
<a href="#" class="list-group-item active">组织结构</a>
<div href="#" class="list-group-item">
@*组织结构*@
<div id="example">
<div class="demo-section k-content">
<ul id="treeview">
<li data-expanded="true">
<span class="k-sprite folder"></span>
<a data-id="04F12BEB-D99D-43DF-AC9A-3042957D6BDA" data-Name="安泰环境工程技术有限公司" data-ParentID="00000000-0000-0000-0000-000000000000" onclick="Init.Click_EventS.ClickTree(this);" href="#">安泰环境工程技术有限公司</a>
<ul id="ShowDepartName">
@*tree部门菜单部分*@
@*<li data-expanded="true">
<span class="k-sprite folder"></span><a href="#">resources</a>
</li>
<li data-expanded="true">
<span class="k-sprite folder"></span><a href="#">resources</a>
</li>*@
</ul>
</li>
</ul>
</div>
</div>
@*组织结构*@
</div>
</div>
@*<div class="list-group">
<a href="#" class="list-group-item active">组织结构</a>
<a href="#" onclick="ImportMenu();" class="list-group-item">公司组织结构部分</a>
<a href="#" class="list-group-item">导出相关数据</a>
<a href="#" class="list-group-item">查询工资信息</a>
</div>*@
</div>
<div class="col-xs-12 col-sm-9">
<p class="pull-left visible-xs">
<button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">功能菜单</button>
</p>
<div id="RightOneNav">
<div id="ShowNav ">
@*<div class='demo-section k-content ShowFiles'>
<input name='files' id='files' type='file' /><span></span>
</div>*@
<div class="BtnNav">
<div class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal">导入工资信息</div>
<div class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModa2">导入年金信息</div>
<div class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal">导入水电费信息</div>
<div class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal">导入专项附加扣除信息</div>
<div class="btn btn-primary btn-sm" data-toggle="modal" data-target="#myModal">下载</div>
</div>
<div class="ModesNav">
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×
</button>
<h4 class="modal-title" id="myModalLabel">
请选择工资Excel文件上传
</h4>
</div>
<div class="modal-body">
<input name='files' id='files2' type='file' /><span></span>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
关闭
</button>
@*<button type="button" class="btn btn-primary">
提交更改
</button>*@
</div>
</div>
</div>
</div>
@*年金*@
<div class="modal fade" id="myModa2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×
</button>
<h4 class="modal-title" id="myModalLabel">
请选择年金Excel文件上传
</h4>
</div>
<div class="modal-body">
<input name='files' id='files_year_salary' type='file' /><span></span>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
关闭
</button>
@*<button type="button" class="btn btn-primary">
提交更改
</button>*@
</div>
</div>
</div>
</div>
@*年金*@
</div>
</div>
<div>
<input id="ShowSelectTime" data-bind="visible: isVisible,
enabled: isEnabled,
value: selectedDate,
events: { change: onChange }">
<div class="btn btn-primary btn-sm" onclick="Init.Click_EventS.CheckSelectGrid();">查询</div>
</div>
<div id="ShowGride">
</div>
<div class="box wide">
<h4>Console log</h4>
<div class="console"></div>
</div>
</div>
<div id="TopNav">
<div>
<div id="FileUploadNavs">
</div>
</div>
</div>
@*<div class="col-xs-12 col-lg-4">
<div>导入工资信息</div>
<div>导入nc信息</div>
<div>导入信息</div>
</div>*@
@*<div class="row">
<div class="col-xs-6 col-lg-4">
k1
</div>
<div class="col-xs-6 col-lg-4">
k1
</div><div class="col-xs-6 col-lg-4">
k1
</div>
</div>*@
<div class="ImportNav">
第二个子功能页面
</div>
</div>
</div>
</div>
<script type="text/javascript">
var Grids;
var Init = {
init: function () {
Init.LoadTree();//加载树结构
Init.LoadGride(null, null, null, null); // 加载 gride
Init.LoadKendos(); // 加载kendo 的部分
},
Tree: {
ClickTreeID: "",
ClickTreeParentID: "",
ClickTreeDataName: "",
Time:""
},
LoadKendos: function () {
kendo.culture("zh-CN");//设置语言
//$("#ShowSelectTime").kendoDatePicker({
// format: "yyyy-MM",// 显示格式
// value: new Date(2019,8),//默认时间
// start: "year",//渲染深度
// depth: "year",//控制渲染深度
// change: function () {
// var value = this.value;
// alert(value);
// },
// onChange: function () {
// var value = this.value;
// alert(333);
// alert(value);
// }
// });
var myDate = new Date();
var myy = myDate.getMonth();
var SelectTime = $("#ShowSelectTime").kendoDatePicker({
format: "yyyy年M月",// 显示格式
value: new Date(2019, myy),//默认时间
start: "year",//渲染深度
depth: "year",//控制渲染深度
change: function () {
// alert($("#ShowSelectTime").val());
var CheckTime = $("#ShowSelectTime").val();
Init.Tree.Time = CheckTime;
Grids.dataSource.read();// 点击时间进行查询刷新
}
}).data("kendoDatePicker");
SelectTime.element[0].disabled = true;
$("#treeview").kendoTreeView(); // 从新加图标
//upload
$("#files").kendoUpload({
localization: {
select: "选择文件"
},
async: {
saveUrl: "UploadSubmit",
removeUrl: "remove",
autoUpload: true
}
});
$("#files2").kendoUpload({
localization: {
select: "选择文件"
},
async: {
saveUrl: "PostSalary", // 工资上传excel
// removeUrl: "remove",
autoUpload: true
},
success: Init.Opention_EventS.Event_kendo_upload_PostSalary
});
$("#files_year_salary").kendoUpload({
localization: {
select: "选择文件"
},
async: {
saveUrl: "PostYearSalary", //年金上传excel
// removeUrl: "remove",
autoUpload: true
},
// success: onSuccess
});
//upload
},
LoadTree: function () {
$.ajax({
url: "LoadTree",
// data: kendo.stringify(para),
type: "POST",
async: false,
contentType: 'application/json; charset=utf-8',
dataType: "json",
success: function (data, textStatus, jqXHR) {
if (data) {
//$("#treeview").empty().append('<li data-expanded="true">< span class= "k-sprite folder" ></span ><a href="#">My Web Site</a>');
// console.log(data.length);
for (var i = 0; i < data.length; i++) {
$("#ShowDepartName").append('<li data-expanded="true"><span class= "k-sprite folder" ></span > <a data-id=' + data[i].ID + ' data-ParentID =' + data[i].ParentID + ' data-Name = ' + data[i].Name + ' onclick="Init.Click_EventS.ClickTree(this);" href="#">' + data[i].Name + '</a></li >');
// console.log(data[i].ID);
}
} else {
// alert(2);
}
},
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown);
}
});
},
LoadGride: function () {
console.log(Init.Tree.ClickTreeID);
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "LoadGride",
dataType: "json",
data: function () {
return {
ClickTreeID: Init.Tree.ClickTreeID,
ClickTreeParentID: Init.Tree.ClickTreeParentID,
ClickTreeDataName: Init.Tree.ClickTreeDataName,
Time: Init.Tree.Time
};
},
type: "POST"
}
},
pageSize: 10
});
// console.log(dataSource);
//分隔符
//var Data = null;
//$.ajax({
// url: "LoadGride",
// data: {
// ClickTreeID : ClickTreeID,
// ClickTreeParentID: ClickTreeParentID,
// ClickTreeDataName: ClickTreeDataName,
// Time:Time
// },
// type: "POST",
// async: false,
// // contentType: 'application/json; charset=utf-8',
// dataType: "json",
// success: function (data, textStatus, jqXHR) {
// if (data) {
// Data = data;
// } else {
// // alert(2);
// }
// },
// error: function (jqXHR, textStatus, errorThrown) {
// alert(errorThrown);
// }
//});
Grids = $("#ShowGride").kendoGrid({
height: 500,//高度
change: onChange,
dataBound: onDataBound,
dataBinding: onDataBinding,
selectable: "cell",//字符串‘row’表示可以选中一行,‘cell’ 表示可以选中一列,‘multiple, row’表示可以选中多行,‘multiple, cell’表示可以选中多列。
resizable: true,// 调整列大小
sortable: true,//排序
filterable: false,//头部筛选功能
// groupable: true,// 是否可以拖放到头部
sort: onSorting,
filter: onFiltering,
group: onGrouping,
page: onPaging,
groupExpand: onGroupExpand,
groupCollapse: onGroupCollapse,
pageable: {
refresh: false, //启用刷新按钮
page: 1,
pageSize: 20,
pageSizes: false, //可选单页数据量集合 【5, 10, 20, 50, 100】
messages: {
display: "{0} - {1} 共 {2} 条数据",
empty: "没有要显示的数据",
page: "Page",
of: "of {0}", // {0} is total amount of pages
itemsPerPage: "",
first: "首页",
previous: "前一页",
next: "下一页",
last: "最后一页",
},
buttonCount: 5
},
columns: [{
field: "Id",// create a column bound to the "age" field
title: "序号", // set its title to "Age"
filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}, {
field: "UserName",// create a column bound to the "name" field
title: "名称" // set its title to "Name"
, filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}, {
field: "CostAttribution",// create a column bound to the "age" field
title: "费用归集部门" // set its title to "Age"
, filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}, {
field: "GrantSalaryTime",// create a column bound to the "age" field
title: "工资发放时间" // set its title to "Age"
, filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}, {
field: "JobDepartment",// create a column bound to the "age" field
title: "工作部门" // set its title to "Age"
, filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}, {
field: "JobName",// create a column bound to the "age" field
title: "工作岗位名称" // set its title to "Age"
, filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}, {
field: "JobLevel",// create a column bound to the "age" field
title: "工作岗位分级" // set its title to "Age"
, filterable: false,
width: "150px",
attributes: {
style: "text-align: center;"
}
}],
dataSource: dataSource//Data
// [{ name: "Jane1", age: 30 }, { name: "John2", age: 33 }, { name: "John3", age: 33 }, { name: "John4", age: 33 }, { name: "John5", age: 33 }, { name: "John6", age: 33 }, { name: "John7", age: 33 }, { name: "John8", age: 33 }, { name: "John9", age: 33 }, { name: "John10", age: 33 }, { name: "John11", age: 33 }, { name: "John12", age: 33 }, { name: "John13", age: 33 }, { name: "John14", age: 33 }, { name: "John15", age: 33 }]
}).data("kendoGrid");;
},
Opention_EventS: {
Event_kendo_upload_PostSalary: function (e) {
if (e.response.Err && e.response.Err.length > 0) {
alert(e.response.Err);
} else if (e.response.OK) { alert(e.response.OK); }
// alert(JSON.stringify(e.response));//后台传递过来的数据全部封装在response中
// 这里根据自己的需要做处理
$('#myModal').modal('hide');
}
},
Click_EventS: {
CheckSelectGrid: function () {
var CheckTime = $("#ShowSelectTime").val();
Init.Tree.Time = CheckTime;
Grids.dataSource.read();// 进行查询按钮刷新
},
ClickTree: function (e) {
var DataId = $(e).attr("data-id");//部门id
var DataParentID = $(e).attr("data-ParentID");//部门上级id
var DataName = $(e).attr("data-Name");
Init.Tree.ClickTreeID = DataId;
Init.Tree.ClickTreeParentID = DataParentID;
Init.Tree.ClickTreeDataName = DataName;
Grids.dataSource.read();// 点击tree进行查询刷新
}
}
//initend
};
//init
//上传
//
//loadgride
function onChange(arg) {
var selected = $.map(this.select(), function (item) {
return $(item).text();
});
kendoConsole.log("Selected: " + selected.length + " item(s), [" + selected.join(", ") + "]");
}
function onDataBound(arg) {
kendoConsole.log("Grid data bound");
}
function onDataBinding(arg) {
kendoConsole.log("Grid data binding");
}
function onSorting(arg) {
kendoConsole.log("Sorting on field: " + arg.sort.field + ", direction:" + (arg.sort.dir || "none"));
}
function onFiltering(arg) {
kendoConsole.log("Filter on " + kendo.stringify(arg.filter));
}
function onPaging(arg) {
kendoConsole.log("Paging to page index:" + arg.page);
}
function onGrouping(arg) {
kendoConsole.log("Group on " + kendo.stringify(arg.groups));
}
function onGroupExpand(arg) {
kendoConsole.log("The group to be expanded: " + kendo.stringify(arg.group));
}
function onGroupCollapse(arg) {
kendoConsole.log("The group to be collapsed: " + kendo.stringify(arg.group));
}
//loadgride
Init.init();
</script>