<template>
  <div class="details">
    <div class="flex-between t1">
      <div class="flex">
        <div>项目名称：</div>
        <div>{{ formdata.itemTitle }}</div>
      </div>
      <div class="flex">
        <div>项目编号：</div>
        <div>{{ formdata.itemCode }}</div>
      </div>
      <div class="flex">
        <div>日期：</div>
        <div>{{ formdata.itemTime }}</div>
      </div>
    </div>

    <div class="ueditor" v-show="isshow">
      <div>
        <div class="home">
          <!-- <breadCrumb :breads="breads"></breadCrumb> -->
          <h1>{{ formdata.itemTitle }}</h1>
          <div class="flex-center">
            <h6 style="margin-right: 60px; margin-top: 30px">
              询价所在地:{{ formdata.area }}
            </h6>
            <h6 style="margin-buttom: 60px; margin-top: 30px">
              日期:{{ formdata.itemTime }}
            </h6>
          </div>
          <div class="form">
            <h3 style="margin-buttom: 30px">基本信息</h3>
            <table border="0" width="100%" height="120px">
              <tr>
                <td>询价单编号</td>
                <td>{{ formdata.itemCode }}</td>
                <td>采购记录</td>
                <td>{{ formdata.record }}</td>
                <td>项目优先级</td>
                <td>{{ formdata.priority }}</td>
              </tr>
              <tr>
                <td>报价开始时间</td>
                <td>{{formdata.startTime}}</td>
                <td>报价截止时间</td>
                <td :time="endtime" @change="gettimer">
                  {{formdata.endTime}}
                </td>
                <td>采购单位</td>
                <td>{{ formdata.Purchasing }}</td>
              </tr>
              <tr>
                <td>采购单位联系人</td>
                <td>{{ formdata.purchasingpPerson }}</td>
                <td>联系方式</td>
                <td>{{ formdata.phone }}</td>
                <td>传真号码</td>
                <td>{{ formdata.faxphone }}</td>
              </tr>
            </table>
            <div class="appendix">
              <div>预算金额(元)</div>
              <div>{{ formdata.price }}</div>
            </div>
            <h3>供应商要求</h3>
            <div class="appendix">
              <div>供应商规模要求</div>
              <div>{{ formdata.Grequirements }}</div>
            </div>
            <div class="appendix">
              <div>供应商资格要求</div>
              <div>{{ formdata.Zrequirements }}</div>
            </div>
            <div class="appendix">
              <div>供应商区域范围要求</div>
              <div>{{ formdata.arearequirements }}</div>
            </div>
            <h3>询价商品清单</h3>
            <dataTable :table-data="tabledata" :columns="columns" :isPageobj="false"></dataTable>
            <div class="appendix list pos" style="margin-top:20px">
              <div>附件</div>
              <a :href="item.accessoryUrl" target="_blank" v-for="(item,i) in fileList" :key="i">{{item.fileName}}</a>
              <!-- 此处放文件 -->
            </div>
            <h3>商务要求</h3>
            <div class="appendix bus-require pos ">
              <div class="flex-center" style="width:100px;height:100px">
                <p>商务要求</p>
              </div>
              <div>{{ formdata.content }}</div>
            </div>
            <div class="button flex">
              <el-button @click="prev"
                >返回</el-button
              >
              <el-button
                type="primary"
                @click="putPrice"
                v-show="isshowbutton"
                >我要报价</el-button
              >
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import dataTable from "@/components/dataTable.vue";
import breadCrumb from "@/components/dataBreadcrumb.vue";
import { getenquirydetails } from "@/common/list.js";
import Cookies from "js-cookie"
import noticeVue from '../notice.vue';
export default {
  components: {
    dataTable,
    breadCrumb,
  },
  mounted() {
    let id = this.$route.query.id;
     let message = {}
    message.currentPage = 1
    message.size = 10 
    console.log(id + "----------------------++++++++++++++++++");
    this.getenquirydetails(id);
    let number1 = Cookies.get("isSupplier")
    if(number1 ==='1'){
      this.isshowbutton = !this.isshowbutton
    }
    let enquiryId = window.location.href.split("?id=")[1] 
    Cookies.set("Id",enquiryId)
  },
  data() {
    return {
      fileList:[],
      PROid:'',
      tableData1:[],
      PdialogVisible:false,
      total:0,
      currentPage:1,
      size:10,
      formdata: {
        itemTitle: "",
        itemCode: "",
        itemTime: "",
        area: "",
        record: "",
        priority: "",
        startTime: "",
        endTime: "",
        Purchasing: "",
        purchasingpPerson: "",
        phone: "",
        faxphone: "",
        price: "",
        style: "",
        Grequirements: "",
        Zrequirements: "",
        arearequirements: "",
        content:"",
      },
      endtime: "",
      isshow: true,
      isshowbutton: true,
      dialogFormVisible: false,
      tabledata: [
      ],
      columns: [
        {
          label: "标的名称",
          prop: "bidName",
        },
        {
          label: "数量",
          prop: "quantity",
        },
        {
          label: "计量单位",
          prop: "unit",
        },
        {
          label: "品牌",
          prop: "brand",
        },
        {
          label: "规格型号",
          prop: "specification",
        },
        {
          label: "标杆价(元)",
          prop: "price",
        },
        {
          label: "备注",
          prop: "remark",
        },
      ],
    };
  },
  methods: {
    //先判断是否登录
    putPrice(){
      let tokenStr = Cookies.get("token")
      if(!tokenStr){
        Cookies.set("status",1)
        this.$router.push("/login/user")
      }else{
        let number = Cookies.get("isSupplier")
        if(number =='2'){
          let token = Cookies.get("token")
           /*  window.open(`http://60.205.251.80:8082/#/supply/bid/signupOnline/seePrice?id=${this.PROid}&token=${token}`) */
            window.open(`http://60.205.251.80:8082/#/supply/home?token=${token}`)
        }
      }
    },
    prev() {
      /* let size = Cookies.get("size")||10
      let currentPage = Cookies.get("currentPage")||1
      this.$router.push(`/notice/inquiry/?size=${size}&currentPage=${currentPage}&noticeType=ENQUIRY`) */
      window.history.back()
    },
    async getenquirydetails(params) {
      const { data } = await getenquirydetails(params);
      console.log(data, 123);
      this.formdata.itemTitle = data.title;
      this.formdata.itemCode = data.nameAndCodeVO.projectCode;
      this.formdata.itemTime = data.createTime;
      this.formdata.area = data.area;
      this.formdata.record = data.purchaseCategory;
      let a = data.priority;
      if (a === 0) {
        a = "普通";
      } else {
        a = "紧急";
      }
      this.formdata.priority = a;
      this.formdata.startTime = data.startTime;
      this.formdata.endTime = data.endTime;
      this.formdata.Purchasing = data.purchaseAgent;
      this.formdata.purchasingpPerson = data.contact;
      this.formdata.phone = data.contactPhone;
      this.formdata.faxphone = data.facsimile;
      this.formdata.price = data.budget;
      this.formdata.Grequirements = data.supplierScale;
      this.formdata.Zrequirements = data.supplierQualification;
      this.formdata.arearequirements = data.supplierRegion;
      let b = data.commodityVOList;
      console.log(b, 4546465446);
      this.tabledata = b;
      console.log(data, 7897897878);
      this.list = data.accessoryVOList;
      // this.fileA = data.accessoryVOList.fileName;
      this.formdata.content = data.commercialRequirements
      this.PROid = data.projectId
      this.fileList = data.accessoryVOList
      console.log(this.PROid+'----------------------------')
    },
    //截止时间到,隐藏我要报价按钮
    gettimer() {
      let d = new Date();
      if (this.form.endtime.getTime() < d.getTime()) {
        this.isshowbutton = false;
        this.PdialogVisible = true
      }
    },
  },
};
</script>
<style>
.details {
  width: 9.3rem;
}
.details .t1 {
  width:9.3rem
}
.details > div text {
  color: #979899;
}
.Tips {
  color: #409eff;
}
.notice > h4 {
  font-size: 16px;
  font-weight: bold;
  margin-right: 30px;
}
.notice {
  margin: 20px 0;
  border-bottom: 1px solid #ccc;
}
h2 {
  /* margin-top:; */
  margin-bottom: 10px;
}
h6 {
  margin-bottom: 10px;
}
.home {
  padding: 0px;
  background: #fff;
  box-sizing: border-box;
  /* margin-left:20px; */
}
h1 {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
.form {
  padding: 20px;
  box-sizing: border-box;
}
.form h3 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-weight: bold;
}
.form td{
  font-size:10px
}

table {
  border-collapse: collapse;
}
table > tr > td {
  font-size: 16px;
  border: 1px solid #ccc;
  padding-left: 10px;
}
table > tr > td:nth-child(odd) {
  background: #f0f0f0;
}

.appendix {
  display: flex;
  border: 1px solid #ccc;
}
.appendix > div:first-child {
  width: 159px;

  border-right: 1px solid #ccc;
  box-sizing: border-box;
  padding-left: 10px;
}
.appendix > div:last-child {
  padding-left: 10px;
}
.appendix > div:nth-child(odd) {
  background: #f0f0f0;
}
.appendix > div {
  font-size: 10px;
  line-height: 40px;
}
.list > :first-child {
  height: 120px;
  line-height: 120px;
}
.list {
  margin-top: 20px;
}
.bus-require > div:first-child {
  width: 400px;
}
.bus-require > div:last-child {
  font-size: 10px;
}
.pos > div:first-child {
  display: flex;
  justify-content: center;
}

.last-pos {
  margin-left: 40px;
  margin-top: 20px;
}
.last-pos > div:first-child {
  width: 65px;
}
input {
  width: 100%;
  height: 70px;
}
.button {
  width: 100px;
  margin: 50px auto;
}
</style>
