Commit f2b97eca authored by leon's avatar leon

feat: set table style like dashboard

parent 51f18d16
<template> <template>
<view class="count-to" :style="{height: `${height}px`,}"> <view class="count-to" :style="{height: `${height}px`,}">
<!-- <BasicText :elementInfo="elementInfo"></BasicText> -->
<NormalTitle :elementInfo="elementInfo"></NormalTitle> <NormalTitle :elementInfo="elementInfo"></NormalTitle>
<!-- warning:count-to的font-size单位为rpx --> <!-- warning:count-to的font-size单位为rpx -->
<u-count-to :start-val="startVal" :end-val="endVal" separator="," :color="elementInfo.option.countTo.color" :font-size="getFontSize()"></u-count-to> <u-count-to :start-val="startVal" :end-val="endVal" separator="," :color="elementInfo.option.countTo.color" :font-size="getFontSize()"></u-count-to>
......
<template> <template>
<view > <view style="margin-top: 20px;">
<NormalTitle :elementInfo="elementInfo"></NormalTitle> <NormalTitle :elementInfo="elementInfo"></NormalTitle>
<scroll-view scroll-x="true" > <scroll-view scroll-x="true" >
<view class="scroll-view_H"> <view class="scroll-view_H">
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
:bg-color="elementInfo.table.tableCell.backgroundColor" :bg-color="elementInfo.table.tableCell.backgroundColor"
:color="elementInfo.table.tableCell.titleColor" :color="elementInfo.table.tableCell.titleColor"
:font-size="$u.common.pxToRpx(elementInfo.table.tableCell.titleFontSize)" :font-size="$u.common.pxToRpx(elementInfo.table.tableCell.titleFontSize)"
:height="elementInfo.table.tableCell.cellRowHeight"
:align="elementInfo.table.tableCell.titlePostion" :align="elementInfo.table.tableCell.titlePostion"
:th-style="headerStyle" :th-style="headerStyle"
> >
...@@ -17,7 +18,7 @@ ...@@ -17,7 +18,7 @@
<u-th v-for="(item, index) in columns" :key="index">{{item.title}}</u-th> <u-th v-for="(item, index) in columns" :key="index">{{item.title}}</u-th>
</u-tr> </u-tr>
<u-tr v-for="(cell, cellIndex) in chartTables" :key="cellIndex" @tap="cellClick(cell)"> <u-tr v-for="(cell, cellIndex) in chartTables" :key="cellIndex" @tap="cellClick(cell)">
<u-td style="width: 300rpx;" v-for="(item, index) in columns" :key="index"> <u-td style="width: 240rpx;" v-for="(item, index) in columns" :key="index">
{{cell[item.dataIndex]}} {{cell[item.dataIndex]}}
</u-td> </u-td>
</u-tr> </u-tr>
...@@ -46,7 +47,8 @@ ...@@ -46,7 +47,8 @@
headerStyle() { headerStyle() {
const { headerRowHeight, titleColor, backgroundColor, titlePostion, titleFontSize } = this.elementInfo.table.tableHeader const { headerRowHeight, titleColor, backgroundColor, titlePostion, titleFontSize } = this.elementInfo.table.tableHeader
return { return {
'height': `${this.$u.common.pxToRpx(headerRowHeight)}rpx`, // 'lineHeight': `${this.$u.common.pxToRpx(headerRowHeight)}rpx`,
'lineHeight': `${headerRowHeight}px`,
'color': titleColor, 'color': titleColor,
'background-color': backgroundColor, 'background-color': backgroundColor,
'text-align': titlePostion, 'text-align': titlePostion,
......
...@@ -234,7 +234,7 @@ export default { ...@@ -234,7 +234,7 @@ export default {
.u-count-num { .u-count-num {
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
display: inline-flex; // display: inline-flex;
/* #endif */ /* #endif */
text-align: center; text-align: center;
} }
......
...@@ -42,7 +42,12 @@ ...@@ -42,7 +42,12 @@
// td的内边距 // td的内边距
padding: { padding: {
type: String, type: String,
default: '10rpx 6rpx' default: '10px 10px'
},
// td的高度
height: {
type: [String, Number],
default: 30
}, },
// 字体大小 // 字体大小
fontSize: { fontSize: {
......
...@@ -39,6 +39,7 @@ ...@@ -39,6 +39,7 @@
if (this.width != "auto") style.flex = `0 0 ${this.width}`; if (this.width != "auto") style.flex = `0 0 ${this.width}`;
style.textAlign = this.parent.align; style.textAlign = this.parent.align;
style.fontSize = this.parent.fontSize + 'rpx'; style.fontSize = this.parent.fontSize + 'rpx';
style.lineHeight = this.parent.height + 'px';
style.padding = this.parent.padding; style.padding = this.parent.padding;
style.borderBottom = `${this.parent.borderStyle} ${this.parent.borderWidth}px ${this.parent.borderColor}`; style.borderBottom = `${this.parent.borderStyle} ${this.parent.borderWidth}px ${this.parent.borderColor}`;
style.borderRight = `${this.parent.borderStyle} ${this.parent.borderWidth}px ${this.parent.borderColor}`; style.borderRight = `${this.parent.borderStyle} ${this.parent.borderWidth}px ${this.parent.borderColor}`;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment