forked from fanruan/demo-tabledata-redis
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
165 lines
5.5 KiB
165 lines
5.5 KiB
import { shortcut, store } from '../../../core/core'; |
|
import { HtapeXtype, EditorXtype, TextButtonXtype, TabXtype, IconComboXtype } from 'ui'; |
|
import { ParameterInputModel } from './parameter_input.model'; |
|
import { inputTypes } from '../parameter.typings'; |
|
import { getInput } from './input/input.service'; |
|
import './input/input'; |
|
import './parameter_input.less'; |
|
|
|
@shortcut() |
|
@store(ParameterInputModel) |
|
export class ParameterInput extends BI.BasicButton { |
|
static xtype = 'plugin.report.json.components.parameter_input' |
|
|
|
props = { |
|
inputName: '', |
|
inputValue: '', |
|
height: 22, |
|
id: '', |
|
baseCls: 'plugin-report-json-parameter-input', |
|
} |
|
|
|
store: ParameterInputModel['store'] |
|
model: ParameterInputModel['model'] |
|
|
|
tab: any; |
|
parameterName: any; |
|
parameterValue: any; |
|
iconCombo: any; |
|
|
|
render() { |
|
let { inputName, inputValue } = this.options; |
|
const { id } = this.options; |
|
|
|
return { |
|
type: HtapeXtype, |
|
cls: 'bi-border', |
|
items: [{ |
|
el: { |
|
type: EditorXtype, |
|
height: 22, |
|
allowBlank: true, |
|
value: inputName, |
|
ref: (_ref: any) => { |
|
this.parameterName = _ref; |
|
}, |
|
listeners: [{ |
|
eventName: BI.TextEditor.EVENT_CHANGE, |
|
action: () => { |
|
inputName = this.parameterName.getValue(); |
|
this.tab.setSelect(inputName ? 'string' : 'tip'); |
|
inputValue = inputName ? inputValue : ''; |
|
this.store.setParameterName(id, inputName); |
|
}, |
|
}, { |
|
eventName: BI.TextEditor.EVENT_FOCUS, |
|
action: () => { |
|
this.store.setSelectedId(id); |
|
}, |
|
}], |
|
}, |
|
width: 0.5, |
|
}, { |
|
el: { |
|
type: HtapeXtype, |
|
items: [{ |
|
type: TabXtype, |
|
single: true, |
|
showIndex: inputName ? 'string' : 'tip', |
|
ref: (_ref: any) => { |
|
this.tab = _ref; |
|
}, |
|
cardCreator: (index: inputTypes | 'tip') => this.renderInputs(index), |
|
}], |
|
}, |
|
width: 0.5, |
|
}], |
|
}; |
|
} |
|
|
|
private renderInputs(type: inputTypes | 'tip') { |
|
const { inputValue, id } = this.options; |
|
if (type === 'tip') { |
|
return { |
|
type: TextButtonXtype, |
|
cls: 'bi-error bi-border-left', |
|
text: BI.i18nText('Plugin-Redis_Parameter_Please_Set_Parameter_Name'), |
|
handler: () => { |
|
this.parameterName.focus(); |
|
}, |
|
}; |
|
} |
|
const xtype = getInput(type); |
|
|
|
return { |
|
type: HtapeXtype, |
|
items: [{ |
|
el: { |
|
type: IconComboXtype, |
|
cls: 'bi-border-left bi-border-right', |
|
height: 22, |
|
width: 25, |
|
value: type, |
|
items: this.renderDownList(), |
|
ref: (_ref: any) => { |
|
this.iconCombo = _ref; |
|
}, |
|
listeners: [{ |
|
eventName: 'EVENT_CHANGE', |
|
action: () => { |
|
this.tab.setSelect('tip'); |
|
const typeValue = this.iconCombo.getValue()[0]; |
|
if (typeValue) { |
|
this.tab.setSelect(typeValue); |
|
} |
|
}, |
|
}], |
|
}, |
|
width: 25, |
|
}, { |
|
type: xtype, |
|
value: inputValue, |
|
listeners: [{ |
|
eventName: 'EVENT_CHANGE', |
|
action: (value: string) => { |
|
const type = this.iconCombo.getValue()[0]; |
|
this.store.setParameterValue(id, value, type); |
|
}, |
|
}, { |
|
eventName: 'EVENT_FOCUS', |
|
action: () => { |
|
this.store.setSelectedId(id); |
|
}, |
|
}], |
|
}], |
|
}; |
|
} |
|
|
|
private renderDownList() { |
|
return [{ |
|
text: BI.i18nText('Plugin-Redis_Parameter_Type_String'), |
|
value: 'string', |
|
iconCls: 'input-string-font', |
|
}, { |
|
text: BI.i18nText('Plugin-Redis_Parameter_Type_Int'), |
|
value: 'int', |
|
iconCls: 'input-int-font', |
|
}, { |
|
text: BI.i18nText('Plugin-Redis_Parameter_Type_Number'), |
|
value: 'number', |
|
iconCls: 'input-number-font', |
|
}, { |
|
text: BI.i18nText('Plugin-Redis_Parameter_Type_Date'), |
|
value: 'date', |
|
iconCls: 'input-date-font', |
|
}, { |
|
text: BI.i18nText('Plugin-Redis_Parameter_Type_Boolean'), |
|
value: 'boolean', |
|
iconCls: 'input-boolean-font', |
|
}, { |
|
text: BI.i18nText('Plugin-Redis_Parameter_Type_Formula'), |
|
value: 'formula', |
|
iconCls: 'input-formula-font', |
|
}]; |
|
} |
|
}
|
|
|