creditManager.vue 9.4 KB
<template>
  <div class="body_wrap">
    <div class="w80">
      <div class="common_con mb10">
        <el-form ref="queryForm" :model="state.queryParams" :rules="queryRules" label-position="right" label-width="120px">
          <el-row :gutter="20">
            <el-col :span="8" v-for="item in state.queryColumns">
              <el-form-item :label="item.label">
                <el-input v-if="item.type === 'input'" v-model.trim="state.queryParams[item.prop]" :placeholder="'请输入'+item.label" clearable size="small"></el-input>
                <el-select v-if="item.type === 'select'" style="width: 100%" v-model="state.queryParams[item.prop]" size="small" clearable>
                  <el-option v-for="dict in dict[item.options]" :label="dict" :value="dict"></el-option>
                </el-select>
                <el-checkbox-group v-if="item.type === 'checkbox'" v-model="state.queryParams[item.prop]" size="small">
                  <el-checkbox v-for="dict in dict[item.options]" :label="dict" :value="dict"></el-checkbox>
                </el-checkbox-group>
                <el-radio-group v-if="item.type === 'radio'" v-model="state.queryParams[item.prop]" size="small">
                  <el-radio v-for="dict in dict[item.options]" :label="dict.dictLabel" :value="dict.dictValue"></el-radio>
                </el-radio-group>
                <el-date-picker v-if="item.type === 'date'"
                                v-model="state.queryParams[item.prop]"
                                type="daterange"
                                range-separator="至"
                                start-placeholder="开始日期"
                                end-placeholder="结束日期"
                                value-format="YYYY-MM-DD HH:mm:ss"
                                size="small"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item>
                <el-button type="primary" icon="Search" v-debounceClick="()=>handleSearch()">查询</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>

    <div class="w80">
      <div class="common_con">
