fj-dc-ui/.svn/pristine/06/063e1c220cdecfdceabb0f1805e0bb012fa9158b.svn-base

<template>
    <div style="height:100%;width:100%;" class="dctb_dxs">
        <el-container style="height:100%;width:100%;">
            <el-aside width="260px" style="border-right:2px solid #d5d5ff;float:left"
                      :style="{'max-height':testHeight+'px','height':testHeight+'px'}">
                <TreeListWithCheckBox
                        type="5"
                        :height="dxdcAsideHeight"
                        width="250"
                        @treeCheckedDataChange="treeCheckedDataChange"></TreeListWithCheckBox>
            </el-aside>
            <el-main id="dxdcListMainsk" style="padding:5px 20px;">
                <el-table
                        :data="dxsDataList"
                        style="width: 100%"
                        :height="dxdcMainHeight"
                >
                    <el-table-column
                            prop="stnm"
                            label="测站名称"
                            min-width="100">
                    </el-table-column>
                    <el-table-column
                            prop="stcd"
                            label="测站编码"
                            min-width="100">
                    </el-table-column>
                    <el-table-column
                            prop="sttpNm"
                            min-width="120"
                            label="测站类别">
                    </el-table-column>
                    <el-table-column
                            prop="stlc"
                            min-width="180"
                            label="测站地址">
                    </el-table-column>
                    <el-table-column
                            prop="allScore"
                            min-width="80"
                            label="得分合计">
                    </el-table-column>
                    <el-table-column
                            prop="inspState"
                            label="督查状态"
                            align="center"
                            min-width="130">
                        <template slot-scope="scope">
                            <span style="padding: 3px 10px;background:#F56C6C;border-radius:15px;color:rgba(255,255,255,1)" v-if="scope.row.inspState == 0">未督查</span>
                            <span style="padding: 3px 10px;background:#FBB56D;border-radius:15px;color:rgba(255,255,255,1)" v-if="scope.row.inspState == 1">督查中</span>
                            <span style="padding: 3px 10px;background:#63C25E;border-radius:15px;color:rgba(255,255,255,1)" v-if="scope.row.inspState == 2">已督查</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                            prop="maintainStatus"
                            label="测站维护管理状态"
                            align="center"
                            min-width="130">
                        <template slot-scope="scope">
                            <p style="cursor:pointer;color:#67C23A" v-if="scope.row.maintainStatus == '2' || (scope.row.maintainStatus == '1' && scope.row.inspState == '2')">已完成</p>
                            <p style="cursor:pointer;color:#67C23A" v-if="scope.row.maintainStatus == '1' && scope.row.inspState != '2'">已填报</p>
                            <p style="cursor:pointer;color:#F56C6C;" v-if="!scope.row.maintainStatus || scope.row.maintainStatus == '0'">未填报</p>
                        </template>
                    </el-table-column>
                    <el-table-column
                            prop="percentageStatus"
                            label="监测数据质量和到报率状态"
                            align="center"
                            min-width="130">
                        <template slot-scope="scope">
                            <p style="cursor:pointer;color:#67C23A" v-if="scope.row.percentageStatus == '2' || (scope.row.percentageStatus == '1' && scope.row.inspState == '2')">已完成</p>
                            <p style="cursor:pointer;color:#67C23A" v-if="scope.row.percentageStatus == '1' && scope.row.inspState != '2'">已填报</p>
                            <p style="cursor:pointer;color:#F56C6C;" v-if="!scope.row.percentageStatus || scope.row.percentageStatus == '0'">未填报</p>
                        </template>
                    </el-table-column>
                    <el-table-column
                            prop="checkComment"
                            label="检查人员评价"
                            align="center"
                            min-width="130">
                        <template slot-scope="scope">
                            <p style="cursor:pointer;color:#67C23A" v-if="scope.row.inspState == '2' && scope.row.checkComment">已完成</p>
                            <p style="cursor:pointer;color:#67C23A" v-if="scope.row.checkComment && scope.row.checkComment != '' && scope.row.inspState !== '2'">已填报</p>
                            <p style="cursor:pointer;color:#F56C6C;" v-if="!scope.row.checkComment || scope.row.checkComment == ''">未填报</p>
                        </template>
                    </el-table-column>
                    <el-table-column
                            prop="uptm"
                            label="更新时间"
                            align="center"
                            min-width="160">
                    </el-table-column>
                    <el-table-column align="center" show-overflow-tooltip label="操作" min-width="160" fixed="right">
                        <template slot-scope="scope">
                            <el-button type="success" plain @click="lookOver(scope.row)">查看</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination background :pager-count="5" :current-page="pageIndex"
                               :page-size="pageSize" :page-sizes="[10, 20, 30, 40, 50, 100]"
                               layout="sizes, total, prev, pager, next" :total="total"
                               @current-change="pageIndexChange" @size-change="handleSizeChange"
                ></el-pagination>
            </el-main>
        </el-container>
        <jichuxinxiDxs ref="dxsJcxxRef" v-if="showDxsBaseInfo" :currentDxsCode="currentGrwCode"
                       :currentObjectId="currentObjectId"></jichuxinxiDxs>

    </div>
