Commit 60da8cca authored by 许珑标's avatar 许珑标

Merge branch 'feat/tax' into test

parents d125b0aa e9c72c7a
<template>
<div class="app-container payStatistics">
<el-form label-position="right">
<el-row :gutter="12">
<el-col :span="8">
<el-form-item label-width="85px" label="统计时间">
<el-date-picker value-format="yyyy-MM-dd" v-model="value1" type="daterange" range-separator="至"
start-placeholder="开始日期" end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label-width="100px" label="代理商名称">
<el-input placeholder="请输入代理商名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label-width="85px" label="代理商号">
<el-input placeholder="请输入代理商号"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-button type="primary" icon="el-icon-search">查询</el-button>
<el-button type="info" icon="el-icon-refresh">重置</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
<!-- 统计部份 -->
<div class="statisticsMain">
<div class="statistics_item">
<div class="statistics_item_title">成交金额</div>
<div class="statistics_item_content">7757851</div>
</div>
<div class="statistics_item">
<div class="statistics_item_title">成交笔数</div>
<div class="statistics_item_content">24243</div>
</div>
<div class="statistics_item">
<div class="statistics_item_title">失败笔数</div>
<div class="statistics_item_content">125</div>
</div>
<div class="statistics_item">
<div class="statistics_item_title">失败率</div>
<div class="statistics_item_content">4%</div>
</div>
<div class="statistics_item">
<div class="statistics_item_title">服务费金额</div>
<div class="statistics_item_content">4429871</div>
</div>
<div class="statistics_item">
<div class="statistics_item_title">代理商佣金</div>
<div class="statistics_item_content">228304</div>
</div>
<div class="statistics_item">
<div class="statistics_item_title">代理商数</div>
<div class="statistics_item_content">5</div>
</div>
</div>
<!-- 表格部分 -->
<el-table :data="tableData" border show-summary style="width: 100%;margin-top:28px"
height="calc(100vh - 360px)">
<el-table-column type="index" width="55" label="序号"></el-table-column>
<el-table-column prop="id" label="代理商号" width="180">
</el-table-column>
<el-table-column prop="name" label="代理商名称">
</el-table-column>
<el-table-column prop="amount1" sortable label="商户数">
</el-table-column>
<el-table-column prop="amount2" sortable label="成交笔数">
</el-table-column>
<el-table-column prop="amount3" sortable label="成交金额">
</el-table-column>
<el-table-column prop="amount4" sortable label="失败笔数">
</el-table-column>
<el-table-column prop="amount5" sortable label="服务费金额">
</el-table-column>
<el-table-column prop="amount6" sortable label="代理商佣金">
</el-table-column>
<!-- <el-table-column prop="amount3" sortable label="操作">
</el-table-column> -->
</el-table>
</div>
</template>
<script>
export default {
name: 'payStatistics',
data() {
return {
value1: null,
tableData: [{
id: '12987122',
name: '赵老师',
amount1: '2',
amount2: '1289',
amount3: 762321,
amount4: 8,
amount5: 498482,
amount6: 16078
}, {
id: '12987123',
name: '洪老师',
amount1: '4',
amount2: '4089',
amount3: 1209781,
amount4: 23,
amount5: 672313,
amount6: 25789
}, {
id: '12987124',
name: '李老师',
amount1: '3',
amount2: '2609',
amount3: 928324,
amount4: 16,
amount5: 178341,
amount6: 18964
}, {
id: '12987125',
name: '赵老师',
amount1: '6',
amount2: '10233',
amount3: 2983983,
amount4: 43,
amount5: 1597834,
amount6: 98739
}, {
id: '12987126',
name: '马老师',
amount1: '5',
amount2: '6023',
amount3: 1873442,
amount4: 35,
amount5: 1482901,
amount6: 68734
}]
}
},
mounted() {
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.payStatistics ::v-deep {
.statisticsMain {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
margin-top: 22px;
.statistics_item {
width: calc(14% - 12px);
padding: 20px;
background-color: #fafafa;
border-radius: 6px;
.statistics_item_title {
font-size: 16px;
font-weight: 600;
color: #000;
text-align: center;
line-height: 32px;
}
.statistics_item_content {
font-size: 16px;
font-weight: 400;
color: #666;
text-align: center;
line-height: 26px;
}
}
}
}
</style>
\ No newline at end of file
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