archives/src/views/transfer/initial-expert.vue

<template>
    <div id="submit-report-layout-target" class="hc-page-box">
        <hc-new-card scrollbar>
            <template #header>
                <HcNewSwitch
                    :datas="tabData" :keys="tabKey" :round="false" style="margin-right: 24px"
                    @change="tabChange"
                />
                <HcTooltip keys="transfer_initial_expert_btn_preview">
                    <el-button hc-btn type="primary">
                        <HcIcon name="file-pdf" />
                        <span>预览</span>
                    </el-button>
                </HcTooltip>
            </template>
            <template #extra>
                <!-- transfer_initial_expert_btn_sampling -->
                <el-button color="#0581fe" hc-btn @click="submitReportClick">
                    <HcIcon name="shield-check" />
                    <span>开始抽检</span>
                </el-button>
                <HcTooltip keys="transfer_initial_expert_btn_submit_report">
                    <el-button color="#7f83f7" hc-btn style="color: white" @click="writingConclusionClick">
                        <HcIcon name="git-pull-request" />
                        <span>编写结论</span>
                    </el-button>
                </HcTooltip>
                <HcTooltip keys="transfer_initial_expert_btn_history_report">
                    <el-button color="#38b54a" hc-btn style="color: white" @click="onSubmitReportClick">
                        <HcIcon name="history" />
                        <span>查看验收报告</span>
                    </el-button>
                </HcTooltip>
            </template>
           
            <div v-if="totalData.length > 0" v-loading="totalLoaing" class="h-screen">
                <div v-for="(item, index) in totalData" :key="index">
                    <div class="hc-card-table-title">{{ item?.unitInfo }}</div>
                    <template v-for="(item1, index1) in item?.nodeLists" :key="index1">
                        <HcCardItem v-if="item1.list !== null" ui="h-half">
                            <template #header>
                                <span>{{ item1.nodeInfo }}</span>
                            <!-- <span class="text-gray">（238卷）</span> -->
                            </template>
                            <div :style="`height: ${item1.list !== null ? '300px' : 'auto'};`">
                                <HcTable
                                    ref="tableRef" :column="tableColumn" :datas="item1.list" :loading="tableLoading"
                                    is-new :index-style="{ width: 60 }" is-check :check-style="{ width: 29 }"
                                    @selection-change="tableSelection"
                                />
                            </div>
                        </HcCardItem>
                    </template>
                </div>
            </div>
            
            <div v-else class=" h-screen">
                <HcNoData />
            </div>
        </hc-new-card>

        <!-- 历史报告 -->
        <HcDrawer
            :show="isSubmitReportDrawer" to-id="submit-report-layout-target" uis="hc-submit-report-target"
            @close="onSubmitReportDrawerClose"
        >
            <template #header>
                <div class="hc-select-view w-52">
                    <el-select v-model="pdfDate" placeholder="选择日期">
                        <el-option label="2022年12月24日" value="2022年12月24日" />
                        <el-option label="2022年12月25日" value="2022年12月25日" />
                        <el-option label="2022年12月26日" value="2022年12月26日" />
                        <el-option label="2022年12月27日" value="2022年12月27日" />
                    </el-select>
                </div>
                <div class="hc-title-view">试验资料（含工地试验室资质证书、仪器标定证书等）</div>
                <div class="hc-icon-view text-hover" @click="onSubmitReportDrawerClose">
                    <HcIcon name="close" />
                </div>
            </template>
            <HcPdf
                src="https://bladex-test-info.oss-cn-chengdu.aliyuncs.com//upload/20221212/ce9799c7d18efc03efefd6f242439f2e.pdf"
            />
        </HcDrawer>
    </div>
</template>

