<template>
  <!-- 基础页面 -->
  <div class="app-container">
    <el-card v-show="showSearch" style="margin-bottom: 20px">
      <el-form :model="queryParams" ref="queryForm" :rules="outFormRules" inline label-width="110px">

        <el-form-item label="需求单位" prop="useUnit">
          <el-input style="width: 200px" v-model="queryParams.useUnit" placeholder="请输入需求单位"
                    :disabled="queryParams.status=='0'" clearable
          />
        </el-form-item>

        <el-form-item label="使用项目" prop="proCode">
          <el-select
            clearable
            :disabled="!routerParams.isEdit"
            style="width: 200px"
            placeholder="请选择使用项目"
            v-model="queryParams.proCode"
            @change="onChangeProCode"
          >
            <el-option
              :key="item.proCode"
              :label="item.proName"
              :value="item.proCode"
              v-for="item in useProjectList"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="项目类型" prop="proType">
          <el-input style="width: 200px" disabled v-model="queryParams.proType"/>
        </el-form-item>
        <el-form-item label="电压等级" prop="voltageLevel">
          <el-input style="width: 200px" disabled v-model="queryParams.voltageLevel"/>
        </el-form-item>
        <el-form-item label="项目所在省" prop="proProvince">
          <el-input style="width: 200px" disabled v-model="queryParams.proProvince"/>
        </el-form-item>
        <el-form-item label="项目所在市" prop="proCity">
          <el-input style="width: 200px" disabled v-model="queryParams.proCity"/>
        </el-form-item>
        <el-form-item label="项目所在区/县" prop="proCounty">
          <el-input style="width: 200px" disabled v-model="queryParams.proCounty"/>
        </el-form-item>

        <el-form-item label="使用到期日期" prop="useTimeRange">
          <el-date-picker
            :disabled="!routerParams.isEdit"
            v-model="queryParams.useTimeRange"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
            style="width: 225px"
          >
          </el-date-picker>
        </el-form-item>

      </el-form>

    </el-card>

    <el-card>
      <el-row :gutter="10" class="mb8" justify="end">
        <el-col :span="4">
          <span style="font-size: 20px; font-weight: 800">自用申请设备</span>
        </el-col>
        <el-col v-if="!routerParams.isView" :span="20" style="display: flex; justify-content: flex-end">
          <el-button type="primary" @click="handleDialog">添加</el-button>
          <el-button type="primary" @click="submit">确定申请</el-button>
        </el-col>
      </el-row>

      <el-table
        v-loading="isLoading"
        :data="tableList"
        highlight-current-row
        border
        stripe
        :max-height="650"
        style="width: 100%"
      >
        <el-table-column
          type="index"
          width="55"
          label="序号"
          align="center"
        />
        <el-table-column label="分类" align="center" prop="devType" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <span v-if="scope.row.devType==1">{{ '装备' }}</span>
            <span v-if="scope.row.devType==2">{{ '工具' }}</span>
          </template>
        </el-table-column>
        <el-table-column label="类目" align="center" prop="category" :show-overflow-tooltip="true"/>
        <el-table-column label="名称" align="center" prop="typeName" :show-overflow-tooltip="true" width="120px"/>
        <el-table-column label="规格型号" align="center" prop="typeModelName" :show-overflow-tooltip="true"/>
        <el-table-column label="管理模式" align="center" prop="manageType" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <span v-if="scope.row.manageType==0">{{ '编码设备' }}</span>
            <span v-if="scope.row.manageType==1">{{ '数量设备' }}</span>
          </template>
        </el-table-column>
        <el-table-column label="设备编码" align="center" prop="devCode" :show-overflow-tooltip="true" width="140px"/>
        <el-table-column label="当前库存" align="center" prop="storageNum" :show-overflow-tooltip="true"/>
        <el-table-column label="申请数量" align="center" prop="num" :show-overflow-tooltip="true"/>
        <el-table-column label="使用到期日期" align="center" width="250px">
          <template slot-scope="scope">
            <el-date-picker
              :disabled="!routerParams.isEdit"
              v-model="scope.row.useTimeRange"
              type="daterange"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              style="width: 100%"
            >
            </el-date-picker>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" v-if="!routerParams.isView">
          <template slot-scope="{ row }">
            <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(row)" style="color: red"
            >删除
            </el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </el-card>

    <!-- 添加申请 -->
    <el-dialog title="添加申请" :visible.sync="openAdd" width="1200px" append-to-body>
      <!-- 完善后的查询表单：支持类目查询 -->
      <el-form :model="addQuery" ref="addQueryForm" label-width="auto" inline class="query-form">
        <!-- 分类选择下拉框（装备/工具） -->
        <el-form-item label="分类" prop="devType">
          <el-select
            v-model="addQuery.devType"
            placeholder="请选择分类"
            clearable
            @change="handleDevTypeChange"
            style="width: 200px"
          >
            <el-option label="装备" value="1"/>
            <el-option label="工具" value="2"/>
          </el-select>
        </el-form-item>

        <!-- 动态显示：装备类目级联选择器 -->
        <el-form-item
          v-if="addQuery.devType === '1'"
          label="装备类目"
          prop="categoryPath"
        >
          <el-cascader
            v-model="addQuery.categoryPath"
            :options="processedTreeData"
            :props="cascaderProps"
            placeholder="请选择装备类目"
            clearable
            style="width: 200px"
            filterable
            popper-class="six-level-cascader"
            @change="handleCategoryChange"
          />
        </el-form-item>

        <!-- 动态显示：工具类目级联选择器 -->
        <el-form-item
          v-if="addQuery.devType === '2'"
          label="工具类目"
          prop="toolCategoryPath"
        >
          <el-cascader
            v-model="addQuery.toolCategoryPath"
            :options="toolTreeData"
            :props="toolCascaderProps"
            placeholder="请选择工具类目"
            clearable
            style="width: 200px"
            filterable
            popper-class="six-level-cascader"
            @change="handleToolCategoryChange"
          />
        </el-form-item>

        <!-- 名称查询 -->
        <el-form-item label="名称" prop="typeName">
          <el-input
            v-model="addQuery.typeName"
            maxlength="20"
            placeholder="请输入名称"
            style="width: 200px"
          />
        </el-form-item>

        <!-- 规格型号查询 -->
        <el-form-item label="规格型号" prop="typeModelName">
          <el-input
            v-model="addQuery.typeModelName"
            maxlength="20"
            placeholder="请输入规格型号"
            style="width: 200px"
          />
        </el-form-item>

        <!-- 编码查询 -->
        <el-form-item label="编码" prop="devCode">
          <el-input
            v-model="addQuery.devCode"
            maxlength="20"
            placeholder="请输入编码"
            style="width: 200px"
          />
        </el-form-item>

        <!-- 管理模式（仅工具显示） -->
        <el-form-item
          v-if="addQuery.devType === '2'"
          label="管理模式"
          prop="manageType"
        >
          <el-select
            v-model="addQuery.manageType"
            placeholder="请选择管理模式"
            clearable
            style="width: 200px"
          >
            <el-option label="编码工具" value="0"/>
            <el-option label="数量工具" value="1"/>
          </el-select>
        </el-form-item>


      </el-form>

      <!-- 操作按钮行 -->
      <el-row :gutter="10" class="mb8" justify="end">
        <el-col style="display: flex; justify-content: flex-end">
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleAddQuery">查询</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetAddQuery">重置</el-button>
          <el-button type="primary" size="mini" @click="saveAdd">确定添加</el-button>
        </el-col>
      </el-row>

      <!-- 设备列表表格 -->
      <el-table ref="addTable" :data="addList" height="500" @selection-change="handleSelectionChange" border stripe>
        <el-table-column type="selection" width="55" align="center" :selectable="selectable"/>
        <el-table-column label="序号" align="center" width="80" type="index">
          <template slot-scope="scope">
                      <span>{{
                          (addQuery.pageNum - 1) * 10 + scope.$index + 1
                        }}</span>
          </template>
        </el-table-column>
        <el-table-column label="分类" align="center" prop="devType" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <span v-if="scope.row.devType==1">{{ '装备' }}</span>
            <span v-if="scope.row.devType==2">{{ '工具' }}</span>
          </template>
        </el-table-column>
        <el-table-column label="类目" align="center" prop="category" :show-overflow-tooltip="true"/>
        <el-table-column label="名称" align="center" prop="typeName" :show-overflow-tooltip="true"/>
        <el-table-column label="规格型号" align="center" prop="typeModelName" :show-overflow-tooltip="true"/>
        <el-table-column label="管理模式" align="center" prop="manageType" :show-overflow-tooltip="true">
          <template slot-scope="scope">
            <span v-if="scope.row.manageType==0">{{ '编码设备' }}</span>
            <span v-if="scope.row.manageType==1">{{ '数量设备' }}</span>
          </template>
        </el-table-column>
        <el-table-column label="设备编码" align="center" prop="devCode" :show-overflow-tooltip="true" width="140px"/>
        <el-table-column label="当前库存" align="center" prop="storageNum" :show-overflow-tooltip="true"/>
        <el-table-column label="申请数量" align="center" prop="num">
          <template slot-scope="scope">
            <span v-if="scope.row.manageType==0">{{ 1 }}</span>
            <el-input-number v-if="scope.row.manageType==1" :disabled="isRowSelected(scope.row)" v-model="scope.row.num"
                             :min="0" :max="scope.row.storageNum" :default-value="0" style="width: 120px"
                             @change="applyNumChange(scope.row)"
            />
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页组件 -->
      <pagination
        v-show="addTotal > 0"
        :total="addTotal"
        :page.sync="addQuery.pageNum"
        :limit.sync="addQuery.pageSize"
        @pagination="getApplyList"
      />
    </el-dialog>
  </div>
