<template>
    <a-flex justify="flex-start">
        <a-button @click="sendOrderComd(11)" :disabled="Status != 0" v-if="isShowStart == true">
            <template #icon>
                <em class="icon icon-play"></em>
            </template>
            {{ $t("LongtecProCessDraw.StartStep") }}
        </a-button>
        <a-button @click="sendOrderComd(15)" :disabled="Status != 1 && Status != 3" v-if="isShowStop == true">
            <template #icon>
                <em class="icon icon-stop"></em>
            </template>
            {{ $t("LongtecProCessDraw.StopStep") }}
        </a-button>
        <a-button @click="sendOrderComd(13)" :disabled="Status != 1" v-if="isShowPause">
            <template #icon>
                <em class="icon icon-stop"></em>
            </template>
            {{ $t("LongtecProCessDraw.PauseStep") }}
        </a-button>
        <a-button @click="sendOrderComd(14)" :disabled="Status != 3" v-if="isShowContinue">
            <template #icon>
                <em class="icon icon-step-forward"></em>
            </template>
            {{ $t("LongtecProCessDraw.continueStep") }}
        </a-button>
        <a-button @click="sendOrderComd(16)" v-if="isShowCancel" :disabled="Status != 1 && Status != 3">
            <template #icon>
                <em class="icon icon-times"></em>
            </template>
            {{ $t("LongtecProCessDraw.CancelStep") }}
        </a-button>
        <a-button @click="sendOrderComd(19)" v-if="isShowReset" :disabled="Status != 2">
            <template #icon>
                <em class="icon icon-repeat"></em>
            </template>
            {{ $t("LongtecProCessDraw.ResetStep") }}
        </a-button>
        <a-button @click="sendOrderComd(12)" :disabled="Status != 1 && Status != 3" v-if="isShowCompleted">
            <template #icon>
                <em class="icon icon-check"></em>
            </template>
            {{ $t("LongtecProCessDraw.CompletedStep") }}
        </a-button>
    </a-flex>
</template>

<script setup lang="ts">
import { message } from "ant-design-vue"
import Api from "./Api"
import { ref, onMounted } from "vue"
const props = defineProps({
    Status: {
        type: Number,
        default: 0
    },
    //按钮的显示隐藏通过权限去控制，是否可操作，通过状态去控制
    isShowStart: {
        type: Boolean,
        default: true
    },
    isShowStop: {
        type: Boolean,
        default: true
    },
    isShowCompleted: {
        type: Boolean,
        default: true
    },
    isShowPause: {
        type: Boolean,
        default: true
    },
    isShowContinue: {
        type: Boolean,
        default: true
    },
    isShowCancel: {
        type: Boolean,
        default: true
    },
    isShowReset: {
        type: Boolean,
        default: true
    },
    PlanBatch: {
        type: String,
        default: ""
    },
    StartMode: {
        type: Number,
        default: 0
    },
    IsFormular: {
        type: Boolean,
        default: false
    },
    // DetailOrderKey: {
    //     type: Number,
    //     default: 0
    // },
    formData: {
        type: Object
    }
})

// Command 命令编号  
// Phase启动 11
// Phase完工 12 运行中才能完工
// Phase暂停 13
// Phase继续 14
// Phase停止 15
// Phase取消 16 //不限任何状态
// Phase复位 19 //不限任何状态

// const handleStart = function () {
//     //启动
//     sendOrderComd(11)
// }

// const handleStop = function () {
//     //停止
//     sendOrderComd(15)
// }

// const handlePase = function () {
//     //暂停
//     sendOrderComd(13)
// }

// const handleContinue = function () {
//     //继续
//     sendOrderComd(14)
// }

// const handleCancel = function () {
//     //取消
//     sendOrderComd(16)
// }

// const handleReset = function () {
//     //复位
//     sendOrderComd(19)
// }


// const handleCompleted = function () {
//     //完工
//     sendOrderComd(12)
// }

const DetailOrderKey = ref(0)


const initFormVal = function () {
    const newValue = props.formData
    if (newValue) {
        let cell = newValue.cell
        DetailOrderKey.value = cell.DetailOrderKey;
    }
}

const sendOrderComd = function (cmd: number) {
    const sendData = {
        PlanBatch: props.PlanBatch,
        Command: cmd,
        StartMode: props.StartMode,
        IsFormular: props.IsFormular,
        StartParam: DetailOrderKey.value
    }
    Api.sendPhaseCommand(sendData).then(() => {
        //接口调用成功
        message.success("接口调用成功")
    })
}

onMounted(() => {
    initFormVal()
})

</script>