forked from fanruan/demo-tabledata-redis
alan
5 years ago
14 changed files with 0 additions and 710 deletions
@ -1,40 +0,0 @@
|
||||
import { model, Model } from '../../core/core'; |
||||
import { ParametersType } from './parameter.typings'; |
||||
|
||||
@model() |
||||
export class ParameterModel extends Model { |
||||
static xtype = 'plugin.model.report.json.components.parameter'; |
||||
|
||||
childContext = <const>['selectedId', 'parameters']; |
||||
|
||||
state() { |
||||
return { |
||||
parameters: [] as ParametersType[], |
||||
selectedId: '', |
||||
}; |
||||
} |
||||
|
||||
actions = { |
||||
setParameters: (parameters: ParametersType[]) => { |
||||
this.model.parameters = parameters; |
||||
}, |
||||
removeSelectedParameter: () => { |
||||
this.setParameters(this.model.parameters.filter(item => item.id !== this.model.selectedId)); |
||||
}, |
||||
move: (type: 'up'|'down') => { |
||||
if (this.model.selectedId) { |
||||
const index = this.model.parameters.findIndex(item => item.id === this.model.selectedId); |
||||
if (type === 'up' && index > 0) { |
||||
const oldItem = this.model.parameters.splice(index, 1)[0]; |
||||
this.model.parameters.splice(index - 1, 0, oldItem); |
||||
} |
||||
if (type === 'down' && index < this.model.parameters.length - 1) { |
||||
const oldItem = this.model.parameters.splice(index, 1)[0]; |
||||
this.model.parameters.splice(index + 1, 0, oldItem); |
||||
} |
||||
} |
||||
}, |
||||
} |
||||
} |
||||
|
||||
|
@ -1,172 +0,0 @@
|
||||
import { shortcut, store } from '../../core/core'; |
||||
import { VtapeXtype, LabelXtype, HtapeXtype, LeftRightVerticalAdaptLayoutXtype, IconButtonXtype, ButtonGroupXtype, VerticalXtype } from 'ui'; |
||||
import { ParameterInput } from './parameter_input/parameter_input'; |
||||
import { ParameterModel } from './parameter.model'; |
||||
import { ParametersType } from './parameter.typings'; |
||||
|
||||
@shortcut() |
||||
@store(ParameterModel) |
||||
export class Parameter extends BI.Widget { |
||||
static xtype = 'plugin.report.redis.components.parameter'; |
||||
props = { |
||||
title: '', |
||||
showRefresh: true, |
||||
height: 200, |
||||
value: [] as ParametersType[], |
||||
} |
||||
|
||||
parameterInputs: any; |
||||
|
||||
model: ParameterModel['model'] |
||||
store: ParameterModel['store'] |
||||
|
||||
watch = { |
||||
parameters: () => { |
||||
this.parameterInputs.populate(this.renderParameterInputs()); |
||||
}, |
||||
selectedId: (id: string) => { |
||||
this.parameterInputs.setValue(id); |
||||
}, |
||||
} |
||||
|
||||
render() { |
||||
const { title, showRefresh } = this.options; |
||||
this.setDefalue(); |
||||
|
||||
return { |
||||
type: VtapeXtype, |
||||
items: [{ |
||||
el: { |
||||
type: LeftRightVerticalAdaptLayoutXtype, |
||||
items: { |
||||
left: [{ |
||||
type: LabelXtype, |
||||
lgap: 2, |
||||
text: title, |
||||
textAlign: 'left', |
||||
}], |
||||
right: [{ |
||||
type: IconButtonXtype, |
||||
cls: 'text-add-tip-font', |
||||
width: 25, |
||||
title: BI.i18nText('Plugin-Redis_Parameter_Insert'), |
||||
handler: () => { |
||||
this.store.setParameters([{ |
||||
name: '', |
||||
value: '', |
||||
id: BI.UUID(), |
||||
type: 'string', |
||||
}, ...this.model.parameters]); |
||||
}, |
||||
}, { |
||||
type: IconButtonXtype, |
||||
cls: 'close-font bi-error', |
||||
width: 25, |
||||
title: BI.i18nText('Plugin-Redis_Parameter_Delete'), |
||||
handler: () => { |
||||
if (this.model.selectedId) { |
||||
BI.Msg.confirm(BI.i18nText('BI-Basic_Prompt'), BI.i18nText('Plugin-Redis_Parameter_Delete_Confirm'), (re: boolean) => { |
||||
if (re) { |
||||
this.store.removeSelectedParameter(); |
||||
} |
||||
}); |
||||
} else { |
||||
BI.Msg.alert(BI.i18nText('BI-Basic_Prompt'), BI.i18nText('Plugin-Redis_Parameter_Delete_Alert')); |
||||
} |
||||
}, |
||||
}, { |
||||
type: IconButtonXtype, |
||||
cls: 'add-up-font', |
||||
width: 25, |
||||
title: BI.i18nText('Plugin-Redis_Parameter_Move_Up'), |
||||
handler: () => { |
||||
this.store.move('up'); |
||||
}, |
||||
}, { |
||||
type: IconButtonXtype, |
||||
cls: 'minus-down-font', |
||||
width: 25, |
||||
title: BI.i18nText('Plugin-Redis_Parameter_Move_Down'), |
||||
handler: () => { |
||||
this.store.move('down'); |
||||
}, |
||||
}, showRefresh ? { |
||||
type: IconButtonXtype, |
||||
cls: 'redis-refresh-font', |
||||
width: 25, |
||||
title: BI.i18nText('Plugin-Redis_Parameter_Refresh'), |
||||
handler: () => { |
||||
this.setDefalue(); |
||||
}, |
||||
} : null], |
||||
}, |
||||
|
||||
}, |
||||
height: 25, |
||||
}, { |
||||
el: { |
||||
type: HtapeXtype, |
||||
cls: 'bi-border', |
||||
items: [{ |
||||
el: { |
||||
type: LabelXtype, |
||||
text: BI.i18nText('Plugin-Redis_Dataset_Parameter_Name'), |
||||
}, |
||||
width: 0.5, |
||||
}, { |
||||
el: { |
||||
type: LabelXtype, |
||||
cls: 'bi-border-left', |
||||
text: BI.i18nText('Plugin-Redis_Dataset_Parameter_Value'), |
||||
}, |
||||
width: 0.5, |
||||
}], |
||||
}, |
||||
height: 25, |
||||
}, { |
||||
type: ButtonGroupXtype, |
||||
cls: 'bi-border', |
||||
layouts: [{ |
||||
type: VerticalXtype, |
||||
}], |
||||
items: this.renderParameterInputs(), |
||||
ref: (_ref: any) => { |
||||
this.parameterInputs = _ref; |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
|
||||
public getValue() { |
||||
return this.model.parameters.map(item => { |
||||
return { |
||||
name: item.name, |
||||
value: item.value, |
||||
type: item.type, |
||||
}; |
||||
}); |
||||
} |
||||
|
||||
private setDefalue() { |
||||
const { value = [] } = this.options; |
||||
this.store.setParameters(value.map(item => { |
||||
return { |
||||
...item, |
||||
id: BI.UUID(), |
||||
}; |
||||
})); |
||||
} |
||||
|
||||
private renderParameterInputs() { |
||||
return this.model.parameters.map(item => { |
||||
return { |
||||
type: ParameterInput.xtype, |
||||
inputName: item.name, |
||||
inputValue: item.value, |
||||
id: item.id, |
||||
value: item.id, |
||||
selected: item.id === this.model.selectedId, |
||||
}; |
||||
}); |
||||
} |
||||
} |
@ -1,9 +0,0 @@
|
||||
|
||||
export interface ParametersType { |
||||
name: string; |
||||
value: string; |
||||
id?: string; |
||||
type: inputTypes; |
||||
} |
||||
|
||||
export type inputTypes = 'string' | 'int' | 'number' | 'date' | 'boolean' | 'formula' |
@ -1,20 +0,0 @@
|
||||
import { inputTypes } from '../../parameter.typings'; |
||||
|
||||
const inputs: { |
||||
[key: string]: any; |
||||
} = {}; |
||||
|
||||
export function input(key: inputTypes): ClassDecorator { |
||||
return (target: object) => { |
||||
inputs[key] = target; |
||||
}; |
||||
} |
||||
|
||||
export function getInput(type: inputTypes): string { |
||||
const inputWidget = inputs[type]; |
||||
if (BI.isNull(inputWidget)) { |
||||
throw new TypeError(); |
||||
} |
||||
|
||||
return inputWidget.xtype; |
||||
} |
@ -1,6 +0,0 @@
|
||||
import './input_boolean'; |
||||
import './input_date'; |
||||
import './input_int'; |
||||
import './input_number'; |
||||
import './input_string'; |
||||
import './input_formula'; |
@ -1,41 +0,0 @@
|
||||
import { shortcut } from '../../../../core/core'; |
||||
import { MultiSelectItemXtype } from 'ui'; |
||||
import { input } from './input.service'; |
||||
|
||||
@shortcut() |
||||
@input('boolean') |
||||
export class InputBoolean extends BI.Widget { |
||||
static xtype = 'plugin.report.json.components.parameter_input.boolean' |
||||
|
||||
props = { |
||||
value: '', |
||||
} |
||||
|
||||
input: any; |
||||
|
||||
render() { |
||||
const { value } = this.options; |
||||
|
||||
return { |
||||
type: MultiSelectItemXtype, |
||||
width: 80, |
||||
selected: !!value, |
||||
text: 'true', |
||||
ref: (_ref: any) => { |
||||
this.input = _ref; |
||||
}, |
||||
listeners: [{ |
||||
eventName: BI.TextEditor.EVENT_CHANGE, |
||||
action: () => { |
||||
const value = this.input.getValue(); |
||||
this.fireEvent('EVENT_CHANGE', value); |
||||
}, |
||||
}, { |
||||
eventName: BI.TextEditor.EVENT_FOCUS, |
||||
action: () => { |
||||
this.fireEvent('EVENT_FOCUS'); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
} |
@ -1,42 +0,0 @@
|
||||
import { shortcut } from '../../../../core/core'; |
||||
import { DynamicDateComboXtype } from 'ui'; |
||||
import { input } from './input.service'; |
||||
|
||||
@shortcut() |
||||
@input('date') |
||||
export class InputDate extends BI.Widget { |
||||
static xtype = 'plugin.report.json.components.parameter_input.date' |
||||
|
||||
props = { |
||||
value: '', |
||||
} |
||||
|
||||
input: any; |
||||
|
||||
render() { |
||||
const { value } = this.options; |
||||
|
||||
return { |
||||
type: DynamicDateComboXtype, |
||||
height: 22, |
||||
allowBlank: true, |
||||
value, |
||||
ref: (_ref: any) => { |
||||
this.input = _ref; |
||||
}, |
||||
validationChecker: (v: string) => BI.isNumeric(v), |
||||
listeners: [{ |
||||
eventName: BI.TextEditor.EVENT_CHANGE, |
||||
action: () => { |
||||
const value = this.input.getValue(); |
||||
this.fireEvent('EVENT_CHANGE', value); |
||||
}, |
||||
}, { |
||||
eventName: BI.TextEditor.EVENT_FOCUS, |
||||
action: () => { |
||||
this.fireEvent('EVENT_FOCUS'); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
} |
@ -1,45 +0,0 @@
|
||||
import { shortcut } from '../../../../core/core'; |
||||
import { EditorXtype } from 'ui'; |
||||
import { input } from './input.service'; |
||||
|
||||
@shortcut() |
||||
@input('formula') |
||||
export class InputFormula extends BI.Widget { |
||||
static xtype = 'plugin.report.json.components.parameter_input.formula' |
||||
|
||||
props = { |
||||
value: '', |
||||
} |
||||
|
||||
input: any; |
||||
|
||||
mounted() { |
||||
|
||||
} |
||||
|
||||
render() { |
||||
const { value } = this.options; |
||||
|
||||
return { |
||||
type: EditorXtype, |
||||
height: 22, |
||||
allowBlank: true, |
||||
value, |
||||
ref: (_ref: any) => { |
||||
this.input = _ref; |
||||
}, |
||||
listeners: [{ |
||||
eventName: BI.TextEditor.EVENT_CHANGE, |
||||
action: () => { |
||||
const value = this.input.getValue(); |
||||
this.fireEvent('EVENT_CHANGE', value); |
||||
}, |
||||
}, { |
||||
eventName: BI.TextEditor.EVENT_FOCUS, |
||||
action: () => { |
||||
this.fireEvent('EVENT_FOCUS'); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
} |
@ -1,42 +0,0 @@
|
||||
import { shortcut } from '../../../../core/core'; |
||||
import { NumberEditorXtype } from 'ui'; |
||||
import { input } from './input.service'; |
||||
|
||||
@shortcut() |
||||
@input('int') |
||||
export class InputInt extends BI.Widget { |
||||
static xtype = 'plugin.report.json.components.parameter_input.int' |
||||
|
||||
props = { |
||||
value: '', |
||||
} |
||||
|
||||
input: any; |
||||
|
||||
render() { |
||||
const { value } = this.options; |
||||
|
||||
return { |
||||
type: NumberEditorXtype, |
||||
height: 22, |
||||
allowBlank: true, |
||||
value, |
||||
ref: (_ref: any) => { |
||||
this.input = _ref; |
||||
}, |
||||
validationChecker: (v: string) => BI.isInteger(v), |
||||
listeners: [{ |
||||
eventName: BI.TextEditor.EVENT_CHANGE, |
||||
action: () => { |
||||
const value = this.input.getValue(); |
||||
this.fireEvent('EVENT_CHANGE', value); |
||||
}, |
||||
}, { |
||||
eventName: BI.TextEditor.EVENT_FOCUS, |
||||
action: () => { |
||||
this.fireEvent('EVENT_FOCUS'); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
} |
@ -1,42 +0,0 @@
|
||||
import { shortcut } from '../../../../core/core'; |
||||
import { EditorXtype } from 'ui'; |
||||
import { input } from './input.service'; |
||||
|
||||
@shortcut() |
||||
@input('number') |
||||
export class InputNumber extends BI.Widget { |
||||
static xtype = 'plugin.report.json.components.parameter_input.number' |
||||
|
||||
props = { |
||||
value: '', |
||||
} |
||||
|
||||
input: any; |
||||
|
||||
render() { |
||||
const { value } = this.options; |
||||
|
||||
return { |
||||
type: EditorXtype, |
||||
height: 22, |
||||
allowBlank: true, |
||||
value, |
||||
ref: (_ref: any) => { |
||||
this.input = _ref; |
||||
}, |
||||
validationChecker: (v: string) => BI.isNumeric(v), |
||||
listeners: [{ |
||||
eventName: BI.TextEditor.EVENT_CHANGE, |
||||
action: () => { |
||||
const value = this.input.getValue(); |
||||
this.fireEvent('EVENT_CHANGE', value); |
||||
}, |
||||
}, { |
||||
eventName: BI.TextEditor.EVENT_FOCUS, |
||||
action: () => { |
||||
this.fireEvent('EVENT_FOCUS'); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
} |
@ -1,41 +0,0 @@
|
||||
import { shortcut } from '../../../../core/core'; |
||||
import { EditorXtype } from 'ui'; |
||||
import { input } from './input.service'; |
||||
|
||||
@shortcut() |
||||
@input('string') |
||||
export class InputString extends BI.Widget { |
||||
static xtype = 'plugin.report.json.components.parameter_input.string' |
||||
|
||||
props = { |
||||
value: '', |
||||
} |
||||
|
||||
input: any; |
||||
|
||||
render() { |
||||
const { value } = this.options; |
||||
|
||||
return { |
||||
type: EditorXtype, |
||||
height: 22, |
||||
allowBlank: true, |
||||
value, |
||||
ref: (_ref: any) => { |
||||
this.input = _ref; |
||||
}, |
||||
listeners: [{ |
||||
eventName: BI.TextEditor.EVENT_CHANGE, |
||||
action: () => { |
||||
const value = this.input.getValue(); |
||||
this.fireEvent('EVENT_CHANGE', value); |
||||
}, |
||||
}, { |
||||
eventName: BI.TextEditor.EVENT_FOCUS, |
||||
action: () => { |
||||
this.fireEvent('EVENT_FOCUS'); |
||||
}, |
||||
}], |
||||
}; |
||||
} |
||||
} |
@ -1,5 +0,0 @@
|
||||
@import '../../../../less/index.less'; |
||||
|
||||
.plugin-report-json-parameter-input.active{ |
||||
background-color: @color-bi-light-blue-60; |
||||
} |
@ -1,40 +0,0 @@
|
||||
import { model, Model } from '../../../core/core'; |
||||
import { ParameterModel } from '../parameter.model'; |
||||
import { inputTypes } from '../parameter.typings'; |
||||
|
||||
@model() |
||||
export class ParameterInputModel extends Model<{ |
||||
types: { |
||||
selectedId: ParameterModel['TYPE']['selectedId']; |
||||
parameters: ParameterModel['TYPE']['parameters']; |
||||
}, |
||||
context: ParameterInputModel['context']; |
||||
}> { |
||||
static xtype = 'plugin.model.report.json.components.parameter_input'; |
||||
|
||||
context = <const>['selectedId', 'parameters']; |
||||
|
||||
actions = { |
||||
setSelectedId: (id: string) => { |
||||
this.model.selectedId = id; |
||||
}, |
||||
setParameterName: (id: string, name: string) => { |
||||
const thisParameter = this.getParameter(id); |
||||
if (thisParameter) { |
||||
thisParameter.name = name; |
||||
} |
||||
}, |
||||
setParameterValue: (id: string, value: string, type: inputTypes) => { |
||||
const thisParameter = this.getParameter(id); |
||||
if (thisParameter) { |
||||
thisParameter.value = value; |
||||
thisParameter.type = type; |
||||
} |
||||
}, |
||||
} |
||||
private getParameter(id: string) { |
||||
return this.model.parameters.find(item => item.id === id); |
||||
} |
||||
} |
||||
|
||||
|
@ -1,165 +0,0 @@
|
||||
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', |
||||
}]; |
||||
} |
||||
} |
Loading…
Reference in new issue