<template>
    <div class="content-main">
        <!-- 搜索条件 -->
        <el-row>
            <el-form :inline="true" class="search-bm-boder" :model="formInline" ref="formInline">
                <el-form-item label="主体名称:">
                    <el-input class="inputCompatible2" clearable placeholder="请输入" v-model="formInline.ztmc"></el-input>
                </el-form-item>
                <el-form-item label="评价年度:">
                    <el-date-picker class="inputCompatible2" clearable value-format="yyyy" type="year"
                                    v-model="formInline.pjnd"></el-date-picker>
                </el-form-item>
                <el-form-item label="评价结果(等级):">
                    <el-select class="inputCompatible2" clearable placeholder="全部" v-model="formInline.pjjg">
                        <el-option v-for="item in appraiseLevel" :key="item.id" :label="item.level"
                                   :value="item.level"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="信用得分:">
                    <el-input-number class="inputSmallCompatible" clearable controls-position="right"
                                     v-model="formInline.fsks" @change="handleChange" :min="0"
                                     :max="1000"></el-input-number>
                    --
                    <el-input-number class="inputSmallCompatible" clearable controls-position="right"
                                     v-model="formInline.fsjs" @change="handleChangeTwo" :min="0"
                                     :max="1000"></el-input-number>
                </el-form-item>
                <el-form-item>
                    <div class="search-button">
                        <el-button type="primary" size="small" class="iconfont iconchaxun" @click="getPageList">查询
                        </el-button>
                        <el-button type="primary" @click="resetInfo('formInline')" size="small"
                                   class="iconfont iconzhongzhi">重置
                        </el-button>
                    </div>
                </el-form-item>
            </el-form>
        </el-row>
        <!-- 功能按钮 -->
        <el-row class="addBtnBg">
            <el-button type="primary" class="iconfont iconxinzeng11" size="small" @click="edits()">批量编辑</el-button>
            <el-button type="primary" class="iconfont icondaochu11" size="small" @click="exportSubmit()">导出</el-button>&emsp;
            <!-- 导入 -->
            <el-upload style="display: inline-block" :show-file-list="false" :action="actionUrl" :headers="uploadHeader"
                       class="daoru" :on-success="handleSuccess" :on-change="changeFj"
                       accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel">
                <el-button type="primary" class="iconfont icondaoru1" size="small">导入</el-button>&emsp;
            </el-upload>
            <el-button type="primary" class="iconfont iconxinzeng11" size="small" @click="editsSubmit()">批量提交
            </el-button>
        </el-row>
        <!-- 列表 -->
        <el-row>
            <el-table :data="tableData" stripe v-loading="listLoading" border fit highlight-current-row style="width: 100%" @selection-change="handleSelectionChange">
                <el-table-column align="center" :selectable="isDisabledFlag" type="selection" with="50" disabled="true"></el-table-column>
                <el-table-column align="center" with="50" label="序号" min-width="45">
                    <template slot-scope="scope">
                        <span>{{scope.$index+1}}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" label="主体名称" prop="ztmc" show-overflow-tooltip></el-table-column>
                <el-table-column align="center" label="统一社会信用代码" prop="tyshxydm" min-width="130" show-overflow-tooltip></el-table-column>
                <el-table-column align="center" label="监管机构" prop="jgjg" show-overflow-tooltip></el-table-column>
                <el-table-column align="center" label="监管机构统一社会信用代码" prop="jgjgtyshxydm" min-width="200"></el-table-column>
                <el-table-column align="center" label="评价名称" prop="pjmc" show-overflow-tooltip></el-table-column>
                <el-table-column align="center" label="信用得分" prop="xydf"></el-table-column>
                <el-table-column align="center" label="评价结果(等级)" prop="pjjg" min-width="130"></el-table-column>
                <el-table-column align="center" label="评价日期" prop="pjrq"></el-table-column>
                <el-table-column align="center" label="评价年度" prop="pjnd"></el-table-column>
                <el-table-column align="center" label="评价有效期" prop="pjyxq" min-width="90"></el-table-column>
                <el-table-column align="center" label="发布时间" prop="fbsj"></el-table-column>
                <el-table-column align="center" label="评价机关全称" prop="pjjgqc" min-width="100" show-overflow-tooltip></el-table-column>
                <el-table-column align="center" label="评价机关统一社会信用代码" prop="pjjgtyshxydm" min-width="200"></el-table-column>
                <!--待提交,已提交-->
                <el-table-column align="center" label="状态" prop="zt"></el-table-column>
                <el-table-column align="center" label="操作" fixed="right" width="80px">
                    <template slot-scope="scope">
                        <!--默认白色 type="primary" type="success" type="info" type="warning" type="danger"-->
                        <el-button title="编辑" size="small" type="primary" class="operate_edit_btn iconfont iconxiugai1" @click="editDialogOpen(scope.row)"
                                   v-if="scope.row.zt==='待提交'">
                        </el-button>
                        <el-button title="删除" size="small" type="primary" class="operate_delete_btn iconfont iconshanchu" @click="handleDelete(scope.row)"
                                   v-if="scope.row.zt==='待提交'">
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-row>
        <el-row>
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page.sync="pageForm.pageNum"
                    :page-sizes="[10,20,30,40]"
                    :page-size="pageForm.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="pageForm.total"
            ></el-pagination>
        </el-row>
        <edit v-if="editData.editVisible" :editData="editData" :refreshList="refreshList" />
    </div>
