init

src/mixins/code_modal.js

@@ -0,0 +1,8 @@
+import codeModal from "../components/codeModal/index.js";
+export default {
+    methods: {
+        showCode({ name, url, type = "vue" }) {
+            codeModal({ name, url, type });
+        }
+    }
+};

src/mixins/self_viewport.js

@@ -0,0 +1,36 @@
+export const self_viewport = {
+    data() {
+        return {
+            tableHeight: null
+        };
+    },
+    computed: {
+        useTableHeight() {
+            return (settings = {}) => {
+                let { isSearch = true, isPage = true, isTabs = false, isOperat = true, otherH = 0 } = settings;
+                let bodyH = this.tableHeight,
+                    headerH = 112,
+                    searchH = 52,
+                    operatH = 48,
+                    tabsH = 56,
+                    pageH = 72,
+                    paddingH = 8;
+                let tableH = bodyH - headerH - paddingH;
+                isOperat && (tableH -= operatH);
+                isTabs && (tableH -= tabsH);
+                isSearch && (tableH -= searchH);
+                isPage && (tableH -= pageH);
+                otherH > 0 && (tableH -= otherH);
+                return tableH;
+            };
+        }
+    },
+    mounted() {
+        this.tableHeight = document.body.clientHeight;
+        window.onresize = () => {
+            return (() => {
+                this.tableHeight = document.body.clientHeight;
+            })();
+        };
+    }
+};

src/mixins/treeMixin.js

@@ -0,0 +1,32 @@
+// 去掉export function，写内部方法
+export default {
+    methods: {
+      treeRenderContent(h, params) {
+        const { root, node, data } = params;
+        const icon0 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAKJJREFUOE9jZKASYKSSOQzUN+j/QaH7DAwMCmgufMDw758jo+OHB4RcDnfR/4NC/3EovsDAyPgBh9wDRru3iSA5VIOkMxgYeHQIWQ6R/3CUgeHlcgZG+3dgMxAGnVT+zyAVz8DAIUecQT8eMTA8W8jAaH4XzaDrjri8htdgRs39owYRCPqhEUbYsgihNPWAUXO/IkqCJKSDkDz1cz8hGwnJAwCJjEAToczWhwAAAABJRU5ErkJggg==';
+        const iconOther = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAaVJREFUOE+t1D9v00AYx/HvpSFqqyDdgKqOqVBVIRBK3kGY6NIhqtQ1tXgBSV9B4ldAeAEoZmIB3kK8M4QljM0t7XxDhgjcXHXnP4odEoOER/vu4989z2ML/tMlypz22EhAhp5Qu9ZuhRKgh6FvIQRD4NM2cAPaAPIxFIIg9IRfTJdBJUBxn8Lgh+9EkD5wUHtsGhgmQKOsZoXnNmEr9IROIYlhBHT/CYqP6dk9uRolyWxRd4OCEPDWC++gydw0IhgLUHvg+6E74gBDO5cwBvxBG/UA74HmHrTenCRHm8yNjHA1aiYxgwS0UA/QKfDbMBQiSxxWoZNB6Vu/35nhcsVgGcV3BDjQQhH0BPQNyMMnqKc1/NdHha7ZTZefTXBxRvftKayAWw0pmL6oWkG/fIY6qNL8OoNgSkCFm2LXprb9x3W4eoXqvKBxv4jBaIV+LtFyH/lthvzyExa/HK+T9qt81z6aPsLVxIHdJpyfxnlcgh9rgOEDFUY2zUb7s+FccZ2Asl6LoSxBAchN9p+GsDBTmi1AKZQucCDo9AjbJr/0f/S3n8wj0GCqE4RTEr0AAAAASUVORK5CYII=';
+  
+        return h('span', [
+          h('img', {
+            attrs: {
+              src: node.nodeKey == 0 ? icon0 : iconOther
+            },
+            style: 'width: 16px; height: 16px;vertical-align: sub;'
+          }),
+          h('span', {
+            style: {
+              display: 'inline-block',
+              cursor: "pointer",
+              backgroundColor: node.node.selected ? "#e5e5e5" : ""
+            },
+            on: {
+              click: (e) => {
+                e.stopPropagation()
+                this.$emit("on-tree-change", node.node);
+              }
+            }
+          }, data.title)
+        ]);
+      }
+    }
+  }