archives/src/views/file/records.vue

<template>
    <div class="hc-page-layout-box">
        <div class="hc-layout-left-box" :style="`width:${leftWidth}px;`">
            <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 v-loading="treeLoading" class="hc-tree-box" element-loading-text="加载中...">
                <el-scrollbar>
                    <HcTree :project-id="projectId" :contract-id="contractId" :auto-expand-keys="treeAutoExpandKeys" @nodeTap="projectTreeClick" @nodeLoading="treeNodeLoading" @menuTap="ElTreeMenuClick" />
                </el-scrollbar>
            </div>
            <!-- 左右拖动 -->
            <div class="horizontal-drag-line" @mousedown="onmousedown" />
        </div>
        <div class="hc-page-content-box">
            <HcCard>
                <template #header>
                    <div class="w-64 ml-2">
                        <el-input v-model="searchForm.queryValue" size="large" placeholder="请输入案卷题名、档号进行搜索" clearable @keyup="keyUpEvent" />
                    </div>
                    <div class="ml-2 mr-5">
                        <el-button type="primary" hc-btn @click="searchClick">
                            <HcIcon name="search-2" />
                            <span>搜索</span>
                        </el-button>
                    </div>
                    <HcTooltip keys="file_records_btn_download">
                        <el-button hc-btn :disabled="tableCheckedKeys.length <= 0" :loading="downloadLoading" @click="batchDownload">
                            <HcIcon name="download" />
                            <span>下载</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="file_records_btn_edit">
                        <el-button hc-btn :disabled="tableCheckedKeys.length <= 0" @click="batchEditClick">
                            <HcIcon name="edit" />
                            <span>编辑</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="file_records_btn_del">
                        <el-button hc-btn :disabled="tableCheckedKeys.length <= 0" @click="delModalClick">
                            <HcIcon name="delete-bin" />
                            <span>删除</span>
                        </el-button>
                    </HcTooltip>
                </template>
                <template #extra>
                    <HcTooltip keys="file_records_btn_upload_scanned_files">
                        <el-button type="primary" hc-btn @click="uploadModalClick">
                            <HcIcon name="qr-scan" />
                            <span>扫描上传案卷</span>
                        </el-button>
                    </HcTooltip>
                    <HcTooltip keys="file_records_btn_moves">
                        <el-button type="primary" hc-btn @click="movesClick">
                            <HcIcon name="arrow-left-right" />
                            <span>跨目录移动</span>
                        </el-button>
                    </HcTooltip>
                </template>
                <HcTable ref="tableRef" :column="tableColumn" :datas="tableData" :loading="tableLoading" is-check @selection-change="tableSelection">
                    <template #table-column-header-num>
                        <HcTooltip keys="file_records_btn_sort">
                            <span class="text-link text-lg" @click="tableSortClick">
                                <HcIcon name="arrow-up-down" />
                            </span>
                        </HcTooltip>
                    </template>
                    <template #name="{ row }">
                        <span class="text-link" @click="tableRowName(row)">{{ row?.name }}</span>
                    </template>
                    <template #secretLevel="{ row }">
                        {{ row.secretLevelValue }}
                    </template>
                    <template #storageTime="{ row }">
                        {{ row.storageTimeValue }}
                    </template>
                    <template #dates="{ row }">
                        <div v-if="row?.endDate !== '' || row?.startDate !== ''" class="content">
                            {{ `${splitDate(row?.startDate)}~${splitDate(row?.endDate)}` }}
                        </div>
                        <div v-else class="content" />
                    </template>
                </HcTable>
                <template #action>
                    <HcPages :pages="searchForm" :sizes="[10, 20, 30, 40, 50]" @change="pageChange" />
                </template>
            </HcCard>
        </div>


        <!-- 跨目录移动 -->
        <HcDialog :show="movesModal" title="跨目录移动" widths="990px" is-table :loading="movesModalLoading" @close="movesModalClose" @save="movesModalSave">
            <div class="hc-moves-transfer-box">
                <div class="hc-moves-transfer-panel">
                    <div class="panel-header">
                        <div class="panel-header-label">
                            <el-checkbox v-model="movesCheckAll" class="size-xl space" :indeterminate="isIndeterminate" @change="handleCheckAllChange">
                                选择需要迁移的文件
                            </el-checkbox>
                        </div>
                        <div class="panel-header-extra">
                            {{ checkedMoves.length }}/{{ fileDatasList.length }}
                        </div>
                    </div>
                    <div class="panel-body">
                        <el-scrollbar v-loading="treePanelLoading">
                            <el-checkbox-group v-model="checkedMoves" @change="handleCheckedMovesChange">
                                <!-- <div v-for="item in fileDatasList" :key="item.id" class="hc-file-checkbox">
                                    <el-checkbox class="size-xl space mt-5 " :label="item">
                                        {{ `${item.fileNumber}--${item.name}` }}
                                    </el-checkbox>
                                </div> -->
                                <recycle-scroller
                                    class="virtual-list"
                                    :buffer="1000"
                                    :prerender="200"
                                    style="height: 900px"
                                    :item-size="110"
                                    key-field="id"
                                    :items="fileDatasList"
                                >
                                    <template #default="{ item, index }">
                                        <div :key="index" class="list-item">
                                            <el-checkbox class="size-xl space mt-5 " :label="item">
                                                {{ `${item.fileNumber}--${item.name}` }}
                                            </el-checkbox>
                                        </div>
                                    </template>
                                </recycle-scroller>
                            </el-checkbox-group>
                        </el-scrollbar>
                    </div>
                </div>
                <div class="hc-moves-transfer-buttons">
                    <!-- <el-button hc-btn _icon size="small"
                               :type="fileDatasList.length <= 0 || checkedMoves.length <= 0 ? '' : 'primary'"
                               :disabled="fileDatasList.length <= 0 || checkedMoves.length <= 0">
                        <HcIcon name="arrow-right"/>
                    </el-button> -->
                    <HcIcon type="primary" name="arrow-right-double" style="font-size: 22px;" />
                </div>
                <div class="hc-moves-transfer-panel">
                    <div class="panel-header">
                        选择移动目录
                    </div>
                    <div class="panel-body">
                        <el-scrollbar>
                            <HcTree
                                ref="movesTreeRef" id-prefix="hc-tree-moves-" :project-id="projectId" :contract-id="contractId" is-radio
                                :show-radio-fun="showRadioFun" @radioChange="radioChange"
                            />
                        </el-scrollbar>
                    </div>
                </div>
            </div>
        </HcDialog>

        <!-- 调整排序 -->
        <HcDialog :show="sortModal" title="调整排序" widths="80vw" is-table is-row-footer @close="sortModalClose">
            <el-alert title="可拖动排序，也可在后面点击图标，切换排序" type="error" :closable="false" />
            <div class="hc-table-h">
                <HcTable
                    ui="hc-table-row-drop" is-row-drop quick-sort
                    :column="sortTableColumn" :datas="sortTableData" :loading="sortTableLoading"
                    @row-drop="sortTableRowDrop" @row-sort="sortTableRowDrop"
                >
                    <template #key2="{ row }">
                        <span class="text-link">{{ row?.key2 }}</span>
                    </template>
                    <template #action="{ index }">
                        <span class="text-link text-xl" @click="upSortClick(index)">
                            <HcIcon name="arrow-up" fill />
                        </span>
                        <span class="text-link text-xl ml-2" @click="downSortClick(index)">
                            <HcIcon name="arrow-down" fill />
                        </span>
                    </template>
                </HcTable>
            </div>
            <template #leftRowFooter>
                <el-button hc-btn @click="sortModalClose">
                    <HcIcon name="close" />
                    <span>取消</span>
                </el-button>
                <el-button type="primary" hc-btn :loading="sortModalLoading" @click="sortModalSave">
                    <HcIcon name="check" />
                    <span>确认</span>
                </el-button>
            </template>
            <template #rightRowFooter>
                <HcPages :pages="sortSearchForm" :sizes="[10, 20, 50, 100, 200, 300, 400, 500, 600, 3000, 5000, 8000, 10000]" @change="sortPageChange" />
            </template>
        </HcDialog>

        <!-- 新增编辑文件 -->
        <HcDialog :show="showUploadModal" :title="tableUploadType === 'add' ? '上传文件' : '修改案卷基础信息'" widths="90vw" is-table @close="uploadModalClose">
            <div v-if="tableUploadType === 'add'" class="batch-set">
                <span>批量设置</span>
                <span class="ml-10">档号：</span>
                <span>前缀：</span>
                <span><el-input v-model="batchSet.prefix" placeholder="输入档号前缀" /></span>
                <span class="ml-5">流水号：</span>
                <span><el-input v-model="batchSet.numberStart" placeholder="起号" class="batch-set-input" /></span>
                <span>~</span>
                <span><el-input v-model="batchSet.numberEnd" placeholder="止号" class="batch-set-input" /></span>
                <span class="ml-5">密级：</span>
                <span>
                    <el-select v-model="batchSet.securityLevel">
                        <el-option v-for="item in securityLevel" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                    </el-select>
                </span>
                <span class="ml-5">保管期限：</span>
                <span>
                    <el-select v-model="batchSet.storagePeriod">
                        <el-option v-for="item in storagePeriod" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                    </el-select>
                </span>
                <span class="ml-5">立卷单位：</span>
                <span><el-input v-model="batchSet.unit" placeholder="输入立卷单位" /></span>
                <span class="ml-5">
                    <el-button type="primary" @click="batchSetHandle">设置</el-button>
                </span>
            </div>
            <HcTable ui="hc-form-table" :column="tableUploadColumn" :datas="tableUploadData" :loading="uploadSaveLoading" :is-index="false" :class="{ 'set-table': tableUploadType === 'add' }">
                <template #no="{ index }">
                    {{ index + 1 }}
                    <template v-if="tableUploadType === 'add'">
                        <span class="text-link text-lg">
                            <HcIcon name="arrow-up" @click="upUpSortClick(index)" />
                        </span>
                        <span class="text-link text-lg">
                            <HcIcon name="arrow-down" @click="downUpSortClick(index)" />
                        </span>
                    </template>
                </template>
                <template #fileNumber="{ row }">
                    <el-input v-model="row.fileNumber" type="textarea" />
                </template>
                <template #name="{ row }">
                    <el-input v-model="row.name" type="textarea" />
                </template>
                <template #secretLevel="{ row }">
                    <el-select v-model="row.secretLevel">
                        <el-option v-for="item in securityLevel" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                    </el-select>
                </template>
                <template #storageTime="{ row }">
                    <el-select v-model="row.storageTime">
                        <el-option v-for="item in storagePeriod" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                    </el-select>
                </template>
                <template #unit="{ row }">
                    <el-input v-model="row.unit" type="textarea" />
                </template>
                <template #dates="{ row }">
                    <el-date-picker v-model="row.dates" value-format="YYYY-MM-DD HH:mm:ss" type="daterange" />
                </template>
                <template v-if="tableUploadType === 'add'" #action="{ row, index }">
                    <el-button type="danger" plain size="small" :loading="row.delBtnLoading" @click="delUploadData(row, index)">
                        删除
                    </el-button>
                </template>
            </HcTable>
            <template #footer>
                <div class="lr-dialog-footer">
                    <div class="left flex items-center">
                        <el-button type="primary" hc-btn @click="uploadFileClick">
                            <HcIcon name="add-circle" />
                            <span>新增上传</span>
                        </el-button>
                        <el-alert title="提示：每次不超过10份，文件量越多，响应容易超时" type="error" :closable="false" />
                    </div>
                    <div class="right">
                        <el-button size="large" :disabled="uploadsLoading" @click="batchUploadCancel">
                            <HcIcon name="close" />
                            <span>取消</span>
                        </el-button>
                        <el-button type="primary" hc-btn :disabled="uploadsLoading" :loading="uploadSaveLoading" @click="batchUploadSave">
                            <HcIcon name="save" />
                            <span>提交保存</span>
                        </el-button>
                    </div>
                </div>
            </template>
        </HcDialog>

        <HcUploadFile
            ref="HcUploadFileRef"
            :options="UploadFileOptions"
            @progress="HcUploadFileProgress"
            @success="HcUploadFileSuccess"
            @finish="HcUploadFileChange"
        />
    </div>
