<template>
    <div class="p-3">
        <div class="bg-fff flex1 ov-hd d-flex flex-cln">
            <div class="d-flex a-c pd-16 border-bottom">
                <div class="f-s-20 c-333 f-w-7 mr-10">
                    <template v-if="form?.status === '0'">申报详情审核</template>
                    <template v-if="['1', '2'].includes(form?.status)">申报详情</template>
                </div>
                <el-button @click="router.go(-1)" type="primary" text>
                    <el-icon>
                        <Back />
                    </el-icon>
                    返回上一级
                </el-button>
            </div>
            <div class="flex1 over-auto">
                <div v-if="form" class="pd-16" style="overflow: hidden;">
                    <div class="info-title f-w-5 mb-10">申报信息</div>
                    <el-descriptions :column="2">
                        <el-descriptions-item label="企业名称:">{{ form?.cpyname || '-' }}</el-descriptions-item>
                        <el-descriptions-item label="标准名称:">{{ form?.standardName || '-' }}</el-descriptions-item>
                        <el-descriptions-item label="备注:">{{ form?.remark || '-' }}</el-descriptions-item>
                        <el-descriptions-item label="申报人:">{{ form?.createByName || '-' }}</el-descriptions-item>
                        <el-descriptions-item label="申报时间:">{{ form?.createTime || '-' }}</el-descriptions-item>
                    </el-descriptions>
                    <el-divider />
                    <div class="info-title f-w-5 mb-10">已在“企业标准信息公共服务平台”上传的企业标准文本</div>
                    <FileLook v-model="form.accessory" isObject :span="12"></FileLook>
                    <el-divider />
                    <div class="info-title f-w-5 mb-10">生产许可证</div>
                    <div class="imgout">
                        <div v-for="(item, index) in form?.imgs" :key="index">
                            <el-image :src="item" style="height: 200px;width: 200px;" fit="cover"
                                :preview-src-list="form?.imgs" :initial-index="index" />
                        </div>
                    </div>
                    <el-divider />
                    <div class="info-title f-w-5 mb-10">生产工艺流程图</div>
                    <FileLook v-model="form.flowAccessory" isObject :span="12"></FileLook>
                    <el-divider />
                    <div class="info-title f-w-5 mb-10">最近生产三批产品检验报告</div>
                    <FileLook v-model="form.latestCheckAccessory" isObject :span="12"></FileLook>
                    <el-divider />

                    <el-divider />
                    <div class="info-title f-w-5 mb-10">自我承诺书，三年内没有不良记录</div>
                    <FileLook v-model="form.otherAccessory" isObject :span="12"></FileLook>
                    <el-divider />
                    <div class="info-title f-w-5 mb-10">产品图</div>
                    <div class="imgout">
                        <div v-for="(item, index) in form?.productImags" :key="index">
                            <el-image :src="item" style="height: 200px;width: 200px;" fit="cover"
                                :preview-src-list="form?.imgs" :initial-index="index" />
                        </div>
                    </div>
                    <el-divider />
                    <div class="info-title f-w-5 mb-10">其他证明材料（包括地理标志证明商标使用授权等）</div>
                    <FileLook v-model="form.latestTraceAccessory" isObject :span="6"></FileLook>
                    <el-divider />
                    <template v-if="form?.approvalLogVos">
                        <div class="info-title f-w-5 mb-10">审核记录</div>
                        <!-- // 表格 -->
                        <vxe-table :data="form?.approvalLogVos" border min-height="0" style="width: 100%">
                            <vxe-column title="审核结果">
                                <template #default="{ row }">
                                    <div v-if="+row?.res === 1" class="c-primary">通过</div>
                                    <div v-if="+row?.res === 2" class="c-danger">不通过</div>
                                    <div v-if="+row?.res === 2" class="f-s-12 c-danger">原因：{{ row?.msg }}</div>
                                </template>
                            </vxe-column>
                            <vxe-column field="createTime" title="审核时间" />
                            <vxe-column field="auditorName" title="审核人" />
                        </vxe-table>
                    </template>
                </div>
            </div>
            <div v-if="!+form?.status" class="d-flex a-c j-c pd-16">
                <el-button @click="router.go(-1)">取消</el-button>
                <el-button type="danger" @click="noPass">不通过</el-button>
                <el-button type="primary" @click="showCheckPass = true">通过</el-button>
            </div>
        </div>
    </div>
    <ChooseDeclarationDecord v-if="showCheckPass" v-model:show="showCheckPass" :info="form" :dict="dict"
        @success="successChange"></ChooseDeclarationDecord>
