football/pages/app_admin/review-message/review-message.vue

<template>
	<app-layout>
		<view class="review-message">
			<view v-if="titleShow" class="header main-center">
				<view class="header-item box-grow-1" @click="changeType(1)" v-if="mch=== '1'">
					<app-form-id>
						<text :class="{'active-header': type === 1}">商户</text>
					</app-form-id>
				</view>
				<view class="header-item box-grow-1" @click="changeType(2)" v-if="share=== '1'">
					<app-form-id>
						<text :class="{'active-header': type === 2}">分销商</text>
					</app-form-id>
				</view>
                <view class="header-item box-grow-1" @click="changeType(3)" v-if="bonus=== '1'">
                    <app-form-id>
                        <text :class="{'active-header': type === 3}">队长</text>
                    </app-form-id>
                </view>
                <view class="header-item box-grow-1" @click="changeType(4)" v-if="stock=== '1'">
                    <app-form-id>
                        <text :class="{'active-header': type === 4}">股东</text>
                    </app-form-id>
                </view>
			</view>
			<view class="search" :class="{'search-top': titleShow}">
				<view class="search-view dir-left-nowrap main-center cross-center" v-if="!searchBool" @click="searchBool = true">
					<image class="image" src="../image/icon-search.png"></image>
					<view class="text">{{type === 1 ? '请输入店铺名称搜索':type ==3 || type == 4 ? '请输入昵称搜索' : '请输入昵称或姓名搜索' }}</view>
				</view>
                <view style="position: relative">
    				<input id="search" :placeholder="type === 1 ? '请输入店铺名称搜索':type ==3 || type == 4 ? '请输入昵称搜索' : '请输入昵称或姓名搜索'" v-model="keyword" type="text" focus v-if="searchBool" @focus="getFocus=true" @blur="blurFocus" class="search-view">
                    <image v-if="getFocus && keyword.length > 0" @click="clearSearch" class="search-clear" src="../image/clear.png"></image>
                </view>
			</view>
			<view class="content" :class="{'content-top': titleShow}">
				<template v-if="type != 1">
					<view class="content-item dir-top-nowrap" :key="index" v-for="(item, index) in list">
						<view class="content-content dir-left-nowrap">
							<image class="content-image" :src="item.avatar"></image>
							<view class="content-name dir-top-nowrap">
                                <view class="name" v-if="type === 3">{{item.user.nickname}}</view>
								<view class="name" v-else>{{item.nickname}}</view>
								<view v-if="type === 2" class="referrer">推荐人：{{item.parent_name}}</view>
							</view>
						</view>
						<view class="content-buttons dir-left-nowrap main-right">
							<view class="refuse" @click="refuse(item)">
								<app-form-id>
									拒绝
								</app-form-id>
							</view>
							<view class="by" @click="by(item)">
								<app-form-id>
									通过
								</app-form-id>
							</view>
						</view>
					</view>
				</template>
				<template v-if="type === 1">
					<view class="check-content" v-for="(item, index) in list" :key="index">
						<app-jump-button form :url="`/pages/app_admin/mch-detail/mch-detail?id=${item.id}`">
							<view class="check-nei dir-left-nowrap cross-center">
								<image class="check-avatar" :src="item.user.userInfo.avatar"></image>
								<view class="check-content-content">
									<view class="name">{{item.user.nickname}}</view>
									<view class="shop">{{item.store.name}}</view>
								</view>
								<image class="icon" src="../image/arrow-right.png"></image>
							</view>
						</app-jump-button>
					</view>
				</template>
			</view>
			<view class="no-tip" v-if="list.length === 0">
				<image src="https://v4test.zjhejiang.com/web/statics/img/app/app_admin/no-message.png"></image>
				<view>没有任何消息哦~</view>
			</view>
			<view @touchmove.stop.prevent="" class="model" v-if="model">
				<template v-if="modelType === 1">
					<view class="refuse">
						<view class="top">{{type > 2 ? '拒绝申请' : '不通过申请'}}</view>
						<view class="content">
							<textarea v-model="reasonRefusal" class="textarea" placeholder="请填写拒绝理由"></textarea>
						</view>
						<view class="buttons dir-left-nowrap cross-center">
							<view class="but cancel"  @click="cancel">
								<app-form-id>
									取消
								</app-form-id>
							</view>
							<view class="line"></view>
							<view class="but confirm"  @click="confirm">
								<app-form-id>确认</app-form-id>
							</view>
						</view>
					</view>
				</template>
				<template v-if="modelType === 2">
					<view class="by">
						<view class="top">通过申请</view>
						<view class="content">
							是否确认通过申请
						</view>
						<view class="buttons dir-left-nowrap cross-center">
							<view class="but cancel" @click="cancel">
								<app-form-id>
									取消
								</app-form-id>
							</view>
							<view class="line"></view>
							<view class="but confirm" @click="confirm">
								<app-form-id>确认</app-form-id>
							</view>
						</view>
					</view>
				</template>
			</view>
		</view>
	</app-layout>
</template>

