<template>
  <d2-container>
	<div v-if="isExpend" class="d2-fl d2-tree-view" >
		<el-tree :data="treeData"
				 default-expand-all
				 :props="defaultProps"
				 ref="treeData"
				 @node-click="handleNodeClick"
		>
									<span class="icon-tree" slot-scope="{ node, data }">
										<div v-if="data.alias == 'top'">
											<i class="fa fa-university"></i>
											<span>&nbsp;{{node.label}}</span>
										</div>
										<div v-if="data.alias == 'fix02'">
											<i class="fa fa-building"></i>
											<span>&nbsp;{{node.label}}</span>
										</div>
										<div v-if="data.alias == 'face'">
											<i class="fa fa-users"></i>
											<span>&nbsp;{{node.label}}</span>
										</div>
										<!-- <div v-if="data.alias == 'equi'">
                                            <i class="fa fa-cogs"></i>
                                            <span>&nbsp;{{node.label}}</span>
                                        </div> -->
								</span>
		</el-tree>	</div>
	<div @click="isExpend = !isExpend" :class="[{'angle-view':isExpend},{'angle-view-none':!isExpend}]">
	  <i :class="['fa', {'fa-angle-left':isExpend},{'fa-angle-right':!isExpend}]"></i>
	</div>
	<div :class="[{'d2-fl':isExpend},{'d2-table-view':isExpend},{'d2-table-view-full':!isExpend}]" style="overflow: hidden">
		
	  <div class="d2-table-view-header">
		<el-form size="small" :inline="true" :model="filter" @keyup.enter.native="handleList" class="demo-form-inline" labelPosition="right">
		  <el-form-item label="设备编号">
			<el-input v-model.trim="filter.readerCode" placeholder="设备编号" clearable/>
		  </el-form-item>
		  <el-form-item label="设备名称">
			<el-input v-model.trim="filter.readerName" placeholder="设备名称" clearable/>
		  </el-form-item>
		  <el-form-item>
				
			<el-button type="primary" @click="handleList('1')">查询</el-button>
			
		  </el-form-item>
		</el-form>
	  </div>
	  <div class="d2-table-view-content">
			 <div class="d2-table-view-handle">
				 
				 <!--<el-button  @click="" size="small" type="success"  >导出</el-button>-->
				 
				 <el-button @click="operVisible = !operVisible" size="small" icon="el-icon-plus" slot="headerButton" :disabled="falg">新增</el-button>
				  <el-button size="small" @click="onMutilDelClick()">批量删除</el-button>
			 </div>
		<d2-crud
				title="设备信息列表"
				ref="d2Crud"
				:options="tableOptions"
				:loading="loading"
				:columns="columns"
				:data="data"
				:formRules="formRules"
				@setting="handleRowSetting"
				@edit="handleRowEdit"
				@tongbu="handleRowTongbu"
				:rowHandle="rowHandle"
				selection-row
				@selection-change="handleSelectionChange"> 
				</d2-crud>
	  </div>
	  <div class="d2-table-view-footer">
		<el-pagination
						@current-change="handleCurrentChange"
						@size-change="handleSizeChange"
						:current-page.sync="currentPage"
						:page-size="tableOptions.pageList[0]"
						:page-sizes="tableOptions.pageList"
						layout="total,sizes, prev, pager, next,jumper"
						:total="pagination.total">
		</el-pagination>
	  </div>
	</div>
	
	
	<!-- 编辑,新增 -->
	<el-dialog
			:title="diaLogName"
			:visible.sync="operVisible"
			@close="clearForm"
			width="50%"
			:close-on-click-modal="false">
		<el-form ref="form" :model="form" label-width="110px" labelPosition="right"  :rules="formRules" >
		<el-row :gutter="20">
			
			<el-col :span="12">
				
				<el-form-item label="设备编号" prop="readerCode">
					<el-input v-model.trim="form.readerCode"/>
				</el-form-item>
				
				<el-form-item label="设备名称" prop="readerName">
					<el-input v-model.trim="form.readerName"/>
				</el-form-item>
				
				<!--<el-form-item label="设备序列号" prop="serialno">-->
					<!--<el-input v-model.trim="form.serialno"/>-->
				<!--</el-form-item>-->
				<!-- 区域树 -->
				<el-form-item label="所属区域" prop="resName">
					<!--<area-tree :str="form.eqpNm" v-model.trim="form.resId" ref="mtTree"  />-->
					<el-input  v-model.trim="form.resName" disabled/>
				</el-form-item>
				<el-form-item label="进出方向" prop="outOrIn">
					<el-select v-model.trim="form.outOrIn" placeholder="请选择">
						<el-option label="出口" value="0"></el-option>
						<el-option label="进口" value="1"></el-option>
						<el-option label="其他" value="2"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="设备IP" prop="ip">
					<el-input v-model.trim="form.ip"/>
				</el-form-item>
				<el-form-item label="网关" prop="ggp">
					<el-input v-model.trim="form.ggp"/>
				</el-form-item>
				<!--<el-form-item label="原密码"  prop="usedPassword">&lt;!&ndash; prop="usedPassword" &ndash;&gt;-->
					<!--<el-input type="password" v-model.trim="form.usedPassword"/>-->
				<!--</el-form-item>-->
				<!--<el-form-item label="新密码" prop="newPassword">&lt;!&ndash; prop="newPassword" &ndash;&gt;-->
					<!--<el-input type="password" v-model.trim="form.newPassword"/>-->
				<!--</el-form-item>-->
					<!---->
				<!--<el-form-item label="确认密码" prop="password">&lt;!&ndash; prop="password" :disabled="form.readerId? false:true" &ndash;&gt;-->
					<!--<el-input type="password" v-model.trim="form.password"/>-->
				<!--</el-form-item>-->
				
				
			</el-col>
			<!--<el-col :span="24">-->
				<!--<el-form-item label="识别回调URL" prop="shUrl">-->
					<!--<el-input v-model.trim="form.shUrl"/>-->
				<!--</el-form-item>-->
			<!--</el-col>-->
			
			<!--<el-col :span="24">-->
				<!--<el-form-item label="设备心跳URL" prop="sxUrl">-->
					<!--<el-input v-model.trim="form.sxUrl"/>-->
				<!--</el-form-item>-->
			<!--</el-col>-->
			<!---->
			<!--<el-col :span="24">-->
				<!--<el-form-item label="拍照注册URL" prop="pzUrl">-->
					<!--<el-input v-model.trim="form.pzUrl"/>-->
				<!--</el-form-item>-->
			<!--</el-col>-->
		</el-row>
		</el-form>
		
		<span slot="footer" class="dialog-footer">
			<zl-button :loading="mtLoading" @click="operInstance('form')"/> 
		</span>
		
	</el-dialog>

	<!-- 修改配置 -->
	<el-dialog
	          :title="diaLogName1"
	          :visible.sync="operVisible1"
	          @close="clearForm1"
	          width="50%"
	          :close-on-click-modal="false"
	  >
	      <el-form ref="form1" :model="form1" label-width="130px" labelPosition="left" :rules="settingRules">
	          <el-row :gutter="15">
				  
				   <h4>识别成功参数</h4>

	              <el-col :span="24">
	                  <el-form-item label="语音播报模式" prop="voiceMode">
						  <el-row>
							  <el-col :span="6">
								  <el-radio v-model.trim="form1.voiceMode" label="1" @change="changeClick">不需要语音播报</el-radio>
							  </el-col>
							  <el-col :span="4">
								  <el-radio v-model.trim="form1.voiceMode" label="2" @change="changeClick">播报名字</el-radio>
							  </el-col>
							  <el-col :span="14">
								  <el-row>
									  <el-col :span="6">
										  <el-radio v-model.trim="form1.voiceMode" label="100" @change="changeClick">自定义</el-radio>
									  </el-col>
									  <el-col :span="18">
										  <el-input v-model.trim="form1.voiceModeTag" style="height: 30px;"  :disabled="isEdit"></el-input>
									  </el-col>
								  </el-row>
							  </el-col>
						  </el-row>
	                  </el-form-item>
	              </el-col>
				  <el-col :span="24">
					  <el-form-item label="陌生人语音播报模式" label-width="160px" prop="ttsModStranger">
						  <el-radio v-model.trim="form1.ttsModStranger" label="1" @change="changeClick5">不播报语音</el-radio>
						  <el-radio v-model.trim="form1.ttsModStranger" label="2" @change="changeClick5">语音播报 “陌生人警报”</el-radio>
						  <br>
						  <el-radio v-model.trim="form1.ttsModStranger" label="100" @change="changeClick5">自定义</el-radio>
						  <el-input v-model.trim="form1.ttsModStrangerTag" style="width: 180px;height: 30px;"  :disabled="isEdit5"></el-input>
					  </el-form-item>
				  </el-col>
				  <el-col :span="24">
				      <el-form-item label="屏幕显示模式" prop="osdMode">
				              <el-radio v-model.trim="form1.osdMode" label="1" @change="changeClick1">显示名字</el-radio>
				              <el-radio v-model.trim="form1.osdMode" label="100" @change="changeClick1">自定义</el-radio>
						  <el-input v-model.trim="form1.osdModeTag" style="width: 180px;height: 30px;"  :disabled="isEdit1"></el-input>
					  </el-form-item>
				  </el-col>
				  
				  <el-col :span="24">
				      <el-form-item label="串口输出模式" prop="serialMode">
				              <el-radio v-model.trim="form1.serialMode" label="1" @change="changeClick2">开门</el-radio>
				              <el-radio v-model.trim="form1.serialMode" label="2" @change="changeClick2">不输出</el-radio>
				              <el-radio v-model.trim="form1.serialMode" label="3" @change="changeClick2">输出人员id</el-radio>
							  <el-radio v-model.trim="form1.serialMode" label="4" @change="changeClick2">输出卡号</el-radio>
						  <br>
							  <el-radio v-model.trim="form1.serialMode" label="100" @change="changeClick2">自定义</el-radio>
						  <el-input v-model.trim="form1.serialModeTag" style="width: 180px;height: 30px;" placeholder="" :disabled="isEdit2"></el-input>
					  </el-form-item>
				  </el-col>
				  
				  <el-col :span="24">
				      <el-form-item label="韦根类型" prop="wiegandType">
				              <!--<el-radio v-model.trim="form1.wiegandType" label="0">不需要韦根</el-radio>-->
				              <el-radio v-model.trim="form1.wiegandType" label="#WG{id}#">韦根26</el-radio>
				              <el-radio v-model.trim="form1.wiegandType" label="#34WG{id}#">韦根34</el-radio>
				      </el-form-item>
				  </el-col>
				  
				  <!--<el-col :span="24">-->
				      <!--<el-form-item label="继电器开关量">-->
				              <!--<el-radio v-model.trim="form1.relaySwitch" label="1">输出</el-radio>-->
				              <!--<el-radio v-model.trim="form1.relaySwitch" label="0">不输出</el-radio>-->
				      <!--</el-form-item>-->
				  <!--</el-col>-->
	              
	              <h4>陌生人参数</h4>
				  
				  <el-col :span="24">
				      <el-form-item label="陌生人开关" prop="strangerWitch">
				              <el-radio v-model.trim="form1.strangerWitch" label="1">不识别陌生人</el-radio>
				              <el-radio v-model.trim="form1.strangerWitch" label="2">识别陌生人</el-radio>
				      </el-form-item>
				  </el-col>
				  
				  <h4>识别参数</h4>
				  
				  <el-col :span="24">
				      <el-form-item label="识别距离" prop="readRange">
						<el-radio v-model.trim="form1.readRange" label="0">无限制(默认)</el-radio>
				        <el-radio v-model.trim="form1.readRange" label="1">0.5米以内</el-radio>
						<el-radio v-model.trim="form1.readRange" label="2">1米以内</el-radio>
						<el-radio v-model.trim="form1.readRange" label="3">1.5米以内</el-radio>
						<el-radio v-model.trim="form1.readRange" label="4">2米以内</el-radio>
						<el-radio v-model.trim="form1.readRange" label="5">3米以内</el-radio>
						<el-radio v-model.trim="form1.readRange" label="6">4米以内</el-radio>
					  </el-form-item>
				  </el-col>
	              <el-col :span="24">
	              	<el-form-item label="识别（分数）阈值" prop="faceVpt" label-width="135px">
						<!--<span class="tip" style="color: black"></span>-->
	              		<el-input v-model.trim="form1.faceVpt" maxlength="30" style="width: 50%" type="number" min="0"/>
						<span class="tip">请输入值为50-100的整数，分数越高，识别准确率越高，但识别速度会变慢.</span>
					</el-form-item>
	              </el-col>
				  <el-col :span="24">
					  <el-form-item label="多个人脸检测设置" prop="moreFace" label-width="135px">
						  <el-select v-model.trim="form1.moreFace" placeholder="请选择" style="width: 50%;">
							  <el-option label="检测多个人脸并进行识别" value="1"></el-option>
							  <el-option label="检测多个人脸中最大的人脸并识别" value="2"></el-option>
						  </el-select>
					  </el-form-item>
				  </el-col>
				  <el-col :span="24">
				  <el-form-item label="识别等级" prop="discernLevel">
					  <el-select v-model.trim="form1.discernLevel" placeholder="请选择" style="width: 50%;">
						  <el-option label=" 等级1:快速识别,不能拒绝照片" value="1"></el-option>
						  <el-option label="等级2:能拒绝部分照片" value="2"></el-option>
						  <el-option label="等级3:能拒绝照片和视频" value="3"></el-option>
					  </el-select>
					  <span class="tip">
							等级1:快速识别,不能拒绝照片;
							等级2:能拒绝部分照片;
							等级3:能拒绝照片和视频;
						</span>
				  </el-form-item>
			  </el-col>
				  <el-col :span="24">
					  <el-form-item label="时间窗" prop="timeWindow">
						  <el-input v-model.trim="form1.timeWindow" style="width: 50%" type="number" min="0" placeholder="0"/>秒
						  <!--<el-time-picker-->
								  <!--arrow-control-->
								  <!--v-model="form1.timeWindow"-->
								  <!--value-format="mm:ss"-->
						  <!--&gt;-->
						  <!--</el-time-picker>-->
					  </el-form-item>
				  </el-col>
				  <el-col :span="24">
				  	<el-form-item label="继电器控制时间" prop="relayTime">
				  		<el-input v-model.trim="form1.relayTime" style="width: 100px" type="number"  min="500" />毫秒
				  	</el-form-item>
				  </el-col>
				  <h4>固定显示参数</h4>
				  <el-col :span="24">
				  	<el-form-item label="屏幕方向" prop="screenDirection">
				  		<el-select v-model.trim="form1.screenDirection" placeholder="请选择" style="width: 50%;">
				  			<el-option label="横屏" value="1"></el-option>
				  			<el-option label="竖屏" value="2"></el-option>
				  		</el-select>
				  	</el-form-item>
				  </el-col>
				  <el-col :span="24">
					  <el-form-item label="设置公司名称" prop="configName">
						  <el-input v-model.trim="form1.configName" maxlength="15" style="width: 50%" />
					  </el-form-item>
				  </el-col>
				  <el-col :span="24">
				  	<el-form-item label="标语" prop="slogan">
				  		<el-input v-model.trim="form1.slogan" maxlength="30" style="width: 50%" />
				  	</el-form-item>
				  </el-col>
				  
				  <el-col :span="24">
				  	<el-form-item label="简介" prop="remark">
				  		<el-input type="textarea" v-model.trim="form1.remark" maxlength="255" style="width: 50%" placeholder="请输入简介(仅限255个字)" rows="5" />
						<span class="tip">该字段只支持M7xx系列设备外接大屏时显示</span>
					</el-form-item>
				  </el-col>
				  
				  <el-col :span="24">
				           <el-form-item label="设备素材LOGO" prop="eqLogo">
				               <img  :src="form1.eqLogo" style="max-width: 178px" class="avatar">
				               <label for="upload-input">
								   <span class="buttonBox">选择</span>
							   </label>
				               <input
				                   id="upload-input"
				                   style="display: none"
				                   type="file"
				                   multiple
				                   ref="upload"
				                   name="img"
				                   @change="upload($event)"
				           >
				  <span class="buttonBox" @click="removeClick">清除</span>
				           </el-form-item>
				       </el-col>
				  
	          </el-row>
	      </el-form>
	      <span slot="footer" class="dialog-footer">
	  <zl-button :loading="staLoading" @click="operInstance1()">保存</zl-button>
	</span>
	  </el-dialog>
  </d2-container>
