<template>
    <div class=" device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
        <CloudDeviceEntryTree ref="TerminalRef" @node-click="nodeClick" @init="nodeClick" @onAdd="onAdd"
            :showPush="true"></CloudDeviceEntryTree>
        <div class="device-manage-right pd0 ">
            <el-form :inline="true" class="demo-form-inline" style="height: 42px">
                <el-form-item style="position: relative; z-index: 2">
                    <el-button icon="el-icon-Plus" type="primary" @click="add"
                        v-if="nodeLevel != 4 && !(connectionMethod == 'MQTT' && nodeLevel == 3)">
                        {{
                            nodeLevel == 0
                                ? '新增工程'
                                : nodeLevel == 1
                                    ? '新增项目'
                                    : nodeLevel == 2
                                        ? '新增设备'
                                        : nodeLevel == 3
                                            ? '新增监测点'
                                            : '新增监测点'
                        }}
                    </el-button>
                    <el-button icon="el-icon-Edit" type="primary" @click="update" v-if="nodeLevel != 0">
                        修改
                    </el-button>
                    <el-button icon="el-icon-Close" type="danger" @click="remove" v-if="nodeLevel != 0" :loading="loading2">
                        删除
                    </el-button>
                    <el-button icon="el-icon-Right" :disabled="nextfalg" type="primary" @click="next"
                        v-if="nodeLevel != 4 && pageStatus == 2">
                        下一步
                    </el-button>
                    <el-button type="info" @click="black" icon="el-icon-Back" v-if="pageStatus == 2 || pageStatus == 3">
                        撤 销
                    </el-button>
                    <el-button icon="el-icon-Check" type="primary" v-if="pageStatus == 2" @click="onsubmit" :loading="loading1">
                        确认提交
                    </el-button>
                    <el-button icon="el-icon-Check" type="primary" v-if="pageStatus == 3" @click="onsubmit" :loading="loading1">
                        修改提交
                    </el-button>
                </el-form-item>
                <!-- <el-form-item style="position: relative; z-index: 2" v-else>
                    <span style="font-size: 16px; font-weight: bold; color: var(--el-color-primary)">
                        MQTT通讯方式的设备暂不支持修改！
                    </span>
                </el-form-item> -->

                <el-form-item style="right: 300px; position: absolute; overflow: hidden">
                    <LocationInformation style="width: 16px; margin-right: 8px; color: var(--el-color-primary)" />
                    <span style="font-size: 16px; font-weight: bold; color: var(--el-color-primary)">
                        当前操作节点：
                    </span>
                </el-form-item>
                <el-form-item style="right: 0; position: absolute; overflow: hidden">
                    <div class="title" :class="titleList.length > 2 ? 'titleScroll' : ''">
                        <span v-for="(item, index) in titleList" :key="index">
                            {{ index == 0 ? '' : ' >　' }}{{ item }}
                        </span>
                    </div>
                </el-form-item>
            </el-form>
            <div id="scrollBox" :style="{ height: Height.height }" style="overflow-y: auto">

                <el-form class="main-form overview_scroll" :label-position="'right'" label-width="130px" :inline="true"
                    ref="mainForm" :model="formData">

                    <el-tabs type="border-card" v-if="nodeLevel != 0">
                        <el-tab-pane :label="formData.engineeringParam.name || '工程信息'">
                            <!--工程-->
                            <el-form-item id="id300" class="form-item" label="工程名称"
                                v-if="nodeLevel > 0 || pageStatus == 2" prop="engineeringParam.name"
                                :rules="{ required: true, message: '请输入工程名称', trigger: 'blur' }">
                                <el-input maxlength="32" show-word-limit clearable
                                    v-model="formData.engineeringParam.name" placeholder="请输入工程名称" :disabled="!((nodeLevel == 1 && pageStatus == 3) || (nodeLevel == 0 && pageStatus == 2))
                                        "></el-input>
                            </el-form-item>
                            <!-- 省下拉框 -->
                            <el-form-item id="id200" class="form-item" label="省" prop="engineeringParam.province"
                                v-if="nodeLevel > 0 || pageStatus == 2"
                                :rules="{ required: true, message: '请选择省', trigger: 'change' }">
                                <el-select clearable filterable v-model="formData.engineeringParam.province" :disabled="!((nodeLevel == 1 && pageStatus == 3) || (nodeLevel == 0 && pageStatus == 2))
                                    " placeholder="请选择省" @change="provinceChange">
                                    <el-option v-for="item in provinceOptions" :key="item.value" :label="item.text"
                                        :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>
                            <!-- 市下拉框 -->
                            <el-form-item id="id200" class="form-item" label="市" prop="engineeringParam.city"
                                v-if="nodeLevel > 0 || pageStatus == 2"
                                :rules="{ required: true, message: '请选择市', trigger: 'change' }">
                                <el-select clearable filterable v-model="formData.engineeringParam.city" :disabled="!((nodeLevel == 1 && pageStatus == 3) || (nodeLevel == 0 && pageStatus == 2))
                                    " placeholder="请选择市">
                                    <el-option v-for="item in cityOptions" :key="item.value" :label="item.text"
                                        :value="item.value"></el-option>
                                </el-select>
                            </el-form-item>

                            <el-form-item class="form-item" label="描述" prop="engineeringParam.description"
                                v-if="nodeLevel > 0 || pageStatus == 2">
                                <el-input maxlength="32" show-word-limit clearable
                                    v-model="formData.engineeringParam.description" placeholder="请输入描述" :disabled="!((nodeLevel == 1 && pageStatus == 3) || (nodeLevel == 0 && pageStatus == 2))
                                        "></el-input>
                            </el-form-item>
                            <el-form-item class="form-item" label="排序" prop="engineeringParam.sort"
                                v-if="nodeLevel > 0 || pageStatus == 2"
                                :rules="[{ required: true, message: '请输入排序', trigger: 'blur' }]">
                                <el-input maxlength="32" show-word-limit clearable
                                    v-model.trim.number="formData.engineeringParam.sort" placeholder="请输入排序" :disabled="!((nodeLevel == 1 && pageStatus == 3) || (nodeLevel == 0 && pageStatus == 2))
                                        "></el-input>
                            </el-form-item></el-tab-pane>

                    </el-tabs>


                    <!--项目-->
                    <div style="width: 100%" class="mt10"
                        v-if="(nodeLevel > 0 || pageStatus == 2) && formData.projectInfoList.length > 0">
                        <el-tabs v-model="deviceIndex" type="border-card" :addable="false" :closable="pageStatus != 1"
                            style="width: 100%" @edit="handleDeviceTabsEdit"
                            @tab-click="tabChange('deviceIndex', $event)">
                            <el-tab-pane v-for="(item, index) in formData.projectInfoList" :key="index"
                                :label="item.name ? item.name : '新建项目' + index" :name="index + ''">
                                <div class="flex mt10">
                                    <el-form-item class="form-item" label="项目名称"
                                        :prop="'projectInfoList[' + index + '].name'" :rules="[
                                            { required: true, message: '请输入项目名称', trigger: 'blur' }
                                        ]">
                                        <el-input maxlength="32" show-word-limit clearable v-model="item.name"
                                            placeholder="请输入项目名称" :disabled="!(
                                                (nodeLevel == 2 && pageStatus == 3) ||
                                                ((nodeLevel == 1 || (nodeLevel == 0 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="地址"
                                        :prop="'projectInfoList[' + index + '].area'"
                                        :rules="[{ required: true, message: '请输入地址', trigger: 'blur' }]">
                                        <el-input maxlength="32" show-word-limit clearable v-model="item.area"
                                            placeholder="请输入地址" :disabled="!(
                                                (nodeLevel == 2 && pageStatus == 3) ||
                                                ((nodeLevel == 1 || (nodeLevel == 0 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="描述"
                                        :prop="'projectInfoList[' + index + '].description'"
                                        :rules="[{ required: true, message: '请输入描述', trigger: 'blur' }]">
                                        <el-input maxlength="300" show-word-limit clearable v-model="item.description"
                                            placeholder="请输入描述" :disabled="!(
                                                (nodeLevel == 2 && pageStatus == 3) ||
                                                ((nodeLevel == 1 || (nodeLevel == 0 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                    <el-form-item label="拓扑图" :prop="'projectInfoList[' + index + '].topoId'" :rules="[
                                        { required: true, message: '请选择拓扑图', trigger: 'change' }
                                    ]">


                                        <div style="display: flex; align-items: center;width: 100%">
                                            <el-select v-model="item.topoId" placeholder="请选择拓扑图"
                                                popper-class="productSelector " :disabled="!(
                                                    (nodeLevel == 2 && pageStatus == 3) ||
                                                    ((nodeLevel == 1 || (nodeLevel == 0 && pageStatus == 2)) &&
                                                        pageStatus == 2)
                                                )
                                                    ">
                                                <el-option v-for="item in images" :key="item.id" :label="item.name"
                                                    :value="item.id">
                                                    <span>
                                                        <img :src="item.url" v-if="item.url" class="image-preview" />
                                                    </span>
                                                    <span style="float: right">
                                                        {{ item.name }}
                                                    </span>
                                                </el-option>
                                            </el-select>
                                            <el-button icon="el-icon-Plus" type="primary" class="ml10"
                                                @click="addTopology"></el-button>
                                        </div>


                                    </el-form-item>
                                    <el-form-item class="form-item" label="排序"
                                        :prop="'projectInfoList[' + index + '].sort'"
                                        :rules="[{ required: true, message: '请输入排序', trigger: 'blur' }]">
                                        <el-input maxlength="32" show-word-limit clearable
                                            v-model.trim.number="item.sort" placeholder="请输入排序" :disabled="!(
                                                (nodeLevel == 2 && pageStatus == 3) ||
                                                ((nodeLevel == 1 || (nodeLevel == 0 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                </div>
                            </el-tab-pane>
                        </el-tabs>
                    </div>

                    <!--设备-->
                    <div style="width: 100%" class="mt10" v-if="
                        (nodeLevel > 1 || pageStatus == 2) &&
                        (nodeLevel >= 2 || pageStatus == 2) &&
                        formData.deviceInfoList.length > 0
                    ">
                        <el-tabs v-model="busBarIndex" type="border-card" :addable="false"
                            :closable="pageStatus != 1 && connectionMethod != 'MQTT'" @edit="handleBusBarTabsEdit"
                            @tab-click="tabChange('busBarIndex', $event)">
                            <el-tab-pane v-for="(busItem, bIndex) in formData.deviceInfoList" :key="bIndex"
                                :label="busItem.name ? busItem.name : '新建设备' + bIndex" :name="bIndex + ''">
                                <div class="flex mt10">
                                    <el-form-item class="form-item" label="设备名称"
                                        :prop="'deviceInfoList[' + bIndex + '].name'" :rules="[
                                            { required: true, message: '请输入设备名称', trigger: 'blur' }
                                        ]">
                                        <el-input maxlength="32" show-word-limit clearable v-model="busItem.name"
                                            placeholder="请输入设备名称" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                    <el-form-item id="id200" class="form-item" label="设备类型"
                                        :prop="'deviceInfoList[' + bIndex + '].devType'" :rules="[
                                            { required: true, message: '请选择设备类型', trigger: 'change' }
                                        ]">
                                        <el-select clearable filterable v-model="busItem.devType" placeholder="请选择设备类型"
                                            style="width: 100%" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                " @change="busItem.devModel = ''; devTypeChange($event)">

                                            <el-option v-for="item in formDevTypeOptions" :key="item.id"
                                                :label="item.name" :value="item.id"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item id="id200" class="form-item" label="设备型号"
                                        :prop="'deviceInfoList[' + bIndex + '].devModel'" :rules="[
                                            { required: true, message: '请选择设备型号', trigger: 'change' }
                                        ]">
                                        <el-select clearable filterable v-model="busItem.devModel" placeholder="请选择设备型号"
                                            style="width: 100%" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in devModelOptions.filter(
                                                item => item.pid == busItem.devType
                                            )" :key="option.id" :label="option.name" :value="option.id"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item id="id200" class="form-item" label="设备通讯方式"
                                        :prop="'deviceInfoList[' + bIndex + '].devAccessMethod'" :rules="[
                                            { required: true, message: '请选择设备通讯方式', trigger: 'change' }
                                        ]">
                                        <el-select clearable filterable v-model="busItem.devAccessMethod"
                                            placeholder="请选择设备通讯方式" style="width: 100%" :disabled="!(connectionMethod != 'MQTT' &&
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option label="1056协议" value="CLD"></el-option>
                                            <!-- <el-option label="MQTT" value="MQTT"></el-option> -->
                                        </el-select>
                                    </el-form-item>

                                    <el-form-item class="form-item" label="设备mac地址"
                                        :prop="'deviceInfoList[' + bIndex + '].mac'" :rules="{
                                            required: true,
                                            message: '请输入设备mac地址',
                                            trigger: 'blur'
                                        }">
                                        <MacAddressInput v-model="busItem.mac" :disabled="!(
                                            (nodeLevel == 3 && pageStatus == 3) ||
                                            ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                pageStatus == 2)
                                        )" />
                                    </el-form-item>

                                    <el-form-item class="form-item" v-if="busItem.devAccessMethod == 'CLD'"
                                        label="icd模型" :prop="'deviceInfoList[' + bIndex + '].idc'">
                                        <el-select clearable filterable v-model="busItem.icd" placeholder="请选择icd模型"
                                            style="width: 100%" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="item in icdList" :key="item.id" :label="item.name"
                                                :value="item.id"></el-option>
                                        </el-select>
                                    </el-form-item>

                                    <el-form-item class="form-item" label="合同号"
                                        :prop="'deviceInfoList[' + bIndex + '].cntractNo'">
                                        <el-input maxlength="32" show-word-limit clearable v-model="busItem.cntractNo"
                                            placeholder="请输入合同号" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                    <el-form-item v-if="busItem.devAccessMethod == 'CLD'" class="form-item"
                                        label="所属前置机" :prop="'deviceInfoList[' + bIndex + '].nodeId'" :rules="[
                                            { required: true, message: '请选择所属前置机', trigger: 'change' }
                                        ]">
                                        <div style="display: flex; align-items: center;width: 100%">
                                            <el-select clearable filterable v-model="busItem.nodeId"
                                                placeholder="请选择所属前置机" :disabled="!(pageStatus == 2 && nodeLevel == 2)">
                                                <el-option v-for="option in affiliatiedFrontArr" :key="option.id"
                                                    :label="option.name" :value="option.id"></el-option>
                                            </el-select>
                                            <el-button icon="el-icon-Plus" type="primary" class="ml10"
                                                @click="addAffiliatiedFront"></el-button>
                                        </div>
                                    </el-form-item>
                                    <el-form-item v-if="busItem.devAccessMethod == 'CLD'" class="form-item" label="进程号"
                                        :prop="'deviceInfoList[' + bIndex + '].nodeProcess'">
                                        <el-input maxlength="32" show-word-limit clearable v-model="busItem.nodeProcess"
                                            placeholder="自动分配" :disabled="true"></el-input>
                                    </el-form-item>
                                    <el-form-item v-if="busItem.devAccessMethod == 'CLD'" class="form-item" label="日志等级"
                                        :prop="'deviceInfoList[' + bIndex + '].devLogLevel'">
                                        <el-select clearable filterable v-model="busItem.devLogLevel"
                                            placeholder="请选择日志等级" style="width: 100%" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="value in logList" :key="value.value" :label="value.label"
                                                :value="value.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="是否启用"
                                        :prop="'deviceInfoList[' + bIndex + '].usageStatus'">
                                        <el-select clearable filterable v-model="busItem.usageStatus"
                                            placeholder="请选择是否启用" style="width: 100%" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option label="启用" :value="1"></el-option>
                                            <el-option label="停用" :value="0"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="是否支持升级"
                                        v-if="busItem.devAccessMethod == 'CLD'"
                                        :prop="'deviceInfoList[' + bIndex + '].upgrade'">
                                        <el-select clearable filterable v-model="busItem.upgrade"
                                            placeholder="请选择是否支持升级" style="width: 100%" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option label="是" :value="1"></el-option>
                                            <el-option label="否" :value="0"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <!-- <el-form-item
                                                label="接入"
                                                v-if="connectionMethod == 'MQTT' && busItem?.id"
                                            >
                                                <el-button
                                                    icon="el-icon-Sort"
                                                    type="primary"
                                                    size="small"
                                                    @click="access(busItem)"
                                                    :loading="accessLoading"
                                                >
                                                    {{ accessLoading ? '接入中' : '接入' }}
                                                </el-button>
                                            </el-form-item> -->
                                    <el-form-item class="form-item" label="排序"
                                        :prop="'deviceInfoList[' + bIndex + '].sort'"
                                        :rules="[{ required: true, message: '请输入排序', trigger: 'blur' }]">
                                        <el-input maxlength="32" show-word-limit clearable
                                            v-model.trim.number="busItem.sort" placeholder="请输入排序" :disabled="!(
                                                (nodeLevel == 3 && pageStatus == 3) ||
                                                ((nodeLevel == 2 || (nodeLevel == 1 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                </div>
                            </el-tab-pane>
                        </el-tabs>
                    </div>

                    <!--监测点-->
                    <div style="width: 100%" class="mt10" v-if="
                        (nodeLevel > 2 || pageStatus == 2) &&
                        (nodeLevel >= 3 || pageStatus == 2) &&
                        formData.lineInfoList.length > 0
                    ">
                        <!-- connectionMethod != 'MQTT' -->
                        <el-tabs type="border-card" v-model="lineIndex" :addable="false"
                            :closable="pageStatus != 1 && connectionMethod != 'MQTT'" @edit="handleLineTabsEdit"
                            @tab-click="tabChange('lineIndex', $event)">
                            <el-tab-pane v-for="(lineItem, lIndex) in formData.lineInfoList" :key="lIndex"
                                :label="lineItem.name ? lineItem.name : '新建监测点' + lIndex" :name="lIndex + ''">
                                <div class="flex mt10">
                                    <el-form-item class="form-item" label="监测点名称"
                                        :prop="'lineInfoList[' + lIndex + '].name'" :rules="{
                                            required: true,
                                            message: '请输入监测点名称',
                                            trigger: 'blur'
                                        }">
                                        <el-input maxlength="32" show-word-limit clearable v-model="lineItem.name"
                                            placeholder="请输入监测点名称" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                "></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="线路号" v-if="connectionMethod != 'MQTT'"
                                        :prop="'lineInfoList[' + lIndex + '].lineNo'" :rules="{
                                            required: true,
                                            message: '请选择线路号',
                                            trigger: 'change'
                                        }">
                                        <el-select clearable filterable v-model="lineItem.lineNo" placeholder="请选择线路号"
                                            :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in pointNumArr" :key="option.name"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="接线方式"
                                        :prop="'lineInfoList[' + lIndex + '].conType'" :rules="{
                                            required: true,
                                            message: '请选择接线方式',
                                            trigger: 'change'
                                        }">
                                        <el-select clearable filterable v-model="lineItem.conType" placeholder="请选择接线方式"
                                            :disabled="!(
                                                connectionMethod != 'MQTT' && (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in wiringTypeArr" :key="option.name"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="电压等级"
                                        :prop="'lineInfoList[' + lIndex + '].volGrade'" :rules="{
                                            required: true,
                                            message: '请选择电压等级',
                                            trigger: 'change'
                                        }">
                                        <el-select clearable filterable v-model="lineItem.volGrade"
                                            @change="volGradeChange($event, lineItem)" placeholder="请选择电压等级" :disabled="!(
                                                connectionMethod != 'MQTT' && (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in voltageLevelOptions" :key="option.value"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>

                                    <el-form-item class="form-item" label="PT变比"
                                        :prop="'lineInfoList[' + lIndex + '].ptRatio'"
                                        :rules="{ required: true, message: '请输入pt', trigger: 'blur' }">
                                        <div style="width: 100%; display: flex; justify-content: space-between">
                                            <el-input clearable-number :controls="false" :min="1" style="width: 48%"
                                                oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.ptRatio" :disabled="!(connectionMethod != 'MQTT' &&
                                                    (nodeLevel == 4 && pageStatus == 3) ||
                                                    ((nodeLevel == 3 ||
                                                        (nodeLevel == 2 && pageStatus == 2)) &&
                                                        pageStatus == 2)
                                                )
                                                    "></el-input>
                                            <span style="
                                                            display: flex;
                                                            align-items: center;
                                                            justify-content: center;
                                                        ">
                                                :
                                            </span>
                                            <el-input clearable-number :controls="false" :min="1" style="width: 48%"
                                                oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.pt2Ratio" :disabled="!(connectionMethod != 'MQTT' &&
                                                    (nodeLevel == 4 && pageStatus == 3) ||
                                                    ((nodeLevel == 3 ||
                                                        (nodeLevel == 2 && pageStatus == 2)) &&
                                                        pageStatus == 2)
                                                )
                                                    "></el-input>
                                        </div>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="CT变比"
                                        :prop="'lineInfoList[' + lIndex + '].ctRatio'"
                                        :rules="{ required: true, message: '请输入ct', trigger: 'blur' }">
                                        <div style="width: 100%; display: flex; justify-content: space-between">
                                            <el-input clearable-number :controls="false" :min="1" style="width: 48%"
                                                oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.ctRatio" :disabled="!(connectionMethod != 'MQTT' &&
                                                    (nodeLevel == 4 && pageStatus == 3) ||
                                                    ((nodeLevel == 3 ||
                                                        (nodeLevel == 2 && pageStatus == 2)) &&
                                                        pageStatus == 2)
                                                )
                                                    "></el-input>
                                            <span style="
                                                            display: flex;
                                                            align-items: center;
                                                            justify-content: center;
                                                        ">
                                                :
                                            </span>
                                            <el-input clearable-number :controls="false" :min="1" style="width: 48%"
                                                oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.ct2Ratio" :disabled="!(connectionMethod != 'MQTT' &&
                                                    (nodeLevel == 4 && pageStatus == 3) ||
                                                    ((nodeLevel == 3 ||
                                                        (nodeLevel == 2 && pageStatus == 2)) &&
                                                        pageStatus == 2)
                                                )
                                                    "></el-input>
                                        </div>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="统计间隔"
                                        :prop="'lineInfoList[' + lIndex + '].lineInterval'" :rules="{
                                            required: true,
                                            message: '请选择统计间隔',
                                            trigger: 'change'
                                        }">
                                        <el-select clearable filterable v-model="lineItem.lineInterval"
                                            placeholder="请选择统计间隔" :disabled="!(connectionMethod != 'MQTT' &&
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in lineSpaceArr" :key="option.name"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>

                                    <el-form-item class="form-item" label="基准容量(MVA)"
                                        :prop="'lineInfoList[' + lIndex + '].basicCapacity'"
                                        :rules="{ required: true, message: '请输入基准容量', trigger: 'blur' }">
                                        <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                            :min="0" style="width: 100%" v-model="lineItem.basicCapacity" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                " placeholder="请输入基准容量(MVA)"></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="短路容量(MVA)"
                                        :prop="'lineInfoList[' + lIndex + '].shortCircuitCapacity'"
                                        :rules="{ required: true, message: '请输入短路容量', trigger: 'blur' }">
                                        <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                            :min="0" style="width: 100%" v-model="lineItem.shortCircuitCapacity"
                                            :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                " placeholder="请输入短路容量(MVA)"></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="设备容量(MVA)"
                                        :prop="'lineInfoList[' + lIndex + '].devCapacity'"
                                        :rules="{ required: true, message: '请输入设备容量', trigger: 'blur' }">
                                        <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                            :min="0" style="width: 100%" v-model="lineItem.devCapacity" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                " placeholder="请输入设备容量(MVA)"></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="协议容量(MVA)"
                                        :prop="'lineInfoList[' + lIndex + '].protocolCapacity'"
                                        :rules="{ required: true, message: '请输入协议容量', trigger: 'blur' }">
                                        <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                            :min="0" style="width: 100%" v-model="lineItem.protocolCapacity" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                " placeholder="请输入协议容量(MVA)"></el-input>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="运行状态"
                                        :prop="'lineInfoList[' + lIndex + '].runStatus'" :rules="{
                                            required: true,
                                            message: '请选择运行状态',
                                            trigger: 'change'
                                        }" v-if="connectionMethod != 'MQTT'">
                                        <!-- （0：运行；1：检修；2：停运；3：调试；4：退运） -->
                                        <el-select clearable filterable v-model="lineItem.runStatus"
                                            placeholder="请选择运行状态" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option label="运行" :value="0" />
                                            <el-option label="检修" :value="1" />
                                            <el-option label="停运" :value="2" />
                                            <el-option label="调试" :value="3" />
                                            <el-option label="退运" :value="4" />
                                        </el-select>
                                    </el-form-item>

                                    <!-- <el-form-item class="form-item" label="敏感用户">
                                                <el-select clearable filterable v-model="lineItem.monitorUser"
                                                    placeholder="请选择敏感用户" :disabled="!(
                                                        (nodeLevel == 4 && pageStatus == 3) ||
                                                        ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                            pageStatus == 2)
                                                    )
                                                        ">
                                                    <el-option v-for="option in userList" :key="option.id"
                                                        :label="option.name" :value="option.id"></el-option>
                                                </el-select>
                                            </el-form-item> -->
                                    <el-form-item class="form-item" label="监测对象类型" v-if="connectionMethod != 'MQTT'">
                                        <el-select clearable filterable v-model="lineItem.monitorObj"
                                            placeholder="请选择监测对象类型" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in monitorObjList" :key="option.id"
                                                :label="option.name" :value="option.id"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="监测位置"
                                        v-if="!(connectionMethod == 'MQTT' && formDevTypeOptions.find(item => item.id == positionKey)?.name == '监测设备')">
                                        <el-select clearable filterable v-model="lineItem.position"
                                            placeholder="请选择监测位置" :disabled="!(connectionMethod != 'MQTT' &&
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="option in linePosition" :key="option.id"
                                                :label="option.name" :value="option.id"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <!-- <el-form-item class="form-item" label="是否治理"
                                               >
                                                <el-select clearable filterable v-model="lineItem.govern"
                                                    placeholder="请选择是否治理" :disabled="!(
                                                        (nodeLevel == 4 && pageStatus == 3) ||
                                                        ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                            pageStatus == 2)
                                                    )
                                                        ">
                                                    <el-option label="未治理" :value="0" />
                                                    <el-option label="已治理" :value="1" />
                                                </el-select>
                                            </el-form-item> -->

                                    <el-form-item class="form-item" label="日志等级" v-if="connectionMethod != 'MQTT'"
                                        :prop="'lineInfoList[' + lIndex + '].lineLogLevel'" :rules="{
                                            required: true,
                                            message: '请选择日志等级',
                                            trigger: 'change'
                                        }">
                                        <!-- （0：运行；1：检修；2：停运；3：调试；4：退运） -->
                                        <el-select clearable filterable v-model="lineItem.lineLogLevel"
                                            placeholder="请选择日志等级" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option v-for="value in logList" :key="value.value" :label="value.label"
                                                :value="value.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="是否主要监测点" v-if="connectionMethod != 'MQTT'"
                                        :prop="'lineInfoList[' + lIndex + '].isImportant'" :rules="{
                                            required: true,
                                            message: '请选择是否主要监测点',
                                            trigger: 'change'
                                        }">
                                        <!-- （0：运行；1：检修；2：停运；3：调试；4：退运） -->
                                        <el-select clearable filterable v-model="lineItem.isImportant"
                                            placeholder="请选择是否主要监测点" :disabled="!(
                                                (nodeLevel == 4 && pageStatus == 3) ||
                                                ((nodeLevel == 3 || (nodeLevel == 2 && pageStatus == 2)) &&
                                                    pageStatus == 2)
                                            )
                                                ">
                                            <el-option label="是" :value="1"></el-option>
                                            <el-option label="否" :value="0"></el-option>
                                        </el-select>
                                    </el-form-item>
                                </div>
                                <!-- <div class="flex mt10" v-else>
                                    <el-form-item class="form-item" label="监测点名称">
                                        <el-input maxlength="32" show-word-limit clearable v-model="lineItem.name"
                                            placeholder="请输入监测点名称" :disabled="true"></el-input>
                                    </el-form-item>
                                   
                                    <el-form-item class="form-item" label="接线方式">
                                        <el-select clearable filterable v-model="lineItem.conType" placeholder="请选择接线方式"
                                            :disabled="true">
                                            <el-option v-for="option in wiringTypeArr" :key="option.name"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="统计间隔">
                                        <el-select clearable filterable v-model="lineItem.lineInterval"
                                            placeholder="请选择统计间隔" :disabled="true">
                                            <el-option v-for="option in lineSpaceArr" :key="option.name"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="PT变比">
                                        <div style="width: 100%; display: flex; justify-content: space-between">
                                            <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                                :min="1" style="width: 48%" oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.ptRatio" :disabled="true"></el-input>
                                            <span style="
                                                            display: flex;
                                                            align-items: center;
                                                            justify-content: center;
                                                        ">
                                                :
                                            </span>
                                            <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                                :min="1" style="width: 48%" oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.pt2Ratio" :disabled="true"></el-input>
                                        </div>
                                    </el-form-item>
                                    <el-form-item class="form-item" label="CT变比">
                                        <div style="width: 100%; display: flex; justify-content: space-between">
                                            <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                                :min="1" style="width: 48%" oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.ctRatio" :disabled="true"></el-input>
                                            <span style="
                                                            display: flex;
                                                            align-items: center;
                                                            justify-content: center;
                                                        ">
                                                :
                                            </span>
                                            <el-input maxlength="32" show-word-limit clearable-number :controls="false"
                                                :min="1" style="width: 48%" oninput="value=value.replace(/[^\d]/g,'')"
                                                v-model.number="lineItem.ct2Ratio" :disabled="true"></el-input>
                                        </div>
                                    </el-form-item>

                                    <el-form-item class="form-item" label="电压等级">
                                        <el-select clearable filterable v-model="lineItem.volGrade"
                                            placeholder="请选择电压等级" :disabled="true">
                                            <el-option v-for="option in voltageLevelOptions" :key="option.value"
                                                :label="option.name" :value="option.value"></el-option>
                                        </el-select>
                                    </el-form-item>

                                    <el-form-item class="form-item" label="监测位置">
                                        <el-select clearable filterable v-model="lineItem.position"
                                            placeholder="请选择监测位置" :disabled="true">
                                            <el-option v-for="option in linePosition" :key="option.id"
                                                :label="option.name" :value="option.id"></el-option>
                                        </el-select>
                                    </el-form-item>

                                 
                                </div> -->
                            </el-tab-pane>
                        </el-tabs>
                    </div>
                </el-form>
            </div>
        </div>

        <el-dialog v-model="resultDialogVisible" title="台账下发结果" width="700px" :close-on-click-modal="false"
            :close-on-press-escape="false" :show-close="true" @close="handleDialogClose">
            <div v-if="pushResult" style="padding: 20px">
                <el-result :icon="pushResult.success ? 'success' : 'error'"
                    :title="pushResult.success ? '指令下发成功' : '指令下发失败'" :sub-title="pushResult.message"></el-result>

                <!-- 日志展示区域 -->
                <div style="margin-top: 20px">
                    <h3>指令下发日志:</h3>
                    <div style="
                            max-height: 300px;
                            overflow-y: auto;
                            border: 1px solid #ebeef5;
                            border-radius: 4px;
                            padding: 10px;
                        ">
                        <div v-for="(log, index) in pushResult.logs" :key="index"
                            style="padding: 5px 0; border-bottom: 1px solid #f0f0f0">
                            <span style="margin-left: 10px">{{ log.message }}</span>
                        </div>
                        <div v-if="pushResult.logs.length === 0" style="text-align: center; color: #999; padding: 20px">
                            暂无日志信息
                        </div>
                    </div>
                </div>
            </div>
            <div v-else style="text-align: center; padding: 20px">
                <el-icon :size="40" class="instruction" style="color: #409eff">
                    <Loading />
                </el-icon>
                <p style="margin-top: 15px; font-size: 16px">指令下发中，请稍候...</p>
                <!-- <p style="margin-top: 10px; color: #999">预计需要30秒左右</p>
                <p style="margin-top: 10px; color: #999">已等待: {{ countdown }}秒</p> -->
            </div>
        </el-dialog>
    </div>
