{include file="public/header" /}
<link rel="stylesheet" href="__PUBLIC__/codemirror/lib/codemirror.css__VERSION__">
<link rel="stylesheet" href="__PUBLIC__/codemirror/theme/material-darker.css__VERSION__">
<link rel="stylesheet"href="__PUBLIC__/editor/css/editormd.css__VERSION__" />

<script src="__PUBLIC__/js/api/code.js__VERSION__"></script>

<style>
.CodeMirror {
    border: 1px solid black;
    font-size: 13px;
    font-size: 13px;
    font-family: '微软雅黑';
    line-height: 22px;
    height: 100%;
    width: calc(100% - 5px);
}
.word_right{float: left;width: calc(100% - 90px);}
.ma-api-info2 label {
    float: left;
    width: 75px;
    text-align: right;
    padding: 0 5px;
    height: 22px;
    line-height: 22px;
    color: var(--ColorCC);
}
.ma-tree-item .ma-tree-hover{padding: 5px 20px;font-size: 13.5px;}
</style>

<header class="f w100 bg bc">
    {include file="public/logo" /}
    
    <div class="cl main-title">
        {$title}
    </div>

    <span title="保存（Ctrl+S）"><i class="ma-icon ma-icon-save"></i></span>
    {include file="public/button" /}
</header>

<ul class="ma-toolbar-container not-select">
    <li data-id="api2" class="selected">片段<i class="ma-icon ma-icon-list"></i></li>
</ul>

<div class="ma-main-container">
    <div class="ma-middle-container">

        <div class="main-body api2-main">
            <div  class="ma-tree-wrapper not-select" style="width: 150px;min-width: 150px;">
                <div class="ma-tree-toolbar">
                    <div class="ma-tree-toolbar-btn" style="text-align:center;">
                        <span>分类</span>
                    </div>
                    <div>
                        <div title="新建分类" class="ma-tree-toolbar-btn add-type">
                            <i class="ma-icon ma-icon-plus"></i>
                        </div>
                    </div>
                </div>
                <div class="ma-tree-container" style="height: calc(100% - 57px);">
                    <div id="type-list" class="ma-tree-item"></div>
                    <div class="no-data">
                        无数据
                    </div>
                </div>
            </div>
        </div>

        <div class="main-body api2-main">
            <div  class="ma-tree-wrapper not-select" style="width: 150px;min-width: 150px;">
                <div class="ma-tree-toolbar">
                    <div class="ma-tree-toolbar-btn" style="text-align:center;">
                        <span>结构</span>
                    </div>
                    <div>
                        <div title="新建结构" class="ma-tree-toolbar-btn add-ste">
                            <i class="ma-icon ma-icon-plus"></i>
                        </div>
                    </div>
                </div>
                <div class="ma-tree-container" style="height: calc(100% - 57px);">
                    <div id="ste-list" class="ma-tree-item"></div>
                    <div class="no-data">
                        无数据
                    </div>
                </div>
            </div>
        </div>

        <div class="main-body api2-main">
            <div  class="ma-tree-wrapper not-select" style="width: 200px;min-width: 200px;">
                <div class="ma-tree-toolbar">
                    <div class="ma-tree-toolbar-btn" style="text-align:center;">
                        <span>标签</span>
                    </div>
                    <div>
                        <div title="新建标签" class="ma-tree-toolbar-btn add-lable">
                            <i class="ma-icon ma-icon-plus"></i>
                        </div>
                    </div>
                </div>
                <div class="ma-tree-container" style="height: calc(100% - 57px);">
                    <div id="lable-list" class="ma-tree-item"></div>
                    <div class="no-data">
                        无数据
                    </div>
                </div>
            </div>
        </div>
        

        <div class="main-body api2-main">
            <div  class="ma-tree-wrapper not-select" style="width: 250px;min-width: 250px;">
                <div class="ma-tree-toolbar">
                    <div class="ma-tree-toolbar-btn" style="text-align:center;">
                        <span>代码</span>
                    </div>
                    <div>
                        <div title="新建代码片段" class="ma-tree-toolbar-btn add-code">
                            <i class="ma-icon ma-icon-plus"></i>
                        </div>
                    </div>
                </div>
                <div class="ma-tree-container" style="height: calc(100% - 57px);">
                    <div id="code-list" class="ma-tree-item"></div>
                    <div class="no-data">
                        无数据
                    </div>
                </div>
            </div>
        </div>


        <div class="main-body ma-bottom-container test-content api2-main" style="width: calc(100% - 750px);min-width:initial">
            <div class="main-body api2-main">
                <ul class="ma-bottom-tab not-select">
                    <li class="selected" data-id="api-if">
                        <i class="ma-icon ma-icon-parameter"></i>
                        代码片段
                    </li>

                    
                    <li class="float-right event-log">
                        <i class="ma-icon ma-icon-event"></i>
                        事件
                    </li>
                </ul>
                <form id="api-ajax">
                    <div class="menu-list api-if">
                        <div class="ma-api-info">
                            <label style="width: 90px;">
                                片段名称
                            </label>
                            <div style="flex: 1 1 0%;">
                                <input name="title" id="title" class="input" type="text" >
                            </div>
                        </div>
                        <div class="ma-api-info2" style="display: initial;">
                            <label style="width: 90px;">
                                代码内容
                            </label>
                            <div class="word_right" id="html">
                                <textarea style="display: none;" id="code"></textarea>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <!---->
        </div>


        <!---->
    </div>
