Merge pull request #31 from laohuangsk8/master

新增插入JSON数据功能模块以及提示显示方面的体验

Application/Home/View/Page/edit.html

@@ -59,6 +59,7 @@
     <div class="btns">
         <button id="api-doc" tabindex="4" >插入API接口模板</button>
         <button id="database-doc" tabindex="5" >插入数据字典模板</button>
+        <button id="jsons" tabindex="7" >插入JSON</button>
     </div>
     <div id="editormd">
         <textarea id="page_content" style="display:none;" tabindex="6" >{$page.page_content}</textarea>
@@ -74,6 +75,25 @@
 <div id="database-doc-templ" style="display:none">
     <include file="MdTemplate/database" />
 </div>
+
+<div id="json-templ" class="editormd-dialog editormd-preformatted-text-dialog" style="width: 780px; height: 540px;">
+
+    <div style="cursor: move;" class="editormd-dialog-header">
+        <strong class="editormd-dialog-title">添加JSON</strong>
+    </div>
+    <a class="fa fa-close editormd-dialog-close" href="javascript:closeDiv('#json-templ');"></a>
+    <div class="editormd-dialog-container">
+        <textarea id="jsons_add" class="jsons" placeholder="coding now...."></textarea>
+        
+        <div class="editormd-dialog-footer">
+            <button class="editormd-btn editormd-enter-btn">确定</button>
+            <button class="editormd-btn editormd-cancel-btn" onclick="closeDiv('#json-templ')">取消</button>
+        </div>
+    </div>
+    <div class="editormd-dialog-mask editormd-dialog-mask-bg"></div><div class="editormd-dialog-mask editormd-dialog-mask-con"></div>
+</div>
+
+
 <include file="Common/footer" />
 <script src="__PUBLIC__/js/jquery.bootstrap-growl.min.js"></script>
 <script src="__PUBLIC__/js/jquery.hotkeys.js"></script>
@@ -86,4 +106,5 @@
 <script src="__PUBLIC__/editor.md/plugins/goto-line-dialog/goto-line-dialog.js"></script>
 <script src="__PUBLIC__/editor.md/plugins/table-dialog/table-dialog.js"></script>
 <script src="__PUBLIC__/editor.md/plugins/reference-link-dialog/reference-link-dialog.js"></script>
+
 <script src="__PUBLIC__/js/page/edit.js"></script>

Public/css/item/show.css

@@ -77,4 +77,58 @@
 
   .search-query-input{
     width: 130px;
-  }
+  }
+
+
+@media screen and (min-width:1200px){
+  .doc-right{ width: 930px;} 
+}
+@media screen and (min-width:1300px){
+  .doc-right{ width: 1030px;} 
+}
+@media screen and (min-width:1400px){
+  .doc-right{ width: 1130px;} 
+}
+@media screen and (min-width:1500px){
+  .doc-right{ width: 1230px;} 
+}
+@media screen and (min-width:1600px){
+  .doc-right{ width: 1330px;} 
+}
+@media screen and (min-width:1700px){
+  .doc-right{ width: 1430px;} 
+}
+@media screen and (min-width:1800px){
+  .doc-right{ width: 1530px;} 
+}
+@media screen and (min-width:1900px){
+  .doc-right{ width: 1630px;} 
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

Public/css/page/edit.css

@@ -91,4 +91,8 @@ body {
 
 .btns button:hover, .btn:hover {
     background: #f6f6f6;
-}
+}
+
+#json-templ{ position:fixed; float:left; top:100px; left:300px; border:2px solid #ccc; display:none; z-index:999999;}
+
+.markdown-body.editormd-preview-container table tr td{ max-width:300px;}

Public/js/page/edit.js

@@ -1,5 +1,7 @@
 var editormd;
 
+var json_table_data='|键|值|类型|空|备注|\n'+
+		'|:-------|:-------|:-------|:-------|:-------|\n';
 
 $(function() {
   /*加载目录*/
@@ -84,6 +86,54 @@ $(function() {
     var tmpl = $("#database-doc-templ").html();
     editormd.insertValue(tmpl);
   });
+  
+   /*插入JSON*/
+  $("#jsons").click(function() {
+	  
+   $("#json-templ").show();
+	
+  });
+  
+  
+
+		
+	$("#json-templ .editormd-enter-btn").click(function(){
+		
+		
+		var datas=$("#json-templ .jsons").val();
+		
+		try{
+			Change($.parseJSON(datas));   
+		}
+		catch(e){
+			alert("json导入失败" + e);
+		}
+		
+		//datas=processJSONImport(datas);
+		//alert(datas);
+		/*var datas='|键|值|类型|空|注释|\n'+
+		'|:-------|:-------|:-------|:-------|:-------|\n'+
+		'|uid|int(10)|否|||\n'+
+		'|username|varchar(20)|否||用户名|';*/
+		
+		//alert(json_table_data);return;
+		
+		
+		
+		editormd.insertValue(json_table_data);
+		
+		json_table_data='|键|值|类型|空|备注|\n'+
+		'|:-------|:-------|:-------|:-------|:-------|\n';
+		
+		
+		$("#json-templ .jsons").val("");
+		$("#json-templ").hide();
+		
+	});
+	
+
+//{"dgfgdfg":"gdfgdfg"}
+  
 
   /*保存*/
   var saving = false;
@@ -118,8 +168,67 @@ $(function() {
       },
       'json'
     )
-  })
+  });
+
+
+
+	$(".editormd-preview-container").bind('DOMNodeInserted', function(e){
+		
+		$(".editormd-preview-container table tr").eq(0).css({"background-color":"#08c","color":"#fff"});
+		$(".editormd-preview-container table tr").each(function(){
+			if($(this).find("td").eq(1).html()=="object[]")
+			{
+				$(this).css({"background-color":"#99CC99","color":"#000"});
+			}
+			
+			});
+	});
+
+});
+
 
+function closeDiv(target)
+{
+	$(target).hide();
+}
 
+function Change(data)
+{
+	var level_str="- ";
+	if(arguments.length>1)
+	{
+		var level;
+		arguments[1]>0?level=arguments[1]:level=1;
+		for(var i=0;i<level;i++)
+		{
+			level_str+="- ";
+		}
+	}
+	
+	for(var key in data)
+	{
+		var value = data[key];
+		var type = typeof(value);
+		if(type == "object")
+		{
+			json_table_data+='| '+level_str+key+' |object[] | '+type+' | 默认 | 备注 |\n';
+			if(value instanceof Array)
+			{
+				var j=level+1;
+				Change(value[0],j);
+				continue;
+			}
+			//else
+			//{
+				Change(value,level);
+			//}
+			
+		}
+		else
+		{
+			json_table_data+='| '+key+' | '+value+' | '+type+' | 默认 | 备注 |\n';
+		}
+	}
+}
 
-});
+//{"Result":[{"name":"test1","list":{"pros":"prosfsf","ppps":{"images":[{"22":"22"}]}}}]}