<template>
    <div class="ele-body">
        <a-card :bordered="false">
            <!-- 搜索表单 -->
            <a-form
                :model="where"
                :label-col="{ md: { span: 6 }, sm: { span: 24 } }"
                :wrapper-col="{ md: { span: 18 }, sm: { span: 24 } }"
            >
                <a-row>
                    <a-col :lg="6" :md="12" :sm="24" :xs="24">
                        <a-form-item label="测点名称:">
                            <a-select v-model:value="where.place" allowClear showSearch>
                                <a-select-option
                                    v-for="(item) in palceOptions"
                                    :key="item.value"
                                >{{ item.label }}
                                </a-select-option
                                >
                            </a-select>
                        </a-form-item>
                    </a-col>

                    <a-col :lg="6" :md="12" :sm="24" :xs="24">
                        <a-form-item label="城区">
                            <a-select v-model:value="where.area" allowClear showSearch>
                                <a-select-option
                                    v-for="(item) in areaOptions"
                                    :key="item.value"
                                >{{ item.label }}
                                </a-select-option
                                >
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :lg="6" :md="12" :sm="24" :xs="24">
                        <a-form-item class="ele-text-right" :wrapper-col="{ span: 24 }">
                            <a-space>
                                <a-button type="primary" @click="reload">查询</a-button>
                                <a-button @click="reset">重置</a-button>
                                <a-button @click="exportFile">导出Excel</a-button>
                            </a-space>
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>
            <!-- 表格 -->
            <ele-pro-table
                v-model:selection="selectionList"
                ref="table"
                row-key="zoneNoiseId"
                :datasource="url"
                :columns="columns"
                :where="where"
                :scroll="{ x: 'max-content' }"
                @done="(d) => (data = d.data)"
            >
                <template #Leq="{ text,record  }">
                    <a-tag v-if="(record.timeSlot == '昼' && text <= 68) || (record.timeSlot == '夜' && text <= 58)"
                           color="green">{{ text }}
                    </a-tag>
                    <a-tag
                        v-else-if="(record.timeSlot == '昼' && text > 68 && text <=70) || (record.timeSlot == '夜' && text > 58 && text <=60)"
                        color="blue">{{ text }}
                    </a-tag>
                    <a-tag
                        v-else-if="(record.timeSlot == '昼' && text > 70 && text <=72) || (record.timeSlot == '夜' && text > 60 && text <=62)"
                        color="red">{{ text }}
                    </a-tag>
                    <a-tag
                        v-else-if="(record.timeSlot == '昼' && text > 62 && text <=74) || (record.timeSlot == '夜' && text > 62 && text <=64)"
                        color="red">{{ text }}
                    </a-tag>
                    <a-tag v-else-if="(record.timeSlot == '昼' && text > 74 ) || (record.timeSlot == '夜' && text > 64)"
                           color="red">{{ text }}
                    </a-tag>
                    <template v-else color="#FFF">{{ text }}</template>
                </template>
            </ele-pro-table>
        </a-card>
    </div>
    <!-- 编辑弹窗 -->
</template>

