修改配置

src/benyun/components/byForm/byForm.vue

@@ -206,6 +206,6 @@ export default class ByForm extends Vue {
 
 <style lang="scss">
 .by-form-item{
-  margin-bottom: 10px;
+  margin-bottom: 10px !important;
 }
 </style>

src/benyun/components/byTool/byTool.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="tool">
     <div class="tool-left">
-
+      <el-button v-for="(item,index) of showTools" :icon="item.icon" :key="index" size="small" @click="clickBtn(item)">{{ item.name }}</el-button>
     </div>
   </div>
 </template>
@@ -12,6 +12,9 @@ import { Component, Prop, Vue, Mixins } from 'vue-property-decorator'
   // components: { logDrawer }
 })
 export default class GmTools extends Vue {
+  @Prop()
+  propConfig:any
+
   tools:Array<any>=[
     { name: '新增', icon: 'el-icon-plus', clickName: 'onAdd', _class: 'onAdd' },
     { name: '修改', icon: 'el-icon-edit', clickName: 'onUpdate', _class: 'onUpdate' },
@@ -20,8 +23,27 @@ export default class GmTools extends Vue {
   ]
   showTools:Array<any>=[]
 
+  created(){
+    if(this.propConfig?.tools){
+      this.setTool(this.propConfig?.tools)
+    }
+  }
+
   setTool(data:any){
-    
+    this.showTools = [];
+    for(const item of this.tools){
+      if(data[item._class]){
+        this.showTools.push(item)
+      }
+    }
+  }
+
+  clickBtn(item:any){
+    if(item?.event?.click){
+      item.event.click()
+    }else{
+      this.$emit(item.clickName)
+    }
   }
 }
 </script>
@@ -33,5 +55,8 @@ export default class GmTools extends Vue {
   display: flex;
   justify-content: space-between;
   align-items: center;
+  .tool-left{
+    width: 70%;;
+  }
 }
 </style>

src/benyun/plugins/componentRegister.ts

@@ -22,6 +22,10 @@ const comps: Array<comBase> = [
   {
     name: "byTable",
     component: () => import("@/benyun/components/byTable/byTable.vue"),
+  },
+  {
+    name: "byTool",
+    component: () => import("@/benyun/components/byTool/byTool.vue"),
   }
 ];
 

src/components/HelloWorld.vue

@@ -1,61 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa" target="_blank" rel="noopener">pwa</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
-  </div>
-</template>
-
-<script lang="ts">
-import { Component, Prop, Vue } from 'vue-property-decorator';
-
-@Component
-export default class HelloWorld extends Vue {
-  @Prop() private msg!: string;
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="scss">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

src/views/AboutView.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="about">
-    <h1>This is an about page77</h1>
-  </div>
-</template>

src/views/audit/collaborationLog/index.vue

@@ -1,3 +1,3 @@
 <template>
-  <div>123</div>
+  <div>1230000000000000</div>
 </template>

src/views/demo/form.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="form" >
+    <by-tool :propConfig="toolConfig" @onAdd="onAdd" />
     <by-form :propConfig="config" ref="form" />
     <el-button type="primary" @click="getFormData">获取数据</el-button>
     <el-button type="primary" @click="getFormVali">获取表单验证</el-button>
@@ -93,6 +94,19 @@ export default class DemoForm extends Vue {
     ]
   }
 
+  toolConfig:any={
+    tools:{
+      onAdd:true,
+      onUpdate:true,
+      onDelete:true,
+      onExport:true
+    }
+  }
+
+  onAdd(){
+    console.log('新增操作')
+  }
+
   getFormData(){
     let data = (this as any).$refs.form.getValue();
     console.log('表单数据：',data);