選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
 
 
 

180 行
5.6 KiB

  1. import { defineMixin } from '../../libs/vue'
  2. import UploadDefaultProps from './upload'
  3. import { registerComponentProps } from '../../libs/config/props.js'
  4. const defProps = registerComponentProps(UploadDefaultProps)
  5. export const props = defineMixin({
  6. props: {
  7. // 接受的文件类型, 可选值为all media image file video
  8. accept: {
  9. type: String,
  10. default: () => defProps.upload.accept
  11. },
  12. extension: {
  13. type: Array,
  14. default: () => defProps.upload.extension
  15. },
  16. // 图片或视频拾取模式,当accept为image类型时设置capture可选额外camera可以直接调起摄像头
  17. capture: {
  18. type: [String, Array],
  19. default: () => defProps.upload.capture
  20. },
  21. // 当accept为video时生效,是否压缩视频,默认为true
  22. compressed: {
  23. type: Boolean,
  24. default: () => defProps.upload.compressed
  25. },
  26. // 当accept为video时生效,可选值为back或front
  27. camera: {
  28. type: String,
  29. default: () => defProps.upload.camera
  30. },
  31. // 当accept为video时生效,拍摄视频最长拍摄时间,单位秒
  32. maxDuration: {
  33. type: Number,
  34. default: () => defProps.upload.maxDuration
  35. },
  36. // 上传区域的图标,只能内置图标
  37. uploadIcon: {
  38. type: String,
  39. default: () => defProps.upload.uploadIcon
  40. },
  41. // 上传区域的图标的颜色,默认
  42. uploadIconColor: {
  43. type: String,
  44. default: () => defProps.upload.uploadIconColor
  45. },
  46. // 是否开启文件读取前事件
  47. useBeforeRead: {
  48. type: Boolean,
  49. default: () => defProps.upload.useBeforeRead
  50. },
  51. // 读取后的处理函数
  52. afterRead: {
  53. type: Function,
  54. default: null
  55. },
  56. // 读取前的处理函数
  57. beforeRead: {
  58. type: Function,
  59. default: null
  60. },
  61. // 是否显示组件自带的图片&视频预览功能
  62. previewFullImage: {
  63. type: Boolean,
  64. default: () => defProps.upload.previewFullImage
  65. },
  66. // 最大上传数量
  67. maxCount: {
  68. type: [String, Number],
  69. default: () => defProps.upload.maxCount
  70. },
  71. // 是否启用
  72. disabled: {
  73. type: Boolean,
  74. default: () => defProps.upload.disabled
  75. },
  76. // 预览上传的图片时的裁剪模式,和image组件mode属性一致
  77. imageMode: {
  78. type: String,
  79. default: () => defProps.upload.imageMode
  80. },
  81. // 标识符,可以在回调函数的第二项参数中获取
  82. name: {
  83. type: String,
  84. default: () => defProps.upload.name
  85. },
  86. // 所选的图片的尺寸, 可选值为original compressed
  87. sizeType: {
  88. type: Array,
  89. default: () => defProps.upload.sizeType
  90. },
  91. // 是否开启图片多选,部分安卓机型不支持
  92. multiple: {
  93. type: Boolean,
  94. default: () => defProps.upload.multiple
  95. },
  96. // 是否展示删除按钮
  97. deletable: {
  98. type: Boolean,
  99. default: () => defProps.upload.deletable
  100. },
  101. // 文件大小限制,单位为byte
  102. maxSize: {
  103. type: [String, Number],
  104. default: () => defProps.upload.maxSize
  105. },
  106. // 显示已上传的文件列表
  107. fileList: {
  108. type: Array,
  109. default: () => defProps.upload.fileList
  110. },
  111. // 上传区域的提示文字
  112. uploadText: {
  113. type: String,
  114. default: () => defProps.upload.uploadText
  115. },
  116. // 内部预览图片区域和选择图片按钮的区域宽度
  117. width: {
  118. type: [String, Number],
  119. default: () => defProps.upload.width
  120. },
  121. // 内部预览图片区域和选择图片按钮的区域高度
  122. height: {
  123. type: [String, Number],
  124. default: () => defProps.upload.height
  125. },
  126. // 是否在上传完成后展示预览图
  127. previewImage: {
  128. type: Boolean,
  129. default: () => defProps.upload.previewImage
  130. },
  131. // 是否自动删除
  132. autoDelete: {
  133. type: Boolean,
  134. default: () => defProps.upload.autoDelete
  135. },
  136. // 是否自动上传需要传递action指定地址
  137. autoUpload: {
  138. type: Boolean,
  139. default: () => defProps.upload.autoUpload
  140. },
  141. // 自动上传接口地址
  142. autoUploadApi: {
  143. type: String,
  144. default: () => defProps.upload.autoUploadApi
  145. },
  146. // 自动上传驱动,local/oss/cos/kodo
  147. autoUploadDriver: {
  148. type: String,
  149. default: () => defProps.upload.autoUploadDriver
  150. },
  151. // 自动上传授权接口,比如oss的签名接口。
  152. autoUploadAuthUrl: {
  153. type: String,
  154. default: () => defProps.upload.autoUploadAuthUrl
  155. },
  156. // 自动上传携带的header
  157. autoUploadHeader: {
  158. type: Object,
  159. default: () => {
  160. return defProps.upload.autoUploadHeader
  161. }
  162. },
  163. // 本地计算视频封面
  164. getVideoThumb: {
  165. type: Boolean,
  166. default: () => defProps.upload.getVideoThumb
  167. },
  168. // 自定义自动上传后处理
  169. customAfterAutoUpload: {
  170. type: Boolean,
  171. default: () => defProps.upload.customAfterAutoUpload
  172. },
  173. videoPreviewObjectFit: {
  174. type: String,
  175. default: () => defProps.upload.videoPreviewObjectFit
  176. },
  177. }
  178. })