From b95cf940af8e01e4eca30b2599b029c2f645bd1e Mon Sep 17 00:00:00 2001
From: charles <981744753@qq.com>
Date: 星期一, 29 四月 2024 10:44:26 +0800
Subject: [PATCH] feat:创建新分支

---
 src/views/dashboard/components/DashboardTitle.vue |  181 ++++++++++++++++++++++++++++++++++-----------
 1 files changed, 137 insertions(+), 44 deletions(-)

diff --git a/src/views/dashboard/components/DashboardTitle.vue b/src/views/dashboard/components/DashboardTitle.vue
index 015694a..50d533e 100644
--- a/src/views/dashboard/components/DashboardTitle.vue
+++ b/src/views/dashboard/components/DashboardTitle.vue
@@ -1,43 +1,58 @@
 <template>
   <div class="dashboard-title">
-    <div class="title-text">
-      鏅鸿兘宸ヤ綔鍙� 鈥�
-      <el-popover
-        placement="bottom"
-        :width="200"
-        trigger="click"
-        :content="deviceStore?.deviceInfo?.currentDeviceID ?? ''"
-      >
-        <template #reference>
-          <el-text truncated class="device-name">{{ deviceStore?.deviceInfo?.currentDeviceID ?? '' }}</el-text>
-        </template>
-      </el-popover>
-      <el-icon size="32" color="#0db7f5" style="margin-left: 20px; cursor: pointer" @click="openDevicesModal">
-        <IconSlider></IconSlider>
-      </el-icon>
+    <div class="title-text-box">
+      <div class="title-text">
+        <span> 鏅鸿兘宸ヤ綔鍙� 鈥�</span>
+        <el-popover placement="bottom" :width="180" trigger="click" :content="currentDeviceName">
+          <template #reference>
+            <el-text truncated class="device-name">{{ currentDeviceName }}</el-text>
+          </template>
+        </el-popover>
+        <el-icon class="text-icon" color="#0db7f5" @click="openDevicesModal">
+          <IconSlider></IconSlider>
+        </el-icon>
+      </div>
     </div>
     <div class="title-status">
       <div class="connection-info" @click="openProblemsModal">
-        <el-icon size="26" :color="problemsIconStatus ? '#00ff00' : '#ff0000'">
+        <el-icon class="size_26" :color="problemsIconStatus ? '#00ff00' : '#ff0000'">
           <AlertLightIcon></AlertLightIcon>
         </el-icon>
       </div>
       <div class="cloud-connection-status">
-        <el-icon v-if="cloudConnectionIconStatus" size="38" color="#00ff00">
+        <el-icon v-if="cloudConnectionIconStatus" class="size_36" color="#00ff00">
           <IconCloudDone></IconCloudDone>
         </el-icon>
 
-        <el-icon v-else size="38" color="#ff0000">
+        <el-icon v-else class="size_36" color="#ff0000">
           <IconCloudOff></IconCloudOff>
         </el-icon>
+      </div>
+
+      <div class="reporting-record">
+        <el-icon
+          class="size_26"
+          :color="taskStore.activeTask ? '#0db7f5' : '#c0c0c0'"
+          :style="{ 'margin-right': '10px', cursor: taskStore.activeTask ? 'pointer' : 'not-allowed' }"
+          @click="openReportingRecord"
+        >
+          <IconRecords></IconRecords>
+        </el-icon>
+      </div>
+
+      <div class="params-config" @click="openConfigModal">
+        <el-icon class="size_28"><Setting /></el-icon>
       </div>
     </div>
   </div>
   <DeviceCheckList v-model="showDevicesModal" @should-reload="emits('shouldReload')"></DeviceCheckList>
   <TroubleTrackerModal v-model="showProblemsModal" :problems="problemList"></TroubleTrackerModal>
+  <DeliverParamsConfigModal v-model="showConfigModal"></DeliverParamsConfigModal>
+  <ReportingRecordModal v-model="showReportingRecordModal"></ReportingRecordModal>
 </template>
 <script setup lang="ts">
 import AlertLightIcon from '@/components/icons/AlertLightIcon.vue'
+import IconRecords from '~icons/vaadin/records'
 import { computed, onUnmounted, ref } from 'vue'
 import { useDevicesStore } from '@/stores/devices'
 import TroubleTrackerModal from '@/views/dashboard/components/TroubleTrackerModal.vue'
@@ -46,8 +61,12 @@
 import IconCloudOff from '~icons/material-symbols-light/cloud-off-outline'
 import IconSlider from '~icons/bx/slider'
 import { useRequest } from 'vue-hooks-plus'
-import { apiGetProblemList } from '@/api'
+// import { apiGetProblemList } from '@/api'
 import { PROBLEMS_POLLING_DURATION } from '@/common/constants'
