<template>
    <!-- 档案移交记录 -->
    <div class="app-container">
        <TableModel :formLabel="formLabel" :showOperation="true" :showRightTools="true" ref="recordTableRef"
            :columnsList="columnsList" :request-api="getTransferRecordListApi">
            <template #form="{ queryParams }">
                <el-form-item prop="deptId" style="width: 240px;">
                    <treeselect v-model="queryParams.deptId" :options="treeDataList" placeholder="请选择接收单位" value-key="id"
                        :disable-branch-nodes="false" noChildrenText="没有数据了" noOptionsText="没有数据了" noResultsText="没有搜索结果"
                        />
                </el-form-item>
            </template>
            <template slot="t_list" slot-scope="{ data }">
                <span class="jump" @click="handleTList(data)">查看</span>
            </template>
            <template slot="t_progress" slot-scope="{ data }">
                <span class="jump" @click="handleTProgress(data)">{{ getProgressStatusText(data.transferStatus) }}</span>
            </template>

            <template slot="handle" slot-scope="{ data }">
                <el-button plain size="mini" type="success" icon="el-icon-warning-outline" v-hasPermi="['record:file:query']"
                    @click="handleDetail(data)">
                    详情
                </el-button>
            </template>
        </TableModel>
        <!-- 移交清单、移交进度 -->
        <RecordList v-if="isflag" :jumpType="jumpType" :rowData="row" @handleQuery="handleQuery" :title="title"
            @closeDialog="closeDialog" @showColose="showColose" :dataForm="row" :disabled="loading" :width="600" />
    </div>
</template>

<script>
import TableModel from '@/components/TableModel'
import { columnsList, formLabel } from './config'
import {
    delTransferApplyApi,
    getTransferRecordListApi,
} from '@/api/filesTransfer/record.js'
import RecordList from './components/recordList'
import { encryptWithSM4 } from '@/utils/sm'
import { getDeptSelectApi } from '@/api/select'

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
    name: 'Record',
    dicts: ['pro_type', 'voltage_level'],
    components: {
        TableModel,
        RecordList,
        Treeselect
    },
    data() {
        return {
            formLabel,
            columnsList,
            getTransferRecordListApi,
            title: "",
            isflag: false,
            row: {},
            loading: false,
            jumpType:'',
            treeDataList:[],
        }
    },

    created() {
        // 将字典数据填充到表单配置的下拉选项中
        /* if (Array.isArray(this.formLabel)) {
            this.formLabel.forEach((item) => {
                if (item.f_dict && this.dict && this.dict.type && this.dict.type[item.f_dict]) {
                    this.$set(item, 'f_selList', this.dict.type[item.f_dict])
                }
            })
        } */
        this.initData();
    },

    methods: {
        async initData() {
            await getDeptSelectApi().then(res => {
                this.treeDataList = this.convertToVueTree(res.data);
            });
        },
        closeDialog() {
            this.isflag = false;
        },
        showColose() {
            this.isflag = false;
        },
        // 详情
        handleDetail(row) {
            this.$router.push({
                name: 'RecordDetail',
                query: {
                    id: encryptWithSM4(row.id ?? '0'),
                    viewStatus: encryptWithSM4('record'),
                    auditStatus: encryptWithSM4(this.getStatusText2(row.auditStatus)),
                }
            })
        },
        /* 搜索操作 */
        handleQuery() {
            this.$refs.recordTableRef.getTableList()
        },
        /* 查看移交清单 */
        handleTList(row){
            this.title = "移交清单";
            this.row = row;
            this.jumpType = 'list';
            this.isflag = true;
        },
        /* 查看移交进度 */
        handleTProgress(row){
            this.title = "移交进度";
            this.jumpType = 'progress';
            this.row = row;
            this.isflag = true;
        },
        /** 删除操作 */
        handleDelete(row) {
            this.$modal.confirm(`是否确认删除数据类型名称为"${row.dataTypeName}"的数据项？`).then(() => {
                // 显示加载遮罩
                this.$modal.loading("正在删除，请稍候...");
                delTransferApplyApi({ id: row.id }).then(res => {
                    this.$modal.closeLoading();
                    if (res.code === 200) {
                        this.$modal.msgSuccess("删除成功");
                        this.handleQuery();
                    } else {
                        this.$modal.msgError(res.msg);
                    }
                }).catch(error => {
                    this.$modal.closeLoading();
                    this.$modal.msgError(error);
                });
            }).catch(() => {
                // 用户取消删除，不需要处理
            });
        },
        // 获取状态
        getStatusText(status) {
            switch (status) {
                case '0':
                    return '待审批'
                case '1':
                    return '审批通过'
                case '2':
                    return '审批驳回'
                default:
                    return '未知状态'
            }
        },

        // 获取状态标签类型
        getStatusType(status) {
            switch (status) {
                case '0':
                    return 'danger'
                case '1':
                    return 'warning'
                case '2':
                    return 'success'
                default:
                    return 'info'
            }
        },
        getStatusText2(status) {
            switch (status) {
                case '0':
                    return 'approving'
                case '1':
                    return 'approved'
                case '2':
                    return 'rejected'
                default:
                    return 'approving'
            }
        },
        getProgressStatusText(status) {
            switch (status) {
                case '0':
                    return '进行中'
                case '1':
                    return '已完成'
                default:
                    return '未知状态'
            }
        },
        // 树数据过滤 - 支持无限层级转换
        convertToVueTree(data, level = 1) {
            if (!data || !Array.isArray(data)) {
                return []
            }

            return data.map(item => {
                const node = {
                    id: item.deptId,
                    label: item.deptName,
                }

                if (item.children && Array.isArray(item.children) && item.children.length > 0) {
                    if (level < 3) {
                        const children = this.convertToVueTree(item.children, level + 1)
                        if (children.length > 0) node.children = children
                    }
                }

                return node
            })
        },
    },
}
</script>
<style lang="scss" scoped>
.jump {
    color: #409EFF;
    cursor: pointer;
}
</style>
