<template>
  <d2-container>
    <div class="d2-table-view-full" style="overflow: hidden">
      <div class="d2-table-view-header">
        <el-form label-width="70px" labelPosition="center" size="small" :inline="true" :model="filter" @keyup.enter.native="handleList" class="demo-form-inline">
          <el-form-item label="设备号">
            <el-input v-model="filter.eqpNo" placeholder="设备号" clearable/>
          </el-form-item>
          <el-form-item label="状态">
            <el-select style="width: 178px" value="filter.status" v-model="filter.status">
              <el-option label="全部" :value="null"/>
              <el-option label="增加" value="1"/>
              <el-option label="删除" value="0"/>
            </el-select>
          </el-form-item>
          <el-form-item label="下载">
            <el-select style="width: 178px" value="filter.isDownload" v-model="filter.isDownload">
              <el-option label="全部" :value="null"/>
              <el-option label="已下载" value="1"/>
              <el-option label="未下载" value="0"/>
            </el-select>
          </el-form-item>
          <el-form-item label="学校代码">
            <el-input v-model="filter.orgCode" placeholder="学校代码" clearable/>
          </el-form-item>
          <el-form-item label="版本">
            <el-input v-model="filter.version" placeholder="版本" clearable/>
          </el-form-item>
          <!-- <el-form-item label="最高版本">
            <el-input v-model="filter.maxVersion" placeholder="最高版本"/>
          </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="operVisible = !operVisible" size="small" icon="el-icon-plus" slot="headerButton">新增</el-button>
					 <el-button  :disabled="isDisabled"  size="small" @click="onMutilDelClick()">批量删除</el-button>
				</div>
        <d2-crud
                title="企业组列表"
                ref="d2Crud"
                :loading="loading"
                :columns="columns"
                :data="data"
                :options="tableOptions"
                :rowHandle="rowHandle"
                @edit="handleRowEdit"
                @delete="handleRowRemove"
								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="70%"
						:close-on-click-modal="false">
      <div class="double-tree">
        <div>
          <div>选择设备</div>
        <el-tree :data="equTree"
                 default-expand-all
                 :props="defaultProps"
                 node-key="id"
                 ref="equTree"
								 :check-strictly="true"
				 style="height: 400px;overflow: auto;padding: 20px"
                 show-checkbox>
									<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 == 'equi'">
											<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>
          <div>选择学校</div>
        <el-tree :data="orgTree"
				 style="height: 400px;overflow: auto;padding: 20px"
				 default-expand-all
                 :props="defaultProps"
                 node-key="id"
				 check-strictly
                 ref="orgTree"
                 show-checkbox>
								 			<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 == 'JG001'">
								 						<i class="fa fa-building"></i>
								 						<span>&nbsp;{{node.label}}</span>
								 					</div>
													<div v-if="data.alias == 'JG002'">
														<i class="fa fa-building"></i>
														<span>&nbsp;{{node.label}}</span>
													</div>
								 		</span>
								 </el-tree>
        </div>
      </div>

      <span slot="footer" class="dialog-footer">
    <zl-button @click="operInstance()"/> 
  </span>
    </el-dialog>

  </d2-container>
</template>

