<template>
  <div>
    <el-button v-if="showEdit" v-permission="permission.edit" :loading="crud.status.cu === 2" :disabled="disabledEdit"
               size="mini" type="primary" icon="el-icon-edit" @click="crud.toEdit(data)"></el-button>

    <el-button v-if="callContainer" :disabled="disabledcallContainer" size="mini"
               type="warning" @click="toCallContainer(data)">呼叫
    </el-button>

    <!--      呼叫容器弹窗界面-->
    <CallContainer ref="callContainer"/>

    <el-button v-if="showContainerIn" :disabled="disabledContainerIn" size="mini"
               type="success" @click="toContainerIn(data)">入场
    </el-button>

    <!--      容器入场弹窗界面-->
    <ContainerIn ref="containerIn"/>

    <!--      容器返空弹窗界面-->
    <ReturnContainer ref="returnContainer"/>

    <el-button v-if="showContainerOut" :disabled="disabledContainerOut" size="mini"
               type="danger" @click="toContainerOut(data)">出场
    </el-button>

    <el-button v-if="showReturnEntity" :disabled="disabledReturnEntity" size="mini"
               type="info" @click="toReturnEntity(data)">返空
    </el-button>


    <el-popover v-model="pop" v-permission="permission.del" placement="top" width="180" trigger="manual"
                @show="onPopoverShow" @hide="onPopoverHide">
      <p>{{ msg }}</p>
      <div style="text-align: right; margin: 0">
        <el-button size="mini" type="text" @click="doCancel">取消</el-button>
        <el-button :loading="crud.dataStatus[crud.getDataId(data)].delete === 2" type="primary" size="mini"
                   @click="crud.doDelete(data)">确定
        </el-button>
      </div>
      <el-button slot="reference" :disabled="disabledDle" v-if="showDle" type="danger" icon="el-icon-delete" size="mini"
                 @click="toDelete"/>
    </el-popover>
  </div>
</template>
<script>
import CRUD, {crud} from '@crud/crud'
import stockUrl, {lineReturn} from "@/api/stock";
import ContainerIn from "@/views/base-data/stock/containerIn.vue";
import CallContainer from "@/views/base-data/stock/callContainer.vue";
import ReturnContainer from "@/views/base-data/stock/returnContainer.vue";

export default {
  components: {ReturnContainer, CallContainer, ContainerIn},
  mixins: [crud()],
  props: {
    data: {
      type: Object,
      required: true
    },
    permission: {
      type: Object,
      required: true
    },
    disabledEdit: {
      type: Boolean,
      default: false
    },
    disabledContainerOut: {
      type: Boolean,
      default: false
    },
    disabledContainerIn: {
      type: Boolean,
      default: false
    },
    disabledcallContainer: {
      type: Boolean,
      default: false
    },
    disabledReturnEntity: {
      type: Boolean,
      default: false
    },
    showEdit: {
      type: Boolean,
      default: true
    },
    disabledDle: {
      type: Boolean,
      default: false
    },
    showDle: {
      type: Boolean,
      default: true
    },
    showContainerOut: {
      type: Boolean,
      default: false
    },
    showContainerIn: {
      type: Boolean,
      default: false
    },
    showReturnEntity: {
      type: Boolean,
      default: false
    },
    callContainer: {
      type: Boolean,
      default: false
    },
    msg: {
      type: String,
      default: '确定删除本条数据吗？'
    }
  },
  data() {
    return {
      pop: false,
      ContainerIn: {
        containerCode: '',
        position: ''
      }
    }

  },
  methods: {
    doCancel() {
      this.pop = false
      this.crud.cancelDelete(this.data)
    },
    toDelete() {
      this.pop = true
    },
    [CRUD.HOOK.afterDelete](crud, data) {
      if (data === this.data) {
        this.pop = false
      }
    },
    onPopoverShow() {
      setTimeout(() => {
        document.addEventListener('click', this.handleDocumentClick)
      }, 0)
    },
    onPopoverHide() {
      document.removeEventListener('click', this.handleDocumentClick)
    },
    handleDocumentClick(event) {
      this.pop = false
    },
    toContainerIn(data) {
      this.$refs.containerIn.dialogVisible = true
      this.$refs.containerIn.containerInClick(data);
    },
    toContainerOut(data) {
      this.ContainerIn.containerCode = data.code
      this.ContainerIn.position = data.point.code
      stockUrl.containerOut(this.ContainerIn).then(res => {
        if (res.code == 200) {
          this.crud.notify(res.msg, CRUD.NOTIFICATION_TYPE.SUCCESS);
          this.crud.toQuery()
        } else {
          this.crud.notify(res.msg, CRUD.NOTIFICATION_TYPE.ERROR);
        }
      })
    },
    toCallContainer(data) {
      if (data.point == null) {
        return this.crud.notify(data.code + "没有入场!", CRUD.NOTIFICATION_TYPE.ERROR);
      }
      this.$refs.callContainer.dialog = true
      this.$refs.callContainer.callContainerClick(data)
    },
    toReturnEntity(data){
      this.$refs.returnContainer.dialog = true
      this.$refs.returnContainer.returnEntityClick(data)
    }
  }
}
</script>
