for_client/src/views/tentative/detect/test.vue

<template>
    <div class="hc-page-layout-box">
        <div
            :style="`width:${isWbsTreeShow ? leftWidth : 0}px; ${isWbsTreeShow ? '' : 'display: none'}`"
            class="hc-layout-left-box" :class="[isWbsTreeShow ? 'show' : '']"
        >
            <div class="hc-project-box">
                <div class="hc-project-icon-box">
                    <HcIcon name="stack" />
                </div>
                <div class="ml-2 project-name-box">
                    <span class="text-xl text-cut project-alias">{{ projectInfo.projectAlias }}</span>
                    <div class="text-xs text-cut project-name">
                        {{ projectInfo.name }}
                    </div>
                </div>
            </div>
            <div class="hc-tree-box">
                <el-scrollbar>
                    <TestTree
                        :auto-expand-keys="treeAutoExpandKeys"
                        :project-id="projectId"
                        :tenant-id="userInfo?.tenant_id"
                        :wbs-temp-id="projectInfo?.referenceWbsTemplateIdTrial"
                        :wbs-type="2"
                        @nodeTap="wbsElTreeClick"
                    />
                    <!-- <HcLazyTree
                                :isType="false"
                                :autoExpandKeys="treeAutoExpandKeys"
                                @load="treeLoadNode"
                                @nodeTap="wbsElTreeClick"
                        /> -->
                </el-scrollbar>
            </div>
            <!-- 左右拖动 -->
            <div class="horizontal-drag-line" @mousedown="onmousedown" />
        </div>
        <div class="hc-page-content-box">
            <!---展开收缩树 -->
            <div class="hc-expansion-contraction-tree" @click="setWbsTreeShow">
                <HcIcon v-show="isWbsTreeShow" name="arrow-left-s" />
                <HcIcon v-show="!isWbsTreeShow" name="arrow-right-s" />
            </div>
            <HcTabCard :tabs="authBtnTabdata" :tab-key="authBtnTabKey" @change="authBtnTabClick">
                <template #extra>
                    <HcTooltip keys="tentative_detect_test_add">
                        <el-button :disabled="!primaryKeyId" hc-btn color="#37c0fe" style="color: white;" @click="addFormModalClick">
                            <HcIcon name="add-circle" />
                            <span>新增</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="tentative_detect_test_copy">
                        <el-button
                            :disabled="tableCheckedKeys.length <= 0" :loading="copyLoading" hc-btn
                            color="#A16222" @click="copyDataClick"
                        >
                            <HcIcon name="file-copy-2" />
                            <span>复制</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="tentative_detect_test_del">
                        <el-button
                            :disabled="tableCheckedKeys.length <= 0" :loading="removeLoading" hc-btn
                            color="#e03997" @click="delModalClick"
                        >
                            <HcIcon name="delete-bin-2" />
                            <span>删除</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="tentative_detect_test_print">
                        <el-button
                            :disabled="tableCheckedKeys.length <= 0" :loading="printPdfLoading" hc-btn
                            color="#567722" @click="printPdfClick"
                        >
                            <HcIcon name="printer" />
                            <span>批量打印</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="tentative_detect_test_report">
                        <el-button
                            :disabled="tableCheckedKeys.length <= 0" :loading="reportPdfLoading" hc-btn
                            color="#FF976A" style="color: white;" @click="reportPdfClick"
                        >
                            <HcIcon name="send-plane-2" />
                            <span>批量上报</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="tentative_detect_test_quit">
                        <el-button
                            :disabled="tableCheckedKeys.length <= 0" :loading="quitPdfLoading" hc-btn
                            color="#e54d42" @click="quitPdfClick"
                        >
                            <HcIcon name="delete-bin-3" />
                            <span>批量废除</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="tentative_detect_test_null">
                        <el-button
                            :disabled="tableCheckedKeys.length <= 0" :loading="printNullPdfLoading" hc-btn
                            color="#567722" @click="printNullPdfClick"
                        >
                            <HcIcon name="printer" />
                            <span>打印空表</span>
                        </el-button>
                    </HcTooltip>
                </template>
                <template #search>
                    <div class="w-40">
                        <el-input
                            v-model="searchForm.trialUserName" clearable placeholder="请输入试验人员"
                            @keyup="keyUpEvent"
                        />
                    </div>
                    <div class="w-40 ml-2">
                        <el-select v-model="searchForm.queryStatus" clearable placeholder="请选择是否合格">
                            <el-option
                                v-for="item in qualifiedData" :key="item.value" :label="item.label"
                                :value="item.value"
                            />
                        </el-select>
                    </div>
                    <div class="w-64 ml-2">
                        <HcDatePicker :dates="betweenTime" clearable @change="betweenTimeUpdate" />
                    </div>
                    <div class="w-72 ml-2">
                        <el-input
                            v-model="searchForm.queryValue" clearable placeholder="请输入项目名称关键字"
                            @keyup="keyUpEvent"
                        />
                    </div>
                    <div class="ml-2">
                        <el-button type="primary" @click="searchClick">
                            <HcIcon name="search-2" />
                            <span>搜索</span>
                        </el-button>
                    </div>
                </template>
                <HcTable
                    ref="tableRef" :column="tableColumn" :datas="tableData" :loading="tableLoading"
                    border :check-style="{ width: 29, fixed: 'left' }" :index-style="{ width: 60, fixed: 'left' }"
                    is-check @selection-change="tableSelection"
                >
                    <template #recordNo="{ row }">
                        <span class="text-link" @click="tableRowEdit(row, '1')">{{ row?.recordNo }}</span>
                    </template>
                    <template #reportNo="{ row }">
                        <span class="text-link" @click="tableRowEdit(row, '2')">{{ row?.reportNo }}</span>
                    </template>
                    <template #trialProjectName="{ row }">
                        <span class="text-link font-bold" @click="tableRowPdf(row)">{{ row?.trialProjectName }}</span>
                    </template>
                    <template #taskStatus="{ row }">
                        <!-- <el-tag :type="`${row.status === 2 ? 'success' : row.status === 0 ? 'warning' : row.status === 1 ? 'danger' : 'info'}`" -->
                        <el-tag
                            v-if="row.taskStatus"
                            :type="`${row.taskStatus === '已审批' ? 'success' : row.taskStatus === '待审批' ? 'warning' : row.taskStatus === '已废除' ? 'danger' : 'info'}`"
                            class="mx-1" effect="dark"
                        >
                            {{ row.taskStatus }}
                        </el-tag>
                    </template>
                    <template #detectionCategory="{ row }">
                        <!-- <span>{{arrKeyValue(categoryData, 'dictKey', 'dictValue', row.detectionCategory)}}</span> -->
                        <span>{{ row.detectionCategoryName }}</span>
                    </template>
                    <template #isUploadCertificate="{ row }">
                        <!-- <span>{{row.isUploadCertificate == 0 ? '是':row.isUploadCertificate == -1?'' : '否'}}</span> -->
                        <span>{{ row.isUploadCertificateName }}</span>
                    </template>
                    <template #contractId="{ row }">
                        <span>{{ contractInfo?.name }}</span>
                    </template>
                    <template #detectionResult="{ row }">
                        <span>{{ row?.reportNo && row?.reportNo.length > 0 ? row.detectionResultName : '' }}</span>
                    </template>
                    <template #action="{ row }">
                        <HcTooltip keys="tentative_detect_test_annex">
                            <el-link type="primary" @click="viewAttachmentModalClick(row)">附件</el-link>
                        </HcTooltip>
                        <HcTooltip keys="tentative_detect_test_info">
                            <el-link type="primary" @click="samplingRecordModalClick(row)">样品信息</el-link>
                        </HcTooltip>
                    </template>
                </HcTable>
                <template #action>
                    <HcPages :pages="searchForm" @change="pageChange" />
                </template>
            </HcTabCard>
        </div>

        <!-- 查看附件 -->
        <HcDialog
            :footer="false" :show="viewAttachmentModal" is-table title="查看附件" widths="70rem"
            @close="viewAttachmentModalClose"
        >
            <template #extra>
                <HcNewSwitch :datas="tabTypeTab" :keys="tabTypeKey" @change="tabTypeChange" />
            </template>
            <div v-loading="viewAttachmentLoading" class="hc-switch-tab-content">
                <div class="h-full w-full flex">
                    <div v-if="viewAttachmentData.length > 0" class="pdf-file-list-box">
                        <template v-for="item in viewAttachmentData">
                            <div :class="[item.isCheck ? 'cur' : '']" class="file-item" @click="viewCurFile(item)">
                                {{ item.fileName || '' }}
                            </div>
                        </template>
                    </div>
                    <div v-else class="pdf-file-list-box">
                        <HcNoData />
                    </div>
                    <iframe v-if="attachmentPdfUrl" :src="attachmentPdfUrl" frameborder="1" height="100%" width="80%" />
                    <div class="hc-no-table-form">
                        <div class="table-form-no">
                            <HcDragUpload
                                :datas="uploadData" :file-list="fileListData" @delFile="delFileData"
                                @finished="uploadFinished" @progress="uploadprogress"
                            />
                        </div>
                    </div>
                </div>
            </div>
        </HcDialog>

        <!-- 查看样品信息 -->
        <HcDialog
            :footer="false" :show="samplingRecordModal" is-table title="查看样品信息" widths="60%"
            @close="samplingRecordModalClose"
        >
            <HcTable
                :column="samplingTableColumn" :datas="samplingTableData" :is-index="false"
                :loading="samplingTableLoading" border
            />
        </HcDialog>
        <!-- 批量上报审批 -->
        <HcReportModal

            :classify-type="authBtnTabKey"
            :addition="reportAddition" :contract-id="contractId" :ids="reportIds"
            :project-id="projectId" :show="showReportModal" :task-name="reportTaskName"
            :trial-self-inspection-record-id="1"
            :type-data="reportTypeData" title="批量上报审批" type="wbs"
            url="informationWriteQuery/batchTask" @finish="showReportFinish"
            @hide="showReportModal = false"
        />
    </div>