+import { Setting } from '@element-plus/icons-vue'
+import DeliverParamsConfigModal from '@/views/dashboard/components/DeliverParamsConfigModal.vue'
+import ReportingRecordModal from '@/views/dashboard/components/ReportingRecordModal.vue'
+import { useTasksStore } from '@/stores/tasks'
 
 const emits = defineEmits<{
   shouldReload: []
@@ -73,10 +92,17 @@
 
 // 鑾峰彇褰撳墠璁惧鍚�
 const deviceStore = useDevicesStore()
+const currentDeviceName = computed(() => {
+  return (
+    deviceStore?.deviceInfo?.deviceList?.find((ele) => ele?.deviceID === deviceStore?.deviceInfo?.currentDeviceID)
+      ?.deviceName ?? ''
+  )
+})
 
 // 闂璇婃柇鍒楄〃
 const problemList = computed(() => {
-  return problemsRes?.value?.data ?? []
+  // return problemsRes?.value?.data ?? []
+  return []
 })
 // 闂璇婃柇icon鐘舵��, 闂鍒楄〃涓湁涓�鏉″紓甯稿嵆涓虹孩鐏� 鍚﹀垯鏄豢鐏�  true缁跨伅
 const problemsIconStatus = computed(() => {
@@ -84,7 +110,8 @@
     // 榛樿缁跨伅, 鎷垮埌涓�娆℃暟鎹悗鎵嶄互鎺ュ彛涓哄噯
     return true
   }
-  return !problemList.value.some((ele) => !ele.CheckResult)
+  // return !problemList.value.some((ele) => !ele.CheckResult)
+  return false
 })
 // 浜戠杩炴帴icon鐘舵��, 闂鍒楄〃涓湁涓�鏉′唬琛ㄤ簯绔摼鎺ョ殑, 寮傚父鍗充负绾㈣壊浜慽con 鍚﹀垯鏄豢鑹�  true缁夸簯
 const cloudConnectionIconStatus = computed(() => {
@@ -93,53 +120,119 @@
     return true
   }
   // 娌℃暟鎹氨褰撴槸閾炬帴姝e父
-  const cloudConnection = problemList.value.find((ele) => ele.ItemCode === 'cloud')
-  return cloudConnection ? cloudConnection?.CheckResult : true
+  // const cloudConnection = problemList.value.find((ele) => ele.ItemCode === 'cloud')
+  // return cloudConnection ? cloudConnection?.CheckResult : true
+  return false
 })
 
+// 閰嶇疆涓嬪彂鍙傛暟寮圭獥
+const showConfigModal = ref(false)
+function openConfigModal() {
+  showConfigModal.value = true
+}
+function closeConfigModal() {
+  showConfigModal.value = false
+}
 /**
  * 杞闂璇婃柇
  */
-const {
-  data: problemsRes,
-  run: startProblemsPolling,
-  cancel: cancelProblemsPolling
-} = useRequest(apiGetProblemList, {
-  manual: true,
-  pollingInterval: PROBLEMS_POLLING_DURATION,
-  pollingWhenHidden: false
-})
-startProblemsPolling()
-onUnmounted(() => {
-  cancelProblemsPolling()
-})
+// const {
+//   data: problemsRes,
+//   run: startProblemsPolling,
+//   cancel: cancelProblemsPolling
+// } = useRequest(apiGetProblemList, {
+//   manual: true,
+//   pollingInterval: PROBLEMS_POLLING_DURATION,
+//   pollingWhenHidden: false
+// })
+// startProblemsPolling()
+// onUnmounted(() => {
+//   cancelProblemsPolling()
+// })
+
+const taskStore = useTasksStore()
+
+// 鏄惁鏄剧ず鎶ュ伐璁板綍
+const showReportingRecordModal = ref(false)
+function openReportingRecord() {
+  if (!taskStore.activeTask) {
+    ElMessage.error('璇峰厛閫夋嫨浠诲姟')
+    return
+  }
+  showReportingRecordModal.value = true
+}
 </script>
 
 <style scoped lang="scss">
 .dashboard-title {
   position: relative;
+  height: 100%;
 }
-.title-text {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 40px;
-  font-weight: 700;
+.el-icon.size_28 {
+  font-size: 28px;
 }
+.size_26 {
+  font-size: 26px;
+}
+.size_36 {
+  font-size: 36px;
+}
+.title-text-box {
+  width: calc(100% - 150px);
+  height: 100%;
+
+  .title-text {
+    // display: flex;
+    width: 450px;
+    height: 100%;
+    margin: 0 auto;
+    margin-left: 24%;
+    align-items: center;
+    line-height: 68px;
+    // justify-content: center;
+    font-size: 34px;
+    font-weight: 700;
+    span {
+      float: left;
+    }
+    .text-icon {
+      font-size: 40px;
+      margin-left: 4px;
+      cursor: pointer;
+    }
+  }
+}
+
 .title-status {
+  height: 100%;
   display: flex;
+  vertical-align: middle;
   align-items: center;
   position: absolute;
-  top: 16px;
+  top: 0px;
   right: 6px;
+  div {
+    vertical-align: middle;
+    display: inline-block;
+    margin-top: 7px;
+  }
+  .cloud-connection-status {
+    // margin-top: 5px;
+  }
 }
 .connection-info {
   margin-right: 10px;
   cursor: pointer;
 }
 .device-name {
-  max-width: 340px;
+  max-width: 180px;
   font-size: 40px;
   color: #fff;
 }
+.cloud-connection-status {
+  margin-right: 10px;
+}
+.params-config {
+  cursor: pointer;
+}
 </style>

--
Gitblit v1.8.0