mirror of https://gitee.com/stylefeng/guns
【API】修改树样式
chenjinlong
parent
35a6dbfe5d
commit
4863d75e29
|
|
@ -1,10 +1,11 @@
|
||||||
layui.use(['layer', 'form', 'table', 'HttpRequest', 'func', 'tree'], function () {
|
layui.use(['layer', 'form', 'table', 'util', 'admin', 'tree', 'dropdown', 'xmSelect', 'treeTable', 'func', 'HttpRequest'], function () {
|
||||||
var $ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
var form = layui.form;
|
var form = layui.form;
|
||||||
var table = layui.table;
|
var table = layui.table;
|
||||||
var HttpRequest = layui.HttpRequest;
|
|
||||||
var func = layui.func;
|
|
||||||
var tree = layui.tree;
|
var tree = layui.tree;
|
||||||
|
var HttpRequest = layui.HttpRequest;
|
||||||
|
var selObj;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Api管理的参数
|
* Api管理的参数
|
||||||
|
|
@ -19,7 +20,6 @@ layui.use(['layer', 'form', 'table', 'HttpRequest', 'func', 'tree'], function ()
|
||||||
// 选择api树上的接口时
|
// 选择api树上的接口时
|
||||||
ApiManager.onClickApi = function (obj) {
|
ApiManager.onClickApi = function (obj) {
|
||||||
ApiManager.condition.resourceCode = obj.data.id;
|
ApiManager.condition.resourceCode = obj.data.id;
|
||||||
|
|
||||||
// 如果是具体接口，则查看接口详情
|
// 如果是具体接口，则查看接口详情
|
||||||
if (obj.data.resourceFlag === true) {
|
if (obj.data.resourceFlag === true) {
|
||||||
ApiManager.search();
|
ApiManager.search();
|
||||||
|
|
@ -67,22 +67,18 @@ layui.use(['layer', 'form', 'table', 'HttpRequest', 'func', 'tree'], function ()
|
||||||
};
|
};
|
||||||
|
|
||||||
// 初始化api树
|
// 初始化api树
|
||||||
var request = new HttpRequest(Feng.ctxPath + '/resource/getTree', 'get', function (data) {
|
new HttpRequest(Feng.ctxPath + '/resource/getTree', 'get', function (data) {
|
||||||
tree.render({
|
tree.render({
|
||||||
elem: '#apiTree',
|
elem: '#organizationTree',
|
||||||
|
onlyIconControl: true,
|
||||||
data: data.data,
|
data: data.data,
|
||||||
click: ApiManager.onClickApi,
|
click: function (obj) {
|
||||||
onlyIconControl: true
|
selObj = obj;
|
||||||
});
|
$('#organizationTree').find('.ew-tree-click').removeClass('ew-tree-click');
|
||||||
});
|
$(obj.elem).children('.layui-tree-entry').addClass('ew-tree-click');
|
||||||
request.start();
|
ApiManager.onClickApi(selObj)
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
$(function () {
|
|
||||||
var panehHidden = false;
|
|
||||||
if ($(this).width() < 769) {
|
|
||||||
panehHidden = true;
|
|
||||||
}
|
}
|
||||||
$('#myContiner').layout({initClosed: panehHidden, west__size: 330});
|
});
|
||||||
|
$('#organizationTree').find('.layui-tree-entry:first>.layui-tree-main>.layui-tree-txt').trigger('click');
|
||||||
|
}).start();
|
||||||
});
|
});
|
||||||
|
|
@ -1,23 +1,64 @@
|
||||||
@layout("/layout/_tree_container.html", {plugins:["jquery-layout"], js:["/assets/modular/api/api.js"]}){
|
@layout("/layout/_container.html",{js:["/assets/modular/api/api.js"]}){
|
||||||
|
<style>
|
||||||
|
/* 左树 */
|
||||||
|
#organizationTreeBar {
|
||||||
|
padding: 10px 15px;
|
||||||
|
border: 1px solid #e6e6e6;
|
||||||
|
background-color: #f2f2f2;
|
||||||
|
}
|
||||||
|
|
||||||
<div class="layui-body-header">
|
#organizationTree {
|
||||||
<span class="layui-body-header-title">API接口文档</span>
|
border: 1px solid #e6e6e6;
|
||||||
</div>
|
border-top: none;
|
||||||
|
padding: 10px 5px;
|
||||||
|
overflow: auto;
|
||||||
|
height: -webkit-calc(100vh - 125px);
|
||||||
|
height: -moz-calc(100vh - 125px);
|
||||||
|
height: calc(100vh - 125px);
|
||||||
|
}
|
||||||
|
|
||||||
<div id="myContiner" style="height: 100%">
|
.layui-tree-entry .layui-tree-txt {
|
||||||
<div class="ui-layout-west">
|
padding: 0 5px;
|
||||||
<div class="box box-main">
|
border: 1px transparent solid;
|
||||||
<div class="ui-layout-content">
|
text-decoration: none !important;
|
||||||
<div id="apiTree"></div>
|
}
|
||||||
</div>
|
|
||||||
</div>
|
.layui-tree-entry.ew-tree-click .layui-tree-txt {
|
||||||
</div>
|
background-color: #fff3e0;
|
||||||
<div class="ui-layout-center" style="height: 97%;overflow: scroll">
|
border: 1px #FFE6B0 solid;
|
||||||
<div class="layui-fluid">
|
}
|
||||||
<div class="layui-row">
|
|
||||||
<div class="layui-col-md12">
|
/* 右表搜索表单 */
|
||||||
|
#organizationUserTbSearchForm .layui-form-label {
|
||||||
|
box-sizing: border-box !important;
|
||||||
|
width: 90px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#organizationUserTbSearchForm .layui-input-block {
|
||||||
|
margin-left: 90px !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<!-- 正文开始 -->
|
||||||
|
<div class="layui-fluid" style="padding-bottom: 0;">
|
||||||
|
<div class="layui-row layui-col-space15">
|
||||||
|
<div class="layui-col-md2">
|
||||||
<div class="layui-card">
|
<div class="layui-card">
|
||||||
<div class="layui-card-body">
|
<div class="layui-card-body" style="padding: 10px;">
|
||||||
|
<!-- 树工具栏 -->
|
||||||
|
<div class="layui-form toolbar" id="organizationTreeBar">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- 左树 -->
|
||||||
|
<div id="organizationTree"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="layui-col-md10">
|
||||||
|
<div class="layui-card">
|
||||||
|
<div class="layui-card-body" style="padding: 10px;">
|
||||||
|
<div class="layui-form-item layui-row">
|
||||||
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
|
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
|
||||||
<legend>接口详情</legend>
|
<legend>接口详情</legend>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
|
|
@ -83,8 +124,6 @@
|
||||||
</fieldset>
|
</fieldset>
|
||||||
|
|
||||||
<table class="layui-hide" id="responseParamsTable" lay-filter="responseParamsTable"></table>
|
<table class="layui-hide" id="responseParamsTable" lay-filter="responseParamsTable"></table>
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue