import React from 'react'
import {useParams} from 'react-router'
import {amisRender, commonInfo, remoteMappings} from '../../util/amis.tsx'

function StockDetail() {
  const {id} = useParams()
  return (
    <div className="stock-detail">
      {amisRender(
        {
          type: 'page',
          title: '股票详情（${code} ${name}）',
          initApi: `get:${commonInfo.baseUrl}/stock/detail/${id}`,
          body: [
            {
              type: 'property',
              items: [
                {label: '编码', content: '${code}'},
                {label: '名称', content: '${name}'},
                {label: '全名', content: '${fullname}'},
                {
                  label: '市场',
                  content: {
                    ...remoteMappings('stock_market', 'market'),
                    value: '${market}',
                  },
                },
                {label: '行业', content: '${industry}'},
              ],
            },
            {type: 'divider'},
          ],
        },
      )}
    </div>
  )
}

export default React.memo(StockDetail)