<script>
  import { EnterpriseList,EnterpriseSave,EnterpriseDelete,EquipmentTree,OrgTree } from '../../../api/cost/enterprise'
  import { tableOptions } from '../../../assets/options'

  export default {
    name: 'attendance-enterprise',
    data () {
      return {
				isDisabled:false,
				func:{
					select:false,
					add:false,
					delete:false
				},
        loading: false,
        operVisible:false,
        diaLogName:'新增',
        tableOptions,
        currentPage:1,
        equTree:[],
        orgTree:[],
        form:{
          eqpId:'',
          orgId:''
        },
				selection:[],
				enterpriseId:[],
        filter: {
          eqpNo: '',
          status: null,
          isDownload: null,
          orgCode: '',
          version: '',
         // maxVersion: '',
          pageSize: 10,
          pageNum: 1
        },
        pagination: {
          total: 0
        },
        columns: [
          {
            title: '设备号',
            key: 'eqpNo',
            minWidth: '90'
          },
          {
            title: '学校代码',
            key: 'orgCode',
            minWidth: '90'
          },
          {
            title: '学校名称',
            key: 'orgNm',
            minWidth: '100'
          },
          {
            title: '版本',
            key: 'version',
            minWidth: '90',
          },
          {
            title: '状态',
            key: 'status',
            minWidth: '90',
						formatter (row, column, cellValue, index) {
						 if (cellValue === '1') {
						   return '增加'
						 } else if(cellValue === '0'){
						   return '删除'
						 }
						}
          },
          {
            title: '下载',
            key: 'isDownload',
            minWidth: '90',
            formatter (row, column, cellValue, index) {
              if (cellValue === '1') {
                return '已下载'
              } else if(cellValue === '0'){
                return '未下载'
              }
            }
          },
        ],
        rowHandle: {
          columnHeader: '操作',
          minWidth: '120',
          align:'center',
          custom: [
            // {
            //   text: '编辑',
            //   type: 'primary',
            //   size: 'small',
            //   emit: 'edit'
            // },
            {
              text: '删除',
              type: 'danger',
              size: 'small',
              emit: 'delete'
            }
          ],

        },
        defaultProps: {
          children: 'children',
          label: 'name'
        },
        data: []
      }
    },
    methods: {
      handleList (val) {
         if(val){this.filter.pageNum=1
        this.currentPage = 1}
      this.loading = true
        EnterpriseList(this.filter).then(res => {
          this.loading = false
          this.data = res.pageList.list
          this.pagination.total = res.pageList.total
        }).catch(err => {
          this.loading = false
        })
      },
      operInstance () {
        // console.log(this.$refs.equTree.getCheckedKeys())
        // console.log(this.$refs.orgTree.getCheckedKeys())
        let temp = this.$refs.equTree.getCheckedKeys()
        let arr = []
        temp.forEach((item,index)=>{
					console.log(item)
          /* if (item.length === 16) { */
            arr.push(item)
        /*  } */
        })
        this.form.eqpId = arr.map(item => item).join(',')

        this.form.orgId = this.$refs.orgTree.getCheckedKeys().map(item => item).join(',')
				if(this.form.orgId === '' || this.form.eqpId === ''){
					this.$message({
					  message: '请选择设备与学校',
					  type: 'error'
					})
					return false
				}
        EnterpriseSave (this.form).then(res=>{
          this.operVisible = false
          this.$message({
            message: '新增成功',
            type: 'success'
          })
          this.handleList()
        })
      },
      handleRowEdit ({index, row}) {
        this.isEdit = true
        this.diaLogName = '编辑'
        this.form = row
        this.form.workOrgName = row.workOrgName
        this.operVisible = true
      },
      handleRowRemove ({index, row}) {
       if(row.status==="0"){
         this.$message({
           message: '已删除',
           type: 'warning'
         })
         return
       }
        this.detele(row.enterpriseId)
      },
			handleSelectionChange (selection) {
			  this.selection = selection
			},
			 onMutilDelClick(){
				 	this.isDisabled = true
				 setTimeout(() => {
				   this.isDisabled = false
				 }, 2000)
			  if(!this.selection.length){
			    this.$message({
			      message: '请选择记录',
			      type: 'success'
			    })
					return false
			  } 
				this.enterpriseId =[]
				 this.selection.forEach((item,index)=>{
				 this.enterpriseId.push(item.enterpriseId)
			 })
			 this.enterpriseId=this.enterpriseId.join(",")
			 this.detele(this.enterpriseId)
			},
      detele(enterpriseId){
				this.$confirm(`确定要删除吗?`, '确认操作', {
				  confirmButtonText: '确定',
				  cancelButtonText: '放弃',
				  type: 'warning'
				}).then(() => {
				  EnterpriseDelete({
				    enterpriseId
				  }).then(res=>{
				    this.$message({
				      message: '删除成功',
				      type: 'success'
				    })
				    this.handleList()
				  })
				})
			},
      handleCurrentChange (val) {
        this.filter.pageNum = val
        this.handleList()
      },
			handleSizeChange (val) {
			this.filter.pageNum = 1
			this.filter.pageSize = val
			this.handleList()
			},
      clearForm () {
        this.$refs.equTree.setCheckedKeys([])
        this.$refs.orgTree.setCheckedKeys([])
        this.form = {
          eqpId:'',
          orgId:''
        }
      },
      EquTreeTraverse (node) {
        if (!node || !node.children) {return}
        if (node.alias === 'equi') {
          node.disabled = false
        } else {
          node.disabled = true
        }
        node.children.forEach((item) => {
          this.EquTreeTraverse(item)
        })
      },
	  OrgTreeTraverse (node) {
        if (!node || !node.children) {return}
        if (node.alias === 'fix02' || node.alias === 'top' ) {
          node.disabled = false
        } else {
          node.disabled = true
        }
        node.children.forEach((item) => {
          this.EquTreeTraverse(item)
        })
	  },
		 /* getFunction () {
		  this.$GetFunction({
		    menuUrl:this.$route.path
		  }).then(res=>{
		    res.data.forEach(item=>{
		      if (item.functionType === 'add') {
		        if (item.remarks === 'true') {
		          this.func.add = true
		        } else {
		          this.func.add = false
		        }
		      } else if(item.functionType === 'select') {
		        if (item.remarks === 'true') {
		          this.func.select = true
		        } else {
		          this.func.select = false
		        }
		      } else if(item.functionType === 'delete') {
		        if (item.remarks === 'true') {
		          this.$set(this.rowHandle,'custom',[
		            {
		              text: '删除',
		              type: 'danger',
		              size: 'small',
		              emit: 'delete'
		            }
		          ])
		        }
		      }
		    })
		  })
		} */
    },
    mounted () {
			//this.getFunction()
			this.filter.pageSize = this.tableOptions.pageList[0]
      this.tableOptions = this.$calcTableHeight(tableOptions,30)
      this.handleList()
      EquipmentTree().then(res=>{
        this.equTree = JSON.parse(res.msgDat)
        this.EquTreeTraverse(this.equTree[0])
      })
      
      OrgTree({
        isCompany: 0
      }).then(res=>{
        this.orgTree = JSON.parse(res.msgDat)
		// this.OrgTreeTraverse (this.orgTree[0])
      })
    }
  }
</script>
