<template>
    <view
        class="wrapper logo c-gap-inner-top-ll"
        @tap="onTap">
        <image :src="data.img" class="logo-img"/>
        <view
            v-if="data.title && data.title.length"
            class="logo-text">
            <view
                v-for="(text, i) in data.title"
                :key="i"
                class="logo-title">
                {{ text }}
            </view>
            <view class="c-color-gray c-font-small slogan">
                {{ data.slogan }}
            </view>
        </view>
    </view>
</template>

<script>
/**
* @file logo
* @author zhangeryi
*/
import share from '../../utils/share';
import {navigate} from '../../utils/navigate';
export default {
    config: {
        component: true
    },
    props: {
        data: {
            type: Object,
            default() {
                return {};
            }
        }
    },
    created() {
        let shareData = this.data && this.data.share || {};
        let {appId, timestamp, nonceStr, signature} = shareData;
        share({
            title: '北京市新冠肺炎线上医生咨询平台',
            url: window.location.href,
            content: '北京医学会主办 公益 便捷 专业',
            imageUrl: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3282611646,1833820080&fm=179&app=35&f=PNG?w=300&h=300&s=7EE0BF560DD2C6C04EB3BC6E0300702A'
        }, this.data.share ? {
            wx: true,
            debug: false,
            appId: 'wx23e6a3db6d281e46', // 政府公众号
            timestamp,
            nonceStr,
            signature
        } : '');
    },
    methods: {
        onTap() {
            const {
                url
            } = this.data;
            if (url) {
                navigate({
                    url
                });
            }
        }
    }
};
</script>
<style lang="less" scoped>
.wrapper {
    padding-left: .17rem;
    padding-right: .17rem;
    &-small {
        padding-left: .15rem;
        padding-right: .15rem;
    }
}
.logo {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    font-weight: bold;
    &-img {
        width: 41px;
        height: 41px;
        margin-right: .16rem;
        display: block;
    }
    &-title {
        font-weight: bold;
        font-size: 16px;
        line-height: 25px;
    }
    .slogan {
        font-weight: bold;
        color: #00c8c8;
    }
}
</style>