</template>

<script setup name="declaration-detail" lang="ts">
import { ref, reactive, onMounted } from 'vue';
import { debounce } from 'lodash';
import { useRouter } from 'vue-router';
import { expertChooseApprove, expertChooseDetail, expertChooseRelationList } from '@/api/authority';
import { DeclarationDetail, DeclaraapprovalStandard } from '@/api/leader'
import ChooseDeclarationDecord from "../models/ChooseDeclarationDecord.vue";
import { FileLook } from '@/views/models';
import { colNoData } from '@/utils/noData';
import { VxeTablePropTypes } from 'vxe-table';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const dict = proxy?.useDict('dm_person_type', 'dm_join_type', 'yes_no', 'sys_sex_type', 'dm_position_status');
const { dm_person_type, dm_join_type, yes_no, sys_sex_type } = toRefs<any>(dict);
const router = useRouter();
const route = useRoute();
const form = ref<any>(null);
const showCheckPass = ref(false);
// 获取申报详情
const getDeclarationDetail = async () => {
    const res = await DeclarationDetail(route.query.id);
    if (!res || res.code !== 200) return;
    form.value = res.data;
}
// 获取专家详情
const getExpertDetail = async () => {
    if (route.query?.id) {
        const res = await expertChooseDetail(route.query.id);
        if (!res || res.code !== 200) return;
        form.value = res.data;
    }
};
const noPass = async () => {
    ElMessageBox.prompt('是否确认将该事项的专家抽取审核为不通过！请填写不通过原因：', '审核不通过', {
        confirmButtonText: '确认不通过',
        cancelButtonText: '取消',
        // 校验必填
        inputValidator: (value) => {
            if (!value) {
                return '请填写不通过原因';
            }
            return true;
        },
        inputPlaceholder: '请填写不通过原因'
    })
        .then(({ value }) => {
            const params = {
                targetId: route.query.id,
                res: '2', // 不通过
                msg: value
            };
            submitApprove(params);
        })
        .catch(() => {
            ElMessage({
                type: 'info',
                message: '取消审核'
            });
        });
};
// 提交审核
const submitApprove = async (params: any) => {
    proxy.$modal.loading('正在提交审核，请稍候...');
    const res = await DeclaraapprovalStandard(params).finally(() => {
        proxy.$modal.closeLoading();
    });
    if (res.code === 200) {
        ElMessage({
            type: 'success',
            message: '操作成功'
        });
        router.go(-1);
    } else {
        ElMessage({
            type: 'error',
            message: res.msg || '操作失败'
        });
    }
};
const successChange = (val: any) => {
    console.log('成功');

    showCheckPass.value = false;
    const params = {
        targetId: route.query.id,
        res: '1', // 通过
        // personInfo: val
    };
    submitApprove(params);

};
const list = ref<any[]>([]);

// 通用行合并函数（将相同多列数据合并为一行）
const rowspanMethod: any = ({ row, _rowIndex, column, visibleData }) => {
    const fields = ['personType', 'personCount', 'id'];
    const cellValue = row[column.field];
    if (cellValue && fields.includes(column.field)) {
        const prevRow = visibleData[_rowIndex - 1];
        let nextRow = visibleData[_rowIndex + 1];
        if (prevRow && prevRow[column.field] === cellValue) {
            return { rowspan: 0, colspan: 0 };
        } else {
            let countRowspan = 1;
            while (nextRow && nextRow[column.field] === cellValue) {
                nextRow = visibleData[++countRowspan + _rowIndex];
            }
            if (countRowspan > 1) {
                return { rowspan: countRowspan, colspan: 1 };
            }
        }
    }
};

onMounted(() => {
    getDeclarationDetail()
});
</script>
<style scoped>
.imgout {
    display: flex;
    flex-wrap: wrap;
    row-gap: 20px;
    column-gap: 30px;
}

:deep(body) {
    overflow: hidden;
}
</style>