</div>




<div class="ma-dialog-wrapper" id="add-type" style="display: none;">
	<div class="ma-dialog" style="position: absolute; top: 300px; left: 619px; width: auto; height: auto;">
        <div class="ma-dialog-header not-select">
			创建分类
			<span>
				<i class="ma-icon ma-icon-close"></i>
			</span>
		</div>
        <div class="ma-dialog-content" style="padding: 5px 10px; overflow: auto;">
            <div class="ma-api-info">
                <label>
                    分类名称
                </label>
                <div style="width: 300px;">
                    <input id="add_type_title" class="input" type="text">
                </div>
            </div>
            <div class="ma-api-info">
                <label>
                    排序
                </label>
                <div style="width: 300px;">
                    <input id="add_type_sort" placeholder="整数，越大越靠前" class="input" type="text" value="0">
                </div>
            </div>
            <div class="ma-api-info">
                <label style="width: 64px;"></label>
                <div style="width: 300px;">
                    <button style="margin-left: 90px;" id="post-type" class="ma-button active">提交创建</button>
                </div>
            </div>
		</div>
	</div>
</div>
<div class="magic-contextmenu" id="type-which" style="display: none; min-width: 150px; z-index: 9999999;">
	<div class="magic-contextmenu-body">
        <div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided update">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-update"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				编辑
			</span>
			<div class="magic-contextmenu-item-expand-icon"></div>
		</div>
		<div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided delete">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-delete"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				删除
			</span>
			<div class="magic-contextmenu-item-expand-icon">
			</div>
		</div>
	</div>
</div>


<div class="ma-dialog-wrapper" id="add-ste" style="display: none;">
	<div class="ma-dialog" style="position: absolute; top: 300px; left: 619px; width: auto; height: auto;">
        <div class="ma-dialog-header not-select">
			创建结构
			<span>
				<i class="ma-icon ma-icon-close"></i>
			</span>
		</div>
        <div class="ma-dialog-content" style="padding: 5px 10px; overflow: auto;">
            <div class="ma-api-info">
                <label>
                    结构名称
                </label>
                <div style="width: 300px;">
                    <input id="add_ste_title" class="input" type="text">
                </div>
            </div>
            <div class="ma-api-info">
                <label>
                    排序
                </label>
                <div style="width: 300px;">
                    <input id="add_ste_sort" placeholder="整数，越大越靠前" class="input" type="text" value="0">
                </div>
            </div>
            <div class="ma-api-info">
                <label style="width: 64px;"></label>
                <div style="width: 300px;">
                    <button style="margin-left: 90px;" id="post-ste" class="ma-button active">提交创建</button>
                </div>
            </div>
		</div>
	</div>
