<template>
    <view class="page">
        <scroll-view class="scroll" scroll-y>
            <!-- 基础信息 -->
            <view class="section">
                <text class="row company">{{ safeText(form.name) }}</text>
                <view class="row"><text class="label">编号</text><text class="value">{{ safeText(form.code) }}</text></view>
                <view class="row"><text class="label">品种</text><text class="value">{{ safeText(form.productName) }}</text></view>
                <view class="row"><text class="label">数量（吨）</text><text class="value">{{ safeText(form.quantity) }}</text></view>
                <view class="row"><text class="label">开始时间</text><text class="value">{{ formatDateTimeMinute(form.startTime) }}</text></view>
                <view class="row"><text class="label">截止时间</text><text class="value">{{ formatDateTimeMinute(form.endTime) }}</text></view>
                <view class="row"><text class="label">项目类型</text><text class="value">{{ getProjectTypeLabel() }}</text></view>
                <view v-if="showBidTime" class="row"><text class="label">开标时间</text><text class="value">{{ formatDateTimeMinute(form.bidTime) }}</text></view>
                <view class="row"><text class="label">采购规则</text><text class="value">{{ safeText(form.purchaseRule) }}</text></view>
                <view class="row"><text class="label">状态</text><text class="value">{{ safeText(form.status) }}</text></view>
                <view class="row"><text class="label">发布人</text><text class="value">{{ safeText(form.createBy) }}</text></view>
            </view>
        </scroll-view>

        <detail-buttons :buttons="displayButtons" @click="handleButtonClick" />
    </view>
</template>

<script>
import DetailButtons from '@/components/detail-buttons/index.vue'
import { supplierQuotationProjectDetailApi, supplierQuotationProjectUpdateStatusApi } from '@/api/procure-manage/supplierQuotationProject.js'
import { getDicByCodes } from '@/utils/dic.js'

export default {
    name: 'DetailSupplierPrice',
    components: { DetailButtons },
    data() {
        return {
            id: '',
            form: {},
            dictData: {},
            buttons: [{
                text: '编辑',
                visible: true,
                variant: 'primary',
                event: 'edit'
            },{
                text: '报价',
                visible: true,
                event: 'bid'
            },{
                text: '发布',
                visible: true,
                event: 'publish'
            }]
        }
    },
    computed: {
        showBidTime() {
            const opts = (this.dictData.PROJECT_TYPE && this.dictData.PROJECT_TYPE.data) || []
            const m = opts.find(o => String(o.code != null ? o.code : o.value) === String(this.form.projectType))
            const label = m ? (m.name || m.label || '') : ''
            return label.indexOf('集中开标') > -1
        },
        displayButtons() {
            const s = this.form.status || ''
            return [
                { ...this.buttons[0], visible: this.$auth.hasPermi('procure-manage:supplier-price:modify') && s === 'UNPUBLISHED' },
                { ...this.buttons[1], visible: this.$auth.hasPermi('procure-manage:supplier-price:quotation') && s === 'QUOTING' },
                { ...this.buttons[2], visible: this.$auth.hasPermi('procure-manage:supplier-price:publish') && s === 'UNPUBLISHED' }
            ]
        }
    },
    onLoad(options) {
        this.id = (options && options.id) ? options.id : ''
        if (!this.id) return
        this.loadDictData().then(() => {
            this.loadDetail()
        })
    },
    methods: {
        async loadDictData() {
            try {
                const res = await getDicByCodes(['PROJECT_TYPE'])
                this.dictData = res || {}
            } catch (e) {
                this.dictData = {}
            }
        },
        getProjectTypeLabel() {
            const opts = (this.dictData.PROJECT_TYPE && this.dictData.PROJECT_TYPE.data) || []
            const m = opts.find(o => String(o.code != null ? o.code : o.value) === String(this.form.projectType))
            return m ? (m.name || m.label || '-') : '-'
        },
        async loadDetail() {
            try {
                const res = await supplierQuotationProjectDetailApi({ id: this.id })
                this.form = (res && res.data) ? res.data : {}
            } catch (e) {
                uni.showToast({ title: '加载详情失败', icon: 'none' })
            }
        },
        formatDateTimeMinute(v) {
            const s = v == null ? '' : String(v).trim()
            if (!s) return '-'
            if (s.length >= 16) return s.slice(0, 16)
            return s
        },
        safeText(v) {
            const s = v == null ? '' : String(v)
            return s.trim() ? s : '-'
        },
        handleButtonClick(btn) {
            if (!btn || btn.disabled) return
            const e = btn.event || ''
            if (e === 'edit') return this.onEdit()
            if (e === 'bid') return this.onQuote()
            if (e === 'publish') return this.onPublish()
        },
        onEdit() {
            uni.navigateTo({ url: '/pages/supplier-price/modify?id=' + this.id })
        },
        onQuote() {
            uni.navigateTo({ url: '/pages/supplier-price/quote?id=' + this.id })
        },
        async onPublish() {
            const confirmRes = await new Promise(resolve => {
                uni.showModal({ title: '提示', content: '确定发布该项目吗？', confirmText: '确定', cancelText: '取消', success: resolve })
            })
            if (!(confirmRes && confirmRes.confirm)) return
            try {
                await supplierQuotationProjectUpdateStatusApi({ id: this.id, status: 'PUBLISHED' })
                uni.showToast({ title: '发布成功', icon: 'none' })
                this.loadDetail()
                try { uni.setStorageSync('SUPPLIER_PRICE_LIST_NEED_REFRESH', '1') } catch (e) {}
            } catch (e) {
                uni.showToast({ title: e.msg || '发布失败', icon: 'none' })
            }
        }
    }
}
</script>

<style lang="scss" scoped>
.page {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: #f3f3f3;
}

.scroll {
    flex: 1;
    padding: 8rpx 0 144rpx;
}

.section {
    padding: 32rpx;
    background: #fff;
    margin-bottom: 20rpx;
}

.row {
    display: flex;
    margin-bottom: 28rpx;

    &:last-child {
        margin-bottom: 0;
    }

    &.company {
        font-size: 36rpx;
        font-weight: 600;
        color: rgba(0, 0, 0, 0.9);
        padding-top: 8rpx;
        line-height: 50rpx;
    }

    .label {
        max-width: 420rpx;
        margin-right: 20rpx;
        line-height: 32rpx;
        font-size: 28rpx;
        color: rgba(0, 0, 0, 0.6);
    }

    .value {
        flex: 1;
        line-height: 32rpx;
        font-size: 28rpx;
        color: rgba(0, 0, 0, 0.9);
        text-align: right;
        word-break: break-all;
    }
}
</style>