diantou/src_product/iam/law/case/execute/case-execute-zxjz-form.vue

<template>
  <sd-webflow
    ref="webflow"
    @afterDispatch="afterDispatch"
    @saveproject="save"
    @sdFormReady="initData"
    @actionBtnClick="actionBtnClick"
  >
    <template v-slot:form="{ model, FlowData }">
      <amount-watcher :model="model" @amoutChange="amoutChange" />
      <amount-host-watcher :model="model" @amoutHostChange="amoutHostChange" />
      <sd-form-by-builder ref="builderform" :form-data="FlowData.processFormData" />
    </template>
  </sd-webflow>
</template>

<script>
import axios from '@/common/services/axios-instance'
import CaseMixins from '../case-mixins'
import components from './_import-components/case-execute-zxjz-form-import'

export default {
  name: 'CaseExecuteZxjzForm',
  metaInfo: {
    title: '执行程序-执行进展详情',
  },
  components: {
    // EXECUTE_AMOUNT 监听
    amountWatcher: {
      props: ['model'],
      created() {
        this.$watch('model.EXECUTE_AMOUNT', (val) => {
          this.$emit('amoutChange', val)
        })
      },
      render: () => {},
    },
    // EXECUTE_AMOUNT_HOST 监听
    amountHostWatcher: {
      props: ['model'],
      created() {
        this.$watch('model.EXECUTE_AMOUNT_HOST', (val) => {
          this.$emit('amoutHostChange', val)
        })
      },
      render: () => {},
    },
    ...components,
  },
  mixins: [CaseMixins],
  data() {
    return {
      ACCUMULATED_EXECUTE_AMOUNT: null,
    }
  },
  created() {
    this.type = 'execute'
    this.$nextTick(() => {
      axios({
        method: 'post',
        url:
          'api/framework/v1/lawexecuteamounthost/findExecuteAmountByCaseId?caseId=' +
          this.$route.query.id,
      }).then((res) => {
        if (this.$refs.webflow.getFieldValue('EXECUTE_AMOUNT_HOST') !== undefined) {
          return
        }
        // 累计执行金额
        if (res.data.ACCUMULATED_EXECUTE_AMOUNT !== null) {
          this.$refs.webflow.setFieldValue(
            'ACCUMULATED_EXECUTE_AMOUNT',
            res.data.ACCUMULATED_EXECUTE_AMOUNT
          )
          this.ACCUMULATED_EXECUTE_AMOUNT = res.data.ACCUMULATED_EXECUTE_AMOUNT
        } else {
          this.$refs.webflow.setFieldValue('ACCUMULATED_EXECUTE_AMOUNT', 0)
          this.ACCUMULATED_EXECUTE_AMOUNT = 0
        }
        // 执行余额
        if (res.data.EXECUTE_BALANCE !== null) {
          this.$refs.webflow.setFieldValue('EXECUTE_BALANCE', res.data.EXECUTE_BALANCE)
        } else {
          this.$refs.webflow.setFieldValue('EXECUTE_BALANCE', 0)
        }
        // 总执行金额
        if (res.data.EXECUTE_AMOUNT_HOST !== null) {
          this.$refs.webflow.setFieldValue('EXECUTE_AMOUNT_HOST', res.data.EXECUTE_AMOUNT_HOST)
          this.$refs.webflow.FlowData.processFormData.processFormPropertyValues.find(
            (item) => item.name === 'EXECUTE_AMOUNT_HOST'
          ).readonly = true
        }
      })
    })
  },
  mounted() {
    this.type = 'execute'
  },
  methods: {
    // 执行金额变化时
    amoutChange(val) {
      // 计算累计执行金额
      const amount = (this.ACCUMULATED_EXECUTE_AMOUNT + val).toFixed(2)
      this.$refs.webflow.setFieldValue('ACCUMULATED_EXECUTE_AMOUNT', amount)
      // 计算执行余额
      const allAmount = this.$refs.webflow.getFieldValue('EXECUTE_AMOUNT_HOST')
      const executeAmount = this.$refs.webflow.getFieldValue('ACCUMULATED_EXECUTE_AMOUNT')
      this.$refs.webflow.setFieldValue('EXECUTE_BALANCE', allAmount - executeAmount)
    },
    // 总执行金额监听
    amoutHostChange(val) {
      // 计算执行余额
      const ACCUMULATED_EXECUTE_AMOUNT = this.$refs.webflow.getFieldValue(
        'ACCUMULATED_EXECUTE_AMOUNT'
      )
      const amount = val - ACCUMULATED_EXECUTE_AMOUNT
      this.$refs.webflow.setFieldValue('EXECUTE_BALANCE', amount)
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
</style>