archives/src/views/transfer/components/table-classify.vue

<template>
    <div class="hc-page-box">
        <hc-new-card>
            <template #header>
            <!-- <HcNewSwitch :datas="tabData" :keys="tabKey" :round="false" @change="tabChange" /> -->
            </template>
            <template #extra>
                <HcTooltip keys="file_collection_btn_upload_scanned_files">
                    <el-button v-if="!showBtn" type="warning" hc-btn :disabled="isCanClick" @click="reportModalClick">
                        <HcIcon name="git-pull-request" />
                        <span>申请验收</span>
                    </el-button>
                    <el-button v-else type="warning" hc-btn :disabled="isCanClick" @click="cancelClick">
                        <HcIcon name="git-pull-request" />
                        <span>撤回验收申请</span>
                    </el-button>
                </HcTooltip>
                <el-button hc-btn type="primary" @click="onSubmitReportClick">
                    <HcIcon name="eye" />
                    <span>历史验收报告</span>
                </el-button>
                <el-button hc-btn class="m-1" type="primary">
                    <HcIcon name="eye" />
                    <span>历史整改报告</span>
                </el-button>
            </template>
            <HcTable
                ref="tableRef" :column="tableColumn" :datas="tableData" :loading="tableLoading"
                is-new :index-style="{ width: 60 }" is-check :check-style="{ width: 29 }"
                is-reserve-selection @selection-change="tableSelection"
            />
            <template #action>
                <HcPages :pages="searchForm" @change="pageChange" />
            </template>
        </hc-new-card>
        <!-- 批量上报审批 -->
        <HcReportModal
            title="申请验收"
            widths="1080px"
            url="archivesauto/saveApply"
            :show="showReportModal"
            :project-id="projectId"
            :contract-id="contractId"
            :task-name="reportTaskName"
            :ids="reportIds"
            is-datas
            :datas="reportDatas"
            @hide="showReportModal = false"
            @finish="showReportFinish"
            @tag-close="reportTaskTagClose"
        />
        <!-- 历史报告 -->
        <HcDrawer
            v-model="isSubmitReportDrawer" to-id="submit-report-layout-target2" uis="hc-submit-report-target2"
            is-close @close="onSubmitReportDrawerClose"
        >
            <div class="hc-select-view w-52">
                <el-select v-model="pdfDateId" placeholder="选择日期" @change="changePdfDate">
                    <el-option v-for="item in reportData" :key="item.id" :label="item.approveDate" :value="item.id" />
                </el-select>
                <div class="hc-title-view">{{ tableTitle }}111111111）</div>
            </div>
   
        
          
            <HcPdf
                :src="curPdf"
            />
        </HcDrawer>
    </div>
</template>

<script setup>
import { nextTick, onMounted, ref, watch } from 'vue'
import { arrToKey, getArrValue, getObjValue } from 'js-fast-way'
import { rowsToId } from '~uti/tools'
import tuningApi from '~api/archiveConfig/tuning.js'
import initialgApi from '~api/initial/initial'

//参数
const props = defineProps({
    projectId: {
        type: [String, Number],
        default: '',
    },
    contractId: {
        type: [String, Number],
        default: '',
    },
    treeData: {
        type: Object,
        default: () => ({}),
    },
})

//变量
const projectId = ref(props.projectId)
const contractId = ref(props.contractId)
const nodeData = ref(props.treeData)

//监听
watch(() => [
    props.treeData,
], ([treeData]) => {
    nodeData.value = treeData
    searchForm.value.nodeIds = treeData.id || ''
    console.log(treeData, 'treeData')
    getTableData()
    getBtnstatus()
})

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




//搜索表单
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: 200 },
    { key:'name', name: '案卷题名' },
    { key:'storageTimeValue', name: '保管期限', width: 140 },
    { key:'pageN', name: '总页数', width: 140 },
])
const tableData = ref([])
//获取数据
const tableLoading = ref(false)
const getTableData = async () => {
    tableLoading.value = true
    const { error, code, data } = await tuningApi.pageByArchive({
        ...searchForm.value,
        projectId: projectId.value,
        contractId: contractId.value,
        isArchive :1,
    })
    tableLoading.value = false
    if (!error && code === 200) {
        tableData.value = getArrValue(data['records'])
        searchForm.value.total = data['total'] || 0
    } else {
        tableData.value = []
        searchForm.value.total = 0
    }
}

