<style lang="scss">
    .xjjl{
        .el-dialog{
            left: 50px;
        }
    }
</style>
<template>
    <section>
        <p>公司管理  >  公司列表</p>
        <div class="filter">
            <el-form label-width="70px" :inline="true" size="small" label-position="left">
                <el-form-item label="企业名称">
                        <el-input clearable placeholder="请输入企业名称" v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="企业区域">
                        <el-select clearable v-model="form.area" placeholder="请选择">
                            <el-option v-for="(item,index) in area" :key="index" :label="item" :value="item"></el-option>
                        </el-select>
                </el-form-item>
                <el-form-item label="企业类型">
                        <el-select clearable v-model="form.category" placeholder="请选择">
                            <el-option v-for="(item,index) in category" :key="index" :label="item" :value="item"></el-option>
                        </el-select>
                </el-form-item>
                <el-form-item>
                       <el-button @click="form.page=1,getData()" type="primary" icon="el-icon-search">搜索</el-button>
                       <el-button v-if='utype!=2&&utype!=1' icon="el-icon-plus" @click="$router.push({path:'/company/add'})"  type="primary">创建公司</el-button>
                </el-form-item>
            </el-form>
        </div>


        <el-table
                class="table"
                :data="list" height="64vh"
                border  v-loading="loading"
                default-expand-all row-key="id"
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
                style="width: 100%">
                <!-- <el-table-column
                type="selection" fixed="left"
                width="40">
                </el-table-column> -->
                <el-table-column
                prop="name"  width="300"
                label="公司名称">
                </el-table-column>
                <el-table-column
                prop="username"  width="300"
                label="账号">
                </el-table-column>
                <el-table-column
                prop="area" 
                label="区域">
                </el-table-column>
                <el-table-column
                prop="parent_name" 
                label="上级单位">
                </el-table-column>
                <el-table-column
                prop="category" 
                label="企业类型">
                </el-table-column>
                <el-table-column
                prop="remark" width="70px"
                label="状态">
                <template slot-scope="scope">
                    <el-tag v-if='scope.row.is_active' type="success">启用</el-tag>
                    <el-tag v-else type="danger">停用</el-tag>
                </template>
                </el-table-column>
                <el-table-column
                prop="ctime"  width="200"
                label="时间">
                </el-table-column>
                <el-table-column fixed="right"
                prop="zip"  width="160"
                label="操作">
                <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" content="查看巡检记录" placement="top-start">
                        <el-button icon="el-icon-document" size="mini" @click="prview(scope.row.id)"  type="success"></el-button>
                    </el-tooltip>
                    <el-tooltip class="item" effect="dark" content="查看" placement="top-start">
                        <el-button icon="el-icon-view" size="mini" @click="detail(scope.row.id)"  type="success"></el-button>
                    </el-tooltip>
                    <el-tooltip class="item" effect="dark" content="编辑" placement="top-start">
                        <el-button icon="el-icon-edit" @click="$router.push({path:'/company/add',query:{id:scope.row.id}})" size="mini" type="warning"></el-button>
                    </el-tooltip>
                    <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
                        <el-button icon="el-icon-delete" @click="del(scope.row.id)" size="mini"  type="danger"></el-button>
                    </el-tooltip>
                </template>
                </el-table-column>
        </el-table>
        <Page  ref="pageButton" :current='form.page' :page_size='form.page_size' :total='total' @pageChange='gopage'/>
        <el-dialog class="xjjl" title="巡检记录" :visible.sync="dialogFormVisible1" width="75%" :close-on-click-modal='false' :close-on-press-escape='false'>
            <el-button @click="download" type="primary" size="mini" icon="el-icon-download">导出巡检记录</el-button>
            <br><br>
            <el-table
                    class="table"
                    :data="data" height="400px"
                    border  @selection-change="handleSelectionChange"
                    style="width: 100%">
                    <el-table-column
                    type="selection" fixed="left"
                    width="40">
                    </el-table-column>
                    <el-table-column
                    prop="enterprise_name" 
                    label="公司名称">
                    </el-table-column>
                    <el-table-column
                    prop="name" 
                    label="任务名称">
                    </el-table-column>
                    <el-table-column
                    prop="content" 
                    label="任务状态">
                    <template slot-scope="scope">
                        <span v-if="scope.row.task_status==-1">过期未巡检</span>
                        <span v-if="scope.row.task_status==0">待巡检</span>
                        <span v-if="scope.row.task_status==1">无异常</span>
                        <span v-if="scope.row.task_status==2">待审核</span>
                        <span v-if="scope.row.task_status==3">审核中</span>
                        <span v-if="scope.row.task_status==4">整改中</span>
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="report_person_name" 
                    label="上报人">
                    </el-table-column>
                    <el-table-column
                    prop="ctime"  
                    label="上报时间">
                    <!-- <template>
                        <el-tag type="success">启用</el-tag>
                    </template> -->
                    </el-table-column>
                    <el-table-column fixed="right"
                    prop="zip"  width="100"
                    label="操作">
                    <template slot-scope="scope">
                        <el-button icon="el-icon-view" @click="open(scope.row)" size="mini"  type="success">查看</el-button>
                        <!-- <el-button icon="el-icon-delete" @click="del(scope.row.id)" size="mini"  type="danger">删除</el-button> -->
                    </template>
                    </el-table-column>
            </el-table>
            <Page  ref="pageButton1" :current='form1.page' :page_size='form1.page_size' :total='total1' @pageChange='gopage1'/>
        </el-dialog>
        <el-dialog title="" :visible.sync="dialogFormVisible" width="500px" :close-on-click-modal='false' :close-on-press-escape='false'>
            <el-form  label-width="100px">
                <el-form-item label="任务名称">
                    {{message.name}}
                </el-form-item>
                <el-form-item label="任务状态">
                    <span v-if="message.task_status==-1">过期未巡检</span>
                    <span v-if="message.task_status==0">待巡检</span>
                    <span v-if="message.task_status==1">无异常</span>
                    <span v-if="message.task_status==2">待审核</span>
                    <span v-if="message.task_status==3">审核中</span>
                    <span v-if="message.task_status==4">整改中</span>
                </el-form-item>
                <el-form-item label="上报人">
                    {{message.report_person_name}}                
                </el-form-item>
                <el-form-item label="上报时间">
                    {{message.ctime}}
                </el-form-item>
                <el-form-item label="图片">
                    <img style="margin:0 3px;" width="80px" height="80px" v-for="item in message.imgs" :key='item' :src="item" alt="">
                </el-form-item>
                <el-form-item label="视频">
                    <video :poster="message.videos_faceimg" width="300px" height="150px" controls :src="message.videos"></video>
                </el-form-item>
            </el-form>
        </el-dialog>
    </section>
