import React from 'react';
import Taro from '@tarojs/taro';
import { View } from '@tarojs/components';
import { Cell, CellGroup, Field, Button } from '@antmjs/vantui';
import Uploader from '@/components/Uploader/index';
import { getTaIssueById } from '@/services/taissue';
import { getSysOrgById } from '@/services/sysorg';
import { getDtStr } from '@/utils/date';

export default (props) => {
  const { issueId, onLoading } = props;

  const [issue, setIssue] = React.useState({});
  const [org, setOrg] = React.useState({});

  const setLoading = (val) => {
    if (onLoading) {
      onLoading(val);
    }
  }

  React.useEffect(() => {
    if (issueId) {
      setLoading(true);
      getTaIssueById(issueId).then((res) => {
        setIssue(res);
        //拿到机构ID
        if (res.orgId) {
          // console.log('res.orgId', res.orgId)
          setLoading(true);
          getSysOrgById(res.orgId).then((r) => {
            setOrg(r);
            setLoading(false);
          }).catch(() => {
            setLoading(false);
          });
        }
        setLoading(false);
      }).catch(() => {
        setLoading(false);
      });
    }
  }, [issueId]);

  return (
    <>
      <CellGroup>
        <Cell title="ID" value={issue?.issueId} />
        <Cell title="上报时间" value={getDtStr(issue?.createDate)} />
        <Cell title="办结时间" value={issue?.expireDate} />
        <Cell title="交办单位" value={org?.name} />
        <Cell title="交办次数" value={issue?.processNum || 0} />
      </CellGroup>
      <CellGroup style={{ marginTop: '20px' }}>
        <Cell title="抽检位置" value={issue?.locName} />
        <Cell title="定 位 点" value={issue?.addr} />
        <Cell title="问题详情" />
        <Field
          readonly
          type="textarea"
          autosize={{ minHeight: '120px' }}
          value={issue?.content}
        />
        <Cell
          renderTitle={
            <Uploader
              disabled
              value={issue?.attachList}
            />
          }
        />
      </CellGroup>
    </>
  )
}
