<template>
    <div>
            <el-form ref="form" :model="formData"  inline  label-position="top">
                <el-row :gutter="40">
                    <el-col :span="12">
                        <el-collapse v-model="activeNames" >
                            <el-collapse-item title="关键信息" name="1">
                                    <el-form-item label="加工单号" prop="kitNo">
                                        <el-input v-model="formData.kitNo" disabled></el-input>
                                    </el-form-item>
                                    <el-form-item label="组合件类型" prop="kitType">
                                        <el-select v-model="formData.kitType" :disabled="mode==='edit' || mode==='detail'">
                                          <el-option label="组合加工(A=B+C)" value="COM"></el-option>
                                          <el-option label="辅料加工(A=A+辅料)" value="ACC"></el-option>
                                          <el-option label="增值加工(A=A)" value="VA"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item label="货主" prop="ownerCode">
                                       <PublicQuery
                                        title="货主"
                                        :disabled="mode==='edit' || mode==='detail'"
                                        single
                                        cfgKey="kitWmsCustomerCode"
                                        baseUrl="/kit_web/kitweb"
                                        :valueField.sync="formData.ownerCode"
                                        :textField.sync="formData.ownerCode"
                                      ></PublicQuery>
                                    </el-form-item>
                                    <el-form-item label="货主名称" prop="ownerName">
                                        <el-input v-model="formData.ownerName" disabled></el-input>
                                    </el-form-item>
                                    <el-form-item label="计划加工台" prop="kitLoc">
                                       <PublicQuery
                                        title="计划加工台"
                                        single
                                        :disabled="mode==='edit' || mode==='detail'"
                                        cfgKey="kitWmsLoc"
                                        baseUrl="/kit_web/kitweb"
                                        :valueField.sync="formData.kitLoc">
                                        </PublicQuery>
                                    </el-form-item>
                                    <el-form-item label="状态" prop="status">
                                        <el-select v-model="formData.status" disabled>
                                          <el-option label="创建" value="00"></el-option>
                                          <el-option label="部分加工" value="70"></el-option>
                                          <el-option label="完全加工" value="80"></el-option>
                                          <el-option label="取消订单" value="90"></el-option>
                                          <el-option label="关闭订单" value="99"></el-option>
                                        </el-select>
                                    </el-form-item>
                            </el-collapse-item>
                        </el-collapse>
                      </el-col>
                      <el-col :span="12">
                        <el-collapse v-model="activeNames" >
                            <el-collapse-item title="基础信息" name="1">
                                    <el-form-item label="计划加工时间从" prop="fmEtk">
                                      <el-date-picker
                                        v-model="formData.fmEtk"
                                        type="datetime"
                                        :disabled="mode==='detail'"
                                        placeholder="选择日期时间">
                                      </el-date-picker>
                                    </el-form-item>
                                    <el-form-item label="计划加工时间到" prop="toEtk">
                                      <el-date-picker
                                        v-model="formData.toEtk"
                                        type="datetime"
                                        :disabled="mode==='detail'"
                                        placeholder="选择日期时间">
                                      </el-date-picker>
                                    </el-form-item>
                                    <el-form-item label="物流单号" prop="logisticNo">
                                        <el-input v-model="formData.logisticNo" :disabled="mode==='detail'"></el-input>
                                    </el-form-item>
                                    <el-form-item label="审核人" prop="auditOpName">
                                       <PublicQuery
                                        title="审核人"
                                        single
                                        disabled
                                        cfgKey="kitWmsSkuCode"
                                        baseUrl="/kit_web/kitweb"
                                        :valueField.sync="formData.auditOpName">
                                        </PublicQuery>
                                    </el-form-item>
                                    <el-form-item label="审核状态" prop="auditStatus">
                                        <el-select v-model="formData.auditStatus" disabled>
                                          <el-option label="未审核" value="00"></el-option>
                                          <el-option label="不审核" value="90"></el-option>
                                          <el-option label="已审核" value="99"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item label="审核时间" prop="auditTime">
                                        <el-input v-model="formData.auditTime" disabled></el-input>
                                    </el-form-item>
                            </el-collapse-item>
                        </el-collapse>
                      </el-col>
                </el-row>
                <el-row class="row-mrg-t">
                    <el-col :span="24">
                        <el-collapse v-model="activeNames" >
                            <el-collapse-item title="加工明细" name="2">
                                <el-row v-if="this.mode=='detail'">
                                    <el-button v-auth="50300030101" type="primary" v-if="(formMesg.status === '70' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90')) || (formMesg.status === '80' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90'))" @click="handleAdd">生成上架任务</el-button>
                                </el-row>
                                <el-row>
                                    <el-table
                                    :data='parentDetail'
                                     @selection-change="handleSelect">
                                        <table-column type="selection" fixed align="center"
                                            width="55">
                                        </table-column>
                                        <table-column
                                            label="行号"
                                            prop="kitLineNo">
                                        </table-column>
                                        <table-column
                                            label="状态"
                                            prop="status">
                                             <template slot-scope="scope">
                                              {{ $utils.keyMatcher(scope.row.status, $keys.maintain.status).name }}
                                            </template>
                                        </table-column>
                                        <table-column
                                            label="父件">
                                            <template slot-scope="scope">
                                              <p>{{scope.row.parentSku}}</p>
                                              <!-- <p>{{scope.row.parentSkuName}}</p> -->
                                            </template>
                                        </table-column>
                                        <table-column
                                            label="预加工数"
                                            prop="qtyPlanUom">
                                        </table-column>
                                        <table-column
                                            label="已加工数"
                                            prop="qtyCompleteEa">
                                        </table-column>
                                        <table-column
                                            label="包装规格"
                                            prop="packDesc">
                                        </table-column>
                                        <table-column
                                            label="包装单位"
                                            prop="uomDesc">
                                        </table-column>
                                        <table-column
                                            label="计划加工台"
                                            prop="kitLoc">
                                        </table-column>
                                        <table-column
                                            label="上架规则"
                                            prop="paRuleName">
                                        </table-column>
                                        <table-column
                                            label="批次号"
                                            prop="lotNum">
                                        </table-column>
                                        <table-column label="操作" width="100" fixed="right" v-if="mode=='detail'">
                                            <template slot-scope="scope">
                                              <el-tooltip content="编辑" placement="top">
                                                <el-button
                                                    size="mini"
                                                    type="primary"
                                                    icon="el-icon-edit"
                                                    plain
                                                    circle
                                                    @click="handleEdit(scope.row)"></el-button>
                                              </el-tooltip>
                                              <el-tooltip content="工序" placement="top">
                                                <el-button
                                                    size="mini"
                                                    type="primary"
                                                    icon="el-icon-edit"
                                                    plain
                                                    circle
                                                    @click="handleProcess(scope.row)"></el-button>
                                              </el-tooltip>
                                            </template>
                                        </table-column>
                                    </el-table>
                                </el-row>
                            </el-collapse-item>
                        </el-collapse>
                    </el-col>
                </el-row>
            </el-form>
            <el-row class="row-mrg-t">
                <el-col :span="24">
                    <el-collapse v-model="activeNames" >
                        <el-collapse-item title="操作信息" name="2">
                          <div class="row-mrg-t" v-if="mode==='detail'">
                              <div class="operation-info">
                                <span>创建人登录名(姓名)：{{formData.creatorLoginName}}({{formData.creatorName}})</span>
                                <span>创建时间：{{formData.createTime}}</span>
                                <span>修改人登录名(姓名)：{{formData.modifierLoginName}}({{formData.modifierName}})</span>
                                <span>修改时间：{{formData.modifyTime}}</span>
                              </div>
                          </div>
                        </el-collapse-item>
                    </el-collapse>
                </el-col>
            </el-row>
            <div class="row-mrg-t" v-if="mode=='detail'">
              <el-button v-auth="50500040109" type="primary" v-if="(formMesg.status === '70' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90')) || (formMesg.status === '80' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90'))" @click="handleTask">生成上架任务</el-button>
              <el-button v-auth="50500040104" type="primary" v-if="(formMesg.status === '00' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90')) || (formMesg.status === '70' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90'))" @click="handleKitControll">加工确认</el-button>
              <el-button v-auth="50500040105" type="primary" v-if="(formMesg.status === '70' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90')) || (formMesg.status === '80' && (formMesg.auditStatus === '99' || formMesg.auditStatus === '90'))" @click="handleCancel">取消加工</el-button>
            </div>
          <ProcessForm
          :goodsFormVisible="goodsFormVisible"
          ref="msg"
          @handleProcessclose="handleProcessclose">
          </ProcessForm>
    </div>