</template>

<script>
    import request from '../../../utils/gw_ajax_request.js'
    import {dateFormat} from '../../../utils/gw_date.js'
    import provTreeList from "../../../widgets/provTreeList.vue"
    import TreeListWithCheckBox from "./treeListWithCheckBox"

    export default {
        components: {
            provTreeList: provTreeList,
            jichuxinxiDxs: resolve => {
                require(['../../../views/zongHeXinXiOl/components/popupWindow/dxs/main.vue'], resolve)
            },
            TreeListWithCheckBox

        },
        props: [],

        data() {
            return {
                treeData: [],
                dxdcMainHeight: window.innerHeight - 147,
                testHeight: window.innerHeight - 111,
                stationType: 'autoStation',
                dxsDataList: [],
                pageIndex: 1,
                pageSize: 20,
                total: 0,
                tableHeight: 0,
                currentGrwCode: '',
                currentGrwName: '',
                currentObjectId: '',
                currentObjectRgstrId: '',
                currentSttp: '',
                currentObjectInfoObject: null,
                showShuDxsTianBao: false,
                currentAdCode: '',
                currentNodeId: '',//没有初始值。
                typeDialog: false,
                staType: '',
                frequency: '',
                btnType: '',
                submitRow: null,

                showDxsBaseInfo: false,
                adCodes: [],
                dxdcAsideHeight: window.innerHeight - 180,

            };
        },
        computed: {
            persId() {
                return localStorage.getItem("userid")
                    ? localStorage.getItem("userid")
                    : "1098101939614724096";
            },
            recPersName() {
                return localStorage.getItem("account") ? localStorage.getItem("account") : ''
            }
        },
        mounted() {
            let h = document.getElementById('dxdcListMainsk').offsetHeight;
            this.tableHeight = h - 100;
            console.log('tableHeight' + this.tableHeight);
        },

        watch: {
            adCodes(n) {
                if (n.length) {
                    this.getDXSDataList();
                }
            }
        },

        methods: {
            //树节点选中或取消事件
            treeCheckedDataChange(params) {
                this.adCodes = Array.from(new Set(params.CheckedKey));
            },
            formatDate(row, column) {
                if (row.uptm) {
                    return (dateFormat(row.uptm, 'yyyy-MM-dd'));
                }
            },
            getDXSDataList() {
                let adCodes = this.adCodes.toString();
                request.post(`/dc/insp/grw/queryDetailListWithPblm`, {
                    'adCodes': adCodes,
                    'pageSize': this.pageSize,
                    'pageNum': this.pageIndex
                }).then((res) => {
                        console.log(res)
                        if (res.success) {
                            this.dxsDataList = res.data.list;
                            this.total = res.data.total;
                        }
                    }
                );
            },
            pageIndexChange(val) {
                console.log(val);
                this.pageIndex = val;
                this.getDXSDataList();
            },
            handleSizeChange(val) {
                this.pageSize = val;
                this.getDXSDataList();
            },
            formatSttp(val) {
                let sttp = val ? val.toUpperCase() : ''
                if (sttp == 'NATIONAL') {
                    return '国家级'
                } else if (sttp == 'PROVAUTO') {
                    return '省级自动站'
                } else if (sttp == 'PROVHAND') {
                    return '省级手动站'
                }
            },
            //成果查看
            lookOver(row) {
                this.currentGrwCode = row.stcd;
                this.currentObjectId = row.objId;
                this.showDxsBaseInfo = true;
                if (this.$refs['dxsJcxxRef']) {
                    this.$refs['dxsJcxxRef'].showDialog();
                }
            }
        },

    };
</script>

<style>
    .dctb_dxs .el-table .warning-row {
        background: oldlace;
    }

    .dctb_dxs .el-table .success-row {
        background: #f0f9eb;
    }
</style>