import { assetsActionManageService } from "@/services"
import { httpUtil } from "@/utils"
import { useSetState } from "ahooks"
import React, { useEffect } from "react"
import {Descriptions, Spin} from "antd"

const AssetColumnDetail:React.FC<any>=(props)=>{
    const {id,type} = props
    
    const [state,setState] = useSetState({
        loading:true,
        attrs:[]
    })

    const [open,setOpen] = useSetState({
        openshowmore:true,
        showmore:true
    })

    useEffect(()=>{
        if(id&&type){
            getDetialInfo()
        }
    },[id,type])

    const getDetialInfo=async()=>{
        setState({loading:true})
        const result:any = await assetsActionManageService.getAssetColumnDetail({columnId:id,columnType:type})
        if(httpUtil.checkSuccess(result,1)){
            setState({loading:false,attrs:result.data?.columnValueList||[]})
        }else{
            httpUtil.showError(result,1)
            setState({loading:false,attrs:[]})
        }

    }

    return(
        <div>
            <h2>资产字段信息</h2>
            <Spin spinning={state.loading}>
                <Descriptions column={2} size="small" bordered={false} >
                    {
                        state.attrs.map((item:any,key:number)=>{
                            if(key<6){
                                return(
                                    <Descriptions.Item span={1} key={key} label={item?.cnName}>
                                        {item?.value}
                                    </Descriptions.Item>
                                )
                            }else{
                                if(open.openshowmore){
                                    if(open.showmore){
                                        return(
                                            <Descriptions.Item span={1} key={key} label={item?.cnName}>
                                                {item?.value}
                                            </Descriptions.Item>
                                        )
                                    }else{
                                        return null
                                    }
                                }else{
                                    return(
                                        <Descriptions.Item span={1} key={key} label={item.cnName}>
                                            {item?.value}
                                        </Descriptions.Item>
                                    )
                                }
                            }
                        })
                    }
                </Descriptions>
            </Spin>
            
        </div>
    )
}

export default AssetColumnDetail