增加一个接口自动生成文档页面

This commit is contained in:
Argo-Lenovo 2016-12-22 15:23:44 +08:00
parent febcaf0662
commit 1d41b6b3a7
4 changed files with 144 additions and 0 deletions

View File

@ -108,6 +108,7 @@
<Content Include="Content\css\bootstrap-datetimepicker.css" />
<Content Include="Content\css\bootstrap-datetimepicker.min.css" />
<Content Include="Content\css\IE8.css" />
<Content Include="Content\html\api.html" />
<Content Include="Content\images\error_icon.png" />
<Content Include="Content\js\bootstrap-datetimepicker.js" />
<Content Include="Content\js\bootstrap-datetimepicker.min.js" />
@ -215,6 +216,7 @@
<Content Include="Scripts\register.js" />
<Content Include="Scripts\Roles.js" />
<Content Include="Scripts\tasks.js" />
<Content Include="Scripts\apidoc.js" />
<Content Include="Scripts\Users.js" />
<Content Include="Content\js\jquery-1.10.2.js" />
<Content Include="Content\js\jquery-1.10.2.min.js" />

View File

@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>单元测试网页</title>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link href="../css/bootstrap.css" rel="stylesheet">
<link href="../css/bootstrap-theme.css" rel="stylesheet">
<!--[if lte IE 9 ]>
<link href="../Content/css/IE8.css" rel="stylesheet" />
<![endif]-->
<style type="text/css">
button {
outline: none !important;
}
section {
padding: 0 15px;
}
section > div > div {
display: inline-block;
}
.control-label {
width: 80px;
}
.test {
display: none;
padding: 10px 0 0 0;
}
</style>
</head>
<body>
<!--[if lte IE 9 ]>
<div id="ieAlert" class="alert alert-danger alert-dismissible">
<div>你的浏览器版本太低不能完美的支持本系统请升级到至少IE9 <a href="../IE/IE9.exe" target="_blank">速速点击下载</a> </div>
<button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">关闭</span></button>
</div>
<![endif]-->
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="../js/jquery-1.10.2.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="../js/bootstrap.js"></script>
<script src="../../Scripts/apidoc.js"></script>
</body>
</html>

View File

@ -0,0 +1,92 @@
$(function () {
$.extend({
"format": function (source, params) {
if (params === undefined) {
return source;
}
if (arguments.length > 2 && params.constructor !== Array) {
params = $.makeArray(arguments).slice(1);
}
if (params.constructor !== Array) {
params = [params];
}
$.each(params, function (i, n) {
source = source.replace(new RegExp("\\{" + i + "\\}", "g"), function () {
return n;
});
});
return source;
}
});
var ajax = function (options) {
options = $.extend({
test: false,
div: undefined,
anonymous: false,
title: '未录入',
url: '',
method: 'get',
data: '',
headers: {},
success: function (result) {
},
error: function (textStatus, errorThrown) {
}
}, options);
if (options.url == '') {
document.writeln("请求地址丢失!");
return;
}
$.ajax({
url: '../../' + options.url,
data: options.data,
type: options.method,
headers: options.headers,
success: function (result) {
if (!options.test) {
var $body = $('body');
$body.append('<section></section>');
var $section = $body.find('section').last();
$section.append($.format('<h3>{0}</h3>', options.title));
$section.append($.format('<div><label class="control-label">请求地址</label><div>{0}</div></div>', options.url));
$section.append($.format('<div><label class="control-label">允许匿名</label><div>{0}</div></div>', options.anonymous ? "允许" : "不允许"));
$section.append($.format('<div><label class="control-label">Headers</label><div>{0}</div></div>', JSON.stringify(options.headers)));
$section.append($.format('<div><label class="control-label">HTTP方法</label><div>{0}</div></div>', options.method));
$section.append($.format('<div><label class="control-label">传递参数</label><div>{0}</div></div>', JSON.stringify(options.data)));
$section.append($.format('<div><label class="control-label">返回值</label><div>{0}</div></div>', JSON.stringify(result)));
$section.append('<div><label class="control-label">试一试</label></div>');
$section.append($.format('<div class="input-group"><input type="text" class="form-control" value=\'{1}\' data-val=\'{0}\' /><span class="input-group-btn"><button class="btn btn-default" type="button">试一试</button></span></div>', JSON.stringify(options), JSON.stringify(options.data)));
$section.append('<div class="test"></div>')
options.success(result);
}
else {
if (options.div) {
options.div.html($.format('<label class="control-label">测试结果:</label><div>{0}</div>', JSON.stringify(result))).show();
}
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
var $body = $('body');
var $section = $body.find('section').last();
$section.append($.format('<div><label class="control-label">错误参数</label><div>textStatus:{0}</div><div>', textStatus));
$section.append($.format('<div><label class="control-label">错误参数</label><div>errorThrown:{0}</div><div>', errorThrown));
options.error(textStatus, errorThrown);
}
});
};
$('body').on('click', 'button', function () {
var $input = $(this).parent().prev();
var options = $.extend(JSON.parse($input.attr('data-val')), { data: JSON.parse($input.val()) }, { test: true, div: $(this).parent().parent().next() });
ajax(options);
});
ajax({
title: '用户登陆调用接口',
anonymous: true,
url: 'api/login', method: 'POST', data: { userName: 'Test', password: '1' }, success: function (result) {
ajax({ title: '用户登陆信息接口', url: 'api/login', method: 'GET', headers: { Token: result.Token } });
}
});
});