<!--
 * @Author: PoJun
 * @Date: 2023-09-28 10:38:11
 * @LastEditors: PoJun
 * @LastEditTime: 2024-01-04 14:55:05
 * @Message: 供应商详情页面
-->
<template>
    <view class="supplier-detail">
        <uv-navbar :border="false" :autoBack="true" bgColor="transparent" :placeholder="false"></uv-navbar>
        <uv-swiper :list="getImages" height="400" indicator circular></uv-swiper>
        <view class="supplier-detail-cont">
            <uv-cell-group :border="false">
                <uv-cell title="名称" :value="item.name" :border="false" :cellStyle="{ padding: '15px' }"></uv-cell>
                <uv-cell title="评分" :value="item.mark" :border="false" :cellStyle="{ padding: '15px' }"></uv-cell>
                <uv-cell
                    title="联系人"
                    :value="item.personName"
                    :border="false"
                    :cellStyle="{ padding: '15px' }"
                ></uv-cell>
                <uv-cell
                    title="联系方式"
                    :value="item.phone"
                    :border="false"
                    :cellStyle="{ padding: '15px' }"
                ></uv-cell>
                <uv-cell
                    title="供应商类型"
                    :value="item.type"
                    :border="false"
                    :cellStyle="{ padding: '15px' }"
                ></uv-cell>
                <uv-cell
                    title="公司地址"
                    :value="item.address"
                    :border="false"
                    :cellStyle="{ padding: '15px' }"
                ></uv-cell>
                <uv-cell
                    v-if="showBtn"
                    title="评分申述"
                    :isLink="true"
                    arrow-direction="right"
                    url="/subpkg/home/representations"
                    :border="false"
                    :cellStyle="{ padding: '15px' }"
                ></uv-cell>
            </uv-cell-group>
        </view>
    </view>
</template>

<script>
import { getSupplierInfo, getMySupplierInfo } from "@/config/http.js";

export default {
    data() {
        return {
            list: [],
            item: {},
            showBtn: false,
        };
    },
    methods: {
        async initPage(id) {
            const res = id ? await getSupplierInfo(id) : await getMySupplierInfo();
            this.item = Object.assign({}, res);
        },
        getImageUrl(id) {
            return process.env.VUE_APP_BASE_API + `/files/${id}/show_image`;
        },
    },
    computed: {
        getImages() {
            if (this.item.image && this.item.image.length) {
                const urls = this.item.image.map(v => this.getImageUrl(v));
                return urls;
            } else {
                return [];
            }
        },
    },
    onLoad(e) {
        this.showBtn = e.id ? false : true;
        this.initPage(e.id);
    },
};
</script>

<style lang="scss">
page {
    background-color: $uv-bg-color;
}
.supplier-detail {
    &-cont {
        margin: 0 25rpx -75rpx;
        background-color: #fff;
        border-radius: 14rpx;
        overflow: hidden;
        z-index: 9;
        position: relative;
        bottom: 100rpx;
    }
}
</style>
