diff --git a/.gitignore b/.gitignore index 2cea3ef..08827c7 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ dist/ +build/ deploy_versions/ .temp/ .rn_temp/ diff --git a/iconfont.json b/iconfont.json index 66a7022..a759b0f 100644 --- a/iconfont.json +++ b/iconfont.json @@ -1,7 +1,7 @@ { - "symbol_url": "//at.alicdn.com/t/c/font_3619513_i9fjrthdbsd.js", + "symbol_url": "//at.alicdn.com/t/c/font_3619513_pecprurprt.js", "save_dir": "./src/components/iconfont", - "use_typescript": false, + "use_typescript": true, "platforms": ["weapp","h5"], "use_rpx": true, "trim_icon_prefix": "", diff --git a/src/api/index.ts b/src/api/index.ts index 8068a8b..b0e6c06 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -1,26 +1,33 @@ +export { LoginApi } from './login/index' +export { + productabsorbcontrast, + SelectProductListApi, + ColorListApi, + ColorDetailedApi, + ColorSamplingSaveApi, + TextureSaveApi, + FindColorListApi, +} from './product/index' - -export {LoginApi} from './login/index' - -import { useRequest } from "@/use/useHttp" +import { useRequest } from '@/use/useHttp' /** * 系列列表 - * @returns + * @returns */ export const kindListApi = () => { - return useRequest({ - url: `/v1/mp/product/kind/list`, - method: "get", - }) + return useRequest({ + url: `/v1/mp/product/kind/list`, + method: 'get', + }) } /** * 面料列表 - * @returns + * @returns */ export const ProductListApi = () => { - return useRequest({ - url: `/v1/mp/product/list`, - method: "get", - }) + return useRequest({ + url: `/v1/mp/product/list`, + method: 'get', + }) } diff --git a/src/api/product/findColor.ts b/src/api/product/findColor.ts new file mode 100644 index 0000000..19b3386 --- /dev/null +++ b/src/api/product/findColor.ts @@ -0,0 +1,11 @@ +import { useRequest } from "@/use/useHttp" +/** + * 颜色列表 + * @returns + */ +export const FindColorListApi = () => { + return useRequest({ + url: `/v1/mp/product/color/absorb/match`, + method: 'get', + }) +} diff --git a/src/api/product/index.ts b/src/api/product/index.ts new file mode 100644 index 0000000..0e1fb14 --- /dev/null +++ b/src/api/product/index.ts @@ -0,0 +1,3 @@ +export { productabsorbcontrast, SelectProductListApi } from './product' +export { ColorListApi, ColorDetailedApi, ColorSamplingSaveApi, TextureSaveApi } from './takeColor' +export { FindColorListApi } from './findColor' diff --git a/src/api/product/product.ts b/src/api/product/product.ts new file mode 100644 index 0000000..2e1e927 --- /dev/null +++ b/src/api/product/product.ts @@ -0,0 +1,20 @@ +import { useRequest } from '@/use/useHttp' + +//取色对比 +export const productabsorbcontrast = () => { + return useRequest({ + url: `/v1/mall/product/color/absorb/contrast`, + method: 'get', + }) +} + +/** + * 面料列表(下拉选择) + * @returns + */ +export const SelectProductListApi = () => { + return useRequest({ + url: `/v1/mp/enum/product/list`, + method: 'get', + }) +} diff --git a/src/api/product/takeColor.ts b/src/api/product/takeColor.ts new file mode 100644 index 0000000..03bc2f6 --- /dev/null +++ b/src/api/product/takeColor.ts @@ -0,0 +1,45 @@ +import { useRequest } from '@/use/useHttp' + +/** + * 颜色列表 + * @returns + */ +export const ColorListApi = () => { + return useRequest({ + url: `/v1/mp/product/color/absorb/list`, + method: 'get', + }) +} + +/** + * 颜色详细 + * @returns + */ +export const ColorDetailedApi = () => { + return useRequest({ + url: `/v1/mp/product/texture`, + method: 'get', + }) +} + +/** + * 取色存储 + * @returns + */ +export const ColorSamplingSaveApi = () => { + return useRequest({ + url: `/v1/mp/product/color/absorb`, + method: 'put', + }) +} + +/** + * 保存纹理 + * @returns + */ +export const TextureSaveApi = () => { + return useRequest({ + url: `/v1/mp/product/texture`, + method: 'put', + }) +} diff --git a/src/app.config.ts b/src/app.config.ts index f2eaed8..be9bc84 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -49,5 +49,14 @@ export default defineAppConfig({ 'custom-wrapper': '/custom-wrapper', ...useGlobalIconFont(), }, - subPackages: [], + subPackages: [ + { + root: 'pages/colorRelated', + pages: [ + 'sampleComparison/index', + 'takeColor/index', + 'findColor/index' + ], + }, + ], }) diff --git a/src/app.tsx b/src/app.tsx index 9636423..039f54b 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -6,8 +6,14 @@ import './app.scss' import Taro, { onAppShow, useDidShow } from '@tarojs/taro' import { shareShop } from './common/util' +type ParamsType = { + children?: React.ReactNode +} + const store = configStore() -const App: FC = (params) => { +const App: FC = (params) => { + const { children } = params + Taro.showShareMenu({ withShareTicket: true, }) @@ -41,7 +47,7 @@ const App: FC = (params) => { return ( - {params.children} + {children} ) } diff --git a/src/common/fotmat.js b/src/common/format.js similarity index 95% rename from src/common/fotmat.js rename to src/common/format.js index 7a1acf0..0b3f074 100644 --- a/src/common/fotmat.js +++ b/src/common/format.js @@ -1,183 +1,183 @@ -import { IMG_CND_Prefix } from './constant' - -/** - * 移除井号 - * @param {String} val code 编码 - * @returns - */ -export const formatRemoveHashTag = (val = '') => { - // console.log('移除标签',val,val.endsWith("#")); - return val.endsWith('#') ? val.replace('#', '') : val -} - -/** - * 格式化编码+名称显示方式 - * @param {String} code 编码 - * @param {String} name 名称 - * @param {*} mode 模式 both:code + 名称 name: 仅显示名称 - * @returns - */ -export const formatHashTag = (code = '', name = '', mode = 'both') => { - if (mode == 'both') { - return `${formatRemoveHashTag(code)}# ${name}` - } else if (mode == 'name') { - return `${name}` - } -} - -const Digit = 10 * 10 - -/** - * 重量 进退位 单位 - */ -export const weightDigit = 1000 - -/** - * 除以 - * @param {*} val - * @param {*} digit - * @param {*} priceStatus //是否显示千位分割 - * @returns - */ -export const formatPriceDiv = (val, digit = Digit, priceStatus = false) => { - let res = strip(Number(val / digit)) || 0 - return priceStatus ? numberWithCommas({ number: res }) : res -} -/** - * 乘以 - * @param {*} val - * @param {*} digit - * @returns - */ -export const formatPriceMul = (val, digit = Digit) => { - return strip(Number(val * digit)) || 0 -} - -/** - * 格式化重量单位 (乘以) - * @param {Number} val - * @returns - */ -export const formatWeightMul = (val, digit = weightDigit) => { - return strip(Number(val * digit)) || 0 -} - -/** - * 格式化重量单位 (除以) - * @param {*} val - */ -export const formatWeightDiv = (val, digit = weightDigit) => { - return strip(Number(val / digit)) || 0 -} - -export const formatDateTime = (val, fmt = 'YYYY-MM-DD HH:mm:ss') => { - if (val) { - let time = new Date(val) - let Y = time.getFullYear() - let M = time.getMonth() + 1 - let d = time.getDate() - let h = time.getHours() - let m = time.getMinutes() - let s = time.getSeconds() - - fmt = fmt - .replace('YYYY', Y) - .replace('MM', M.toString().padStart(2, '0')) - .replace('DD', d.toString().padStart(2, '0')) - .replace('HH', h.toString().padStart(2, '0')) - .replace('mm', m.toString().padStart(2, '0')) - .replace('ss', s.toString().padStart(2, '0')) - - return fmt - } else { - return val - } -} - -/** - * 精度 - * @param {*} num - * @param {*} precision - * @returns - */ -export const strip = (num, precision = 12) => { - return +parseFloat(num.toPrecision(precision)) -} - -/** - * 转换金额单位 - * @param {*} num 金额 / 数值 - * @param {*} digit 转换单位 - * @returns - */ -export const formatMillionYuan = (num, digit = 10000) => { - return num / digit > 1 ? { num: toDecimal2(num / digit), million: true } : { num, million: false } -} - -/** - * 数值保留两位小数 - * @param {*} x - * @returns - */ -export const toDecimal2 = (x) => { - var f = parseFloat(x) - if (isNaN(f)) { - return 0 - } - f = f + '' - let index = f.lastIndexOf('.') - if (index >= 0) { - let decimal = f.substring(index + 1) - if (decimal.length == 1) { - f = f.substring(0, index + 1) + decimal + '0' - } else { - f = f.substring(0, index + 1) + decimal.substring(0, 2) - } - } - return f -} - -/** - * 格式化图片路径 - * @param {*} url - * @status true|false - * @returns - */ -export const formatImgUrl = (url, suffix = '!w200') => { - if (url) { - return url.includes('http') ? url + suffix : IMG_CND_Prefix + url + suffix - } else { - return IMG_CND_Prefix + '/mall/no_img.png' - } -} - -/** - * - * @param {纹理图} imgurl - * @param {rgb} rgb - * @param {} suffix - * @returns 1 有纹理图，2 有rgb 3默认图 - */ -export const isLabImage = (imgurl, rgb, suffix = '!w200') => { - if (imgurl) { - return { status: 1, value: IMG_CND_Prefix + '/' + imgurl + suffix } - } else if (rgb.r != 0 || rgb.g != 0 || rgb.b != 0) { - return { status: 2, value: rgb } - } else { - return { status: 3, value: IMG_CND_Prefix + '/mall/no_img.png' } - } -} - -/** - * - * @param {千位分割付} number - * @returns - */ -export const numberWithCommas = ({ number = 0, digit = 2 }) => { - if (!isNaN(Number(number))) { - // return parseFloat(number).toFixed(digit).replace(/^\B(? { + // console.log('移除标签',val,val.endsWith("#")); + return val.endsWith('#') ? val.replace('#', '') : val +} + +/** + * 格式化编码+名称显示方式 + * @param {String} code 编码 + * @param {String} name 名称 + * @param {*} mode 模式 both:code + 名称 name: 仅显示名称 + * @returns + */ +export const formatHashTag = (code = '', name = '', mode = 'both') => { + if (mode == 'both') { + return `${formatRemoveHashTag(code)}# ${name}` + } else if (mode == 'name') { + return `${name}` + } +} + +const Digit = 10 * 10 + +/** + * 重量 进退位 单位 + */ +export const weightDigit = 1000 + +/** + * 除以 + * @param {*} val + * @param {*} digit + * @param {*} priceStatus //是否显示千位分割 + * @returns + */ +export const formatPriceDiv = (val, digit = Digit, priceStatus = false) => { + let res = strip(Number(val / digit)) || 0 + return priceStatus ? numberWithCommas({ number: res }) : res +} +/** + * 乘以 + * @param {*} val + * @param {*} digit + * @returns + */ +export const formatPriceMul = (val, digit = Digit) => { + return strip(Number(val * digit)) || 0 +} + +/** + * 格式化重量单位 (乘以) + * @param {Number} val + * @returns + */ +export const formatWeightMul = (val, digit = weightDigit) => { + return strip(Number(val * digit)) || 0 +} + +/** + * 格式化重量单位 (除以) + * @param {*} val + */ +export const formatWeightDiv = (val, digit = weightDigit) => { + return strip(Number(val / digit)) || 0 +} + +export const formatDateTime = (val, fmt = 'YYYY-MM-DD HH:mm:ss') => { + if (val) { + let time = new Date(val) + let Y = time.getFullYear() + let M = time.getMonth() + 1 + let d = time.getDate() + let h = time.getHours() + let m = time.getMinutes() + let s = time.getSeconds() + + fmt = fmt + .replace('YYYY', Y) + .replace('MM', M.toString().padStart(2, '0')) + .replace('DD', d.toString().padStart(2, '0')) + .replace('HH', h.toString().padStart(2, '0')) + .replace('mm', m.toString().padStart(2, '0')) + .replace('ss', s.toString().padStart(2, '0')) + + return fmt + } else { + return val + } +} + +/** + * 精度 + * @param {*} num + * @param {*} precision + * @returns + */ +export const strip = (num, precision = 12) => { + return +parseFloat(num.toPrecision(precision)) +} + +/** + * 转换金额单位 + * @param {*} num 金额 / 数值 + * @param {*} digit 转换单位 + * @returns + */ +export const formatMillionYuan = (num, digit = 10000) => { + return num / digit > 1 ? { num: toDecimal2(num / digit), million: true } : { num, million: false } +} + +/** + * 数值保留两位小数 + * @param {*} x + * @returns + */ +export const toDecimal2 = (x) => { + var f = parseFloat(x) + if (isNaN(f)) { + return 0 + } + f = f + '' + let index = f.lastIndexOf('.') + if (index >= 0) { + let decimal = f.substring(index + 1) + if (decimal.length == 1) { + f = f.substring(0, index + 1) + decimal + '0' + } else { + f = f.substring(0, index + 1) + decimal.substring(0, 2) + } + } + return f +} + +/** + * 格式化图片路径 + * @param {*} url + * @status true|false + * @returns + */ +export const formatImgUrl = (url, suffix = '!w200') => { + if (url) { + return url.includes('http') ? url + suffix : IMG_CND_Prefix + url + suffix + } else { + return IMG_CND_Prefix + '/mall/no_img.png' + } +} + +/** + * + * @param {纹理图} imgurl + * @param {rgb} rgb + * @param {} suffix + * @returns 1 有纹理图，2 有rgb 3默认图 + */ +export const isLabImage = (imgurl, rgb, suffix = '!w200') => { + if (imgurl) { + return { status: 1, value: IMG_CND_Prefix + '/' + imgurl + suffix } + } else if (rgb.r != 0 || rgb.g != 0 || rgb.b != 0) { + return { status: 2, value: rgb } + } else { + return { status: 3, value: IMG_CND_Prefix + '/mall/no_img.png' } + } +} + +/** + * + * @param {千位分割付} number + * @returns + */ +export const numberWithCommas = ({ number = 0, digit = 2 }) => { + if (!isNaN(Number(number))) { + // return parseFloat(number).toFixed(digit).replace(/^\B(? void, - showNumber?: number, //图片显示张数，0不限制 + value?: { + texture_url?: string //纹理图路径 + lab?: { l: number; a: number; b: number } //lab + rgb?: { r: number; g: number; b: number } //rgb + title?: string //标题 + } + show?: false | true + onClose?: () => void + showNumber?: number //图片显示张数，0不限制 } -export default ({value, show = false, onClose, showNumber = 1}: colorParams) => { +export default ({ value, show = false, onClose, showNumber = 1 }: colorParams) => { + useEffect(() => { + if (show && rgbStyle) setLabShow(() => true) + if (show && value?.texture_url) onShowImage() + if (!show) setLabShow(() => false) + }, [show]) - useEffect(() => { - if(show&&rgbStyle) setLabShow(() => true) - if(show&&value?.texture_url) onShowImage() - if(!show) setLabShow(() => false) - }, [show]) - - //显示颜色 - const [labShow, setLabShow] = useState(false) - //lab是否都是0 - const rgbStyle = useMemo(() => { - if(value?.lab&&(value.lab.l||value.lab.a||value.lab.b)) { - return {'backgroundColor':`rgb(${value.rgb?.r} ${value.rgb?.g} ${value.rgb?.b})`} - } else { - return null - } - }, [value]) - - - //显示图片 - const onShowImage = () => { - onClose?.() - let res: string[] = [] - if(value?.texture_url) { - res = value?.texture_url?.split(',').map(item => { - return formatImgUrl(item) - }) - } - let n_res = showNumber == 0? res : res?.splice(0, showNumber) - Taro.previewImage({ - current: n_res[0], - urls: n_res - }) + //显示颜色 + const [labShow, setLabShow] = useState(false) + //lab是否都是0 + const rgbStyle = useMemo(() => { + if (value?.lab && (value.lab.l || value.lab.a || value.lab.b)) { + return { backgroundColor: `rgb(${value.rgb?.r} ${value.rgb?.g} ${value.rgb?.b})` } + } else { + return null } + }, [value]) - return ( - <> - {labShow&& onClose?.()}> - - - {value?.title} - - } - - ) -} \ No newline at end of file + //显示图片 + const onShowImage = () => { + onClose?.() + let res: string[] = [] + if (value?.texture_url) { + res = value?.texture_url?.split(',').map((item) => { + return formatImgUrl(item) + }) + } + let n_res = showNumber == 0 ? res : res?.splice(0, showNumber) + Taro.previewImage({ + current: n_res[0], + urls: n_res, + }) + } + + return ( + <> + {labShow && ( + onClose?.()}> + + + {value?.title} + + + )} + + ) +} diff --git a/src/components/amountShow/index.tsx b/src/components/amountShow/index.tsx index efd3a2a..e875c48 100644 --- a/src/components/amountShow/index.tsx +++ b/src/components/amountShow/index.tsx @@ -1,29 +1,25 @@ -import { Text, View } from "@tarojs/components"; -import { memo, useCallback } from "react"; -import styles from './index.module.scss' -import classnames from "classnames"; -import { numberWithCommas } from "@/common/fotmat"; +import { Text, View } from '@tarojs/components' +import { memo, useCallback } from 'react' +import styles from './index.module.scss' +import classnames from 'classnames' +import { numberWithCommas } from '@/common/format' type Param = { - number: number, //数字 - status: 0|1|2 //0 小型，1中型，2大 + number: number //数字 + status: 0 | 1 | 2 //0 小型，1中型，2大 } -export default memo(({number = 0, status = 1}:Param) => { - const priceDom = useCallback(() => { - let res = number.toFixed(2).split('.') - let int_num = parseInt(res[0]) + '' - let decimals_num = res[1] - return ( - <> - ¥ - {numberWithCommas({number:int_num, digit:0})} - .{decimals_num} - - ) - }, [number]) +export default memo(({ number = 0, status = 1 }: Param) => { + const priceDom = useCallback(() => { + let res = number.toFixed(2).split('.') + let int_num = parseInt(res[0]) + '' + let decimals_num = res[1] return ( - - {priceDom()} - + <> + ¥ + {numberWithCommas({ number: int_num, digit: 0 })} + .{decimals_num} + ) -}) \ No newline at end of file + }, [number]) + return {priceDom()} +}) diff --git a/src/components/banner/index.tsx b/src/components/banner/index.tsx index b38c592..49afae7 100644 --- a/src/components/banner/index.tsx +++ b/src/components/banner/index.tsx @@ -3,7 +3,7 @@ import { goLink } from '@/common/common' import { GetBannerList } from '@/api/banner' import styles from './index.module.scss' import { useEffect, useState } from 'react' -import { formatImgUrl } from '@/common/fotmat' +import { formatImgUrl } from '@/common/format' type item = { title: string; img: string; url: string; id: number } diff --git a/src/components/bindSalesmanPopup/index.tsx b/src/components/bindSalesmanPopup/index.tsx index cab8af9..7074833 100644 --- a/src/components/bindSalesmanPopup/index.tsx +++ b/src/components/bindSalesmanPopup/index.tsx @@ -1,51 +1,56 @@ -import { Image, Swiper, SwiperItem, Text, View } from "@tarojs/components" -import styles from './index.module.scss' -import { formatImgUrl } from "@/common/fotmat" -import Taro from "@tarojs/taro"; -import { goLink } from "@/common/common"; +import { Image, Swiper, SwiperItem, Text, View } from '@tarojs/components' +import styles from './index.module.scss' +import { formatImgUrl } from '@/common/format' +import Taro from '@tarojs/taro' +import { goLink } from '@/common/common' type params = { - show?: true|false, - onClose?: () => void + show?: true | false + onClose?: () => void } -export default ({show, onClose}:params) => { - const onCustomer = async () => { - let res = await Taro.showModal({ - title: '是否拨打服务热线', - confirmText: '拨打', - content: '(0757) 8270 6695', - cancelText: '取消', - }) - if(res.confirm) { - Taro.makePhoneCall({ - phoneNumber: '(0757)82706695' - }) - } +export default ({ show, onClose }: params) => { + const onCustomer = async () => { + let res = await Taro.showModal({ + title: '是否拨打服务热线', + confirmText: '拨打', + content: '(0757) 8270 6695', + cancelText: '取消', + }) + if (res.confirm) { + Taro.makePhoneCall({ + phoneNumber: '(0757)82706695', + }) } + } - const onConfirm = () => { - onClose?.() - goLink('/pages/bindSalesman/index') - } - return ( - <> - {show&& - - - - - - 提示 - 暂未开通下单权限功能，稍后有客服联系您，请注意接收电话。 - - - onConfirm()}>输入邀请码 - onCustomer()}>联系客服 - - - - } - - ) - -} \ No newline at end of file + const onConfirm = () => { + onClose?.() + goLink('/pages/bindSalesman/index') + } + return ( + <> + {show && ( + + + + + + + 提示 + 暂未开通下单权限功能，稍后有客服联系您，请注意接收电话。 + + + onConfirm()}> + 输入邀请码 + + onCustomer()}> + 联系客服 + + + + + + )} + + ) +} diff --git a/src/components/iconCard/index.tsx b/src/components/iconCard/index.tsx index 4c834a4..8008228 100644 --- a/src/components/iconCard/index.tsx +++ b/src/components/iconCard/index.tsx @@ -1,6 +1,6 @@ -import { View } from "@tarojs/components" -import { FC, ReactNode } from "react" -import IconFont from "../iconfont" +import { View } from '@tarojs/components' +import { FC, ReactNode } from 'react' +import IconFont from '../iconfont' import styles from './index.module.scss' import classname from 'classnames' @@ -16,8 +16,9 @@ interface PropsType { iconSize?: number } const IconCard: FC = (props) => { - const { iconName, title, onClick, customClass = '', iconSize=72 } = props + const { iconName, title, onClick, customClass = '', iconSize = 72 } = props const handleClick = (event) => { + console.log(event) onClick && onClick(event) } return ( diff --git a/src/components/iconfont/h5/IconAJizhumima.js b/src/components/iconfont/h5/IconAJizhumima.tsx similarity index 64% rename from src/components/iconfont/h5/IconAJizhumima.js rename to src/components/iconfont/h5/IconAJizhumima.tsx index 8743883..1eb32b2 100644 --- a/src/components/iconfont/h5/IconAJizhumima.js +++ b/src/components/iconfont/h5/IconAJizhumima.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconAJizhumima = ({ size, color, style: _style, ...rest }) => { +const IconAJizhumima: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconBianji.js b/src/components/iconfont/h5/IconBianji.tsx similarity index 67% rename from src/components/iconfont/h5/IconBianji.js rename to src/components/iconfont/h5/IconBianji.tsx index e0188ba..f9b628a 100644 --- a/src/components/iconfont/h5/IconBianji.js +++ b/src/components/iconfont/h5/IconBianji.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconBianji = ({ size, color, style: _style, ...rest }) => { +const IconBianji: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconBiyan.js b/src/components/iconfont/h5/IconBiyan.tsx similarity index 78% rename from src/components/iconfont/h5/IconBiyan.js rename to src/components/iconfont/h5/IconBiyan.tsx index 31cc5a0..fb2d71b 100644 --- a/src/components/iconfont/h5/IconBiyan.js +++ b/src/components/iconfont/h5/IconBiyan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconBiyan = ({ size, color, style: _style, ...rest }) => { +const IconBiyan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconCangku.js b/src/components/iconfont/h5/IconCangku.tsx similarity index 76% rename from src/components/iconfont/h5/IconCangku.js rename to src/components/iconfont/h5/IconCangku.tsx index df4d192..def2b99 100644 --- a/src/components/iconfont/h5/IconCangku.js +++ b/src/components/iconfont/h5/IconCangku.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconCangku = ({ size, color, style: _style, ...rest }) => { +const IconCangku: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconChakanquanbukehu.js b/src/components/iconfont/h5/IconChakanquanbukehu.tsx similarity index 66% rename from src/components/iconfont/h5/IconChakanquanbukehu.js rename to src/components/iconfont/h5/IconChakanquanbukehu.tsx index 7059887..38a4d03 100644 --- a/src/components/iconfont/h5/IconChakanquanbukehu.js +++ b/src/components/iconfont/h5/IconChakanquanbukehu.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconChakanquanbukehu = ({ size, color, style: _style, ...rest }) => { +const IconChakanquanbukehu: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconDaikuan.js b/src/components/iconfont/h5/IconDaikuan.tsx similarity index 78% rename from src/components/iconfont/h5/IconDaikuan.js rename to src/components/iconfont/h5/IconDaikuan.tsx index eda3f8b..946d9c6 100644 --- a/src/components/iconfont/h5/IconDaikuan.js +++ b/src/components/iconfont/h5/IconDaikuan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconDaikuan = ({ size, color, style: _style, ...rest }) => { +const IconDaikuan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconDingdan.js b/src/components/iconfont/h5/IconDingdan.tsx similarity index 67% rename from src/components/iconfont/h5/IconDingdan.js rename to src/components/iconfont/h5/IconDingdan.tsx index ed26299..78cd78b 100644 --- a/src/components/iconfont/h5/IconDingdan.js +++ b/src/components/iconfont/h5/IconDingdan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconDingdan = ({ size, color, style: _style, ...rest }) => { +const IconDingdan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconDingdan1.js b/src/components/iconfont/h5/IconDingdan1.tsx similarity index 67% rename from src/components/iconfont/h5/IconDingdan1.js rename to src/components/iconfont/h5/IconDingdan1.tsx index 6646be2..db146fb 100644 --- a/src/components/iconfont/h5/IconDingdan1.js +++ b/src/components/iconfont/h5/IconDingdan1.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconDingdan1 = ({ size, color, style: _style, ...rest }) => { +const IconDingdan1: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconDingwei.js b/src/components/iconfont/h5/IconDingwei.tsx similarity index 83% rename from src/components/iconfont/h5/IconDingwei.js rename to src/components/iconfont/h5/IconDingwei.tsx index c6bb39e..3a6950b 100644 --- a/src/components/iconfont/h5/IconDingwei.js +++ b/src/components/iconfont/h5/IconDingwei.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconDingwei = ({ size, color, style: _style, ...rest }) => { +const IconDingwei: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconDizhi.js b/src/components/iconfont/h5/IconDizhi.tsx similarity index 80% rename from src/components/iconfont/h5/IconDizhi.js rename to src/components/iconfont/h5/IconDizhi.tsx index d13f9ac..ae072ad 100644 --- a/src/components/iconfont/h5/IconDizhi.js +++ b/src/components/iconfont/h5/IconDizhi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconDizhi = ({ size, color, style: _style, ...rest }) => { +const IconDizhi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconDuizhang.js b/src/components/iconfont/h5/IconDuizhang.tsx similarity index 73% rename from src/components/iconfont/h5/IconDuizhang.js rename to src/components/iconfont/h5/IconDuizhang.tsx index 1c054ec..f00fc98 100644 --- a/src/components/iconfont/h5/IconDuizhang.js +++ b/src/components/iconfont/h5/IconDuizhang.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconDuizhang = ({ size, color, style: _style, ...rest }) => { +const IconDuizhang: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconFahuoliebiao.js b/src/components/iconfont/h5/IconFahuoliebiao.tsx similarity index 73% rename from src/components/iconfont/h5/IconFahuoliebiao.js rename to src/components/iconfont/h5/IconFahuoliebiao.tsx index 6186db7..b8f8b57 100644 --- a/src/components/iconfont/h5/IconFahuoliebiao.js +++ b/src/components/iconfont/h5/IconFahuoliebiao.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconFahuoliebiao = ({ size, color, style: _style, ...rest }) => { +const IconFahuoliebiao: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconGerenzhongxin.js b/src/components/iconfont/h5/IconGerenzhongxin.tsx similarity index 63% rename from src/components/iconfont/h5/IconGerenzhongxin.js rename to src/components/iconfont/h5/IconGerenzhongxin.tsx index 0e0396a..df960b6 100644 --- a/src/components/iconfont/h5/IconGerenzhongxin.js +++ b/src/components/iconfont/h5/IconGerenzhongxin.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconGerenzhongxin = ({ size, color, style: _style, ...rest }) => { +const IconGerenzhongxin: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconGerenzhongxin1.js b/src/components/iconfont/h5/IconGerenzhongxin1.tsx similarity index 71% rename from src/components/iconfont/h5/IconGerenzhongxin1.js rename to src/components/iconfont/h5/IconGerenzhongxin1.tsx index e2048e9..28b153c 100644 --- a/src/components/iconfont/h5/IconGerenzhongxin1.js +++ b/src/components/iconfont/h5/IconGerenzhongxin1.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconGerenzhongxin1 = ({ size, color, style: _style, ...rest }) => { +const IconGerenzhongxin1: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconGouwu.js b/src/components/iconfont/h5/IconGouwu.tsx similarity index 68% rename from src/components/iconfont/h5/IconGouwu.js rename to src/components/iconfont/h5/IconGouwu.tsx index acd351f..c75b358 100644 --- a/src/components/iconfont/h5/IconGouwu.js +++ b/src/components/iconfont/h5/IconGouwu.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconGouwu = ({ size, color, style: _style, ...rest }) => { +const IconGouwu: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconGouwu1.js b/src/components/iconfont/h5/IconGouwu1.tsx similarity index 69% rename from src/components/iconfont/h5/IconGouwu1.js rename to src/components/iconfont/h5/IconGouwu1.tsx index 710069f..c45c635 100644 --- a/src/components/iconfont/h5/IconGouwu1.js +++ b/src/components/iconfont/h5/IconGouwu1.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconGouwu1 = ({ size, color, style: _style, ...rest }) => { +const IconGouwu1: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconGuanbi.js b/src/components/iconfont/h5/IconGuanbi.tsx similarity index 68% rename from src/components/iconfont/h5/IconGuanbi.js rename to src/components/iconfont/h5/IconGuanbi.tsx index d256124..d301ffb 100644 --- a/src/components/iconfont/h5/IconGuanbi.js +++ b/src/components/iconfont/h5/IconGuanbi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconGuanbi = ({ size, color, style: _style, ...rest }) => { +const IconGuanbi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconGuanlidingdan.js b/src/components/iconfont/h5/IconGuanlidingdan.tsx similarity index 69% rename from src/components/iconfont/h5/IconGuanlidingdan.js rename to src/components/iconfont/h5/IconGuanlidingdan.tsx index d7ad8f1..15b2b82 100644 --- a/src/components/iconfont/h5/IconGuanlidingdan.js +++ b/src/components/iconfont/h5/IconGuanlidingdan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconGuanlidingdan = ({ size, color, style: _style, ...rest }) => { +const IconGuanlidingdan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconJianshao.js b/src/components/iconfont/h5/IconJianshao.tsx similarity index 60% rename from src/components/iconfont/h5/IconJianshao.js rename to src/components/iconfont/h5/IconJianshao.tsx index c285021..c65a0ae 100644 --- a/src/components/iconfont/h5/IconJianshao.js +++ b/src/components/iconfont/h5/IconJianshao.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconJianshao = ({ size, color, style: _style, ...rest }) => { +const IconJianshao: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconJizhumima.js b/src/components/iconfont/h5/IconJizhumima.tsx similarity index 75% rename from src/components/iconfont/h5/IconJizhumima.js rename to src/components/iconfont/h5/IconJizhumima.tsx index 77d653c..28d79ed 100644 --- a/src/components/iconfont/h5/IconJizhumima.js +++ b/src/components/iconfont/h5/IconJizhumima.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconJizhumima = ({ size, color, style: _style, ...rest }) => { +const IconJizhumima: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconKehuxinxi.js b/src/components/iconfont/h5/IconKehuxinxi.tsx similarity index 80% rename from src/components/iconfont/h5/IconKehuxinxi.js rename to src/components/iconfont/h5/IconKehuxinxi.tsx index 07c5fbb..38aff7e 100644 --- a/src/components/iconfont/h5/IconKehuxinxi.js +++ b/src/components/iconfont/h5/IconKehuxinxi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconKehuxinxi = ({ size, color, style: _style, ...rest }) => { +const IconKehuxinxi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconLingquseka.js b/src/components/iconfont/h5/IconLingquseka.tsx similarity index 76% rename from src/components/iconfont/h5/IconLingquseka.js rename to src/components/iconfont/h5/IconLingquseka.tsx index a910c42..e3a6347 100644 --- a/src/components/iconfont/h5/IconLingquseka.js +++ b/src/components/iconfont/h5/IconLingquseka.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconLingquseka = ({ size, color, style: _style, ...rest }) => { +const IconLingquseka: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconLujing.tsx b/src/components/iconfont/h5/IconLujing.tsx new file mode 100644 index 0000000..9e1b6eb --- /dev/null +++ b/src/components/iconfont/h5/IconLujing.tsx @@ -0,0 +1,33 @@ +/* tslint:disable */ +/* eslint-disable */ + +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; +import { getIconColor } from './helper'; + +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { + display: 'block', +}; + +const IconLujing: FunctionComponent = ({ size, color, style: _style, ...rest }) => { + const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; + + return ( + + + + ); +}; + +IconLujing.defaultProps = { + size: 18, +}; + +export default IconLujing; diff --git a/src/components/iconfont/h5/IconMadanguanli.js b/src/components/iconfont/h5/IconMadanguanli.tsx similarity index 77% rename from src/components/iconfont/h5/IconMadanguanli.js rename to src/components/iconfont/h5/IconMadanguanli.tsx index 03d55ed..6207a40 100644 --- a/src/components/iconfont/h5/IconMadanguanli.js +++ b/src/components/iconfont/h5/IconMadanguanli.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconMadanguanli = ({ size, color, style: _style, ...rest }) => { +const IconMadanguanli: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconMima.js b/src/components/iconfont/h5/IconMima.tsx similarity index 68% rename from src/components/iconfont/h5/IconMima.js rename to src/components/iconfont/h5/IconMima.tsx index b8d402e..802a604 100644 --- a/src/components/iconfont/h5/IconMima.js +++ b/src/components/iconfont/h5/IconMima.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconMima = ({ size, color, style: _style, ...rest }) => { +const IconMima: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconPaiming.js b/src/components/iconfont/h5/IconPaiming.tsx similarity index 84% rename from src/components/iconfont/h5/IconPaiming.js rename to src/components/iconfont/h5/IconPaiming.tsx index e67379a..3a82537 100644 --- a/src/components/iconfont/h5/IconPaiming.js +++ b/src/components/iconfont/h5/IconPaiming.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconPaiming = ({ size, color, style: _style, ...rest }) => { +const IconPaiming: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconPandiansaoma.js b/src/components/iconfont/h5/IconPandiansaoma.tsx similarity index 71% rename from src/components/iconfont/h5/IconPandiansaoma.js rename to src/components/iconfont/h5/IconPandiansaoma.tsx index cedaa00..34b6855 100644 --- a/src/components/iconfont/h5/IconPandiansaoma.js +++ b/src/components/iconfont/h5/IconPandiansaoma.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconPandiansaoma = ({ size, color, style: _style, ...rest }) => { +const IconPandiansaoma: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconPeihuo.js b/src/components/iconfont/h5/IconPeihuo.tsx similarity index 72% rename from src/components/iconfont/h5/IconPeihuo.js rename to src/components/iconfont/h5/IconPeihuo.tsx index e74196a..6dff214 100644 --- a/src/components/iconfont/h5/IconPeihuo.js +++ b/src/components/iconfont/h5/IconPeihuo.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconPeihuo = ({ size, color, style: _style, ...rest }) => { +const IconPeihuo: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconQianzhicangkucun.js b/src/components/iconfont/h5/IconQianzhicangkucun.tsx similarity index 80% rename from src/components/iconfont/h5/IconQianzhicangkucun.js rename to src/components/iconfont/h5/IconQianzhicangkucun.tsx index 6f58e2d..c3dfbf1 100644 --- a/src/components/iconfont/h5/IconQianzhicangkucun.js +++ b/src/components/iconfont/h5/IconQianzhicangkucun.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconQianzhicangkucun = ({ size, color, style: _style, ...rest }) => { +const IconQianzhicangkucun: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconQusechazhao.js b/src/components/iconfont/h5/IconQusechazhao.tsx similarity index 77% rename from src/components/iconfont/h5/IconQusechazhao.js rename to src/components/iconfont/h5/IconQusechazhao.tsx index 95db3db..26bea3a 100644 --- a/src/components/iconfont/h5/IconQusechazhao.js +++ b/src/components/iconfont/h5/IconQusechazhao.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconQusechazhao = ({ size, color, style: _style, ...rest }) => { +const IconQusechazhao: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconSaomiao.js b/src/components/iconfont/h5/IconSaomiao.tsx similarity index 66% rename from src/components/iconfont/h5/IconSaomiao.js rename to src/components/iconfont/h5/IconSaomiao.tsx index ebb4447..4f32e97 100644 --- a/src/components/iconfont/h5/IconSaomiao.js +++ b/src/components/iconfont/h5/IconSaomiao.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconSaomiao = ({ size, color, style: _style, ...rest }) => { +const IconSaomiao: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShaixuan.js b/src/components/iconfont/h5/IconShaixuan.tsx similarity index 75% rename from src/components/iconfont/h5/IconShaixuan.js rename to src/components/iconfont/h5/IconShaixuan.tsx index cc79608..bc0652b 100644 --- a/src/components/iconfont/h5/IconShaixuan.js +++ b/src/components/iconfont/h5/IconShaixuan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShaixuan = ({ size, color, style: _style, ...rest }) => { +const IconShaixuan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShanchusousuoxinxi.js b/src/components/iconfont/h5/IconShanchusousuoxinxi.tsx similarity index 70% rename from src/components/iconfont/h5/IconShanchusousuoxinxi.js rename to src/components/iconfont/h5/IconShanchusousuoxinxi.tsx index b67f566..8deb648 100644 --- a/src/components/iconfont/h5/IconShanchusousuoxinxi.js +++ b/src/components/iconfont/h5/IconShanchusousuoxinxi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShanchusousuoxinxi = ({ size, color, style: _style, ...rest }) => { +const IconShanchusousuoxinxi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShijian.js b/src/components/iconfont/h5/IconShijian.tsx similarity index 64% rename from src/components/iconfont/h5/IconShijian.js rename to src/components/iconfont/h5/IconShijian.tsx index fbb9408..05b5941 100644 --- a/src/components/iconfont/h5/IconShijian.js +++ b/src/components/iconfont/h5/IconShijian.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShijian = ({ size, color, style: _style, ...rest }) => { +const IconShijian: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShouhou.js b/src/components/iconfont/h5/IconShouhou.tsx similarity index 80% rename from src/components/iconfont/h5/IconShouhou.js rename to src/components/iconfont/h5/IconShouhou.tsx index fad885e..ae64641 100644 --- a/src/components/iconfont/h5/IconShouhou.js +++ b/src/components/iconfont/h5/IconShouhou.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShouhou = ({ size, color, style: _style, ...rest }) => { +const IconShouhou: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShouhouzhongxin.js b/src/components/iconfont/h5/IconShouhouzhongxin.tsx similarity index 74% rename from src/components/iconfont/h5/IconShouhouzhongxin.js rename to src/components/iconfont/h5/IconShouhouzhongxin.tsx index 097a48a..ef1ba7e 100644 --- a/src/components/iconfont/h5/IconShouhouzhongxin.js +++ b/src/components/iconfont/h5/IconShouhouzhongxin.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShouhouzhongxin = ({ size, color, style: _style, ...rest }) => { +const IconShouhouzhongxin: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShoukuanliebiao.js b/src/components/iconfont/h5/IconShoukuanliebiao.tsx similarity index 75% rename from src/components/iconfont/h5/IconShoukuanliebiao.js rename to src/components/iconfont/h5/IconShoukuanliebiao.tsx index 58aee55..b75733e 100644 --- a/src/components/iconfont/h5/IconShoukuanliebiao.js +++ b/src/components/iconfont/h5/IconShoukuanliebiao.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShoukuanliebiao = ({ size, color, style: _style, ...rest }) => { +const IconShoukuanliebiao: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShouye.js b/src/components/iconfont/h5/IconShouye.tsx similarity index 73% rename from src/components/iconfont/h5/IconShouye.js rename to src/components/iconfont/h5/IconShouye.tsx index eab00c2..ac89078 100644 --- a/src/components/iconfont/h5/IconShouye.js +++ b/src/components/iconfont/h5/IconShouye.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShouye = ({ size, color, style: _style, ...rest }) => { +const IconShouye: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconShouye1.js b/src/components/iconfont/h5/IconShouye1.tsx similarity index 78% rename from src/components/iconfont/h5/IconShouye1.js rename to src/components/iconfont/h5/IconShouye1.tsx index ccceea2..8936e20 100644 --- a/src/components/iconfont/h5/IconShouye1.js +++ b/src/components/iconfont/h5/IconShouye1.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconShouye1 = ({ size, color, style: _style, ...rest }) => { +const IconShouye1: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconSousuo.js b/src/components/iconfont/h5/IconSousuo.tsx similarity index 72% rename from src/components/iconfont/h5/IconSousuo.js rename to src/components/iconfont/h5/IconSousuo.tsx index 995e4b1..2584f8e 100644 --- a/src/components/iconfont/h5/IconSousuo.js +++ b/src/components/iconfont/h5/IconSousuo.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconSousuo = ({ size, color, style: _style, ...rest }) => { +const IconSousuo: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconSousuofanhui.js b/src/components/iconfont/h5/IconSousuofanhui.tsx similarity index 67% rename from src/components/iconfont/h5/IconSousuofanhui.js rename to src/components/iconfont/h5/IconSousuofanhui.tsx index c6b9d4f..ec4c84f 100644 --- a/src/components/iconfont/h5/IconSousuofanhui.js +++ b/src/components/iconfont/h5/IconSousuofanhui.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconSousuofanhui = ({ size, color, style: _style, ...rest }) => { +const IconSousuofanhui: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconSousuoshanchu.js b/src/components/iconfont/h5/IconSousuoshanchu.tsx similarity index 71% rename from src/components/iconfont/h5/IconSousuoshanchu.js rename to src/components/iconfont/h5/IconSousuoshanchu.tsx index 36f4528..211ee07 100644 --- a/src/components/iconfont/h5/IconSousuoshanchu.js +++ b/src/components/iconfont/h5/IconSousuoshanchu.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconSousuoshanchu = ({ size, color, style: _style, ...rest }) => { +const IconSousuoshanchu: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconTihuoliebiao.js b/src/components/iconfont/h5/IconTihuoliebiao.tsx similarity index 73% rename from src/components/iconfont/h5/IconTihuoliebiao.js rename to src/components/iconfont/h5/IconTihuoliebiao.tsx index e406a31..3514e5b 100644 --- a/src/components/iconfont/h5/IconTihuoliebiao.js +++ b/src/components/iconfont/h5/IconTihuoliebiao.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconTihuoliebiao = ({ size, color, style: _style, ...rest }) => { +const IconTihuoliebiao: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconTishi.js b/src/components/iconfont/h5/IconTishi.tsx similarity index 79% rename from src/components/iconfont/h5/IconTishi.js rename to src/components/iconfont/h5/IconTishi.tsx index b83a12e..d9a5c2d 100644 --- a/src/components/iconfont/h5/IconTishi.js +++ b/src/components/iconfont/h5/IconTishi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconTishi = ({ size, color, style: _style, ...rest }) => { +const IconTishi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconTuikuan.js b/src/components/iconfont/h5/IconTuikuan.tsx similarity index 73% rename from src/components/iconfont/h5/IconTuikuan.js rename to src/components/iconfont/h5/IconTuikuan.tsx index 681871a..d172782 100644 --- a/src/components/iconfont/h5/IconTuikuan.js +++ b/src/components/iconfont/h5/IconTuikuan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconTuikuan = ({ size, color, style: _style, ...rest }) => { +const IconTuikuan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconWeixindenglu.js b/src/components/iconfont/h5/IconWeixindenglu.tsx similarity index 86% rename from src/components/iconfont/h5/IconWeixindenglu.js rename to src/components/iconfont/h5/IconWeixindenglu.tsx index 56f4657..823f524 100644 --- a/src/components/iconfont/h5/IconWeixindenglu.js +++ b/src/components/iconfont/h5/IconWeixindenglu.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconWeixindenglu = ({ size, color, style: _style, ...rest }) => { +const IconWeixindenglu: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconWodekefu.js b/src/components/iconfont/h5/IconWodekefu.tsx similarity index 77% rename from src/components/iconfont/h5/IconWodekefu.js rename to src/components/iconfont/h5/IconWodekefu.tsx index 2b23a1f..4bc158e 100644 --- a/src/components/iconfont/h5/IconWodekefu.js +++ b/src/components/iconfont/h5/IconWodekefu.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconWodekefu = ({ size, color, style: _style, ...rest }) => { +const IconWodekefu: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconWodeshoucang.js b/src/components/iconfont/h5/IconWodeshoucang.tsx similarity index 78% rename from src/components/iconfont/h5/IconWodeshoucang.js rename to src/components/iconfont/h5/IconWodeshoucang.tsx index 4c13ed5..6731198 100644 --- a/src/components/iconfont/h5/IconWodeshoucang.js +++ b/src/components/iconfont/h5/IconWodeshoucang.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconWodeshoucang = ({ size, color, style: _style, ...rest }) => { +const IconWodeshoucang: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconXianxiahuizong.js b/src/components/iconfont/h5/IconXianxiahuizong.tsx similarity index 72% rename from src/components/iconfont/h5/IconXianxiahuizong.js rename to src/components/iconfont/h5/IconXianxiahuizong.tsx index 3a6cc3c..e724484 100644 --- a/src/components/iconfont/h5/IconXianxiahuizong.js +++ b/src/components/iconfont/h5/IconXianxiahuizong.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconXianxiahuizong = ({ size, color, style: _style, ...rest }) => { +const IconXianxiahuizong: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconXiaoshou.js b/src/components/iconfont/h5/IconXiaoshou.tsx similarity index 72% rename from src/components/iconfont/h5/IconXiaoshou.js rename to src/components/iconfont/h5/IconXiaoshou.tsx index cdd6508..cd5490f 100644 --- a/src/components/iconfont/h5/IconXiaoshou.js +++ b/src/components/iconfont/h5/IconXiaoshou.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconXiaoshou = ({ size, color, style: _style, ...rest }) => { +const IconXiaoshou: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconXinzeng.js b/src/components/iconfont/h5/IconXinzeng.tsx similarity index 63% rename from src/components/iconfont/h5/IconXinzeng.js rename to src/components/iconfont/h5/IconXinzeng.tsx index fa37e05..a68b63d 100644 --- a/src/components/iconfont/h5/IconXinzeng.js +++ b/src/components/iconfont/h5/IconXinzeng.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconXinzeng = ({ size, color, style: _style, ...rest }) => { +const IconXinzeng: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYangpinduibi.js b/src/components/iconfont/h5/IconYangpinduibi.tsx similarity index 68% rename from src/components/iconfont/h5/IconYangpinduibi.js rename to src/components/iconfont/h5/IconYangpinduibi.tsx index 6844d9f..64087cf 100644 --- a/src/components/iconfont/h5/IconYangpinduibi.js +++ b/src/components/iconfont/h5/IconYangpinduibi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYangpinduibi = ({ size, color, style: _style, ...rest }) => { +const IconYangpinduibi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYanjing.js b/src/components/iconfont/h5/IconYanjing.tsx similarity index 70% rename from src/components/iconfont/h5/IconYanjing.js rename to src/components/iconfont/h5/IconYanjing.tsx index 85c7c22..5e317ee 100644 --- a/src/components/iconfont/h5/IconYanjing.js +++ b/src/components/iconfont/h5/IconYanjing.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYanjing = ({ size, color, style: _style, ...rest }) => { +const IconYanjing: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYansequyang.js b/src/components/iconfont/h5/IconYansequyang.tsx similarity index 73% rename from src/components/iconfont/h5/IconYansequyang.js rename to src/components/iconfont/h5/IconYansequyang.tsx index 4139fe7..a31cd59 100644 --- a/src/components/iconfont/h5/IconYansequyang.js +++ b/src/components/iconfont/h5/IconYansequyang.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYansequyang = ({ size, color, style: _style, ...rest }) => { +const IconYansequyang: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYaoqingma.js b/src/components/iconfont/h5/IconYaoqingma.tsx similarity index 73% rename from src/components/iconfont/h5/IconYaoqingma.js rename to src/components/iconfont/h5/IconYaoqingma.tsx index aadc7cf..4cf056c 100644 --- a/src/components/iconfont/h5/IconYaoqingma.js +++ b/src/components/iconfont/h5/IconYaoqingma.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYaoqingma = ({ size, color, style: _style, ...rest }) => { +const IconYaoqingma: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYewuyuanqizi.js b/src/components/iconfont/h5/IconYewuyuanqizi.tsx similarity index 62% rename from src/components/iconfont/h5/IconYewuyuanqizi.js rename to src/components/iconfont/h5/IconYewuyuanqizi.tsx index f9925dd..0d556cc 100644 --- a/src/components/iconfont/h5/IconYewuyuanqizi.js +++ b/src/components/iconfont/h5/IconYewuyuanqizi.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYewuyuanqizi = ({ size, color, style: _style, ...rest }) => { +const IconYewuyuanqizi: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYonghuming.js b/src/components/iconfont/h5/IconYonghuming.tsx similarity index 68% rename from src/components/iconfont/h5/IconYonghuming.js rename to src/components/iconfont/h5/IconYonghuming.tsx index 272f2c6..2a5f6d1 100644 --- a/src/components/iconfont/h5/IconYonghuming.js +++ b/src/components/iconfont/h5/IconYonghuming.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYonghuming = ({ size, color, style: _style, ...rest }) => { +const IconYonghuming: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYufukuan.js b/src/components/iconfont/h5/IconYufukuan.tsx similarity index 69% rename from src/components/iconfont/h5/IconYufukuan.js rename to src/components/iconfont/h5/IconYufukuan.tsx index 7f7177a..84bd059 100644 --- a/src/components/iconfont/h5/IconYufukuan.js +++ b/src/components/iconfont/h5/IconYufukuan.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYufukuan = ({ size, color, style: _style, ...rest }) => { +const IconYufukuan: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/IconYuncangkucun.js b/src/components/iconfont/h5/IconYuncangkucun.tsx similarity index 75% rename from src/components/iconfont/h5/IconYuncangkucun.js rename to src/components/iconfont/h5/IconYuncangkucun.tsx index 25db8f7..e7ba6c3 100644 --- a/src/components/iconfont/h5/IconYuncangkucun.js +++ b/src/components/iconfont/h5/IconYuncangkucun.tsx @@ -1,13 +1,19 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { CSSProperties, SVGAttributes, FunctionComponent } from 'react'; import { getIconColor } from './helper'; -const DEFAULT_STYLE = { +interface Props extends Omit, 'color'> { + size?: number; + color?: string | string[]; +} + +const DEFAULT_STYLE: CSSProperties = { display: 'block', }; -const IconYuncangkucun = ({ size, color, style: _style, ...rest }) => { +const IconYuncangkucun: FunctionComponent = ({ size, color, style: _style, ...rest }) => { const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE; return ( diff --git a/src/components/iconfont/h5/helper.js b/src/components/iconfont/h5/helper.js deleted file mode 100644 index b566c4c..0000000 --- a/src/components/iconfont/h5/helper.js +++ /dev/null @@ -1,17 +0,0 @@ -/* eslint-disable */ - -/** - * @param {string | string[] | undefined} color - * @param {number} index - * @param {string} defaultColor - * @return {string} - */ -export const getIconColor = (color, index, defaultColor) => { - return color - ? ( - typeof color === 'string' - ? color - : color[index] || defaultColor - ) - : defaultColor; -}; diff --git a/src/components/iconfont/h5/helper.ts b/src/components/iconfont/h5/helper.ts new file mode 100644 index 0000000..60d6d71 --- /dev/null +++ b/src/components/iconfont/h5/helper.ts @@ -0,0 +1,12 @@ +/* tslint:disable */ +/* eslint-disable */ + +export const getIconColor = (color: string | string[] | undefined, index: number, defaultColor: string) => { + return color + ? ( + typeof color === 'string' + ? color + : color[index] || defaultColor + ) + : defaultColor; +}; diff --git a/src/components/iconfont/h5/index.js b/src/components/iconfont/h5/index.tsx similarity index 86% rename from src/components/iconfont/h5/index.js rename to src/components/iconfont/h5/index.tsx index 20c4858..470110e 100644 --- a/src/components/iconfont/h5/index.js +++ b/src/components/iconfont/h5/index.tsx @@ -1,6 +1,8 @@ +/* tslint:disable */ /* eslint-disable */ -import React from 'react'; +import React, { SVGAttributes, FunctionComponent } from 'react'; +import IconLujing from './IconLujing'; import IconJizhumima from './IconJizhumima'; import IconAJizhumima from './IconAJizhumima'; import IconWeixindenglu from './IconWeixindenglu'; @@ -59,6 +61,7 @@ import IconGerenzhongxin from './IconGerenzhongxin'; import IconDingdan from './IconDingdan'; import IconShouye from './IconShouye'; import IconGouwu from './IconGouwu'; +export { default as IconLujing } from './IconLujing'; export { default as IconJizhumima } from './IconJizhumima'; export { default as IconAJizhumima } from './IconAJizhumima'; export { default as IconWeixindenglu } from './IconWeixindenglu'; @@ -118,8 +121,18 @@ export { default as IconDingdan } from './IconDingdan'; export { default as IconShouye } from './IconShouye'; export { default as IconGouwu } from './IconGouwu'; -const IconFont = ({ name, ...rest }) => { +export type IconNames = 'icon-lujing' | 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu'; + +interface Props extends Omit, 'color'> { + name: IconNames; + size?: number; + color?: string | string[]; +} + +const IconFont: FunctionComponent = ({ name, ...rest }) => { switch (name) { + case 'icon-lujing': + return ; case 'icon-jizhumima': return ; case 'icon-a-jizhumima': diff --git a/src/components/iconfont/index.d.ts b/src/components/iconfont/index.d.ts deleted file mode 100644 index a92822f..0000000 --- a/src/components/iconfont/index.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -/* eslint-disable */ -import React, { FunctionComponent } from 'react'; - -interface Props { - name: 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu'; - size?: number; - color?: string | string[]; - style?: React.CSSProperties; -} - -declare const IconFont: FunctionComponent; - -export default IconFont; diff --git a/src/components/iconfont/index.h5.js b/src/components/iconfont/index.h5.js deleted file mode 100644 index 80b208b..0000000 --- a/src/components/iconfont/index.h5.js +++ /dev/null @@ -1,17 +0,0 @@ -/* eslint-disable */ - -import React from 'react'; -import Taro from '@tarojs/taro'; -import Icon from './h5'; - -const IconFont = (props) => { - const { name, size, color, style } = props; - - return ; -}; - -IconFont.defaultProps = { - size: 18, -}; - -export default IconFont; diff --git a/src/components/iconfont/index.h5.tsx b/src/components/iconfont/index.h5.tsx new file mode 100644 index 0000000..6afdfe2 --- /dev/null +++ b/src/components/iconfont/index.h5.tsx @@ -0,0 +1,27 @@ +/* tslint:disable */ +/* eslint-disable */ + +import React, { FunctionComponent } from 'react'; +import Taro from '@tarojs/taro'; +import Icon from './h5'; + +export type IconNames = 'icon-lujing' | 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu'; + +interface Props { + name: IconNames; + size?: number; + color?: string | string[]; + style?: React.CSSProperties; +} + +const IconFont: FunctionComponent = (props) => { + const { name, size, color, style } = props; + + return ; +}; + +IconFont.defaultProps = { + size: 18, +}; + +export default IconFont; diff --git a/src/components/iconfont/index.js b/src/components/iconfont/index.js deleted file mode 100644 index 9236f4b..0000000 --- a/src/components/iconfont/index.js +++ /dev/null @@ -1,7 +0,0 @@ -/* eslint-disable */ - -const IconFont = () => { - return null; -}; - -export default IconFont; diff --git a/src/components/iconfont/index.tsx b/src/components/iconfont/index.tsx new file mode 100644 index 0000000..36e3baf --- /dev/null +++ b/src/components/iconfont/index.tsx @@ -0,0 +1,19 @@ +/* tslint:disable */ +/* eslint-disable */ + +import React, { FunctionComponent } from 'react'; + +export type IconNames = 'icon-lujing' | 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu'; + +export interface IconProps { + name: IconNames; + size?: number; + color?: string | string[]; + style?: React.CSSProperties; +} + +const IconFont: FunctionComponent = () => { + return null; +}; + +export default IconFont; diff --git a/src/components/iconfont/index.weapp.js b/src/components/iconfont/index.weapp.js deleted file mode 100644 index 731305b..0000000 --- a/src/components/iconfont/index.weapp.js +++ /dev/null @@ -1,16 +0,0 @@ -/* eslint-disable */ - -import React from 'react'; -import Taro from '@tarojs/taro'; - -const IconFont = (props) => { - const { name, size, color, style } = props; - - return ; -}; - -IconFont.defaultProps = { - size: 18, -}; - -export default IconFont; diff --git a/src/components/iconfont/index.weapp.tsx b/src/components/iconfont/index.weapp.tsx new file mode 100644 index 0000000..e6284d0 --- /dev/null +++ b/src/components/iconfont/index.weapp.tsx @@ -0,0 +1,27 @@ +/* tslint:disable */ +/* eslint-disable */ + +import React, { FunctionComponent } from 'react'; +import Taro from '@tarojs/taro'; + +export type IconNames = 'icon-lujing' | 'icon-jizhumima' | 'icon-a-jizhumima' | 'icon-weixindenglu' | 'icon-kehuxinxi' | 'icon-yewuyuanqizi' | 'icon-chakanquanbukehu' | 'icon-biyan' | 'icon-bianji' | 'icon-daikuan' | 'icon-cangku' | 'icon-guanlidingdan' | 'icon-mima' | 'icon-guanbi' | 'icon-jianshao' | 'icon-dingwei' | 'icon-saomiao' | 'icon-peihuo' | 'icon-shaixuan' | 'icon-paiming' | 'icon-shanchusousuoxinxi' | 'icon-shijian' | 'icon-sousuo' | 'icon-shouhou' | 'icon-sousuofanhui' | 'icon-sousuoshanchu' | 'icon-tuikuan' | 'icon-tishi' | 'icon-xianxiahuizong' | 'icon-xinzeng' | 'icon-yonghuming' | 'icon-yanjing' | 'icon-yufukuan' | 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu'; + +interface Props { + name: IconNames; + size?: number; + color?: string | string[]; + style?: React.CSSProperties; +} + +const IconFont: FunctionComponent = (props) => { + const { name, size, color, style } = props; + + // @ts-ignore + return ; +}; + +IconFont.defaultProps = { + size: 18, +}; + +export default IconFont; diff --git a/src/components/iconfont/weapp/weapp.js b/src/components/iconfont/weapp/weapp.js index 5217936..4a356cf 100644 --- a/src/components/iconfont/weapp/weapp.js +++ b/src/components/iconfont/weapp/weapp.js @@ -1,6 +1,6 @@ Component({ properties: { - // icon-jizhumima | icon-a-jizhumima | icon-weixindenglu | icon-kehuxinxi | icon-yewuyuanqizi | icon-chakanquanbukehu | icon-biyan | icon-bianji | icon-daikuan | icon-cangku | icon-guanlidingdan | icon-mima | icon-guanbi | icon-jianshao | icon-dingwei | icon-saomiao | icon-peihuo | icon-shaixuan | icon-paiming | icon-shanchusousuoxinxi | icon-shijian | icon-sousuo | icon-shouhou | icon-sousuofanhui | icon-sousuoshanchu | icon-tuikuan | icon-tishi | icon-xianxiahuizong | icon-xinzeng | icon-yonghuming | icon-yanjing | icon-yufukuan | icon-wodekefu | icon-dizhi | icon-shouhouzhongxin | icon-wodeshoucang | icon-shoukuanliebiao | icon-madanguanli | icon-qusechazhao | icon-pandiansaoma | icon-yaoqingma | icon-duizhang | icon-tihuoliebiao | icon-yangpinduibi | icon-yansequyang | icon-fahuoliebiao | icon-yuncangkucun | icon-xiaoshou | icon-qianzhicangkucun | icon-lingquseka | icon-gouwu1 | icon-dingdan1 | icon-gerenzhongxin1 | icon-shouye1 | icon-gerenzhongxin | icon-dingdan | icon-shouye | icon-gouwu + // icon-lujing | icon-jizhumima | icon-a-jizhumima | icon-weixindenglu | icon-kehuxinxi | icon-yewuyuanqizi | icon-chakanquanbukehu | icon-biyan | icon-bianji | icon-daikuan | icon-cangku | icon-guanlidingdan | icon-mima | icon-guanbi | icon-jianshao | icon-dingwei | icon-saomiao | icon-peihuo | icon-shaixuan | icon-paiming | icon-shanchusousuoxinxi | icon-shijian | icon-sousuo | icon-shouhou | icon-sousuofanhui | icon-sousuoshanchu | icon-tuikuan | icon-tishi | icon-xianxiahuizong | icon-xinzeng | icon-yonghuming | icon-yanjing | icon-yufukuan | icon-wodekefu | icon-dizhi | icon-shouhouzhongxin | icon-wodeshoucang | icon-shoukuanliebiao | icon-madanguanli | icon-qusechazhao | icon-pandiansaoma | icon-yaoqingma | icon-duizhang | icon-tihuoliebiao | icon-yangpinduibi | icon-yansequyang | icon-fahuoliebiao | icon-yuncangkucun | icon-xiaoshou | icon-qianzhicangkucun | icon-lingquseka | icon-gouwu1 | icon-dingdan1 | icon-gerenzhongxin1 | icon-shouye1 | icon-gerenzhongxin | icon-dingdan | icon-shouye | icon-gouwu name: { type: String, }, diff --git a/src/components/iconfont/weapp/weapp.wxml b/src/components/iconfont/weapp/weapp.wxml index e28ef75..9df2807 100644 --- a/src/components/iconfont/weapp/weapp.wxml +++ b/src/components/iconfont/weapp/weapp.wxml @@ -1,3 +1,6 @@ + + + diff --git a/src/components/product/index.tsx b/src/components/product/index.tsx index 193c2e5..9209dea 100644 --- a/src/components/product/index.tsx +++ b/src/components/product/index.tsx @@ -1,40 +1,47 @@ -import { Image, View } from "@tarojs/components" -import Taro from "@tarojs/taro" -import { goLink } from "@/common/common" +import { Image, View } from '@tarojs/components' +import Taro from '@tarojs/taro' +import { goLink } from '@/common/common' import styles from './index.module.scss' -import { formatHashTag, formatImgUrl } from "@/common/fotmat" -import LabAndImg from "../LabAndImg" -import { useCallback, useMemo } from "react" +import { formatHashTag, formatImgUrl } from '@/common/format' +import LabAndImg from '../LabAndImg' +import { useCallback, useMemo } from 'react' type Params = { - desStatus?: true | false, - productList?: any[], - popupShow?: (any) => void + desStatus?: true | false + productList?: any[] + popupShow?: (any) => void } export default ({ desStatus = true, productList = [], popupShow }: Params) => { - - const labAndImgObj = useCallback((item) => { - return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url } - }, [productList]) - return ( - - {productList?.map(item => { - return popupShow?.(item)}> - - - {item.product_color_count}色 - - - {formatHashTag(item.code, '')} {item.name} - - {item.width} - {item.weight_density} - - {item.component} - {desStatus && {item.describe}} - - - })} - - ) + const labAndImgObj = useCallback( + (item) => { + return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url } + }, + [productList], + ) + return ( + + {productList?.map((item) => { + return ( + popupShow?.(item)}> + + + {item.product_color_count}色 + + + + {formatHashTag(item.code, '')} + {item.name} + + + {item.width} + {item.weight_density} + + {item.component} + {desStatus && {item.describe}} + + + ) + })} + + ) } diff --git a/src/components/selectProduct/index.module.scss b/src/components/selectProduct/index.module.scss new file mode 100644 index 0000000..71db5a2 --- /dev/null +++ b/src/components/selectProduct/index.module.scss @@ -0,0 +1,82 @@ + +.select_input{ + width: 100%; +} +.stock_ipnut_des{ + border-bottom: 1rpx solid #F0F0F0; + padding: 20rpx 0 10rpx 10rpx !important; + .con_input{ + display: flex; + align-items: center; + display: flex; + .label{ + width: 120px; + font-size: 27px; + height: 60px; + display: flex; + align-items: center; + padding-left: 10px; + color: #707070; + font-weight: 700; + border-right: 2px solid #F3F3F3 ; + } + .input_con{ + flex:1; + } + .input_type{ + padding-left: 50px; + font-size: 28px; + @include common_ellipsis(); + max-width: 430px; + } + .noCon{ + color: #cccccc; + } + .iconfont{ + color: #cccccc; + font-size: 30px; + } + } +} +.stock_disabled{ + background: #f7f7f7; + border-radius: 10px; + .label{ + color: #cccccc !important; + } +} + +.drawer { + top:0; + position:fixed; +} +.selectCon{ + width:100%; + .selectInput{ + width:100%; + padding: 0 20px 20px 20px; + border-bottom: 2px solid #F3F3F3; + box-sizing: border-box; + } + .selectList{ + .selectList-scroll-view{ + height: 600px; + padding-top: 22px; + .selectItem{ + font-size: 28px; + color: #707070; + padding: 22px 30px; + } + .selected{ + color: #3287EC; + font-weight: 700; + } + } + } +} +.flexBox { + display: flex; + width: 200px; + align-items: center; + justify-content: flex-end; +} diff --git a/src/components/selectProduct/index.tsx b/src/components/selectProduct/index.tsx new file mode 100644 index 0000000..bb91f40 --- /dev/null +++ b/src/components/selectProduct/index.tsx @@ -0,0 +1,112 @@ +import styles from './index.module.scss' +import { Image, Text, ScrollView, View } from '@tarojs/components' +import React, { FC, useCallback, useEffect, useMemo, useState } from 'react' +import classnames from 'classnames' +import Search from '../search' +import Popup from '../popup' +import { SelectProductListApi } from '@/api/index' + + +type PropsType = { + selectColorId: number + noAll?: boolean + onSelect?: Function + children?: React.ReactNode +} + +const SelectProduct:FC = (params) => { + const { selectColorId, noAll, onSelect } = params + + const [selectId, setSelectId] = useState(0) + + useEffect(()=>{ + setSelectId(selectColorId) + }, [selectColorId]) + + const {fetchData, state} = SelectProductListApi() + + const [selectValue, setSelectValue] = useState() + + const [productList, setProductList] = useState([{id:1}]) + + const clickEvent = () => {} + + const getSelectData = (item) => { + setSelectId(item.id) + setSelectValue(changeName(item)) + setShowPopup(false) + onSelect && onSelect(item) + } + + const changeName = (item) => { + if (item.id) { + return item.code.includes('#') ? item.code + ' ' + item.name : item.code + '# ' + item.name + } else { + return item.name + } + } + + useEffect(() => { + getProductList() + }, []) + + const getProductList = async () => { + let res = await fetchData() + !noAll && res.data.list?.unshift({ name: '全部', id: 0 }) + setProductList(res.data.list) + } + + + const list = useMemo(() => { + console.log('state', state) + return state.data.list || [{ id: 1 }] + }, [productList]) + + const [showPopup, setShowPopup] = useState(false) + + const closeEven = () => {} + + //输入了搜索关键字 + const getSearchData = useCallback((e) => { + // pageNum.current.page = 1 + // setOrderData(() => ({ list: [], total: 0 })) + // setSearchField((val) => ({ ...val, name: e, size: 10 })) + }, []) + + useEffect(() => { + setSelectId(selectColorId) + const res = productList.find((item) => item.id == selectColorId) + setSelectValue(changeName(res)) + }, [selectColorId]) + + return ( + <> + + + + 面料名称 + + {selectValue ? selectValue : '请选择'} + + + + + + + + + + {list.map((item) => { + return ( + getSelectData(item)}> + {/* {changeName(item)} */} + + ) + })} + + + + + ) +} +export default SelectProduct diff --git a/src/components/shopCart/index.tsx b/src/components/shopCart/index.tsx index 5db1201..ecf23c2 100644 --- a/src/components/shopCart/index.tsx +++ b/src/components/shopCart/index.tsx @@ -9,7 +9,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react' import Taro from '@tarojs/taro' import { alert, goLink } from '@/common/common' import { GetShoppingCartApi, DelShoppingCartApi, UpdateShoppingCartApi } from '@/api/shopCart' -import { formatHashTag, formatImgUrl, formatPriceDiv } from '@/common/fotmat' +import { formatHashTag, formatImgUrl, formatPriceDiv } from '@/common/format' import { setParam } from '@/common/system' import { debounce, throttle } from '@/common/util' import Counter from '../counter' diff --git a/src/components/uploadImage/index.tsx b/src/components/uploadImage/index.tsx index f427e02..aaf6964 100644 --- a/src/components/uploadImage/index.tsx +++ b/src/components/uploadImage/index.tsx @@ -2,7 +2,7 @@ import Taro, { FC } from '@tarojs/taro' import { memo, useEffect, useState } from 'react' import useUploadCDNImg from '@/use/useUploadImage' import { Image, Text, View } from '@tarojs/components' -import { formatImgUrl } from '@/common/fotmat' +import { formatImgUrl } from '@/common/format' import classnames from 'classnames' import styles from './index.module.scss' diff --git a/src/pages/colorRelated/components/bluetooth/LinkBlueTooth.tsx b/src/pages/colorRelated/components/bluetooth/LinkBlueTooth.tsx new file mode 100644 index 0000000..04b9dc2 --- /dev/null +++ b/src/pages/colorRelated/components/bluetooth/LinkBlueTooth.tsx @@ -0,0 +1,82 @@ +import { View } from '@tarojs/components' +import { memo, useEffect, useMemo, useState } from 'react' +import Taro from '@tarojs/taro' +import { useBluetooth } from '@/use/contextBlueTooth' +import SearchInput from '@/components/searchInput' +import Popup from './Popup' +import classnames from 'classnames' +import styles from '../css/linkBlueTooth.module.scss' + +export default memo(() => { + const { state, init, startScan, connect, disconnect } = useBluetooth() + + useEffect(() => { + init() + }, []) + + const [linkStatus, setLinkStatus] = useState(1) + useEffect(() => { + if (!state.available) { + setLinkStatus(1) + } else if (state.available && state.connected?.name) { + setLinkStatus(3) + } else { + setLinkStatus(2) + } + }, [state.available, state.connected]) + + const linkName = useMemo(() => { + return state.connected?.localName || '' + }, [state.connected]) + + //链接设备 + const onLinkListen = (item) => { + if (!state.connected && !state.connecting) connect(item) + } + + const [popupShow, setPopupShow] = useState(false) + //显示设备列表 + const onFindDevice = () => { + if (linkStatus == 1) { + Taro.showToast({ + title: '请打开蓝牙', + icon: 'none', + }) + } else { + setPopupShow(true) + onFindEven() + } + } + const onFindEven = () => { + if (!state.discovering && !state.connected && !state.connecting) startScan() + } + + //断开链接 + const onDisconnect = () => { + disconnect() + setPopupShow(false) + } + + return ( + <> + + + + + {(linkStatus == 1 && 请开启蓝牙) || + (linkStatus == 2 && 未连接设备) || + (linkStatus == 3 && {linkName})} + + + setPopupShow(false)} + onLink={(item) => onLinkListen(item)} + onOff={onDisconnect} + onFind={onFindEven} + /> + + + ) +}) diff --git a/src/pages/colorRelated/components/bluetooth/Popup.tsx b/src/pages/colorRelated/components/bluetooth/Popup.tsx new file mode 100644 index 0000000..1e23885 --- /dev/null +++ b/src/pages/colorRelated/components/bluetooth/Popup.tsx @@ -0,0 +1,79 @@ +import { ScrollView, View } from '@tarojs/components' +import { memo, useEffect, useState } from 'react' +import Loading from '@/components/loading' +import style from '../css/popup.module.scss' + +interface params { + state: any + show: Boolean + onClose: (Boolean) => void + onLink: (any) => void + children?: React.ReactNode + onOff: () => void + onFind: () => void +} + +export default memo(({ state, show = false, onClose, onLink, onOff, onFind }: params) => { + const [popupShow, setPopupShow] = useState(show) + useEffect(() => { + setPopupShow(show) + }, [show]) + const onCloseListener = () => { + onClose(false) + } + + return ( + <> + {popupShow && ( + + + 搜索设备 + + + {(state.devices && + state.devices.length > 0 && + state?.devices.map((item) => { + return ( + onLink(item)}> + {item.name} + {(!state.connecting && !state.connected && 链接) || + (state.connecting && item.deviceId == state.connecting.deviceId && 正在链接...) || + (state.connected && item.deviceId == state.connected.deviceId && 链接成功)} + + ) + })) || ( + + {(!state.discovering && ( + <> + 暂无设备,请按以下条件检查 + 1.请确保取色仪处于激活状态 + 2.请确保取色仪没有链接其他设备 + 3.请打开手机定位 + + )) || 设备搜索中} + + )} + + + {(state.connected && ( + + 断开链接 + + )) || + (!state.connected && state.discovering && ( + + 搜索中 + + + )) || ( + + 重新搜索 + + )} + + + + )} + + ) +}) diff --git a/src/pages/colorRelated/components/css/linkBlueTooth.module.scss b/src/pages/colorRelated/components/css/linkBlueTooth.module.scss new file mode 100644 index 0000000..9b5de05 --- /dev/null +++ b/src/pages/colorRelated/components/css/linkBlueTooth.module.scss @@ -0,0 +1,39 @@ +.main { + width: 100%; + background: #ffffff; + border-radius: 10px; + + .bluetooth_link { + display: flex; + align-items: center; + + .link_status { + width: 12px; + height: 12px; + background: #f02409; + border-radius: 50%; + } + + .link_statused { + background: #07C160; + } + + .link_statused_no { + background: #f0ec09; + } + + .link_name { + font-size: $font_size; + margin-left: 20px; + + } + + .link_name_no { + color: #f02409; + } + + .link_name_no_link { + color: #f0ec09; + } + } +} diff --git a/src/pages/colorRelated/components/css/popup.module.scss b/src/pages/colorRelated/components/css/popup.module.scss new file mode 100644 index 0000000..d6c273f --- /dev/null +++ b/src/pages/colorRelated/components/css/popup.module.scss @@ -0,0 +1,90 @@ +.popup{ + width: 100vw; + height: 100vh; + position: absolute; + top: 0; + left: 0; + .mask{ + width: 100%; + height: 100%; + background-color: rgba(0,0,0,0.5); + position: fixed; + top:0; + left:0; + z-index: 9; + } + .content{ + z-index: 99; + background-color: #fff; + width: 75vw; + height: 600px; + position: fixed; + top: 50%; + left: 50%; + border-radius: 20px; + transform: translateX(-50%) translateY(-50%); + display: flex; + flex-direction: column; + font-size: 28px; + .title{ + text-align: center; + margin: 20px; + } + .list{ + height: 480px; + padding: 0 20px; + .scroll{ + height: 100%; + } + .item{ + margin-bottom: 20px; + display: flex; + justify-content: space-between; + border-bottom: 1px dashed #ccc; + padding: 15px 0; + color: #3b3b3b; + @mixin link{ + font-size: 25px; + } + .link_success{ + @include link; + color: green; + } + .link_ing { + color: orange; + } + } + .noDevice{ + height: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + color: #a8a8a8; + .n_item{ + width: 100%; + text-align: left; + margin-top: 20px; + padding: 0 30px; + box-sizing: border-box; + } + } + + } + .footer{ + text-align: center; + padding: 20px 0; + background-color: #f1f1f1; + border-radius: 0 0 10px 10px; + display: flex; + justify-content: center; + align-items: center; + } + .finding{ + color: orange; + } + .footer_off{ + color: red; + } + } +} diff --git a/src/pages/colorRelated/findColor/components/DrawerCenter/index.module.scss b/src/pages/colorRelated/findColor/components/DrawerCenter/index.module.scss new file mode 100644 index 0000000..2fe9efc --- /dev/null +++ b/src/pages/colorRelated/findColor/components/DrawerCenter/index.module.scss @@ -0,0 +1,46 @@ +.popups { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100vh; + .cover { + position: fixed; + height: 100vh; + width: 100vw; + top: 0; + left: 0; + background: rgba(0, 0, 0, 0.5); + z-index: 10; + } + .popcoms { + z-index: 100; + position: fixed; + top: 50%; + left: 50%; + border-radius: 20px; + transform: translateX(-50%) translateY(-50%); + .con { + width: 500px; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + } + .showRgb { + width: 100%; + height: 550px; + background-color: #fff; + border-radius: 20px; + } + .name { + width: 100%; + text-align: center; + color: #fff; + padding: 20px 0; + font-size: 26px; + background: rgba(0, 0, 0, 0.5); + border-radius: 20px; + } + } +} diff --git a/src/pages/colorRelated/findColor/components/DrawerCenter/index.tsx b/src/pages/colorRelated/findColor/components/DrawerCenter/index.tsx new file mode 100644 index 0000000..d1093b7 --- /dev/null +++ b/src/pages/colorRelated/findColor/components/DrawerCenter/index.tsx @@ -0,0 +1,30 @@ +import { View } from "@tarojs/components" +import React, { FC, memo, useEffect, useState } from "react" +import styles from './index.module.scss' + +type PropsType = { + showModal: boolean + children?: React.ReactNode +} + +const DrawerCenter: FC = memo((props) => { + const { children, showModal } = props + + const [show, setShow] = useState(false) + + useEffect(() => { + setShow(showModal) + }, [showModal]) + // 关闭 + const close = () => { + setShow(false) + } + + return show ? ( + + {children} + + + ) : null +}) +export default DrawerCenter diff --git a/src/pages/colorRelated/findColor/components/HistoryColor/index.module.scss b/src/pages/colorRelated/findColor/components/HistoryColor/index.module.scss new file mode 100644 index 0000000..753d211 --- /dev/null +++ b/src/pages/colorRelated/findColor/components/HistoryColor/index.module.scss @@ -0,0 +1,113 @@ + +.history_color { + .selectCon { + display: flex; + flex-direction: column; + align-items: center; + height: 100%; + .selectList { + width: 692px; + height: 230px; + background: #ffffff; + border-radius: 30px; + margin-bottom: 20px; + display: flex; + align-items: center; + padding: 20px 0; + box-sizing: border-box; + .rgbColor { + width: 161px; + height: 161px; + background: red; + border-radius: 50%; + margin-left: 30px; + box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.6); + } + .product_con { + display: flex; + flex-direction: column; + justify-content: center; + margin-left: 32px; + font-size: 26px; + height: 100%; + width: 300px; + color: #505050; + .product_name { + @include common_ellipsis(); + font-size: 28px; + color: #5f5f5f; + font-weight: 700; + margin-bottom: 46px; + } + .product_color { + @include common_ellipsis(); + margin-bottom: 15px; + } + .contrast { + display: flex; + margin-bottom: 20px; + .g_num { + @include common_ellipsis(); + } + .num { + color: #00499f; + background: #c9e4ff; + padding: 3px 10px; + border-radius: 7px; + margin-left: 18px; + } + } + .date { + background: rgba(0, 0, 0, 0.3); + color: #fff; + padding: 3px 10px; + border-radius: 10px; + width: 258px; + } + } + .labColor { + flex: 1; + // height: 100%; + display: flex; + flex-direction: column; + align-items: center; + font-size: 27px; + color: #707070; + .labColor_btn { + width: 47px; + height: 47px; + background: #007aff; + color: #fff; + text-align: center; + line-height: 47px; + border-radius: 50%; + font-size: 39px; + margin-bottom: 20px; + } + .labColor_con { + flex: 1; + .L, + .a { + margin-bottom: 10px; + } + } + } + } + .noData { + display: flex; + justify-content: center; + align-items: center; + color: #707070; + height: 100%; + width: 100%; + font-size: 26px; + } + } + .selectList-scroll-color { + height: 70vh; + width: 100%; + } + .drawer-container { + background: #f0f0f0; + } +} diff --git a/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx b/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx new file mode 100644 index 0000000..1335fcb --- /dev/null +++ b/src/pages/colorRelated/findColor/components/HistoryColor/index.tsx @@ -0,0 +1,89 @@ +import Popup from "@/components/popup" +import { ScrollView, View } from "@tarojs/components" +import { FC, useEffect, useState } from "react" +import styles from './index.module.scss' +import { formatDateTime} from "@/common/format"; +import {toRgb} from '@/common/bluetooth/color/colorSpace' +import Taro from "@tarojs/taro"; + +type PropsType = { + showModal: boolean + onColor?:Function +} + +const HistoryColor: FC = (props) => { + + + const { onColor, showModal } = props + const [show, setShow] = useState(false) + + + useEffect(() => { + setShow(showModal) + }, [showModal]) + + + const closeEven = () => { + setShow(false) + } + + const [list, setList] = useState([ + { + p_time: 0, + lab: [], + code: '', + name: '' + } + ]) + + //保留1位小数 + const noScale = (val, num = 1) => { + return val?.toFixed(num) + } + //rgb转换字符串 + const labRoRgb = (val) => { + const rgb = toRgb(val) + return `rgb(${rgb[0]},${rgb[1]},${rgb[2]})` + } + + const getInfo = (item) => { + onColor && onColor(item) + } + + + + return ( + + + + + {!!list?.length ? ( + list.map((item, index) => { + return ( + getInfo(item)}> + + + {item.code + ' ' + item.name} + {formatDateTime(item.p_time)} + + + + + + L*：{noScale(item.lab[0])} + a*：{noScale(item.lab[1])} + b*：{noScale(item.lab[2])} + + + + ) + }) + ) : ( + 暂无数据 + )} + + + + + ) +} +export default HistoryColor diff --git a/src/pages/colorRelated/findColor/components/LabColor/index.module.scss b/src/pages/colorRelated/findColor/components/LabColor/index.module.scss new file mode 100644 index 0000000..22da60f --- /dev/null +++ b/src/pages/colorRelated/findColor/components/LabColor/index.module.scss @@ -0,0 +1,46 @@ +.lab_color_main { + display: flex; + justify-content: space-between; + padding: 20px 0; + font-size: 28px; + .btnColor { + width: 264px; + height: 264px; + background: #dddddd; + border-radius: 50%; + text-align: center; + line-height: 264px; + color: #707070; + box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.6); + } + .labCon { + display: flex; + flex-direction: column; + justify-content: center; + padding: 20px 0 20px 20px; + color: #707070; + .lab { + color: #707070; + display: flex; + margin-bottom: 20px; + text { + display: flex; + &:nth-child(1) { + font-weight: 700; + } + &:nth-child(n + 2) { + background-color: #fff; + margin-left: 17px; + padding: 3px 15px; + border-radius: 10px; + width: 73px; + display: flex; + justify-content: center; + } + } + } + .date { + font-size: 26px; + } + } +} diff --git a/src/pages/colorRelated/findColor/components/LabColor/index.tsx b/src/pages/colorRelated/findColor/components/LabColor/index.tsx new file mode 100644 index 0000000..077fc22 --- /dev/null +++ b/src/pages/colorRelated/findColor/components/LabColor/index.tsx @@ -0,0 +1,54 @@ +import { View, Text } from '@tarojs/components' +import { FC, useMemo } from 'react' +import { toRgb } from '@/common/bluetooth/color/colorSpace' +import styles from './index.module.scss' +import { formatDateTime } from '@/common/format' + +type PropsType = { + lab?: Array + time?: any + onLab?: Function +} + +const LabColor: FC = (props) => { + const { lab = [], time, onLab } = props + const noScale = (val, num = 1) => { + return val.toFixed(num) + } + + const labObj = useMemo(() => { + if (lab.length <= 0) return { lab: [], rgb: '' } + const rgb = toRgb(lab) + return { + lab: [noScale(lab[0]), noScale(lab[1]), noScale(lab[2])], + rgb: `rgb(${rgb[0]},${rgb[1]},${rgb[2]})`, + } + }, [lab]) + + const labTime = useMemo(() => { + if (time.length <= 0) return '' + return formatDateTime(time) + }, [time]) + + const onLabEven = () => { + onLab && onLab() + } + + return ( + + + {!!labObj.lab.length ? '' : '点击取色'} + + + + L*a*b*: + {labObj.lab[0]} + {labObj.lab[1]} + {labObj.lab[2]} + + {labTime && 取样时间: {labTime}} + + + ) +} +export default LabColor diff --git a/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss b/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss new file mode 100644 index 0000000..0b1633a --- /dev/null +++ b/src/pages/colorRelated/findColor/components/RecommendColor/index.module.scss @@ -0,0 +1,121 @@ +.RecommendColor_main { + width: 100%; + .RecommendColor_list { + display: flex; + flex-wrap: wrap; + .RecommendColor_item { + background: #fff; + width: 48.5%; + height: 356px; + border-radius: 30px; + margin-bottom: 20px; + &:nth-child(2n) { + margin-left: 3%; + } + .rgbColor { + width: 100%; + height: 188px; + background: rgb(0, 195, 255); + border-radius: 30px 30px 0 0; + position: relative; + .lab { + width: 90px; + height: 100%; + background: rgba(0, 0, 0, 0.3); + position: absolute; + right: 0; + top: 0; + border-radius: 0 30px 0 0; + color: #fff; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + font-size: 26px; + text { + &:nth-child(1) { + font-weight: 700; + margin-bottom: 10px; + } + } + } + } + .product_con { + display: flex; + flex-direction: column; + font-size: 26px; + padding: 10px 15px 15px 15px; + box-sizing: border-box; + .product_color { + color: #505050; + @include common_ellipsis(); + } + .product_title { + display: flex; + justify-content: space-between; + .product_name { + @include common_ellipsis(); + color: #0c68c5; + font-weight: 700; + font-size: 28px; + flex: 1; + margin-right: 10px; + } + .product_num { + background: #c9e4ff; + color: #00499f; + padding: 3px 6px; + font-size: 26px; + border-radius: 5px; + margin-bottom: 13px; + } + } + .date { + margin-top: 15px; + color: #808080; + display: flex; + align-items: center; + justify-content: space-between; + .labColor_btn { + width: 47px; + height: 47px; + background: #007aff; + color: #fff; + text-align: center; + line-height: 47px; + border-radius: 50%; + font-size: 39px; + margin-right: 10px; + } + .g_num { + flex: 1; + margin-right: 10px; + @include common_ellipsis(); + } + } + } + } + } + .con { + width: 500px; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + .showRgb { + width: 100%; + height: 550px; + background-color: #fff; + border-radius: 20px; + } + .name { + width: 100%; + text-align: center; + color: #fff; + padding: 20px 0; + font-size: 26px; + background: rgba(0, 0, 0, 0.5); + border-radius: 20px; + } + } +} diff --git a/src/pages/colorRelated/findColor/components/RecommendColor/index.tsx b/src/pages/colorRelated/findColor/components/RecommendColor/index.tsx new file mode 100644 index 0000000..2e2bc10 --- /dev/null +++ b/src/pages/colorRelated/findColor/components/RecommendColor/index.tsx @@ -0,0 +1,83 @@ +import { FC, useState } from 'react' +import { View, Text } from '@tarojs/components' +import { toRgb } from '@/common/bluetooth/color/colorSpace' +import styles from './index.module.scss' +import { formatDateTime } from '@/common/format' +import classnames from 'classnames' +import DrawerCenter from '../DrawerCenter' + +type PropsType = { + list?: Array + customStyle?: React.CSSProperties +} + +const RecommendColor: FC = (props) => { + + const { list, customStyle = {} } = props + + //rgb转换字符串 + const labRoRgb = (val) => { + const lab = val ? [val.l, val.a, val.b] : [] + const rgb = toRgb(lab) + return `rgb(${rgb[0]},${rgb[1]},${rgb[2]})` + } + + //保留1位小数 + const noScale = (val, num = 1) => { + return val.toFixed(num) + } + + const [show, setShow] = useState(false) + const [selectObj, setSelectObj] = useState({ + rgb: '', + product_color_code: '', + product_color_name: '' + }) + + const openShow = (val) => { + setShow(true) + setSelectObj(val) + setSelectObj({ ...val, rgb: labRoRgb(val.lab) }) + } + + + return ( + + + {list?.map((item) => { + return ( + openShow(item)}> + + + L*a*b* + {noScale(item.lab.l)} + {noScale(item.lab.a)} + {noScale(item.lab.b)} + + + + + {item.product_code + '# ' + item.product_name} + {noScale(item.match_rate_percent, 1)}% + + {item.product_color_code + ' ' + item.product_color_name} + + {item.dyelot_number} + + + + + + ) + })} + + + + + + {selectObj.product_color_code + ' ' + selectObj.product_color_name} + + + + ) +} +export default RecommendColor diff --git a/src/pages/colorRelated/findColor/index.config.ts b/src/pages/colorRelated/findColor/index.config.ts new file mode 100644 index 0000000..f3418f1 --- /dev/null +++ b/src/pages/colorRelated/findColor/index.config.ts @@ -0,0 +1,4 @@ +export default { + navigationBarTitleText: '取色查找', + enableShareAppMessage: false, +} diff --git a/src/pages/colorRelated/findColor/index.module.scss b/src/pages/colorRelated/findColor/index.module.scss new file mode 100644 index 0000000..a9abbf6 --- /dev/null +++ b/src/pages/colorRelated/findColor/index.module.scss @@ -0,0 +1,94 @@ +page { + height: 100vh; +} +.findColor_main { + display: flex; + flex-direction: column; + align-items: center; + padding: 20px; + min-height: 100%; + background: #f3f3f3; + box-sizing: border-box; + .findColor_main_search { + background: #fff; + width: 100%; + padding: 0 20rpx; + border-radius: 20rpx; + box-sizing: border-box; + } + .findColor_main_title { + width: 100%; + .RecommendColor_title { + display: flex; + justify-content: space-between; + font-size: 28px; + margin-bottom: 20px; + padding: 10px 20px; + box-sizing: border-box; + color: #707070; + font-weight: bold; + border-bottom: 1px dashed #e4e4e4; + width: 100%; + text { + &:nth-child(2) { + color: #007aff; + } + } + } + } + .noList { + flex: 1; + width: 100%; + display: flex; + justify-content: center; + align-items: center; + color: #707070; + font-size: 26px; + } + .list { + display: flex; + padding: 20px; + box-sizing: border-box; + border: 1px solid #ccc; + width: 100%; + justify-content: space-between; + border-radius: 10px; + font-size: 25px; + margin-top: 20px; + } + .measure { + width: 100%; + .list { + justify-content: center; + } + .content { + width: 100%; + } + .diff { + text-align: center; + } + } + .color { + margin-top: 20px; + } + .labAndRgb { + display: flex; + width: 100%; + justify-content: center; + margin-top: 30px; + .item { + margin-top: 20px; + font-size: 28px; + } + } + .color_list { + margin-top: 30px; + margin-bottom: 30px; + display: flex; + justify-content: center; + .color_item { + width: 250px; + height: 250px; + } + } +} diff --git a/src/pages/colorRelated/findColor/index.tsx b/src/pages/colorRelated/findColor/index.tsx new file mode 100644 index 0000000..344022a --- /dev/null +++ b/src/pages/colorRelated/findColor/index.tsx @@ -0,0 +1,140 @@ +import { View, Text } from '@tarojs/components' +import { FC, useEffect, useState } from 'react' +import styles from './index.module.scss' +import LineBluetooth from '../components/bluetooth/LinkBlueTooth' +import HistoryColor from './components/HistoryColor' +import LabColor from './components/LabColor' +import SelectProduct from '@/components/selectProduct' +import { useBluetooth } from '@/use/contextBlueTooth' +import RecommendColor from './components/RecommendColor' +import { FindColorListApi } from '@/api/index' +import Loading from '@/components/loading' +import Taro from '@tarojs/taro' +import { throttle } from '@/common/util' + +const FindColor: FC = () => { + const { measureAndGetLab, disconnect, connected, deviceLab } = useBluetooth() + const { state: colorState, fetchData: ApiFindColorList } = FindColorListApi() + + const [list, setList] = useState([]) + const [product, setProduct] = useState>({}) + + //获取数据 + const getData = async () => { + setList([]) + await ApiFindColorList({ + product_id: product.id, + l: labArray[0], + a: labArray[1], + b: labArray[2], + }) + setList(colorState.data.list) + } + + const [labArray, setlabArray] = useState>([]) + const [labtime, setLabtime] = useState(+new Date()) + //点击获取lab按钮 + const labEven = throttle(async () => { + if (!connected) { + Taro.showToast({ title: '请先链接设备', icon: 'none' }) + return + } + if (!product) { + Taro.showToast({ title: '请选择面料', icon: 'none' }) + return + } + await measureAndGetLab() + }, 500) + const selectInput = (val) => { + setProduct(val) + setLabtime('') + setlabArray([]) + setList([]) + } + + const getColor = (val) => { + setList([]) + setlabArray(val.lab) + setLabtime(val.p_time) + setProduct({ + code: val.code, + default: val.default, + id: val.id, + name: val.name, + }) + getData() + } + + const [listLoading, setListLoading] = useState(false) + + useEffect(() => { + setListLoading(colorState.loading) + }, [colorState]) + + const [showHistory, setShowHistory] = useState(false) + + const ResultContainer = () => { + if (!listLoading && list?.length > 0) { + return + } else if (!listLoading && labArray.length == 0) { + return -请取色- + } else if (!listLoading && labArray.length > 0 && list?.length == 0) { + return -暂无数据- + } else if (listLoading) { + return + } + } + + //历史取样 + const historyShowEven = () => { + setShowHistory(true) + } + + useEffect(() => { + if (!product) { + Taro.showToast({ title: '请选择面料', icon: 'none' }) + return + } + if (deviceLab) { + setLabtime(+new Date()) + setlabArray([deviceLab.L, deviceLab.a, deviceLab.b]) + // console.log('state.labArray::',state.labArray) + localSave() + getData() + } + }, [deviceLab]) + + //本地存储取色记录(无差别存储版本) + const localSave = () => { + let historyColorList = Taro.getStorageSync('historyColor') || [] + let obj = { + ...product, + p_time: labtime, + lab: labArray, + } + historyColorList.unshift(obj) + if (historyColorList.length > 30) historyColorList.pop() + Taro.setStorageSync('historyColor', historyColorList) + } + + return ( + + + + + + + + + 推荐数 ({list?.length}) + 历史取样 + + + + {ResultContainer()} + + + ) +} + +export default FindColor diff --git a/src/pages/colorRelated/sampleComparison/index.config.ts b/src/pages/colorRelated/sampleComparison/index.config.ts new file mode 100644 index 0000000..cfc4a8a --- /dev/null +++ b/src/pages/colorRelated/sampleComparison/index.config.ts @@ -0,0 +1,4 @@ +export default { + navigationBarTitleText: '样品对比', + enableShareAppMessage: false, +} diff --git a/src/pages/colorRelated/sampleComparison/index.module.scss b/src/pages/colorRelated/sampleComparison/index.module.scss new file mode 100644 index 0000000..52207f9 --- /dev/null +++ b/src/pages/colorRelated/sampleComparison/index.module.scss @@ -0,0 +1,251 @@ +page { + background: #f3f3f3; + overflow: hidden; +} + +.body { + overflow: hidden; + + .topBox { + margin-top: 24px; + margin-left: 30px; + width: 690px; + height: 86px; + background: #ffffff; + border-radius: 10px; + display: flex; + align-items: center; + justify-content: space-between; + + .leftBox { + display: flex; + align-items: center; + padding-left: 19px; + + .leftFont { + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + text-align: left; + color: #707070; + margin-right: 14px; + } + + .borderBox { + width: 0px; + height: 62px; + border: 2px solid #f3f3f3; + margin-right: 39px; + } + + .cricleBox { + width: 12px; + height: 12px; + background: #cccccc; + border-radius: 50%; + margin-right: 12px; + } + + .notNet { + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #aaaaaa; + } + } + + .iconMore { + margin-right: 30px; + font-size: 30px; + } + } + + .contBox { + margin-top: 53px; + display: flex; + padding-left: 56px; + + .firstBox { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + + .firstLeftName { + font-size: 26px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #707070; + } + + .firstLeftbox { + width: 290px; + height: 290px; + background: #dddddd; + margin-top: 13px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + border-radius: 50%; + + .clickFont { + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #707070; + } + } + + .color_bock { + width: 290px; + height: 290px; + border-radius: 50%; + } + + .color_bocktwo { + width: 290px; + height: 290px; + border-radius: 50%; + } + + .nameColor { + font-size: 24px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #707070; + margin-top: 30px; + } + } + } + + .reslutBox { + width: 692px; + height: 180px; + background: #ffffff; + margin-top: 30px; + margin-left: 29px; + border-radius: 20px; + overflow: hidden; + } + + .reslutTitle { + overflow: hidden; + width: 100%; + margin-top: 41px; + display: flex; + align-items: center; + justify-content: space-between; + + .titleLeft { + margin-left: 48px; + font-size: 26px; + font-family: Microsoft YaHei, Microsoft YaHei-Bold; + font-weight: 700; + color: #707070; + } + + .titleRiht { + margin-right: 37px; + width: 136px; + height: 46px; + background: #ffd9d9; + border-radius: 10px; + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + text-align: center; + color: #ff4a4a; + line-height: 46px; + } + + .titleRiht1 { + background: #cdf3df; + margin-right: 37px; + width: 136px; + height: 46px; + border-radius: 10px; + font-size: 28px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + text-align: center; + line-height: 46px; + color: #07c160; + } + } + + .notResult { + width: 100%; + text-align: center; + font-size: 26px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #ababab; + margin-top: 14px; + } + + .notBox { + margin-top: 32px; + display: flex; + align-items: center; + justify-content: space-between; + overflow: hidden; + + .notLeft { + font-size: 26px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #707070; + margin-left: 40px; + } + + .notright { + font-size: 26px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + color: #707070; + margin-right: 37px; + } + } + + .bottomBox { + position: fixed; + bottom: 0; + width: 750px; + height: 182px; + background: #f3f3f3; + box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.16); + overflow: hidden; + display: flex; + + .leftBtn { + width: 264px; + height: 82px; + background: #ffffff; + border-radius: 42px; + font-size: 32px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + text-align: center; + color: #007aff; + line-height: 82px; + margin-top: 34px; + margin-left: 67px; + } + + .rightBtn { + width: 264px; + height: 82px; + background: #007aff; + border-radius: 42px; + font-size: 32px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + text-align: center; + color: #ffffff; + line-height: 82px; + margin-top: 34px; + margin-left: 88px; + } + } +} diff --git a/src/pages/colorRelated/sampleComparison/index.tsx b/src/pages/colorRelated/sampleComparison/index.tsx new file mode 100644 index 0000000..471c377 --- /dev/null +++ b/src/pages/colorRelated/sampleComparison/index.tsx @@ -0,0 +1,179 @@ +import { Image, Text, Textarea, View } from '@tarojs/components' +import Taro, { useDidShow, usePullDownRefresh, useRouter } from '@tarojs/taro' +import { useCallback, useEffect, useMemo, useRef, useState } from 'react' +import { useBluetooth } from '@/use/contextBlueTooth' +import classnames from 'classnames' +import LinkBlueTooth from '../components/bluetooth/LinkBlueTooth' +import { toRgb } from '@/common/bluetooth/color/colorSpace' +import styles from './index.module.scss' +import { productabsorbcontrast } from '@/api/index' +export default () => { + //搜索参数 + const [searchField, setSearchField] = useState({ + l1: '', + a1: '', + b1: '', + l2: '', + a2: '', + b2: '', + }) + type ColorList = { + one?: any + two?: any + } + const [colorList, setColorList] = useState({ + one: null, + two: null, + }) + const { state: colorState, measureAndGetLab } = useBluetooth() + + const getLab = async (val) => { + if (colorState.connected) { + let res = await measureAndGetLab() + if (val === 1) { + setColorList({ ...colorList, one: res }) + } else { + setColorList({ ...colorList, two: res }) + } + } else { + Taro.showToast({ + title: '请链接设备', + icon: 'none', + }) + } + } + const getNowTime = () => { + const yy = new Date().getFullYear() + const MM = new Date().getMonth() + 1 < 10 ? '0' + (new Date().getMonth() + 1) : new Date().getMonth() + 1 + const dd = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate() + const HH = new Date().getHours() < 10 ? '0' + new Date().getHours() : new Date().getHours() + const mm = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes() + const ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds() + return yy + '-' + MM + '-' + dd + ' ' + HH + ':' + mm + ':' + ss + } + //监听lab数据变化 + const [blueToothColor, setBlueToothColor] = useState('') + const [blueToothColorTwo, setBlueToothColorTwo] = useState('') + const [time, setTime] = useState('') + const [timeTwo, setTimeTwo] = useState('') + useEffect(() => { + if (colorState.deviceLab) { + if ((colorList as any).one?.constructor === Object) { + const rgb = toRgb([(colorList as any).one?.L, (colorList as any).one?.a, (colorList as any).one?.b]) + setBlueToothColor(`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`) + setTime(getNowTime()) + setSearchField({ ...searchField, l1: rgb[0], a1: rgb[1], b1: rgb[2] }) + } + if ((colorList as any).two?.constructor === Object) { + const rgb = toRgb([(colorList as any).two?.L, (colorList as any).two?.a, (colorList as any).two?.b]) + setBlueToothColorTwo(`rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]})`) + setTimeTwo(getNowTime()) + setSearchField({ ...searchField, l2: rgb[0], a2: rgb[1], b2: rgb[2] }) + } + } + }, [colorList]) + const reset = () => { + setColorList({}) + setBlueToothColor('') + setBlueToothColorTwo('') + setTime('') + setTimeTwo('') + setData('') + setResult('') + } + const [data, setData] = useState('') + const [result, setResult] = useState('') + const { fetchData } = productabsorbcontrast() + const handTake = async () => { + if (searchField.l1 === '') { + Taro.showToast({ + title: '请填充基础样品', + icon: 'none', + }) + return + } + if (searchField.l2 === '') { + Taro.showToast({ + title: '请填充对比样品', + icon: 'none', + }) + return + } + const query = { + ...searchField, + } + const res = await fetchData(query) + if (res.data) { + setData(res.data) + let diffarray = [ + res.data.reddish && '偏红', + res.data.yellowish && '偏黄', + res.data.greenish && '偏绿', + res.data.bluish && '偏蓝', + res.data.whitish && '偏亮', + res.data.darker && '偏暗', + ] + let resCont = diffarray.filter((item) => item).join(',') + setResult(resCont) + } + } + return ( + + + + + + + 基础样品 + {blueToothColor === '' && ( + getLab(1)}> + 点击取色 + + )} + {blueToothColor && getLab(1)} style={{ background: blueToothColor }}>} + {time === '' && --} + {time && {time}} + + + 对比样品 + {blueToothColorTwo === '' && ( + getLab(2)}> + 点击取色 + + )} + {blueToothColorTwo && getLab(2)} style={{ background: blueToothColorTwo }}>} + {timeTwo === '' && --} + {timeTwo && {timeTwo}} + + + + + 测量结果 + {(data as any).ciede_2000 >= 1 && 不合格} + {(data as any).ciede_2000 <= 1 && 合格} + + {data === '' && 暂无数据} + {data && ( + + 色差值: {(data as any).ciede_2000} + {!(data as any).reddish && + !(data as any).yellowish && + !(data as any).greenish && + !(data as any).bluish && + !(data as any).whitish && + !(data as any).darker && 无明显色差} + {result && {result}} + + )} + + + reset()}> + 重置 + + handTake()}> + 提交 + + + + ) +} diff --git a/src/pages/colorRelated/takeColor/components/ColorCard/index.module.scss b/src/pages/colorRelated/takeColor/components/ColorCard/index.module.scss new file mode 100644 index 0000000..df46437 --- /dev/null +++ b/src/pages/colorRelated/takeColor/components/ColorCard/index.module.scss @@ -0,0 +1,184 @@ + +@mixin flex-center { + display: flex; + justify-content: center; + align-items: center; +} +@mixin flex-vertical-center { + display: flex; + align-items: center; +} +@mixin ellipsis { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + display: inline-block; +} +.color-list { + @include flex-vertical-center; + justify-content: space-between; + width: 690px; + background: #ffffff; + opacity: 1; + padding: 30px; + box-sizing: border-box; + margin: 20px auto 0; + border-radius: 35px; + z-index: 0; + position: relative; + border: 4px solid transparent; +} +.vertical { + position: absolute; + width: 0; + height: 105%; + z-index: -1; + overflow: hidden; + top: 50%; + left: 50%; + border-radius: 35px; + transform: translate(-50%, -50%); +} +.vertical view { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 690px; + height: 95%; + border-radius: 35px; + border: 4px solid #007aff; + // border-bottom: 3px solid #007AFF; +} +.move-vertical { + width: 700px; + animation: moveVertical 0.3s ease; +} +@keyframes moveVertical { + from { + width: 0; + } + to { + width: 700px; + } +} +.horizontal { + position: absolute; + width: 100%; + height: 100%; + z-index: -1; + overflow: hidden; + top: 50%; + left: 50%; + border-radius: 35px; + transform: translate(-50%, -50%); +} +.move-horizontal { + height: 0; + animation: moveHorizontal 0.3s ease 0.3s; +} +@keyframes moveHorizontal { + from { + height: 100%; + } + to { + height: 0; + } +} +.flash { + animation-name: KFlash; + animation-duration: 0.5s; + animation-timing-function: linear; + animation-direction: alternate; + animation-iteration-count: infinite; +} +@keyframes KFlash { + to { + border: 4px solid #999; + } +} +.c-image { + width: 161px; + height: 161px; + background: rgba(0, 0, 0, 0); + overflow: hidden; + border-radius: 50%; + position: relative; +} +.c-image text { + font-size: 25px; + color: white; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); +} +.c-image image { + width: 100%; + height: 100%; +} +.c-info { + width: 296px; + margin-left: 25px; + margin-right: 25px; + overflow: hidden; + line-height: 34px; +} +.c-info text { + @include ellipsis; + width: 100%; + font-size: 26px; + font-weight: 400; + line-height: 34px; + color: #707070; +} +.c-i-title { + @include ellipsis; + width: 100%; + font-size: 28px; + font-weight: bold; + line-height: 38px; + color: #707070; + margin: 5px 0; +} +.c-i-date { + @include flex-center; + width: 268px; + height: 38px; + background: rgba(0, 0, 0, 0.3); + border-radius: 6px; + font-size: 24px; + font-weight: 400; + color: #ffffff; + margin-top: 17px; +} +.c-lab { + height: 100%; + justify-self: flex-end; + @include flex-vertical-center; + flex-direction: column; +} +.c-lab .c-lab-button { + @include flex-center; + height: 48px; + min-width: 96px; + background: #007aff; + border-radius: 50px; + font-size: 24px; + font-weight: 400; + line-height: 32px; + color: #ffffff; + margin-bottom: 12px; + padding: 0 15px; +} +.c-lab .c-lab-button.again { + background: #f0f0f0; + color: #007aff; +} +.c-lab .c-lab-text { + font-size: 24px; + font-weight: 400; + line-height: 36px; + color: #707070; + margin-top: 25px; +} diff --git a/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx b/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx new file mode 100644 index 0000000..0a18dbd --- /dev/null +++ b/src/pages/colorRelated/takeColor/components/ColorCard/index.tsx @@ -0,0 +1,78 @@ +import { View, Text } from '@tarojs/components' +import React, { FC } from 'react' +import classnames from 'classnames' +import styles from './index.module.scss' +import { formatHashTag } from '@/common/format' +import dayjs from 'dayjs' + +type PropsType = { + item?: Record + key?: any + index?: number + onPreviewRgb?: Function + onTakeColor?: Function +} + +const ColorCard: FC = (params) => { + const { item = {}, index, onTakeColor, onPreviewRgb, key } = params + + const truncation = (ev) => { + if (ev) { + ev += '' + let index = ev.lastIndexOf('.') + let suffix = ev.substr(index + 1) + if (suffix.length > 2) { + suffix = suffix.substr(0, 1) + ev = ev.substr(0, index) + '.' + suffix + } + return ev + } else { + return 0 + } + } + + const handleTakeColor = () => { + onTakeColor && onTakeColor(index) + } + + const handlePreviewRgb = () => { + onPreviewRgb && onPreviewRgb() + } + + return ( + + + + + + + {!item.sampling && 末取样} + + + {formatHashTag(item.product_code, item.product_name)} + {formatHashTag(item.product_color_code, item.product_color_name)} + {item.absorb_lab_time && dayjs(item.absorb_lab_time).format('YYYY-MM-DD HH:mm:ss')} + + + + {item.sampling ? '重新取样' : '取样'} + + + L*: {truncation(item?.currentLab?.l)} + a*: {truncation(item?.currentLab?.a)} + b*: {truncation(item?.currentLab?.b)} + + + + ) +} +export default ColorCard diff --git a/src/pages/colorRelated/takeColor/components/Texture/index.module.scss b/src/pages/colorRelated/takeColor/components/Texture/index.module.scss new file mode 100644 index 0000000..1052c3c --- /dev/null +++ b/src/pages/colorRelated/takeColor/components/Texture/index.module.scss @@ -0,0 +1,68 @@ + + @mixin flex-center{ + display: flex; + justify-content: center; + align-items: center; + } + @mixin flex-vertical-center{ + display: flex; + align-items: center; + } + .tc-info{ + @include flex-vertical-center; + justify-content: space-between; + margin: 15px 30px; + } + .tc-i-upload{ + width: 264px; + height: 264px; + background: #DDDDDD; + border-radius: 264px; + position: relative; + z-index: 1; + overflow: hidden; + } + .tc-i-upload image{ + width: 100%; + height: 100%; + } + .tc-i-u-box{ + @include flex-center; + flex-direction: column; + position: absolute; + z-index: -1; + width: 100%; + height: 100%; + color: #707070; + font-size: 26px; + } + .tc-i-u-box text{ + margin-bottom: 15px; + font-size: 50px; + } + .tc-i-num{ + @include flex-vertical-center; + font-size: 44px; + font-weight: 400; + line-height: 58px; + } + .tc-i-num>view{ + padding: 0 48px; + position: relative; + text-align: center; + } + .tc-i-num>view:first-child::after{ + content: " "; + width: 0px; + height: 64px; + border: 2px solid #DDDDDD; + position: absolute; + right: 0;top: 50%; + transform: translateY(-50%); + } + .tc-i-num text{ + font-size: 26px; + font-weight: 400; + line-height: 34px; + color: #707070; + } diff --git a/src/pages/colorRelated/takeColor/components/Texture/index.tsx b/src/pages/colorRelated/takeColor/components/Texture/index.tsx new file mode 100644 index 0000000..ce2e466 --- /dev/null +++ b/src/pages/colorRelated/takeColor/components/Texture/index.tsx @@ -0,0 +1,48 @@ +import { View, Text,Image } from '@tarojs/components' +import styles from './index.module.scss' +import classnames from 'classnames' +import { FC, useRef, useState } from "react" +import Upload from '../Upload' +import {screenshot} from '@/common/util' + + +type PropsType = { + onUploadConfirm?: Function +} + +const Texture:FC = (params) => { + const {onUploadConfirm} = params + + const handleUploadConfirm = () => { + onUploadConfirm && onUploadConfirm() + } + + const uploadEl = useRef() + + return ( + + + + {detail.texture_url && } + + + + 上传纹理 + + + + + {(data?.list?.length ?? 0) - calcNoSampling} + 已取样 + + + {calcNoSampling} + 未取样 + + + + + + ) +} +export default Texture diff --git a/src/pages/colorRelated/takeColor/components/Upload/index.module.scss b/src/pages/colorRelated/takeColor/components/Upload/index.module.scss new file mode 100644 index 0000000..67f90fc --- /dev/null +++ b/src/pages/colorRelated/takeColor/components/Upload/index.module.scss @@ -0,0 +1,68 @@ + + @mixin flex-center{ + display: flex; + justify-content: center; + align-items: center; + } + @mixin flex-vertical-center{ + display: flex; + align-items: center; + } + .upload-container .drawer{ + position: fixed; + top: 0; + z-index: 10; + } + .u-content{ + @include flex-center; + flex-direction: column; + width: 100%; + padding: 65px 0; + } + .u-image{ + width: 422px; + height: 422px; + background: #F0F0F0; + border-radius: 50%; + overflow: hidden; + position: relative; + z-index: 0; + } + .u-image view{ + width: 100%; + height: 100%; + @include flex-center; + font-size: 28px; + font-weight: 400; + color: #707070; + position: absolute; + top: 0;left: 0; + z-index: 1; + } + .u-image .update-statu{ + color: white; + background-color: rgba(0, 0, 0, 0.5); + } + .u-image image{ + width: 100%; + height: 100%; + } + .u-button{ + display: flex; + margin-top: 76px; + } + .u-button view{ + width: 264px; + height: 82px; + background: #F0F0F0; + border-radius: 82px; + @include flex-center; + font-size: 32px; + font-weight: 400; + color: #007AFF; + margin: 0 15px; + } + .u-button .confirm{ + background: #007AFF; + color: white; + } diff --git a/src/pages/colorRelated/takeColor/components/Upload/index.tsx b/src/pages/colorRelated/takeColor/components/Upload/index.tsx new file mode 100644 index 0000000..fd3207f --- /dev/null +++ b/src/pages/colorRelated/takeColor/components/Upload/index.tsx @@ -0,0 +1,62 @@ +import Popup from "@/components/popup" +import { FC, useState } from "react" +import { View, Text,Image } from '@tarojs/components' +import styles from './index.module.scss' +import classnames from 'classnames' +import Taro from "@tarojs/taro" + +type PropsType = { + onUploadConfirm?: Function +} + +const UploadColor: FC = (params) => { + const { onUploadConfirm } = params + const [showModal, setShowModal] = useState(false) + const [filePath, setFilePath] = useState('') + const [file, setFile] = useState({}) + + const handleUpload = async () => { + Taro.chooseMedia({ + count: 1, + mediaType: ['image'], + sourceType: ['album'], + success(ev) { + setFilePath(ev.tempFiles[0].tempFilePath) + setFile(ev.tempFiles[0]) + }, + }) + } + + const handleTriggerUploadModal = (bool: boolean) => { + setShowModal(bool) + } + + const handleClear = () => { + setFilePath('') + } + const handleUploadConfirm = () => { + onUploadConfirm && onUploadConfirm(file) + } + + + return ( + + handleTriggerUploadModal(false)}> + + + {filePath && } + + {filePath ? '点击修改' : '点击上传'} + + + 清除 + + 确定 + + + + + + ) +} +export default UploadColor diff --git a/src/pages/colorRelated/takeColor/index.config.ts b/src/pages/colorRelated/takeColor/index.config.ts new file mode 100644 index 0000000..6168a81 --- /dev/null +++ b/src/pages/colorRelated/takeColor/index.config.ts @@ -0,0 +1,4 @@ +export default { + navigationBarTitleText: '颜色取样', + enableShareAppMessage: false, +} diff --git a/src/pages/colorRelated/takeColor/index.module.scss b/src/pages/colorRelated/takeColor/index.module.scss new file mode 100644 index 0000000..276923e --- /dev/null +++ b/src/pages/colorRelated/takeColor/index.module.scss @@ -0,0 +1,148 @@ +@mixin flex-center { + display: flex; + justify-content: center; + align-items: center; +} +@mixin flex-vertical-center { + display: flex; + align-items: center; +} +page { + background: #f3f3f3; +} +.card { + background: #fff; + padding: 0 20px; + border-radius: 20px; + box-sizing: border-box; + margin: 26px 30px; +} +.list-box { + padding-bottom: 220px; +} +.lb-title { + font-size: 28px; + font-weight: 400; + line-height: 38px; + color: #707070; + border-top: 1px dashed #e4e4e4; + padding: 26px 46px; + box-sizing: border-box; + display: flex; + justify-content: space-between; + align-items: center; +} +.lb-t-serach { + @include flex-vertical-center; + height: 100px; +} +.lb-t-serach .icon-a-sousuo1 { + font-size: 38px; + color: #cccccc; +} +.lb-t-serach .lb-t-search-content { + display: flex; + justify-content: flex-end; +} +.lb-t-serach .lb-t-search-content > text { + padding: 10px 0; + color: #707070; + font-size: 24px; +} +.lb-t-search-content > view { + @include flex-vertical-center; + width: 280px; + height: 66px; + background-color: #e7e7e7; + border-radius: 30px; + margin-right: 10px; + font-size: 28px; + padding-left: 20px; + padding-right: 10px; + overflow: hidden; +} +.lb-title input { + width: 80%; + height: 66px; + background-color: #e7e7e7; + font-size: 26px; +} +.lb-t-search-content text { + color: #fff; + font-size: 30px; +} +.lb-t-sc-clear { + width: 66px; + height: 66px; + text-align: center; + line-height: 66px; +} +.lb-t-sc-clear .icon-a-cuowuwrong { + width: 43px; + height: 43px; + text-align: center; + line-height: 43px; + border-radius: 50%; + background: #c7c7c7; + display: inline-block; +} +.not-list { + font-size: 28px; + font-weight: 400; + line-height: 38px; + color: #707070; + margin-top: 180px; + text-align: center; +} + +.lab-view { + position: fixed; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: 100; + background-color: rgba(0, 0, 0, 1); +} +.lab-view view { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 100%; + height: 0; + padding-bottom: 100%; +} + +.fixedBottom-container { + position: fixed; + bottom: 0; + left: 0; + right: 0; + display: flex; + justify-content: space-between; + width: 750px; + height: 182px; + background: #f3f3f3; + box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.16); + padding: 35px 68px; + box-sizing: border-box; +} +.fixedBottom-container view { + width: 264px; + height: 82px; + background: #ffffff; + opacity: 1; + border-radius: 50px; + display: flex; + justify-content: center; + align-items: center; + font-size: 32px; + font-weight: 400; + line-height: 42px; + color: #007aff; +} +.fixedBottom-container .fb-confirm { + background-color: #007aff; + color: white; +} diff --git a/src/pages/colorRelated/takeColor/index.tsx b/src/pages/colorRelated/takeColor/index.tsx new file mode 100644 index 0000000..4940017 --- /dev/null +++ b/src/pages/colorRelated/takeColor/index.tsx @@ -0,0 +1,136 @@ +import { View, Input, Text } from '@tarojs/components' +import { FC, useMemo, useState } from 'react' +import LinkBlueTooth from '../components/bluetooth/LinkBlueTooth' +import SelectProduct from '@/components/selectProduct/index' +import styles from './index.module.scss' +import ColorCard from './components/ColorCard' +import IconFont from '@/components/iconfont' +import { ColorListApi, ColorDetailedApi, TextureSaveApi, ColorSamplingSaveApi } from '@/api/index' +import { formatHashTag } from '@/common/format' +// 颜色取样 +const TakeColor: FC = () => { + const { state, fetchData } = ColorListApi() + const { state: detail, fetchData: detailFetchData } = ColorDetailedApi() + const { state: textureSaveData, fetchData: textureSaveFetchData } = TextureSaveApi() + const { state: saveData, fetchData: saveFetchData, success: saveSuccess } = ColorSamplingSaveApi() + + const [searchValue, setSearchValue] = useState('') + + const selectInput = async (event) => { + // if (event) { + // selectedProduct.value = event + // await fetchData({ id: event.id }) + // data.value?.list.map((item, index) => { + // item.currnetRgb = item.rgb + // item.currentLab = item.lab + // item.sampling = !(item.currentLab?.l == 0 && item.currentLab?.a == 0 && item.currentLab?.b == 0) + // item.moveBorder = 0 + // item.key = index + // }) + // detailFetchData({ id: event.id }) + // } else { + // data.value.list = [] + // } + } + const clearSearchValue = () => { + setSearchValue('') + } + + const handleTransfSearch = (bool: boolean) => { + setShowScreen(bool) + } + const handlePrViewRgb = (event) => { + setLabPreview(event) + setShowLabPreview(true) + } + const handleTakeColor = () => {} + + const listData = useMemo(() => { + return state.data?.list?.filter((item) => { + if (searchValue) { + return formatHashTag(item.product_color_name, item.product_color_code)!.includes(searchValue) + } + return true + }) + }, [state]) + + const [showScreen, setShowScreen] = useState(false) + + const onSearchInput = (event) => { + const current = event.detail.value + setSearchValue(current) + } + // 重置 + const handleReset = () => {} + + // 提交 + const handleSubmit = () => {} + + const [labPreview, setLabPreview] = useState({ + currnetRgb: { + r: 0, + g: 0, + b: 0, + }, + }) + + const [showLabPreview, setShowLabPreview] = useState(false) + + return ( + <> + + + + + + + 颜色列表（{listData?.length ?? 0}） + + {showScreen ? ( + + + + + {searchValue.length > 0 && } + + + handleTransfSearch(false)}>取消 + + ) : ( + handleTransfSearch(true)}> + + + )} + + + {listData ? ( + listData.map((item, index) => { + return + }) + ) : ( + -请取色- + )} + + + 重置 + + 提交 + + + {showLabPreview && ( + setShowLabPreview(false)} className={styles['lab-view']}> + + + )} + + ) +} + +export default TakeColor diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index efb0c12..2ea164f 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -68,7 +68,7 @@ const Login: FC = () => { setToken(res.data.token) setUserInfo({ ...res.data }) - Taro.redirectTo({ + Taro.switchTab({ url: '/pages/index/index', }) } else { @@ -76,6 +76,7 @@ const Login: FC = () => { } } + return ( @@ -92,12 +93,7 @@ const Login: FC = () => { - + {!eyesStatus ? ( diff --git a/src/pages/searchPage/compoents/empty/index.module.scss b/src/pages/searchPage/components/empty/index.module.scss similarity index 100% rename from src/pages/searchPage/compoents/empty/index.module.scss rename to src/pages/searchPage/components/empty/index.module.scss diff --git a/src/pages/searchPage/compoents/empty/index.tsx b/src/pages/searchPage/components/empty/index.tsx similarity index 100% rename from src/pages/searchPage/compoents/empty/index.tsx rename to src/pages/searchPage/components/empty/index.tsx diff --git a/src/pages/searchPage/compoents/goods/index.module.scss b/src/pages/searchPage/components/goods/index.module.scss similarity index 100% rename from src/pages/searchPage/compoents/goods/index.module.scss rename to src/pages/searchPage/components/goods/index.module.scss diff --git a/src/pages/searchPage/compoents/goods/index.tsx b/src/pages/searchPage/components/goods/index.tsx similarity index 100% rename from src/pages/searchPage/compoents/goods/index.tsx rename to src/pages/searchPage/components/goods/index.tsx diff --git a/src/pages/searchPage/index.tsx b/src/pages/searchPage/index.tsx index 0e5b5b9..ebde3c4 100644 --- a/src/pages/searchPage/index.tsx +++ b/src/pages/searchPage/index.tsx @@ -3,9 +3,9 @@ import React, { useCallback, memo, useEffect, useMemo, useRef, useState } from ' import Search from '@/components/search' import styles from "./index.module.scss" import classnames from "classnames"; -import Empty from './compoents/empty' +import Empty from './components/empty' import Taro from '@tarojs/taro'; -import Goods from './compoents/goods' +import Goods from './components/goods' import { mpproductlist } from "@/api/search" export default memo(() => { @@ -95,4 +95,4 @@ export default memo(() => { ) -}) \ No newline at end of file +}) diff --git a/src/pages/user/index.tsx b/src/pages/user/index.tsx index 1564ce4..82db81f 100644 --- a/src/pages/user/index.tsx +++ b/src/pages/user/index.tsx @@ -13,11 +13,95 @@ import { goLink } from '@/common/common' type IconfontName = Parameters['0']['name'] type IconCardType = { - iconName: IconfontName, - name: string, + iconName: IconfontName + name: string path: string } +const feature: IconCardType[] = [ + { + iconName: 'icon-lingquseka', + name: '领取色卡', + path: '', + }, + { + iconName: 'icon-pandiansaoma', + name: '盘点扫码', + path: '', + }, + { + iconName: 'icon-fahuoliebiao', + name: '发货列表', + path: '', + }, + { + iconName: 'icon-yaoqingma', + name: '邀请码', + path: '', + }, + { + iconName: 'icon-tihuoliebiao', + name: '提货列表', + path: '', + }, + { + iconName: 'icon-shouhouzhongxin', + name: '退货退款', + path: '', + }, + { + iconName: 'icon-shoukuanliebiao', + name: '收款列表', + path: '', + }, + { + iconName: 'icon-kehuxinxi', + name: '客户列表', + path: '', + }, +] + +const fabric: IconCardType[] = [ + { + iconName: 'icon-yansequyang', + name: '颜色取样', + path: '/pages/colorRelated/takeColor/index', + }, + { + iconName: 'icon-qusechazhao', + name: '取色查找', + path: '/pages/colorRelated/findColor/index', + }, + { + iconName: 'icon-yangpinduibi', + name: '样品对比', + path: '/pages/colorRelated/sampleComparison/index', + }, +] + +const statisticAnalysis: IconCardType[] = [ + { + iconName: 'icon-xiaoshou', + name: '销售', + path: '', + }, + { + iconName: 'icon-duizhang', + name: '对账', + path: '', + }, + { + iconName: 'icon-yuncangkucun', + name: '云仓库存', + path: '', + }, + { + iconName: 'icon-qianzhicangkucun', + name: '前置仓库存', + path: '', + }, +] + // 用户信息 const UserInfo: FC = () => { const { removeToken, removeUserInfo, userInfo } = useUserInfo() @@ -27,92 +111,6 @@ const UserInfo: FC = () => { // username: '', // userno: '', // }) - - - const feature: IconCardType[] = [ - { - iconName: 'icon-lingquseka', - name: '领取色卡', - path: '', - }, - { - iconName: 'icon-pandiansaoma', - name: '盘点扫码', - path: '', - }, - { - iconName: 'icon-fahuoliebiao', - name: '发货列表', - path: '', - }, - { - iconName: 'icon-yaoqingma', - name: '邀请码', - path: '', - }, - { - iconName: 'icon-tihuoliebiao', - name: '提货列表', - path: '', - }, - { - iconName: 'icon-shouhouzhongxin', - name: '退货退款', - path: '', - }, - { - iconName: 'icon-shoukuanliebiao', - name: '收款列表', - path: '', - }, - { - iconName: 'icon-kehuxinxi', - name: '客户列表', - path: '', - }, - ] - - const fabric: IconCardType[] = [ - { - iconName: 'icon-yansequyang', - name: '颜色取样', - path: '', - }, - { - iconName: 'icon-qusechazhao', - name: '取色查找', - path: '', - }, - { - iconName: 'icon-yangpinduibi', - name: '样品对比', - path: '', - }, - ] - - const statisticAnalysis: IconCardType[] = [ - { - iconName: 'icon-xiaoshou', - name: '销售', - path: '', - }, - { - iconName: 'icon-duizhang', - name: '对账', - path: '', - }, - { - iconName: 'icon-yuncangkucun', - name: '云仓库存', - path: '', - }, - { - iconName: 'icon-qianzhicangkucun', - name: '前置仓库存', - path: '', - }, - ] - // 退出登录 const handleLogout = () => { @@ -121,6 +119,11 @@ const UserInfo: FC = () => { goLink('/pages/login/index', {}, 'reLaunch') } + const handleClickIconCard = (item: IconCardType) => { + console.log('item==>', item) + goLink(item.path, {}, 'navigateTo') + } + return ( <> @@ -140,7 +143,7 @@ const UserInfo: FC = () => { - IT部门 + {userInfo.userInfo.department_name} IT-开发总监 @@ -158,7 +161,7 @@ const UserInfo: FC = () => { 布料取色 {fabric.map((item) => { - return + return handleClickIconCard(item)}> })} diff --git a/src/styles/common.scss b/src/styles/common.scss index 9f2f08b..2e6c669 100644 --- a/src/styles/common.scss +++ b/src/styles/common.scss @@ -42,3 +42,18 @@ $customTabBarHeight: 100px; height: 100%; } +.color-blue{ + color: #3287EC; +} +.color-yellow{ + color: #FF9100; +} +.color-green{ + color: #00B837; +} +.color-grey{ + color: #707070; +} +.color-white{ + color: white; +} diff --git a/src/styles/iconfont.scss b/src/styles/iconfont.scss index 0525f3a..c49b106 100644 --- a/src/styles/iconfont.scss +++ b/src/styles/iconfont.scss @@ -1,9 +1,6 @@ -/* CDN 服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */ @font-face { - font-family: 'iconfont'; - /* Project id 3619513 */ - src: url('iconfont.ttf?t=1663065236955') format('truetype'); - + font-family: "iconfont"; /* Project id 3619513 */ + src: url('/src/styles/iconfont.ttf?t=1663134774880') format('truetype'); } .iconfont { @@ -18,6 +15,22 @@ content: "\e63e"; } +.icon-jizhumima:before { + content: "\e63c"; +} + +.icon-a-jizhumima:before { + content: "\e63d"; +} + +.icon-weixindenglu:before { + content: "\e63b"; +} + +.icon-kehuxinxi:before { + content: "\e63a"; +} + .icon-yewuyuanqizi:before { content: "\e639"; } @@ -232,4 +245,5 @@ .icon-gouwu:before { content: "\e607"; -} \ No newline at end of file +} + diff --git a/src/use/useHttp.ts b/src/use/useHttp.ts index 5ff8104..3a6cf56 100644 --- a/src/use/useHttp.ts +++ b/src/use/useHttp.ts @@ -122,7 +122,6 @@ export const useRequest = ( } const stateRef = useRef({ ...params }) - console.log('stateRef==>', stateRef) const [state, setState] = useState({ ...stateRef.current }) const { removeToken, removeSessionKey, removeUserInfo } = useUserInfo() const { login } = useLoginRequest() @@ -181,7 +180,14 @@ export const useRequest = ( removeToken() // removeSessionKey() removeUserInfo() - login() + // 跳转回登录页面 + login().catch((err)=>{ + if (err){ + Taro.reLaunch({ + url: '/pages/login/index', + }) + } + }) } else { Taro.showToast({ title: `错误：${showStatus(statusCode)}`, @@ -198,8 +204,6 @@ export const useRequest = ( stateRef.current.error = false stateRef.current.loading = false setState(() => ({...stateRef.current})) - console.log('request result stateRef', stateRef.current) - console.log('request result state', state) return stateRef.current } return { diff --git a/src/use/useLoginRequest.ts b/src/use/useLoginRequest.ts index 9bf6122..f6da249 100644 --- a/src/use/useLoginRequest.ts +++ b/src/use/useLoginRequest.ts @@ -1,113 +1,108 @@ -import {BASE_URL, WX_APPID } from "@/common/constant" -import Taro, { useRouter } from "@tarojs/taro" -import { useRef, useState } from "react" -import qs from 'qs' -import useUserInfo from "./useUserInfo" -import useLogin from "./useLogin" +import { BASE_URL, WX_APPID } from '@/common/constant' +import Taro, { useRouter } from '@tarojs/taro' +import { useRef, useState } from 'react' +import qs from 'qs' +import useUserInfo from './useUserInfo' +import useLogin from './useLogin' //开这个hook 主要是为了让useHttp 能够调用 -type Param = {success: true|false, data: any, msg: string, code: null|number, loading: false|true} +type Param = { success: boolean; data: any; msg: string; code: null | number; loading: boolean } let loginStatus = false //登录状态，true登录中 export default () => { - - let initData = { - success: false, - data: null, - msg: '', - code: null, - loading: false - } - let loginData = useRef(initData) - const {setToken, setSessionKey} = useUserInfo() - const router = useRouter() - //微信登录请求v2 - const fetchDataLogin = async (login_code) => { - const q = { - url: BASE_URL + '/v1/mall/login', - header: { - "Platform": 3, - "Appid": WX_APPID, - }, - method: 'post', - data:{js_code: login_code} - } - try{ - const result = await Taro.request(q as any) - const {code, data, msg} = result.data - if(result.statusCode === 200) { - loginData.current.success = (code === 0 ? true : false) - loginData.current.code = code - loginData.current.msg = msg - loginData.current.data = data - } else { - Taro.showToast({ - title: `错误：登录失败`, - icon: 'none' - }) - console.log('登录错误：', result.errMsg) - - } - }catch(e) { - Taro.showToast({ - title: `错误：登录失败`, - icon: 'none' + let initData = { + success: false, + data: null, + msg: '', + code: null, + loading: false, + } + let loginData = useRef(initData) + const { setToken, setSessionKey } = useUserInfo() + const router = useRouter() + //微信登录请求v2 + const fetchDataLogin = async (login_code) => { + const q = { + url: BASE_URL + '/v1/mall/login', + header: { + Platform: 3, + Appid: WX_APPID, + }, + method: 'post', + data: { js_code: login_code }, + } + try { + const result = await Taro.request(q as any) + const { code, data, msg } = result.data + if (result.statusCode === 200) { + loginData.current.success = code === 0 ? true : false + loginData.current.code = code + loginData.current.msg = msg + loginData.current.data = data + } else { + Taro.showToast({ + title: `错误：登录失败`, + icon: 'none', + }) + console.log('登录错误：', result.errMsg) + } + } catch (e) { + Taro.showToast({ + title: `错误：登录失败`, + icon: 'none', + }) + console.log('登录错误：', e.errMsg) + } + return loginData.current + } + + //微信登录 + const login = () => { + return new Promise((resolve, reject) => { + if (loginStatus) return reject(false) + loginStatus = true + Taro.login({ + success: async (res) => { + if (res.code) { + const { data, success, msg } = await fetchDataLogin(res.code) + if (success) { + setToken(data.token) + setSessionKey(data.session_key) + resolve(data) + let params = router.params + delete params.$taroTimestamp + if (router.path === '/pages/index/index' || router.path === '/pages/user/index') { + Taro.reLaunch({ + url: router.path + '?' + qs.stringify(params), }) - console.log('登录错误：', e.errMsg) - } - return loginData.current - } - - //微信登录 - const login = () => { - if(loginStatus) return false - loginStatus = true - return new Promise((reslove, reject) => { - Taro.login({ - success: async (res) => { - if (res.code) { - const {data, success, msg} = await fetchDataLogin(res.code) - if(success) { - setToken(data.token) - setSessionKey(data.session_key) - reslove(data) - let params = router.params - delete params.$taroTimestamp - if(router.path === '/pages/index/index' || router.path === '/pages/user/index') { - Taro.reLaunch({ - url: router.path +'?' + qs.stringify(params) - }) - } else { - Taro.redirectTo({ - url: router.path +'?' + qs.stringify(params) - }) - } - } else { - Taro.showToast({ - title:'登录失败', - icon:"none" - }) - reject(msg) - } - } else { - console.log('登录失败！' + res.errMsg) - reject(res.errMsg) - } - loginStatus = false - }, - fail: function(e) { - console.log('登录失败！::',e) - reject(e) - loginStatus = false - } + } else { + Taro.redirectTo({ + url: router.path + '?' + qs.stringify(params), }) - }) - - } - - return { - login - } + } + } else { + Taro.showToast({ + title: '登录失败', + icon: 'none', + }) + reject(msg) + } + } else { + console.log('登录失败！' + res.errMsg) + reject(res.errMsg) + } + loginStatus = false + }, + fail: function (e) { + console.log('登录失败！::', e) + reject(e) + loginStatus = false + }, + }) + }) + } + return { + login, + } } -