<template>
|
<div class="flex_column">
|
<TableCard title="沟通记录" :showForm="isDepartment">
|
<template v-slot:form >
|
<div class="w100 items_center justify_between" v-if="isDepartment">
|
<div></div>
|
<div>
|
<!-- <el-button type="primary" size="small">导出</el-button> -->
|
<el-button type="primary" size="small" @click="openDialog">新增</el-button>
|
</div>
|
</div>
|
</template>
|
<template v-slot:table>
|
<ZTTable
|
style="margin-top: 18px; padding: 0 15px;"
|
:height="'calc(100vh - 21em)'"
|
:column="columnData"
|
:table-data="tableData"
|
:table-loading="loading"
|
></ZTTable>
|
<el-divider></el-divider>
|
<div class="pagination">
|
<div></div>
|
<el-pagination
|
:page-sizes="[10, 20, 30, 40]"
|
:page-size="pagination.pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="pagination.total"
|
@current-change=""
|
@size-change=""
|
>
|
</el-pagination>
|
</div>
|
</template>
|
</TableCard>
|
<Add ref="communicateModal" @submit="getTableData"></Add>
|
</div>
|
</template>
|
<script>
|
import TableCard from "../../../TableCard/index.vue"
|
import ZTTable from "../../../ZTTable/index.vue"
|
import Add from "./Add.vue"
|
import {
|
personPersonCommunicationAbilityPage,
|
deletePersonCommunicationAbility,
|
exportPersonCommunicationAbility
|
} from "../../../../../assets/api/api.js"
|
|
export default {
|
components: {
|
TableCard,
|
ZTTable,
|
Add
|
},
|
props: {
|
departId: {
|
type: Number,
|
default: () => {
|
return null;
|
}
|
},
|
isDepartment: {
|
type: Boolean,
|
default: false
|
}
|
},
|
data() {
|
return {
|
// departId: 0,
|
columnData: [
|
{
|
label: '序号',
|
prop: 'id'
|
}, {
|
label: '沟通人',
|
prop: 'userName'
|
}, {
|
label: '沟通时间',
|
prop: 'communicationTime'
|
}, {
|
label: '沟通地点',
|
prop: 'communicationPlace'
|
}, {
|
label: '沟通内容',
|
prop: 'communicationContent'
|
}, {
|
label: '操作',
|
dataType: 'action',
|
operation: [
|
{
|
name: '编辑',
|
type: 'text',
|
clickFun: (row) => {
|
this.openDialog(row, true)
|
}
|
}, {
|
name: '下载',
|
type: 'text',
|
clickFun: (row) => {
|
this.handleDown(row)
|
}
|
}, {
|
name: '删除',
|
type: 'text',
|
color: '#f56c6c',
|
clickFun: (row) => {
|
this.delPerson(row.id)
|
}
|
}
|
]
|
},
|
],
|
tableData: [],
|
pagination: {
|
current: 1,
|
pageSize: 20,
|
total: 0
|
},
|
loading: false
|
}
|
},
|
mounted() {
|
this.getTableData()
|
},
|
methods: {
|
openDialog(row, type=false) {
|
this.$refs.communicateModal.openDialog(row, type)
|
},
|
async getTableData() {
|
this.loading = true
|
const params = this.isDepartment ? {
|
departLimsId: this.departId,
|
current: this.pagination.current,
|
size: this.pagination.pageSize
|
} : {
|
userId: this.departId,
|
current: this.pagination.current,
|
size: this.pagination.pageSize
|
}
|
const { code, data } = await this.$axios({
|
method: 'get',
|
url: personPersonCommunicationAbilityPage,
|
params: params
|
})
|
if(code == 200) {
|
this.pagination.total = data.total
|
this.tableData = data.records
|
this.loading = false
|
}
|
},
|
/**
|
* @desc 获取设备id
|
*/
|
getDepart(id) {
|
this.departId = id
|
this.getTableData()
|
},
|
/**
|
* @desc 删除沟通记录
|
*/
|
delPerson(id) {
|
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(async () => {
|
let formData = new FormData()
|
formData.append('id', id)
|
const { code } = await this.$axios({
|
method: 'delete',
|
url: deletePersonCommunicationAbility,
|
data: formData
|
})
|
if(code == 200) {
|
this.$message({
|
type: 'success',
|
message: '删除成功!'
|
});
|
this.getTableData()
|
}
|
})
|
},
|
async handleDown(row){
|
this.$axios.post(this.$api.personCommunicationAbility.exportPersonCommunicationAbility,{id:row.id},{responseType: "blob"}).then(res => {
|
if(res.code == 201){
|
this.$message.error(res.message)
|
return
|
}
|
const blob = new Blob([res],{ type: 'application/octet-stream' });
|
//将Blob 对象转换成字符串
|
let reader = new FileReader();
|
reader.readAsText(blob, 'utf-8');
|
reader.onload = () => {
|
try {
|
let result = JSON.parse(reader.result);
|
if (result.message) {
|
this.$message.error(result.message);
|
} else {
|
const url = URL.createObjectURL(blob);
|
const link = document.createElement('a');
|
link.href = url;
|
link.download = row.userName+'-沟通记录'+'.docx';
|
link.click();
|
this.$message.success('导出成功')
|
}
|
} catch (err) {
|
console.log(err);
|
const url = URL.createObjectURL(blob);
|
const link = document.createElement('a');
|
link.href = url;
|
link.download = row.userName+'-沟通记录'+'.docx';
|
link.click();
|
this.$message.success('导出成功')
|
}
|
}
|
})
|
}
|
},
|
watch: {
|
departId: {
|
handler(newId, oldId) {
|
if (newId) {
|
this.getTableData();
|
}
|
}
|
}
|
}
|
}
|
</script>
|
<style scoped>
|
.flex_column {
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
.w100 {
|
width: 100%;
|
}
|
.pagination {
|
display: flex;
|
justify-content: space-between
|
}
|
.items_center {
|
display: flex;
|
align-items: center;
|
}
|
.justify_between {
|
justify-content: space-between
|
}
|
.date_box {
|
margin: 0 5px;
|
}
|
|
.search {
|
width: 150px;
|
padding: 0 16px;
|
}
|
</style>
|