</template>

<script setup>
import { onActivated, onMounted, ref, watch } from 'vue'
import { useRouter } from 'vue-router'
import { useAppStore } from '~src/store'
import TestTree from '../material/components/TestTree.vue'
import { delStoreValue, getStoreValue, setStoreValue } from '~src/utils/storage'
import HcDragUpload from './components/HcDragUpload.vue'
import dataApi from '~api/tentative/detect/test'
import { getDictionary } from '~api/other'
import { eVisaTaskCheckApi } from '~api/other'
import wbsApi from '~api/data-fill/wbs'
import samplingApi from '~api/tentative/material/sampling'
import { arrKeyValue, arrToId, getArrValue, getObjValue, isString } from 'js-fast-way'

import { Loading } from 'element-plus/es/components/loading/src/service'
import notableform from '~src/assets/view/notableform.svg'
import { delMessageV2 } from '~com/message/index.js'

//变量
const router = useRouter()
const useAppState = useAppStore()
const userInfo = ref(useAppState.getUserInfo)
const projectId = ref(useAppState.getProjectId)
const contractId = ref(useAppState.getContractId)
const projectInfo = ref(useAppState.getProjectInfo)
const contractInfo = ref(useAppState.getContractInfo)
const isCollapse = ref(useAppState.getCollapse)
const isBubble = ref(useAppState.getBubble)

