diff --git a/src/api/engine/engine.js b/src/api/engine/engine.js
index 7b061ca..3170d2b 100644
--- a/src/api/engine/engine.js
+++ b/src/api/engine/engine.js
@@ -1,133 +1,262 @@
 import request from '@/utils/request'
 
 //查询规则引擎列表
-export function selectEngineList(data){
+
+export function selectEngineList(data) {
+
   return request({
+
     url: "/engine/engine/getMaintenanceList",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
 //添加规则数据
-export  function insert(data){
+
+export function insert(data) {
+
   return request({
+
     url: "/engine/engine/insert",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
 //修改规则数据
-export  function update(data){
+
+export function update(data) {
+
   return request({
+
     url: "/engine/engine/update",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
 //通过id删除数据
-export  function del(id){
+
+export function del(id) {
+
   return request({
+
     url: "/engine/engine/delete/" + id,
+
     method: "post",
-    data:id
+
+    data: id
+
   })
+
 }
 
 //开启
-export  function onEngine(id){
+
+export function onEngine(id) {
+
   return request({
+
     url: "/engine/version/open/" + id,
+
     method: "post"
+
   })
+
 }
 
 //禁用
-export  function forbiddenEngine(id){
+
+export function forbiddenEngine(id) {
+
   return request({
+
     url: "/engine/version/close/" + id,
+
     method: "post"
+
   })
+
 }
 
 //查看等级列表信息
-export  function selectLevel(){
+
+export function selectLevel() {
+
   return request({
+
     url: "/engine/level/selectLevelList",
+
     method: "post"
+
   })
+
 }
 
 // 查询规则引擎版本列表
-export function getRuleEngineInfo(id) {
-  return request({
-    url: '/engine/engine/getRuleEngineInfo/' + id,
-    method: 'put'
-  })
-}
 
 // 通过id查询
 export function findById(id) {
   return request({
+
     url: '/engine/engine/findByIdsfindByIds/' + id,
-    method:'get'
+
+    method: 'get'
+
   })
+
 }
 
 //通过id删除数据
-export function dels(id) {
-  return request({
-    url: '/engine/version/delete/' + id,
-    method: 'post',
-    data: id
-  })
-}
 
+export function dels(id) {
+
+  return request({
+
+    url: '/engine/version/delete/' + id,
+
+    method: 'post',
+
+    data: id
+
+  })
+
+}
 
 
 //添加规则数据
-export  function add(data){
+
+export function add(data) {
+
   return request({
+
     url: "/engine/version/insertVersion",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
 
+export function selectEngineById(id) {
 
-
-export  function selectEngineById(id){
   return request({
+
     url: "/engine/engine/selectEngineById/" + id,
+
     method: "post",
-    data:id
+
+    data: id
+
   })
+
 }
 
 //根据版本id查询版本信息
-export  function sel(id){
+
+export function sel(id) {
+
   return request({
+
     url: "/engine/version/selectListById/" + id,
+
     method: "post"
+
   })
+
 }
 
-
-
-
-
 //根据版本id查询版本信息
-export  function generate(data){
+
+export function generate(data) {
+
   return request({
+
     url: "/engine/engine/generate",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
+}
+
+export function getVersionData(id) {
+
+  return request({
+
+    url: "/engine/version/getVersionById/" + id,
+
+    method: "get",
+
+    data: id
+
+  })
+
+}
+
+//数据库查询
+
+export function selectDataBase() {
+
+  return request({
+
+    url: "/engine/version/selectDataBase",
+
+    method: "post",
+
+  })
+
+}
+
+//数据字段查询
+
+export function selectData() {
+
+  return request({
+
+    url: "/engine/version/selectData",
+
+    method: "post",
+
+  })
+
+}
+
+//测试
+
+export function testData(data) {
+
+  return request({
+
+    url: "/engine/engine/testData",
+
+    method: "post",
+
+    data: data
+
+  })
+
 }
 
 
 
 
+
diff --git a/src/api/engine/getRuleEngineInfo.js b/src/api/engine/getRuleEngineInfo.js
new file mode 100644
index 0000000..a9abdf8
--- /dev/null
+++ b/src/api/engine/getRuleEngineInfo.js
@@ -0,0 +1,13 @@
+import request from "@/utils/request";
+
+export function getRuleEngineInfo(id) {
+
+  return request({
+
+    url: '/engine/engine/getRuleEngineInfo/' + id,
+
+    method: 'put'
+
+  })
+
+}
diff --git a/src/api/port/port/index.js b/src/api/port/port/index.js
index 07190c7..6d3c870 100644
--- a/src/api/port/port/index.js
+++ b/src/api/port/port/index.js
@@ -14,6 +14,16 @@ export function findApiList(data) {
     data:data
   })
 }
+
+
+//TODO 根据ID查
+export function findApiById(id) {
+  return request({
+    url: '/mart/connector/findApiById/' + id,
+    method: 'get',
+  })
+}
+
 export function addConnector(data) {
   return request({
     url: '/mart/connector/addConnector',
diff --git a/src/api/type/type.js b/src/api/type/type.js
index d309662..3b84548 100644
--- a/src/api/type/type.js
+++ b/src/api/type/type.js
@@ -1,46 +1,81 @@
 import request from '@/utils/request'
 
 //查询规则引擎列表
-export function list(){
+
+export function list() {
+
   return request({
+
     url: "/engine/type/list",
+
     method: "post"
+
   })
+
 }
 
 //添加类型数据
-export  function insert(data){
+
+export function insert(data) {
+
   return request({
+
     url: "/engine/type/add",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
 //修改类型数据
-export  function update(data){
+
+export function update(data) {
+
   return request({
+
     url: "/engine/type/update",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
+
 //删除类型数据
-export  function del(id){
+
+export function del(id) {
+
   return request({
+
     url: "/engine/type/delete/" + id,
+
     method: "post",
-    data:id
+
+    data: id
+
   })
+
 }
 
 //导出类型数据
-export function exports(data){
+
+export function exports(data) {
+
   return request({
+
     url: "/engine/type/export",
+
     method: "post",
-    data:data
+
+    data: data
+
   })
+
 }
 
diff --git a/src/components/ImageUpload/index.vue b/src/components/ImageUpload/index.vue
index bc8a76f..1e5c665 100644
--- a/src/components/ImageUpload/index.vue
+++ b/src/components/ImageUpload/index.vue
@@ -1,38 +1,38 @@
 <template>
   <div class="component-upload-image">
     <el-upload
-      ref="imageUpload"
+      multiple
       :action="uploadImgUrl"
+      list-type="picture-card"
+      :on-success="handleUploadSuccess"
       :before-upload="handleBeforeUpload"
-      :class="{hide: this.fileList.length >= this.limit}"
-      :file-list="fileList"
-      :headers="headers"
       :limit="limit"
       :on-error="handleUploadError"
       :on-exceed="handleExceed"
-      :on-preview="handlePictureCardPreview"
+      ref="imageUpload"
       :on-remove="handleDelete"
-      :on-success="handleUploadSuccess"
       :show-file-list="true"
-      list-type="picture-card"
-      multiple
+      :headers="headers"
+      :file-list="fileList"
+      :on-preview="handlePictureCardPreview"
+      :class="{hide: this.fileList.length >= this.limit}"
     >
       <i class="el-icon-plus"></i>
     </el-upload>
 
     <!-- 上传提示 -->
-    <div v-if="showTip" slot="tip" class="el-upload__tip">
+    <div class="el-upload__tip" slot="tip" v-if="showTip">
       请上传
-      <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b></template>
-      <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b></template>
+      <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
+      <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
       的文件
     </div>
 
     <el-dialog
       :visible.sync="dialogVisible"
-      append-to-body
       title="预览"
       width="800"
+      append-to-body
     >
       <img
         :src="dialogImageUrl"
@@ -43,7 +43,7 @@
 </template>
 
 <script>
-import {getToken} from "@/utils/auth";
+import { getToken } from "@/utils/auth";
 
 export default {
   props: {
@@ -92,7 +92,7 @@ export default {
           // 然后将数组转为对象数组
           this.fileList = list.map(item => {
             if (typeof item === "string") {
-              item = {name: item, url: item};
+              item = { name: item, url: item };
             }
             return item;
           });
@@ -149,13 +149,13 @@ export default {
     },
     // 上传成功回调
     handleUploadSuccess(res, file) {
-      if (res.data.code === 200) {
-        this.uploadList.push({name: res.data.url, url: res.data.url});
+      if (res.code === 200) {
+        this.uploadList.push({ name: res.data.url, url: res.data.url });
         this.uploadedSuccessfully();
       } else {
         this.number--;
         this.$modal.closeLoading();
-        this.$modal.msgError(res.data.msg);
+        this.$modal.msgError(res.msg);
         this.$refs.imageUpload.handleRemove(file);
         this.uploadedSuccessfully();
       }
@@ -202,12 +202,11 @@ export default {
   }
 };
 </script>
-<style lang="scss" scoped>
+<style scoped lang="scss">  //123
 // .el-upload--picture-card 控制加号部分
 ::v-deep.hide .el-upload--picture-card {
   display: none;
 }
-
 // 去掉动画效果
 ::v-deep .el-list-enter-active,
 ::v-deep .el-list-leave-active {
diff --git a/src/views/engine/engine/index.vue b/src/views/engine/engine/index.vue
index af6e7d9..4e84376 100644
--- a/src/views/engine/engine/index.vue
+++ b/src/views/engine/engine/index.vue
@@ -317,9 +317,7 @@
 
       <el-table-column label="描述" prop="description"></el-table-column>
 
-      <el-table-column
-
-        align="right">
+      <el-table-column align="right">
 
         <template slot-scope="scope">
 
@@ -354,6 +352,7 @@
             type="text"
 
             @click="engineRuleMaintenance(scope.row)">规则维护
+
           </el-button>
 
         </template>
@@ -626,7 +625,6 @@ export default {
 
     engineRuleMaintenance(row) {
 
-
       this.$router.push({
 
         path: 'list',
diff --git a/src/views/engine/engine/list.vue b/src/views/engine/engine/list.vue
index 5f6cbfa..ea97a14 100644
--- a/src/views/engine/engine/list.vue
+++ b/src/views/engine/engine/list.vue
@@ -52,7 +52,7 @@
 
         <div v-show="opens">
 
-          <codemirror v-model="versions.ruleContent"   :value="this.versions.ruleContent" :options="cmOptions" >
+          <codemirror v-model="versions.ruleContent" :value="this.versions.ruleContent" :options="cmOptions">
 
           </codemirror>
 
@@ -122,12 +122,6 @@
 
         <template slot-scope="scope">
 
-<!--          <el-button v-show="scope.row.isActivate==1" @click="del(scope.row.id)" type="text" size="small">-->
-
-<!--            删除引擎-->
-
-<!--          </el-button>-->
-
           <el-button v-show="scope.row.isActivate==1" @click="forbiddenEngines(scope.row.id)" type="text" size="small">
 
             关闭引擎
@@ -158,7 +152,6 @@
 
       </el-table-column>
 
-
     </el-table>
 
     <!--回显-->
@@ -203,6 +196,13 @@
 
         </el-form-item>
 
+        <div v-show="opens">
+
+          <codemirror v-model="versions.ruleContent" :value="this.versions.ruleContent" :options="cmOptions">
+
+          </codemirror>
+
+        </div>
 
       </el-form>
 
@@ -210,6 +210,8 @@
 
         <el-button type="primary" @click="back()">确 定</el-button>
 
+        <el-button type="primary" @click="testEngine()">测试</el-button>
+
       </div>
 
     </el-dialog>
@@ -220,25 +222,62 @@
 
 <script>
 
-import {add, dels, findById, forbiddenEngine, generate, onEngine, sel, selectEngineById} from "@/api/engine/engine";
+import {
+
+  add,
+
+  dels,
+
+  findById,
+
+  forbiddenEngine,
+
+  generate,
+
+  onEngine,
+
+  sel,
+
+  selectEngineById,
+
+  testData
+
+} from "@/api/engine/engine";
 
 import Java from "@/components/JavaIDE.vue/java.vue";
 
 import {codemirror} from 'vue-codemirror'
 
-import "codemirror/theme/ambiance.css"; // 这里引入的是主题样式，根据设置的theme的主题引入，一定要引入！！
+import "codemirror/theme/ambiance.css";
+
+import source from "@/views/assets/source/index.vue";
+
+import {selectSourceList} from "@/api/etl/switch"; // 这里引入的是主题样式，根据设置的theme的主题引入，一定要引入！！
 
 require("codemirror/mode/javascript/javascript"); // 这里引入的模式的js，根据设置的mode引入，一定要引入！！
 
 export default {
 
+  computed: {
+
+    source() {
+
+      return source
+
+    }
+
+  },
+
   dicts: ['rule_engine_activate_status', 'rule_engine_type', 'sys_normal_disable', 'rule_engine_level'],
 
   //import引入的组件需要注入到对象中才能使用"
 
   components: {
+
     codemirror,
+
     Java
+
   },
 
   props: {},
@@ -249,6 +288,18 @@ export default {
 
     return {
 
+      engines: [],
+
+      versionFormVisibles: false,
+
+      datas: {
+
+        source: []
+
+      },
+
+      dialogTableVisible: false,
+
       direction: 'rtl',
 
       versionFormVisible: false,
@@ -275,7 +326,7 @@ export default {
 
         status: '初始化',
 
-        ruleContent:''
+        ruleContent: ''
 
       },
 
@@ -307,7 +358,17 @@ export default {
 
   methods: {
 
-    closes(){
+    testEngine() {
+
+      testData(this.versions).then(res => {
+
+        this.$message.success(res.msg || "成功")
+
+      })
+
+    },
+
+    closes() {
 
       this.dialogFormVisible = false;
 
@@ -315,7 +376,7 @@ export default {
 
     showCode() {
 
-      this.opens=true
+      this.opens = true
 
       this.versions.isActivate = 1
 
@@ -325,9 +386,9 @@ export default {
 
       this.versions.id = this.$route.query.id
 
-      generate(this.versions).then(res =>{
+      generate(this.versions).then(res => {
 
-        this.versions.ruleContent=res.ruleContent;
+        this.versions.ruleContent = res.ruleContent;
 
         this.$message.success(res.msg || "成功");
 
@@ -381,11 +442,8 @@ export default {
 
       this.versions.status = 1
 
-      console.log(this.versions)
-
       add(this.versions).then(res => {
 
-
         this.$message.success(res.msg || "新增成功")
 
       })
@@ -418,6 +476,16 @@ export default {
 
     },
 
+    selectSourceList() {
+
+      selectSourceList({}).then(res => {
+
+        this.engines = res.data;
+
+      })
+
+    },
+
     List() {
 
       findById(this.maintenance.id).then(res => {
@@ -440,8 +508,7 @@ export default {
 
     del(id) {
 
-      if (confirm("你确定" +
-        "删除吗?")) {
+      if (confirm("你确定删除吗?")) {
 
         dels(id).then(res => {
 
@@ -465,6 +532,8 @@ export default {
 
     this.selectEngine();
 
+    this.selectSourceList();
+
   }
 
 }
diff --git a/src/views/port/port/employee.vue b/src/views/port/port/employee.vue
index a7f3bdd..abea0ca 100644
--- a/src/views/port/port/employee.vue
+++ b/src/views/port/port/employee.vue
@@ -39,13 +39,26 @@
                 <span style="font-weight: bold;font-size: 20px">价格：</span>
                 {{connector.connectorPrice}}/次<br>
 
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testPhone()" v-if="connector.connectorName=='手机号查询归属地'">测试API</el-button>
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testIP()" v-if="connector.connectorName=='IP查询归属地'">测试API</el-button>
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testNews()" v-if="connector.connectorName=='新闻头条'">测试API</el-button>
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testWeather()" v-if="connector.connectorName=='气象预警'">测试API</el-button>
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testBirthdate()" v-if="connector.connectorName=='生辰助手'">测试API</el-button>
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testMailbox()" v-if="connector.connectorName=='邮编查询'">测试API</el-button>
-                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testWeatherForecast()" v-if="connector.connectorName=='天气预报'">测试API</el-button>
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testPhone()" v-if="connector.connectorName=='手机号查询归属地'">测试API</el-button>-->
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testIP()" v-if="connector.connectorName=='IP查询归属地'">测试API</el-button>-->
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testNews()" v-if="connector.connectorName=='新闻头条'">测试API</el-button>-->
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testWeather()" v-if="connector.connectorName=='气象预警'">测试API</el-button>-->
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testBirthdate()" v-if="connector.connectorName=='生辰助手'">测试API</el-button>-->
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testMailbox()" v-if="connector.connectorName=='邮编查询'">测试API</el-button>-->
+<!--                <el-button type="primary" style="float: right; padding: 10px 10px" @click="testWeatherForecast()" v-if="connector.connectorName=='天气预报'">测试API</el-button>-->
+
+
+                <el-button type="primary" style="float: right; padding: 10px 10px" @click="navigateToDocumentation(connector.connectorId)">测试</el-button>
+
+
+<!--                <el-button-->
+<!--                  type="primary"-->
+<!--                  style="float: right; padding: 10px 10px"-->
+<!--                  @click="navigateToDocumentation(connector)"-->
+<!--                >-->
+<!--                  接口文档-->
+<!--                </el-button>-->
+
               </el-card>
             </el-col>
           </el-row>
@@ -377,6 +390,16 @@ export default {
   watch: {},
   //方法集合",
   methods: {
+
+    navigateToDocumentation(id) {
+      this.$router.push({
+        path: `/port/sys`,
+        query: { id }
+      });
+    },
+
+
+
     async fetchUserBalance() {
       try {
         const userId = localStorage.getItem('userId');
diff --git a/src/views/port/port/index.vue b/src/views/port/port/index.vue
index 529a361..4015b55 100644
--- a/src/views/port/port/index.vue
+++ b/src/views/port/port/index.vue
@@ -41,8 +41,8 @@
         label="接口图片"
         width="180">
         <template slot-scope="scope">
-<!--          <image-preview :src="scope.row.connectorPicture" width="50" height="50"/>-->
-          <el-image style="width: 100px; height: 100px" :src="scope.row.connectorPicture" :fit="fit"></el-image>
+          <!--          <image-preview :src="scope.row.connectorPicture" width="50" height="50"/>-->
+          <el-image style="width: 100px; height: 100px" :src="scope.row.connectorPicture"></el-image>
         </template>
       </el-table-column>
 
@@ -54,14 +54,6 @@
         </template>
       </el-table-column>
 
-      <el-table-column
-        label="上架时间"
-        width="180">
-        <template slot-scope="scope">
-          <span style="margin-left: 10px">{{ scope.row.connectorUptime }}</span>
-        </template>
-      </el-table-column>
-
       <el-table-column
         label="更新时间"
         width="180">
@@ -94,15 +86,15 @@
         </template>
       </el-table-column>
     </el-table>
-<!--  新增接口-->
+    <!--  新增接口-->
     <el-dialog title="新增接口" :visible.sync="dialogFormVisible">
-      <el-form :model="form">
+      <el-form  ref="form" :model="form">
         <el-form-item label="接口名称" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorName" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorName" autocomplete="off"></el-input>
         </el-form-item>
 
         <el-form-item label="接口分类">
-          <el-select v-model="formLabelAlign.connectorSort" placeholder="请选择活动区域">
+          <el-select v-model="form.connectorSort" placeholder="请选择活动区域">
             <el-option label="生活服务" value="生活服务">生活服务</el-option>
             <el-option label="金融科技" value="金融科技">金融科技</el-option>
             <el-option label="数据智能" value="数据智能">数据智能</el-option>
@@ -115,37 +107,44 @@
         </el-form-item>
 
         <el-form-item label="接口描述" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorDescribe" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorDescribe" autocomplete="off"></el-input>
         </el-form-item>
 
         <el-form-item label="接口图片" :label-width="formLabelWidth">
-          <el-upload
-            action="https://jsonplaceholder.typicode.com/posts/"
-            list-type="picture-card"
-            :on-preview="handlePictureCardPreview"
-            :on-remove="handleRemove">
-            <i class="el-icon-plus"></i>
-          </el-upload>
+          <image-upload v-model="form.connectorPicture" autocomplete="off"/>
         </el-form-item>
 
+
+
+
+        <!--        <el-form-item label="接口图片" :label-width="formLabelWidth">-->
+        <!--          <el-upload-->
+        <!--            action="https://jsonplaceholder.typicode.com/posts/"-->
+        <!--            list-type="picture-card"-->
+        <!--            :on-preview="handlePictureCardPreview"-->
+        <!--            :on-remove="handleRemove">-->
+        <!--            <i class="el-icon-plus"></i>-->
+        <!--          </el-upload>-->
+        <!--        </el-form-item>-->
+
         <el-form-item label="公司" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorCompany" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorCompany" autocomplete="off"></el-input>
         </el-form-item>
 
         <el-form-item label="价格" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorPrice" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorPrice" autocomplete="off"></el-input>
         </el-form-item>
 
         <el-form-item label="API_URL" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorApiurl" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorApiurl" autocomplete="off"></el-input>
         </el-form-item>
 
         <el-form-item label="API_EYE" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorApikey" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorApikey" autocomplete="off"></el-input>
         </el-form-item>
 
         <el-form-item label="请求方式" :label-width="formLabelWidth">
-          <el-input v-model="formLabelAlign.connectorRequest" autocomplete="off"></el-input>
+          <el-input v-model="form.connectorRequest" autocomplete="off"></el-input>
         </el-form-item>
 
       </el-form>
@@ -173,21 +172,22 @@
           <el-input v-model="formInline.connectorDescribe" autocomplete="off"></el-input>
         </el-form-item>
 
+
         <el-form-item label="接口图片" :label-width="formLabelWidth">
-          <el-input v-model="formInline.connectorPicture" autocomplete="off"></el-input>
+          <image-upload v-model="formInline.connectorPicture" autocomplete="off"></image-upload>
         </el-form-item>
 
         <el-form-item label="公司" :label-width="formLabelWidth">
           <el-input v-model="formInline.connectorCompany" autocomplete="off"></el-input>
         </el-form-item>
 
-<!--        <el-form-item label="剩余次数" :label-width="formLabelWidth">-->
-<!--          <el-input v-model="formInline.connectorResidueDegree" autocomplete="off"></el-input>-->
-<!--        </el-form-item>-->
+        <!--        <el-form-item label="剩余次数" :label-width="formLabelWidth">-->
+        <!--          <el-input v-model="formInline.connectorResidueDegree" autocomplete="off"></el-input>-->
+        <!--        </el-form-item>-->
 
-<!--        <el-form-item label="购买次数" :label-width="formLabelWidth">-->
-<!--          <el-input v-model="formInline.connectorFrequency" autocomplete="off"></el-input>-->
-<!--        </el-form-item>-->
+        <!--        <el-form-item label="购买次数" :label-width="formLabelWidth">-->
+        <!--          <el-input v-model="formInline.connectorFrequency" autocomplete="off"></el-input>-->
+        <!--        </el-form-item>-->
 
         <el-form-item label="API_URL" :label-width="formLabelWidth">
           <el-input v-model="formInline.connectorApiurl" autocomplete="off"></el-input>
@@ -224,6 +224,7 @@ import {findConnectorList} from "@/api/port/port";
 import {addConnector} from "@/api/port/port";
 import {getDeleteConnector} from "@/api/port/port";
 import {updateConnector} from "@/api/port/port";
+
 export default {
   //import引入的组件需要注入到对象中才能使用"
   components: {},
@@ -231,12 +232,13 @@ export default {
   data() {
     //这里存放数据"
     return {
-      formInline:{},
-      form:{},
-      tableData:[],
-      formLabelAlign:{},
-      dialogFormVisible:false,
-      dialogFormVisible1:false,
+      formInline: {},
+      form: {},
+      tableData: [],
+      formLabelAlign: {},
+      formLabelWidth: "120px",
+      dialogFormVisible: false,
+      dialogFormVisible1: false,
     };
   },
   //计算属性 类似于data概念",
@@ -245,39 +247,39 @@ export default {
   watch: {},
   //方法集合",
   methods: {
-    updateConnector(){
-      updateConnector(this.formInline).then((res)=>{
+    updateConnector() {
+      updateConnector(this.formInline).then((res) => {
         alert(res.msg);
-        if (200==res.code){
+        if (200 == res.code) {
           this.findConnectorList();
-          this.dialogFormVisible1=false;
+          this.dialogFormVisible1 = false;
         }
       })
     },
-    handleEdit(row){
-      this.formInline=row;
-      this.dialogFormVisible1=true;
+    handleEdit(row) {
+      this.formInline = row;
+      this.dialogFormVisible1 = true;
     },
-    handleDelete(row){
-      getDeleteConnector(row.connectorId).then((res)=>{
+    handleDelete(row) {
+      getDeleteConnector(row.connectorId).then((res) => {
         alert(res.msg);
-        if (200==res.code){
+        if (200 == res.code) {
           this.findConnectorList();
         }
       })
     },
-    addConnector(){
-      addConnector(this.formLabelAlign).then((res)=>{
+    addConnector() {
+      addConnector(this.form).then((res) => {
         alert(res.msg);
-        if (200==res.code){
+        if (200 == res.code) {
           this.findConnectorList();
-          this.dialogFormVisible=false;
+          this.dialogFormVisible = false;
         }
       })
     },
-    findConnectorList(){
-      findConnectorList(this.form).then((res)=>{
-        this.tableData=res.data;
+    findConnectorList() {
+      findConnectorList(this.form).then((res) => {
+        this.tableData = res.data;
       })
     }
   },
diff --git a/src/views/port/sys/index.vue b/src/views/port/sys/index.vue
new file mode 100644
index 0000000..1094ecb
--- /dev/null
+++ b/src/views/port/sys/index.vue
@@ -0,0 +1,540 @@
+<!-- src/views/Documentation.vue -->
+<template>
+  <el-container>
+    <el-aside width="400px" style="background-color: #f5f5f5; padding: 20px;">
+      <div>
+        <el-image :src="picture" style="width: 80%; max-width: 300px; height: auto;" fit="contain"></el-image>
+        <h2>{{ name }}</h2>
+        <p>{{remark}}</p>
+        <p><strong></strong> <span class="price">{{ price }}/次</span></p>
+
+
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testPhone()" v-if="this.name ==='手机号查询归属地'">测试API</el-button>
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testIP()" v-if="this.name==='IP查询归属地'">测试API</el-button>
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testNews()" v-if="this.name==='新闻头条'">测试API</el-button>
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testWeather()" v-if="this.name==='气象预警'">测试API</el-button>
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testBirthdate()" v-if="this.name==='生辰助手'">测试API</el-button>
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testMailbox()" v-if="this.name==='邮编查询'">测试API</el-button>
+        <el-button type="primary" style="float: right; padding: 10px 10px" @click="testWeatherForecast()" v-if="this.name==='天气预报'">测试API</el-button>
+
+
+        <!--    手机号查询归属地-->
+        <el-dialog title="手机查询归属地" :visible.sync="dialogFormVisible">
+          <el-form :model="formInline">
+            <el-form-item label="手机号" :label-width="formLabelWidth">
+              <el-input v-model="formInline.tel" autocomplete="off" placeholder="请输入手机号"></el-input>
+            </el-form-item>
+            <span style="font-weight: bold;font-size: 20px" v-if="formInline.reason==true">
+        省份：{{this.formInline.province}}<br>
+        城市：{{this.formInline.city}}<br>
+        区号：{{this.formInline.areacode}}<br>
+        邮编：{{this.formInline.zip}}<br>
+        运营商：{{this.formInline.company}}<br>
+        </span>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="phonePlace()">发起请求</el-button>
+          </div>
+        </el-dialog>
+
+        <!--IP查询归属地-->
+        <el-dialog title="IP查询归属地" :visible.sync="dialogFormVisible1">
+          <el-form :model="formIp">
+            <el-form-item label="IP" >
+              <el-input v-model="formIp.ip" autocomplete="off" placeholder="请输入ip"></el-input>
+            </el-form-item>
+            <span style="font-weight: bold;font-size: 20px" v-if="formIp.reason==true">
+        国家：{{this.formIp.country}}<br>
+        省份：{{this.formIp.province}}<br>
+        城市：{{this.formIp.city}}<br>
+        运营商：{{this.formIp.isp}}<br>
+        </span>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="getIpPlace()">发起请求</el-button>
+          </div>
+        </el-dialog>
+
+        <!--天气预报-->
+        <el-dialog title="天气预报" :visible.sync="dialogFormVisible6">
+          <el-form :model="formWeatherForecast">
+            <el-form-item label="城市名" >
+              <el-input v-model="formWeatherForecast.cityName" autocomplete="off" placeholder="请输入城市名"></el-input>
+            </el-form-item>
+            <span style="font-weight: bold;font-size: 20px" v-if="formWeatherForecast.reason==true">
+                城市：{{this.formWeatherForecast.city}}<br>
+                天气：{{this.formWeatherForecast.info}}<br>
+                温度：{{this.formWeatherForecast.temperature}}<br>
+                湿度：{{this.formWeatherForecast.humidity}}<br>
+                风向：{{this.formWeatherForecast.direct}}<br>
+                风力：{{this.formWeatherForecast.power}}<br>
+                空气质量：{{this.formWeatherForecast.aqi}}<br>
+              </span>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="getWeatherForecast(cityName)">发起请求</el-button>
+          </div>
+        </el-dialog>
+
+        <!--    新闻头条-->
+        <el-dialog title="新闻头条" :visible.sync="dialogTableVisible">
+          <el-table :data="gridData">
+            <el-table-column property="title" label="新闻标题" width="150"></el-table-column>
+            <el-table-column property="date" label="新闻时间" width="200"></el-table-column>
+            <el-table-column property="category" label="新闻分类"></el-table-column>
+            <el-table-column property="authorName" label="新闻来源"></el-table-column>
+          </el-table>
+        </el-dialog>
+
+
+        <!--    气象预警-->
+        <el-dialog title="气象预警" :visible.sync="dialogFormVisible4">
+          <el-aside width="100%">
+            <el-tree :data="data" :props="defaultProps">
+              <template slot-scope="{data,node}">
+                <span>{{data.provinceName}}{{data.cityName}}--{{data.cityCode}}</span>
+              </template>
+            </el-tree>
+          </el-aside>
+        </el-dialog>
+
+        <!--生辰助手-->
+        <el-dialog title="生辰助手" :visible.sync="dialogFormVisible2">
+          <el-form :model="formBirthday">
+            <el-form-item label="年" >
+              <el-input v-model="formBirthday.year" autocomplete="off" placeholder="请输入年份"></el-input>
+            </el-form-item>
+
+            <el-form-item label="月" >
+              <el-input v-model="formBirthday.month" autocomplete="off" placeholder="请输入月份"></el-input>
+            </el-form-item>
+
+            <el-form-item label="日" >
+              <el-input v-model="formBirthday.day" autocomplete="off" placeholder="请输入几号"></el-input>
+            </el-form-item>
+
+            <el-form-item label="时" >
+              <el-input v-model="formBirthday.hour" autocomplete="off" placeholder="请输入几点"></el-input>
+            </el-form-item>
+            <span style="font-weight: bold;font-size: 20px" v-if="formBirthday.reason===true">
+                   years： {{this.formBirthday.years}}<br>
+                   months： {{this.formBirthday.months}}<br>
+                   days： {{this.formBirthday.days}}<br>
+                   animal： {{this.formBirthday.animal}}<br>
+                   imonthcn： {{this.formBirthday.imonthcn}}<br>
+                   idaycn： {{this.formBirthday.idaycn}}<br>
+                   cyear： {{this.formBirthday.cyear}}<br>
+                   cmonth： {{this.formBirthday.cmonth}}<br>
+                   cday： {{this.formBirthday.cday}}<br>
+                   gzyear： {{this.formBirthday.gzyear}}<br>
+                   gzmonth： {{this.formBirthday.gzmonth}}<br>
+                   gzday： {{this.formBirthday.gzday}}<br>
+                   isleap： {{this.formBirthday.isleap}}<br>
+                   ncweek： {{this.formBirthday.ncweek}}<br>
+                   isterm： {{this.formBirthday.isterm}}<br>
+                   term： {{this.formBirthday.term}}<br>
+                   astro： {{this.formBirthday.astro}}<br>
+                   eightall： {{this.formBirthday.eightall}}<br>
+                   fiveall： {{this.formBirthday.fiveall}}
+              </span>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="getBirthday()">发起请求</el-button>
+          </div>
+        </el-dialog>
+
+        <!--邮编查询-->
+        <el-dialog title="邮编查询" :visible.sync="dialogFormVisible3">
+          <el-form :model="formPostCode">
+            <el-form-item label="邮编" >
+              <el-input v-model="formPostCode.code" autocomplete="off" placeholder="请输入邮编"></el-input>
+            </el-form-item>
+            <el-table :data="gridData2" v-if="formPostCode.reason===true">
+              <el-table-column property="postNumber" label="邮编" width="150"></el-table-column>
+              <el-table-column property="province" label="省" width="200"></el-table-column>
+              <el-table-column property="city" label="市"></el-table-column>
+              <el-table-column property="district" label="区"></el-table-column>
+              <el-table-column property="address" label="县"></el-table-column>
+            </el-table>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="getPostcode()">发起请求</el-button>
+          </div>
+        </el-dialog>
+
+      </div>
+    </el-aside>
+    <div>
+      <el-tabs v-model="activeTab" @click="handleTabClick">
+        <el-tab-pane label="api 文档" name="api-docs"></el-tab-pane>
+        <el-tab-pane label="错误码参照" name="error-codes"></el-tab-pane>
+        <el-tab-pane label="数据统计" name="data-stats"></el-tab-pane>
+      </el-tabs>
+
+      <div v-if="activeTab === 'api-docs'">
+        <el-main style="padding: 20px;">
+          <div class="api-docs" style="margin-top: 20px;">
+            <el-card>
+              <div slot="header" class="clearfix">
+                <p>接口地址: {{apiEndpoint}}</p>
+                <p>返回格式: json</p>
+                <p>请求方式: {{connectorRequest}}</p>
+                <p>请求示例: {{apiEndpoint}}?=你申请的KEY&{{apiKey}}</p>
+                <p>简介: {{describe}}</p>
+                <h2>json返回示例:</h2>
+                <el-card class="return-example-card">
+                  <pre>{{ returnExample }}</pre>
+                </el-card>
+                <h2>xml返回示例:</h2>
+                <el-card class="return-example-card">
+                  <pre>{{ returnXml }}</pre>
+                </el-card>
+              </div>
+            </el-card>
+          </div>
+        </el-main>
+      </div>
+
+
+      <div v-if="activeTab === 'error-codes'">
+        <el-card style="width: 80%; margin: 20px auto; box-shadow: 0 2px 12px rgba(0,0,0,0.1);">
+          <h3 style="text-align: center; margin-bottom: 20px;">服务级错误码参照(error_code)</h3>
+          <table border="1" style="width: 100%; margin-bottom: 20px;">
+            <tr>
+              <td>错误码</td>
+              <td>说明</td>
+            </tr>
+            <tr v-for="errorCode in errorCodes" :key="errorCode.code">
+              <td>{{ errorCode.code }}</td>
+              <td>{{ errorCode.description }}</td>
+            </tr>
+          </table>
+
+          <h3 style="text-align: center; margin-bottom: 20px;">系统级错误码参照</h3>
+          <table border="1" style="width: 100%;">
+            <tr>
+              <td>错误码</td>
+              <td>说明</td>
+            </tr>
+            <tr v-for="errorCode in Codes" :key="errorCode.code">
+              <td>{{ errorCode.code }}</td>
+              <td>{{ errorCode.description }}</td>
+            </tr>
+          </table>
+
+          <h3 style="text-align: center; margin-bottom: 20px;">错误格式说明（示例200201）：</h3>
+          <table border="1" style="width: 100%;">
+            <tr>
+              <td>2</td>
+              <td>002</td>
+            </tr>
+            <tr v-for="errorCode in Cods" :key="errorCode.code">
+              <td>{{ errorCode.code }}</td>
+              <td>{{ errorCode.description }}</td>
+            </tr>
+          </table>
+        </el-card>
+      </div>
+
+      <div v-if="activeTab === 'data-stats'">
+        <h2>请求</h2>
+      </div>
+    </div>
+  </el-container>
+</template>
+
+<script>
+
+import { findApiById } from "@/api/port/port";
+import {phonePlace ,getIpPlace,getWeatherForecast,getHeadlines,getWeather,getBirthday,getPostcode} from "@/api/port/port";
+
+export default {
+  data() {
+    return {
+      Cods: [
+        { code: '服务级错误（1为系统级错误）', description: '服务模块代码(即数据ID)' },
+      ],
+      Codes: [
+        { code: '10001', description: '错误的请求KEY' },
+        { code: '10002', description: '该KEY无请求权限' },
+        { code: '10003', description: 'KEY过期' },
+        { code: '10004', description: '系统内部异常' },
+      ],
+      errorCodes: [
+        { code: '203201', description: '错误的经纬度' },
+      ],
+      // 邮编查询
+      formPostCode:{
+        code:"",
+        // postNumber:"",
+        // province:"",
+        // city:"",
+        // district:"",
+        // address:"",
+        reason:"",
+      },
+      formBirthday:{
+        year:"",
+        month:"",
+        day:"",
+        hour:"",
+        years:"",
+        months:"",
+        days:"",
+        animal:"",
+        imonthcn:"",
+        idaycn:"",
+        cyear:"",
+        cmonth:"",
+        cday:"",
+        gzyear:"",
+        gzmonth:"",
+        gzday:"",
+        isleap:"",
+        ncweek:"",
+        isterm:"",
+        term:"",
+        astro:"",
+        eightall:"",
+        fiveall:"",
+        reason:"",
+      },
+      data:[],
+      defaultProps: {
+        children:"citys",
+        label:'provinceName',
+      },
+      gridData:[],
+      gridData2:[],
+      formWeatherForecast:{
+        cityName:"",
+        city:"",
+        info:"",
+        temperature:"",
+        humidity:"",
+        direct:"",
+        power:"",
+        aqi:"",
+        reason:"",
+      },
+      // 手机号查询归属地formInline
+      formInline:{
+        tel:"",
+        province:"",
+        city:"",
+        areacode:"",
+        zip:"",
+        company:"",
+        reason:"",
+      },
+      formLabelWidth: '80px',
+      formIp:{
+        ip:"",
+        country:"",
+        province:"",
+        city:"",
+        isp:"",
+        reason:"",
+      },
+
+      activeTab: 'api-docs',
+      name: '',
+      describe: '',
+      price: '',
+      picture: '',
+      returnExample:'',
+      remark: '',
+      returnXml: '',
+      apiKey:'N/A',
+      apiEndpoint: 'N/A',
+      connectorRequest: 'N/A',
+      responseFormat: 'N/A',
+      requestMethod: 'N/A',
+      requestExample: 'N/A',
+      apiDescription: 'N/A',
+      dialogFormVisible:false,
+      dialogFormVisible1:false,
+      dialogFormVisible2:false,
+      dialogFormVisible3:false,
+      dialogFormVisible4:false,
+      dialogFormVisible5:false,
+      dialogFormVisible6:false,
+      dialogTableVisible:false,
+    };
+
+
+
+  },
+  methods: {
+    // 邮编查询
+    getPostcode(){
+      getPostcode(this.formPostCode.code).then((res)=>{
+        console.log(res.data);
+        this.gridData2=res.data;
+        this.formPostCode.reason=true;
+      })
+    },
+    getBirthday(){
+      getBirthday(this.formBirthday).then((res)=>{
+        console.log(res.data);
+        this.formBirthday.reason=true;
+        this.formBirthday.years=res.data.years;
+        this.formBirthday.months=res.data.months;
+        this.formBirthday.days=res.data.days;
+        this.formBirthday.animal=res.data.animal;
+        this.formBirthday.imonthcn=res.data.imonthcn;
+        this.formBirthday.idaycn=res.data.idaycn;
+        this.formBirthday.cyear=res.data.cyear;
+        this.formBirthday.cmonth=res.data.cmonth;
+        this.formBirthday.cday=res.data.cday;
+        this.formBirthday.gzyear=res.data.gzyear;
+        this.formBirthday.gzmonth=res.data.gzmonth;
+        this.formBirthday.gzday=res.data.gzday;
+        this.formBirthday.isleap=res.data.isleap;
+        this.formBirthday.ncweek=res.data.ncweek;
+        this.formBirthday.isterm=res.data.isterm;
+        this.formBirthday.term=res.data.term;
+        this.formBirthday.astro=res.data.astro;
+        this.formBirthday.eightall=res.data.eightall;
+        this.formBirthday.fiveall=res.data.fiveall;
+
+      })
+    },
+    // 气象预警
+    testWeather(){
+
+      getWeather().then((res)=>{
+        this.data=res.data;
+
+        this.dialogFormVisible4=true;
+      })
+    },
+
+    testNews(){
+      getHeadlines().then((res)=>{
+        this.gridData=res.data;
+        this.dialogTableVisible=true;
+      })
+    },
+
+    getWeatherForecast(){
+      getWeatherForecast(this.formWeatherForecast.cityName).then((res)=>{
+        console.log(res.data);
+        this.formWeatherForecast.city=res.data.city;
+        this.formWeatherForecast.info=res.data.info;
+        this.formWeatherForecast.temperature=res.data.temperature;
+        this.formWeatherForecast.humidity=res.data.humidity;
+        this.formWeatherForecast.direct=res.data.direct;
+        this.formWeatherForecast.power=res.data.power;
+        this.formWeatherForecast.aqi=res.data.aqi;
+        this.formWeatherForecast.reason=true;
+      })
+    },
+
+    getIpPlace(){
+      getIpPlace(this.formIp.ip).then((res)=>{
+        console.log(res.data);
+        if (200==res.code){
+          this.formIp.country=res.data.country;
+          this.formIp.province=res.data.province;
+          this.formIp.city=res.data.city;
+          this.formIp.isp=res.data.isp;
+          this.formIp.reason=true;
+        }
+      })
+    },
+
+    phonePlace(){
+      phonePlace(this.formInline.tel).then((res)=>{
+        console.log(res.data);
+        if (200==res.code){
+          this.formInline.province=res.data.province;
+          this.formInline.city=res.data.city;
+          this.formInline.areacode=res.data.areacode;
+          this.formInline.zip=res.data.zip;
+          this.formInline.company=res.data.company;
+          this.formInline.reason=true;
+        }
+      })
+    },
+    testWeatherForecast(){
+      this.dialogFormVisible6=true;
+    },
+    testMailbox(){
+      this.dialogFormVisible3=true;
+    },
+    testBirthdate(){
+      this.dialogFormVisible2=true;
+    },
+    testIP(){
+      this.dialogFormVisible1=true;
+    },
+    testPhone(){
+      this.dialogFormVisible=true;
+    },
+    handleTabClick(tab) {
+      this.activeTab = tab.name;
+    },
+    async loadData(id) {
+      try {
+        const response = await findApiById(id);
+        const data = response.data;
+        this.name = data.connectorName;
+        this.describe = data.connectorDescribe;
+        this.price = data.connectorPrice;
+        this.picture = data.connectorPicture;
+        this.apiEndpoint = data.connectorApiurl;
+        this.apiKey = data.connectorApikey;
+        this.remark = data.remark
+        this.connectorRequest = data.connectorRequest;
+        this.returnExample = data.returnExample;
+        this.returnXml = data.returnXml;
+      } catch (error) {
+        console.error("Failed to fetch API data:", error);
+      }
+    }
+  },
+  created() {
+    const id = this.$route.query.id;
+    if (id) {
+      this.loadData(id);
+    }
+  }
+};
+</script>
+
+<style scoped>
+.price {
+  font-size: 24px; /* 调整字体大小 */
+  color: red;
+}
+.api-docs {
+  margin-top: 20px;
+}
+.return-example-card {
+  margin-top: 20px;
+  padding: 20px;
+  background-color: #f9f9f9;
+  border: 1px solid #dcdfe6;
+}
+.return-example-card pre {
+  margin: 0;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+
+
+table {
+  border-collapse: collapse;
+}
+
+th, td {
+  border: 1px solid black;
+  padding: 10px;
+  text-align: left;
+}
+
+th {
+  background-color: #f2f2f2;
+}
+</style>
diff --git a/src/views/type/index.vue b/src/views/type/index.vue
index 9ab6206..ad587cc 100644
--- a/src/views/type/index.vue
+++ b/src/views/type/index.vue
@@ -60,6 +60,7 @@
       </el-table-column>
 
     </el-table>
+
   </div>
 
 </template>
@@ -152,5 +153,7 @@ export default {
 
 }
 </script>
+
 <style scoped>
+
 </style>
diff --git a/src/views/version/version/version.vue b/src/views/version/version/version.vue
index 13e0a3b..5e96290 100644
--- a/src/views/version/version/version.vue
+++ b/src/views/version/version/version.vue
@@ -275,10 +275,6 @@ export default {
 
         this.arr = res.data;
 
-        console.log(res)
-
-        console.log(this.arr)
-
       })
 
     },
@@ -327,5 +323,7 @@ export default {
 
 }
 </script>
+
 <style scoped>
+
 </style>