|  |  | 
 |  |  |       </el-form-item> | 
 |  |  |       <el-form-item label="是否登录成功" prop="success"> | 
 |  |  |         <el-select v-model="searchForm.success" placeholder="请选择是否登录状态" clearable @change="search"> | 
 |  |  |           <el-option value="true" label="登录成功"/> | 
 |  |  |           <el-option value="false" label="登录失败"/> | 
 |  |  |           <el-option value="true" label="登录成功" /> | 
 |  |  |           <el-option value="false" label="登录失败" /> | 
 |  |  |         </el-select> | 
 |  |  |       </el-form-item> | 
 |  |  |       <el-form-item label="登录时间" prop="loginTime"> | 
 |  |  |         <el-date-picker | 
 |  |  |         <!-- <el-date-picker | 
 |  |  |           v-model="searchDateRange" | 
 |  |  |           type="datetimerange" | 
 |  |  |           range-separator="至" | 
 |  |  | 
 |  |  |           start-placeholder="开始时间" | 
 |  |  |           end-placeholder="结束时间" | 
 |  |  |           @change="handleSearchTimeChange" | 
 |  |  |         ></el-date-picker> | 
 |  |  |         ></el-date-picker> --> | 
 |  |  |         <el-date-picker type="datetime" v-model="searchForm.startTime" value-format="yyyy-MM-dd HH:mm:ss" | 
 |  |  |           placeholder="请选择开始时间" @change="changeRadio" /> | 
 |  |  |         <el-date-picker type="datetime" v-model="searchForm.endTime" value-format="yyyy-MM-dd HH:mm:ss" | 
 |  |  |           placeholder="请选择结束时间" @change="changeRadio" /> | 
 |  |  |       </el-form-item> | 
 |  |  |       <section> | 
 |  |  |         <el-button type="primary" @click="search">搜索</el-button> | 
 |  |  | 
 |  |  |     </el-form> | 
 |  |  |     <!-- 表格和分页 --> | 
 |  |  |     <template v-slot:table-wrap> | 
 |  |  |       <el-table | 
 |  |  |         v-loading="isWorking.search" | 
 |  |  |         :data="tableData.list" | 
 |  |  |         stripe | 
 |  |  |         :default-sort="{prop: 'loginTime', order: 'descending'}" | 
 |  |  |         @sort-change="handleSortChange" | 
 |  |  |       > | 
 |  |  |       <el-table v-loading="isWorking.search" :data="tableData.list" stripe :height="tableHeightNew" | 
 |  |  |         :default-sort="{ prop: 'loginTime', order: 'descending' }" @sort-change="handleSortChange"> | 
 |  |  |         <el-table-column prop="loginUsername" label="登录用户名" min-width="100px"></el-table-column> | 
 |  |  |         <el-table-column prop="ip" label="登录IP" min-width="120px"></el-table-column> | 
 |  |  |         <el-table-column prop="location" label="登录地址" min-width="160px"></el-table-column> | 
 |  |  |         <el-table-column prop="clientInfo" label="客户端" min-width="160px"></el-table-column> | 
 |  |  |         <el-table-column prop="osInfo" label="操作系统" min-width="100px"></el-table-column> | 
 |  |  |         <el-table-column prop="platform" label="登录平台" min-width="100px"></el-table-column> | 
 |  |  |         <el-table-column prop="loginTime" label="登录时间" min-width="160px" sortable="custom" sort-by="LOGIN_TIME"></el-table-column> | 
 |  |  |         <el-table-column prop="loginTime" label="登录时间" min-width="160px" sortable="custom" | 
 |  |  |           sort-by="LOGIN_TIME"></el-table-column> | 
 |  |  |         <el-table-column prop="systemVersion" label="系统版本" min-width="100px"></el-table-column> | 
 |  |  |         <el-table-column prop="serverIp" label="服务器IP" min-width="120px"></el-table-column> | 
 |  |  |         <el-table-column prop="success" label="状态" min-width="100px"> | 
 |  |  |           <template slot-scope="{row}"> | 
 |  |  |             {{row.success | statusText}} | 
 |  |  |             {{ row.success | statusText }} | 
 |  |  |           </template> | 
 |  |  |         </el-table-column> | 
 |  |  |         <el-table-column prop="reason" label="失败原因" min-width="160px"></el-table-column> | 
 |  |  |       </el-table> | 
 |  |  |       <pagination | 
 |  |  |           @size-change="handleSizeChange" | 
 |  |  |           @current-change="handlePageChange" | 
 |  |  |           :pagination="tableData.pagination" | 
 |  |  |       ></pagination> | 
 |  |  |       <pagination @size-change="handleSizeChange" @current-change="handlePageChange" :pagination="tableData.pagination"> | 
 |  |  |       </pagination> | 
 |  |  |     </template> | 
 |  |  |   </TableLayout> | 
 |  |  | </template> | 
 |  |  | 
 |  |  |   name: 'SystemLoginLog', | 
 |  |  |   extends: BaseTable, | 
 |  |  |   components: { TableLayout, Pagination }, | 
 |  |  |   data () { | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       // 搜索时间范围 | 
 |  |  |       searchDateRange: [], | 
 |  |  | 
 |  |  |   }, | 
 |  |  |   filters: { | 
 |  |  |     // 登录状态 | 
 |  |  |     statusText (value) { | 
 |  |  |     statusText(value) { | 
 |  |  |       if (value != null && !value) { | 
 |  |  |         return '登录失败' | 
 |  |  |       } | 
 |  |  | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     reset() { | 
 |  |  |       this.searchForm = { | 
 |  |  |         loginUsername: '', | 
 |  |  |         ip: '', | 
 |  |  |         serverIp: '', | 
 |  |  |         success: '', | 
 |  |  |         startTime: null, | 
 |  |  |         endTime: null | 
 |  |  |       } | 
 |  |  |       this.search() | 
 |  |  |     }, | 
 |  |  |     changeRadio() { | 
 |  |  |  | 
 |  |  |       if (this.searchForm.startTime && this.searchForm.endTime && new Date(this.searchForm.startTime).getTime() > new Date(this.searchForm.endTime).getTime()) { | 
 |  |  |         this.$message.error('开始时间不能大于结束时间') | 
 |  |  |         this.searchForm.startTime = '' | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  |       this.search() | 
 |  |  |     }, | 
 |  |  |     // 时间搜索范围变化 | 
 |  |  |     handleSearchTimeChange (value) { | 
 |  |  |     handleSearchTimeChange(value) { | 
 |  |  |       this.searchForm.startTime = null | 
 |  |  |       this.searchForm.endTime = null | 
 |  |  |       if (value != null) { | 
 |  |  | 
 |  |  |       this.search() | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created () { | 
 |  |  |   created() { | 
 |  |  |     this.config({ | 
 |  |  |       module: '登录日志', | 
 |  |  |       api: '/system/loginLog', |