<template>
    <view v-if="show">
        <view class="pop-bg"></view>
        <view class="pop-storebox">
            <view class="pop-store">
                <view class="d-c-c table-title f-s-0 ">
                    <view class="flex-1 tc text-ellipsis box-s-b" style="padding-left: 45rpx;">{{$t('CK_KS_14')}}</view>
                    <view class="flex-1 tc text-ellipsis">{{$t('MN_F_23')}}</view>
                </view>
                <scroll-view scroll-y="true" style="height: 800rpx;" @scrolltolower="scrolltolowerFunc"
                    lower-threshold="50">
                    <view class="d-b-c store-item" v-for="(item, index) in listData" :key="index"
                        @click.stop=" pkMakerSpace = item.pkId" :class="index % 2 == 0 ? '' : 'single-bg'">
                        <view class="flex-1 tc text-ellipsis f24 gray3">{{ item.memberName }}</view>
                        <view class="flex-1 tc text-ellipsis f24 gray3">{{ item.phone }}</view>
                    </view>
                    <view class="d-c-c p30" v-if="listData.length == 0 && !loading">
                        <text class="cont">{{ $t('w_0405') }}</text>
                    </view>
                </scroll-view>
                <view class="border-t bottom-btns d-c-c f-s-0">
                    <button class="bottom-btn left-btn" @click="close">{{$t('ENU_P_TYPE0')}}</button>
                    <!-- <button class="bottom-btn left-btn" @click="close">取消</button> -->
                    <!-- <button class="bottom-btn right-btn" @click="exportFun">{{$t('MN_T_8')}}</button> -->
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import uniLoadMore from '@/components/uni-load-more.vue';
export default {
    components: {
        uniLoadMore
    },
    data() {
        return {
            show: false,
            is_load: false,
            form: {
                pageNum: 1,
                pageSize: 50
            },
            nameList: '',
            /*最后一页码数*/
            last_page: 0,
            /*有没有等多*/
            no_more: false,
            /*是否正在加载*/
            loading: false,
            listData: [],
            total: 0,
        }
    },
    computed: {
        /*加载中状态*/
        loadingType() {
            if (this.loading) {
                return 1;
            } else {
                if (this.listData.length != 0 && this.no_more) {
                    return 2;
                } else {
                    return 0;
                }
            }
        },
    },
    methods: {
        download() { 
            let baseUrl = this.websiteUrl();//服务器的ip
            let url = `${baseUrl}/inter-api/member/api/member-special/special-export?recName=${this.form.recName}&recPhone=${this.form.recPhone}`
            uni.downloadFile({
                url: url, //仅为示例，并非真实的资源
                header: {
                    'Authorization': 'Bearer ' + uni.getStorageSync('Admin-Token') || '',
                    'content-type': 'application/vnd.ms-excel'
                },
                responseType: 'blob',
                method: 'POST',
                success: (res) => {
                    if (res.statusCode === 200) {
                        console.log('下载成功');
                        //更改文件名称
                        // 拿到临时文件的绝对路径
                        let filepathss = plus.io.convertLocalFileSystemURL(res.tempFilePath);
                        // 通过这个路径来拿到他
                        plus.io.resolveLocalFileSystemURL(filepathss, function (entry) {
                            const tempFileName = entry.name;
                            entry.getParent(function (parentDicEntry) {
                                console.log(parentDicEntry.fullPath)
                                entry.moveTo({
                                    fullPath: parentDicEntry.fullPath + '/'
                                }, '新的文件名字.xlsx', function (newFile) {
                                    uni.openDocument({
                                        fileType: 'xlsx',
                                        filePath: newFile.fullPath,
                                        success: function (res2) {
                                            console.log('打开文档成功');
                                        },
                                        fail: function (err) {
                                            if (err.errCode == 1 || err
                                                .code == 1) {
                                                uni.showToast({
                                                    title: `下载成功，未找到能打开xlsx类型文件的手机应用`,
                                                    icon: 'none'
                                                })
                                            }
                                            console.log(err)
                                        }
                                    });
                                }, function (moveError) {
                                    uni.showToast({
                                        title: `已在第三方应用中打开过，请在第三方应用查看时保存`,
                                        icon: 'none'
                                    })
                                })
                            })
                        })
                    }
                }
            });

        },
        /* exportFun() {
            let self = this;
            const params = {
                recName: self.form.recName,
                recPhone: self.form.recPhone,
            }
            self.download();
            console.log('下载',self.form.recName,self.form.recPhone);
        }, */
        open(row) {
            this.form.pageNum = 1;
            this.form = Object.assign(this.form, row)
            this.listData = [];
            this.getData();
            this.show = true;
        },
        close() {
            this.show = false;
        },
        getData() {
            let self = this;
            self.loading = true;
            let params = this.form;
            self._get('member/api/member-special/special-list', params, res => {
                self.loading = false;
                self.listData = self.listData.concat(res.rows);
                self.total = res.total;
                if (self.total < self.form.pageNum * self.form.pageSize) {
                    self.no_more = true;
                }
            })
        },
        scrolltolowerFunc() {
            let self = this;
            if (self.no_more) {
                return;
            }
            if (self.form.pageNum * self.form.pageSize < self.total) {
                self.form.pageNum++;
                self.getData();
            } else {
                self.no_more = true;
            }
        },
    }
}
</script>

<style lang="scss">
.table-title {
    width: 654rpx;
    height: 68rpx;
    background: #F3F3F3;
    border: 1px solid #EEEEEE;
    margin-top: 20rpx;
    font-size: 26rpx;
    color: #333;
}

.pop-storebox {
    position: fixed;
    transition-duration: 300ms;
    transition-timing-function: ease-out;
    z-index: 107;
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    inset: 0px;
}

.select-boxs {
    width: 654rpx;
    height: 68rpx;
    background: #FFFFFF;
    border: 1px solid #EEEEEE;
    padding: 0 20rpx;
    box-sizing: border-box;
    line-height: 1;
}

.pop-store {
    box-sizing: border-box;
    border-radius: 20rpx;
    height: 1070rpx;
    width: 710rpx;
    padding: 24rpx 25rpx 10rpx 25rpx;
    background-color: #fff;
    position: relative;
}

.bottom-btns {
    padding: 49rpx 0;
}

.bottom-btn {
    width: 312rpx;
    height: 72rpx;
    font-size: 28rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    line-height: 1.5;
    border-radius: 34rpx;
}

.bottom-btn.left-btn {
    background: #eeeeee;
    color: #333;
    margin-right: 30rpx;
}

.bottom-btn.right-btn {
    background: #FB3024;
    color: #fff;
}

.single-bg {
    background-color: rgba(#F3F3F3, 0.4);
}

.f-s-0 {
    flex-shrink: 0;
}

.store-item {
    height: 68rpx;
    font-size: 24rpx;
    color: #333;
}

.radio-check {
    width: 36rpx;
    height: 36rpx;
    border: 1rpx solid #EEEEEE;
    border-radius: 50%;
    margin-left: 25rpx;
}

.radio-check-active {
    width: 36rpx;
    height: 36rpx;
    border: 1rpx solid #e03030;
    background-color: #e03030;
    border-radius: 50%;
    margin-left: 25rpx;
}
</style>