</template>

<script setup lang="ts">
import { LocationInformation } from '@element-plus/icons-vue'
import CloudDeviceEntryTree from '@/components/tree/govern/cloudDeviceEntryTree.vue'
import { mainHeight } from '@/utils/layout'
import { useDictData } from '@/stores/dictData'
import { ref, reactive, onMounted, onActivated, computed } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import {
    getById,
    getEngineerById,
    getProjectById,
    getEquipmentById,
    getInfoById,
    nodeAllList,
    addLedger,
    deleteProject,
    deleteLine,
    deleteEquipment,
    updateEquipment,
    updateLine,
    pushLog,
    queryPushResult
} from '@/api/cs-device-boot/cloudDeviceEntry'
import { getTopoTemplate } from '@/api/cs-device-boot/topologyTemplate'
import { downLoadFile } from '@/api/cs-system-boot/manage'
import tree from '@/assets/map/area.json'
import { queryByCode, queryCsDictTree, queryByid } from '@/api/system-boot/dictTree'
import MacAddressInput from '@/components/form/mac/MacAddressInput.vue'
import { auditEngineering } from '@/api/cs-device-boot/edData'
import { convertToObject } from 'typescript'
import { Loading } from '@element-plus/icons-vue'
import { getList } from '@/api/cs-harmonic-boot/recruitment'
import { getDicDataByTypeCode } from '@/api/system-boot/csDictData'
import { useRouter } from 'vue-router'


