<template>
    <view v-if="visitInfo && visitInfo.length" class="hos-visit-info">
        <view 
            v-for="(item, index) in visitInfo"
            :key="index"
            class="hos-visit-info-container space"
            @tap.stop="navigateTo(item.link, 0)"
        >
            <view class="c-color-333 c-font-normal c-line-clamp1">{{ item.name }}</view>
            <view class="c-color-gray c-font-13 c-line-clamp1">{{ item.consultationNo }}位医生出诊</view>
        </view>
    </view>
</template>

<script>
/**
 * @file 医院主页/出诊信息
 * @author chenhongfan
 * @categories 医院主页
 * @tags [sub-component]
 */
import { navigate } from '@utils/navigate';

export default {
    config: {
        component: true
    },
    data() {
        return {};
    },
    props: {
        visitInfo: {
            type: Array,
            default: () => ([]),
        },
    },
    methods: {
        // 跳转
        navigateTo(link, type = 0) {
            if (!link) {
                return;
            }
            navigate({ 
                url: link,
                urlType: type,
                log: {
                    type: 'clk',
                    value: 'ChuZhenXinXi_Department',
                }
            });
        }
    }
};
</script>

<style lang="less" scoped>
.hos-visit-info {
    display: flex;
    margin-top: 7px;
    flex-wrap: wrap;
    flex-direction: row;
    &-container {
        text-align: center;
        width: calc((100% - 15px)/3);
        background-color: #F5F5F5;
        border-radius: 9px;
        padding: 8px 8px;
        margin-top: 9px;
        box-sizing: border-box;
        margin-right: 5px;
    }
}
.space:nth-child(3n) {
    margin-right: 0px;
}
</style>
