p85126437
/
datagear
forked from p81075629/datagear
1
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

改进看板编辑界面功能，可扩大编辑区域便于编辑和浏览HTML模板内容

This commit is contained in:
datagear 2020-02-23 17:26:05 +08:00
parent 55b3a25207
commit e584b4cd7f
3 changed files with 61 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
datagear-web/src/main/resources/org/datagear/web/locales/datagear.properties
View File

@ -72,6 +72,7 @@ insert=\u63D2\u5165
copySuccess=\u590D\u5236\u6210\u529F\uFF01
copyToClipboardSuccess=\u5DF2\u590D\u5236\u5230\u526A\u5207\u677F\uFF01
share=\u5206\u4EAB
expandOrCollapse=\u5C55\u5F00/\u6536\u56DE
dataFilter.mine=\u6211\u7684
dataFilter.other=\u5206\u4EAB\u7684

35
datagear-web/src/main/resources/org/datagear/web/webapp/staticResource/static/css/common.css
View File

@ -74,7 +74,7 @@ form .form-content .form-item{
}
form .form-content .form-item .form-item-label{
display: inline-block;
width: 19%;
width: 20%;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@ -89,7 +89,8 @@ form .form-content .form-item .form-item-label label{
}
form .form-content .form-item .form-item-value{
display: inline-block;
width: 79%;
width: 80%;
margin-left: -0.5em;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@ -2195,6 +2196,12 @@ table.dataTable tbody tr .column-check .row-data-state .ui-icon{
.page-form-dashboard{
position: relative;
}
.page-form-dashboard.max-template-editor form .form-content .form-item .form-item-label{
width: 0;
}
.page-form-dashboard.max-template-editor form .form-content .form-item .form-item-value{
width: 100%;
}
.page-form-dashboard .form-item-value-template{
position: relative;
}
@ -2214,7 +2221,7 @@ table.dataTable tbody tr .column-check .row-data-state .ui-icon{
left: 0;
top: 0;
bottom: 0;
width: 70%;
right: 13.5em;
}
.page-form-dashboard .template-editor-wrapper .template-editor-parent .template-editor{
position: absolute;
@ -2223,17 +2230,18 @@ table.dataTable tbody tr .column-check .row-data-state .ui-icon{
top: 0;
bottom: 0;
}
.page-form-dashboard .template-editor-wrapper .insert-chart-button{
.page-form-dashboard .template-editor-wrapper .insert-chart-button-wrapper{
position: absolute;
left: 71%;
right: 0;
top: 0;
width: 13em;
}
.page-form-dashboard .template-editor-wrapper .dashboard-resource-wrapper{
position: absolute;
left: 71%;
right: 0;
top: 3em;
bottom: 0;
width: 13em;
}
.page-form-dashboard .template-editor-wrapper .dashboard-resource-wrapper .resource-title{
font-weight: normal;
@ -2278,7 +2286,7 @@ table.dataTable tbody tr .column-check .row-data-state .ui-icon{
.page-form-dashboard .template-editor-wrapper .dashboard-resource-wrapper .add-resource-panel{
position: absolute;
display: none;
width: 80%;
width: 120%;
right: 0px;
top: 1.8em;
padding: 0.3em 0.3em;
@ -2307,6 +2315,19 @@ table.dataTable tbody tr .column-check .row-data-state .ui-icon{
padding-top: 0.3em;
padding-bottom: 0.3em;
}
.page-form-dashboard .form-item-value-template .resize-editor-wrapper{
position: absolute;
left: -0.7em;
top: -0.5em;
display: inline-block;
z-index: 10;
}
.page-form-dashboard .form-item-value-template .resize-editor-wrapper .ui-button.ui-button-icon-only{
width: 1.4em;
height: 1.4em;
padding: 0.3em 0.3em;
border: 0;
}
.page-form-dashboard .show-button{
position: absolute;
top: 0.5em;

37
datagear-web/src/main/resources/org/datagear/web/webapp/view/freemarker/analysis/dashboard/dashboard_form.ftl
View File

@ -38,7 +38,9 @@ readonly 是否只读操作，允许为null
<div id="${pageId}-template-editor" class="template-editor"></div>
</div>
<#if !readonly>
<button type="button" class="insert-chart-button"><@spring.message code='dashboard.insertChart' /></button>
<div class="insert-chart-button-wrapper">
<button type="button" class="insert-chart-button"><@spring.message code='dashboard.insertChart' /></button>
</div>
</#if>
<div class="dashboard-resource-wrapper ui-widget ui-widget-content ui-corner-all">
<div class="resource-title ui-widget ui-widget-content">
@ -73,6 +75,9 @@ readonly 是否只读操作，允许为null
</div>
</div>
</div>
<div class="resize-editor-wrapper">
<button type='button' class='resize-editor-button ui-button ui-corner-all ui-widget ui-button-icon-only' title="<@spring.message code='expandOrCollapse' />"><span class='ui-icon ui-icon-arrowstop-1-w'></span><span class='ui-button-icon-space'></span></button>
</div>
</div>
</div>
<div class="form-item">
@ -101,9 +106,9 @@ readonly 是否只读操作，允许为null
(function(po)
{
$.initButtons(po.element());
var tewHeight = $(window).height()/2;
var tewHeight = $(window).height()*5/9;
po.element(".template-editor-wrapper").height(tewHeight);
po.element(".form-item-value-template").height(tewHeight + 35);
po.element(".form-item-value-template").height(tewHeight + 30);
po.url = function(action)
{
@ -152,6 +157,23 @@ readonly 是否只读操作，允许为null
po.element(".resource-content").selectable({classes: {"ui-selected": "ui-state-active"}});
po.element(".resize-editor-button").click(function()
{
var $ele = po.element();
var $icon = $(".ui-icon", this);
if($ele.hasClass("max-template-editor"))
{
$ele.removeClass("max-template-editor");
$icon.removeClass("ui-icon-arrowstop-1-e").addClass("ui-icon-arrowstop-1-w");
}
else
{
$ele.addClass("max-template-editor");
$icon.removeClass("ui-icon-arrowstop-1-w").addClass("ui-icon-arrowstop-1-e");
}
});
<#if !readonly>
po.getSelectedResourceName = function()
{
@ -391,12 +413,14 @@ readonly 是否只读操作，允许为null
rules :
{
"name" : "required",
"templateContent" : "dashboardTemplateContent"
"templateContent" : "dashboardTemplateContent",
"template" : "required"
},
messages :
{
"name" : "<@spring.message code='validation.required' />",
"templateContent" : "<@spring.message code='validation.required' />"
"templateContent" : "<@spring.message code='validation.required' />",
"template" : "<@spring.message code='validation.required' />"
},
submitHandler : function(form)
{
@ -430,6 +454,9 @@ readonly 是否只读操作，允许为null
});
</#if>
if(po.element("input[name='id']").val())
po.element(".resize-editor-button").click();
po.initTemplateEditor();
po.refreshDashboardResources();
})