<template>
    <view
        class="b-title"
        @tap="onGo(url, urlType)"
    >
        <view>
            <text class="c-font-big tit-text" :style="textStyle">{{ text }}</text>
            <text v-if="subText" class="c-font-normal c-color-gray">{{ subText }}</text>
        </view>
        <c-icon
            v-if="url"
            name="right"
            class="right-icon"
        />
    </view>
</template>

<script>
/**
* @file title
* @author haoyan
*/
import Icon from '@baidu/med-ui/components/Icon/Icon';
import {navigate} from '../../utils/navigate';

export default {
    config: {
        component: true
    },
    props: {
        text: {
            'type': String,
            'default': ''
        },
        subText: {
            'type': String,
            'default': ''
        },
        textStyle: {
            type: Object,
            default() {
                return {};
            }
        },
        extend: {
            type: Object,
            default() {
                return {};
            }
        },
        url: {
            'type': String,
            'default': ''
        },
        urlType: {
            'type': String,
            'default': '0'
        }
    },
    data() {
        return {
        };
    },
    components: {
        'c-icon': Icon
    },
    methods: {
        onGo(url, urlType) {
            if (url) {
                navigate({
                    url,
                    urlType,
                    extend: this.extend
                });
            }
        }
    }
};
</script>
<style lang="less" scoped>
.b-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tit-text {
    font-weight: bold;
    color: #333333;
    margin-right: 4px;
}
.right-icon {
    color: #666666;
    position: relative;
    right: -4px;
}
</style>


