OA 框架

最新推荐文章于 2024-07-30 18:06:30 发布

dxm809

最新推荐文章于 2024-07-30 18:06:30 发布

阅读量1.2k

点赞数

分类专栏： Jquery EasyUI

Jquery EasyUI 专栏收录该内容

110 篇文章 0 订阅

订阅专栏

@{
Layout = null;
}

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>HomePage</title>
<link href="~/jquery-easyui-1.5.2/themes/default/easyui.css" rel="stylesheet" />
<link href="~/jquery-easyui-1.5.2/themes/icon.css" rel="stylesheet" />

<script src="~/jquery-easyui-1.5.2/jquery.min.js"></script>
<script src="~/jquery-easyui-1.5.2/jquery.easyui.min.js"></script>
<script src="~/jquery-easyui-1.5.2/locale/easyui-lang-zh_CN.js"></script>

<style>
.txt{
font-size:20px;
color:blue;
margin-top:15px;
margin-left:100px;
float:left;
}
</style>

<script>
function bindClickEvent() {
$('.detailLink').click(function () {
var title = $(this).text();
var url = $(this).attr('url');
var isExist = $('#tt').tabs('exists', title);
if (!isExist) {
$('#tt').tabs('add', {
title: title,
content: showContent(url),
closable: true
});
} else {
$('#tt').tabs('select', title);
}

});
}

function showContent(url) {
return '<iframe src='+url+' width="100%" height="100%" frameborder="0"></iframe>';
}

$(function () {
bindClickEvent();

})

</script>
</head>
<body class="easyui-layout">
<div data-options="region:'north',border:false" style="height: 80px; background: #B3DFDA; padding: 10px;
background-image: url('../../Content/Images/bg.png');">
<img src="~/Content/Images/logo.gif" style="float:left"/>
<span class="txt" >OA办公系统</span>
</div>

<div data-options="region:'west',split:true,title:'West'" style="width:150px;padding:3px">
<div class="easyui-accordion" style="width:auto;height:auto;">
<div title="用户管理" data-options="iconCls:'icon-ok'" style="overflow:auto;padding:5px;">
<a href="javascript:void(0)" class="detailLink" url="/UserInfo/Index">用户管理</a>
</div>
<div title="角色管理" data-options="iconCls:'icon-help'" style="padding:5px;">
<a href="javascript:void(0)" class="detailLink" url="/RoleInfo/Index">角色管理</a>
</div>
</div>

</div>
<div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>
<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">south region</div>
<div data-options="region:'center',title:'Center'">
<div id="tt" class="easyui-tabs" style="width:700px;height:250px" fit="true">

</div>

</div>

</body>
</html>