</div>
<div class="magic-contextmenu" id="ste-which" style="display: none; min-width: 150px; z-index: 9999999;">
	<div class="magic-contextmenu-body">
        <div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided update">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-update"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				编辑
			</span>
			<div class="magic-contextmenu-item-expand-icon"></div>
		</div>
		<div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided delete">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-delete"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				删除
			</span>
			<div class="magic-contextmenu-item-expand-icon">
			</div>
		</div>
	</div>
</div>


<div class="ma-dialog-wrapper" id="add-lable" style="display: none;">
	<div class="ma-dialog" style="position: absolute; top: 300px; left: 619px; width: auto; height: auto;">
        <div class="ma-dialog-header not-select">
			创建标签
			<span>
				<i class="ma-icon ma-icon-close"></i>
			</span>
		</div>
        <div class="ma-dialog-content" style="padding: 5px 10px; overflow: auto;">
            <div class="ma-api-info">
                <label>
                    标签名称
                </label>
                <div style="width: 300px;">
                    <input id="add_lable_title" class="input" type="text">
                </div>
            </div>
            <div class="ma-api-info">
                <label>
                    排序
                </label>
                <div style="width: 300px;">
                    <input id="add_lable_sort" placeholder="整数，越大越靠前" class="input" type="text" value="0">
                </div>
            </div>
            <div class="ma-api-info">
                <label style="width: 64px;"></label>
                <div style="width: 300px;">
                    <button style="margin-left: 90px;" id="post-lable" class="ma-button active">提交创建</button>
                </div>
            </div>
		</div>
	</div>
</div>

<div class="magic-contextmenu" id="lable-which" style="display: none; min-width: 150px; z-index: 9999999;">
	<div class="magic-contextmenu-body">
        <div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided update">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-update"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				编辑
			</span>
			<div class="magic-contextmenu-item-expand-icon"></div>
		</div>
		<div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided delete">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-delete"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				删除
			</span>
			<div class="magic-contextmenu-item-expand-icon">
			</div>
		</div>
	</div>
</div>


<div class="magic-contextmenu" id="code-which" style="display: none; min-width: 150px; z-index: 9999999;">
	<div class="magic-contextmenu-body">
		<div class="magic-contextmenu-item magic-contextmenu-item-available magic-contextmenu-item-divided delete">
			<div class="magic-contextmenu-item-icon">
				<i class="ma-icon ma-icon-delete"></i>
			</div>
			<span class="magic-contextmenu-item-label">
				删除
			</span>
			<div class="magic-contextmenu-item-expand-icon">
			</div>
		</div>
	</div>
</div>



{include file="public/footer" /}

<script src="__PUBLIC__/codemirror/lib/codemirror.js__VERSION__"></script>
<!--<script src="__PUBLIC__/codemirror/addon/edit/matchbrackets.js__VERSION__"></script>-->
<!--<script src="__PUBLIC__/codemirror/addon/selection/active-line.js__VERSION__"></script>-->
<script src="__PUBLIC__/codemirror/keymap/sublime.js__VERSION__"></script>

<script src="__PUBLIC__/codemirror/mode/xml/xml.js__VERSION__"></script>
<script src="__PUBLIC__/codemirror/mode/javascript/javascript.js__VERSION__"></script>
<script src="__PUBLIC__/codemirror/mode/css/css.js__VERSION__"></script>
<script src="__PUBLIC__/codemirror/mode/vbscript/vbscript.js__VERSION__"></script>
<script src="__PUBLIC__/codemirror/mode/htmlmixed/htmlmixed.js__VERSION__"></script>
<script src="__PUBLIC__/codemirror/mode/php/php.js__VERSION__"></script>
<script src="__PUBLIC__/editor/editormd.min.js__VERSION__"></script>