<template>
  <el-dialog
    title="订单发货"
    :visible.sync="isShow"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    width="40%"
    @close="cancel"
  >
    <div v-loading="show_loading">
      <!--      :rules="delivery_rules"-->
      <el-form
        ref="delivery_form"
        :model="delivery_form"
        size="small"
        label-width="120px"
      >
        <!--        <el-form-item label="处理方式:">-->
        <!--          <el-radio-group v-model="delivery_form.resource">-->
        <!--            <el-radio label="1">-->
        <!--              整单发货-->
        <!--            </el-radio>-->
        <!--            <el-radio label="2">-->
        <!--              分包裹发货-->
        <!--            </el-radio>-->
        <!--          </el-radio-group>-->
        <!--        </el-form-item>-->
        <el-form-item label="收货人姓名:">
          {{ receive_data.realName }}
        </el-form-item>
        <el-form-item label="联系方式:">
          {{ receive_data.mobile }}
        </el-form-item>

        <el-form-item label="收货地址:">
          <span v-if="receive_data.area">
            {{ receive_data.area.provinceName }}-{{
              receive_data.area.cityName
            }}-{{ receive_data.area.districtName }}-{{ receive_data.address }}
          </span>
        </el-form-item>

        <el-form-item label="快递公司:" prop="expressId">
          <el-select
            v-model="delivery_form.expressId"
            style="width: 300px"
            placeholder="请选择"
            @change="expressIdChange"
          >
            <el-option
              v-for="item in dc_options"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          </el-select>
          <ul v-if="false">
            <li class="dc-item">顺风</li>
          </ul>
        </el-form-item>
        <el-form-item label="快递单号:" prop="deliveryNo">
          <el-input
            v-model="delivery_form.deliveryNo"
            style="width: 300px"
            placeholder="请输入"
          ></el-input>
        </el-form-item>
      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" :loading="loading" @click="confirm">
        确 定
      </el-button>
    </span>
  </el-dialog>
</template>

<script>
  import { getSaleOutInfo, updateSaleOutStatus } from "@/api/Stock";
  import { getAllExpress } from "@/api/System";
  import { addLogistics } from "@/api/Order";
  export default {
    name: "OrderOut",
    props: {
      isShow: {
        type: Boolean,
        default: false,
      },
      outId: {
        type: [String, Number],
        default: 0,
      },
      receiveData: {
        type: Object,
        default: () => {
          return {
            area: {},
          };
        },
      },
      unassignedSkuData: {
        type: Array,
        default: () => {
          return [];
        },
      },
      outWarehouseData: {
        type: Array,
        default: () => {
          return [];
        },
      },
      receiveDataId: {
        type: [String, Number],
        default: 0,
      },
    },
    data() {
      return {
        delivery_rules: {
          expressId: [
            { required: true, message: "请选择快递公司", trigger: "change" },
          ],
          deliveryNo: [
            { required: true, message: "请输入快递单号", trigger: "change" },
          ],
        },
        show_loading: false,
        receive_data: {},

        delivery_form: {
          deliveryNo: "",
          expressId: "",
          expressName: "",
        },
        dc_options: [],
        loading: false,
      };
    },
    created() {
      this.getAllExpress();
      if (this.receiveData.mobile) {
        this.receive_data = this.receiveData;
        if (this.receiveData.page === "order") {
          this.delivery_form = {
            deliveryNo: this.receiveData.deliveryNo,
            expressId: this.receive_data.expressId,
            expressName: this.receiveData.expressName,
          };
        }
      } else {
        this.getSaleOutInfo();
      }
    },
    methods: {
      // 获取详情
      async getSaleOutInfo() {
        this.show_loading = true;
        const data = await getSaleOutInfo(this.outId);
        this.show_loading = false;

        this.receive_data = data.data.receiveData;
      },
      cancel() {
        this.$emit("cancel");
      },
      expressIdChange(val) {
        this.receiveData.expressId = val;
        this.delivery_form.expressName = this.dc_options.find(
          (item) => item.id === val
        ).name;
      },
      // 修改订单的发货信息
      // async editOrderExpress() {
      //   this.loading = true;
      //   try {
      //     const data = await editOrderExpress(this.receiveData.orderId, {
      //       expressName: this.delivery_form.expressName,
      //       expressId: this.delivery_form.expressId,
      //       deliveryNo: this.delivery_form.deliveryNo,
      //     });
      //
      //     this.$message({
      //       type: "success",
      //       message: "操作成功",
      //     });
      //     this.loading = false;
      //     this.cancel();
      //     this.$emit("confirm");
      //   } catch {
      //     this.loading = false;
      //   }
      // },
      //  审核
      confirm() {
        console.log(this.receiveData.expressId);
        this.loading = true;
        try {
          const { data } = addLogistics({
            deliveryType: 1,
            logisticsData: {},
            deliveryNo: this.delivery_form.deliveryNo,
            expressName: this.delivery_form.expressName,
            expressId: this.delivery_form.expressId,
            no: "",
            orderId: this.receiveData.orderId,
          });
          this.$message.success("提交成功");
          this.$emit("confirm");
          this.loading = false;
        } catch {
          this.loading = false;
        }
        // this.$refs.delivery_form.validate((valid) => {
        //   if (valid) {
        //     if (this.receiveData.page === "order") {
        //       this.editOrderExpress();
        //     } else {
        //       this.updateSaleOutStatus();
        //     }
        //   }
        // });
      },
      // async updateSaleOutStatus() {
      //   this.loading = true;
      //   if (!this.outWarehouseData || !this.outWarehouseData.length) {
      //     this.$message({
      //       type: "warning",
      //       message: "请选择出库商品",
      //     });
      //     return;
      //   }
      //   try {
      //     const data = await updateSaleOutStatus({
      //       id: this.outId,
      //       auditName: this.userName,
      //       expressName: this.delivery_form.expressName,
      //       expressId: this.delivery_form.expressId,
      //       deliveryNo: this.delivery_form.deliveryNo,
      //       UnassignedSkuData: this.unassignedSkuData,
      //       outWarehouseData: this.outWarehouseData,
      //     });
      //
      //     this.$message({
      //       type: "success",
      //       message: "操作成功",
      //     });
      //     this.loading = false;
      //     this.cancel();
      //     this.$emit("confirm");
      //   } catch {
      //     this.loading = false;
      //   }
      // },
      // 获取快递公司
      async getAllExpress() {
        const data = await getAllExpress();
        this.dc_options = data.data;
      },
    },
  };
</script>

<style scoped>
  .dc-item {
    padding: 0 5px;
    border: 1px solid #dddddd;
    line-height: 20px;
    display: inline-block;
    margin-right: 10px;
    margin-top: 14px;
    cursor: pointer;
  }
</style>