const { push, options, currentRoute } = useRouter()
const TerminalRef = ref()
const pageHeight = mainHeight(80)
const Height = mainHeight(124)
const mainForm = ref()
const loading = ref(false)
const nextfalg = ref(false)
const loading1 = ref(false)
const dictData = useDictData()
const nodeLevel = ref(0)
const nodeLevelCopy = ref(0)
const pageStatus = ref(1)
const titleList: any = ref([])
const nodeData: any = ref([])
const deviceIndex: any = ref('0')
const busBarIndex: any = ref('0')
const lineIndex: any = ref('0')
const projectId: any = ref('0')
const provinceId: any = ref('0')
const gdId: any = ref('0')
const subId: any = ref('0')
const devId: any = ref('0')
const busBarId: any = ref('0')
const lineId: any = ref('0')
const userList: any = ref([])
const monitorObjList: any = dictData.getBasicData('Interference_Source')
const linePosition: any = dictData.getBasicData('Line_Position')

const currentGdName: any = ref('')
const affiliatiedFrontArr: any = ref([])
const voltageLevelArr = dictData.getBasicData('Dev_Voltage_Stand')
const devCLD: any = ref([])
const devTypeOptions: any = ref([])
const devTypeOptions2: any = ref([])
const treeClickCount = ref(0)
const areaTree: any = tree

const formData = ref({
    lineInfoList: [] as LineInfo[],
    projectInfoList: [] as ProjectInfo[],
    deviceInfoList: [] as DeviceInfo[],
    engineeringParam: {
        city: '',
        description: '',
        name: '',
        province: '',
        sort: 0
    }
})

