supplier_system/src/dashoo.cn/frontend_web/src/pages/oilsupplier/companyaudit/index.vue

<template>
  <div>
    <el-breadcrumb class="heading">
      <el-breadcrumb-item :to="{ path: '/' }">平台首页</el-breadcrumb-item>
      <el-breadcrumb-item :to="{ path: '/oilsupplier/companyaudit' }">公司审核</el-breadcrumb-item>
    </el-breadcrumb>
    <el-card class="box-card">
      <div slot="header">
        <span>
          <i class="icon icon-table2"> 公司审核列表</i>
        </span>
        <el-form ref="form"
                 v-model="searchForm"
                 :inline="true"
                 style="float: right; margin-top: -10px">
          <el-form-item label="公司名称">
            <el-input v-model="searchForm.Name"
                      placeholder="请输入公司名称"
                      size="mini"></el-input>

          </el-form-item>
          <el-form-item>
            <el-button @click="initData"
                       size="mini"
                       type="primary">查 询</el-button>
          </el-form-item>
          <el-form-item>
            <el-button type="primary"
                       class="el-button--small"
                       @click="clearSearch"
                        size="mini">重 置</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-row :gutter="20">
        <el-col :span="24">
          <!-- <el-collapse>
            <el-collapse-item title="查询公司">
              <el-form ref="form"
                       :model="searchForm"
                       label-width="120px">
                <el-row>
                  <el-col :span="8">
                    <el-form-item label="公司名称">
                      <el-input v-model="searchForm.Name"
                                placeholder="请输入公司名称"> ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col class="line"
                          :span="24"
                          style="background-color:lightgrey; line-height: 1px">&nbsp;</el-col>
                </el-row>
                <el-row :gutter="0"
                        style="text-align:right;margin-top:10px;">
                  <el-button @click="initData"
                             size="small"
                             type="primary">查询</el-button>
                  <el-button type="primary"
                             class="el-button--small"
                             @click="clearSearch"
                             style="margin-left:8px">重 置</el-button>
                </el-row>
              </el-form>
            </el-collapse-item>
          </el-collapse> -->
          <el-table :data="list"
                    stripe
                    highlight-current-row
                    size="mini"
                    border
                    style="width: 100%">
            <el-table-column label="操作"
                             width="120"
                             align="center"
                             header-align="center"
                             fixed="right">
              <template slot-scope="scope">
                <el-button size="mini"
                           type="text"
                           title="审核"
                           @click="checkData(scope.row)"
                           v-if="scope.row.CheckStatus == 0 && auditBtn">审核</el-button>
                <el-button size="mini"
                           type="text"
                           title="查看"
                           @click="checkData(scope.row)"
                           v-else>查看</el-button>
              </template>
            </el-table-column>
            <el-table-column prop="CheckStatus"
                             label="审核状态"
                             width="120"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip>
              <template slot-scope="scope">
                <span v-if="scope.row.CheckStatus == 1"
                      style="color:#E6A23C">待审核</span>
                <span v-if="scope.row.CheckStatus == 11"
                      style="color:#67C23A">审核通过</span>
                <span v-if="scope.row.CheckStatus == -1"
                      style="color:#F56C6C">审核未通过</span>
              </template>
              <!--TODO 新注册账号待审核状态不对-->
            </el-table-column>
            <el-table-column prop="SupplierName"
                             label="公司名称"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="CommercialNo"
                             label="统一社会信用代码"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="LegalPerson"
                             label="法定代表人"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="ContactName"
                             label="联系人"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="EMail"
                             label="邮箱"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="UserName"
                             label="用户名"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="UserTelephone"
                             label="用户手机号"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="CheckUnitName"
                             label="审核单位"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
            <el-table-column prop="ModifiedBy"
                             label="审核人"
                             align="center"
                             header-align="center"
                             show-overflow-tooltip></el-table-column>
          </el-table>
          <el-pagination style="float:right;margin:10px 0 10px 0;"
                         @size-change="handleSizeChange"
                         @current-change="handleCurrentChange"
                         :current-page="currentPage"
                         :page-size="size"
                         :page-sizes="[10, 15, 20 ]"
                         layout="total, sizes, prev, pager, next, jumper"
                         :total="currentItemCount">
          </el-pagination>
        </el-col>
      </el-row>
    </el-card>
    <!-- 公司审核信息 -->
    <el-dialog title="企业注册信息"
               :visible.sync="dialogVisible">
      <el-form label-width="135px"
               ref="formData"
               :model="formData"
               size="small">
        <el-row>
          <el-col :span="24">
            <el-form-item label="公司名称"
                          label-width="150px"
                          style="width: 100%"
                          prop="SupplierName">
              <el-input v-model="formData.SupplierName"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="统一社会信用代码"
                          label-width="150px"
                          style="width: 100%"
                          prop="CommercialNo">
              <el-input v-model="formData.CommercialNo"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="法定代表人姓名"
                          label-width="150px"
                          style="width: 100%"
                          prop="LegalPerson">
              <el-input v-model="formData.LegalPerson"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="法定代表人身份证号"
                          label-width="150px"
                          style="width: 100%"
                          prop="LegalPersonId">
              <el-input v-model="formData.LegalPersonId"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="法定代表人身份证扫描件"
                          label-width="170px"
                          prop="LegalPersonImg">
              <div class="block"
                   style="overflow: auto;">
                <template>
                  <el-row>
                    <el-col :span="12"
                            v-for="(url, index) in urlList"
                            :key="index">
                      <span @click="bigImg(url)">
                        <el-image style="width: 170px; height: 100px; cursor: pointer"
                                  :src="url"></el-image>
                      </span>
                    </el-col>
                  </el-row>
                </template>
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="联系人姓名"
                          label-width="150px"
                          style="width: 100%"
                          prop="ContactName">
              <el-input v-model="formData.ContactName"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="联系人身份证号"
                          label-width="150px"
                          style="width: 100%"
                          prop="ContactId">
              <el-input v-model="formData.ContactId"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="联系人身份证扫描件"
                          label-width="170px"
                          prop="ContactImg">
              <div class="block"
                   style="overflow: auto;">
                <template>
                  <el-row>
                    <el-col :span="12"
                            v-for="(url, index) in urlList2"
                            :key="index">
                      <span @click="bigImg(url)">
                        <el-image style="width: 170px; height: 100px; cursor: pointer"
                                  :src="url"></el-image>
                      </span>
                    </el-col>
                  </el-row>
                </template>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="邮箱"
                          label-width="150px"
                          style="width: 100%"
                          prop="EMail">
              <el-input v-model="formData.EMail"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="手机号"
                          style="width: 100%"
                          prop="UserTelephone">
              <el-input v-model="formData.UserTelephone"
                        readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="用户名"
                          label-width="150px"
                          style="width: 100%"
                          prop="UserName">
              <el-input v-model="formData.UserName"
                        readonly></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- <el-row style="margin-top: 10px; margin-bottom: 20px;"> -->
        <!-- <el-button  type="primary" size="mini" @click="ComAudit">审核</el-button> -->
        <!-- <el-button size="mini" @click="cancelOption">审核未通过</el-button> -->
        <!-- <el-button size="mini" type="primary" @click="ensureOption" style="margin-left: 20%;">审核通过</el-button> -->
        <!-- </el-row> -->
      </el-form>
      <div slot="footer"
           class="dialog-footer"
           style="margin-top: -25px">
        <el-button type="primary"
                   size="mini"
                   v-if="showorhid==0 && auditBtn"
                   @click="ComAudit">审核</el-button>
      </div>
    </el-dialog>
    <el-dialog title="审核"
               :visible.sync="Auditshow">
      <el-form :model="shenheForm"
               label-width="100px"
               ref="shenheForm">
        <el-form-item label="审核状态">
          <template>
            <el-radio class="radio"
                      v-model="shenheForm.SuccessStatus"
                      :label="1">通过</el-radio>
            <el-radio class="radio"
                      v-model="shenheForm.SuccessStatus"
                      :label="2">未通过</el-radio>
          </template>
        </el-form-item>
        <el-form-item label="意见"
                      :rules="[{ required: true, message: '请输入审批意见', trigger: 'blur' }]">
          <el-input type="textarea"
                    v-model="shenheForm.AuditorRemark"
                    placeholder="请输入审核意见"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer"
           class="dialog-footer"
           style="margin-top: -25px">
        <el-button size="small"
                   @click="Auditshow = false">取 消</el-button>
        <el-button type="primary"
                   size="small"
                   @click="makeSure()" :loading="btnLoading">确 定</el-button>
      </div>
    </el-dialog>

    <!--点击图片放大区域-->
    <el-dialog title="法定代表人身份证扫描件"
               :visible.sync="legalPersonImgVisible"
               width="40%">
      <el-image :src="bigUrl"></el-image>
    </el-dialog>
  </div>
