diff --git a/ruoyi-ui/package.json b/ruoyi-ui/package.json
index 8d3cd089..c9cc275b 100644
--- a/ruoyi-ui/package.json
+++ b/ruoyi-ui/package.json
@@ -67,6 +67,7 @@
     "vue-echarts": "^6.0.2",
     "vue-json-viewer": "^2.2.21",
     "vue-meta": "2.4.0",
+    "vue-qr": "^4.0.6",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.0"
diff --git a/ruoyi-ui/src/views/business/monitor/http/index.vue b/ruoyi-ui/src/views/business/monitor/http/index.vue
new file mode 100644
index 00000000..29721764
--- /dev/null
+++ b/ruoyi-ui/src/views/business/monitor/http/index.vue
@@ -0,0 +1,428 @@
+<template>
+  <div class="app-container">
+    <el-tabs type="border-card">
+      <el-tab-pane label="消息响应">
+        <el-table
+          :data="one"
+          style="width: 100%">
+          <el-table-column align="center"
+            prop="status"
+            label="状态码"
+            width="180">
+          </el-table-column>
+          <el-table-column align="center"
+            prop="reason"
+            label="原因短语"
+            width="180">
+          </el-table-column>
+          <el-table-column
+            prop="meaning"
+            label="代表含义">
+          </el-table-column>
+          <el-table-column align="center"
+            prop="version"
+            label="HTTP版本">
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="成功响应">
+        <el-table
+          :data="two"
+          style="width: 100%">
+          <el-table-column align="center"
+                           prop="status"
+                           label="状态码"
+                           width="180">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="reason"
+                           label="原因短语"
+                           width="180">
+          </el-table-column>
+          <el-table-column
+                           prop="meaning"
+                           label="代表含义">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="version"
+                           label="HTTP版本">
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="重定向">
+        <el-table
+          :data="three"
+          style="width: 100%">
+          <el-table-column align="center"
+                           prop="status"
+                           label="状态码"
+                           width="180">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="reason"
+                           label="原因短语"
+                           width="180">
+          </el-table-column>
+          <el-table-column
+            prop="meaning"
+            label="代表含义">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="version"
+                           label="HTTP版本">
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="客户端错误">
+        <el-table
+          :data="four"
+          style="width: 100%">
+          <el-table-column align="center"
+                           prop="status"
+                           label="状态码"
+                           width="180">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="reason"
+                           label="原因短语"
+                           width="180">
+          </el-table-column>
+          <el-table-column
+            prop="meaning"
+            label="代表含义">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="version"
+                           label="HTTP版本">
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+      <el-tab-pane label="服务器端错误">
+        <el-table
+          :data="five"
+          style="width: 100%">
+          <el-table-column align="center"
+                           prop="status"
+                           label="状态码"
+                           width="180">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="reason"
+                           label="原因短语"
+                           width="180">
+          </el-table-column>
+          <el-table-column
+            prop="meaning"
+            label="代表含义">
+          </el-table-column>
+          <el-table-column align="center"
+                           prop="version"
+                           label="HTTP版本">
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+    </el-tabs>
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: "HttpStatus",
+
+  data() {
+    return {
+      one: [
+        {
+          status: '100',
+          reason: 'Continue(继续)',
+          meaning: '客户端应当继续发送请求.这个临时响应是用来通知客户端它的部分请求已经被服务器接收,且仍未被拒绝.客户端应当继续发送请求的剩余部分,或者如果请求已经完成,忽略这个响应.服务器必须在请求完成后向客户端发送一个最终响应.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '101',
+          reason: 'Switching Protocol(切换协议)',
+          meaning: '服务器已经理解了客户端的请求，并将通过Upgrade消息头通知客户端采用不同的协议来完成这个请求。在发送完这个响应最后的空行后，服务器将会切换到 在Upgrade消息头中定义的那些协议。: 只有在切换新的协议更有好处的时候才应该采取类似措施。例如，切换到新的HTTP版本比旧版本更有优势，或者切换到一个实时且同步的协议以传送利用此类特 性的资源。',
+          version: 'HTTP/1.1 可用'
+        }
+      ],
+
+      two:[
+        {
+          status: '200',
+          reason: 'OK(成功)',
+          meaning: '请求成功.成功的意义根据请求所使用的方法不同而不同.\n' +
+            'GET: 资源已被提取,并作为响应体传回客户端.\n' +
+            'HEAD: 实体头已作为响应头传回客户端\n' +
+            'POST: 经过服务器处理客户端传来的数据,适合的资源作为响应体传回客户端.\n' +
+            'TRACE: 服务器收到请求消息作为响应体传回客户端.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '201',
+          reason: 'Created(已创建)',
+          meaning:'请求成功，而且有一个新的资源已经依据请求的需要而建立，通常这是 PUT 方法得到的响应码.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '202',
+          reason: 'Accepted(已创建)',
+          meaning:'服务器已接受请求，但尚未处理。正如它可能被拒绝一样，最终该请求可能会也可能不会被执行。在异步操作的场合下，没有比发送这个状态码更方便的做法了。:返回202状态码的响应的目的是允许服务器接受其他过程的请求（例如某个每天只执行一次的基于批处理的操作），而不必让客户端一直保持与服务器的连接直到批处理操作全部完成。在接受请求处理并返回202状态码的响应应当在返回的实体中包含一些指示处理当前状态的信息，以及指向处理状态监视器或状态预测的指针，以便用户能够估计操作是否已经完成。',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '203',
+          reason: 'Non-Authoritative Information(未授权信息)',
+          meaning:'服务器已成功处理了请求,但返回的实体头部元信息不是在原始服务器上有效的确定集合，而是来自本地或者第三方的拷贝,如果不是上述情况,使用200状态码才是最合适的.',
+          version: 'HTTP/0.9 and 1.1'
+        },
+        {
+          status: '204',
+          reason: 'No Content(无内容)',
+          meaning:'该响应没有响应内容,只有响应头,响应头也可能是有用的.用户代理可以根据新的响应头来更新对应资源的缓存信息.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '205',
+          reason: 'Reset Content(重置内容)',
+          meaning:'告诉用户代理去重置发送该请求的窗口的文档视图.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '206',
+          reason: 'Partial Content(部分内容)',
+          meaning:'当客户端通过使用range头字段进行文件分段下载时使用该状态码',
+          version: 'HTTP/1.1 可用'
+        },
+
+      ],
+
+      three:[
+        {
+          status: '300',
+          reason: 'Multiple Choice(多种选择)',
+          meaning:'该请求有多种可能的响应,用户代理或者用户必须选择它们其中的一个.服务器没有任何标准可以遵循去代替用户来进行选择.',
+          version: 'HTTP/1.0 and later'
+        },
+        {
+          status: '301',
+          reason: 'Moved Permanently(永久移动)',
+          meaning:'该状态码表示所请求的URI资源路径已经改变,新的URL会在响应的Location:头字段里找到.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '302',
+          reason: 'Found(临时移动)',
+          meaning:'该状态码表示所请求的URI资源路径临时改变,并且还可能继续改变.因此客户端在以后访问时还得继续使用该URI.新的URL会在响应的Location:头字段里找到.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '303',
+          reason: 'See Other(查看其他位置)',
+          meaning:'服务器发送该响应用来引导客户端使用GET方法访问另外一个URI.',
+          version: 'HTTP/0.9 and 1.1'
+        },
+        {
+          status: '304',
+          reason: 'Not Modified(未修改)',
+          meaning:'告诉客户端,所请求的内容距离上次访问并没有变化. 客户端可以直接从浏览器缓存里获取该资源.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '305',
+          reason: 'Use Proxy(使用代理)',
+          meaning:'所请求的资源必须统过代理才能访问到.由于安全原因,该状态码并未受到广泛支持.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '306',
+          reason: 'unused(未使用)',
+          meaning:'这个状态码已经不再被使用,当初它被用在HTTP 1.1规范的旧版本中.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '307',
+          reason: 'Temporary Redirect(临时重定向)',
+          meaning:'服务器发送该响应用来引导客户端使用相同的方法访问另外一个URI来获取想要获取的资源.新的URL会在响应的Location:头字段里找到.与302状态码有相同的语义,且前后两次访问必须使用相同的方法(GET POST).',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '308',
+          reason: 'Permanent Redirect(永久重定向)',
+          meaning:'所请求的资源将永久的位于另外一个URI上.新的URL会在响应的Location:头字段里找到.与301状态码有相同的语义,且前后两次访问必须使用相同的方法(GET POST).',
+          version: 'HTTPbis(试验草案)'
+        },
+      ],
+
+      four:[
+        {
+          status: '400',
+          reason: 'Bad Request(错误请求)',
+          meaning:'因发送的请求语法错误,服务器无法正常读取.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '401',
+          reason: 'Unauthorized(未授权)',
+          meaning:'需要身份验证后才能获取所请求的内容,类似于403错误.不同点是.401错误后,只要正确输入帐号密码,验证即可通过.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '402',
+          reason: 'Payment Required(需要付款)',
+          meaning:'该状态码被保留以供将来使用.创建此代码最初的目的是为数字支付系统而用,然而,到现在也没投入使用.',
+          version: 'HTTP/0.9 and 1.1'
+        },
+        {
+          status: '403',
+          reason: 'Forbidden(禁止访问)',
+          meaning:'客户端没有权利访问所请求内容,服务器拒绝本次请求.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '404',
+          reason: 'Not Found(未找到)',
+          meaning:'服务器找不到所请求的资源.由于经常发生此种情况,所以该状态码在上网时是非常常见的.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '404',
+          reason: 'Not Found(未找到)',
+          meaning:'服务器找不到所请求的资源.由于经常发生此种情况,所以该状态码在上网时是非常常见的.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '405',
+          reason: 'Method Not Allowed(不允许使用该方法)',
+          meaning:'该请求使用的方法被服务器端禁止使用,RFC2616中规定, GET 和 HEAD 方法不能被禁止.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '406',
+          reason: 'Not Acceptable(无法接受)',
+          meaning:'在进行服务器驱动内容协商后,没有发现合适的内容传回给客户端.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '407',
+          reason: 'Proxy Authentication Required(要求代理身份验证)',
+          meaning:'类似于状态码 401,不过需要通过代理才能进行验证.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '404',
+          reason: 'Not Found(未找到)',
+          meaning:'服务器找不到所请求的资源.由于经常发生此种情况,所以该状态码在上网时是非常常见的.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '408',
+          reason: 'Request Timeout(请求超时)',
+          meaning:'客户端没有在服务器预备等待的时间内完成一个请求的发送.这意味着服务器将会切断和客户端的连接. 在其他浏览器中,这种响应更常见一些, 例如Chrome 和 IE9, 目的是为了使用HTTP 预连机制加快浏览速度. 同时注意,一些服务器不发送此种响应就直接切断连接.',
+          version: 'HTTP/1.1 可用'
+        }, {
+          status: '409',
+          reason: 'Conflict(冲突)',
+          meaning:'该请求与服务器的当前状态所冲突.',
+          version: 'HTTP/1.1 可用'
+        }, {
+          status: '410',
+          reason: 'Gone(已失效)',
+          meaning:'所请求的资源已经被删除.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '411',
+          reason: 'Length Required(需要内容长度头)',
+          meaning:'因服务器在本次请求中需要 Content-Length 头字段,而客户端没有发送.所以,服务器拒绝了该请求.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '412',
+          reason: 'Precondition Failed(预处理失败)',
+          meaning:'服务器没能满足客户端在获取资源时在请求头字段中设置的先决条件.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '413',
+          reason: 'Request Entity Too Large(请求实体过长)',
+          meaning:'请求实体大小超过服务器的设置的最大限制,服务器可能会关闭HTTP链接并返回Retry-After 头字段.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '414',
+          reason: 'Request-URI Too Long(请求网址过长)',
+          meaning:'客户端请求所包含的URI地址太长,以至于服务器无法处理.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '415',
+          reason: 'Unsupported Media Type(媒体类型不支持)',
+          meaning:'服务器不支持客户端所请求的媒体类型,因此拒绝该请求.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '416',
+          reason: 'Requested Range Not Satisfiable(请求范围不合要求)',
+          meaning:'请求中包含的Range头字段无法被满足,通常是因为Range中的数字范围超出所请求资源的大小.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '417',
+          reason: 'Expectation Failed(预期结果失败)',
+          meaning:'在请求头 Expect 中指定的预期内容无法被服务器满足.',
+          version: 'HTTP/1.1 可用'
+        },
+
+
+
+      ],
+
+      five:[
+        {
+          status: '500',
+          reason: 'Internal Server Error(内部服务器错误)',
+          meaning:'服务器遇到未知的无法解决的问题.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '501',
+          reason: 'Not Implemented(未实现)',
+          meaning:'服务器不支持该请求中使用的方法,比如POST 和 PUT.只有GET 和 HEAD 是RFC2616规范中规定服务器必须实现的方法.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '502',
+          reason: 'Bad Gateway(网关错误)',
+          meaning:'服务器作为网关且从上游服务器获取到了一个无效的HTTP响应.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '503',
+          reason: 'Service Unavailable(服务不可用)',
+          meaning:'由于临时的服务器维护或者过载,服务器当前无法处理请求.这个状况是临时的,并且将在一段时间以后恢复.如果能够预计延迟时间,那么响应中可以包含一个Retry-After:头用以标明这个延迟时间.如果没有给出这个Retry-After:信息，那么客户端应当以处理500响应的方式处理它.同时,这种情况下,一个友好的用于解释服务器出现问题的页面应当被返回,并且,缓存相关的HTTP头信息也应该包含,因为通常这种错误提示网页不应当被客户端缓存.',
+          version: 'HTTP/0.9 可用'
+        },
+        {
+          status: '504',
+          reason: 'Gateway Timeout(网关超时)',
+          meaning:'服务器作为网关且不能从上游服务器及时的得到响应返回给客户端.',
+          version: 'HTTP/1.1 可用'
+        },
+        {
+          status: '505',
+          reason: 'HTTP Version Not Supported(HTTP版本不受支持)',
+          meaning:'服务器不支持客户端发送的HTTP请求中所使用的HTTP协议版本.',
+          version: 'HTTP/1.1 可用'
+        },
+      ],
+    }
+  },
+
+  methods: {}
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/ruoyi-ui/src/views/business/tools/md5/index.vue b/ruoyi-ui/src/views/business/tools/md5/index.vue
index 4132ff66..130f3363 100644
--- a/ruoyi-ui/src/views/business/tools/md5/index.vue
+++ b/ruoyi-ui/src/views/business/tools/md5/index.vue
@@ -14,7 +14,7 @@
 
     <el-row :gutter="50" style="margin-top: 20px">
       <el-col :span="12">
