Bug 49336
This commit is contained in:
parent
d55aad76ac
commit
0b17b27492
|
@ -122,6 +122,9 @@ const PageStyle = props => {
|
||||||
const chartProperties = props.storeFocusObjects.chartObject ? props.storeFocusObjects.chartObject.get_ChartProperties() : null;
|
const chartProperties = props.storeFocusObjects.chartObject ? props.storeFocusObjects.chartObject.get_ChartProperties() : null;
|
||||||
const types = storeChartSettings.types;
|
const types = storeChartSettings.types;
|
||||||
const curType = chartProperties ? chartProperties.getType() : null;
|
const curType = chartProperties ? chartProperties.getType() : null;
|
||||||
|
const chartStyles = storeChartSettings.chartStyles;
|
||||||
|
// console.log(chartStyles, curType);
|
||||||
|
// console.log(Asc.c_oAscChartTypeSettings.comboBarLine, Asc.c_oAscChartTypeSettings.comboBarLineSecondary, Asc.c_oAscChartTypeSettings.comboAreaBar, Asc.c_oAscChartTypeSettings.comboCustom);
|
||||||
|
|
||||||
const styles = storeChartSettings.styles;
|
const styles = storeChartSettings.styles;
|
||||||
|
|
||||||
|
@ -154,7 +157,7 @@ const PageStyle = props => {
|
||||||
<Navbar backLink={_t.textBack}>
|
<Navbar backLink={_t.textBack}>
|
||||||
<div className="tab-buttons tabbar">
|
<div className="tab-buttons tabbar">
|
||||||
<Link key={"de-link-chart-type"} tabLink={"#edit-chart-type"} tabLinkActive={true}>{_t.textType}</Link>
|
<Link key={"de-link-chart-type"} tabLink={"#edit-chart-type"} tabLinkActive={true}>{_t.textType}</Link>
|
||||||
<Link key={"de-link-chart-style"} tabLink={"#edit-chart-style"}>{_t.textStyle}</Link>
|
{chartStyles ? <Link key={"de-link-chart-style"} tabLink={"#edit-chart-style"}>{_t.textStyle}</Link> : null}
|
||||||
<Link key={"de-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
|
<Link key={"de-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
|
||||||
<Link key={"de-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
|
<Link key={"de-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
|
||||||
</div>
|
</div>
|
||||||
|
@ -181,26 +184,28 @@ const PageStyle = props => {
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key={"de-tab-chart-style"} id={"edit-chart-style"} className="page-content no-padding-top dataview">
|
{chartStyles ?
|
||||||
<div className={'chart-styles'}>
|
<Tab key={"de-tab-chart-style"} id={"edit-chart-style"} className="page-content no-padding-top dataview">
|
||||||
{styles ? styles.map((row, rowIndex) => {
|
<div className={'chart-styles'}>
|
||||||
return (
|
{styles ? styles.map((row, rowIndex) => {
|
||||||
<ul className="row" key={`row-${rowIndex}`}>
|
return (
|
||||||
{row.map((style, index)=>{
|
<ul className="row" key={`row-${rowIndex}`}>
|
||||||
return(
|
{row.map((style, index)=>{
|
||||||
<li key={`${rowIndex}-${index}`}
|
return(
|
||||||
onClick={()=>{props.onStyle(style.asc_getName())}}>
|
<li key={`${rowIndex}-${index}`}
|
||||||
<img src={`${style.asc_getImage()}`}/>
|
onClick={()=>{props.onStyle(style.asc_getName())}}>
|
||||||
</li>
|
<img src={`${style.asc_getImage()}`}/>
|
||||||
)
|
</li>
|
||||||
})}
|
)
|
||||||
</ul>
|
})}
|
||||||
)
|
</ul>
|
||||||
}) :
|
)
|
||||||
<div className={'text-content'}>{_t.textNoStyles}</div>
|
}) :
|
||||||
}
|
<div className={'text-content'}>{_t.textNoStyles}</div>
|
||||||
</div>
|
}
|
||||||
</Tab>
|
</div>
|
||||||
|
</Tab>
|
||||||
|
: null}
|
||||||
<Tab key={"de-tab-chart-fill"} id={"edit-chart-fill"} className="page-content no-padding-top">
|
<Tab key={"de-tab-chart-fill"} id={"edit-chart-fill"} className="page-content no-padding-top">
|
||||||
<PaletteFill onFillColor={props.onFillColor} f7router={props.f7router}/>
|
<PaletteFill onFillColor={props.onFillColor} f7router={props.f7router}/>
|
||||||
</Tab>
|
</Tab>
|
||||||
|
@ -372,6 +377,7 @@ const PageReorder = props => {
|
||||||
const EditChart = props => {
|
const EditChart = props => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const _t = t('Edit', {returnObjects: true});
|
const _t = t('Edit', {returnObjects: true});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Fragment>
|
<Fragment>
|
||||||
<List>
|
<List>
|
||||||
|
|
|
@ -4,6 +4,7 @@ import {List, ListItem, ListButton, Icon, Row, Page, Navbar, BlockTitle, Toggle,
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import {Device} from '../../../../../common/mobile/utils/device';
|
import {Device} from '../../../../../common/mobile/utils/device';
|
||||||
import {CustomColorPicker, ThemeColorPalette} from "../../../../../common/mobile/lib/component/ThemeColorPalette.jsx";
|
import {CustomColorPicker, ThemeColorPalette} from "../../../../../common/mobile/lib/component/ThemeColorPalette.jsx";
|
||||||
|
import { f7 } from 'framework7-react';
|
||||||
|
|
||||||
const PageCustomFillColor = props => {
|
const PageCustomFillColor = props => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
|
@ -136,6 +137,9 @@ const PageStyle = props => {
|
||||||
const curType = chartProperties ? chartProperties.getType() : null;
|
const curType = chartProperties ? chartProperties.getType() : null;
|
||||||
const styles = storeChartSettings.styles;
|
const styles = storeChartSettings.styles;
|
||||||
const shapeObject = props.storeFocusObjects.shapeObject;
|
const shapeObject = props.storeFocusObjects.shapeObject;
|
||||||
|
const chartStyles = storeChartSettings.chartStyles;
|
||||||
|
// console.log(chartStyles, curType);
|
||||||
|
// console.log(Asc.c_oAscChartTypeSettings.comboBarLine, Asc.c_oAscChartTypeSettings.comboBarLineSecondary, Asc.c_oAscChartTypeSettings.comboAreaBar, Asc.c_oAscChartTypeSettings.comboCustom);
|
||||||
|
|
||||||
let borderSize, borderType, borderColor;
|
let borderSize, borderType, borderColor;
|
||||||
|
|
||||||
|
@ -168,10 +172,10 @@ const PageStyle = props => {
|
||||||
<Page>
|
<Page>
|
||||||
<Navbar backLink={_t.textBack}>
|
<Navbar backLink={_t.textBack}>
|
||||||
<div className="tab-buttons tabbar">
|
<div className="tab-buttons tabbar">
|
||||||
<Link key={"pe-link-chart-type"} tabLink={"#edit-chart-type"} tabLinkActive={true}>{_t.textType}</Link>
|
<Link key={"pe-link-chart-type"} tabLink={"#edit-chart-type"} tabLinkActive={true}>{_t.textType}</Link>
|
||||||
<Link key={"pe-link-chart-style"} tabLink={"#edit-chart-style"}>{_t.textStyle}</Link>
|
{chartStyles ? <Link key={"pe-link-chart-style"} tabLink={"#edit-chart-style"}>{_t.textStyle}</Link> : null}
|
||||||
<Link key={"pe-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
|
<Link key={"pe-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
|
||||||
<Link key={"pe-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
|
<Link key={"pe-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
|
||||||
</div>
|
</div>
|
||||||
</Navbar>
|
</Navbar>
|
||||||
<Tabs animated>
|
<Tabs animated>
|
||||||
|
@ -196,26 +200,28 @@ const PageStyle = props => {
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key={"pe-tab-chart-style"} id={"edit-chart-style"} className="page-content no-padding-top dataview">
|
{chartStyles ?
|
||||||
<div className={'chart-styles'}>
|
<Tab key={"pe-tab-chart-style"} id={"edit-chart-style"} className="page-content no-padding-top dataview">
|
||||||
{styles ? styles.map((row, rowIndex) => {
|
<div className={'chart-styles'}>
|
||||||
return (
|
{styles ? styles.map((row, rowIndex) => {
|
||||||
<ul className="row" key={`row-${rowIndex}`}>
|
return (
|
||||||
{row.map((style, index)=>{
|
<ul className="row" key={`row-${rowIndex}`}>
|
||||||
return(
|
{row.map((style, index)=>{
|
||||||
<li key={`${rowIndex}-${index}`}
|
return(
|
||||||
onClick={()=>{props.onStyle(style.asc_getName())}}>
|
<li key={`${rowIndex}-${index}`}
|
||||||
<img src={`${style.asc_getImage()}`}/>
|
onClick={()=>{props.onStyle(style.asc_getName())}}>
|
||||||
</li>
|
<img src={`${style.asc_getImage()}`}/>
|
||||||
)
|
</li>
|
||||||
})}
|
)
|
||||||
</ul>
|
})}
|
||||||
)
|
</ul>
|
||||||
}) :
|
)
|
||||||
<div className={'text-content'}>{_t.textNoStyles}</div>
|
}) :
|
||||||
}
|
<div className={'text-content'}>{_t.textNoStyles}</div>
|
||||||
</div>
|
}
|
||||||
</Tab>
|
</div>
|
||||||
|
</Tab>
|
||||||
|
: null}
|
||||||
<Tab key={"pe-tab-chart-fill"} id={"edit-chart-fill"} className="page-content no-padding-top">
|
<Tab key={"pe-tab-chart-fill"} id={"edit-chart-fill"} className="page-content no-padding-top">
|
||||||
<PaletteFill onFillColor={props.onFillColor} f7router={props.f7router}/>
|
<PaletteFill onFillColor={props.onFillColor} f7router={props.f7router}/>
|
||||||
</Tab>
|
</Tab>
|
||||||
|
|
|
@ -29,6 +29,17 @@ class EditChartController extends Component {
|
||||||
this.onHorAxisTickMajor = this.onHorAxisTickMajor.bind(this);
|
this.onHorAxisTickMajor = this.onHorAxisTickMajor.bind(this);
|
||||||
this.onHorAxisTickMinor = this.onHorAxisTickMinor.bind(this);
|
this.onHorAxisTickMinor = this.onHorAxisTickMinor.bind(this);
|
||||||
this.onHorAxisLabelPos = this.onHorAxisLabelPos.bind(this);
|
this.onHorAxisLabelPos = this.onHorAxisLabelPos.bind(this);
|
||||||
|
|
||||||
|
const type = props.storeFocusObjects.chartObject.get_ChartProperties().getType();
|
||||||
|
if (type==Asc.c_oAscChartTypeSettings.comboBarLine ||
|
||||||
|
type==Asc.c_oAscChartTypeSettings.comboBarLineSecondary ||
|
||||||
|
type==Asc.c_oAscChartTypeSettings.comboAreaBar ||
|
||||||
|
type==Asc.c_oAscChartTypeSettings.comboCustom) {
|
||||||
|
props.storeChartSettings.clearChartStyles();
|
||||||
|
} else {
|
||||||
|
const api = Common.EditorApi.get();
|
||||||
|
props.storeChartSettings.updateChartStyles(api.asc_getChartPreviews(type));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
closeModal() {
|
closeModal() {
|
||||||
|
|
|
@ -137,6 +137,9 @@ const PageStyle = props => {
|
||||||
const styles = storeChartSettings.styles;
|
const styles = storeChartSettings.styles;
|
||||||
const types = storeChartSettings.types;
|
const types = storeChartSettings.types;
|
||||||
const curType = chartProperties && chartProperties.getType();
|
const curType = chartProperties && chartProperties.getType();
|
||||||
|
const chartStyles = storeChartSettings.chartStyles;
|
||||||
|
// console.log(chartStyles, curType);
|
||||||
|
// console.log(Asc.c_oAscChartTypeSettings.comboBarLine, Asc.c_oAscChartTypeSettings.comboBarLineSecondary, Asc.c_oAscChartTypeSettings.comboAreaBar, Asc.c_oAscChartTypeSettings.comboCustom);
|
||||||
|
|
||||||
// Init border size
|
// Init border size
|
||||||
|
|
||||||
|
@ -171,7 +174,7 @@ const PageStyle = props => {
|
||||||
<Navbar backLink={_t.textBack}>
|
<Navbar backLink={_t.textBack}>
|
||||||
<div className="tab-buttons tabbar">
|
<div className="tab-buttons tabbar">
|
||||||
<Link key={"sse-link-chart-type"} tabLink={"#edit-chart-type"} tabLinkActive={true}>{_t.textType}</Link>
|
<Link key={"sse-link-chart-type"} tabLink={"#edit-chart-type"} tabLinkActive={true}>{_t.textType}</Link>
|
||||||
<Link key={"sse-link-chart-style"} tabLink={"#edit-chart-style"}>{_t.textStyle}</Link>
|
{chartStyles ? <Link key={"sse-link-chart-style"} tabLink={"#edit-chart-style"}>{_t.textStyle}</Link> : null}
|
||||||
<Link key={"sse-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
|
<Link key={"sse-link-chart-fill"} tabLink={"#edit-chart-fill"}>{_t.textFill}</Link>
|
||||||
<Link key={"sse-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
|
<Link key={"sse-link-chart-border"} tabLink={"#edit-chart-border"}>{_t.textBorder}</Link>
|
||||||
</div>
|
</div>
|
||||||
|
@ -196,26 +199,28 @@ const PageStyle = props => {
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key={"sse-tab-chart-style"} id={"edit-chart-style"} className="page-content no-padding-top dataview">
|
{chartStyles ?
|
||||||
<div className={'chart-styles'}>
|
<Tab key={"sse-tab-chart-style"} id={"edit-chart-style"} className="page-content no-padding-top dataview">
|
||||||
{styles ? styles.map((row, rowIndex) => {
|
<div className={'chart-styles'}>
|
||||||
return (
|
{styles ? styles.map((row, rowIndex) => {
|
||||||
<ul className="row" key={`row-${rowIndex}`}>
|
return (
|
||||||
{row.map((style, index)=>{
|
<ul className="row" key={`row-${rowIndex}`}>
|
||||||
return(
|
{row.map((style, index)=>{
|
||||||
<li key={`${rowIndex}-${index}`}
|
return(
|
||||||
onClick={() => {props.onStyle(style.asc_getName())}}>
|
<li key={`${rowIndex}-${index}`}
|
||||||
<img src={`${style.asc_getImage()}`}/>
|
onClick={() => {props.onStyle(style.asc_getName())}}>
|
||||||
</li>
|
<img src={`${style.asc_getImage()}`}/>
|
||||||
)
|
</li>
|
||||||
})}
|
)
|
||||||
</ul>
|
})}
|
||||||
)
|
</ul>
|
||||||
}) :
|
)
|
||||||
<div className={'text-content'}>{_t.textNoStyles}</div>
|
}) :
|
||||||
}
|
<div className={'text-content'}>{_t.textNoStyles}</div>
|
||||||
</div>
|
}
|
||||||
</Tab>
|
</div>
|
||||||
|
</Tab>
|
||||||
|
: null}
|
||||||
<Tab key={"sse-tab-chart-fill"} id={"edit-chart-fill"} className="page-content no-padding-top">
|
<Tab key={"sse-tab-chart-fill"} id={"edit-chart-fill"} className="page-content no-padding-top">
|
||||||
<PaletteFill onFillColor={props.onFillColor} f7router={props.f7router}/>
|
<PaletteFill onFillColor={props.onFillColor} f7router={props.f7router}/>
|
||||||
</Tab>
|
</Tab>
|
||||||
|
|
Loading…
Reference in a new issue