yanzhen-design-vue
Version:
52 lines (51 loc) • 1.35 kB
JavaScript
import { ref, computed, unref, onUnmounted } from "vue";
import { api } from "v-viewer";
import { mergeWith } from "lodash-es";
import { createWatcher } from "@yanzhen-libs/utils-vue";
import { isEmptyArray } from "@yanzhen-libs/utils";
import "viewerjs/dist/viewer.css";
function useViewerApi({ options, images } = {}) {
const viewer = ref();
const optionsRef = computed(() => {
return mergeWith(
{
toolbar: true,
initialViewIndex: 1
},
unref(options) ?? {}
);
});
const imagesRef = computed(() => {
return !isEmptyArray(unref(images)) ? unref(images) : [];
});
function handlePreview(images2, options2) {
var _a;
(_a = unref(viewer)) == null ? void 0 : _a.destroy();
viewer.value = api({
images: images2 ?? unref(imagesRef),
options: mergeWith({}, unref(optionsRef), options2 ?? {})
});
return unref(viewer);
}
const watcher = createWatcher();
watcher.set("images", {
source: () => [unref(optionsRef), unref(imagesRef)],
handler: () => {
var _a;
(_a = unref(viewer)) == null ? void 0 : _a.update();
},
deep: true
});
onUnmounted(() => {
var _a;
watcher.stop();
(_a = unref(viewer)) == null ? void 0 : _a.destroy();
});
return {
viewer,
preview: handlePreview
};
}
export {
useViewerApi
};