diff --git a/src/main/webapp/assets/css/form-design.css b/src/main/webapp/assets/css/form-design.css
index b538fef13..722802526 100644
--- a/src/main/webapp/assets/css/form-design.css
+++ b/src/main/webapp/assets/css/form-design.css
@@ -1,6 +1,7 @@
.rb-content .main-content {
margin-right: 300px;
}
+
.rb-right-sidebar.field-aside {
width: 300px;
}
@@ -96,7 +97,16 @@
margin-left: 1px;
}
-.form-preview .dd-item, .form-preview .dd-placeholder {
+.dd-list .dd-item .dd-action a.icon {
+ position: absolute;
+}
+
+.dd-list .dd-item .dd-action a.icon>.zmdi {
+ font-size: 16px;
+}
+
+.form-preview .dd-item,
+.form-preview .dd-placeholder {
float: left;
width: 49%;
margin-left: 0.5%;
@@ -113,9 +123,7 @@
width: 99% !important;
}
-.form-preview .dd-item a.rowspan {
-
-}
+.form-preview .dd-item a.rowspan {}
.form-preview .dd-item span.ft {
top: 13px;
@@ -129,7 +137,8 @@
background-color: #eee;
}
-.form-preview .dd-item, .form-preview .dd-handle {
+.form-preview .dd-item,
+.form-preview .dd-handle {
cursor: move !important;
}
@@ -167,4 +176,20 @@
.field-list .nodata {
margin-top: 5px;
background-color: #fff;
+}
+
+.field-edit {
+ max-width: 400px;
+ margin: 0 auto;
+}
+
+.field-edit label {
+ font-weight: bold;
+}
+
+.dd-list .dd-item .dd-handle span>i {
+ font-size: 14px;
+ margin-left: 5px;
+ color: #999;
+ cursor: help;
}
\ No newline at end of file
diff --git a/src/main/webapp/assets/js/entity/form-design.jsx b/src/main/webapp/assets/js/entity/form-design.jsx
index 819d1ad9d..c8554ed61 100644
--- a/src/main/webapp/assets/js/entity/form-design.jsx
+++ b/src/main/webapp/assets/js/entity/form-design.jsx
@@ -20,7 +20,7 @@ $(document).ready(function () {
check_empty()
})
} else {
- render_item({ ...field, isFull: this.isFull || false }, '.form-preview')
+ render_item({ ...field, isFull: this.isFull || false, tip: this.tip || null }, '.form-preview')
}
})
@@ -42,7 +42,7 @@ $(document).ready(function () {
$('.form-preview .J_field').each(function () {
let _this = $(this)
if (!_this.data('field')) return
- let item = { field: _this.data('field'), isFull: _this.parent().hasClass('w-100') }
+ let item = { field: _this.data('field'), isFull: _this.parent().hasClass('w-100'), tip: _this.find('.J_tip').attr('title') }
if (item.field === '$DIVIDER$') item.label = _this.find('span').text()
elements.push(item)
})
@@ -65,18 +65,35 @@ $(document).ready(function () {
}).trigger('resize')
})
const render_item = function (data) {
- let item = $('
').appendTo('.form-preview')
+ const item = $('').appendTo('.form-preview')
if (data.isFull === true) item.addClass('w-100')
let handle = $('' + data.fieldLabel + '
').appendTo(item)
if (data.creatable === false) handle.addClass('readonly')
else if (data.nullable === false) handle.addClass('not-nullable')
+ if (data.tip) {
+ let tip = $('').appendTo(handle.find('span'))
+ tip.attr('title', data.tip)
+ }
+
let action = $('').appendTo(handle)
if (data.displayType) {
$('' + data.displayType.split('(')[0].trim() + '').appendTo(item)
- $('[双列]').appendTo(action).click(function () { item.removeClass('w-100') })
- $('[单列]').appendTo(action).click(function () { item.addClass('w-100') })
+ $('[双]').appendTo(action).click(function () { item.removeClass('w-100') })
+ $('[单]').appendTo(action).click(function () { item.addClass('w-100') })
+ $('[修改]').appendTo(action).click(function () {
+ let call = function (nv) {
+ let tip = item.find('.dd-handle span>i')
+ if (!nv) {
+ tip.remove()
+ } else {
+ if (tip.length === 0) tip = $('').appendTo(item.find('.dd-handle span'))
+ tip.attr('title', nv)
+ }
+ }
+ renderRbcomp()
+ })
$('[移除]').appendTo(action).click(function () {
render_unset(data)
item.remove()
@@ -86,7 +103,12 @@ const render_item = function (data) {
if (data.fieldName === '$DIVIDER$') {
item.addClass('divider')
- $('[修改]').appendTo(action).click(function () { modify_divider(handle) })
+ $('[修改]').appendTo(action).click(function () {
+ let call = function (nv) {
+ item.find('.dd-handle span').text(nv || '分栏')
+ }
+ renderRbcomp()
+ })
$('[移除]').appendTo(action).click(function () {
item.remove()
check_empty()
@@ -111,13 +133,75 @@ const check_empty = function () {
if ($('.form-preview .dd-item').length === 0) $('.form-preview .nodata').show()
else $('.form-preview .nodata').hide()
}
-const modify_divider = function (handle) {
- let input = ''
- rb.alert(input, '修改分栏名称', {
- html: true, showIcon: false, confirm: function () {
- this.hide()
- let name = $(this.refs['dlg']).find('input').val() || '分栏'
- if (name) handle.find('span').text(name)
- }
- })
+
+class DlgEditField extends React.Component {
+ constructor(props) {
+ super(props)
+ this.state = { ...props }
+ }
+ render() {
+ return (
+ this._dlg = c} tabIndex="-1">
+
+
+
+
+
+
+ {this.renderComp()}
+
+
+
+
+ )
+ }
+ renderComp() {
+ return (
+
+ )
+ }
+ confirm() {
+ let val = $val(this._value)
+ // eslint-disable-next-line react/prop-types
+ typeof this.props.call === 'function' && this.props.call(val)
+ this.hide()
+ }
+ componentDidMount() {
+ this.show()
+ // eslint-disable-next-line react/prop-types
+ if (this.props.value) $(this._value).val(this.props.value)
+ }
+ hide() {
+ $(this._dlg).modal('hide')
+ }
+ show() {
+ $(this._dlg).modal({ show: true, keyboard: true })
+ }
+}
+
+class DlgEditDivider extends DlgEditField {
+ constructor(props) {
+ super(props)
+ }
+ renderComp() {
+ return (
+
+ )
+ }
}
\ No newline at end of file