<template>
    <div>
        <div class="content">
            <dataBreadcrumb :breads="breads"></dataBreadcrumb>
            <div class="message">
                <div class="flex-between bond">
                    <div>
                        招标文件：<span @click="down(bidDetail.fileUrl)">{{ bidDetail.fileName }}</span>
                    </div>
                    <div>开标信息：<span @click="changeOpen">开标一览表</span></div>
                </div>
                <div class="flex-item upload">
                    <div>变更信息：</div>
                    <ul class="title flex-item">
                        <li v-for="(item, index) in changeList" :key="index">
                            <router-link :to="{ path: '/purchaser/bid/bidStage/changeList/see', query: { id: item.noticeId } }">{{
                                item.title
                            }}</router-link>
                        </li>
                    </ul>
                </div>
                <!-- 投标文件 -->
                <div>
                    <div>投标文件：</div>
                    <dataTable :table-data="bids" :columns="bidTitle" :is-index="true">
                        <el-table-column slot="operate" label="文件" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div class="flex file">
                                    <div @click="down(scope.row.fileUrl)">{{ scope.row.fileName }}</div>
                                    <div v-for="(file, index) in scope.row.fileList" :key="index" @click="down(file.fileUrl)">
                                        {{ file.fileName }}
                                    </div>
                                </div>
                            </template>
                        </el-table-column>
                    </dataTable>
                </div>
                <!-- 评审信息 -->
                <div style="margin-top: 100px">
                    <div class="flex-between">
                        <h5>评审信息</h5>
                        <el-button type="primary" size="small" @click="jump">澄清质询查看</el-button>
                    </div>
                    <dataTable :table-data="review" :columns="reviewTitle" :is-index="true">
                        <el-table-column slot="operate" label="资格审查" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div v-if="scope.row.qualification">通过</div>
                                <div v-if="!scope.row.qualification">未通过</div>
                            </template>
                        </el-table-column>
                        <el-table-column slot="operate" label="符合性审查" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div v-if="scope.row.conformity">通过</div>
                                <div v-if="!scope.row.conformity">未通过</div>
                            </template>
                        </el-table-column>
                        <el-table-column slot="operate" label="手动废标" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div v-if="scope.row.bidRejection">通过</div>
                                <div v-if="!scope.row.bidRejection">未通过</div>
                            </template>
                        </el-table-column>
                        <el-table-column slot="operate" label="结论" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div v-if="scope.row.conclusion">通过</div>
                                <div v-if="!scope.row.conclusion">未通过</div>
                            </template>
                        </el-table-column>
                    </dataTable>
                </div>
                <!-- 排名信息 -->
                <div>
                    <h5>排名信息</h5>
                    <dataTable :table-data="rank" :columns="rankTitle" :is-index="true">
                        <el-table-column slot="operate" label="是否中标候选人" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div v-if="scope.row.winPerson">是</div>
                                <div v-if="!scope.row.winPerson">否</div>
                            </template>
                        </el-table-column>
                        <el-table-column slot="operate" label="排名" align="center" fixed="right">
                            <template slot-scope="scope">
                                <div>{{ scope.$index + 1 }}</div>
                            </template>
                        </el-table-column>
                    </dataTable>
                </div>

                <div class="flex">
                    <div>评标附件：</div>
                    <ul class="upload">
                        <li class="flex" v-for="(item, index) in downloadList" :key="index">
                            <div>{{ item.fileName }}</div>
                            <button @click="down(item.fileUrl)">下载</button>
                        </li>
                    </ul>
                </div>
                <div class="button">
                    <el-button @click="back">返回</el-button>
                    <el-button @click="fail">流标</el-button>
                    <el-button type="primary" @click="end">评标结束</el-button>
                </div>
            </div>
            <!-- 开标一览表 -->
            <el-dialog title="开标一览表" :visible.sync="isOpenInfo">
                <dataTable :tableData="tableData" :columns="nopagecolumns" :margin-top="0" :margin-bottom="0"> </dataTable>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="isOpenInfo = false">取 消</el-button>
                </div>
            </el-dialog>
        </div>
    </div>
</template>

