<template>
    <div class="dia-box">
        <fullscreen :fullscreen.sync="fullscreen" class="container structure-l" style="margin: 0;width: calc(75% - 15px);">
            <div class="container-box">
                <toolList @iconCli='iconCli' :tooltit='tooltit'></toolList>
                <!-- <div class="titbox">
                                    <span :style="'color:'+tableData.bg">({{tableData.stsDesc}})</span>
                                </div> -->
                <div class="checknum">
                    <span>上报人：{{tableData.opName}}</span>
                    <!--                    <span>部门：市场部</span>-->
                    <span>联系方式：{{tableData.contactPhone}}</span>
                    <!--                    <span>地市：哈尔滨市移动分公司</span>-->
                    <!--                    <span>职级：部门经理</span>-->
                    <span>上报时间：{{tableData.opTime}}</span>
                </div>
                <div style="height: 116px;background: #f4f4f4;">
					<uploadDown :datalist="datalist" :dialogStatus="uploadstatus" style="margin-top: 10px;"></uploadDown>
				</div>
                <div class="tab-boxinfo">
                    <div class="box-line">
                        <span>省份</span>
                        <div>{{tableData.provinceName}}</div>
                    </div>
                    <div class="box-line">
                        <span>运营商</span>
                        <div>{{tableData.operatorName}}</div>
                    </div>
                    <div class="box-line">
                        <span>违规类别</span>
                        <div>{{tableData.violationCateName}}</div>
                    </div>
                    <div class="box-line box-line-bg">
                        <span>违规项目</span>
                        <div>{{tableData.violationItemName}}</div>
                    </div>
                    <div class="box-line box-line-bg">
                        <span>月费</span>
                        <div>{{tableData.monthFee}} (元)</div>
                    </div>
                    <div class="box-line box-line-bg">
                        <span>预存款</span>
                        <div>{{tableData.preFee}} (元)</div>
                    </div>
                    <div class="box-line">
                        <span>资费名称</span>
                        <div>{{tableData.tariffName}}</div>
                    </div>
                    <div class="box-line">
                        <span>资费内容</span>
                        <div>{{tableData.taffiffContent}}</div>
                    </div>
                    <div class="box-line">
                        <span>酬金</span>
                        <div>{{tableData.remFee}}</div>
                    </div>
                    <div class="box-line box-line-bg">
                        <span>销售范围</span>
                        <div>{{tableData.saleScope}}</div>
                    </div>
                    <div class="box-line box-line-bg">
                        <span>销售渠道</span>
                        <div>{{tableData.saleChnl}}</div>
                    </div>
                    <div class="box-line box-line-bg">
                        <span>月销量</span>
                        <div>{{tableData.monthSale}}</div>
                    </div>
                    <div class="box-line">
                        <span>违规内容</span>
                        <div>{{tableData.violationContent}}</div>
                    </div>
                    <div class="box-line">
                        <span>违规地市</span>
                        <div>{{tableData.recordRegionName}}</div>
                    </div>
                    <!--                    <div class="box-line">-->
                    <!--                        <span>上报时间</span>-->
                    <!--                        <div>{{tableData.opTime}}</div>-->
                    <!--                    </div>-->
                    <!--                    <div class="box-line">-->
                    <!--                        <span>上报人</span>-->
                    <!--                        <div>{{tableData.opName}}</div>-->
                    <!--                    </div>-->
                    <!--                    <div class="box-line">-->
                    <!--                        <span>联系电话</span>-->
                    <!--                        <div>{{tableData.contactPhone}}</div>-->
                    <!--                    </div>-->
                    <div class="box-line" v-if="tableData.sts*1!==0">
                        <span>审批人</span>
                        <div>{{tableData.auditName}}</div>
                    </div>
                    <div class="box-line-bg">
                        <div class="box-line" v-if="tableData.sts*1!==0">
                            <span>是否已解决</span>
                            <div>{{tableData.fixFlagDesc}}</div>
                        </div>
                        <div class="box-line" v-if="tableData.sts*1!==0">
                            <span>是否反馈总部</span>
                            <div>{{tableData.groupFlagDesc}}</div>
                        </div>
                        <div class="box-line" v-if="tableData.sts*1!==0">
                            <span>是否返回竞合</span>
                            <div>{{tableData.wwFlagDesc}}</div>
                        </div>
                    </div>


                    <div class="box-line" v-if="tableData.sts*1!==0">
                        <span>是否反馈总局</span>
                        <div>{{tableData.admFlagDesc}}</div>
                    </div>

                    <div class="box-line" v-if="tableData.sts*1!==0">
                        <span>审批意见</span>
                        <div>{{tableData.auditResultDesc}}.{{tableData.auditRemarks}}</div>
                    </div>


                </div>
                <div class="titbtn-box" v-if="infotype===1">
                    <el-button size="medium" type="warning" icon="el-icon-picture" @click="outlineinfo(1)">对外导出图片</el-button>
                    <el-button size="medium" type="primary" icon="el-icon-folder-opened" @click="outlineinfo(2)">对内导出word</el-button>
                </div>
                <div class="titbtn-box" v-if="infotype!==1">
                    <el-button size="medium" type="danger" @click="exaStatus=true">拒绝</el-button>
                    <el-button size="medium" type="primary" @click="exaInfo(1,'已通过')">通过</el-button>
                </div>
            </div>
            <el-dialog title="拒绝申请" :visible.sync="exaStatus" width="50%" :destroy-on-close="true" :modal-append-to-body="false"
                :close-on-click-modal="false">
                <el-input type="textarea" :rows="4" placeholder="请输入拒绝原因或建议" v-model="auditRemarks">
                </el-input>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="exaStatus = false">取 消</el-button>
                    <el-button type="primary" @click="exaInfo(2,'未通过')">确 定</el-button>
                </div>
            </el-dialog>
        </fullscreen>

        <competeRight></competeRight>

    </div>