//多选
const tableKeys = ref([])
const tableSelection = (rows) => {
    tableKeys.value = rows
}
const reportIds = ref('')
const reportTaskName = ref('')
const reportDatas = ref([])
const showReportModal = ref(false)
const reportLoading = ref(false)
const reportModalClick = async () => {
    const rows = tableKeys.value
    console.log(rows, 'rows验收申请行')
    if (rows.length > 0) {
        //初始ID
        const row = getObjValue(rows[0])
        reportIds.value = rowsToId(rows)
        //设置任务数据
        let reportDataArr = []
        rows.forEach(item => {
            reportDataArr.push({
                id: item?.id,
                name: item?.name,
            })
        })
        reportDatas.value = reportDataArr
        //设置任务名称
        reportTaskName.value = rows.length > 1 ? `${row.name}等${rows.length}个文件` : row.name
        reportLoading.value = false
        showReportModal.value = true
    } else {
        window.$message?.warning('请先勾选需要申请验收的数据')
    }
}
//上报完成
const showReportFinish = async () => {
    showReportModal.value = false
    tableKeys.value = []
    await getBtnstatus()
    getTableData()
}
//上报的审批内容移除
const reportTaskTagClose = (index) => {
    const row = tableKeys.value[index]
    tableRef.value?.toggleRowSelection(row, false)
    if ( tableKeys.value.length > 0) {
        const row = getObjValue( tableKeys.value[0])
        reportTaskName.value = tableKeys.value.length > 0 ? `${row.name}等${tableKeys.value.length}个文件` : tableKeys.value.name
    }
}
//查看验收申请状态
const showBtn = ref(true)
const isCanClick = ref(false)
const getBtnstatus = async ()=>{
    const { error, code, data } = await initialgApi.getApplyStatus({
        projectId: projectId.value,
    })
    if (!error && code === 200) {
        showBtn.value = data['appStatus']
        isCanClick.value = !data['isShow']
    } else {
        showBtn.value = true
        isCanClick.value = false

    }
}
//撤回验收申请
const cancelClick = ()=>{
    window?.$messageBox?.alert('确认撤销? 撤销之后专家账号也一并清空删除', '提示', {
        showCancelButton: true,
        confirmButtonText: '确认撤销',
        cancelButtonText: '取消',
        callback: async (action, ctx ) => {
            if (action === 'confirm') {
                ctx.confirmButtonLoading = true
                const { code, msg, error } = await initialgApi.annulApply({
                    projectId:projectId.value,
                })
                ctx.confirmButtonLoading = true
                if (!error && code === 200) {
                    window.$message?.success(msg)
                    getBtnstatus()
                    getTableData()

                }
            }
        },
    })
}

//历史报告
const isSubmitReportDrawer = ref(false)
const reportData = ref([])
const timeData = ref([])
const onSubmitReportClick = async () => {
    const { data } = await initialgApi.getHistoryTable({
        projectId: projectId.value,
    })
    const res = getArrValue(data)
    reportData.value = res
    if (res.length >= 0) {
        pdfDateId.value = res[0].id
        curPdf.value = res[0].tableUrl
        tableTitle.value = res[0].tableTitle
        isSubmitReportDrawer.value = true
    } else {
        window.$message?.warning('暂无历史报告')
    }
}
const pdfDateId = ref(null)
const curPdf = ref('')
const tableTitle = ref('')
//历史报告
const onSubmitReportDrawerClose = () => {
    isSubmitReportDrawer.value = false
    curPdf.value = ''
}
const changePdfDate = (val) => {
    reportData.value.forEach((ele)=>{
        if (ele.id === val) {
            curPdf.value = ele.tableUrl
            tableTitle.value = ele.tableTitle
        }
    })
}
</script>

<style lang="scss" scoped>
.hc-select-view {
    display: flex;
    align-items: center;
}
.hc-title-view {
    margin-left: 16px;
    display: flex;
    align-items: center;
    color: white;
}
html.dark{
    .hc-select-view {
   
    background-color: rgba(35, 35, 39, 1);
    }
}
</style>