Browse Source

fix: 首页状态添加

feature/three
guoapeng 3 months ago
parent
commit
cd4daddf4d
  1. 1
      src/apis/home.ts
  2. 2
      src/assets/styles/element.scss
  3. 22
      src/components/home/AddLiquid/index.vue
  4. 44
      src/components/home/Tube/index.vue
  5. 17
      src/stores/systemStore.ts
  6. 8
      src/types/home.d.ts
  7. 20
      src/types/system.d.ts
  8. 73
      src/views/home/index.vue

1
src/apis/home.ts

@ -3,3 +3,4 @@ import http from 'libs/http'
export const setTargetTemperature = (params: Home.SetTargetTemperatureParams): Promise<null> => http.post('/heat/target-temperature', params) export const setTargetTemperature = (params: Home.SetTargetTemperatureParams): Promise<null> => http.post('/heat/target-temperature', params)
export const trayIn = (): Promise<null> => http.post('/tray/in') export const trayIn = (): Promise<null> => http.post('/tray/in')
export const trayOut = (): Promise<null> => http.post('/tray/out') export const trayOut = (): Promise<null> => http.post('/tray/out')
export const trayTube = (params: Home.TrayTubeParams): Promise<null> => http.post('/tray/out', params)

2
src/assets/styles/element.scss

@ -4,7 +4,7 @@
--el-color-primary: #26509C;
--el-color-primary: #1989fa;
//--el-button-active-bg-color: linear-gradient(90deg, #0657C0 24%, #096AE0 101%); //--el-button-active-bg-color: linear-gradient(90deg, #0657C0 24%, #096AE0 101%);
--text-color-primary: #17213c; --text-color-primary: #17213c;
//--el-color-success: rgba(88, 162, 95, 1); //--el-color-success: rgba(88, 162, 95, 1);

22
src/components/home/AddLiquid/index.vue