const project = ref([
    { name: '治理设备', value: '治理设备' },
    { name: '便携式设备', value: '便携式设备' },
    { name: '监测设备', value: '监测设备' }
])
const wiringTypeArr = ref([
    { name: '星型接线', value: 0 },
    { name: '角型接线', value: 1 },
    { name: 'V型接线', value: 2 }
])
/**监测点序号 */
const pointNumArr = ref([
    { name: '1', value: 1 },
    { name: '2', value: 2 },
    { name: '3', value: 3 },
    { name: '4', value: 4 },
    { name: '5', value: 5 },
    { name: '6', value: 6 }
])
/**监测点间隔 */
const lineSpaceArr = ref([
    { name: '1分钟', value: 1 },
    { name: '3分钟', value: 3 },
    { name: '5分钟', value: 5 },
    { name: '10分钟', value: 10 }
])
const logList = ref([
    {
        value: 'DEBUG',
        label: 'DEBUG'
    },
    {
        value: 'NORMAL',
        label: 'NORMAL'
    },
    {
        value: 'WARN',
        label: 'WARN'
    },
    {
        value: 'ERROR',
        label: 'ERROR'
    }
])
const icdList = ref([])
//工程
// const engineeringParam = ref({
//     city: '',
//     description: '',
//     name: '',
//     province: ''
// })

interface ProjectInfo {
    name: string
    area: string
    description: string
    sort: number | string
    topoId: string
}
// 项目信息列表
//const projectInfoList = ref<ProjectInfo[]>([])
interface DeviceInfo {
    name: string
    devModel: string
    devType: string
    devAccessMethod: string
    devLogLevel: string
    mac: string
    ndid: string
    nodeId: string
    cntractNo: string
    sort: number
    nodeProcess: string
    usageStatus: number
    icd: string
    upgrade: number
}
// 设备信息列表
//const deviceInfoList = ref<DeviceInfo[]>([])
interface LineInfo {
    name: string
    lineNo: number | string
    conType: number
    lineInterval: number
    ptRatio: number
    pt2Ratio: number
    ctRatio: number
    ct2Ratio: number
    volGrade: number | string
    devMac: string
    monitorUser: string
    monitorObj: string
    position: string
    govern: string | number
    lineLogLevel: string
    isImportant: string | number
    runStatus: string | number
    basicCapacity: number
    shortCircuitCapacity: number
    devCapacity: number
    protocolCapacity: number
}
// 监测点信息列表
//const lineInfoList = ref<LineInfo[]>([])
const arrdess: any = ref((rule: any, value: any, callback: any) => {
    let reg1 =
        /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
    let reg2 =
        /^[A-Fa-f0-9]{1,2}\-[A-Fa-f0-9]{1,2}\-[A-Fa-f0-9]{1,2}\-[A-Fa-f0-9]{1,2}\-[A-Fa-f0-9]{1,2}\-[A-Fa-f0-9]{1,2}$/
    let reg3 =
        /^[A-Fa-f0-9]{1,2}\:[A-Fa-f0-9]{1,2}\:[A-Fa-f0-9]{1,2}\:[A-Fa-f0-9]{1,2}\:[A-Fa-f0-9]{1,2}\:[A-Fa-f0-9]{1,2}$/
    if (reg1.test(value)) {
        return true
    } else if (reg2.test(value)) {
        return true
    } else if (reg3.test(value)) {
        return true
    } else if (value == '') {
        return callback(new Error('请输入IP/MAC地址'))
    } else {
        callback(new Error('请输入正确IP/MAC地址'))
    }
})
const connectionMethod = ref('')
const positionKey = ref('')

// 省市选择相关数据
const provinceOptions = computed(() => areaTree)
const cityOptions = computed(() => {
    if (formData.value.engineeringParam.province) {
        const province = areaTree.find((item: any) => item.value === formData.value.engineeringParam.province)
        return province ? province.children : []
    }
    return []
})

const formDevTypeOptions = computed(() => {
    return devTypeOptions.value || [] //[devTypeOptions2.value]
})

// 电压等级选项，用于显示带单位的名称
const voltageLevelOptions = computed(() => {
    // 确保 voltageLevelArr.value 是数组
    if (!Array.isArray(voltageLevelArr)) {
        return []
    }

    return voltageLevelArr.map((item: any) => {
        return {
            ...item,
            name: `${item.value}kV` // 优先使用code字段，如果没有则构造带单位的名称
        }
    })
})

// 省改变时清空市的选择
const provinceChange = () => {
    formData.value.engineeringParam.city = ''
}
// 临时存储所有层级的数据
const tempAllLevelData = ref<any>({
    engineering: null,
    projects: [],
    devices: [],
    lines: []
})
const nodeDataList = ref()
const nodeEventList = ref()

const nodeClick = (e: anyObj, data: any) => {
    nodeDataList.value = data
    nodeEventList.value = e
    treeClickCount.value++
    if (treeClickCount.value > 2) return
    if (treeClickCount.value == 1) {
        if (pageStatus.value == 2 || pageStatus.value == 3) {
            if (pageStatus.value == 3 || pageStatus.value == 2) {
                ElMessage({
                    type: 'warning',
                    message: '请先提交,再做操作'
                })
            }
            return
        }
    }

    titleList.value = []
    getparentsNode(data)
    pageStatus.value = 1

    nodeData.value = e
    if (nodeData.value.level == -1) {
        nodeLevel.value = 0
    } else if (nodeData.value.level == 0) {
        nodeLevel.value = 1
    } else if (nodeData.value.level == 1) {
        //工程节点
        nodeLevel.value = 2
    } else if (nodeData.value.level == 2) {
        //项目
        nodeLevel.value = 3
    } else if (nodeData.value.level == 3) {
        //设备
        nodeLevel.value = 4
    } else if (nodeData.value.level == 4) {
        //监测点
        nodeLevel.value = 4
    }
    // 更新 nextfalg 状态
    nextfalg.value = nodeLevel.value >= 4
    // 根据节点层级清理不需要的数据
    cleanUnnecessaryData()
    /**不是根节点请求数据 */
    queryNodeContent()

    // 关键修改：确保tabs展开
    setTimeout(() => {
        // 设置默认选中的tab索引
        if (nodeLevel.value >= 2 && formData.value.projectInfoList.length > 0) {
            deviceIndex.value = '0'
        }
        if (nodeLevel.value >= 3 && formData.value.deviceInfoList.length > 0) {
            busBarIndex.value = '0'
        }
        if (nodeLevel.value >= 4 && formData.value.lineInfoList.length > 0) {
            lineIndex.value = '0'
        }
    }, 100)

    treeClickCount.value = 0
}

const countdown = ref(0)
const resultDialogVisible = ref(false)
const pushResult = ref<{
    success: boolean
    message: string
    logs: Array<{ message: string }>
} | null>(null)
const timer = ref<number | null>(null)

const handleDialogClose = () => {
    pushResult.value = null
    resultDialogVisible.value = false
    if (timer.value) {
        clearInterval(timer.value)
        timer.value = null
    }
    countdown.value = 0
}
const images: any = ref([])
const getImageList = async () => {
    getTopoTemplate().then(res => {
        images.value = res.data
        images.value.forEach(async item => {
            const blob = (await downLoadFile(item.filePath)) as unknown as Blob
            if (blob?.type && blob.type !== 'application/json') {
                item.url = window.URL.createObjectURL(blob)
            }
        })
    })
}
const onAdd = async () => {
    resultDialogVisible.value = true
    pushResult.value = null
    countdown.value = 0

    // 启动倒计时
    if (timer.value) clearInterval(timer.value)
    timer.value = window.setInterval(() => {
        countdown.value++
        if (countdown.value >= 5) {
            clearInterval(timer.value!)
            timer.value = null
        }
    }, 1000)

    try {
        // 调用推送日志接口
        const pushLogResponse = await pushLog()

        // 检查返回的data是否为"暂无需要推送的数据"
        if (pushLogResponse.data != '成功') {
            // 直接提示用户没有数据推送
            pushResult.value = {
                success: false,
                message: '暂无需要推送的数据',
                logs: [
                    {
                        message: '暂无需要推送的数据'
                    }
                ]
            }
            return
        }

        // 如果data不是"暂无需要推送的数据"，则继续执行
        if (pushLogResponse.data === '成功') {
            // 等待30秒
            await new Promise(resolve => setTimeout(resolve, 5000))

            // 30秒后调用查询推送结果接口
            const result = await queryPushResult()

            // 处理返回的日志数据
            const logs = Array.isArray(result.data) ? result.data : []

            // 根据结果进行处理
            pushResult.value = {
                success: true,
                message: '',
                logs: logs.map((item: any) => ({
                    message: item.message || JSON.stringify(item)
                }))
            }
        }
    } catch (error: any) {
        pushResult.value = {
            success: false,
            message: error.message || '指令下发过程中发生错误',
            logs: [
                {
                    message: error.message || '未知错误'
                }
            ]
        }
    } finally {
        if (timer.value) {
            clearInterval(timer.value)
            timer.value = null
        }
        countdown.value = 0
    }
}

/**
 * 根据当前节点层级清理不需要的数据
 */
const cleanUnnecessaryData = () => {
    // 根据当前节点层级清理不需要的数据
    switch (nodeLevel.value) {
        case 0: // 根节点
            // 清理所有数据
            formData.value.projectInfoList = []
            formData.value.deviceInfoList = []
            formData.value.lineInfoList = []
            break
        case 1: // 工程节点
            // 清理设备和监测点数据
            formData.value.deviceInfoList = []
            formData.value.lineInfoList = []
            break
        case 2: // 项目节点
            // 清理监测点数据
            formData.value.lineInfoList = []
            break
        case 3: // 设备节点
            // 不清理任何数据
            break
        case 4: // 监测点节点
            // 不清理任何数据
            break
    }

    // 重置tab索引
    if (nodeLevel.value < 2) {
        deviceIndex.value = '0'
    }
    if (nodeLevel.value < 3) {
        busBarIndex.value = '0'
    }
    if (nodeLevel.value < 4) {
        lineIndex.value = '0'
    }
}
const getparentsNode = (node: any) => {
    // 检查node是否存在以及是否有parent属性
    if (!node || !node.parent) {
        return
    }

    titleList.value.unshift(node.label)
    getparentsNode(node.parent) //调用递归
}

/**查询节点内容 */
const queryNodeContent = () => {
    if (nodeData.value.id == null) {
        return
    }

    if (nodeLevel.value == 1) {
        getEngineerById(nodeData.value.id)
    } else if (nodeLevel.value == 2) {
        getProjectById(nodeData.value.id)
    } else if (nodeLevel.value == 3) {
        getEquipmentById(nodeData.value.id)
    } else if (nodeLevel.value == 4) {
        getById(nodeData.value.id)
    }

    getInfoById(nodeData.value.id).then((res: any) => {
        connectionMethod.value = 'CLD'
        Object.assign(formData.value.engineeringParam, res.data)
        formData.value.engineeringParam.name = res.data.engineeringName
        formData.value.engineeringParam.description = res.data.engineeringDescription
        formData.value.engineeringParam.sort = res.data.sort
        formData.value.projectInfoList = res.data.projectInfoList || []

        if (nodeLevel.value >= 2) {
            formData.value.deviceInfoList = res.data.deviceInfoList || []
            connectionMethod.value = formData.value.deviceInfoList[0].devAccessMethod || 'CLD'

            positionKey.value = formData.value.deviceInfoList[0].devType

        }
        if (nodeLevel.value >= 3) {
            formData.value.lineInfoList = res.data.lineInfoList || []
            formData.value.lineInfoList.map((item: any) => {
                item.volGrade = item.volGrade + 'kV'
            })
        }
    })
}