</template>

<script>
	
	import {faceTreeNode, TreeNodeMt,getFaceReaderList, deleteFaceList, getFaceReaderById,saveOrUpdataFaceReader,getRowSetting,saveOrUpdataSetting,saveOrUpdataConnect,tongbuDevice} from '../../../api/face/device'
  import { tableOptions } from '../../../assets/options'
  import {uploadFaceImg} from '@/api/face/faceManage'
  
  // import areaTree from './components/areaTree'

  export default {
    name: '',
	components:{
		// areaTree
	},
    data () {
      let checkUrl = (rule, value, callback) => {
        if(!value){
          return callback(new Error('不能为空'))
        }
        let reg=/(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/;
        if (!reg.test(value)) {
          return callback(new Error('请输入正确的格式'))
        } else {
          callback ()
        }
      }
      let checkIP = (rule, value, callback) => {
        let reg = /^(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9])\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9])$/
        if (!reg.test(value)) {
          return callback(new Error('请输入正确的格式'))
        } else {
          callback ()
        }
      }
      let checkCardId = (rule, value, callback) => {
        if(!value){
          return callback(new Error('不能为空'))
        }
        let reg = /^[0-9a-zA-Z]+$/
        if (!reg.test(value)) {
          return callback(new Error('请输入数字或英文'))
        } else {
          callback ()
        }
      }
      return {
        staLoading:false,
		  isEdit:true,//输入框是否禁用
		isEdit1:true,
        isEdit2:true,
        isEdit5:true,
		  time:"",
				mtLoading:false,
				falg:true,
				leaveReaderId:[],//删除
        leaveReaderIds:"",
				selection:[],
				disabled:false,
				diaLogName:'新增',
				diaLogName1:'修改配置',
				operVisible:false,//编辑,新增弹框
				operVisible1:false,//修改配置弹框
        isExpend:true,
        currentPage:1,
        tableOptions,
        loading: false,
        filter: {
          pageSize: 10,
          pageNum: 1,
		  readerCode: '',
		  readerName: '',
		  resId: '',
          resName:""
        },
		//新增,编辑
		form:{
					readerId:'',//新增不传值编辑传
					readerCode:'',//编号
					readerName:'',//名称
					// serialno:'',//序列号
					resId:'',//所属区域id
          resName:"",
					// usedPassword:'',//原密码
					// newPassword:'',//新密码
					// password:'',//确认密码

					// shUrl:'',//识别回调url
					// sxUrl:'',//设备心跳url
					// pzUrl:'',//拍照注册URL
          outOrIn:"",
          ip:'',
          ggp:""
		},
				
				//修改配置
						form1:{
                          configId:"",
                          ttsModStranger:"1",
                          ttsModStrangerTag:"",
                          moreFace:'1',
                          voiceModeTag:"",
                          osdModeTag:"",
                          serialModeTag:"",
                          readerId:"",
                          voiceMode:"1",
                          osdMode:"1",
                          serialMode:"1",
                          wiegandType:"",
                          // relaySwitch:"",
                          strangerWitch:"1",
                          readRange:"0",
                          faceVpt:"70",
                          // witnessThanVpt:"",
                          // personCardVpt:"",
                          timeWindow:"0",
                          discernLevel:"1",
                          relayTime:"500",
                          // faceDiscern:"",
                          // cardDiscern:"",
                          // outHardwarePortType:"",
                          // outHardwareType:"",
                          // faceCard:"",
                          // persoCard:"",
                          // screenView:"",
                          screenDirection:"",
                          // epNmView:"",
                          // ipView:"",
                          // serialnoView:"",
                          // persoView:"",
                          slogan:"",
                          configName:"",
                          remark:"",
                          eqLogo:"",
						},
				
        pagination: {
          total: 0
        },
        columns: [
          {
            title: '序号',
            key: 'merchantCode',
            minWidth: '50',
			formatter (row, column, cellValue, index) {
			 return index+1
			}
          },
          {
            title: '设备编号',
            key: 'readerCode',
            minWidth: '180'
          },
		  {
			title: '设备名称',
			key: 'readerName',
			minWidth: '180'
		  },
          {
            title: '所属区域',
            key: 'resName',
            minWidth: '180'
          },
          {
            title: '序列号',
            key: 'serialno',
            minWidth: '180',
            showOverflowTooltip: true
          },
		  // {
			// title: '设备版本',
			// key: 'version',
			// minWidth: '180'
		  // },
		  {
			title: '在线',
			key: 'online',
			minWidth: '90',
            formatter (row, column, cellValue, index) {
              if(cellValue==='0'){
                return '离线'
              }else if(cellValue==='1'){
                return '在线'
              }
            }
		  },
          {
            title: '进出方向',
            key: 'outOrIn',
            minWidth: '90',
            formatter (row, column, cellValue, index) {
              if(cellValue==='0'){
                return '出口'
              }else if(cellValue==='1'){
                return '进口'
			  } else{
                return '其他'
              }
            }
          },
          {
            title: '激活状态',
            key: 'flag',
            minWidth: '90',
            formatter (row, column, cellValue, index) {
            if(cellValue==='1'){
              return '激活'
			}else{
              return '未激活'
			}
            }
          },
        ],
        rowHandle: {
          columnHeader: '操作',
          minWidth: '400',
          align: 'center',
          custom: [
          	{
           		text: '编辑',
           		type: 'primary',
           		size: 'small',
           		emit: 'edit'
           	},
			{
				text: '修改配置',
				type: 'primary',
				size: 'small',
				emit: 'setting'
			},
			// {
			// 	text: '设备重置',
			// 	type: 'primary',
			// 	size: 'small',
			// 	emit: 'resetting'
			// },
           	{
           		text: '设备同步',
           		type: 'primary',
           		size: 'small',
           		emit: 'tongbu'
           	}
           ],

        },
        formRules: {
			readerCode: [{validator:checkCardId,required: true,trigger: 'blur'}],
			readerName: [{required: true, message: '请输入设备名称', trigger: 'blur'}],
			// serialno: [{validator:checkCardId,required: true, trigger: 'blur'}],
			// resId: [{required: true, message: '所属区域', trigger: 'blur'}],
			// usedPassword:  [{ required: true, message: '请输入原密码', trigger: 'blur' },{ min: 6, max: 20, message: '请输入长度为6到20的字母或数字', trigger: 'blur' }],
			// newPassword:  [{ required: true, message: '请输入新密码', trigger: 'blur' },{ min: 6, max: 20, message: '请输入长度为6到20的字母或数字', trigger: 'blur' }],
			// password:  [{ required: true, message: '确认密码', trigger: 'blur' },{ min: 6, max: 20, message: '请输入长度为6到20的字母或数字', trigger: 'blur' }],
          outOrIn: [{required: true, message: '请选择进出方向', trigger: 'blur'}],
          ip: [{validator:checkIP,required: true,trigger: 'blur'}],
          ggp: [{validator:checkIP,required: true,trigger: 'blur'}],
			// shUrl: [{validator:checkUrl,required: true,trigger: 'blur'}],
			// sxUrl: [{validator:checkUrl,required: true, trigger: 'blur'}],
			// pzUrl: [{validator:checkUrl,required: true,trigger: 'blur'}],

        },
        settingRules:{
          voiceMode: [{required: true, message: '请选择语音播报模式',trigger: 'blur'}],
          ttsModStranger: [{required: true, message: '请选择陌生人语音播报模式',trigger: 'blur'}],
          osdMode: [{required: true, message: '请选择屏幕显示模式',trigger: 'blur'}],
          serialMode: [{required: true, message: '请选择串口输出模式',trigger: 'blur'}],
          wiegandType: [{required: true, message: '请选择韦根类型',trigger: 'blur'}],
          strangerWitch: [{required: true, message: '请选择陌生人开关',trigger: 'blur'}],
          readRange: [{required: true, message: '请输入识别距离',trigger: 'blur'}],
          faceVpt: [{required: true, message: '请输入识别（分数）阈值',trigger: 'blur'}],
          moreFace: [{required: true, message: '请选择多个人脸检测设置',trigger: 'blur'}],
          discernLevel: [{required: true, message: '请选择识别等级',trigger: 'blur'}],
          timeWindow: [{required: true, message: '请输入时间窗',trigger: 'blur'}],
          relayTime: [{required: true, message: '请输入继电器控制时间',trigger: 'blur'}],
          screenDirection: [{required: true, message: '请选择屏幕方向',trigger: 'blur'}],
          slogan: [{required: true, message: '请输入标语',trigger: 'blur'}],
          configName:[{required: true, message: '请输入公司名称',trigger: 'blur'}],
          remark: [{required: true, message: '请输入简介',trigger: 'blur'}],
          eqLogo: [{required: true, message: '请选择图片',trigger: 'blur'}],
		},
        currentParentId:'',
	     	treeData:[],
        defaultProps: {
          children: 'children',
          label: 'name'
        },
        data: []
      }
    },
    methods: {
		//输入框是否禁用
		changeClick(){
		  if(this.form1.voiceMode=="1"){
		   this.form1.voiceModeTag=""
		    this.isEdit=true
		  }else if(this.form1.voiceMode=="2"){
		    this.form1.voiceModeTag=""
		    this.isEdit=true
		  }else{
		    this.isEdit=false
		  }
		},
      changeClick5(){
        if(this.form1.ttsModStranger =="1"){
          this.form1.ttsModStrangerTag=""
          this.isEdit5=true
        }else if(this.form1.ttsModStranger =="2"){
          this.form1.ttsModStrangerTag=""
          this.isEdit5=true
        }else{
          this.isEdit5=false
        }
      },
      changeClick1(){
        if(this.form1.osdMode=="1"){
          this.form1.osdModeTag=""
          this.isEdit1=true
        }else{
          this.isEdit1=false
        }
      },
      changeClick2(){
        if(this.form1.serialMode=="1"){
          this.form1.serialModeTag=""
          this.isEdit2=true
        }else if(this.form1.serialMode=="2"){
          this.form1.serialModeTag=""
          this.isEdit2=true
        }else if(this.form1.serialMode=="3"){
          this.form1.serialModeTag=""
          this.isEdit2=true
        }
        else if(this.form1.serialMode=="4"){
          this.form1.serialModeTag=""
          this.isEdit2=true
        }
        else{
          this.isEdit2=false
        }
      },
		//时间
		// dateChange (val) {
         //  if(val == null){
         //    this.form.bgTm = ''
         //    this.form.endTm = ''
         //  }else{
         //    this.form.bgTm = val[0]
         //    this.form.endTm = val[1]
         //  }
		// },
		
		//图片上传
		upload(e) {
		  this.files = [];
		  let files = e.target.files;
		  let formData = new FormData();
          if(files[0].size>500000){
            this.$message({
              message: '请上传大小不超过500kb的图片',
              type: 'warning'
            })
            return false
          }
		  for (let k in files) {
		    if (files.hasOwnProperty(k)) {
		      formData.append("file", files[k]);
		    }
		  }
		  uploadFaceImg(formData).then(res => {
		    this.$message({
		      message: "上传成功",
		      type: "success"
		    });
		    // this.form1.eqLogo = res
			this.$set(this.form1,'eqLogo',res)
		  });
		
		  this.$refs.upload.value = null;
		},
		
		//图片删除
		removeClick(){
          this.$set(this.form1,'eqLogo','')
		},
		
		
      handleNodeClick(data) {
				if(data.alias ==='fix02'){
					this.filter.resId = data.id
                    this.falg = false
                    this.form.resName = data.name
                    this.form.resId = data.id
				}else{
					this.falg = true
					this.filter.resId = ''
				}
        this.handleList()
      },
      handleTreeNode () {
        TreeNodeMt({}).then(res=>{
          this.treeData = JSON.parse(res.msgDat)
          /* this.filter.parentId = this.treeData[0].id
          this.form.parentId = this.treeData[0].id
					this.form.parentName = this.treeData[0].name */
        })
				 this.handleList()
      },
	  
	  

      handleCurrentChange (val) {
        this.filter.pageNum = val
        this.handleList()
      },
			handleSizeChange (val) {
			this.filter.pageNum = 1
			this.filter.pageSize = val
			this.handleList()
			},
			
			
	  
	  
	  //修改配置的确定按
	  operInstance1() {
	  					this.$refs['form1'].validate((valid) => {
	  						if (valid) {
	  						if(this.form1.voiceMode=="100"){
	  						  if(!this.form1.voiceModeTag){
                                this.$message({
                                  message:'请输入自定义选项内容',
                                  type: 'warning'
                                })
                                return
							  }else{
                                this.form1.voiceModeTag='{name}'+this.form1.voiceModeTag
							  }
							}
                              if(this.form1.osdMode=="100"){
	  						  if(!this.form1.osdModeTag){
                                this.$message({
                                  message:'请输入自定义选项内容',
                                  type: 'warning'
                                })
                                return
							  }else{
                                this.form1.osdModeTag='{name}'+this.form1.osdModeTag
							  }
                              }
                              if(this.form1.serialMode=="100"){
	  						  if(this.form1.serialModeTag){
                                let re = new RegExp("^[a-zA-Z]+$");
                                if (!re.test(this.form1.serialModeTag)) {
                                  this.$message({
                                    message:'串口模式自定义内容请输入英文',
                                    type: 'warning'
                                  })
								  return
                                } else {
                                }
							  }else{
                                this.$message({
                                  message:'请输入自定义选项内容',
                                  type: 'warning'
                                })
                                return
							  }
                                this.form1.serialModeTag='{idcardNum}'+this.form1.serialModeTag
                              }
                           if(parseInt(this.form1.relayTime)<=100){
                             this.$message({
                               message:'继电器控制时间不能小于100毫秒',
                               type: 'warning'
                             })
							 return
						   }
	  							this.mtLoading=true
	  							 saveOrUpdataSetting(this.form1).then(res => {
	  								this.mtLoading=false
	  								this.$message({
	  									message:'修改配置成功',
	  									type: 'success'
	  								})
	  								this.operVisible1=false
	  								this.handleTreeNode()
	  							}).catch(err => {
								   this.mtLoading=false
								  })

	  						}
	  						})
							
	  },
			//设备同步
      handleRowTongbu ({row, index}) {
       if(row.flag!=="1"||row.online!=="1"){
         this.$message({
           message:'激活状态并且在线才能同步',
           type: 'warning'
         })
         return
	   }
			 this.$confirm('同步会将云端已有的人员、照片信息同步到设备上，设备与云端数据保持一致。是否进行同步？', '提示', {
			 	confirmButtonText: '确定',
			 	cancelButtonText: '取消',
			 	type: 'error'
			 }).then(() => {
               tongbuDevice({
                 readerId:row.readerId
               }).then(res => {
                 this.$message({
                   message: '操作成功',
                   type: 'success'
                 })
                 this.handleTreeNode()
               })
             })
			 
      },
			
			// //重置
			// handleRowReset ({row, index}) {
			//
			//  this.$confirm('重置会将设备内存储的人员、照片信息删除，数据可通过同步恢复；设备配置会恢复出厂设置。是否进行重置？若点击后设备始终未出现二维码界面，可进行物理重置（长按网口旁RESET独立按键8秒以上后松开)', '提示', {
			//  	confirmButtonText: '确定',
			//  	cancelButtonText: '取消',
			//  	type: 'error'
			//  }).then(() => {
			//  	/* deleteList({
			//  		orgId
			//  	}).then(res=>{
			//  		this.$message({
			//  			message: '删除成功',
			//  			type: 'success'
			//  		}) */
			//  		this.handleTreeNode()
			//  	})
			//
			// },

			//修改配置回显
			handleRowSetting ({row, index}) {
	    if(row.flag!=='1'){
          this.$message({
            message: '激活状态才能修改配置！',
            type: 'warning'
          })
		  return
		}
		  getRowSetting({readerId:row.readerId}).then((res)=>{
		    if(!res.faceConfig.configId){}else{
              this.form1=res.faceConfig
			 if(res.faceConfig.osdModeTag) {
                this.form1.osdModeTag = res.faceConfig.osdModeTag.substring(6)
              }
              if(res.faceConfig.voiceModeTag) {
                this.form1.voiceModeTag = res.faceConfig.voiceModeTag.substring(6)
              }
              if(res.faceConfig.serialModeTag) {
                this.form1.serialModeTag = res.faceConfig.serialModeTag.substring(11)
              }
			}
			if(this.form1.voiceMode=='100'){
              this.isEdit=false
			}
            if(this.form1.osdMode=='100'){
              this.isEdit1=false
            }
            if(this.form1.serialMode=='100'){
              this.isEdit2=false
            //   // this.$set(this.form1,'serialModeTag',this.form1.serialMode)
            //   // this.form1.serialModeTag=this.form1.serialMode
            }
            if(this.form1.ttsModStranger=='100'){
              this.isEdit5=false
            }
            this.form1.readerId=row.readerId
            this.operVisible1=true
		  })
			},
			
			
			
			
			handleSelectionChange (selection) {
			  this.selection = selection
			},
			
			
			
			
			//编辑,新增-
			clearForm(){
        if (this.$refs['form']!==undefined) {
          this.$refs['form'].resetFields()
        }
        this.mtLoading=false
        this.disabled=false
        this.diaLogName='新增'
        this.form={
          readerId:'',
          readerCode:'',
          readerName:'',
          // serialno:'',
          resId:'',
          // usedPassword:'',
          // newPassword:'',
          // password:'',

          ip:'',
          ipMask:'',
          ggp:'',
          dns:'',
          dhcp:'',

          // shUrl:'',
          // sxUrl:'',
          // pzUrl:'',

        }
      },

      clearForm1(){
        if (this.$refs['form1']!==undefined) {
          this.$refs['form1'].resetFields()
        }
        this.form1={
          ttsModStranger:"1",
            ttsModStrangerTag:"",
            moreFace:'1',
            voiceModeTag:"",
            osdModeTag:"",
            serialModeTag:"",
            readerId:"",
            voiceMode:"1",
            osdMode:"1",
            serialMode:"1",
            wiegandType:"",
            // relaySwitch:"",
            strangerWitch:"1",
            readRange:"0",
            faceVpt:"70",
            // witnessThanVpt:"",
            // personCardVpt:"",
            timeWindow:"0",
            discernLevel:"",
            relayTime:"500",
            // faceDiscern:"",
            // cardDiscern:"",
            // outHardwarePortType:"",
            // outHardwareType:"",
            // faceCard:"",
            // persoCard:"",
            // screenView:"",
            screenDirection:"",
            // epNmView:"",
            // ipView:"",
            // serialnoView:"",
            // persoView:"",
            slogan:"",
          configName:"",
            remark:"",
            eqLogo:"",
        }
      },
			//编辑-
			handleRowEdit ({row, index}) {
							this.diaLogName='编辑'
							let readerId = row.readerId
							getFaceReaderById({readerId}).then(res => {
								 this.form = res.faceReader
								this.operVisible=true
							})

			},
			//新增,编辑的确定按钮-
			operInstance(formName) {
								this.$refs[formName].validate((valid) => {
									if (valid) {
										this.mtLoading=true
						  saveOrUpdataFaceReader(this.form).then(res => {
						  	this.mtLoading=false
						  	this.$message({
						  		message:this.form.readerId === '' ?'新增成功':'编辑成功',
						  		type: 'success'
						  	})
						  	this.operVisible=false
						  	this.handleTreeNode()
						  }).catch(err => {
						     this.mtLoading=false
						    })
						  
									}
									})
			},
			
			
			//批量删除-
			 onMutilDelClick(){
			  if(!this.selection.length){
			    this.$message({
			      message: '请选择记录',
			      type: 'warning'
			    })
				return
			  }
               this.leaveReaderId=[]
				//  this.selection.forEach((item,index)=>{
				//     if(item.online==='1'){
              //         this.$message({
              //           message: '只能删除离线状态记录',
              //           type: 'warning'
              //         })
             //
				// 	}
              //      this.leaveReaderId.push(item.readerId)
			 // })
for(let i=0; i<this.selection.length; i++) {
			    let item=this.selection[i]
  this.leaveReaderId.push(item.readerId)
  if (item.online === '1') {
    this.$message({
      message: '只能删除离线状态记录',
      type: 'warning'
    })
	return
  }
}
			 this.leaveReaderIds=this.leaveReaderId.join(",")
			 this.delete({readerIds:this.leaveReaderIds})
			},

			
			//批量删除-
			delete(orgId){
				this.$confirm('确定删除选中记录嘛?删除会重置关于设备所有信息', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'error'
				}).then(() => {
					deleteFaceList(orgId).then(res=>{
						this.$message({
							message: '删除成功',
							type: 'success'
						})
						this.handleTreeNode()
					})

				})
			},
			
			
			//列表-
			handleList (val) {
			  if(val){
						this.filter.pageNum=1
						this.currentPage = 1
					}
					this.loading = true
					getFaceReaderList(this.filter).then(res => {
					  this.loading = false
					  this.data = res.page.list
                      this.tableOptions.rowClassName = function ({row, rowIndex}) {
                        if (row.online === '1') {
                          return 'success-row'
                        } else {
                          return ''
                        }
                      }
					  this.pagination.total = res.page.total
					}).catch(err => {
					  this.loading = false
					})
					
			},
			
			
			
    },
    mounted () {
      this.tableOptions.stripe=false
      this.tableOptions = this.$calcTableHeight(tableOptions,40)
      this.filter.pageSize = this.tableOptions.pageList[0]
      this.handleTreeNode()
    }
  }
</script>
<style>
    h4{
        margin: 0;
		padding: 0;
		clear: both;
		color:#6096CE
    }
	.tip{
		display: block;
		color: lightgrey;
		height: 30px;
		line-height: 30px;
		overflow: hidden;
	}
	.avatar {
	    /*width: 178px;*/
	    /*height: 178px;*/
	    display: block;
	}
	.buttonBox{
		display: inline-block;
		width: 40px;
		height: 30px;
		line-height: 30px;
		border: 1px solid #ccc;
		text-align: center;
		margin-right: 10px;
	}
	.el-table .success-row {
		background: #90EE90;
	}
</style>