<template>
  <div class="h-full flex flex-col">
    <div class="border-b p-5 bg-white flex flex-row">
      <div>样本预处理</div>
      <div v-if="false" class="ml-1"><LoadingOutlined /></div>
    </div>
    <a-row class="h-0 grow">
      <a-col class="border-r" :span="16">
        <div class="p-5 border-t border-b">
          <a-row>
            <a-col class="p-1" :span="8"><a-input prefix="回零超时时间 : " v-model:value="serviceParams.MoveToZeroOvertime" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="执行动作的超时时间 : " v-model:value="serviceParams.ActionOvertime" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="高全血试管取帽位置 : " v-model:value="serviceParams.ZMotor_HighBloodTakeCapHeight" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="矮全血试管取帽位置 : " v-model:value="serviceParams.ZMotor_ShortBloodTakeCapHeight" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="高试管帽子判断位置 : " v-model:value="serviceParams.ZMotor_HighBloodCapJudgeHeight" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="矮全血试管帽子判断位置 : " v-model:value="serviceParams.ZMotor_ShortBloodCapJudgeHeight" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="摇匀位放置高度 : " v-model:value="serviceParams.ZMotor_placeShakeHeight" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="水平移动电机待机位置 : " v-model:value="serviceParams.HorizontalMotor_standbyPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="水平移动电机取帽位置 : " v-model:value="serviceParams.HorizontalMotor_takeCapPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="水平移动电机放帽位置 : " v-model:value="serviceParams.HorizontalMotor_takePushCapPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="抓手舵机待机位置 : " v-model:value="serviceParams.GripperServo_standbyPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="抓手舵机取帽扭矩 : " v-model:value="serviceParams.GripperServo_takeCapTorque" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="抓手舵机取试管位置 : " v-model:value="serviceParams.GripperServo_takeTubePos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="判断是否有帽子的位置阈值 : " v-model:value="serviceParams.GripperServo_hatDeterminesPosThres" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="摇匀电机待机位置 : " v-model:value="serviceParams.ShakeMotor_standbyPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="摇匀电机摇匀角度 : " v-model:value="serviceParams.ShakeMotor_shakeDegree" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="试管夹紧电机待机位置 : " v-model:value="serviceParams.TubeClampMotor_standbyPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="试管夹紧电机夹紧位置 : " v-model:value="serviceParams.TubeClampMotor_ClampPos" /></a-col>
            <a-col class="p-1" :span="8"><a-input prefix="气溶胶风扇控制参数 : " v-model:value="serviceParams.AerosolFanLevel" /></a-col>
            <a-col class="p-1" :span="8">
              <a-button class="mr-1" @click="actionServiceParamsReload">刷新</a-button>
              <a-button @click="actionServiceParamsSave">保存</a-button>
            </a-col>
          </a-row>
        </div>

        <div class="p-5">
          <a-button class="m-1" @click="actionQuickExec('enableModule',0)">失能</a-button>
          <a-button class="m-1" @click="actionQuickExec('enableModule',1)">使能</a-button>
          <a-button class="m-1" @click="actionQuickExec('')">停止</a-button>
          <a-button class="m-1" @click="actionQuickExec('moveToZero')">归零</a-button>

          <a-button class="m-1" @click="actionQuickExec('openAerosolFan')">打开气溶胶风扇</a-button>
          <a-button class="m-1" @click="actionQuickExec('closeAerosolFan')">关闭气溶胶风扇</a-button>
          <a-button class="m-1" @click="actionQuickExec('moduleResetWhenPowerOn')">设备初始化时复位</a-button>
          <a-button class="m-1" @click="actionQuickExec('moduleRuntimeReset')">设备运行时复位</a-button>
    
          <div class="mt-1">
            <a-input-group compact class="flex flex-row">
              <a-button @click="actionShakeTube">摇匀试管</a-button>
              <a-input class="!w-64" prefix="TubeType : " v-model:value="shakeTubeParams[0]"/>
              <a-input class="!w-32" prefix="TubeIndex : " v-model:value="shakeTubeParams[1]"/>
            </a-input-group>
          </div>
          <div class="mt-1">
            <a-input-group compact class="flex flex-row">
              <a-button @click="actionTakeTube">取试管</a-button>
              <a-input class="!w-64" prefix="TubeType : " v-model:value="takeTubeParams[0]"/>
            </a-input-group>
          </div>
          <div class="mt-1">
            <a-input-group compact class="flex flex-row">
              <a-button @click="actionTakeTubeCap">取试管帽</a-button>
              <a-input class="!w-64" prefix="TubeType : " v-model:value="takeTubeCapParams[0]"/>
            </a-input-group>
          </div>
          <div class="mt-1">
            <a-input-group compact class="flex flex-row">
              <a-button @click="actionPushBackTubeCapAndTakeBakTube">盖试管帽，并将试管移动回试管架中</a-button>
              <a-input class="!w-64" prefix="TubeType : " v-model:value="pushBackTubeCapAndTakeBakTubeParams[0]"/>
            </a-input-group>
          </div>
        </div>
      </a-col>
      <a-col :span="8" class="p-5">
        <div class="border rounded p-5 whitespace-pre-line h-full overflow-y-auto bg-white"
        >{{ message }}</div>
      </a-col>
    </a-row>
  </div>
</template>
<script setup>
import ApiClient from '@/utils/ApiClient';
import { ref } from 'vue';
import { LoadingOutlined } from '@ant-design/icons-vue';
const message = ref('');
const serviceParams = ref({});
const shakeTubeParams = ref(['', 3, 90]);
const takeTubeParams = ref(['']);
const takeTubeCapParams = ref(['']);
const pushBackTubeCapAndTakeBakTubeParams = ref(['']);

async function actionServiceParamsReload() {
    serviceParams.value = {};
    message.value = '';
    let client = ApiClient.getClient();
    try {
        let res = await client.call('tmp-test/get-service-params');
        message.value = res;
        serviceParams.value = res.data;
    } catch ( e ) {
        message.value = e.message
    }
}

async function actionServiceParamsSave() {
    message.value = '';
    let client = ApiClient.getClient();
    try {
        let res = await client.call('tmp-test/update-service-params', serviceParams.value);
        message.value = res;
    } catch ( e ) {
        message.value = e.message
    }
}

// execute service method
async function executeServiceMethod( method, params=[]) {
    message.value = '';
    let client = ApiClient.getClient();
    try {
        let res = await client.call('tmp-test/execute-service-method', {
            service:'motorTubeRackMoveCtrlService',
            method,
            params
        });
        message.value = res;
    } catch ( e ) {
        message.value = e.message
    }
}

function actionQuickExec( action, ... params ) {
  executeServiceMethod(action, params);
}

function actionShakeTube() {
    executeServiceMethod('ShakeTube',[
        serviceParams.value[0],
        serviceParams.value[1] * 1,
        serviceParams.value[2] * 1
    ])
}

function actionTakeTube() {
    executeServiceMethod('takeTube',[
        takeTubeParams.value[0],
    ])
}

function actionTakeTubeCap() {
    executeServiceMethod('takeTubeCap',[
        takeTubeCapParams.value[0]
    ]);
}

function actionPushBackTubeCapAndTakeBakTube() {
    executeServiceMethod('pushBackTubeCapAndTakeBakTube',[
        pushBackTubeCapAndTakeBakTubeParams.value[0]
    ]);
}
</script>