<script>
// import _ from "lodash";
import XLSX from "xlsx";
import {pageLakeUrl, getColumnOptions} from "@/api/ecology/special-lake";
import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
// import moment from "moment";
import {specialTableColumns} from "../collect/colums"
//   import utils from "./utils";
export default {
    name: "StatisticSoundZoneBase",
    components: {},
    data() {
        return {
            data: [],
            locale,
            bill: {},
            // 表格数据接口
            url: pageLakeUrl,
            selection: [],
            // 表格列配置
            columns: specialTableColumns,
            palceOptions: [],
            areaOptions: [],
            regionLevelOptions: [],
            // 表格搜索条件
            where: {
                checked: 1,
            },
            // 表格选中数据
            selectionList: [],
        };
    },
    mounted() {
        this.loadOptionData();
    },
    methods: {
        /**获取下来框数据 */
        loadOptionData() {
            getColumnOptions("place").then((res) => {
                this.palceOptions = res.data.data.map((item) => {
                    return {
                        label: item,
                        value: item,
                    };
                });
            });
            getColumnOptions("area").then((res) => {
                this.areaOptions = res.data.data.map((item) => {
                    return {
                        label: item,
                        value: item,
                    };
                });
            });
            getColumnOptions("region_level").then((res) => {
                this.regionLevelOptions = res.data.data.map((item) => {
                    return {
                        label: item,
                        value: item,
                    };
                });
            });
        },
        /* 刷新表格 */
        reload() {

            this.$refs.table.reload({
                where: this.where,
            });
        },
        /* 重置搜索 */
        reset() {
            this.where = {
                checked: 1,
            };
            this.reload();
        },
        exportFile() {
            const columns = [
                {
                    title: "行政区划代码",
                    dataIndex: "regionCode",
                    sorter: true,
                },
                {
                    title: "监测年度",
                    dataIndex: "monitorYear",
                    sorter: true,
                },
                {
                    title: "点位编码",
                    dataIndex: "placeCode",
                    sorter: true,
                },
                {
                    title: "测点名称",
                    dataIndex: "place",
                    sorter: true,
                },
                {
                    title: "测点经度",
                    dataIndex: "placeLng",
                    sorter: true,
                },
                {
                    title: "测点纬度",
                    dataIndex: "placeLat",
                    sorter: true,
                },

                {
                    title: "测点参照物",
                    dataIndex: "refObj",
                    sorter: true,
                },
                {
                    title: "网格边长",
                    dataIndex: "gridLength",
                    sorter: true,
                },
                {
                    title: "网格覆盖人口（万）",
                    dataIndex: "people",
                    sorter: true,
                },
                {
                    title: "功能区代码",
                    dataIndex: "functionCode",
                    sorter: true,
                },
                {
                    title: "月",
                    dataIndex: "monitorMonth",
                    sorter: true,
                },
                {
                    title: "日",
                    dataIndex: "monitorDay",
                    sorter: true,
                },
                {
                    title: "时",
                    dataIndex: "monitorHour",
                    sorter: true,
                },
                {
                    title: "分",
                    dataIndex: "monitorMinute",
                    sorter: true,
                },

                {
                    title: "Leq",
                    dataIndex: "indexLeq",
                    sorter: true,
                },

                {
                    title: "L10",
                    dataIndex: "indexL10",
                    sorter: true,
                },
                {
                    title: "L50",
                    dataIndex: "indexL50",
                    sorter: true,
                },
                {
                    title: "L90",
                    dataIndex: "indexL90",
                    sorter: true,
                },
                {
                    title: "最大值",
                    dataIndex: "indexLmax",
                    sorter: true,
                },
                {
                    title: "最小值",
                    dataIndex: "indexLmin",
                    sorter: true,
                },
                {
                    title: "标准差(SD)",
                    dataIndex: "indexSd",
                    sorter: true,
                },
                {
                    title: "监测站名",
                    dataIndex: "station",
                    sorter: true,
                },
                {
                    title: "监测仪器型号",
                    dataIndex: "monitorInstrumentModel",
                    sorter: true,
                },
                {
                    title: "监测仪器编号",
                    dataIndex: "monitorInstrumentCode",
                    sorter: true,
                },
                {
                    title: "监测前校准值",
                    dataIndex: "beforeMonitorValue",
                    sorter: true,
                },
                {
                    title: "声校准器测量声压值",
                    dataIndex: "soundPressureValue",
                    sorter: true,
                },
                {
                    title: "声校准仪器型号",
                    dataIndex: "soundInstrumentModel",
                    sorter: true,
                },
                {
                    title: "声校准仪器编号",
                    dataIndex: "soundInstrumentCode",
                    sorter: true,
                },
                {
                    title: "区域等级",
                    dataIndex: "regionLevel",
                    sorter: true,
                },
                {
                    title: "备注",
                    dataIndex: "remark",
                    sorter: true,
                },
            ];
            const arr = [];
            const th = columns.map((item) => item.title);
            arr.push(th);
            this.data.forEach((d) => {
                const td = columns.map((item) => d[item.dataIndex]);
                arr.push(td);
            });
            let sheet = XLSX.utils.aoa_to_sheet(arr);
            this.$util.exportSheet(XLSX, sheet, new Date().getTime().toString());
        },
    },
};
</script>

<style scoped lang="less">
</style>