Skip to content
GitLab
Commit 91a6b722 authored by 季圣华's avatar 季圣华
Browse files

更新前端

parent 609756e9
Hide whitespace changes
Inline Side-by-side
erp_web/js/easyui-1.3.5/demo/tabs/tree_data1.json 0 → 100644
View file @ 91a6b722
[{
"id":1,
"text":"My Documents",
"children":[{
"id":11,
"text":"Photos",
"state":"closed",
"children":[{
"id":111,
"text":"Friend"
},{
"id":112,
"text":"Wife"
},{
"id":113,
"text":"Company"
}]
},{
"id":12,
"text":"Program Files",
"children":[{
"id":121,
"text":"Intel"
},{
"id":122,
"text":"Java",
"attributes":{
"p1":"Custom Attribute1",
"p2":"Custom Attribute2"
}
},{
"id":123,
"text":"Microsoft Office"
},{
"id":124,
"text":"Games",
"checked":true
}]
},{
"id":13,
"text":"index.html"
},{
"id":14,
"text":"about.html"
},{
"id":15,
"text":"welcome.html"
}]
}]
erp_web/js/easyui-1.3.5/demo/timespinner/actions.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TimeSpinner Actions - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TimeSpinner Actions</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the buttons below to perform actions.</div>
</div>
<div style="margin:10px 0;">
<a href="#" class="easyui-linkbutton" onclick="getValue()">GetValue</a>
<a href="#" class="easyui-linkbutton" onclick="setValue()">SetValue</a>
<a href="#" class="easyui-linkbutton" onclick="disable()">Disable</a>
<a href="#" class="easyui-linkbutton" onclick="enable()">Enable</a>
</div>
<input id="dt" class="easyui-timespinner" style="width:80px;">
<script>
function getValue(){
var val = $('#dt').timespinner('getValue');
alert(val);
}
function setValue(){
$('#dt').timespinner('setValue', '09:45');
}
function disable(){
$('#dt').timespinner('disable');
}
function enable(){
$('#dt').timespinner('enable');
}
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/timespinner/basic.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic TimeSpinner - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic TimeSpinner</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click spin button to adjust time.</div>
</div>
<div style="margin:10px 0;"></div>
<input class="easyui-timespinner" style="width:80px;">
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/timespinner/range.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Time Range - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Time Range</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>The time value is constrained in specified range.</div>
</div>
<div style="margin:10px 0;">
<span>From 08:30 to 18:00</span>
</div>
<input class="easyui-timespinner" data-options="min:'08:30',max:'18:00'" style="width:80px;"></input>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/_content.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AJAX Content</title>
</head>
<body>
<p style="font-size:14px">Here is the content loaded via AJAX.</p>
<ul>
<li>easyui is a collection of user-interface plugin based on jQuery.</li>
<li>easyui provides essential functionality for building modern, interactive, javascript applications.</li>
<li>using easyui you don't need to write many javascript code, you usually defines user-interface by writing some HTML markup.</li>
<li>complete framework for HTML5 web page.</li>
<li>easyui save your time and scales while developing your products.</li>
<li>easyui is very easy but powerful.</li>
</ul>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/_dialog.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Dialog Content</title>
</head>
<body>
<div style="padding:5px;">
<div style="padding:5px 10px">
<div>User Name:</div>
<input style="width:160px">
</div>
<div style="padding:5px 10px">
<div>Password:</div>
<input type="password" style="width:160px">
</div>
<div style="padding:5px 10px;text-align:center">
<a href="javascript:void(0)" class="easyui-linkbutton">Login</a>
<a href="javascript:void(0)" class="easyui-linkbutton">Cancel</a>
</div>
</div>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/ajax.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Ajax Tooltip - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Ajax Tooltip</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>The tooltip content can be loaded via AJAX.</div>
</div>
<div style="margin:10px 0;"></div>
<!-- <a href="#" class="easyui-tooltip" data-options="-->
<!-- content: $('<div></div>'),-->
onShow: function(){
$(this).tooltip('arrow').css('left', 20);
$(this).tooltip('tip').css('left', $(this).offset().left);
},
onUpdate: function(cc){
cc.panel({
width: 500,
height: 'auto',
border: false,
href: '_content.html'
});
}
">Hove me</a> to display tooltip content via AJAX.
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/basic.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic Tooltip - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic Tooltip</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Hover the links to display tooltip message.</div>
</div>
<div style="margin:10px 0;"></div>
<p>The tooltip can use each elements title attribute.
<a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me</a> to display tooltip.
</p>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/customcontent.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Tooltip Content - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Tooltip Content</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Access to each elements attribute to get the tooltip content.</div>
</div>
<div style="margin:10px 0;"></div>
<div id="pg" data-options="total:114" style="border:1px solid #ddd;"></div>
<script>
$(function(){
$('#pg').pagination().find('a.l-btn').tooltip({
content: function(){
var cc = $(this).find('span.l-btn-empty').attr('class').split(' ');
var icon = cc[1].split('-')[1];
return icon + ' page';
}
});
});
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/customstyle.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Custom Tooltip Style - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Custom Tooltip Style</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to change the tooltip style.</div>
</div>
<div style="margin:10px 0;"></div>
<div style="padding:10px 200px">
<div id="pp1" class="easyui-panel" style="width:100px;padding:5px">Hover Me</div>
</div>
<div style="padding:10px 200px">
<div id="pp2" class="easyui-panel" style="width:100px;padding:5px">Hover Me</div>
</div>
<script>
$(function(){
$('#pp1').tooltip({
position: 'right',
content: '<span style="color:#fff">This is the tooltip message.</span>',
onShow: function(){
$(this).tooltip('tip').css({
backgroundColor: '#666',
borderColor: '#666'
});
}
});
$('#pp2').tooltip({
position: 'bottom',
content: '<div style="padding:5px;background:#eee;color:#000">This is the tooltip message.</div>',
onShow: function(){
$(this).tooltip('tip').css({
backgroundColor: '#fff000',
borderColor: '#ff0000',
boxShadow: '1px 1px 3px #292929'
});
},
onPosition: function(){
$(this).tooltip('tip').css('left', $(this).offset().left);
$(this).tooltip('arrow').css('left', 20);
}
});
});
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/position.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tooltip Position - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Tooltip Position</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the drop-down list below to change where the tooltip appears.</div>
</div>
<div style="margin:10px 0;"></div>
<span>Select position:</span>
<select onchange="changePosition(this.value)">
<option value="bottom">Bottom</option>
<option value="top">Top</option>
<option value="left">Left</option>
<option value="right">Right</option>
</select>
<div style="padding:10px 200px">
<div id="pp" class="easyui-panel easyui-tooltip" title="This is the tooltip message." style="width:100px;padding:5px">Hover Me</div>
</div>
<script type="text/javascript">
function changePosition(pos){
$('#pp').tooltip({
position: pos
});
}
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/toolbar.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tooltip as Toolbar - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Tooltip as Toolbar</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to create a tooltip style toolbar.</div>
</div>
<div style="margin:10px 0;"></div>
<div style="padding:10px 200px">
<p><a id="dd" href="javascript:void(0)" class="easyui-tooltip" data-options="
hideEvent: 'none',
content: function(){
return $('#toolbar');
},
onShow: function(){
var t = $(this);
t.tooltip('tip').focus().unbind().bind('blur',function(){
t.tooltip('hide');
});
}
">Hover me</a> to display toolbar.</p>
</div>
<div style="display:none">
<div id="toolbar">
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Add" data-options="iconCls:'icon-add',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Cut" data-options="iconCls:'icon-cut',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Remove" data-options="iconCls:'icon-remove',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Undo" data-options="iconCls:'icon-undo',plain:true"></a>
<a href="#" class="easyui-linkbutton easyui-tooltip" title="Redo" data-options="iconCls:'icon-redo',plain:true"></a>
</div>
</div>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/tooltip/tooltipdialog.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tooltip Dialog - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Tooltip Dialog</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to create a tooltip dialog.</div>
</div>
<div style="margin:10px 0;"></div>
<div style="padding:10px 200px">
<p><a id="dd" href="javascript:void(0)">Click here</a> to see the tooltip dialog.
</div>
<script>
$(function(){
$('#dd').tooltip({
content: $('<div></div>'),
showEvent: 'click',
onUpdate: function(content){
content.panel({
width: 200,
border: false,
title: 'Login',
href: '_dialog.html'
});
},
onShow: function(){
var t = $(this);
t.tooltip('tip').unbind().bind('mouseenter', function(){
t.tooltip('show');
}).bind('mouseleave', function(){
t.tooltip('hide');
});
}
});
});
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/actions.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TreeGrid Actions - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TreeGrid Actions</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Click the buttons below to perform actions.</div>
</div>
<div style="margin:10px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="collapseAll()">CollapseAll</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="expandAll()">ExpandAll</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="expandTo()">ExpandTo</a>
</div>
<table id="tg" class="easyui-treegrid" title="TreeGrid Actions" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name'
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
<th data-options="field:'persons',width:60,align:'right'">Persons</th>
<th data-options="field:'begin',width:80">Begin Date</th>
<th data-options="field:'end',width:80">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress">Progress</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
function collapseAll(){
$('#tg').treegrid('collapseAll');
}
function expandAll(){
$('#tg').treegrid('expandAll');
}
function expandTo(){
$('#tg').treegrid('expandTo',21).treegrid('select',21);
}
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/basic.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Basic TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>TreeGrid allows you to expand or collapse group rows.</div>
</div>
<div style="margin:10px 0;"></div>
<table title="Folder Browser" class="easyui-treegrid" style="width:700px;height:250px"
data-options="
url: 'treegrid_data1.json',
method: 'get',
rownumbers: true,
idField: 'id',
treeField: 'name'
">
<thead>
<tr>
<th data-options="field:'name'" width="220">Name</th>
<th data-options="field:'size'" width="100" align="right">Size</th>
<th data-options="field:'date'" width="150">Modified Date</th>
</tr>
</thead>
</table>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/clientpagination.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Client Side Pagination in TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Client Side Pagination in TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>This sample shows how to implement client side pagination in TreeGrid.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="tg" class="easyui-treegrid" title="Client Side Pagination" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name',
loadFilter: pagerFilter,
pagination: true,
pageSize: 2,
pageList: [2,5,10]
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
<th data-options="field:'persons',width:60,align:'right'">Persons</th>
<th data-options="field:'begin',width:80">Begin Date</th>
<th data-options="field:'end',width:80">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress">Progress</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
function pagerFilter(data){
if ($.isArray(data)){ // is array
data = {
total: data.length,
rows: data
}
}
var dg = $(this);
var state = dg.data('treegrid');
var opts = dg.treegrid('options');
var pager = dg.treegrid('getPager');
pager.pagination({
onSelectPage:function(pageNum, pageSize){
opts.pageNumber = pageNum;
opts.pageSize = pageSize;
pager.pagination('refresh',{
pageNumber:pageNum,
pageSize:pageSize
});
dg.treegrid('loadData',data);
}
});
if (!data.topRows){
data.topRows = [];
data.childRows = [];
for(var i=0; i<data.rows.length; i++){
var row = data.rows[i];
row._parentId ? data.childRows.push(row) : data.topRows.push(row);
}
data.total = (data.topRows.length);
}
var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
var end = start + parseInt(opts.pageSize);
data.rows = $.extend(true,[],data.topRows.slice(start, end).concat(data.childRows));
return data;
}
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/contextmenu.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TreeGrid ContextMenu - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TreeGrid ContextMenu</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Right click to display the context menu.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="tg" class="easyui-treegrid" title="TreeGrid ContextMenu" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name',
onContextMenu: onContextMenu
">
<thead>
<tr>
<th data-options="field:'name',width:180">Task Name</th>
<th data-options="field:'persons',width:60,align:'right'">Persons</th>
<th data-options="field:'begin',width:80">Begin Date</th>
<th data-options="field:'end',width:80">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress">Progress</th>
</tr>
</thead>
</table>
<div id="mm" class="easyui-menu" style="width:120px;">
<div onclick="append()" data-options="iconCls:'icon-add'">Append</div>
<div onclick="removeIt()" data-options="iconCls:'icon-remove'">Remove</div>
<div class="menu-sep"></div>
<div onclick="collapse()">Collapse</div>
<div onclick="expand()">Expand</div>
</div>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
function onContextMenu(e,row){
e.preventDefault();
$(this).treegrid('select', row.id);
$('#mm').menu('show',{
left: e.pageX,
top: e.pageY
});
}
var idIndex = 100;
function append(){
idIndex++;
var d1 = new Date();
var d2 = new Date();
d2.setMonth(d2.getMonth()+1);
var node = $('#tg').treegrid('getSelected');
$('#tg').treegrid('append',{
parent: node.id,
data: [{
id: idIndex,
name: 'New Task'+idIndex,
persons: parseInt(Math.random()*10),
begin: $.fn.datebox.defaults.formatter(d1),
end: $.fn.datebox.defaults.formatter(d2),
progress: parseInt(Math.random()*100)
}]
})
}
function removeIt(){
var node = $('#tg').treegrid('getSelected');
if (node){
$('#tg').treegrid('remove', node.id);
}
}
function collapse(){
var node = $('#tg').treegrid('getSelected');
if (node){
$('#tg').treegrid('collapse', node.id);
}
}
function expand(){
var node = $('#tg').treegrid('getSelected');
if (node){
$('#tg').treegrid('expand', node.id);
}
}
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/editable.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Editable TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Editable TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Select one node and click edit button to perform editing.</div>
</div>
<div style="margin:10px 0;">
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="edit()">Edit</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="save()">Save</a>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="cancel()">Cancel</a>
</div>
<table id="tg" class="easyui-treegrid" title="Editable TreeGrid" style="width:700px;height:250px"
data-options="
iconCls: 'icon-ok',
rownumbers: true,
animate: true,
collapsible: true,
fitColumns: true,
url: 'treegrid_data2.json',
method: 'get',
idField: 'id',
treeField: 'name',
showFooter: true
">
<thead>
<tr>
<th data-options="field:'name',width:180,editor:'text'">Task Name</th>
<th data-options="field:'persons',width:60,align:'right',editor:'numberbox'">Persons</th>
<th data-options="field:'begin',width:80,editor:'datebox'">Begin Date</th>
<th data-options="field:'end',width:80,editor:'datebox'">End Date</th>
<th data-options="field:'progress',width:120,formatter:formatProgress,editor:'numberbox'">Progress</th>
</tr>
</thead>
</table>
<script type="text/javascript">
function formatProgress(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
var editingId;
function edit(){
if (editingId != undefined){
$('#tg').treegrid('select', editingId);
return;
}
var row = $('#tg').treegrid('getSelected');
if (row){
editingId = row.id
$('#tg').treegrid('beginEdit', editingId);
}
}
function save(){
if (editingId != undefined){
var t = $('#tg');
t.treegrid('endEdit', editingId);
editingId = undefined;
var persons = 0;
var rows = t.treegrid('getChildren');
for(var i=0; i<rows.length; i++){
var p = parseInt(rows[i].persons);
if (!isNaN(p)){
persons += p;
}
}
var frow = t.treegrid('getFooterRows')[0];
frow.persons = persons;
t.treegrid('reloadFooter');
}
}
function cancel(){
if (editingId != undefined){
$('#tg').treegrid('cancelEdit', editingId);
editingId = undefined;
}
}
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/footer.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>TreeGrid with Footer - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>TreeGrid with Footer</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Show summary information on TreeGrid footer.</div>
</div>
<div style="margin:10px 0;"></div>
<table id="tg"></table>
<script type="text/javascript">
$(function(){
$('#tg').treegrid({
title:'TreeGrid with Footer',
iconCls:'icon-ok',
width:700,
height:250,
rownumbers: true,
animate:true,
collapsible:true,
fitColumns:true,
url:'treegrid_data2.json',
method: 'get',
idField:'id',
treeField:'name',
showFooter:true,
columns:[[
{title:'Task Name',field:'name',width:180},
{field:'persons',title:'Persons',width:60,align:'right'},
{field:'begin',title:'Begin Date',width:80},
{field:'end',title:'End Date',width:80},
{field:'progress',title:'Progress',width:120,
formatter:function(value){
if (value){
var s = '<div style="width:100%;border:1px solid #ccc">' +
'<div style="width:' + value + '%;background:#cc0000;color:#fff">' + value + '%' + '</div>'
'</div>';
return s;
} else {
return '';
}
}
}
]]
});
})
</script>
</body>
</html>
\ No newline at end of file
erp_web/js/easyui-1.3.5/demo/treegrid/reports.html 0 → 100644
View file @ 91a6b722
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Reports using TreeGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
<link rel="stylesheet" type="text/css" href="../demo.css">
<script type="text/javascript" src="../../jquery.min.js"></script>
<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
</head>
<body>
<h2>Reports using TreeGrid</h2>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>Using TreeGrid to show complex reports.</div>
</div>
<div style="margin:10px 0;"></div>
<table title="Reports using TreeGrid" class="easyui-treegrid" style="width:700px;height:250px"
data-options="
url: 'treegrid_data3.json',
method: 'get',
rownumbers: true,
showFooter: true,
idField: 'id',
treeField: 'region'
">
<thead frozen="true">
<tr>
<th field="region" width="200">Region</th>
</tr>
</thead>
<thead>
<tr>
<th colspan="4">2009</th>
<th colspan="4">2010</th>
</tr>
<tr>
<th field="f1" width="60" align="right">1st qrt.</th>
<th field="f2" width="60" align="right">2st qrt.</th>
<th field="f3" width="60" align="right">3st qrt.</th>
<th field="f4" width="60" align="right">4st qrt.</th>
<th field="f5" width="60" align="right">1st qrt.</th>
<th field="f6" width="60" align="right">2st qrt.</th>
<th field="f7" width="60" align="right">3st qrt.</th>
<th field="f8" width="60" align="right">4st qrt.</th>
</tr>
</thead>
</table>
</body>
</html>
\ No newline at end of file
Supports Markdown
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