</template>
<script>
    import competeRight from "../../../components/competeRight";
    import uploadDown from "../../../components/uploadDown";
    import toolList from "../../../components/toolList";

    export default {
        components: {
            competeRight,
            uploadDown,
            toolList
        },
        data() {
            return {
                tooltit: '竞争对手信息',
                tableData: {},
                fullscreen: false,
                infotype: 0,
                attList: [],
                auditRemarks: '',
                exaStatus: false,
                datalist: {
                    url: '/market/compatt/downfile',
                    type: 1
                },
                uploadstatus: false,
            }
        },
        methods: {
            //获取详情
            getInfo(v) {
                this.infotype = this.$route.query.type * 1;
                this.$http({
                    url: "/market/cwcompetitor/queryInfo",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: {
                        id: v
                    },
                }).then((res) => {
                    this.datalist.attList = res.data.attList;
                    this.uploadstatus = true;
                    this.tableData = res.data;
                    if (this.tableData.sts * 1 === 0) {
                        this.tableData.bg = '#999';
                    } else if (this.tableData.sts * 1 === 1) {
                        this.tableData.bg = 'green';
                    } else {
                        this.tableData.bg = 'red';
                    }
                    // this.tableData.opTime = this.timeChange(res.data.opTime * 1);
                    this.attList = res.data.attList;
                });
            },
            //功能栏
            iconCli(v) {
                if (v === 1) {
                    this.getInfo(this.$route.query.id)
                }
                if (v === 2) {
                    this.fullscreen = !this.fullscreen
                }
            },
            exaInfo(v, n) {
                let _this = this;
                this.exaStatus = false;
                let params = {
                    id: this.tableData.id,
                    sts: v,
                    stsDesc: n,
                    auditName: JSON.parse(window.sessionStorage.userInfo).loginName,
                    auditNo: JSON.parse(window.sessionStorage.userInfo).loginName,
                    auditRemarks: this.auditRemarks,
                    auditResult: v,
                    auditResultDesc: n,
                    auditTime: new Date().getTime(),
                }
                this.$http({
                    url: "/market/swcompetitor/update",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: params,
                }).then((res) => {
                    if (res.data.result === 1) {
                        _this.$message({
                            message: res.data.desc,
                            type: 'error'
                        });
                    } else {
                        _this.$message({
                            message: '审核成功',
                            type: 'success'
                        });
                        _this.$router.push("/competExa");
                    }
                });
            },
            //导出
            outlineinfo(v) {
                let data = {
                    provinceName: this.tableData.provinceName,
                    operatorName: this.tableData.operatorName,
                    violationCateName: this.tableData.violationCateName,
                    violationItemName: this.tableData.violationItemName,
                    violationItem: this.tableData.violationItemName,
                    monthFee: this.tableData.monthFee,
                    tariffName: this.tableData.tariffName,
                    taffiffContent: this.tableData.taffiffContent,
                    remFee: this.tableData.remFee,
                    preFee: this.tableData.preFee,
                    saleScope: this.tableData.saleScope,
                    saleChnl: this.tableData.saleChnl,
                    monthSale: this.tableData.monthSale,
                    violationContent: this.tableData.violationContent,
                    recordRegionName: this.tableData.recordRegionName,
                    opTime: this.tableData.opTime,
                }
                console.log(data)
                if (v === 1) {
                    this.$http({
                        url: "/market/cwcompetitor/writeImg",
                        method: "post",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        responseType: "blob",
                        data: data,
                    }).then((response) => {
                        if (window.navigator && window.navigator.msSaveOrOpenBlob) {
                            let blob = new Blob([response.data], {
                                type: 'application/vnd.ms-excel'
                            })
                            window.navigator.msSaveOrOpenBlob(blob,
                                new Date().getTime() + '.png')
                        } else {
                            /* 火狐谷歌的文件下载方式 */
                            var blob = new Blob([response.data])
                            var downloadElement = document.createElement('a')
                            var href = window.URL.createObjectURL(blob)
                            downloadElement.href = href
                            downloadElement.download = new Date().getTime() + '.png'
                            document.body.appendChild(downloadElement)
                            downloadElement.click()
                            document.body.removeChild(downloadElement)
                            window.URL.revokeObjectURL(href)
                        }
                    });
                } else {
					data.id = this.tableData.id;
                    this.$http({
                        url: "/market/cwcompetitor/write2Doc",
                        method: "post",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        responseType: "blob",
                        data: data,
                    }).then((response) => {
                        if (window.navigator && window.navigator.msSaveOrOpenBlob) {
                            let blob = new Blob([response.data], {
                                type: 'application/vnd.ms-excel'
                            })
                            window.navigator.msSaveOrOpenBlob(blob,
                                new Date().getTime() + '.docx')
                        } else {
                            /* 火狐谷歌的文件下载方式 */
                            var blob = new Blob([response.data])
                            var downloadElement = document.createElement('a')
                            var href = window.URL.createObjectURL(blob)
                            downloadElement.href = href
                            downloadElement.download = new Date().getTime() + '.docx'
                            document.body.appendChild(downloadElement)
                            downloadElement.click()
                            document.body.removeChild(downloadElement)
                            window.URL.revokeObjectURL(href)
                        }
                    });
                }
            },
            //时间转换
            timeChange(v) {
                var time = new Date(v);
                var y = time.getFullYear();
                var m = time.getMonth() + 1;
                m < 10 ? '0' + m : m;
                var d = time.getDate();
                d < 10 ? '0' + d : d;
                var h = time.getHours();
                h < 10 ? '0' + h : h;
                var mm = time.getMinutes();
                mm < 10 ? '0' + mm : mm;
                var s = time.getSeconds();
                s < 10 ? '0' + s : s;
                return y + '-' + m + '-' + d + ' ' + h + ':' + mm + ':' + s;
            },
        },
        mounted() {

        },
        created() {
            this.infotype = this.$route.query.type * 1;
            this.infotype === 1 ? this.tooltit = '竞争对手信息收集' : this.tooltit = '竞争对手信息审核';
            this.getInfo(this.$route.query.id);
        }
    }
</script>
<style scoped lang="scss">
    @import "../../../assets/style";

    .titbox {

        span {
            padding-left: 10px;
        }
    }

    .checknum {
        border: 3px dotted #f0f0f0;
        padding: 10px 20px;
        margin-top: 10px;

        span {
            display: inline-block;
            width: 33%;
            padding-left: 10px;
            height: 36px;
            line-height: 36px;
            color: #aaa;
        }
    }

    .tab-boxinfo {
        border: 2px solid #f0f0f0;
        margin-top: 10px;
        color: #4b4b4b;
        height: calc(100% - 330px);
        overflow-y: scroll;

        .box-line {
            height: 34px;
            line-height: 34px;
            padding-left: 20px;
            font-size: 14px;
            width: 33.3%;
            display: inline-block;

            span {
                display: inline-block;
                width: 100px;
            }

            div {
                display: inline-block;
                width: calc(100% - 100px);
            }
        }

        .box-line-bg {
            background: #FAFAFA;
        }
    }

    .titbtn-box {
        text-align: right;
        margin-top: 20px;

        button {
            min-width: 100px;
        }
    }
</style>
