界面优化

src/assets/add.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1699959198713" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6767" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M921.6 458.752h-357.888V100.864c0-27.648-22.016-49.664-49.664-49.664s-49.664 22.016-49.664 49.664v357.888H106.496c-27.648 0-49.664 22.016-49.664 49.664s22.016 49.664 49.664 49.664h357.888v358.4c0 27.648 22.016 49.664 49.664 49.664s49.664-22.016 49.664-49.664v-358.4H921.6c27.648 0 49.664-22.016 49.664-49.664s-22.016-49.664-49.664-49.664z" fill="#ffffff" p-id="6768"></path></svg>
\ No newline at end of file

src/assets/close.svg

+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="200px" height="200px" viewBox="0 0 200 200" enable-background="new 0 0 200 200" xml:space="preserve">  <image id="image0" width="200" height="200" x="0" y="0"
+    href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAMAAACahl6sAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
+AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAACUlBMVEUAAADgPVLmQVDnP1Dm
+QFDlQFDmP1DkQE7lP07lQE7mP07/QEDnP03lQFDmP1DkP0/kP0/lQU/pQ07kQVDlP0/mQU/lQE/i
+Pk7mQVDlQE/kQVDlP0/kP0/lQU7mQFDmQE/mQFDmQE/lQU/lQE/lQE/mQE7/AADlQE/lQE/lQU/k
+P0/lP1DlQE/lQE/kP1DkPlDkQE/lQE/jPk7jQ07lQU/mQVDnPU/lQFDkQE7mP0/lQE/lQE/lPk/l
+QU/mQE/oPk3lP0/mQE7mQlLlP0/lQE/iQFDkQU/lQE/lQU/mQE3lQE/lQE/kQ1HmQE/kQE/rQ1Hl
+QE/kQE/kQE/lQE/2tLr93uH83eD3uL7/7vD/7e//7fDlQVD/7O//7O7lQlH/6+3lQ1H+6u3/6+7m
+Q1LlQ1L+6ezmRFP+6evmRVPmRFL+6Or+6uzmRlT+5+rmRlX+5unmR1bmRVT+5uj+6OvmSFb+5ejm
+SVf+5OfmSVjmR1X94+bnSljnS1n94uXnTFrmSFf94eT94OPnTVvnTlzmSlj93+LnT1znT1393eHn
+UF7oUV/83N/oUl/829/oUmD82t7oU2H82d3pWGX71dnpWWboUV771Nj83ODpWmfpW2j709f70tb8
+297pXGnoU2D70dbpXWr70dX82t3pXmroVGH70NTqXmvoVGL6z9PqX2zoVWL6ztP82NzqYGzoVWP6
+ztLqYW3oVmP6zdH819vqYW7oVmT6zNHqYm7oV2T6y9D71trqY2/6zNDqYm/qYG370tfqX2v60NTp
+Xmv6zdL0oqr////6LzFiAAAAU3RSTlMAGTNJXGx5g4mMeQQ1Y4212fkXVpHJ/j6GzEOV5SeD3FC0
+atjWaAF05OFxbePgaVbTz1Iusa0qgHw9y8c6fnshubYf7etQep+eFLy7E9LSJuLv5E6/o8oAAAAB
+YktHRMVjCyt3AAAAB3RJTUUH5wsOCjEJ4oz9eAAABx5JREFUeNrtnfd3FUUUgJf0hFRSCISEJNTQ
+e4dQQgmhBG8SHtJEpYg0lSYERBSl14hUCSooCoqKgr3AH2Y2j8cOL+8lc+/c2dE98/2W3dm5852z
+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" />
+</svg>

src/assets/enlarge.svg

+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="200px" height="200px" viewBox="0 0 200 200" enable-background="new 0 0 200 200" xml:space="preserve">  <image id="image0" width="200" height="200" x="0" y="0"
+    href="data:image/png;base64,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
+TkSuQmCC" />
+</svg>

src/components/elRightClick.vue

@@ -8,7 +8,7 @@
         </div>
         <el-form label-position="right" label-width="80px" :model="actionConfig">
             <el-form-item label="查找方式">
-                <el-select id="eventType" name="eventType" v-model="actionConfig.Type" :placeholder="selectDisabled ? '请先右击选择元素' : '请选择'" @change="handleChange" filterable remote :disabled="selectDisabled">
+                <el-select id="eventType" name="eventType" v-model="actionConfig.Type" :placeholder="selectDisabled ? '右击选择元素' : '请选择'" @change="handleChange" filterable remote :disabled="selectDisabled">
                     <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                     </el-option>
                 </el-select>

webpack.config.js

@@ -15,15 +15,15 @@ module.exports = {
         打包速度很慢，仅适合在项目发布阶段使用
     */
     mode: 'development',
-    entry:{
-       main: './src/main.js', // 入口： 默认是./src/index.html
-       components: './src/components/index.js' // 组件入口文件
+    entry: {
+        main: './src/main.js', // 入口： 默认是./src/index.html
+        components: './src/components/index.js' // 组件入口文件
     },
     // 输出 告诉 webpack 在哪里输出它所创建的 bundle，以及如何命名这些文件。主要输出文件的默认值是 ./dist/main.js，其他生成文件默认放置在 ./dist 文件夹中。
     output: {
         path: path.join(__dirname, 'dist'), // 输出目录的配置，模板、样式、脚本、图片等资源的路径配置都相对于它
         filename: '[name].bundle.js', // 默认是 ./dist/main.js
-        
+
     },
     module: {
         // ... 其它规则
@@ -67,7 +67,7 @@ module.exports = {
                 exclude: /node_modules/
             },
             {
-                test: /\.(png|jpg|gif)$/i,
+                test: /\.(png|jpg|gif|svg)$/i,
                 use: [
                     {
                         loader: 'url-loader',
@@ -110,8 +110,8 @@ module.exports = {
     ],
     resolve: {
         alias: {
-          'vue$': 'vue/dist/vue.esm.js'
+            'vue$': 'vue/dist/vue.esm.js'
         },
         extensions: ['*', '.js', '.vue', '.json']
-      },
+    },
 };