<template>
  <div class="common-page-content">
    <div class="common-search-container" ref="contentPanel">
      <el-form
        ref="form"
        :model="searchForm"
        label-width="auto"
        label-position="right "
        :inline="true"
        type="flex"
        justify="left"
      >
        <el-form-item label="供应商名称">
          <el-input
            size="small"
            v-model="searchForm.supplier_name_"
            clearable
            placeholder="请输入供应商名称"
          ></el-input>
        </el-form-item>
        <el-form-item label="状态">
          <dict-select
            dictCode="gyszrshzt"
            :hasDefaultOption="true"
            size="small"
            style="width: 100%"
            clearable
            v-model="searchForm.reviewStatus"
            placeholder="请选择审核状态"
          />
        </el-form-item>
      </el-form>
      <div class="container-btn">
        <el-button
          size="small"
          icon="el-icon-search"
          type="danger"
          class="btn btn-plus"
          @click="handleSearch"
        >
          搜索
        </el-button>
        <el-button
          size="small"
          icon="el-icon-refresh-right"
          class="btn btn-plus"
          @click="clearSearchForm"
        >
          重置
        </el-button>
      </div>
    </div>
    <el-row
      class="common-table-container flex searchPanel"
      :style="SearchPanel"
    >
      <el-col :span="24" class="common-table-wrapper">
        <div class="common-btn-group">
          <el-button
            size="small"
            icon="el-icon-plus"
            type="primary"
            class="btn btn-plus"
            @click="handleAdd"
          >
            新增
          </el-button>
          <el-button
            size="small"
            slot="reference"
            icon="el-icon-delete"
            type="danger"
            v-if="searchForm.reviewStatus == 4"
            class="btn btn-delete"
            @click="handleDelete"
          >
            {{ this.$t('common.delete') }}
          </el-button>
          <el-button
            size="small"
            icon="el-icon-thumb"
            :loading="rejectDialog"
            type="primary"
            v-if="searchForm.reviewStatus == 4"
            class="btn btn-plus"
            @click="handleSend"
          >
            下发至供应商
          </el-button>
        </div>
        <!-- LJ：表格高度自适应需配合样式  btn-pagenation 有按钮有分页  btngroup只有按钮  pagenation只有分页 -->
        <div class="common-table-content btn-pagenation">
          <el-table
            :border="true"
            stripe
            fit
            size="mini"
            v-loading="tableLoading"
            ref="multipleSelection"
            :data="tableData"
            @selection-change="handleSelectionChange"
          >
            <el-table-column type="selection" min-width="50px" align="center">
            </el-table-column>
            <el-table-column
              prop="enterpriseCode"
              show-overflow-tooltip
              min-width="110px"
              align="center"
              label="企业编号"
              resizable
            >
            </el-table-column>
            <el-table-column
              prop="enterpriseName"
              show-overflow-tooltip
              min-width="130px"
              align="center"
              label="企业名称"
              resizable
            >
            </el-table-column>
            <el-table-column
              prop="supplierCode"
              min-width="110px"
              label="供应商编号"
              align="center"
              resizable
            >
            </el-table-column>
            <el-table-column
              prop="supplierName"
              min-width="130px"
              label="供应商名称"
              show-overflow-tooltip
              align="center"
              resizable
            >
            </el-table-column>
            <el-table-column
              prop="categoryName"
              min-width="100px"
              label="供应商分类"
              align="center"
              resizable
            >
            </el-table-column>
            <!-- <el-table-column
              prop="level"
              min-width="100px"
              label="供应商分级"
              align="center"
              resizable
            >
              <template v-slot="{row}">
                {{ getDictName('gysfj', row.level) }}
              </template>
            </el-table-column> -->
            <el-table-column
              prop="level"
              min-width="100px"
              label="状态"
              align="center"
              resizable
            >
              <template slot-scope="scope">
                <el-tag type="info" v-if="scope.row.reviewStatus == 0"
                  >未审核</el-tag
                >
                <el-tag type="waring" v-if="scope.row.reviewStatus == 1"
                  >审核中</el-tag
                >
                <el-tag type="success" v-if="scope.row.reviewStatus == 2"
                  >已审核</el-tag
                >
                <el-tag type="danger" v-if="scope.row.reviewStatus == 3"
                  >驳回</el-tag
                >
                <el-tag type="info" v-if="scope.row.reviewStatus == 4"
                  >草稿</el-tag
                >
              </template>
            </el-table-column>
            <el-table-column
              min-width="120px"
              label="操作"
              align="center"
              v-if="searchForm.reviewStatus==4"
              resizable
            >
              <template slot-scope="scope">
                <el-button type="primary" size="small" v-if="searchForm.reviewStatus==4" @click="handleEdit(scope.row)" icon="el-icon-edit">编辑</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="common-pagenation">
          <el-pagination
            ref="paginationPanel"
            background
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="pageResult.page"
            :page-sizes="[20, 30, 40, 50]"
            :page-size="pageResult.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="pageResult.total"
          >
          </el-pagination>
        </div>
      </el-col>
    </el-row>
    <!-- 资质附件 -->
    <el-dialog
      title="资质附件"
      :visible.sync="dialogVisible"
      width="70%"
      v-loading="loading"
      class="view-qualification"
      :before-close="dialogBeforeClose"
      top="5vh"
    >
      <el-form label-width="80px" style="font-size: 20px !important;" v-for="item in form.qualificationLabelList"
          :key="item.qualificationTypeCode">
        <el-form-item
          :label="item.qualificationTypeName"
          style="font-weight: bold;margin: 0 !important;"
        ></el-form-item>
        <el-table
          class="down"
          :data="item.accessoryList"
          border
          stripe
          height="100%"
          v-if="item.accessoryList"
          style="width: 100%;"
        >
        <el-table-column prop="qualificationCode" label="资质编码"></el-table-column>
        <el-table-column prop="qualificationName" label="资质名称"></el-table-column>
        <el-table-column prop="qualificationAcquisitionDate" label="有效开始期"></el-table-column>
        <el-table-column prop="expiryDate" label="有效截至期"></el-table-column>
          <el-table-column prop="name" show-overflow-tooltip label="文件名称"></el-table-column>
          <el-table-column prop="size" label="文件大小">
            <template slot-scope="scope">
              <span v-if="scope.row.fileSize">{{ scope.row.fileSize }}</span>
              <template v-else>
                <span v-if="scope.row.size / 1024 / 1024 < 1">{{
                  (scope.row.size / 1024).toFixed(2) + 'KB'
                }}</span>
                <span v-else>{{
                  (scope.row.size / 1024 / 1024).toFixed(2) + 'MB'
                }}</span>
              </template>
            </template>
          </el-table-column>
          <el-table-column prop="createTime" label="上传时间">
            <template slot-scope="scope">
              <div>
                {{ scope.row.createTime }}
              </div>
            </template>
          </el-table-column>
          <el-table-column width="150px" label="操作">
            <template slot-scope="scope">
              <el-button size="small" type="text">
                <a
                  target="_blank"
                  @click="downloadFile(scope.row.name, scope.row.url)"
                  >下载</a
                >
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form>

      <div slot="footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="handleAudit" :loading="loadingBtn"
          >审 核</el-button
        >
      </div>
    </el-dialog>
    <!-- 审核记录 -->
    <el-dialog
      title="审核记录"
      :visible.sync="visible"
      width="60%"
      :before-close="dialogBeforeClose"
    >
      <el-table
        class="down"
        :data="authList"
        border
        stripe
        style="width: 100%; margin-top: 20px"
      >
        <el-table-column prop="reviewerName" label="审核人"></el-table-column>
        <el-table-column prop="reviewTime" label="审核时间"></el-table-column>
        <el-table-column prop="createTime" label="审核状态">
          <template slot-scope="scope">
            <el-tag type="success" v-if="scope.row.reviewResult == 1"
              >通过</el-tag
            >
            <el-tag type="danger" v-if="scope.row.reviewResult == 0"
              >驳回</el-tag
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="rejectionReason"
          label="驳回原因"
        ></el-table-column>
      </el-table>
      <div slot="footer">
        <el-button @click="visible = false">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 驳回弹窗 -->
    <el-dialog
      title="驳回窗口"
      :visible.sync="rejectDialog"
      width="width"
      :close-on-click-modal="false"
      :before-close="dialogBeforeClose"
    >
      <el-form ref="form" :model="rejectionReason" label-width="80px">
        <el-form-item label="驳回原因" prop="rejectionReason">
          <el-input
            v-model="rejectionReason"
            type="textarea"
            placeholder="请输入驳回原因"
          ></el-input>
        </el-form-item>
        <!-- <el-form-item label="附件上传" prop="rejectionReason">
            <el-input
              v-model="rejectionReason"
              type="textarea"
              placeholder="请输入驳回原因"
            ></el-input>
          </el-form-item> -->
      </el-form>
      <div slot="footer">
        <el-button @click="rejectDialog = false">取 消</el-button>
        <el-button type="primary" @click="saveReject" :loading="loadingBtn"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>
  
  <script>
