import { shortcut, store } from '@core/core'; import { SignEditor, MultiLayerSingleLevelTree, SearchEditor, Button, Editor, Label } from '@fui/core'; import { FileUploadModel } from './file_upload.model'; import { ApiFactory } from 'src/modules/crud/apiFactory'; import './file_upload.less'; const api = new ApiFactory().create(); @shortcut() @store(FileUploadModel, { props(this: FileUpload) { return this.options; }, }) export class FileUpload extends BI.Widget { public static xtype = "dec.dcm.components.file_upload"; public static EVENT_CHECK_SUCCESS = 'EVENT_CHECK_SUCCESS'; public static EVENT_CLEAR_FILE = 'EVENT_CLEAR_FILE'; public props = { watermark: '', value: '', processId: '', disabled: false, inter: '', access: '', iconCls: '' }; model: FileUploadModel['model']; store: FileUploadModel['store']; watch = { uploadUrl: function () { this.uploader.setUrl(this.model.uploadUrl); }, }; public textEditor: SignEditor; public keywordEditor: SearchEditor; public fileTree: MultiLayerSingleLevelTree; public sureButton: Button; public infoLabel: Label; public render() { const { width, watermark, value, processId, inter } = this.options; let self = this; const processName = BI.concat("process-", processId); const processClass = BI.concat(".process-", processId); this.setFileInfo({ keytabPath: '', principal:'', krb5ConfPath: '', }); return { type: BI.VerticalLayout.xtype, items:[{ type: BI.FloatLeftLayout.xtype, items: [ { type: BI.SignEditor.xtype, cls: 'bi-border bi-focus-shadow', width: 300, height: 22, watermark, disabled: true, value, ref: (_ref: SignEditor) => { this.textEditor = _ref; }, listeners: [ { eventName: BI.SignEditor.EVENT_CHANGE, action: () => { const value = this.textEditor.getValue(); this.setValue(value); }, }, ], }, { type: BI.Button.xtype, width: 100, _lgap: 10, iconCls: "upload-font", level: "ignore", ghost: true, ref: (_ref: Button) => { this.uploadButton = _ref; }, text: BI.i18nText('Dec-Basic_Choose_File'), handler: () => { this.uploader.select(); }, }, ], }, { type: BI.FloatLeftLayout.xtype, tgap: 8, invisible: true, ref: (_ref) => { this.fileInfo = _ref; }, items: [ { type: BI.VerticalLayout.xtype, cls: "bi-border", items: [{ type: BI.HTapeLayout.xtype, height: 68, width: 300, items: [{ el: { type: BI.IconLabel.xtype, cls: this.options.iconCls, }, width: 48, lgap: 8, }, { el: { type: BI.VerticalLayout.xtype, items : [{ type: BI.Label.xtype, width: 200, height: 20, textAlign: "left", ref: (_ref: Label) => { this.fileName = _ref; }, },{ type: BI.VerticalAdaptLayout.xtype, items: [{ type: BI.Label.xtype, cls: "bi-tips", height: 20, rgap: 3, ref: (_ref: Label) => { this.fileSize = _ref; }, }, { type: BI.Label.xtype, cls: "bi-tips", height: 20, ref: (_ref: Label) => { this.fileModified = _ref; }, }] }], }, tgap: 14, lgap: 4, }, { el: { type: BI.IconButton.xtype, cls: "default-delete-font", handler: function () { NProgress.set(0.0); self.xhr.abort(); self.store.setFileName(''); self.clearInfo(); self.fireEvent(FileUpload.EVENT_CLEAR_FILE); }, }, rgap: 10, }] }, { type: BI.VerticalLayout.xtype, cls: processName, width: 300, height: 1, }] }, { el :{ type: BI.VerticalLayout.xtype, cls: "bi-error", ref: (_ref: any) => { this.errorInfo = _ref; }, invisible: true, items : [{ type: BI.Label.xtype, height: 20, textAlign: "left", ref: (_ref: Label) => { this.errorCode = _ref; }, },{ type: BI.Label.xtype, height: 20, textAlign: "left", ref: (_ref: Label) => { this.errorMsg = _ref; }, }, { type: BI.VerticalAdaptLayout.xtype, rgap: 5, items: [ { type: BI.Label.xtype, text: BI.i18nText('Dec-Dcm_Connection_File_Upload_ErrorTip1'), },{ type: BI.TextButton.xtype, cls: "bi-high-light bi-high-light-border-bottom", text: BI.i18nText('Dec-Dcm_Connection_File_Upload_ErrorTip2'), handler: function () { window.open(Dec.system[DecCst.Hyperlink.DECISION_HYPERLINK_CONFIG][DecCst.Hyperlink.KERBEROS_CONF_HELP]); }, },{ type: BI.Label.xtype, text: BI.i18nText('Dec-Dcm_Connection_File_Upload_ErrorTip3'), } ], },], }, vgap: 4, lgap: 8, } ], }, { type: BI.MultifileEditor.xtype, ref: (ref:any) => { self.uploader = ref; }, url: this.model.uploadUrl, accept: this.options.accept, listeners: [ { // 选择文件 eventName: BI.MultifileEditor.EVENT_CHANGE, action: function (files) { self.options.attachId = ''; const fileInfo = files.files[0]; self.setInfo(fileInfo); self.store.setFileName(fileInfo.fileName); this.upload(); NProgress.configure({ parent: processClass, minimum: 0.0 }); }, }, { // 上传进度刷新 eventName: BI.MultifileEditor.EVENT_PROGRESS, action: function (progress) { let rate = progress.loaded/progress.total; NProgress.set(rate); }, }, { // 开始上传文件 eventName: BI.MultifileEditor.EVENT_UPLOADSTART, action: function (progressEvent, xhr) { self.xhr = xhr; }, }, { // 上传文件完毕 eventName: BI.MultifileEditor.EVENT_UPLOADED, action: function () { const uploadedInfo = this.getValue(); const failed = BI.some(uploadedInfo, function (index, file) { if (file.data.errorCode) { BI.Msg.toast(uploadedInfo[0].filename + BI.i18nText('Dec-Dcm_Connection_File_Upload_Error'), { level: "error", }); self.setErrorInfo(file.data) return true; } }); const key = self.options.processId +'Path'; !failed && self.setValue(uploadedInfo[0].data.kerberosInfo[key]); !failed && self.fireEvent(FileUpload.EVENT_CHECK_SUCCESS, uploadedInfo[0].data); !failed && BI.Msg.toast(uploadedInfo[0].filename + BI.i18nText('Dec-Dcm_Connection_File_Upload_Success'),{ level: "success" }); NProgress.configure({ parent: 'body'}); }, }, ], }] }; } public getValue(): string { return this.options.value; } public setValue(value: string) { this.options.value = value; this.textEditor.text.setTitle(value); this.textEditor.setValue(value); } public setInfo(info: any) { this.uploadButton.setEnable(false); this.fileInfo.setVisible(true); this.textEditor.setValue(info.fileName); this.fileName.setText(info.fileName); this.fileSize.setText(Dec.Utils.getByteWidthUnit(info.size)); this.fileModified.setText(BI.getDate().print("%Y-%X-%d %H:%M:%S")) } public clearInfo() { this.uploadButton.setEnable(true); this.fileInfo.setVisible(false); this.errorInfo.setVisible(false); this.textEditor.setValue(''); this.options.attachId = ''; } public setErrorInfo(errorInfo: any) { this.errorInfo.setVisible(true); this.errorCode.setText(BI.i18nText("Dec-Dcm_Connection_File_Upload_ErrorCode") + ":"+ errorInfo.errorCode); this.errorMsg.setText(BI.i18nText("Dec-Dcm_Connection_File_Upload_ErrorMsg") + ":" + errorInfo.errorMessage); } public setEnable(v) { this.uploadButton._setEnable(v); } public setFileInfo(params) { this.store.setFileInfo(params); } }