From 18eb4308e941a265daba8eda2f2ee91115963a3c Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期四, 18 四月 2024 17:06:04 +0800
Subject: [PATCH] 1
---
src/views/dashboard/components/ChannelCollapse.vue | 51 ++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 42 insertions(+), 9 deletions(-)
diff --git a/src/views/dashboard/components/ChannelCollapse.vue b/src/views/dashboard/components/ChannelCollapse.vue
index 1f483b7..934df81 100644
--- a/src/views/dashboard/components/ChannelCollapse.vue
+++ b/src/views/dashboard/components/ChannelCollapse.vue
@@ -1,19 +1,19 @@
<template>
<div class="channel-collapse">
<el-collapse v-model="activeChannel">
- <el-collapse-item
- v-for="(channel, channelNumber) in channels"
- :key="channelNumber"
- :title="CHANNEL_NAME_MAP[channelNumber] + ' 閫氶亾' + ' (' + (channel?.TaskCount ?? 0) + ')'"
- :name="String(channelNumber)"
- >
+ <el-collapse-item v-for="(channel, channelNumber) in channels" :key="channelNumber" :name="String(channelNumber)">
+ <template #title>
+ <div style="width: 100%; text-align: left" @click="selectChannel(channelNumber)">
+ {{ CHANNEL_NAME_MAP[channelNumber] + ' 閫氶亾' + ' (' + (channel?.TaskCount ?? 0) + ')' }}
+ </div>
+ </template>
<TaskInfo
v-for="task in channel.Tasks"
:key="task.Procedure.ID"
:active="task.Procedure.ID === tasksStore.activeTask?.Procedure.ID"
:task="task"
style="margin-bottom: 16px"
- @click="tasksStore.setActiveTask(task)"
+ @click="selectTask(task)"
></TaskInfo>
<div
@@ -39,11 +39,15 @@
</template>
<script setup lang="ts">
import { ref, watchEffect } from 'vue'
-import type { TasksGroupByChannel } from '@/api/task'
+import type { Task, TasksGroupByChannel } from '@/api/task'
import TaskInfo from './TaskInfo.vue'
import { CHANNEL_NAME_MAP } from '@/common/constants'
import { useTasksStore } from '@/stores/tasks'
import { ArrowDownBold, ArrowUpBold } from '@element-plus/icons-vue'
+import { isNumber } from 'lodash-es'
+import { getTaskInfo } from '@/api'
+import type { TaskInfoParams } from '@/api'
+import { storeToRefs } from 'pinia'
export interface ChannelCollapseProps {
channels: TasksGroupByChannel
@@ -53,12 +57,41 @@
const activeChannel = ref<string[]>([])
const tasksStore = useTasksStore()
+const { activeTask } = storeToRefs(tasksStore)
watchEffect(() => {
// 閫氶亾鏁版嵁鍙樺寲鍚�
const channelNumbers = Object.keys(props?.channels ?? {}).sort((a, b) => +a - +b)
activeChannel.value = [...channelNumbers]
})
+
+function selectChannel(channelNumber: number) {
+ tasksStore.setActiveTask(undefined)
+ tasksStore.setActiveChannel(+channelNumber)
+}
+
+function selectTask(task: Task | undefined) {
+ console.log(task, 'iiiiiii')
+
+ const params: TaskInfoParams = {
+ deviceID: localStorage.getItem('currentDeviceID') || '',
+ procedureID: Number(task?.Procedure.ID)
+ }
+ return getTaskInfo(params)
+ .then((res) => {
+ tasksStore.setActiveTask(res.data)
+ let channel = tasksStore?.activeTask?.Channel
+ if (isNumber(channel)) {
+ tasksStore.setActiveChannel(channel)
+ }
+ // taskStore.activeTask?.value = res.data
+ })
+ .catch((err) => {
+ console.error(err)
+ })
+ .finally(() => {})
+ // tasksStore.setActiveTask(task)
+}
</script>
<style scoped lang="scss">
@@ -75,7 +108,7 @@
:deep(.el-collapse-item__header) {
color: #fff;
background-color: transparent;
- font-size: 19px;
+ font-size: 18px;
font-weight: 600;
border: none;
}
--
Gitblit v1.8.0