✨ feat(字节码文件转换前端): 支持上传多文件以及文件下载

frontend/src/api/app-store.js

@@ -24,6 +24,14 @@ export function getReport(data) {
   });
 }
 
+export function postByteCodeFile(data) {
+  return request({
+    url: "/api/v1/evm_store/build",
+    method: "post",
+    data
+  });
+}
+
 export function getWatchList() {
   return request({
     url: "/api/v1/evm_store/watch",

frontend/src/router/index.js

@@ -230,6 +230,17 @@ export const constantRoutes = [
             meta: { title: 'opqcp', icon: 'home' }
         }]
     },
+    {
+        path: '/evue',
+        redirect: '/evue/index',
+        component: Layout,
+        children: [{
+            path: 'index',
+            name: 'ByteCodeFile',
+            component: () => import('@/views/system/evue'),
+            meta: { title: 'evue', icon: 'home' }
+        }]
+    },
     {
         path: '/monitor',
         redirect: '/monitor/index',

frontend/src/settings.js

@@ -85,6 +85,13 @@ export default {
             icon: "gongzuotai",
             path: "tool/index",
         },
+        {
+            vue: "system/evue.vue",
+            title: "字节码文件转换",
+            name: "ByteCodeFile",
+            icon: "gongzuotai",
+            path: "tool/evue",
+        },
         {
             vue: "app-store/docs.vue",
             title: "开发文档",

frontend/src/views/system/evue.vue

 <template>
   <div class="app-container">
-    <el-alert title="代码混淆工具" type="success"></el-alert>
+    <el-alert title="EVUE文件转字节码文件" type="success"></el-alert>
     <div style="margin: 10px 0px">
       <el-form>
         <el-form-item>
@@ -8,33 +8,32 @@
             class="upload-demo"
             action="/api/v1/evm_store/build"
             name="binfile"
+            drag
+            multiple
             :on-success="handleUploaded"
             :file-list="fileList"
           >
-            <el-button size="small" type="primary">点击上传</el-button>
-            <div slot="tip" class="el-upload__tip">
-              上传C源文件，转换完成后会自动下载
+            <i class="el-icon-upload"></i>
+            <div class="el-upload__text">
+              将文件拖到此处，或<em>点击上传</em>
+            </div>
+            <div class="el-upload__tip" slot="tip">
+              请选择evue文件
             </div>
           </el-upload>
         </el-form-item>
-        <el-form-item>
-          <el-button type="success" @click="getConvertString">转换</el-button>
-        </el-form-item>
       </el-form>
     </div>
   </div>
 </template>
 <script>
-import { actionOpqcp } from "@/api/app-store";
+// import { postByteCodeFile } from "@/api/app-store";
 
 export default {
-  name: "Opqcp",
+  name: "ByteCodeFile",
   data() {
     return {
       fileList: [],
-      inputString: null,
-      outputString: null,
-      filename: "app.js",
     };
   },
   methods: {
@@ -48,42 +47,18 @@ export default {
       window.URL.revokeObjectURL(url);
     },
     handleUploaded(response) {
-      if (response.code == 200) {
-        this.filename = response.data.filename
-        actionOpqcp({ filename: response.data.filepath })
-          .then((res) => {
-            this.$message.success(res.message);
-            // const a = document.createElement("a");
-            // a.href = url;
-            // a.download = filename;
-            // a.click();
-          })
-          .catch((err) => {
-            this.$message.error(err.message);
-          });
-      }
-      console.log(response)
+      console.log(response);
+      this.downloadFile(response)
     },
-    downloadFile() {
-      this.$prompt("请输入文件名", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        inputValue: this.filename,
-        inputErrorMessage: "文件名格式不正确",
-      })
-        .then(({ value }) => {
-          if (value) this.filename = value;
-          this.createFile(this.outputString, this.filename);
-        })
-        .catch(() => {
-          this.$message({
-            type: "info",
-            message: "取消输入",
-          });
-        });
+    downloadFile(result) {
+      const a = document.createElement("a");
+      a.download = result.data.filename
+      a.href = result.data.url;
+      a.target = ""
+      a.click();
     },
     getConvertString() {
-
+      console.log(123456789);
     },
   },
   mounted() {},

frontend/vue.config.js

@@ -36,7 +36,7 @@ module.exports = {
                 pathRewrite: {},
             },
             "/api/v1/evm_store": {
-                target: "http://store.evmiot.com/",
+                target: "http://localhost:3000/",
                 changeOrigin: true,
                 pathRewrite: {
                     // 这里理解成用/api代替target里面的地址，后面组件中我们调用接口时直接用api代替