|
@@ -33,9 +33,18 @@
|
|
|
<el-button
|
|
|
:size="size"
|
|
|
type="text"
|
|
|
- icon="el-icon-download"
|
|
|
@click="useDownload(item)"
|
|
|
- ></el-button>
|
|
|
+ >
|
|
|
+ <el-link
|
|
|
+ icon="el-icon-download"
|
|
|
+ :href="`${baseUrl}${fileId}`"
|
|
|
+ :underline="false"
|
|
|
+ target="_blank"
|
|
|
+ @click="useDownload(item)"
|
|
|
+ />
|
|
|
+ </el-button>
|
|
|
+
|
|
|
+
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -45,73 +54,81 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-export default {
|
|
|
- name: "FilePreview",
|
|
|
- props: {
|
|
|
- // 值
|
|
|
- value: [String, Object, Array],
|
|
|
- // 组件大小
|
|
|
- size: {
|
|
|
- type: String,
|
|
|
- dafault: () => {
|
|
|
- return "mini";
|
|
|
+ export default {
|
|
|
+ name: "FilePreview",
|
|
|
+ props: {
|
|
|
+ // 值
|
|
|
+ value: [String, Object, Array],
|
|
|
+ // 组件大小
|
|
|
+ size: {
|
|
|
+ type: String,
|
|
|
+ dafault: () => {
|
|
|
+ return "mini";
|
|
|
+ },
|
|
|
},
|
|
|
},
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- separator: ";",
|
|
|
- visible: false,
|
|
|
- fileList: [],
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {},
|
|
|
- watch: {
|
|
|
- value: {
|
|
|
- handler(val) {
|
|
|
- if (val) {
|
|
|
- let temp = 1;
|
|
|
- // 首先将值转为数组
|
|
|
- const list = Array.isArray(val)
|
|
|
- ? val
|
|
|
- : this.value.split(this.separator);
|
|
|
- this.fileList = list.map((item) => {
|
|
|
- item = JSON.parse(item);
|
|
|
- return {
|
|
|
- ...item,
|
|
|
- uid: item.uid || new Date().getTime() + temp++,
|
|
|
- };
|
|
|
- });
|
|
|
- } else {
|
|
|
- this.fileList = [];
|
|
|
- return [];
|
|
|
- }
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ baseUrl: "https://sy.derom.com/document-center/fastdfs/download?id=",
|
|
|
+ fileId: "",
|
|
|
+ separator: ";",
|
|
|
+ visible: false,
|
|
|
+ fileList: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ watch: {
|
|
|
+ value: {
|
|
|
+ handler(val) {
|
|
|
+ if (val) {
|
|
|
+ let temp = 1;
|
|
|
+ // 首先将值转为数组
|
|
|
+ const list = Array.isArray(val)
|
|
|
+ ? val
|
|
|
+ : this.value.split(this.separator);
|
|
|
+ this.fileList = list.map((item) => {
|
|
|
+ item = JSON.parse(item);
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ uid: item.uid || new Date().getTime() + temp++,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.fileList = [];
|
|
|
+ return [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true,
|
|
|
+ immediate: true,
|
|
|
},
|
|
|
- deep: true,
|
|
|
- immediate: true,
|
|
|
},
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //
|
|
|
- useDownload(prop) {
|
|
|
- const { url, name } = prop;
|
|
|
- this.download("/pu/contract/download/resource", { resource: url }, name);
|
|
|
+ methods: {
|
|
|
+ //
|
|
|
+ useDownload(prop) {
|
|
|
+ const {url, name, id} = prop;
|
|
|
+ // this.download("/pu/contract/download/resource", {resource: url}, name);
|
|
|
+ this.fileId = id
|
|
|
+ // this.download("https://sy.derom.com/document-center/fastdfs/download", {id});
|
|
|
+ },
|
|
|
+ //
|
|
|
+ useView(prop) {
|
|
|
+ this.$notify.info({title: "暂不支持查看"});
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
},
|
|
|
- //
|
|
|
- useView(prop) {
|
|
|
- this.$notify.info({ title: "暂不支持查看" });
|
|
|
+ mounted() {
|
|
|
},
|
|
|
- },
|
|
|
- created() {},
|
|
|
- mounted() {},
|
|
|
- destroyed() {},
|
|
|
-};
|
|
|
+ destroyed() {
|
|
|
+ },
|
|
|
+ };
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
-.file-preview_content > div {
|
|
|
- margin-bottom: 10px;
|
|
|
-}
|
|
|
-.file-preview_content > div:last-of-type {
|
|
|
- margin-bottom: 0;
|
|
|
-}
|
|
|
+ .file-preview_content > div {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .file-preview_content > div:last-of-type {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
</style>
|