</template>

<script setup>
import { nextTick, onMounted, ref, watch } from 'vue'
import { useAppStore } from '~src/store'
import HcTree from '~src/components/tree/hc-tree.vue'
import { rowsToId } from '~uti/tools'
import { delMessageV2 } from '~com/message/index.js'
import { getTokenHeader } from '~src/api/request/header'
import archiveFileApi from '~api/archiveFile/archiveFileAuto.js'
import { getStoreValue, setStoreValue } from '~src/utils/storage'
import tasksApi from '~api/tasks/data'
import ossApi from '~api/oss'
import { arrKeySort, deepClone, downloadBlob, getArrValue, getObjVal } from 'js-fast-way'

//变量
const useAppState = useAppStore()
const projectId = ref(useAppState.getProjectId)
const contractId = ref(useAppState.getContractId)
const projectInfo = ref(useAppState.getProjectInfo)
const isCollapse = ref(useAppState.getCollapse)
const userInfo = ref(useAppState.getUserInfo)

//上传变量
const HcUploadFileRef = ref(null)
const uploadsLoading = ref(false)

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

//渲染完成
onMounted(() => {
    treeLoading.value = true

    setTableColumns()

    getStoragePeriod()

    getSecurityLevel()
})

//上传配置
const UploadFileOptions = {
    headers: getTokenHeader(),
}
//截取日期
const splitDate = (val)=>{
    if (val) {
        return val?.substring(0, 10)
    } else {
        return ''
    }
}
//打开文件选择框
const uploadFileClick = () => {
    HcUploadFileRef?.value?.cancelUpload()
    HcUploadFileRef?.value.selectFile()
}

