<template>
    <!-- htmlcs-disable -->
    <view>
        <view v-if="item.text">{{ item.text }}</view>
        <c-btn
            v-if="fmtBtn && fmtBtn.text"
            class="c-gap-top-small up-btn"
            @tap="onTap"
        >
            {{ fmtBtn.text }}
        </c-btn>
    </view>
</template>

<script>
import Button from '@baidu/med-ui/components/Button/Button';

import {upload} from '../../utils/upload';
import {send} from '../../utils/log';
import {contentType, answerType} from '../../utils/constant';
export default {
    config: {
        component: true
    },
    props: {
        item: {
            type: Object,
            default: () => {}
        }
    },
    components: {
        'c-btn': Button
    },
    lifetimes: {
        attached() {
            if (this.item && this.item.btns) {
                this.fmtBtn = this.item.btns;
                if (Array.isArray(this.item.btns) && this.item.btns[0]) {
                    this.fmtBtn = this.item.btns[0];
                }
            }
        }
    },
    data() {
        return {
            fmtBtn: null
        };
    },
    methods: {
        onTap() {
            this.$emit('beforeUpload');
            upload({
                url: this.fmtBtn.callback || this.fmtBtn.callbackUrl,
                name: 'picFile',
                onChoose: (info) => {
                    this.$emit('chooseImg', info);
                },
                onPreview: (info) => {
                    this.$emit('previewImg', info, {limit: this.fmtBtn.count || 6});
                },
                onUploadSuccess: (info) => {
                    const resp = info.resp;
                    this.$emit('uploadSuccess', {
                        callbackUrl: this.fmtBtn.messageCallback,
                        params: {
                            content: resp.origin,
                            pic_ids: resp.picID,
                            orientation: resp.orientation,
                            answerType: answerType.USER,
                            contentType: contentType.PIC
                        },
                        file: info.file
                    });
                },
                onUploadAll: res => {
                    // 单批次上传完毕
                    this.$emit('uploadAll', {
                        callbackUrl: this.fmtBtn.messageCallback || '',
                        res,
                    }, {limit: this.fmtBtn.count || 6});
                },
                onUploadError: (err) => {
                    this.$emit('uploadError', err);
                    if (!err.toast) {
                        err.toast = '图片上传失败，请重新上传';
                    }
                    this.$api.showToast({
                        title: err.toast,
                        icon: 'none'
                    });
                }
            });

            send({
                type: 'b',
                action: 'imUpload'
            });
        }
    }
};
</script>
<style lang="less">
.up-btn {
    text-align: center;
}
</style>
