|
|
|
@ -1,10 +1,11 @@
|
|
|
|
|
import { shortcut, store } from '@core/core'; |
|
|
|
|
import { Label, LeftRightVerticalAdapt, IconLabel, Left, IconButton, BubbleCombo, TextBubblePopupBarView } from 'ui'; |
|
|
|
|
import { Label, LeftRightVerticalAdapt, IconLabel, Left, IconButton, BubbleCombo, TextBubblePopupBarView, DownListCombo, Vertical, ButtonGroup, SignEditor } from 'ui'; |
|
|
|
|
import './list_item.less'; |
|
|
|
|
import { ListItemModel, ListItemModelXtype } from './list_item.model'; |
|
|
|
|
import { PAGE_INDEX } from '@constants/constant'; |
|
|
|
|
import { TestStatusXtype, TestStatus, EVENT_CLOSE, EVENT_RELOAD } from 'src/modules/components/test_status/test_status'; |
|
|
|
|
import { hasRegistered } from '../list.service'; |
|
|
|
|
import { IconTextXtype } from './icon_text'; |
|
|
|
|
export const ListItemXtype = 'dec.dcm.connection.list_item'; |
|
|
|
|
@shortcut(ListItemXtype) |
|
|
|
|
@store(ListItemModelXtype) |
|
|
|
@ -21,11 +22,22 @@ export class ListItem extends BI.BasicButton {
|
|
|
|
|
model: ListItemModel['model']; |
|
|
|
|
|
|
|
|
|
comboWidget: any; |
|
|
|
|
nameLabel: any; |
|
|
|
|
nameEditor: any; |
|
|
|
|
testStatus: TestStatus; |
|
|
|
|
|
|
|
|
|
watch = { |
|
|
|
|
isEdit: (isEdit: boolean) => { |
|
|
|
|
this.nameLabel.setVisible(!isEdit); |
|
|
|
|
this.nameEditor.setVisible(isEdit); |
|
|
|
|
if (isEdit) { |
|
|
|
|
this.nameEditor.focus(); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
render() { |
|
|
|
|
const { name, creator, databaseType } = this.options; |
|
|
|
|
const isRegistered = hasRegistered(databaseType); |
|
|
|
|
const { name } = this.options; |
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
type: LeftRightVerticalAdapt, |
|
|
|
@ -40,126 +52,195 @@ export class ListItem extends BI.BasicButton {
|
|
|
|
|
{ |
|
|
|
|
type: Label, |
|
|
|
|
text: name, |
|
|
|
|
ref: (_ref: any) => { |
|
|
|
|
this.nameLabel = _ref; |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: SignEditor, |
|
|
|
|
value: name, |
|
|
|
|
width: 100, |
|
|
|
|
invisible: !this.model.isEdit, |
|
|
|
|
ref: (_ref: any) => { |
|
|
|
|
this.nameEditor = _ref; |
|
|
|
|
}, |
|
|
|
|
listeners: [{ |
|
|
|
|
eventName: BI.SignEditor.EVENT_BLUR, |
|
|
|
|
action: () => { |
|
|
|
|
const newName = this.nameEditor.getValue(); |
|
|
|
|
this.store.changeName(name, newName).then(() => { |
|
|
|
|
this.store.setIsEdit(false); |
|
|
|
|
this.nameLabel.setText(newName); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
}], |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
right: [ |
|
|
|
|
{ |
|
|
|
|
type: Left, |
|
|
|
|
cls: 'link-item-icon bi-background', |
|
|
|
|
type: DownListCombo, |
|
|
|
|
cls: 'link-item-icon', |
|
|
|
|
stopPropagation: true, |
|
|
|
|
hgap: 8, |
|
|
|
|
items: [ |
|
|
|
|
{ |
|
|
|
|
type: IconButton, |
|
|
|
|
cls: 'dcm-test-font icon-size-16', |
|
|
|
|
title: BI.i18nText('Dec-Dcm_Test_Connection'), |
|
|
|
|
stopPropagation: true, |
|
|
|
|
invisible: !isRegistered, |
|
|
|
|
handler: () => { |
|
|
|
|
this.store.setConnectionSelected(name); |
|
|
|
|
const id = BI.UUID(); |
|
|
|
|
const testConnection = () => { |
|
|
|
|
this.store.testConnection().then(re => { |
|
|
|
|
if (re && re.errorCode) { |
|
|
|
|
this.testStatus.setFail(re.errorMsg); |
|
|
|
|
} else if (re.data) { |
|
|
|
|
this.testStatus.setSuccess(); |
|
|
|
|
setTimeout(() => { |
|
|
|
|
BI.Maskers.remove(id); |
|
|
|
|
}, 1000 * 2); |
|
|
|
|
} else { |
|
|
|
|
BI.Msg.toast(BI.i18nText('Dec-Dcm_Connection_Error'), { |
|
|
|
|
level: 'error', |
|
|
|
|
}); |
|
|
|
|
BI.Maskers.remove(id); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
BI.Maskers.create(id, null, { |
|
|
|
|
render: { |
|
|
|
|
type: TestStatusXtype, |
|
|
|
|
loadingText: BI.i18nText('Dec-Dcm_Connection_Testing'), |
|
|
|
|
loadingCls: 'upload-loading-icon', |
|
|
|
|
successText: BI.i18nText('Dec-Dcm_Connection_Test_Success'), |
|
|
|
|
successCls: 'upload-success-icon', |
|
|
|
|
failText: BI.i18nText('Dec-Dcm_Connection_Test_Fail', name), |
|
|
|
|
failCls: 'upload-fail-icon', |
|
|
|
|
retryText: BI.i18nText('Dec-Dcm_Connection_ReConnect'), |
|
|
|
|
ref: (_ref: any) => { |
|
|
|
|
this.testStatus = _ref; |
|
|
|
|
}, |
|
|
|
|
listeners: [ |
|
|
|
|
{ |
|
|
|
|
eventName: EVENT_RELOAD, |
|
|
|
|
action: () => { |
|
|
|
|
this.testStatus.setLoading(); |
|
|
|
|
testConnection(); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
eventName: EVENT_CLOSE, |
|
|
|
|
action: () => { |
|
|
|
|
BI.Maskers.remove(id); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
BI.Maskers.show(id); |
|
|
|
|
testConnection(); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: IconButton, |
|
|
|
|
cls: 'copy-font icon-size-16', |
|
|
|
|
title: BI.i18nText('Dec-Dcm_Copy'), |
|
|
|
|
stopPropagation: true, |
|
|
|
|
invisible: !isRegistered, |
|
|
|
|
handler: () => { |
|
|
|
|
this.store.setConnectionSelected(name); |
|
|
|
|
this.store.setPageIndex(PAGE_INDEX.MAINTAIN); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: IconButton, |
|
|
|
|
cls: 'dcm-info-font icon-size-16', |
|
|
|
|
title: `${BI.i18nText('Dec-Dcm_Type', databaseType)}\r\n${BI.i18nText('Dec-Dcm_Creator', creator)}`, |
|
|
|
|
stopPropagation: true, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: BubbleCombo, |
|
|
|
|
stopPropagation: true, |
|
|
|
|
direction: 'bottom', |
|
|
|
|
ref: _ref => { |
|
|
|
|
this.comboWidget = _ref; |
|
|
|
|
}, |
|
|
|
|
el: { |
|
|
|
|
type: IconLabel, |
|
|
|
|
cls: 'dcm-delete-font icon-size-16', |
|
|
|
|
title: BI.i18nText('Dec-Dcm_Delete'), |
|
|
|
|
}, |
|
|
|
|
popup: { |
|
|
|
|
type: TextBubblePopupBarView, |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Connection_Make_Sure_Delete'), |
|
|
|
|
listeners: [{ |
|
|
|
|
eventName: BI.BubblePopupBarView.EVENT_CLICK_TOOLBAR_BUTTON, |
|
|
|
|
action: (ok: boolean) => { |
|
|
|
|
this.comboWidget.hideView(); |
|
|
|
|
if (ok) { |
|
|
|
|
this.store.deleteConnection(name); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}], |
|
|
|
|
}, |
|
|
|
|
el: { |
|
|
|
|
type: IconButton, |
|
|
|
|
cls: 'dcm-link-other-font icon-size-16', |
|
|
|
|
}, |
|
|
|
|
items: this.renderDownList(), |
|
|
|
|
listeners: [{ |
|
|
|
|
eventName: BI.DownListCombo.EVENT_CHANGE, |
|
|
|
|
action: (value: string) => { |
|
|
|
|
this.itemActionCalculate().actionClac(value); |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}], |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
private renderDownList() { |
|
|
|
|
const { creator, databaseType } = this.options; |
|
|
|
|
const isRegistered = hasRegistered(databaseType); |
|
|
|
|
const otherIcons = [ |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Type', databaseType), |
|
|
|
|
cls: 'dcm-info-font', |
|
|
|
|
value: 12, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Creator', creator), |
|
|
|
|
value: 12, |
|
|
|
|
}, |
|
|
|
|
]; |
|
|
|
|
if (!isRegistered) { |
|
|
|
|
return [otherIcons]; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
return [ |
|
|
|
|
[ |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Test_Connection'), |
|
|
|
|
cls: 'dcm-test-font', |
|
|
|
|
value: 'test', |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Edit'), |
|
|
|
|
cls: 'dcm-link-edit-font', |
|
|
|
|
value: 'edit', |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Change_Name'), |
|
|
|
|
cls: 'dcm-change-name-font', |
|
|
|
|
value: 'changeName', |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Copy'), |
|
|
|
|
cls: 'copy-font', |
|
|
|
|
value: 'copy', |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
text: BI.i18nText('Dec-Dcm_Delete'), |
|
|
|
|
cls: 'dcm-delete-font', |
|
|
|
|
value: 'delete', |
|
|
|
|
bubble: BI.i18nText('Dec-Dcm_Connection_Make_Sure_Delete'), |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
otherIcons, |
|
|
|
|
]; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
doClick() { |
|
|
|
|
const { name } = this.options; |
|
|
|
|
this.store.setConnectionSelected(name); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
private testConnectionAction() { |
|
|
|
|
const { name } = this.options; |
|
|
|
|
const id = BI.UUID(); |
|
|
|
|
const testConnection = () => { |
|
|
|
|
this.store.testConnection(name).then(re => { |
|
|
|
|
if (re && re.errorCode) { |
|
|
|
|
this.testStatus.setFail(re.errorMsg); |
|
|
|
|
} else if (re.data) { |
|
|
|
|
this.testStatus.setSuccess(); |
|
|
|
|
setTimeout(() => { |
|
|
|
|
BI.Maskers.remove(id); |
|
|
|
|
}, 1000 * 2); |
|
|
|
|
} else { |
|
|
|
|
BI.Msg.toast(BI.i18nText('Dec-Dcm_Connection_Error'), { |
|
|
|
|
level: 'error', |
|
|
|
|
}); |
|
|
|
|
BI.Maskers.remove(id); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}; |
|
|
|
|
BI.Maskers.create(id, null, { |
|
|
|
|
render: { |
|
|
|
|
type: TestStatusXtype, |
|
|
|
|
loadingText: BI.i18nText('Dec-Dcm_Connection_Testing'), |
|
|
|
|
loadingCls: 'upload-loading-icon', |
|
|
|
|
successText: BI.i18nText('Dec-Dcm_Connection_Test_Success'), |
|
|
|
|
successCls: 'upload-success-icon', |
|
|
|
|
failText: BI.i18nText('Dec-Dcm_Connection_Test_Fail', name), |
|
|
|
|
failCls: 'upload-fail-icon', |
|
|
|
|
retryText: BI.i18nText('Dec-Dcm_Connection_ReConnect'), |
|
|
|
|
ref: (_ref: any) => { |
|
|
|
|
this.testStatus = _ref; |
|
|
|
|
}, |
|
|
|
|
listeners: [ |
|
|
|
|
{ |
|
|
|
|
eventName: EVENT_RELOAD, |
|
|
|
|
action: () => { |
|
|
|
|
this.testStatus.setLoading(); |
|
|
|
|
testConnection(); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
eventName: EVENT_CLOSE, |
|
|
|
|
action: () => { |
|
|
|
|
BI.Maskers.remove(id); |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
}); |
|
|
|
|
BI.Maskers.show(id); |
|
|
|
|
testConnection(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
private itemActionCalculate() { |
|
|
|
|
const { name } = this.options; |
|
|
|
|
const actionsMap = { |
|
|
|
|
test: this.testConnectionAction.bind(this), |
|
|
|
|
edit: () => { |
|
|
|
|
this.store.setConnectionSelected(name); |
|
|
|
|
this.store.getConnectionStatus().then(re => { |
|
|
|
|
if (re.data && re.data === 'success') { |
|
|
|
|
this.store.setPageIndex(PAGE_INDEX.MAINTAIN); |
|
|
|
|
this.store.setDatebaseTypeSelected(''); |
|
|
|
|
} else { |
|
|
|
|
BI.Msg.toast(BI.i18nText('Dec-Dcm_Connection_Is_Using', re.errorMsg), { |
|
|
|
|
level: 'error', |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
changeName: () => { |
|
|
|
|
this.store.setIsEdit(true); |
|
|
|
|
}, |
|
|
|
|
copy: () => { |
|
|
|
|
this.store.setConnectionSelected(name); |
|
|
|
|
this.store.setPageIndex(PAGE_INDEX.MAINTAIN); |
|
|
|
|
}, |
|
|
|
|
delete: () => { |
|
|
|
|
this.store.deleteConnection(name); |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
return { |
|
|
|
|
actionClac: (name: string) => actionsMap[name] && actionsMap[name](), |
|
|
|
|
}; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|