优化快捷菜单组件

src/components/app-quick-menus/app-quick-menus/app-quick-menus.less

+.app-quick-menus{
+  .menuIcon{
+    padding: 0px;
+    display: flex;
+    width: 140px;
+    height: 80px;
+    border: 1px #F68080 solid;
+    align-items: center;
+    margin: 0;
+    background-color: #FCCFCF;
+    justify-content: space-around;
+    flex-direction: column;
+    span{
+      font-size: 40px;
+    }
+  }
+}
+

src/components/app-quick-menus/app-quick-menus/app-quick-menus.vue

+<template>
+  <div class="app-quick-menus">
+    <template v-for="(item,index) in menus">
+      <card :bordered="false" v-if="item.items && Array.isArray(item.items)" :key="index">
+        <p slot="title" @click="$emit('menuClick',item.name, [item.name])">
+          <span style="margin-right:12px">
+            <img :src="item.icon" v-if="!Object.is(item.icon, '')" />
+            <img :src="item.iconcls" v-else-if="!Object.is(item.iconcls, '')" />
+            <i class="fa fa-cogs" v-else></i>
+          </span>
+          <span>{{$t('app.menus.iconmenu.' + item.name)}}</span>
+          <span class="line"></span>
+        </p>
+        <p style=" display: 'flex' ">
+          <app-quick-menus :menus="item.items" :ctrlName = "ctrlName"></app-quick-menus>
+        </p>
+      </card>
+      <card
+        :key="index"
+        :style=" {
+            width:'140px',
+            height: '80px',
+            wordBreak: 'break-all',
+            cursor: 'pointer',
+            margin: '0',
+            border:'0',
+            padding:'0',
+            display: 'flex',
+            alignItems: 'center'
+        }"
+        :padding="0"
+        v-else
+      >
+        <div @click="$emit('menuClick',item.name, [item.name])" class="menuIcon">
+          <span>
+            <img :src="item.icon" v-if="!Object.is(item.icon, '')" />
+            <img :src="item.iconcls" v-else-if="!Object.is(item.iconcls, '')" />
+            <i class="fa fa-cogs" v-else></i>
+          </span>
+          <h4>{{$t('app.menus.iconmenu.' + item.name)}}</h4>
+        </div>
+      </card>
+    </template>
+  </div>
+</template>
+
+<script lang='ts'>
+import { Component, Vue, Prop, Model, Watch } from "vue-property-decorator";
+
+@Component({})
+export default class AppQuickMenus extends Vue {
+  /**
+   * 菜单数据
+   *
+   * @type {*}
+   * @memberof AppQuickMenus
+   */
+  @Prop({ default: [] }) public menus!: any;
+
+  /**
+   * 部件名称
+   * 
+   * @type {String}
+   * @memberof AppQuickMenus
+   */
+  @Prop() public ctrlName!:String;
+}
+</script>
+
+<style lang='less'>
+@import "./app-quick-menus.less";
+</style>
\ No newline at end of file