FEV2 / fw-cms

  import React, { useState } from 'react';

  import { Table, Divider } from "antd";

  import { useStore } from '../index';

  import LockDetailModal from './LockDetailModal';

  import FlowDetailModal from './FlowDetailModal';

  import PartShopModal from './PartShopModal';

  import LockFlowModal from './LockFlowModal';

  
  const { Column } = Table;
  
  export default function Filter() {

    const { setParams, loading, paginationConfig, list, setVisible, setItem, item, fw, setIsprice} = useStore();

    const [visibleLockDetail, setVisibleLockDetail] = useState(false);

    const [visibleFlowDetail, setVisibleFlowDetail] = useState(false);

    const [visibleLockFlow, setVisibleLockFlow] = useState(false);

  
    return (

      <div>
        <Table
          size="small"
          loading={loading}
          pagination={paginationConfig}
          dataSource={list}
          rowKey={(item: PartRepertorySpace.Item) => `${item.id}`}
          onChange={(_pagination) => setParams({ ..._pagination }, true)}
        >
          <Column title="服务站名称" dataIndex="shopName" />
          <Column title="库房" dataIndex="storageName" />
          <Column title="配件编码" dataIndex="partCode" />

          <Column title="配件名称" dataIndex="partName" />

          <Column title="配件类型" dataIndex="partType" />

          <Column title="加权成本价（元）" dataIndex="costPrice" />
          <Column title="总库存数量" dataIndex="stock" />

          <Column title="库销比" dataIndex="ratio" />

          <Column
            title="锁定库存"
            dataIndex="lockStock"

            render={(t, it: PartRepertorySpace.Item) => <a onClick={() => { setVisibleLockDetail(true); setItem(it); }}>{t || 0}</a>}
          />

          <Column
            title="出库流水"
            render={(t, it: PartRepertorySpace.Item) => <a onClick={() => { setVisibleFlowDetail(true); setItem({...it, isOut: true}); }}>查看</a>}
          />
          <Column
            title="入库流水"
            render={(t, it: PartRepertorySpace.Item) => <a onClick={() => { setVisibleFlowDetail(true); setItem({...it, isOut: false}); }}>查看</a>}
          />

          <Column
            title="锁库流水"
            render={(t, it: PartRepertorySpace.Item) => <a onClick={() => { setVisibleLockFlow(true); setItem({...it, isLock: true}); }}>查看</a>}
          />
          <Column
            title="释放流水"
            render={(t, it: PartRepertorySpace.Item) => <a onClick={() => { setVisibleLockFlow(true); setItem({...it, isLock: false}); }}>查看</a>}
          />

          {fw ? (

            <Column
              title="操作"
              render={(text, _item: PartRepertorySpace.Item) => (

                <div style={{display: 'flex', alignItems: 'center'}}>

                  <a onClick={() => { setVisible(true); setItem(_item); }}>修改</a>
                  <Divider type="vertical" />
                  <a onClick={() => { setVisible(true); setItem(_item); setIsprice(true); }}>修改价格</a>

                </div>

              )}
            />
          ) : (
            <Column
              title="操作"
              render={(text, _item: PartRepertorySpace.Item) => (
                <a onClick={() => { setVisible(true); setItem(_item); setIsprice(true); }}>修改价格</a>

              )}
            />
          )}

        </Table>

        <LockDetailModal item={item} visible={visibleLockDetail} onCancel={() => setVisibleLockDetail(false)} />

        <FlowDetailModal item={item} visible={visibleFlowDetail} onCancel={() => setVisibleFlowDetail(false)} />

        <LockFlowModal item={item} visible={visibleLockFlow} onCancel={() => setVisibleLockFlow(false)} />

        <PartShopModal />

      </div>

    );

  }