<template>
  <div>
    <div class="my-title">{{ !id ? "新增" : "修改" }}</div>
    <el-form
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      label-width="180px"
    >
      <el-row>
        <el-col :span="6">
          <el-form-item label="物料名称" prop="productId">
            <el-select
              v-model="dataForm.productId"
              filterable
              remote
              clearable
              placeholder="请选择"
            >
              <el-option
                v-for="item in materialList"
                :key="item.materialId"
                :label="item.materialName"
                :value="item.materialId"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="程序编码" prop="programCode">
            <el-input
              v-model="dataForm.programCode"
              placeholder="请输入"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="程序说明" prop="programInstructions">
            <el-input
              v-model="dataForm.programInstructions"
              placeholder="请输入"
              type="textarea"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="备注说明" prop="remark">
            <el-input
              v-model="dataForm.remark"
              placeholder="请输入"
              type="textarea"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
            <el-form-item label="程序包" prop="cxbList">
            <upload-component
              :display="false"
              :displayStar="false"
              :accept="'*'"
              v-model="dataForm.cxbList"
              @uploadSuccess="uploadSuccess"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="4">
            <el-form-item label="数控加工程序单" prop="skjgList">
            <upload-component
              :display="false"
              :displayStar="false"
              :accept="'*'"
              v-model="dataForm.skjgList"
              @uploadSuccess="uploadSuccess"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
            <el-form-item label="防真验证情况记录表" prop="fzyzList">
            <upload-component
              :display="false"
              :displayStar="false"
              :accept="'*'"
              v-model="dataForm.fzyzList"
              @uploadSuccess="uploadSuccess"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="4">
            <el-form-item label="数控加工程序试切鉴定表" prop="cxsqList">
            <upload-component
              :display="false"
              :displayStar="false"
              :accept="'*'"
              v-model="dataForm.cxsqList"
              @uploadSuccess="uploadSuccess"
            />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="onChose">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </div>
</template>

<script>
import { getMaterialList } from '@/api/material'
import uploadComponent from '../common/upload-component-v2'
export default {
  name: 'program-add-or-update',
  components: {uploadComponent},
  data () {
    return {
      id: 0,
      dataForm: {},
      materialList: [],
      dataRule: {
        productName: [{required: true, message: '请选择物料名称', trigger: 'change'}],
        programCode: [{required: true, message: '请输入程序编码', trigger: 'blur'}],
        programInstructions: [{required: true, message: '请输入程序说明', trigger: 'blur'}],
        cxbList: [{required: true, message: '请上传文件', trigger: 'blur'}],
        skjgList: [{required: true, message: '请上传文件', trigger: 'blur'}],
        fzyzList: [{required: true, message: '请上传文件', trigger: 'blur'}],
        cxsqList: [{required: true, message: '请上传文件', trigger: 'blur'}]
      }
    }
  },
  created () {
  },
  methods: {
    init (id, item) {
      this.id = id || 0
      if (item) {
        if (item.cxbList) {
          item.cxbList.forEach(t => { t.name = t.fileName })
        }
        if (item.cxsqList) {
          item.cxsqList.forEach(t => { t.name = t.fileName })
        }
        if (item.fzyzList) {
          item.fzyzList.forEach(t => { t.name = t.fileName })
        }
        if (item.skjgList) {
          item.skjgList.forEach(t => { t.name = t.fileName })
        }
        this.dataForm = {...item}
      }
      this.getMaterialList()
    },
    onChose () {
      this.$emit('onChose')
    },
    getMaterialList () {
      getMaterialList().then(({ data }) => {
        if (data && data.code === '200') {
          this.materialList = data.data.records
        }
      })
    },
    dataFormSubmit () {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          this.$http({
            url: !this.id
              ? this.$http.adornUrl(`/biz-service/pro-program/save`)
              : this.$http.adornUrl(`/biz-service/pro-program/update`),
            method: 'post',
            data: this.$http.adornData({ ...this.dataForm, orgId: this.orgId })
          }).then(({ data }) => {
            if (data && data.code === '200') {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.onChose()
                  this.$emit('refreshDataList')
                }
              })
            } else {
              this.$message.error(data.msg)
            }
          })
        }
      })
    },
    uploadSuccess () {}
  }
}
</script>

<style>
</style>