<script setup lang="ts">

import {onMounted, ref} from "vue";
import type {IConveyPlcStatus} from "@/interface/page/trayConvey/IConveyPlcStatus.ts";
import StackerApi from "@/api/stacker.ts";
import type {AppServeDataResponse} from "@/interface/api/AppServeDataResponse.ts";
import {AppServeResponseCodeEnum} from "@/constant/enums/AppServeResponseCodeEnum.ts";
import MessageUtils from "@/utils/MessageUtils.ts";

const modelValue = defineModel('modelValue', {required: true, default: false});
const props = defineProps<{
  standId: string
}>()
const trayConveyPlcStatusList = ref<IConveyPlcStatus[]>([]); // 从服务器获取的数据
const selectIndex = ref<number | null>(null);
const trayConveyPlcStatus = ref<IConveyPlcStatus>({}); // 当前状态

const close = () => {
  modelValue.value = false;
};

const indexChange = () => {
  if(selectIndex.value == null) {
    return;
  }
  trayConveyPlcStatus.value = trayConveyPlcStatusList.value[selectIndex.value];
};

const query = () => {
  // 获取数据
  trayConveyPlcStatusList.value = [];
  trayConveyPlcStatus.value = {};
  const loadingInstance = MessageUtils.loading('正在查询，请稍后...');
  StackerApi.queryStandStatus(props.standId).then((res) => {
    const responseString = JSON.stringify(res.data);
    const response = JSON.parse(responseString) as AppServeDataResponse<IConveyPlcStatus[]>;
    if (response && response.code == AppServeResponseCodeEnum.SUCCESS && response.data != undefined) {
      trayConveyPlcStatusList.value = response.data;
      MessageUtils.successMessage('查询成功');
      return;
    }
    MessageUtils.warningMessageBox(response.msg, '警告');
  }).catch(() => {}).finally( () => {
    loadingInstance.close();
  })
}
</script>

<template>
  <el-dialog v-model="modelValue" :title="props.standId + '当前状态' "  @close="close" :close-on-click-modal="false" @opened="query">
    <el-scrollbar style="height:60vh;">
      <el-row style="margin-bottom: 5px">
        <el-col :span="20">
          <el-select v-model="selectIndex" placeholder="请选择工位序号" @change="indexChange">
            <el-option v-for="(item, index) in trayConveyPlcStatusList" :key="index" :label="index + 1" :value="index"/>
          </el-select>
        </el-col>
        <el-col :span="4">
          <el-button type="primary" @click="query" style="margin-left: 3px">查询</el-button>
        </el-col>
      </el-row>
      <el-row>
        <el-card shadow="never" style="width: 100%">
          <el-form :model="trayConveyPlcStatus" label-position="right" label-width="120px" require-asterisk-position="right">
            <el-form-item label="设备号:" required>
              <el-input v-model="trayConveyPlcStatus.conveyNo" disabled/>
            </el-form-item>
            <el-form-item label="PLC任务号:" required>
              <el-input  v-model="trayConveyPlcStatus.plcTaskId" disabled/>
            </el-form-item>
            <el-form-item label="任务允许:" required>
              <el-input  v-model="trayConveyPlcStatus.taskAllow" disabled/>
            </el-form-item>
            <el-form-item label="控制方式:" required>
              <el-input  v-model="trayConveyPlcStatus.controllerModel" disabled/>
            </el-form-item>
            <el-form-item label="设备状态:" required>
              <el-input  v-model="trayConveyPlcStatus.conveyStatus" disabled/>
            </el-form-item>
            <el-form-item label="是否有AGV:" required>
              <el-input  v-model="trayConveyPlcStatus.haveAgv" disabled/>
            </el-form-item>
            <el-form-item label="载具尺寸:" required>
              <el-input  v-model="trayConveyPlcStatus.vehicleSize" disabled/>
            </el-form-item>
            <el-form-item label="载具重量:" required>
              <el-input  v-model="trayConveyPlcStatus.vehicleWeight" disabled/>
            </el-form-item>
            <el-form-item label="错误码:" required>
              <el-input  v-model="trayConveyPlcStatus.errorCode" disabled/>
            </el-form-item>
            <el-form-item label="条码:" required>
              <el-input  v-model="trayConveyPlcStatus.vehicleCode" disabled/>
            </el-form-item>
          </el-form>
        </el-card>
      </el-row>
    </el-scrollbar>
    <template #footer>
      <el-button type="danger" @click="close">关闭</el-button>
    </template>
  </el-dialog>


</template>

<style scoped>

</style>