上报库参数收集自定义表头

This commit is contained in:
zyx.net
2023-04-03 15:46:09 +08:00
parent 4a068a67fe
commit c30cb597f3
4 changed files with 495 additions and 4 deletions
@@ -100,6 +100,36 @@
<a-icon type="export" :rotate="-90"/>
{{$t('CustomExport')}}
</div>
<!-- 列表设置-->
<a-popconfirm :visible="customizevisible" overlayClassName="popconfirm"
placement="bottomRight" v-if="!this.$route.query.it">
<template slot="title" id="popconfirmmize">
<div style="max-height:360px;overflow:scroll;overflow-x: auto;width: 188px">
<a-checkbox
style="margin-bottom: 22px;"
v-if="customizeList && customizeList.length"
v-model="checkAll"
:indeterminate="indeterminate"
@change="onCheckAllChange"
>{{ $t('selectAll') }}
</a-checkbox>
<a-checkbox-group @change="onChange" v-model="checkedList" class="customize-text">
<a-checkbox class="customize-text-title" :disabled="item.disabled" v-for="(item, key) in customizeList"
:key="key" :value="item.field">{{ item.name }}
</a-checkbox>
</a-checkbox-group>
<div class="drawer-bootom-button">
<a-button @click="cancel" style="margin-right: 16px">{{ $t('cancel') }}</a-button>
<a-button @click="handleSubmitcustomize" type="primary" :loading="confirmLoading">{{ $t('determine') }}
</a-button>
</div>
</div>
</template>
<div class="operator-text" style="position: relative" @click="getcustomize">
<a-icon type="setting"/>
{{ $t('customize') }}
</div>
</a-popconfirm>
</div>
<div style="width: 100%">
<!-- 表格-10控件-->
@@ -233,7 +263,110 @@
NotSelectedRowKeysValue: [],
NoEngineer: 1, // 下发收集的权限,0为没有接口人 1为由接口人 默认有
NotSelectedNoEngineerValue: [],
paramsManifest: {}
paramsManifest: {},
customizevisible: false,
indeterminate: false,
checkAll: false,
selectedValue: [],
checkedList: ['NiONumber', 'ParameterName', 'operation'],
customizeList: [
{
sort: '1',
name: this.$t('NiONumber'),
disabled: true,
headFieldCn: 'NIO编号',
headFieldEn: 'NiONumber',
field: 'NiONumber',
key: 1,
moduleFlag: '上报库',
status: 1
},
{
sort: '2',
disabled: true,
name: this.$t('ParameterName'),
headFieldCn: '参数名称',
headFieldEn: 'Parameter Name',
field: 'ParameterName',
key: 2,
moduleFlag: '上报库',
status: 2
},
{
sort: '',
name: this.$t('ParameterDescription'),
headFieldCn: '参数说明',
headFieldEn: 'Parameter Description',
field: 'ParameterDescription',
key: 3,
moduleFlag: '上报库'
},
{
sort: '',
name: this.$t('status'),
headFieldCn: '状态',
headFieldEn: 'status',
field: 'status',
key: 4,
moduleFlag: '上报库'
},
{
sort: '',
name: this.$t('areaOfResponsibility'),
headFieldCn: '责任领域',
headFieldEn: 'Responsible Field',
field: 'areaOfResponsibility',
key: 5,
moduleFlag: '上报库'
},
{
sort: '',
name: this.$t('engineeringInterfacePerson'),
headFieldCn: '工程接口人',
headFieldEn: 'Eng. Interface',
field: 'engineeringInterfacePerson',
key: 6,
moduleFlag: '上报库'
},
{
sort: '',
name: this.$t('completedBy'),
headFieldCn: '填写人',
headFieldEn: 'Filled by',
field: 'completedBy',
key: 15,
moduleFlag: '上报库'
},
{
sort: '',
name: this.$t('Version'),
headFieldCn: '版本',
headFieldEn: 'Version',
field: 'Version',
key: 23,
moduleFlag: '上报库'
},
{
sort: '',
name: this.$t('synchronizationtime'),
headFieldCn: '同步时间',
headFieldEn: 'Synchronization time',
field: 'synchronizationtime',
key: 21,
moduleFlag: '上报库'
},
{
sort: '',
disabled: true,
name: this.$t('operation'),
headFieldCn: '操作',
headFieldEn: 'Operation',
key: 35,
field: 'operation',
moduleFlag: '上报库',
status: 2
}
],
}
},
props: {},
@@ -243,6 +376,52 @@
document.title = this.$t('ParameterViewPage')
},
methods: {
onCheckAllChange(e) {
let selectedValue = ['NiONumber', 'ParameterName', 'operation']
this.checkedList = e.target.checked ? this.customizeList.map(item => item.field) : selectedValue
this.selectedValue = this.checkedList
this.indeterminate = false
},
onChange() {
this.selectedValue = this.checkedList
},
getcustomize() {
this.customizevisible = true
},
cancel() {
this.customizevisible = false
},
handleSubmitcustomize() {
let list = []
let uniqueArray = this.selectedValue.filter((item, index, array) => {
return array.indexOf(item) === index
})
uniqueArray.forEach(item => {
this.customizeList.forEach((val, index) => {
if (item == val.field) {
val.sort = index + 1
list.push(val)
}
})
})
this.confirmLoading = true
let headCustomEOList = JSON.parse(JSON.stringify(list))
let query = {
headCustomEOList: headCustomEOList
}
postAction('head/headCustomEO/add', query).then((res) => {
if (res.success) {
this.confirmLoading = false
this.$message.success(this.$t('OperationSuccessful'))
this.customizevisible = false
this.$refs.CollectionTabel.getHeader()
} else {
this.$message.warning(this.$t('operationFailed'))
this.confirmLoading = false
this.customizevisible = false
}
})
},
handleToggleSearch() {
this.toggleSearchStatus = !this.toggleSearchStatus
},
@@ -588,7 +767,43 @@
text-align: right;
margin-top: 20px;
}
.customize-text {
/*height: 1533px;*/
display: flex;
flex-direction: column;
align-items: flex-start;
}
.customize-text-title {
margin-left: 0;
font-size: 14px;
font-weight: 400;
color: #040B29;
margin-bottom: 22px;
}
.drawer-bootom-button {
position: absolute;
bottom: 0;
z-index: 100;
width: 100%;
border-top: 1px solid #e8e8e8;
padding: 10px 16px;
text-align: right;
left: 0;
background: #fff;
border-radius: 0 0 2px 2px;
}
.ant-table-placeholder {
padding: 0;
border-top: none;
}
.itemModelComment .ant-form-item-control-wrapper {
width: 100% !important;
}
.second {
padding: 0 !important;
}
.operator-text-left {
font-size: 14px;
margin-right: 20px;
@@ -641,4 +856,38 @@
.Required {
color: red;
}
</style>
<style lang="less">
.popconfirm {
z-index: 999;
}
.popconfirm .ant-popover-buttons {
display: none !important;
}
.popconfirm .anticon-exclamation-circle {
display: none !important;
}
::v-deep .ant-table-fixed-header .ant-table-body-inner {
overflow: visible;
}
popconfirmmize {
z-index: 999;
}
::v-deep .popconfirmmize .ant-popover-buttons {
display: none !important;
}
.popconfirmmize .anticon-exclamation-circle {
display: none !important;
}
.popconfirmmize .ant-popover-message {
padding: 4px 0 36px !important;
}
::v-deep .ant-popover-buttons {
display: none !important;
}
</style>