<script>
import {
    bidend,
    CompanyEvaluatec,
    companyRank,
    bidBookDownload,
    changeNoticelist,
    bidFilelist,
    accessorydownload,
    openInfo
} from '@api/purchaser/bid';
import dataTable from '@components/nopageTable.vue';
import dataBreadcrumb from '@components/dataBreadcrumb.vue';
export default {
    components: {
        dataTable,
        dataBreadcrumb
    },
    data() {
        return {
            isOpenInfo: false,
            tableData: [],
            nopagecolumns: [
                {
                    label: '投标人名称',
                    prop: 'companyName'
                },
                {
                    label: '投标报价(元)',
                    prop: 'price'
                },
                {
                    label: '是否签名',
                    prop: 'isSign'
                }
            ], //
            downloadList: [],
            changeList: [],
            bidDetail: '',
            rankTitle: [
                {
                    label: '投标人名称',
                    prop: 'companyName'
                },
                {
                    label: '投标价(元)',
                    prop: 'price'
                },
                {
                    label: '商务评分',
                    prop: 'commercialGrade'
                },
                {
                    label: '技术评分',
                    prop: 'skillGrade'
                },
                {
                    label: '价格评分',
                    prop: 'priceGrade'
                },
                {
                    label: '评标价(元)',
                    prop: 'evaluationPrice'
                },
                {
                    label: '最终得分',
                    prop: 'finalScore'
                },
                {
                    slot: 'operate'
                }
            ],
            rank: [],
            bidTitle: [
                {
                    label: '投标人',
                    prop: 'companyName'
                },
                {
                    slot: 'operate'
                }
            ],
            bids: [],
            breads: ['招标管理', '招标项目管理', '工作台'],
            review: [],
            reviewTitle: [
                {
                    label: '投标人名称',
                    prop: 'companyName'
                },
                {
                    slot: 'operate'
                }
            ] // 操作列
        };
    },
    methods: {
        changeOpen() {
            this.isOpenInfo = true;
            this.getopenInfo();
        },
        // 开标一览表
        async getopenInfo() {
            try {
                let projectId = localStorage.getItem('projectId');
                const { data, code } = await openInfo(projectId);
                if (code == 200) {
                    for (let item of data) {
                        if (item.isSign) {
                            item.isSign = '是';
                        } else {
                            item.isSign = '否';
                        }
                    }
                    this.tableData = data;
                }
            } catch (e) {
                console.log(e);
            }
        },
        down(url) {
            window.open(url);
        },
        jump() {
            this.$router.push('/purchaser/bid/bidEvaluation/review/clear');
        },
        compare(property) {
            return function (a, b) {
                var value1 = a[property];
                var value2 = b[property];
                return value2 - value1;
            };
        },
        // 查看评标附件
        async getaccessorydownload() {
            let projectId = localStorage.getItem('projectId');
            const { data, code } = await accessorydownload(projectId);
            if (code === 200) {
                this.downloadList = data;
            }
        },
        // 查看投标文件
        async getbidFilelist() {
            let projectId = localStorage.getItem('projectId');
            const { data, code } = await bidFilelist(projectId);
            if (code === 200) {
                this.bids = data;
            }
        },
        // 查看变更信息
        async getchangeNoticelist() {
            let projectId = localStorage.getItem('projectId');
            const { data, code } = await changeNoticelist(projectId);
            if (code === 200) {
                this.changeList = data;
            }
        },
        // 查投标公司评审信息
        async getCompanyEvaluatec() {
            try {
                let projectId = localStorage.getItem('projectId');
                const { data, code } = await CompanyEvaluatec(projectId);
                if (code === 200) {
                    this.review = data;
                }
            } catch (e) {
                console.log(e);
            }
        },
        // 查看投标公司排名信息

        async getcompanyRank() {
            try {
                let projectId = localStorage.getItem('projectId');
                const { data, code } = await companyRank(projectId);
                if (code === 200) {
                    console.log(data, '...............');
                    let data1 = data.sort(this.compare('finalScore'));
                    this.rank = data1;
                }
            } catch (e) {
                console.log(e);
            }
        },
        async getbidBookDownload() {
            try {
                let projectId = localStorage.getItem('projectId');
                const { data, code } = await bidBookDownload(projectId);
                if (code === 200) {
                    this.bidDetail = data;
                }
            } catch (e) {
                console.log(e);
            }
        },
        async end() {
            // 二次确认
            this.$confirm('确定要评标结束吗？', '提示', {
                type: 'warning'
            })
                .then(async () => {
                    let projectId = localStorage.getItem('projectId');
                    const { msg, code } = await bidend(projectId);
                    if (code == 200) {
                        this.$message({
                            message: msg,
                            type: 'success',
                            duration: 1500
                        });
                        setTimeout(() => {
                            this.$router.go(-1);
                        }, 1500);
                    } else {
                        this.$message.error(msg);
                    }
                })
                .catch(() => {});
        },
        back() {
            this.$router.go(-1);
        },
        examine() {
            this.$router.push('/admin/bid/bidingDetail');
        },
        fail() {
            this.$router.push('/purchaser/bid/bidEvaluation/projectManager/fail');
        }
    },
    created() {
        this.getaccessorydownload();
        this.getbidFilelist();
        this.getchangeNoticelist();
        this.getcompanyRank();
        this.getCompanyEvaluatec();
        this.getbidBookDownload();
    }
};
</script>

<style scoped>
.bond span {
    cursor: pointer;
}
.file{
    flex-wrap: wrap;
}
.file > div {
    margin-right: 10px;
    color: #113dee;
    cursor: pointer;
}

.message {
    margin-left: 50px;
    margin-bottom: 50px;
}

.message span {
    color: #113dee;
}

.message > div {
    margin-bottom: 15px;
}

.title > li {
    margin-right: 15px;
}

.upload button {
    border: 1px solid #000000;
    background: #fff;
    width: 50px;
    height: 20px;
    margin-left: 10px;
}

h5 {
    font-weight: bold;
    margin-bottom: 20px;
}

.button {
    width: 280px;
    margin: 80px auto 30px;
}
</style>
