Browse Source
* commit '4251ec36d4e3c0312236a42be001b6036012024f': DEC-19879 feat: 驱动管理-前端research/10.0
superman
3 years ago
6 changed files with 390 additions and 26 deletions
@ -0,0 +1,119 @@
|
||||
import { model, Model } from '@core/core'; |
||||
import { ConnectionJDBC } from '../../../../crud/crud.typings'; |
||||
import { getJdbcDatabaseType } from '../../../../app.service'; |
||||
import { ApiFactory } from '../../../../crud/apiFactory'; |
||||
|
||||
const api = new ApiFactory().create(); |
||||
|
||||
@model() |
||||
export class DriverSelectorModel extends Model { |
||||
static xtype = 'dec.dcm.model.maintain.form.jdbc.driver_selector'; |
||||
|
||||
state = () => { |
||||
const defaultDrivers = this.getDrivers(); |
||||
const [driverSource, selectedDriver] = this.resolveSelectedDriverType(); |
||||
|
||||
return { |
||||
defaultDrivers, |
||||
driverSource, |
||||
selectedDriverType: driverSource === '' ? 'default' : 'custom', |
||||
customDrivers: [], |
||||
defaultDriver: { |
||||
driver: driverSource === '' ? selectedDriver : '', |
||||
}, |
||||
customDriver: { |
||||
driver: driverSource !== '' ? selectedDriver : '', |
||||
text: driverSource !== '' ? `${this.options.driver} (${driverSource})` : '', |
||||
}, |
||||
}; |
||||
}; |
||||
|
||||
computed = { |
||||
driverClassItems: () => this.model.customDrivers.map(driver => { |
||||
return { |
||||
text: `${driver.driverClass} (${driver.name})`, |
||||
value: driver.driverClass, |
||||
}; |
||||
}), |
||||
|
||||
driverTypeComboValue: () => this.model.driverSource === '' ? 'default' : 'custom', |
||||
|
||||
driverManageEntryVisible: () => this.model.selectedDriverType === 'custom' && BI.Services.getService('dec.service.global').isAdmin(), |
||||
}; |
||||
|
||||
actions = { |
||||
initDriverClassList: cb => { |
||||
|
||||
api.getSimpleDriverList().then(res => { |
||||
this.model.customDrivers = res.data; |
||||
cb(); |
||||
}); |
||||
}, |
||||
|
||||
changeDefaultDriver: driver => { |
||||
this.model.defaultDriver.driver = driver; |
||||
this.model.driverSource = ''; |
||||
}, |
||||
|
||||
changeCustomDriver: driver => { |
||||
this.model.customDriver.driver = driver; |
||||
|
||||
|
||||
this.model.customDrivers.some(customDriver => { |
||||
if (customDriver.driverClass === driver) { |
||||
this.model.driverSource = customDriver.name; |
||||
this.model.customDriver.text = `${driver} (${customDriver.name})`; |
||||
|
||||
return true; |
||||
} |
||||
|
||||
return false; |
||||
}); |
||||
}, |
||||
|
||||
changeSelectedDriverType: driverTypeComboValue => { |
||||
this.model.selectedDriverType = driverTypeComboValue; |
||||
this.model.driverSource = driverTypeComboValue === 'default' ? '' : this.model.driverSource; |
||||
}, |
||||
|
||||
changeDriverSource: driverTypeComboValue => { |
||||
this.model.driverSource = driverTypeComboValue === 'default' ? '' : this.model.driverSource; |
||||
}, |
||||
}; |
||||
|
||||
private resolveSelectedDriverType = () => { |
||||
if (BI.isNotEmptyString(this.options.driverSource)) { |
||||
return [this.options.driverSource, this.options.driver]; |
||||
} |
||||
|
||||
return [this.options.driverSource, this.options.driver]; |
||||
}; |
||||
|
||||
private getDrivers = () => { |
||||
const connectionData = this.options.connectionData as ConnectionJDBC; |
||||
const connectionType = getJdbcDatabaseType(connectionData.database, connectionData.driver); |
||||
const drivers = connectionType.drivers ? |
||||
connectionType.drivers.map(item => { |
||||
return { |
||||
text: item, |
||||
value: item, |
||||
}; |
||||
}) : |
||||
[{ |
||||
text: connectionType.driver, |
||||
value: connectionType.driver, |
||||
}]; |
||||
|
||||
if (!drivers.some(item => item.text === connectionData.driver)) { |
||||
return [ |
||||
{ |
||||
text: connectionData.driver, |
||||
value: connectionData.driver, |
||||
}, |
||||
...drivers, |
||||
]; |
||||
} |
||||
|
||||
return drivers; |
||||
}; |
||||
} |
@ -0,0 +1,217 @@
|
||||
import { shortcut, store } from '@core/core'; |
||||
|
||||
import { |
||||
Button, |
||||
EditorIconCheckCombo, |
||||
SearchTextValueCombo, |
||||
TextValueCombo, |
||||
} from '@fui/core'; |
||||
import { ConnectionJDBC } from '../../../../crud/crud.typings'; |
||||
import { getJdbcDatabaseType } from '../../../../app.service'; |
||||
import { DriverSelectorModel } from './driverselector.model'; |
||||
|
||||
|
||||
@shortcut() |
||||
@store(DriverSelectorModel, { |
||||
props(this: DriverSelector) { |
||||
return this.options; |
||||
}, |
||||
}) |
||||
export class DriverSelector extends BI.Widget { |
||||
static xtype = 'dec.dcm.maintain.form.jdbc.driver_selector'; |
||||
|
||||
props = { |
||||
driver: '', |
||||
driverSource: '', |
||||
connectionData: {} as ConnectionJDBC, |
||||
}; |
||||
|
||||
defaultDrivers: EditorIconCheckCombo = null; |
||||
|
||||
customDrivers: SearchTextValueCombo = null; |
||||
|
||||
beforeRender(cb: Function) { |
||||
this.store.initDriverClassList(cb); |
||||
} |
||||
|
||||
watch = { |
||||
driverClassItems: items => { |
||||
this.customDrivers.populate(items); |
||||
this.customDrivers.setValue(this.model.customDriver.driver); |
||||
}, |
||||
|
||||
driverManageEntryVisible: b => { |
||||
this.driverManageEntry.setVisible(b); |
||||
}, |
||||
}; |
||||
|
||||
private driverManageEntry = null; |
||||
|
||||
render() { |
||||
const { driver } = this.options.connectionData; |
||||
|
||||
return { |
||||
type: BI.VerticalAdaptLayout.xtype, |
||||
rgap: 10, |
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: BI.TextValueCombo.xtype, |
||||
width: 86, |
||||
value: this.model.selectedDriverType, |
||||
items: [ |
||||
{ |
||||
text: BI.i18nText('Dec-Basic_Default'), |
||||
value: 'default', |
||||
}, { |
||||
text: BI.i18nText('Dec-Basic_Custom'), |
||||
value: 'custom', |
||||
}, |
||||
], |
||||
listeners: [ |
||||
{ |
||||
eventName: BI.TextValueCombo.EVENT_CHANGE, |
||||
action: value => { |
||||
this.store.changeSelectedDriverType(value); |
||||
if (value === 'default') { |
||||
this.defaultDrivers.setVisible(true); |
||||
this.customDrivers.setVisible(false); |
||||
|
||||
return; |
||||
} |
||||
|
||||
this.defaultDrivers.setVisible(false); |
||||
this.customDrivers.setVisible(true); |
||||
}, |
||||
}, |
||||
], |
||||
}, |
||||
}, { |
||||
el: { |
||||
type: BI.EditorIconCheckCombo.xtype, |
||||
$testId: 'dec-editor-icon-check-combo', |
||||
$value: 'driver', |
||||
ref: _ref => { |
||||
this.defaultDrivers = _ref; |
||||
}, |
||||
invisible: this.model.driverSource !== '', |
||||
width: 204, |
||||
items: this.model.defaultDrivers, |
||||
value: this.model.defaultDriver.driver, |
||||
listeners: [ |
||||
{ |
||||
eventName: BI.EditorIconCheckCombo.EVENT_CHANGE, |
||||
action: () => this.store.changeDefaultDriver(this.defaultDrivers.getValue()), |
||||
}, |
||||
], |
||||
}, |
||||
}, { |
||||
el: { |
||||
type: BI.SearchTextValueCombo.xtype, |
||||
$testId: 'dec-editor-icon-check-combo', |
||||
$value: 'driver', |
||||
ref: _ref => { |
||||
this.customDrivers = _ref; |
||||
}, |
||||
invisible: this.model.driverSource === '', |
||||
width: 204, |
||||
watermark: BI.i18nText('Dec-Please_Input'), |
||||
items: this.model.driverClassItems, |
||||
value: this.model.customDriver.driver, |
||||
text: () => this.model.customDriver.text || BI.i18nText('Dec-Please_Select'), |
||||
warningTitle: BI.i18nText('Dec-Dcm-Driver_Driver_File_Lost'), |
||||
listeners: [ |
||||
{ |
||||
eventName: BI.SearchTextValueCombo.EVENT_CHANGE, |
||||
action: () => this.store.changeCustomDriver(this.customDrivers.getValue()[0]), |
||||
}, |
||||
], |
||||
}, |
||||
}, { |
||||
el: { |
||||
type: BI.Button.xtype, |
||||
ref: (_ref: Button) => { |
||||
this.driverManageEntry = _ref; |
||||
}, |
||||
level: 'ignore', |
||||
text: BI.i18nText('Dec-Dcm_Create_New_Driver'), |
||||
invisible: !this.model.driverManageEntryVisible, |
||||
handler: () => { |
||||
this.createDriverManagerLayer(); |
||||
}, |
||||
}, |
||||
}, |
||||
], |
||||
}; |
||||
} |
||||
|
||||
private createDriverManagerLayer() { |
||||
const name = BI.UUID(); |
||||
|
||||
BI.Layers.create(name, '.dec-dcm', { |
||||
render: { |
||||
type: 'bi.vtape', |
||||
cls: 'bi-background', |
||||
items: [ |
||||
{ |
||||
type: 'bi.vertical_adapt', |
||||
cls: 'bi-card', |
||||
items: [ |
||||
{ |
||||
el: { |
||||
type: 'bi.icon_text_item', |
||||
text: BI.i18nText('Dec-Connection_Driver_Management_Exit'), |
||||
cls: 'back-font bi-high-light', |
||||
height: 24, |
||||
logic: { |
||||
dynamic: true, |
||||
}, |
||||
handler: () => { |
||||
this.store.initDriverClassList(() => BI.Layers.remove(name)); |
||||
}, |
||||
}, |
||||
hgap: 10, |
||||
}, |
||||
], |
||||
height: 40, |
||||
}, { |
||||
el: { |
||||
type: 'dec.connection.driver', |
||||
listeners: [ |
||||
{ |
||||
eventName: 'EVENT_CLOSE', |
||||
action() { |
||||
BI.Layers.remove(name); |
||||
}, |
||||
}, |
||||
], |
||||
}, |
||||
hgap: 10, |
||||
vgap: 10, |
||||
}, |
||||
], |
||||
}, |
||||
}); |
||||
|
||||
BI.Layers.show(name); |
||||
} |
||||
|
||||
validation(): boolean { |
||||
if (this.model.selectedDriverType === 'default' && BI.isKey(this.model.defaultDriver.driver)) { |
||||
return true; |
||||
} |
||||
if (this.model.selectedDriverType === 'custom' && BI.isKey(this.model.customDriver.driver)) { |
||||
return true; |
||||
} |
||||
BI.Msg.toast(BI.i18nText('Dec-Dcm_Driver_Class_Not_Allow_Empty'), { level: 'error' }); |
||||
|
||||
return false; |
||||
} |
||||
|
||||
getValue() { |
||||
return { |
||||
driverSource: this.model.driverSource, |
||||
driver: this.model.driverSource === '' ? this.model.defaultDriver.driver : this.model.customDriver.driver, |
||||
}; |
||||
} |
||||
} |
Loading…
Reference in new issue