feat(ui/image-preview): add setDefaultOptions and resetDefaultOptions (…

…#892)
varletjs · Mar 13, 2023 · ec56890 · ec56890
1 parent c75e3dc
commit ec56890
Show file tree

Hide file tree

Showing 5 changed files with 58 additions and 5 deletions.
diff --git a/packages/varlet-ui/src/image-preview/__tests__/index.spec.js b/packages/varlet-ui/src/image-preview/__tests__/index.spec.js
@@ -65,3 +65,20 @@ test('test image preview closeable', async () => {
   await delay(300)
   expect(document.querySelector('.var-popup')).toBeFalsy()
 })
+
+test('test image preview setDefaultOptions and resetDefaultOptions', async () => {
+  ImagePreview.setDefaultOptions({ closeable: true })
+  await delay(16)
+  ImagePreview()
+  await delay(200)
+  await trigger(document.querySelector('.var-image-preview__close-icon'), 'click')
+  await delay(300)
+  expect(document.querySelector('.var-popup')).toBeFalsy()
+
+  ImagePreview.resetDefaultOptions()
+  await delay(16)
+  ImagePreview()
+  await delay(200)
+  expect(document.querySelector('.var-image-preview__close-icon')).toBeFalsy()
+  ImagePreview.close()
+})
diff --git a/packages/varlet-ui/src/image-preview/docs/en-US.md b/packages/varlet-ui/src/image-preview/docs/en-US.md
@@ -233,6 +233,14 @@ const actions = [
 | `close`  | Triggered when Image-Preview is off | `-` |
 | `closed` | Triggered when the animation that closes the image-preview ends | `-` |
 
+### Methods
+
+| Method | Description | Arguments | Return |
+| --- | --- | --- | --- |
+| `ImagePreview.close` | Close image-preview | _-_ | `-` |
+| `ImagePreview.setDefaultOptions` | Set default option configuration | _options_ | `-` |
+| `ImagePreview.resetDefaultOptions` | Reset default option configuration | _-_ | `-` |
+
 ### Slot
 
 | Name | Description | SlotProps |

diff --git a/packages/varlet-ui/src/image-preview/docs/zh-CN.md b/packages/varlet-ui/src/image-preview/docs/zh-CN.md
@@ -231,6 +231,14 @@ const actions = [
 | `close`  | 关闭 image-preview 时触发 | `-` |
 | `closed` | 关闭 image-preview 动画结束时触发 | `-` |
 
+### 方法
+
+| 方法名 | 说明 | 参数 | 返回值 |
+| --- | --- | --- | --- |
+| `ImagePreview.close` | 关闭image-preview | _-_ | `-` |
+| `ImagePreview.setDefaultOptions` | 设置默认的选项配置 | _options_ | `-` |
+| `ImagePreview.resetDefaultOptions` | 重置默认的选项配置 | _-_ | `-` |
+
 ### 插槽
 
 | 插槽名 | 说明 | 参数 |

diff --git a/packages/varlet-ui/src/image-preview/index.ts b/packages/varlet-ui/src/image-preview/index.ts
@@ -21,6 +21,19 @@ interface ImagePreviewOptions {
 }
 
 let singletonOptions: ImagePreviewOptions | null
+let defaultOptions: ImagePreviewOptions = {}
+
+export type UserImagePreviewOptions = ImagePreviewOptions | string | Array<string>
+
+function normalizeOptions(options: UserImagePreviewOptions = {}) {
+  if (isString(options)) {
+    return { ...defaultOptions, images: [options] }
+  }
+  if (isArray(options)) {
+    return { ...defaultOptions, images: options }
+  }
+  return { ...defaultOptions, ...options }
+}
 
 function ImagePreview(options: string | string[] | ImagePreviewOptions) {
   if (!inBrowser()) {
@@ -29,11 +42,7 @@ function ImagePreview(options: string | string[] | ImagePreviewOptions) {
 
   ImagePreview.close()
 
-  const imagePreviewOptions: ImagePreviewOptions = isString(options)
-    ? { images: [options] }
-    : isArray(options)
-    ? { images: options }
-    : options
+  const imagePreviewOptions: ImagePreviewOptions = normalizeOptions(options)
   const reactiveImagePreviewOptions: ImagePreviewOptions = reactive(imagePreviewOptions)
   reactiveImagePreviewOptions.teleport = 'body'
   singletonOptions = reactiveImagePreviewOptions
@@ -68,6 +77,14 @@ ImagePreview.close = () => {
   }
 }
 
+ImagePreview.setDefaultOptions = (options: ImagePreviewOptions) => {
+  defaultOptions = options
+}
+
+ImagePreview.resetDefaultOptions = () => {
+  defaultOptions = {}
+}
+
 VarImagePreview.install = function (app: App) {
   app.component(VarImagePreview.name, VarImagePreview)
 }

diff --git a/packages/varlet-ui/types/imagePreview.d.ts b/packages/varlet-ui/types/imagePreview.d.ts
@@ -51,6 +51,9 @@ export interface IImagePreview {
 
   close(): void
 
+  setDefaultOptions(options: ImagePreviewOptions): void
+  resetDefaultOptions(): void
+
   install(app: App): void
 }