<template>
  <a-spin :spinning="confirmLoading">
    <!--    <j-form-container :disabled="formDisabled">-->
    <!--      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">-->
    <!--        <a-row>-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="监护人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">-->
    <!--              <a-input v-model="model.name" placeholder="请输入监护人"></a-input>-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="relation">-->
    <!--              <j-dict-select-tag v-model="model.relation" placeholder="请选择身份" dictCode="relation" />-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="手机号码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="phone">-->
    <!--              <a-input v-model="model.phone" placeholder="请输入手机号码"></a-input>-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="身份证" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="identityCard">-->
    <!--              <a-input v-model="model.identityCard" placeholder="请输入身份证"></a-input>-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          &lt;!&ndash;         <a-col :span="24">-->
    <!--                     <a-form-model-item label="家庭地址" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="address">-->
    <!--                       <a-input v-model="model.address" placeholder="请输入家庭地址"  ></a-input>-->
    <!--                     </a-form-model-item>-->
    <!--                   </a-col>&ndash;&gt;-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="考察人员" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="incarcerated_user_id">-->
    <!--              <a-input v-model="model.mrIncarceratedUser.name" placeholder="请输入考察人员"></a-input>-->
    <!--              &lt;!&ndash;              <a-input v-model="model.incarceratedUserId_dictText"  placeholder="请输入监管人员"  dictCode="incarceratedUserId_dictText"></a-input>&ndash;&gt;-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="性别" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="incarcerated_user_id">-->
    <!--              <a-input v-model="boy" placeholder="请输入考察人员性别" v-if="model.mrIncarceratedUser.sex=='1'"></a-input>-->
    <!--              <a-input v-model="girl" placeholder="请输入考察人员性别" v-if="model.mrIncarceratedUser.sex=='2'"></a-input>-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          <a-col :span="24">-->
    <!--            <a-form-model-item label="身份证" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="incarcerated_user_id">-->
    <!--              &lt;!&ndash;              <j-dict-select-tag v-model="model.incarceratedUserId" placeholder="请输入身份证"  dictCode="mr_incarcerated_user,identity_card,id"></j-dict-select-tag>&ndash;&gt;-->
    <!--              <a-input v-model="model.mrIncarceratedUser.identityCard" placeholder="请输入身份证"></a-input>-->
    <!--            </a-form-model-item>-->
    <!--          </a-col>-->
    <!--          &lt;!&ndash;          <a-col :span="24">-->
    <!--                      <a-form-model-item label="案子" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="incarcerated_user_id">-->
    <!--          &lt;!&ndash;              <j-dict-select-tag v-model="model.incarceratedUserId" placeholder="请输入案子"  dictCode="mr_case,counter,incarcerated_user_id"></j-dict-select-tag>&ndash;&gt;-->
    <!--                           <a-textarea v-model="model.mrCase.counter" style="font: 12px/16px Arial; width: 576px; overflow: hidden; height: 16px;resize: none;height: max-content"></a-textarea>-->
    <!--                      </a-form-model-item>-->
    <!--                    </a-col>-->
    <!--                    <a-col :span="24">-->
    <!--          &lt;!&ndash;            <a&ndash;&gt;-->
    <!--          &lt;!&ndash;            <a-form-model-item label="督促监护令" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="incarcerated_user_id">&ndash;&gt;-->
    <!--                      <a-form-model-item label="督促监护令" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
    <!--                        <img src="model.mrCase.supervisionGuardianshipOrderUrl"/>-->
    <!--                      </a-form-model-item>-->

    <!--          &lt;!&ndash;            </a-form-model-item>&ndash;&gt;-->
    <!--                    </a-col>&ndash;&gt;-->
    <!--        </a-row>-->
    <!--      </a-form-model>-->
    <!--    </j-form-container>-->
    <a-divider orientation="left">监护人信息</a-divider>
    <a-descriptions title="" :column="1" bordered class="label_w">
      <a-descriptions-item label="姓名">
        {{ model.name }}
      </a-descriptions-item>
      <a-descriptions-item label="身份">
        {{ model.relation_dictText }}
      </a-descriptions-item>
      <a-descriptions-item label="手机号码">
        {{ model.phone }}
      </a-descriptions-item>
      <a-descriptions-item label="身份证号">
        {{ model.identityCard }}
      </a-descriptions-item>
    </a-descriptions>
    <a-divider orientation="left">考察人员信息</a-divider>
    <a-descriptions title="" :column="1" bordered class="label_w">
      <a-descriptions-item label="姓名">
        {{ model.mrIncarceratedUser.name }}
      </a-descriptions-item>
      <a-descriptions-item label="性别">
        <span v-if="model.mrIncarceratedUser.sex=='1'">男</span>
        <span v-if="model.mrIncarceratedUser.sex=='2'">女</span>
        <!--        {{ model.mrIncarceratedUser.sex }}-->
      </a-descriptions-item>
      <a-descriptions-item label="身份证号">
        {{ model.mrIncarceratedUser.identityCard }}
      </a-descriptions-item>
      <a-descriptions-item label="考察截止时间">
        {{ model.mrIncarceratedUser.observationEndDate }}
      </a-descriptions-item>
      <a-descriptions-item label="考察分数">
        {{ model.mrIncarceratedUser.score }}
      </a-descriptions-item>
    </a-descriptions>
  </a-spin>
</template>

<script>

import { httpAction } from '@/api/manage'

export default {
  name: 'MrIncarceratedParentUserForm',
  components: {},
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      boy: '男',
      girl: '女',
      model: {
        mrIncarceratedUser: { name: '', sex: '', identityCard: '' },
        mrCase: { counter: '', supervisionGuardianshipOrderUrl: '' }
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      validatorRules: {
        name: [
          { required: true, message: '请输入家长!' }
        ],
        content: [
          { required: true, message: '请输入内容!' }
        ]
      },
      url: {
        add: '/staffReport/mrIncarceratedParentUser/add',
        edit: '/staffReport/mrIncarceratedParentUser/edit',
        queryById: '/staffReport/mrIncarceratedParentUser/queryById'
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model))
  },
  methods: {
    add() {
      this.edit(this.modelDefault)
    },
    edit(record) {
      this.model = Object.assign({}, record)
      console.log(this.model)
      this.visible = true
    },
    submitForm() {
      const that = this
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              that.$emit('ok')
            } else {
              that.$message.warning(res.message)
            }
          }).finally(() => {
            that.confirmLoading = false
          })
        }

      })
    }
  }
}
</script>

<style>
.label_w .ant-descriptions-item-label {
  width: 140px;
}
</style>