Перетаскивание из муравьиного дизайна не работает - PullRequest
Новая
       15

Перетаскивание из муравьиного дизайна не работает

1 голос
/ 20 января 2020

Я использую компонент Dragger в ant-design для функции перетаскивания, но он не работает, если я щелкаю по папкам и выбираю файл, который он работает, но если я перетаскиваю файл, он не работает .

следует картине моей проблемы

здесь моя реализация: 

import { Button, Icon, Input, message, Modal, Radio, TreeSelect, Typography, Upload } from 'antd';
const { Dragger } = Upload;

Здесь я собираю компонент: 

   getFileUploader() {
        return (
            <Dragger
                name='file'
                multiple={false}
                accept=".docx"
                beforeUpload={(e, l) => this.beforeUpload(e, l)}
            >
                <p className="ant-upload-drag-icon">
                    <Icon type="inbox" />
                </p>
                <p className="ant-upload-text">Arraste e solte ou clique aqui para selecionar o arquivo da Estrutura <b>Padrão</b></p>
                <p className="ant-upload-hint">
                    {this.getText()}
                </p>
            </Dragger>
        );
    }

и здесь я помещу реквизиты, которые он использует: 

beforeUpload(file, fileUploaded) {

const isDocx = file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'

if (!isDocx) {
    message.error('Só é permitido upload de arquivos com extenção .DOCX');

    this.setState({ isDocx: false });

    if (fileUploaded.length > 0)
        fileUploaded = fileUploaded.slice(-1);

    setTimeout(() => {
        document.querySelector("i[title='Remove file']").click()
    }, 1000);

} else {

    setTimeout(() => {
        if (document.querySelectorAll('.ant-upload-list-item-name').length > 1)
            document.querySelector("i[title='Remove file']").click()
    }, 1000);

    this.setState({
        file: file,
        hasFile: true
    })
}

return false

}

и затем я рендерим его: 

    render() { 
        return (
            <div onMouseMove={() => this.changeUploadText()}>
                <Modal
                    title="Tipos de Documentos"
                    visible={this.props.NewDocumentTypeModalStore.isOpen}
                    className="org-reclassifyDocument"
                    width="850px"
                    bodyStyle={{ height: 475 }}
                    destroyOnClose={true}
                    onCancel={() => this.cancelModal()}
                    footer={[
                        <Button key="cancel" onClick={() => this.cancelModal()}>Cancelar</Button>,
                        <Button key="ok"
                            disabled={((this.state.valueRadio != 1 || this.state.text == undefined || this.state.text.trim() == "") && (this.state.value == undefined || this.state.hasFile == false))}
                            onClick={() => this.clickRule()} type="primary"
                            loading={this.props.NewDocumentTypeModalStore.isLoading}
                        >
                            Confirmar
                        </Button>
                    ]}
                >
                    <div id="organize">
                        <div id="rigthPanel">
                            <div id="radioButton">
                                {this.getRadioButton()}
                            </div>
                            {this.getBody()}
                        </div>

                        <div id="fileUploader">
                            {this.getFileUploader()}
                        </div>
                    </div>
                </Modal>
            </div>
        );
    }
}
...