/**
* datalist网格查询面板布局风格1
* @param {*} form 表单配置[{colspan:1,prop:"fieldName1",label:"字段1"}]
* @param {*} option.hcQueryPanel 查询面板个性化配置
* @param {*} option.hcDataList 数据列表个性化配置
* @param {*} option.row 网格行通用配置
* @param {*} option.cols 网格列配置
* @returns
*/
export function queryStyle01(form, option = {}) {
// 初始化cols列配置, 默认3列
let cols = option.cols || [
{
colWidth: "40%",
},
{
colWidth: "30%",
},
{
colWidth: "30%",
}
]
// 计算rows查询面板内容
let rows = {};
let curtRow = newEmptyRow();
let rIndex = 1;
let colTotalCount = cols.length;
let colSpanCount = 0;
// 计算rows行配置
function newEmptyRow() {
// 创建空行
return Object.assign({ tds: {} }, option.row || {});
}
// 不足列进行补全
function fillTd(rIndex, curtColIndex, colCount, curtRow) {
if (curtColIndex < colCount) {
for (let m = curtColIndex; m < colCount; m++) {
let mAxis = String.fromCharCode(65 + m) + rIndex;
curtRow.tds[mAxis] = {
colspan: 1
}
}
}
}
for (let i = 0, l = form.length; i < l; i++) {
let fItem = form[i];
let colspan = fItem.colspan || 1;
let tdAxis = String.fromCharCode(65 + colSpanCount);
// 当前项已超本行总列数或当前是行分隔项,补全空余, 别取新行
if (colSpanCount + colspan > colTotalCount) {
// 不足列进行补全
fillTd(rIndex, colSpanCount, colTotalCount, curtRow);
// 当前列添加到rows,另取新行
let rAxis = "r" + rIndex;
rows[rAxis] = JSON.parse(JSON.stringify(curtRow));
curtRow = newEmptyRow();
rIndex++;
colSpanCount = 0;
}
// 当前行curtRow添加表单项td
let propAxis = tdAxis + rIndex;
curtRow.tds[propAxis] = fItem;
colSpanCount += colspan;
}
// 添加最后一行
if (colSpanCount > 0) {
// 补全最后一行
fillTd(rIndex, colSpanCount, colTotalCount, curtRow);
let rAxis = "r" + rIndex;
rows[rAxis] = JSON.parse(JSON.stringify(curtRow));
}
// 定义dataList布局
let dataList = {
controlName: "HcDataList",
controlId: "HcDataList_02",
width: "100%",
style: "border-spacing:0px;border-collapse: collapse;table-layout:fixed;word-break:break-all;",
rows: rows,
cols: cols
}
// 应用datalist个性化配置
Object.assign(dataList, option.hcDataList);
// 定义查询面板
let queryPanel = {
inline: true,
size: "small",
children: [
dataList
],
};
// 查询面板
return Object.assign(queryPanel, Option.hcQueryPanel);
}