feat:前端项目,实现接口上线和下线的功能,前后端联动

ui/yangyi-open-api-platform-ui/src/commom/api/interfaceInfo.js

@@ -0,0 +1,53 @@
+import request from '/src/commom/utils/request.js'
+
+// 增
+export function addInterface(data) {
+    return request({
+        url: '/interfaceInfo',
+        method: 'post',
+        data
+    })
+}
+//删除
+export function deleteInterface(data) {
+    return request({
+        url: '/interfaceInfo/'+data,
+        method: 'delete'
+    })
+}
+//修改
+export function updateInterface(data) {
+    return request({
+        url: '/interfaceInfo',
+        method: 'put',
+        data
+    })
+}
+//查询
+export function queryInterface(params) {
+    return request({
+        url: '/interfaceInfo',
+        method: 'get',
+        params:{
+            ...params,
+        }
+    })
+}
+//上线接口
+export function onlineInterface(data) {
+    return request({
+        url: '/interfaceInfo/online',
+        method: 'put',
+        data
+    })
+}
+//下线接口
+export function offlineInterface(data) {
+    return request({
+        url: '/interfaceInfo/offline',
+        method: 'put',
+        data
+    })
+}
+
+

ui/yangyi-open-api-platform-ui/src/views/interfaceInfo/main.vue

@@ -95,9 +95,10 @@
 
 <el-table-column prop="status" label="状态" width="100">
     <template #default="{ row }">
-    <el-tag :type="row.status === 1 ? 'success' : 'danger'">
-    {{ row.status === 1 ? '开启' : '关闭' }}
-</el-tag>
+<!--    <el-tag :type="row.status === 1 ? 'success' : 'danger'">-->
+<!--    {{ row.status === 1 ? '开启' : '关闭' }}-->
+<!--</el-tag>-->
+      <el-switch v-model="row.status" :active-value="1" :inactive-value="0" @change="handleStatusChange(row)" />
 </template>
 </el-table-column>
 
@@ -315,7 +316,13 @@ show-word-limit
     Delete,
     View
 } from '@element-plus/icons-vue'
-    import {addInterface, deleteInterface, queryInterface, updateInterface} from "../../commom/api/interfaceInfo.js";
+    import {
+      addInterface,
+      deleteInterface,
+      onlineInterface,
+      queryInterface,
+      updateInterface
+    } from "../../commom/api/interfaceInfo.js";
 
     // 响应式数据
     const loading = ref(false)
@@ -621,6 +628,34 @@ show-word-limit
 }
     return types[method] || 'info'
 }
+    const handleStatusChange = async (interfaceInfo) =>{
+      console.log(interfaceInfo)
+      if(interfaceInfo.status === 1){
+        //上线
+        onlineInterface({
+          id:interfaceInfo.id
+        }).then(res=>{
+          if(res.code===200){
+            ElMessage.success(res.msg)
+          }else{
+            interfaceInfo.status = 0
+            ElMessage.error(res.msg)
+          }
+        })
+      }else{
+        //下线
+        onlineInterface({
+          id:interfaceInfo.id
+        }).then(res=>{
+          if(res.code===200){
+            ElMessage.success(res.msg)
+          }else{
+            interfaceInfo.status = 1
+            ElMessage.error(res.msg)
+          }
+        })
+      }
+    }
 
     // 生命周期
     onMounted(() => {