<template>
<div class="EnseList">
    <el-row class="topBar">
        <el-col>
            <el-form :inline="true" :model="searchData" >
                <el-form-item label="" v-if ="enterpriseId=='all'" >
                    <el-select v-model="searchData.enterpriseId" placeholder="请选择公司"  >
                        <el-option
                                v-for="item in companyTableData.pageData"
                                :key="item.enterpriseId"
                                :label="item.unitName==null?'':item.unitName"
                                :value="item.enterpriseId"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="">
                    <el-input v-model="searchData.deviceName" placeholder="请输入设备名称"></el-input>
                </el-form-item>
                <el-form-item label="">
                    <el-input v-model="searchData.deviceNumber" placeholder="请输入设备号"></el-input>
                </el-form-item>
                <!--<el-form-item label="">-->
                    <!--<el-input v-model="searchData.shortNum" placeholder="请输入设备短号"></el-input>-->
                <!--</el-form-item>-->
                <el-form-item>
                    <el-button type="primary" @click="searchFun()">
                        <i class="el-icon-search"></i> 搜索
                    </el-button>
                    <el-button type="primary" @click="resetFun()">
                        <i class="el-icon-refresh"></i> 重置
                    </el-button>
                </el-form-item>
                <!--<el-form-item class="fr">-->
                    <!--<el-button plain type="primary" @click="addFun()">-->
                        <!--<i class="el-icon-plus"></i> 新增-->
                    <!--</el-button>-->
                <!--</el-form-item>-->
            </el-form>
        </el-col>
    </el-row>
    <el-table :data="tableData.pageData" stripe border style="width:100%;" :loading="loading">
        <el-table-column width="50" type="index" label="序号"></el-table-column>
		<el-table-column prop="enterpriseName" label="企业名称"></el-table-column>
        <el-input type="hidden" pro="enterpriseId"></el-input>
        <el-table-column prop="deviceName" label="设备名称"></el-table-column>
        <el-table-column prop="deviceNum" label="设备编号"></el-table-column>
        <el-table-column prop="category" label="检测介质"></el-table-column>
        <el-table-column prop="concentration" label="浓度"></el-table-column>
        <el-table-column prop="unit" label="单位"></el-table-column>
        <el-table-column prop="status" label="状态">
            <template scope="scope">
                <p v-if="scope.row.status=='1'"> 正常</p>
                <p v-if="scope.row.status=='2'">错误</p>
                <p v-if="scope.row.status=='3'">传感器故障</p>
                <p v-if="scope.row.status=='4'"> 报警</p>
                <p v-if="scope.row.status=='5'">低报</p>
                <p v-if="scope.row.status=='6'">高报</p>
                <p v-if="scope.row.status=='7'"> 通信故障</p>
                <p v-if="scope.row.status=='8'">超量程</p>
                <p v-if="scope.row.status=='9'"> 离线</p>
                <p v-if="scope.row.status=='10'">电量低</p>
                <p v-if="scope.row.status=='13'">无此节点</p>
                <p v-if="scope.row.status=='14'"> 低电压</p>
                <p v-if="scope.row.status=='15'">故障</p>
                <p v-if="scope.row.status=='16'">报警联动</p>
            </template>
        </el-table-column>
        <el-table-column prop="createTime" label="检测时间"></el-table-column>
        <!-- <el-table-column prop="stockNum" label="库存数量"></el-table-column> -->
        <!-- <el-table-column prop="dangerGrade" label="危险等级"></el-table-column> -->
        <!--<el-table-column label="操作" width="220" align="center">-->
            <!--<template slot-scope="scope">-->
                <!--<el-button @click="editFun(scope.row)" size="small">编辑</el-button>-->
                <!--<el-button type="danger" @click="delFun(scope.row)" size="small">删除</el-button>-->
            <!--</template>-->
        <!--</el-table-column>-->
    </el-table>
    <el-pagination background layout="total,sizes, prev, pager, next, jumper" :total="tableData.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="PAGE.page" :page-size="PAGE.size"></el-pagination>
</div>
</template>