@ -2,17 +2,32 @@
import { getSolsList } from 'apis/solution' import { getSolsList } from 'apis/solution'
import emptyIcon from 'assets/images/empty.svg' import emptyIcon from 'assets/images/empty.svg'
import { FtMessage } from 'libs/message' import { FtMessage } from 'libs/message'
import { socket } from 'libs/socket'
import { useHomeStore } from 'stores/homeStore' import { useHomeStore } from 'stores/homeStore'
import { onMounted, ref } from 'vue'
import { useSystemStore } from 'stores/systemStore'
import { onMounted, onUnmounted, ref } from 'vue'
const emits = defineEmits(['ok', 'cancel']) const emits = defineEmits(['ok', 'cancel'])
const homeStore = useHomeStore() const homeStore = useHomeStore()
const systemStore = useSystemStore()
onMounted(() => { onMounted(() => {
getSols() getSols()
socket.init(receiveMessage, 'cmd_debug')
socket.init(receiveMessage, 'cmd_response')
}) })
onUnmounted(() => {
socket.unregisterCallback(receiveMessage, 'cmd_debug')
socket.unregisterCallback(receiveMessage, 'cmd_response')
})
let currentCommandId = ''
const receiveMessage = (data: Socket.cmdData) => {
data.commandId === currentCommandId && systemStore.pushSystemList(data)
}
const form = ref<{ const form = ref<{
tubeNum: number tubeNum: number
solutionId: number solutionId: number
@ -77,16 +92,15 @@ const okHandle = async () => {
return return
} }
console.log(mergeAddList()) console.log(mergeAddList())
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'solution_add', command: 'solution_add',
params: { params: {
dataList: mergeAddList(), dataList: mergeAddList(),
}, },
} }
await homeStore.sendControl(params) await homeStore.sendControl(params)
// await debugStore.sendControl(params)
emits('ok') emits('ok')
} }
const cancel = () => { const cancel = () => {

44
src/components/home/Tube/index.vue

@ -1,5 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { pauseCraft, resumeCraft, stopCraft } from 'apis/crafts' import { pauseCraft, resumeCraft, stopCraft } from 'apis/crafts'
import { trayTube } from 'apis/home'
import errorIcon from 'assets/images/error.svg' import errorIcon from 'assets/images/error.svg'
import ingIcon from 'assets/images/ing.svg' import ingIcon from 'assets/images/ing.svg'
import successIcon from 'assets/images/success.svg' import successIcon from 'assets/images/success.svg'
@ -23,7 +24,7 @@ const emits = defineEmits(['selectChange', 'setTemperature'])
const homeStore = useHomeStore() const homeStore = useHomeStore()
const systemStore = useSystemStore() const systemStore = useSystemStore()
const mousedownHandle = (e: Event) => {
const mousedownHandle = async (e: Event) => {
let event let event
if ('touches' in e) { if ('touches' in e) {
event = (e.touches as TouchList)[0] event = (e.touches as TouchList)[0]
@ -32,11 +33,19 @@ const mousedownHandle = (e: Event) => {
event = e event = e
} }
if (event.target!.classList!.contains('tube-inner')) { if (event.target!.classList!.contains('tube-inner')) {
activeTubeNum.value = event.target!.getAttribute('index')
const num = event.target!.getAttribute('index')
await trayTube({
trayUuid: tray.value!.uuid,
tubes: [
{
tubeNum: Number(num),
exists: !tray.value?.tubes.find(t => t.tubeNum === Number(num))?.exists,
},
],
})
} }
} }
const activeTubeNum = ref(0)
const activeTubeBox = ref(false) const activeTubeBox = ref(false)
const tubeSelect = () => { const tubeSelect = () => {
@ -51,6 +60,10 @@ const craft = computed(() => {
return systemStore.systemStatus.tray.find(item => item.heatModuleId === props.data.moduleCode)?.crafts return systemStore.systemStatus.tray.find(item => item.heatModuleId === props.data.moduleCode)?.crafts
}) })
const tray = computed(() => {
return systemStore.systemStatus.tray.find(item => item.heatModuleId === props.data.moduleCode)
})
const setTemperature = () => { const setTemperature = () => {
emits('setTemperature', props.data.moduleCode) emits('setTemperature', props.data.moduleCode)
} }
@ -73,6 +86,25 @@ const stopCraftHandle = async () => {
}) })
} }
const tubes = [
{ tubeNum: 13 },
{ tubeNum: 14 },
{ tubeNum: 15 },
{ tubeNum: 16 },
{ tubeNum: 9 },
{ tubeNum: 10 },
{ tubeNum: 11 },
{ tubeNum: 12 },
{ tubeNum: 5 },
{ tubeNum: 6 },
{ tubeNum: 7 },
{ tubeNum: 8 },
{ tubeNum: 1 },
{ tubeNum: 2 },
{ tubeNum: 3 },
{ tubeNum: 4 },
]
defineExpose({ defineExpose({
activeTubeBox, activeTubeBox,
}) })
@ -106,7 +138,7 @@ defineExpose({
<ft-button v-if="craft?.state === 'PAUSED'" type="primary" size="small" :click-handle="resumeCraftHandle"> <ft-button v-if="craft?.state === 'PAUSED'" type="primary" size="small" :click-handle="resumeCraftHandle">
继续 继续
</ft-button> </ft-button>
<ft-button v-if="craft?.state === 'RUNNING'" size="small" :click-handle="stopCraftHandle">
<ft-button v-if="craft?.state !== 'READY'" size="small" :click-handle="stopCraftHandle">
停止 停止
</ft-button> </ft-button>
</div> </div>
@ -117,9 +149,9 @@ defineExpose({
<span v-show="data.trayStatus === 1">已放置</span> <span v-show="data.trayStatus === 1">已放置</span>
<span v-show="data.trayStatus === 2">已抬起</span> <span v-show="data.trayStatus === 2">已抬起</span>
</div> </div>
<div class="tube-item" @mousedown.prevent="mousedownHandle" @touchstart.prevent="mousedownHandle">
<div class="tube-item" @click.prevent="mousedownHandle" @touch.prevent="mousedownHandle">
<div v-if="data.trayStatus === 0" class="tube-disable" /> <div v-if="data.trayStatus === 0" class="tube-disable" />
<span v-for="item in 16" :key="item" class="tube-inner" :class="{ 'tube-inner-active': item <= activeTubeNum }" />
<span v-for="item in tubes" :key="item.tubeNum" class="tube-inner" :class="{ 'tube-inner-active': tray?.tubes.find(tu => tu.tubeNum === item.tubeNum)?.exists }" :index="item.tubeNum" />
</div> </div>
<div v-if="data.targetTemperature" class="temperature-box" @click="setTemperature"> <div v-if="data.targetTemperature" class="temperature-box" @click="setTemperature">
<span> <span>

17
src/stores/systemStore.ts

@ -4,7 +4,7 @@ export const useSystemStore = defineStore('system', {
state: (): System.SystemStore => ({ state: (): System.SystemStore => ({
systemStatus: { systemStatus: {
virtual: false, virtual: false,
initComplete: false,
initComplete: true,
selfTest: true, selfTest: true,
emergencyStop: false, emergencyStop: false,
door: { door: {
@ -13,7 +13,7 @@ export const useSystemStore = defineStore('system', {
gantryArm: { gantryArm: {
idle: true, idle: true,
}, },
solutionArea: {
solutionModule: {
idle: true, idle: true,
shaking: false, shaking: false,
trayStatus: 0, trayStatus: 0,
@ -127,12 +127,13 @@ export const useSystemStore = defineStore('system', {
], ],
tray: [ tray: [
{ {
uuid: '',
uuid: '111',
heatModuleId: 'heat_module_01', heatModuleId: 'heat_module_01',
inSolutionArea: false, inSolutionArea: false,
inHeatModule: true, inHeatModule: true,
tubes: [ tubes: [
{ {
tubeNum: 1,
addSolution: true, addSolution: true,
exists: true, exists: true,
}, },
@ -148,6 +149,7 @@ export const useSystemStore = defineStore('system', {
inHeatModule: true, inHeatModule: true,
tubes: [ tubes: [
{ {
tubeNum: 1,
addSolution: true, addSolution: true,
exists: true, exists: true,
}, },
@ -163,18 +165,19 @@ export const useSystemStore = defineStore('system', {
}, },
{ {
uuid: '', uuid: '',
heatModuleId: 'heat_module_03',
heatModuleId: 'heat_module_04',
inSolutionArea: false, inSolutionArea: false,
inHeatModule: true, inHeatModule: true,
tubes: [ tubes: [
{ {
tubeNum: 1,
addSolution: true, addSolution: true,
exists: true, exists: true,
}, },
], ],
crafts: {
state: 'ERROR',
},
// crafts: {
// state: 'ERROR',
// },
}, },
], ],
}, },

8
src/types/home.d.ts

@ -11,4 +11,12 @@ declare namespace Home {
moduleCode: string moduleCode: string
temperature: number temperature: number
} }
interface TrayTubeParams {
trayUuid: string
tubes: {
tubeNum: number
addSolution?: boolean
exists: boolean
}[]
}
} }

20
src/types/system.d.ts

@ -16,12 +16,12 @@ declare namespace System {
selfTest: boolean selfTest: boolean
emergencyStop: boolean emergencyStop: boolean
door: { door: {
status: boolean
open: boolean
} }
gantryArm: { gantryArm: {
idle: boolean idle: boolean
} }
solutionArea: {
solutionModule: {
idle: boolean idle: boolean
shaking: boolean shaking: boolean
trayStatus: 0 | 1 trayStatus: 0 | 1
@ -29,25 +29,25 @@ declare namespace System {
pumping: boolean pumping: boolean
} }
heatModule: HeatArea[] heatModule: HeatArea[]
tray: Tray[]
tray?: Tray[]
} }
interface Tray { interface Tray {
uuid: string uuid: string
heatModuleId: 'heat_module_01' | 'heat_module_02' | 'heat_module_03' | 'heat_module_04' | 'heat_module_05' | 'heat_module_06' heatModuleId: 'heat_module_01' | 'heat_module_02' | 'heat_module_03' | 'heat_module_04' | 'heat_module_05' | 'heat_module_06'
inSolutionArea: boolean inSolutionArea: boolean
inHeatModule: boolean inHeatModule: boolean
tubes: [
{
addSolution: boolean
exists: boolean
},
]
crafts: {
tubes: Tubes[]
crafts?: {
state: 'READY' | 'RUNNING' | 'PAUSED' | 'STOPPED' | 'ERROR' | 'FINISHED' state: 'READY' | 'RUNNING' | 'PAUSED' | 'STOPPED' | 'ERROR' | 'FINISHED'
craft?: CraftTypes.Craft craft?: CraftTypes.Craft
currentIndex?: number currentIndex?: number
} }
} }
interface Tubes {
tubeNum: number
addSolution: boolean
exists: boolean
}
interface HeatArea { interface HeatArea {
moduleCode: 'heat_module_01' | 'heat_module_02' | 'heat_module_03' | 'heat_module_04' | 'heat_module_05' | 'heat_module_06' moduleCode: 'heat_module_01' | 'heat_module_02' | 'heat_module_03' | 'heat_module_04' | 'heat_module_05' | 'heat_module_06'
trayStatus: 0 | 1 | 2 trayStatus: 0 | 1 | 2

73
src/views/home/index.vue

@ -8,13 +8,29 @@ import StartExperiment from 'components/home/StartExperiment/index.vue'
import Tube from 'components/home/Tube/index.vue' import Tube from 'components/home/Tube/index.vue'
import { ElMessageBox } from 'element-plus' import { ElMessageBox } from 'element-plus'
import { FtMessage } from 'libs/message' import { FtMessage } from 'libs/message'
import { socket } from 'libs/socket'
import { useHomeStore } from 'stores/homeStore' import { useHomeStore } from 'stores/homeStore'
import { useSystemStore } from 'stores/systemStore' import { useSystemStore } from 'stores/systemStore'
import { ref } from 'vue'
import { onMounted, onUnmounted, ref } from 'vue'
const homeStore = useHomeStore() const homeStore = useHomeStore()
const systemStore = useSystemStore() const systemStore = useSystemStore()
onMounted(() => {
socket.init(receiveMessage, 'cmd_debug')
socket.init(receiveMessage, 'cmd_response')
})
onUnmounted(() => {
socket.unregisterCallback(receiveMessage, 'cmd_debug')
socket.unregisterCallback(receiveMessage, 'cmd_response')
})
let currentCommandId = ''
const receiveMessage = (data: Socket.cmdData) => {
data.commandId === currentCommandId && systemStore.pushSystemList(data)
}
const startVisible = ref(false) const startVisible = ref(false)
// const startExperimentHandle = () => { // const startExperimentHandle = () => {
@ -56,17 +72,21 @@ const setTemperature = (id: string) => {
const addLiquidVisible = ref(false) const addLiquidVisible = ref(false)
const addLiquid = () => { const addLiquid = () => {
const count = homeStore.heatAreaList.filter(item => item.selected).length
if (!count) {
FtMessage.warning('请选择加热区')
if (!systemStore.systemStatus.solutionModule.trayStatus) {
FtMessage.warning('加液区无托盘')
return return
} }
addLiquidVisible.value = true addLiquidVisible.value = true
} }
const door_open = async () => { const door_open = async () => {
if (systemStore.systemStatus.door.open) {
FtMessage.warning('门已经是开启状态了')
return
}
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'door_open', command: 'door_open',
params: { }, params: { },
} }
@ -86,8 +106,13 @@ const door_open = async () => {
} }
const door_close = async () => { const door_close = async () => {
if (!systemStore.systemStatus.door.open) {
FtMessage.warning('门已经是关闭状态了')
return
}
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'door_close', command: 'door_close',
params: { }, params: { },
} }
@ -107,13 +132,19 @@ const door_close = async () => {
} }
const move_to_heat_area = async () => { const move_to_heat_area = async () => {
if (systemStore.systemStatus.solutionModule.trayStatus === 0) {
FtMessage.warning('加液区无托盘')
return
}
const selectedHeatAreas = homeStore.heatAreaList.filter(item => item.selected) const selectedHeatAreas = homeStore.heatAreaList.filter(item => item.selected)
if (!selectedHeatAreas.length || selectedHeatAreas.length > 1) { if (!selectedHeatAreas.length || selectedHeatAreas.length > 1) {
FtMessage.warning('请选择一个加热区') FtMessage.warning('请选择一个加热区')
return return
} }
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'move_to_heat_area', command: 'move_to_heat_area',
params: { params: {
heatId: selectedHeatAreas[0].value, heatId: selectedHeatAreas[0].value,
@ -128,8 +159,13 @@ const move_to_solution_area = async () => {
FtMessage.warning('请选择一个加热区') FtMessage.warning('请选择一个加热区')
return return
} }
if (systemStore.systemStatus.solutionModule.trayStatus === 1) {
FtMessage.warning('加液区有托盘')
return
}
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'move_to_solution_area', command: 'move_to_solution_area',
params: { params: {
heatId: selectedHeatAreas[0].value, heatId: selectedHeatAreas[0].value,
@ -148,8 +184,9 @@ const heat_start = async () => {
FtMessage.warning('请先设置温度') FtMessage.warning('请先设置温度')
return return
} }
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'heat_start', command: 'heat_start',
params: { params: {
heatId: selectedHeatAreas[0].value, heatId: selectedHeatAreas[0].value,
@ -165,8 +202,9 @@ const heat_stop = async () => {
FtMessage.warning('请选择一个加热区') FtMessage.warning('请选择一个加热区')
return return
} }
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'heat_stop', command: 'heat_stop',
params: { params: {
heatId: selectedHeatAreas[0].value, heatId: selectedHeatAreas[0].value,
@ -181,8 +219,9 @@ const tray_up = async () => {
FtMessage.warning('请选择一个加热区') FtMessage.warning('请选择一个加热区')
return return
} }
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'tray_up', command: 'tray_up',
params: { params: {
heatId: selectedHeatAreas[0].value, heatId: selectedHeatAreas[0].value,
@ -197,8 +236,9 @@ const tray_down = async () => {
FtMessage.warning('请选择一个加热区') FtMessage.warning('请选择一个加热区')
return return
} }
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'tray_down', command: 'tray_down',
params: { params: {
heatId: selectedHeatAreas[0].value, heatId: selectedHeatAreas[0].value,
@ -208,8 +248,9 @@ const tray_down = async () => {
} }
const shake_start = async () => { const shake_start = async () => {
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'shake_start', command: 'shake_start',
params: { params: {
}, },
@ -218,8 +259,9 @@ const shake_start = async () => {
} }
const shake_stop = async () => { const shake_stop = async () => {
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'shake_stop', command: 'shake_stop',
params: { params: {
}, },
@ -228,8 +270,9 @@ const shake_stop = async () => {
} }
const take_photo = async () => { const take_photo = async () => {
currentCommandId = Date.now().toString()
const params = { const params = {
commandId: Date.now().toString(),
commandId: currentCommandId,
command: 'take_photo', command: 'take_photo',
params: { params: {
}, },

Loading…
Cancel
Save