jsm-mall-front/src/views/workOrder/workOrderPool2/detailModule/PartsApplication/index.vue

<template>
  <zj-page-container>
    <zj-page-fill class="neibuview">
      <template v-if="payData.length">
        <zj-form-container>
          <template v-for="(item, index) in payData">
            <formModule :item="payData[index]" :index="index" @shuaxin="shuaxin"> </formModule>
          </template>
        </zj-form-container>
      </template>
      <el-empty v-else description="暂时没有配件申请"></el-empty>
    </zj-page-fill>
  </zj-page-container>
</template>

<script>
import { orderPartsApplyRecord } from '@/api/workOrderPool.js'
import formModule from './formModule.vue'
export default {
  components: {
    formModule
  },
  props: {
    id: {
      type: [String, Number],
      default: null
    }
  },
  data() {
    return {
      payData: []
    }
  },
  watch: {
    id: {
      handler(newVal, oldVal) {
        this.shuaxin()
      },
      deep: true,
      immediate: true
    }
  },
  computed: {},
  methods: {
    shuaxin() {
      orderPartsApplyRecord({
        orderId: this.id
      }).then(res => {
        this.payData = res.data || []
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.neibuview {
  box-sizing: border-box;
  padding-left: 16px;

  ::v-deep & > .zj-page-fill-scroll {
    box-sizing: border-box;
    padding-right: 16px;

    & > div:nth-child(1) {
      margin-top: 20px;
    }
  }
}
</style>