| | |
| | | const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent')) |
| | | const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader')) |
| | | const ActionComponent = asyncComponent(() => import('@/menu/components/share/actioncomponent')) |
| | | const UserComponent = asyncIconComponent(() => import('@/menu/components/share/usercomponent')) |
| | | |
| | | class antvBarLineChart extends Component { |
| | | static propTpyes = { |
| | |
| | | enabled: 'false', // 是否使用自定义设置 |
| | | datatype: 'query', // 数据类型查询或统计 |
| | | customs: [], |
| | | width: 24, |
| | | width: card.width || 24, |
| | | height: 400, |
| | | barSize: 35, |
| | | name: card.name |
| | |
| | | action: [], |
| | | plot: _plot, |
| | | btnlog: [], |
| | | } |
| | | |
| | | if (card.config) { |
| | | let config = fromJS(card.config).toJS() |
| | | |
| | | _card.plot = config.plot |
| | | _card.plot.name = card.name |
| | | _card.style = config.style |
| | | _card.headerStyle = config.headerStyle |
| | | |
| | | _card.action = config.action.map(col => { |
| | | col.uuid = Utils.getuuid() |
| | | return col |
| | | }) |
| | | _card.search = config.search.map(col => { |
| | | col.uuid = Utils.getuuid() |
| | | return col |
| | | }) |
| | | } |
| | | this.setState({ |
| | | card: _card |
| | |
| | | dv.transform({ |
| | | type: 'map', |
| | | callback(row) { |
| | | row.key = transfield[row.key] |
| | | row.key = transfield[row.key] || row.key |
| | | return row |
| | | }, |
| | | }) |
| | |
| | | .line() |
| | | .position(`${X_axis}*value`) |
| | | .shape(plot.shape || 'smooth') |
| | | .tooltip(`${X_axis}*value`, (name, value) => { |
| | | .tooltip(`${X_axis}*value*key`, (name, value, type) => { |
| | | if (plot.show === 'percent') { |
| | | value = value + '%' |
| | | } |
| | | return { |
| | | name: name, |
| | | name: type, |
| | | value: value |
| | | } |
| | | }) |
| | |
| | | .position(`${plot.Xaxis}*${item.name}`) |
| | | .color(item.color) |
| | | .shape(item.shape) |
| | | .tooltip(`${plot.Xaxis}*${item.name}`, (name, value) => { |
| | | .tooltip(`${item.name}`, (value) => { |
| | | if (plot.show === 'percent') { |
| | | value = value + '%' |
| | | } |
| | | return { |
| | | name: name, |
| | | name: item.name, |
| | | value: value |
| | | } |
| | | }) |
| | |
| | | .position(`${plot.Xaxis}*${item.name}`) |
| | | .color(item.color) |
| | | .shape(item.shape) |
| | | .tooltip(`${plot.Xaxis}*${item.name}`, (name, value) => { |
| | | .tooltip(`${item.name}`, (value) => { |
| | | if (plot.show === 'percent') { |
| | | value = value + '%' |
| | | } |
| | | return { |
| | | name: name, |
| | | name: item.name, |
| | | value: value |
| | | } |
| | | }) |
| | |
| | | dv.transform({ |
| | | type: 'map', |
| | | callback(row) { |
| | | row.key = transfield[row.key] |
| | | row.key = transfield[row.key] || row.key |
| | | return row |
| | | }, |
| | | }) |
| | |
| | | } |
| | | ]) |
| | | .shape(plot.shape || 'rect') |
| | | .tooltip(`${X_axis}*value`, (name, value) => { |
| | | .tooltip(`${X_axis}*value*key`, (name, value, key) => { |
| | | if (plot.show === 'percent') { |
| | | value = value + '%' |
| | | } |
| | | return { |
| | | name: name, |
| | | name: key, |
| | | value: value |
| | | } |
| | | }) |
| | |
| | | .position(`${X_axis}*value`) |
| | | .adjust('stack') |
| | | .shape(plot.shape || 'rect') |
| | | .tooltip(`${X_axis}*value`, (name, value) => { |
| | | .tooltip(`${X_axis}*value*key`, (name, value, type) => { |
| | | if (plot.show === 'percent') { |
| | | value = value + '%' |
| | | } |
| | | return { |
| | | name: name, |
| | | name: type, |
| | | value: value |
| | | } |
| | | }) |
| | |
| | | <PasteComponent config={card} options={['action', 'search', 'form']} updateConfig={this.updateComponent} /> |
| | | <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" /> |
| | | <LogComponent btnlog={card.btnlog || []} handlelog={this.handleLog} /> |
| | | <UserComponent config={card}/> |
| | | <Icon className="close" title="delete" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} /> |
| | | <SettingComponent config={card} updateConfig={this.updateComponent}/> |
| | | </div> |