<template>
    <div class="list-view">
        <div class="filters-container">
            <el-radio-group v-model="radio1" @change="radioChange" class="filter-item">
                <el-radio-button
                    :label="index"
                    v-for="(pic, index) in toMenuList"
                    :key="index"
                    @click="toShow(pic.todoName, pic.listAll, pic.query)"
                    >{{ pic.todoName }}({{ pic.count || 0 }})</el-radio-button
                >
            </el-radio-group>
            <!-- <div v-for="(pic, index) in toMenuList" style="display: inline-block;" :key="index">
                <el-button
                    @click="toShow(pic.todoName, pic.listAll, pic.query)"
                    type="primary"
                    style="margin-right: 10px;margin-bottom: 10px"
                    >{{ pic.todoName }}({{ pic.count }})</el-button
                >
            </div> -->
        </div>
        <el-table
            :data="tableData"
            row-key="id"
            ref="table"
            header-row-class-name="table-header-row"
            header-cell-class-name="table-header-cell"
            row-class-name="table-row"
            cell-class-name="table-cell"
            :height="tableHeight"
            v-if="menuList[0].todoName === show"
            key="9"
        >
            <el-table-column prop="id" label="ID" width="100"> </el-table-column>
            <el-table-column prop="orgName" label="单位名称" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="orgType" label="单位性质" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="publicCompany" label="上市公司" width="70">
                <template v-slot="{ row }">{{ row.publicCompany ? '是' : '否' }}</template>
            </el-table-column>
            <el-table-column prop="parentOrg" label="隶属单位" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="address" label="所在地" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="addressDetail" label="详细地址" min-width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column prop="createdAt" label="提交日期" width="150"> </el-table-column>
            <el-table-column prop="intro" label="企业介绍" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="license" label="营业执照" width="80" align="center">
                <template v-slot="{ row }">
                    <el-image
                        style="width: 50px; height: 30px"
                        fit="contain"
                        :src="row.license"
                        :preview-src-list="[row.license]"
                    >
                    </el-image>
                </template>
            </el-table-column>
            <el-table-column prop="contactName" label="联系人" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="contactIdNo" label="身份证号" min-width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column prop="contactPhone" label="手机号" min-width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column prop="contactEmail" label="电子邮箱" min-width="100" show-overflow-tooltip>
            </el-table-column>
            <el-table-column prop="attach" label="信息报送承诺书" min-width="110" show-overflow-tooltip>
                <template v-slot="{ row }">
                    <el-link type="primary" v-if="row.attach" :href="row.attach" target="_blank">下载</el-link>
                </template>
            </el-table-column>
            <el-table-column prop="nickname" label="用户名" min-width="100" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="status" label="状态" :formatter="statusFormatter" width="80"> </el-table-column>
            <el-table-column label="操作" align="center" fixed="right" min-width="150">
                <template slot-scope="{ row }">
                    <el-button
                        type="primary"
                        @click="
                            pass(menuList[0].todoName, {
                                title: row.orgName,
                                orgInfo: { id: row.id }
                            })
                        "
                        plain
                        size="mini"
                    >
                        通过
                    </el-button>
                    <el-button
                        type="warning"
                        @click="
                            deny(menuList[0].todoName, {
                                title: row.orgName,
                                orgInfo: { id: row.id },
                                refuseDesc: ''
                            })
                        "
                        plain
                        size="mini"
                    >
                        拒绝
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <!-- 公告审核 -->
        <el-table
            :data="tableData"
            row-key="id"
            ref="table"
            header-row-class-name="table-header-row"
            header-cell-class-name="table-header-cell"
            row-class-name="table-row"
            cell-class-name="table-cell"
            :height="tableHeight"
            v-if="menuList[1].todoName === show"
            key="6"
        >
            <el-table-column prop="id" label="ID" width="100"> </el-table-column>
            <el-table-column prop="title" label="标题" :show-overflow-tooltip="true"> </el-table-column>
            <el-table-column prop="cover" label="封面">
                <template slot-scope="{ row }">
                    <el-image
                        v-if="row.cover"
                        style="width: 30px; height: 30px"
                        :src="row.cover"
                        fit="cover"
                        :preview-src-list="[row.cover]"
                    ></el-image>
                    <p v-else>无</p>
                </template></el-table-column
            >
            <el-table-column prop="content" label="内容" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <div style="height: 30px" scope>
                        <p>{{ scope.row.content | lable }}</p>
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="publish" label="发布" width="60" align="center">
                <template v-slot="{ row }">
                    <el-tag type="success" v-if="row.publish">是</el-tag>
                    <el-tag type="info" v-else>否</el-tag>
                </template>
            </el-table-column>
            <el-table-column prop="type.name" label="类型"> </el-table-column>
            <el-table-column prop="createdAt" label="发布日期" width="150"> </el-table-column>
            <el-table-column prop="status" label="状态" :formatter="statusFormatter"> </el-table-column>
            <el-table-column label="操作" align="center">
                <template slot-scope="{ row }">
                    <el-button
                        type="primary"
                        @click="
                            pass(menuList[1].todoName, {
                                title: row.title,

                                article: { id: row.id }
                            })
                        "
                        plain
                        size="mini"
                    >
                        通过
                    </el-button>
                    <el-button
                        type="warning"
                        @click="
                            deny(menuList[1].todoName, {
                                title: row.title,
                                article: { id: row.id },
                                refuseDesc: ''
                            })
                        "
                        plain
                        size="mini"
                    >
                        拒绝
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <!-- 政策审核 -->
        <el-table
            :data="tableData"
            row-key="id"
            ref="table"
            header-row-class-name="table-header-row"
            header-cell-class-name="table-header-cell"
            row-class-name="table-row"
            cell-class-name="table-cell"
            :height="tableHeight"
            v-else-if="menuList[2].todoName === show"
            key="7"
        >
            <el-table-column prop="id" label="ID" width="100"> </el-table-column>
            <el-table-column prop="title" label="标题" :show-overflow-tooltip="true"> </el-table-column>
            <el-table-column prop="cover" label="封面">
                <template slot-scope="{ row }">
                    <el-image
                        v-if="row.cover"
                        style="width: 30px; height: 30px"
                        :src="row.cover"
                        fit="cover"
                        :preview-src-list="[row.cover]"
                    ></el-image>
                    <p v-else>无</p>
                </template>
            </el-table-column>
            <el-table-column prop="content" label="内容" :show-overflow-tooltip="true">
                <template slot-scope="scope">
                    <div style="height: 30px" scope>
                        <p>{{ scope.row.content | lable }}</p>
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="publish" label="发布" width="60" align="center"> </el-table-column>
            <el-table-column prop="type.name" label="类型"> </el-table-column>
            <el-table-column prop="createdAt" label="发布日期" width="150"> </el-table-column>
            <el-table-column prop="status" label="状态" :formatter="statusFormatter"> </el-table-column>
            <el-table-column label="操作" align="center" fixed="right">
                <template slot-scope="{ row }">
                    <el-button
                        type="primary"
                        @click="
                            pass(menuList[2].todoName, {
                                title: row.title,
                                article: { id: row.id }
                            })
                        "
                        plain
                        size="mini"
                    >
                        通过
                    </el-button>
                    <el-button
                        type="warning"
                        @click="
                            deny(menuList[2].todoName, {
                                title: row.title,
                                article: { id: row.id },
                                refuseDesc: ''
                            })
                        "
                        plain
                        size="mini"
                    >
                        拒绝
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-table
            v-else-if="menuList[3].todoName === show"
            :data="tableData"
            row-key="id"
            ref="table"
            header-row-class-name="table-header-row"
            header-cell-class-name="table-header-cell"
            row-class-name="table-row"
            cell-class-name="table-cell"
            :height="tableHeight"
            :key="32"
        >
            <el-table-column prop="id" label="ID" width="100"> </el-table-column>
            <el-table-column prop="name" label="名称"> </el-table-column>
            <el-table-column prop="expireTime" label="有效期"> </el-table-column>
            <el-table-column prop="contact" label="联系人"> </el-table-column>
            <el-table-column prop="phone" label="联系方式"> </el-table-column>
            <el-table-column prop="address" label="联系地址"> </el-table-column>
            <el-table-column prop="status" label="审核状态" :formatter="statusFormatter"> </el-table-column>
            <el-table-column prop="images" label="图片">
                <template slot-scope="{ row }">
                    <el-image
                        style="width: 30px; height: 30px"
                        :src="row.images[0]"
                        fit="cover"
                        :preview-src-list="row.images"
                    ></el-image>
                </template>
            </el-table-column>
            <el-table-column prop="type" label="资源供需类型" :formatter="typeFormatter"> </el-table-column>
            <el-table-column prop="createdAt" label="发布日期" width="150"> </el-table-column>
            <el-table-column prop="description" label="功能简介"> </el-table-column>
            <el-table-column prop="details" label="详细介绍"> </el-table-column>

            <el-table-column label="操作" align="center" fixed="right" min-width="150">
                <template slot-scope="{ row }">
                    <el-button
                        type="primary"
                        v-if="row.status === 'PENDING'"
                        @click="
                            pass(menuList[3].todoName, {
                                title: row.name,
                                resourceSupplyAndDemand: { id: row.id, status: 'PASS' }
                            })
                        "
                        plain
                        size="mini"
                    >
                        通过
                    </el-button>
                    <el-button
                        type="warning"
                        v-if="row.status === 'PENDING'"
                        @click="
                            deny(menuList[3].todoName, {
                                title: row.name,
                                resourceSupplyAndDemand: { id: row.id },
                                refuseDesc: ''
                            })
                        "
                        plain
                        size="mini"
                    >
                        拒绝
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-table
            v-else-if="menuList[4].todoName === show"
            :data="tableData"
            row-key="id"
            ref="table"
            header-row-class-name="table-header-row"
            header-cell-class-name="table-header-cell"
            row-class-name="table-row"
            cell-class-name="table-cell"
            :height="tableHeight"
            :key="333"
        >
            <el-table-column prop="id" label="ID" width="100"> </el-table-column>
            <el-table-column prop="title" label="标题"> </el-table-column>
            <el-table-column prop="content" label="内容"> </el-table-column>
            <el-table-column prop="pics" label="图片"> </el-table-column>
            <el-table-column prop="type" label="类型" :formatter="typeFormatter"> </el-table-column>
            <el-table-column prop="createdAt" label="发布日期" width="150"> </el-table-column>
            <el-table-column prop="commentNum" label="评论数"> </el-table-column>
            <el-table-column prop="viewNum" label="热度"> </el-table-column>
            <el-table-column prop="likeNum" label="赞数"> </el-table-column>
            <el-table-column prop="dislikeNum" label="踩数"> </el-table-column>
            <el-table-column prop="status" label="状态" :formatter="statusFormatter"> </el-table-column>
            <el-table-column prop="publicPost" label="公开">
                <template slot-scope="{ row }">
                    <el-tag :type="row.publicPost ? '' : 'info'">{{ row.publicPost }}</el-tag>
                </template>
            </el-table-column>
            <el-table-column label="操作" align="center" fixed="right" min-width="150">
                <template slot-scope="{ row }">
                    <el-button
                        type="primary"
                        v-if="row.status === 'PENDING'"
                        @click="
                            pass(menuList[4].todoName, {
                                title: row.name,
                                resourceSupplyAndDemand: { id: row.id, status: 'PASS' }
                            })
                        "
                        plain
                        size="mini"
                    >
                        通过
                    </el-button>
                    <el-button
                        type="warning"
                        v-if="row.status === 'PENDING'"
                        @click="
                            deny(menuList[4].todoName, {
                                title: row.name,
                                resourceSupplyAndDemand: { id: row.id },
                                refuseDesc: ''
                            })
                        "
                        plain
                        size="mini"
                    >
                        拒绝
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
import pageableTable from '../mixins/pageableTable';
export default {
    name: 'agency',
    mixins: [pageableTable],
    data() {
        return {
            tableData: [],
            papersTypeOptions: [{ label: '身份证', value: 0 }],
            statusOptions: [
                { label: '待审核', value: 'PENDING' },
                { label: '审核通过', value: 'PASS' },
                { label: '审核失败', value: 'DENY' }
            ],
            show: '资源供需审核',
            search: '',
            query: { status: 'PENDING' },
            todoName: '',
            url: '/resourceSupplyAndDemand/all',
            toMenuList: [],
            menuList: [
                { todoName: '企业信息审核', url: '/orgInfo/all' },
                { todoName: '公告审核', url: '/article/all' },
                { todoName: '政策审核', url: '/article/all' },
                { todoName: '资源供需审核', url: '/resourceSupplyAndDemand/all' },
                { todoName: '民政互动审核', url: '/post/all' }
            ],
            typeOptions: [
                { label: '技术需求', value: 'TECH_DEMAND' },
                { label: '产品需求', value: 'PRODUCT_DEMAND' },
                { label: '融资需求', value: 'FINANCING_DEMAND' },
                { label: '技术发布', value: 'TECH_SUPPLY' },
                { label: '产品发布', value: 'PRODUCT_SUPPLY' },
                { label: '共享资源', value: 'RES_SUPPLY' }
            ],
            radio1: 0
        };
    },
    created() {
        this.toList();
    },
    methods: {
        typeFormatter(row, column, cellValue, index) {
            let selectedOption = this.typeOptions.find(i => i.value === cellValue);
            if (selectedOption) {
                return selectedOption.label;
            }
            return '';
        },
        papersTypeFormatter(row, column, cellValue, index) {
            let selectedOption = this.papersTypeOptions.find(i => i.value === cellValue);
            if (selectedOption) {
                return selectedOption.label;
            }
            return '';
        },
        statusFormatter(row, column, cellValue, index) {
            let selectedOption = this.statusOptions.find(i => i.value === cellValue);
            if (selectedOption) {
                return selectedOption.label;
            }
            return '';
        },
        radioChange(i) {
            this.toShow(this.toMenuList[i].todoName, this.toMenuList[i].listAll, this.toMenuList[i].query);
        },
        toShow(todoName, url, query) {
            this.url = url;
            this.query = {};
            this.todoName = todoName;
            if (query) {
                this.query = query;
            }
            this.show = todoName;
            this.getData(this.url, this.query);
        },
        getData(url, data) {
            this.$http
                .get(url, { query: data })
                .then(res => {
                    this.tableData = res.content;
                })
                .catch(e => {
                    console.log(e);
                    this.$message.error(e.error);
                });
        },
        toList() {
            let list = [];
            this.$http.get('/menu/userMenuList').then(res => {
                list = res;
                list.forEach((item, index) => {
                    if (item.countUrl) {
                        let promise = this.$http.get(item.countUrl, { query: item.query });
                        promise.then(function(value) {
                            if (value > 0) {
                                item.count = value;
                            } else {
                                list.splice(index, 1);
                            }
                        });
                    }
                });
                this.toMenuList = list;
                this.todoName = this.toMenuList[0].todoName;
                var url = this.toMenuList[0].url.substring(0, this.toMenuList[0].url.indexOf('List'));
                this.url = url + '/all';
                this.show = this.toMenuList[0].todoName;
                this.getData(this.url, this.toMenuList[0].query);
            });
        },
        pass(todoName, data) {
            this.$confirm('确认通过？', '提示')
                .then(_ => {
                    this.$message.success('成功');
                    this.toMenuList.forEach((item, index) => {
                        if (item.todoName === todoName) {
                            let promise = this.$http.get(item.countUrl, { query: item.query });
                            promise.then(function(value) {
                                if (value > 0) {
                                    item.count = value;
                                }
                            });
                            var url = item.url.substring(0, item.url.indexOf('List'));
                            this.url = url + '/all';
                            this.show = todoName;
                            this.getData(this.url, this.toMenuList[index].query);
                        }
                    });
                })
                .catch(_ => {});
        },
        deny(todoName, data) {
            this.show = todoName;
            this.$prompt('请输入拒绝原因', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                inputPattern: /.+/,
                inputErrorMessage: '请输入拒绝原因'
            })
                .then(({ value }) => {
                    data.refuseDesc = value;
                    this.$message.success('成功');
                    this.toMenuList.forEach((item, index) => {
                        if (item.todoName === todoName) {
                            let promise = this.$http.get(item.countUrl, { query: item.query });
                            promise.then(function(value) {
                                if (value > 0) {
                                    item.count = value;
                                }
                            });
                            var url = item.url.substring(0, item.url.indexOf('List'));
                            this.url = url + '/all';
                            this.show = todoName;
                            this.getData(this.url, this.toMenuList[index].query);
                        }
                    });
                })
                .catch(() => {
                    /*      this.$message({
                    type: 'info',
                    message: '取消输入'
                }); */
                });
        }
    }
};
</script>

<style scoped></style>
