optimize dialog components

.gitignore copy

@@ -1,23 +0,0 @@
-.DS_Store
-node_modules
-/dist
-
-
-# local env files
-.env.local
-.env.*.local
-
-# Log files
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-
-# Editor directories and files
-.idea
-.vscode
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?

README.md

@@ -35,8 +35,8 @@ docker run -d --name subweb --restart always \
   stilleshan/subweb
 ```
 
-同时也可以不挂载目录,直接通过`-e`环境变量来修改`API 地址`,`短链接地址`和`站点名称`,但是无法修改`导航链接`.
-`注意:以下域名请严格填写 http/https 协议,结尾不要 /`
+同时也可以不挂载目录,直接通过`-e`环境变量来修改`API 地址`,`短链接地址`和`站点名称`,但是无法修改`导航链接`.  
+`注意:以下域名请严格填写 http 或 https 协议,结尾不要 / 斜杠符号.`
 ```shell
 docker run -d --name subweb --restart always \
   -p 18080:80 \

src/components/common/dialog/DialogLayOut.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog v-model="dialogVisible" top="30vh" width="40%">
+  <el-dialog v-model="isShow" top="30vh" width="40%">
     <span>
       <p style="text-align: center">{{ message }}</p>
     </span>
@@ -15,15 +15,17 @@ export default {
   components: {
     ElDialog,
   },
-  props: {
-    dialogVisible: {
-      type: Boolean,
-      default: false,
-    },
-    message: {
-      type: String,
-      default: '这是一个封装好的弹窗组建',
-    },
+  data() {
+    return {
+      isShow: false,
+      message: '',
+    };
+  },
+  created() {
+    this.emitter.on('DialogLayOut', (DialogLayOut) => {
+      this.isShow = true;
+      this.message = DialogLayOut;
+    });
   },
 };
 </script>

src/components/common/dialog/index.js

@@ -0,0 +1,5 @@
+const dialogOut = function (that, Msg) {
+  that.emitter.emit('DialogLayOut', Msg);
+};
+
+export default dialogOut;

src/layouts/Layout.vue

@@ -5,11 +5,13 @@
       <header-view />
       <content-view />
       <footer-view />
+      <dialog-lay-out />
     </div>
   </body>
 </template>
 
 <script>
+import DialogLayOut from 'components/common/dialog/DialogLayOut.vue';
 import NavBarMobile from './components/header/NavBarMobile';
 import HeaderView from './HeaderView';
 import ContentView from './ContentView';
@@ -22,6 +24,7 @@ export default {
     HeaderView,
     ContentView,
     FooterView,
+    DialogLayOut,
   },
   data() {
     return {

src/views/home/HomeForm.vue

@@ -147,22 +147,14 @@
       </div>
     </form>
   </div>
-  <DialogLayOut
-    :dialogVisible="dialogVisible"
-    @closed="resetDialog"
-    :message="dialogMessage"
-  ></DialogLayOut>
 </template>
 
 <script>
 import { request } from 'network';
 import utils from './utils.js';
-import DialogLayOut from 'components/common/dialog/DialogLayOut.vue';
+import dialogOut from 'components/common/dialog';
 export default {
   name: 'HomeForm',
-  components: {
-    DialogLayOut,
-  },
   setup() {
     const ENV = {
       DEFAULT_MORECONFIG: {
@@ -219,8 +211,6 @@ export default {
         { value: 'ssr', text: 'SSR' },
         { value: 'loon', text: 'Loon' },
       ],
-      dialogVisible: false,
-      dialogMessage: '',
     };
   },
   created() {
@@ -234,12 +224,8 @@ export default {
         this.isShowMoreConfig = true;
       }
     },
-    showDialog(msg) {
-      this.dialogMessage = msg;
-      this.dialogVisible = true;
-    },
-    resetDialog() {
-      this.dialogVisible = false;
+    showDialog(Msg) {
+      dialogOut(this, Msg);
     },
     selectApi(event) {
       if (event.target.value == 'manual') {