diff --git a/src/hooks/useCreateElement.ts b/src/hooks/useCreateElement.ts
index 570534d5..7fc8fecd 100644
--- a/src/hooks/useCreateElement.ts
+++ b/src/hooks/useCreateElement.ts
@@ -96,7 +96,7 @@ export default () => {
width: 400,
height: 400,
rotate: 0,
- themeColors: [theme.value.themeColor],
+ themeColors: theme.value.themeColors,
textColor: theme.value.fontColor,
data: CHART_DEFAULT_DATA[type],
})
@@ -145,7 +145,7 @@ export default () => {
color: '#eeece1',
},
theme: {
- color: theme.value.themeColor,
+ color: theme.value.themeColors[0],
rowHeader: true,
rowFooter: false,
colHeader: false,
@@ -202,7 +202,7 @@ export default () => {
height,
viewBox: data.viewBox,
path: data.path,
- fill: theme.value.themeColor,
+ fill: theme.value.themeColors[0],
fixedRatio: false,
rotate: 0,
...supplement,
@@ -239,7 +239,7 @@ export default () => {
start,
end,
points: data.points,
- color: theme.value.themeColor,
+ color: theme.value.themeColors[0],
style: data.style,
width: 2,
}
@@ -306,7 +306,7 @@ export default () => {
loop: false,
autoplay: false,
fixedRatio: true,
- color: theme.value.themeColor,
+ color: theme.value.themeColors[0],
src,
})
}
diff --git a/src/hooks/useImport.ts b/src/hooks/useImport.ts
index 022a5489..f248d9d1 100644
--- a/src/hooks/useImport.ts
+++ b/src/hooks/useImport.ts
@@ -267,7 +267,7 @@ export default () => {
top: el.top,
rotate: 0,
fixedRatio: false,
- color: theme.value.themeColor,
+ color: theme.value.themeColors[0],
loop: false,
autoplay: false,
})
@@ -504,7 +504,7 @@ export default () => {
left: el.left,
top: el.top,
rotate: 0,
- themeColors: el.colors.length ? el.colors : [theme.value.themeColor],
+ themeColors: el.colors.length ? el.colors : theme.value.themeColors,
textColor: theme.value.fontColor,
data: {
labels,
diff --git a/src/hooks/useSlideTheme.ts b/src/hooks/useSlideTheme.ts
index 98e003d5..47ed4dce 100644
--- a/src/hooks/useSlideTheme.ts
+++ b/src/hooks/useSlideTheme.ts
@@ -311,7 +311,7 @@ export default () => {
}
slidesStore.setTheme({
backgroundColor: theme.background,
- themeColor: theme.colors[0],
+ themeColors: theme.colors,
fontColor: theme.fontColor,
fontName: theme.fontname,
})
@@ -322,7 +322,7 @@ export default () => {
// 将当前主题配置应用到全部页面
const applyThemeToAllSlides = (applyAll = false) => {
const newSlides: Slide[] = JSON.parse(JSON.stringify(slides.value))
- const { themeColor, backgroundColor, fontColor, fontName, outline, shadow } = theme.value
+ const { themeColors, backgroundColor, fontColor, fontName, outline, shadow } = theme.value
for (const slide of newSlides) {
if (!slide.background || slide.background.type !== 'image') {
@@ -339,17 +339,17 @@ export default () => {
}
if (el.type === 'shape') {
- el.fill = themeColor
+ el.fill = themeColors[0]
if (el.gradient) delete el.gradient
}
- else if (el.type === 'line') el.color = themeColor
+ else if (el.type === 'line') el.color = themeColors[0]
else if (el.type === 'text') {
el.defaultColor = fontColor
el.defaultFontName = fontName
- if (el.fill) el.fill = themeColor
+ if (el.fill) el.fill = themeColors[0]
}
else if (el.type === 'table') {
- if (el.theme) el.theme.color = themeColor
+ if (el.theme) el.theme.color = themeColors[0]
for (const rowCells of el.data) {
for (const cell of rowCells) {
if (cell.style) {
@@ -360,11 +360,11 @@ export default () => {
}
}
else if (el.type === 'chart') {
- el.themeColors = [themeColor]
+ el.themeColors = themeColors
el.textColor = fontColor
}
else if (el.type === 'latex') el.color = fontColor
- else if (el.type === 'audio') el.color = themeColor
+ else if (el.type === 'audio') el.color = themeColors[0]
}
}
slidesStore.setSlides(newSlides)
diff --git a/src/store/slides.ts b/src/store/slides.ts
index 4180f388..4dc0db51 100644
--- a/src/store/slides.ts
+++ b/src/store/slides.ts
@@ -32,7 +32,7 @@ export const useSlidesStore = defineStore('slides', {
state: (): SlidesState => ({
title: '未命名演示文稿', // 幻灯片标题
theme: {
- themeColor: '#5b9bd5',
+ themeColors: ['#5b9bd5', '#ed7d31', '#a5a5a5', '#ffc000', '#4472c4', '#70ad47'],
fontColor: '#333',
fontName: '',
backgroundColor: '#fff',
diff --git a/src/types/slides.ts b/src/types/slides.ts
index 765e2d7b..d0a0ca2a 100644
--- a/src/types/slides.ts
+++ b/src/types/slides.ts
@@ -754,7 +754,7 @@ export interface Slide {
*/
export interface SlideTheme {
backgroundColor: string
- themeColor: string
+ themeColors: string[]
fontColor: string
fontName: string
outline: PPTElementOutline
diff --git a/src/views/Editor/Canvas/ShapeCreateCanvas.vue b/src/views/Editor/Canvas/ShapeCreateCanvas.vue
index d496d763..8b2b3cbd 100644
--- a/src/views/Editor/Canvas/ShapeCreateCanvas.vue
+++ b/src/views/Editor/Canvas/ShapeCreateCanvas.vue
@@ -152,7 +152,7 @@ const create = () => {
fill: 'rgba(0, 0, 0, 0)',
outline: {
width: 2,
- color: theme.value.themeColor,
+ color: theme.value.themeColors[0],
style: 'solid',
},
})
diff --git a/src/views/Editor/Toolbar/ElementStylePanel/ChartStylePanel/index.vue b/src/views/Editor/Toolbar/ElementStylePanel/ChartStylePanel/index.vue
index 79cb1f7e..a52a683e 100644
--- a/src/views/Editor/Toolbar/ElementStylePanel/ChartStylePanel/index.vue
+++ b/src/views/Editor/Toolbar/ElementStylePanel/ChartStylePanel/index.vue
@@ -213,7 +213,7 @@ const updateTheme = (color: string, index: number) => {
// 添加主题色
const addThemeColor = () => {
const props = {
- themeColors: [...themeColors.value, theme.value.themeColor],
+ themeColors: [...themeColors.value, theme.value.themeColors[0]],
}
updateElement(props)
}
diff --git a/src/views/Editor/Toolbar/ElementStylePanel/TableStylePanel.vue b/src/views/Editor/Toolbar/ElementStylePanel/TableStylePanel.vue
index b9bcd940..5a89b08c 100644
--- a/src/views/Editor/Toolbar/ElementStylePanel/TableStylePanel.vue
+++ b/src/views/Editor/Toolbar/ElementStylePanel/TableStylePanel.vue
@@ -196,7 +196,7 @@ import Popover from '@/components/Popover.vue'
const slidesStore = useSlidesStore()
const { handleElement, handleElementId, selectedTableCells: selectedCells } = storeToRefs(useMainStore())
-const themeColor = computed(() => slidesStore.theme.themeColor)
+const themeColor = computed(() => slidesStore.theme.themeColors[0])
const fontSizeOptions = [
'12px', '14px', '16px', '18px', '20px', '22px', '24px', '28px', '32px',
diff --git a/src/views/Editor/Toolbar/SlideDesignPanel.vue b/src/views/Editor/Toolbar/SlideDesignPanel.vue
index 693d243e..4eabd959 100644
--- a/src/views/Editor/Toolbar/SlideDesignPanel.vue
+++ b/src/views/Editor/Toolbar/SlideDesignPanel.vue
@@ -162,18 +162,18 @@