</template>
<script>
import { getListByApplyIdApi, deleteToolApi, updateToolApplyApi } from '@/api/toolsManage'
import { getApplyListApi, addApplyApi, getApplyDetailsApi, editApplyApi } from '@/api/business'
import {
  getUseProjectListAPI,
  getVoltageListAPI,
  addProjectOutAPI
} from '@/api/EquipmentLedger/equ-out'
import { regionData } from 'element-china-area-data'
import { getEquipmentTreeAPI } from '@/api/EquipmentConfig/index.js'
import { getTreeSelectApi } from '@/api/toolsManage/index.js' // 替换为实际工具接口路径

export default {
  name: 'AddEditApply',
  data() {
    return {
      useTimeRange: [], // 主表单的全局日期范围
      routerParams: {},
      isLoading: false,
      showSearch: true,
      timeRange: [],
      processedTreeData: [], // 装备分类树
      toolTreeData: [],      // 工具分类树
      // 装备分类级联配置
      cascaderProps: {
        value: 'id',
        label: 'name',
        children: 'children',
        checkStrictly: true,
        expandTrigger: 'click'
      },
      // 工具分类级联配置（匹配返回字段：typeId/typeName）
      toolCascaderProps: {
        value: 'typeId',
        label: 'typeName',
        children: 'children',
        checkStrictly: true,
        expandTrigger: 'click'
      },
      queryParams: {
        type: 2, // 出库
        status: '0', // 变更状态
        proCode: '', // 使用项目id
        proName: '', // 使用项目名称
        proType: '', // 项目类型
        voltageLevel: '', // 电压等级
        proProvince: '', // 项目所在省
        proCity: '', // 项目所在市
        proCounty: '', // 项目所在区/县
        proLocation: '', // 详细地址
        useUnit: '', // 需求单位
        useTime: null,
        leaseType: '0',
        pageNum: 1, // 页码
        pageSize: 10 // 每页条数
      },
      useProjectList: [], // 使用项目下拉选
      voltageList: [], // 电压等级下拉选
      provinceList: [],
      cityList: [],
      countyList: [],

      outFormRules: {
        status: [{ required: true, message: '请选择变更状态', trigger: 'change' }],
        proCode: [{ required: true, message: '请选择使用项目', trigger: 'change' }],
        proType: [{ required: true, message: '请选择项目类型', trigger: 'change' }],
        voltageLevel: [{ required: true, message: '请选择电压等级', trigger: 'change' }],
        proProvince: [{ required: true, message: '请选择项目所在省', trigger: 'change' }],
        proCity: [{ required: true, message: '请选择项目所在市', trigger: 'change' }],
        proCounty: [{ required: true, message: '请选择项目所在区/县', trigger: 'change' }],
        proLocation: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
        useUnit: [{ required: true, message: '请输入需求单位', trigger: 'blur' }],
        useTimeRange: [{ required: true, message: '请选择使用到期日期', trigger: 'change' }]
      },

      typeList: [
        { label: '数量管理', value: '1' },
        { label: '编码管理', value: '0' }
      ],
      total: 0, // 总条数
      tableList: [], // 表格数据
      openAdd: false, // 添加申请弹窗开关
      addQuery: { // 页面输入的查询参数
        typeName: '', // 名称
        typeModelName: '', // 规格型号
        devCode: '', // 设备编码
        devType: '', // 核心：分类选择（1=装备，2=工具）
        manageType: '',
        categoryPath: '', // 装备分类路径（数组）
        toolCategoryPath: '', // 工具分类路径（数组）
        pageNum: 1, // 页码
        pageSize: 10 // 每页条数
      },
      filterParams: { // 存储筛选条件（分页时保留）
        typeName: '',
        typeModelName: '',
        devCode: '',
        categoryEquipment: '', // 装备分类ID（字符串）
        toolTypeId: '', // 工具分类ID（字符串）
        devType: '',// 筛选类型（1=装备，2=工具）
        manageType: ''
      },
      addTotal: 0, // 添加申请列表总条数
      addList: [], // 添加申请列表数据
      addTempList: [], // 添加申请临时列表
      ids: [], // 选中的id
      single: false, // 单选标识
      multiple: false, // 多选标识
      // 新增：当前选中的类目名称（用于显示）
      currentCategoryName: '',
      currentToolCategoryName: ''
    }
  },
  created() {
    this.routerParams = this.$route.query
    let title = '新增申请'
    if (this.routerParams.isView) {
      title = '查看申请'
    } else if (this.routerParams.isEdit) {
      title = '编辑申请'
    }
    this.queryParams.id = this.routerParams.id || ''
    this.getUseProjectList()
    // 如果是新增状态，默认填充当前部门名称
    if (this.queryParams.status === '0') {
      this.queryParams.useUnit = sessionStorage.getItem('deptName')
    }
    this.provinceList = regionData
    const obj = Object.assign({}, this.$route, { title })
    this.$tab.updatePage(obj)
    this.getList()
    this.getEquipmentTree() // 初始化加载装备分类树
    this.getToolTree() // 初始化加载工具分类树
  },

  watch: {
    // 监听主表单日期范围变化，同步更新表格中所有行的时间段
    'queryParams.useTimeRange'(newVal) {
      if (newVal && newVal.length === 2 && this.tableList.length > 0) {
        this.tableList.forEach(item => {
          item.useTimeRange = [...newVal] // 同步主表单的日期范围
        })
      }
    }
  },
  methods: {
    // 获取使用项目的下拉选
    async getUseProjectList() {
      try {
        const [resProject, resVoltage] = await Promise.all([
          getUseProjectListAPI(),
          getVoltageListAPI()
        ])
        this.useProjectList = resProject.data || []
        this.voltageList = resVoltage.data || []
      } catch (error) {
        this.$message.error('获取项目或电压等级列表失败')
        console.error(error)
      }
    },

    // 选择使用项目
    onChangeProCode(value) {
      this.queryParams.proCode = value
      const item = this.useProjectList.find((item) => item.proCode === value)
      if (item) {
        this.queryParams.proName = item.proName
        const { proTypeName, voltage, city, county, province } = item
        this.queryParams.proType = proTypeName
        this.queryParams.voltageLevel = voltage + 'kV'
        this.queryParams.proProvince = province
        this.queryParams.proCity = city
        this.queryParams.proCounty = county
      }
    },

    // 选择省份
    onChangeProvince(value) {
      if (!value) {
        this.cityList = []
        return
      }
      this.cityList = this.provinceList.find((item) => item.label === value)?.children || []
    },

    // 选择城市
    onChangeCity(value) {
      if (!value) {
        this.countyList = []
        return
      }
      this.countyList = this.cityList.find((item) => item.label === value)?.children || []
    },

    // 获取列表数据
    async getList(emit = {}) {
      // 如果从emit传入id，更新查询参数
      if (emit.id) {
        this.queryParams.id = emit.id
        this.$route.query.id = this.queryParams.id
      }

      this.isLoading = true
      try {
        const params = { ...this.queryParams }
        const res = await getApplyDetailsApi(params) // 调用接口获取详情

        // 初始化表格数据（重点处理日期）
        this.tableList = (res.data.devDetailsList || []).map(item => ({
          ...item,
          // 将后端返回的 useStartTime/useEndTime 转为 Date 对象数组（适配 el-date-picker）
          useTimeRange: item.useStartTime && item.useEndTime
            ? [new Date(item.useStartTime), new Date(item.useEndTime)]
            : [] // 无日期时设为空数组
        }))

        // 如果是编辑/查看模式，初始化主表单数据
        if (this.queryParams.id && res.data.devInfo) {
          Object.assign(this.queryParams, res.data.devInfo)

          // 初始化主表单的全局日期范围（如果后端返回了全局日期）
          if (res.data.devInfo.useStartTime && res.data.devInfo.useEndTime) {
            this.queryParams.useTimeRange = [
              new Date(res.data.devInfo.useStartTime),
              new Date(res.data.devInfo.useEndTime)
            ]
          }
        }

        this.total = res.data.total || 0
      } catch (error) {
        this.tableList = []
        this.total = 0
        this.$message.error('获取申请详情失败')
        console.error('getList error:', error)
      } finally {
        this.isLoading = false
      }
    },

    // 删除列表项
    handleDelete(row) {
      this.$confirm('此操作将永久删除该申请项, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.tableList = this.tableList.filter((item) => item.id !== row.id)
        this.$message({
          type: 'success',
          message: '删除成功!'
        })
      }).catch(() => {
        // 用户点击取消，不做操作
      })
    },

    // 打开添加申请弹窗
    handleDialog() {
      this.addQuery.pageNum = 1
      this.resetAddQuery() // 打开时重置查询条件和分页
      this.openAdd = true
      // 确保弹窗打开后表格能正确渲染
      this.$nextTick(() => {
        if (this.$refs.addTable) {
          this.$refs.addTable.clearSelection()
        }
      })
    },

    /**
     * 分页回调：获取添加申请列表数据（整合devType筛选）
     * @param {Object} pagination - 分页参数 { pageNum, pageSize }
     */
    getApplyList(pagination = {}) {
      // 合并分页参数，优先使用分页组件传递的参数
      const pageNum = pagination.pageNum || this.addQuery.pageNum
      const pageSize = pagination.pageSize || this.addQuery.pageSize

      // 更新组件内的分页状态
      this.addQuery.pageNum = pageNum
      this.addQuery.pageSize = pageSize

      // 构造完整的查询参数（包含devType和类目筛选）
      const queryParams = {
        ...this.filterParams,
        pageNum,
        pageSize
      }

      this.isLoading = true

      getApplyListApi(queryParams)
        .then(response => {
          if (response && response.data) {
            this.addList = response.data.rows || []
            this.addTotal = response.data.total || 0

            // 初始化申请数量
            this.addList.forEach(item => {
              item.num = item.manageType == '0' ? 1 : 0
            })
          } else {
            this.addList = []
            this.addTotal = 0
            this.$message.warning('获取数据格式异常')
          }
        })
        .catch(error => {
          this.addList = []
          this.addTotal = 0
          this.$message.error(`获取设备列表失败：${error.message || '未知错误'}`)
          console.error('分页查询失败：', error)
        })
        .finally(() => {
          this.isLoading = false
        })
    },

    /**
     * 分类切换事件（装备/工具）
     */
    handleDevTypeChange(val) {
      // 切换分类时，清空对应的类目选择
      if (val === '1') {
        this.addQuery.toolCategoryPath = ''
        this.currentToolCategoryName = ''
      } else if (val === '2') {
        this.addQuery.categoryPath = ''
        this.currentCategoryName = ''
      } else {
        // 未选择分类时，清空所有类目
        this.addQuery.categoryPath = ''
        this.addQuery.toolCategoryPath = ''
        this.currentCategoryName = ''
        this.currentToolCategoryName = ''
      }
    },

    /**
     * 装备类目选择变化
     */
    handleCategoryChange(value) {
      if (value && value.length > 0) {
        // 获取选中的最后一级类目名称
        let currentNode = this.findNodeInTree(this.processedTreeData, value[value.length - 1])
        this.currentCategoryName = currentNode ? currentNode.name : ''
      } else {
        this.currentCategoryName = ''
      }
    },

    /**
     * 工具类目选择变化
     */
    handleToolCategoryChange(value) {
      if (value && value.length > 0) {
        // 获取选中的最后一级类目名称
        let currentNode = this.findNodeInToolTree(this.toolTreeData, value[value.length - 1])
        this.currentToolCategoryName = currentNode ? currentNode.typeName : ''
      } else {
        this.currentToolCategoryName = ''
      }
    },

    /**
     * 在装备分类树中查找节点
     */
    findNodeInTree(tree, nodeId) {
      for (let node of tree) {
        if (node.id === nodeId) {
          return node
        }
        if (node.children && node.children.length > 0) {
          let found = this.findNodeInTree(node.children, nodeId)
          if (found) return found
        }
      }
      return null
    },

    /**
     * 在工具分类树中查找节点
     */
    findNodeInToolTree(tree, nodeId) {
      for (let node of tree) {
        if (node.typeId === nodeId) {
          return node
        }
        if (node.children && node.children.length > 0) {
          let found = this.findNodeInToolTree(node.children, nodeId)
          if (found) return found
        }
      }
      return null
    },

    /**
     * 添加申请查询（核心：处理devType和类目筛选逻辑）
     */
    handleAddQuery() {
      this.addQuery.pageNum = 1 // 查询时重置页码为1

      const queryParams = { ...this.addQuery }

      // 1. 处理devType（直接使用选择的分类值：1=装备，2=工具）
      const devType = queryParams.devType || ''

      // 2. 处理装备类目（仅当选择装备时生效）
      let categoryEquipment = ''
      if (devType === '1') {
        // 如果选择了类目路径，取最后一级ID作为查询条件
        if (queryParams.categoryPath && Array.isArray(queryParams.categoryPath) && queryParams.categoryPath.length > 0) {
          categoryEquipment = String(queryParams.categoryPath[queryParams.categoryPath.length - 1])
        }
      }

      // 3. 处理工具类目（仅当选择工具时生效）
      let toolTypeId = ''
      if (devType === '2') {
        // 如果选择了类目路径，取最后一级ID作为查询条件
        if (queryParams.toolCategoryPath && Array.isArray(queryParams.toolCategoryPath) && queryParams.toolCategoryPath.length > 0) {
          toolTypeId = String(queryParams.toolCategoryPath[queryParams.toolCategoryPath.length - 1])
        }
      }

      // 保存筛选条件（包含devType和类目）
      this.filterParams = {
        typeName: queryParams.typeName.trim(),
        typeModelName: queryParams.typeModelName.trim(),
        devCode: queryParams.devCode.trim(),
        categoryEquipment, // 装备类目ID
        toolTypeId, // 工具类目ID
        devType, // 分类类型
        manageType: queryParams.manageType // 管理模式（仅工具）
      }

      // 调用分页查询方法
      this.getApplyList({
        pageNum: this.addQuery.pageNum,
        pageSize: this.addQuery.pageSize
      })
    },

    /**
     * 重置添加申请查询条件（包含devType和类目）
     */
    resetAddQuery() {
      this.addQuery = {
        typeName: '',
        typeModelName: '',
        devCode: '',
        devType: '', // 重置分类选择
        manageType: '',
        categoryPath: '', // 重置装备类目
        toolCategoryPath: '', // 重置工具类目
        pageNum: 1,
        pageSize: 10
      }

      // 重置类目名称显示
      this.currentCategoryName = ''
      this.currentToolCategoryName = ''

      // 同步重置筛选参数
      this.filterParams = {
        typeName: '',
        typeModelName: '',
        devCode: '',
        categoryEquipment: '',
        toolTypeId: '',
        devType: '',
        manageType: ''
      }

      // 重置后触发一次查询
      this.getApplyList({ pageNum: 1, pageSize: this.addQuery.pageSize })
    },

    // 返回上一页
    handleBack() {
      this.$router.go(-1)
    },

    // 使用日期变化（批量设置表格中的使用日期）
    useTimeChange(val) {
      this.tableList.forEach(item => {
        item.useTime = val
      })
    },

    // 选择项变化（表格勾选时触发，保留devType）
    handleSelectionChange(selection) {
      console.log(selection)
      this.addTempList = []
      this.ids = selection.map(item => item.id)
      selection.forEach(item => {
        this.addTempList.push({
          id: item.id,
          typeId: item.typeId,
          devType: item.devType, // 关键：保留分类类型（1=装备，2=工具）
          category: item.category,
          typeName: item.typeName,
          typeModelName: item.typeModelName,
          manageType: item.manageType,
          devCode: item.devCode,
          storageNum: item.storageNum,
          num: item.manageType === '0' ? '1' : item.storageNum, // 编码设备默认1，数量设备取输入值
          useTime: this.queryParams.useTime ? new Date(this.queryParams.useTime) : null // 默认为主表单的使用日期
        })
      })
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },

    // 表格选择框是否可勾选（库存为0或已添加过的不可选）
    selectable(row) {
      // 库存为0或null不可选
      if (!row.storageNum || row.storageNum <= 0) {
        return false
      }
      // 已在主列表中的不可选
      return !this.tableList.some(item => item.id === row.id && item.typeId === row.typeId)
    },

    // 检查行是否被选中
    isRowSelected(row) {
      return this.ids.includes(row.id)
    },

    // 申请数量变化（校验：不能大于库存）
    applyNumChange(row) {
      if (row.num > row.storageNum) {
        this.$message({
          type: 'error',
          message: '申请数量不能大于当前库存'
        })
        row.num = row.storageNum // 超过库存时，自动设为最大库存
      } else if (row.num < 0) {
        row.num = 0 // 防止输入负数
      }
    },

    // 确认添加（将勾选的数据添加到主表格）
    saveAdd() {
      if (!this.ids.length) {
        this.$message.error('请勾选要添加的数据')
        return
      }

      const itemsToAdd = this.addList.filter(item => this.ids.includes(item.id))
      const invalidItem = itemsToAdd.find(item => item.manageType === '1' && (item.num == 0 || !item.num))
      if (invalidItem) {
        this.$message.error('请为数量管理的设备填写申请数量。')
        return
      }

      // 关键修改：新增设备时，初始化 useTimeRange 为 Date 对象数组
      itemsToAdd.forEach(item => {
        this.tableList.push({
          ...item,
          // 逻辑：主表单有日期则用主表单日期，无则为空数组
          useTimeRange: this.queryParams.useTime
            ? [new Date(this.queryParams.useTime), new Date(this.queryParams.useTime)]
            : []
        })
      })

      // 清除勾选状态
      this.ids = []
      if (this.$refs.addTable) {
        this.$refs.addTable.clearSelection()
      }
      this.openAdd = false
    },

    // 提交申请（新增/编辑，devType随数据传递）
    async submit() {
      this.$refs.queryForm.validate(async(valid) => {
        if (!valid) return

        this.$confirm('是否确定提交申请?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async() => {
          this.isLoading = true
          try {
            // --- 修改开始：健壮的日期格式化函数 ---
            const safeFormatDate = (dateInput) => {
              // 1. 检查输入是否为 null 或 undefined
              if (!dateInput) {
                console.warn('尝试格式化一个空的日期值')
                return '' // 或根据业务返回 '1970-01-01' 等默认值
              }

              // 2. 确保输入是一个 Date 对象
              let date
              if (dateInput instanceof Date) {
                date = dateInput
              } else {
                // 如果是字符串，尝试将其转换为 Date 对象
                date = new Date(dateInput)
              }

              // 3. 检查 Date 对象是否有效
              if (isNaN(date.getTime())) {
                console.error('无效的日期值:', dateInput)
                return '' // 或抛出错误
              }

              // 4. 执行格式化
              const year = date.getFullYear()
              const month = (date.getMonth() + 1).toString().padStart(2, '0')
              const day = date.getDate().toString().padStart(2, '0')
              return `${year}-${month}-${day}`
            }
            // --- 修改结束 ---

            // 1. 处理主表单的日期范围
            const devInfo = { ...this.queryParams }
            if (devInfo.useTimeRange && devInfo.useTimeRange.length === 2) {
              // 使用健壮的格式化函数
              devInfo.useStartTime = safeFormatDate(devInfo.useTimeRange[0])
              devInfo.useEndTime = safeFormatDate(devInfo.useTimeRange[1])
            }
            delete devInfo.useTimeRange

            // 2. 处理表格数据的日期
            const tempTableList = this.tableList.map(item => ({
              ...item,
              category: null,
              // 使用健壮的格式化函数
              useStartTime: safeFormatDate(item.useTimeRange[0]),
              useEndTime: safeFormatDate(item.useTimeRange[1]),
              useTimeRange: undefined,
              useTime: undefined
            }))

            const params = {
              devInfo,
              devDetailsList: tempTableList
            }

            // ... 后续提交逻辑 ...
            let res
            if (!this.routerParams.id) {
              res = await addApplyApi(params)
            } else {
              res = await editApplyApi(params)
            }

            if (res.code === 200) {
              this.$message.success(res.message || '操作成功!')
              this.$router.go(-1)
            } else {
              this.$message.error(res.message || '操作失败!')
            }
          } catch (error) {
            this.$message.error('提交申请异常，请稍后重试')
            console.error('submit error:', error)
          } finally {
            this.isLoading = false
          }
        })
      })
    },

    // 处理分类树数据（适配六级分类）
    processTreeData(data) {
      return Array.isArray(data) ? data : data ? [data] : []
    },

    // 递归处理装备分类节点（限制六级，补充level字段）
    processChildrenData(data, currentLevel = 1) {
      if (currentLevel > 6) return []
      return data.map(item => {
        const nodeId = item.typeId ? Number(item.typeId) : item.id ? Number(item.id) : ''
        const processedItem = {
          id: nodeId,
          name: item.typeName || item.name,
          level: currentLevel,
          parentId: item.parentId ? Number(item.parentId) : null,
          ...item
        }
        // 六级以下不再递归
        if (item.children && item.children.length > 0 && currentLevel < 6) {
          processedItem.children = this.processChildrenData(item.children, currentLevel + 1)
        } else {
          delete processedItem.children
        }
        return processedItem
      })
    },

    // 获取装备分类树数据
    async getEquipmentTree() {
      try {
        const res = await getEquipmentTreeAPI()
        if (res.code === 200) {
          const rawTreeData = this.processTreeData(res.data)
          this.processedTreeData = this.processChildrenData(rawTreeData)
        } else {
          this.$message.error(res.msg || '获取装备分类失败')
        }
      } catch (error) {
        this.$message.error('获取分类数据失败：' + (error.message || '未知错误'))
      }
    },

    // 获取工具分类树数据（适配返回字段，限制最多6级）
    async getToolTree() {
      try {
        const res = await getTreeSelectApi()
        if (res.code === 200) {
          let rawData = res.data || []
          this.toolTreeData = this.processToolTreeData(rawData)
        } else {
          this.$message.error(res.msg || '获取工具分类失败')
        }
      } catch (error) {
        this.$message.error('获取工具分类数据失败：' + (error.message || '未知错误'))
      }
    },

    // 递归处理工具分类节点（限制六级）
    processToolTreeData(data, currentLevel = 1) {
      if (currentLevel > 6) return []
      return data.map(item => {
        const processedItem = { ...item }
        // 六级以下递归处理子节点
        if (item.children && item.children.length > 0 && currentLevel < 6) {
          processedItem.children = this.processToolTreeData(item.children, currentLevel + 1)
        } else {
          delete processedItem.children // 超过六级移除子节点
        }
        return processedItem
      })
    }
  }
}
</script>