<script lang="ts">
import {
    Component,
    Vue,
    Provide
} from "vue-property-decorator";
import METHOD from "@/utils/methods";
@Component({
    components: {

    }
})
export default class SafetyDeviceMg extends Vue {
    @Provide() tableData: Object = {
        pageData: [],
        total: 0
    };
    @Provide() companyTableData: Object = {
        pageData: [],
        total: 0
    };
    @Provide() PAGE: any = {
        page: 1,
        size: 10
    };
    @Provide() PAGE2: any = {
        page: 1,
        size: 100
    };
    @Provide() searchData: any = {
        deviceName: "",
        deviceNumber: "",
        shortNum: "",
        dataType: '',
        enterpriseId:''
    };
    @Provide() loading: Boolean = false;
    //编辑组件
    @Provide() dialogVisible: Boolean = false;
    @Provide() dialogTit: String = "新增";
    @Provide() formData: any = {
        dataType: "",
        enterpriseId: ""
    };
    @Provide() zjKey: any = 0;
    @Provide() enterpriseId: string = "all";
    @Provide() dataType: string = "";

    getTableData() {
        let that = this,
            param = Object.assign({}, that.PAGE, that.searchData);
		//that.enterpriseId="all";
        that.loading = true;
        METHOD.axiosPost(
            that,
            `/safetyDeviceInfo/getDeviceSensor/${that.enterpriseId}`,
            param,
            function (res: any) {
                that.loading = false;
                if (res.code == 0) {
                    that.tableData = res.data;
                    console.log(res.data)
                }
            }
        );
    }
    getCompanyTableData() {
        let that = this,
            param = Object.assign({accountStatus:'0'}, that.PAGE2, that.searchData);
        that.loading = true;
        METHOD.axiosPost(
            that,
            `/enterpriseInfo/queryEnterpriseInfo`,
            param,
            function(res: any) {
                that.loading = false;
                if (res.code == 0) {
                    console.log(res.data)
                    that.companyTableData = res.data;
                }
            }
        );
    }
    searchFun() {
        this.PAGE = {
            page: 1,
            size: 10
        };
        this.getTableData();
    }
    resetFun() {
        this.PAGE = {
            page: 1,
            size: 10
        };
        this.searchData = {
            deviceName: "",
            deviceNumber: "",
            enterpriseName:"",
            shortNum: "",
            dataType: ''
        };
        this.getTableData();
    }
    addFun() {
        this.zjKey++;
        this.dialogVisible = true;
        //this.formData.dataType = this.searchData.dataType;
        if(METHOD.enterpriseId){
            this.formData.enterpriseId = METHOD.enterpriseId;
        }
    }
    editFun(row: any) {
        this.dialogTit = "编辑";
        this.formData = Object.assign({}, row);
        this.zjKey++;
        this.dialogVisible = true;
    }
    delFun(row: any) {
        let that = this as any;
        METHOD.deleteFun(
            this,
            `/safetyDeviceInfo/deleteSafetyDeviceInfoById/${row.id}`,
            function () {
                that.getTableData();
            }
        );
    }
    handleSizeChange(val: any) {
        this.PAGE.size = val;
        this.getTableData();
    }
    handleCurrentChange(val: any) {
        this.PAGE.page = val;
        this.getTableData();
    }
    closeDialog() {
        //关闭窗口
        this.dialogVisible = false;
        this.formData = {};
    }
    selectChange(val: any) {
        this.searchData.dataType = val;
        this.getTableData();
    }
    created() {
        this.enterpriseId = "all";
        let usd = sessionStorage.getItem("userInfo");
        if (usd) {
            if(JSON.parse(usd).accountType==2){
                this.enterpriseId = METHOD.enterpriseId;
            }
        }
        //this.enterpriseId = METHOD.enterpriseId;
        this.getTableData();
        this.getCompanyTableData();
    }
}
</script>

<style lang="scss">
@import "@/utils/public.scss";
@media screen and (max-width: 1350px) {
    main > div .el-table {
        height: calc(100% - 180px);
    }
}
</style>
