自定义表头

This commit is contained in:
zyx.net
2023-01-09 15:57:58 +08:00
parent dba8529941
commit 8038fa4d7a
3 changed files with 120 additions and 60 deletions
+4
View File
@@ -136,4 +136,8 @@
}
.ant-tooltip-arrow::before {
background-color: #fff;
}
.customizetable .ant-table-thead > tr > th {
//padding: 12px 8px;
min-height: 46px;
}
@@ -11,11 +11,11 @@
<div style="margin-bottom: 60px">
<a-table
:columns="columns"
rowKey="id"
:rowKey="record=> record.key"
:scroll="{x: 800}"
:data-source="dataList"
:pagination="false"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange,columnTitle:' ',getCheckboxProps: getCheckboxProps }"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange,columnTitle:'',getCheckboxProps: getCheckboxProps }"
:loading="loading">
</a-table>
@@ -69,7 +69,7 @@ export default {
headFieldCn:'编号',
headFieldEn:'Number',
field: 'serialNumber',
id: '1',
key: 1,
moduleFlag:'法规清单',
status:1,
},
@@ -79,7 +79,7 @@ export default {
headFieldCn:'标题',
headFieldEn:'title',
field: 'title',
id: '2',
key: 2,
moduleFlag:'法规清单',
status:2,
},
@@ -89,7 +89,7 @@ export default {
headFieldCn:'子标题',
headFieldEn:'Sub-title',
field: 'subtitle',
id: '3',
key: 3,
moduleFlag:'法规清单',
},
{
@@ -98,7 +98,7 @@ export default {
headFieldCn:'清单确认状态',
headFieldEn:'List Confirmation Status',
field: 'inventoryAffirmStatusName',
id: '4',
key: 4,
moduleFlag:'法规清单',
},
{
@@ -107,7 +107,7 @@ export default {
headFieldCn:'任务确认状态',
headFieldEn:'Task Confirmation Status',
field: 'taskAffirmStatusName',
id: '5',
key: 5,
moduleFlag:'法规清单',
},
{
@@ -116,7 +116,7 @@ export default {
headFieldCn:'适用地区',
headFieldEn:'Area',
field: 'region_dictText',
id: '6',
key: 6,
moduleFlag:'法规清单',
},
{
@@ -125,7 +125,7 @@ export default {
headFieldCn:'对应标准',
headFieldEn:'Compare EU/CN',
field: 'correspondingStandard',
id: '7',
key: 7,
moduleFlag:'法规清单',
},
{
@@ -134,7 +134,7 @@ export default {
headFieldCn:'实施类别',
headFieldEn:'Usage',
field: 'implementType_dictText',
id: '8',
key: 8,
moduleFlag:'法规清单',
},
{
@@ -143,7 +143,7 @@ export default {
headFieldCn:'标准实施日期',
headFieldEn:'New Type Execution Date',
field: 'xin1Che1Xing2Shi2Shi1Ri4Qi1',
id: '9',
key: 9,
moduleFlag:'法规清单',
},
{
@@ -152,7 +152,7 @@ export default {
headFieldCn:'在产车实施日期',
headFieldEn:'New Vehicle Execution Date',
field: 'implementTime',
id: '10',
key: 10,
moduleFlag:'法规清单',
},
{
@@ -161,7 +161,7 @@ export default {
headFieldCn:'认证类型',
headFieldEn:'Certification Type',
field: 'attestationType_dictText',
id: '11',
key: 11,
moduleFlag:'法规清单',
},
{
@@ -170,7 +170,7 @@ export default {
headFieldCn:'认证级别',
headFieldEn:'Certification Level',
field: 'attestationRank_dictText',
id: '12',
key: 12,
moduleFlag:'法规清单',
},
{
@@ -179,7 +179,7 @@ export default {
headFieldCn:'适用增补件',
headFieldEn:'Applicable Supplement',
field: 'applicableSupplement',
id: '13',
key: 13,
moduleFlag:'法规清单',
},
{
@@ -188,7 +188,7 @@ export default {
headFieldCn:'WVTA ID',
headFieldEn:'WVTA ID',
field: 'wvtaId',
id: '14',
key: 14,
moduleFlag:'法规清单',
},
{
@@ -197,7 +197,7 @@ export default {
headFieldCn:'责任领域',
headFieldEn:'Responsible Field',
field: 'dutyTerritory_dictText',
id: '15',
key: 15,
moduleFlag:'法规清单',
},
{
@@ -206,7 +206,7 @@ export default {
headFieldCn:'法规工程师',
headFieldEn:'Regulation Engineer',
field: 'regulationOwnerName',
id: '16',
key: 16,
moduleFlag:'法规清单',
},
{
@@ -215,7 +215,7 @@ export default {
headFieldCn:'认证工程师',
headFieldEn:'Homo Engineer',
field: 'homologationEngineerName',
id: '17',
key: 17,
moduleFlag:'法规清单',
},
{
@@ -224,7 +224,7 @@ export default {
headFieldCn:'工程接口人',
headFieldEn:'Eng. Interface',
field: 'engineeringInterfacePersonName',
id: '18',
key: 18,
moduleFlag:'法规清单',
},
{
@@ -233,7 +233,7 @@ export default {
headFieldCn:'备注',
headFieldEn:'Comments',
field: 'remark',
id: '19',
key: 19,
moduleFlag:'法规清单',
},
{
@@ -243,7 +243,7 @@ export default {
headFieldEn:'Deliverables',
field: 'designDeliverableTemplateName',
affirmFlag:'1',
id: '20',
key: 20,
moduleFlag:'法规清单',
},
{
@@ -253,7 +253,7 @@ export default {
headFieldEn:'Creator',
field: 'designInitiatorName',
affirmFlag:'1',
id: '21',
key: 21,
moduleFlag:'法规清单',
},
{
@@ -263,7 +263,7 @@ export default {
headFieldEn:'Assignee',
field: 'designDutyName',
affirmFlag:'1',
id: '22',
key: 22,
moduleFlag:'法规清单',
},
{
@@ -273,7 +273,7 @@ export default {
headFieldEn:'Due Date',
field: 'designDueDate',
affirmFlag:'1',
id: '23',
key: 23,
moduleFlag:'法规清单',
},
{
@@ -283,7 +283,7 @@ export default {
headFieldEn:'Instruction',
field: 'designRemark',
affirmFlag:'1',
id: '24',
key: 24,
moduleFlag:'法规清单',
},
{
@@ -293,7 +293,7 @@ export default {
headFieldEn:'Deliverables',
field: 'prehomoDeliverableTemplateName',
affirmFlag:'2',
id: '25',
key: 25,
moduleFlag:'法规清单',
},
{
@@ -303,7 +303,7 @@ export default {
headFieldEn:'Creator',
field: 'prehomoInitiatorName',
affirmFlag:'2',
id: '26',
key:26,
moduleFlag:'法规清单',
},
{
@@ -313,7 +313,7 @@ export default {
headFieldEn:'Assignee',
field: 'prehomoDutyName',
affirmFlag:'2',
id: '27',
key: 27,
moduleFlag:'法规清单',
},
{
@@ -323,7 +323,7 @@ export default {
headFieldEn:'Due Date',
field: 'prehomoDueDate',
affirmFlag:'2',
id: '28',
key: 28,
moduleFlag:'法规清单',
},
{
@@ -333,7 +333,7 @@ export default {
headFieldEn:'Instruction',
field: 'prehomoRemark',
affirmFlag:'2',
id: '29',
key: 29,
moduleFlag:'法规清单',
},
{
@@ -343,7 +343,7 @@ export default {
headFieldEn:'Deliverables',
field: 'verifyDeliverableTemplateName',
affirmFlag:'3',
id: '30',
key: 30,
moduleFlag:'法规清单',
},
{
@@ -353,7 +353,7 @@ export default {
headFieldEn:'Creator',
field: 'verifyInitiatorName',
affirmFlag:'3',
id: '31',
key: 31,
moduleFlag:'法规清单',
},
{
@@ -363,7 +363,7 @@ export default {
headFieldEn:'Assignee',
field: 'verifyDutyName',
affirmFlag:'3',
id: '32',
key: 32,
moduleFlag:'法规清单',
},
{
@@ -373,7 +373,7 @@ export default {
headFieldEn:'Due Date',
field: 'verifyDueDate',
affirmFlag:'3',
id: '33',
key: 33,
moduleFlag:'法规清单',
},
{
@@ -383,7 +383,7 @@ export default {
headFieldEn:'Instruction',
field: 'verifyRemark',
affirmFlag:'3',
id: '34',
key: 34,
moduleFlag:'法规清单',
},
{
@@ -391,12 +391,13 @@ export default {
name: this.$t('operation'),
headFieldCn:'操作',
headFieldEn:'Operation',
id: '35',
key: 35,
moduleFlag:'法规清单',
status:2,
},
],
content: [],
columnsAll:[],
loading: false,
pageNo: 1,
pageSize: 10,
@@ -406,9 +407,10 @@ export default {
mounted() {
},
methods: {
transferModel() {
transferModel(val) {
this.visible = true
this.queryParam = {}
this.columnsAll = val
// this.$nextTick(() => {
// this.selectedRowKeys = []
// this.selectedRows = []
@@ -459,12 +461,22 @@ export default {
// }
},
getCheckboxProps(record) {
console.log(record.id, 'status');
let titleList = []
this.columnsAll.forEach((item) => {
if(item.children){
item.children.forEach((val) => {
titleList.push(item.dataIndex,val.dataIndex)
})
}else {
titleList.push(item.dataIndex)
}
})
console.log(titleList)
return ({
props: {
//当状态是1或者2的时候执行disable
disabled: record.status === 1 || record.status === 2,
defaultChecked: ['1','2','35'].includes(record.id)
defaultChecked: titleList.includes(record.field)
}
})
},
@@ -480,9 +492,6 @@ export default {
// this.selectedRowKeys = []
this.selectedRows.forEach((item,index) => {
item.sort = index + 1
delete item.status
delete item.name
delete item.id
})
let headCustomEOList = JSON.parse(JSON.stringify(this.selectedRows))
let query ={
@@ -491,23 +500,15 @@ export default {
postAction('head/headCustomEO/add', query).then((res) => {
if (res.success) {
this.confirmLoading = false
this.$message.success(this.$t('OperationSuccessful'))
this.visible = false
this.selectedRowKeys = []
// this.$emit('transferListForm')
this.$message.success(this.$t('OperationSuccessful'))
this.$emit('customizeListForm')
} else {
// if (res.message == '该虚拟清单的维护清单中没有数据,是否需要添加') {
// this.confirmLoading = false
// this.getAdd()
// return
// }
this.$message.warning(this.$t('operationFailed'))
this.confirmLoading = false
this.visible = false
}
})
// } else {
// this.$message.warning(this.$t('selectLeastOne'))
// }
},
getAdd() {
let _this = this
@@ -573,4 +574,5 @@ export default {
.box-button {
height: 38px;
}
</style>
@@ -215,7 +215,7 @@
<a-table
ref="table"
:components="drag(columns,'columnsAll')"
class="tableList"
class="customizetable"
:loading="loading"
:pagination="false"
:scroll="{x: '100%',y:'calc(100vh - 356px)'}"
@@ -510,7 +510,7 @@
listTitle: '',
orderBy: '1',
orderByField: '',
columnsAll: [
column: [
{
title: this.$t('standard'),
align: 'left',
@@ -798,6 +798,7 @@
scopedSlots: { customRender: 'operationOne' }
}
],
columnsAll:[],
columnsFileAll: [
{
title: this.$t('deliverableTemplate'),
@@ -1032,6 +1033,7 @@
mounted() {
// if (this.$route.query.studioEngineer == this.userInfo().id) {
this.JLoading = true
this.getHeader()
// this.getAndUserId()
this.getRoleByUserId(() => {
this.getAndUserId()
@@ -1223,9 +1225,6 @@
} else {
this.$message.warning(this.$t('selectLeastOne'))
}
},
customizeListForm(){
},
batchSettingPersonnelClick() {
if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
@@ -1526,6 +1525,9 @@
this.selectedRowKeys = []
this.getList()
},
customizeListForm(val){
this.getHeader()
},
transferListForm(id){
this.$refs.transferListvirtalRef.transferModel(id)
},
@@ -1557,6 +1559,58 @@
}
this.getList()
},
getHeader(){
getAction('head/headCustomEO/list', {
moduleFlag:'法规清单'
}).then((res) => {
if (res.success) {
console.log(res.result)
if(res.result.length != 0){
this.columnsAll = res.result
}else{
this.columnsAll = this.column
}
this.columnsAll.forEach((item,index) => {
if(item.title != '设计符合性确认' && item.title != 'Pre-Homo确认' && item.title != '验证符合性确认'){
item.width = 180
item.align = 'left'
if(item.title == '操作'){
item.scopedSlots = {
customRender: 'operationOne'
}
}else if(item.title == '编号'){
item.sorter = true
item.scopedSlots = {
customRender: 'standard'
}
}else if(item.title == '标题'){
item.scopedSlots = {
customRender: 'titleName'
}
}
else if(item.title == '清单确认状态' || item.title == '任务确认状态' || item.title == '认证级别' || item.title == 'WVTA ID' ||
item.title == '责任领域' || item.title == '法规工程师' || item.title == '认证工程师' || item.title == '工程接口人'){
item.sorter = true
}
}else {
delete item.dataIndex
delete item.fixed
item.children.forEach((val,index) => {
val.width = 180
val.align = 'left'
val.ellipsis = true
})
}
})
console.log(this.columnsAll)
this.loading = false
this.JLoading = false
} else {
this.JLoading = false
this.loading = false
}
})
},
getList() {
let roleCode
if (this.isDisplay) {
@@ -2272,7 +2326,7 @@
})
},
customizeClick(){
this.$refs.customizeListRef.transferModel()
this.$refs.customizeListRef.transferModel(this.columnsAll)
},
bringInRelevantPersonnelClick() {
let _this = this