<template>
  <el-dialog title="物流发货" width="25%" :close-on-click-modal="false" :visible.sync="visible">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit('dataForm')" label-width="80px">
      <el-form-item label="快递公司" prop="expressCode">
        <el-select class="w-100" v-model="dataForm.expressCode" @change="selectChange" placeholder="请选择快递公司" clearable filterable>
          <el-option v-for="item in options" :key="item.companyCode" :label="item.companyName" :value="item.companyCode">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="物流单号" prop="logisticCode">
        <el-input maxlength="50" v-model="dataForm.logisticCode" placeholder="请输入快递单号"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit('dataForm')">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
// import orderService from '@/api/orderService.js'
import { expressCompanyList } from '@/api/operating.js'
import { shopOrderPackageShip, shopOrderPackageUpdateShip } from '@/api/order'
export default {
  data () {
    return {
      visible: false,
      type: '',
      dataForm: {
        expressCode: '',
        logisticCode: ''
      },
      options: [],
      dataRule: {
        express_code: [{
          required: true,
          message: '请先选择快递公司',
          trigger: 'change'
        }],
        logistic_code: [{
          required: true,
          message: '快递单号不能为空',
          trigger: 'blur'
        }]
      }
    }
  },
  mounted () {
    this.goodStreamList()
  },
  methods: {
    init (item, type) {
      this.type = type || ''
      if (type == 'update') {
        // this.deliveryDetail(item.orderId, item.packageId)
        this.dataForm = {
          expressCode: item.packageExpressVo.expressCode,
          expressName: item.packageExpressVo.expressName,
          logisticCode: item.packageExpressVo.logisticCode,
          packageId: item.packageId,
          businessId: item.businessId
        }
        console.log(item)
      } else {
        this.dataForm = {
          all: true,
          expressCode: '',
          expressName: '',
          orderId: item.orderId
        }
      }
      this.visible = true
    },

    goodStreamList () {
      expressCompanyList().then(res => {
        this.options = res.data
      })
    },
    /* 发货详情 */
    deliveryDetail (orderId, id) {
      orderService.deliveryDetail(orderId, packageId).then(res => {
        if (res && res.code == 200) {
          if (res.data.express) {
            this.dataForm = res.data.express
          }
          this.dataForm.order_id = res.data.order_id
          this.dataForm.package_id = res.data.id
        }
      })
    },

    dataFormSubmit (e) {
      this.$refs[e].validate((valid) => {
        if (valid) {
          if (this.type) {
            // 修改
            shopOrderPackageUpdateShip(this.dataForm).then(res => {
              if (res && res.code == 200) {
                this.$message.success('修改信息成功！')
                this.$emit('result', res.data)
              } else {
                this.$message.error(res.msg)
              }
            })
          } else {
            shopOrderPackageShip(this.dataForm).then(res => {
              if (res && res.code == 200) {
                this.$message.success('发货成功！')
                this.$emit('result', res.data)
              } else {
                this.$message.error(res.msg)
              }
            })
          }
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },

    selectChange (e) {
      for (let item of this.options) {
        if (e == item.companyCode) {
          this.dataForm.expressName = item.companyName
          break
        }
      }
    }
  }
}
</script>

<style lang="scss">
.w-100 {
  width: 100%;
}
</style>
