<template>
    <div class="list-view" v-loading="loading">
        <div class="filters-container">
            <el-radio-group v-model="type" class="filter-item">
                <el-radio-button :label="index" v-for="(item, index) in types" :key="index">
                    {{ item.name }}({{ item.count || 0 }})
                </el-radio-button>
            </el-radio-group>
        </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="type === 0"
            key="0"
        >
            <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 | text }}</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" width="150" fixed="right">
                <template v-slot="{ row }">
                    <el-button type="primary" @click="audit(row, true)" plain size="mini">
                        通过
                    </el-button>
                    <el-button type="warning" @click="audit(row, false)" 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="type === 1"
            key="1"
        >
            <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" width="150" fixed="right">
                <template v-slot="{ row }">
                    <el-button type="primary" @click="audit(row, true)" plain size="mini">
                        通过
                    </el-button>
                    <el-button type="warning" @click="audit(row, false)" 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="type === 2"
            :key="2"
        >
            <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
                        v-if="row.images"
                        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" width="150" fixed="right">
                <template v-slot="{ row }">
                    <el-button type="primary" @click="audit(row, true)" plain size="mini">
                        通过
                    </el-button>
                    <el-button type="warning" @click="audit(row, false)" 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="type === 3"
            :key="3"
        >
            <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" width="150" fixed="right">
                <template v-slot="{ row }">
                    <el-button type="primary" @click="audit(row, true)" plain size="mini">
                        通过
                    </el-button>
                    <el-button type="warning" @click="audit(row, false)" plain size="mini">
                        拒绝
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
import pageableTable from '../mixins/pageableTable';
export default {
    name: 'audit',
    mixins: [pageableTable],
    data() {
        return {
            loading: false,
            type: 0,
            types: [
                {
                    name: '公告审核',
                    listUrl: '/article/all',
                    auditUrl: '/article/audit',
                    count: 0
                },
                {
                    name: '企业审核',
                    listUrl: '/orgInfo/all',
                    auditUrl: '/orgInfo/audit',
                    count: 0
                },
                {
                    name: '资源供需审核',
                    listUrl: '/resourceSupplyAndDemand/all',
                    auditUrl: '/resourceSupplyAndDemand/audit',
                    count: 0
                },
                {
                    name: '互动审核',
                    listUrl: '/post/all',
                    auditUrl: '/post/audit',
                    count: 0
                }
            ],
            tableData: [],
            statusOptions: [
                { label: '待审核', value: 'PENDING' },
                { label: '审核通过', value: 'PASS' },
                { label: '审核失败', value: 'DENY' }
            ],
            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' }
            ]
        };
    },
    methods: {
        getData() {
            let c = 0;
            this.types.forEach((item, index) => {
                this.loading = true;
                this.$http.get(item.listUrl, { size: 10000, query: { status: 'PENDING' } }).then(res => {
                    this.$set(item, 'count', res.totalElements);
                    if (this.type === index) {
                        this.tableData = res.content;
                    }
                    c++;
                    if (c === this.types.length) {
                        this.loading = false;
                    }
                });
            });
        },
        statusFormatter(row, column, cellValue, index) {
            let selectedOption = this.statusOptions.find(i => i.value === cellValue);
            if (selectedOption) {
                return selectedOption.label;
            }
            return '';
        },
        typeFormatter(row, column, cellValue, index) {
            let selectedOption = this.typeOptions.find(i => i.value === cellValue);
            if (selectedOption) {
                return selectedOption.label;
            }
            return '';
        },
        audit(row, pass) {
            this.$confirm(`确认${pass ? '通过' : '拒绝'}？`, {
                beforeClose: (action, instance, done) => {
                    if (action === 'confirm') {
                        // instance.confirmButtonLoading = true;
                        this.$http
                            .post(this.types[this.type].auditUrl, {
                                id: row.id,
                                pass: pass
                            })
                            .then(res => {
                                done();
                                instance.confirmButtonLoading = false;
                                this.$message.success('审核成功');
                                this.getData();
                            })
                            .catch(e => {
                                done();
                                instance.confirmButtonLoading = false;
                                this.$message.error(e.error || '操作失败，请稍后再试');
                            });
                    } else {
                        done();
                    }
                }
            }).then(res => {});
        }
    },
    watch: {
        type() {
            this.tableData = [];
            this.getData();
        }
    }
};
</script>
<style lang="less" scoped></style>
