<template>
    <b-navigate
        :url="!hospital.url && restructure ? getHospitalUrl() : hospital.url"
        :log="log"
    >
        <view class="b-hos-item">
            <view class="c-gap-right">
                <b-img
                    has-compress
                    :src="hospital.hospitalLogo ? hospital.hospitalLogo : defaultHosLog"
                    width="0.48rem"
                    height="0.48rem"
                    mode="aspectFill"
                    :hack-white-stroke="false"
                    :extra="{column: 2}"
                />
            </view>
            <view class="hos-info hos-content-border">
                <view
                    v-if="hospital.hospitalName"
                    :class="['hos-name', 'c-font-17', 'c-line-clamp1',
                             hospital.hospitalDistance ? 'pad-right-41' : '']"
                >
                    {{ hospital.hospitalName }}
                </view>
                <view
                    v-if="hospital.hospitalTags && hospital.hospitalTags.length"
                >
                    <c-label
                        v-for="(tag, tagIndex) in hospital.hospitalTags"
                        :key="tagIndex"
                        :text="restructure ? tag.name : tag"
                        class="c-gap-right-small"
                    />
                </view>
                <view
                    v-if="hospital.hospitalSpecDepart && hospital.hospitalSpecDepart.length"
                    class="hos-depart c-font-normal c-line-clamp1"
                >
                    特色科室：{{ hospital.hospitalSpecDepart }}
                </view>
                <view
                    v-if="hospital.hospitalAppointsTime"
                    class="hospital-addr c-font-normal c-line-clamp1"
                >
                    放号时间：{{ hospital.hospitalAppointsTime }}
                </view>
                <view
                    v-if="hospital.hospitalAddress"
                    class="hospital-addr c-font-normal c-line-clamp1"
                >
                    地址：{{ hospital.hospitalAddress }}
                </view>
            </view>
        </view>
    </b-navigate>
</template>

<script>
import Label from '@baidu/med-ui/components/Label/LabelOld';
import Image from '../common/image';
import Navigate from '../common/navigate';
import {urlAddQuery} from '@utils/core';

export default {
    config: {
        component: true
    },
    props: {
        hospital: {
            type: Object,
            default() {
                return {};
            }
        },
        labelColor: {
            type: String,
            default: 'blue'
        },
        restructure: {
            type: Boolean,
            default: false
        },
        /**
         * 页面sf_ref 参数
         */
        sfRef: {
            type: String,
            default: ''
        },
        /**
         * 页面参数from
         */
        from: {
            type: String,
            default: ''
        },
        /**
         * 检索query
         */
        word: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            defaultHosLog: 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=2128139361,2499500856&fm=179&app=35&f=PNG?w=144&h=144&s=88011F7C4F636F204C6611D20300E0BA',
            log: {
                type: 'clk',
                value: 'yiyuanka'
            }
        };
    },
    components: {
        'c-label': Label,
        'b-img': Image,
        'b-navigate': Navigate
    },
    methods: {
        /**
         * 获取跳转医院详情url
         */
        getHospitalUrl() {
            const info = this.hospital;
            let url = '';
            if (info.queryDepartment) {
                // 到医生列表
                url = this.formatUrl('/pages/guahao/expertlist/index', {
                    'q_department': info.queryDepartment,
                    'word': this.word
                });
            }
            else {
                // 到医院主页
                url = this.formatUrl('/pages/guahao/hospitaldetail/index', {
                    'hospital': info.hospitalName
                });
            }
            return url;
        },
        formatUrl(path, extParms) {
            let params = {
                'title': this.hospital.hospitalName,
                'hospital_id': encodeURIComponent(this.hospital.hospitalId),
                'sf_ref': this.sfRef,
                'from': this.from
            };
            Object.assign(params, extParms);
            return urlAddQuery(path, params);
        }
    }
};
</script>
<style lang="less" scoped>
.b-hos-item {
    display: flex;
    align-items: flex-start;
    padding: .12rem .13rem 0;
    box-sizing: border-box;

    .hos-info {
        flex: 1;
        box-sizing: border-box;
        position: relative;
        width: calc(100% - .48rem - .1rem);
    }

    .hos-name {
        color: #333;
        font-weight: bold;
        box-sizing: border-box;

        &.pad-right-41 {
            padding-right: .41rem;
        }
    }

    .hos-depart,
    .hospital-addr {
        color: #555;
    }

    .hos-depart-item {
        display: inline-block;
    }

    .hos-distance {
        position: absolute;
        top: .05rem;
        right: 0;
    }

    .hos-content-border {
        padding-bottom: .12rem;
        border-bottom: 1px solid #f1f1f1;
    }
}
</style>


