import React, { useState } from 'react';
import { Table, Button, Space, Form, Radio, Select, Input, InputNumber, Upload } from 'antd';
import { TableListItem } from './data';
import '@/assets/ld_style.less'

const { Option } = Select;
const { TextArea } = Input;

const formItemLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 14 },
};

const columns: any[] = [  // 列表数据
  { title: '投标人名称', dataIndex: 'name', key: 'name' },
  { title: '最新不含税总价', dataIndex: 'price', key: 'price' },
  { title: '调整类别', dataIndex: 'type', key: 'type' },
  { title: '调价说明', dataIndex: 'explain', key: 'explain' },
  { title: '调价附件', dataIndex: 'enclosure', key: 'enclosure' },
];
const dataSource: TableListItem[] = [
  { key: '1', name: '华为技术股份有限公司', price: '300.00', type: '小薇', explain: '9988', enclosure: '' },
  { key: '2', name: '中兴通讯股份有限公司', price: '1000.00', type: '小薇', explain: '9988', enclosure: '' },
];

const Index: React.FC<{}> = () => {
  const [dateList] = useState(dataSource);
  const [adjustForm] = Form.useForm();

  const onSelectChange = (selectedRowKeys, selectedRows) => { // 单选中回执列表数据
    console.log(selectedRowKeys)
    console.log(selectedRows[0].price)
    adjustForm.setFieldsValue({
      adjust: selectedRows[0].price
    });
  }

  const formOnFinish = (data: any) => {
    console.log(data);
  }

  const normFile = (e: any) => {
    console.log('Upload event:', e);
    if (Array.isArray(e)) {
      return e;
    }
    return e && e.fileList;
  }

  return (
    <>
      <div className="bidContent">
        <div className="titName">
          <span className="f16">投标人最新报价列表</span>
          <Space className="fr">
            <Button type="primary" danger size="small" className="fr">提交</Button>
            <Button type="primary" danger size="small" className="fr">返回</Button>
          </Space>
        </div>
        <Table
          rowSelection={{
            type: 'radio',
            onChange: onSelectChange,
          }}
          bordered
          pagination={false}
          columns={columns}
          dataSource={dateList}
        />
        <div className="titName mt20">
          <span className="f16">算数错误调整</span>
        </div>
        <Form
          name="validate_other"
          form={adjustForm}
          {...formItemLayout}
          onFinish={formOnFinish}
        >
          <Form.Item name="way" label="调价方式：">
            <Radio.Group>
              <Radio value="1">最终价格</Radio>
              <Radio value="2">调整价</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item
            name="select"
            label="调整类别："
            hasFeedback
          >
            <Select placeholder="请选择调整类别">
              <Option value="aa">aa</Option>
              <Option value="bb">bb</Option>
            </Select>
          </Form.Item>
          <Form.Item name="price" label="原价：">
            <Input disabled />
          </Form.Item>
          <Form.Item name="adjust" label="调整价：" rules={[{ required: true, message: '请输入调整价!' }]}>
            <Input placeholder="人民币" />
          </Form.Item>
          <Form.Item name="explain" label="调价说明：" rules={[{ required: true, message: '请输入调价说明!' }]}>
            <TextArea rows={4} />
          </Form.Item>
          <Form.Item
            name="upload"
            label="调价附件"
            valuePropName="fileList"
            getValueFromEvent={normFile}
          >
            <Upload name="logo" action="/upload.do" listType="picture">
              <Button>浏览</Button>
            </Upload>
          </Form.Item>
          <Form.Item>
            <Button htmlType="submit">确认</Button>
          </Form.Item>
        </Form>
      </div>
    </>
  )
}

export default Index