-        <at-input v-model="SourceValue" placeholder="请输入" size="large" :maxlength="20" append-button>
+        <at-input v-model="SourceValue" placeholder="请输入" size="large" @keyup.enter.native="encryption" :maxlength="20" append-button>
           <template slot="append">
             <i class="icon icon-search" @click="encryption">加密</i>
           </template>
@@ -40,7 +40,7 @@
 
     <el-row :gutter="50" style="margin-top: 20px">
       <el-col :span="24">
-        <at-input v-model="md5Value" placeholder="请输入" size="large" :maxlength="32" append-button>
+        <at-input v-model="md5Value" placeholder="请输入" size="large" :maxlength="32" @keyup.enter.native="decrypt" append-button>
           <template slot="append">
             <i class="icon icon-search" @click="decrypt">解密</i>
           </template>
@@ -54,7 +54,7 @@
 import {decrypt, encryption} from "@/api/business/tools/md5";
 
 export default {
-  name: "index",
+  name: "Md5",
 
   data() {
     return {
diff --git a/ruoyi-ui/src/views/business/tools/qrcode/index.vue b/ruoyi-ui/src/views/business/tools/qrcode/index.vue
new file mode 100644
index 00000000..b7cc5cec
--- /dev/null
+++ b/ruoyi-ui/src/views/business/tools/qrcode/index.vue
@@ -0,0 +1,53 @@
+<template>
+  <div class="app-container">
+    <div class="div1">
+      <p>根据内容生成二维码</p>
+    </div>
+
+    <div>
+      <el-input
+        type="textarea"
+        show-word-limit
+        :rows="3"
+        maxlength="30"
+        placeholder="请输入内容"
+        v-model="codeText">
+      </el-input>
+
+    </div>
+
+    <div style="margin-top: 50px;margin-left: 35%">
+      <VueQr v-if="codeText" :margin='8' :size='350' :whiteMargin="true" :logoMargin="3" :logoCornerRadius="20"
+             :text='codeText'></VueQr>
+    </div>
+
+  </div>
+</template>
+
+<script>
+
+import VueQr from 'vue-qr'
+
+export default {
+  name: "Qrcode",
+
+  components: {VueQr},
+
+  data() {
+    return {
+      codeText: null
+    }
+  },
+
+
+}
+</script>
+
+<style scoped>
+.div1 p{
+  margin-bottom: 20px;
+  color: #999999;
+  font-size: 12px;
+  margin-left: 5px;
+}
+</style>