<template>
  <a-drawer width="35%" :label-col="4" :wrapper-col="14" :visible="open" @close="onClose">
    <a-divider orientation="left">
      <b>{{ formTitle }}</b>
    </a-divider>
    <a-form-model ref="form" :model="form" :rules="rules">
      <a-form-model-item label="检查日期" prop="checkTime">
        <a-date-picker style="width: 100%" v-model="form.checkTime" format="YYYY-MM-DD HH:mm:ss" allow-clear :disabled="formType==3" />
      </a-form-model-item>
      <a-form-model-item label="经办人" prop="userId">
        <a-input v-model="uersInfo.nickName" placeholder="请输入经办人" :disabled="true" />
      </a-form-model-item>
      <a-form-model-item label="车牌号" prop="plateNumber">
        <a-input v-model="form.plateNumber" placeholder="请输入车牌号" :disabled="formType==3" />
      </a-form-model-item>
      <a-form-model-item label="年检费用" prop="checkCost">
        <a-input v-model="form.checkCost" placeholder="请输入年检费用" type="number" :disabled="formType==3"/>
      </a-form-model-item>
      <a-form-model-item label="备注" prop="remark">
        <a-input v-model="form.remark" placeholder="请输入内容" type="textarea" allow-clear :disabled="formType==3" />
      </a-form-model-item>
      <a-form-model-item label="车管所" prop="vehicleOffice">
        <a-input v-model="form.vehicleOffice" placeholder="请输入车管所" :disabled="formType==3" />
      </a-form-model-item>
      <div class="bottom-control">
        <a-space>
          <a-button type="primary" :loading="submitLoading" @click="submitForm" v-if="formType!=3"> 保存 </a-button>
          <a-button type="dashed" @click="cancel"> 取消 </a-button>
        </a-space>
      </div>
    </a-form-model>
  </a-drawer>
</template>

<script>
import { getCheckRegister, addCheckRegister, updateCheckRegister } from '@/api/clw/checkRegister'

export default {
  name: 'CreateForm',
  props: {},
  components: {},
  data() {
    return {
      submitLoading: false,
      formTitle: '',
      // 表单参数
      form: {
        checkTime: null,

        userId: null,

        plateNumber: null,

        checkCost: null,

        remark: null,

        vehicleOffice: null,
      },
      // 1增加,2修改
      formType: 1,
      open: false,
      uersInfo:null,
      rules: {
        checkTime: [{ required: true, message: '检查日期不能为空', trigger: 'blur' }],

        // userId: [{ required: true, message: '经办人不能为空', trigger: 'blur' }],

        plateNumber: [{ required: true, message: '车牌号不能为空', trigger: 'blur' }],

        checkCost: [{ required: true, message: '年检费用不能为空', trigger: 'blur' }],

        remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }],

        vehicleOffice: [{ required: true, message: '车管所不能为空', trigger: 'blur' }],
      },
  
    }
  },
  filters: {},
  created() {},
  computed: {},
  watch: {},
  async mounted() {
    this.uersInfo = await this.$store.getters.userInfo
  },
  methods: {
    onClose() {
      this.open = false
      this.reset()
    },
    // 取消按钮
    cancel() {
      this.open = false
      this.reset()
    },
    // 表单重置
    reset() {
      this.formType = 1
      this.form = {
        checkTime: null,

        userId: null,

        plateNumber: null,

        checkCost: null,

        remark: null,

        vehicleOffice: null,
      }
    },
    /** 新增按钮操作 */
    handleAdd(row) {
      this.reset()
      this.formType = 1
      this.open = true
      this.formTitle = '添加'
    },
    /** 修改按钮操作 */
    handleUpdate(row, ids) {
      this.reset()
      this.formType = 2
      const checkId = row ? row.checkId : ids
      getCheckRegister(checkId).then((response) => {
        this.form = response.data
        this.open = true
        this.formTitle = '修改'
      })
    },
    // 详情
    handleInfo(row, ids){
      this.formType = 3
      const checkId = row ? row.checkId : ids
      getCheckRegister(checkId).then((response) => {
        this.form = response.data
        this.open = true
        this.formTitle = '详情'
      })
    },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs.form.validate((valid) => {
        const time = this.form.checkTime.format('YYYY-MM-DD HH:mm:ss')
          const params = {
            ...this.form,
            userId:this.uersInfo.userId,
            checkTime: time,
          }
        if (valid) {
          this.submitLoading = true
          if (this.form.checkId !== undefined && this.form.checkId !== null) {
            updateCheckRegister(params)
              .then((response) => {
                this.$message.success('修改成功')
                this.open = false
                this.$emit('ok')
              })
              .finally(() => {
                this.submitLoading = false
              })
          } else {
            addCheckRegister(params)
              .then((response) => {
                this.$message.success('新增成功')
                this.open = false
                this.$emit('ok')
              })
              .finally(() => {
                this.submitLoading = false
              })
          }
        } else {
          return false
        }
      })
    },
  },
}
</script>