// 新增
const add = () => {
    if (pageStatus.value == 2 || pageStatus.value == 3) {
        ElMessage({
            type: 'warning',
            message: '请先提交修改,再新增'
        })
        return
    }
    pageStatus.value = 2
    nodeLevelCopy.value = nodeLevel.value
    // 根据当前节点层级添加对应的tab页
    switch (nodeLevel.value) {
        case 0: // 新增工程，不需要添加tab
            // 初始化工程参数
            formData.value.engineeringParam.city = ''
            formData.value.engineeringParam.description = ''
            formData.value.engineeringParam.sort = 0
            formData.value.engineeringParam.name = ''
            formData.value.engineeringParam.province = ''
            // 清理其他层级数据
            formData.value.projectInfoList = []
            formData.value.deviceInfoList = []
            formData.value.lineInfoList = []
            break
        case 1: // 新增项目，添加一个新的项目tab
            // 添加一个新的空项目到projectInfoList
            formData.value.projectInfoList.push({
                name: '',
                area: '',
                description: '',
                sort: 0,
                topoId: ''
            })
            deviceIndex.value = (formData.value.projectInfoList.length - 1).toString()
            // 清理设备和监测点数据
            formData.value.deviceInfoList = []
            formData.value.lineInfoList = []
            break
        case 2: // 新增设备，添加一个新的设备tab
            // 添加一个新的空设备到deviceInfoList
            formData.value.deviceInfoList.push({
                name: '',
                devModel: '',
                devType: '',
                devAccessMethod: 'CLD',
                devLogLevel: 'WARN',
                mac: '',
                ndid: '',
                nodeId: '',
                cntractNo: '',
                sort: 0,
                nodeProcess: '',
                usageStatus: 1,
                icd: '',
                upgrade: 1
            })
            busBarIndex.value = (formData.value.deviceInfoList.length - 1).toString()
            // 清理监测点数据
            formData.value.lineInfoList = []
            break
        case 3: // 新增监测点，添加一个新的监测点tab
            // 添加一个新的空监测点到lineInfoList
            formData.value.lineInfoList.push({
                name: '',
                lineNo: '',
                conType: 0,
                lineInterval: 1,
                ptRatio: 1,
                pt2Ratio: 1,
                ctRatio: 1,
                ct2Ratio: 1,
                volGrade: '',
                monitorUser: '',
                devMac: '',
                monitorObj: '',
                position: '',
                govern: 0,
                lineLogLevel: 'WARN',
                isImportant: 0,
                runStatus: 0,
                basicCapacity: 0,
                shortCircuitCapacity: 0,
                devCapacity: 0,
                protocolCapacity: 0
            })
            lineIndex.value = (formData.value.lineInfoList.length - 1).toString()
            break
    }
}
// 修改
const update = () => {
    if (Object.keys(nodeData.value).length == 0) {
        ElMessage({
            type: 'warning',
            message: '没有选中节点'
        })
        return
    }
    // if (nodeData.value.level == 0) {
    //     ElMessage({
    //         type: 'warning',
    //         message: '不能修改根节点'
    //     })
    //     return
    // }
    if (pageStatus.value == 2 || pageStatus.value == 3) {
        if (pageStatus.value == 2) {
            ElMessage({
                type: 'warning',
                message: '请先新增完成在修改'
            })
        }
        return
    }

    pageStatus.value = 3

    // 使用 scrollTo 方法，并启用平滑滚动
    const scrollBox: any = document.getElementById('scrollBox')
    scrollBox.scrollTo({
        top: scrollBox.scrollHeight, // 滚动到内容的最底部
        behavior: 'smooth' // 启用平滑滚动动画
    })
}
/**
 * 修改工程
 */
const updateEngineering = (id: any) => {
    // 获取工程信息
    const engData = formData.value.engineeringParam

    // 构建工程修改数据结构
    const engineeringData = {
        id: id, // 工程ID用于修改
        city: engData.city,
        description: engData.description,
        sort: engData.sort,
        name: engData.name,
        province: engData.province
    }

    loading1.value = true
    auditEngineering(engineeringData).then((res: any) => {
        ElMessage({
            type: 'success',
            message: '修改工程成功'
        })
        pageStatus.value = 1
        TerminalRef.value.info()
    }).finally(() => {
        loading1.value = false
    })
}
/**
 * 修改项目
 */
const updateProjectFunc = (id: any) => {
    // 获取当前选中的项目信息
    const currentProject = formData.value.projectInfoList[deviceIndex.value]
    if (!currentProject) {
        ElMessage({
            type: 'error',
            message: '未找到项目信息'
        })
        return
    }

    loading1.value = true
    deleteProject(
        id,
        currentProject.name,
        currentProject.area,
        currentProject.description,
        1,
        currentProject.sort,
        currentProject.topoId
    ).then((res: any) => {
        ElMessage({
            type: 'success',
            message: '修改项目成功'
        })
        pageStatus.value = 1
        treedata()
    }).finally(() => {
        loading1.value = false
    })
}
/**
 * 修改设备
 */
const updateEquipmentFunc = (id: any) => {
    // 获取当前选中的设备信息
    const currentDevice = formData.value.deviceInfoList[busBarIndex.value]
    if (!currentDevice) {
        ElMessage({
            type: 'error',
            message: '未找到设备信息'
        })
        return
    }

    // 构建与新增设备相同的结构体
    const deviceData = {
        id: id, // 设备ID用于修改
        name: currentDevice.name,
        devModel: currentDevice.devModel,
        devType: currentDevice.devType,
        devAccessMethod: currentDevice.devAccessMethod,
        devLogLevel: currentDevice.devLogLevel,
        mac: currentDevice.mac,
        nodeId: currentDevice.nodeId,
        cntractNo: currentDevice.cntractNo,
        usageStatus: currentDevice.usageStatus,
        icd: currentDevice.icd,
        upgrade: currentDevice.upgrade,
        ndid: currentDevice.mac.replace(/:/g, ''),
        sort: currentDevice.sort
    }

    loading1.value = true
    updateEquipment(deviceData).then((res: any) => {
        ElMessage({
            type: 'success',
            message: '修改设备成功'
        })
        pageStatus.value = 1
        TerminalRef.value.info()
    }).finally(() => {
        loading1.value = false
    })
}

/**
 * 修改监测点
 */
const updateLineFunc = (id: any) => {
    // 获取当前选中的监测点信息
    const currentLine = formData.value.lineInfoList[lineIndex.value]
    if (!currentLine) {
        ElMessage({
            type: 'error',
            message: '未找到监测点信息'
        })
        return
    }

    // 处理电压等级，去除"kV"后缀
    let volGradeValue = currentLine.volGrade
    if (typeof volGradeValue === 'string' && volGradeValue.endsWith('kV')) {
        volGradeValue = volGradeValue.slice(0, -2)
    }

    // 获取设备MAC地址和设备ID
    let devMac = ''
    let devId = ''
    if (formData.value.deviceInfoList && formData.value.deviceInfoList[busBarIndex.value]) {
        devMac = formData.value.deviceInfoList[busBarIndex.value].mac || ''
        // 如果有设备ID，也获取它
        if (formData.value.deviceInfoList[busBarIndex.value].id) {
            devId = formData.value.deviceInfoList[busBarIndex.value].id || ''
        }
    }

    // 构建与新增监测点相同的结构体
    const lineData = {
        lineId: id,
        name: currentLine.name || '',
        lineNo: currentLine.lineNo,
        conType: currentLine.conType || 0,
        lineInterval: currentLine.lineInterval || 1,
        ptRatio: currentLine.ptRatio || 1,
        pt2Ratio: currentLine.pt2Ratio || 1,
        ctRatio: currentLine.ctRatio || 1,
        ct2Ratio: currentLine.ct2Ratio || 1,
        monitorUser: currentLine.monitorUser || '',
        monitorObj: currentLine.monitorObj || '',
        position: currentLine.position || '',
        govern: currentLine.govern,
        lineLogLevel: currentLine.lineLogLevel,
        isImportant: currentLine.isImportant,
        runStatus: currentLine.runStatus,
        basicCapacity: currentLine.basicCapacity || 0,
        shortCircuitCapacity: currentLine.shortCircuitCapacity || 0,
        devCapacity: currentLine.devCapacity || 0,
        protocolCapacity: currentLine.protocolCapacity || 0,
        volGrade: volGradeValue || 0,
        devMac: devMac,
        devId: devId
    }

    loading1.value = true
    updateLine(lineData).then((res: any) => {
        ElMessage({
            type: 'success',
            message: '修改监测点成功'
        })
        pageStatus.value = 1
        treedata()
    }).finally(() => {
        loading1.value = false
    })
}
const loading2 = ref(false)
// 删除
const remove = () => {
    if (Object.keys(nodeData.value).length == 0) {
        ElMessage({
            type: 'warning',
            message: '没有选中节点'
        })
        return
    }
    // if (nodeData.value.level == 0) {
    //     ElMessage({
    //         type: 'error',
    //         message: '无法删除根节点'
    //     })
    //     return
    // }
    if (nodeData.value.id == null) {
        ElMessage.warning('无法删除该节点')
        return
    }
    ElMessageBox.confirm('此操作将永久删除, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    })
        .then(() => {
            loading2.value = true
            switch (nodeData.value.level) {
                case 0:
                    let data = {
                        id: nodeData.value.id,
                        status: '0'
                    }
                    auditEngineering(data).then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        reaseStatus()
                        // 删除工程后选中根节点
                        setTimeout(() => {
                            treedata()
                        }, 100)
                    }).finally(() => {
                        loading2.value = false
                    })

                    break
                case 1: // 项目层级
                    // 删除项目后选中工程节点
                    const engineeringId = nodeData.value.pids ? nodeData.value.pids.split(',')[1] : null
                    deleteProject(nodeData.value.id, '', '', '', 0, '', '').then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        reaseStatus()

                        if (engineeringId) {
                            setTimeout(() => {
                                treedata(engineeringId)
                            }, 100)
                        } else {
                            treedata()
                        }
                    }).finally(() => {
                        loading2.value = false
                    })

                    break
                case 2: // 设备层级
                    // 删除设备后选中项目节点
                    const projectId = nodeData.value.pids ? nodeData.value.pids.split(',')[2] : null
                    deleteEquipment(nodeData.value.id).then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        reaseStatus()

                        if (projectId) {
                            setTimeout(() => {
                                treedata(projectId)
                            }, 100)
                        } else {
                            treedata()
                        }
                    }).finally(() => {
                        loading2.value = false
                    })

                    break
                case 3: // 监测点层级
                    const deviceId = nodeData.value.pids ? nodeData.value.pids.split(',')[3] : null

                    deleteLine(nodeData.value.id).then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        reaseStatus()
                        // 删除监测点后选中设备节点
                        if (deviceId) {
                            setTimeout(() => {
                                treedata(deviceId)
                            }, 100)
                        } else {
                            treedata()
                        }
                    }).finally(() => {
                        loading2.value = false
                    })

                    break
            }
        })
        .catch(() => {
            ElMessage({
                type: 'info',
                message: '已取消删除'
            })
        })
}
// 下一步
const getEngineeringProps = () => [
    'engineeringParam.name',
    'engineeringParam.province',
    'engineeringParam.city',
    'engineeringParam.sort'
]

const getProjectProps = (index: string | number) => [
    `projectInfoList[${index}].name`,
    `projectInfoList[${index}].area`,
    `projectInfoList[${index}].description`,
    `projectInfoList[${index}].topoId`,
    `projectInfoList[${index}].sort`
]

const getDeviceProps = (index: string | number) => {
    const prefix = `deviceInfoList[${index}]`
    const props = [
        `${prefix}.name`,
        `${prefix}.devType`,
        `${prefix}.devModel`,
        `${prefix}.devAccessMethod`,
        `${prefix}.mac`,
        `${prefix}.sort`
    ]
    if (pageStatus.value === 2 && nodeLevel.value === 2) {
        props.push(`${prefix}.nodeId`)
    }
    return props
}

const getLineProps = (index: string | number) => {
    const prefix = `lineInfoList[${index}]`
    const props = [
        `${prefix}.name`,
        `${prefix}.conType`,
        `${prefix}.volGrade`,
        `${prefix}.ptRatio`,
        `${prefix}.ctRatio`,
        `${prefix}.lineInterval`,
        `${prefix}.basicCapacity`,
        `${prefix}.shortCircuitCapacity`,
        `${prefix}.devCapacity`,
        `${prefix}.protocolCapacity`,
        `${prefix}.runStatus`
    ]
    if (connectionMethod.value !== 'MQTT') {
        props.push(`${prefix}.lineNo`, `${prefix}.lineLogLevel`, `${prefix}.isImportant`)
    }
    return props
}

