<template>
    <view class="eva">
        <!-- 头部 -->
        <view class="eva-header c-gap-inner-left-large">{{ item.title }}</view>
        <!-- 内容 -->
        <view class="c-gap-top c-font-15 eva-cont">
            <view
                v-if="item.basic"
                class="c-line-clamp2">
                <text
                    v-if="item.basic.title"
                    class="c-color-gray">{{ item.basic.title }}：</text>
                <text v-if="item.basic.name">{{ item.basic.name }}</text>
                <text
                    v-if="item.basic.sex"
                    class="c-gap-left">{{ item.basic.sex }}</text>
                <text
                    v-if="item.basic.age"
                    class="c-gap-left">{{ item.basic.age }}</text>
            </view>
            <view
                v-for="(o, i) in item.list"
                v-show="isOpen ? true : (i < item.limit - 1)"
                class="c-line-clamp2">
                <text
                    v-if="o.title"
                    class="c-color-gray">{{ o.title }}：</text>
                <text v-if="o.text">{{ o.text }}</text>
            </view>
            <!-- 展开收起 -->
            <view
                v-if="!isOpen && item.limit > 0 && (item.list.length > item.limit)"
                class="c-color-green c-tac c-font-13 c-gap-top-small"
                @tap="onTap">
                <text class="c-inline-block">查看全部</text>
                <c-icon
                    name="down"
                    font-size="13px"
                    class="c-gap-left-small c-inline-block"/>
            </view>
            <!-- 按钮 -->
            <view
                v-if="item.btn"
                class="c-gap-top">
                <c-button
                    v-if="item.btn"
                    type="primary"
                    :background="item.btn.bg"
                    border-radius="20px"
                    :height="40"
                    :font-size="15"
                    @tap="onGo(item.btn)">{{ item.btn.text }}</c-button>
            </view>
        </view>
    </view>
</template>

<script>
/**
* @file 问诊-评估结果
* @author haoyan
*/
import Icon from '@baidu/med-ui/components/Icon/Icon';
import Button from '@baidu/med-ui/components/Button/Button';
export default {
    config: {
        component: true
    },
    components: {
        'c-icon': Icon,
        'c-button': Button
    },
    props: {
        item: {
            'type': Object,
            'default': {}
        }
    },
    data() {
        return {
            isOpen: false,
            limit: 999
        };
    },
    lifetimes: {
        attached() {
            const {
                limit
            } = this.item;
            if (limit) {
                this.$set(this.item, 'limit', Number(limit));
            }
        },
        detached() {
        }
    },
    methods: {
        // 点击[播放语音]
        onTap() {
            this.isOpen = !this.isOpen;
        },
        onGo(o) {
            const env = process.env.MARS_ENV;
            if (o.type === 'smartapp') {
                if (env === 'h5') {
                    window.location.href = o.url;
                }
                else if (env === 'swan') {
                    this.$api.navigateToSmartProgram({
                        appKey: o.appkey,
                        path: o.url.replace(/^\//, '')
                    });
                }
            }
        }
    }
};
</script>

<style lang="less" scoped>
.eva {
    position: relative;
    min-width: 80px;
    &-header {
        height: .37rem;
        background-color: #EBFBFB;
        color: #00C8C8;
        display: flex;
        align-items: center;
        margin: -.1rem -.15rem 0 -.15rem;
    }
    &-cont {
        color: #151515;
        background-color: #fff;
        margin: 0 -.15rem -.1rem -.15rem;
        padding: .1rem .15rem;
    }
}
</style>