99 lines
2.4 KiB
Vue
99 lines
2.4 KiB
Vue
<template>
|
|
<page-container
|
|
:tabs="tabs"
|
|
:current-tab="currentTab"
|
|
:sub-title="`${station?.name} (传感器:${station?.key} 通道:${station?.channel})`"
|
|
@tab-changed="tabChanged"
|
|
>
|
|
<template #tags>
|
|
<a-tag :color="status?.powered ? 'processing' : 'warning'">{{ status?.powered ? '已开机' : '未开机' }}</a-tag>
|
|
<a-tag :color="status?.working ? 'processing' : 'warning'">{{ status?.working ? '焊接中' : '未焊接' }}</a-tag>
|
|
</template>
|
|
<template #ops>
|
|
<a-select
|
|
v-model:value="team"
|
|
style="width: 150px"
|
|
placeholder="请选择班组"
|
|
:options="options"
|
|
allow-clear
|
|
></a-select>
|
|
</template>
|
|
<station-charts
|
|
v-if="station && currentTab === 'charts'"
|
|
:station-id="station?.id"
|
|
:team-id="team"
|
|
></station-charts>
|
|
<station-power-log
|
|
v-if="station && currentTab === 'power'"
|
|
:station-id="station?.id"
|
|
:team-id="team"
|
|
></station-power-log>
|
|
<station-working-log
|
|
v-if="station && currentTab === 'working'"
|
|
:station-id="station?.id"
|
|
:team-id="team"
|
|
></station-working-log>
|
|
</page-container>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import api from '@/api'
|
|
import { Key } from 'ant-design-vue/es/_util/type'
|
|
import StationCharts from './station-charts.vue'
|
|
import StationPowerLog from './station-power-log.vue'
|
|
import StationWorkingLog from './station-working-log.vue'
|
|
const teams = ref<station.Team[]>([])
|
|
api.stationApi.team.teams({}, (data) => {
|
|
teams.value = data.records ?? []
|
|
})
|
|
const options = computed(() => {
|
|
return teams.value.map((team) => ({
|
|
label: team.name,
|
|
value: team.id,
|
|
}))
|
|
})
|
|
const team = ref<number>()
|
|
const route = useRoute()
|
|
const key = computed(() => route.params.key)
|
|
const station = ref<station.Station>()
|
|
const status = ref<station.StationStatus>()
|
|
watch(
|
|
key,
|
|
(val) => {
|
|
api.stationApi.station.detail(String(val), (data) => {
|
|
station.value = data
|
|
})
|
|
},
|
|
{ immediate: true },
|
|
)
|
|
watch(
|
|
station,
|
|
(val) => {
|
|
if (val?.id) {
|
|
api.stationApi.stationStatus.detail(val.id, (data) => {
|
|
status.value = data
|
|
})
|
|
}
|
|
},
|
|
{ immediate: false, deep: true },
|
|
)
|
|
const tabs = ref([
|
|
{
|
|
key: 'charts',
|
|
title: '工位数据图表',
|
|
},
|
|
{
|
|
key: 'working',
|
|
title: '焊接记录',
|
|
},
|
|
{
|
|
key: 'power',
|
|
title: '开机记录',
|
|
},
|
|
])
|
|
const currentTab = ref('charts')
|
|
const tabChanged = (key: Key) => {
|
|
currentTab.value = key as string
|
|
}
|
|
</script>
|