Browse Source

feat: 优化样式

master
kiki 2 years ago
parent
commit
01e95e7919
  1. 17
      src/views/data-view/components/horizontal-scroll-pane.vue
  2. 13
      src/views/data-view/data-view.vue

17
src/views/data-view/components/horizontal-scroll-pane.vue

@ -9,23 +9,6 @@
<script> <script>
export default { export default {
components: {},
data() {
return {}
},
mounted() {
const flavoursContainer = this.$refs.flavoursContainer
const flavoursScrollWidth = flavoursContainer.scrollWidth
// setInterval(() => {
// if (flavoursContainer.scrollLeft < flavoursScrollWidth + flavoursContainer.clientWidth) {
// console.log("flavoursContainer.scrollLeft", flavoursContainer.scrollLeft)
// flavoursContainer.scrollTo(flavoursContainer.scrollLeft + 1, 0)
// } else {
// flavoursContainer.scrollTo(0, 0)
// }
// }, 30)
}
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

13
src/views/data-view/data-view.vue

@ -23,8 +23,8 @@
:columns="[ :columns="[
{label: '商户名称', key: 'username'}, {label: '商户名称', key: 'username'},
{label: '余额', key: 'balance'}, {label: '余额', key: 'balance'},
{label: '剩余押金额度', key: 'residueBalance'}, {label: '剩余额度', key: 'residueBalance'},
{label: '成功金额', key: 'collectionSuccessPrice'}, {label: '成功金额', key: 'collectionSuccessPrice'},
{label: '成功率', key: 'percentage'}, {label: '成功率', key: 'percentage'},
]" ]"
:data="data1" :data="data1"
@ -48,7 +48,7 @@
> >
<template #dayMargin="{row}"> <template #dayMargin="{row}">
<div class="day-margin-row"> <div class="day-margin-row">
<span>{{ row.dayMargin }}/</span> <span>{{ row.dayMargin }}</span>
<span>{{ row.margin }}</span> <span>{{ row.margin }}</span>
</div> </div>
</template> </template>
@ -61,11 +61,11 @@
:columnSizes="[14.2,14.2,14.2,14.2,14.2,14.2,14.2,]" :columnSizes="[14.2,14.2,14.2,14.2,14.2,14.2,14.2,]"
:columns="[ :columns="[
{label: '银行名称', key: 'bankName'}, {label: '银行名称', key: 'bankName'},
{label: '收款人名称', key: 'cardHolder'}, {label: '姓名', key: 'cardHolder'},
{label: '卡商名称', key: 'username'}, {label: '卡商名称', key: 'username'},
{label: '已收款', key: 'todayIncomeReceived'}, {label: '已收款', key: 'todayIncomeReceived'},
{label: '剩余收款额度', key: 'todayRemainingAmount'}, {label: '剩余额度', key: 'todayRemainingAmount'},
{label: '剩余卡余额', key: 'remainingAmount'}, {label: '余额', key: 'remainingAmount'},
{label: '通道', key: 'channels'}, {label: '通道', key: 'channels'},
]" ]"
:data="data2" :data="data2"
@ -357,6 +357,7 @@ export default {
.day-margin-row { .day-margin-row {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
flex-direction: column;
justify-content: center; justify-content: center;
span { span {

Loading…
Cancel
Save