diff --git a/src/lang/en.js b/src/lang/en.js
index 442fa2e..d4675dd 100644
--- a/src/lang/en.js
+++ b/src/lang/en.js
@@ -184,12 +184,16 @@ export default {
     lsseCode: 'The firmware update completed, the device will reboot soon.', // 642code
     lssCode: 'Failed to update the firmware, because the file cannot be parsed.', // 643code
     lsssCode: 'Failed to update the firmware, because the file version is too low.', // 644code
-    WAN_IP_AddressIP: 'WAN DomainName',
-    WAN_IP_Address: 'WAN IP address',
-    WAN_IP_DomainName: 'WAN domain name',
-    WAN_IP_Type: 'WAN Type',
-    WAN_Port: 'WAN Port',
-    WAN_RTSP_Port: 'WAN RTSP Port'
+    WAN_IP_AddressIP: 'NAT DomainName',
+    WAN_IP_Address: 'NAT IP address',
+    WAN_IP_DomainName: 'NAT domain name',
+    WAN_IP_Type: 'NAT Type',
+    WAN_Port: 'NAT Port',
+    WAN_RTSP_Port: 'NAT RTSP Port',
+    httpPort: 'HTTP Port',
+    webPort: 'Web Port',
+    rtspPort: 'RTSP Port',
+    rtpPort: 'RTP Port'
   },
   theme: {
     change: 'Change Theme',
diff --git a/src/lang/pt.js b/src/lang/pt.js
index 674e634..c956d1b 100644
--- a/src/lang/pt.js
+++ b/src/lang/pt.js
@@ -184,12 +184,16 @@ export default {
     lsseCode: 'A atualização do firmware foi concluída, o dispositivo será reiniciado em breve.', // 642code
     lssCode: 'Falha ao atualizar o firmware, porque o arquivo não pode ser analisado.', // 643code
     lsssCode: 'Falha ao atualizar o firmware, porque a versão do arquivo é muito baixa.', // 644code
-    WAN_IP_AddressIP: 'Endereço IP WAN',
-    WAN_IP_Address: 'Endereço IP WAN',
-    WAN_IP_DomainName: 'nome de domínio WAN',
-    WAN_IP_Type: 'Tipo de WAN',
-    WAN_Port: 'Porta WAN',
-    WAN_RTSP_Port: 'RTSP Porta WAN'
+    WAN_IP_AddressIP: 'Endereço IP NAT',
+    WAN_IP_Address: 'Endereço IP NAT',
+    WAN_IP_DomainName: 'nome de domínio NAT',
+    WAN_IP_Type: 'Tipo de NAT',
+    WAN_Port: 'Porta NAT',
+    WAN_RTSP_Port: 'RTSP Porta NAT',
+    httpPort: 'Porta HTTP',
+    webPort: 'Porta WEB',
+    rtspPort: 'Porta RTSP',
+    rtpPort: 'Porta RTP'
   },
   theme: {
     change: 'Mudar Tema',
diff --git a/src/lang/zh.js b/src/lang/zh.js
index 980d231..79b6cbc 100644
--- a/src/lang/zh.js
+++ b/src/lang/zh.js
@@ -181,7 +181,11 @@ export default {
     WAN_IP_DomainName: '广域网域名',
     WAN_IP_Type: '广域网格式',
     WAN_Port: '公网端口号',
-    WAN_RTSP_Port: '公网RTSP端口号'
+    WAN_RTSP_Port: '公网RTSP端口号',
+    httpPort: 'http端口',
+    webPort: 'Web端口',
+    rtspPort: 'RTSP端口',
+    rtpPort: 'RTP端口'
   },
   theme: {
     change: '换肤',
diff --git a/src/views/agreement/index.vue b/src/views/agreement/index.vue
index 9c0769b..043ed6a 100644
--- a/src/views/agreement/index.vue
+++ b/src/views/agreement/index.vue
@@ -44,14 +44,6 @@
         <el-form-item :label="$t('table.deviceStreamPort')">
           <el-input v-model="formUDPData.corestreamPort" />
         </el-form-item>
-        <el-form-item :label="$t('table.httpAuth')">
-          <el-radio v-model="formUDPData.httpApiAuth" label="on">{{
-            $t("table.open")
-          }}</el-radio>
-          <el-radio v-model="formUDPData.httpApiAuth" label="off">{{
-            $t("table.close")
-          }}</el-radio>
-        </el-form-item>
         <el-form-item label="SSH">
           <el-radio v-model="formUDPData.ssh" label="on">{{
             $t("table.open")
@@ -144,7 +136,7 @@
           <el-select
             v-model="formONVIFData.rtspAudioType"
             style="width:350px;"
-            placeholder="请选择"
+            placeholder="Please select"
             @change="selectChange"
           >
             <el-option
@@ -163,6 +155,12 @@
             $t("table.close")
           }}</el-radio>
         </el-form-item>
+        <el-form-item :label="$t('table.rtspPort')">
+          <el-input v-model="formONVIFData.rtspPort" type="number" :min="0" :max="65535" />
+        </el-form-item>
+        <el-form-item :label="$t('table.rtpPort')">
+          <el-input v-model="formONVIFData.rtpPort" type="number" :min="0" :max="65535" />
+        </el-form-item>
         <el-form-item :label="$t('table.WAN_IP_Type')">
           <el-select
             v-model="formONVIFData.wanType"
@@ -190,6 +188,28 @@
           <el-input v-model="formONVIFData.wanRTSPPort" type="number" :min="0" :max="65535" />
         </el-form-item>
       </el-form>
+      <el-form
+        v-show="selectIndex === '3'"
+        class="detail-form agree-form"
+        label-width="180px"
+        label-position="right"
+        :model="formHTTPData"
+      >
+        <el-form-item :label="$t('table.webPort')">
+          <el-input v-model="formHTTPData.webPort" type="number" :min="0" :max="65535" />
+        </el-form-item>
+        <el-form-item :label="$t('table.httpPort')">
+          <el-input v-model="formHTTPData.httpPort" type="number" :min="0" :max="65535" />
+        </el-form-item>
+        <el-form-item :label="$t('table.httpAuth')">
+          <el-radio v-model="formHTTPData.httpApiAuth" label="on">{{
+            $t("table.open")
+          }}</el-radio>
+          <el-radio v-model="formHTTPData.httpApiAuth" label="off">{{
+            $t("table.close")
+          }}</el-radio>
+        </el-form-item>
+      </el-form>
       <el-button
         type="primary"
         style="width: 10%; margin-left: 40%;margin-top: 20px;"
@@ -222,6 +242,10 @@ export default {
         {
           label: 'UDP',
           key: '0'
+        },
+        {
+          label: 'HTTP',
+          key: '3'
         }
       ],
       NetType: [
@@ -243,7 +267,6 @@ export default {
         serverPort: '',
         instructPort: '',
         corestreamPort: '',
-        httpApiAuth: '',
         ssh: ''
       },
       formSIPData: {
@@ -270,7 +293,14 @@ export default {
         wanOnvifPort: '',
         wanRTSPPort: '',
         wanDomainName: '',
-        wanType: '0'
+        wanType: '0',
+        rtspPort: '',
+        rtpPort: ''
+      },
+      formHTTPData: {
+        httpPort: '',
+        webPort: '',
+        httpApiAuth: ''
       },
 
       sipPasswordType: 'password',
@@ -343,7 +373,6 @@ export default {
           this.formUDPData.serverPort = res.data.serverPort
           this.formUDPData.instructPort = res.data.instructPort
           this.formUDPData.corestreamPort = res.data.corestreamPort
-          this.formUDPData.httpApiAuth = res.data.httpApiAuth
           this.formUDPData.ssh = res.data.ssh
 
           this.formSIPData.sip = res.data.sip
@@ -366,6 +395,8 @@ export default {
           this.formONVIFData.rtspAudioTypeArr = res.data.rtspAudioTypeArr
           this.formONVIFData.rtspAudioType = res.data.rtspAudioType
           this.formONVIFData.onvifAuth = res.data.onvifAuth
+          this.formONVIFData.rtspPort = res.data.rtspPort
+          this.formONVIFData.rtpPort = res.data.rtpPort
 
           this.formONVIFData.wanIP = res.data.wanIP
           this.formONVIFData.wanOnvifPort = res.data.wanOnvifPort
@@ -373,6 +404,11 @@ export default {
           this.formONVIFData.wanDomainName = res.data.wanDomainName
           this.formONVIFData.wanType = res.data.wanType
 
+          this.formHTTPData.httpApiAuth = res.data.httpApiAuth
+          this.formHTTPData.httpPort = res.data.httpPort
+          this.formHTTPData.webPort = res.data.webPort
+
+          console.log('data', res.data)
           this.$forceUpdate()
         } else {
           this.$message.error(res.message)
@@ -528,6 +564,38 @@ export default {
           })
           return
         }
+        if (!param.rtspPort) {
+          this.$message({
+            type: 'warning',
+            message: this.$i18n.t('table.rtspPort') + this.$i18n.t('table.isEmpty')
+          })
+          return
+        }
+        if (!param.rtpPort) {
+          this.$message({
+            type: 'warning',
+            message: this.$i18n.t('table.rtpPort') + this.$i18n.t('table.isEmpty')
+          })
+          return
+        }
+      } else if (this.selectIndex === '3') {
+        param = {
+          ...this.formHTTPData
+        }
+        if (!param.webPort) {
+          this.$message({
+            type: 'warning',
+            message: this.$i18n.t('table.webPort') + this.$i18n.t('table.isEmpty')
+          })
+          return
+        }
+        if (!param.httpPort) {
+          this.$message({
+            type: 'warning',
+            message: this.$i18n.t('table.httpPort') + this.$i18n.t('table.isEmpty')
+          })
+          return
+        }
       }
       console.log(param)
       deviceEdit(param).then((res) => {
@@ -547,6 +615,7 @@ export default {
   }
 }
 </script>
+
 <style lang="scss">
 .agree-form .el-form-item {
   width: 50%;
@@ -565,7 +634,6 @@ export default {
     z-index: 99;
   }
 }
-
 .pageCon2{
   padding-bottom: 120px;
 }