<script lang="ts" setup>
import SavePosition from 'components/SavePosition/index.vue'
import { socket } from 'libs/socket'
import { useDebugStore } from 'stores/debugStore'
import { useSystemStore } from 'stores/systemStore'
import { onMounted, onUnmounted, ref } from 'vue'

const systemStore = useSystemStore()

const debugStore = useDebugStore()

let currentCommandId = ''

onMounted(() => {
  socket.init(receiveMessage, 'cmd_debug')
  socket.init(receiveMessage, 'cmd_response')
})

onUnmounted(() => {
  socket.unregisterCallback(receiveMessage, 'cmd_debug')
  socket.unregisterCallback(receiveMessage, 'cmd_response')
})

const receiveMessage = (data: Socket.cmdData) => {
  data.commandId === currentCommandId && systemStore.pushSystemList(data)
}

const debug_pallet_elevator_lift_up = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_pallet_elevator_lift_up',
    params: {
      index: debugStore.formData.heatArea.index,
      ...debugStore.formData.heatArea.heatMotorData,
    },
  }
  await debugStore.sendControl(params)
}

const debug_pallet_elevator_lift_down = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_pallet_elevator_lift_down',
    params: {
      index: debugStore.formData.heatArea.index,
      ...debugStore.formData.heatArea.heatMotorData,
    },
  }
  await debugStore.sendControl(params)
}

const debug_pallet_elevator_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_pallet_elevator_stop',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_pallet_elevator_reset = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_pallet_elevator_reset',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_heater_start = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_heater_start',
    params: {
      index: debugStore.formData.heatArea.index,
      ...debugStore.formData.heatArea.heatTemperature,
    },
  }
  await debugStore.sendControl(params)
}
const debug_heater_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_heater_stop',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cold_trap_start_refrigeration = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cold_trap_start_refrigeration',
    params: {
      index: debugStore.formData.heatArea.index,
      ...debugStore.formData.heatArea.coldTrap,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cold_trap_stop_refrigeration = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cold_trap_stop_refrigeration',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cold_trap_start_recycle = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cold_trap_start_recycle',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cold_trap_stop_recycle = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cold_trap_stop_recycle',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

// const debug_heater_start_heat_maintaining = async () => {
//   currentCommandId = Date.now().toString()
//   const params = {
//     commandId: currentCommandId,
//     command: 'debug_heater_start_heat_maintaining',
//     params: {
//       index: debugStore.formData.heatArea.index,
//       ...debugStore.formData.heatArea.heatTemperature,
//     },
//   }
//   await debugStore.sendControl(params)
// }
//
// const debug_heater_stop_heat_maintaining = async () => {
//   currentCommandId = Date.now().toString()
//   const params = {
//     commandId: currentCommandId,
//     command: 'debug_heater_stop_heat_maintaining',
//     params: {
//       index: debugStore.formData.heatArea.index,
//     },
//   }
//   await debugStore.sendControl(params)
// }

const debug_fan_start = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_fan_start',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_fan_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_fan_stop',
    params: {
      index: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cover_elevator_lift_up = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cover_elevator_lift_up',
    params: {
      ...debugStore.formData.lidData,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cover_elevator_lift_down = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cover_elevator_lift_down',
    params: {
      ...debugStore.formData.lidData,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cover_elevator_reset = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cover_elevator_reset',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_cover_elevator_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cover_elevator_stop',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_liquid_arm_reset = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_liquid_arm_reset',
    params: {
      target: ['largeArm', 'smallArm'],
    },
  }
  await debugStore.sendControl(params)
}

const debug_liquid_arm_rotation = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_liquid_arm_rotation',
    params: {
      ...debugStore.formData.liquidArmData,
    },
  }
  await debugStore.sendControl(params)
}

const debug_liquid_arm_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_liquid_arm_stop',
    params: {
      target: ['largeArm', 'smallArm'],
    },
  }
  await debugStore.sendControl(params)
}

// const liquid_pump_pre_filling = async () => {
//   currentCommandId = Date.now().toString()
//   const params = {
//     commandId: currentCommandId,
//     command: 'debug_liquid_pump_pre_filling',
//     params: {
//       index: debugStore.formData.liquidPumpData.index,
//     },
//   }
//   await debugStore.sendControl(params)
// }
//
// const liquid_pump_pre_evacuation = async () => {
//   currentCommandId = Date.now().toString()
//   const params = {
//     commandId: currentCommandId,
//     command: 'debug_liquid_pump_pre_evacuation',
//     params: {
//       index: debugStore.formData.liquidPumpData.index,
//     },
//   }
//   await debugStore.sendControl(params)
// }