// 文件上传进度
const HcUploadFileProgress = () => {
    uploadsLoading.value = true
}
// 文件上传成功的回调
const HcUploadFileSuccess = (res) => {
    console.log('文件上传成功', res)
    uploadsLoading.value = false
    uploadsChange(res.id, res.resData)
}

// 文件全部上传成功
const HcUploadFileChange = () => {
    console.log('文件全部上传成功')
    uploadsLoading.value = false
    HcUploadFileRef?.value.setModalShow(false)
}


//树加载
const treeLoading = ref(false)
const treeNodeLoading = () => {
    treeLoading.value = false
}

const treePanelLoading = ref(false)

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

//树相关的变量
const isStorageNode = ref(0)
const nodeIds = ref('')
const treeAutoExpandKeys = ref(getStoreValue('wbsTreeExpandKeys') || [])
const projectTreeClick = ({ data, keys }) => {
    setStoreValue('wbsTreeExpandKeys', keys)
    treeAutoExpandKeys.value = keys || []
    nodeIds.value = data.id || ''
    isStorageNode.value = data['isStorageNode'] || 0

    //设置搜索数据
    searchForm.value.current = 1
    searchForm.value.nodeIds = data.id || ''

    sortSearchForm.value.nodeIds = data.id || ''

    getTableData()
}
//树菜单被点击
const ElTreeMenuClick = async ({ keys }) => {
    setStoreValue('wbsTreeExpandKeys', keys)
    treeAutoExpandKeys.value = keys || []
}
//回车搜索
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([])
//设置表头
const setTableColumns = () => {
    tableColumn.value = [
        { key:'fileNumber', name: '档号', width: 110 },
        { key:'name', name: '案卷题名' },
        { key:'secretLevel', name: '密级', width: 100 },
        { key:'storageTime', name: '保管期限', width: 100 },
        { key:'pageN', name: '页数', width: 100 },
        { key:'unit', name: '立卷单位', width: 140 },
        { key:'dates', name: '起止日期', width: 140, autoWidth: true },
    ]
}
const tableData = ref([])