//监听
watch(() => [
    useAppState.getCollapse,
    useAppState.getBubble,
], ([Collapse, bubble]) => {
    isCollapse.value = Collapse
    isBubble.value = bubble
})

//获取气泡数据
const getButtonsVal = (value) => {
    return useAppState.getButtonsVal(value)
}

//自动展开缓存
const treeAutoExpandKeys = ref(getStoreValue('testTreeExpandKeys') || [])
const btn_edit = ref(false)

//渲染完成
onMounted(() => {
    btn_edit.value = getButtonsVal('tentative_detect_test_edit')
    setContractType(contractInfo.value?.contractType)
    getCategoryData()

})
//缓存被激活时,重新获取表格数据
onActivated(() => {
    // setMountOnEventKey()
    getTableData()
})
const qualifiedData = ref([
    { label: '不合格', value: '0' },
    { label: '合格', value: '1' },
])

//树展开和收起
const isWbsTreeShow = ref(true)
const setWbsTreeShow = () => {
    isWbsTreeShow.value = !isWbsTreeShow.value
}

//加载树形结构数据
const treeLoadNode = async ({ node, item, level }, resolve) => {
    let contractIdRelation = '', parentId = '0', primaryKeyId = ''
    if (level !== 0) {
        const nodeData = getObjValue(item)
        contractIdRelation = nodeData?.contractIdRelation || ''
        parentId = nodeData?.id
        primaryKeyId = nodeData?.id || ''
    }
    //获取数据
    const { data } = await samplingApi.queryLazyTree({
        wbsId: projectInfo.value?.referenceWbsTemplateIdTrial,
        tenantId: userInfo.value?.tenant_id,
        projectId: projectId.value,
        parentId,
        wbsType: 2,
    })
    resolve(getArrValue(data))
}
//获取检测类别类型
const categoryData = ref([])
const getCategoryData = async () => {
    const { data } = await getDictionary({
        code: 'trial_detection_category',
    })
    const arrData = getArrValue(data)
    arrData.forEach(item => {
        item.dictKey = Number(item.dictKey)
    })
    categoryData.value = arrData
}

