hitch-sb-antd/src/views/sb/info/modules/BaseFormLocation.vue

<template>
  <a-card :bordered="false" v-show="visible" class="card">
    <a-row :gutter="48" style="position:fixed;bottom:150px;z-index:999;display:flex; justify-content: center;width: 90%;">
      <a-col :md="48" :sm="48">
        <span>
          <a-button type="primary" @click="save()">保存</a-button>
          <a-button style="margin-left: 8px" type="default" @click="handleCancel()">返回</a-button>
        </span>
      </a-col>
    </a-row>
    <div>
      <a-table
        :columns="columns"
        :data-source="modal"
        bordered
        :defaultExpandAllRows="true"
      >
        <template v-slot:index="text,record,index">
          {{ index+1 }}
        </template>
        <template v-slot:positionNo="text,record,index">
          <div v-if="changeType===1">
            {{ text }}
          </div>
          <div v-else>
            <a-input v-if="record.isChild !== 1" style="width: 150px" v-model="record.positionNo" />
            <div v-else style="width:300px">
              <a-input
                disabled
                style="width: 50%"
                v-model="record.positionNo"/>
              <a-button type="primary" @click="handleSbNoSelect(index)">选择</a-button>
            </div>
          </div>
        </template>
        <template v-slot:positionName="text,record">
          <a-tree-select
            v-if="changeType===1"
            style="width: 150px"
            :dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
            :treeData="treeData"
            :treeNodeFilterProp="'title'"
            :showSearch="true"
            v-model="record.positionId"
            placeholder="请选择"
          >
          </a-tree-select>
          <span v-else>  {{ text }}</span>
        </template>
        <span slot="status" slot-scope="text">
          <badge
            :status="DictCache.COLOR.SB_INFO_STATUS[text]"
            :text="statusMap[text]" />
        </span>
      </a-table>
    </div>
    <sb-position-no-modal ref="sbPositionNoModal" @selected="handleSbNoSelectd"/>

  </a-card>
</template>

<script>
import { getSbPositionTree } from '@/api/sb/position'
import SbPositionNoModal from '@/views/sb/info/modules/SbPositionNoModal'
import { batchChanges } from '@/api/sb/info'

export default {
  name: 'BaseFillGatherTask',
  components: {
    SbPositionNoModal
  },
  data () {
    return {
      visible: false,
      modal: [],
      expandedRowKeys: [],
      treeData: [],
      sbParentOPt: '',
      statusMap: {},
      changeType: 0,
      columns: [
        {
          title: '序号',
          key: 'index',
          align: 'center',
          width: 50,
          scopedSlots: { customRender: 'index' }
        },
        {
          title: '设备名称',
          width: 100,
          dataIndex: 'name'
        },
        {
          title: '设备编号',
          dataIndex: 'no',
          width: 120
        },
        {
          title: '设备类型',
          dataIndex: 'type',
          width: 150,
          customRender: (text, record, index) => {
            return record.typeName
          }
        },
        {
          title: '设备位号',
          dataIndex: 'positionNo',
          width: 150,
          scopedSlots: { customRender: 'positionNo' }
        },
        {
          title: '设备位置',
          checked: true,
          width: 200,
          dataIndex: 'positionName',
          scopedSlots: { customRender: 'positionName' }

        },
        {
          title: '状态',
          dataIndex: 'status',
          width: 100,
          scopedSlots: { customRender: 'status' }
        }
      ]
    }
  },
  props: {
  },
  created () {
    // 下拉框map
    this.statusMap = this.DictCache.getLabelByValueMapByType(this.DictCache.TYPE.SB_INFO_STATUS)

    getSbPositionTree().then(res => {
      this.treeData = res.data
    })
  },
  methods: {
    base (record, type) {
      this.visible = true
      this.changeType = type
      this.modal = record.map(item => {
        if (item.children.length === 0) item.children = null
        return item
      })
      console.log(this.modal)
      console.log(this.changeType)
    },
    save () {
      const params = this.modal.map(item => {
        const param = {
          sbId: item.id,
          changeType: this.changeType,
          sbNoId: item.positionNo,
          positionId: item.positionId
        }
        return param
      })
      batchChanges({ sbChangeRecordDTOList: params }).then(res => {
        this.$message.success('修改完成！')
        this.handleCancel()
      })
      console.log(params)
    },
    handleSbNoSelect (i) {
      this.sbParentOPt = i
      this.$refs.sbPositionNoModal.base()
    },
    handleSbNoSelectd (keys, rows) {
      console.log(keys, rows)
      this.modal[ this.sbParentOPt ].positionNo = rows[0].no
    },
    handleCancel () {
      this.visible = false
      this.$emit('ok')
    }
  }
}
</script>
<style lang="less" scoped>

</style>