新增SQL 加密解密 页面

src/api/system/sqlEncryptionAndDecryption.js

@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+
+// sql 加密
+export function encrySql(query) {
+  return request({
+    url: '/system/sql/encry',
+    method: 'post',
+    data: query
+  })
+}
+
+// sql 解密
+export function decrySql(query) {
+  return request({
+    url: '/system/sql/decry',
+    method: 'post',
+    data: query
+  })
+}

src/router/index.js

@@ -89,6 +89,11 @@ export const constantRoutes = [
     hidden: true,
   },
   {
+    path: "/sql/encryptionanddecryption/",
+    component: () => import("@/views/system/sqlEncryptionAndDecryption"),
+    hidden: true,
+  },
+  {
     path: "",
     component: Layout,
     redirect: "home",

src/views/system/sqlEncryptionAndDecryption/index.vue

@@ -0,0 +1,157 @@
+<template>
+  <div class="app-container">
+        <el-col :span="11">
+          <el-card class="box-card" :body-style="{ height: '100%' }">
+            <el-form
+              ref="formleft"
+              label-width="120px"
+              size="mini"
+              style="width: 95%"
+            >
+              <el-row>
+                <el-col :span="24">
+                  <el-form-item label="明文SQL：">
+                    <el-input
+                      v-model="leftClearSQL"
+                      clearable
+                      type="textarea" 
+                      :autosize="{ minRows: 12, maxRows: 12}"                
+                    ></el-input>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row>
+                <el-col :span="12" :offset="12" style="margin-bottom:20px;">
+                  <el-button type="primary" @click="handleEncryption">加密</el-button>
+                </el-col>
+              </el-row>
+            
+              <el-row>
+                <el-col :span="24">
+                  <el-form-item label="密文SQL:">
+                    <el-input
+                      v-model="leftCipherSQL"
+                      type="textarea" 
+                      :autosize="{ minRows: 12, maxRows: 12}"
+                      clearable
+                     
+                    ></el-input>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-form>
+          </el-card>
+        </el-col>
+        <el-col :span="11" :offset="2">
+          <el-card class="box-card" :body-style="{ height: '100%' }">
+            <el-form
+              ref="formleft"
+              label-width="120px"
+              size="mini"
+              style="width: 95%"
+            >
+              <el-row>
+                <el-col :span="24">
+                  <el-form-item label="密文SQL">
+                    <el-input
+                      v-model="rightCipherSQL"
+                      clearable
+                      type="textarea" 
+                      :autosize="{ minRows: 12, maxRows: 12}"
+                      
+                    ></el-input>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <el-row>
+                <el-col :span="12" :offset="12" style="margin-bottom:20px;">
+                  <el-button type="primary" @click="handleDecry">解密</el-button>
+                </el-col>
+              </el-row>
+            
+              <el-row>
+                <el-col :span="24">
+                  <el-form-item label="明文SQL:">
+                    <el-input
+                      v-model="rightClearSQL"
+                      clearable
+                      type="textarea" 
+                      :autosize="{ minRows: 12, maxRows: 12}"
+                      
+                    ></el-input>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+            </el-form>
+          </el-card>
+        </el-col>
+  </div>
+</template>
+
+<script>
+import { decrySql,encrySql} from "@/api/system/sqlEncryptionAndDecryption";
+
+export default {
+  name: "SqlEncryAndDecry",
+  dicts: [],
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      leftClearSQL:null,
+      leftCipherSQL:null,
+      rightClearSQL:null,
+      rightCipherSQL:null
+    };
+  },
+  created() {
+  },
+  methods: {
+    
+    /** 加密按钮操作 */
+    handleEncryption() {
+      if(!this.$store.getters.isAdmin)
+      {
+        this.$modal.msgError("仅超级管理员可用此工程");
+        return;
+      }
+      if(!this.leftClearSQL){
+        this.$modal.msgError("请输入需加密SQL明文");
+        return;
+      }
+
+      this.leftCipherSQL=null;
+      encrySql({sql:this.leftClearSQL.trim()}).then((result)=>{
+        this.$modal.msgSuccess("加密成功");
+        this.leftCipherSQL=result;
+      })
+      .catch((error) => {
+        this.$modal.msgError("加密失败："+error.msg)
+      });
+        
+    },
+    /** 解密按钮操作 */
+    handleDecry() {
+      if(!this.$store.getters.isAdmin)
+      {
+        this.$modal.msgError("仅超级管理员可用此功能");
+        return;
+      }
+      if(!this.rightCipherSQL){
+        this.$modal.msgError("请输入需解密SQL密文");
+        return;
+      }
+      
+      this.rightClearSQL=null;
+      decrySql({sql:this.rightCipherSQL.trim()}).then((result)=>{
+        this.$modal.msgSuccess("解密成功");
+        this.rightClearSQL=result;
+      })
+      .catch((error) => {
+        this.$modal.msgError("解密失败："+error)
+      });
+    },  
+  },
+};
+</script>
+