<template>
  <div class="fit scroll">
    <q-card class="q-ma-sm q-pa-sm bg-grey-3">
      <div class="text-h6">API 获取元数据</div>
      <kyb-form
        v-model="dataMdata"
        entity="/test/Test"
        @item-change="itemChange"
        auto-content
        entityDataId="2a43b2c8-d13d-0982-cdbc-c9563e6b1efd"
      />
      <div>form 的数据：{{dataMdata}}</div>
    </q-card>
    <!-- <q-card class="q-ma-sm q-pa-sm bg-grey-3">
      <div class="text-h6">自定义元数据</div>
      <kyb-form v-model="data" :kyb-mdata="mdata" @item-change="itemChange" auto-content />
      <div>form 的数据：{{data}}</div>
    </q-card>-->
  </div>
</template>
<style>
</style>
<script>
// import _ from 'underscore'
// import KTest from 'components/k-test'

let d = {
  data: function() {
    let mdata = {
      name: 'test',
      title: '测试表单',
      isGroup: true,
      items: [
        {
          _id: '1',
          name: 'canUse',
          title: '是否可用',
          isNotNull: true,
          desc: '是否可用',
          inputType: 'boolean'
        },
        {
          _id: '11',
          name: 'name',
          title: '名称',
          isNotNull: true,
          desc: '描述一个名称',
          minLength: 4,
          maxLength: 128
        },
        {
          _id: '12',
          name: 'idCard',
          title: '身份证',
          isNotNull: true,
          desc: '身份证',
          group: '基础',
          validatorType: ['IdCard']
        },
        {
          _id: '13',
          name: 'email',
          title: '邮件',
          isNotNull: true,
          desc: '邮件',
          group: '基础',
          validatorType: ['Email']
        },
        {
          _id: '14',
          name: 'phone',
          title: '手机号码',
          isNotNull: true,
          desc: '手机号码',
          validatorType: ['Mobile']
        },
        {
          _id: '2',
          name: 'isOk',
          title: '是否美女',
          group: '基础',
          type: 'boolean'
        },
        {
          _id: '3',
          name: 'age',
          title: '年龄',
          desc: '请填写年龄',
          isNotNull: true,
          max: 70,
          min: 18,
          type: 'int',
          suffix: '岁'
        },
        {
          _id: '33',
          name: 'json',
          title: 'json',
          desc: 'json',
          isNotNull: true,
          inputType: 'json'
        },
        {
          _id: '4',
          name: 'sex',
          title: '性别',
          desc: '请选择性别',
          inputType: 'select',
          isNotNull: true,
          inputTypeList: '男,女',
          selectType: 'one',
          group: '选择'
        },
        {
          _id: '4',
          name: 'birthday',
          title: '生日',
          desc: '请填出生日期',
          type: 'long',
          inputType: 'date',
          group: '日期'
        },
        {
          _id: '5',
          name: 'time',
          title: '时间选择',
          desc: '时间选择',
          type: 'long',
          isNotNull: true,
          inputType: 'time',
          group: '日期'
        },
        {
          _id: '5',
          name: 'dateTime',
          title: '日期时间一起选',
          desc: '日期时间一起选',
          type: 'long',
          inputType: 'dateTime',
          group: '日期'
        },
        {
          _id: '6',
          name: 'password',
          title: '密码',
          desc: '输入密码',
          minLength: 6,
          maxLength: 16,
          inputType: 'password'
        },
        {
          _id: '7',
          name: 'passwordRe',
          title: '再输入一次',
          desc: '再输入一次',
          minLength: 6,
          maxLength: 16,
          inputType: 'password'
        },
        {
          _id: '8',
          name: 'hobby',
          title: '爱好',
          desc: '爱好',
          inputType: 'select',
          inputTypeList: '运动,唱歌,跳舞,电影,手工自作',
          selectType: 'more',
          minSelected: 2,
          maxSelected: 4,
          group: '选择'
        },
        {
          _id: '81',
          name: 'color',
          title: '选择颜色',
          desc: '选择颜色',
          inputType: 'color',
          group: '选择'
        },
        {
          _id: '82',
          name: 'icon',
          title: '选择图标',
          desc: '选择图标',
          inputType: 'icon',
          group: '选择'
        },
        {
          _id: '9',
          name: 'desc',
          title: '自我说明',
          desc: '爱好',
          inputType: 'textarea'
        },
        {
          _id: '99',
          name: 'address',
          title: '地址',
          desc: '地址',
          inputType: 'address'
        },
        {
          _id: '9',
          name: 'like',
          title: '自我说明',
          desc: '自我说明',
          inputType: 'textarea'
        },
        {
          _id: '10',
          name: 'notWrite',
          title: '只读字段',
          desc: '只读字段',
          readOnly: true
        },
        {
          _id: '11',
          name: 'xxx',
          title: '默认值UUID',
          desc: '默认值UUID',
          // hide: 'edit',//编辑下不显示；
          // eslint-disable-next-line no-template-curly-in-string
          defaultValue: '${uuid}' // 当为空时
        },
        {
          _id: '112',
          name: 'riqi',
          title: '默认值日期字符串',
          desc: '默认值日期字符串',
          // hide: 'edit',//编辑下不显示；
          defaultValue: new Date().showCoolTime() // 当为空时
        },
        {
          _id: '12',
          name: 'upload',
          inputType: 'file',
          title: '单项文件选择',
          selectType: 'more',
          desc: '单项文件选择'
        },
        {
          _id: '13',
          name: 'hideValue',
          title: '隐藏字段',
          desc: '隐藏字段',
          hide: 'all' // all:在读和编辑状态下都隐藏,edit:编辑状态下隐藏，show:查看状态下隐藏；
        }
      ]
    }
    return {
      mdata: mdata,
      data: {},
      dataMdata: {},
      includes: ['upload', 'sex', 'icon']
    }
  },
  computed: {},

  methods: {
    addField() {
      this.includes.push('like')
    },
    itemChange(mdata, value) {
      if (value === '男') {
        this.includes = ['upload', 'sex']
      } else {
        this.includes = ['upload', 'sex', 'icon']
      }
    }
  }
}
export default d
</script>
