1

lzhe

2024-06-06 4c810c1feb3f78c458084d73e89adc6c4f2256f1

 src/views/monitor/log/api.vue

@@ -2,34 +2,33 @@
 * @Author: lzhe lzhe@example.com
 * @Date: 2024-03-26 10:28:33
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-03-29 17:38:39
 * @LastEditTime: 2024-04-03 11:21:03
 * @FilePath: /smart-web/src/views/master/person/main/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
   <div class="api-main">
      <el-form :inline="true" :model="searchData" abel-width="120px">
      <el-form :inline="true" :model="searchData" label-width="80px">
         <el-form-item label="服务id">
            <el-input v-model="searchData.test" placeholder="服务id" clearable />
            <el-input v-model="searchData.serviceId" placeholder="服务id" clearable />
         </el-form-item>
         <el-form-item label="服务host">
            <el-input v-model="searchData.test" placeholder="服务host" clearable />
            <el-input v-model="searchData.serverHost" placeholder="服务host" clearable />
         </el-form-item>
         <el-form-item>
            <el-button type="primary" @click="searchBtn">搜索</el-button>
            <el-button @click="searchBtn">清空</el-button>
            <el-button type="primary" @click="searchclick">搜索</el-button>
            <el-button @click="searchClearBtn">清空</el-button>
         </el-form-item>
      </el-form>
      <div>
         <div class="api-table">
            <el-table ref="multipleTableRef" :data="tableData" border style="width: 100%" class="multipleTableRef">
               <el-table-column prop="date" label="服务id"></el-table-column>
               <el-table-column prop="name" label="服务host"></el-table-column>
               <el-table-column prop="name" label="软件环境"></el-table-column>
               <el-table-column prop="name" label="日志级别"></el-table-column>
               <el-table-column prop="name" label="日志id"></el-table-column>
               <el-table-column prop="name" label="请求接口"></el-table-column>
               <el-table-column prop="name" label="日志时间"></el-table-column>
               <el-table-column prop="serviceId" label="服务id"></el-table-column>
               <el-table-column prop="serverHost" label="服务host"></el-table-column>
               <el-table-column prop="serverIp" label="服务ip"></el-table-column>
               <el-table-column prop="env" label="软件环境"></el-table-column>
               <el-table-column prop="requestUri" label="请求接口"></el-table-column>
               <el-table-column prop="createTime" label="日志时间"></el-table-column>
               <el-table-column fixed="right" label="操作">
                  <template #default="scope">
                     <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
@@ -37,72 +36,63 @@
               </el-table-column>
            </el-table>
            <el-pagination
               style="margin-top: 12px;"
               @size-change="handleSizeChange"
               @current-change="handleCurrentChange"
               :current-page="currentPage4"
               :page-sizes="[100, 200, 300, 400]"
               :page-size="100"
               :page-sizes="[15, 50, 100]"
               :page-size="15"
               layout="total, sizes, prev, pager, next, jumper"
               :total="400">
               :total="total">
            </el-pagination>
         </div>
      </div>
      <el-drawer v-model="drawer" title="查 看" direction="rtl" :before-close="handleClose" size="60%" modal-class="viewData">
         <el-form :inline="true" :model="viewData" abel-width="120px" class="form-view-data">
         <el-form :inline="true" :model="viewData" label-width="80px" class="form-view-data">
            <el-row>
               <el-col :span="12">
                  <el-form-item label="服务id" center>
                     <span>aaa</span>
                     <span>{{viewData.serviceId}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="服务host" center>
                     <span>aaa</span>
                     <span>{{viewData.serverHost}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="服务ip" center>
                     <span>aaa</span>
                     <span>{{viewData.serverIp}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="软件环境" center>
                     <span>aaa</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="日志级别" center>
                     <span>aaa</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="日志id" center>
                     <span>aaa</span>
                     <span>{{viewData.env}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="请求接口" center>
                     <span>aaa</span>
                     <span>{{viewData.requestUri}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="12">
                  <el-form-item label="日志时间" center>
                     <span>aaa</span>
                     <span>{{viewData.createTime}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="24">
                  <el-form-item label="用户代理" center>
                     <span>aaa</span>
                     <span>{{viewData.userAgent}}</span>
                  </el-form-item>
               </el-col>
               <el-col :span="24">
                  <el-form-item label="日志管理" center>
                     <span>aaa</span>
                  <el-form-item label="日志数据" center>
                     <span></span>
                  </el-form-item>
               </el-col>
               <el-col :span="24">
                  <el-form-item label="请求数据" center>
                     <span>aaa</span>
                     <span>{{viewData.params}}</span>
                  </el-form-item>
               </el-col>
            </el-row>
@@ -115,10 +105,22 @@
      name: "allocation",
      data(){
         return {
            viewData: {},
            viewData: {
               serviceId: "",
               serverHost: "",
               serverIp: "",
               env: "",
               requestUri: "",
               createTime: "",
               userAgent: "",
               params: ""
            },
            drawer: false,
            searchData: {
               test: ""
               serviceId: "",
               serverHost: "",
               current: "1",
               size: "15"
            },
            dialog: {
               save: false,
@@ -127,57 +129,66 @@
            leftActive: true,
            input: '',
            input3: '',
            tableData: [{
               date: '2016-05-02',
               name: '王小虎',
               province: '上海',
               city: '普陀区',
               address: '上海市普陀区金沙江路 1518 弄',
               zip: 200333
               }, {
               date: '2016-05-04',
               name: '王小虎',
               province: '上海',
               city: '普陀区',
               address: '上海市普陀区金沙江路 1517 弄',
               zip: 200333
               }, {
               date: '2016-05-01',
               name: '王小虎',
               province: '上海',
               city: '普陀区',
               address: '上海市普陀区金沙江路 1519 弄',
               zip: 200333
               }, {
               date: '2016-05-03',
               name: '王小虎',
               province: '上海',
               city: '普陀区',
               address: '上海市普陀区金沙江路 1516 弄',
               zip: 200333
            }]
            tableData: []
         }
      },
      created(){
         
      },
      mounted(){
			
         this.searchBtn();
      },
      methods: {
         handleClose() {
            this.drawer = false;
         },
         searchBtn() {},
         searchClearBtn() {
            this.searchData = {
               code: "",
               dictValue: "",
               current: "1",
               size: "15"
            }
            this.searchBtn();
         },
         searchclick() {
            this.searchData.current = "1";
            this.searchData.size = "15";
            this.searchBtn();
         },
         searchBtn() {
            this.$HTTP.get("/api/blade-log/api/list",this.searchData).then(res=> {
               if(res.code == 200) {
                  this.tableData = res.data.records;
                  this.total = res.data.total;
               }
            })
         },
         //查看
         table_show(row){
            this.drawer = true;
            this.$HTTP.get("/api/blade-log/api/detail?id="+row.id).then(res=> {
               if(res.code == 200) {
                  this.viewData = res.data;
                  this.drawer = true;
               }
            })
         },
         handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
         },
         handleCurrentChange(val) {
            console.log(`当前页: ${val}`);
         },
         handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
            this.searchData.current = "1";
            this.searchData.size = val;
            this.searchBtn();
         },
         handleCurrentChange(val) {
            console.log(`当前页: ${val}`);
            this.searchData.current = val;
            this.searchBtn();
         }
      }
   }