feat:小程序角色权限控制

This commit is contained in:
Haiyi 2022-10-14 15:56:49 +08:00
parent 3f01990a35
commit 3111f211ae
11 changed files with 310 additions and 123 deletions

View File

@ -27,4 +27,11 @@ export const mpcashManagementOrderpost = () => {
url: `/v1/mp/cashManagementOrder`, url: `/v1/mp/cashManagementOrder`,
method: "post", method: "post",
}) })
} }
//扫描获取应收单的客户信息
export const mpshouldCollectOrderpurchaser = () => {
return useRequest({
url: `/v2/mp/shouldCollectOrder/purchaser`,
method: "get",
})
}

View File

@ -142,3 +142,14 @@ export const formatKbPrice = (number: string) => {
}, []) }, [])
return ret.reverse().join('') return ret.reverse().join('')
} }
/**
*
* @param {key} key
* @returns
*/
export const checkKey = (key = "") => {
let getUser = JSON.parse(Taro.getStorageSync("userInfo"));
return getUser.mp_role_access_list?.includes(key);
};

View File

@ -6,7 +6,7 @@ import { formatImgUrl } from '@/common/format'
import classnames from 'classnames' import classnames from 'classnames'
import styles from './index.module.scss' import styles from './index.module.scss'
import Popup from '@/components/popup' import Popup from '@/components/popup'
import IconFont from '@/components/iconfont/iconfont'
//图片列表 //图片列表
type ImageParam = { type ImageParam = {
onChange?: (val: string[]) => void onChange?: (val: string[]) => void
@ -89,12 +89,15 @@ const PictureItem = memo<ImageParam>(({ onChange, defaultList, onlyRead = false
{imageList?.map((item, index) => ( {imageList?.map((item, index) => (
<View className={styles.ImgItem}> <View className={styles.ImgItem}>
<Image mode='aspectFill' src={formatImgUrl(item)} onClick={showImage}></Image> <Image mode='aspectFill' src={formatImgUrl(item)} onClick={showImage}></Image>
{!onlyRead && <View onClick={() => delImage(index)} className={classnames(styles.miconfont_close, 'iconfont icon-guanbi')}></View>} {!onlyRead && <View onClick={() => delImage(index)}>
<IconFont name={'icon-guanbi'} size={30} customClassName={styles['miconfont_close']} color={'#ffffff'}></IconFont>
</View>}
</View> </View>
))} ))}
{!onlyRead && ( {!onlyRead && (
<View className={styles.uploadImg} onClick={uploadImage}> <View className={styles.uploadImg} onClick={uploadImage}>
<Text className={classnames(styles.miconfont, 'iconfont icon-xinzeng')}></Text> <IconFont name={'icon-xinzeng'} size={100} color={'#d8d8d8'}></IconFont>
{/* <Text className={classnames(styles.miconfont, 'iconfont icon-xinzeng')}></Text> */}
{/* <Text className={styles.uploadText}>上传照片</Text> */} {/* <Text className={styles.uploadText}>上传照片</Text> */}
</View> </View>
)} )}

View File

@ -56,10 +56,11 @@
} }
.rightFlex { .rightFlex {
width: 50%; width: 100%;
overflow: hidden;
white-space: nowrap; // overflow: hidden;
text-overflow: ellipsis; // white-space: nowrap;
// text-overflow: ellipsis;
.placeholderStyle { .placeholderStyle {
color: #f7f7f7; color: #f7f7f7;
font-size: 28px; font-size: 28px;
@ -70,7 +71,7 @@
font-size: 28px; font-size: 28px;
font-weight: 400; font-weight: 400;
color: #000000; color: #000000;
width: 100%; // width: 100%;
} }
} }

View File

@ -27,75 +27,77 @@ interface Params {
getScan?: (any) => void, // 扫描 getScan?: (any) => void, // 扫描
navTo?: () => void, //跳转选择 navTo?: () => void, //跳转选择
showSizeFont?: boolean, //展示金额的大写 showSizeFont?: boolean, //展示金额的大写
bigMoney?: any //展示的大写金额 bigMoney?: any, //展示的大写金额,
isOpen?: boolean //是否展开状态
} }
export default memo((pros: Params) => { export default memo((pros: Params) => {
return ( return (
<View className={styles.itemBox} <>
style={{ justifyContent: `${pros.styleNone ? 'space-between' : ''}`, alignItems: `${pros.styleNone ? 'center' : ''}` }}> {
<View className={styles.itemLeft} pros.isOpen && <View className={styles.itemBox}
style={{ justifyContent: `${pros.styleNone ? 'space-between' : ''}`, alignItems: `${pros.styleNone ? 'center' : ''}` }}>
<View className={styles.itemLeft}
> >
<View className={styles.finkFlex}> <View className={styles.finkFlex}>
<View className={styles.itemTitle}>{pros.title}</View> <View className={styles.itemTitle}>{pros.title}</View>
{ {
pros.require && <Text className={styles.xing}>*</Text> pros.require && <Text className={styles.xing}>*</Text>
} }
</View> </View>
{
pros.showSizeFont && <View className={styles.finkFont}></View>
}
</View>
{
pros.showPic &&
<View className={styles.bigPic}>
<UploadImage onChange={pros.getImageList} defaultList={pros.PicList} onlyRead={pros.onlyRead} />
</View>
}
{
!pros.showPic && <View className={styles.itemRight} onClick={() => pros.navTo?.()}
style={{
justifyContent: `${!pros.showSizeFont ? 'space-between' : ''}`, alignItems: `${!pros.showSizeFont ? 'center' : ''}`,
display: `${!pros.showSizeFont ? 'flex' : ''}`
}}
>
<View className={styles.rightFlex}>
{ {
pros.isInput && <Input pros.showSizeFont && <View className={styles.finkFont}></View>
disabled={pros.disabled}
placeholder={pros.placeholderFont}
value={pros.inputValue}
className={styles.inputStyle}
type={pros.inputType}
placeholderStyle={styles.placeholderStyle}
onBlur={(e) => pros.getInput?.(e.detail.value)}
></Input>
} }
</View> </View>
<View className={styles.iconFlex}></View>
{ {
pros.showMore && <IconFont name={'icon-chakanquanbukehu'} size={50} color={'#000000'}></IconFont> pros.showPic &&
<View className={styles.bigPic}>
<UploadImage onChange={pros.getImageList} defaultList={pros.PicList} onlyRead={pros.onlyRead} />
</View>
} }
{ {
pros.showScan && <View className={styles.shu}></View> !pros.showPic && <View className={styles.itemRight} onClick={() => pros.navTo?.()}
style={{
justifyContent: `${!pros.showSizeFont ? 'space-between' : ''}`, alignItems: `${!pros.showSizeFont ? 'center' : ''}`,
display: `${!pros.showSizeFont ? 'flex' : ''}`
}}
>
<View className={styles.rightFlex}>
{
pros.isInput && <Input
disabled={pros.disabled}
placeholder={pros.placeholderFont}
value={pros.inputValue}
className={styles.inputStyle}
type={pros.inputType}
placeholderStyle={styles.placeholderStyle}
onBlur={(e) => pros.getInput?.(e.detail.value)}
></Input>
}
</View>
} {/* <View className={styles.iconFlex}></View> */}
{ {
pros.showScan && <View onClick={(e) => pros.getScan?.(e)}><IconFont name={'icon-saomiao'} size={50} color={'#337FFF'}></IconFont></View> pros.showMore && <IconFont name={'icon-chakanquanbukehu'} size={50} color={'#000000'}></IconFont>
}
{
pros.showScan && <View className={styles.shu}></View>
}
{
pros.showScan && <View onClick={(e) => pros.getScan?.(e)}><IconFont name={'icon-saomiao'} size={50} color={'#337FFF'}></IconFont></View>
}
{
pros.showSizeFont && <View className={styles.assginFont}>{pros.bigMoney}</View>
}
</View>
} }
{
pros.showSizeFont && <View className={styles.assginFont}>{pros.bigMoney}</View>
}
</View> </View>
} }
</>
</View>
) )
}) })

View File

@ -6,6 +6,14 @@
transition: 0.3s; transition: 0.3s;
} }
.addBox:hover {
margin: 24px;
padding: 0px 32px 40px 32px;
background: #FFFFFF;
border-radius: 16px 16px 0px 0px;
transition: 0.3s;
}
.textAreaBox { .textAreaBox {
margin-top: 40px; margin-top: 40px;
display: flex; display: flex;
@ -93,4 +101,19 @@
.safeBox { .safeBox {
height: 160px; height: 160px;
width: 100%; width: 100%;
}
.openBox {
height: 82px;
display: flex;
align-items: center;
justify-content: center;
line-height: 82px;
.openFont {
font-size: 28px;
font-weight: 400;
color: #337FFF;
margin-right: 10px;
}
} }

View File

@ -10,12 +10,14 @@ import Taro, { faceVerifyForPay, useDidShow } from '@tarojs/taro'
import Form from './components/form' import Form from './components/form'
import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/format' import { formatDateTime, formatHashTag, formatImgUrl, formatPriceDiv, formatWeightDiv } from '@/common/format'
import { import {
mpcashManagementOrderpost mpcashManagementOrderpost, mpshouldCollectOrderpurchaser
} from "@/api/newCollection" } from "@/api/newCollection"
import TimePicker from "@/components/timePicker" import TimePicker from "@/components/timePicker"
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { alert } from "@/common/common" import { alert } from "@/common/common"
import smallToBig from '@/common/money' import smallToBig from '@/common/money'
import IconFont from '@/components/iconfont/iconfont'
import { mpcashManagementOrderaccount } from '@/api/newCollection'
export default () => { export default () => {
//获取选择的客户 //获取选择的客户
@ -26,10 +28,10 @@ export default () => {
setQuery((e) => ({ setQuery((e) => ({
...e, ...e,
purchaser_id: currPage.data?.clientId ? currPage.data?.clientId : '', purchaser_id: currPage.data?.clientId ? currPage.data?.clientId : Query.purchaser_id,
clientName: currPage.data?.clientName ? currPage.data?.clientName : '', clientName: currPage.data?.clientName ? currPage.data?.clientName : Query.clientName,
bankId: currPage.data?.bankId ? currPage.data?.bankId : '', bankId: currPage.data?.bankId ? currPage.data?.bankId : Query.bankId,
bankName: currPage.data?.bankName ? currPage.data?.bankName : '', bankName: currPage.data?.bankName ? currPage.data?.bankName : Query.bankName,
})) }))
}) })
@ -39,17 +41,33 @@ export default () => {
const picUrl = useRef([]) const picUrl = useRef([])
const getImageList = useCallback((list) => { const getImageList = useCallback((list) => {
picUrl.current = list picUrl.current = list
console.log(picUrl.current, 'picUrl.current') setQuery((val) => ({ ...val, picList: list }))
}, []) }, [])
useEffect(() => {
getCuss()
}, [])
//获取首个银行账号
const { fetchData: clitentFetch } = mpcashManagementOrderaccount()
const getCuss = async () => {
let res = await clitentFetch({ page: 1, size: 10 })
if (res.data) {
setQuery((val) => ({ ...val, bankId: res.data.list[0].receiving_account_id, bankName: res.data.list[0].company_account }))
}
}
const { fetchData: scanFetch } = mpshouldCollectOrderpurchaser()
//扫描 //扫描
const handScan = (e) => { const handScan = (e) => {
e.stopPropagation() e.stopPropagation()
Taro.scanCode({ Taro.scanCode({
success(res) { success: async function (res) {
// setQuery({...Query}) const restult = await scanFetch({ order_no: res.result })
// setsearchObj((e) => ({ ...e, orderNo: res.result })) setQuery((val) => ({ ...val, purchaser_id: restult.data.purchaser_id, clientName: restult.data.purchaser_name }))
}, },
fail(res) { fail(res) {
console.log(res); console.log(res);
@ -78,13 +96,13 @@ export default () => {
const isDisabled = useMemo(() => { const isDisabled = useMemo(() => {
if (Query.clientName == '' || if (Query.clientName == '' ||
Query.money == '' || Query.money == '' ||
picUrl.current.length == 0 Query.picList?.length == 0
) { ) {
return true return true
} else { } else {
return false return false
} }
}, [Query, picUrl]) }, [Query])
//收款金额回调 //收款金额回调
const getInput = (e) => { const getInput = (e) => {
@ -95,11 +113,11 @@ export default () => {
setQuery(Query) setQuery(Query)
}, [Query]) }, [Query])
useEffect(() => { // useEffect(() => {
if (currPage.data?.clientId && (currPage.data?.clientId != Query.purchaser_id)) { // if (currPage.data?.clientId && (currPage.data?.clientId != Query.purchaser_id)) {
setQuery({ ...Query, bankId: '', bankName: '' }) // setQuery({ ...Query, bankId: '', bankName: '' })
} // }
}, [Query]) // }, [Query])
//备注信息 //备注信息
@ -156,10 +174,28 @@ export default () => {
} }
}) })
} }
const [IsOpen, setIsOpen] = useState(false)
const handOpen = () => {
if (IsOpen) {
setIsOpen(false)
} else {
setIsOpen(true)
}
}
const openFont = useMemo(() => {
if (IsOpen) {
return '收起'
} else {
return '展开'
}
}, [IsOpen])
return ( return (
<> <>
<View className={styles.addBox}> <View className={styles.addBox}>
<Form <Form
isOpen={true}
title={'客户名称'} title={'客户名称'}
require={true} require={true}
isInput={true} isInput={true}
@ -175,6 +211,7 @@ export default () => {
showSizeFont={false} showSizeFont={false}
></Form> ></Form>
<Form <Form
isOpen={true}
title={'收款金额'} title={'收款金额'}
require={true} require={true}
isInput={true} isInput={true}
@ -191,6 +228,7 @@ export default () => {
bigMoney={smallToBig(typeof (Query.money) == 'undefined' ? 0 : Query.money)} bigMoney={smallToBig(typeof (Query.money) == 'undefined' ? 0 : Query.money)}
></Form> ></Form>
<Form <Form
isOpen={true}
styleNone={false} styleNone={false}
title={'收款凭证'} title={'收款凭证'}
require={true} require={true}
@ -202,6 +240,7 @@ export default () => {
showSizeFont={false} showSizeFont={false}
></Form> ></Form>
<Form <Form
isOpen={IsOpen}
title={'收款账户'} title={'收款账户'}
require={false} require={false}
isInput={true} isInput={true}
@ -215,22 +254,31 @@ export default () => {
navTo={() => navTo(2)} navTo={() => navTo(2)}
showSizeFont={false} showSizeFont={false}
></Form> ></Form>
<View className={styles.textAreaBox}> {
<View className={styles.textAreaLeft}></View> IsOpen && <View className={styles.textAreaBox}>
<View className={styles.textAreaRight}> <View className={styles.textAreaLeft}></View>
<Textarea <View className={styles.textAreaRight}>
style={{ width: '70%' }} <Textarea
onInput={(e) => getDesc(e.detail.value)} style={{ width: '70%' }}
value={TextareaValue} onInput={(e) => getDesc(e.detail.value)}
placeholderStyle='font-size: 28rpx;font-weight: 400;' value={TextareaValue}
maxlength={64} placeholderStyle='font-size: 28rpx;font-weight: 400;'
placeholder={'请填写备注信息'} maxlength={64}
></Textarea> placeholder={'请填写备注信息'}
<View className={styles.numsTotal}>{`${typeof (Query.nums) == 'undefined' ? 0 : Query.nums}/64`}</View> ></Textarea>
<View className={styles.numsTotal}>{`${typeof (Query.nums) == 'undefined' ? 0 : Query.nums}/64`}</View>
</View>
</View> </View>
}
<View className={styles.openBox} onClick={() => handOpen()}>
<View className={styles.openFont}>{openFont}</View>
{
!IsOpen && <IconFont name={'icon-zhankai'} size={30} color={'#337FFF'} ></IconFont>
}
{
IsOpen && <IconFont name={'icon-shouqi'} size={30} color={'#337FFF'} ></IconFont>
}
</View> </View>
</View > </View >
<View className={styles.safeBox}> </View> <View className={styles.safeBox}> </View>
<View className={styles.bottomBox}> <View className={styles.bottomBox}>

View File

@ -56,6 +56,7 @@
width: 70%; width: 70%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.msgName { .msgName {
font-size: 28px; font-size: 28px;
font-weight: 400; font-weight: 400;
@ -68,4 +69,37 @@
color: #000000; color: #000000;
} }
} }
}
.topBox {
background: #FFFFFF;
margin: 24px;
justify-content: center;
display: flex;
align-items: center;
flex-direction: column;
overflow: hidden;
.topFont {
margin-top: 32px;
font-size: 28px;
font-weight: 500;
color: #000000;
margin-bottom: 16px;
}
.topMon {
font-size: 64px;
font-weight: 500;
color: #333333;
letter-spacing: 4px;
margin-bottom: 8px;
}
.topBigMon {
font-size: 24px;
font-weight: 400;
color: #000000;
letter-spacing: 11px;
margin-bottom: 38px;
}
} }

View File

@ -57,7 +57,19 @@ export default () => {
return ( return (
<> <>
<View className={styles.topBox}>
<View className={styles.topFont}></View>
<View className={styles.topMon}>{money}</View>
<View className={styles.topBigMon}>{smallToBig(typeof (money) == 'undefined' ? 0 : money)}</View>
</View>
<View className={styles.addBox}> <View className={styles.addBox}>
<View className={styles.msgBox}>
<View className={styles.msgLeft}></View>
<View className={styles.msgFlex}>
<View className={styles.msgName}>{Query.order_no}</View>
<View className={styles.msgTime} style={{ color: '#E42945' }}>{Query.auditor_status_name}</View>
</View>
</View>
<Form <Form
title={'客户名称'} title={'客户名称'}
require={false} require={false}
@ -70,7 +82,7 @@ export default () => {
showPic={false} showPic={false}
showSizeFont={false} showSizeFont={false}
></Form> ></Form>
<Form {/* <Form
title={'收款金额'} title={'收款金额'}
require={false} require={false}
isInput={true} isInput={true}
@ -83,7 +95,7 @@ export default () => {
showPic={false} showPic={false}
showSizeFont={true} showSizeFont={true}
bigMoney={smallToBig(typeof (money) == 'undefined' ? 0 : money)} bigMoney={smallToBig(typeof (money) == 'undefined' ? 0 : money)}
></Form> ></Form> */}
<Form <Form
styleNone={false} styleNone={false}
title={'收款凭证'} title={'收款凭证'}

View File

@ -240,7 +240,7 @@ export default () => {
</View> </View>
<View className={styles.pageTop}> <View className={styles.pageTop}>
<View className={styles.pageTopLeft}>14</View> <View className={styles.pageTopLeft}>14</View>
<View className={styles.pageTopRight}>{formatPriceDiv(orderData.summary.receipt_amount)}</View> <View className={styles.pageTopRight}>{formatPriceDiv(orderData?.summary?.receipt_amount)}</View>
</View> </View>
<View className={styles.order_list}> <View className={styles.order_list}>
<InfiniteScroll <InfiniteScroll

View File

@ -1,5 +1,5 @@
import { View, Image, Text } from '@tarojs/components' import { View, Image, Text } from '@tarojs/components'
import { FC, useState } from 'react' import { FC, useEffect, useState } from 'react'
import styles from './index.module.scss' import styles from './index.module.scss'
import defaultAvatar from '../../styles/image/defaultAvatar.png' import defaultAvatar from '../../styles/image/defaultAvatar.png'
import NormalButton from '@/components/normalButton' import NormalButton from '@/components/normalButton'
@ -10,97 +10,119 @@ import IconCard from '@/components/iconCard'
import { IconNames } from '@/components/iconfont/iconfont' import { IconNames } from '@/components/iconfont/iconfont'
import useUserInfo from '@/use/useUserInfo' import useUserInfo from '@/use/useUserInfo'
import { goLink } from '@/common/common' import { goLink } from '@/common/common'
import { checkKey } from "@/common/common"
import { useDidShow } from '@tarojs/taro'
type IconCardType = { type IconCardType = {
jurisdiction?: string //权限key值
iconName: IconNames iconName: IconNames
name: string name: string
path: string path: string
} }
const feature: IconCardType[] = [
let feature: IconCardType[] = [
{ {
iconName: 'icon-lingquseka', iconName: 'icon-lingquseka',
name: '领取色卡', name: '领取色卡',
path: '', path: '',
jurisdiction: 'receive_color_card_page'
}, },
{ {
iconName: 'icon-pandiansaoma', iconName: 'icon-pandiansaoma',
name: '盘点扫码', name: '盘点扫码',
path: '', path: '',
jurisdiction: 'counting_scanning_code_page'
}, },
{ {
iconName: 'icon-fahuoliebiao', iconName: 'icon-fahuoliebiao',
name: '发货列表', name: '发货列表',
path: '/pages/delivery/index', path: '/pages/delivery/index',
jurisdiction: 'shipping_list_page'
}, },
{ {
iconName: 'icon-yaoqingma', iconName: 'icon-yaoqingma',
name: '邀请码', name: '邀请码',
path: '', path: '',
jurisdiction: 'invitation_code_page'
}, },
{ {
iconName: 'icon-tihuoliebiao', iconName: 'icon-tihuoliebiao',
name: '提货列表', name: '提货列表',
path: '/pages/takeDelivery/index', path: '/pages/takeDelivery/index',
jurisdiction: 'picking_list_module_page'
}, },
{ {
iconName: 'icon-shouhouzhongxin', iconName: 'icon-shouhouzhongxin',
name: '退货退款', name: '退货退款',
path: '/pages/refundPage/index', path: '/pages/refundPage/index',
jurisdiction: 'return_and_refund_page'
}, },
{ {
iconName: 'icon-shoukuanliebiao', iconName: 'icon-shoukuanliebiao',
name: '收款列表', name: '收款列表',
path: '/pages/newCollection/index', path: '/pages/newCollection/index',
jurisdiction: 'collection_list_page'
}, },
{ {
iconName: 'icon-kehuxinxi', iconName: 'icon-kehuxinxi',
name: '客户列表', name: '客户列表',
path: '', path: '',
jurisdiction: 'customer_list_page'
}, },
] ]
const fabric: IconCardType[] = [ let fabric: IconCardType[] = [
{ {
iconName: 'icon-yansequyang', iconName: 'icon-yansequyang',
name: '颜色取样', name: '颜色取样',
path: '/pages/colorRelated/takeColor/index', path: '/pages/colorRelated/takeColor/index',
jurisdiction: 'color_sampling_page'
}, },
{ {
iconName: 'icon-qusechazhao', iconName: 'icon-qusechazhao',
name: '取色查找', name: '取色查找',
path: '/pages/colorRelated/findColor/index', path: '/pages/colorRelated/findColor/index',
jurisdiction: 'color_search_page'
}, },
{ {
iconName: 'icon-yangpinduibi', iconName: 'icon-yangpinduibi',
name: '样品对比', name: '样品对比',
path: '/pages/colorRelated/sampleComparison/index', path: '/pages/colorRelated/sampleComparison/index',
jurisdiction: 'sample_comparison_page'
}, },
] ]
const statisticAnalysis: IconCardType[] = [ let statisticAnalysis: IconCardType[] = [
{ {
iconName: 'icon-xiaoshou', iconName: 'icon-xiaoshou',
name: '销售', name: '销售',
path: '/pages/saleStatistic/index', path: '/pages/saleStatistic/index',
jurisdiction: 'sales_page'
}, },
{ {
iconName: 'icon-duizhang', iconName: 'icon-duizhang',
name: '对账', name: '对账',
path: '', path: '',
jurisdiction: 'reconciliation_page'
}, },
{ {
iconName: 'icon-yuncangkucun', iconName: 'icon-yuncangkucun',
name: '云仓库存', name: '云仓库存',
path: '', path: '',
jurisdiction: 'cloud_warehouse_inventory_page'
}, },
{ {
iconName: 'icon-qianzhicangkucun', iconName: 'icon-qianzhicangkucun',
name: '前置仓库存', name: '前置仓库存',
path: '', path: '',
jurisdiction: 'front_warehouse_page'
}, },
] ]
// 用户信息 // 用户信息
const UserInfo: FC = () => { const UserInfo: FC = () => {
const { removeToken, removeUserInfo, userInfo } = useUserInfo() const { removeToken, removeUserInfo, userInfo } = useUserInfo()
@ -123,6 +145,23 @@ const UserInfo: FC = () => {
goLink(item.path, {}, 'navigateTo') goLink(item.path, {}, 'navigateTo')
} }
const [Features, setFeatures] = useState<any[]>([])
const [Coloring, setColoring] = useState<any[]>([])
const [Statistics, setStatistics] = useState<any[]>([])
useDidShow(() => {
let arr: any[] = []
let arrOne: any[] = []
let arrTwo: any[] = []
arr = feature.filter((item) => checkKey(item.jurisdiction));
arrOne = fabric.filter((item) => checkKey(item.jurisdiction));
arrTwo = statisticAnalysis.filter((item) => checkKey(item.jurisdiction));
setFeatures([...arr])
setColoring([...arrOne])
setStatistics([...arrTwo])
})
return ( return (
<> <>
<LayoutBlock circle> <LayoutBlock circle>
@ -148,30 +187,37 @@ const UserInfo: FC = () => {
<Text className={styles.userTitle}>IT-</Text> <Text className={styles.userTitle}>IT-</Text>
</View> </View>
</LayoutBlock> </LayoutBlock>
<LayoutBlock circle> {
<View className={styles.layoutTitle}></View> !!Features.length && <LayoutBlock circle>
<View className={styles['grid-container']}> <View className={styles.layoutTitle}></View>
{feature.map(item => { <View className={styles['grid-container']}>
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard> {Features.map(item => {
})} return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard>
</View> })}
</LayoutBlock> </View>
<LayoutBlock circle> </LayoutBlock>
<View className={styles.layoutTitle}></View> }
<View className={styles['grid-container']}> {
{fabric.map(item => { !!Coloring.length && <LayoutBlock circle>
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard> <View className={styles.layoutTitle}></View>
})} <View className={styles['grid-container']}>
</View> {Coloring.map(item => {
</LayoutBlock> return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard>
<LayoutBlock circle> })}
<View className={styles.layoutTitle}></View> </View>
<View className={styles['grid-container']}> </LayoutBlock>
{statisticAnalysis.map(item => { }
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard> {
})} !!Statistics.length && <LayoutBlock circle>
</View> <View className={styles.layoutTitle}></View>
</LayoutBlock> <View className={styles['grid-container']}>
{Statistics.map(item => {
return <IconCard iconName={item.iconName} title={item.name} onClick={() => handleClickIconCard(item)}></IconCard>
})}
</View>
</LayoutBlock>
}
</> </>
) )
} }