<template>
    <div>
        <el-table
            :data="tableData"
            :header-cell-style="{
                textAlign: 'center',
                backgroundColor: '#003078',
                color: '#fff'
            }"
            stripe
            height="calc(100vh - 515px)"
            :style="{ overflow: 'hidden' }"
            row-key="id"
            default-expand-all
        >
            <el-table-column prop="name" label="指标" show-overflow-tooltip width="180px" />
            <el-table-column align="center" label="参与误差比较">
                <template #default="{ row }">
                    <el-switch
                        v-model="row.errorFlag"
                        v-if="row.show"
                        :active-value="1"
                        :inactive-value="0"
                        :disabled="disabled"
                    >
                        <template #active-action>
                            <span>√</span>
                        </template>
                        <template #inactive-action>
                            <span>×</span>
                        </template>
                    </el-switch>
                </template>
            </el-table-column>
            <el-table-column align="center" label="是否启用">
                <template #default="{ row }">
                    <el-switch
                        v-model="row.enable"
                        v-if="row.show"
                        :active-value="1"
                        :inactive-value="0"
                        :disabled="disabled"
                    >
                        <template #active-action>
                            <span>√</span>
                        </template>
                        <template #inactive-action>
                            <span>×</span>
                        </template>
                    </el-switch>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import type { Dict } from '@/api/system/dictionary/interface'
import { getDictTreeByCode } from '@/api/system/dictionary/dictTree'
import { checkDataList } from '@/api/device/testScript'

const props = defineProps({
    activeName: {
        type: String,
        required: true
    },
    formContent: {
        type: Object,
        required: true
    },
    disabled: {
        type: Boolean,
        default: true
    }
})
const tableData = ref<any[]>([])
const info = async () => {
    let checkData: any = []
    await checkDataList({
        scriptId: props.formContent.id,
        scriptType: props.activeName
    }).then((res: any) => {
        checkData = res.data
    })

    let { data } = await getDictTreeByCode({
        name: '',
        id: '',
        pid: '',
        pids: '',
        code: 'Script_Error',
        sort: 0
    })

    data[0].children.forEach((item: any, i: number) => {
        tableData.value.push({
            id: item.id,
            name: item.name,
            show: false,
            children: []
        })
        item.children.forEach((k: any) => {
            let childrenList: any = []
            checkData.forEach((j: any) => {
                if (j.valueType == k.id) {
                    childrenList.push(j)
                }
            })
            if (childrenList.length > 0) {
                tableData.value[i].children.push({
                    id: k.id,
                    pid: item.id,
                    name: k.name,
                    dataType: item.name == '闪变' ? 'avg' : item.name == '暂态' ? 'avg' : 'real',
                    show: true,
                    errorFlag: childrenList[0].errorFlag,
                    enable: childrenList[0].enable
                })
            } else {
                tableData.value[i].children.push({
                    id: k.id,
                    pid: item.id,
                    name: k.name,
                    dataType: item.name == '闪变' ? 'avg' : item.name == '暂态' ? 'avg' : 'real',
                    show: true,
                    errorFlag: 0,
                    enable: 0
                })
            }
        })
    })
    console.log('🚀 ~ item.children.forEach ~ tableData.value:', tableData.value)
}
const getData = () => {
    return tableData.value
}
onMounted(() => {
    info()
    // tableData.value = data.data[0].children || []
})

// 对外映射
defineExpose({ getData })
</script>
<style lang="scss" scoped></style>
