mirror of
https://gitee.com/dotnetchina/OpenAuth.Net.git
synced 2025-09-19 01:58:01 +08:00
添加DI支持
This commit is contained in:
yubaolee
@@ -1,140 +1,140 @@
|
||||
@{
|
||||
Layout = "~/Views/Shared/_Layout.cshtml";
|
||||
}
|
||||
|
||||
<div class="main-content">
|
||||
<div id="breadcrumbs">
|
||||
<ul class="breadcrumb">
|
||||
<li><i class="icon-home"></i> <a href="#">用户列表</a><span class="divider"><i class="icon-angle-right"></i></span></li>
|
||||
</ul><!--.breadcrumb-->
|
||||
</div><!--#breadcrumbs-->
|
||||
<div class="page-content">
|
||||
<div class="row">
|
||||
<div class="col-sm-6" style="width:100%;">
|
||||
<div class="dataTables_filter" id="sample-table-2_filter">
|
||||
<label>
|
||||
关键字: <input type="text" id="txtSearch" aria-controls="sample-table-2" placeholder="帐号/手机" />
|
||||
<a href="javascript:void(0)" id="btnSearch" class="btn btn-xs btn-pink" style="margin-top:-4px;">搜索</a>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- PAGE CONTENT BEGINS HERE -->
|
||||
<div class="col-xs-12">
|
||||
<table id="grid-table"></table>
|
||||
<div id="grid-pager"></div>
|
||||
</div><!--/row-->
|
||||
<!-- PAGE CONTENT ENDS HERE -->
|
||||
</div><!--/row-->
|
||||
</div><!--/#page-content-->
|
||||
</div><!-- /.main-content -->
|
||||
|
||||
<script src="~/assets/js/jqGrid/jquery.jqGrid.min.js"></script>
|
||||
<script src="~/assets/js/jqGrid/i18n/grid.locale-en.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$("#btnSearch").click(function () {
|
||||
var searchString = $("#txtSearch").val();
|
||||
var grid = $('#grid-table');
|
||||
grid[0].p.search = true;
|
||||
$.extend(grid[0].p.postData, { kw: searchString });
|
||||
grid.trigger("reloadGrid", [{ page: 1 }]);
|
||||
});
|
||||
GetData();
|
||||
});
|
||||
function GetData() {
|
||||
var grid_selector = "#grid-table";
|
||||
var pager_selector = "#grid-pager";
|
||||
jQuery(grid_selector).jqGrid({
|
||||
url: "/Account/LoadUsers",
|
||||
mtype: "post",
|
||||
datatype: "json",
|
||||
height: '100%',
|
||||
width: '100%',
|
||||
colNames: ['UserId', '用户帐号', '是否可用', '操作'],
|
||||
colModel: [
|
||||
{ name: 'UserId', key: true, index: 'UserId', width: 30, editable: true, hidden: true },
|
||||
{ name: 'Account', index: 'Account', width: 30, editable: false },
|
||||
{
|
||||
name: 'Enabled', index: 'Enabled', width: 30, editable: true, edittype: "checkbox",
|
||||
editoptions: { value: "true:false" }, unformat: aceSwitch
|
||||
},
|
||||
{
|
||||
name: 'myac', index: '', width: 80, fixed: true, sortable: false, resize: false,
|
||||
formatter: 'actions',
|
||||
formatoptions: {
|
||||
delOptions: { recreateForm: true, beforeShowForm: beforeDeleteCallback }
|
||||
}
|
||||
}
|
||||
],
|
||||
viewrecords: true,
|
||||
rowNum: 10,
|
||||
rowList: [10, 20, 30],
|
||||
pager: pager_selector,
|
||||
altRows: true,
|
||||
//toppager: true,
|
||||
multiselect: true,
|
||||
multiboxonly: true,
|
||||
loadComplete: function () {
|
||||
var table = this;
|
||||
setTimeout(function () {
|
||||
updatePagerIcons(table);
|
||||
enableTooltips(table);
|
||||
}, 0);
|
||||
},
|
||||
editurl: '@Url.Action("Login","Account")',//编辑删除
|
||||
caption: "当前用户列表",
|
||||
autowidth: true
|
||||
});
|
||||
//行内编辑时，checkbox样式
|
||||
function aceSwitch(cellvalue, options, cell) {
|
||||
setTimeout(function () {
|
||||
$(cell).find('input[type=checkbox]')
|
||||
.wrap('<label class="inline" />')
|
||||
.addClass('ace ace-switch ace-switch-5')
|
||||
.after('<span class="lbl"></span>');
|
||||
}, 0);
|
||||
}
|
||||
//分页栏中的功能按钮(只留了刷新功能）
|
||||
jQuery(grid_selector).jqGrid('navGrid', pager_selector,
|
||||
{ //navbar options
|
||||
edit: false,
|
||||
add: false,
|
||||
del: false,
|
||||
search: false,
|
||||
refresh: true,
|
||||
refreshicon: 'icon-refresh green',
|
||||
view: false,
|
||||
});
|
||||
//删除前的确认框
|
||||
function beforeDeleteCallback(e) {
|
||||
var form = $(e[0]);
|
||||
if (form.data('styled')) return false;
|
||||
form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />');
|
||||
var buttons = form.next().find('.EditButton .fm-button');
|
||||
buttons.addClass('btn btn-sm').find('[class*="-icon"]').remove();//ui-icon, s-icon
|
||||
buttons.eq(0).addClass('btn-danger').prepend('<i class="icon-trash"></i>');
|
||||
buttons.eq(1).prepend('<i class="icon-remove"></i>');
|
||||
form.data('styled', true);
|
||||
}
|
||||
//更新分页栏的按钮
|
||||
function updatePagerIcons(table) {
|
||||
var replacement =
|
||||
{
|
||||
'ui-icon-seek-first': 'icon-double-angle-left bigger-140',
|
||||
'ui-icon-seek-prev': 'icon-angle-left bigger-140',
|
||||
'ui-icon-seek-next': 'icon-angle-right bigger-140',
|
||||
'ui-icon-seek-end': 'icon-double-angle-right bigger-140'
|
||||
};
|
||||
$('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function () {
|
||||
var icon = $(this);
|
||||
var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
|
||||
if ($class in replacement) icon.attr('class', 'ui-icon ' + replacement[$class]);
|
||||
});
|
||||
}
|
||||
function enableTooltips(table) {
|
||||
$('.navtable .ui-pg-button').tooltip({ container: 'body' });
|
||||
$(table).find('.ui-pg-div').tooltip({ container: 'body' });
|
||||
}
|
||||
}
|
||||
@{
|
||||
Layout = "~/Views/Shared/_Layout.cshtml";
|
||||
}
|
||||
|
||||
<div class="main-content">
|
||||
<div id="breadcrumbs">
|
||||
<ul class="breadcrumb">
|
||||
<li><i class="icon-home"></i> <a href="#">用户列表</a><span class="divider"><i class="icon-angle-right"></i></span></li>
|
||||
</ul><!--.breadcrumb-->
|
||||
</div><!--#breadcrumbs-->
|
||||
<div class="page-content">
|
||||
<div class="row">
|
||||
<div class="col-sm-6" style="width:100%;">
|
||||
<div class="dataTables_filter" id="sample-table-2_filter">
|
||||
<label>
|
||||
关键字: <input type="text" id="txtSearch" aria-controls="sample-table-2" placeholder="帐号/手机" />
|
||||
<a href="javascript:void(0)" id="btnSearch" class="btn btn-xs btn-pink" style="margin-top:-4px;">搜索</a>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<!-- PAGE CONTENT BEGINS HERE -->
|
||||
<div class="col-xs-12">
|
||||
<table id="grid-table"></table>
|
||||
<div id="grid-pager"></div>
|
||||
</div><!--/row-->
|
||||
<!-- PAGE CONTENT ENDS HERE -->
|
||||
</div><!--/row-->
|
||||
</div><!--/#page-content-->
|
||||
</div><!-- /.main-content -->
|
||||
|
||||
<script src="~/assets/js/jqGrid/jquery.jqGrid.min.js"></script>
|
||||
<script src="~/assets/js/jqGrid/i18n/grid.locale-en.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
$("#btnSearch").click(function () {
|
||||
var searchString = $("#txtSearch").val();
|
||||
var grid = $('#grid-table');
|
||||
grid[0].p.search = true;
|
||||
$.extend(grid[0].p.postData, { kw: searchString });
|
||||
grid.trigger("reloadGrid", [{ page: 1 }]);
|
||||
});
|
||||
GetData();
|
||||
});
|
||||
function GetData() {
|
||||
var grid_selector = "#grid-table";
|
||||
var pager_selector = "#grid-pager";
|
||||
jQuery(grid_selector).jqGrid({
|
||||
url: "/Home/LoadUsers",
|
||||
mtype: "post",
|
||||
datatype: "json",
|
||||
height: '100%',
|
||||
width: '100%',
|
||||
colNames: ['UserId', '用户帐号', '是否可用', '操作'],
|
||||
colModel: [
|
||||
{ name: 'UserId', key: true, index: 'UserId', width: 30, editable: true, hidden: true },
|
||||
{ name: 'Account', index: 'Account', width: 30, editable: false },
|
||||
{
|
||||
name: 'Enabled', index: 'Enabled', width: 30, editable: true, edittype: "checkbox",
|
||||
editoptions: { value: "true:false" }, unformat: aceSwitch
|
||||
},
|
||||
{
|
||||
name: 'myac', index: '', width: 80, fixed: true, sortable: false, resize: false,
|
||||
formatter: 'actions',
|
||||
formatoptions: {
|
||||
delOptions: { recreateForm: true, beforeShowForm: beforeDeleteCallback }
|
||||
}
|
||||
}
|
||||
],
|
||||
viewrecords: true,
|
||||
rowNum: 10,
|
||||
rowList: [10, 20, 30],
|
||||
pager: pager_selector,
|
||||
altRows: true,
|
||||
//toppager: true,
|
||||
multiselect: true,
|
||||
multiboxonly: true,
|
||||
loadComplete: function () {
|
||||
var table = this;
|
||||
setTimeout(function () {
|
||||
updatePagerIcons(table);
|
||||
enableTooltips(table);
|
||||
}, 0);
|
||||
},
|
||||
editurl: '@Url.Action("Login","Account")',//编辑删除
|
||||
caption: "当前用户列表",
|
||||
autowidth: true
|
||||
});
|
||||
//行内编辑时，checkbox样式
|
||||
function aceSwitch(cellvalue, options, cell) {
|
||||
setTimeout(function () {
|
||||
$(cell).find('input[type=checkbox]')
|
||||
.wrap('<label class="inline" />')
|
||||
.addClass('ace ace-switch ace-switch-5')
|
||||
.after('<span class="lbl"></span>');
|
||||
}, 0);
|
||||
}
|
||||
//分页栏中的功能按钮(只留了刷新功能）
|
||||
jQuery(grid_selector).jqGrid('navGrid', pager_selector,
|
||||
{ //navbar options
|
||||
edit: false,
|
||||
add: false,
|
||||
del: false,
|
||||
search: false,
|
||||
refresh: true,
|
||||
refreshicon: 'icon-refresh green',
|
||||
view: false,
|
||||
});
|
||||
//删除前的确认框
|
||||
function beforeDeleteCallback(e) {
|
||||
var form = $(e[0]);
|
||||
if (form.data('styled')) return false;
|
||||
form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />');
|
||||
var buttons = form.next().find('.EditButton .fm-button');
|
||||
buttons.addClass('btn btn-sm').find('[class*="-icon"]').remove();//ui-icon, s-icon
|
||||
buttons.eq(0).addClass('btn-danger').prepend('<i class="icon-trash"></i>');
|
||||
buttons.eq(1).prepend('<i class="icon-remove"></i>');
|
||||
form.data('styled', true);
|
||||
}
|
||||
//更新分页栏的按钮
|
||||
function updatePagerIcons(table) {
|
||||
var replacement =
|
||||
{
|
||||
'ui-icon-seek-first': 'icon-double-angle-left bigger-140',
|
||||
'ui-icon-seek-prev': 'icon-angle-left bigger-140',
|
||||
'ui-icon-seek-next': 'icon-angle-right bigger-140',
|
||||
'ui-icon-seek-end': 'icon-double-angle-right bigger-140'
|
||||
};
|
||||
$('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function () {
|
||||
var icon = $(this);
|
||||
var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
|
||||
if ($class in replacement) icon.attr('class', 'ui-icon ' + replacement[$class]);
|
||||
});
|
||||
}
|
||||
function enableTooltips(table) {
|
||||
$('.navtable .ui-pg-button').tooltip({ container: 'body' });
|
||||
$(table).find('.ui-pg-div').tooltip({ container: 'body' });
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user