From 6310133456a75880817f0a5103b272236dda45d4 Mon Sep 17 00:00:00 2001
From: zhangjiming <zhangjiming@costrip.cn>
Date: Sun, 2 Mar 2025 21:20:56 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=96=B7=E6=B6=82=E5=8F=82?=
 =?UTF-8?q?=E6=95=B0UI,=E6=B7=BB=E5=8A=A0=E5=90=88=E6=B3=95=E6=80=A7?=
 =?UTF-8?q?=E6=A3=80=E6=9F=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/icon_info.svg            |   1 +
 src/components/SprayParam.vue       |  25 +++++--
 src/services/globalCmd/cmdTypes.ts  |  26 +++++++
 src/services/globalCmd/globalCmd.ts |   2 +-
 src/views/SprayView.vue             | 133 +++++++++++++++++-------------------
 5 files changed, 109 insertions(+), 78 deletions(-)
 create mode 100644 src/assets/icon_info.svg

diff --git a/src/assets/icon_info.svg b/src/assets/icon_info.svg
new file mode 100644
index 0000000..1557e75
--- /dev/null
+++ b/src/assets/icon_info.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 44C29.5228 44 34.5228 41.7614 38.1421 38.1421C41.7614 34.5228 44 29.5228 44 24C44 18.4772 41.7614 13.4772 38.1421 9.85786C34.5228 6.23858 29.5228 4 24 4C18.4772 4 13.4772 6.23858 9.85786 9.85786C6.23858 13.4772 4 18.4772 4 24C4 29.5228 6.23858 34.5228 9.85786 38.1421C13.4772 41.7614 18.4772 44 24 44Z" fill="none" stroke="#26509C" stroke-width="4" stroke-linejoin="round"/><path fill-rule="evenodd" clip-rule="evenodd" d="M24 11C25.3807 11 26.5 12.1193 26.5 13.5C26.5 14.8807 25.3807 16 24 16C22.6193 16 21.5 14.8807 21.5 13.5C21.5 12.1193 22.6193 11 24 11Z" fill="#26509C"/><path d="M24.5 34V20H23.5H22.5" stroke="#26509C" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M21 34H28" stroke="#26509C" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>
\ No newline at end of file
diff --git a/src/components/SprayParam.vue b/src/components/SprayParam.vue
index 5d880d1..612a201 100644
--- a/src/components/SprayParam.vue
+++ b/src/components/SprayParam.vue
@@ -65,15 +65,16 @@
 </template>
 
 <script setup lang="ts">
-import type { WorkType } from "@/services/globalCmd/cmdTypes";
-import { ref } from "vue";
+import { checkSprayParamValid, type WorkType } from "@/services/globalCmd/cmdTypes";
+import { ref, watch } from "vue";
 import route_v from "@/assets/route_vertical.png";
 import route_v2 from "@/assets/route_vertical2.png";
 import route_h from "@/assets/route_horizontal.png";
 import route_h2 from "@/assets/route_horizontal2.png";
