| 提交 | 用户 | age | ||
| 7a0003 | 1 | <template> |
| 31ff05 | 2 | <PageWrapper title="基础详情页" contentBackgrond> |
| V | 3 | <Description |
| 4 | size="middle" | |
| 5 | title="退款申请" | |
| 6 | :bordered="false" | |
| 7 | :column="3" | |
| 8 | :data="refundData" | |
| 9 | :schema="refundSchema" | |
| 10 | /> | |
| 11 | <a-divider /> | |
| 12 | <Description | |
| 13 | size="middle" | |
| 14 | title="用户信息" | |
| 15 | :bordered="false" | |
| 16 | :column="3" | |
| 17 | :data="personData" | |
| 18 | :schema="personSchema" | |
| 19 | /> | |
| 20 | <a-divider /> | |
| 7a0003 | 21 | |
| 31ff05 | 22 | <BasicTable @register="registerRefundTable" /> |
| V | 23 | <a-divider /> |
| 24 | <BasicTable @register="registerTimeTable" /> | |
| 25 | </PageWrapper> | |
| 7a0003 | 26 | </template> |
| V | 27 | <script lang="ts"> |
| 28 | import { defineComponent } from 'vue'; | |
| 29 | import { Description } from '/@/components/Description/index'; | |
| 30 | import { BasicTable, useTable } from '/@/components/Table'; | |
| 31ff05 | 31 | import { PageWrapper } from '/@/components/Page'; |
| 7a0003 | 32 | |
| V | 33 | import { |
| 34 | refundSchema, | |
| 35 | refundData, | |
| 36 | personSchema, | |
| 37 | personData, | |
| 38 | refundTableSchema, | |
| 39 | refundTimeTableSchema, | |
| 40 | refundTableData, | |
| 41 | refundTimeTableData, | |
| 42 | } from './data'; | |
| 43 | export default defineComponent({ | |
| 31ff05 | 44 | components: { Description, BasicTable, PageWrapper }, |
| 7a0003 | 45 | setup() { |
| V | 46 | const [registerRefundTable] = useTable({ |
| 47 | title: '退货商品', | |
| 48 | dataSource: refundTableData, | |
| 49 | columns: refundTableSchema, | |
| 50 | pagination: false, | |
| 51 | showIndexColumn: false, | |
| 52 | scroll: { y: 300 }, | |
| 53 | showSummary: true, | |
| 54 | summaryFunc: handleSummary, | |
| 55 | }); | |
| 56 | ||
| 57 | const [registerTimeTable] = useTable({ | |
| 58 | title: '退货进度', | |
| 59 | columns: refundTimeTableSchema, | |
| 60 | pagination: false, | |
| 61 | dataSource: refundTimeTableData, | |
| 62 | showIndexColumn: false, | |
| 63 | scroll: { y: 300 }, | |
| 64 | }); | |
| 65 | ||
| 66 | function handleSummary(tableData: any[]) { | |
| 67 | let totalT5 = 0; | |
| 68 | let totalT6 = 0; | |
| 69 | tableData.forEach((item) => { | |
| 70 | totalT5 += item.t5; | |
| 71 | totalT6 += item.t6; | |
| 72 | }); | |
| 73 | return [ | |
| 74 | { | |
| 75 | t1: '总计', | |
| 76 | t5: totalT5, | |
| 77 | t6: totalT6, | |
| 78 | }, | |
| 79 | ]; | |
| 80 | } | |
| 81 | return { | |
| 82 | registerRefundTable, | |
| 83 | registerTimeTable, | |
| 84 | refundSchema, | |
| 85 | refundData, | |
| 86 | personSchema, | |
| 87 | personData, | |
| 88 | }; | |
| 89 | }, | |
| 90 | }); | |
| 91 | </script> | |
| 92 | <style lang="less" scoped> | |
| 93 | .desc-wrap { | |
| 94 | padding: 16px; | |
| 95 | background: #fff; | |
| 96 | } | |
| 97 | </style> | |