<style lang="scss" scoped>
/* 六级分类级联选择器样式 */
::v-deep .six-level-cascader .el-cascader-menu {
  max-height: 300px;
  overflow-y: auto;
}

::v-deep .six-level-cascader .el-cascader-menu__item {
  position: relative;
  transition: all 0.2s;
}

/* 各级分类缩进差异化 */
::v-deep .six-level-cascader .el-cascader-menu[data-level='1'] .el-cascader-menu__item {
  padding-left: 20px;
  font-weight: 500;
}

::v-deep .six-level-cascader .el-cascader-menu[data-level='2'] .el-cascader-menu__item {
  padding-left: 35px;
  font-weight: 400;
}

::v-deep .six-level-cascader .el-cascader-menu[data-level='3'] .el-cascader-menu__item {
  padding-left: 50px;
  font-size: 13px;
}

::v-deep .six-level-cascader .el-cascader-menu[data-level='4'] .el-cascader-menu__item {
  padding-left: 65px;
  font-size: 13px;
  color: #666;
}

::v-deep .six-level-cascader .el-cascader-menu[data-level='5'] .el-cascader-menu__item {
  padding-left: 80px;
  font-size: 12px;
  color: #888;
}

::v-deep .six-level-cascader .el-cascader-menu[data-level='6'] .el-cascader-menu__item {
  padding-left: 95px;
  font-size: 12px;
  color: #999;
  background-color: #f8f9fa;
}

/* 隐藏七级及以上分类 */
::v-deep .six-level-cascader .el-cascader-menu[data-level='7'] .el-cascader-menu__item {
  display: none;
}

/* 滚动条样式优化 */
::v-deep .six-level-cascader .el-cascader-menu::-webkit-scrollbar {
  width: 6px;
}

::v-deep .six-level-cascader .el-cascader-menu::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 3px;
}

::v-deep .six-level-cascader .el-cascader-menu::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 3px;
}
</style>
