equipment/src/views/chargeBill/ZJ/create.vue

<template>
  <div class="app-container">
    <div class="filter-container">
      <el-form>
        <el-form-item>
          <el-input v-model="query.baojianbianhao" placeholder="报检编号" clearable type="small" style="width: 240px" @keyup.enter.native="handleFilter" />
          <el-select v-if="this.$store.getters.clientType !== 'Enterprise'" v-model="query.zzdwId" placeholder="受检单位" clearable filterable type="small" style="width: 240px" @keyup.enter.native="handleFilter">
            <el-option v-for="item in zzdwList" :key="item.id" :label="item.zhizaodanwei" :value="item.id" />
          </el-select>
          <el-button type="primary" icon="el-icon-search" @click="handleFilter">
            查询
          </el-button>
          <el-button type="primary" icon="el-icon-edit-outline" :disabled="selection.length < 1" @click="toCreateBill">
            生成收费通知单
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <el-table
      ref="list"
      :data="data"
      border
      fit
      highlight-current-row
      style="margin-top: 5px;"
      stripe
      height="600px"
      width="100%"
      @row-click="onRowClick"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" align="center" width="45" />
      <el-table-column type="index" align="center" label="序号" width="50" />
      <el-table-column align="center" label="受检单位" prop="zhizaodanwei" width="200" />
      <el-table-column align="center" label="报检编号" prop="baojianbianhao" width="180" />
      <el-table-column align="center" label="检验证书编号" prop="baogaobianhao" width="200" />
      <el-table-column align="center" label="设备品种" prop="shebeipinzhong" width="140" />
      <el-table-column align="center" label="产品名称" prop="shebeimingcheng" show-overflow-tooltip />
      <el-table-column align="center" label="产品编号" prop="chanpinbianhao" width="180" />
      <el-table-column align="center" label="受检设备(产品)型号 " prop="guigexinghao" width="160" />
      <el-table-column align="center" label="检验项目(或产品出厂价格) " prop="zaojia" width="200" />
      <el-table-column align="center" label="应收检验费金额" prop="yingjiaojine" width="140" />
      <el-table-column align="center" label="缴费状态 " prop="jfState" width="100">
        <template slot-scope="scope">
          <el-tag v-if="scope.row.jfState" type="success">
            已交费
          </el-tag>
          <el-tag v-else type="danger">
            未交费
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" width="100" label="附件" fixed="right">
        <template slot-scope="scope">
          <el-button type="info" size="small" circle icon="el-icon-info" title="编辑相关鉴证" @click="showVerification(scope.row.renwuId)" />
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="total>0" :total="total" :page-num.sync="query.pageNum" :page-row.sync="query.pageSize" @pagination="getList" />
    <bill-add :selection="selection" :charge-bill.sync="chargeBill" :disabled-unit="true" />
  </div>
</template>

<script>
import Utils from '@/utils/contact'
import BillAdd from '@/views/chargeBill/components/add'
import Pagination from '@/components/Pagination'

export default {
  name: 'ChargeBill2000ZjCreateList',
  components: { BillAdd, Pagination },
  props: {
    inspectors: {
      type: Array,
      required: true
    }
  },
  data() {
    const isGLZZ = this.hasRole('GLZZJYY') || this.hasRole('GLZZKZ') || this.hasRole('GLZZSPR')
    const shebeizhongleidaima = isGLZZ || this.hasRole('GLQYD') ? '1000' : '2000'
    return {
      isGLZZ: isGLZZ,
      zzdwList: [],
      // zhizaodanwei: this.$store.getters.clientType === 'Enterprise' ? this.$store.getters.nickname : '',
      query: {
        shebeizhongleidaima: shebeizhongleidaima,
        jianyanleibie: 'ZJ',
        jianyanrenyuan: isGLZZ ? this.$store.getters.userId : null,
        pageNum: 1, // 页码
        pageSize: 20, // 每页条数
        isPressureMade: true
      },
      data: [],
      selection: [],
      version: 18,
      ifChargeBillAdd: false,
      chargeBill: {
        shebeizhongleidaima: shebeizhongleidaima,
        jianyanleibie: 'ZJ',
        inspectedUnit: '',
        email: '',
        payer: '',
        payerPhone: '',
        inspectionPhone: ''
      },
      total: 0
    }
  },
  mounted() {
    if (this.$store.getters.clientType === 'System') {
      this.getZzdwList()
      this.getList()
    } else {
      this.getZzdwIdByUserId()
    }
    const that = this
    this.common.$on('ChargeBillZjCreateListRefresh', function() {
      that.handleFilter()
    })
  },
  methods: {
    /**
     * 根据当前登录用户主键获得制造单位主键
     */
    getZzdwIdByUserId() {
      if (this.$store.getters.clientType === 'System') {
        return
      }
      this.api({
        url: '/dwxx/getByUserId',
        method: 'get',
        params: { userId: this.$store.getters.userId }
      }).then(data => {
        if (data) {
          this.query.zzdwId = data.id
          this.getList()
        }
      })
    },
    /**
     *  获得制造单位
     */
    getZzdwList() {
      const queryZzdw = {
        creatingState: true,
        inspectorIfEmpty: false,
        shebeizhongleidaima: this.isGLZZ ? '1000' : '2000'
      }
      const username = this.$store.getters.username
      if (username && username !== 'admin' && !this.ifShowCreateBy) {
        queryZzdw.zhuchangjianyanrenyuan = this.$store.getters.userId
      }
      this.api({
        url: '/dwxx/getAll',
        method: 'get',
        params: queryZzdw
      }).then(data => {
        this.zzdwList = data
      })
    },
    /**
     * 检索事件
     */
    handleFilter() {
      this.getList()
    },
    /**
     * 获得办结报告列表信息
     */
    getList() {
      this.apibjd({
        url: '/charge/getAwaitList',
        method: 'get',
        params: this.query
      }).then(data => {
        this.data = data.list
        this.total = data.total
      })
    },
    // 表格单击选中行
    onRowClick(row) {
      this.$refs.list.toggleRowSelection(row)
    },
    // 表格已选中集合
    handleSelectionChange(val) {
      this.selection = val
    },
    /**
     * 点击查看相关鉴证
     */
    showVerification(renwuId) {
      Utils.$emit('OpenBillCreateEnclosureVisible', renwuId)
    },
    /**
     * 进入保存收费单详情页
     */
    toCreateBill() {
      this.selection.forEach(data => {
        data.inspectedUnit = data.zhizaodanwei
      })
      const inspectedUnit = this.selection[0].zhizaodanwei
      const isSamedw = this.selection.every((row) => row.zhizaodanwei === inspectedUnit)
      if (!isSamedw) {
        this.$message.warning('请选择相同制造单位！')
        return false
      }
      this.chargeBill.inspectedUnit = inspectedUnit
      this.chargeBill.invoiceHeader = inspectedUnit
      if (this.selection[0].shebeizhongleidaima === '1000') {
        this.api({
          url: '/dwxx/getById',
          method: 'get',
          params: { id: this.selection[0].zzdwId }
        }).then(data => {
          this.chargeBill.creditCode = data.creditCode
          Utils.$emit('openChargeBillAdd')
        })
      } else {
        Utils.$emit('openChargeBillAdd')
      }
    }
  }
}
</script>

<style scoped>

</style>