<template>
    <div class="materialInformation">
      <div class="crumbs">
        <Breadcrumb
          :breadcrumbOpt="breadcrumbOpt"
          svg-name="#icon-audit"
          @breadcrumb-click="handleClose"
        />
      </div>
      <div class="content">
        <div class="common-page-shadow">
          <div class="material-management">
            <el-tabs v-model="activeName" @tab-click="handleClick">
              <el-tab-pane label="成交明细" name="first"> </el-tab-pane>
              <el-tab-pane label="招标文件" name="five"></el-tab-pane>
              <el-tab-pane label="投标文件" name="second"></el-tab-pane>
              <el-tab-pane label="澄清提问" name="question"></el-tab-pane>
              <el-tab-pane label="补遗文件" name="addendum"></el-tab-pane>
            </el-tabs>
          </div>
  
          <el-row class="common-table-container flex searchPanel">
            <el-col :span="24" class="common-table-wrapper">
              <!-- LJ：表格高度自适应需配合样式  btn-pagenation 有按钮有分页  btngroup只有按钮  pagenation只有分页 -->
              <div class="score-table" v-if="activeName === 'first'">
                <div class="common-table-content btn-pagenation">
                  <el-table
                    :border="true"
                    stripe
                    fit
                    size="mini"
                    v-loading="tableLoading"
                    height="100%"
                    ref="multipleSelection"
                    :data="tableData"
                  >
                    <el-table-column
                      type="index"
                      width="55"
                      align="center"
                      label="序号"
                    >
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="noticeCode"
                      min-width="100"
                      show-overflow-tooltip
                      label="项目编号"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="noticeName"
                      min-width="100"
                      show-overflow-tooltip
                      label="项目名称"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="noticeType"
                      show-overflow-tooltip
                      min-width="100"
                      label="项目类型"
                    >
                      <template slot-scope="scope">
                        <span v-if="scope.row.noticeType == 1">物资</span>
                        <span v-if="scope.row.noticeType == 2">项目</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="procureOrgCode"
                      show-overflow-tooltip
                      min-width="100"
                      label="需求企业编号"
                    >
                    </el-table-column
                    ><el-table-column
                      align="center"
                      prop="procureOrgName"
                      show-overflow-tooltip
                      min-width="120"
                      label="需求企业名称"
                    >
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="operateTime"
                      show-overflow-tooltip
                      min-width="120"
                      label="定标日期"
                    ></el-table-column>
                    <el-table-column
                      label="成交人补充说明"
                      min-width="180"
                      prop="tenderExplain"
                    >
                    </el-table-column>
                    <el-table-column
                      label="挂账日期(月)"
                      min-width="100"
                      prop="pendingTime"
                    >
                    </el-table-column>
                    <el-table-column
                      label="承兑日期(月)"
                      min-width="100"
                      v-if="form.quotationMethod == 2"
                      prop="acceptanceTime"
                    >
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="quotationOrgCode"
                      min-width="100"
                      show-overflow-tooltip
                      label="成交供应商编号"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="quotationOrgName"
                      show-overflow-tooltip
                      min-width="100"
                      label="成交供应商名称"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="score"
                      show-overflow-tooltip
                      min-width="90"
                      v-if="$route.query.evaluationMethod == 2"
                      label="得分"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="shareAllocationNum"
                      min-width="100"
                      v-if="$route.query.evaluationMethod == 1"
                      show-overflow-tooltip
                      label="成交数量"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="shareAllocationNum"
                      min-width="100"
                      v-if="$route.query.evaluationMethod == 2"
                      show-overflow-tooltip
                      label="成交数量"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="matUnit"
                      show-overflow-tooltip
                      min-width="100"
                      label="计量单位"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="quotationMethod"
                      show-overflow-tooltip
                      min-width="100"
                      label="付款方式"
                    >
                      <template v-slot="{row}">
                        <span v-if="row.quotationMethod == 1">现金</span>
                        <span v-if="row.quotationMethod == 2">承兑</span>
                        <span v-if="row.quotationMethod == 3">其他</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="isTax"
                      show-overflow-tooltip
                      min-width="100"
                      label="是否含税"
                    >
                      <template v-slot="{row}">
                        <span v-if="row.isTax == 1">含税</span>
                        <span v-if="row.isTax == 2">不含税</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="quotationPrice"
                      show-overflow-tooltip
                      min-width="100"
                      label="成交价格(元)"
                    ></el-table-column>
                    <el-table-column
                      align="center"
                      prop="quotationAmount"
                      min-width="100"
                      v-if="$route.query.evaluationMethod == 1"
                      show-overflow-tooltip
                      label="成交金额(元)"
                    >
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="quotationAmount"
                      min-width="100"
                      v-if="$route.query.evaluationMethod == 2"
                      show-overflow-tooltip
                      label="成交金额(元)"
                    >
                    </el-table-column>
                    <el-table-column
                      align="center"
                      prop="taxRate"
                      show-overflow-tooltip
                      min-width="100"
                      label="税率(%)"
                    ></el-table-column>
                  </el-table>
                </div>
                <div class="common-pagenation">
                  <el-pagination
                    ref="paginationPanel"
                    background
                    :current-page="params.pageBean.page"
                    :page-sizes="[20, 30, 40, 50]"
                    :page-size="params.pageBean.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="params.pageBean.total"
                  >
                  </el-pagination>
                </div>
              </div>
              <!-- 投标文件 -->
              <div class="quote-content" v-if="activeName === 'second'">
                <div class="content">
                  <el-table
                    class="down"
                    v-loading="tableLoading"
                    :data="bidFileList"
                    :border="true"
                    stripe
                    fit
                  >
                    <el-table-column
                      prop="createOrgName"
                      key="second"
                      label="投标企业"
                    ></el-table-column>
                    <el-table-column
                      prop="name"
                      :key="activeName === 'second'"
                      label="文件名称"
                    ></el-table-column>
                    <el-table-column width="150px" label="操作" :key="activeName === 'second'">
                      <template slot-scope="scope">
                        <el-button size="small" type="text">
                          <a @click="downloadFile(scope.row.name, scope.row.url)"
                            >下载</a
                          >
                        </el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
              <!-- 澄清提问 -->
              <div class="quote-content" v-if="activeName === 'question'">
                <div class="content">
                  <el-table
                    class="down"
                    :data="clarifyList"
                    :border="true"
                    stripe
                    fit
                    height="100%"
                  >
                    <el-table-column
                      prop="describe"
                      label="提问企业"
                      show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                      prop="describe"
                      label="描述"
                      show-overflow-tooltip
                    ></el-table-column>
  
                    <el-table-column
                      prop="operateTime"
                      label="提出时间"
                      show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                      prop="name"
                      :key="activeName === 'question'"
                      label="文件名称"
                    ></el-table-column>
                    <el-table-column width="120px" label="操作" :key="activeName === 'question'">
                      <template slot-scope="scope">
                        <el-button size="small" type="text">
                          <a @click="downloadFile(scope.row.name, scope.row.url)"
                            >下载</a
                          >
                        </el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
              <!-- 补遗文件 -->
              <div class="quote-content" v-if="activeName === 'addendum'">
                <div class="content">
                  <el-table
                    class="down"
                    v-loading="tableLoading"
                    :data="SupplementList"
                    border
                    stripe
                  >
                    <el-table-column
                      prop="describe"
                      key="addendum"
                      label="描述"
                      show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                      prop="name"
                      :key="activeName === 'addendum'"
                      label="文件名称"
                    ></el-table-column>
                    <el-table-column label="操作" :key="activeName === 'addendum'">
                      <template slot-scope="scope">
                        <el-button size="small" type="text">
                          <a @click="downloadFile(scope.row.name, scope.row.url)"
                            >下载</a
                          >
                        </el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
              <!-- 招标文件 -->
              <div class="quote-content" v-if="activeName === 'five'">
                <div class="content">
                  <el-table
                    class="down"
                    v-loading="tableLoading"
                    :data="TenderList"
                    border
                    stripe
                  >
                    <el-table-column
                      prop="name"
                      :key="activeName === 'five'"
                      label="文件名称"
                    ></el-table-column>
                    <el-table-column label="操作" :key="activeName === 'five'">
                      <template slot-scope="scope">
                        <el-button size="small" type="text">
                          <a @click="downloadFile(scope.row.name, scope.row.url)"
                            >下载</a
                          >
                        </el-button>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import Breadcrumb from '@/components/Breadcrumb/index.vue'
  export default {
    name: 'domesticDialog',
    components: {Breadcrumb},
    props: {
      editData: Object,
    },
    data() {
      return {
        breadcrumbOpt: [
          {breadcrumbName: '成交通知'},
          {breadcrumbName: '成交明细'},
        ],
        tableData: [],
        tableLoading: false,
        searchForm: {
          'a.NOTICE_ID_': '',
          quotationOrgName: '',
        }, // 顶部搜索对象
        activeName: 'first',
        params: {
          pageBean: {
            page: 1,
            pageSize: 20,
            total: 0,
          },
          querys: [],
        },
        form: {},
        currentUser: {},
        bidFileList:[], //投标文件
        SupplementList:[], //补遗文件
        clarifyList:[], //澄清补遗
        TenderList:[], //
      }
    },
    created() {
      this.currentUser = JSON.parse(sessionStorage.getItem('currentUserDetail'))
      this.form = this.$route.query.rows
      this.searchForm['a.NOTICE_ID_'] = this.$route.params.id
      this.handleSearch()
    },
    mounted() {},
    methods: {
      // tab栏切换
      handleClick() {
        if (this.activeName == 'first') {
          this.loadData()
        }
        if (this.activeName == 'second') {
          this.tableLoading = true
          this.bidFileList = []
          let parmas = {
            pageBean: {
              pageSize: -1,
              page: -1,
            },
            querys: [],
          }
          parmas.querys.push(
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'projectApprovalId',
              relation: 'AND',
              value: this.$route.params.id,
            },
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'projectApprovalType',
              relation: 'AND',
              value: 2,
            }
          )
          if (!this.getMethodauth('Transaction_View')) {
            parmas.querys.push({
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'supplierId',
              relation: 'AND',
              value: this.currentUser.org[0].orgId,
            })
          }
          this.$http
            .post('${portal}/bidDocuments/v1/page', parmas)
            .then((res) => {
              this.tableLoading = false
              let data = res.data.value.rows
              data.forEach((item) => {
                if (item.accessoryList && item.accessoryList.length != 0) {
                  item.accessoryList.forEach((val) => {
                    if (item.id == val.sourceId) {
                      this.bidFileList.push(val)
                    }
                  })
                }
              })
            })
        }
        if (this.activeName == 'question') {
          let parmas = {
            pageBean: {
              pageSize: -1,
              page: -1,
            },
            querys: [],
          }
          parmas.querys.push({
            group: 'main',
            operation: 'EQUAL',
            parentGroup: '',
            property: 'projectApprovalId',
            relation: 'AND',
            value: this.$route.params.id,
          })
          this.$http
            .post('${portal}/clarifyQuestions/v1/pageAndAnswer', parmas)
            .then((res) => {
              this.clarifyList = []
              if (res.data.state) {
                this.clarifyList = res.data.value.rows
                this.clarifyList.forEach((item) => {
                  if (item.accessoryList && item.accessoryList.length) {
                    item.accessoryList.forEach((val) => {
                      item.name = val.name
                      item.url = val.url
                    })
                  }
                })
              }
            })
        }
        if (this.activeName == 'addendum') {
          this.tableLoading = true
          this.SupplementList = []
          let parmas = {
            pageBean: {
              pageSize: -1,
              page: -1,
            },
            querys: [],
          }
          parmas.querys.push(
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'projectApprovalId',
              relation: 'AND',
              value: this.$route.params.id,
            },
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'projectApprovalType',
              relation: 'AND',
              value: 2,
            },
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'type',
              relation: 'AND',
              value: 2,
            }
          )
          this.$http
            .post('${portal}/tenderDocument/v1/pageAccessory', parmas)
            .then((res) => {
              this.tableLoading = false
              let data = res.data.value.rows
              data.forEach((item) => {
                if (item.accessoryList && item.accessoryList.length != 0) {
                  item.accessoryList.forEach((val) => {
                    if (item.id == val.sourceId) {
                      val.describe = item.describe
                      this.SupplementList.push(val)
                    }
                  })
                }
              })
            })
        }
        if (this.activeName == 'five') {
          this.tableLoading = true
          this.TenderList = []
          let parmas = {
            pageBean: {
              pageSize: -1,
              page: -1,
            },
            querys: [],
          }
          parmas.querys.push(
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'projectApprovalId',
              relation: 'AND',
              value: this.$route.params.id,
            },
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'projectApprovalType',
              relation: 'AND',
              value: 2,
            },
            {
              group: 'main',
              operation: 'EQUAL',
              parentGroup: '',
              property: 'type',
              relation: 'AND',
              value: 1,
            }
          )
          this.$http
            .post('${portal}/tenderDocument/v1/pageAccessory', parmas)
            .then((res) => {
              this.tableLoading = false
              let data = res.data.value.rows
              data.forEach((item) => {
                if (item.accessoryList && item.accessoryList.length != 0) {
                  item.accessoryList.forEach((val) => {
                    if (item.id == val.sourceId) {
                      this.TenderList.push(val)
                    }
                  })
                }
              })
            })
        }
      },
      //获取列表
      loadData(params) {
        this.tableLoading = true
        let url = ''
        if (this.$route.query.evaluationMethod == 2) {
          url = '/bidEvaluation/v1/getCalibraDetailComprehensiveById'
        }
        if (this.$route.query.evaluationMethod == 1) {
          url = '/bidEvaluation/v1/getCalibraDetailById'
        }
        this.$http.post('${portal}' + url, this.params).then((res) => {
          if (res.data.state) {
            this.tableData = res.data.value.rows
            this.tableData.forEach((item) => {
              this.$set(item, 'quotationMethod', this.form.quotationMethod)
              this.$set(item, 'isTax', this.form.isTax)
            })
            console.log(this.tableData)
            this.params.pageBean.page = res.data.value.page
            this.params.pageBean.pageSize = res.data.value.pageSize
            this.params.pageBean.total = res.data.value.total
          }
          this.tableLoading = false
        })
      },
      // 关闭//面包屑点击
      handleClose() {
        this.$router.push({
          name: 'notificationWinningBid',
          params: {
            tabsActiveName: 'projectNotification',
            pageBean: this.$route.query.pageBean,
          },
        })
      },
      //重置
      clearSearchForm() {
        this.searchForm = {
          'a.NOTICE_ID_': this.$route.params.id,
          quotationOrgName: '',
        }
        this.handleSearch()
      },
      // 顶部搜索
      handleSearch() {
        let obj = this.searchForm
        console.log(obj, 1111111111)
        let querys = []
        for (let i in obj) {
          if (obj[i]) {
            querys.push({
              group: 'main',
              operation:
                i == 'quotationOrgName' || i == 'companyName' ? 'LIKE' : 'EQUAL',
              parentGroup: '',
              property: i,
              relation: 'AND',
              value: obj[i],
            })
          }
        }
        console.log(querys, 'querys')
        this.params.querys = querys
        this.loadData()
      },
      handleCurrentChange(page) {
        this.queryParam.pageBean = {...this.params.pageBean, page}
        this.loadData()
      },
      handleSizeChange(pageSize) {
        this.queryParam.pageBean = {...this.params.pageBean, pageSize}
        this.loadData()
      },
      getMethodauth(elAuth) {
        let allMethod = window.sessionStorage.allMethod
        let methodAuth = window.sessionStorage.methodAuth
        let allMethodArray = allMethod && allMethod.split(',')
        let methodAuthArray = methodAuth && methodAuth.split(',')
        // 无权限则隐藏按钮
        if (
          methodAuthArray &&
          methodAuthArray.includes(elAuth) &&
          allMethodArray &&
          allMethodArray.includes(elAuth)
        ) {
          return true
        } else {
          return false
        }
      },
    },
  }
  </script>
  
  <style lang="scss" scoped>
  .materialInformation {
    width: 100%;
    height: 100%;
    .content {
      width: 100%;
      height: calc(100% - 70px);
      margin-top: 10px;
      .common-page-shadow {
        width: 100%;
        height: calc(100%);
        box-sizing: border-box;
        .common-table-container {
          margin: 0;
          height: calc(100% - 80px);
          .common-table-wrapper {
            height: 100%;
            .score-table {
              height: 100%;
              .table {
                height: calc(100% - 50px);
              }
            }
            .quote-content {
              height: 100%;
              position: relative;
              .content {
                height: calc(100% - 70px);
                overflow-y: scroll;
              }
              .btn {
                width: 100%;
                position: absolute;
                bottom: 16px;
                display: flex;
                justify-content: center;
              }
            }
          }
        }
      }
    }
  }
  
  .rows {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 16px;
    padding: 10px 0;
    .rows-left {
      margin-right: 10px;
      .rows-hr {
        width: 3px;
        height: 18px;
        background-color: #0e6eff;
        border-radius: 2px;
      }
    }
    .rows-title {
      .text-overflow {
        width: 100%;
        font-size: 16px;
      }
    }
  }
  </style>
  