[Feat 0000] 为可配置首页添加标题跳转功能

src/views/vent/deviceManager/configurationTable/types.ts

@@ -190,7 +190,7 @@ export interface ModuleData {
   complex_list: ModuleDataComplexList[];
   /** 如果目前没有数据可以对接，可使用模拟数据先行展示 */
   mock?: any[];
-  /** 如果模块需要跳转，可以在这里配置，formatter 格式，取值时和 readFrom 执行同一规则 */
+  /** 如果模块需要跳转，可以在这里配置，不支持 formatter 格式 */
   to?: string;
 }
 export interface ShowStyle {

src/views/vent/home/configurable/components/ModuleCommon.vue

@@ -1,7 +1,7 @@
 <template>
   <ventBox1 class="module-common" :style="style">
     <template #title>
-      <div>{{ moduleName }}</div>
+      <div @click="clickHandler">{{ moduleName }}</div>
     </template>
     <template #container>
       <slot></slot>
@@ -20,7 +20,7 @@
     moduleName: string;
     visible: boolean;
   }>();
-  defineEmits(['close']);
+  const emit = defineEmits(['close', 'click']);
 
   const style = computed(() => {
     const size = props.showStyle.size;
@@ -35,6 +35,9 @@
   //   }
   //   return ModuleLeft;
   // }
+  function clickHandler() {
+    emit('click');
+  }
 </script>
 <style scoped>
   .module-common .box1-center {

src/views/vent/home/configurable/components/ModuleEnhanced.vue

@@ -1,5 +1,12 @@
 <template>
-  <component :is="getModuleComponent(showStyle.position)" :style="style" :title="moduleName" :visible="visible" @close="$emit('close')">
+  <component
+    :is="getModuleComponent(showStyle.position)"
+    :style="style"
+    :title="moduleName"
+    :visible="visible"
+    @close="$emit('close')"
+    @click="$emit('click')"
+  >
     <slot></slot>
   </component>
 </template>
@@ -15,7 +22,7 @@
     moduleName: string;
     visible: boolean;
   }>();
-  defineEmits(['close']);
+  defineEmits(['close', 'click']);
 
   const style = computed(() => {
     const size = props.showStyle.size;

src/views/vent/home/configurable/components/ModuleOriginal.vue

@@ -1,5 +1,12 @@
 <template>
-  <component :is="getModuleComponent(showStyle.position)" :style="style" :title="moduleName" :visible="visible" @close="$emit('close')">
+  <component
+    :is="getModuleComponent(showStyle.position)"
+    :style="style"
+    :title="moduleName"
+    :visible="visible"
+    @close="$emit('close')"
+    @click="$emit('click')"
+  >
     <slot></slot>
   </component>
 </template>
@@ -14,7 +21,7 @@
     moduleName: string;
     visible: boolean;
   }>();
-  defineEmits(['close']);
+  defineEmits(['close', 'click']);
 
   const style = computed(() => {
     const size = props.showStyle.size;

src/views/vent/home/configurable/components/enhanced/moduleBottom.vue

@@ -4,7 +4,7 @@
     <div v-if="visible" class="module-content">
       <div class="module-content__title__expand">
         <span class="action-btn close-btn" @click="closeModel"></span>
-        {{ title }}
+        <span @click="clickHandler">{{ title }}</span>
       </div>
       <div class="module-slot">
         <slot></slot>
@@ -21,11 +21,14 @@
 </template>
 <script lang="ts" setup>
   defineProps<{ title: string; visible: boolean }>();
-  const emit = defineEmits(['close']);
+  const emit = defineEmits(['close', 'click']);
 
   function closeModel() {
     emit('close');
   }
+  function clickHandler() {
+    emit('click');
+  }
 </script>
 <style lang="less" scoped>
   .module-bottom {

src/views/vent/home/configurable/components/enhanced/moduleLeft.vue

@@ -4,7 +4,7 @@
     <div v-if="visible" class="module-content">
       <div class="module-content__title__expand">
         <span class="action-btn close-btn" @click="closeModel"></span>
-        {{ title }}
+        <span @click="clickHandler">{{ title }}</span>
       </div>
       <div class="module-slot">
         <slot></slot>
@@ -21,11 +21,14 @@
 </template>
 <script lang="ts" setup>
   defineProps<{ title: string; visible: boolean }>();
-  const emit = defineEmits(['close']);
+  const emit = defineEmits(['close', 'click']);
 
   function closeModel() {
     emit('close');
   }
+  function clickHandler() {
+    emit('click');
+  }
 </script>
 <style lang="less" scoped>
   .module-left {

src/views/vent/home/configurable/components/enhanced/moduleRight.vue

@@ -4,7 +4,7 @@
     <div v-if="visible" class="module-content">
       <div class="module-content__title__expand">
         <span class="action-btn close-btn" @click="closeModel"></span>
-        {{ title }}
+        <span @click="clickHandler">{{ title }}</span>
       </div>
       <div class="module-slot">
         <slot></slot>
@@ -21,11 +21,14 @@
 </template>
 <script lang="ts" setup>
   defineProps<{ title: string; visible: boolean }>();
-  const emit = defineEmits(['close']);
+  const emit = defineEmits(['close', 'click']);
 
   function closeModel() {
     emit('close');
   }
+  function clickHandler() {
+    emit('click');
+  }
 </script>
 <style lang="less" scoped>
   .module-right {

src/views/vent/home/configurable/components/original/moduleBottom.vue

@@ -4,7 +4,7 @@
     <div v-if="visible" class="module-content">
       <div class="module-content__title__expand">
         <span class="action-btn close-btn" @click="closeModel"></span>
-        {{ title }}
+        <span @click="clickHandler">{{ title }}</span>
       </div>
       <div class="module-slot">
         <slot></slot>
@@ -21,11 +21,14 @@
 </template>
 <script lang="ts" setup>
   defineProps<{ title: string; visible: boolean }>();
-  const emit = defineEmits(['close']);
+  const emit = defineEmits(['close', 'click']);
 
   function closeModel() {
     emit('close');
   }
+  function clickHandler() {
+    emit('click');
+  }
 </script>
 <style lang="less" scoped>
   .module-bottom {

src/views/vent/home/configurable/components/original/moduleLeft.vue

@@ -4,7 +4,7 @@
     <div v-if="visible" class="module-content">
       <div class="module-content__title__expand">
         <span class="action-btn close-btn" @click="closeModel"></span>
-        {{ title }}
+        <span @click="clickHandler">{{ title }}</span>
       </div>
       <div class="module-slot">
         <slot></slot>
@@ -21,11 +21,14 @@
 </template>
 <script lang="ts" setup>
   defineProps<{ title: string; visible: boolean }>();
-  const emit = defineEmits(['close']);
+  const emit = defineEmits(['close', 'click']);
 
   function closeModel() {
     emit('close');
   }
+  function clickHandler() {
+    emit('click');
+  }
 </script>
 <style lang="less" scoped>
   .module-left {

src/views/vent/home/configurable/index.vue

@@ -15,12 +15,26 @@
     </a-dropdown> -->
     <!-- 采用定位方式以避免出现各个模块隐藏时其他模块下移的问题 -->
     <template v-if="isOriginal">
-      <ModuleOriginal v-for="cfg in configs" :key="cfg.deviceType" :show-style="cfg.showStyle" :module-name="cfg.moduleName" :visible="true">
+      <ModuleOriginal
+        v-for="cfg in configs"
+        :key="cfg.deviceType"
+        :show-style="cfg.showStyle"
+        :module-name="cfg.moduleName"
+        :visible="true"
+        @click="redirectTo(cfg)"
+      >
         <Content v-bind="cfg" />
       </ModuleOriginal>
     </template>
     <template v-else-if="isCommon">
-      <ModuleCommon v-for="cfg in configs" :key="cfg.deviceType" :show-style="cfg.showStyle" :module-name="cfg.moduleName" :visible="true">
+      <ModuleCommon
+        v-for="cfg in configs"
+        :key="cfg.deviceType"
+        :show-style="cfg.showStyle"
+        :module-name="cfg.moduleName"
+        :visible="true"
+        @click="redirectTo(cfg)"
+      >
         <Content v-bind="cfg" />
       </ModuleCommon>
     </template>
@@ -33,6 +47,7 @@
         :show-style="cfg.showStyle"
         :module-name="cfg.moduleName"
         @close="cfg.visible = false"
+        @click="redirectTo(cfg)"
       >
         <Content v-bind="cfg" />
       </ModuleEnhanced>
@@ -57,6 +72,7 @@
   import Content from './components/content.vue';
   import { testConfigA } from './configurable.data';
   import { useRoute } from 'vue-router';
+  import { openWindow } from '/@/utils';
 
   interface EnhancedConfig extends Config {
     visible: boolean;
@@ -73,6 +89,12 @@
   });
   const { configs, isOriginal, isCommon, fetchConfigs } = useInitConfigs();
 
+  function redirectTo(config: Config) {
+    const { to } = config.moduleData;
+    if (!to) return;
+    openWindow(to);
+  }
+
   onMounted(() => {
     const query = useRoute().query;
     if (query.fire) {