index.vue 6.51 KB
<template>
  <div v-dee-loading="loading" class="DxStMoveSendOutAFDsList">
    <!-- 申请单表格 -->
    <dee-up-table
      table-height="auto"
      :index-row="indexRow"
      :columns="tableColums"
      :data="dataSource"
    >
      <template v-if="!readonly" slot="header">
        <dee-tools :tools="tools" mode="normal" />
      </template>
    </dee-up-table>
    <!-- 新增弹框 -->
    <details-dialog :visibile.sync="showDetailsDialog" :form="form" @ok="onConfirm" />
    <!-- 物料明细抽屉 -->
    <wl-info-drawer :visibile.sync="showWlInfoDrawer" :basic-data="rowData" @ok="onConfirm" />
  </div>
</template>

<script>
import _get from 'lodash.get'
import tableMixin from './tableMixin'
import DetailsDialog from './component/detailsDialog'
import WlInfoDrawer from './component/wlInfoDrawer'

export default {
  name: 'DxStMoveSendOutAFDsList',
  componentName: '调拨申请单明细列表',
  components: {
    DetailsDialog,
    WlInfoDrawer
  },
  mixins: [tableMixin],
  layoutConfigData: [
    {
      title: '高级组件配置',
      data: [
        {
          key: 'readonly',
          title: '只读组件',
          disabled: true,
          component: {
            defaultValue: false,
            name: 'el-switch'
          }
        }
      ]
    }
  ],
  props: {
    value: {
      type: Array,
      default: () => []
    },
    form: {
      type: Object,
      default: () => ({})
    },
    basicData: {
      type: Object,
      default: null
    },
    item: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      loading: false,
      showDetailsDialog: false,
      showWlInfoDrawer: false,
      editIdx: 0,
      dataSource: [],
      rowData: null
    }
  },
  computed: {
    tools() {
      return [
        {
          name: '新增',
          icon: '/icons/c-add.png',
          handler: {
            click: () => {
              this.openDialog()
            }
          }
        }
      ]
    },
    readonly() {
      return _get(this.item, 'readonly', false) || _get(this.$attrs, 'cmp-options.readonly', false)
    }
  },
  watch: {
    'basicData.dxStMoveSendOutAFDs': {
      immediate: true,
      handler(items) {
        if (Array.isArray(items) && items.length > 0) {
          this.dataSource = items
        }
      }
    },
    'form.dxStMoveSendOutAFDs': {
      immediate: true,
      handler(items) {
        if (Array.isArray(items) && items.length > 0) {
          this.dataSource = items
        }
      }
    }
  },
  methods: {
    openDialog() {
      if (!_get(this, 'form.dxStHouseSendOut.id', null)) {
        return this.$message.warning('请选择原库房')
      } else if (!_get(this, 'form.dxStHouseInCome.id', null)) {
        return this.$message.warning('请选择目标库房')
      }
      this.showDetailsDialog = true
    },
    onConfirm(items) {
      const newItems = items.map(item => {
        const record = {
          instantiableResource: _get(item, 'invAccount.dxResource', ''),
          instantiableResourceId: _get(item, 'invAccount.dxResourceId', ''),
          instantiableResourceIdType: _get(item, 'invAccount.dxResourceIdType', ''),
          instanceHolderId: _get(item, 'invAccount.dxResInstId', ''),
          instanceHolderIdType: _get(item, 'invAccount.dxResInstIdType', ''),
          resourceClasscify: _get(item, 'invAccount.dxResClass', ''),
          resourceClasscifyId: _get(item, 'invAccount.dxResClassId', ''),
          resourceClasscifyIdType: _get(item, 'invAccount.dxResClassIdType'),
          batchNumber: _get(item, 'invAccount.batchNumber', ''),
          dxStArea: _get(item, 'invAccount.dxStArea', ''),
          dxStAreaId: _get(item, 'invAccount.dxStAreaId', ''),
          dxStAreaIdType: _get(item, 'invAccount.dxStAreaIdType', ''),
          dxStAreaName: _get(item, 'invAccount.dxStAreaName', ''),
          dxStLocation: _get(item, 'invAccount.dxStLocation', null),
          dxStLocationId: _get(item, 'invAccount.dxStLocationId', null),
          dxStLocationIdType: _get(item, 'invAccount.dxStLocationIdType', null),
          dxStLocationName: _get(item, 'invAccount.dxStLocationName', null),
          stockQuantity: _get(item, 'stockQuantity', null),
          materialStatus: _get(item, 'status', null),
          recordQuantity: null,
          sendOutQuantity: null,
          dynamicAttrs: {
            invAccountId: _get(item, 'invAccountId', null),
            accountDetailId: _get(item, 'id', null)
          }
        }
        record.dxStMoveInComeAFDs = [
          {
            dxStArea: {
              id: null
            },
            dxStAreaName: null,
            dxStLocation: {
              id: null
            },
            dxStLocationName: null,
            inComeQuantity: 1,
            recordQuantity: null,
            // 下拉选项
            dxStAreaOptions: [],
            // 下拉选项
            dxStLocationOptions: [],
            resourceClasscify: record.resourceClasscify,
            resourceClasscifyId: record.resourceClasscifyId,
            resourceClasscifyIdType: record.resourceClasscifyIdType,
            instantiableResource: record.instantiableResource,
            instantiableResourceId: record.instantiableResourceId,
            instantiableResourceIdType: record.instantiableResourceIdType,
            // instanceHolder: record.instanceHolder,
            instanceHolderId: record.instanceHolderId,
            instanceHolderIdType: record.instanceHolderIdType
            // dxStArea: record.dxStArea,
            // dxStAreaId: record.dxStAreaId,
            // dxStAreaIdType: record.dxStAreaIdType,
            // dxStAreaName: record.dxStAreaName,
            // dxStLocation: record.dxStLocation,
            // dxStLocationId: record.dxStLocationId,
            // dxStLocationIdType: record.dxStLocationIdType,
            // dxStLocationName: record.dxStLocationName
            // instantiableResourceId: _get(record.instantiableResource, 'instantiableResourceId', ''),
            // instantiableResourceIdType: _get(record.instantiableResource, 'instantiableResourceIdType', '')
          }
        ]
        return record
      })
      this.dataSource.push(...newItems)
      this.form.dxStMoveSendOutAFDs = this.dataSource
      this.showDetailsDialog = false
      this.$nextTick(() => {
        const targetHouseId = _get(this.form, 'dxStHouseInCome.id', null)
        if (targetHouseId) {
          this.getDxStAreaOptions(targetHouseId, newItems)
        }
      })
    }
  }
}
</script>

<style lang="scss">
.DxStMoveSendOutAFDsList {
  .cell {
    padding-bottom: 10px;
  }
}
</style>