From f39be46f06f599a1b1a3418015925136e042d7a1 Mon Sep 17 00:00:00 2001
From: LiLongLong <13717757313@163.com>
Date: Wed, 12 Feb 2025 09:57:01 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=87=AA=E9=80=82=E5=BA=94?=
 =?UTF-8?q?=E4=B8=BArem?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/OverlayModal.vue                | 47 +++++-------------
 src/services/axios.ts                          |  3 +-
 src/views/addLiquid/index.vue                  |  8 ++--
 src/views/components/Footer.vue                | 22 ++++-----
 src/views/components/Header.vue                | 46 +++++++++---------
 src/views/components/Menu.vue                  | 12 ++---
 src/views/components/menu.ts                   |  2 +-
 src/views/graphite/components/HeatPosition.vue | 66 +++++++++++++-------------
 src/views/graphite/components/TakePickture.vue | 25 +++++-----
 src/views/graphite/index.vue                   | 22 ++++-----
 vite.config.ts                                 |  2 +-
 11 files changed, 117 insertions(+), 138 deletions(-)

diff --git a/src/components/OverlayModal.vue b/src/components/OverlayModal.vue
index d8ca6d0..0063206 100644
--- a/src/components/OverlayModal.vue
+++ b/src/components/OverlayModal.vue
@@ -1,51 +1,28 @@
 <template>
-    <van-overlay :show="visible" style="z-index: 999;">
+    <div v-if="visible" class="overlay">
         <div class="overlay_modal" >
           <slot></slot>
         </div>
-      </van-overlay>
+    </div>
 </template>
 <script lang="ts" setup>