//获取数据
const tableLoading = ref(false)
const getTableData = async () => {
    tableLoading.value = true
    const { error, code, data } = await archiveFileApi.getarchiveFilePage({
        ...searchForm.value,
        projectId: projectId.value,
        contractId: contractId.value,
        isAutoFile:1,
        isArchive : 1,
    })
    tableLoading.value = false
    if (!error && code === 200) {
        tableData.value = getArrValue(data['records'])
        tableData.value.forEach((element)=>{
            element.dates = [element.startDate, element.endDate]
        })
        searchForm.value.total = data['total'] || 0
    } else {
        tableData.value = []
        searchForm.value.total = 0
    }
}

//多选
const tableCheckedKeys = ref([])
const tableSelection = (rows) => {
    tableCheckedKeys.value = rows
}

//分盒整理
const sortingModal = ref(false)
const sortingClick = async () => {
    if (nodeIds.value && isStorageNode.value === 1) {
        const { error, code, data } = await archiveFileApi.getBoxNameAndBoxNumber({
            nodeId:nodeIds.value,
        })
        if (!error && code === 200) {
            if (data.length > 0) {
                sortingActiveKey.value = []
                sortingModal.value = true
                sortingItemData.value = getArrValue(data)
                sortingOldData.value = deepClone(sortingItemData.value)
            } else {
                sortingNoneModal.value = true
            }
        }

    } else {
        window?.$message?.warning('请先选择一个子节点')
    }
}

const sortingNoneModal = ref(false)//无数据显示的弹窗
const toSortingModal = ()=>{
    sortingNoneModal.value = false
    sortingActiveKey.value = []
    sortingModal.value = true
}

const sortingItemData = ref([])
const sortingOldData = ref([])//旧数据，用来对比是否修改名字

//获取数据
const sortingItemLoading = ref(false)
const getSortingItemData = () => {

}

//校验
const tableIsInput = (val, row, key) => {
    //console.log(!val);
    //检测是否改过案卷名字
    if (key == 'isName') {
        row.isChange = true
    }

    row[key] = !val
}

//选择文件
// const sortingActiveKey = ref('')
// const sortingSelectFile = (row, index) => {
//     //取当前展开组的key
//     const key = sortingActiveKey.value;
//     const keys = key ? key.split('-') : [];
//     const active = keys.length > 0 ? keys[1]: -1;
//     if (Number(active) === index) {
//         sortingActiveKey.value = null;
//     } else {
//         sortingActiveKey.value = `item-${index}`;
//     }
// }

const sortingActiveKey = ref([])
const sortingSelectFile = (row, index) => {
    const key = `item-${index}`
    const indexNum = sortingActiveKey.value.indexOf(key)
    if (indexNum > -1) {
        sortingActiveKey.value.splice(indexNum, 1)
    } else {
        sortingActiveKey.value.push(key)
        if (!(row.list && row.list.length > 0)) {
            getSortingTableData(row, index)
        }
    }
}

//表格
const sortingTableColumn = [
    { key:'name', name: '文件名称' },
]
const sortingTableData = ref([])

//获取数据
const sortingTableLoading = ref(false)
const getSortingTableData = async (row, index) => {
    sortingTableLoading.value = true
    const { error, code, data } = await archiveFileApi.pageByBoxName({
        size: 99999,
        current: 1,
        projectId: projectId.value,
        contractId: contractId.value,
        nodeIds:nodeIds.value,
        boxName:row.boxName ? row.boxName : '',
    })
    sortingTableLoading.value = false
    if (!error && code === 200) {
        row.list = getArrValue(data['records'])
        setTableCheck(row, index)
    } else {
        row.list = []
    }
}

//表格ref
const sorTableRef = ref([])
//回显勾选
const setTableCheck = async (row, index) => {
    //console.log(row)
    if (row.ids) {
        const keys = row.ids.split(',')
        for (const item of row.list) {
            if (keys.indexOf(item.id) > -1) {
                item.checked = true
                await nextTick()
                sorTableRef.value[index].toggleRowSelection(item, true)
            }
        }
    }
}

//多选
const sortingTableKeys = ref([])
const sortingTableSelection = (rows, list, event) => {
    //console.log(event)
    list.forEach(element => {
        element.checked = false
    })
    rows.forEach((element)=>{
        element.checked = true
    })
}

//删除
const sortingDelData = (row, index) => {
    sortingItemData.value.splice(index, 1)
}