const debug_liquid_pump_start = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_liquid_pump_start',
    params: {
      ...debugStore.formData.liquidPumpData,
    },
  }
  await debugStore.sendControl(params)
}

const debug_liquid_pump_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_liquid_pump_stop',
    params: {
      index: debugStore.formData.liquidPumpData.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_shaker_start = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_shaker_start',
    params: {
      ...debugStore.formData.shakeSpeed,
    },
  }
  await debugStore.sendControl(params)
}

const debug_shaker_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_shaker_stop',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_shaker_reset = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_shaker_reset',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_transportation_arm_reset = async (motor: 'x' | 'y' | 'z') => {
  console.log(debugStore.formData.transferModule[`${motor}MotorData`])
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_transportation_arm_reset',
    params: {
      dim: [motor],
    },
  }
  await debugStore.sendControl(params)
}

const debug_transportation_arm_move = async (motor: 'x' | 'y' | 'z', direction: 'forward' | 'backward') => {
  const distance = direction === 'backward' ? -debugStore.formData.transferModule[`${motor}MotorData`][`${motor}DimDistance`] : debugStore.formData.transferModule[`${motor}MotorData`][`${motor}DimDistance`]
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_transportation_arm_move',
    params: {
      ...debugStore.formData.transferModule[`${motor}MotorData`],
      [`${motor}DimDistance`]: distance,
    },
  }
  await debugStore.sendControl(params)
}

const debug_transportation_arm_stop = async (motor: 'x' | 'y' | 'z') => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_transportation_arm_stop',
    params: {
      dim: [motor],
    },
  }
  await debugStore.sendControl(params)
}

const debug_gantry_position = async (motor: 'x' | 'y' | 'z') => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: `debug_gantry_${motor}_position`,
    params: {
      position: debugStore.formData.transferModule[`${motor}MotorData`].position,
    },
  }
  await debugStore.sendControl(params)
}

const debug_holding_jaw_open = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_holding_jaw_open',
    params: {
      ...debugStore.formData.transferModule.JawData,
    },
  }
  await debugStore.sendControl(params)
}

// const debug_holding_jaw_close = async () => {
//   currentCommandId = Date.now().toString()
//   const params = {
//     commandId: currentCommandId,
//     command: 'debug_holding_jaw_close',
//     params: {
//       ...debugStore.formData.transferModule.JawData,
//     },
//   }
//   await debugStore.sendControl(params)
// }

