zhaoxiaoqiang
2021-07-28 9e6e98a8c6541354619f15e81009082db8d3ad14
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
<!--
 * @Author: 小明丶
 * @Date: 2019-08-20 14:07:56
 * @LastEditors: 小明丶
 * @LastEditTime: 2020-11-16 16:54:51
 * @Description: 花呗订单
 -->
<template>
    <div class="order-lthyj">
        <v-navbar title="微信分订单列表" fixed >
            <template v-slot:right >
                <div class="flex-center-g" @click="isShowFilter = true;">
                    <span>筛选</span>
                    <svg class="icon" aria-hidden="true" style="width:18px;height:18px;">
                        <use xlink:href="#iconshaixuan"></use>
                    </svg>
                </div>
            </template>
        </v-navbar>
        <!-- 订单列表 -->
        <div class="order-list">
            <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="init" >
                <v-wxScore-order-item :userName="item.userName || '无'"  :time='+item.creTime' :list='item.list' :contName="item.contName"
                                      :term="item.term" v-for="(item,k) in list" :key="k" @click="go(item.id)">
                </v-wxScore-order-item>
            </van-list>
        </div>
        <v-button-circle icon='icondaochu' title='导出' @click="exportFile"></v-button-circle>
        <v-filter  v-model="isShowFilter" :hasTime="false" :hasMoney="false" :hasSearch="true" :hasWxScore="true" @search="(v)=>search(v,true)"></v-filter>
        <van-popup v-model="exporShow">
            <div class="popup-content">
                <div class="icon-box flex-center-g" >
                    <div class="child flex-center-g" :style="{background:$store.state.backColor, opacity: 0.8}">
                        <svg class="icon" aria-hidden="true" style="width:33px;height:27px;fill:#fff;" @click="$router.back()">
                            <use xlink:href="#iconyoujian"></use>
                        </svg>
                    </div>
                </div>
                <p class="text">
                    <span class="top">已将信息发送至邮箱,请注意查收</span>
                    <span v-text="userinfo.email || ''">1244667@163.com</span>
                </p>
                <van-button class="btn-submit" @click="exporShow=false;" :style="{color:$store.state.backColor}">确定</van-button>
            </div>
        </van-popup>
    </div>
</template>
 
<script>
    import {
        mapState,
        mapGetters
    } from 'vuex';
    import {
        getParams
    } from '@/utils/index';
    export default {
        data() {
            return {
                exporShow:false,
                loading:false,
                finished:false,
                isShow: false,
                isShowFilter:false,
                list: [],
                orderData: [],
                belongArr: [],
                periodsArr: [],
                statusArr: [],
                filter: {}
            }
        },
        computed: {
            ...mapState(['userinfo']),
            ...mapGetters(['orgType']),
        },
        methods: {
            search(v,isClear){
                this.filter.id ="";
                this.finished = false;
                this.init(v,isClear)
            },
            go(orderId) {
                this.$router.push({
                    path:'/product/wxScore-detail',
                    query:{
                        orderId:orderId
                    }
                })
            },
            //订单导出
            exportFile() {
                if (!this.list.length) {
                    this.$notify('暂无数据导出')
                    return;
                }
                this.$api.wxScoreExport(this.filter).then((res) => {
                    this.exporShow = true;
                }).catch((err) => {
 
                });
            },
            // 获取订单列表
            init(params = this.filter,isClear) {
                console.log("111");
                this.loading = true;
                this.$api.wxScoreList(params).then(res => {
                    this.filter = {...params};
                    if(isClear){
                        this.list = [];
                    }
                    let list = res.body || [],
                        len = list.length;
                    if (len) {
                        this.filter.id = list[list.length - 1].id;
                        list.forEach(item => {
                            let color = 'success';
                            this.list.push({
                                ...item,
                                list: [{
                                    value: item.guaranteedAmt,
                                    label: '担保金额',
                                    },
                                    {
                                        value: item.mblNo,
                                        label: '用户手机号',
                                    },
                                    {
                                        value: item.status,
                                        label: '订单状态',
                                    },
                                ]
                            })
                        })
                    }
                    if (len < 10) {
                        this.finished = true;
                    }
                    this.loading = false;
                    this.isShow = false;
                }).catch((err) => {
                    this.finished = true;
                    this.loading = false;
                });
            },
        },
    }
</script>
 
<style lang="less" scoped>
 
    .order-lthyj {
        height: 100%;
        background-color: @c-bg-f5;
    }
    .order-list {
        margin-top: 60px;
        padding: 0 8px 30px;
        background-color: @c-bg-f5;
        .info {
            margin-bottom: 20px;
        }
    }
    .popup-content{
        height: 150px;
        width: 280px;
        border-radius: 3px;
        .icon-box{
            z-index: 99999;
            height: 64px;
            width: 64px;
            position: absolute;
            left: 50%;
            background:rgba(66,61,93,0.1);
            border-radius: 50%;
            transform: translate(-50%,-50%);
 
            .child{
                height: 55px;
                width: 55px;
                background:rgba(66,61,93,0.8);
                border-radius: 50%;
 
            }
        }
        .text{
            width: 210px;
            text-align: center;
            margin: 0 auto;
            padding-top: 50px;
            line-height: 18px;
            .top{
                color: @c-text-666;
            }
        }
        .btn-submit{
            .lh(44px);
            position: absolute;
            width: 100%;
            bottom: 0;
            color: @c-text-default;
        }
    }
</style>