<template> <div> <a-row> <a-col :span="24"> <div class="tb-title"> <span>附件清单</span> </div> </a-col> </a-row> <a-row type="flex" class="row_center"> <a-col :span="2" class="bg-gray" style="text-align: center;"> <div class="special-middle"> <div>序号</div> </div> </a-col> <a-col :span="8" class="bg-gray" style="text-align: center;"> <div class="special-middle"> <div>文件名</div> </div> </a-col> <a-col :span="2" class="bg-gray" style="text-align: center;"> <div class="special-middle"> <div>是否必备材料</div> </div> </a-col> <a-col :span="10" class="bg-gray" style="text-align: center;"> <div class="special-middle"> <div>附件名称</div> </div> </a-col> <a-col :span="2" class="bg-gray" style="text-align: center;"> <div class="special-middle"> <div>操作</div> </div> </a-col> </a-row> <a-row v-for="(item, index) in fileList" :key="'appendix' + index" type="flex" class="row_center"> <a-col :span="2" style="text-align: center;"> <div class="special-middle"> <div>{{index + 1}}</div> </div> </a-col> <a-col :span="8" style="text-align: center;"> <div class="special-middle"> <div v-if="item.fileName" style="text-align: left;"> <!-- {{item.fileName}} --> <document-view :fileUrl="item.downloadUrl" :fileName="item.fileName" :imageArray="[item.downloadUrl]"></document-view> </div> <div v-else>无</div> </div> </a-col> <a-col :span="2" style="text-align: center;"> <div class="special-middle"> <div>{{ item.isRequired == true ? "是" : "否" }}</div> </div> </a-col> <a-col :span="10" style="text-align: center;"> <div class="special-middle"> <div>{{item.fileExplain}}<span v-if="item.isRequired" style="color:red;">*</span></div> </div> </a-col> <a-col :span="2" style="text-align: center;"> <div class="special-middle"> <div v-if="item.downloadUrl"><a :href="item.downloadUrl" :download="item.fileName">下载</a></div> </div> </a-col> </a-row> </div> </template> <script> import documentView from '@/views/components/common/documentView' const File = { fileName: "", downloadUrl: "", fileExplain: "", downloadId: "" }; export default { name: "FileInfo", components: { documentView }, props: { fileList: { type: Array, default: () => { return [{ ...File }]; }, }, }, data() { return { }; }, created () { }, methods: { }, }; </script>