<template>
|
<div class="main">
|
<div class="inner" ref="wraper">
|
<a-spin class="" :spinning="spinning" tip="拼命加载中...">
|
<a-card>
|
<advance-table
|
ref="table"
|
class="doc-center-table"
|
:data-source="dataSource"
|
:columns="columns"
|
title=""
|
row-key="parentModel"
|
@search="onSearch"
|
@refresh="onRefresh"
|
@reset="onReset"
|
:format-conditions="true"
|
:scroll="{ x: 400, y }"
|
:pagination="{
|
current: pageCurr,
|
pageSize: pageSize,
|
total: total,
|
showSizeChanger: true,
|
showLessItems: true,
|
showQuickJumper: true,
|
pageSizeOptions: ['10', '20', '50', '100'],
|
showTotal: (total, range) =>
|
`第 ${range[0]}-${range[1]} 条，总计 ${total} 条`,
|
onChange: onPageChange,
|
onShowSizeChange: onSizeChange,
|
}"
|
>
|
<template slot="title">
|
<span class="title">软件中心</span>
|
</template>
|
<template slot="action" slot-scope="{ record }">
|
<template v-if="downloadFlag">
|
<a @click="download(record)">下载</a>
|
</template>
|
</template>
|
</advance-table>
|
</a-card>
|
</a-spin>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import AdvanceTable from "@/components/table/advance/AdvanceTable";
|
|
import { getList, downLoadSoftware } from "./apis";
|
import { mapGetters } from "vuex";
|
|
export default {
|
name: "",
|
data() {
|
return {
|
spinning: false,
|
loading: false,
|
pageCurr: 1,
|
pageSize: 10,
|
total: 0,
|
y: 400,
|
update: -1,
|
conditions: {},
|
columns: [
|
{
|
title: "关联产品母料型号",
|
dataIndex: "parentModel",
|
key: "parentModel",
|
align: "center",
|
width: 180,
|
searchAble: true,
|
},
|
{
|
title: "软件名称",
|
dataIndex: "softwareName",
|
key: "softwareName",
|
align: "center",
|
noSearch: true,
|
width: 160,
|
},
|
{
|
title: "操作",
|
dataIndex: "operation",
|
key: "operation",
|
align: "center",
|
width: 168,
|
fixed: "right",
|
scopedSlots: { customRender: "action" },
|
},
|
],
|
dataSource: [],
|
};
|
},
|
components: {
|
AdvanceTable,
|
},
|
methods: {
|
onSearch(conditions, searchOptions) {
|
// console.log(conditions);
|
// console.log(searchOptions);
|
this.pageCurr = 1;
|
this.conditions = conditions;
|
this.searchData();
|
},
|
onPageChange(page, pageSize) {
|
this.pageCurr = page;
|
this.pageSize = pageSize;
|
this.searchData();
|
},
|
onSizeChange(current, size) {
|
this.pageCurr = 1;
|
this.pageSize = size;
|
this.searchData();
|
},
|
onRefresh(conditions) {
|
this.conditions = conditions;
|
this.searchData();
|
},
|
onReset(conditions) {
|
this.conditions = conditions;
|
this.searchData();
|
},
|
searchData() {
|
const { pageCurr, pageSize, conditions } = this;
|
let params = {};
|
Object.keys(conditions).forEach((v) => {
|
params[v] = conditions[v];
|
});
|
let data = {
|
pageSize,
|
pageCurr,
|
...params,
|
};
|
getList(pageCurr, pageSize, params).then((res) => {
|
res = res.data;
|
console.log(res);
|
let data = [];
|
let total = 0;
|
if (res.code && res.data) {
|
data = res.data2.list;
|
total = res.data2.total;
|
}
|
this.dataSource = data;
|
this.total = total;
|
if (-1 == this.update) {
|
this.update = Math.random();
|
}
|
});
|
},
|
download(obj) {
|
const { parentModel, softwareName } = obj;
|
downLoadSoftware(softwareName).then((res) => {
|
console.log(res, "===========");
|
let { headers, data, status } = res;
|
if (200 == status && data) {
|
let url = window.URL.createObjectURL(data);
|
const matchRes = /filename=(.*)/.exec(headers["content-disposition"]);
|
const fileName = matchRes ? decodeURI(matchRes[1].trim()) : "未知文件名.zip";
|
let link = document.createElement("a");
|
link.style.display = "none";
|
link.href = url;
|
link.download = fileName;
|
document.body.appendChild(link);
|
link.click();
|
document.body.removeChild(link);
|
window.URL.revokeObjectURL(url);
|
} else {
|
this.$message.error("操作失败");
|
}
|
});
|
},
|
resize() {
|
setTimeout(() => {
|
this.update = Math.random();
|
}, 200);
|
},
|
},
|
watch: {
|
update(n) {
|
if (-1 != n) {
|
// this.$nextTick(() => {
|
// const table = this.$refs.table;
|
// const header = document.querySelectorAll(
|
// ".doc-center-table .ant-table-header"
|
// )[0].clientHeight;
|
// const bar = document.querySelectorAll(".header-bar")[0].clientHeight;
|
// if (table.fullScreen) {
|
// this.y = table.$el.clientHeight - bar - header - 64;
|
// } else {
|
// const wraper = this.$refs.wraper.clientHeight;
|
// const card = document.querySelectorAll(".ant-card-body")[0];
|
// const { paddingBottom, paddingTop } = getComputedStyle(card, null);
|
// const h =
|
// wraper -
|
// header -
|
// 64 -
|
// bar -
|
// parseInt(paddingBottom) -
|
// parseInt(paddingTop);
|
// // console.log(h, "h",wraper, header, bar );
|
// this.y = h;
|
// }
|
// });
|
}
|
},
|
},
|
computed: {
|
...mapGetters("account", ["downloadFlag"]),
|
},
|
mounted() {
|
this.searchData();
|
window.addEventListener("resize", this.resize);
|
},
|
destroyed() {
|
window.removeEventListener("resize", this.resize);
|
},
|
};
|
</script>
|
|
<style scoped lang="less">
|
.main {
|
height: 100%;
|
position: relative;
|
.inner {
|
position: absolute;
|
left: 0;
|
top: 0;
|
right: 0;
|
bottom: 0;
|
}
|
}
|
/deep/table {
|
table-layout: fixed;
|
}
|
</style>
|
