<template>
    <div class="p-3">
        <div class="bg-fff flex1 ov-hd d-flex flex-cln">
            <div class="d-flex a-c pd-16">
                <div class="f-s-20 c-333 f-w-7 mr-10">监测点详情</div>
                <el-button @click="router.go(-1)" type="primary" text>
                    <el-icon>
                        <Back />
                    </el-icon>
                    返回上一级
                </el-button>
            </div>
            <div class="pd-16 border-bottom">
                <div class="info-title f-w-5 mb-10">基本信息</div>
                <el-descriptions :column="4">
                    <el-descriptions-item label="企业名称:">{{ form?.cpyName || '-' }}</el-descriptions-item>
                    <el-descriptions-item label="企业地址:">{{ form?.regionCodeName }}{{ form?.address || '-' }}</el-descriptions-item>
                    <el-descriptions-item label="单位负责人:">{{ form?.contactPerson || '-' }}</el-descriptions-item>
                    <el-descriptions-item label="负责人联系电话:">{{ form?.tel || '-' }}</el-descriptions-item>
                    <el-descriptions-item label="有效期状态:">
                        <el-tag v-if="+form?.isValid" type="success">有效</el-tag>
                        <el-tag v-else type="danger">已过期</el-tag>
                    </el-descriptions-item>
                    <el-descriptions-item label="有效期至:">{{ form?.endDate || '-' }}</el-descriptions-item>
                    <el-descriptions-item label="操作人:">{{ form?.createByName || '-' }}</el-descriptions-item>
                    <el-descriptions-item label="操作时间:">{{ form?.createTime || '-' }}</el-descriptions-item>
                </el-descriptions>
            </div>
            <div class="flex1 over-auto">
                <div class="pd-16">
                    <div class="info-title mb-16 f-w-5">上报产地价格信息</div>
                    <priceRepordLog></priceRepordLog>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup name="Station-detail" lang="ts">
import { originCpyInfo } from '@/api/price/station';
import { priceRepordLog } from '../../models';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { query }:any = useRoute()
const router = useRouter();
const form = ref<any>(null);
const getDetail = async () => {
    proxy.$modal.loading('加载中...')
    const res = await originCpyInfo(query?.id).finally(() => proxy.$modal.closeLoading());
    if (!res || res.code !== 200) return;
    form.value = res.data;
};
const tabs = ref([
    { label: '订单信息', value: '1' },
    { label: '套餐信息', value: '2' },
])
onMounted(() => {
    getDetail()
});
</script>
<style lang="scss" scoped>
.tabs-item {
    margin-right: 20px;
   padding: 8px 20px;
   font-size: 14px;
   border-color:  #d7d7d7;
   border-style: solid;
   border-width: 1px 1px 0 1px;
   cursor: pointer;
   user-select: none;

   &.checked {
    color: #fff;
    border-color: var(--el-color-primary);
    background-color: var(--el-color-primary);
   }
}
.border-botttom {
    border-bottom: 1px solid #d7d7d7;
}
</style>
