import {
  savePurchaseInStore,
  getPurchaseDetail,
} from "@/services/purchase";
import { getStoreList } from "@/services/stock";
import {
  PageContainer,
  ProForm,
  ProFormSelect,
  ProFormText,
  ProFormDigit,
} from "@ant-design/pro-components";
import { useNavigate, useSearchParams } from "react-router-dom";
import { Card, Col, message, Row, Space, Form, Button } from "antd";
import { useEffect, useRef, useState } from "react";
import { MinusCircleOutlined, PlusOutlined } from "@ant-design/icons";
import { floatMultiply, floatDivide } from "@/utils";

export default (props) => {
  const [searchParams] = useSearchParams();
  const id = searchParams.get("id");
  const [storeList, setStoreList] = useState([]);
  const [isInStore, setIsInStore] = useState(false);
  const navigate = useNavigate();
  
  const formRef = useRef();
  useEffect(() => {
    getStoreList({ pageSize: 9999 }).then((res) => {
      setStoreList(
        res?.records?.map((x) => ({
          label: x.name,
          value: x.id,
        }))
      );
    });
  }, []);

  useEffect(() => {
    if (id) {
      getPurchaseDetail(id).then((res) => {
        setIsInStore(res.isInStore)
        formRef.current.setFieldsValue({
          ...res,
          itemsList: res.itemsList?.map((x) => ({
            ...x,
            planUnitPrice: x.planUnitPrice
              ? floatDivide(x.planUnitPrice, 100)
              : null,
            actUnitPrice: x.actUnitPrice
              ? floatDivide(x.actUnitPrice, 100)
              : null,
          })),
        });
      });
    }
  }, [id]);

  const onFinish = async (values) => {
    console.log(values, "===");



    savePurchaseInStore(Number(id)).then((res) => {
      // message.success("添加成功");
      navigate(-1);
    });

    return false;
  };



  return (
    <PageContainer>
      <Card>
        <ProForm
        
          formRef={formRef}
          layout={"horizontal"}
          labelCol={{ span: 2 }}
          wrapperCol={{ span: 8 }}
          onFinish={onFinish}
          submitter={{
            searchConfig: {
              resetText: "返回",
              submitText:'入库'
            },
            onReset: () => navigate(-1),
            render: (props, doms) => {
              console.log(props, doms, "renderprops");
              return (
                <Row>
                  <Col span={8} offset={2}>
                    <Space>
                      {doms?.map((x, index) => {
                        if (index === 1 && isInStore) {
                          return null;
                        }
                        return x;
                      })}
                    </Space>
                  </Col>
                </Row>
              );
            },
          }}
        >
          <ProFormText
            name="title"
            label="采购计划"
            placeholder="请输入采购计划"
            disabled
            width={480}
          />
          <ProFormText
            name="planDate"
            label="计划时间"
            placeholder="请输入计划时间"
            disabled
            width={480}
          />
          <Form.Item
            label="采购清单"
            labelCol={{ span: 2 }}
            wrapperCol={{ span: 22 }}
          >
            <Form.List name="itemsList">
              {(fields, { add, remove }) => (
                <>
                  {fields.map(({ key, name, ...restField }) => (
                    <Space
                      key={key}
                      style={{ display: "flex" }}
                      align="baseline"
                    >
                      <ProFormSelect
                        {...restField}
                        name={[name, "storeId"]}
                        label="库存名称"
                        placeholder="请选择库存名称"
                        disabled
                        options={storeList}
                      />

                      <ProFormDigit
                        {...restField}
                        name={[name, "planAmount"]}
                        label="计划数量"
                        placeholder="请输入计划数量"
                        disabled
                        width={100}
                        fieldProps={{
                          precision: 10,
                          formatter: (value) => value,
                        }}
                      />
                      <ProFormDigit
                        {...restField}
                        name={[name, "planUnitPrice"]}
                        label="预估单价"
                        placeholder="请输入预估单价"
                        disabled
                        fieldProps={{ precision: 2, prefix: "￥" }}
                        width={100}
                      />
                      <ProFormDigit
                        {...restField}
                        name={[name, "actAmount"]}
                        label="采购数量"
                        placeholder="请输入采购数量"
                        disabled
                        width={100}
                        fieldProps={{
                          precision: 10,
                          formatter: (value) => value,
                        }}
                      />
                      <ProFormDigit
                        {...restField}
                        name={[name, "actUnitPrice"]}
                        label="采购单价"
                        placeholder="请输入采购单价"
                        disabled
                        fieldProps={{ precision: 2, prefix: "￥" }}
                        width={100}
                      />
                    </Space>
                  ))}
                </>
              )}
            </Form.List>
          </Form.Item>
        </ProForm>
      </Card>
    </PageContainer>
  );
};