UploadMoreModal.tsx
3.43 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
import React, {useEffect, useState} from 'react';
import {Modal, Button, InputNumber, Select} from 'antd';
import { getList } from './api';
import useInitial from "@/hooks/useInitail";
import { useStore } from '../index';
interface Props {
islock?:boolean,
setIslock: Function,
visible: boolean,
onCancel: () => any,
}
const Option = Select.Option;
export default function Upload(props: Props) {
const { storages: storageList } = useStore();
const { visible, onCancel, islock, setIslock } = props;
const [storageid, setStorageid] = useState<number>();
const [storageName, setStorageName] = useState<string>();
const [delay, setDelay] = useState(true);
const { data: total, setParams } = useInitial(getList, 0, {}, delay);
const [pagesize, setPagesize] = useState(1000);
const [list, setList] = useState<number[]>([]);
async function f(s:number, a: Array<number>) {
for (let i = 0; i < s; i++) {
a.push(i+1);
}
return a;
}
useEffect(() => {
if (total && pagesize) {
const sum = Math.ceil(Number(total) / pagesize);
const arr:Array<number>= [];
f(sum, arr).then(a => setList(a));
} else {
setList([]);
}
}, [total, pagesize, storageid]);
useEffect(() => {
if (!visible) {
setStorageid(undefined);
setList([]);
setIslock(false);
}
}, [visible]);
const handOnChange = (value: number) => {
const storagename = storageList.find(it => it.id==value);
setStorageid(value);
setStorageName(storagename?.storageName);
setDelay(false);
setParams({storageId: value}, true);
};
return (
<Modal
maskClosable
title={islock ? "锁定库存导出" : "库存导出"}
visible={visible}
onCancel={onCancel}
width={800}
footer={[
<Button onClick={onCancel}>取消</Button>,
]}
>
<div style={{display: 'flex', flexDirection: 'row', alignItems: 'center', marginBottom: 20}}>
<span style={{paddingLeft: 29}}>选择库房：</span>
<Select
placeholder="请选择库房"
value={storageid}
style={{ width: 250 }}
onChange={(value: number) => handOnChange(value)}
showSearch
optionFilterProp="children"
>
{storageList.map(it => (
<Option key={it.id} value={it.id || -1}>{it.storageName || ''}</Option>
))}
</Select>
</div>
<div style={{display: 'flex', flexDirection: 'row', alignItems: 'center', marginBottom: 20}}>
<span>表格数据条数：</span>
<InputNumber
value={pagesize}
min={1}
step={1}
onChange={v => setPagesize(v)}
style={{ width: 250 }}
/>
</div>
<div style={{display: 'flex', flexDirection: 'row', flexWrap: 'wrap'}}>
{islock ? list.map((it, index) => (
<a key={index} href={`/api/pms/erp/part/shop/export/lock/stock?storageId=${storageid}¤t=${it}&pageSize=${pagesize}`} style={{ marginRight: 20, marginBottom: 10 }} target="_blank" rel="noopener noreferrer">{`${storageName}锁定库存${it}.xlsx`}</a>
)) :
list.map((it, index) => (
<a key={index} href={`/api/pms/erp/part/shop/export/stock?storageId=${storageid}¤t=${it}&pageSize=${pagesize}`} style={{marginRight: 20, marginBottom: 10}} target="_blank" rel="noopener noreferrer">{`${storageName}库存${it}.xlsx`}</a>
))}
</div>
</Modal>
);
}