1

PC-20250623MANY\Administrator

2025-07-22 9ec3bd6e8d7357927533d8966f882cb5d28b3e0f

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
<template>
    <div class="pledgeRecord">
        <assets-head :title="$t('质押记录')"></assets-head>
        <div class="content px-32">
            <van-list v-model="loading" :loading-text="$t('加载中...')" :finished="finished"
                :finished-text="orderList.length ? $t('已经全部加载完毕') : ''" @load="onLoad" :offset="130">
                <div class="item mb-40 contBackground rounded-lg pl-24 pr-22 pb-30" v-if="item" v-for="(item,index) in orderList" :key="index">
                    <div class="flex justify-between border-b-color h-101 box-border text items-center mb-30">
                        <div class="textColor font-36" :class="{'redColor':item.orderType==5,'skyColor':item.orderType==2 }">
                            {{fixStr(item.orderType)}}</div>
                        <div class="text-grey font-32">{{item.createTime}}</div>
                    </div>
                    <div class="flex">
                        <div class="mr-100 flex-1" v-if="item.orderType==1 || item.orderType==3 || item.orderType==4">
                            <div class="text-grey font-32">{{item.orderType==4?$t('还款数量'):$t('借款')}}</div>
                            <div class="textColor mt-20 font-32">{{item.loanAmount}}&nbsp;USDT</div>
                        </div>
                        <div class="mr-100 flex-1" v-if="item.orderType==1 || item.orderType==2">
                            <div class="text-grey">{{$t('质押类型')}}</div>
                            <div class="textColor mt-20">{{$t('币')}}</div>
                        </div>
                        <div class="flex-1" v-if="item.orderType==1 || item.orderType==2">
                            <div class="text-grey">{{$t('质押金额')}}</div>
                            <div class="textColor mt-20">{{item.pledgeAmount}}&nbsp;{{item.pledgeCurrency.toUpperCase()}}</div>
                        </div>
                    </div>
                </div>
            </van-list>         
        </div>
    </div>
</template>
 
<script>
import assetsHead from "@/components/assets-head";
import Axios from "@/API/pledgeLoan.js";
import { List } from 'vant'
export default {
    props: {
 
    },
    components: {
        assetsHead,
        [List.name]: List,
    },
    data() {
        return {
            id:'',
            page_no:1,
            orderList: [],
            loading: false,
            finished: false,
        }
    },
    created(){
        this.id = this.$route.query.id
    },
    methods: {
        onLoad() {
            this.getRelationOrderList()
        },
        getRelationOrderList() {
            Axios.relationOrderList({
                loanOrderId: this.id,
                page_no: this.page_no
            }).then(res => {
                this.orderList = [...this.orderList, ...res.data]
                this.loading = false
                if (res.data.length < 10) {
                    this.finished = true
                } else {
                    this.page++
                }
            })
        },
        fixStr(orderType) {
            let str = ''
            if (orderType == 1) {
                str = this.$t('借款')
            } else if (orderType == 2) {
                str = this.$t('新增质押')
            } else if (orderType == 3) {
                str = this.$t('续借')
            } else if (orderType == 4) {
                str = this.$t('还款')
            } else if (orderType == 5) {
                str = this.$t('强平结清')
            }
            return str;
        },
    }
}
</script>
 
<style lang="scss" scoped>
.pledgeRecord {
    width: 100%;
    box-sizing: border-box;
}
.redColor {
    color: #E35461;
}
.skyColor {
    color: #13D3EB;
}
</style>