叶松
2023-11-21 6eaaba4f97028d581df3e019a7705d60b398c26e
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
205
206
207
208
209
210
211
212
<template>
    <view class="home_index">
        <view class="home_content">
            <u-navbar
                title="奖惩记录"
                bgColor="transparent"
                leftIconColor="#fff"
                titleStyle="text-align:left;width:100%;color:#fff;margin-left:40px;"
                :autoBack="true">
            </u-navbar>
            <view class="home_top_bg"></view>
            <view class="notice_header">
                <view class="notice_header_num">{{numInit-recordLists[0].punishNum+recordLists[0].encourageNum}}</view>
                <view class="notice_header_title">安全积分</view>
            </view>
            <view class="record_main">
                <scroll-view
                    scroll-y="true"
                    class="record_index_scroll"
                    :scroll-top="scrollTop" 
                    refresher-enabled="true" 
                    refresher-background="#EAEAEA"
                    :refresher-triggered="triggered" 
                    @refresherpulling="refresherrefresh"
                    @scrolltolower="scrolltoLower">
                    <u-collapse accordion :value="recordLists[0].id">
                        <u-collapse-item :name="item.id" :title="timeNow" :label="`奖励${recordLists[0].encourage===null?0:recordLists[0].encourage}分,惩罚${recordLists[0].punish ===null?0:recordLists[0].encourage}分`" v-for="(item,index) in recordLists" :key="index">
                            <view class="record_items" v-for="(itemTip,indexTip) in item.encourageRecordDtos.filter(item=>item.encourageName !==null)" :key="indexTip">
                                <view class="record_items_left">
                                    <view class="record_items_left_text">{{itemTip.encourageName}}</view>
                                    <view class="record_items_left_time">{{itemTip.createTime}}</view>
                                </view>
                                <view :class="{'record_items_right1':itemTip.matterType === '2','record_items_right':itemTip.matterType === '1'}" class="">{{itemTip.matterType==='1'?'+'+itemTip.integral:itemTip.matterType==='2'?'-'+itemTip.integral:itemTip.integral}}</view>
                            </view>
                            <!-- <view class="record_item_emop" v-if="item.encourageRecordDtos.length ===0">
                                暂无数据
                            </view> -->
                        </u-collapse-item>
                    </u-collapse>
                    <u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
                </scroll-view>
            </view>
        </view>
    </view>
</template>
 
<script>
    import { throttle,changeYearTime } from '../../plugins/public.js';
    export default {
        data(){
            return{
                numInit:100,//初始值
                timeNow:changeYearTime(Number(new Date())),
                recordLists:[
                    {    id:'1',
                        title:'文档指南',
                        tips:'奖励18分 惩罚15分',
                        contentss:[
                            {
                                titles:'参加消防知识培训',
                                time:'2023-04-05 10:12:31',
                                nums:'+3'
                            }
                        ]
                    },
                    {
                        title:'组件全面',
                        tips:'奖励18分 惩罚15分',
                        contentss:[],
                    }
                ],//记录列表
                pageNum: 1,
                pageSize: 10,
                loadPage: 0,
                scrollTop: 0,
                triggered: true,
                status: 'loading',
                loadText: {
                    loading: '努力加载中',
                    nomore: '没有更多数据了'
                },
            }
        },
        onLoad() {
            this.searchRecordList()
        },
        methods:{
            //查询列表
            searchRecordList(){
                this.triggered = true;
                this.recordLists = [];
                this.$api.labourSystem.punishRecordLists({}).then(res=>{
                    if(res.statusMsg === 'ok'){
                        this.recordLists = [res.data]
                        this.triggered = false;
                        this.status = 'nomore';
                    }else{
                        uni.$u.toast(res.statusMsg);
                    }
                }).catch((err) => {
                    uni.$u.toast('请检查网络服务或联系管理员!')
                })
            },
            //自定义下拉刷新
            refresherrefresh: throttle(function() {
                this.status = 'loading';
                this.pageNum = 1;
                this.searchRecordList();
                uni.$u.toast('刷新成功');
            }, 500),
            //触底刷新
            scrolltoLower: throttle(function() {
                this.status = 'loading';
                this.pageNum = 1;
                this.searchRecordList();
            }, 1500),
        }
    }
</script>
 
<style scoped lang="scss">
    .home_index{
        background-color: #FFFFFF;
        width: 100%;
        height: 100vh;
        overflow: hidden;
        .home_content{
            position: relative;
            height: calc(100vh - 110rpx);
            .home_top_bg{
                background: url('https://szpipe.thhy-tj.com/group1/M00/00/02/bx5d1GSihIGAcLm2AAH16Fc_aMk207.png') no-repeat;
                background-size: 100% 100%;
                height: 30vh;
                position: absolute;
                left: 0;
                top: 0;
                right: 0;
            }
            .notice_header{
                height: 148px;
                margin: 0px 15px;
                position: absolute;
                top: 50px;
                right: 0;
                left: 0;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
                
                .notice_header_num{
                    color: #FFFFFF;
                    font-size: 44px;
                }
                .notice_header_title{
                    font-size: 16px;
                    color: #FFFFFF;
                }
            }
            .record_main{
                padding-top: 20px;
                overflow: auto;
                height: calc(100% - 176px);
                position: absolute;
                top: 220px;
                right: 0;
                left: 0;
                
                .record_index_scroll{
                    height: 90%;
                    
                    .record_items{
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        flex-direction: row;
                        height: 65px;
                        border-bottom: 1px solid #F3F3F3;
                        
                        .record_items_left{
                            .record_items_left_text{
                                color: #333333;
                                font-size: 16px;
                            }
                            .record_items_left_time{
                                margin-top: 5px;
                                color: #999999;
                                font-size: 12px;
                            }
                        }
                        .record_items_right{
                            color: #1977FF;
                            font-size: 16px;
                        }
                        .record_items_right1{
                            color: #999999;
                            font-size: 16px;
                        }
                    }
                    .record_item_emop{
                        text-align: center;
                        font-size: 16px;
                        color: #999999;
                    }
                }
            }
        }
    }
    ::v-deep .u-collapse-item__content{
        // height: 100%!important;
    }
</style>