<template>
    <el-dialog :title="title" visible :before-close="closeDialog" :close-on-click-modal="false">
      <el-form v-if="agreement"  ref="elForm" :model="formData" size="small" label-width="100px" >
        <el-form-item label="订单号" prop="field101">
            111
        </el-form-item>

        <el-row>
          <el-col :span="12">
            <el-form-item label="收货人" prop="field104">
              111
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="收货人电话" prop="field103">
              111
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="总控货箱数" prop="field105">
            111
        </el-form-item>

        <el-form-item label="原放货箱数" prop="field106">
            111
        </el-form-item>

        <el-form-item label="现放货箱数" prop="field106">
            <el-input v-model="formData.cnt" placeholder=""></el-input>
        </el-form-item>

         <el-form-item label="备注" prop="field106">
            <el-input v-model="formData.cnt" placeholder=""></el-input>
        </el-form-item>

         <el-form-item label="控货手机号" prop="field106">
            13000000000
        </el-form-item>
        <el-form-item label="手机验证码" prop="field106">
            <el-input v-model="formData.cnt" placeholder="" style="width: 100px; margin-right:10px"></el-input>
            <el-button type="default">获取验证码</el-button>
        </el-form-item>
        <div class="title">审批流程</div>
        <work-flow bmpkey="free_apple" />
        <el-form-item label="">
            <el-button type="primary" @click="$alert('// TODO')">提交申请</el-button>
            <el-button @click="closeDialog">关闭</el-button>
        </el-form-item>
      </el-form>


      <div v-else>
          <need-know keyname="control" />
          <div style="margin-top:30px">
              <el-button type="primary" @click="agreement=true">我同意</el-button>
              <el-button @click="closeDialog">关闭</el-button>
          </div>
      </div>
    </el-dialog>
</template>
<script>
import WorkFlow from '@/components/WorkFlow'
import NeedKnow from '@/components/NeedKnow'
export default {
    props:{
        orderId: [String, Number]
    },
    components: {NeedKnow, WorkFlow},
    data(){
        return {
            show: false,
            detail: null,
            formData:{},
            agreement: false, // 是否同意协议
        }
    },
    computed:{
        title(){
            let t = '放货修改'
            return t
        }
    },
    created(){
        this.show = true
        this.loadData()
    },
    methods:{
        loadData(){

        },
        closeDialog(){
            this.show = false
            this.$emit('close');
        },

    }
}
</script>
<style lang="scss" scoped>
.title{
  font-size:16px;
  margin:20px 0;
  display:flex;
  align-items:center;
  &:before{
    content: '';
    width:5px;
    height: 15px;
    background:#666;
    margin-right:10px;
  }
}
</style>
