提交记录一下

1

package.json

@@ -48,6 +48,7 @@
     "vue-lunar-calendar-pro": "^1.0.14",
     "vue-qr": "^2.2.1",
     "vue-quill-editor": "^3.0.6",
+    "vue-resize-directive": "^1.2.0",
     "vue-router": "3.0.6",
     "vuex": "3.1.0",
     "wangeditor": "^4.0.0",

src/constant/index.js

@@ -271,3 +271,4 @@ export const withdrawalStatus = {
   PROCESSING: '处理中',
   CANCELED: '取消'
 }
+

src/layout/components/AppMain.vue

@@ -14,15 +14,21 @@
           <router-view :key="key" v-if="needKeep" />
         </keep-alive>
         <router-view v-if="!needKeep" :key="key" /> -->
+
       </div>
     </transition>
+    <instructions />
   </section>
 </template>
 
 <script>
 import notKeepAliveList from "@/router/notKeepAliveList";
+import instructions from './instructions'
 export default {
   name: "AppMain",
+  components:{
+    instructions
+  },
   computed: {
     key() {
       return this.$route.path;
@@ -34,9 +40,18 @@ export default {
       return this.$store.state.tagsView.cachedViews;
     },
     keep() {
-      return this.$route.meta.noCache*1;   // 0是缓存 1是不缓存
+      return this.$route.meta.noCache * 1; // 0是缓存 1是不缓存
     },
+
   },
+  methods:{
+    onResize(e){
+      console.log(e)
+    },
+    showInstructions(){
+      this.isShow = !this.isShow
+    }
+  }
 };
 </script>
 
@@ -65,4 +80,5 @@ export default {
     // padding-right: 15px;
   }
 }
+
 </style>

src/layout/components/instructions.vue

@@ -0,0 +1,62 @@
+<template>
+  <div>
+    <el-button @click="showInstructions">说明书</el-button>
+    <div class="instructions" v-resize="onResize" v-show="isShow">
+      <iframe
+        id="iframeId"
+        :src="url"
+        frameborder="0"
+        class="pc iframe"
+        width="100%"
+        :height="formeHeight"
+      >
+      </iframe>
+    </div>
+  </div>
+</template>
+<script>
+import resize from "vue-resize-directive";
+const defaultSettings = require("@/settings.js");
+export default {
+  directives: {
+    resize,
+  },
+  data() {
+    return {
+      url: defaultSettings.instructions+'/#g=1&p=新建乐团',
+      isShow: false,
+    };
+  },
+  mounted() {
+    document.querySelector(".instructions")?.offsetHeight
+  },
+  methods: {
+    onResize(e) {
+      console.log(e);
+    },
+    showInstructions() {
+      this.isShow = !this.isShow;
+    },
+  },
+  computed: {
+    formeHeight() {
+      return document.querySelector(".instructions")?.offsetHeight+'px';
+    },
+  },
+};
+</script>
+<style lang="scss">
+.iframeId {
+  width: 100%;
+}
+.instructions {
+  background-color: #fff;
+  width: 100%;
+  position: fixed;
+  z-index: 9999;
+  bottom: 0;
+  left: 0;
+  border: 1px solid #ccc;
+  min-height: 300px;
+}
+</style>

src/settings.js

@@ -12,5 +12,6 @@ module.exports = {
    * @type {boolean} true | false
    * @description Whether show the logo in sidebar
    */
-  sidebarLogo: true
+  sidebarLogo: true,
+  instructions:'https://9s8uk7.axshare.com'
 }

vue.config.js

@@ -1,7 +1,6 @@
 'use strict'
 const path = require('path')
 const defaultSettings = require('./src/settings.js')
-
 function resolve (dir) {
   return path.join(__dirname, dir)
 }
@@ -105,6 +104,11 @@ module.exports = {
         target: 'http://tool.bitefu.net',
         changeOrigin: true,
       },
+      '/instructions': {
+        target: defaultSettings.instructions,
+        changeOrigin: true,
+      },
+      // instructions
 
     },
   },