订单页面增加隔行换色效果; 其他页面保持不变;
This commit is contained in:
parent
8dda8992f0
commit
bb1ba49186
|
|
@ -16,6 +16,12 @@
|
|||
:row-selection="rowSelection"
|
||||
:rowKey="rowKey"
|
||||
:scroll="{ x: scrollX }"
|
||||
:customRow="(record, index) => {
|
||||
if(!tableRowCrossColor){
|
||||
return {};
|
||||
}
|
||||
return { style: { 'background-color': index % 2 == 0 ? '#FCFCFC' : '#FFFFFF'} }
|
||||
}"
|
||||
>
|
||||
<!-- 自定义列插槽, 参考:https://github.com/feseed/admin-antd-vue/blob/master/src/components/ShTable.vue -->
|
||||
<!-- eslint-disable-next-line -->
|
||||
|
|
@ -41,7 +47,8 @@ export default {
|
|||
pageSize: { type: Number, default: 10 }, // 默认每页条数
|
||||
rowSelection: Object, // checkbox选择
|
||||
rowKey: { type: [String, Function] }, // 定义rowKey 如果不定义将会出现(树状结构出问题, checkbox不消失等)
|
||||
scrollX: { type: Number, default: 800 } // 表格显示滚动条的宽度
|
||||
scrollX: { type: Number, default: 800 }, // 表格显示滚动条的宽度
|
||||
tableRowCrossColor: { type: Boolean, default: false } // 是隔行换色
|
||||
},
|
||||
|
||||
data () {
|
||||
|
|
|
|||
|
|
@ -74,6 +74,7 @@
|
|||
:searchData="searchData"
|
||||
rowKey="payOrderId"
|
||||
:scrollX="1350"
|
||||
:tableRowCrossColor="true"
|
||||
>
|
||||
<template slot="amountSlot" slot-scope="{record}"><b>¥{{ record.amount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
<template slot="refundAmountSlot" slot-scope="{record}">¥{{ record.refundAmount/100 }}</template> <!-- 自定义插槽 -->
|
||||
|
|
|
|||
|
|
@ -57,6 +57,7 @@
|
|||
:rowSelection="rowSelection"
|
||||
rowKey="refundOrderId"
|
||||
:scrollX="1350"
|
||||
:tableRowCrossColor="true"
|
||||
>
|
||||
<template slot="payAmountSlot" slot-scope="{record}"><b>¥{{ record.payAmount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
<template slot="refundAmountSlot" slot-scope="{record}"><b>¥{{ record.refundAmount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
|
|
|
|||
|
|
@ -47,6 +47,7 @@
|
|||
:searchData="searchData"
|
||||
rowKey="transferId"
|
||||
:scrollX="1350"
|
||||
:tableRowCrossColor="true"
|
||||
>
|
||||
<template slot="transferAmountSlot" slot-scope="{record}"><b>¥{{ record.amount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
<template slot="stateSlot" slot-scope="{record}">
|
||||
|
|
|
|||
|
|
@ -16,6 +16,12 @@
|
|||
:row-selection="rowSelection"
|
||||
:rowKey="rowKey"
|
||||
:scroll="{ x: scrollX }"
|
||||
:customRow="(record, index) => {
|
||||
if(!tableRowCrossColor){
|
||||
return {};
|
||||
}
|
||||
return { style: { 'background-color': index % 2 == 0 ? '#FCFCFC' : '#FFFFFF'} }
|
||||
}"
|
||||
>
|
||||
<!-- 自定义列插槽, 参考:https://github.com/feseed/admin-antd-vue/blob/master/src/components/ShTable.vue -->
|
||||
<!-- eslint-disable-next-line -->
|
||||
|
|
@ -41,7 +47,8 @@ export default {
|
|||
pageSize: { type: Number, default: 10 }, // 默认每页条数
|
||||
rowSelection: Object, // checkbox选择
|
||||
rowKey: { type: [String, Function] }, // 定义rowKey 如果不定义将会出现(树状结构出问题, checkbox不消失等)
|
||||
scrollX: { type: Number, default: 980 } // 定义表格的最小宽度,在小就会出现横向的滚动条
|
||||
scrollX: { type: Number, default: 980 }, // 定义表格的最小宽度,在小就会出现横向的滚动条
|
||||
tableRowCrossColor: { type: Boolean, default: false } // 是隔行换色
|
||||
},
|
||||
|
||||
data () {
|
||||
|
|
|
|||
|
|
@ -68,6 +68,7 @@
|
|||
:searchData="searchData"
|
||||
rowKey="payOrderId"
|
||||
:scrollX="1000"
|
||||
:tableRowCrossColor="true"
|
||||
>
|
||||
<template slot="amountSlot" slot-scope="{record}"><b>¥{{ record.amount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
<template slot="refundAmountSlot" slot-scope="{record}">¥{{ record.refundAmount/100 }}</template> <!-- 自定义插槽 -->
|
||||
|
|
|
|||
|
|
@ -49,6 +49,7 @@
|
|||
:tableColumns="tableColumns"
|
||||
rowKey="refundOrderId"
|
||||
:scrollX="1300"
|
||||
:tableRowCrossColor="true"
|
||||
>
|
||||
<template slot="payAmountSlot" slot-scope="{record}"><b>¥{{ record.payAmount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
<template slot="refundAmountSlot" slot-scope="{record}"><b>¥{{ record.refundAmount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
|
|
|
|||
|
|
@ -46,6 +46,7 @@
|
|||
:searchData="searchData"
|
||||
rowKey="transferId"
|
||||
:scrollX="1350"
|
||||
:tableRowCrossColor="true"
|
||||
>
|
||||
<template slot="transferAmountSlot" slot-scope="{record}"><b>¥{{ record.amount/100 }}</b></template> <!-- 自定义插槽 -->
|
||||
<template slot="stateSlot" slot-scope="{record}">
|
||||
|
|
|
|||
Loading…
Reference in New Issue