<template>
  <div>
    <a-form-model-item label="最大上传数量">
      <sd-ugly-number v-model="component.attr.maxLength" :min="1" />
    </a-form-model-item>
    <a-form-model-item label="单个文件大小不超过(MB)">
      <sd-ugly-number v-model="component.attr.maxFileSize" :min="1" />
    </a-form-model-item>
    <a-form-model-item
      prop="attr.allowType"
      :rules="[
        { pattern: /^\.[a-z|0-9]+(,\.[a-z|0-9]+)*$/, message: '请参考提示输入正确的文件后缀' },
      ]"
    >
      <div slot="label">
        上传文件类型
        <a-tooltip title="请输入【.文件后缀】例如：.doc多个类型用逗号分隔">
          <a-icon type="question-circle" />
        </a-tooltip>
      </div>
      <a-input v-model="component.attr.allowType" />
    </a-form-model-item>
  </div>
</template>

<script>
import xmAttachmentEx from '@product/iam/components/xm-attachment-ex'
import components from './_import-components/xm-attachment-ex-import'

export const metaInfo = {
  caption: '项目模板控件',
  component: {
    props: ['designerData'],
    render() {
      return (
        <xmAttachmentEx groupId='-1' zwUploadable={true} value={[]} enableAttachmentExTab={false} />
      )
    },
  },
  icon: 'upload',
  order: 1100,
  excludeFormTypes: [2, 3],
}

export const fieldProps = {
  dataType: 'attachment',
  attrFD: { columns: 4, formItemProps: { inputProps: { listType: '' } } },
  attr: { maxLength: '', allowType: '', zwUploadable: 'true' },
}

export function updateOnPreview(component) {
  // 预览时用一个固定的groupId
  component.value = '{"value":"-1"}'
}

export default {
  name: 'XmAttachmentEx',
  components,
  data() {
    return {}
  },
  methods: {},
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
</style>
