mirror of
https://github.com/pipipi-pikachu/PPTist.git
synced 2025-04-15 02:20:00 +08:00
添加web字体
This commit is contained in:
parent
72c99bf4ec
commit
c0d6f71c9c
45
src/configs/font.ts
Normal file
45
src/configs/font.ts
Normal file
@ -0,0 +1,45 @@
|
||||
export const SYS_FONTS = [
|
||||
{ zh: '微软雅黑', en: 'Microsoft Yahei' },
|
||||
{ zh: '宋体', en: 'SimSun' },
|
||||
{ zh: '黑体', en: 'SimHei' },
|
||||
{ zh: '楷体', en: 'KaiTi' },
|
||||
{ zh: '新宋体', en: 'NSimSun' },
|
||||
{ zh: '仿宋', en: 'FangSong' },
|
||||
{ zh: '苹方', en: 'PingFang SC' },
|
||||
{ zh: '华文黑体', en: 'STHeiti' },
|
||||
{ zh: '华文楷体', en: 'STKaiti' },
|
||||
{ zh: '华文宋体', en: 'STSong' },
|
||||
{ zh: '华文仿宋', en: 'STFangSong' },
|
||||
{ zh: '华文中宋', en: 'STZhongSong' },
|
||||
{ zh: '华文琥珀', en: 'STHupo' },
|
||||
{ zh: '华文新魏', en: 'STXinwei' },
|
||||
{ zh: '华文隶书', en: 'STLiti' },
|
||||
{ zh: '华文行楷', en: 'STXingkai' },
|
||||
{ zh: '冬青黑体简', en: 'Hiragino Sans GB' },
|
||||
{ zh: '兰亭黑-简', en: 'Lantinghei SC' },
|
||||
{ zh: '偏偏体-简', en: 'Hanzipen SC' },
|
||||
{ zh: '手札体-简', en: 'Hannotate SC' },
|
||||
{ zh: '宋体-简', en: 'Songti SC' },
|
||||
{ zh: '娃娃体-简', en: 'Wawati SC' },
|
||||
{ zh: '行楷-简', en: 'Xingkai SC' },
|
||||
{ zh: '圆体-简', en: 'Yuanti SC' },
|
||||
{ zh: '华文细黑', en: 'STXihei' },
|
||||
{ zh: '幼圆', en: 'YouYuan' },
|
||||
{ zh: '隶书', en: 'LiSu' },
|
||||
{ zh: 'Arial', en: 'Arial' },
|
||||
]
|
||||
|
||||
export const WEB_FONTS = [
|
||||
{ name: '仓耳小丸子' },
|
||||
{ name: '优设标题黑' },
|
||||
{ name: '峰广明锐体' },
|
||||
{ name: '摄图摩登小方体' },
|
||||
{ name: '站酷快乐体' },
|
||||
{ name: '站酷酷黑体' },
|
||||
{ name: '素材集市康康体' },
|
||||
{ name: '联盟起艺卢帅正锐黑体' },
|
||||
{ name: '谦度手写楷体' },
|
||||
{ name: '途牛类圆体' },
|
||||
{ name: '锐字真言体' },
|
||||
{ name: '问藏书房' },
|
||||
]
|
@ -1,38 +0,0 @@
|
||||
export interface FontName {
|
||||
source: string;
|
||||
zh: string;
|
||||
en: string;
|
||||
}
|
||||
|
||||
export const FONT_NAMES: FontName[] = [
|
||||
{ source: 'windows', zh: '微软雅黑', en: 'Microsoft Yahei' },
|
||||
{ source: 'windows', zh: '宋体', en: 'SimSun' },
|
||||
{ source: 'windows', zh: '黑体', en: 'SimHei' },
|
||||
{ source: 'windows', zh: '楷体', en: 'KaiTi' },
|
||||
{ source: 'windows', zh: '新宋体', en: 'NSimSun' },
|
||||
{ source: 'windows', zh: '仿宋', en: 'FangSong' },
|
||||
|
||||
{ source: 'osx', zh: '苹方', en: 'PingFang SC' },
|
||||
{ source: 'osx', zh: '华文黑体', en: 'STHeiti' },
|
||||
{ source: 'osx', zh: '华文楷体', en: 'STKaiti' },
|
||||
{ source: 'osx', zh: '华文宋体', en: 'STSong' },
|
||||
{ source: 'osx', zh: '华文仿宋', en: 'STFangSong' },
|
||||
{ source: 'osx', zh: '华文中宋', en: 'STZhongSong' },
|
||||
{ source: 'osx', zh: '华文琥珀', en: 'STHupo' },
|
||||
{ source: 'osx', zh: '华文新魏', en: 'STXinwei' },
|
||||
{ source: 'osx', zh: '华文隶书', en: 'STLiti' },
|
||||
{ source: 'osx', zh: '华文行楷', en: 'STXingkai' },
|
||||
{ source: 'osx', zh: '冬青黑体简', en: 'Hiragino Sans GB' },
|
||||
{ source: 'osx', zh: '兰亭黑-简', en: 'Lantinghei SC' },
|
||||
{ source: 'osx', zh: '偏偏体-简', en: 'Hanzipen SC' },
|
||||
{ source: 'osx', zh: '手札体-简', en: 'Hannotate SC' },
|
||||
{ source: 'osx', zh: '宋体-简', en: 'Songti SC' },
|
||||
{ source: 'osx', zh: '娃娃体-简', en: 'Wawati SC' },
|
||||
{ source: 'osx', zh: '行楷-简', en: 'Xingkai SC' },
|
||||
{ source: 'osx', zh: '圆体-简', en: 'Yuanti SC' },
|
||||
|
||||
{ source: 'office', zh: '华文细黑', en: 'STXihei' },
|
||||
{ source: 'office', zh: '幼圆', en: 'YouYuan' },
|
||||
{ source: 'office', zh: '隶书', en: 'LiSu' },
|
||||
{ source: '', zh: 'Arial', en: 'Arial' },
|
||||
]
|
@ -48,6 +48,7 @@ app.component('Popover', Popover)
|
||||
app.component('Slider', Slider)
|
||||
app.component('Select', Select)
|
||||
app.component('SelectOption', Select.Option)
|
||||
app.component('SelectOptGroup', Select.OptGroup)
|
||||
app.component('Switch', Switch)
|
||||
app.component('Radio', Radio)
|
||||
app.component('RadioGroup', Radio.Group)
|
||||
|
@ -8,7 +8,7 @@ import { Slide, SlideTheme } from '@/types/slides'
|
||||
import { CreatingElement } from '@/types/edit'
|
||||
import { ToolbarState } from '@/types/toolbar'
|
||||
import { slides } from '@/mocks/index'
|
||||
import { FontName } from '@/configs/fontName'
|
||||
import { SYS_FONTS } from '@/configs/font'
|
||||
|
||||
export { MutationTypes, ActionTypes }
|
||||
|
||||
@ -22,7 +22,7 @@ export interface State {
|
||||
disableHotkeys: boolean;
|
||||
showGridLines: boolean;
|
||||
creatingElement: CreatingElement | null;
|
||||
availableFonts: FontName[];
|
||||
availableFonts: typeof SYS_FONTS;
|
||||
toolbarState: ToolbarState;
|
||||
theme: SlideTheme;
|
||||
slides: Slide[];
|
||||
|
@ -4,7 +4,7 @@ import { MutationTypes } from './constants'
|
||||
import { State } from './index'
|
||||
import { Slide, PPTElement, SlideTheme } from '@/types/slides'
|
||||
import { CreatingElement } from '@/types/edit'
|
||||
import { FONT_NAMES } from '@/configs/fontName'
|
||||
import { SYS_FONTS } from '@/configs/font'
|
||||
import { isSupportFontFamily } from '@/utils/fontFamily'
|
||||
|
||||
interface RemoveElementPropData {
|
||||
@ -61,7 +61,7 @@ export const mutations: MutationTree<State> = {
|
||||
},
|
||||
|
||||
[MutationTypes.SET_AVAILABLE_FONTS](state) {
|
||||
state.availableFonts = FONT_NAMES.filter(font => isSupportFontFamily(font.en))
|
||||
state.availableFonts = SYS_FONTS.filter(font => isSupportFontFamily(font.en))
|
||||
},
|
||||
|
||||
[MutationTypes.SET_TOOLBAR_STATE](state, type) {
|
||||
|
@ -19,9 +19,16 @@
|
||||
@change="value => emitRichTextCommand('fontname', value)"
|
||||
>
|
||||
<template #suffixIcon><IconFontSize /></template>
|
||||
<SelectOption v-for="font in availableFonts" :key="font.en" :value="font.en">
|
||||
<span :style="{ fontFamily: font.en }">{{font.zh}}</span>
|
||||
</SelectOption>
|
||||
<SelectOptGroup label="系统字体">
|
||||
<SelectOption v-for="font in availableFonts" :key="font.en" :value="font.en">
|
||||
<span :style="{ fontFamily: font.en }">{{font.zh}}</span>
|
||||
</SelectOption>
|
||||
</SelectOptGroup>
|
||||
<SelectOptGroup label="在线字体">
|
||||
<SelectOption v-for="font in webFonts" :key="font.name" :value="font.name">
|
||||
<span>{{font.name}}</span>
|
||||
</SelectOption>
|
||||
</SelectOptGroup>
|
||||
</Select>
|
||||
<Select
|
||||
style="flex: 2;"
|
||||
@ -217,6 +224,7 @@ import { MutationTypes, State } from '@/store'
|
||||
import { PPTTextElement } from '@/types/slides'
|
||||
import emitter, { EmitterEvents } from '@/utils/emitter'
|
||||
import { TextAttrs } from '@/prosemirror/utils'
|
||||
import { WEB_FONTS } from '@/configs/font'
|
||||
import useHistorySnapshot from '@/hooks/useHistorySnapshot'
|
||||
|
||||
import ElementOpacity from '../common/ElementOpacity.vue'
|
||||
@ -296,6 +304,8 @@ const presetStyles = [
|
||||
},
|
||||
]
|
||||
|
||||
const webFonts = WEB_FONTS
|
||||
|
||||
interface CommandPayload {
|
||||
command: string;
|
||||
value?: string;
|
||||
@ -391,6 +401,7 @@ export default defineComponent({
|
||||
wordSpace,
|
||||
richTextAttrs,
|
||||
availableFonts,
|
||||
webFonts,
|
||||
fontSizeOptions,
|
||||
lineHeightOptions,
|
||||
wordSpaceOptions,
|
||||
|
Loading…
x
Reference in New Issue
Block a user