You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
144 lines
5.2 KiB
144 lines
5.2 KiB
<template>
|
|
<main class="h-full flex justify-center items-center">
|
|
<div class="h-[70%] w-[90%] grid grid-cols-3 grid-rows-2 gap-6 text-white">
|
|
<div
|
|
class="row-span-2 relative bg-[url(@/assets/entry/entry_bg1.svg)] bg-cover bg-center bg-no-repeat rounded-[16px]"
|
|
@click="onSprayEntryClick">
|
|
<p class="text-[32px] font-semibold absolute left-6 bottom-6">喷涂设置</p>
|
|
<img src="@/assets/entry/entry_icon_1.svg" alt="icon" class="w-[90px] absolute right-6 top-6" />
|
|
</div>
|
|
<div
|
|
class="relative bg-[url(@/assets/entry/entry_bg2.svg)] bg-cover bg-center bg-no-repeat rounded-[16px]"
|
|
@click="onHistoryEntryClick">
|
|
<p class="text-[32px] font-semibold absolute left-6 bottom-6">历史喷涂</p>
|
|
<img src="@/assets/entry/entry_icon_2.svg" alt="icon" class="w-[50px] absolute right-6 top-6" />
|
|
</div>
|
|
<div
|
|
class="relative bg-[url(@/assets/entry/entry_bg3.svg)] bg-cover bg-center bg-no-repeat rounded-[16px]"
|
|
@click="onCraftEntryClick">
|
|
<p class="text-[32px] font-semibold absolute left-6 bottom-6">工艺管理</p>
|
|
<img src="@/assets/entry/entry_icon_3.svg" alt="icon" class="w-[55px] absolute right-6 top-6" />
|
|
</div>
|
|
<div
|
|
class="relative bg-[url(@/assets/entry/entry_bg4.svg)] bg-cover bg-center bg-no-repeat rounded-[16px]"
|
|
@click="onWashEntryClick">
|
|
<p class="text-[32px] font-semibold absolute left-6 bottom-6">清洗管道</p>
|
|
<img src="@/assets/entry/entry_icon_4.svg" alt="icon" class="w-[50px] absolute right-6 top-6" />
|
|
</div>
|
|
<div
|
|
class="relative bg-[url(@/assets/entry/entry_bg5.svg)] bg-cover bg-center bg-no-repeat rounded-[16px]"
|
|
@click="onInjectorEntryClick">
|
|
<p class="text-[32px] font-semibold absolute left-6 bottom-6">基质管理</p>
|
|
<img src="@/assets/entry/entry_icon_5.svg" alt="icon" class="w-[80px] absolute right-4 top-4" />
|
|
</div>
|
|
</div>
|
|
<van-overlay v-if="showWashDialog" :show="true">
|
|
<div class="flex justify-center items-center h-full">
|
|
<div class="min-w-[480px] max-w-[540px] text-primary bg-white rounded-lg">
|
|
<h1 class="my-8 text-lg font-medium text-center px-8">提示</h1>
|
|
<div class="text-lg px-4 text-center">
|
|
{{ statusStore.workStatus === "washing" ? "设备正在清洗中，是否停止清洗" : "请选择清洗类型：" }}
|
|
</div>
|
|
<footer v-if="statusStore.workStatus === 'washing'" class="flex justify-center items-center gap-6 py-10">
|
|
<button class="btn-dark px-8 py-2 text-lg min-w-[120px]" @click="onStopWash">停止清洗</button>
|
|
<button class="btn-light px-8 py-2 text-lg min-w-[120px]" @click="showWashDialog = false">取消</button>
|
|
</footer>
|
|
<footer v-else class="flex flex-col justify-center items-center gap-6 py-10">
|
|
<button class="btn-dark px-8 py-2 text-lg min-w-[120px]" @click="onStartWash('injector')">
|
|
清洗注射器管路
|
|
</button>
|
|
<button class="btn-dark px-8 py-2 text-lg min-w-[120px]" @click="onStartWash('nozzle')">
|
|
清洗喷涂部分
|
|
</button>
|
|
|
|
<button class="btn-light px-8 py-2 text-lg min-w-[120px]" @click="showWashDialog = false">取消</button>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
</van-overlay>
|
|
<van-overlay v-if="showDialog" :show="true">
|
|
<div class="flex justify-center items-center h-full">
|
|
<Dialog
|
|
:title="dialogContent.title"
|
|
:desc="dialogContent.desc"
|
|
:type="dialogContent.type"
|
|
:ok-text="dialogContent.okText"
|
|
:cancel-text="dialogContent.cancelText"
|
|
@on-ok="onOk"
|
|
@on-cancel="showDialog = false"></Dialog>
|
|
</div>
|
|
</van-overlay>
|
|
</main>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import type { DialogParam } from "@/components/Dialog.vue";
|
|
import { startWash, stopWash, type WashType } from "@/services/globalCmd/globalCmd";
|
|
import { ElMessage } from "element-plus";
|
|
import { ref } from "vue";
|
|
import { useRouter } from "vue-router";
|
|
import Dialog from "@/components/Dialog.vue";
|
|
import { useEquipmentStatusStore } from "@/stores/equipmentStatus";
|
|
|
|
const router = useRouter();
|
|
const statusStore = useEquipmentStatusStore();
|
|
|
|
const dialogContent = ref<DialogParam>({
|
|
title: "提示",
|
|
desc: "确定清洗管道？",
|
|
type: "confirm",
|
|
okText: "清洗",
|
|
cancelText: "关闭",
|
|
_brand: "wash",
|
|
});
|
|
|
|
const showDialog = ref(false);
|
|
const showWashDialog = ref(false);
|
|
|
|
function onEnvironmentEntryClick() {
|
|
router.push("/environment");
|
|
}
|
|
function onHistoryEntryClick() {
|
|
router.push("/history");
|
|
}
|
|
function onSprayEntryClick() {
|
|
router.push("/preSpray");
|
|
}
|
|
function onCraftEntryClick() {
|
|
router.push("/matrixCraft");
|
|
}
|
|
function onInjectorEntryClick() {
|
|
router.push("/matrixManage");
|
|
}
|
|
function onPrintEntryClick() {
|
|
router.push("/print");
|
|
}
|
|
function onWashEntryClick() {
|
|
if (statusStore.workStatus === "idle" || statusStore.workStatus === "washing") {
|
|
showWashDialog.value = true;
|
|
} else {
|
|
ElMessage.warning("设备正在工作中，请稍候清洗");
|
|
}
|
|
}
|
|
function onOk() {
|
|
showDialog.value = false;
|
|
}
|
|
function onStartWash(type: WashType) {
|
|
showWashDialog.value = false;
|
|
startWash({ type }).then(res => {
|
|
if (res.success) {
|
|
} else {
|
|
ElMessage.error(res.msg);
|
|
}
|
|
});
|
|
}
|
|
function onStopWash() {
|
|
showWashDialog.value = false;
|
|
stopWash({}).then(res => {
|
|
if (res.success) {
|
|
} else {
|
|
ElMessage.error(res.msg);
|
|
}
|
|
});
|
|
}
|
|
</script>
|