-    import { ref, onMounted, watch } from "vue"
-    const emits = defineEmits(['confirm', 'changeVisible'])
-
-    const props = defineProps({
-        title:{
-            type: String,
-            default: ''
-        },
+    defineProps({
         visible:{
             type: Boolean,
             default: false
         },
-        list:{
-            type: Array,
-            default: ()=>[]
-        },
-        width:{
-            type:String,
-            default:'32rem'
-        },
-        height:{
-            type:String,
-            default:'25rem'
-        },
-        item:{
-            type: Object
-        }
     })
-
-    const columnsList = ref<any>(props.list)
-
-    const onSubmit = () => {
-        emits('confirm')
-    }
-
-    const onCancel = ()=> {
-        emits("changeVisible", false)
-    }
 </script>
 <style scoped>
+    .overlay{
+        background: rgba(0, 0, 0, .7);
+        width: 87.5rem;
+        height: 57.5rem;
+        position: absolute;
+        top: 0px;
+        left: 0px;
+        z-index: 999
+    }
     .overlay_modal{
         display: flex;
         justify-content: center;
diff --git a/src/services/axios.ts b/src/services/axios.ts
index f6455e8..268d1fd 100644
--- a/src/services/axios.ts
+++ b/src/services/axios.ts
@@ -1,7 +1,8 @@
 import { eventBus } from "@/eventBus";
 import axios, { AxiosHeaders } from "axios";
 
-const url = `http://${import.meta.env.VITE_API_HOST}:${import.meta.env.VITE_API_PORT}`;
+// const url = `http://${import.meta.env.VITE_API_HOST}:${import.meta.env.VITE_API_PORT}`;
+const url = 'http://192.168.1.119:8080'
 
 const apiClient = axios.create({
 	baseURL: url, // 设置请求的根路径
diff --git a/src/views/addLiquid/index.vue b/src/views/addLiquid/index.vue
index 85c2f70..e013f46 100644
--- a/src/views/addLiquid/index.vue
+++ b/src/views/addLiquid/index.vue
@@ -134,10 +134,10 @@
                 display: flex;
                 justify-content: center;
                 align-items: center;
-                gap: 50px;
+                gap: 1.625rem;
                 .arrow_img{
-                    width: 15px;
-                    height: 23px;
+                    width: .5rem;
+                    height: .75rem;
                 }
             }
         }
@@ -148,7 +148,7 @@
                 position: relative;
                 width: 5.125rem;
                 height: 7.25rem;
-                margin-top: 36px;
+                margin-top: 1.125rem;
                 margin-left: 3.75rem;
                 display: flex;
                 justify-content: center;
diff --git a/src/views/components/Footer.vue b/src/views/components/Footer.vue
index c6d4c80..733be92 100644
--- a/src/views/components/Footer.vue
+++ b/src/views/components/Footer.vue
@@ -51,38 +51,38 @@ const showWastePopover = ref(false)
         align-items: center;
         border-radius: 5px;
         background: #FFFFFF;
-        height: 80px;
-        width: 1268px;
-        margin-left: 380px;
+        height: 40px;
+        width: 39.625rem;
+        margin-left: 11.875rem;
     }
     .footer_waste{
         display: flex;
         align-items: center;
         border-radius: 5px;
-        width: 430px;
-        height: 80px;
+        width: 13.4375rem;
+        height: 2.5rem;
         background: #FFFFFF;
         margin-left: 10px;
     }
 
     .footer_normal{
-        margin-left: 100px;
+        margin-left: 3.125rem;
     }
 
     .text_size{
-        font-size:30px;
+        font-size:1rem;
         padding-right: 5px;
     }
     .footer_container{
         display: flex;
         align-items: center;
         border-radius: 5px;
-        width: 500px;
-        height: 80px;
+        width: 15.625rem;
+        height: 2.5rem;
         background: #FFFFFF;
         .circle {
-            width: 30px; 
-            height: 30px; 
+            width: 1rem; 
+            height: 1rem; 
             background-color: green; 
             border-radius: 50%; 
             margin-left: 10px;
diff --git a/src/views/components/Header.vue b/src/views/components/Header.vue
index 68d43cd..2297c20 100644
--- a/src/views/components/Header.vue
+++ b/src/views/components/Header.vue
@@ -39,23 +39,23 @@
         height: var(--headerHeight);
         .header_logo{
             display: flex;
-            font-size: 36px;
+            font-size: 1.125rem;
             align-items: center;
-            width: 700px;
+            width: 21.875rem;
             color: #8799AB;
             gap: 5px;
-            padding-left: 50px;
+            padding-left: 1.5625rem;
             
             .logo{
-                height:85px;
-                width:85px;
+                height:2.75rem;
+                width:2.625rem;
             }
         }
         
         .header_time{
-            width: 375px;
-            height: 80px;
-            font-size: 28px;
+            width: 11.875rem;
+            height: 2.5rem;
+            font-size: .875rem;
             display: flex;
             align-items: center;
             margin-left: 54%;
@@ -68,18 +68,18 @@
             display: flex;
             align-items: center;
             border-radius: 5px;
-            width: 444px;
-            height: 80px;
+            width: 13.875rem;
+            height: 2.5rem;
             background: #FFFFFF;
         }
 
         .header_container{
-            margin-left: 10px;
+            margin-left: 3.125rem;
             display: flex;
             align-items: center;
             border-radius: 5px;
-            width: 500px;
-            height: 80px;
+            width: 15.625rem;
+            height: 2.5rem;
             background: #FFFFFF;
             .waste_status{
                 padding:5px 5px;
@@ -98,29 +98,29 @@
             align-items: center;
             justify-content: flex-end;
             gap: 5px;
-            margin-left: 30px;            
+            margin-left: .9375rem;            
 
         }
 
         .user_name{
-            font-size: 34px;
+            font-size: 1rem;
             color: #393F46;
         }
     }
 
     .circle {
-      width: 30px; 
-      height: 30px; 
+      width: .9375rem; 
+      height: .9375rem; 
       background-color: green; 
       border-radius: 50%; 
-      margin-left: 10px;
+      margin-left: .3125rem;
     }
 
     :deep(.van-dropdown-menu__bar){
         background-color: #1871F8;
         border-radius: 5px;
-        height: 30px;
-        width: 90px;
+        height: .1rem;
+        width: 2.875rem;
         .van-ellipsis{
             color:white;
         }    
@@ -128,12 +128,12 @@
     }
 
     :deep(.van-dropdown-item__content){
-        width: 150px;
-        margin-left: 170px;
+        width: 4.75rem;
+        margin-left: 5.375rem;
     }
 
     .text_size{
-        font-size:30px;
+        font-size:1rem;
         padding-right: 5px;
     }
     
diff --git a/src/views/components/Menu.vue b/src/views/components/Menu.vue
index 84265f5..b444c85 100644
--- a/src/views/components/Menu.vue
+++ b/src/views/components/Menu.vue
@@ -63,15 +63,15 @@
     .sidebar{
         width: calc(var(--menuAreaWidth) - 2.5rem);
         /* padding: 0 1.125rem; */
-        font-size: 30px
+        font-size: 1rem
     }
     .menu{
         width: var(--menuAreaWidth);
     }
 
     .menn_text{
-        font-size: 30px;
-        margin-top:20px;
+        font-size: 1rem;
+        margin-top:.625rem;
     }
 
     .van-sidebar {
@@ -82,7 +82,7 @@
 
     .menn_btn{
         border-radius: 10px;
-        height: 100px;
+        height: 3.125rem;
         display: flex;
         align-items: center;
         
@@ -95,8 +95,8 @@
     }
 
     .menu_icon{
-        width: 80px;
-        height: 80px;
+        width: 2.5rem;
+        height: 2.5rem;
     }
     
 </style>
\ No newline at end of file
diff --git a/src/views/components/menu.ts b/src/views/components/menu.ts
index 6fc1790..15dc7ac 100644
--- a/src/views/components/menu.ts
+++ b/src/views/components/menu.ts
@@ -1,6 +1,6 @@
 export const menuIcon = [{
     id: 0,
-    name: '实验操作',
+    name: '任务操作',
     s_icon: '/src/assets/menuIcon/s_home.svg',
     n_icon: '/src/assets/menuIcon/n_home.svg',
     path: '/graphite',
diff --git a/src/views/graphite/components/HeatPosition.vue b/src/views/graphite/components/HeatPosition.vue
index 9404871..ef47d01 100644
--- a/src/views/graphite/components/HeatPosition.vue
+++ b/src/views/graphite/components/HeatPosition.vue
@@ -1,11 +1,11 @@
 <template>
-    <div class="heat_main" @click="onSelectTray" :style="`${posIndex === currentIndex && isSelect ? 'border:7px solid #275EFB' : ''}`">
+    <div class="heat_main"  :style="`${posIndex === currentIndex && isSelect ? 'border:7px solid #275EFB' : ''}`">
       <section class="heat_pos_text">
           <div class="pos_text">{{ `A-${posIndex || ''}` }}</div>
           <div class="pos_text pos_state">已放置</div>
       </section>
 
-      <section class="heat_pos" :style="`background:${(trayInfo?.id) ? '#384D5D':''}`">
+      <section class="heat_pos" :style="`background:${(trayInfo?.id) ? '#384D5D':''}`" @click.stop="onSelectTray">
         <div
           v-for="(isActive, index) in ballStates"
           :key="index"
@@ -141,21 +141,21 @@
     @use "@/assets/style/mixin.scss" as *;
   .heat_main{
     border: 1px solid #E9F3FF;
-    width: 366px;
-    height: 580px;
+    width: 11.5rem;
+    height: 18.125rem;
     border-radius: 20px;
     background: #E9F3FF;
-    margin-top: 110px;
+    margin-top: 3.5rem;
     
     
   }
   .heat_pos_text{
     display: flex;
-    height: 55px;
-    padding-left: 29px;
-    padding-right: 23px;
+    height: 1.75rem;
+    padding-left: .875rem;
+    padding-right: .75rem;
     .pos_text{
-      font-size: 26px;
+      font-size: .8125rem;
       font-weight: 500;
       line-height: normal;
       display: flex;
@@ -214,8 +214,8 @@
   }
   .inner-circle {
     border-radius: 50%;
-    width: 50px;
-    height: 50px;
+    width: 1.625rem;
+    height: 1.625rem;
     background-color: rgb(212, 212, 212);
   }
   .heat_footer{
@@ -224,77 +224,77 @@
     margin-top: 10px;
     margin-left: 5px;
     .heat_temperature{
-      height: 46px;
-      width: 330px;
+      height: 1.625rem;
+      width: 10.375rem;
       background: #FFFFFF;
       box-shadow: inset 2px 2px 4px 0px rgba(204, 204, 204, 0.3);
       border-radius: 5px;
       display: flex;
       align-items: center;
       justify-content: center;
-      margin-left: 10px;
+      margin-left: .375rem;
       .target_temp{
         color: #384D5D;
-        font-size: 22px;
+        font-size: .75rem;
       }
 
       .heating{
         color: #FE0A0A;
-        font-size: 28px;
-        margin-left: 70px;
+        font-size: .875rem;
+        margin-left: 2.25rem;
       }
     }
 
     .temp_text{
-      width: 109px;
-      height: 52px;
+      width: 6.625rem;
+      height: 1.625rem;
       opacity: 1;
 
       font-family: Source Han Sans;
-      font-size: 36px;
+      font-size: 1.125rem;
       font-weight: bold;
       line-height: normal;
       display: flex;
       align-items: center;
       color: #4D6882;
-      padding-top: 70px;
-      margin-left: 25px;
+      padding-top: 2.25rem;
+      margin-left: .875rem;
     }
   }
 
   .heat_overlay{
     border: 1px solid #E9F3FF;
-    width: 300px;
-    height: 492px;
+    width: 9.375rem;
+    height: 15.5rem;
     border-radius: 20px;
-    margin-top: 100px;
+    margin-top: 3.125rem;
     position: absolute;
     background: #d3d3d3;
-    margin-top: -335px;
+    margin-top: -10.375rem;
     opacity: 0.8; 
 
     .heat_loading{
-      margin: 123px;
+      margin: 3.875rem;
     }
   }
 
   .heat_choose{
     position: absolute;
-    margin-left: 215px;
+    margin-left: 6.75rem;
     z-index: 99;
-    margin-top: -30px;
+    margin-top: -.9375rem;
     
     .btn{
-      width: 120px;
-      height: 60px;
-      font-size: 20px;
+      width: 3.75rem;
+      height: 1.875rem;
+      font-size: .625rem;
       color:#1989FA;
       background: #ffffff;
     }
   }
 
   .formula_picker{
-    width: 800px;
+    width: 25rem;
     margin: 20% 30%;
   }
   
diff --git a/src/views/graphite/components/TakePickture.vue b/src/views/graphite/components/TakePickture.vue
index cf80288..e8c48ef 100644
--- a/src/views/graphite/components/TakePickture.vue
+++ b/src/views/graphite/components/TakePickture.vue
@@ -16,38 +16,39 @@
 </script>
 <style scoped>
     .graphite_right{
-        width: 1040px;
+        width: 32.5rem;
         display: flex;
         justify-content: center;
     }
 
     .picture{
-        height: 726px;
-        width: 911px;
+        height: 22.625rem;
+        width: 28.5rem;
         background-image: url('@/assets/picture.svg');
         background-repeat: no-repeat;
-        margin-top:100px;
+        background-size: contain;
+        margin-top:3.25rem;
     }
     
     .area{
         background: rgba(255, 255, 255, 0.5);
-        font-size: 26px;
-        width: 911px;
-        height: 126px;
+        font-size: .875rem;
+        width: 28.5rem;
+        height: 4rem;
         position: absolute;
-        margin-top: 600px;
+        margin-top: 18.75rem;
         .area_btn{
             display: flex;
             justify-content: center;
             align-items: center;
-            height: 126px;
-            font-size: 42px;
+            height: 3.875rem;
+            font-size: 1.375rem;
             font-weight: bold;
             color: #FFFFFF;
             gap:10px;
             .photo_icon{
-                width: 51px;
-                height: 38px;
+                width: 1.625rem;
+                height: 1.125rem;
             }
         }
     }
diff --git a/src/views/graphite/index.vue b/src/views/graphite/index.vue
index e8ff3f6..2226aa4 100644
--- a/src/views/graphite/index.vue
+++ b/src/views/graphite/index.vue
@@ -19,45 +19,45 @@
             <div class="graphite_btn">
                 <div><van-button size="large" class="btn_size open">开门</van-button></div>
                 <van-row class="graphite_operate">
-                    <van-col span="11">
+                    <van-col class="w-56">
                         <van-button  size="large" class="btn_size">开始任务</van-button>
                     </van-col>
-                    <van-col span="11">
+                    <van-col class="w-[13.5rem]">
                         <van-button  size="large" class="btn_size">结束任务</van-button>
                     </van-col>
                 </van-row>
                 <van-row class="graphite_operate">
-                    <van-col span="11">
+                    <van-col class="w-56">
                         <van-button  size="large" class="btn_size" @click="onChooseCaft">选择工艺</van-button>
                     </van-col>
-                    <van-col span="11">
+                    <van-col class="w-[13.5rem]">
                         <van-button  size="large" class="btn_size">执行工艺</van-button>
                     </van-col>
                 </van-row>
                 <van-row class="graphite_operate">
-                    <van-col span="11">
+                    <van-col class="w-56">
                         <van-button  size="large" class="btn_size" @click="onAddLiquid">添加溶液</van-button>
                     </van-col>
-                    <van-col span="11">
+                    <van-col class="w-[13.5rem]">
                         <van-button  size="large" class="btn_size">摇匀</van-button>
                     </van-col>
                 </van-row>
                 <van-row class="graphite_operate">
-                    <van-col style="width:306px">
+                    <van-col class="w-36">
                         <van-button  size="large" class="btn_size">移至加热</van-button>
                     </van-col>
                     <van-col span="7">
                         <van-button  size="large" class="btn_size">移至加液</van-button>
                     </van-col>
-                    <van-col span="7">
+                    <van-col class="w-[9rem]">
                         <van-button  size="large" class="btn_size">移至特殊</van-button>
                     </van-col>
                 </van-row>
                 <van-row class="graphite_operate">
-                    <van-col span="11">
+                    <van-col class="w-56">
                         <van-button  size="large" class="btn_size">开始加热</van-button>
                     </van-col>
-                    <van-col span="11">
+                    <van-col class="w-[13.5rem]">
                         <van-button  size="large" class="btn_size">抬起托盘</van-button>
                     </van-col>
                 </van-row>
@@ -81,7 +81,7 @@
     import { ref, onMounted } from 'vue';
     import {HeatPosition, TakePickture, AddLiquid} from './components'
     import OverlayModal from '@/components/OverlayModal.vue';
-    import CraftList from './components/CraftList.vue';
+    import CraftList from '@/views/graphite/components/CraftList.vue'
     const heatList:any = ref([{
         id:1,
         name:'A-1',
diff --git a/vite.config.ts b/vite.config.ts
index e2aa9d7..ad98a7a 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -18,7 +18,7 @@ export default defineConfig({
 		port: 5174,
 		proxy: {
 			'/api': {
-			  target: 'http://127.0.0.1:8080',
+			  target: 'http://192.168.1.119:8080',
 			  changeOrigin: true,
 			  // rewrite: (path) => path.replace(/^\/api/, ''),
 			},