feat(components): 编写开关确认组件，用于修改位参数值

src/components/BitSwitchConfirm.vue

@@ -0,0 +1,80 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+import { Modal } from 'ant-design-vue';
+
+import { t } from '@/i18n';
+
+import type { DevStartStopStatus, GroupModuleDevParam } from '@/types';
+
+interface Props {
+  info: GroupModuleDevParam;
+  startStopStatus?: DevStartStopStatus;
+}
+
+const props = defineProps<Props>();
+
+const emit = defineEmits<{
+  ok: [value: string];
+}>();
+
+const isStartStopParam = computed(() => {
+  return /startstoporder/i.test(props.info.dataCode);
+});
+
+const disableStartStopCtrl = computed(() => {
+  if (isStartStopParam.value) {
+    return !props.startStopStatus?.status;
+  }
+
+  return false;
+});
+
+const disableStartStopTip = computed(() => {
+  return props.startStopStatus?.message.join('\n');
+});
+
+const handleSwitchClick = (checked: string) => {
+  const value = checked === props.info.bitAddress0Detail ? props.info.bitAddress0Status : props.info.bitAddress1Status;
+
+  Modal.confirm({
+    title: t('realTimeMonitor.confirmSwitchToMode', { mode: checked }),
+    closable: true,
+    centered: true,
+    onOk() {
+      props.info.value = checked;
+      emit('ok', value as string);
+    },
+  });
+};
+</script>
+
+<template>
+  <span class="bit-switch-container">
+    <ATooltip overlay-class-name="hvac-tooltip">
+      <template #title>{{ disableStartStopTip }}</template>
+      <SvgIcon v-show="disableStartStopCtrl && disableStartStopTip" name="info-cirlce-o" />
+    </ATooltip>
+    <ASwitch
+      :checked="info.value"
+      :checked-value="<string>info.bitAddress1Detail"
+      :un-checked-value="<string>info.bitAddress0Detail"
+      :checked-children="info.bitAddress1Detail"
+      :un-checked-children="info.bitAddress0Detail"
+      :disabled="disableStartStopCtrl"
+      @click="handleSwitchClick($event as string)"
+    />
+  </span>
+</template>
+
+<style lang="scss" scoped>
+.bit-switch-container {
+  display: flex;
+  align-items: center;
+
+  i {
+    margin-right: 8px;
+    font-size: 12px;
+    color: #999;
+  }
+}
+</style>