CRM系统前端
查看 | 历史 | 提交 | 提交对比
vben
2021-01-05 31ff0559fe3b635fc2091aac0e2f5e340629134c
提交 | 用户 | age
7a0003 1 <template>
31ff05 2   <PageWrapper title="单号：234231029431" contentBackgrond>
V 3     <template #extra>
4       <a-button key="3"> 操作一 </a-button>
5       <a-button key="2"> 操作二 </a-button>
6       <a-button key="1" type="primary"> 主操作 </a-button>
7     </template>
8
9     <template #footer>
10       <a-tabs default-active-key="1">
11         <a-tab-pane key="1" tab="详情" />
12         <a-tab-pane key="2" tab="规则" />
13       </a-tabs>
14     </template>
15
16     <div class="m-4 pt-4 desc-wrap">
7a0003 17       <a-descriptions size="small" :column="2">
V 18         <a-descriptions-item label="创建人"> 曲丽丽 </a-descriptions-item>
19         <a-descriptions-item label="订购产品"> XX 服务 </a-descriptions-item>
20         <a-descriptions-item label="创建时间"> 2017-01-10 </a-descriptions-item>
21         <a-descriptions-item label="关联单据"> <a>12421</a> </a-descriptions-item>
22         <a-descriptions-item label="生效日期"> 2017-07-07 ~ 2017-08-08 </a-descriptions-item>
23         <a-descriptions-item label="备注"> 请于两个工作日内确认 </a-descriptions-item>
24       </a-descriptions>
25       <a-card title="流程进度" :bordered="false">
26         <a-steps :current="1" progress-dot size="small">
27           <a-step title="创建项目">
28             <template #description> <div>Vben</div> <p>2016-12-12 12:32</p> </template>
29           </a-step>
30           <a-step title="部门初审">
31             <template #description> <p>Chad</p> </template>
32           </a-step>
33           <a-step title="财务复核" />
34           <a-step title="完成" />
35         </a-steps>
36       </a-card>
37
38       <a-card title="用户信息" :bordered="false" class="mt-5">
39         <a-descriptions :column="3">
40           <a-descriptions-item label="用户姓名"> 付小小 </a-descriptions-item>
41           <a-descriptions-item label="会员卡号"> XX 32943898021309809423 </a-descriptions-item>
42           <a-descriptions-item label="身份证"> 3321944288191034921 </a-descriptions-item>
43           <a-descriptions-item label="联系方式"> 18112345678 </a-descriptions-item>
44           <a-descriptions-item label="联系地址" :span="2">
45             曲丽丽 18100000000 浙江省杭州市西湖区黄姑山路工专路交叉路口
46           </a-descriptions-item>
47         </a-descriptions>
48
49         <a-descriptions title="信息组" :column="3">
50           <a-descriptions-item label="某某数据"> 111 </a-descriptions-item>
51           <a-descriptions-item label="该数据更新时间"> 2017-08-08 </a-descriptions-item>
52           <a-descriptions-item label="某某数据"> 725 </a-descriptions-item>
53           <a-descriptions-item label="该数据更新时间"> 2017-08-08 </a-descriptions-item>
54         </a-descriptions>
55
56         <h4>信息组</h4>
57         <a-card title="多层级信息组">
58           <a-descriptions title="组名称" :column="3">
59             <a-descriptions-item label="负责人"> 林东东 </a-descriptions-item>
60             <a-descriptions-item label="角色码"> 1234567 </a-descriptions-item>
61             <a-descriptions-item label="所属部门"> XX公司 - YY部 </a-descriptions-item>
62             <a-descriptions-item label="过期时间"> 2017-08-08 </a-descriptions-item>
63             <a-descriptions-item label="描述" :span="2">
64               这段描述很长很长很长很长很长很长很长很长很长很长很长很长很长很长...
65             </a-descriptions-item>
66           </a-descriptions>
67           <a-divider />
68           <a-descriptions title="组名称" :column="1">
69             <a-descriptions-item label="学名">
70               Citrullus lanatus (Thunb.) Matsum. et
71               Nakai一年生蔓生藤本；茎、枝粗壮，具明显的棱。卷须较粗..
72             </a-descriptions-item>
73           </a-descriptions>
74           <a-divider />
75           <a-descriptions title="组名称" :column="1">
76             <a-descriptions-item label="负责人"> 付小小 </a-descriptions-item>
77             <a-descriptions-item label="角色码"> 1234568 </a-descriptions-item>
78           </a-descriptions>
79         </a-card>
80       </a-card>
81       <a-card title="用户近半年来电记录" class="my-5">
82         <a-empty />
83       </a-card>
84       <BasicTable @register="registerTimeTable" />
85     </div>
31ff05 86   </PageWrapper>
7a0003 87 </template>
V 88 <script lang="ts">
89   import { defineComponent } from 'vue';
90   import { Description } from '/@/components/Description/index';
91   import { BasicTable, useTable } from '/@/components/Table';
31ff05 92   import { PageWrapper } from '/@/components/Page';
7a0003 93
V 94   import { refundTimeTableSchema, refundTimeTableData } from './data';
95   export default defineComponent({
31ff05 96     components: { Description, BasicTable, PageWrapper },
7a0003 97     setup() {
V 98       const [registerTimeTable] = useTable({
99         title: '退货进度',
100         columns: refundTimeTableSchema,
101         pagination: false,
102         dataSource: refundTimeTableData,
103         showIndexColumn: false,
104         scroll: { y: 300 },
105       });
106
107       return {
108         registerTimeTable,
109       };
110     },
111   });
112 </script>