const debug_holding_jaw_pause = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_holding_jaw_pause',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_door_open = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_door_open',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_door_close = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_door_close',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_door_stop = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_door_stop',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_move_tray_to_solution_area = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_move_tray_to_solution_area',
    params: {
      heatId: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_move_tray_to_heat_area = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_move_tray_to_heat_area',
    params: {
      heatId: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_gantry_to_heat_area_cap = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_gantry_to_heat_area_cap',
    params: {
      heatId: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_gantry_to_heat_area_tray = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_gantry_to_heat_area_tray',
    params: {
      heatId: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cap_in_heat_area = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cap_in_heat_area',
    params: {
      heatId: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cap_out_heat_area = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cap_out_heat_area',
    params: {
      heatId: debugStore.formData.heatArea.index,
    },
  }
  await debugStore.sendControl(params)
}

const debug_cap_up_one = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cap_up_one',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_cap_down_one = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_cap_up_one',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_enable_all_motor = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_enable_all_motor',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_disabled_all_motor = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_disabled_all_motor',
    params: {},
  }
  await debugStore.sendControl(params)
}

const debug_stop_all_motor = async () => {
  currentCommandId = Date.now().toString()
  const params = {
    commandId: currentCommandId,
    command: 'debug_stop_all_motor',
    params: {},
  }
  await debugStore.sendControl(params)
}

const savePositionVisible = ref(false)
</script>

<template>
  <div class="debug-content">
    <!--    <el-tabs v-model="activeTab" type="card"> -->
    <!--      <el-tab-pane label="单步指令" :name="1" /> -->
    <!--      <el-tab-pane label="复合指令" :name="2" /> -->
    <!--    </el-tabs> -->
    <el-row class="button-content">
      <el-col :span="8">
        <div class="button-box">
          <ft-button type="primary" :click-handle="debug_enable_all_motor">
            使能所有电机
          </ft-button>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="button-box">
          <ft-button type="primary" :click-handle="debug_disabled_all_motor">
            失能所有电机
          </ft-button>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="button-box">
          <ft-button type="primary" :click-handle="debug_stop_all_motor">
            停止所有电机
          </ft-button>
        </div>
      </el-col>
    </el-row>
    <el-row :gutter="10" class="card-content">
      <el-col :span="8">
        <el-card>
          <template #header>
            <div class="card-header">
              <span>转运模组</span>
            </div>
          </template>
          <el-form-item class="button-center">
            <ft-button type="primary" size="small" @click="savePositionVisible = true">
              保存当前坐标
            </ft-button>
          </el-form-item>
          <el-divider>X轴电机</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="距离">
                <el-input v-model.number="debugStore.formData.transferModule.xMotorData.xDimDistance" type="number" placeholder="请输入距离">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="速度">
                <el-input v-model.number="debugStore.formData.transferModule.xMotorData.xDimVelocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="循环">
                <el-input v-model.number="debugStore.formData.transferModule.xMotorData.times" type="number" placeholder="请输入次数">
                  <template #append>
                    次
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="() => debug_transportation_arm_move('x', 'forward')">
                  前进
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="() => debug_transportation_arm_move('x', 'backward')">
                  后退
                </ft-button>
                <ft-button size="small" :click-handle="() => debug_transportation_arm_stop('x')">
                  停止
                </ft-button>
                <ft-button type="primary" size="small" :click-handle="() => debug_transportation_arm_reset('x')">
                  回原点
                </ft-button>
              </el-form-item>
              <el-form-item label="指定位置">
                <el-input v-model.number="debugStore.formData.transferModule.xMotorData.position" type="number" placeholder="请输入位置">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="() => debug_gantry_position('x')">
                  移动
                </ft-button>
                <ft-button size="small" :click-handle="() => debug_transportation_arm_stop('x')">
                  停止
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <el-divider>Y轴电机</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="距离">
                <el-input v-model.number="debugStore.formData.transferModule.yMotorData.yDimDistance" type="number" placeholder="请输入距离">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="速度">
                <el-input v-model.number="debugStore.formData.transferModule.yMotorData.yDimVelocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="循环">
                <el-input v-model.number="debugStore.formData.transferModule.yMotorData.times" type="number" placeholder="请输入次数">
                  <template #append>
                    次
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button type="primary" size="small" :click-handle="() => debug_transportation_arm_move('y', 'forward')">
                  前进
                </ft-button>
                <ft-button type="primary" size="small" :click-handle="() => debug_transportation_arm_move('y', 'backward')">
                  后退
                </ft-button>
                <ft-button size="small" :click-handle="() => debug_transportation_arm_stop('y')">
                  停止
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="() => debug_transportation_arm_reset('y')">
                  回原点
                </ft-button>
              </el-form-item>
              <el-form-item label="指定位置">
                <el-input v-model.number="debugStore.formData.transferModule.yMotorData.position" type="number" placeholder="请输入位置">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="() => debug_gantry_position('y')">
                  移动
                </ft-button>
                <ft-button size="small" :click-handle="() => debug_transportation_arm_stop('y')">
                  停止
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <el-divider>Z轴电机</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="距离">
                <el-input v-model.number="debugStore.formData.transferModule.zMotorData.zDimDistance" type="number" placeholder="请输入距离">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="速度">
                <el-input v-model.number="debugStore.formData.transferModule.zMotorData.zDimVelocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="循环">
                <el-input v-model.number="debugStore.formData.transferModule.zMotorData.times" type="number" placeholder="请输入次数">
                  <template #append>
                    次
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="() => debug_transportation_arm_move('z', 'forward')">
                  前进
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="() => debug_transportation_arm_move('z', 'backward')">
                  后退
                </ft-button>
                <ft-button size="small" :click-handle="() => debug_transportation_arm_stop('z')">
                  停止
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="() => debug_transportation_arm_reset('z')">
                  回原点
                </ft-button>
              </el-form-item>
              <el-form-item label="指定位置">
                <el-input v-model.number="debugStore.formData.transferModule.zMotorData.position" type="number" placeholder="请输入位置">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="() => debug_gantry_position('z')">
                  移动
                </ft-button>
                <ft-button size="small" :click-handle="() => debug_transportation_arm_stop('z')">
                  停止
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <el-divider>夹爪舵机</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="打开位置">
                <el-input v-model.number="debugStore.formData.transferModule.JawData.openDistance" type="number" placeholder="请输入打开位置">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="闭合位置">
                <el-input v-model.number="debugStore.formData.transferModule.JawData.closeDistance" type="number" placeholder="请输入闭合位置">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="速度">
                <el-input v-model.number="debugStore.formData.transferModule.JawData.velocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="循环">
                <el-input v-model.number="debugStore.formData.transferModule.JawData.times" type="number" placeholder="请输入次数">
                  <template #append>
                    次
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_holding_jaw_open">
                  执行
                </ft-button>
                <ft-button size="small" :click-handle="debug_holding_jaw_pause">
                  停止
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card>
          <template #header>
            <div class="card-header">
              <span>加液模组</span>
            </div>
          </template>
          <el-divider>加液臂</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="大臂速度">
                <el-input v-model.number="debugStore.formData.liquidArmData.largeArmRotationVelocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="大臂角度">
                <el-input v-model.number="debugStore.formData.liquidArmData.largeArmAngle" type="number" placeholder="请输入角度">
                  <template #append>
                    °
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="小臂速度">
                <el-input v-model.number="debugStore.formData.liquidArmData.smallArmRotationVelocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="小臂角度">
                <el-input v-model.number="debugStore.formData.liquidArmData.smallArmAngle" type="number" placeholder="请输入角度">
                  <template #append>
                    °
                  </template>
                </el-input>
              </el-form-item>
            </el-form>

            <ft-button size="small" type="primary" :click-handle="debug_liquid_arm_rotation">
              开始
            </ft-button>
            <ft-button size="small" :click-handle="debug_liquid_arm_stop">
              停止
            </ft-button>
            <ft-button size="small" type="primary" :click-handle="debug_liquid_arm_reset">
              回原点
            </ft-button>
          </div>
          <el-divider>加液泵</el-divider>
          <div class="card-box">
            <el-form>
              <!--              <el-form-item label="方向"> -->
              <!--                <el-radio-group v-model="debugStore.formData.liquidPumpData.direction"> -->
              <!--                  <el-radio-button value="forward"> -->
              <!--                    正转 -->
              <!--                  </el-radio-button> -->
              <!--                  <el-radio-button value="backward"> -->
              <!--                    反转 -->
              <!--                  </el-radio-button> -->
              <!--                </el-radio-group> -->
              <!--              </el-form-item> -->
              <el-form-item label="加液泵头">
                <el-select v-model="debugStore.formData.liquidPumpData.index" placeholder="请选择泵头">
                  <el-option v-for="item in 8" :key="item" :label="item" :value="`acid_pump_0${item}`" />
                </el-select>
              </el-form-item>
              <el-form-item label="加液容量">
                <el-input v-model.number="debugStore.formData.liquidPumpData.volume" type="number" placeholder="请输入速度">
                  <template #append>
                    mL
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="加液速度">
                <el-input v-model.number="debugStore.formData.liquidPumpData.velocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>

              <!--              <el-form-item> -->
              <!--                <ft-button type="primary" :click-handle="liquid_pump_pre_filling"> -->
              <!--                  预充 -->
              <!--                </ft-button> -->
              <!--                <ft-button :click-handle="liquid_pump_pre_evacuation"> -->
              <!--                  排空 -->
              <!--                </ft-button> -->
              <!--              </el-form-item> -->
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_liquid_pump_start">
                  启动
                </ft-button>
                <ft-button size="small" :click-handle="debug_liquid_pump_stop">
                  停止
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <el-divider>摇匀</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="摇匀速度">
                <el-input v-model.number="debugStore.formData.shakeSpeed.velocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
            </el-form>
            <ft-button size="small" type="primary" :click-handle="debug_shaker_start">
              开始
            </ft-button>
            <ft-button size="small" :click-handle="debug_shaker_stop">
              停止
            </ft-button>
            <ft-button size="small" type="primary" :click-handle="debug_shaker_reset">
              回原点
            </ft-button>
          </div>
        </el-card>
        <el-card>
          <template #header>
            <div class="card-header">
              <span>相机模组</span>
            </div>
          </template>
          <div class="card-box">
            <!--            <el-form> -->
            <!--              <el-form-item label="速度"> -->
            <!--                <el-input> -->
            <!--                  <template #append> -->
            <!--                    rpm/min -->
            <!--                  </template> -->
            <!--                </el-input> -->
            <!--              </el-form-item> -->
            <!--              <el-form-item label="距离"> -->
            <!--                <el-input> -->
            <!--                  <template #append> -->
            <!--                    ° -->
            <!--                  </template> -->
            <!--                </el-input> -->
            <!--              </el-form-item> -->
            <!--              <el-form-item> -->
            <!--                <ft-button type="primary"> -->
            <!--                  抬升 -->
            <!--                </ft-button> -->
            <!--                <ft-button type="primary"> -->
            <!--                  下降 -->
            <!--                </ft-button> -->
            <!--              </el-form-item> -->
            <!--              <el-form-item> -->
            <!--                <ft-button type="primary"> -->
            <!--                  复位 -->
            <!--                </ft-button> -->
            <!--                <ft-button> -->
            <!--                  停止 -->
            <!--                </ft-button> -->
            <!--              </el-form-item> -->
            <!--            </el-form> -->
          </div>
        </el-card>
        <el-card>
          <template #header>
            <div class="card-header">
              <span>门</span>
            </div>
          </template>
          <div class="card-box">
            <ft-button size="small" type="primary" :click-handle="debug_door_open">
              开门
            </ft-button>
            <ft-button size="small" type="primary" :click-handle="debug_door_close">
              关门
            </ft-button>
            <ft-button size="small" :click-handle="debug_door_stop">
              停止
            </ft-button>
          </div>
        </el-card>
        <el-card>
          <template #header>
            <div class="card-header">
              <span>拍子存放模组</span>
            </div>
          </template>
          <div class="card-box">
            <el-form>
              <el-form-item label="速度">
                <el-input v-model.number="debugStore.formData.lidData.velocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="距离">
                <el-input v-model.number="debugStore.formData.lidData.distance" type="number" placeholder="请输入距离">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button type="primary" size="small" :click-handle="debug_cover_elevator_lift_up">
                  抬升
                </ft-button>
                <ft-button type="primary" size="small" :click-handle="debug_cover_elevator_lift_down">
                  下降
                </ft-button>

                <ft-button size="small" :click-handle="debug_cover_elevator_stop">
                  停止
                </ft-button>
                <ft-button type="primary" size="small" :click-handle="debug_cover_elevator_reset">
                  回原点
                </ft-button>
                <ft-button type="primary" :click-handle="debug_cap_up_one">
                  提升一个拍子高度
                </ft-button>
                <ft-button type="primary" :click-handle="debug_cap_down_one">
                  下降一个拍子高度
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
        </el-card>
      </el-col>
      <el-col :span="8">
        <el-card>
          <template #header>
            <div class="card-header">
              <span>加热模组</span>
              <div>
                <el-select v-model="debugStore.formData.heatArea.index" style="width: 150px" placeholder="请选择区域">
                  <el-option v-for="item in 6" :key="item" :label="`A-${item}`" :value="`heat_module_0${item}`" />
                </el-select>
              </div>
            </div>
          </template>
          <el-divider>复合操作</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_move_tray_to_solution_area">
                  加热托盘移至加液
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_cap_in_heat_area">
                  安装拍子
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_move_tray_to_heat_area">
                  加液托盘移至加热
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_cap_out_heat_area">
                  拆卸拍子
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_gantry_to_heat_area_cap">
                  机械臂移至拍子位
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_gantry_to_heat_area_tray">
                  机械臂移至托盘位
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <el-divider>升降电机</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="距离">
                <el-input v-model.number="debugStore.formData.heatArea.heatMotorData.distance" type="number" placeholder="请输入距离">
                  <template #append>
                    mm
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="速度">
                <el-input v-model.number="debugStore.formData.heatArea.heatMotorData.velocity" type="number" placeholder="请输入速度">
                  <template #append>
                    rpm/min
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item label="循环">
                <el-input v-model.number="debugStore.formData.heatArea.heatMotorData.times" type="number" placeholder="请输入次数">
                  <template #append>
                    次
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_pallet_elevator_lift_up">
                  上升
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_pallet_elevator_lift_down">
                  下降
                </ft-button>
                <ft-button size="small" :click-handle="debug_pallet_elevator_stop">
                  停止
                </ft-button>
                <ft-button size="small" type="primary" :click-handle="debug_pallet_elevator_reset">
                  回原点
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <el-divider>加热棒</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="温度">
                <el-input v-model.number="debugStore.formData.heatArea.heatTemperature.temperature" type="number" placeholder="请输入温度">
                  <template #append>
                    ℃
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_heater_start">
                  开始加热
                </ft-button>
                <ft-button size="small" :click-handle="debug_heater_stop">
                  停止加热
                </ft-button>
              </el-form-item>
              <!--              <el-form-item> -->
              <!--                <ft-button type="primary" :click-handle="debug_heater_start_heat_maintaining"> -->
              <!--                  开始恒温 -->
              <!--                </ft-button> -->
              <!--                <ft-button :click-handle="debug_heater_stop_heat_maintaining"> -->
              <!--                  停止恒温 -->
              <!--                </ft-button> -->
              <!--              </el-form-item> -->
            </el-form>
          </div>
          <el-divider>冷阱</el-divider>
          <div class="card-box">
            <el-form>
              <el-form-item label="温度">
                <el-input v-model.number="debugStore.formData.heatArea.coldTrap.temperature" type="number" placeholder="请输入温度">
                  <template #append>
                    ℃
                  </template>
                </el-input>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_cold_trap_start_refrigeration">
                  启动制冷
                </ft-button>
                <ft-button size="small" :click-handle="debug_cold_trap_stop_refrigeration">
                  停止制冷
                </ft-button>
              </el-form-item>
              <el-form-item>
                <ft-button size="small" type="primary" :click-handle="debug_cold_trap_start_recycle">
                  启动循环
                </ft-button>
                <ft-button size="small" :click-handle="debug_cold_trap_stop_recycle">
                  停止循环
                </ft-button>
              </el-form-item>
            </el-form>
          </div>
          <!--          <el-divider>拍子</el-divider> -->
          <!--          <div class="card-box"> -->
          <!--            <ft-button type="primary"> -->
          <!--              启动吸附 -->
          <!--            </ft-button> -->
          <!--            <ft-button> -->
          <!--              停止吸附 -->
          <!--            </ft-button> -->
          <!--          </div> -->
          <el-divider>风扇</el-divider>
          <div class="card-box">
            <ft-button size="small" type="primary" :click-handle="debug_fan_start">
              打开风扇
            </ft-button>
            <ft-button size="small" :click-handle="debug_fan_stop">
              关闭风扇
            </ft-button>
          </div>
        </el-card>
      </el-col>
    </el-row>
    <SavePosition v-if="savePositionVisible" @ok="savePositionVisible = false" @cancel="savePositionVisible = false" />
  </div>
</template>

<style lang="scss" scoped>
.debug-content {
  overflow: hidden;
  max-height: 100%;
  .button-content {
    height: 40px;
  }
  .card-content {
    height: calc(100% - 40px);
    overflow: auto;
  }
}

.el-card {
  margin-bottom: 10px;
}

:deep(.el-card__header) {
  padding: 5px 10px;
}

.el-input, .el-select {
  width: 100%;
}

.el-form-item {
  margin-bottom: 10px;
  margin-right: 10px;
}

.card-box {
  //display: flex;
  //align-items: center;
}

:deep(.el-input-group__append) {
  padding: 0 10px;
}
:deep(.el-card__header) {
  background:rgba(0,0,0,0.03);
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.select-label {
  margin-right: 10px;
}
:deep(.el-card__body) {
  padding: 10px;
}
.el-form-item__content {
  .ft-button {
    margin-bottom: 10px;
  }
}
.button-box {
  display: flex;
  justify-content: center;
}
:deep(.el-form-item).button-center {
.el-form-item__content {
  width: 100%;
  display: flex;
  justify-content: center;
}
}
</style>
