contract-business-web/src/views/finance/paymentRegistrationList.vue

<template>
  <div style="padding: 0 20px;">
    <lx-header icon="md-apps" text="付款登记" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
      <div slot="content"></div>
      <slot>
        <span style="padding: 0 6px;word-break: keep-all;">创建日期</span>
        <span>
          <DatePicker placeholder="请选择日期" type="date" placement="bottom-start" style="width: 180px"></DatePicker>
        </span>

        <span style="padding: 0 6px;word-break: keep-all;">关键字</span>
        <span>
          <Input placeholder="请输入关键字" style="width: 180px"></Input>
        </span>

        <Button type="primary"  style="margin-left: 10px" ghost>重置</Button>
        <Button type="primary"  style="margin-left: 10px" @click="getFundLogs">查询</Button>
      </slot>
    </lx-header>

    <xy-table :list="list" :table-item="table">
      <template v-slot:btns>
        <el-table-column label="操作" fixed="right" width="160" header-align="center">
          <template slot-scope="scope">
            <template v-if="scope.row.status === 0">
              <Button size="small" type="primary"  style="margin-left: 10px;margin-bottom: 4px" @click="$refs['examineRegistration'].isShow = true,$refs['examineRegistration'].getRegistration(scope.row.id)">审核确认</Button>
            </template>
            <template v-else>
              <Button size="small" type="error" ghost style="margin-left: 10px;margin-bottom: 4px" @click="cancelExamine(scope.row)">审核撤销</Button>
            </template>
          </template>
        </el-table-column>
      </template>
    </xy-table>

    <div style="display: flex;justify-content: flex-end;">
      <Page :total="total" show-elevator @on-change="pageChange"/>
    </div>

    <examineRegistration ref="examineRegistration" @refresh="getFundLogs"></examineRegistration>
  </div>
</template>

<script>
import {getFundLog,delFundLog,editorFundLog} from "@/api/paymentRegistration/fundLog"
import {parseTime} from "@/utils"
import {Message} from "element-ui";

import examineRegistration from "./components/examineRegistration";
export default {
  components:{
    examineRegistration
  },
  data() {
    return {
      list:[],
      total:0,
      pageIndex:1,
      table:[
        {
          label:"项目名称",
          width: 150,
          prop:'contract.name'
        },
        {
          label:"付款申请金额(元)",
          prop:"apply_money",
          align:'right',
          width: 165
        },
        {
          label:'实际付款金额',
          prop:"act_money",
          align:'right',
          width: 165
        },
        {
          label:"款项类型",
          prop:"type",
          width: 120
        },
        {
          prop:'status',
          label:'状态',
          width: 140,
          formatter:(cell,data,value)=>{
            if(value === 0) return '待审核'
            else return '已审核'
          }
        },
        {
          label:"是否最后一笔",
          prop:"is_end",
          width: 150,
          formatter:(cell,data,value)=>{
            return value == 1 ? "是" : "否"
          }
        },
        {
          label:"创建信息",
          prop:"created_at",
          minWidth:200,
          formatter:(cell,data,value)=>{
            return parseTime(new Date(value))
          }
        }
      ]
    }
  },
  methods: {
    pageChange(e){
      this.pageIndex = e
      this.getFundLogs()
    },

    async getFundLogs(){
      const res = await getFundLog({page_size:10,page:this.pageIndex})
      this.list = res.data
      this.total = res.total
    },

    deleteFundLog(row){
      delFundLog({id:row.id}).then(res=>{
        Message({
          type:'success',
          message:'操作成功'
        })
        this.getFundLogs()
      })
    },

    cancelExamine(row){
      editorFundLog({id:row.id,status:0}).then(res=>{
        this.getFundLogs()
        Message({
          type:"success",
          message:"操作成功"
        })
      })
    }
  },
  mounted() {
    this.getFundLogs()
  }
}
</script>

<style scoped lang="scss">
</style>