</template>
<script>
import ProcessForm from './childrenForm/processForm.vue'
export default {
  components: {
    ProcessForm
  },
  created () {
    this.mode = this.$route.params.mode || 'create'
    if (this.mode === 'edit') {
      this.formData = this.$route.params[0]
    }
    if (this.mode === 'detail') {
      this.formData = this.$route.params[0]
    }
  },
  data () {
    return {
      goodsFormVisible: false,
      mode: 'create', // 模式
      activeNames: ['1', '2', '3'],
      editBool: false,
      delSubDetail: [],
      formMesg: {},
      parentDetail: []
    }
  },
  props: {

  },
  mounted () {
    this.handleQuery()
  },
  methods: {
    getData (url, param) {
      return this.$https.post(url, param)
    },
    handleQuery () {
      const url = this.$API.maintain.KitBomKitConfirmList.query
      const param = { kitNo: this.formData.kitNo, 'page.currentPage': 1, 'page.limitCount': 10 }
      const urls = this.$API.maintain.KitBomKitConfirmList.header
      const params = { kitNo: this.formData.kitNo }
      this.$https.all([this.getData(url, param), this.getData(urls, params)]).then(res => {
        this.parentDetail = res[0].rows
        this.formMesg = res[1].data
      })
    },
    handleAdd () {
      if (!this.delSubDetail.length) {
        return this.$message('请选着数据')
      }
      const url = this.$API.maintain.KitBomKitConfirmList.createTask
      const param = { resultDetails: JSON.stringify(this.delSubDetail) }
      this.$https.post(url, param).then(res => {
        this.handleQuery()
      })
    },
    handleCancel () {
      const url = this.$API.maintain.KitBomKitConfirmList.kitCancelConfirm
      let arr = []
      arr.push(this.formData.kitNo)
      const param = { kitNos: JSON.stringify(arr) }
      this.$https.post(url, param).then(res => {
        this.handleQuery()
      })
    },
    handleTask () {
      const url = this.$API.maintain.KitBomKitConfirmList.createTaskPa
      let arr = []
      arr.push(this.formData.kitNo)
      const param = { kitNos: JSON.stringify(arr) }
      this.$https.post(url, param).then(res => {
        this.handleQuery()
      })
    },
    handleKitControll () {
      const url = this.$API.maintain.KitBomKitConfirmList.kitControll
      let arr = []
      arr.push(this.formData.kitNo)
      const param = { kitNos: JSON.stringify(arr) }
      this.$https.post(url, param).then(res => {
        this.handleQuery()
      })
    },
    handleProcess (data) {
      console.log(data)
      this.goodsFormVisible = true
      const url = `${this.$API.maintain.KitBomKitConfirmList.querykit}?kitNo=${this.formData.kitNo}&kitLineNo=${data.kitLineNo}`
      this.$https.get(url)
        .then(data => {
          this.$refs.msg.getMessage(data.rows)
          console.log(data)
        })
    },
    handleProcessclose () {
      this.goodsFormVisible = !this.goodsFormVisible
    },

    // 父件勾选checkbox
    handleSelect (selection, row) {
      this.delSubDetail = selection.map(item => item)
    },
    getOrderStatus (kitOrderHeader) {
      const orderStatus = {
        'NEW': 'NEW', // 新增状态
        'CREATE_NEW': 'CREATE_NEW', // 创建未审核
        'CREATE_CLOSE': 'CREATE_CLOSE', // 创建已审核
        'CREATE_NOT': 'CREATE_NOT', // 创建不审核
        'PARTKIT_CLOSE': 'PARTKIT_CLOSE', // 部分加工已审核
        'PARTKIT_NOT': 'PARTKIT_NOT', // 部分加工不审核
        'FULLKIT_CLOSE': 'FULLKIT_CLOSE', // 完全加工已审核
        'FULLKIT_NOT': 'FULLKIT_NOT', // 完全加工不审核
        'CLOSE': 'CLOSE', // 关闭订单
        'CANCEL': 'CANCEL'// 取消订单
      }
      if (!kitOrderHeader || !kitOrderHeader.jobId || kitOrderHeader.jobId === '') {
        return orderStatus.NEW
      }
      // 创建
      if (kitOrderHeader.status === '00') {
        if (kitOrderHeader.auditStatus === '00') {
          return orderStatus.CREATE_NEW
        }
        if (kitOrderHeader.auditStatus === '99') {
          return orderStatus.CREATE_CLOSE
        }
        if (kitOrderHeader.auditStatus === '90') {
          return orderStatus.CREATE_NOT
        }
      }
      // 部分加工
      if (kitOrderHeader.status === '70') {
        if (kitOrderHeader.auditStatus === '99') {
          return orderStatus.PARTKIT_CLOSE
        }
        if (kitOrderHeader.auditStatus === '90') {
          return orderStatus.PARTKIT_NOT
        }
      }
      // 完全加工
      if (kitOrderHeader.status === '80') {
        if (kitOrderHeader.auditStatus === '99') {
          return orderStatus.FULLKIT_CLOSE
        }
        if (kitOrderHeader.auditStatus === '90') {
          return orderStatus.FULLKIT_NOT
        }
      }
      // 关闭订单
      if (kitOrderHeader.status === '99') {
        return orderStatus.CLOSE
      }
      // 取消订单
      if (kitOrderHeader.status === '90') {
        return orderStatus.CANCEL
      }
    },
    handleEdit (row) {
      const orderStatus = this.getOrderStatus(this.formMesg)
      if (!((orderStatus === 'CREATE_CLOSE' || orderStatus === 'CREATE_NOT' || orderStatus === 'PARTKIT_CLOSE' || orderStatus === 'PARTKIT_NOT') && row.status === '00')) {
        return this.$message('状态不满足，不能操作')
      }
    },
  },
  beforeRouteLeave (to, from, next) {
    this.needRefresh && (to.meta.needRefresh = true)
    next()
  },

}
</script>
 <style lang="scss">
    .el-collapse{
        border: 1px solid #ebeef5;
        .el-collapse-item__header{
            padding-left: 10px;
            font-weight: bold;
            background-color: #f5f5f5;
            border-bottom: 1px solid #ebeef5 !important;
        }
        .el-collapse-item__content{
            padding-top:25px;
            padding-left: 15px;
        }
    }
    .row-mrg-t {
        margin-top: 20px;
    }
</style>
