fix: 通道流码深兼容暗黑模式

src/views/iot/device/channel/component/detail.vue

@@ -66,7 +66,7 @@
 					<TaskDialog ref="taskDialogRef" :formatOptions="formatOptions" @finish="getList()" />
 				</el-tab-pane>
 				<!-- 通道码流 -->
-				<el-tab-pane :label="$t('message.channel.channelTitle')" name="3">
+				<el-tab-pane :label="$t('message.channel.stream')" name="3">
 					<div>
 						<!-- 开始 -->
 						<el-button :type="evsrc ? 'info' : 'primary'" @click="openEv()">{{ $t('message.channel.start') }}</el-button>
@@ -91,10 +91,16 @@ import api from '/@/api/device/modbus';
 import { getOtherServersOrigin } from '/@/utils/origin';
 import TaskDialog from './taskDialog.vue';
 import { useI18n } from 'vue-i18n';
+import { useStore } from '/@/store/index';
+
 // 国际化
 const { locale, t } = useI18n();
+// 主题
+const store = useStore();
 
 const currentLocale = computed(() => locale.value);
+const isDark = computed(() => store.state.themeConfig.themeConfig.isIsDark);
+
 const taskDialogRef = ref();
 const logContainerRef = ref();
 const dialogVisible = ref(false);
@@ -202,7 +208,7 @@ const initEv = () => {
 		
 		evsrc.value.onopen = (event: any) => {
 			// 连接成功
-				logContainerRef.value?.insertAdjacentHTML('beforeEnd', `<li style="color: #67C23A;">${t('message.channel.connectSuccess')}...</li>`);
+				logContainerRef.value?.insertAdjacentHTML('beforeEnd', `<li style="color: ${isDark.value ? '#fff' : '#67C23A'};">${t('message.channel.connectSuccess')}...</li>`);
 		};
 		
 		evsrc.value.onmessage = (ev: any) => {
@@ -238,7 +244,7 @@ const initEv = () => {
 
 const openEv = () => {
 	// 开始
-	(logContainerRef.value as any).insertAdjacentHTML('beforeEnd', `<li style="color: #000;">${t('message.channel.start')}...</li>`);
+	(logContainerRef.value as any).insertAdjacentHTML('beforeEnd', `<li style="color: ${isDark.value ? '#fff' : '#67C23A'};">${t('message.channel.start')}...</li>`);
 	initEv();
 }
 const closeEv = (log = true) => {
@@ -303,11 +309,13 @@ defineExpose({ open });
 }
 
 [data-theme='dark'] {
-
-	#logContainer  {
+	#logContainer {
 		background-color: transparent;
-		color: #fff;
 		border-color: #333333;
+		
+		// :deep(li) {
+		// 	color: #fff !important;
+		// }
 	}
 }
 </style>