<script setup>
import { onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'
import { useAppStore } from '~src/store'
import initialgApi from '~api/initial/initial'
import { getArrValue, getObjValue } from 'js-fast-way'
//变量
const router = useRouter()
const useAppState = useAppStore()
const projectId = ref(useAppState.getProjectId)
const contractId = ref(useAppState.getContractId)
const projectInfo = ref(useAppState.getProjectInfo)

//渲染完成
onMounted(() => {
    getTotalData()
})


//tab数据和相关处理
const tabKey = ref('1')
const tabData = ref([
    { key: '1', name: '建设单位归档资料' },
    { key: '2', name: '监理单位归档资料' },
    { key: '3', name: '施工单位归档资料' },
    { key: '4', name: '科研、新技术资料' },
])
const tabChange = (item) => {
    tabKey.value = item?.key
    getTotalData()
}
const totalData = ref([])
const totalLoaing = ref(false)
const getTotalData = async ()=>{
    totalLoaing.value = true
    const { error, code, data } = await initialgApi.getUnitArchivesAutoView({
        projectId: projectId.value,
        unitType:tabKey.value,
    })
    totalLoaing.value = false
    if (!error && code === 200) {
        console.log(data, 'data')
        if (data !== null) {
            totalData.value = [data]
        } else {
            totalData.value = []
        }
        
        console.log(totalData.value, 'totalData.value')
    } else {
        totalData.value = []
     
    }
}

//------立项审批

//搜索表单
const searchForm = ref({
    current: 1, size: 20, total: 0,
})

//分页被点击
const pageChange = ({ current, size }) => {
    searchForm.value.current = current
    searchForm.value.size = size
    getTableData()
}

//表头
const tableRef = ref(null)
const tableColumn = ref([
    { key:'fileNumber', name: '档号', width: 180 },
    { key:'name', name: '案卷题名' },
    { key:'pageN', name: '总页数', width: 120 },
    { key:'storageTimeValue', name: '保管期限', width: 120 },
    { key:'remark', name: '备注' },
])
const tableData = ref([
    {
        id: 1,
        key1: 'FJZB-02-123',
        key2: '初步设计外业验收有关文件、工程初步设计图纸、初步设计批复、初步设计审查咨询报告',
        key3: '293',
        key4: '永久',
        key5: '备注信息',
    },
    {
        id: 2,
        key1: 'FJZB-02-123',
        key2: '初步设计外业验收有关文件、工程初步设计图纸、初步设计批复、初步设计审查咨询报告',
        key3: '293',
        key4: '永久',
        key5: '备注信息',
    },
    {
        id: 2,
        key1: 'FJZB-02-123',
        key2: '初步设计外业验收有关文件、工程初步设计图纸、初步设计批复、初步设计审查咨询报告',
        key3: '293',
        key4: '永久',
        key5: '备注信息',
    },
])

//获取数据
const tableLoading = ref(false)
const getTableData = async () => {

}

//------勘察设计文件

//搜索表单
const searchFormFile = ref({
    current: 1, size: 20, total: 0,
})

//分页被点击
const pageFileChange = ({ current, size }) => {
    searchFormFile.value.current = current
    searchFormFile.value.size = size
    getTableFileData()
}

//表头
const tableFileRef = ref(null)
const tableFileColumn = ref([
    { key: 'key1', name: '档号', width: 180 },
    { key: 'key2', name: '案卷题名' },
    { key: 'key3', name: '总页数', width: 120 },
    { key: 'key4', name: '保管期限', width: 120 },
    { key: 'key5', name: '备注' },
])
const tableFileData = ref([
    {
        id: 1,
        key1: 'FJZB-02-123',
        key2: '初步设计外业验收有关文件、工程初步设计图纸、初步设计批复、初步设计审查咨询报告',
        key3: '293',
        key4: '永久',
        key5: '备注信息',
    },
    {
        id: 2,
        key1: 'FJZB-02-123',
        key2: '初步设计外业验收有关文件、工程初步设计图纸、初步设计批复、初步设计审查咨询报告',
        key3: '293',
        key4: '永久',
        key5: '备注信息',
    },
    {
        id: 2,
        key1: 'FJZB-02-123',
        key2: '初步设计外业验收有关文件、工程初步设计图纸、初步设计批复、初步设计审查咨询报告',
        key3: '293',
        key4: '永久',
        key5: '备注信息',
    },
])

//获取数据
const tableFileLoading = ref(false)
const getTableFileData = async () => {

}

//编写结论
const writingConclusionClick = () => {
    router.push({
        name: 'transfer-writing-conclusion',
    })
}

//开始抽检
const submitReportClick = () => {
    router.push({
        name: 'transfer-entry-sampling',
    })
}

//历史报告
const isSubmitReportDrawer = ref(false)
const onSubmitReportClick = () => {
    isSubmitReportDrawer.value = true
}
const pdfDate = ref(null)

//历史报告
const onSubmitReportDrawerClose = () => {
    isSubmitReportDrawer.value = false
}
</script>

<style lang="scss" scoped>
@import '~style/transfer/scoped/initial-expert.scss';
</style>

<style lang="scss">
.hc-submit-report-target.el-overlay {
    position: absolute;
    margin: -24px;
    height: revert;
    background-color: transparent;
    .hc-drawer-box.el-drawer {
        --el-drawer-bg-color: transparent;
        .el-drawer__body {
            padding: 24px;
            overflow: hidden;
            .hc-card-box {
                padding: 10px;
                .el-card__header {
                    padding: 10px;
                    .hc-card-header-box .hc-card-header {
                        .hc-select-view {
                            position: absolute;
                            z-index: 11;
                        }
                        .hc-title-view {
                            font-weight: bold;
                            font-size: 20px;
                            text-align: center;
                            position: relative;
                            width: 100%;
                        }
                        .hc-icon-view {
                            position: absolute;
                            right: 0;
                            font-size: 26px;
                            z-index: 11;
                        }
                    }
                }
                .el-card__body {
                    padding: 10px;
                }
            }
        }
    }
}
</style>