需求:例,当前有人员表、文件表,文件中存储当前人员的不同类型文件,通过filetype字段区分,编辑时需要传输filetype字段获取相应数据。(在编辑页面的基础上编辑文件表内容)
代码:vue
自定义传输字段fileType,传输值为"demand"(自定义传输对象 :fileType,方法为"method")
<el-button type="primary" @click="edit" fileType="demand">编 辑</el-button>
文件表的增删改查,
1.在props中定义fileType类型为字符串
2.data中的fileType需要将传输过来的值赋上
3.查询列表中的fileType参数需要赋上
<template>
<div>
<VxeTablePkg
:fields="fields" :objId="objId"
info="文件信息" id-field="id" :init-obj="initObj"
:get-data="getList" :save-item="saveItem"
:edit-item="updateItem" :del-item="delItem"
/>
</div>
</template>
<script>
import VxeTablePkg from '@/views/srm/components/VxeTablePkg'
import { listFiledata, addFiledata, updateFiledata, delFiledata } from '@/api/srm/project/filedata'
export default {
name: 'Filedata',
props: {
objId: {
type: Number
},
obj: {
type: Object
},
//设置字段类型为字符串
fileType:{
type: String
},
},
components: { VxeTablePkg },
data() {
return {
fields: [],
initObj: {
personId: this.objId
,year: null
,fileName: null
,fileId: null
//将编辑页的fileType(demand)赋值到当前页的fileType
,fileType: this.fileType
}
}
},
created() {
},
watch: {
obj: {
handler(value) {
if (value) {
this.initObj.personId= this.objId
}
},
deep: true
}
},
beforeMount() {
this.fields = [
{field: 'year', title: '年度', type: 'input' }
,{field: 'fileName', title: '文件名称', type: 'input'}
,{field: 'fileId', title: '附件', type: 'upload', fileField: 'fileInfo',multiple:false}
]
},
methods: {
// 获取列表
async getList() {
let that = this
let list = await listFiledata({
//将人员id、文件类型赋值,然后查询list
personId: that.objId,
fileType: that.fileType,
pageNum: 1,
pageSize: 999,
orderByColumn: 'createTime',
isAsc: 'asc'
})
return list
},
// 添加
saveItem(item) {
return addFiledata(item)
},
// 更新
updateItem(item) {
return updateFiledata(item)
},
// 删除
delItem(id) {
return delFiledata(id)
}
}
}
</script>
<style>
</style>