update: 首页优化 剩跳转未对接

src/views/home/components/DeviceHome/index.vue

@@ -18,10 +18,25 @@
                 :dataList="deviceStepDetails"
             />
         </j-row>
-    </div> 
+
+        <div class="dialog">
+            <ProductChooseDialog
+                v-if="productDialogVisible"
+                v-model:visible="productDialogVisible"
+                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id })"
+            />
+            <DeviceChooseDialog
+                v-if="deviceDialogVisible"
+                v-model:visible="deviceDialogVisible"
+                @confirm="(id:string)=>jumpPage('device/Instance/Detail', { id })"
+            />
+        </div>
+    </div>
 </template>
 
 <script setup lang="ts" name="deviceHome">
+import ProductChooseDialog from '../dialogs/ProductChooseDialog.vue';
+import DeviceChooseDialog from '../dialogs/DeviceChooseDialog.vue';
 import BootCard from '../BootCard.vue';
 import DeviceCountCard from '../DeviceCountCard.vue';
 import PlatformPicCard from '../PlatformPicCard.vue';
@@ -29,6 +44,7 @@ import StepCard from '../StepCard.vue';
 
 import { usePermissionStore } from '@/store/permission';
 import { bootConfig, recommendList } from '../../typing';
+import { useMenuStore } from '@/store/menu';
 
 // 按钮权限控制
 const hasPermission = usePermissionStore().hasPermission;
@@ -39,6 +55,11 @@ const devicePermission = (action: string) =>
 const rulePermission = (action: string) =>
     hasPermission(`rule-engine/Instance:${action}`);
 
+const { jumpPage } = useMenuStore();
+
+const productDialogVisible = ref(false);
+const deviceDialogVisible = ref(false);
+
 const deviceBootConfig: bootConfig[] = [
     {
         english: 'STEP1',
@@ -87,7 +108,9 @@ const deviceStepDetails: recommendList[] = [
         iconUrl: '/images/home/bottom-1.png',
         linkUrl: 'device/Product/Detail',
         auth: productPermission('update'),
-        dialogTag: 'accessMethod',
+        onClick: () => {
+            productDialogVisible.value = true;
+        },
     },
     {
         title: '添加测试设备',
@@ -105,7 +128,9 @@ const deviceStepDetails: recommendList[] = [
             '对添加的测试设备进行功能调试，验证能否连接到平台，设备功能是否配置正确。',
         iconUrl: '/images/home/bottom-2.png',
         linkUrl: 'device/Instance/Detail',
-        dialogTag: 'funcTest',
+        onClick: () => {
+            deviceDialogVisible.value = true;
+        },
     },
     {
         title: '批量添加设备',

src/views/home/components/InitHome/index.vue

@@ -3,34 +3,34 @@
         <div class="title">请选择首页视图</div>
 
         <div class="choose-view">
-            <a-row class="view-content" :gutter="24">
-                <a-col
+            <j-row class="view-content" :gutter="24">
+                <j-col
                     :span="8"
                     class="select-item"
                     :class="{ selected: selectValue === 'device' }"
                     @click="selectValue = 'device'"
                 >
                     <img :src="getImage('/home/device.png')" alt="" />
-                </a-col>
-                <a-col
+                </j-col>
+                <j-col
                     :span="8"
                     class="select-item"
                     :class="{ selected: selectValue === 'ops' }"
                     @click="selectValue = 'ops'"
                 >
                     <img :src="getImage('/home/ops.png')" alt="" />
-                </a-col>
-                <a-col
+                </j-col>
+                <j-col
                     :span="8"
                     class="select-item"
                     :class="{ selected: selectValue === 'comprehensive' }"
                     @click="selectValue = 'comprehensive'"
                 >
                     <img :src="getImage('/home/comprehensive.png')" alt="" />
-                </a-col>
-            </a-row>
-            <a-button type="primary" class="btn" @click="confirm"
-                >确定</a-button
+                </j-col>
+            </j-row>
+            <j-button type="primary" class="btn" @click="confirm"
+                >确定</j-button
             >
         </div>
     </div>