<script>
    export default {
        name: "review-message",
	    data() {
            return {
                type: 1,
                mch: '0',
                share: '0',
                bonus: '0',
                stock: '0',
                over: false,
                titleShow: false,
                list: [],
                getFocus: false,
                keyword: '',
                searchBool: false,
                modelType: 1,
                reasonRefusal: '',
	            setItem: {},
	            model: false,
	            page: 1,
            }
	    },
	    onLoad(options) {
            this.mch = options.mch;
            this.share = options.share;
            this.bonus = options.bonus;
            this.stock = options.stock;
            if (this.mch === '1') {
                if(this.share === '1' || this.bonus === '1' || this.stock === '1') {
                    this.titleShow = true;
                }else {
                    uni.setNavigationBarTitle({
                        title: '多商户审核消息'
                    })
                }
            }
            if (this.share === '1') {
                if(this.mch === '1' || this.bonus === '1' || this.stock === '1') {
                    this.titleShow = true;
                    if(this.mch === '0') {
                        this.type = 2;
                    }
                }else {
                    this.type = 2;
                    uni.setNavigationBarTitle({
                        title: '分销商审核消息'
                    })
                }
            }
            if (this.bonus === '1') {
                if(this.mch === '1' || this.share === '1' || this.stock === '1') {
                    this.titleShow = true;
                    if(this.share === '0' && this.mch === '0') {
                        this.type = 3;
                    }
                }else {
                    this.type = 3;
                    uni.setNavigationBarTitle({
                        title: '团队分红审核消息'
                    })
                }
            }
            if (this.stock === '1') {
                if(this.mch === '1' || this.bonus === '1' || this.share === '1') {
                    this.titleShow = true;
                }else {
                    this.type = 4;
                    uni.setNavigationBarTitle({
                        title: '股东分红审核消息'
                    })
                }
            }
            this.request({
	            type: this.type,
	            page: 1,
	            keyword: '',
            }).then(response => {
                if (response) {
                    this.list = response.list;
                }
            })
	    },
        onReachBottom() {
            if (!this.over) {
                this.page++;
                this.request({
                    type: this.type,
                    page: this.page,
                    keyword: this.keyword,
                }).then(response => {
                    console.log(response);
                    if (response && response.list.length > 0) {
                        this.list = [...this.list, ...response.list];
                    } else if (response && response.list.length === 0) {
                        this.over = true;
                    }
                });
            }
        },
        onShow() {
            // let type = 1;
            // if (this.mch === '0') {
            //     this.type = 2;
            // }
            this.request({
                type: this.type,
                page: 1,
                keyword: '',
            }).then(response => {
                if (response) {
                    this.list = response.list;
                }
            });
        },
	    methods: {
            blurFocus() {
                let that = this;
                setTimeout(v =>{
                    that.getFocus=false;
                    that.searchText();
                },300)
            },

            clearSearch() {
                let that = this;
                that.keyword = '';
            },

            changeType(data) {
                this.list = [];
                this.page = 1;
                this.type = data;
                this.over = false;
                this.keyword = '';
                this.searchBool = false;
                this.request({
	                type: data,
	                page: this.page,
                    keyword: this.keyword,
                }).then(response => {
                    if (response) {
                        this.list = response.list;
                    }
                });
            },
		    async request({type, page, keyword}) {
                const response = await this.$request({
	                url: this.$api.app_admin.review,
	                data: {
	                    type: type,
                        page: page,
                        keyword: keyword,
	                }
                });
                if (response.code === 0) {
                    return response.data;
                } else {
                    return false;
                }
		    },
            checkQueue(queue_id) {
                this.$request({
                    url: this.$api.app_admin.queue,
                    data: {
                        queue_id: queue_id,
                    }
                }).then(response => {
                    if (response.retry && response.retry == 1) {
                        this.checkQueue(queue_id);
                    }else {
                        for (let i = 0; i < this.list.length; i++) {
                            if (this.list[i].id === this.setItem.id) {
                                this.$delete(this.list, i);
                                this.model=false;
                                this.setItem = {};
                            }
                        }
                    }
                })
            },
            searchText() {
                if (this.keyword === '') {
                    this.searchBool = false;
                }
                this.page = 1;
                this.over = false;
                this.request({
                    type: this.type,
                    page: this.page,
                    keyword: this.keyword,
                }).then(response => {
                    if (response) {
                        this.list = response.list;
                    }
                });
            },
            refuse(data) {
                this.setItem = data;
                this.modelType = 1;
                this.model = true;
            },
            by(data) {
                this.setItem = data;
                this.modelType = 2;
                this.model = true;
            },
            confirm() {
                if (this.modelType === 2) {
                    this.$request({
                        url: this.$api.app_admin.review_switch,
                        method: 'post',
                        data: {
                            type: this.type,
                            status: 1,
                            form: JSON.stringify(this.setItem),
                            user_id: this.setItem.user_id,
                        }
                    }).then(response => {
                        if (response.code === 0) {
                            if(this.type == 3) {
                                this.checkQueue(response.data.queue_id);
                            }else {
                                for (let i = 0; i < this.list.length; i++) {
                                    if (this.list[i].id === this.setItem.id) {
                                        this.$delete(this.list, i);
                                        this.model=false;
                                        this.setItem = {};
                                    }
                                }
                            }
                        }
                    })
                } else if (this.modelType === 1) {
                    this.setItem.review_remark = this.reasonRefusal;
                    this.$request({
                        url: this.$api.app_admin.review_switch,
                        method: 'post',
                        data: {
                            type: this.type,
                            status: 2,
                            form: JSON.stringify(this.setItem),
                            reason: this.reasonRefusal,
                            user_id: this.setItem.user_id,
                        }
                    }).then(response => {
                        if (response.code === 0) {
                            this.reasonRefusal = '';
                            for (let i = 0; i < this.list.length; i++) {
                                if (this.list[i].id === this.setItem.id) {
                                    this.$delete(this.list, i);
                                    this.model=false;
                                    this.setItem = {};
                                }
                            }
                        }else {
                            uni.showToast({
                                title: response.msg,
                                icon: 'none',
                                duration: 1000
                            });
                        }
                    });
                }
            },
            cancel() {
                this.model=false;
                this.setItem = {};
            }
	    }
    }
</script>

<style scoped lang="scss">
@import "./review-message.scss";
</style>