import React from 'react';
import Taro from '@tarojs/taro';
import { View } from '@tarojs/components';
import Page from '@/layouts/index';
import { Cell, CellGroup, Field, Radio, RadioGroup } from '@antmjs/vantui';
import { getTaIssueApplyById } from '@/services/taissueapply';
import { getDtStr } from '@/utils/date';
import { PROCESS_APPLY_DELAY } from '@/utils/biz';
import Issue from '../components/Issue';
import useTitle from '../useTitle';

const getVerifyStatus = (st) => {
  if (!st || st == 'ready') return '未审批';
  return st == 'pass' ? '通过' : '驳回';
}

export default (props) => {
  const router = Taro.useRouter();
  const { id, applyType, issueId } = router.params;

  const [loading, setLoading] = React.useState(false);
  const [applyInfo, setApplyInfo] = React.useState({});
  
  useTitle(applyType);
  
  React.useEffect(() => {
    if (id) {
      setLoading(true);
      getTaIssueApplyById(id).then(res => {
        setApplyInfo(res);
        setLoading(false);
      }).catch(() => {
        setLoading(false);
      });
    }
  }, [id]);
  
  return (
    <Page loading={loading}>
      <Issue issueId={issueId} />
     
      <CellGroup style={{marginTop: '20px'}}>
        {
          applyInfo.applyType == PROCESS_APPLY_DELAY && (
            <Cell
              title="延期日期"
              value={applyInfo.content}
            />
          )
        }
        <Cell title="申请说明" />
        <Field
          readonly
          type="textarea"
          autosize={{ minHeight: '120px' }}
          value={applyInfo.remark}
        />
      </CellGroup>
     
      <CellGroup style={{marginTop: '20px'}}>
        <Cell
          title="审批结果"
          value={getVerifyStatus(applyInfo.verifyStatus)}
        />
        <Cell title="审批说明" />
        <Field
          readonly
          type="textarea"
          autosize={{ minHeight: '120px' }}
          value={applyInfo.verifyDesc}
        />
        <Cell
          title="审核日期"
          value={getDtStr(applyInfo.verifyDate)}
        />
      </CellGroup>
    </Page>
  )
}
