soc_web/src/views/system/logManagement/dialog.info.vue

<template>
  <div class="edu-training-edit">
    <DialogCom :title="this.title" :visible.sync="isShow" append-to-body>
      <div class="page-body">
        <div class="extend_mod" style="max-height: 500px;">
          <el-table :data="logList" border style="width: 100%;max-height: 500px;overflow-y: auto;">
            <el-table-column
              prop="fileName"
              label="文件名称"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="fileType"
              label="文件类型"
              align="center"
            >
              <template slot-scope="scope">
                {{ scope.row.fileType == 1 ? '文件' : '目录' }}
              </template>

            </el-table-column>
            <el-table-column
              prop="fileSize"
              label="文件大小"
              align="center"
            >
            </el-table-column>
            <el-table-column
              label="操作"
              align="center"
              width="200"
              class-name="small-padding fixed-width"
            >
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit-outline"
                  @click="transferLog(scope.row)"
                >获取日志
                </el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit-outline"
                  @click="transferLog(scope.row)"
                >重新获取
                </el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="handleDelete(scope.row)"
                >下载
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button @click="onHide">关闭</el-button>
      </div>
    </DialogCom>
  </div>
</template>

<script>
import {mapMutations, mapState} from "vuex";
import {getLogList} from "@/api/system/logManagement";
import {getLabel} from "@/views/commonOption";

export default {
  components: {},
  dicts: [],
  data() {
    const params = this.$route.params;
    return {
      id: params ? params.id : null,
      isShow: false,
      formData: this.reset(),
      title: '',
      logList: [],
      serverId: null,
      serviceId: null,
    };
  },

  props: {},
  watch: {},
  computed: {
    ...mapState(["loginUser"]),
  },
  methods: {
    ...mapMutations([]),
    getLabel,
    reset(other = {}) {
      return {
        fileName: null,
        fileSize: null,
        fileType: null,
        ...other,
      };
    },
    async refresh(serverId, serviceId) {
      if (!serverId || !serviceId) {
        this.reset(serverId);
      } else {
        getLogList(serverId, serviceId).then((response) => {
          this.logList = response.data;
          this.loading = false;
        });
      }
    },
    async show(server, service, other = {}) {
      this.serverId = server.id;
      this.serviceId = service.id;
      this.title = service.checkName + "日志详情页";
      await this.refresh(server.id, service.id);
      this.isShow = true;
    },

    transferLog(row) {


    },
    // 事件
    onHide() {
      this.isShow = false;
    },
  },
  mounted() {
  },
};
</script>

<style lang="scss" scoped>
.text-content {
  margin: 0;
  max-height: 500px;
  overflow: auto;
}
</style>