import React, { useState, useEffect,useRef} from 'react';
import { Input ,Tabs,Table,Space, Button} from 'antd';
const { TabPane } = Tabs;

import {connect,history} from 'umi';

// apply_name: "我的人生就"
// apply_reason_content: "H4sIAAAAAAAAACXJOwqDQBQF0N5VjyLRRsI0xs+AIjFoEMXC8e9q3n2Zzi0opDnNgapoEmYYf4nL↵Lw0Rsy9pbYz3xdjTnNGWWFAVWk3L49xs2nOOOpqCvwgVN8VdKHc8OxYKUlj4OEgPvOsLeuxP/F8A↵AAA="
// apply_relation_owner: 0
// apply_status: 0
// build_number: "01"
// communityId: "12ffe9ed60054af9a67c036af92e03f9"
// community_name: "A4"
// community_owner: "jack-小雄"
// community_owner_phone: "13143391751"
// create_time: {date: 10, day: 4, hours: 16, minutes: 27, month: 8, …}
// deleted: 0
// floor_number: "05"
// id: "977494600245575680"
// ownerId: "770da9de6b6c43f6b61bc3d671fa2e89"
// room_number: "569"
// update_time: 



import { RA, SA } from '@/utils/method';
import { objectColumns } from '@/utils/string';
import { timestampToTime } from '@/utils/time';
import Login from '../user/login/components/Login';
const module="CommunityService"
const Card = (props:any) => {

  const { dispatch, Data7 } = props;
  const formRef = useRef(null)
  // const apply_status = [[0, "审核中"], [1, "批准"], [2, "拒绝"], [3, "领取"]]
  const apply_status = [[0, "Under review"], [1, "Approval"], [2, "Reject"], [3, "Claim"]]
  const columns = objectColumns([
    ["所在小区", "community_name"],
    ["所在单元", null, (text: any, record: any) => (<Space size="middle">{record.build_number+"#"+record.floor_number+"-"+record.room_number}</Space>)],
    ["用户名", "community_owner"],
    ["申请时间", null, (text: any, record: any) => (<Space size="middle">{timestampToTime(record.create_time.time)}</Space>)],
    ["申请状态",  "apply_status", (text: any, record: any) => (<Space size="middle">{apply_status[parseInt(text)][1]}</Space>)],
    ["Actions",null, (text: any, record: any) => (<Space size="middle"> <a onClick={goToDetail.bind(this,record)}>Detail</a></Space>)],
  ])

  useEffect(() => {
    RA(31, { serviceType: "7", id: "" }, module, dispatch)
    
  }, [])

  useEffect(() => {
    if (Data7 != null) {
      console.log("首页信息")
      console.log(Data7)
    }
  }, [Data7])
  
  const goToDetail = (values: any, e: any) => {
    SA(values,module,dispatch)
    history.push('./AccessCardApplication/Detail')
  }

  const goToAdd = (values:any,e:any)=>{
    history.push('./AccessCardApplication/Add')
  }
  return (
    <div style={{ width: "100%", minWidth: 1020, padding: 34, backgroundColor: "#ffffff" }}>       
      
      {
        Data7 != null ?
          <>
            <div style={{ height: 80, position: "relative" }}>
                <div style={{ position: "absolute", right: 0 }}>
                    <Button type="primary" onClick={goToAdd}>Apply Card</Button>
                </div>
            </div>
            
            <Table loading={false} rowKey="id" style={{ marginTop: 16 }}
            dataSource={Data7.data.rows}
            columns={columns}
            pagination={{ defaultCurrent: 1, total: Data7.total }} />    
          </>
          :null
      }
    </div>
  );
};

function map(state:any) {
  const { Data7} = state[module]
  return { Data7}
}
export default connect(map)(Card);