/** 仅校验当前激活 tab 对应表单字段 */
const getActiveFormProps = (): string[] => {
    const level = nodeLevel.value

    if (pageStatus.value === 2) {
        if (level === 0) return getEngineeringProps()
        if (level === 1) return getProjectProps(deviceIndex.value)
        if (level === 2) return getDeviceProps(busBarIndex.value)
        if (level >= 3) return getLineProps(lineIndex.value)
    }

    if (pageStatus.value === 3) {
        if (level === 1) return getEngineeringProps()
        if (level === 2) return getProjectProps(deviceIndex.value)
        if (level === 3) return getDeviceProps(busBarIndex.value)
        if (level === 4) return getLineProps(lineIndex.value)
    }

    return []
}

const validateActiveTabForm = (): Promise<boolean> => {
    const props = getActiveFormProps()
    if (!props.length || !mainForm.value) return Promise.resolve(true)
    return new Promise(resolve => {
        mainForm.value.validateField(props, (valid: boolean) => {
            resolve(valid)
        })
    })
}

const next = async () => {
    await mainForm.value.validate((valid: any) => {
        if (valid) {
            // 在新增模式下（pageStatus == 2）保存当前数据并创建下一个层级的Tab
            switch (nodeLevel.value) {
                case 0: // 工程层级，下一步创建项目Tab
                    // 保存当前工程信息到临时存储
                    tempAllLevelData.value.engineering = { ...formData.value.engineeringParam }

                    // 创建新的项目Tab
                    formData.value.projectInfoList.push({
                        name: '',
                        area: '',
                        description: '',
                        sort: 0,
                        topoId: ''
                    })
                    deviceIndex.value = (formData.value.projectInfoList.length - 1).toString()
                    nextfalg.value = false
                    nodeLevel.value = 1
                    break
                case 1: // 项目层级，下一步创建设备Tab
                    // 保存当前项目信息到临时存储
                    const currentProject = { ...formData.value.projectInfoList[deviceIndex.value] }
                    tempAllLevelData.value.projects[deviceIndex.value] = currentProject

                    // 创建新的设备Tab
                    formData.value.deviceInfoList.push({
                        name: '',
                        devModel: '',
                        devType: '',
                        devAccessMethod: 'CLD',
                        devLogLevel: 'WARN',
                        mac: '',
                        ndid: '',
                        nodeId: '',
                        cntractNo: '',
                        sort: 0,
                        nodeProcess: '',
                        usageStatus: 1,
                        icd: '',
                        upgrade: 1
                    })
                    busBarIndex.value = (formData.value.deviceInfoList.length - 1).toString()
                    nextfalg.value = false
                    nodeLevel.value = 2
                    break
                case 2: // 设备层级，下一步创建监测点Tab
                    // 保存当前设备信息到临时存储
                    const currentDevice = { ...formData.value.deviceInfoList[busBarIndex.value] }
                    tempAllLevelData.value.devices[busBarIndex.value] = currentDevice

                    // 创建新的监测点Tab
                    formData.value.lineInfoList.push({
                        name: '',
                        lineNo: '',
                        conType: 0,
                        lineInterval: 1,
                        ptRatio: 1,
                        pt2Ratio: 1,
                        ctRatio: 1,
                        ct2Ratio: 1,
                        volGrade: '',
                        monitorUser: '',
                        devMac: '',
                        monitorObj: '',
                        position: '',
                        govern: 0,
                        lineLogLevel: 'WARN',
                        isImportant: 0,
                        runStatus: 0,
                        basicCapacity: 0,
                        shortCircuitCapacity: 0,
                        devCapacity: 0,
                        protocolCapacity: 0
                    })
                    lineIndex.value = (formData.value.lineInfoList.length - 1).toString()
                    nextfalg.value = true
                    nodeLevel.value = 3
                    break
                case 3: // 监测点层级
                    // 保存当前监测点信息到临时存储
                    const currentLine = { ...formData.value.lineInfoList[lineIndex.value] }
                    tempAllLevelData.value.lines[lineIndex.value] = currentLine

                    nextfalg.value = true
                    nodeLevel.value = 4
                    break
            }
        }
    })
}
const devTypeChange = (e: any) => {

    positionKey.value = e
}

// 撤销
const black = () => {
    pageStatus.value = 1
    busBarIndex.value = '0'
    deviceIndex.value = '0'
    lineIndex.value = '0'

    // 清空临时数据
    tempAllLevelData.value = {
        engineering: null,
        projects: [],
        devices: [],
        lines: []
    }

    nodeClick(nodeEventList.value, nodeDataList.value)
}

// 确认提交
const onsubmit = async () => {
    const valid = await validateActiveTabForm()
    if (!valid) {
        ElMessage.warning('请检查表单数据是否填写完整!')
        return
    }

    if (pageStatus.value == 2) {
        // 新增
        // 检查是否是多层级新增还是单层级新增
        if (
            tempAllLevelData.value.engineering !== null ||
            tempAllLevelData.value.projects.length > 0 ||
            tempAllLevelData.value.devices.length > 0 ||
            tempAllLevelData.value.lines.length > 0
        ) {
            // 多层级新增，一次性提交所有数据
            submitAllLevelData()
        } else {
            // 单层级新增，使用原有的提交方式
            submitData()
        }
    } else if (pageStatus.value == 3) {
        // 修改
        switch (nodeLevel.value) {
            case 1: // 修改工程
                updateEngineering(nodeData.value.id)
                break
            case 2: // 修改项目
                updateProjectFunc(nodeData.value.id)
                break
            case 3: // 修改设备
                updateEquipmentFunc(nodeData.value.id)
                break
            case 4: // 修改监测点
                updateLineFunc(nodeData.value.id)
                break
        }
    }
}

/**
 * 一次性提交所有层级数据
 */
const submitAllLevelData = async () => {
    const valid = await validateActiveTabForm()
    if (!valid) {
        ElMessage.warning('请检查表单数据是否填写完整!')
        return
    }

    let submitData: any = {}
    // 根据当前节点层级构建相应的数据结构
    switch (nodeLevel.value) {
        case 0: // 只有工程
            submitData = {
                engineering: tempAllLevelData.value.engineering || { ...formData.value.engineeringParam }
            }
            break

        case 1: // 工程 + 项目
            // 工程信息
            const engineeringData = tempAllLevelData.value.engineering || { ...formData.value.engineeringParam }

            // 项目信息
            const projectData: any =
                tempAllLevelData.value.projects.length > 0
                    ? tempAllLevelData.value.projects.find(project => project !== undefined) || {}
                    : formData.value.projectInfoList[0] || {}
            // 如果是从根节点开始新增工程和项目
            if (nodeData.value.level === -1) {
                submitData = {
                    engineering: engineeringData,
                    project: { ...projectData, topoIds: [projectData.topoId] }
                }
            } else {
                // 如果是从工程节点开始新增项目
                submitData = {
                    engineeringIndex: nodeData.value?.id || '',
                    project: { ...projectData, topoIds: [projectData.topoId] }
                }
            }
            break

        case 2: // 工程 + 项目 + 设备
            // 工程信息
            const engineeringData2 = tempAllLevelData.value.engineering || {
                ...formData.value.engineeringParam
            }
            // 项目信息
            const projectData2 =
                tempAllLevelData.value.projects.length > 0
                    ? tempAllLevelData.value.projects.find(project => project !== undefined) || {}
                    : formData.value.projectInfoList[0] || {}

            // 设备信息
            let devices = []
            if (tempAllLevelData.value.devices.length > 0) {
                devices = tempAllLevelData.value.devices.filter((d: any) => d && d.name)
            } else {
                devices = formData.value.deviceInfoList.filter((d: any) => d && d.name)
            }

            // 如果是从根节点开始新增
            if (nodeData.value.level === -1) {
                submitData = {
                    engineering: engineeringData2,
                    project: { ...projectData2, topoIds: [projectData2.topoId] },
                    device: devices.map((device: any) => ({
                        ...device,
                        ndid: device.mac ? device.mac.replace(/:/g, '') : ''
                    }))
                }
            }
            // 如果是从工程节点开始新增
            else if (nodeData.value.level === 0) {
                submitData = {
                    engineeringIndex: nodeData.value?.id || '',
                    project: { ...projectData2, topoIds: [projectData2.topoId] },
                    device: devices.map((device: any) => ({
                        ...device,
                        ndid: device.mac ? device.mac.replace(/:/g, '') : ''
                    }))
                }
            }
            // 如果是从项目节点开始新增
            else if (nodeData.value.level === 1) {
                const pidsArray = nodeData.value?.pids ? nodeData.value.pids.split(',') : []
                const engineeringId = pidsArray.length >= 2 ? pidsArray[1] : ''

                submitData = {
                    projectIndex: nodeData.value?.id || '',
                    engineeringIndex: engineeringId,
                    device: devices.map((device: any) => ({
                        ...device,
                        ndid: device.mac ? device.mac.replace(/:/g, '') : ''
                    }))
                }
            }
            break

        // case 3: // 工程 + 项目 + 设备 + 监测点
        case 3:
            // 工程信息
            const engineeringData3 = tempAllLevelData.value.engineering || {
                ...formData.value.engineeringParam
            }

            // 项目信息
            const projectData3 =
                tempAllLevelData.value.projects.length > 0
                    ? tempAllLevelData.value.projects.find(project => project !== undefined) || {}
                    : formData.value.projectInfoList[0] || {}

            // 设备信息
            let devices2: any[] = []
            if (tempAllLevelData.value.devices.length > 0) {
                devices2 = tempAllLevelData.value.devices.filter((d: any) => d && d.name)
            } else {
                devices2 = formData.value.deviceInfoList.filter((d: any) => d && d.name)
            }

            // 监测点信息
            let lines = []
            if (tempAllLevelData.value.lines.length > 0) {
                lines = tempAllLevelData.value.lines.filter((l: any) => l && l.name)
            } else {
                lines = formData.value.lineInfoList.filter((l: any) => l && l.name)
            }

            // 如果是从根节点开始新增
            if (nodeData.value.level === -1) {
                submitData = {
                    engineering: engineeringData3,
                    project: { ...projectData3, topoIds: [projectData3.topoId] },
                    device: devices2.map((device: any) => ({
                        ...device,
                        ndid: device.mac ? device.mac.replace(/:/g, '') : ''
                    })),
                    line: lines.map((line: any) => {
                        // 处理电压等级，去除"kV"后缀
                        let volGradeValue = line.volGrade
                        if (typeof volGradeValue === 'string' && volGradeValue.endsWith('kV')) {
                            volGradeValue = volGradeValue.slice(0, -2)
                        }

                        // 获取设备MAC地址
                        let devMac = ''
                        if (devices2.length > 0) {
                            devMac = devices2[0].mac || ''
                        }

                        return {
                            ...line,
                            volGrade: volGradeValue,
                            devMac: devMac
                        }
                    })
                }
            }
            // 如果是从工程节点开始新增
            else if (nodeData.value.level === 0) {
                submitData = {
                    engineeringIndex: nodeData.value?.id || '',
                    project: projectData3,
                    device: devices2.map((device: any) => ({
                        ...device,
                        ndid: device.mac ? device.mac.replace(/:/g, '') : ''
                    })),
                    line: lines.map((line: any) => {
                        // 处理电压等级，去除"kV"后缀
                        let volGradeValue = line.volGrade
                        if (typeof volGradeValue === 'string' && volGradeValue.endsWith('kV')) {
                            volGradeValue = volGradeValue.slice(0, -2)
                        }

                        // 获取设备MAC地址
                        let devMac = ''
                        if (devices2.length > 0) {
                            devMac = devices2[0].mac || ''
                        }

                        return {
                            ...line,
                            volGrade: volGradeValue,
                            devMac: devMac
                        }
                    })
                }
            }
            // 如果是从项目节点开始新增
            else if (nodeData.value.level === 1) {
                const pidsArray = nodeData.value?.pids ? nodeData.value.pids.split(',') : []
                const engineeringId = pidsArray.length >= 2 ? pidsArray[1] : ''

                submitData = {
                    device: devices2.map((device: any) => ({
                        ...device,
                        ndid: device.mac ? device.mac.replace(/:/g, '') : ''
                    })),
                    projectIndex: nodeData.value?.id || '',
                    engineeringIndex: engineeringId,
                    line: lines.map((line: any) => {
                        // 处理电压等级，去除"kV"后缀
                        let volGradeValue = line.volGrade
                        if (typeof volGradeValue === 'string' && volGradeValue.endsWith('kV')) {
                            volGradeValue = volGradeValue.slice(0, -2)
                        }

                        // 获取设备MAC地址
                        let devMac = ''
                        if (devices2.length > 0) {
                            devMac = devices2[0].mac || ''
                        }

                        return {
                            ...line,
                            volGrade: volGradeValue,
                            devMac: devMac
                        }
                    })
                }
            }
            // 如果是从设备节点开始新增
            else if (nodeData.value.level === 2) {
                const pidsArray2 = nodeData.value?.pids ? nodeData.value.pids.split(',') : []
                const engineeringId2 = pidsArray2.length >= 2 ? pidsArray2[1] : ''
                const projectId = pidsArray2.length >= 3 ? pidsArray2[2] : ''

                submitData = {
                    devIndex: nodeData.value?.id || '',
                    projectIndex: projectId,
                    engineeringIndex: engineeringId2,
                    line: lines.map((line: any) => {
                        // 处理电压等级，去除"kV"后缀
                        let volGradeValue = line.volGrade
                        if (typeof volGradeValue === 'string' && volGradeValue.endsWith('kV')) {
                            volGradeValue = volGradeValue.slice(0, -2)
                        }

                        // 获取设备MAC地址
                        let devMac = ''
                        if (devices2.length > 0) {
                            devMac = devices2[0].mac || ''
                        }

                        return {
                            ...line,
                            volGrade: volGradeValue,
                            devMac: devMac
                        }
                    })
                }
            }
            break
    }

    // 发送请求
    addLedger(submitData).then((res: any) => {
        ElMessage({
            type: 'success',
            message: '数据提交成功'
        })
        pageStatus.value = 1
        // 清空所有表单
        resetAllForms()
        // 刷新树并选中合适的节点
        TerminalRef.value.info()
        // 等待树更新完成后，根据之前点击的节点层级选中合适的节点
        setTimeout(() => {
            let nodeIdToSelect: string | null | undefined = null

            // 根据新增的层级选择要选中的节点
            switch (nodeLevel.value) {
                case 0: // 新增了工程，选中根节点
                    nodeIdToSelect = null // 根节点
                    break
                case 1: // 新增了项目，选中工程节点
                    nodeIdToSelect = nodeData.value.id // 工程节点
                    break
                case 2: // 新增了设备，选中项目节点
                    nodeIdToSelect = nodeData.value.id // 项目节点
                    break
                case 3: // 新增了监测点，选中设备节点
                case 4:
                    nodeIdToSelect = nodeData.value.id // 设备节点
                    break
            }

            if (nodeIdToSelect) {
                setTimeout(() => {
                    treedata(nodeIdToSelect !== null ? nodeIdToSelect : undefined)
                    // 重新加载节点内容以显示最新数据
                    setTimeout(() => {
                        queryNodeContent()
                    }, 200)
                }, 100)
            } else {
                treedata() // 选中根节点
            }
        }, 100)
    })
}
/**
 * 重置所有表单
 */