//搜索表单
const searchForm = ref({
    trialUserName: null, queryStatus: null, queryValue: null, type: '1',
    current: 1, size: 20, total: 0,
})

//树相关的变量
const primaryKeyId = ref('')
const nodeDataInfo = ref({})

//树被点击
const wbsElTreeClick = ({ data, keys }) => {
    nodeDataInfo.value = data
    primaryKeyId.value = data['primaryKeyId'] || ''
    setStoreValue('testTreeItem', data)
    //缓存自动展开
    treeAutoExpandKeys.value = keys
    setStoreValue('testTreeExpandKeys', keys)
    //改变搜索表单数据
    searchForm.value.nodeId = data['primaryKeyId']
    searchForm.value.current = 1
    getTableData()
}

//身份按钮切换数据
const authBtnTabKey = ref('1')
const authBtnTabdata = ref([
    { key: '1', name: '施工质检' },
    { key: '2', name: '监理质检' },
])
const authBtnTabClick = (item) => {
    if (item.key !== authBtnTabKey.value) {
        authBtnTabKey.value = item.key
        searchForm.value.type = item.key
        searchForm.value.current = 1
        getTableData()
    }
}
//contractType,  1施工，2监理
const setContractType = (contractType) => {
    let typeValue = '1'
    if (contractType > 0) {
        typeValue = contractType + ''
    }
    authBtnTabKey.value = typeValue
    searchForm.value.type = typeValue
    searchForm.value.current = 1
}

//日期时间被选择
const betweenTime = ref(null)
const betweenTimeUpdate = ({ arr }) => {
    betweenTime.value = arr
    if (arr.length > 0) {
        searchForm.value.startTime = arr[0]
        searchForm.value.endTime = arr[1]
    } else {
        searchForm.value.startTime = ''
        searchForm.value.endTime = ''
    }
}

//回车搜索
const keyUpEvent = (e) => {
    if (e.key === 'Enter') {
        searchForm.value.current = 1
        getTableData()
    }
}

//搜索
const searchClick = () => {
    searchForm.value.current = 1
    getTableData()
}

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

