<template>
  <div>
    <el-card class="box-card">
      <!-- 基本信息-->
      <el-descriptions
        :title="$t('title.basicInformation')"
        :colon="false"
        border
      >
        <el-descriptions-item :label="$t('label.shopName')"
          >{{ returnInfo.storeName }}
          <i
            style="color:blue;"
            class="el-icon-document-copy"
            :title="$t('title.copy')"
            :copy-value="returnInfo.storeName"
            v-on:click="copy"
          ></i
        ></el-descriptions-item>
        <el-descriptions-item :label="$t('label.onlineShopOrder')">{{
          returnInfo.ormorder
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('label.documentStatus')">{{
          returnInfo.status | statusFilter
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('label.creator')">{{
          returnInfo.createBy
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('label.createTime')" span="2">{{
          returnInfo.createTime
        }}</el-descriptions-item>
        <el-descriptions-item label="退件目的仓">{{
          returnInfo.warehouseName
        }}</el-descriptions-item>
        <el-descriptions-item label="退件目的仓编码"
          >{{ returnInfo.warehouseCode }}
          <i
            style="color:blue;"
            class="el-icon-document-copy"
            :title="$t('title.copy')"
            :copy-value="returnInfo.ormorder"
            v-on:click="copy"
          ></i
        ></el-descriptions-item>
        <el-descriptions-item label="退件物流单号"
          >{{ returnInfo.shippingNo }}
          <i
            style="color:blue;"
            class="el-icon-document-copy"
            :title="$t('title.copy')"
            :copy-value="returnInfo.ordersNo"
            v-on:click="copy"
          ></i
        ></el-descriptions-item>
        <el-descriptions-item :label="$t('noheadFlag')" span="1"
        >
          <div style="color: red" v-if="
          returnInfo.noheadFlag == 1
          "
          >
            {{ $t("yes") }}
          </div>
          <div style="color: red"
            v-if="
              returnInfo.noheadFlag == 0
            "
          >
            {{ $t("no") }}
          </div>

        </el-descriptions-item>
        <el-descriptions-item  :label="$t('label.isSelfPickupOrder')" span="1">
          <span v-if="returnInfo.isSelfPickupOrder === false">{{ $t("no") }}</span>
          <span v-else>{{ $t("yes") }}</span>
        </el-descriptions-item>

        <el-descriptions-item :label="$t('label.shopifyNumber')" span="1"
        >{{ returnInfo.cutUser }}
        </el-descriptions-item>
      </el-descriptions>
    </el-card>
    <el-card class="box-card">
      <!-- 基本信息-->
      <el-descriptions :title="$t('sender')" :colon="false" border>
        <el-descriptions-item :label="$t('country')" span="3">{{
          returnInfo.orderReceiverCountry
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('state')">{{
          returnInfo.orderReceiverState
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('city')">{{
          returnInfo.orderReceiverCity
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('suburb')">{{
          returnInfo.orderReceiverDistrict
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('street')" span="3">{{
          returnInfo.orderReceiverStreet
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('address')" span="3">{{
          returnInfo.orderReceiverAddress1
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('dooeNo')" span="2">{{
          returnInfo.orderReceiverAddress2
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('senders')">{{
          returnInfo.orderReceiverName
        }}</el-descriptions-item>
      </el-descriptions>
    </el-card>

    <el-card class="box-card">
      <el-descriptions
        :title="$t('returnItem') + '-' + (index + 1)"
        v-for="(item, index) in returnOrderItemInfo"
        :key="index"
        :colon="false"
        border
      >
        <el-descriptions-item
          :label="$t('onlyCode')"
          span="3"
          v-if="item.uniqueCode"
          >{{ item.uniqueCode }}
          <!--          <el-input-->
          <!--            style="width: 450px;"-->
          <!--            class="filter-item"-->
          <!--            v-model="item.uniqueCode"-->
          <!--          />-->
        </el-descriptions-item>
        <el-descriptions-item :label="$t('sku')"
          >{{ item.skuCode }}
          <i
            style="color:blue;"
            class="el-icon-document-copy"
            :title="$t('title.copy')"
            :copy-value="item.skuCode"
            v-on:click="copy"
          ></i
        ></el-descriptions-item>
        <el-descriptions-item :label="$t('goodsName')" span="2">{{
          item.tittle
        }}</el-descriptions-item>
        <el-descriptions-item :label="$t('status')"
          >{{ item.status | statusFiltr2 }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('update')" span="2">{{
          item.updateTime
        }}</el-descriptions-item>
        <el-descriptions-item
          v-if="confirmSh == 2"
          :label="$t('returngoodsType')"
          span="1"
        >
          {{ item.receiveType | receiveTypeFilter }}
        </el-descriptions-item>
        <el-descriptions-item
          v-if="confirmSh == 2"
          :label="$t('inboundStatus')"
          span="2"
        >
          {{ item.inboundStatusShow | inboundStatusFilter }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('appAmount')"
          >{{ item.applyQuantity }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('recAmount')" span="2"
          >{{ item.receiveQuantity }}
        </el-descriptions-item>

        <el-descriptions-item
          v-if="confirmSh == 1"
          :label="$t('returngoodsType')"
        >
          <el-select
            :placeholder="$t('place.pleaseSelect')"
            clearable
            size="mini"
            style="width: 100px;"
            class="filter-item"
            v-model="item.receiveType"
          >
            <el-option
              v-for="re in receiveTypeList"
              :key="re.value"
              :label="re.label"
              :value="re.value"
            >
            </el-option>
          </el-select>
        </el-descriptions-item>
        <el-descriptions-item
          v-if="confirmSh == 1"
          :label="$t('enterAmount')"
          span="2"
        >
          <el-input-number
            v-model="item.confirmShNum"
            size="mini"
            :min="1"
            :max="item.applyQuantity + item.receiveQuantity"
          ></el-input-number>
        </el-descriptions-item>

        <el-descriptions-item
          v-if="confirmSh == 1"
          :label="$t('inboundStatus')"
        >
          <el-select
            size="mini"
            style="width: 100px;"
            class="filter-item"
            v-model="item.inboundStatus"
          >
            <el-option value="success_manual" :label="$t('label.manualReturn')" />
            <el-option value="returning" :label="$t('label.inReturnTransit')" />
            <el-option value="shipLost" :label="$t('label.shipmentLost')" />
            <el-option value="returnLost" :label="$t('label.returnLost')" />
          </el-select>
        </el-descriptions-item>
        <el-descriptions-item v-if="confirmSh == 1" :label="$t('actions')">
          <!-- <template slot="label"> -->
          <el-button
            type="success"
            @click="confirmShClick(item)"
            v-if="item.status != '01'"
            v-loading="btnLoading"
            >{{ $t("receives") }}</el-button
          >
          <!-- </template> -->
        </el-descriptions-item>
      </el-descriptions>
    </el-card>

    <el-card class="box-card">
      <el-descriptions :title="$t('title.operationLog')"> </el-descriptions>
      <el-timeline>
        <el-timeline-item
          type="primary"
          v-for="(log, index) in logs"
          :key="index"
          :timestamp="log.createTime"
        >
          {{ log.operator }} :{{ log.statusNotes }}
        </el-timeline-item>
      </el-timeline>
    </el-card>
  </div>
</template>

<script>
import { handleClipboard } from "@/api/oms/copy";
import { getReturnInfo, updateConfirmSh } from "@/api/oms/return/return";
import global from "@/views/oms/global";
import { queryByOrdersId } from "@/api/oms/order/address";
import { dcmAdd, dcmSub, accDiv, accMul } from "@/utils/toolUtil";
export default {
  name: "returnInfoDialog",
  props: ["returnId", "confirmSh"],
  components: {},
  data() {
    return {
      afterSaleStatusSuccess: global.afterSaleStatusSuccess,
      returnInfo: {},
      returnOrderItemInfo: {},
      checkData: {},
      btndisabled: true,
      receiveTypeList: global.receiveType,
      btnLoading: false,
      logs: []
    };
  },
  filters: {
    statusFilter(key) {
      var value = "";
      global.returnStatus.forEach(status => {
        if (status.value == key) {
          console.log(status.label);
          value = status.label;
        }
      });
      return value;
    },
    statusFiltr2(key) {
      var value = "";
      global.returnDeatilStatus.forEach(status => {
        if (status.value == key) {
          console.log(status.label);
          value = status.label;
        }
      });
      return value;
    },
    receiveTypeFilter(key) {
      var value = "";
      global.receiveType.forEach(type => {
        if (type.value == key) {
          // console.log(type.label);
          value = type.label;
        }
      });
      return value;
    },
    inboundStatusFilter(key) {
      var value = "";
      global.inboundStatus.forEach(type => {
        if (type.value == key) {
          // console.log(type.label);
          value = type.label;
        }
      });
      return value;
    }
  },
  created() {
    this.getReturnInfo();
  },
  methods: {
    getReturnInfo() {
      getReturnInfo(this.returnId).then(res => {
        if (200 == res.code) {
          this.returnInfo = res.data;
          this.returnOrderItemInfo = res.data.items;
            for(var i=0;i<this.returnOrderItemInfo.length;i++){
              if("00" == this.returnOrderItemInfo[i].status){
                 this.returnOrderItemInfo[i].inboundStatus = '';
              }
            }
          this.logs = res.data.logItems;
        }
      });
    },
    //复制
    copy(event) {
      console.log(event.target.attributes["copy-value"].value);
      var text = event.target.attributes["copy-value"].value;
      handleClipboard(text, event);
    },
    confirmShClick(row) {
      this.btnLoading = true;
      if (!row.receiveType) {
        this.$message.error("请选择签收货品类型!");
        this.btnLoading = false;
        return false;
      }
      if (!row.confirmShNum) {
        this.$message.error("请输入收货数量!");
        this.btnLoading = false;
        return false;
      }
      if (!row.inboundStatus) {
        this.$message.error("请选择入库状态!");
        this.btnLoading = false;
        return false;
      }
      // if (!row.uniqueCode) {
      //   this.$message.error("请输入唯一码!");
      //   this.btnLoading = false;
      //   return false;
      // }

      this.$confirm("是否确认收货?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          updateConfirmSh(row).then(
            res => {
              if (200 == res.code) {
                this.$message({
                  message: "操作成功",
                  type: "success"
                });
                if (row.receiveQuantity > 0) {
                  row.receiveQuantity = dcmAdd(
                    row.receiveQuantity,
                    row.confirmShNum
                  );
                } else {
                  row.receiveQuantity = row.confirmShNum;
                }

                this.btnLoading = false;
              }
            },
            error => {
              this.btnLoading = false;
            }
          );
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作"
          });
          this.btnLoading = false;
        });
    }
  }
};
</script>

<style lang="scss" scoped></style>
