<template>
  <div>
    <Navbar
      :title="$t('lang.AssetInventory.performInventoryTasks')"
      :is-go-back="false"
      style="margin-left: 14px"
    />
  </div>
  <section>
    <a-steps :current="currentStep">
      <a-step title="选择盘点单" />
      <a-step title="人工确认盘点数据" />
    </a-steps>
  </section>
  <a-divider />
  <section>
    <manually-confirm-counting-data-step1
      v-if="currentStep == 0"
      :current-step="currentStep"
      @change-step="nextStep"
      @previous="previousStep"
    />
    <PerformInventoryTasks
      v-if="currentStep == 1"
      :id="id"
      :current-step="currentStep"
      @change-step="nextStep"
      @next="nextStep"
    />
  </section>
</template>

<script>
import PerformInventoryTasks from './PerformInventoryTasks.vue';
import ManuallyConfirmCountingDataStep1 from './ManuallyConfirmCountingDataStep1.vue';

export default {
  components: {
    PerformInventoryTasks,
    'manually-confirm-counting-data-step1': ManuallyConfirmCountingDataStep1,
  },
  data: function () {
    return {
      id: '',
      currentStep: 0,
      infoWindowNo: '20220427_143952',
    };
  },

  methods: {
    nextStep: function (data) {
      var _self = this;
      _self.currentStep = data.step;
      _self.id = data.id;
    },
    previousStep: function (data) {
      var _self = this;
      _self.currentStep = data;
    },
    mounted: function () {},
  },
};
</script>
<style scoped>
.grid-container {
  display: grid;
  grid-template-rows: 8% 8% 84%;
  grid-template-columns: 100%;
  width: 100%;
  /*视口被均分为 100 单位的 vh 占据整个窗口，扣掉顶部 topNav 的距离后，计算得到 responseOrganizationSelect 的高度*/
  height: calc(100vh - 130px);
  margin-top: 10px;
}

.grid-item-1 {
  grid-row: 1/2;
}

.grid-item-2 {
  grid-row: 2/3;
}

.grid-item-3 {
  grid-row: 3/4;
}

.box {
  border: 1px #ccc solid;
  margin-bottom: 15px;
  padding-top: 10px;
  border-radius: 5px;
  background-color: #ffffff;
}

.label {
  float: left;
}

.div-form {
  margin-bottom: 10px;
}
.ant-divider-horizontal {
  margin: 8px 0;
}
</style>
