文件上传控件

一.效果

                        

                            

                            

                                

                                

将文件拖拽到这里

                            

                            

                        

•                         
•                             
•  
•                             
•                         

二.代码片段

//add事件
const param = args[0];

    const file = param.file;

    const uploader = fd.data.node.querySelector('#uploader_audio') as upload;

fd.data.file_id && (uploader.remove_file(fd.data.file_id));

    fd.data.file_id = param.file_id;

    const name: string = param.name;

    const audio_name = name.substring(0, name.lastIndexOf('.'));


    const suffix_name = "." + name.replace(/.+\./, "");//后缀名
    if(suffix_name!=".mp3"){

        uploader.remove_file(fd.data.file_id);

        fsm_component_msg("zj-common-002", "ec-001", 'fail', '请选择正确格式的音频文件')

        return;

    }

    console.log(audio_name,suffix_name);

    const audio_input = fd.data.node.querySelector("#audio_name");

    audio_input.value=audio_name;

	// uploaded事件
	const param = args[0].upload_data;
	const file_id = param.file_id;
	const key = param.key;
	const duration = parseInt(param.avinfo.audio.duration).toFixed(2).toString();
	const size = (Math.round(param.size * 100) / 100 / 1000 / 1000).toFixed(2).toString();

	console.log(duration, size)
	const source_link = param.source_link;//原始上传文件地址
	const sizes = fd.data.node.querySelector('[data-feidao-id="size"]').innerText = size + 'M';
	const durations = fd.data.node.querySelector('[data-feidao-id="duration"]').innerText = duration + 's';
	console.log(sizes, durations)
	const audio_input = fd.data.node.querySelector("#audio_name");
	fd.data.cloud_mark = key;

	console.log('fd.data.cloud_mark', fd.data.cloud_mark);
	const audio = fd.data.node.querySelector('[ data-feidao-name="value_name"]');
	const audio_no = audio.getAttribute('data-feidao-no');
	const _id = audio.getAttribute('data-feidao-id');

	console.log({ size: sizes, duration: durations, audio_name: audio_input, _id: _id, audio_no: audio_no });
	const model_no = fd.data.model_no;
	console.log('model_no', model_no)
	const res = await nodejs(spaceid, '3d_sourse_audio_upd', { size: size, duration: duration, audio_name: audio_input.value, _id: _id, audio_no: audio_no, audio: source_link, cloud_mark: fd.data.cloud_mark, model_no: model_no });
	if (res == 'success') {
		fsm_component_msg('zj-common-002', 'ec-001', 'success', '修改成功');

	} else {
		fsm_component_msg('zj-common-002', 'ec-001', 'fail', '修改失败');
	}
	// error
	const param = args[0];
	fsm_component_msg("zj-common-002", "ec-001", 'fail', '上传出错');
	const uploader = fd.data.node.querySelector('#uploader_audio') as upload;
	uploader.remove_file(param.file_id); 

 

三.参数

 

1. Attributes
   1. spaceid:项目spaceid，必须传入
   2. domain:文件存储空间地址，必须传入比如七牛云的地址
   3. preview-type
   4. file-type:上传文件类型限制
   5. hide-drag:例如图片：'["image/png","image/jpg"]'; 例如视频：'["video/mp4","video/mpeg","video/ogg"]';
   6.   地址:
2. Methods
   1. start:add之后调用上传方法
   2. remove_file:若是选择一个文件没有上传,再次选择要将上次选择的文件清除掉
   3. remove_all
   4. stop
3. Events
   1. fdwe-added:如果需要判断文件格式,在此事件中判断,如果在err事件中判断,进度弹框会出现,为了避免次事件发生
   2. fdwe-process:调用上传方法之后自动出现进度弹框,此事件可以省掉不写
   3. fdwe-error
   4. fdwe-uploaded:上传成功之后,请求云上会返回字段,可以保存到数据库中,例如需要视频的大小,时长或图片的大小
   5.