<template>
    <div style="position: relative; height: 100%">
        <el-button
            hc-btn
            type="primary"
            style="float: right"
            @click="rightPushTree"
        >
            文件入口配置
        </el-button>
        <el-scrollbar v-loading="rightLoad" style="width: 80%">
            <hc-data-tree
                :h-props="rightprops"
                :datas="rightData"
                tree-key="id"
            >
            </hc-data-tree>
        </el-scrollbar>
    </div>

    <!-- 上传文件入口配置 -->

    <!-- 右侧树 -->
    <hc-dialog
        title="上传文件入口显示配置"
        v-model="pushfileTap"
        @close="pushFileClose"
    >
        <el-scrollbar v-loading="dialogLoad">
            <hc-data-tree
                :h-props="dialogProps"
                show-checkbox
                :datas="dialogData"
                tree-key="id"
                ref="entryTreeRef"
            >
            </hc-data-tree>
        </el-scrollbar>
        <template #footer>
            <el-button @click="pushfileTap = false">取 消</el-button>
            <el-button type="primary" @click="saveFile">确 定</el-button>
        </template>
    </hc-dialog>
</template>
<script setup>
import { getArrValue } from "js-fast-way";
import { ref, watch } from "vue";
import archiveApi from "~api/desk/archive-tree";

const props = defineProps({
    rightData: {
        type: Array,
        default: () => [],
    },
    wbsId: {
        type: String,
        default: "",
    },
    projectId: {
        type: [String, Number],
        default: 0,
    },
    tabKey: {
        type: [String, Number],
        default: 0,
    },
});
const rightData = ref([]);
const wbsId = ref(props.wbsId);
const projectId = ref(props.projectId);
const tabKey = ref(props.tabKey);
const rightLoad = ref(false);
const getRightData = async () => {
    rightLoad.value = true;
    const { data } = await archiveApi.archiveTreetree({
        projectId: projectId.value,
        nodeType: 2,
        disPlayTree: 1,
    });
    rightLoad.value = false;
    rightData.value = getArrValue(data);
};
watch(
    () => [props.wbsId, props.projectId, props.tabKey],
    ([wid, pid, key]) => {
        wbsId.value = wid;
        projectId.value = pid;
        tabKey.value = key;
        getRightData();
    },
    { immediate: true, deep: true }
);
const pushfileTap = ref(false);
//监听显示
watch(pushfileTap, (val) => {
    if (val) getDialogData();
});

//数据格式
const rightprops = ref({ label: "title" });

const rightPushTree = () => {
    pushfileTap.value = true;
};

// 入口配置弹窗

const pushFileClose = () => {};
const entryTreeRef = ref(null);
const dialogProps = ref({ label: "title" });
const dialogData = ref([]);
const dialogLoad = ref(false);
const getDialogData = async () => {
    dialogLoad.value = true;
    const { data, code } = await archiveApi.archiveTreetree({
        nodeType: 2,
        projectId: projectId.value,
    });
    dialogLoad.value = false;
    if (code == 200) {
        dialogData.value = getArrValue(data);
        saixuan(dialogData.value);
        console.log(checkXuan.value);
        entryTreeRef.value.treeRef.setCheckedKeys(checkXuan.value);
    }
};
//设置选中
const checkXuan = ref([]);
const saixuan = (da) => {
    //赛选
    if (da.length > 0) {
        let tag = true;
        da.forEach((val) => {
            if (val.isDisplayTree == 1 && val.hasChildren) {
                let ks = saixuan(val.children);
                if (ks) {
                    checkXuan.value.push(val.id);
                }
            } else if (val.isDisplayTree == 1 && !val.hasChildren) {
                checkXuan.value.push(val.id);
            } else {
                tag = false;
            }
        });
        return tag;
    }
};
//保存入口配置
const saveFile = async () => {
    //保存按钮
    let zi = entryTreeRef.value.treeRef.getCheckedKeys(); //返回选中子节点的key
    let fu = entryTreeRef.value.treeRef.getHalfCheckedKeys(); //返回选中子节点的父节点的key
    let arr = [...zi, ...fu];
    if (arr.length > 0) {
        let ids = "";
        arr.forEach((val, key) => {
            ids += val;
            if (key != arr.length - 1) {
                ids += ",";
            }
        });
        const { code } = await archiveApi.submitDisplayConfigTree({ ids });

        if (code == 200) {
            window.$message({
                type: "success",
                message: "设置成功",
            });

            pushfileTap.value = false;
            getRightData();
        }
    } else {
        window.$message({
            type: "error",
            message: "请先设置配置文件",
        });
    }
};
</script>