const resetAllForms = () => {
    // 清空工程表单
    formData.value.engineeringParam.city = ''
    formData.value.engineeringParam.description = ''
    formData.value.engineeringParam.sort = 0
    formData.value.engineeringParam.name = ''
    formData.value.engineeringParam.province = ''

    // 清空项目表单
    formData.value.projectInfoList.forEach(project => {
        project.name = ''
        project.area = ''
        project.description = ''
            ; (project.sort = 0), (project.topoId = '')
    })

    // 清空设备表单
    formData.value.deviceInfoList.forEach(device => {
        device.name = ''
        device.devModel = ''
        device.devType = ''
        device.devAccessMethod = 'CLD'
        device.devLogLevel = 'WARN'

        device.mac = ''
        device.nodeId = ''
        device.cntractNo = ''
        device.usageStatus = 1
        device.icd = ''
        device.upgrade = 1
        device.sort = 0
    })

    // 清空监测点表单
    formData.value.lineInfoList.forEach(line => {
        line.name = ''
        line.lineNo = ''
        line.conType = 0
        line.lineInterval = 1
        line.ptRatio = 1
        line.pt2Ratio = 1
        line.ctRatio = 1
        line.ct2Ratio = 1
        line.volGrade = ''
        line.monitorUser = ''
        line.monitorObj = ''
        line.position = ''
        line.govern = 0
        line.lineLogLevel = 'WARN'
        line.isImportant = 0
        line.runStatus = 0
        line.basicCapacity = 0
        line.shortCircuitCapacity = 0
        line.devCapacity = 0
        line.protocolCapacity = 0
    })

    // 清空临时数据
    tempAllLevelData.value = {
        engineering: null,
        projects: [],
        devices: [],
        lines: []
    }
}

/**
 * 提交数据
 */
const submitData = () => {
    switch (nodeLevel.value) {
        case 0: // 新增工程
            const engineering = {
                engineering: {
                    city: formData.value.engineeringParam.city,
                    description: formData.value.engineeringParam.description,
                    sort: formData.value.engineeringParam.sort,
                    name: formData.value.engineeringParam.name,
                    province: formData.value.engineeringParam.province
                }
            }

            addLedger(engineering).then((res: any) => {
                ElMessage({
                    type: 'success',
                    message: '新增工程成功'
                })
                pageStatus.value = 1
                // 刷新树并选中根节点
                setTimeout(() => {
                    treedata() // 选中根节点
                }, 100)
            })
            break
        case 1: // 新增项目
            const project = {
                engineeringIndex: nodeData.value?.id || '',
                project: {
                    area: formData.value.projectInfoList[deviceIndex.value]?.area || '',
                    description: formData.value.projectInfoList[deviceIndex.value]?.description || '',
                    topoIds: [formData.value.projectInfoList[deviceIndex.value]?.topoId] || [],
                    sort: formData.value.projectInfoList[deviceIndex.value]?.sort || 0,
                    name: formData.value.projectInfoList[deviceIndex.value]?.name || '',
                    engineeringId: nodeData.value?.id || ''
                }
            }

            loading1.value = true
            addLedger(project).then((res: any) => {
                loading1.value = false
                ElMessage({
                    type: 'success',
                    message: '新增项目成功'
                })
                pageStatus.value = 1
                // 刷新树并选中工程节点（而不是新增的项目节点）
                const engineeringId = nodeData.value?.id // 工程ID
                if (engineeringId) {
                    setTimeout(() => {
                        treedata(engineeringId) // 选中工程节点
                        // 重新加载节点内容以显示最新数据
                        setTimeout(() => {
                            queryNodeContent()
                        }, 200)
                    }, 100)
                } else {
                    TerminalRef.value.info()
                }
            }).finally(() => {
                loading1.value = false
            })
            break
        case 2: // 新增设备
            // 获取当前选中的设备信息
            const currentDevice = formData.value.deviceInfoList[busBarIndex.value]
            if (!currentDevice) {
                ElMessage({
                    type: 'error',
                    message: '未找到设备信息'
                })
                return
            }

            const pidsArray = nodeData.value?.pids ? nodeData.value.pids.split(',') : []
            const engineeringId = pidsArray.length >= 2 ? pidsArray[1] : ''

            const deviceData = {
                projectIndex: nodeData.value?.id || '',
                engineeringIndex: engineeringId,
                device: [
                    {
                        name: currentDevice.name,
                        devModel: currentDevice.devModel,
                        devType: currentDevice.devType,
                        devAccessMethod: currentDevice.devAccessMethod,
                        devLogLevel: currentDevice.devLogLevel,
                        mac: currentDevice.mac,
                        nodeId: currentDevice.nodeId,
                        cntractNo: currentDevice.cntractNo,
                        usageStatus: currentDevice.usageStatus,
                        icd: currentDevice.icd,
                        upgrade: currentDevice.upgrade,
                        ndid: currentDevice.mac.replace(/:/g, ''),
                        sort: currentDevice.sort
                    }
                ]
            }

            loading1.value = true
            addLedger(deviceData).then((res: any) => {
                loading1.value = false
                ElMessage({
                    type: 'success',
                    message: '新增设备成功'
                })
                pageStatus.value = 1
                // 刷新树并选中项目节点（而不是新增的设备节点）
                const projectId = nodeData.value?.id // 项目ID
                if (projectId) {
                    setTimeout(() => {
                        treedata(projectId) // 选中项目节点
                        // 重新加载节点内容以显示最新数据
                        setTimeout(() => {
                            queryNodeContent()
                        }, 200)
                    }, 100)
                } else {
                    TerminalRef.value.info()
                }
            }).finally(() => {
                loading1.value = false
            })
            break
        case 3: // 新增监测点
            // 获取当前选中的监测点信息
            const currentLine = formData.value.lineInfoList[lineIndex.value]
            if (!currentLine) {
                ElMessage({
                    type: 'error',
                    message: '未找到监测点信息'
                })
                return
            }

            // 处理电压等级，去除"kV"后缀
            let volGradeValue = currentLine.volGrade
            if (typeof volGradeValue === 'string' && volGradeValue.endsWith('kV')) {
                volGradeValue = volGradeValue.slice(0, -2)
            }

            // 从pids中提取工程ID和项目ID
            const pidsArray2 = nodeData.value?.pids ? nodeData.value.pids.split(',') : []
            const engineeringId2 = pidsArray2.length >= 2 ? pidsArray2[1] : ''
            const projectId2 = pidsArray2.length >= 3 ? pidsArray2[2] : ''

            const lineData = {
                devIndex: nodeData.value?.id || '',
                projectIndex: projectId2, // 从pids中提取的项目ID
                engineeringIndex: engineeringId2, // 从pids中提取的工程ID
                line: [
                    {
                        name: currentLine.name,
                        lineNo: currentLine.lineNo,
                        conType: currentLine.conType,
                        lineInterval: currentLine.lineInterval,
                        ptRatio: currentLine.ptRatio,
                        pt2Ratio: currentLine.pt2Ratio,
                        ctRatio: currentLine.ctRatio,
                        ct2Ratio: currentLine.ct2Ratio,
                        monitorUser: currentLine.monitorUser,
                        monitorObj: currentLine.monitorObj,
                        position: currentLine.position,
                        govern: currentLine.govern,
                        lineLogLevel: currentLine.lineLogLevel,
                        isImportant: currentLine.isImportant,
                        runStatus: currentLine.runStatus,
                        basicCapacity: currentLine.basicCapacity,
                        shortCircuitCapacity: currentLine.shortCircuitCapacity,
                        devCapacity: currentLine.devCapacity,
                        protocolCapacity: currentLine.protocolCapacity,
                        volGrade: volGradeValue,
                        devMac: formData.value.deviceInfoList[busBarIndex.value].mac
                    }
                ]
            }

            loading1.value = true
            addLedger(lineData).then((res: any) => {
                loading1.value = false
                ElMessage({
                    type: 'success',
                    message: '新增监测点成功'
                })
                pageStatus.value = 1
                // 刷新树并选中设备节点（而不是新增的监测点节点）
                const deviceId = nodeData.value?.id // 设备ID
                if (deviceId) {
                    setTimeout(() => {
                        treedata(deviceId) // 选中设备节点
                        // 重新加载节点内容以显示最新数据
                        setTimeout(() => {
                            queryNodeContent()
                        }, 200)
                    }, 100)
                } else {
                    TerminalRef.value.info()
                }
            }).finally(() => {
                loading1.value = false
            })
            break
    }
}

/**
 * 项目tab编辑（新增/删除）
 */
