<template>
    <view @tap="onTap">
        <view class="c-line-bottom c-gap-inner-bottom qa-flex qa-title">
            <text
                v-if="item.name"
                class="c-color-333 c-font-17 qa-bold">{{ item.name }}</text>
            <c-icon name="right" font-size="17px"/>
        </view>
        <view class="qa-flex c-gap-top">
            <view
                :style="{
                    'background-image': 'url(' + item.img + ')'
                }"
                class="qa-img c-gap-top-small"></view>
            <view class="qa-cont c-gap-inner-left">
                <view
                    v-if="item.title"
                    class="c-colot-333 c-font-normal c-line-clamp1">{{ item.title }}</view>
                <view
                    v-if="item.text"
                    class="c-color-gray c-font-normal">{{ item.text }}</view>
            </view>
        </view>
    </view>
</template>

<script>
/**
* @file 患者报到-问诊表
* @author haoyan
* @categories 业务组件
* @tags [component]
*/
import CIcon from '@baidu/med-ui/components/Icon/Icon';
import {navigate} from '@baidu/med-utils/lib/Mars/navigate';
import {navToBdBoxH5} from '../../utils/navigate';

export default {
    config: {
        component: true
    },
    props: {
        /**
         * 组件的数据
         */
        item: {
            type: Object,
            default() {
                return {};
            }
        }
    },
    data() {
        return {
        };
    },
    components: {
        CIcon
    },
    methods: {
        onTap() {
            if (this.item.urlType && this.item.url) {
                navigate({
                    url: this.item.url,
                    urlType: this.item.urlType
                });
            }
        }
    }
};
</script>

<style lang="less" scoped>
.qa-title {
    align-items: center;
    justify-content: space-between;
}
.qa-bold {
    font-weight: 500;
}
.qa-flex {
    display: flex;
}
.qa-img {
    background-size: contain;
    background-repeat: no-repeat;
    width: .62rem;
    height: .62rem;
}
.qa-cont {
    flex: 1;
}
</style>