19 changed files with 715 additions and 32 deletions
@ -0,0 +1,87 @@
|
||||
import {WidgetType, Icon, BubbleCombo, TextBubblePopupBarView} from '@ui/index'; |
||||
import LeftItemModel from './left.item.model'; |
||||
|
||||
const className = 'fr.component.linkSet.left.item.icon'; |
||||
const Widget: WidgetType = { |
||||
_store() { |
||||
return BI.Models.getModel(LeftItemModel); |
||||
}, |
||||
render() { |
||||
const {cls, title, id} = this.options; |
||||
const that = this; |
||||
let iconContent: any = null; |
||||
let combo: any = null; |
||||
if (title === '删除') { |
||||
return { |
||||
type: BubbleCombo, |
||||
direction: 'bottom', |
||||
ref () { |
||||
combo = this; |
||||
}, |
||||
el: { |
||||
type: Icon, |
||||
cls, |
||||
extraCls: 'action-icon', |
||||
height: 24, |
||||
width: 26, |
||||
title, |
||||
ref (ref: any) { |
||||
iconContent = ref; |
||||
}, |
||||
}, |
||||
popup: { |
||||
type: TextBubblePopupBarView, |
||||
text: '确定删除该数据连接？', |
||||
listeners: [{ |
||||
eventName: BI.BubblePopupBarView.EVENT_CLICK_TOOLBAR_BUTTON, |
||||
action (type: boolean) { |
||||
combo.hideView(); |
||||
if (type) { |
||||
that.store.onIconClick(title, id); |
||||
} |
||||
}, |
||||
}], |
||||
}, |
||||
listeners: [{ |
||||
eventName: BI.BubbleCombo.EVENT_EXPAND, |
||||
action () { |
||||
iconContent.element.css({ |
||||
visibility:'visible', |
||||
}); |
||||
}, |
||||
}, { |
||||
eventName: BI.BubbleCombo.EVENT_AFTER_HIDEVIEW, |
||||
action () { |
||||
iconContent.element.css({ |
||||
visibility:'hidden', |
||||
}); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
|
||||
return { |
||||
type: Icon, |
||||
cls, |
||||
extraCls: 'action-icon', |
||||
height: 24, |
||||
width: 26, |
||||
title, |
||||
}; |
||||
}, |
||||
mounted() { |
||||
const {title, id} = this.options; |
||||
if (title !== '删除') { |
||||
this.element.on('click', (event: any) => { |
||||
event.stopPropagation(); |
||||
this.store.onIconClick(title, id); |
||||
}); |
||||
} else { |
||||
this.element.on('click', (event: any) => { |
||||
event.stopPropagation(); |
||||
}); |
||||
} |
||||
}, |
||||
}; |
||||
BI.shortcut(className, BI.inherit(BI.Widget, Widget)); |
||||
export default className; |
||||
@ -1,21 +1,63 @@
|
||||
import {WidgetType, Vertical, Left, Label, Button} from '@ui/index'; |
||||
import RightDetailModel from './right.detail.model'; |
||||
import Title from '../right_title/right.title.component'; |
||||
import RightShow from '../right_show/right.show.component'; |
||||
import RightEdit from '../right_edit/right.edit.component'; |
||||
import {LinkType} from '@ui/type'; |
||||
const className = 'fr.component.right.detail'; |
||||
let rightDetail: any = null; |
||||
const Widget: WidgetType = { |
||||
_store() { |
||||
return BI.Models.getModel(RightDetailModel); |
||||
}, |
||||
watch:{ |
||||
linkSelected(linkSelected: LinkType) { |
||||
if (linkSelected.isSelected) { |
||||
rightDetail.populate(BI.createItems([ |
||||
{ |
||||
type: Title, |
||||
isEdit: true, |
||||
linkSelected, |
||||
}, { |
||||
type: RightEdit, |
||||
linkSelected, |
||||
}, |
||||
])); |
||||
} else { |
||||
rightDetail.populate(BI.createItems([ |
||||
{ |
||||
type: Title, |
||||
isEdit: false, |
||||
linkSelected, |
||||
}, { |
||||
type: RightShow, |
||||
linkSelected, |
||||
}, |
||||
])); |
||||
} |
||||
}, |
||||
}, |
||||
render() { |
||||
return { |
||||
type: Vertical, |
||||
cls:'right-content', |
||||
items: [ |
||||
{ |
||||
type: Title, |
||||
}, { |
||||
type: RightShow, |
||||
}, |
||||
], |
||||
ref(_ref: any) { |
||||
rightDetail = _ref; |
||||
}, |
||||
}; |
||||
}, |
||||
mounted() { |
||||
rightDetail.populate(BI.createItems([ |
||||
{ |
||||
type: Title, |
||||
isEdit: false, |
||||
linkSelected:false, |
||||
}, { |
||||
type: RightShow, |
||||
linkSelected:false, |
||||
}, |
||||
])); |
||||
}, |
||||
}; |
||||
BI.shortcut(className, BI.inherit(BI.Widget, Widget)); |
||||
export default className; |
||||
|
||||
@ -0,0 +1,6 @@
|
||||
const RightDetailModel = 'fr.model.linkSet.right.detail'; |
||||
const Model = BI.inherit(Fix.Model, { |
||||
context: ['linkList', 'linkSelected'], |
||||
}); |
||||
BI.model(RightDetailModel, Model); |
||||
export default RightDetailModel; |
||||
@ -0,0 +1,260 @@
|
||||
import {WidgetType, Vertical, MultiSelectItem, TextAreaEditor, Editor, Button, TextValueCombo} from '@ui/index'; |
||||
import {LinkType} from '@ui/type'; |
||||
import charset from './right.edit.constant'; |
||||
import RightEditModel from './right.edit.model'; |
||||
import FormItem from '@shared/components/form.item.component'; |
||||
import Title from '@shared/components/title.component'; |
||||
const className = 'fr.component.right.edit'; |
||||
const Widget: WidgetType = { |
||||
_store() { |
||||
return BI.Models.getModel(RightEditModel); |
||||
}, |
||||
render() { |
||||
const linkSelected: LinkType = this.model.linkSelected; |
||||
const that = this; |
||||
|
||||
return { |
||||
type: Vertical, |
||||
cls: 'right-show', |
||||
items: [ |
||||
{ |
||||
type: FormItem, |
||||
text: '数据连接名', |
||||
hint: '*修改数据连接名会影响相关数据表和仪表板', |
||||
form:{ |
||||
type: Editor, |
||||
cls: 'bi-border', |
||||
width: 300, |
||||
value: linkSelected.connectionName, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
connectionName: this.getValue(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '第一步', |
||||
height: 400, |
||||
form:{ |
||||
type: Vertical, |
||||
cls: 'right-form', |
||||
items:[ |
||||
{ |
||||
type: FormItem, |
||||
text: '驱动器', |
||||
form:{ |
||||
type: TextValueCombo, |
||||
cls: 'bi-border', |
||||
width: 300, |
||||
text: linkSelected.driver, |
||||
items: [{ |
||||
text: linkSelected.driver, |
||||
value: linkSelected.driver, |
||||
}], |
||||
listeners: [{ |
||||
eventName: BI.TextValueCombo.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
driver: this.getValue()[0], |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: 'URL', |
||||
form:{ |
||||
type: Editor, |
||||
cls: 'bi-border', |
||||
watermark:'请输入', |
||||
width: 300, |
||||
value: linkSelected.url, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
url: this.getValue(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '编码', |
||||
form:{ |
||||
type: TextValueCombo, |
||||
cls: 'bi-border', |
||||
width: 300, |
||||
text: linkSelected.originalCharsetName === '' ? '自动' : linkSelected.originalCharsetName, |
||||
items: BI.Constants.getConstant(charset), |
||||
listeners: [{ |
||||
eventName: BI.TextValueCombo.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
originalCharsetName: this.getValue()[0], |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '用户名', |
||||
form:{ |
||||
type: Editor, |
||||
cls: 'bi-border', |
||||
allowBlank:true, |
||||
watermark:'请输入', |
||||
width: 300, |
||||
value: linkSelected.user, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
user: this.getValue(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '密码', |
||||
form:{ |
||||
type: Editor, |
||||
cls: 'bi-border', |
||||
inputType:'password', |
||||
allowBlank:true, |
||||
watermark:'请输入', |
||||
width: 300, |
||||
value: linkSelected.password, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
password: this.getValue(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: Title, |
||||
text: '连接池属性', |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: 'SQL验证查询', |
||||
height: 100, |
||||
form:{ |
||||
type: TextAreaEditor, |
||||
cls: 'bi-border', |
||||
allowBlank:true, |
||||
watermark:'请输入', |
||||
width: 300, |
||||
height:100, |
||||
value: linkSelected.validationQuery, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
validationQuery: this.getValue(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '获取连接前校验', |
||||
form:{ |
||||
type: MultiSelectItem, |
||||
text: '是', |
||||
selected: linkSelected.testOnBorrow, |
||||
width: 60, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
testOnBorrow: this.isSelected(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '最大活动连接数', |
||||
form:{ |
||||
type: Editor, |
||||
cls: 'bi-border', |
||||
allowBlank:true, |
||||
watermark:'请输入', |
||||
width: 60, |
||||
value: linkSelected.maxActive, |
||||
errorText: '请输入有效的正整数', |
||||
validationChecker (v: string) { |
||||
if (/^\+?[1-9][0-9]*$/.test(v)) { |
||||
return true; |
||||
} |
||||
|
||||
return false; |
||||
}, |
||||
listeners: [{ |
||||
eventName: BI.Editor.EVENT_CHANGE, |
||||
action() { |
||||
that.store.setLinkUpdate({ |
||||
...that.model.linkUpdate, |
||||
maxActive: this.getValue(), |
||||
}); |
||||
}, |
||||
}], |
||||
}, |
||||
}, |
||||
], |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '第二步', |
||||
form: { |
||||
type: Button, |
||||
text: '测试连接', |
||||
level: 'ignore', |
||||
}, |
||||
}, |
||||
{ |
||||
type: FormItem, |
||||
text: '第三步', |
||||
form: { |
||||
type: FormItem, |
||||
text: '模式', |
||||
form: { |
||||
type: Editor, |
||||
cls: 'bi-border', |
||||
width: 300, |
||||
disabled: true, |
||||
}, |
||||
}, |
||||
}, |
||||
], |
||||
}; |
||||
}, |
||||
}; |
||||
BI.shortcut(className, BI.inherit(BI.Widget, Widget)); |
||||
export default className; |
||||
@ -0,0 +1,41 @@
|
||||
export const ConstantName = 'bi.constant.linkSet.right.edit.charset'; |
||||
export const Constant = BI.constant(ConstantName, [ |
||||
{ |
||||
text: '自动', |
||||
value: '', |
||||
}, |
||||
{ |
||||
text: 'GBK', |
||||
value: 'GBK', |
||||
}, |
||||
{ |
||||
text: 'BIG5', |
||||
value: 'BIG5', |
||||
}, |
||||
{ |
||||
text: 'ISO-8859-1', |
||||
value: 'ISO-8859-1', |
||||
}, |
||||
{ |
||||
text: 'UTF-8', |
||||
value: 'UTF-8', |
||||
}, |
||||
{ |
||||
text: 'UTF-16', |
||||
value: 'UTF-16', |
||||
}, |
||||
{ |
||||
text: 'EUC_JP', |
||||
value: 'EUC_JP', |
||||
}, |
||||
{ |
||||
text: 'EUC_KR', |
||||
value: 'EUC_KR', |
||||
}, |
||||
{ |
||||
text: 'CP850', |
||||
value: 'CP850', |
||||
}, |
||||
]); |
||||
|
||||
export default ConstantName; |
||||
@ -0,0 +1,11 @@
|
||||
const RightEditModel = 'fr.model.linkSet.right.edit'; |
||||
const Model = BI.inherit(Fix.Model, { |
||||
context: ['linkList', 'linkSelected', 'linkUpdate'], |
||||
actions: { |
||||
setLinkUpdate(value: any) { |
||||
this.model.linkUpdate = value; |
||||
}, |
||||
}, |
||||
}); |
||||
BI.model(RightEditModel, Model); |
||||
export default RightEditModel; |
||||
@ -0,0 +1,15 @@
|
||||
const RightTitleModel = 'fr.model.linkSet.right.title'; |
||||
const Model = BI.inherit(Fix.Model, { |
||||
context: ['linkList', 'linkSelected', 'linkUpdate'], |
||||
actions: { |
||||
setEdit(type: boolean) { |
||||
this.model.linkSelected = { |
||||
...this.model.linkSelected, |
||||
isSelected: type, |
||||
}; |
||||
this.model.linkUpdate = this.model.linkSelected; |
||||
}, |
||||
}, |
||||
}); |
||||
BI.model(RightTitleModel, Model); |
||||
export default RightTitleModel; |
||||
@ -0,0 +1,29 @@
|
||||
import {WidgetType, Htape, Label} from '@ui/index'; |
||||
const className = 'fr.shared.component.form.item'; |
||||
const Widget: WidgetType = { |
||||
render() { |
||||
const {text, form, hint, height} = this.options; |
||||
|
||||
return { |
||||
type: Htape, |
||||
cls: 'both-side', |
||||
height:height ? height : 24, |
||||
items: [{ |
||||
el: { |
||||
type: Label, |
||||
cls: 'left', |
||||
textAlign: 'left', |
||||
text, |
||||
}, |
||||
width: 115, |
||||
}, form, { |
||||
type: Label, |
||||
cls: 'hint', |
||||
textAlign: 'left', |
||||
text: hint, |
||||
}], |
||||
}; |
||||
}, |
||||
}; |
||||
BI.shortcut(className, BI.inherit(BI.Widget, Widget)); |
||||
export default className; |
||||
@ -1 +1 @@
|
||||
export const linkList = {"data":[{"connectionId":"8c1c52f1-3d0a-429e-b35f-ee1e085a8b72","database":"","connectionName":"FRDemo","driver":"org.sqlite.JDBC","url":"jdbc:sqlite://${ENV_HOME}/../help/FRDemo.db","user":"","password":"","queryType":"","newCharsetName":'null',"originalCharsetName":'',"validationQuery":"","schema":"","testOnBorrow":false,"maxActive":50,"options":'null',"port":0,"authType":"","creator":"designer","principal":"","keyPath":"","databaseType":"designer","privilegeDetailBeanList":'null'}]} |
||||
export const linkList = {"data":[{"connectionId":"8c1c52f1-3d0a-429e-b35f-ee1e085a8b72","database":"","connectionName":"FRDemo","driver":"org.sqlite.JDBC","url":"jdbc:sqlite://${ENV_HOME}/../help/FRDemo.db","user":"","password":"","queryType":"","newCharsetName":'null',"originalCharsetName":'',"validationQuery":"","schema":"","testOnBorrow":true,"maxActive":50,"options":'null',"port":0,"authType":"","creator":"designer","principal":"","keyPath":"","databaseType":"designer","privilegeDetailBeanList":'null'}]} |
||||
|
||||
@ -0,0 +1,34 @@
|
||||
export const confirm = (message: string, onConfirm: Function): void => { |
||||
const id = BI.UUID(); |
||||
BI.Popovers.create(id, { |
||||
type: 'bi.bar_popover', |
||||
size: 'normal', |
||||
header: '提示', |
||||
width: 450, |
||||
height: 220, |
||||
body: { |
||||
type: 'bi.left', |
||||
cls: 'comfirm-content', |
||||
items: [ |
||||
{ |
||||
type: 'bi.layout', |
||||
cls: 'comfirm-icon', |
||||
width: 50, |
||||
height: 50, |
||||
}, |
||||
{ |
||||
type: 'bi.label', |
||||
text: message, |
||||
}, |
||||
], |
||||
}, |
||||
listeners: [ |
||||
{ |
||||
eventName: 'EVENT_CONFIRM', |
||||
action () { |
||||
onConfirm ? onConfirm() : null; |
||||
}, |
||||
}, |
||||
], |
||||
}).open(id); |
||||
}; |
||||
Loading…
Reference in new issue