<template>
	<div class="app-container">
		<el-form :model="queryParams" ref="queryForm" size="small"  :inline="true" v-show="showSearch" label-width="100px">
			<el-form-item label="企业名称" prop="qyname">
				<el-input v-model="queryParams.qyname" placeholder="请输入企业名称" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="用户名" prop="username">
				<el-input v-model="queryParams.username" placeholder="请输入用户名" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			<el-form-item label="负责人姓名" prop="name">
				<el-input v-model="queryParams.name" placeholder="请输入负责人姓名" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			
			
			<el-form-item>
				<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> 
				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
			</el-form-item>
		</el-form> 

		<el-table  v-loading="loading" :data="list" > 
			<el-table-column label="序号" align="center" type="index" :index="indexMethod">
			</el-table-column> 
			<el-table-column label="企业名称" width="300" align="center" prop="qyname" />
			<el-table-column label="用户名" align="center"  prop="username" /> 
			<el-table-column label="负责人"  align="center" prop="name" /> 
			<el-table-column label="手机号码" align="center"  prop="photo" />
			<el-table-column label="电子邮箱" align="center" prop="lxryx" />
			<el-table-column label="营业执照" align="center"  prop="oldshtime" >
				<template slot-scope="scope">
					<ImagePreview :src="scope.row.yyzz"></ImagePreview>
				</template>
			</el-table-column>
			<el-table-column label="不良记录次数" align="center"  prop="count" />
			<el-table-column label="有不良记录可否申请转入人员" align="center" width="200" prop="oldshtime" >
				<template slot-scope="scope">
					<div style="display: flex;align-items: center;justify-content: center;">
						<span v-if="scope.row.wgsz == 1">
							[可转入]
						</span>
						<span v-else>
							[<span style="color:#F56C6C ;">不可转入</span>]
						</span>
						<div class="zrsz">
							[
								<span class="zrszSon" @click="settingWeigui(scope.row)">设置</span>
							] 
						</div>
					</div>
				</template>
			</el-table-column>
			<el-table-column label="设置日期" align="center" width="100" prop="wgszdate" />
			<el-table-column label="违规结束日期" align="center" width="100" prop="wgstop" />
			<!-- <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120">
				<template slot-scope="scope">
					<el-button size="mini" type="text" icon="el-icon-edit" @click="bljl(scope.row)">不良记录</el-button>
				</template>
			</el-table-column> -->
		</el-table>
		<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
	</div>
</template>

<script>
	import {
		bljlList,
		settingWg
	} from "@/api/xiehui/jlrybg/bljlqy"; 
	export default {
		name: "Qybljl",
		dicts: ['jxjy_shsftg', 'jxjy_bgsfcg'],
		data() {
			return {
				// 遮罩层
				loading: true,
				// 选中数组
				ids: [],
				// 非单个禁用
				single: true,
				// 非多个禁用
				multiple: true,
				// 显示搜索条件
				showSearch: true,
				// 总条数
				total: 0,
				// 企业变更表格数据
				list: [],
				// 弹出层标题
				title: "",
				// 是否显示弹出层
				open: false,
				// 查询参数
				queryParams: {
					pageNum: 1,
					pageSize: 10,
					name: null, 
					username: null, 
					qyname:null, 
				},
			};
		},
		created() {
			this.getList()
		},
		methods: {
			/** 查询企业变更列表 */
			getList() {
				this.loading = true;
				bljlList(this.queryParams).then(response => {
					this.list = response.rows;
					this.total = response.total;
					this.loading = false;
				});
			},
			//计算索引
			indexMethod(index) {
				return ((this.queryParams.pageNum - 1) * this.queryParams.pageSize) + (index + 1)
			},
			handleQuery(){
				this.queryParams.pageNum = 1;
				this.getList();
			},
			resetQuery(){
				this.resetForm("queryForm")
				this.handleQuery();
			},
			//设置违规转台
			settingWeigui(row){
				if(row.wgsz == 1){
					const ids = row.id || this.ids;
					this.$modal.confirm('是否设置为不可转入状态？').then(function() {
						return settingWg({qyid:row.qyid,wgsz:0});
					}).then(() => {
						this.getList();
						this.$modal.msgSuccess("设置成功");
					}).catch(() => {});
				}else{
					const ids = row.id || this.ids;
					this.$modal.confirm('是否设置为可转入状态？').then(function() {
						return settingWg({qyid:row.qyid,wgsz:1});
					}).then(() => {
						this.getList();
						this.$modal.msgSuccess("设置成功");
					}).catch(() => {});
				}
			},
			//查看不良记录
			bljl(row){
				
			}
		}
	};
</script>
<style scoped lang="scss">
	.zrsz:hover{
		cursor: pointer;
		.zrszSon{
			color:#409EFF;
			text-decoration: underline;
		}
	} 
</style>