</template>

<script>
    import {getList, delectById, exportByObject, updateBatchTj} from '@/api/grainCoManage/enterpriseCredit/index';
    import {file, baseServer} from '@/api';
    import edit from './edit'

    export default {
        components: {
            edit
        },
        data() {
            return {
                listLoading: true,
                // 评价结果(等级)
                appraiseLevel: [
                    {id: 1, level: 'A'},
                    {id: 2, level: 'B'},
                    {id: 3, level: 'C'},
                    {id: 4, level: 'D'},
                    {id: 6, level: 'E'}
                ],
                // 分页
                pageForm: {
                    pageNum: 1,
                    pageSize: 10,
                    total: 0
                },
                // 搜索框
                formInline: {
                    ztmc: '',// 主体名称
                    pjnd: '',// 年份
                    pjjg: '',// 评价结果(等级)
                    // inputNumber计数器
                    fsks: 0,// 分数开始
                    fsjs: 1000// 分数结束
                },
                tableData: [],// 列表数据
                // 导入URL
                actionUrl: baseServer + "/qyxypj/importQyxypjDr",
                // 导入
                uploadHeader: {
                    token: sessionStorage.getItem('TOKENL')
                },
                // 显示弹窗
                editData: {
                    // 是否显示
                    editVisible: false,
                    // 传参
                    editFormDataC: {},
                    ids: ''
                },
                // 复选框
                multipleSelection: [],
            }
        },
        created() {
            this.getPageList();
        },
        methods: {
            // inputNumber计数器
            handleChange(value) {
                console.log("handleChange==>", value);
            },
            handleChangeTwo(value) {
                console.log("handleChangeTwo==>", value);
            },
            // 分页列表
            getPageList() {
                let params = {
                    pageNum: this.pageForm.pageNum,
                    pageSize: this.pageForm.pageSize,
                    qyxypjDcVO: this.formInline
                };
                // console.log("qyxypjDcVO===>", params.qyxypjDcVO);
                getList(params.pageNum, params.pageSize, params.qyxypjDcVO).then(res => {
                    if (res.infoCode === 200) {
                        this.listLoading = false;
                        this.tableData = res.data.list;
                        // console.log("tableData==>", this.tableData);
                        this.$set(this.pageForm, "total", Number(res.data.total));
                    } else {
                        this.$message.error(res.msg);
                    }
                }).catch((err) => {
                    this.$message.error(err.msg)
                });
            },
            // 批量编译
            edits() {
                this.editData.editVisible = true;
                this.editData.editFormDataC = {};
                // set 通用数据 已选数据
                if (this.multipleSelection.length > 0) {
                    // console.log("multipleSelection===>", this.multipleSelection);
                    // 评价机关统一社会信用代码
                    this.editData.editFormDataC.pjjgtyshxydm = this.multipleSelection[0].pjjgtyshxydm;
                    // 评价机关全称
                    this.editData.editFormDataC.pjjgqc = this.multipleSelection[0].pjjgqc;
                    // 评价名称
                    this.editData.editFormDataC.pjmc = this.multipleSelection[0].pjmc;
                    // 编辑对象ids
                    let ids = '';
                    for (let i = 0; i < this.multipleSelection.length; i++) {
                        ids += this.multipleSelection[i].id + ',';
                    }
                    this.editData.ids = ids.slice(0, -1);
                    // console.log("ids===>", this.editData.ids);
                } else {
                    /*let msg = '您当前操作为批量编辑所有数据!';
                    if (confirm(msg) === true) {*/
                        this.editData.editFormDataC.pjjgtyshxydm = this.tableData[0].pjjgtyshxydm;
                        // 评价机关统一社会信用代码
                        // 评价机关全称
                        this.editData.editFormDataC.pjjgqc = this.tableData[0].pjjgqc;
                        // 评价名称
                        this.editData.editFormDataC.pjmc = this.tableData[0].pjmc;
                        this.editData.ids = 'plbj';
                    /*    return true;
                    } else {
                        this.editData.editVisible = false;
                        return false;
                    }*/
                }

            },
            // 批量提交
            editsSubmit() {
                /*let msg = '您当前操作为批量提交所有数据!';
                if (confirm(msg) === false) {
                    return;
                }*/
                this.$confirm('您当前操作为批量提交所有数据,是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let ids = '';
                    if (this.multipleSelection.length > 0) {
                        for (let i = 0; i < this.multipleSelection.length; i++) {
                            ids += this.multipleSelection[i].id + ',';
                        }
                        ids = ids.slice(0, -1);
                    }
                    updateBatchTj(ids).then(res => {
                        if (res.infoCode === 200) {
                            this.$message.success(res.data);
                            this.getPageList();
                        } else {
                            this.$message.success(res.data);
                        }
                    }).catch((err) => {
                        // this.loading = false;
                        this.$message.error(err.msg)
                    });
                }).catch(() => {
                    this.$message({type: 'info', message: '已取消编辑'});

                });
            },
            // 单条编辑
            editDialogOpen(row) {
                // console.log("单条编辑", row);
                this.editData.editVisible = true;
                this.editData.editFormDataC = row;
            },
            // 删除
            handleDelete(row) {
                // console.log("单条删除", row);
                this.$confirm('删除后数据不可恢复,是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    delectById(row.id).then(res => {
                        if (res.infoCode === 200) {
                            this.$message.success("删除成功");
                            this.getPageList();
                        } else {
                            this.$message.success(res.data);
                        }
                    }).catch((err) => {
                        // this.loading = false;
                        this.$message.error(err.data);
                    });
                }).catch(() => {
                    this.$message({type: 'info', message: '已取消删除'});
                });
            },
            // 导出
            exportSubmit() {
                exportByObject(this.formInline).then(res => {
                    let blob = new Blob([res], {type: 'application/vnd.ms-excel;charset=utf-8'});
                    if (!!window.ActiveXObject || "ActiveXObject" in window) {
                        window.navigator.msSaveOrOpenBlob(blob, '企业信用评价管理.xlsx');
                    } else {
                        const link = document.createElement('a');
                        link.style.display = 'none';
                        link.href = URL.createObjectURL(blob);
                        link.setAttribute('download', '企业信用评价管理.xlsx');
                        document.body.appendChild(link);
                        link.click();
                        document.body.removeChild(link);
                    }
                }).catch((err) => {
                    this.$message.error(err);
                });
            },
            //附件上传
            changeFj(file, fileList) {
                console.log('changeFj|file=', file);
                console.log('changeFj|fileList=', fileList);
            },
            //导入
            handleSuccess(response) {
                // console.log('handleSuccess=', response);
                if (response.infoCode === 200) {
                    this.$message.success(response.msg);
                    this.getPageList();
                } else {
                    this.$message.error(response.msg);
                }
            },
            // 列表复选框
            handleSelectionChange(val) {
                // console.log("val===>", val);
                this.multipleSelection = val
            },
            // 已提交禁用
            isDisabledFlag(row) {
                // console.log("isDisabledFlag",row);
                if (row.zt === "待提交") {
                    return true; // 不禁用
                } else {
                    return false; // 禁用
                }
            },
            refreshList() {
                // console.log('1234')
                this.getPageList();
            },
            // 重置
            resetInfo() {
                this.pageForm.pageNum = 1;
                this.pageForm.pageSize = 10;
                this.formInline.fsks = 0;
                this.formInline.fsjs = 1000;
                this.formInline.ztmc = '';
                this.formInline.pjnd = '';
                this.formInline.pjjg = '';
                this.getPageList()
            },
            // 分页
            handleSizeChange(val) {
                this.pageForm.pageSize = val;
                this.getPageList()
            },
            handleCurrentChange(val) {
                this.pageForm.pageNum = val;
                this.getPageList()
            },
        }
    }
</script>

<style scoped>
    .inputSmallCompatible {
        width: 100px;
    }
    .inputCompatible2 {
        width: 160px !important;
    }
</style>