// components/table/table/table.js
Component({
/**
* 组件的属性列表
*/
externalClasses: ['table-class', 'tr-class', 'td-class', 'th-class', 'tr-class_even', 'tr-class_odd'],
properties: {
colWidth: Number,
isScroll: {
type: Boolean,
value: false
},
header: {
type: Array,
value: []
},
list: {
type: Array,
value: []
},
showActive: {
type: Boolean,
value: true
},
activeColor: {
type: String,
value: '#d6e8ff'
},
maxLine: {
type: Number,
value: 2
}
},
observers: {
'header,list': function (header, list) {
this.init();
}
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的方法列表
*/
methods: {
setWidth (head) {
const colWidth = this.data.colWidth || head.length < 3 ? (730 / head.length) : 300;
const tableWidth = head.length >= 1 && this.data.isScroll ? head.length * colWidth : null;
this.setData({ tableWidth });
},
init () {
!this.data.tableWidth && this.setWidth(this.data.header);
const { list, header } = this.data;
let showHeader = JSON.parse(JSON.stringify(header));
let showList = JSON.parse(JSON.stringify(list));
showHeader.forEach((head, headIndex) => {
showList.forEach((item, index) => {
const body = header[headIndex].renderBody && header[headIndex].renderBody(item, index);
const color = header[headIndex].renderColor && header[headIndex].renderColor(item, index);
const bg = header[headIndex].renderBg && header[headIndex].renderBg(item, index);
if (body !== undefined) {
head.key = `col${headIndex}`;
item[`col${headIndex}`] = {};
item[`col${headIndex}`].text = body;
} else if (head.key) {
const text = item[head.key];
item[head.key] = { text };
}
if (color && head.key) {
item[head.key].color = color;
}
if (bg && head.key) {
item[head.key].bg = bg;
}
});
});
this.setData({ showHeader, showList });
},
checkRow (index) {
if (!this.data.showActive) {
return;
}
index = /\d+/.test(index) ? index : 0;
this.setData({ currentIndex: index });
},
onLongPress (e) {
const { index } = e.currentTarget.dataset;
this.checkRow(index);
const data = this.data.list[index];
this.triggerEvent('onLongPress', { index, data });
},
onTap (e) {
const { index } = e.currentTarget.dataset;
this.checkRow(index);
const data = this.data.list[index];
this.triggerEvent('onClick', { index, data });
}
}
});
评论0