<template>
	<el-card class="logCard" shadow="never" header="操作日志">
		<el-main class="nopadding">
			<div class="searchMain">
				<scSearch ref="scSearch" :searchList="searchList" @fetchSelectData="getSelectData"></scSearch>

				<div class="searchItem searchBtn">
					<el-button :size="size" type="primary" icon="el-icon-search" @click="upSearch">查询</el-button>
					<el-button :size="size" type="info" icon="el-icon-RefreshRight" @click="reset">重置</el-button>
				</div>
			</div>
			<scTable ref="table" :apiObj="list.apiObj" :column="list.column" row-key="id" stripe :size="size" @row-click="rowClick">
				<sc-table-column label="序号" type="index"></sc-table-column>
			</scTable>
		</el-main>
	</el-card>

	<el-drawer v-model="infoDrawer" title="日志详情" :size="600" destroy-on-close>
		<info ref="info"></info>
	</el-drawer>
</template>

<script>
	import info from '../../setting/log/info'
	export default {
		components:{
			info
		},
		data() {
			return {
				size:"small",
				list:{
					apiObj: this.$API.user.log,
					column: [],
				},
				infoDrawer: false,

				searchList:[
					{name:'操作日期',type:'date',code:'created_at'},
					{name:'操作功能',type:'multiple',code:'type', data:[], placeholder:"请选择功能",show:true},
					{name:'关键字',type:'text',code:['remark','ip','location','creator_name'],keyword:true,show:true},
				],
				params: {},
			}
		},
		mounted() {

		},
		methods:{
			getSelectData(item){
				let {data,params} = item;
				this.params = params;
				if(data.code == "type"){
					this.getTypeList(data,params)
				}
			},
			async getTypeList(data,params) {
				const res = await this.$API.system.log.operation.post(params);
				if(res.code == 200){
					res.data.forEach(item=>{
						item.id = item.type;
						item.label = item.log_title;
					})
					this.searchList.forEach(item=>{
						if(item.code == data.code){
							item.data = res.data;
						}
					})
				}
			},

			upSearch(){
				this.$refs.table.upData(this.params);
			},
			reset(){
				this.params = {};
				this.$refs.scSearch.reload();
				this.$refs.table.reload();
			},
			rowClick(row){
				this.infoDrawer = true
				this.$nextTick(() => {
					this.$refs.info.setData(row)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.logCard :deep(.el-card__body){padding: 0 !important;}
</style>
