石墨仪设备 前端仓库
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.
 
 
 
 
 

143 lines
4.4 KiB

<template>
<div class="graphite_home component-page">
<div class="heat_area">
<div v-for="item in heatList" :key="item">
<HeatPosition :heatInfo="item"></HeatPosition>
</div>
</div>
<!--拍照区-->
<div class="pickture_area">
<TakePickture></TakePickture>
<!--操作区-->
<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-button size="large" class="btn_size">开始任务</van-button>
</van-col>
<van-col span="11">
<van-button size="large" class="btn_size">结束任务</van-button>
</van-col>
</van-row>
<van-row class="graphite_operate">
<van-col span="11">
<van-button size="large" class="btn_size">选择配方</van-button>
</van-col>
<van-col span="11">
<van-button size="large" class="btn_size">执行配方</van-button>
</van-col>
</van-row>
<van-row class="graphite_operate">
<van-col span="11">
<van-button size="large" class="btn_size" @click="onAddWaste">添加溶液</van-button>
</van-col>
<van-col span="11">
<van-button size="large" class="btn_size">摇匀</van-button>
</van-col>
</van-row>
<van-row class="graphite_operate">
<van-col style="width:306px">
<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-button size="large" class="btn_size">移至特殊</van-button>
</van-col>
</van-row>
<van-row class="graphite_operate">
<van-col span="11">
<van-button size="large" class="btn_size">开始加热</van-button>
</van-col>
<van-col span="11">
<van-button size="large" class="btn_size">抬起托盘</van-button>
</van-col>
</van-row>
</div>
</div>
<van-overlay :show="wasteVisible" style="z-index: 999;">
<div class="waste">
<div class="addWaste">
<AddWaste @cancel="wasteVisible=false"></AddWaste>
</div>
</div>
</van-overlay>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import {HeatPosition, TakePickture, AddWaste} from './components'
const heatList:any = ref([1,2,3,4,5,6])
//添加溶液
const wasteVisible = ref(false)
const onAddWaste = () => {
wasteVisible.value = true;
}
</script>
<style>
.graphite_home{
display: flex;
background: #F6F6F6;
}
.heat_area{
width: 1268px;
display: flex;
justify-content: center;
flex-wrap: wrap;
margin: 5px;
gap: 20px;
flex-direction: row;
padding-bottom: 100px;
background: #FFFFFF;
border-radius: 20px;
}
.pickture_area{
width: 1040px;
margin: 5px;
margin-left: 20px;
background: #FFFFFF;
border-radius: 20px;
}
.graphite_btn{
margin-left: 68px;
margin-top: 2rem;
}
.btn_size{
font-size: 30px;
height: 80px;
color: #1989FA;
border: 3px solid #1989FA;
}
.open{
width: 906px;
}
.graphite_operate{
gap: 15px;
padding-top:30px;
}
.waste{
display: flex;
justify-content: center;
width: 100%;
height: 100%;
align-items: center;
.addWaste{
width: 2250px;
height: 1235px;
background: #FFFFFF;
}
}
</style>