LiLongLong
/
graphite_vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

merge master

feature/tray
LiLongLong 6 months ago
parent
2ed06d491c
commit
01e02b5606
3 changed files with 338 additions and 373 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 207
      src/views/graphite/components/HeatPosition.vue
  2. 71
      src/views/graphite/index.vue
  3. 1
      src/views/login/index.vue

207
src/views/graphite/components/HeatPosition.vue
View File

@ -1,28 +1,34 @@
<template>
<div class="heat_main" :style="`${posIndex === currentIndex && isSelect ? 'border:2px solid #275EFB' : ''}`">
<div
class="heat_main"
:style="`${
posIndex === currentIndex && isSelect
? 'box-sizing: border-box;border:5px solid #275EFB'
: 'box-sizing: border-box'
}`"
>
<section class="heat_pos_text">
<div class="pos_text">{{ `A-${posIndex || ''}` }}</div>
<div class="pos_text">{{ `A-${posIndex || ""}` }}</div>
<div class="pos_text pos_state">已放置</div>
</section>
<section class="heat_pos" :style="`background:${(trayInfo?.id) ? '#384D5D':''}`" @click.stop="onSelectTray">
<div
v-for="(isActive, index) in ballStates"
:key="index"
<section
class="heat_pos"
:style="`background:${trayInfo?.id ? '#384D5D' : ''}`"
>
<div class="inner-circle" :style="`background: ${trayInfo?.id ? '#F2652D': ''}`"></div>
<div v-for="(isActive, index) in ballStates" :key="index">
<div
class="inner-circle"
:style="`background: ${trayInfo?.id ? '#F2652D' : ''}`"
></div>
</div>
<!--执行中状态的遮罩层-->
<div class="craft_executing_modal" v-if="trayInfo.state == 1">
<div class="loading">
<img :src="LoadingSvg" />
</div>
<div class="tray_craft">
工艺名称
</div>
<div class="tray_exce">
工艺执行中
</div>
<div class="tray_craft">工艺名称</div>
<div class="tray_exce">工艺执行中</div>
</div>
</section>
@ -37,17 +43,20 @@
</template>
</div>
<<<<<<< HEAD
<div class="flex items-center py-4 justify-between px-2">
<div class="temp_text">120℃</div>
<button class="btn-light text-sm px-4" @click="()=>{onChooseCraft()}">选择</button>
=======
<div class="heat_opt">
<div class="temp_text">120℃</div>
<div class="heat_choose">
<van-button type="primary" class="btn" @click="()=>{onChooseCraft}">选 择</van-button>
<van-button
type="primary"
class="btn"
@click="
() => {
onChooseCraft;
}
"
>选 择</van-button
>
</div>
>>>>>>> f47c7cc (优化退出登录)
</div>
</section>
@ -56,11 +65,20 @@
<h3 class="set_temp_title">设定温度</h3>
<section class="temp_label">
<div class="text-xl">
目标温度：<input type="number" v-model="trayTempVale" class="temp_input" placeholder="请输入温度"/>
目标温度：<input
type="number"
v-model="trayTempVale"
class="temp_input"
placeholder="请输入温度"
/>
</div>
<div class="text-xl temp_status flex">
<div>到达温度后</div>
<van-radio-group v-model="trayTempType" shape="square" class="flex temp_radio">
<van-radio-group
v-model="trayTempType"
shape="square"
class="flex temp_radio"
>
<van-radio name="1">保持温度</van-radio>
<van-radio name="2">停止加热</van-radio>
</van-radio-group>
@ -68,9 +86,14 @@
</section>
<footer
class="h-[5.625rem] flex justify-center items-center text-sm font-medium gap-x-5">
<button class="btn-dark px-10 py-2 w-15" @click="onConfirm">确定</button>
<button class="btn-light px-10 py-2" @click="tempVisivle = false">取消</button>
class="h-[5.625rem] flex justify-center items-center text-sm font-medium gap-x-5"
>
<button class="btn-dark px-10 py-2 w-15" @click="onConfirm">
确定
</button>
<button class="btn-light px-10 py-2" @click="tempVisivle = false">
取消
</button>
</footer>
</div>
</OverlayModal>
@ -78,103 +101,92 @@
<OverlayModal :visible="craftVisible">
<CraftList @changeVisible="changeVisible"></CraftList>
</OverlayModal>
</div>
</template>
<script lang="ts" setup>
import { computed, ref, watch, onMounted, onBeforeUnmount } from 'vue'
import OverlayModal from '@/components/OverlayModal.vue';
import CraftList from './CraftList.vue';
import LoadingSvg from '@/assets/loading.svg';
const ballStates = ref([1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16])
import { computed, ref, watch, onMounted, onBeforeUnmount } from "vue";
import OverlayModal from "@/components/OverlayModal.vue";
import CraftList from "./CraftList.vue";
import LoadingSvg from "@/assets/loading.svg";
const ballStates = ref([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]);
const props = defineProps({
heatInfo: Object,
posIndex:Number
})
const emits = defineEmits(['onSelectedTray'])
posIndex: Number,
});
const emits = defineEmits(["onSelectedTray"]);
onMounted(()=>{
})
onMounted(() => {});
const craftVisible = ref(false)
const craftVisible = ref(false);
//设置温度
const trayTempType = ref(false)
const tempVisivle = ref(false)
const trayTempType = ref(false);
const tempVisivle = ref(false);
//托盘信息
const trayInfo = ref(props.heatInfo || {})
const trayTempVale = ref(trayInfo.value.trayTempVale || '')
const formulaList:any = ref([])
const trayInfo = ref(props.heatInfo || {});
const trayTempVale = ref(trayInfo.value.trayTempVale || "");
const formulaList: any = ref([]);
//选中托盘
const isSelect = ref(false)
const currentIndex = ref()
const selectedTrayList = ref<any>([])
const isSelect = ref(false);
const currentIndex = ref();
const selectedTrayList = ref<any>([]);
const onSelectTray = () => {
if (currentIndex.value !== props.posIndex) {
isSelect.value = true;
} else {
isSelect.value = !isSelect.value
isSelect.value = !isSelect.value;
}
currentIndex.value = props.posIndex;
emits("onSelectedTray", props.heatInfo)
}
emits("onSelectedTray", props.heatInfo);
};
const changeVisible = () => {
craftVisible.value = false;
}
};
//选择工艺
const onChooseCraft = () => {
craftVisible.value = true;
}
};
const setTemperature = () => {
tempVisivle.value = true;
}
};
const onConfirm = () => {
trayInfo.value.id = 3;
trayInfo.value.trayTempVale = trayTempVale;
tempVisivle.value = false;
}
};
</script>
<style lang="scss" scoped>
@use "@/assets/style/mixin.scss" as *;
.heat_main {
border: 1px solid #E9F3FF;
border: 1px solid #e9f3ff;
width: 11.5rem;
height: 18.125rem;
border-radius: 10px;
background: #E9F3FF;
<<<<<<< HEAD
=======
margin-top: 3.5rem;
padding:3px;
>>>>>>> f47c7cc (优化退出登录)
background: #e9f3ff;
margin-top: 0.5rem;
}
.heat_pos_text {
display: flex;
height: 1.75rem;
padding-left: .875rem;
padding-right: .75rem;
padding-left: 0.875rem;
padding-right: 0.75rem;
.pos_text {
font-size: .8125rem;
font-size: 0.8125rem;
font-weight: 500;
line-height: normal;
display: flex;
align-items: center;
color: #4D6882;
color: #4d6882;
}
.pos_state {
margin-left:50%
margin-left: 50%;
}
}
.heat_pos {
@ -183,14 +195,12 @@
display: flex;
justify-content: center;
flex-wrap: wrap;
margin-left: 5px;
gap: .625rem;
gap: 0.625rem;
flex-direction: row;
border: 2px solid #7592A8;
margin-left: .5rem;
padding-top: .5rem;
border: 2px solid #7592a8;
padding-top: 0.5rem;
border-radius: 0.5rem;
margin-left: 5px;
.craft_executing_modal {
position: absolute;
width: 10rem;
@ -208,19 +218,16 @@
margin-top: 0.5rem;
margin-left: 3rem;
font-weight: bold;
color: #4D6882;
color: #4d6882;
}
.tray_exce {
font-size: 1.2rem;
margin-left: 1.8rem;
font-weight: bold;
color: #4D6882;
color: #4d6882;
}
}
}
.inner-circle {
border-radius: 50%;
@ -229,45 +236,43 @@
background-color: rgb(212, 212, 212);
}
.heat_footer {
<<<<<<< HEAD
margin-top: 10px;
margin-left: 5px;
=======
height: 5.625rem;
width: 102.5rem;
margin-top: .25rem;
>>>>>>> f47c7cc (优化退出登录)
margin-top: 0.25rem;
.heat_temperature {
height: 1.625rem;
width: 10.375rem;
background: #FFFFFF;
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: .375rem;
.target_temp {
color: #384D5D;
font-size: .75rem;
color: #384d5d;
font-size: 0.75rem;
}
.heating {
color: #FE0A0A;
font-size: .85rem;
color: #fe0a0a;
font-size: 0.85rem;
margin-left: 1rem;
}
}
.heat_opt {
margin: 1rem;
}
.temp_text {
font-size: 1.125rem;
font-weight: bold;
color: #4D6882;
color: #4d6882;
}
}
.heat_overlay {
border: 1px solid #E9F3FF;
border: 1px solid #e9f3ff;
width: 9.375rem;
height: 15.5rem;
border-radius: 20px;
@ -282,19 +287,17 @@
}
}
.heat_opt{
}
.heat_choose {
position: relative;
margin-left: 6.5rem;
margin-left: 5rem;
z-index: 99;
margin-top: -1.3rem;
margin-top: -1.6rem;
.btn {
width: 3.75rem;
height: 1.875rem;
font-size: .625rem;
color:#1989FA;
font-size: 0.625rem;
color: #1989fa;
background: #ffffff;
}
}
@ -327,7 +330,7 @@
margin-left: 1.25rem;
font-size: 1.25rem;
font-weight: 500;
color: #40474E;
color: #40474e;
}
}
@ -355,6 +358,4 @@
margin-top: -10px;
}
}
</style>

71
src/views/graphite/index.vue
View File

@ -1,11 +1,13 @@
<template>
<div class="graphite_home component-page overflow-auto">
<div class="heat_area">
<div v-for="(item, index) in heatList" :key="item">
<HeatPosition :heatInfo="item" :posIndex="index + 1" @onSelectedTray="onSelectedTray"></HeatPosition>
<div v-for="(item, index) in heatList" :key="item" @click.stop="onSelectedTray(item, index)" :style="`${
index === currentIndex && isSelect
? 'border:3px solid #275EFB'
: 'border:3px solid #ffffff'
}`">
<HeatPosition :heatInfo="item" :posIndex="index + 1"></HeatPosition>
<!-- <div class="craft_executing_modal">
</div> -->
</div>
<!--执行中状态的遮罩层-->
@ -64,7 +66,16 @@ onMounted(() => {
//选择的托盘
const selectedTrayList = ref<any>([]);
const onSelectedTray = (data = {}) => {
const currentIndex = ref()
const isSelect = ref(false);
const onSelectedTray = (data = {}, index) => {
if (currentIndex.value !== index) {
isSelect.value = true;
} else {
isSelect.value = !isSelect.value;
}
currentIndex.value = index;
selectedTrayList.value.push(data);
console.log("selectedTrayList.value--", selectedTrayList.value);
};
@ -84,7 +95,6 @@ const onChooseCaft = () => {
};
</script>
<style lang="scss" scoped>
<<<<<<< HEAD
@use "@/assets/style/mixin.scss" as *;
.graphite_home {
@ -102,42 +112,16 @@ const onChooseCaft = () => {
@media (min-width: $lg) {
flex-direction: row;
align-items: start;
.picture_area {
display: flex;
flex-direction: column;
height: 47rem;
}
}
}
.heat_area {
margin: 5px 0;
=======
@use "@/assets/style/mixin.scss" as *;
.graphite_home{
display: flex;
background: #F6F6F6;
}
.heat_area{
width: 79.25rem;
display: flex;
justify-content: center;
flex-wrap: wrap;
margin: 5px;
gap: 1.25rem;
flex-direction: row;
padding-bottom: 100px;
background: #FFFFFF;
border-radius: 20px;
.craft_executing_modal{
position: absolute;
width: 10.5rem;
height: 18rem;
background: rgb(230, 230, 230);
opacity: 0.5;
z-index: 9999;
}
}
>>>>>>> f47c7cc (优化退出登录)
background: #ffffff;
border-radius: 20px;
@ -172,7 +156,6 @@ const onChooseCaft = () => {
}
}
<<<<<<< HEAD
.picture_area {
display: flex;
flex-direction: column;
@ -318,21 +301,3 @@ const onChooseCaft = () => {
}
}
</style>
=======
.liquid{
display: flex;
justify-content: center;
width: 100%;
height: 100%;
align-items: center;
.addLiquid{
width: 70.375rem;
height: 52rem;
background: #FFFFFF;
}
}
</style>
>>>>>>> f47c7cc (优化退出登录)

1
src/views/login/index.vue
View File

@ -70,7 +70,6 @@ const handleLogin = async () => {
position: relative;
width: 100vw;
height: 100vh;
overflow: hidden;
background: linear-gradient(180deg, rgba(250, 252, 255, 0.51) 0%, rgba(255, 255, 255, 0.52) 100%);
.login_logo{
.logo_size{

Write Preview
Loading…
Cancel
Save