附件删除

.gitignore

@@ -6,4 +6,5 @@ modern.json*
 *.log
 .vscode/*
 /server/node_modules
+/server/upload
 

app/view/form/mfilefield/Panel.js

@@ -11,6 +11,6 @@ Ext.define('uas.view.form.mfilefield.Panel', {
 
     items: [{
         xtype: 'mfilefield',
-        value: '1001'
+        value: 'jztnl975x6tqwjxnra;'
     }]
 });

server/action/file-download.js

@@ -3,9 +3,7 @@ var path = require("path");
 const filePath = path.resolve(__dirname, '..' + path.sep + 'upload');
 
 module.exports = function(request, response) {
-    var filename = request.query.filename;
-    var oldname = request.query.oldname;
-    var file = filePath + path.sep + filename;
+    var fpath = filePath + path.sep + request.query.path;
     
-    return fs.createReadStream(file);//得到文件输入流
+    return fs.createReadStream(fpath);//得到文件输入流
 };

server/action/file-info.js

@@ -1,18 +1,28 @@
-var path = require("path");
-const filePath = path.resolve(__dirname, '..' + path.sep + 'upload');
+const files = [{
+    id: 'jztnl975x6tqwjxnra',
+    name: '$9O$UF[1[(@FQ)DM~)VRO8E.png',
+    path: "$9O$UF[1[(@FQ)DM~)VRO8E.png",
+    size: 5629
+}, {
+    id: 'jztnlw2rgdhqcfscoa',
+    name: '$%Z(E8G$S%DJHA6G`XJEVK4.png',
+    path: "$%Z(E8G$S%DJHA6G`XJEVK4.png",
+    size: 86213
+}]
+
 
 module.exports = function(request, response) {
-    var query = request.query;
-    console.log(query);
-    return [{
-        id: 'jztnl975x6tqwjxnra',
-        name: '$9O$UF[1[(@FQ)DM~)VRO8E.png',
-        path: filePath + path.sep + "$9O$UF[1[(@FQ)DM~)VRO8E.png",
-        size: 5629
-    }, {
-        id: 'jztnlw2rgdhqcfscoa',
-        name: '$%Z(E8G$S%DJHA6G`XJEVK4.png',
-        path: filePath + path.sep + "$%Z(E8G$S%DJHA6G`XJEVK4.png",
-        size: 86213
-    }];
+    var query = request.query,
+        ids = query.ids,
+        idArr = ids.split(';'),
+        result = [];
+    
+    idArr.forEach(function(id) {
+        let f = files.find(file => file.id === id);
+        if(f) {
+            result.push(f);
+        }
+    });
+
+    return result;
 };

server/action/file-upload.js

@@ -14,16 +14,19 @@ module.exports = function(request, response){
             const filename = file.name;
             const size = file.size;
             const id = Date.now().toString(36) + Math.random().toString(36).substr(3);
+            //获取文件的后缀名
+            const extname = path.extname(filename);	 
     
-            const newpath = filePath + path.sep + entities.decode(filename);
-            fs.rename(oldpath, newpath, err => {
+            const shortPath = id + (extname || '');
+            const fullPath = filePath + path.sep + shortPath;
+            fs.rename(oldpath, fullPath, err => {
                 if (err) {
                     reject(err);
                 }else {
                     resolve({
                         id: id,
                         name: filename,
-                        path: newpath,
+                        path: shortPath,
                         size: size
                     })
                 }

ux/form/field/FileTag.js

@@ -16,32 +16,31 @@ Ext.define('Ext.ux.form.field.FileTag', {
         this.download();
 	},
 	onTrigger2Click: function(){
+
+		if(typeof this.up('mfilefield').remove === 'function') {
+			this.up('mfilefield').remove(this.getFileInfo());
+		}
+	},
+
+	getFileInfo: function() {
 		var me = this;
-		console.log('delete...');
-		// saas.util.BaseUtil.warnMsg('确定删除' + me.value, function(btn){
-		// 	if(btn == 'yes'){
-        //         var v = me.ownerCt.value.replace(me._id+';','')
-        //         me.ownerCt.setValue(v);
-        //         me.ownerCt.remove(me)
-		// 		// var v = me.ownerCt.down('hidden').value.replace(me.filepath + ';', '');
-		// 		// me.updateAttachField(v, '删除附件', function(){
-		// 		// 	me.ownerCt.down('hidden').setValue(v);
-		// 		// 	me.ownerCt.filesize -= me.filesize;
-		// 		// 	me.ownerCt.setTitle('<img src="' + basePath + 'resource/images/icon/clip.png" width=20 height=20/>附件' + 
-		// 		// 			'(总大小:' + Ext.util.Format.fileSize(me.ownerCt.filesize) + ")");
-		// 		// });
-		// 	}
-		// });
+		return {
+			id: me.fileId,
+			name: me.fileName,
+			path: me.filePath,
+			size: me.fileSize
+		}
 	},
+
 	download : function() {
         var me = this;
 		var serverOptions = Ext.manifest.server;
-		window.open((serverOptions.basePath.https?serverOptions.basePath.https:serverOptions.basePath) + '/file/download?filename='+me.fileName);
+		window.open((serverOptions.basePath.https?serverOptions.basePath.https:serverOptions.basePath) + '/file/download?filename='+me.fileName+'&path='+me.filePath+'&size='+me.fileSize);
 	},
 
 	
 	showAttach : function() {
-		var me = this,src = basePath + 'common/download.action?path=' + me.realpath.replace(/\+/g, '%2B')+"&size="+me.filesize+"&fileName="+me.fileName;
+		var me = this,src = basePath + 'common/download.action?path=' + me.filePath.replace(/\+/g, '%2B')+"&size="+me.fileSize+"&fileName="+me.fileName;
 		var img = document.createElement("img");
 		img.src = src;		 		
 		myWindow=window.open(); 

ux/form/field/MFileField.js

@@ -8,6 +8,8 @@ Ext.define('Ext.ux.form.field.MFileField', {
 	defaultBindProperty: 'value',
 	
 	isFormField:true,
+	submitValue: true,
+
 	
 	columnWidth: 1,
 	cls: 'multi-file-field',
@@ -21,14 +23,9 @@ Ext.define('Ext.ux.form.field.MFileField', {
 	initComponent: function() {
 		var me = this;
 		this.title = this.fieldLabel;
-		
-		if(this.value || this.defalutValue) {
-			me.getFilesInfo(this.value || this.defalutValue).then(function(res) {
-				var filesInfo = res.data;
-				me.addFiles(filesInfo);
-			});
-		}
 
+		this.files.length = 0;
+		
 		Ext.apply(me, {
 			items: [{
 				xtype: 'hidden',
@@ -81,18 +78,33 @@ Ext.define('Ext.ux.form.field.MFileField', {
 		});
 
 		this.callParent(arguments);
+
+		if(this.value || this.defalutValue) {
+			me.initSetValue(this.value || this.defalutValue);
+		}
 	},
 
-	setValue: function(v){
+	initSetValue: function(v) {
+		this.setValue(v, true);
+	},
+
+	setValue: function(v, init){
 		var me = this,
-			items = me.items.items,
-			files = me.files,
-			newValue = '',
-			filesInfo;
+			oldValue = me.getValue(),
+			filesInfo,
+			newValue;
 		
+		me.clearAll();
 		me.getFilesInfo(v).then(function(res) {
-			var filesInfo = res.data;
-			me.addFiles(filesInfo);
+			filesInfo = res.data;
+			newValue = me.addFiles(filesInfo);
+
+			me.items.items[0].setValue(newValue);
+
+			if(!init) {
+				me.publishState('value', newValue);
+				me.fireEvent('change', this, newValue, oldValue);
+			}
 		});
 	},
 
@@ -134,7 +146,6 @@ Ext.define('Ext.ux.form.field.MFileField', {
 		var me = this,
 			items = me.items.items,
 			value = me.getValue(),
-			id,
 			oldValue = value,
 			newValue = value;
 
@@ -146,9 +157,8 @@ Ext.define('Ext.ux.form.field.MFileField', {
 			}
 		});
 
-		items[0].setValue(newValue);
-		this.publishState('value', newValue);
-		this.fireEvent('change', this, newValue, oldValue);
+		return newValue;
+		
 	},
 
 	addFile: function(fileInfo) {
@@ -174,7 +184,7 @@ Ext.define('Ext.ux.form.field.MFileField', {
 			fileForm = me.getFileForm(),
 			id = fileInfo.id,
 			name = fileInfo.name,
-			path = fileInfo.fullName,
+			path = fileInfo.path,
 			size = fileInfo.size,
 			fileText, fieldWidth, newFileTag;
 
@@ -190,9 +200,9 @@ Ext.define('Ext.ux.form.field.MFileField', {
 			columnWidth: fieldWidth,
 			readOnly: false,
 			editable: false,
-			filepath: path,
-			filesize: size,
-			_id: id,
+			filePath: path,
+			fileSize: size,
+			fileId: id,
 			fieldStyle: 'background:#E0EEEE;'
 		});
 		fileForm.add(newFileTag);
@@ -224,16 +234,15 @@ Ext.define('Ext.ux.form.field.MFileField', {
 				me.setLoading(false);
 				var res = Ext.decode(response.responseText);
 				if(res.success){
-					console.log('success');
 					var data = res.data;
 					me.addFile(data);
 				}else{
-					console.error('failure');
+					console.error('failure', res);
 				}
 			},
 			failure: function (response, opts) {
 				me.setLoading(false);
-				console.error('failure');
+				console.error('failure', response);
 			}
 		});
 	},
@@ -254,10 +263,6 @@ Ext.define('Ext.ux.form.field.MFileField', {
 					var res = Ext.decode(response.responseText);
 					if(res.success){
 						resolve(res);
-						// if(me.contains()) {
-							
-						// }
-						// me.addFiles(res.data);
 					}else{
 						reject(res);
 					}
@@ -280,9 +285,44 @@ Ext.define('Ext.ux.form.field.MFileField', {
 	},
 	
 	clearAll: function() {
+		var oldValue = this.getValue();
 		this.getFileForm().removeAll();
-		this.setValue('');
+		this.items.items[0].value = '';
 		this.files.length = 0;
+
+		this.publishState('value', '');
+		this.fireEvent('change', this, '', oldValue);
+	},
+
+	remove: function(fileInfo) {
+		var value = this.getValue(),
+			fileTags,
+			foundFileTag,
+			idx,
+			newValue;
+		if(typeof fileInfo === 'string') {
+			fileInfo = { id: fileInfo };
+		}
+
+		fileTags = this.getFileForm().items.items;
+		foundFileTag = fileTags.find(function(ft) {
+			return ft.fileId === fileInfo.id;
+		});
+		idx = this.files.findIndex(function(f) {
+			return f.id === fileInfo.id;
+		});
+
+		if(foundFileTag && idx > -1) {
+
+			newValue = value.replace(fileInfo.id + ';', '');
+
+			this.getFileForm().remove(foundFileTag);
+			this.items.items[0].setValue(newValue);
+			this.files.splice(idx, 1);
+			
+			this.publishState('value', newValue);
+			this.fireEvent('change', this, newValue, value);
+		}
 	},
 
 	getStrLength: function(str) {
@@ -291,6 +331,37 @@ Ext.define('Ext.ux.form.field.MFileField', {
         return c;
 	},
 
+	getModelData: function(includeEmptyText, isSubmitting) {
+        var me = this,
+            data = null;
+        
+        // Note that we need to check if this operation is being called from a Submit action because displayfields aren't 
+        // to be submitted,  but they can call this to get their model data. 
+        if (!me.disabled && (me.submitValue || !isSubmitting)) {
+            data = {};
+            data[me.getFieldIdentifier()] = me.getValue();
+        }
+        return data;
+	},
+
+	getSubmitData: function() {
+        var me = this,
+            data = null;
+        if (!me.disabled && me.submitValue) {
+            data = {};
+            data[me.getName()] = '' + me.getValue();
+        }
+        return data;
+    },
+	
+	getFieldIdentifier: function () {
+        return this.isEditorComponent ? this.dataIndex : this.name;
+	},
+	
+	getName: function() {
+        return this.name;
+    },
+
 	// checkUploadAmount:function(form){
 	// 	var files = form.getEl().down('input[type=file]').dom.files;
 	// 	var amounts = 0;