<template>
    <view class="c-inline">
        <text
            v-for="(text, i) in list"
            :key="i"
            :class="list.length > 1 ? '' : 'c-inline'"
            selectable
        >
            {{ text }}
        </text>
        <view class="c-line-superfine-after c-gap-top-middle"/>
        <view class="public-wrap">
            <text>{{ item.title }}{{ item.tip }}</text>
            <view style="z-index: 1;">
                <switch
                    color="#00C8C8"
                    :checked="selValue"
                    @change="change"
                />
            </view>
        </view>
    </view>
</template>

<script>
/**
 * @file components/im/im-text-public
 * @author zhangchun05
 */

import {ubcSend} from '@utils/log';
import {request} from '../../utils/request';
import {throttle} from '../../utils/core';

export default {
    config: {
        component: true
    },
    components: {
    },
    props: {
        item: {
            type: Object,
            default() {
                return {};
            }
        }
    },
    data() {
        return {
            list: [],
            selValue: null,
            msg: '',
        };
    },
    lifetimes: {
        attached() {
            const content = this.item.text;
            this.list = content.split(/\n/);
            this.selValue = this.item.displayType === 'public';
        }
    },
    methods: {
        change(ev) {
            let val;

            if (process.env.MARS_ENV === 'h5') {
                val = ev;
            } else {
                val = ev.detail && ev.detail.checked;
            }

            ubcSend({
                type: 'clk',
                value: val ? 'im_question_open' : 'im_question_close',
                ext: {
                    pd: 'wz'
                }
            });
            if (val) {
                if (this.selValue) {
                    return false;
                }
                this.getCoupon('public');
                this.$set(this, 'selValue', true);
            }
            else {
                this.$set(this, 'selValue', false);
                this.$api.showModal({
                    title: '取消公开问题吗？',
                    content: '公开问题可以帮助到更多的人\n(您的头像昵称、图片视频不会展示)',
                    cancelText: '取消公开',
                    cancelColor: '#1F1F1F',
                    confirmText: '我再想想',
                    confirmColor: '#00c8c8',
                    success: res => {
                        if (res.confirm) {
                            this.$set(this, 'selValue', true);
                        }
                        if (res.cancel) {
                            this.getCoupon('privacy');
                        }
                    }
                });
            }
        },
        // 领取优惠券接口
        getCoupon: throttle(function (action) {
            let params = {
                action: action
            };
            request({
                url: this.item.callbackUrl,
                data: params,
                method: 'POST',
                header: {
                    'content-type': 'application/x-www-form-urlencoded'
                },
                isNeedLogin: true
            }).then(res => {
                this.msg = res.data.msg;
                if (this.msg) {
                    this.$api.showToast({title: this.msg, icon: 'none'});
                }
            }).catch(err => {
                // console.log(err);
            });
        }, 1000)
    }
};
</script>

<style lang="less">
.public-wrap {
    padding-top: 12px;
    padding-bottom: 2px;
    display: flex;
    justify-content: flex-end;
}
</style>
