<template>
|
<div class="">
|
<a-table
|
ref="aTable"
|
size="small"
|
:scroll="{ y }"
|
bordered
|
:columns="columns"
|
:data-source="dataSource"
|
:pagination="false"
|
:rowKey="(record, index) => index"
|
:rowClassName="(record) => (1 == record.lockFlag ? 'is-lock' : '')"
|
>
|
<template slot="action" slot-scope="text, record">
|
<div v-if="record.url">
|
<a v-if="!record.lockFlag && ((record.fileType == 'dwg' && canViewDoc) || (record.fileType != 'dwg' && canViewOther))" @click="view(record)">预览</a>
|
<template v-if="((record.fileType == 'dwg' && canDownloadDoc) || (record.fileType != 'dwg' && canDownloadOther)) && !record.lockFlag">
|
<a-divider type="vertical"></a-divider>
|
<a @click="downloadLog(record)">下载</a>
|
</template>
|
<template v-if="canLockOther && (id || productId)">
|
<a-divider v-if="!record.lockFlag" type="vertical"></a-divider>
|
<a @click="lock(record)">{{ record.lockFlag ? "解锁" : "锁定" }}</a>
|
</template>
|
</div>
|
</template>
|
</a-table>
|
<a-modal
|
:width="600"
|
:visible="previewVisible"
|
:footer="null"
|
@cancel="handleCancel"
|
>
|
<img alt="example" style="width: 100%" :src="imgUrl" />
|
</a-modal>
|
<a-modal
|
:width="400"
|
:visible="reasonVisible"
|
title="操作原因"
|
:destroyOnClose="true"
|
:maskClosable="false"
|
@cancel="reasonCancel"
|
@ok="reasonOk"
|
>
|
<a-form-model-item ref="name" label="操作原因">
|
<a-input
|
type="textarea"
|
v-model="reason"
|
placeHolder="请输入操作原因"
|
/>
|
</a-form-model-item>
|
</a-modal>
|
</div>
|
</template>
|
|
<script>
|
import getWebUrl from "@/assets/js/tools/getWebUrl";
|
import { dwgReview } from "@/pages/workplace/apis";
|
import { downloadLog } from "@/pages/system/logs/apis";
|
import { updateAttachLock } from "@/pages/resourceManage/materialsCenter/apis";
|
import { updateProductLock } from "@/pages/resourceManage/product/details/apis";
|
import checkPermit from "@/assets/js/tools/checkPermit";
|
import PERMITS from "@/assets/js/const/const_permits";
|
import { mapGetters } from "vuex";
|
export default {
|
name: "",
|
props: {
|
list: {
|
type: Array,
|
default() {
|
return [];
|
},
|
},
|
info: {
|
type: Object,
|
default() {
|
return null;
|
},
|
},
|
},
|
data() {
|
const columns = [
|
{
|
title: "文件名称",
|
dataIndex: "fileName",
|
align: "center",
|
width: 200,
|
},
|
{
|
title: "文件类型",
|
dataIndex: "fileType",
|
align: "center",
|
width: 100,
|
},
|
{
|
title: "操作原因",
|
dataIndex: "localReason",
|
align: "center",
|
},
|
{
|
title: "操作",
|
dataIndex: "operation",
|
key: "operation",
|
align: "center",
|
width: 140,
|
scopedSlots: { customRender: "action" },
|
},
|
];
|
return {
|
reason: "",
|
reasonVisible: false,
|
currObj: null,
|
columns,
|
y: 500,
|
imgUrl: "",
|
previewVisible: false,
|
webUrl: getWebUrl(),
|
};
|
},
|
methods: {
|
handleClick() {
|
this.$emit("success", this.list);
|
},
|
view(obj) {
|
switch (obj.fileType) {
|
// 图片
|
case "bmp":
|
case "jpg":
|
case "jpeg":
|
case "png":
|
this.imgUrl = this.webUrl + obj.url;
|
this.previewVisible = true;
|
break;
|
case "pdf":
|
window.open(this.webUrl + obj.url);
|
break;
|
case "doc":
|
case "docx":
|
case "dwg":
|
this.dwgReview(obj.url);
|
break;
|
default:
|
this.$message.warn("该类型文件暂不支持预览");
|
break;
|
}
|
},
|
handleCancel() {
|
this.previewVisible = false;
|
},
|
dwgReview(url) {
|
let loading = this.$layer.loading();
|
dwgReview(url)
|
.then((res) => {
|
let { code, data, msg } = res.data;
|
if (code && data) {
|
window.open(this.webUrl + data);
|
} else {
|
this.$message.error(msg);
|
}
|
this.$layer.close(loading);
|
})
|
.catch((error) => {
|
console.log(error);
|
this.$layer.close(loading);
|
});
|
},
|
downloadLog(record) {
|
const { parentModel, subModel, url } = record;
|
const url1 = this.webUrl + url;
|
let link = document.createElement("a");
|
link.style.display = "none";
|
link.href = url1;
|
// link.download = fileName;
|
document.body.appendChild(link);
|
link.click();
|
document.body.removeChild(link);
|
downloadLog(parentModel, subModel);
|
},
|
lock(obj) {
|
this.currObj = obj;
|
this.reason = "";
|
this.reasonVisible = true;
|
},
|
reasonCancel() {
|
this.reasonVisible = false;
|
},
|
reasonOk() {
|
if (!this.id && !this.productId) {
|
this.$message.error("无效的ID");
|
return false;
|
}
|
let obj = this.currObj;
|
let lockFlag = !obj.lockFlag * 1;
|
let isProd = !!this.productId;
|
let params = {
|
attachName: obj.fileName,
|
localReason: this.reason,
|
lockFlag,
|
materialId: this.id ? this.id : undefined,
|
productId: this.productId ? this.productId : undefined
|
};
|
let update = isProd ? updateProductLock : updateAttachLock;
|
update([params]).then((res) => {
|
const { code, data, msg } = res.data;
|
if (code && data) {
|
this.$message.success("操作成功");
|
obj.lockFlag = lockFlag;
|
obj.localReason = this.reason;
|
this.reasonVisible = false;
|
} else {
|
this.$message.error("操作失败");
|
}
|
});
|
},
|
},
|
computed: {
|
dataSource() {
|
let attachLocks = this.attachLocks;
|
let reg = /(.*\\+)*(.*)$/;
|
return this.list.map((item) => {
|
let fileName = item.match(reg)[2];
|
let arr = fileName.split(".");
|
let fileType = arr.length ? arr[arr.length - 1].toLowerCase() : "";
|
let localReason = "";
|
let lockFlag = 0;
|
attachLocks.forEach((v) => {
|
if (v.attachName == fileName) {
|
localReason = v.localReason;
|
lockFlag = v.lockFlag;
|
}
|
});
|
return {
|
fileName,
|
fileType,
|
url: item,
|
localReason,
|
lockFlag,
|
};
|
});
|
},
|
id() {
|
return this.info ? this.info.id : 0;
|
},
|
productId() {
|
return this.info ? this.info.productId : 0;
|
},
|
attachLocks() {
|
return this.info ? this.info.attachLocks : [];
|
},
|
...mapGetters("account", ["permits"]),
|
canDownloadOther() {
|
return checkPermit(PERMITS.downloadOther, this.permits);
|
},
|
canDownloadDoc() {
|
return checkPermit(PERMITS.downloadDoc, this.permits);
|
},
|
canLockOther() {
|
return checkPermit(PERMITS.lockOther, this.permits);
|
},
|
canViewOther() {
|
return checkPermit(PERMITS.viewOther, this.permits);
|
},
|
canViewDoc() {
|
return checkPermit(PERMITS.viewDoc, this.permits);
|
},
|
},
|
mounted() {},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
/deep/.is-lock td {
|
background: #ddd;
|
}
|
</style>
|