</template>

<script>
import apiCert from '@/api/oilsupplier/suppliercert'
export default {
  name: 'companyaudit',
  data () {
    return {
      btnLoading: false,
      btntitle: '查看',
      auditBtn: false,
      Auditshow: false,
      shenheForm: {
        SuccessStatus: 1,
        AuditorRemark: ''
      },
      bigUrl: '',
      legalPersonImgVisible: false,
      currentItemCount: 0,
      currentPage: 1,
      size: 10,
      list: [], // 公司列表
      searchForm: {
        Name: '' // 公司名称
      },
      dialogVisible: false,
      showorhid: 0,
      urlList: [], // 照片地址数组
      urlList2: [], // 照片地址数组2
      formData: {
        Id: '', // int
        UserId: '', // int
        UserName: '', // 账号/Email
        UserRealName: '', // 用户真实姓名
        UserTelephone: '', // 用户手机号
        UserPass: '',
        UserPass2: '',
        SupplierName: '',
        OilCertificateNo: '',
        Grade: '',
        MgrUnit: '',
        OperType: '',
        Country: '',
        CommercialNo: '',
        OrganCode: '',
        CountryTaxNo: '',
        LocalTaxNo: '',
        Address: '',
        DetailAddress: '',
        Province: '',
        City: '',
        Street: '',
        HouseNo: '',
        ZipCode: '',
        BusinessScope: '',
        LegalPerson: '',
        LegalPersonId: '',
        LegalPersonURL: '',
        CategoryCode: '',
        CategoryName: '',
        RegCapital: 0, // float32
        Currency: '',
        ContactName: '',
        ContactId: '',
        ContactURL: '',
        CompanyType: '',
        SetupTime: '', // time
        DepositBank: '',
        BankAccount: '',
        EMail: '',
        BankCreditRating: '',
        Mobile: '',
        Telphone: '',
        Fax: '',
        CompanyTel: '',
        QQ: '',
        CompanyUrl: '',
        Remark: '',
        CheckStatus: 0, // 二级单位审核状态，0：未通过，1：通过 默认0
        IsDelete: 0, // 删除状态，0正常，1已删除
        LinkAddress: '',
        LinkProvince: '',
        LinkCity: '',
        LinkStreet: '',
        LinkHouseNo: '',
        LinkZipCode: '',
        HseTraining: ''
      }
    }
  },
  created () {
    this.initData()
    this.isAccess()
  },
  methods: {
    isAccess () {
      let params = {
        id: this.formData.CertId,
        auditstepcode: 'COMPONY_AUDIT',
        processkey: 'oil_register_apply'
      }
      apiCert.isAccess(params, this.$axios).then(res => {
        this.auditBtn = res.data
        if (this.auditBtn) {
          this.btntitle = '审核'
        } else {
          this.btntitle = '查看'
        }
      }).catch(err => {
        console.log(err)
      })
    },


    bigImg (url) {
      this.bigUrl = url
      this.legalPersonImgVisible = true
    },
    initData () {
      let _this = this
      const params = {
        _currentPage: this.currentPage,
        _size: this.size,
        Name: this.searchForm.Name
      }
      this.$axios.get('/register/getcompanylist', {
        params
      })
        .then(function (response) {
          _this.list = response.data.items
          _this.currentItemCount = response.data.currentItemCount
        })
        .catch(function (error) {
          console.log(error)
        })
    },

    // 审核公司信息
    checkData (row) {
      let _this = this
      _this.formData = row
      _this.dialogVisible = true
      _this.showorhid = row.CheckStatus

      // 处理URL
      _this.urlList = []
      let urlArr = _this.formData.LegalPersonURL.split('&')
      if (urlArr) {
        for (let i = 0; i < urlArr.length; i++) {
          let tempURL = urlArr[i].split('|')
          if (tempURL[0].indexOf('/upfile') === 0) {
            const myDomain = window.location.host
            _this.urlList.push('http://' + myDomain + tempURL[0])
          } else {
            _this.urlList.push('http://' + tempURL[0])
          }
        }
      }
      _this.urlList2 = []
      let urlArr2 = _this.formData.ContactURL.split('&')
      if (urlArr2) {
        for (let i = 0; i < urlArr2.length; i++) {
          let tempURL = urlArr2[i].split('|')
          if (tempURL[0].indexOf('/upfile') === 0) {
            const myDomain = window.location.host
            _this.urlList2.push('http://' + myDomain + tempURL[0])
          } else {
            _this.urlList2.push('http://' + tempURL[0])
          }
        }
      }
    },

    ComAudit () {
      this.Auditshow = true
    },
    // 审核
    makeSure () {
      if (this.shenheForm.AuditorRemark.trim().length < 1) {
        this.$message({
          type: 'warning',
          message: '请填写审批意见！'
        })
        return
      }
      this.checkstatus()
    },
    checkstatus () {
      let _this = this
      const params = _this.shenheForm
      this.btnLoading = true
      _this.$axios.post('/register/comaudit/', _this.formData, { params })
        .then(res => {
          if (res.data.code === 0) {
            _this.$message({
              type: 'success',
              message: res.data.message
            })
            // 关闭dialog
            _this.Auditshow = false
            _this.dialogVisible = false
            this.shenheForm.AuditorRemark = ''
            this.shenheForm.SuccessStatus = 1
            // 更新列表
            _this.initData()
          } else {
            _this.$message({
              type: 'warning',
              message: res.data.message
            })
          }
          this.btnLoading = false
        })
        .catch(err => {
          console.error(err)
        })
    },

    // 审核未通过
    cancelOption () {
      let _this = this
      _this.$axios.delete('/register/deleteinfo/' + _this.formData.Id, {})
        .then(function (response) {
          if (response.data.code === 0) {
            _this.$message({
              type: 'success',
              message: response.data.message
            })
            // 关闭dialog
            _this.dialogVisible = false
            // 更新界面
            _this.initData()
          } else {
            _this.$message({
              type: 'warning',
              message: response.data.message
            })
          }
        })
        .catch(function (error) {
          console.log(error)
        })
    },

    // 审核通过
    ensureOption () {
      let _this = this
      _this.$axios.post('/register/adduser/', _this.formData)
        .then(res => {
          if (res.data.code === 0) {
            _this.$message({
              type: 'success',
              message: res.data.message
            })
            // 关闭dialog
            _this.dialogVisible = false
            // 更新列表
            _this.initData()
          } else {
            _this.$message({
              type: 'warning',
              message: res.data.message
            })
          }
        })
        .catch(err => {
          console.error(err)
        })
    },

    handleSizeChange (value) {
      this.size = value
      this.currentPage = 1
      this.initData()
    },
    handleCurrentChange (value) {
      this.currentPage = value
      this.initData()
    },
    clearSearch () {
      this.searchForm.Name = ''
      this.initData()
    }
  }
}
</script>

<style lang="scss">
.time {
  font-size: 13px;
  color: #999;
}

.bottom {
  margin-top: 13px;
  line-height: 12px;
}

.button {
  padding: 0;
  float: right;
}

.image {
  width: 100%;
  display: block;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}

.el-pagination {
  margin: 1rem 0 2rem;
  text-align: right;
}

.plab {
  font-size: 13px;
  color: #999;
}

.triggerone {
  font-size: 13px;
  margin-left: 80px;
}

.plab {
  font-size: 13px;
  color: #999;
}

.docdelete .el-radio {
  padding: 8px 15px 0 0;
  margin-left: -2px;
}
</style>