<template>
    <div>
        <div class="content">
            <dataBreadcrumb :breads="breads"></dataBreadcrumb>
            <changeNav :navs="navs"></changeNav>
            <div>
                <div class="message form">
                    <div class="flex-between">
                        <div>项目编号：{{ projectCode }}</div>
                        <div style="margin-right: 100px">项目名称：{{ projectName }}</div>
                    </div>

                    <div>项目分类：{{ classify }}</div>

                    <div class="flex-item" v-if="type == 2">
                        <div>上传附件：</div>
                        <ul v-if="file !== undefined && file.length > 0">
                            <li v-for="(item, i) in file" :key="i" @click="open(item.fileUrl)" class="link">{{ item.fileName }}</li>
                        </ul>
                        <div v-else>无</div>
                    </div>
                    <div class="flex" v-else>
                        <div class="adjustment">上传附件：</div>
                        <singleUpload :limit="1" tip="支持上传1个附件,不超过20M" :max="20" @input="getfile"></singleUpload>
                    </div>
                </div>
                <div class="form">
                    <h3><span>*</span>确定中标人</h3>
                    <el-radio-group v-model="companyId" :disabled="type == 2 ? true : false">
                        <el-radio :label="item.companyId" v-for="(item, index) in tableData" :key="index">{{ item.companyName }}</el-radio>
                    </el-radio-group>
                    <h3 style="margin-top: 30px">说明</h3>
                    <el-input
                        :rows="3"
                        v-model.trim="remark"
                        type="textarea"
                        placeholder="请输入内容"
                        maxlength="300"
                        :disabled="type == 2 ? true : false"
                    >
                    </el-input>
                </div>
                <div class="button flex-center" v-if="type == 2">
                    <el-button @click="back">返回</el-button>
                </div>
                <div class="button flex-center" v-else>
                    <el-button @click="back">返回</el-button>
                    <el-button type="primary" @click="submitData">完成</el-button>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { candidate, winnerSave, winPersionInfoDetail } from '@api/purchaser/bid';
import { projectClassify } from '@api/common/list';
import dataTable from '@components/nopageTable.vue';
import dataBreadcrumb from '@components/dataBreadcrumb.vue';
import changeNav from '@components/changeNav.vue';
import singleUpload from '@components/Upload/Upload.vue';
export default {
    components: {
        dataBreadcrumb,
        changeNav,
        singleUpload,
        dataTable
    },
    data() {
        return {
            classify: '',
            projectCode: '',
            projectName: '',
            file: [],
            companyId: '',
            projectId: '',
            remark: '',
            navs: ['确认中标人'],
            breads: ['招标管理', '招标项目管理', '工作台'],
            tableData: [],
            type: 0,
            columns: [],
            detail: '' //,
        };
    },
    created() {
        this.projectCode = localStorage.getItem('projectCode');
        this.projectName = localStorage.getItem('projectName');
        let type = this.$route.query.type;
        this.type = type;
        if (type == 2) {
            this.navs[0] = '查看中标人';
            this.get();
        } else {
            this.getprojectClassify();
            this.getcandidate();
        }
    },
    methods: {
        open(url) {
            window.open(url);
        },
        getfile(val) {
            this.file = val;
        },
        back() {
            this.$router.go(-1);
        },
        examine() {
            this.$router.push('/admin/bid/bidingDetail');
        },
        check(index) {
            console.log(index);
        },
        async get() {
            let projectId = localStorage.getItem('projectId');
            var { data, code } = await candidate(projectId);
            if (code === 200) {
                this.tableData = data;
            }
            var { data, code } = await projectClassify(projectId);
            this.classify = data;
            var { data, code } = await winPersionInfoDetail(projectId);
            this.companyId = data.companyId;
            this.remark = data.remark;
            this.file = data.fileList;
        },
        async getprojectClassify() {
            let projectId = localStorage.getItem('projectId');
            var { data, code } = await projectClassify(projectId);
            this.classify = data;
        },
        async getcandidate() {
            let projectId = localStorage.getItem('projectId');
            var { data, code } = await candidate(projectId);
            if (code === 200) {
                this.tableData = data;
            }
        },
        // 提交中标人
        async submitData() {
            try {
                let data = {};
                data.projectId = localStorage.getItem('projectId');
                data.companyId = this.companyId;
                data.remark = this.remark;
                data.fileList = this.file;
                const { msg, code } = await winnerSave(data);
                if (code === 200) {
                    this.$message({
                        message: '提交完成',
                        type: 'success',
                        duration: 1500
                    });
                    setTimeout(() => {
                        this.$router.go(-1);
                    }, 1500);
                } else {
                    this.$message.error(msg);
                }
            } catch (e) {
                console.log(e);
            }
        }
    }
};
</script>

<style scoped>
.message {
    width: 80%;
    margin: 0 auto;
}

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

.form > h3 {
    font-weight: bold;
    margin-bottom: 30px;
}

.button {
    width: 100%;
    height: 50px;
}

span {
    color: #b21f2d;
}
</style>
