完善编辑表格功能：点击单元格开启输入框

datagear-web/src/main/resources/locales/datagear.properties

@@ -52,6 +52,9 @@ comma=\uFF0C
 bracketLeft=\uFF08
 bracketRight=\uFF09
 help=\u5E2E\u52A9
+editGrid=\u7F16\u8F91\u8868\u683C
+restore=\u6062\u590D
+restoreAll=\u6062\u590D\u5168\u90E8
 
 dataTables.noData=\u6CA1\u6709\u6570\u636E
 dataTables.zeroRecords=\u6CA1\u6709\u7ED3\u679C

datagear-web/src/main/webapp/WEB-INF/jsp/data/data_grid.jsp

@@ -154,6 +154,7 @@ List<PropertyPathDisplayName> conditionSource = (List<PropertyPathDisplayName>)r
 		pageObj.initConditionPanel();
 		pageObj.initPagination();
 		pageObj.initModelDataTableAjax(pageObj.url("queryData"), model);
+		pageObj.initEditGrid();
 	});
 })
 (${pageId});

datagear-web/src/main/webapp/WEB-INF/jsp/data/data_prop_value_grid.jsp

@@ -353,6 +353,7 @@ boolean isPrivatePropertyModel = ModelUtils.isPrivatePropertyModelTail(propertyP
 		pageObj.initPagination();
 		pageObj.initModelDataTableAjax(pageObj.url("queryMultiplePropValueData"), propertyModel, pageObj.mappedByWith);
 		<%}%>
+		pageObj.initEditGrid();
 	});
 })
 (${pageId});

datagear-web/src/main/webapp/WEB-INF/jsp/data/include/data_page_obj_edit_grid_html.jsp

@@ -9,12 +9,12 @@
 --%>
 <div class="edit-grid">
 	<div class="edit-grid-switch-wrapper">
-		<label for="${pageId}-editGridSwitch">编辑表格</label>
+		<label for="${pageId}-editGridSwitch"><fmt:message key='editGrid' /></label>
 		<input id="${pageId}-editGridSwitch" type="checkbox" value="1" />
 	</div>
 	<div class="edit-grid-operation">
-		<button id="${pageId}-editGridButtonCancel" type="button" class="button-cancel highlight" style="display: none;">恢复</button>
-		<button id="${pageId}-editGridButtonCancelAll" type="button" class="button-cancel-all highlight" style="display: none;">全部恢复</button>
-		<button id="${pageId}-editGridButtonSave" type="button" class="button-save recommended" style="display: none;">保存</button>
+		<button type="button" class="button-cancel highlight" style="display: none;"><fmt:message key='restore' /></button>
+		<button type="button" class="button-cancel-all highlight" style="display: none;"><fmt:message key='restoreAll' /></button>
+		<button type="button" class="button-save recommended" style="display: none;"><fmt:message key='save' /></button>
 	</div>
 </div>

datagear-web/src/main/webapp/WEB-INF/jsp/data/include/data_page_obj_edit_grid_js.jsp

@@ -18,6 +18,8 @@ data_page_obj_edit_grid_html.jsp
 <script type="text/javascript">
 (function(pageObj)
 {
+	pageObj.isEnableEditGrid = false;
+	
 	pageObj.editGridSwitch = function()
 	{
 		return pageObj.element("#${pageId}-editGridSwitch");
@@ -32,6 +34,22 @@ data_page_obj_edit_grid_html.jsp
 	{
 		return pageObj.element(".edit-grid-operation button");
 	};
+
+	pageObj.cancelEditCell = function($cell)
+	{
+		$cell.removeClass("edit-cell");
+		
+		var rawText = $(".cell-raw-text", $cell).text();
+		$cell.empty().text(rawText);
+	};
+	
+	pageObj.cancelAllEditCell = function()
+	{
+		pageObj.element("tbody td.edit-cell", pageObj.table).each(function()
+		{
+			pageObj.cancelEditCell($(this));
+		});
+	};
 	
 	pageObj.editGridSwitch().checkboxradio({icon:false}).click(function()
 	{
@@ -44,7 +62,9 @@ data_page_obj_edit_grid_html.jsp
 			var $buttonWrapper = $("<div class='edit-grid-button-wrapper' style='display:inline-block;' />").appendTo($headOperation);
 			$("<button name='editGridAddButton' class='edit-grid-button highlight'><fmt:message key='add' /></button>&nbsp;"
 				+"<button name='editGridEditButton' class='edit-grid-button highlight'><fmt:message key='edit' /></button>&nbsp;"
-				+"<button name='editGridDeleteButton' class='edit-grid-button highlight'><fmt:message key='delete' /></button>").button().appendTo($buttonWrapper);
+				+"<button name='editGridDeleteButton' class='edit-grid-button highlight'><fmt:message key='delete' /></button>").appendTo($buttonWrapper);
+			
+			$.initButtons($buttonWrapper);
 			
 			$buttonWrapper.hide();
 		}
@@ -53,6 +73,8 @@ data_page_obj_edit_grid_html.jsp
 		
 		if($(this).is(":checked"))
 		{
+			pageObj.isEnableEditGrid = true;
+			
 			pageObj.editGridOperationButtons().show("fade");
 			pageObj.element(".ui-button.not-edit-grid-button", $headOperation).hide();
 			pageObj.element(".edit-grid-button-wrapper", $headOperation).show("fade", function()
@@ -66,6 +88,9 @@ data_page_obj_edit_grid_html.jsp
 		}
 		else
 		{
+			pageObj.isEnableEditGrid = false;
+			pageObj.cancelAllEditCell();
+			
 			pageObj.editGridOperationButtons().hide("fade");
 			pageObj.element(".edit-grid-button-wrapper", $headOperation).hide();
 			pageObj.element(".ui-button.not-edit-grid-button", $headOperation).show("fade", function()
@@ -79,7 +104,40 @@ data_page_obj_edit_grid_html.jsp
 		}
 	});
 	
-	$.initButtons(pageObj.editGridOperation());
+	pageObj.initEditGrid = function()
+	{
+		$.initButtons(pageObj.editGridOperation());
+		
+		pageObj.table.DataTable().on("click.dt", function(event)
+		{
+			if(pageObj.isEnableEditGrid)
+			{
+				event.stopPropagation();
+				
+				var target = $(event.target);
+				
+				if(target.is("td"))
+				{
+					target.addClass("edit-cell");
+					
+					var text = target.text();
+					target.empty();
+					$("<span class='cell-raw-text' style='display:none;' />").text(text).appendTo(target);
+					$("<input type='text' class='edit-cell-input ui-widget ui-widget-content' />")
+						.attr("value", text).css("width", target.width()-5).appendTo(target).focus();
+				}
+			}
+			else
+			{
+				
+			}
+		});
+		
+		pageObj.element(".button-cancel-all", pageObj.element(".edit-grid")).click(function()
+		{
+			pageObj.cancelAllEditCell();
+		});
+	};
 })
 (${pageId});
 </script>

datagear-web/src/main/webapp/static/theme/common.css

@@ -344,6 +344,15 @@ table.dataTable tbody tr .checkbox .ui-icon{
 }
 table.dataTable tbody tr.selected .checkbox .ui-icon{
 }
+table.dataTable tbody tr td .edit-cell-input{
+	box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+}
+table.dataTable tbody th, table.dataTable tbody td{
+	padding: 0 0.5em;
+	height: 2.5em;
+}
 
 /*提示框*/
 .ui-tooltip{