//添加分盒
const addSortingModalClick = () => {
    sortingItemData.value.push({
        boxName: '',
    })
}

//确认保存
const sortingModalLoading = ref(false)
const sortingModalSave = async () => {
    sortingModalLoading.value = true

    //检测案卷名是否重复
    let nameRes = await checkNames()
    //console.log(nameRes)
    //return;
    for (let i = 0; i < nameRes.length; i++) {
        if (typeof nameRes[i].data == 'string') {
            window.$message?.error(nameRes[i].data + ',案卷名重复')
            sortingModalLoading.value = false
            return
        }
    }

    //组装数据
    let rows = []
    sortingItemData.value.forEach((item, index)=>{
        let obj = {
            ids:'',
            boxName:item.boxName,
            boxNumber:index + 1,
        }
        let list = []
        if (item.list) {
            item.list.forEach((item2)=>{
                if (item2.checked) {
                    list.push(item2.id)
                }
            })
            obj.ids = list.join(',')
        } else {
            obj.ids = item.ids
        }

        rows.push(obj)
    })

    const { error, code, data } = await archiveFileApi.allocation({
        list: rows,
    })
    if (!error && code === 200) {
        window.$message?.success('保存成功')
        sortingModal.value = false
    } else {
        window.$message?.error('保存失败')
    }
    sortingModalLoading.value = false
}

const checkNames = () =>{
    const arr = []
    sortingItemData.value.forEach((item)=>{
        if (item.boxNumber) {
            if (item.isChange) {
                //是否修改过
                //对比旧的数据，是否相同
                for (let i = 0; i < sortingOldData.value.length; i++) {
                    if (sortingOldData.value[i].boxNumber == item.boxNumber) {
                        if (sortingOldData.value[i].boxName != item.boxName) {
                            arr.push(
                                archiveFileApi.getIsBoxName({
                                    boxName:item.boxName,
                                }),
                            )
                        }
                        return
                    }
                }
            }
        } else {
            arr.push(
                archiveFileApi.getIsBoxName({
                    boxName:item.boxName,
                }),
            )
        }
    })
    return Promise.all(arr)
}

//关闭
const sortingModalClose = () => {
    sortingModal.value = false
}

//删除
const delModalClick = () => {
    delMessageV2(async (action, instance, done) => {
            if (action === 'confirm') {
                instance.confirmButtonLoading = true
                let ids = []
                tableCheckedKeys.value.forEach((element)=>{
                    ids.push(element.id)
                })
                const { error, code, data } = await archiveFileApi.remove({
                    ids:ids.join(','),
                })
                //处理数据
                if (!error && code === 200) {
                    window.$message?.success('操作成功')
                    getTableData()
                }
                instance.confirmButtonLoading = false
                done()
            } else {
                done()
            }
    })
}


//跨目录移动
const movesModal = ref(false)
const movesClick = async () => {
    movesModal.value = true
    treePanelLoading.value = true
    checkedMoves.value = []
    const { error, code, data } = await archiveFileApi.getarchiveFilePage({
        ...searchForm.value,
        size:9999,
        projectId: projectId.value,
        contractId: contractId.value,
        isArchive:1,
        isAutoFile:1,
    })
    treePanelLoading.value = false
    if (!error && code === 200) {
        fileDatasList.value = getArrValue(data['records'])

    } else {
        fileDatasList.value = []
    }
}

//选择需要迁移的文件
const movesCheckAll = ref(false)
const isIndeterminate = ref(true)
const checkedMoves = ref([])

//左侧待迁移文件
const fileDatasList = ref([])

//全选
const handleCheckAllChange = (val) => {
    const checked = fileDatasList.value
    // checkedMoves.value = val ? keys : []
    checkedMoves.value = val ? checked : []
    isIndeterminate.value = false
}

//勾选
const handleCheckedMovesChange = (value) => {
    const keys = fileDatasList.value
    const checkedCount = value.length
    movesCheckAll.value = checkedCount === keys.length
    isIndeterminate.value = checkedCount > 0 && checkedCount < keys.length
}

//右侧radio
const movesTreeRef = ref(null)
let radioNode = ref(null)
const radioChange = (id)=>{
    //console.log(id)
    //radioNodeId = id;
    radioNode.value = movesTreeRef.value.ElTreeRef.getNode(id)
}

//只显示储存节点的单选
const showRadioFun = (data)=>{
    if (data.isStorageNode == 1) {
        return true
    } else {
        return false
    }
}

//保存
const movesModalLoading = ref(false)
const movesModalSave = async () => {
    // let ids = checkedMoves.value.join(',')
    const keys = rowsToId(checkedMoves.value)
    let ids = keys
    if (checkedMoves.value.length < 1) {
        window.$message?.warning('请勾选需要迁移的文件')
        return
    }
    if (!radioNode.value) {
        window.$message?.warning('请选择要移动到的节点')
        return
    }
    movesModalLoading.value = true
    const { error, code, data } = await archiveFileApi.migrateFile({
        ids:ids,
        nodeId:radioNode.value.data.id,
        nodeSort:radioNode.value.data.treeSort,
    })
    movesModalLoading.value = false
    if (!error && code === 200) {
        window.$message?.success('保存成功')
        movesModal.value = false
        getTableData()
    } else {
        window.$message?.error('保存失败')
    }

}