const handleDeviceTabsEdit = (targetName: any, action: any) => {
    if (action === 'add') {
        // 新增项目
        formData.value.projectInfoList.push({
            name: '',
            area: '',
            description: '',
            sort: 0,
            topoId: ''
        })
        deviceIndex.value = (formData.value.projectInfoList.length - 1).toString()
    } else if (action === 'remove') {
        // 删除项目
        ElMessageBox.confirm('此操作将永久删除, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        })
            .then(() => {
                // 删除项目
                if (formData.value.projectInfoList[deviceIndex.value]?.id) {
                    deleteProject(
                        formData.value.projectInfoList[deviceIndex.value].id,
                        formData.value.projectInfoList[deviceIndex.value].name,
                        formData.value.projectInfoList[deviceIndex.value].area,
                        formData.value.projectInfoList[deviceIndex.value].description,
                        0, // 0表示删除
                        formData.value.projectInfoList[deviceIndex.value].sort,
                        formData.value.projectInfoList[deviceIndex.value].topoId
                    ).then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        // 从列表中移除
                        formData.value.projectInfoList.splice(deviceIndex.value, 1)
                        // 重新设置当前选中的tab
                        deviceIndex.value = formData.value.projectInfoList.length
                            ? (formData.value.projectInfoList.length - 1).toString()
                            : '0'
                        // 重置相关索引
                        busBarIndex.value = '0'
                        lineIndex.value = '0'
                        pageStatus.value = 1
                        treedata()
                    })
                } else {
                    // 如果是新增模式下删除未保存的项目
                    formData.value.projectInfoList.splice(deviceIndex.value, 1)
                    deviceIndex.value = formData.value.projectInfoList.length
                        ? (formData.value.projectInfoList.length - 1).toString()
                        : '0'
                    busBarIndex.value = '0'
                    lineIndex.value = '0'
                    ElMessage({
                        type: 'success',
                        message: '删除成功'
                    })
                }
            })
            .catch(() => {
                ElMessage({
                    type: 'info',
                    message: '已取消删除'
                })
            })
    }
}

/**
 * 设备tab编辑（新增/删除）
 */
const handleBusBarTabsEdit = (targetName: any, action: any) => {
    if (action === 'add') {
        // 新增设备
        formData.value.deviceInfoList.push({
            name: '',
            devModel: '',
            devType: '',
            devAccessMethod: 'CLD',
            devLogLevel: 'WARN',
            mac: '',
            ndid: '',
            nodeId: '',
            cntractNo: '',
            sort: 0,
            nodeProcess: '',
            usageStatus: 1,
            icd: '',
            upgrade: 1
        })
        busBarIndex.value = (formData.value.deviceInfoList.length - 1).toString()
    } else if (action === 'remove') {
        // 删除设备
        ElMessageBox.confirm('此操作将永久删除, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        })
            .then(() => {
                // 如果是编辑现有设备
                if (formData.value.deviceInfoList[busBarIndex.value]?.id) {
                    deleteEquipment(formData.value.deviceInfoList[busBarIndex.value].id).then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        // 从列表中移除
                        formData.value.deviceInfoList.splice(busBarIndex.value, 1)
                        // 重新设置当前选中的tab
                        busBarIndex.value = formData.value.deviceInfoList.length
                            ? (formData.value.deviceInfoList.length - 1).toString()
                            : '0'
                        lineIndex.value = '0'
                        pageStatus.value = 1
                        treedata()
                    })
                } else {
                    // 如果是新增模式下删除未保存的设备
                    formData.value.deviceInfoList.splice(busBarIndex.value, 1)
                    busBarIndex.value = formData.value.deviceInfoList.length
                        ? (formData.value.deviceInfoList.length - 1).toString()
                        : '0'
                    lineIndex.value = '0'
                    ElMessage({
                        type: 'success',
                        message: '删除成功'
                    })
                }
            })
            .catch(() => {
                ElMessage({
                    type: 'info',
                    message: '已取消删除'
                })
            })
    }
}

/**
 * 监测点tab编辑（新增/删除）
 */
const handleLineTabsEdit = (targetName: any, action: any) => {
    if (action === 'add') {
        // 新增监测点
        formData.value.lineInfoList.push({
            name: '',
            lineNo: '',
            conType: 0,
            lineInterval: 1,
            ptRatio: 1,
            pt2Ratio: 1,
            ctRatio: 1,
            ct2Ratio: 1,
            volGrade: '',
            devMac: '',
            monitorUser: '',
            monitorObj: '',
            position: '',
            govern: 0,
            lineLogLevel: 'WARN',
            isImportant: 0,
            runStatus: 0,
            basicCapacity: 0,
            shortCircuitCapacity: 0,
            devCapacity: 0,
            protocolCapacity: 0
        })
        lineIndex.value = (formData.value.lineInfoList.length - 1).toString()
    } else if (action === 'remove') {
        // 删除监测点
        ElMessageBox.confirm('此操作将永久删除, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        })
            .then(() => {
                // 如果是编辑现有监测点
                if (formData.value.lineInfoList[lineIndex.value]?.lineId) {
                    deleteLine(formData.value.lineInfoList[lineIndex.value].lineId).then((res: any) => {
                        ElMessage({
                            type: 'success',
                            message: res.message
                        })
                        // 从列表中移除
                        formData.value.lineInfoList.splice(lineIndex.value, 1)
                        // 重新设置当前选中的tab
                        lineIndex.value = formData.value.lineInfoList.length
                            ? (formData.value.lineInfoList.length - 1).toString()
                            : '0'
                        pageStatus.value = 1
                        treedata()
                    })
                } else {
                    // 如果是新增模式下删除未保存的监测点
                    formData.value.lineInfoList.splice(lineIndex.value, 1)
                    lineIndex.value = formData.value.lineInfoList.length
                        ? (formData.value.lineInfoList.length - 1).toString()
                        : '0'
                    ElMessage({
                        type: 'success',
                        message: '删除成功'
                    })
                }
            })
            .catch(() => {
                ElMessage({
                    type: 'info',
                    message: '已取消删除'
                })
            })
    }
}

const tabChange = (type: string, e: any) => {
    if (type == 'deviceIndex') {
        busBarIndex.value = '0'
        lineIndex.value = '0'
    } else if (type == 'busBarIndex') {
        lineIndex.value = '0'
        connectionMethod.value = formData.value.deviceInfoList[e.index].devAccessMethod
        positionKey.value = formData.value.deviceInfoList[e.index].devType
    }
}
// 电压等级变化
const volGradeChange = (e, row) => {
    let capacity = 10
    switch (e) {
        case '500':
            capacity = 4500
            break
        case '330':
            capacity = 3000
            break
        case '220':
            capacity = 2000
            break
        case '110':
            capacity = 750
            break
        case '35':
            capacity = 250
            break
        case '10':
            capacity = 100
            break
        case '6':
            capacity = 100
            break
        case '0.38':
            capacity = 10
            break
        case '20':
            capacity = 200
            break
        case '66':
            capacity = 500
            break
        case '750':
            capacity = 7000
            break

        case '1000':
            capacity = 9000
            break
    }
    setTimeout(() => {
        setTheDefaultValue(capacity, e * 1000, e < 1 ? e * 1000 : 100, row)
    }, 0)

}
const setTheDefaultValue = (capacity: number, pt1: number, pt2: number, row: any) => {
    row.basicCapacity = capacity
    row.protocolCapacity = capacity
    row.shortCircuitCapacity = capacity
    row.devCapacity = capacity

    row.ptRatio = pt1
    row.pt2Ratio = pt2
}

const treedata = (selectedNodeId?: string) => {
    if (selectedNodeId) {
        TerminalRef.value.info(selectedNodeId)
    } else {
        TerminalRef.value.info()
    }

    titleList.value = []
    titleList.value.unshift('监测设备')
}
/**
 * 重置初始状态
 */
const reaseStatus = () => {
    nodeData.value = {}
    nodeLevel.value = 0
    pageStatus.value = 1
    projectId.value = 0
    provinceId.value = 0
    gdId.value = 0
    subId.value = 0
    devId.value = 0
    busBarId.value = 0
    lineId.value = 0
    deviceIndex.value = '0'
    busBarIndex.value = '0'
    lineIndex.value = '0'
    currentGdName.value = ''
}
const devModelOptions = ref([])
const area = async () => {
    getAffiliatiedFront()
    // icd
    queryByCode('Icd_Model').then(res => {
        const id = res.data.id
        queryByid(id).then(res => {
            icdList.value = res.data
        })
    })

    queryByCode('DEV_CLD')
        .then(res => {
            devTypeOptions2.value = res.data
            queryCsDictTree(res.data.id).then(res => {
                devCLD.value = res.data
            })
            queryByCode('Device_Type').then(res => {
                queryByid(res.data.id).then((list: any) => {
                    devModelOptions.value = list.data.map((item: any, index: any) => {
                        return {
                            value: item.id,
                            label: item.name,
                            ...item
                        }
                    })
                })

                queryCsDictTree(res.data.id).then(res => {
                    devTypeOptions.value = res.data
                    // console.log("🚀 ~ area ~ devTypeOptions.value", devTypeOptions.value)
                })
            })
        })
        // .then(() => {
        //     return
        // })
        .catch(error => {
            console.error('查询过程中出现错误:', error)
        })

    getList({
        pageNum: 1,
        pageSize: 2000
    }).then(res => {
        userList.value = res.data.records
    })
}
// 获取前置机
const getAffiliatiedFront = () => {
    nodeAllList()
        .then(res => {
            affiliatiedFrontArr.value = res.data
        })
        .catch(error => {
            console.error('获取前置机数据失败:', error)
        })
}

const accessLoading = ref(false)
const MONITORING_REFRESH_KEY = 'monitoringNeedRefreshAffiliatiedAndImage'

const refreshAffiliatiedAndImage = () => {
    getAffiliatiedFront()
    getImageList()
}

const markNeedRefreshAfterNavigate = () => {
    sessionStorage.setItem(MONITORING_REFRESH_KEY, '1')
}

const tryRefreshAfterNavigate = () => {
    if (sessionStorage.getItem(MONITORING_REFRESH_KEY)) {
        sessionStorage.removeItem(MONITORING_REFRESH_KEY)
        refreshAffiliatiedAndImage()
        return true
    }
    return false
}

// 接入
// 新增拓扑图
const addTopology = () => {
    markNeedRefreshAfterNavigate()
    push({
        name: 'govern/manage/gplot'
    })
}
// 新增前置机
const addAffiliatiedFront = () => {
    markNeedRefreshAfterNavigate()
    push({
        name: 'govern/setting/frontManagement'
    })
}

onMounted(() => {
    nodeData.value.level = 0
    if (tryRefreshAfterNavigate()) return
    getImageList()
})

onActivated(() => {
    tryRefreshAfterNavigate()
})

area()
</script>

<style scoped></style>

<style lang="scss" scoped>
.instruction {
    animation: rotating 2s linear infinite;
}

:deep(.cn-tree) {
    padding: 0px 10px 0 0;
}

@keyframes rotating {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.device-manage {
    display: flex;
    // padding: 10px;

    &-right {
        overflow: hidden;
        flex: 1;
        padding: 10px 10px 10px 0;

        .el-descriptions__header {
            height: 36px;
            margin-bottom: 7px;
            display: flex;
            align-items: center;
        }
    }
}

.main-form {
    display: flex;
    flex-wrap: wrap;

    .form-top {
        width: 100%;
    }

    .el-form-item {
        width: 30%;
        margin-bottom: 15px !important;

        .el-select {
            width: 100%;
            min-width: 0px;
        }
    }
}

.el-tabs__content {
    margin-top: 15px;
}

.title {
    width: 300px;
    // overflow: hidden;
    // display: flex;
    white-space: nowrap;
    font-weight: bold;
}

.titleScroll {
    animation: scroll 7s linear infinite;
    /* 滚动动画 */
}

@keyframes scroll {
    0% {
        transform: translateX(100%);
        /* 从右侧开始 */
    }

    100% {
        transform: translateX(-160%);
        /* 滚动到左侧 */
    }
}

.image-preview {
    height: 50px;
    margin-top: 5px;
}

.productSelector .el-select-dropdown__item {
    height: 60px;
    line-height: 60px;
}
:deep(.el-tabs--top ){
    width: 100%;
}
</style>
