dvcp_v2_webapp/project/xiushan/apps/AppPolicyBid/AppPolicyBid.vue

<template>
  <section class="AppPolicyBid">
    <ai-list>
      <ai-title slot="title" title="贷款联审数据统计" isShowBottomBorder></ai-title>
      <template #content>
        <ai-search-bar>
          <template #left>
            <ai-select placeholder="所属部门" v-model="search.department" @change="page.current=1,getTableData()" :selectList="departmentList"/>
            <ai-select placeholder="所属分类" v-model="search.classificationName" :selectList="classList" @change="page.current=1,getTableData()"/>
          </template>
          <template #right>
            <el-input size="small" placeholder="申请人/申请主体/事项名称" v-model="search.name" clearable @change="page.current=1,getTableData()"/>
            <ai-import
              ref="import"
              title="导入"
              name="贷款联审数据统计"
              url="/appzwspstatistics/downloadTemplate"
              importUrl="/appzwspstatistics/import"
              suffixName="xlsx"
              :customCliker="true"
              :instance="instance"
            >
              <template slot="tips">
                <p>
                  如果表格中已经存在数据，则会被本次导入的数据覆盖；不存在数据，系统将生成新的标准记录；
                </p>
              </template>
              <el-button size="small" icon="iconfont iconImport"
                >导入</el-button
              >
            </ai-import>
            <ai-download :instance="instance" url="/appzwspstatistics/export" :params="search" fileName="贷款联审数据统计" :disabled="tableData.length == 0">
              <el-button icon="iconfont iconExported" :disabled="tableData.length == 0">导出</el-button>
            </ai-download>
          </template>
        </ai-search-bar>
        <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
          @getList="getTableData" :col-configs="colConfigs" :dict="dict">
          <el-table-column slot="options" label="操作" fixed="right" align="center">
            <template slot-scope="{row}">
              <el-button type="text" @click="showDetail(row)" v-if="row.zwspId">详情</el-button>
            </template>
          </el-table-column>
        </ai-table>
      </template>
    </ai-list>
    <ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="dialog=false" @onConfirm="dialog=false" width="800px">
      <img class="pdf-img" :src="dialogImgUrl" alt="">
    </ai-dialog>
  </section>
</template>

<script>
import {mapState} from "vuex";

export default {
  name: "AppPolicyBid",
  label: "贷款联审数据统计",
  props: {
    instance: Function,
    dict: Object,
    permissions: Function
  },
  computed: {
    ...mapState(['user'])
  },
  data() {
    return {
      search: {name: '', classificationName: '', department: ''},
      page: {current: 1, size: 10, total: 0},
      tableData: [],
      colConfigs: [
        {label: "申请人/申请主体", prop: "name", align: "center", width: '200px'},
        {label: "事项名称", prop: "processName", align: "center"},
        {label: "所属分类", prop: "classificationName", align: "center"},
        {label: "所属部门/机构", prop: "department", align: "center", width: '120px'},
        {label: "意向金额（万）", prop: "intendedAmount", align: "center", width: '120px'},
        {label: "放款金额（万）", prop: "loanAmount", align: "center", width: '120px'},
        {label: "申请日期", prop: "applyDate", align: "center", width: '120px'},
        {label: "放款日期", prop: "loanDate", align: "center", width: '120px'},
        {slot: "options"}
      ],
      dialog: false,
      dialogTitle: '',
      classList: [],
      departmentList: []
    }
  },
  methods: {
    getTableData() {
      this.instance.post("/appzwspstatistics/list", null, {
        params: {...this.page, ...this.search}
      }).then(res => {
        if (res?.data) {
          this.tableData = res.data?.records
          this.page.total = res.data.total
        }
      })
    },
    showDetail(row) {
      this.dialogTitle = row.processName
      this.dialogImgUrl = row.zwspPictureUrl
      this.dialog = true
    },
    getClassTypeList() {
      this.instance.post("/zwspapprovalclassification/list?size=100").then(res => {
        if (res?.data) {
          res.data.records.map((item) => {
            item.dictName = item.name
            item.dictValue = item.name
          })
          this.classList = res.data.records
        }
      })
      this.instance.post("/appfinancialorganization/list?size=100").then(res => {
        if (res?.data) {
          res.data.records.map((item) => {
            item.dictName = item.organizationName
            item.dictValue = item.organizationName
          })
          this.departmentList = res.data.records
        }
      })
    }
  },
  created() {
    this.getClassTypeList()
    this.dict.load("sex").then(() => {
      this.getTableData()
    })
  }
}
</script>

<style lang="scss" scoped>
.AppPolicyBid {
  height: 100%;
  .pdf-img{
    width: 100%;
  }
}
</style>