//关闭
const movesModalClose = () => {
    movesModal.value = false
}


//表格排序
const sortModal = ref(false)
//显示
const tableSortClick = () => {
    sortModal.value = true
    getSortTableData()
}

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

//分页被点击
const sortPageChange = ({ current, size }) => {
    sortSearchForm.value.current = current
    sortSearchForm.value.size = size
    getSortTableData()
}

//表格数据
const sortTableColumn = ref([
    { key:'fileNumber', name: '档号', width: 160 },
    { key:'name', name: '案卷题名' },
    { key:'action', name: '排序', width: 90 },
])
const sortTableData = ref([])

const sortTableLoading = ref(false)
const getSortTableData = async () => {
    sortTableLoading.value = true
    const { error, code, data } = await archiveFileApi.getarchiveFilePage({
        ...sortSearchForm.value,
        projectId: projectId.value,
        contractId: contractId.value,
        isAutoFile:1,
        isArchive:1,

    })
    sortTableLoading.value = false
    if (!error && code === 200) {
        sortTableData.value = getArrValue(data['records'])
        sortSearchForm.value.total = data['total'] || 0
    } else {
        sortTableData.value = []
        sortSearchForm.value.total = 0
    }
}

//拖动完成
const sortTableRowDrop = (rows) => {
    sortTableData.value = [] // 先清空，否则排序会异常
    nextTick(() => {
        sortTableData.value = rows
    })
}

//向下
const downSortClick = (index) => {
    const indexs = index + 1
    const data = sortTableData.value
    if (indexs !== data.length) {
        const tmp = data.splice(indexs, 1)
        sortTableData.value.splice(index, 0, tmp[0])
    } else {
        window?.$message?.warning('已经处于置底，无法下移')
    }
}

//向上
const upSortClick = (index) => {
    const data = sortTableData.value || []
    if (index !== 0) {
        const tmp = data.splice(index - 1, 1)
        sortTableData.value.splice(index, 0, tmp[0])
    } else {
        window?.$message?.warning('已经处于置顶，无法上移')
    }
}

//保存
const sortModalLoading = ref(false)
const sortModalSave = async () => {
    let rows = sortTableData.value
    rows.forEach((element, index)=>{
        element.autoFileSort = index + 1
    })

    await batchUpdateSortApi(rows)

    sortModal.value = false
}

//关闭
const sortModalClose = () => {
    sortModal.value = false
}


//获取认证状态
const certificationType = ref([])
const certificationStatus = async () => {
    const { error, code, data } = await tasksApi.queryTaskTypeStatus({
        typeOrStatus: 'certification_status',
    })
    //处理数据
    if (!error && code === 200) {
        certificationType.value = getArrValue(data)
    } else {
        certificationType.value = []
    }
}

//获取图幅类型
const sheetType = ref([])
const sheetTypeStatus = async () => {
    const { error, code, data } = await tasksApi.queryTaskTypeStatus({
        typeOrStatus: 'sheet_type',
    })
    //处理数据
    if (!error && code === 200) {
        sheetType.value = getArrValue(data)
    } else {
        sheetType.value = []
    }
}

//获取图表来源
const sheetSourceType = ref([])
const sheetSourceStatus = async () => {
    const { error, code, data } = await tasksApi.queryTaskTypeStatus({
        typeOrStatus: 'sheet_source',
    })
    //处理数据
    if (!error && code === 200) {
        sheetSourceType.value = getArrValue(data)
    } else {
        sheetSourceType.value = []
    }
}

//获取密级
const securityLevel = ref([])
const getSecurityLevel = async () => {
    const { error, code, data } = await tasksApi.queryTaskTypeStatus({
        typeOrStatus: 'security_level',
    })
    //处理数据
    if (!error && code === 200) {
        securityLevel.value = getArrValue(data)
    } else {
        securityLevel.value = []
    }
}

//获取保管期限
const storagePeriod = ref([])
const getStoragePeriod = async () => {
    const { error, code, data } = await tasksApi.queryTaskTypeStatus({
        typeOrStatus: 'storage_period',
    })
    //处理数据
    if (!error && code === 200) {
        storagePeriod.value = getArrValue(data)
    } else {
        storagePeriod.value = []
    }
}

//新增文件
const tableUploadType = ref('add')
const showUploadModal = ref(false)
const uploadModalClick = () => {
    if (nodeIds.value && isStorageNode.value === 1) {
        tableUploadType.value = 'add'
        setTableUploadColumn()
        uploadSaveLoading.value = false
        tableUploadData.value = []
        showUploadModal.value = true
    } else {
        window?.$message?.warning('请先选择一个子节点')
    }
}
const uploadModalClose = ()=>{
    batchUploadCancel()
    //HcUploadFileRef?.value.cancel()
    //HcUploadFileRef?.value.isShow(false)
    HcUploadFileRef?.value.setModalShow(false)
}
//设置文件表头
const tableUploadColumn = ref([
    { key:'no', name: '序号', width: 100 },
    { key:'fileNumber', name: '档号', width: 160 },
    { key:'name', name: '案卷题名' },
    { key:'secretLevel', name: '密级', width: 100 },
    { key:'storageTime', name: '保管期限', width: 100 },
    { key:'unit', name: '立卷单位' },
    { key:'dates', name: '起止日期', width: 380 },
    { key:'action', name: '操作', width: 100 },
])
const setTableUploadColumn = () => {

}
const tableUploadData = ref([])

