<template>
  <div class="flex w-screen h-screen justify-center">
    <div class="flex flex-col w-3/5 h-screen shadow-2xl p-10">
      <div class="flex justify-center">
        <h1 class="font-bold text-3xl">Jtag 下载</h1>
      </div>
      <div class="divider"></div>
      <div class="w-full">
        <div class="collapse bg-primary">
          <input type="checkbox" />
          <div class="collapse-title font-semibold text-lg text-white">
            自定义开发板参数
          </div>
          <div class="collapse-content bg-primary-content text-sm">
            <div class="form-control w-full my-3">
              <label class="label">
                <span class="label-text text-gray-700">开发板IP地址</span>
              </label>
              <label class="input w-full">
                <img class="h-[1em] opacity-50" src="@/assets/pwd.svg" alt="User img" />
                <input type="text" class="grow" placeholder="IP地址" v-model="boardAddress" />
              </label>
            </div>
            <div class="form-control w-full my-3">
              <label class="label">
                <span class="label-text text-gray-700">开发板端口号</span>
              </label>
              <label class="input w-full">
                <img class="h-[1em] opacity-50" src="@/assets/pwd.svg" alt="User img" />
                <input type="text" class="grow" placeholder="端口号" v-model="boardPort" />
              </label>
            </div>
          </div>
        </div>
      </div>
      <div class="divider"></div>
      <UploadCard :upload-event="uploadBitstream" :download-event="downloadBitstream">
      </UploadCard>
    </div>
  </div>
</template>

<script setup lang="ts">
import { JtagClient, type FileParameter } from "@/APIClient";
import UploadCard from "@/components/UploadCard.vue";
import { useDialogStore } from "@/stores/dialog";
import { Common } from "@/utils/Common";
import { toNumber, isUndefined } from "lodash";
import { ref } from "vue";

const jtagController = new JtagClient();
const dialog = useDialogStore();

// Models with default values
const boardAddress = ref("127.0.0.1"); // 默认IP地址
const boardPort = ref("1234"); // 默认端口号

async function uploadBitstream(bitstream: File): Promise<boolean> {
  if (isUndefined(boardAddress.value) || isUndefined(boardPort.value)) {
    dialog.error("开发板地址或端口空缺");
    return false;
  }

  try {
    const resp = await jtagController.uploadBitstream(
      boardAddress.value,
      Common.toFileParameterOrNull(bitstream),
    );
    return resp;
  } catch (e) {
    dialog.error("上传错误");
    console.error(e);
    return false;
  }
}

async function downloadBitstream(): Promise<boolean> {
  if (isUndefined(boardAddress.value) || isUndefined(boardPort.value)) {
    dialog.error("开发板地址或端口空缺");
    return false;
  }

  try {
    const resp = await jtagController.downloadBitstream(
      boardAddress.value,
      toNumber(boardPort.value),
    );
    return resp;
  } catch (e) {
    dialog.error("上传错误");
    console.error(e);
    return false;
  }
}
</script>

<style scoped lang="postcss">
@import "../assets/main.css";
</style>