import supplierManger from '@/api/supplierManger.js'
import pagination from '@/components/pagination'
import {TableMixin} from '@/mixins/tableMixin'
import routerManagement from '@/api/BasicDataManagement/routerManagement.js'
import req from '@/request.js'
import utils from '@/utils.js'
export default {
  name: 'DemandEntry',
  components: {
    pagination,
  },
  mixins: [TableMixin],
  data() {
    return {
      currentPage: 1,
      tableMaxHeight: 400,
      loading: false,
      tableLoading: false,
      visible: false,
      tableData: [],
      loadingBtn: false,
      rejectDialog: false,
      multipleSelection: [],
      rejectionReason: '',
      form: {},
      authList: [],
      params: {
        pageBean: {
          page: 1,
          pageSize: 20,
          total: 0,
        },
        sorter: [
          {
            direction: 'DESC',
            property: 'createTime',
          },
        ],
      },
      queryParam: {
        pageBean: {
          page: 1,
          pageSize: 20,
          total: 0,
        },
      },
      searchForm: {
        type: 1,
        reviewStatus: '4',
      }, // 顶部搜索对象
      deleteIds: '', // 是否选中列表解锁删除按钮
      activeCollapse1: ['1', '2'],
      fileList: [], // 文件上传
      edit: false, // 是否是修改功能
      currentDataDel: [], // 删除时排查是否有在审核的数据
      dialogVisible: false,
      auditing: false,
    }
  },
  created() {
    if (this.$route.params.pageBean) {
      this.params = this.$route.params.pageBean
      this.pageResult = this.$route.params.pageBean.pageBean
    }
    this.handleSearch()
  },
  methods: {
    getDictName(code, value) {
      return utils.getDictName(code, value)
    },
    //获取数据
    loadData(params) {
      this.tableLoading = true
      this.$http
        .post(
          '${portal}/supplier/bizSupplierEnterprise/v1/queryByEnterprise',
          params
        )
        .then((res) => {
          this.tableLoading = false
          const data = (res && res.data) || {}
          this.tableData = data.rows || []
          this.pageResult = {
            page: data.page,
            pageSize: data.pageSize,
            total: data.total,
          }
        })
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
      // if (this.multipleSelection.length > 1) {
      //   this.$refs.multipleSelection.toggleRowSelection(
      //     this.multipleSelection[0],
      //     false
      //   )
      // }
    },
    //添加
    handleAdd() {
      this.$router.push({
        name: 'addDialog',
      })
    },
    // 驳回
    handleReject() {
      if (this.multipleSelection.length == 0 ) {
        this.$message.warning('请选择数据!')
        return
      }
      if (this.multipleSelection.length > 1) {
        this.$message.warning('请选择一条数据!')
        return
      }
      this.form = this.multipleSelection[0]
      this.rejectDialog = true
    },
    // 编辑
    handleEdit(rows) {
      this.$router.push({
        name: `addDialog`,
        query: {rows},
      })
    },
    handleSend(){
      if (this.multipleSelection.length == 0 ) {
        this.$message.warning('请选择数据!')
        return
      }
      let ids = this.multipleSelection.map(item=>{
        return item.id
      }).join(',')
      this.$confirm('是否邀请供应商', '提示', {
          confirmButtonText: '确 定',
          cancelButtonText: '取 消',
          type: 'warning',
        }).then(() => {
          this.$http.post('${portal}/supplier/bizSupplierEnterprise/v1/modifyReviewStatusById?id='+ids+'&status=0').then(res=>{
            this.rejectDialog = false
            if(res.data.state){
              this.$message.success(res.data.message)
              this.handleSearch()
            }
          })
        })
    },
    // 删除
    handleDelete() {
      let selection = this.$refs.multipleSelection.selection
      if (selection.length === 0) {
        this.$alert('请选择要删除的数据！', this.$t('common.tips'), {
          confirmButtonText: this.$t('common.confirm'),
          type: 'warning',
        })
      } else {
        let ids = []
        selection.forEach((item) => {
          let str = 'ids=' + item.id
          ids.push(str)
        })
        ids = ids.join('&')
        this.$confirm(this.$t('common.sureDelete'), this.$t('common.tips'), {
          confirmButtonText: this.$t('common.confirm'),
          cancelButtonText: this.$t('common.cancel'),
          type: 'warning',
        }).then(() => {
          this.tableLoading = true
          supplierManger.delManage(ids).then((res) => {
            this.tableLoading = false
            if (res.data.state) {
              this.$message.success('删除成功！')
              this.handleSearch()
            } else {
              this.$message.error('删除失败！')
            }
          })
        })
      }
    },
    //重置
    clearSearchForm() {
      this.searchForm = {type: 1, reviewStatus: 4}
      this.handleSearch()
    },
    // 顶部搜索
    handleSearch() {
      let obj = this.searchForm
      let querys = []
      for (let i in obj) {
        if (obj[i]) {
          querys.push({
            group: 'main',
            operation:
              i == 'reviewStatus' || i == 'supplier_name_' ? 'LIKE' : 'EQUAL',
            parentGroup: '',
            property: i,
            relation: 'AND',
            value: obj[i],
          })
        }
      }
      this.params.querys = querys
      this.loadData(this.params)
    },
    handleCurrentChange(page) {
      this.params.pageBean = {...this.params.pageBean, page}
      this.loadData(this.params)
    },
    handleSizeChange(pageSize) {
      this.params.pageBean = {...this.params.pageBean, pageSize}
      this.loadData(this.params)
    },
    dialogBeforeClose() {
      this.dialogVisible = false
      this.visible = false
      this.rejectDialog = false
    },
  },
  computed: {
    SearchPanel() {
      return {
        '--searchPanel': this.searchPanel + 'px',
      }
    },
  },
}
</script>
  
  <style lang="scss" scoped>
.cloumn-btn {
  border: 1px solid #2761ff;
  padding: 3px 10px;
  border-radius: 5px;
  &:nth-child(1) {
    margin-right: 5px;
  }
  &:nth-child(2) {
    margin-right: 5px;
  }
  &:nth-child(1):hover {
    background-color: #2761ff;
    color: #fff;
  }
  &:nth-child(2):hover {
    background-color: #2761ff;
    color: #fff;
  }
  /deep/ i,
  span {
    font-size: 16px;
  }
}

/deep/ .el-tree-node__content {
  padding: 5px 0;
}

/deep/ .el-table thead tr th {
  background-color: #eee !important;
  border-right: 1px solid #dfe2e8 !important;
}
/deep/ .el-table {
  border-collapse: collapse !important;
}
.view-qualification{
  /deep/.el-dialog__body{
    height: 600px;
    overflow-y: scroll;
  }
}
</style>
  