//上传的文件结果
const uploadsChange = (fileId, item) => {
    if (getObjVal(item)) {
        let newArr = tableUploadData.value
        let name = item['originalName'] || ''
        let fileName = name.substring(0, name.lastIndexOf('.'))
        newArr.push({
            fileUploadId: fileId,
            projectId: projectId.value,
            contractId: contractId.value,
            nodeId: nodeIds.value,
            name:fileName,
            approvalFileList:[{
                projectId: projectId.value,
                contractId: contractId.value,
                nodeId: nodeIds.value,
                fileName: fileName,
                fileNumber:'',
                ossFileName: item?.name || '',
                fileUrl: item?.link || '',
                pdfFileUrl: item?.pdfUrl || '',
                filePage: item?.page || '',
                isApproval:0,
                isNeedCertification:0,
                dutyUser: userInfo.value.real_name,
                fileSize:item['fileSize'],
            }],
        })
        //tableUploadData.value = newArr
        tableUploadData.value = arrKeySort(newArr, 'fileUploadId')
    } else {
        console.log(item)
    }
}

//表单下拉数据
const whetherData = ref([
    { label: '不需要', value: 0 },
    { label: '需要', value: 1 },
])


//删除
const delUploadData = async (row, index) => {
    if (row['ossFileName']) {
        row['delBtnLoading'] = true
        await ossApi.removeFile({ fileName: row['ossFileName'] })
        row['delBtnLoading'] = false
        tableUploadData.value.splice(index, 1)
    } else {
        tableUploadData.value.splice(index, 1)
    }
}

//批量上传保存
const uploadSaveLoading = ref(false)
const batchUploadSave = async () => {
    const rows = tableUploadData.value
    if (rows.length > 0) {
        //验证表单数据
        uploadSaveLoading.value = true
        let isTableRows = false

        //判断数据
        if (isTableRows) {
            uploadSaveLoading.value = false
            window.$message?.warning('请先完善表单信息')
        } else {
            //数据处理
            rows.forEach((element, index)=>{
                if (element.dates) {
                    element.startDate = element.dates[0]
                    element.endDate = element.dates[1]
                }

                element.autoFileSort = index + 1
            })

            if (tableUploadType.value === 'add') {
                await batchUploadSaveApi(rows)
            } else {
                await batchEditSaveApi(rows)
            }
        }
    } else {
        window.$message?.warning('请先上传文件')
    }
}

//确认上传保存
const batchUploadSaveApi = async (rows) => {
    uploadSaveLoading.value = true
    const { error, code } = await archiveFileApi.batchUploadSave({
        list: rows,
    }, false)
    //判断状态
    uploadSaveLoading.value = false
    if (!error && code === 200) {
        window.$message?.success('保存成功')
        batchUploadCancel()
        getTableData()
    } else {
        window.$message?.error('保存失败')
    }
}

//取消上传
const batchUploadCancel = () => {
    tableUploadData.value = []
    uploadSaveLoading.value = false
    uploadsLoading.value = false
    showUploadModal.value = false
}

//批量编辑
const batchEditClick = () => {
    const rows = deepClone(tableCheckedKeys.value)
    //判断是否满足条件
    tableUploadType.value = 'edit'
    setTableUploadColumn()
    uploadSaveLoading.value = false
    tableUploadData.value = rows
    showUploadModal.value = true
}

//确认编辑上传保存
const batchEditSaveApi = async (rows) => {
    uploadSaveLoading.value = true
    const { error, code } = await archiveFileApi.batchUploadSave({
        list: rows,
    }, false)
    //判断状态
    uploadSaveLoading.value = false
    if (!error && code === 200) {
        window.$message?.success('保存成功')
        batchUploadCancel()
        getTableData()
    } else {
        window.$message?.error('保存失败')
    }
}

//确认排序
const batchUpdateSortApi = async (rows) => {
    uploadSaveLoading.value = true
    const { error, code } = await archiveFileApi.batchUpdateSort({
        list: rows,
    }, false)
    //判断状态
    uploadSaveLoading.value = false
    if (!error && code === 200) {
        window.$message?.success('保存成功')
        batchUploadCancel()
        getTableData()
    } else {
        window.$message?.error('保存失败')
    }
}


//上传文件向下
const downUpSortClick = (index) => {
    const indexs = index + 1
    const data = tableUploadData.value
    if (indexs !== data.length) {
        const tmp = data.splice(indexs, 1)
        tableUploadData.value.splice(index, 0, tmp[0])
    } else {
        window?.$message?.warning('已经处于置底，无法下移')
    }
}