//表格数据
const tableRef = ref(null)
const tableColumn = ref([
    { key: 'recordNo', name: '记录编号', width: 180, autoWidth: true },
    { key: 'reportNo', name: '报告编号', width: 180, autoWidth: true },
    { key: 'samplingLocation', name: '取样地点', width: 180, autoWidth: true },
    { key: 'trialProjectName', name: '试验项目名称', width: 100, autoWidth: true },
    { key: 'detectionResult', name: '检测结果', width: 140, autoWidth: true },
    { key: 'taskStatus', name: '任务状态', width: 120, autoWidth: true },
    { key: 'detectionCategory', name: '检测类别', width: 100, autoWidth: true },
    { key: 'isUploadCertificate', name: '是否上传合格证', width: 120, autoWidth: true },
    { key: 'contractId', name: '合同段', width: 140, autoWidth: true },
    { key: 'company', name: '单位', width: 160, autoWidth: true },
    { key: 'specificationNumber', name: '样品编号', width: 220, autoWidth: true },
    { key: 'specificationModel', name: '规格类型', width: 200, autoWidth: true },
    //{key:'projectPosition', name: '工程部位及用途', width: 160},
    { key: 'projectPositionName', name: '工程部位及用途', width: 160, autoWidth: true },
    { key: 'reportDate', name: '报告日期', width: 170, autoWidth: true },
    { key: 'trialUserName', name: '试验人员', width: 170, autoWidth: true },
    { key: 'action', name: '操作', width: 120, fixed: 'right', align: 'center' },
])
const tableData = ref([])

