diff --git a/packages/editor/src/pages/editor/Container.tsx b/packages/editor/src/pages/editor/Container.tsx index 5ec275c..ac937c5 100644 --- a/packages/editor/src/pages/editor/Container.tsx +++ b/packages/editor/src/pages/editor/Container.tsx @@ -66,7 +66,7 @@ const Container = (props: { return (type: any, text: string) => { return (
- {CpIcon[type]} {text} + {(CpIcon as any)[type]} {text}
); }; diff --git a/packages/ui/package-lock.json b/packages/ui/package-lock.json index b5117f9..96c4a42 100644 --- a/packages/ui/package-lock.json +++ b/packages/ui/package-lock.json @@ -2512,6 +2512,16 @@ "csstype": "^3.0.2" } }, + "@types/react-color": { + "version": "3.0.5", + "resolved": "http://npm.yonghui.cn/repository/npm-group/@types/react-color/-/react-color-3.0.5.tgz", + "integrity": "sha1-uL3433CFvRV3ZY+zfZoY17o5Y7s=", + "dev": true, + "requires": { + "@types/react": "*", + "@types/reactcss": "*" + } + }, "@types/react-dom": { "version": "17.0.9", "resolved": "http://npm.yonghui.cn/repository/npm-group/@types/react-dom/-/react-dom-17.0.9.tgz", @@ -2580,6 +2590,15 @@ "@types/react-router": "*" } }, + "@types/reactcss": { + "version": "1.2.4", + "resolved": "http://npm.yonghui.cn/repository/npm-group/@types/reactcss/-/reactcss-1.2.4.tgz", + "integrity": "sha1-ZsX2r+Ej/6GlDb5ySqH+aOufqwA=", + "dev": true, + "requires": { + "@types/react": "*" + } + }, "@types/scheduler": { "version": "0.16.2", "resolved": "http://npm.yonghui.cn/repository/npm-group/@types/scheduler/-/scheduler-0.16.2.tgz", diff --git a/packages/ui/package.json b/packages/ui/package.json index 6d8b133..562f4d7 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -47,6 +47,7 @@ "@types/dom-to-image": "^2.6.3", "@types/lodash": "^4.14.172", "@types/react": "^17.0.0", + "@types/react-color": "^3.0.5", "@types/react-dom": "^17.0.0", "@types/react-grid-layout": "^1.1.2", "@typescript-eslint/parser": "^4.28.2", diff --git a/packages/ui/src/pages/preview/index.tsx b/packages/ui/src/pages/preview/index.tsx index d9fc82b..5a9c354 100644 --- a/packages/ui/src/pages/preview/index.tsx +++ b/packages/ui/src/pages/preview/index.tsx @@ -3,7 +3,7 @@ import React, { memo, useEffect, useMemo, useRef, useState } from 'react'; import ViewRender from '../../renderer/ViewRender'; import domtoimage from 'dom-to-image'; import req from '@/utils/req'; -import { useGetScrollBarWidth } from '@/utils/tool'; +import { getQueryString, useGetScrollBarWidth } from '@/utils/tool'; import type { LocationDescriptorObject } from 'history-with-query'; const isMac = navigator.platform.indexOf('Mac') === 0; @@ -13,13 +13,13 @@ interface PreviewPageProps { } interface PointDataItem { id: string; - item: Record; - point: Record; + item: Record; + point: Record; } const PreviewPage = memo((props: PreviewPageProps) => { const [pointData, setPointData] = useState(() => { - const pointDataStr = localStorage.getItem('pointData'); + const pointDataStr = getQueryString('pointData') || localStorage.getItem('pointData'); let points; try { @@ -74,7 +74,7 @@ const PreviewPage = memo((props: PreviewPageProps) => { setTimeout(() => { generateImg((url: string) => { - parent.window.getFaceUrl(url); + (parent as any)?.(window as unknown).getFaceUrl(url); }); }, 3000); }, [props.location.query]); diff --git a/packages/ui/src/utils/tool.ts b/packages/ui/src/utils/tool.ts index eec1448..e9c6f8d 100644 --- a/packages/ui/src/utils/tool.ts +++ b/packages/ui/src/utils/tool.ts @@ -1,21 +1,22 @@ -import { RefObject, useEffect, useLayoutEffect, useState } from 'react'; -import { RGBColor } from 'react-color'; +/* eslint-disable no-param-reassign */ +import type { RefObject } from 'react'; +import { useEffect, useLayoutEffect, useState } from 'react'; +import type { RGBColor } from 'react-color'; // 生成uuid function uuid(len: number, radix: number) { - let chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split(''); - let uuid = [], - i; - radix = radix || chars.length; + const chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split(''); + const uuid = []; + const _radix = radix || chars.length; if (len) { - for (i = 0; i < len; i++) uuid[i] = chars[0 | (Math.random() * radix)]; + for (let i = 0; i < len; i++) uuid[i] = chars[0 | (Math.random() * _radix)]; } else { let r; uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-'; uuid[14] = '4'; - for (i = 0; i < 36; i++) { + for (let i = 0; i < 36; i++) { if (!uuid[i]) { r = 0 | (Math.random() * 16); uuid[i] = chars[i === 19 ? (r & 0x3) | 0x8 : r]; @@ -28,7 +29,7 @@ function uuid(len: number, radix: number) { // 将rgba字符串对象转化为rgba对象 function rgba2Obj(rgba = '') { - let reg = /rgba\((\d+),(\d+),(\d+),(\d+)\)/g; + const reg = /rgba\((\d+),(\d+),(\d+),(\d+)\)/g; let rgbaObj: RGBColor = { r: 0, g: 0, b: 0, a: 0 }; rgba.replace(reg, (_m, r, g, b, a) => { @@ -83,12 +84,10 @@ export function useAnimation(state: boolean, delay: number) { } export function unParams(params = '?a=1&b=2&c=3') { - let obj: any = {}; - params && - // eslint-disable-next-line no-useless-escape - params.replace(/((\w*)=([\.a-z0-9A-Z]*)?)?/g, (m, a, b, c): any => { - if (b || c) obj[b] = c; - }); + const obj: any = {}; + params?.replace(/((\w*)=([\.a-z0-9A-Z]*)?)?/g, (m, a, b, c): any => { + if (b || c) obj[b] = c; + }); return obj; } @@ -119,7 +118,7 @@ export function formatTime(fmt: string, dateObj: any) { if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)); } - for (var k in o) { + for (const k in o) { if (new RegExp('(' + k + ')').test(fmt)) { fmt = fmt.replace( RegExp.$1, @@ -144,7 +143,16 @@ export function detectMobileBrowser(browserNavigatorMetaInfo: string): boolean { // note (@livs-ops): 获取浏览器元信息 export function getBrowserNavigatorMetaInfo(): string { - return window.navigator.userAgent || window.navigator.vendor || window.opera; + return window.navigator.userAgent || window.navigator.vendor || (window as any)?.opera; } export const serverUrl = isDev ? 'http://192.16x.x.x:3000' : '你的服务器地址'; + +export function getQueryString(name: string) { + const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`, 'i'); + const r = window.location.search.substr(1).match(reg); + if (r != null) { + return decodeURIComponent(r[2]); + } + return null; +}