+import { ElMessage } from "element-plus";
 
 const props = defineProps<{
-	sprayParam: WorkType;
+	sprayParam: Partial<WorkType>;
 }>();
 const emit = defineEmits<{
 	(e: "save", param: WorkType): void;
@@ -88,7 +89,21 @@ function sprayDirection(direction: "h" | "v") {
 	selectCraft.value.routeType = direction === "h" ? 1 : 2;
 }
 function onSaveClick() {
-	//TODO 合法性检查
-	emit("save", selectCraft.value);
+	const check = checkSprayParamValid(selectCraft.value);
+	if (!check[0]) {
+		ElMessage.error(check[1]);
+		return;
+	}
+	if (!selectCraft.value.needPower) {
+		selectCraft.value.voltage = 0;
+	}
+	emit("save", selectCraft.value as WorkType);
 }
+
+watch(
+	() => props.sprayParam,
+	p => {
+		selectCraft.value = p;
+	}
+);
 </script>
diff --git a/src/services/globalCmd/cmdTypes.ts b/src/services/globalCmd/cmdTypes.ts
index 60be61e..9b36621 100644
--- a/src/services/globalCmd/cmdTypes.ts
+++ b/src/services/globalCmd/cmdTypes.ts
@@ -17,6 +17,7 @@ type PositionType = {
 	y1: number;
 	x2: number;
 	y2: number;
+	index: number;
 };
 
 export type WorkType = {
@@ -32,6 +33,31 @@ export type WorkType = {
 	position: PositionType[];
 };
 
+export function checkSprayParamValid(p: Partial<WorkType>): [boolean, string] {
+	if (typeof p.height !== "number") {
+		return [false, "请输入正确的z轴高度"];
+	}
+	if (typeof p.nitrogenAirPressure !== "number") {
+		return [false, "请输入正确的氮气气压"];
+	}
+	if (typeof p.nitrogenFlowVelocity !== "number") {
+		return [false, "请输入正确的氮气流速"];
+	}
+	if (typeof p.matrixFlowVelocity !== "number") {
+		return [false, "请输入正确的基质流速"];
+	}
+	if (typeof p.voltage !== "number") {
+		return [false, "请输入正确的喷嘴电压"];
+	}
+	if (typeof p.movementSpeed !== "number") {
+		return [false, "请输入正确的移动速度"];
+	}
+	if (typeof p.space !== "number") {
+		return [false, "请输入正确的行间距"];
+	}
+	return [true, ""];
+}
+
 export type MachineryType = {
 	axis: string;
 	position: string | number;
diff --git a/src/services/globalCmd/globalCmd.ts b/src/services/globalCmd/globalCmd.ts
index d266238..ddb52a1 100644
--- a/src/services/globalCmd/globalCmd.ts
+++ b/src/services/globalCmd/globalCmd.ts
@@ -65,7 +65,7 @@ export function rotate(params: any) {
 	return httpRequest<BaseResponse<string>>({ url: "/api/cmd/rotate", params, method: "POST" });
 }
 
-type SprayParam = {
+export type SprayParam = {
 	matrixId: number;
 	matrixCraftId: number;
 } & WorkType;
diff --git a/src/views/SprayView.vue b/src/views/SprayView.vue
index 1b25475..04d9823 100644
--- a/src/views/SprayView.vue
+++ b/src/views/SprayView.vue
@@ -2,11 +2,42 @@
 	<div class="px-6 pt-4 pb-3 flex justify-between">
 		<div class="w-full">
 			<div class="flex items-center mb-3 gap-5">
-				<p class="font-medium text-primary">喷涂路线</p>
-				<img :src="selectCraft.routeType === 1 ? route_v : route_v2" alt="icon" @click="sprayDirection('v')" />
-				<img :src="selectCraft.routeType === 1 ? route_h2 : route_h" alt="icon" @click="sprayDirection('h')" />
 				<button class="btn-dark px-8 py-2 text-lg" @click="onStartSpray">开始喷涂</button>
 				<button class="btn-light px-8 py-2 text-lg" @click="onStopSpray">停止喷涂</button>
+				<section class="flex items-center gap-3 px-4 text-base ml-auto">
+					<div class="flex items-center">
+						<span class="self-center text-right text-primary font-medium mr-3">选择基质</span>
+						<el-select v-model="selectMatrix" placeholder="Select" style="width: 120px" @change="onMatrixChange">
+							<el-option
+								v-for="item in settingStore.matrixList"
+								:key="item.id"
+								:label="item.name"
+								:value="item.id" />
+						</el-select>
+					</div>
+					<div class="flex items-center">
+						<span class="self-center text-right text-primary font-medium mr-3">工艺</span>
+						<el-select
+							:disabled="craftList.length === 0"
+							v-model="selectCraft"
+							placeholder="Select"
+							style="width: 120px"
+							@change="onCraftChange">
+							<el-option v-for="item in craftList" :key="item.id" :label="item.name" :value="item.id" />
+						</el-select>
+					</div>
+					<el-popover placement="bottom" :width="380" trigger="click">
+						<template #reference>
+							<div class="text-primary underline flex items-center gap-1">
+								<span>详细参数</span>
+								<img src="@/assets/icon_info.svg" alt="info" />
+							</div>
+						</template>
+						<template #default>
+							<SprayParam :sprayParam="selectCraft" @save="updateSprayParam" />
+						</template>
+					</el-popover>
+				</section>
 			</div>
 
 			<section class="flex flex-col items-start">
@@ -71,60 +102,13 @@
 				</van-checkbox-group>
 			</section>
 		</div>
-		<div class="shadow-card absolute top-[calc(var(--headerHeight)+16px)] right-[calc(var(--borderWidth)+20px)] w-[400px]">
-			<el-collapse accordion>
-				<el-collapse-item name="1">
-					<template #title>
-						<section class="flex items-center gap-3 px-4 text-base">
-							<div>
-								<span class="self-center text-right text-primary font-medium mr-3">选择基质</span>
-								<!-- <input
-									type="text"
-									class="border-none outline-none h-[28px] w-[80px] bg-[#E8ECF7] text-primary font-medium rounded-md text-lg text-center" /> -->
-
-								<el-select
-									v-model="selectMatrix"
-									placeholder="Select"
-									style="width: 120px"
-									@change="onMatrixChange">
-									<el-option
-										v-for="item in settingStore.matrixList"
-										:key="item.id"
-										:label="item.name"
-										:value="item.id" />
-								</el-select>
-							</div>
-							<div>
-								<span class="self-center text-right text-primary font-medium mr-3">工艺</span>
-								<!-- <input
-									type="text"
-									class="border-none outline-none h-[28px] w-[80px] bg-[#E8ECF7] text-primary font-medium rounded-md text-lg text-center" /> -->
-
-								<el-select
-									:disabled="craftList.length === 0"
-									v-model="selectCraft"
-									placeholder="Select"
-									style="width: 120px"
-									@change="onCraftChange">
-									<el-option v-for="item in craftList" :key="item.id" :label="item.name" :value="item.id" />
-								</el-select>
-							</div>
-						</section>
-					</template>
-					<SprayParam :sprayParam="selectCraft" @save="updateSprayParam" />
-				</el-collapse-item>
-			</el-collapse>
-		</div>
+		<!-- <SprayParam :sprayParam="selectCraft" @save="updateSprayParam" /> -->
 	</div>
 </template>
 
 <script setup lang="ts">
-import route_v from "@/assets/route_vertical.png";
-import route_v2 from "@/assets/route_vertical2.png";
-import route_h from "@/assets/route_horizontal.png";
-import route_h2 from "@/assets/route_horizontal2.png";
 import Spray, { type GridArea } from "@/components/Spray.vue";
-import { ref } from "vue";
+import { onMounted, ref } from "vue";
 import { startSpray, stopWork } from "@/services/globalCmd/globalCmd";
 import type { WorkType } from "@/services/globalCmd/cmdTypes";
 import { ElMessage } from "element-plus";
@@ -134,20 +118,20 @@ import type { CraftItem } from "@/services/matrix/type";
 import { getListByMatrixId } from "@/services/matrix/craft";
 import SprayParam from "@/components/SprayParam.vue";
 
-const defaultCraft: CraftItem = {
+const defaultCraft: Partial<CraftItem> = {
 	id: 0,
 	name: "default",
 	matrixId: 0,
 	routeType: 1,
-	space: 20,
-	nitrogenFlowVelocity: 20,
-	nitrogenAirPressure: 20,
-	matrixFlowVelocity: 220,
-	voltage: 220,
+	space: undefined,
+	nitrogenFlowVelocity: undefined,
+	nitrogenAirPressure: undefined,
+	matrixFlowVelocity: undefined,
+	voltage: undefined,
 	needPower: false,
-	height: 10,
-	movementSpeed: 20,
-	position: [{ x1: 10, y1: 10, x2: 20, y2: 20 }],
+	height: undefined,
+	movementSpeed: undefined,
+	position: [],
 };
 
 const settingStore = useSettingStore();
@@ -157,27 +141,27 @@ const selectMatrix = ref<MatrixItem>(
 );
 
 const craftList = ref<CraftItem[]>([]);
-const selectCraft = ref<CraftItem>(defaultCraft);
+const selectCraft = ref<Partial<CraftItem>>(defaultCraft);
 
 const selectedArea = ref<GridArea>();
 const checked = ref(["a", "b"]);
 
+onMounted(() => {
+	if (settingStore.matrixList.length > 0) {
+		onMatrixChange(settingStore.matrixList[0].id);
+	}
+});
+
 function onSelectArea(area: GridArea) {
 	selectedArea.value = area;
 }
-function needPower(need: boolean) {
-	selectCraft.value.needPower = need;
-}
-function sprayDirection(direction: "h" | "v") {
-	selectCraft.value.routeType = direction === "h" ? 1 : 2;
-}
 
 function onMatrixChange(val: number) {
 	getListByMatrixId({ matrixId: val }).then(res => {
 		if (res.success) {
 			craftList.value = res.data || [];
 			if (res.data.length > 0) {
-				selectCraft.value = res.data[0];
+				selectCraft.value = { ...res.data[0], needPower: res.data[0].voltage > 0 };
 			} else {
 				selectCraft.value = defaultCraft;
 			}
@@ -199,12 +183,17 @@ function onStartSpray() {
 			y1: selectedArea.value?.yStart || 10,
 			x2: selectedArea.value?.xEnd || 20,
 			y2: selectedArea.value?.yEnd || 20,
+			index: 0,
 		},
 	];
 	const params = selectCraft.value.needPower ? selectCraft : { ...selectCraft, voltage: 0 };
 	console.log(params);
-
-	startSpray({ ...selectCraft.value, matrixCraftId: selectCraft.value.id }).then(res => {
+	//TODO 检查参数合法性
+	startSpray({
+		...(selectCraft.value as CraftItem),
+		matrixId: selectMatrix.value.id,
+		matrixCraftId: selectCraft.value.id || 0,
+	}).then(res => {
 		if (res.success) {
 		} else {
 			ElMessage.error(res.msg);
@@ -222,7 +211,7 @@ function onStopSpray() {
 }
 
 function updateSprayParam(p: WorkType) {
-	console.log(p)
+	console.log(p);
 	selectCraft.value = p as CraftItem;
 }
 </script>