test #47
@ -12,86 +12,50 @@
|
||||
ref="search-bar"
|
||||
@headBtnClick="handleSearchBarBtnClick" />
|
||||
|
||||
<div class="tables">
|
||||
<div class="custom-table">
|
||||
<!-- <base-table
|
||||
:key="1 + '__basetable'"
|
||||
:table-props="table1.tableProps"
|
||||
:page="table1.pageNo"
|
||||
:limit="table1.pageSize"
|
||||
:table-data="table1.data"
|
||||
@emitFun="(val) => handleEmitFun(table1, val)"></base-table>
|
||||
<pagination
|
||||
v-show="table1.total > 0"
|
||||
:total="table1.total"
|
||||
:page.sync="table1.pageNo"
|
||||
:limit.sync="table1.pageSize"
|
||||
:page-size="table1.pageSize"
|
||||
:page-sizes="[1, 3, 5, 10, 20]"
|
||||
@pagination="(val) => getListFor(table1, val)" /> -->
|
||||
</div>
|
||||
<base-table
|
||||
:key="2 + '__basetable'"
|
||||
:table-props="table2.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table2.data"
|
||||
@emitFun="(val) => handleEmitFun(table2, val)"></base-table>
|
||||
<base-table
|
||||
:key="3 + '__basetable'"
|
||||
:table-props="table3.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table3.data"
|
||||
@emitFun="(val) => handleEmitFun(table3, val)"></base-table>
|
||||
<base-table
|
||||
:key="4 + '__basetable'"
|
||||
:table-props="table4.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table4.data"
|
||||
@emitFun="(val) => handleEmitFun(table4, val)"></base-table>
|
||||
<base-table
|
||||
:key="5 + '__basetable'"
|
||||
:table-props="table5.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table5.data"
|
||||
@emitFun="(val) => handleEmitFun(table5, val)"></base-table>
|
||||
<base-table
|
||||
:key="6 + '__basetable'"
|
||||
:table-props="table6.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table6.data"
|
||||
@emitFun="(val) => handleEmitFun(table6, val)"></base-table>
|
||||
<base-table
|
||||
:key="7 + '__basetable'"
|
||||
:table-props="table7.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table7.data"
|
||||
@emitFun="(val) => handleEmitFun(table7, val)"></base-table>
|
||||
</div>
|
||||
<!-- <div class="tables">
|
||||
<div class="table-wrapper" v-for="table in tableList" :key="table.key">
|
||||
<div class="table-title">PLC 1</div>
|
||||
<!-- <base-table
|
||||
:table-props="[
|
||||
{ type: 'index', label: '序号' },
|
||||
{ prop: 'name', label: '设备名称', align: 'center' },
|
||||
{ prop: 'code', label: '设备代码', align: 'center' },
|
||||
{ prop: 'time', label: '时间', align: 'center' },
|
||||
]"
|
||||
:table-data="[
|
||||
{ index: 1, name: '1', code: 'c1', time: '2021-08-31 09:14:19' },
|
||||
{ index: 2, name: '2', code: 'c2', time: '2021-08-31 09:14:19' },
|
||||
{ index: 3, name: '3', code: 'c3', time: '2021-08-31 09:14:19' },
|
||||
{ index: 4, name: '4', code: 'c4', time: '2021-08-31 09:14:19' },
|
||||
{ index: 5, name: '5', code: 'c5', time: '2021-08-31 09:14:19' },
|
||||
]"
|
||||
:span-method="
|
||||
({ rowIndex, columnIndex }) => {
|
||||
if (rowIndex == 1 && columnIndex == 0) {
|
||||
return [1, 3];
|
||||
}
|
||||
return [1, 1];
|
||||
}
|
||||
"
|
||||
@emitFun="(val) => handleEmitFun(table, val)"></base-table> -->
|
||||
|
||||
<div class="tables-s">
|
||||
<div class="custom-table" v-for="table in tableList" :key="table.key">
|
||||
<!-- {{ JSON.stringify(spanMethod) }} -->
|
||||
<base-table
|
||||
:key="table.key + '__basetable'"
|
||||
:table-props="table.tableProps"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:table-data="table.data"
|
||||
@emitFun="(val) => handleEmitFun(table, val)">
|
||||
</base-table>
|
||||
:table-data="table.list"
|
||||
:span-method="spanMethod"
|
||||
@emitFun="(val) => handleEmitFun(table, val)"></base-table>
|
||||
<pagination
|
||||
:key="table.key + '__pagination'"
|
||||
v-show="table.total > 0"
|
||||
:total="table.total"
|
||||
:page.sync="table.queryParams.pageNo"
|
||||
:limit.sync="table.queryParams.pageSize"
|
||||
:page.sync="table.pageNo"
|
||||
:limit.sync="table.pageSize"
|
||||
:page-size="table.pageSize"
|
||||
:page-sizes="[1, 3, 5, 10, 20]"
|
||||
@pagination="(val) => getListFor(table, val)" />
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -99,7 +63,6 @@
|
||||
import LocalDataManager from './utils/local-data-manager';
|
||||
import response from './response';
|
||||
|
||||
|
||||
export default {
|
||||
name: 'EquipmentFullParams',
|
||||
components: {},
|
||||
@ -152,229 +115,16 @@ export default {
|
||||
id: null,
|
||||
time: [new Date(aWeekAgo), new Date(today)],
|
||||
},
|
||||
|
||||
table1: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
{
|
||||
prop: 'val3',
|
||||
label: '数值3',
|
||||
},
|
||||
{
|
||||
prop: 'bol3',
|
||||
label: '布尔3',
|
||||
},
|
||||
{
|
||||
prop: 'val4',
|
||||
label: '数值4',
|
||||
},
|
||||
{
|
||||
prop: 'bol4',
|
||||
label: '布尔4',
|
||||
},
|
||||
],
|
||||
data: table1LDM.dataList,
|
||||
pageNo: table1LDM.pageNo,
|
||||
pageSize: table1LDM.pageSize,
|
||||
total: table1LDM.total,
|
||||
},
|
||||
table2: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
},
|
||||
table3: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
},
|
||||
table4: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
},
|
||||
table5: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
},
|
||||
table6: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
},
|
||||
table7: {
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
},
|
||||
{
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
},
|
||||
{
|
||||
prop: 'val1',
|
||||
label: '数值1',
|
||||
},
|
||||
{
|
||||
prop: 'bol1',
|
||||
label: '布尔1',
|
||||
},
|
||||
{
|
||||
prop: 'val2',
|
||||
label: '数值2',
|
||||
},
|
||||
{
|
||||
prop: 'bol2',
|
||||
label: '布尔2',
|
||||
},
|
||||
],
|
||||
data: [],
|
||||
},
|
||||
tableList: [
|
||||
{
|
||||
key: 'base-table__key__1',
|
||||
tableProps: [],
|
||||
list: [],
|
||||
pageNo: 1,
|
||||
pageSize: 3,
|
||||
total: 0,
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -394,14 +144,104 @@ export default {
|
||||
this.$set(this.searchBarFormConfig[0], 'defaultSelect', this.code);
|
||||
if (this.name)
|
||||
this.$set(this.searchBarFormConfig[1], 'defaultSelect', this.name);
|
||||
|
||||
this.handleResponse();
|
||||
},
|
||||
methods: {
|
||||
buildProps(table) {
|
||||
console.log('building props', table);
|
||||
// 通过 otherList 来构建 props
|
||||
const { otherList } = table;
|
||||
const props = [
|
||||
{
|
||||
// type: 'index',
|
||||
width: 48,
|
||||
prop: 'index',
|
||||
label: '序号',
|
||||
align: 'center',
|
||||
// children: [{ label: '参考值： [最小]-[最大][/标准]' }],
|
||||
},
|
||||
{
|
||||
width: 128,
|
||||
prop: 'time',
|
||||
label: '时间',
|
||||
align: 'center',
|
||||
// children: [{ label: '参考值： [最小]-[最大][/标准]' }],
|
||||
},
|
||||
{
|
||||
width: 128,
|
||||
prop: 'plcCode',
|
||||
label: 'PLC编码',
|
||||
align: 'center',
|
||||
// children: [{ label: '参考值： [最小]-[最大][/标准]' }],
|
||||
},
|
||||
];
|
||||
const firstLineData = {
|
||||
index: '参考值： [最小]-[最大][/标准]',
|
||||
time: '参考值： [最小]-[最大][/标准]',
|
||||
plcCode: '参考值： [最小]-[最大][/标准]',
|
||||
};
|
||||
otherList.forEach((item) => {
|
||||
props.push({
|
||||
label: item.name,
|
||||
align: 'center',
|
||||
// children: [
|
||||
// {
|
||||
// prop: item.name,
|
||||
// align: 'center',
|
||||
// label: `${item.minValue ?? ''}-${item.maxValue ?? ''}${
|
||||
// item.defaultValue != null ? '/' + item.defaultValue : ''
|
||||
// }`,
|
||||
// },
|
||||
// ],
|
||||
});
|
||||
firstLineData[item.name] = `${item.minValue ?? ''}-${
|
||||
item.maxValue ?? ''
|
||||
}${item.defaultValue != null ? '/' + item.defaultValue : ''}`;
|
||||
});
|
||||
console.log('new props:', props);
|
||||
return { props, firstLineData };
|
||||
},
|
||||
|
||||
handleResponse() {
|
||||
const { code, data } = response;
|
||||
if (code == 0) {
|
||||
console.log('response', code, data);
|
||||
data.forEach((table, index) => {
|
||||
console.log('handle index:', index, table);
|
||||
const { props: tableProps, firstLineData } = this.buildProps(table);
|
||||
this.$set(this.tableList, index, {
|
||||
key: 'base-table__key__' + index,
|
||||
tableProps,
|
||||
list: [firstLineData],
|
||||
pageNo: 1,
|
||||
pageSize: 5,
|
||||
total: 0,
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
injectFirstLine(table) {
|
||||
// 给table的第一行注入固定数据
|
||||
},
|
||||
|
||||
getList(dataManager, pageNo, pageSize) {
|
||||
dataManager.setPageNo(pageNo);
|
||||
dataManager.setPageSize(pageSize);
|
||||
return { data: dataManager.dataList, total: dataManager.total };
|
||||
},
|
||||
|
||||
spanMethod({ row, column, rowIndex, columnIndex }) {
|
||||
console.log('span method', row, column, rowIndex, columnIndex);
|
||||
if (rowIndex == 1 && columnIndex == 0) {
|
||||
console.log('herer..............');
|
||||
return [1, 3];
|
||||
}
|
||||
console.log('therer..............');
|
||||
return [1, 1];
|
||||
},
|
||||
|
||||
/** 查询 */
|
||||
async handleQuery() {
|
||||
const { data } = this.$axios({
|
||||
@ -425,16 +265,6 @@ export default {
|
||||
console.log('table val', table, val);
|
||||
},
|
||||
|
||||
/** 构造 props */
|
||||
buildProps() {
|
||||
this.tableList.forEach((table) => {
|
||||
this.buildTableProp(table);
|
||||
});
|
||||
},
|
||||
|
||||
/** 构造一个 tableProps - 根据动态结构 */
|
||||
buildTableProp(table) {},
|
||||
|
||||
/** 为某个 table 获取 list 数据 */
|
||||
getListFor(table, val) {
|
||||
console.log('get list for', table, val);
|
||||
|
||||
@ -33,7 +33,8 @@ export default {
|
||||
"plcParamName": "P1V2",
|
||||
"name": "P1V2",
|
||||
"minValue": 10,
|
||||
"maxValue": 90
|
||||
"maxValue": 90,
|
||||
"defaultValue": 24
|
||||
},
|
||||
{
|
||||
"id": "attr-3",
|
||||
@ -53,15 +54,16 @@ export default {
|
||||
"id": "attr-5",
|
||||
"plcParamName": "P1V5",
|
||||
"name": "P1V5",
|
||||
"minValue": 10,
|
||||
"maxValue": 99
|
||||
"minValue": null,
|
||||
"maxValue": null
|
||||
},
|
||||
{
|
||||
"id": "attr-6",
|
||||
"plcParamName": "P1V6",
|
||||
"name": "P1V6",
|
||||
"minValue": 10,
|
||||
"maxValue": 90
|
||||
"minValue": null,
|
||||
"maxValue": null,
|
||||
"defaultValue": false
|
||||
},
|
||||
],
|
||||
"nameData": [],
|
||||
|
||||
Loading…
Reference in New Issue
Block a user