前端提交1103

src/views/touchScreen/main/index.vue

@@ -10,6 +10,7 @@
             <template v-slot:append>
                 <kbTime></kbTime>
                 <!-- <v-btn icon="mdi-magnify"></v-btn> -->
+                <v-btn icon="mdi-serial-port" @click="doGetPort"></v-btn>
                 <v-btn icon="mdi-overscan" @click="doScreen"></v-btn>
             </template>
         </v-app-bar>
@@ -29,6 +30,7 @@
         <v-main>
             <v-fade-transition>
                 <Report v-if="menuActivated === '报工'"></Report>
+                <Quality v-if="menuActivated === '质量'"></Quality>
             </v-fade-transition>
             <!-- 底部logo -->
             <v-footer class="footer-center" app>
@@ -45,6 +47,7 @@
 import kbTime from '../components/kbTime.vue'
 
 import Report from '../report/index.vue'
+import Quality from '../quality/index.vue'
 const { proxy } = getCurrentInstance()
 // 返回主页面
 const goBack = () => {
@@ -144,9 +147,41 @@ import { useDisplay } from "vuetify";
 const { mobile, name } = useDisplay();
 
 onMounted(() => {
+    checkSerial()
     console.log('是否是移动设备', mobile.value); // false
     console.log('桌面大小', name.value); // false
 });
+
+
+
+/// ================= 串口通讯 =================
+function checkSerial() {
+    if ("serial" in navigator) {
+        console.log(true);
+    } else {
+        console.log(false);
+    }
+}
+const port = ref(null)
+const ports = ref([])
+async function doGetPort() {
+    try {
+        const portInfo = await navigator.serial.requestPort();
+        port.value = await portInfo.open({ baudRate: 9600 });
+        port.value.addEventListener('data', (event) => {
+            const decoder = new TextDecoder('utf-8');
+            const data = decoder.decode(event.data);
+            console.log('接收到串口数据:', data);
+        });
+        console.log('串口已打开');
+    } catch (error) {
+        console.error('串口请求或打开失败:', error);
+    }
+}
+
+/// ==========================================
+
+
 </script>
 
 <style scoped>

src/views/touchScreen/quality/index.vue

@@ -0,0 +1,78 @@
+<template>
+	<v-container fluid class="bg-indigo-darken-4">
+		<v-row>
+			<v-col cols="8">
+				<v-card color="blue-darken-4" class="left-content">
+					<v-tabs v-model="tab" bg-color="primary">
+						<v-tab value="工序报工">工序报工</v-tab>
+						<v-tab value="此工单工序记录">此工单工序记录</v-tab>
+						<v-tab value="此工序今日记录">此工序今日记录</v-tab>
+						<v-tab value="员工报工记录">员工报工记录</v-tab>
+						<v-tab value="工单查看">工单查看</v-tab>
+					</v-tabs>
+					<v-card-text>
+						<v-fade-transition>
+							<v-tabs-window v-model="tab">
+								<v-tabs-window-item value="工序报工">
+									<el-card class="mt-4">
+
+									</el-card>
+								</v-tabs-window-item>
+								<v-tabs-window-item value="此工单工序记录">
+									<el-card class="mt-4">
+									</el-card>
+								</v-tabs-window-item>
+								<v-tabs-window-item value="此工序今日记录">
+									<el-card class="mt-4">
+									</el-card>
+								</v-tabs-window-item>
+								<v-tabs-window-item value="员工报工记录">
+									<el-card class="mt-4">
+									</el-card>
+								</v-tabs-window-item>
+								<v-tabs-window-item value="工单查看">
+									<el-card class="mt-4">
+									</el-card>
+								</v-tabs-window-item>
+							</v-tabs-window>
+						</v-fade-transition>
+					</v-card-text>
+				</v-card>
+			</v-col>
+			<v-col cols="4">
+				<v-card color="blue-darken-4" class="right-content">
+
+				</v-card>
+			</v-col>
+		</v-row>
+		<!-- 反馈框 -->
+		<v-dialog v-model="dialog.show" width="auto">
+			<v-card :class="dialog.class" min-width="400" :prepend-icon="dialog.icon" :text="dialog.text"
+				:title="dialog.title">
+				<template v-slot:actions>
+					<v-btn class="ms-auto" text="确认" @click="dialog.show = false"></v-btn>
+				</template>
+			</v-card>
+		</v-dialog>
+	</v-container>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+// Define reactive state
+const title = ref('Vue 3.0 Setup Syntax Sugar');
+const message = ref('This is a basic quality inspection template.');
+const counter = ref(0);
+
+// Define methods
+const incrementCounter = () => {
+	counter.value++;
+};
+</script>
+
+<style scoped>
+h1 {
+	color: #42b983;
+}
+</style>