mirror of
https://github.com/pipipi-pikachu/PPTist.git
synced 2025-04-15 02:20:00 +08:00
docs: 添加注释
This commit is contained in:
parent
f2f5ea67f1
commit
c1e56746f9
@ -16,11 +16,13 @@ export default () => {
|
||||
|
||||
const exporting = ref(false)
|
||||
|
||||
// 导出JSON文件
|
||||
const exportJSON = () => {
|
||||
const blob = new Blob([JSON.stringify(slides.value)], { type: '' })
|
||||
saveAs(blob, 'pptist_slides.json')
|
||||
}
|
||||
|
||||
// 格式化颜色值为 透明度 + HexString,供pptxgenjs使用
|
||||
const formatColor = (_color: string) => {
|
||||
const c = tinycolor(_color)
|
||||
const alpha = c.getAlpha()
|
||||
@ -33,6 +35,8 @@ export default () => {
|
||||
|
||||
type FormatColor = ReturnType<typeof formatColor>
|
||||
|
||||
// 将HTML字符串格式化为pptxgenjs所需的格式
|
||||
// 核心思路:将HTML字符串按样式分片平铺,每个片段需要继承祖先元素的样式信息,遇到块级元素需要换行
|
||||
const formatHTML = (html: string) => {
|
||||
const ast = toAST(html)
|
||||
|
||||
@ -134,6 +138,8 @@ export default () => {
|
||||
| { x: number; y: number; curve: { type: 'cubic'; x1: number; y1: number; x2: number; y2: number } }
|
||||
| { close: true }
|
||||
>
|
||||
|
||||
// 将SVG路径信息格式化为pptxgenjs所需要的格式
|
||||
const formatPoints = (points: SvgPoints, scale = { x: 1, y: 1 }): Points => {
|
||||
return points.map(point => {
|
||||
if (point.close !== undefined) {
|
||||
@ -179,6 +185,7 @@ export default () => {
|
||||
})
|
||||
}
|
||||
|
||||
// 导出PPTX文件
|
||||
const exportPPTX = () => {
|
||||
exporting.value = true
|
||||
const pptx = new pptxgen()
|
||||
|
@ -157,7 +157,6 @@ export const uniqAlignLines = (lines: AlignLine[]) => {
|
||||
* 主要用于复制元素时,维持数据中各处元素ID原有的关系
|
||||
* 例如:原本两个组合的元素拥有相同的groupId,复制后依然会拥有另一个相同的groupId
|
||||
* @param elements 元素列表数据
|
||||
* @returns
|
||||
*/
|
||||
export const createElementIdMap = (elements: PPTElement[]) => {
|
||||
const groupIdMap = {}
|
||||
@ -178,7 +177,6 @@ export const createElementIdMap = (elements: PPTElement[]) => {
|
||||
/**
|
||||
* 根据表格的主题色,获取对应用于配色的子颜色
|
||||
* @param themeColor 主题色
|
||||
* @returns
|
||||
*/
|
||||
export const getTableSubThemeColor = (themeColor: string) => {
|
||||
const rgba = tinycolor(themeColor).toRgb()
|
||||
@ -193,7 +191,6 @@ export const getTableSubThemeColor = (themeColor: string) => {
|
||||
/**
|
||||
* 获取线条元素路径字符串
|
||||
* @param element 线条元素
|
||||
* @returns
|
||||
*/
|
||||
export const getLineElementPath = (element: PPTLineElement) => {
|
||||
const start = element.start.join(',')
|
||||
|
@ -1,4 +1,4 @@
|
||||
// https://github.com/scriptex/svg64
|
||||
// svg转base64图片,参考:https://github.com/scriptex/svg64
|
||||
|
||||
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/='
|
||||
const PREFIX = 'data:image/svg+xml;base64,'
|
||||
|
@ -14,6 +14,10 @@ const typeMap = {
|
||||
512: 'A',
|
||||
}
|
||||
|
||||
/**
|
||||
* 简单解析SVG路径
|
||||
* @param d SVG path d属性
|
||||
*/
|
||||
export const parseSvgPath = (d: string) => {
|
||||
const pathData = new SVGPathData(d)
|
||||
|
||||
@ -25,6 +29,10 @@ export const parseSvgPath = (d: string) => {
|
||||
|
||||
export type SvgPath = ReturnType<typeof parseSvgPath>
|
||||
|
||||
/**
|
||||
* 解析SVG路径,并将圆弧(A)类型的路径转为三次贝塞尔(C)类型的路径
|
||||
* @param d SVG path d属性
|
||||
*/
|
||||
export const toPoints = (d: string) => {
|
||||
const pathData = new SVGPathData(d)
|
||||
|
||||
|
@ -1,3 +1,7 @@
|
||||
/**
|
||||
* 将普通文本转为带段落信息的HTML字符串
|
||||
* @param text 文本
|
||||
*/
|
||||
export const parseText2Paragraphs = (text: string) => {
|
||||
const htmlText = text.replace(/[\n\r]+/g, '<br>')
|
||||
const paragraphs = htmlText.split('<br>')
|
||||
|
@ -72,6 +72,7 @@ export default defineComponent({
|
||||
return false
|
||||
})
|
||||
|
||||
// 打开元素绑定的超链接
|
||||
const openLink = () => {
|
||||
if (props.elementInfo.link) window.open(props.elementInfo.link)
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user