<template>
    <div class='tableZh'>
        <div class='tab-top'>
            <el-input
                clearable
                @keyup.enter.native='dsfjc'
                @blur='dsfjc'
                placeholder='搜索任务名称'
                size='small'
                prefix-icon='el-icon-search'
                v-model='searVal'
                style='width:200px;margin-right:12px'
            ></el-input>
            <Select
                width='200'
                tipPlace='top'
                caption='状态：'
                size='small'
                v-model='ztdsf'
                v-if='status2.length>0'
                :selectdata='status2'
                :placeholder='"请选择"'
                @change='dsfjc'
                style='margin-right:12px'
            ></Select>
            <!-- <Select
                @change='dsfjc'
                width='200'
                tipPlace='top'
                caption='部门：'
                v-if='zgbm.length>0'
                size='small'
                style='margin-right:12px'
                v-model='bmdsf'
                :selectdata='zgbm'
                :placeholder='"请选择"'
            ></Select>-->
            <el-input
                clearable
                @keyup.enter.native='dsfjc'
                @blur='dsfjc'
                placeholder='搜索部门'
                size='small'
                prefix-icon='el-icon-search'
                v-model='bmdsf'
                style='width:200px;margin-right:12px'
            ></el-input>
            <el-input
                clearable
                @keyup.enter.native='dsfjc'
                @blur='dsfjc'
                placeholder='搜索检测结论'
                size='small'
                prefix-icon='el-icon-search'
                v-model='jcjldsf'
                style='width:200px'
            ></el-input>
            <!-- <Select
                @change='dsfjc'
                width='200'
                tipPlace='top'
                caption='检测结论：'
                size='small'
                v-if='conclusion.length>0'
                :selectdata='conclusion'
                :placeholder='"请选择"'
                v-model='jcjldsf'
            ></Select>-->
        </div>
        <el-table
            row-key='id'
            border
            v-loading='loading'
            :header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
            :data='dsfTable'
            style='width: 100%;margin-top:12px'
            @row-click='innerTable'
        >
            <el-table-column label='序号' type='index' width='60' :index='indexMethod'></el-table-column>
            <el-table-column prop :show-overflow-tooltip='true' sortable label='任务名称' min-width='400'>
                <template slot-scope='{row}'>{{row.description||'--'}}</template>
            </el-table-column>
            <el-table-column prop label='状态' :show-overflow-tooltip='true' width='80'>
                <template slot-scope='{row}'>{{row.status||'--'}}</template>
            </el-table-column>
            <el-table-column prop label='部门' width='260' :show-overflow-tooltip='true'>
                <template slot-scope='{row}'>{{row.zgbm||'--'}}</template>
            </el-table-column>
            <el-table-column prop :show-overflow-tooltip='true' label='检测结论' min-width='400'>
                <template slot-scope='{row}'>{{row.conclusion||'--'}}</template>
            </el-table-column>
        </el-table>
        <div class='foot'>
            <el-pagination
                background
                layout='prev, pager, next'
                :total='total'
                :page-size='size'
                @prev-click='pageChanged'
                @next-click='pageChanged'
                @current-change='pageChanged'
            ></el-pagination>
        </div>
    </div>
</template>
<script>
// import Select from '@/components/Select/Select.vue'
import { Select } from 'meri-design'
import { queryDsfrw } from '@/api/other.js'
import { querySelect } from '@/api/public.js'

export default {
    data() {
        return {
            loading: true,
            searVal: '',
            dsfTable: [],
            total: 0,
            page: 1,
            size: 10,
            status2: [],
            zgbm: [],
            conclusion: [],
            ztdsf: '全部',
            bmdsf: '',
            jcjldsf: '',
            allArr: [
                {
                    id: '全部',
                    name: '全部',
                },
            ],
        }
    },
    components: { Select },
    methods: {
        indexMethod(index) {
            return (this.page - 1) * this.size + index + 1
        },
        // 第三方
        /**
         *@param { boolean } resetPage 是否重置页码,分页时不重置页码, 下拉菜单会传数组,下方判断时用 !== false
         */
        dsfjc(resetPage) {
            // console.log(resetPage)
            if (resetPage !== false) {
                this.page = 1
                this.total = 0
            }
            let getParams = {
                plazaId: this.$store.state.plazaId,
                page: this.page,
                size: this.size,
            }
            if (this.searVal) {
                getParams.keyword = `${this.searVal}:description`
            }
            if (this.ztdsf && this.ztdsf != '全部') {
                getParams.status = this.ztdsf
            }
            if (this.bmdsf) {
                getParams.keyword = `${this.bmdsf}:zgbm`
            }
            if (this.jcjldsf) {
                getParams.keyword = `${this.jcjldsf}:conclusion`
            }
            queryDsfrw({ getParams }).then((res) => {
                if (res.result == 'success') {
                    this.loading = false
                    this.total = res.count
                    this.dsfTable = res.data ? res.data : []
                }
                //console.log('第三方', res)
            })
        },
        pageChanged(page) {
            this.page = page
            this.dsfjc(false)
        },
        //第三方任务
        innerTable(row) {
            if (row.id) {
                window.open(`http://gcgl.wanda.cn/maximo/ui/?event=loadapp&value=DSF_GZGL&uniqueid=${row.id}`)
            }
        },
        changeSelect() {
            this.department = []
            let postParams = [
                {
                    columnName: { status: 'status', zgbm: 'zgbm', conclusion: 'conclusion' },
                    tableName: 'sms_dsfrw',
                },
            ]
            let data = {
                plazaId: this.$store.state.plazaId,
            }
            querySelect({ data, postParams }).then((res) => {
                //console.log('下拉框', res)
                let status2 = [],
                    zgbm = [],
                    conclusion = []
                status2 = res.data.data.sms_dsfrw.status ? res.data.data.sms_dsfrw.status : []
                zgbm = res.data.data.sms_dsfrw.zgbm ? res.data.data.sms_dsfrw.zgbm : []
                conclusion = res.data.data.sms_dsfrw.conclusion ? res.data.data.sms_dsfrw.conclusion : []
                if (status2.length > 0) {
                    status2.forEach((el) => {
                        el.id = el.key
                        el.name = el.value
                    })
                    this.status2 = this.allArr.concat(status2)
                }
                if (zgbm.length > 0) {
                    zgbm.forEach((el) => {
                        let obj = {
                            id: el.key,
                            name: el.value,
                        }
                        this.zgbm.push(obj)
                    })
                }
                if (conclusion.length > 0) {
                    conclusion.forEach((el) => {
                        let obj = {
                            id: el.key,
                            name: el.value,
                        }
                        this.conclusion.push(obj)
                    })
                }
            })
        },
    },
    mounted() {
        this.changeSelect()
    },
}
</script>
<style lang="less">
.tableZh {
    .foot {
        height: 32px;
        display: flex;
        justify-content: flex-end;
        margin-top: 28px;
    }
    /deep/.el-table td {
        cursor: pointer;
    }
}
</style>