//获取数据
const tableLoading = ref(false)
const getTableData = async () => {
    tableLoading.value = true
    const { error, code, data } = await dataApi.queryPage({
        ...searchForm.value,
        projectId: projectId.value,
        contractId: contractId.value,
    })
    //处理数据
    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 tableCheckedKeys = ref([])
const tableSelection = (rows) => {
    tableCheckedKeys.value = rows
}

//新增
const addFormModalClick = () => {
    delStoreValue('test-form')
    router.push({
        path: '/tentative/detect/test-form',
        query: {
            nodeId: primaryKeyId.value,
            dataType: authBtnTabKey.value,
            isaddType: true,
        },
    })
}

//编辑
const tableRowEdit = (row, tabTypeKey) => {
    setStoreValue('test-form', row)
    setStoreValue('prenodeDataInfo', nodeDataInfo.value)
    console.log(JSON.stringify(nodeDataInfo.value), 'JSON.stringify(nodeDataInfo.value)')
    router.push({
        path: '/tentative/detect/test-form',
        query: {
            id: row.id,
            nodeId: row.nodeId,
            dataType: row.type,
            tabTypeKey: tabTypeKey,
            // prenodeDataInfo:JSON.stringify(nodeDataInfo.value)

        },
    })
}

//预览PDF
const tableRowPdf = ({ pdfUrl }) => {
    if (pdfUrl) {
        window.open(pdfUrl, '_blank')
    } else {
        window.$message?.warning('该数据暂无PDF')
    }
}

//复制
const copyDataClick = () => {
    const rows = tableCheckedKeys.value
    if (rows.length > 0) {
        const ids = arrToId(rows)
        copyDataApi(ids)
    } else {
        window.$message?.warning('请先勾选需要复制的记录')
    }
}

//请求复制
const copyLoading = ref(false)
const copyDataApi = async (ids) => {
    //请求数据
    copyLoading.value = true
    const { error, code, msg } = await dataApi.copyData({
        ids: ids,
    }, false)
    //处理数据
    copyLoading.value = false
    if (!error && code === 200) {
        window.$message?.success('复制成功')
        searchClick()
    } else {
        window.$message?.error(msg)
    }
}

//删除
const delModalClick = () => {
    const rows = tableCheckedKeys.value
    if (rows.length > 0) {
        delMessageV2(async (action, instance, done) => {
        if (action === 'confirm') {
            instance.confirmButtonLoading = true
            const ids = arrToId(rows)
            removeDataApi(ids)
           instance.confirmButtonLoading = false
           done()
        } else {
            done()
        }
    })
    } else {
        window.$message?.warning('请先勾选需要删除的记录')
    }
}

//请求删除
const removeLoading = ref(false)
const removeDataApi = async (ids) => {
    //请求数据
    removeLoading.value = true
    const { error, code, msg } = await dataApi.removeData({
        ids: ids,
    }, false)
    //处理数据
    removeLoading.value = false
    if (!error && code === 200) {
        window.$message?.success('删除成功')
        searchClick()
    } else {
        window.$message?.error(msg)
    }
}

//批量打印
const printPdfLoading = ref(false)
const printPdfClick = async () => {
    const rows = tableCheckedKeys.value
    if (rows.length > 0) {
        const ids = arrToId(rows)
        //请求数据
        printPdfLoading.value = true
        const { error, code, msg, data } = await dataApi.printPdf({
            ids: ids,
        }, false)
        //处理数据
        const pdfUrl = isString(data) ? data || '' : ''
        printPdfLoading.value = false
        if (!error && code === 200 && pdfUrl) {
            window.open(pdfUrl, '_blank')
        } else {
            window.$message?.error(msg || '文件异常')
        }
    } else {
        window.$message?.warning('请先勾选需要批量打印的记录')
    }
}

//批量废除
const quitPdfLoading = ref(false)
const quitPdfClick = async () => {
    const rows = tableCheckedKeys.value
    if (rows.length > 0) {
        const ids = arrToId(rows)
        const res1 = rows.some(item => item.taskStatus === '未上报')
        const res2 = rows.some(item => item.taskStatus === '已废除')
        if (res1) {
            window.$message?.warning('未上报的文件不能废除')
        } else if (res2) {
            window.$message?.warning('已废除的文件不能再次废除')
        } else {
            //请求数据
            quitPdfLoading.value = true
            const { error, code, msg, data } = await dataApi.batchAbolish({
                ids: ids,
            }, false)
            //处理数据
            if (!error && code === 200) {
                window.$message?.success('废除成功')
                quitPdfLoading.value = false
                searchClick()
            } else {
                quitPdfLoading.value = false
                window.$message?.error(msg)
            }
        }

    } else {
        window.$message?.warning('请先勾选需要批量打印的记录')
    }
}

//批量上报
const reportPdfLoading = ref(false)
//批量上报
const reportIds = ref('')
const reportTaskName = ref('')
const reportAddition = ref({})
const showReportModal = ref(false)
const reportLoading = ref(false)
const reportTypeData = ref([])
const reportPdfClick = async () => {
    const rows = tableCheckedKeys.value
    if (rows.length > 0) {
        const info = getStoreValue('prenodeDataInfo') || {}
        const res1 = rows.some(item => item.pdfUrl.length < 1)
        const res2 = rows.some(item => item.taskStatus === '待审批' || item.taskStatus === '已审批')
        if (res1) {
            window.$message?.warning('当前数据暂无pdf无法上报')
        } else if (res2) {
            window.$message?.warning('已上报的数据无法再次上报')
        } else {
            reportLoading.value = true
            const ids = arrToId(rows)
            reportIds.value = ids
            const taskCheck = await eVisaTaskCheckApi({
                projectId: projectId.value,
                contractId: contractId.value,
            })
            //处理数据
            let newArr = []
            for (let i = 0; i < rows.length; i++) {
                newArr.push(rows[i]['tableIds'])
            }
            reportTypeData.value = [...newArr]
            console.log(reportTypeData.value, ' reportTypeData.value')
            reportLoading.value = false
            if (taskCheck) {
                //初始弹出弹窗，防呆

                reportAddition.value = {
                    classify: authBtnTabKey.value,
                    contractIdRelation: info['contractIdRelation'],
                }
                showReportModal.value = true
                //请求文件题名
                const { data } = await wbsApi.queryDocumentTitle({
                    // primaryKeyId: info['primaryKeyId'],
                    primaryKeyId: rows[0].id,
                    classify: authBtnTabKey.value,
                })
                reportTaskName.value = isString(data) ? data : ''

            } else {
                window.$message?.warning('暂无相关数据')
            }
        }


    } else {
        window.$message?.warning('请先勾选需要批量上报的记录')
    }
}
//上报完成
const showReportFinish = () => {
    showReportModal.value = false
    getTableData()
}

//打印空表
const printNullPdfLoading = ref(false)
const printNullPdfClick = async () => {
    const rows = tableCheckedKeys.value
    if (rows.length > 0) {
        const ids = arrToId(rows)
        //请求数据
        printNullPdfLoading.value = true
        const { error, code, msg, data } = await dataApi.printNullPdf({
            ids: ids,
        }, false)
        //处理数据
        const pdfUrl = isString(data) ? data || '' : ''
        printNullPdfLoading.value = false
        if (!error && code === 200 && pdfUrl) {
            window.open(pdfUrl, '_blank')
        } else {
            window.$message?.error(msg || '文件异常')
        }
    } else {
        window.$message?.warning('请先勾选需要打印空表的记录')
    }
}

//查看附件
const viewAttachmentModal = ref(false)
const viewAttachmentLoading = ref(false)
const viewAttachmentId = ref('')
const viewAttachmentData = ref([])
const viewAttachmentModalClick = async ({ id }) => {
    viewAttachmentId.value = id
    viewAttachmentModal.value = true
    getAttachmentModalClick(viewAttachmentId.value, '1')

}
const getCaption = (obj) => {
    const index = obj.lastIndexOf('pdf')

    return index
}

//获取附件
const getAttachmentModalClick = async (id, type) => {
    viewAttachmentLoading.value = true
    const { error, code, data } = await dataApi.ancillaryDocumentsList({ id: id, type: type })
    console.log(data, 'data')
    viewAttachmentLoading.value = false
    if (!error && code === 200) {
        viewAttachmentData.value = getArrValue(data)
        curFileData.value = viewAttachmentData.value[0]
        viewCurFile(curFileData.value)

    } else {
        viewAttachmentData.value = []

    }

}
const refeshAttachmentModalClick = async (id, type) => {
    const { error, code, data } = await dataApi.ancillaryDocumentsList({ id: id, type: type })
    //处理数据
    viewAttachmentLoading.value = false
    if (!error && code === 200) {
        viewAttachmentData.value = getArrValue(data)
        if (viewAttachmentData.value.length < 1) {
            //  window.$message?.warning('该条记录不存在附件')
        } else {
            viewCurFile(viewAttachmentData.value[0])
        }

    } else {
        viewAttachmentData.value = []

    }
}
const attachmentPdfUrl = ref('')
const curFileData = ref({})
//类型tab数据和相关处理
const tabTypeKey = ref('1')
const tabTypeTab = ref([
    { key: '1', name: '生产合格证' },
    { key: '2', name: '厂家质检报告' },
    { key: '3', name: '其他文件' },
])
const tabTypeChange = (item) => {
    console.log(1111111111)
    tabTypeKey.value = item?.key
    getAttachmentModalClick(viewAttachmentId.value, item?.key)
    fileListData.value = []


    refeshAttachmentModalClick(viewAttachmentId.value, tabTypeKey.value)
}

//关闭查看附件
const viewAttachmentModalClose = () => {
    viewAttachmentModal.value = false
    curFileData.value = ''
    attachmentPdfUrl.value = ''
}
const uploadData = ref({})
const fileListData = ref([])
const listuploadref = ref('1')
//截取文件名称
const splitFileName = (str) => {
    // if(str.indexOf("https://bladex-test-info.oss-cn-chengdu.aliyuncs.com//upload") != -1){
    if (str.indexOf('https://bladex-chongqing-info.oss-cn-hangzhou.aliyuncs.com//upload') != -1) {
        let a = str.split('//')[2].split('/')[2]
        return a
    } else {
        return str
    }

}
//查看当前文件pdf
const viewCurFile = (item) => {
    console.log(item, 'item')
    if (item) {
        curFileData.value = item
        let arr = []
        arr.push({ name: item.fileName, url: item.url })
        fileListData.value = getArrValue(arr)
        viewAttachmentData.value.forEach((ele) => {
            ele.isCheck = false
        })
        item.isCheck = true

    }

}

//上传进度
const uploadprogress = (res) => {
    console.log('进度')
}

//上传完成
const uploadFinished = async (res) => {
    const { error, code, data } = await dataApi.updateAncillaryDocument(
        {
            selfId: viewAttachmentId.value,
            url: res.link,
            type: tabTypeKey.value,

        })
    console.log(data, 'data')
    if (!error && code === 200) {
        refeshAttachmentModalClick(viewAttachmentId.value, tabTypeKey.value)
    }
}
//上传文件delFileData
const delFileData = async (res) => {
    console.log('删除文件', curFileData.value)
    if (curFileData.value.isDel == 0) {
        window.$message.warning('该文件不可删除')
    } else {
        const { error, code, data } = await dataApi.removedocuments(
            {
                id: curFileData.value.id,
            })
        if (!error && code === 200) {
            window.$message.success('删除成功')
            refeshAttachmentModalClick(viewAttachmentId.value, tabTypeKey.value)
        }
    }

}

//样品信息数据
const samplingTableColumn = ref([
    { key: 'materialName', name: '样品名称' },
    { key: 'samplingDate', name: '取样时间' },
    { key: 'specificationNumber', name: '样品编号' },
    { key: 'specificationModel', name: '规格型号' },
    { key: 'materialCount', name: '试样数量' },
    { key: 'calculationUnit', name: '计算单位' },
    { key: 'proposedPosition', name: '拟用部位' },
    { key: 'representativeCount', name: '代表数量' },
    { key: 'userName', name: '取样人' },
])
const samplingTableData = ref([])
const samplingTableLoading = ref(false)

//取样记录
const samplingRecordModal = ref(false)
const samplingRecordModalClick = async ({ id }) => {
    samplingRecordModal.value = true
    samplingTableLoading.value = true
    const { error, code, data } = await dataApi.getSampleList({
        id: id,
    })
    //处理数据
    samplingTableLoading.value = false
    if (!error && code === 200) {
        samplingTableData.value = getArrValue(data)
    } else {
        samplingTableData.value = []
    }
}

//关闭样品信息
const samplingRecordModalClose = () => {
    samplingRecordModal.value = false
    samplingTableData.value = []
}

//左右拖动，改变树形结构宽度
const leftWidth = ref(382)
const onmousedown = () => {
    const leftNum = isCollapse.value ? 142 : 272
    document.onmousemove = (ve) => {
        let diffVal = ve.clientX - leftNum
        if (diffVal >= 310 && diffVal <= 900) {
            leftWidth.value = diffVal
        }
    }
    document.onmouseup = () => {
        document.onmousemove = null
        document.onmouseup = null
    }
}
</script>

<style lang="scss" scoped>
@import "../../../styles/tentative/detect/test.scss";

.hc-switch-tab-content {
    .pdf-file-list-box {
        position: relative;
        border-right: 1px solid #e9e9e9;
        padding: 5px 0;
        overflow-y: auto;
        height: 100%;
        flex: 1;

        .file-item {
            position: relative;
            cursor: pointer;
            padding: 6px 10px;
            &:hover {
                color: var(--el-color-primary);
                background-color: var(--el-color-primary-light-8);
            }
            &.cur {
                color: var(--el-color-primary);
                background-color: var(--el-color-primary-light-8);
            }
        }
    }
    .hc-no-table-form {
        flex: 1;
    }
}
</style>