//上传文件向上
const upUpSortClick = (index) => {
    const data = tableUploadData.value || []
    if (index !== 0) {
        const tmp = data.splice(index - 1, 1)
        tableUploadData.value.splice(index, 0, tmp[0])
    } else {
        window?.$message?.warning('已经处于置顶，无法上移')
    }
}


//批量设置
const batchSet = ref({
    prefix:'',
    numberStart:'',
    numberEnd:'',
    securityLevel:'',
    storagePeriod:'',
    unit:'',
})

//批量设置
const batchSetHandle = () => {
    setSecurityLevel()
    setStoragePeriod()
    setFileNumber()
    setFilingUnit()
}

//批量设置密级
const setSecurityLevel = () => {
    if (batchSet.value.securityLevel) {
        let isSet = true
        // for (let i = 0; i < tableUploadData.value.length; i++) {
        //     if(tableUploadData.value[i].secretLevel!=='0' && tableUploadData.value[i].secretLevel){
        //         isSet = false;
        //         return;
        //     }
        // }
        //如果有一条数据选了，其他的都不进行设置
        if (isSet) {
            tableUploadData.value.forEach((element)=>{
                element.secretLevel = batchSet.value.securityLevel
            })
        }
    }
}

//批量设置保管期限
const setStoragePeriod = () => {
    if (batchSet.value.storagePeriod) {
        let isSet = true
        // for (let i = 0; i < tableUploadData.value.length; i++) {
        //     if(tableUploadData.value[i].storageTime!=='0' && tableUploadData.value[i].storageTime){
        //         isSet = false;
        //         return;
        //     }
        // }
        //如果有一条数据选了，其他的都不进行设置
        if (isSet) {
            tableUploadData.value.forEach((element)=>{
                element.storageTime = batchSet.value.storagePeriod
            })
        }
    }
}

const setFileNumber = () => {
    let isSet = true
    // for (let i = 0; i < tableUploadData.value.length; i++) {
    //     if(tableUploadData.value[i].fileNumber){
    //         isSet = false;
    //         return;
    //     }
    // }
    if (!isSet) {
        return
    }

    if (batchSet.value.prefix && batchSet.value.numberStart && batchSet.value.numberEnd) {
        const regPos = /^[0-9]+.?[0-9]*/ //判断是否是数字。
        if (!regPos.test(batchSet.value.numberStart)) {
            window.$message?.warning('流水号 起号 存在非数字,请修改')
            return
        }
        if (!regPos.test(batchSet.value.numberEnd)) {
            window.$message?.warning('流水号 止号 存在非数字,请修改')
            return
        }

        const startNum = Number(batchSet.value.numberStart)
        const endNum = Number(batchSet.value.numberEnd)
        if (startNum > endNum) {
            window.$message?.warning('起号需要小于止号')
            return
        }

        //获取最长的字符串长度
        let numL = 0
        if (batchSet.value.numberStart.length > batchSet.value.numberEnd.length) {
            numL = batchSet.value.numberStart.length
        } else {
            numL = batchSet.value.numberEnd.length
        }
        let prefix = batchSet.value.prefix

        //遍历赋值
        let index = 0
        for (let i = startNum; i <= endNum; i++) {
            //超出就终止
            if (tableUploadData.value[index] === undefined) {
                return
            }
            //前面补零
            const numStr = i.toString().padStart(numL, '0')
            tableUploadData.value[index].fileNumber = prefix + numStr
            index++
        }

    } else {
        window.$message?.warning('档号由前缀和流水号组成，请填写完整再进行批量设置档号')
    }
}

//立卷单位
const setFilingUnit = ()=>{
    if (batchSet.value.unit) {
        let isSet = true
        // for (let i = 0; i < tableUploadData.value.length; i++) {
        //     if(tableUploadData.value[i].unit){
        //         isSet = false;
        //         return;
        //     }
        // }
        //如果有一条数据选了，其他的都不进行设置
        if (isSet) {
            tableUploadData.value.forEach((element)=>{
                element.unit = batchSet.value.unit
            })
        }
    }
}

//批量下载
const downloadLoading = ref(false)
const batchDownload = async () => {
    let ids = []
    tableCheckedKeys.value.forEach((element)=>{
        ids.push(element.id)
    })
    downloadLoading.value = true
    const { error, response, res } = await archiveFileApi.batchDownloadFileToZip({
        ids:ids.join(','),
    })
    downloadLoading.value = false
    if (!error) {
        downloadBlob(res, response.headers['content-disposition'])
    }
}

//名称被点击
const tableRowName = async (row) => {
    const { error, code, data } = await archiveFileApi.mergePdf({
        ids: row.id,
    })
    //处理数据
    if (!error && code === 200) {
        window.open(data, '_blank')
    }
}


//左右拖动，改变树形结构宽度
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 '~style/file/scoped/collection.scss';

.batch-set{
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    .batch-set-input{
        width: 80px;
    }
}
.set-table{
    height: calc(100% - 42px);
}
</style>

<style lang="scss">
@import '~style/file/collection.scss';
.panel-body .el-checkbox{
    white-space: normal;
    height: auto;
}
.panel-body .el-radio-group{
    width: auto ;
    
}
</style>