attachmentSimple组件上传的文件如果需要列表显示展现,参考如下修改:
使用的时候可以直接赋值到自己的.w中,然后把bind-ref改为自己的关系即可

[code lang=”xml”] <div component="$UI/system/components/justep/attachment/attachmentSimple"
actionUrl="$UI/system/service/doc/common/simpleFileStore.j"
xid="attachmentSimple4" bind-ref="$model.mainData.ref(&quot;fFJ&quot;)">
<div class="x-attachment" xid="div48">
<div class="x-attachment-content x-card-border"
xid="div49">
<div class="x-doc-process" xid="div50">
<div class="progress-bar x-doc-process-bar"
role="progressbar" style="width:0%;" xid="progressBar4"/>
</div>
<table>
<tr>
<td style="padding:8px;">附件</td>
<td>
<div class="x-attachment-cell" data-bind="visible:$state.get() == ‘upload’"
xid="div54">
<div class="x-attachment-item x-item-upload"
data-bind="visible:$state.get() == ‘upload’"
xid="div55"/>
</div>
</td>
</tr>
</table>
<table class="x-attachment-list">
<tbody data-bind="foreach:$attachmentItems">
<tr>
<td style="width:50px;padding:5px;">
<div style="width:30px;height:30px;background-size:32px;"
data-bind="style:{backgroundImage:($model.previewPicture.bind($model,$object))()}"/>
</td>
<td style="vertical-align:middle;padding:5px;">
<span data-bind="click:$model.getModel().attPreview.bind($model.getModel(),$model,$object),text:$object.realFileName.get()"/>
</td>
<td style="width:50px;padding:5px;">
<span class="glyphicon glyphicon-remove"
data-bind="click:$model.deleteFile.bind($model)"/>
</td>
<td style="width:50px;padding:5px;">
<span class="glyphicon glyphicon-arrow-down"
data-bind="click:$model.getModel().attDownload.bind($model.getModel(),$model,$object)"/>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>[/code]

需要注意点文件名预览调用的attPreview方法和点下载按钮下载调用的attDownload方法是需要在自己的js中定义的,如下:

[code lang=”js”] Model.prototype.attPreview = function(object, event) {
var realFileName = event.realFileName.get();
var storeFileName = event.storeFileName.get();
var ownerID = object.getOwnerID();
var url = object.getFileUrl(realFileName,storeFileName,ownerID,"browse");
fileApi.browse(url);
};
Model.prototype.attDownload = function(object, event) {
var realFileName = event.realFileName.get();
var storeFileName = event.storeFileName.get();
var ownerID = object.getOwnerID();
var url = object.getFileUrl(realFileName,storeFileName,ownerID,"download");
fileApi.browse(url);
};[/code] 注意需要添加fileApi的引用,如下:
[code lang=”js”] var fileApi = require("$UI/system/components/justep/docCommon/fileApi");[/code]

显示效果如下:
attachmentsimple