</template>
<script>
import Page from '../../components/Page';
export default {
  components:{
        Page
  },
  data(){
    return{
      form:{name:'',page:1,page_size:20},
      form1:{page:1,page_size:20},
      message:{send_type:1},
      activeName:"1",
      dialogFormVisible1:false,
      dialogFormVisible:false,
      total:1,
      total1:1,
      data:[],
      list:[{name:'2333'}],
      loading:false,
      category:[],
      area:[],
      utype:0,
      multipleSelection:[]
    }
  },
  methods:{
        gopage(size){
            if(size){
                this.form.page_size=size
            }
            this.form.page=this.$refs.pageButton.page
            this.getData()
        },
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        gopage1(size){
            if(size){
                this.form1.page_size=size
            }
            this.form1.page=this.$refs.pageButton1.page
            this.getJl()
        },
        open(data) {
            this.dialogFormVisible=true;
            this.message={...data}
        },
        download(){
            let array=this.multipleSelection,ids=[];
            for(let i=0;i<array.length;i++){
                ids.push(array[i].id)
            }
            ids=ids.join(',')
            this.$api.downloadMon({ids:ids}).then(res=>{
                        var elink = document.createElement('a');
                        let blob=new Blob([res.data], {type: 'application/vnd.ms-excel'});
                        let objUrl=URL.createObjectURL(blob);
                        console.log(res.headers['content-disposition'])
                        let file_name=res.headers['content-disposition'].split('=')[1];
                        elink.download = file_name;
                        elink.style.display = 'none';                
                        elink.href = objUrl;
                        document.body.appendChild(elink);
                        elink.click();
                        document.body.removeChild(elink);     
            })
        },
        prview(id){
            this.form1.enterprise_id=id;
            this.getJl();
            this.dialogFormVisible1=true
        },
        getJl(){
            var parm=this.form1;
            this.$api.getMonitjobList(parm).then(res=>{
                this.data=res.data.data.list
                this.total1=res.data.data.total
                
            })
        },
        detail(id){
            this.$router.push({ path: '/company/detail', query: {  id: id,page:this.form.page,page_size:this.form.page_size  } });
        },
        getData(){
            var parm=this.form;        
            this.loading=true
            this.$api.getEnterpriseList(parm).then(res=>{
                this.list=res.data.data.list;
                // list.forEach(item => {
                //     if(item.children.length>0){
                //         item.hasChildren=true
                //     }else{
                //         item.hasChildren=false
                //     }
                // });
                this.total=res.data.data.total
                this.loading=false
                this.area=this.store.area;
                this.category=this.store.categorys;
            })
        },
        del(id){
                this.$confirm('确定删除吗', '提示', {
                        type: 'warning'
                    }).then(() => {
                    this.$api.deleteEnterprise({id:id}).then((res)=>{
                            this.$message({
                                message: '删除成功',
                                type: 'success'
                            })
                            this.getData()
                    })
                })
        },
        permission(name){
			let permissions=this.info.permissions||[];
			let list=[];
			for(let i=0;i<permissions.length;i++){
				list.push(permissions[i].name)
			}
			if(list.indexOf(name)<0){
				return false;
			}else{
				return true;
			}	
		},
  },
  created(){
      let page = this.$route.query.page,page_size = this.$route.query.page_size;
        if(page){
            this.form.page = Number(page);
            this.form.page_size = Number(page_size);
        }
      this.getData()
      this.utype=localStorage.getItem('utype')
  }
}
</script>
