devops.vue 4.22 KB
Newer Older
xulili's avatar
xulili committed
1
<template>
xulili's avatar
xulili committed
2
  <!-- 运维日志 -->
xulili's avatar
xulili committed
3 4 5 6 7
  <div class="devops-wrapper height100">
      <div class="search-container">
          <el-form :inline="true" :model="form">
            <el-form-item>
                <el-input
xulili's avatar
xulili committed
8
                 v-model="form.userName" 
xulili's avatar
xulili committed
9
                 placeholder="请输入运维者账号"
xulili's avatar
xulili committed
10 11 12 13 14
                 suffix-icon="el-icon-search"
                ></el-input>
            </el-form-item>
            <el-form-item>
              <el-date-picker
xulili's avatar
xulili committed
15
                v-model="form.date"
xulili's avatar
xulili committed
16 17
                type="daterange"
                range-separator="至"
xulili's avatar
xulili committed
18
                value-format="yyyy-MM-dd"
xulili's avatar
xulili committed
19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35
                start-placeholder="开始日期"
                end-placeholder="结束日期">
             </el-date-picker>
            </el-form-item>
            <el-form-item>
                <div class="btn-group">
                   <el-button type="primary" @click="handleSubmit">查询</el-button>
                   <el-button @click="handleReset">重置</el-button>
                </div>     
            </el-form-item>
        </el-form>
        <div class="page-tip">
            <span class="page-tip-title">页面说明:</span>
            <span class="page-tips">可查看所有账号在系统上的操作信息,可根据操作类型、操作时间段查询等方式对日志信息进行筛选</span>
        </div>
      </div>
      <div class="table-content hasTabs">
xulili's avatar
xulili committed
36 37 38 39 40 41 42 43 44 45
           <party-table 
            class="noAdd" 
            :currentPage="page._index"
            :feildList="feildList" 
            :list="list">
            </party-table>
           <party-pagination
            :page="page"
            @changePage="handleChangeCurrent"
           />
xulili's avatar
xulili committed
46 47 48 49 50 51 52 53 54
      </div>
  </div>
</template>
<script>
import { partyPagination,partyTable } from '@/components/index'
export default {
    data(){
        return{
            form:{
xulili's avatar
xulili committed
55 56 57 58
                userName:'',
                date:'',
                startDate:'',
                endDate:''
xulili's avatar
xulili committed
59 60
            },
            feildList:[
xulili's avatar
xulili committed
61 62 63 64
                {prop:'userName',label:'运维账号'},
                {prop:'area',label:'运维区域'},
                {prop:'operationType',label:'操作内容'},
                {prop:'createTime',label:'操作时间'}
xulili's avatar
xulili committed
65
            ],
xulili's avatar
xulili committed
66 67 68 69 70 71
            list: [],
            page:{
                _index:1,
                _size:10,
                total:0
            }
xulili's avatar
xulili committed
72 73 74 75
        }
    },
    components:{ partyTable, partyPagination},
    mounted(){
xulili's avatar
xulili committed
76
         this.getLog()
xulili's avatar
xulili committed
77 78 79
    },
    methods:{
        handleSubmit(){
xulili's avatar
xulili committed
80
           this.getLog()
xulili's avatar
xulili committed
81 82
        },
        handleReset(){
xulili's avatar
xulili committed
83 84 85 86
            for(let key in this.form){
                this.form[key] = ""
            }
           this.getLog()
xulili's avatar
xulili committed
87
        },
xulili's avatar
xulili committed
88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135
        getLog(){
            let requestParams = {}
            requestParams._index = this.page._index
            requestParams._size = this.page._size
            if(this.form.userName){
                requestParams.userName = this.form.userName
            }
            if(this.form.date){
                requestParams.startDate = this.form.date[0]
                requestParams.endDate = this.form.date[1]
            }
            this.$https({
                method:'get',
                url: 'sysLog/OperationLog',
                authType: this.backToken,
            },requestParams).then(res=>{
                if(res.status != 200){
                    this.getResWithOutData()
                }else{
                    if(res.data.resultCode == 200){
                        this.list = res.data.data.records
                        this.page._size = res.data.data.size
                        this.page.total = res.data.data.total
                    }else{
                       this.getResWithOutData()
                    }
                }
            }).catch(err=>{
                console.log(err)
            })
        },
        // 页面返回值为空
        getResWithOutData(){
            this.list = []
            this.page = {
                    _index:1,
                    _size:10,
                    total:0
                }
        },
        // 翻页
        handleChangeCurrent(val){
            this.page._index = val
            this.getLog()
        }
    },
    watch:{
       
xulili's avatar
xulili committed
136 137 138 139 140 141
    }
}
</script>
<style lang="less" scoped>

</style>