创建新窗口

frontend/src/config/router.config.js

@@ -33,6 +33,11 @@ export const constantRouterMap = [
             name: 'DemoWindowViewIndex',
             component: () => import('@/views/demo/windowview/Index')
           },
+          {
+            path: '/demo/window/index',
+            name: 'DemoWindowIndex',
+            component: () => import('@/views/demo/window/Index')
+          },          
           {
             path: '/demo/shortcut/index',
             name: 'DemoShortcutIndex',

frontend/src/layouts/DemoMenu.vue

@@ -42,6 +42,12 @@ export default {
           pageName: 'DemoWindowViewIndex',
           params: {}
         },
+        'menu_401' : {
+          icon: 'profile',
+          title: '窗口',
+          pageName: 'DemoWindowIndex',
+          params: {}
+        },
         'menu_500' : {
           icon: 'profile',
           title: '软件',

frontend/src/views/demo/window/Index.vue

@@ -0,0 +1,65 @@
+<template>
+  <div id="app-demo-window-view">
+    <div class="one-block-1">
+      <span>
+        1. 新窗口中加载web内容
+      </span>
+    </div>  
+    <div class="one-block-2">
+      <a-space>
+        <a-button @click="createWindow(0)">打开哔哩哔哩</a-button>
+      </a-space>
+    </div>
+    <div class="one-block-1">
+      <span>
+        2. 新窗口中加载html内容
+      </span>
+    </div>  
+    <div class="one-block-2">
+      <a-space>
+        <a-button @click="createWindow(1)">打开html页面</a-button>
+      </a-space>
+    </div>
+  </div>
+</template>
+<script>
+
+export default {
+  data() {
+    return {
+      views: [
+        {
+          type: 'web',
+          content: 'https://www.bilibili.com/'
+        },
+        {
+          type: 'html',
+          content: '/asset/view_example.html'
+        },        
+      ],
+    };
+  },
+  methods: {
+    createWindow (index) {
+      const self = this;
+      self.$ipcCallMain('example.createWindow', this.views[index]).then(r => {
+        console.log(r);
+      })
+    },
+  }
+};
+</script>
+<style lang="less" scoped>
+#app-demo-window-view {
+  padding: 0px 10px;
+  text-align: left;
+  width: 100%;
+  .one-block-1 {
+    font-size: 16px;
+    padding-top: 10px;
+  }
+  .one-block-2 {
+    padding-top: 10px;
+  }
+}
+</style>

frontend/src/views/demo/windowview/Index.vue

@@ -2,20 +2,26 @@
   <div id="app-demo-window-view">
     <div class="one-block-1">
       <span>
-        1. 嵌入更多的 web 内容
+        1. 嵌入web内容
       </span>
     </div>  
     <div class="one-block-2">
       <a-space>
         <a-button @click="loadViewContent(0)">加载百度页面</a-button>
         <a-button @click="removeViewContent(0)">移除百度页面</a-button>
+      </a-space>
+    </div>
+    <div class="one-block-1">
+      <span>
+        2. 嵌入html内容
+      </span>
+    </div>  
+    <div class="one-block-2">
+      <a-space>
         <a-button @click="loadViewContent(1)">加载html页面</a-button>
         <a-button @click="removeViewContent(1)">移除html页面</a-button>
       </a-space>
     </div>
-    <div class="one-block-2">
-      <template></template>
-    </div>
   </div>
 </template>
 <script>