<!--        <el-row :gutter="10" class="mb10">
          <el-col :span="1.5">

          </el-col>
        </el-row>-->
        <div style="display: flex;justify-content: space-between" class="mb20">
          <div>
            <el-button type="primary" icon="Plus" v-debounceClick="()=>handleAdd('addCreditOpen')">新增授信</el-button>
          </div>
          <div style="display: flex">
            <el-select class="mr10" v-model="state.queryParams.sort" style="width: 200px" @change="getList">
              <el-option label="默认排序-授信时间" value="1"></el-option>
              <el-option label="授信额度最多" value="2"></el-option>
              <el-option label="授信额度最少" value="3"></el-option>
              <el-option label="综合信用评分最高" value="4"></el-option>
              <el-option label="综合信用评分最低" value="5"></el-option>
            </el-select>
            <el-button type="danger" icon="SortDown" :loading="state.isExport" v-debounceClick="()=>handleExport()">导出EXCEL</el-button>
          </div>
        </div>
        <el-table :data="state.tableList" style="width: 100%" @selection-change="handleSelectionChange" border v-loading="state.isLoading" class="own_table" height="500px">
          <el-table-column v-for="(table, index) in state.tableColumns" :key="'table'+index" :label="table.label" :prop="table.prop" :min-width="table.width">
            <template #default="scope">
              <template v-if="table.limitLength">
                {{scope.row[table.prop].substring(0, table.limitLength)}}
              </template>
              <template v-else-if="table.type && table.type === 'date'">
                {{DateUtil.formatDate(scope.row[table.prop])}}
              </template>
              <template v-else>
                {{dictFormatter(scope.row[table.prop], table.prop)}}
              </template>
            </template>
          </el-table-column>
          <el-table-column label="操作" min-width="60px">
            <template #default="scope">
              <el-button type="primary" icon="View" size="small" v-if="scope.row.auditStatus !== '1'" @click="handleDetail(scope.row)">详情</el-button>
            </template>
          </el-table-column>
        </el-table>

        <pagination
            v-show="state.total > 0"
            :total="state.total"
            :page.sync="state.queryParams.pageNum"
            :limit.sync="state.queryParams.pageSize"
            @pagination="({page, limit})=>getList(page, limit)"
        />

        <find-enterprise title="选择授信企业" :open="state.addCreditOpen" open-name="addCreditOpen" @handleClose="handleClose">
          <template #cop="{row}">
            <el-button type="primary" size="small" icon="Position" @click="handleSubmit(row)">立即授信</el-button>
          </template>
        </find-enterprise>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
  import * as api from "../../interface/api.ts";
  import DateUtil from "../../utils/date.js"
  import { downloadFileGet } from "../../utils/request.ts";
  import AddCheck from "../../components/reportOrder/addCheck.vue";
  import FindEnterprise from "../../components/findEnterprise.vue";
  import router from "../../router";
  import {switchToUrl} from "../../utils/until.ts";

  let dict = reactive({
    creditStatusList: ['未授信', '待生效', '生效中', '已失效'],
    creditLvList: ['全部', 'AAA', 'AA+', 'AA', 'AA-', 'A+', 'A', 'A-', 'BBB+', 'BBB', 'BBB-', 'BB+', 'BB', 'BB-', 'B+', 'B', 'B-', 'CCC', 'CC', 'C', 'D'],
  })

  let queryForm = ref<FormInstance>()
  let state = reactive( {
    tableList: [],
    isLoading: false,
    total: 0,
    queryParams: {
      pageNum: 1,
      pageSize: 10,
      ename: "",
      creditLimitSt: "",
      creditLimitEd: "",
      creditStatus: "",
      creditStatusArray: [],
      creditLv: "",
      applicationDate: [],
      creditTimeSt: "",
      creditTimeEd: "",
      outPut: false,
      sort: "1",
    },
    queryColumns: [
      {
        type: "input",
        label: "企业名称",
        prop: "ename",
      },{
        type: "input",
        label: "授信开始额度",
        prop: "creditLimitSt",
      },{
        type: "input",
        label: "授信结束额度",
        prop: "creditLimitEd",
      },{
        type: "select",
        label: "信用等级",
        prop: "creditLv",
        options: "creditLvList"
      },{
        type: "checkbox",
        label: "授信状态",
        prop: "creditStatusArray",
        options: "creditStatusList"
      },{
        type: "date",
        label: "授信有效期",
        prop: "applicationDate",
      }
    ],
    tableColumns: [
      {
        label: "企业名称",
        prop: "ename"
      },{
        label: "信用等级",
        prop: "creditLv",
      },{
        label: "信用综合评分",
        prop: "comprehensiveRate",
      },{
        label: "建议授信额度(万元)",
        prop: "creditLimitLast",
      },{
        label: "生效日期",
        prop: "effectiveDate",
      },{
        label: "有效截止日期",
        prop: "deadline",
      },
    ],
    checkOpen: false,
    projectInfo: {},
    addCreditOpen: false,
    isExport: false,
  })

  let queryRules = reactive<FormRules>({
  })

  let handleSelectionChange = (selection: Array<any>) => {
    state.ids = selection.map((item: Object) => item.id)
    state.single = selection.length !== 1
    state.multiple = !selection.length
  }

  let handleSearch = () => {
    state.queryParams.pageNum = 1
    state.queryParams.creditTimeSt = ""
    state.queryParams.creditTimeEd = ""
    if (state.queryParams.applicationDate && state.queryParams.applicationDate.length > 1) {
      state.queryParams.creditTimeSt = state.queryParams.applicationDate[0]
      state.queryParams.creditTimeEd = state.queryParams.applicationDate[1]
    }
    getList()
  }

  let getList = (page = state.queryParams.pageNum, limit = state.queryParams.pageSize) => {
    state.isLoading = true
    state.queryParams.pageNum = page
    state.queryParams.pageSize = limit
    api.getInfoList(state.queryParams, "/web/creditGrantingInfo/list").then((res: object)=> {
      state.tableList = res.data.rows
      state.total = res.data.total
      // state.total = 15
    }).finally(()=> {
      state.isLoading = false
    })
  }

  let dictFormatter = (value, prop) => {
    let lastVal = ""
    lastVal = value
    return lastVal
  }

  let handleAdd = (name: string,row: Object) => {
    state[name] = true
    state.projectInfo = row
  }

  let handleExport = () => {
    state.queryParams.outPut = true
    let tempJson = Object.assign({}, state.queryParams)
    delete tempJson.pageNum;
    delete tempJson.pageSize
    downloadFileGet(`/web/creditGrantingInfo/list` + switchToUrl(tempJson))
  }

  let handleDetail = (row: object) => {
    localStorage.setItem('creditId', row.id)
    router.push("/creditDetail?name=" + row.ename)
  }

  let handleClose = (name: string, value: boolean, isRefresh: boolean) => {
    state[name] = value
    if (isRefresh) {
      getList()
    }
  }

  let handleSubmit = (row: object) => {
    router.push('/addCredit?name=' + row.name)
  }

  onMounted(()=> {
    getList()
  })
</script>

<style scoped lang="scss">

</style>