feat: 新增图表选择组件

frontend/package.json

@@ -51,7 +51,8 @@
     "yan-progress": "^1.0.3",
     "sass": "^1.26.10",
     "sass-loader": "^7.1.0",
-    "svgo": "1.2.0"
+    "svgo": "1.2.0",
+    "svg-sprite-loader": "4.1.3"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^4.1.0",

frontend/src/business/components/settings/sys/menu.vue

@@ -65,7 +65,7 @@
       <el-form ref="menuForm" inline :model="form" :rules="rule" size="small" label-width="80px">
 
         <el-form-item label="菜单类型" prop="type">
-          <el-radio-group v-model="form.type" size="mini" style="width: 178px">
+          <el-radio-group v-model="form.type" size="mini" style="width: 179px">
             <el-radio-button label="0">目录</el-radio-button>
             <el-radio-button label="1">菜单</el-radio-button>
             <el-radio-button label="2">按钮</el-radio-button>
@@ -74,7 +74,7 @@
         <el-form-item v-show="form.type!== '2'" label="菜单图标" prop="icon">
           <el-popover
             placement="bottom-start"
-            width="450"
+            width="425"
             trigger="click"
             @show="$refs['iconSelect'].reset()"
           >
@@ -104,25 +104,25 @@
           </el-radio-group>
         </el-form-item>
         <el-form-item v-if="form.type !== '2'" label="菜单标题" prop="title">
-          <el-input v-model="form.title" :style=" form.type === '0' ? 'width: 450px' : 'width: 178px'" placeholder="菜单标题" />
+          <el-input v-model="form.title" :style=" form.type === '0' ? 'width: 450px' : 'width: 179px'" placeholder="菜单标题" />
         </el-form-item>
         <el-form-item v-if="form.type === '2'" label="按钮名称" prop="title">
-          <el-input v-model="form.title" placeholder="按钮名称" style="width: 178px;" />
+          <el-input v-model="form.title" placeholder="按钮名称" style="width: 179px;" />
         </el-form-item>
         <el-form-item v-show="form.type !== '0'" label="权限标识" prop="permission">
-          <el-input v-model="form.permission" :disabled="form.iframe" placeholder="权限标识" style="width: 178px;" />
+          <el-input v-model="form.permission" :disabled="form.iframe" placeholder="权限标识" style="width: 179px;" />
         </el-form-item>
         <el-form-item v-if="form.type !== '2'" label="路由地址" prop="path">
-          <el-input v-model="form.path" placeholder="路由地址" style="width: 178px;" />
+          <el-input v-model="form.path" placeholder="路由地址" style="width: 179px;" />
         </el-form-item>
         <el-form-item label="菜单排序" prop="menuSort">
-          <el-input-number v-model.number="form.menuSort" :min="0" :max="999" controls-position="right" style="width: 178px;" />
+          <el-input-number v-model.number="form.menuSort" :min="0" :max="999" controls-position="right" style="width: 179px;" />
         </el-form-item>
         <el-form-item v-show="!form.iframe && form.type === '1'" label="组件名称" prop="componentName">
-          <el-input v-model="form.componentName" style="width: 178px;" placeholder="匹配组件内Name字段" />
+          <el-input v-model="form.componentName" style="width: 179px;" placeholder="匹配组件内Name字段" />
         </el-form-item>
         <el-form-item v-show="!form.iframe && form.type === '1'" label="组件路径" prop="component">
-          <el-input v-model="form.component" style="width: 178px;" placeholder="组件路径" />
+          <el-input v-model="form.component" style="width: 179px;" placeholder="组件路径" />
         </el-form-item>
         <el-form-item label="上级类目" prop="pid">
           <treeselect

frontend/vue.config.js

@@ -38,5 +38,21 @@ module.exports = {
   },
   chainWebpack(config) {
     config.plugins.delete('prefetch')
+    // set svg-sprite-loader
+    config.module
+      .rule('svg')
+      .exclude.add(resolve('src/assets/icons'))
+      .end()
+    config.module
+      .rule('icons')
+      .test(/\.svg$/)
+      .include.add(resolve('src/assets/icons'))
+      .end()
+      .use('svg-sprite-loader')
+      .loader('svg-sprite-loader')
+      .options({
+        symbolId: 'icon-[name]'
+      })
+      .end()
   }
 };