完成转发分享功能实现

components.d.ts

@@ -29,6 +29,7 @@ declare module 'vue' {
     WdNavbar: typeof import('@wot-ui/ui/components/wd-navbar/wd-navbar.vue')['default']
     WdNoticeBar: typeof import('@wot-ui/ui/components/wd-notice-bar/wd-notice-bar.vue')['default']
     WdPicker: typeof import('@wot-ui/ui/components/wd-picker/wd-picker.vue')['default']
+    WdPickerView: typeof import('@wot-ui/ui/components/wd-picker-view/wd-picker-view.vue')['default']
     WdPopup: typeof import('@wot-ui/ui/components/wd-popup/wd-popup.vue')['default']
     WdProgress: typeof import('@wot-ui/ui/components/wd-progress/wd-progress.vue')['default']
     WdSearch: typeof import('@wot-ui/ui/components/wd-search/wd-search.vue')['default']

src/pages/information/components/academic/AcademicArticleItem.vue

@@ -20,11 +20,7 @@
       <button
         class="share-button"
         hover-class="share-button--hover"
-        open-type="share"
-        :data-title="item.title"
-        :data-id="item.id"
-        data-active-tab="academic"
-        @tap.stop
+        @tap.stop="emit('share', item)"
       >
         <view class="share-button__content">
           <wd-icon
@@ -51,6 +47,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   select: [item: ArticleItem]
+  share: [item: ArticleItem]
 }>()
 
 const createDate = computed(() => {

src/pages/information/components/academic/AcademicInfoPanel.vue

@@ -12,6 +12,7 @@
         :key="item.id"
         :item="item"
         @select="handleArticleClick"
+        @share="emit('share', $event)"
       />
 
       <view v-if="!loading && articleList.length === 0" class="empty-state">
@@ -41,6 +42,10 @@ import InformationSearchBar from './InformationSearchBar.vue'
 
 const PAGE_SIZE = 10
 
+const emit = defineEmits<{
+  share: [item: ArticleItem]
+}>()
+
 const userStore = useUserStore()
 
 const articleList = ref<ArticleItem[]>([])

src/pages/information/components/album/ProductAlbumItem.vue

@@ -30,11 +30,7 @@
         <button
           class="share-button"
           hover-class="share-button--hover"
-          open-type="share"
-          :data-title="item.title"
-          :data-id="item.id"
-          data-active-tab="academic"
-          @tap.stop
+          @tap.stop="emit('share', item)"
         >
           <view class="share-button__content">
             <wd-icon
@@ -58,11 +54,11 @@ import type { AlbumPageNewItem } from '@/services/modules/information/type'
 
 const props = defineProps<{
   item: AlbumPageNewItem
-  activeTab: string
 }>()
 
 const emit = defineEmits<{
   select: [item: AlbumPageNewItem]
+  share: [item: AlbumPageNewItem]
 }>()
 
 const albumTitle = computed(() => {

src/pages/information/components/album/ProductAlbumPanel.vue

@@ -24,8 +24,8 @@
         v-for="item in albumList"
         :key="item.id"
         :item="item"
-        :active-tab="ACTIVE_TAB"
         @select="handleAlbumClick"
+        @share="emit('share', $event)"
       />
 
       <view v-if="!loading && albumList.length === 0" class="empty-state">
@@ -54,7 +54,10 @@ import { useUserStore } from '@/stores/modules/user'
 import ProductAlbumItem from './ProductAlbumItem.vue'
 
 const PAGE_SIZE = 10
-const ACTIVE_TAB = 'album'
+
+const emit = defineEmits<{
+  share: [item: AlbumPageNewItem]
+}>()
 
 const userStore = useUserStore()
 

src/pages/information/detail/index.vue

@@ -12,7 +12,7 @@
 
       <view v-if="drugName" class="detail-drug"> 关联药品：{{ drugName }} </view>
       <view v-if="content" class="detail-content">
-        <MpHtml :content="content" />
+        <mpHtml :content="content" />
       </view>
     </view>
 
@@ -24,7 +24,7 @@
 import { computed, ref } from 'vue'
 
 import { onLoad } from '@dcloudio/uni-app'
-import MpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
+import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
 
 import { getAlbumByIdApi, getArticleByIdApi } from '@/services/modules/information'
 import type { AlbumPageNewItem, ArticleItem } from '@/services/modules/information/type'

src/pages/information/index.vue

@@ -1,15 +1,120 @@
 <template>
+  <page-meta :page-style="sharePopupVisible ? 'overflow:hidden;' : 'overflow:visible;'" />
+
   <view class="page">
     <LoginRequiredState v-if="!isLoggedIn" />
 
     <template v-else>
       <InformationTabs v-model="activeTab" :tabs="tabs" />
 
-      <AcademicInfoPanel v-if="activeTab === 'academic'" ref="academicPanelRef" />
+      <AcademicInfoPanel
+        v-if="activeTab === 'academic'"
+        ref="academicPanelRef"
+        @share="openArticleShare"
+      />
 
-      <ProductAlbumPanel v-else ref="albumPanelRef" />
+      <ProductAlbumPanel v-else ref="albumPanelRef" @share="openAlbumShare" />
     </template>
   </view>
+
+  <wd-popup
+    v-model="sharePopupVisible"
+    position="bottom"
+    root-portal
+    lock-scroll
+    :safe-area-inset-bottom="true"
+    custom-style="border-radius: 32rpx 32rpx 0 0;"
+    @close="resetShareForm"
+  >
+    <view class="share-popup">
+      <view class="share-popup__hero">
+        <view class="share-popup__hero-icon">
+          <wd-icon name="share-internal" size="38rpx" color="#ffffff" />
+        </view>
+
+        <view class="share-popup__hero-content">
+          <text class="share-popup__title">转发给好友</text>
+          <text class="share-popup__subtitle">选择积分包并补充转发备注</text>
+        </view>
+
+        <view class="share-popup__close" hover-class="share-popup__close--hover" @tap="sharePopupVisible = false">
+          <wd-icon name="close" size="30rpx" color="#667085" />
+        </view>
+      </view>
+
+      <view class="share-popup__body">
+        <view class="share-popup__notice">
+          <view class="share-popup__notice-icon">
+            <wd-icon name="warning" size="28rpx" color="#e5484d" />
+          </view>
+          <text class="share-popup__notice-text">
+            不能针对非医疗专业人员转发处方药相关宣传信息
+          </text>
+        </view>
+
+        <view class="share-popup__section">
+          <view class="share-popup__section-header">
+            <view>
+              <text class="share-popup__label">选择积分包</text>
+              <text class="share-popup__section-desc">滚动选择本次转发关联的积分包</text>
+            </view>
+            <text class="share-popup__count">{{ sharePackageList.length }} 个可用</text>
+          </view>
+
+          <view class="share-popup__picker-wrap">
+            <wd-picker-view
+              v-model="selectedPackageValues"
+              custom-class="share-package-picker"
+              :columns="sharePackageList"
+              :item-height="48"
+              :visible-item-count="3"
+              value-key="value"
+              label-key="label"
+              @pickstart="sharePickerScrolling = true"
+              @pickend="sharePickerScrolling = false"
+            />
+          </view>
+        </view>
+
+        <view class="share-popup__section share-popup__section--remark">
+          <view class="share-popup__section-header">
+            <view>
+              <text class="share-popup__label">转发备注</text>
+              <text class="share-popup__section-desc">选填，将随分享链接一并传递</text>
+            </view>
+            <text class="share-popup__remark-count">{{ shareRemark.length }}/100</text>
+          </view>
+
+          <view class="share-popup__input-wrap">
+            <input
+              v-model="shareRemark"
+              class="share-popup__input"
+              type="text"
+              :maxlength="100"
+              :cursor-spacing="150"
+              placeholder="请输入备注内容"
+              placeholder-class="share-popup__placeholder"
+            />
+          </view>
+        </view>
+
+        <button
+          class="share-popup__confirm"
+          hover-class="share-popup__confirm--hover"
+          open-type="share"
+          :disabled="!canSubmitShare"
+          :data-title="shareTarget?.title || ''"
+          :data-id="shareTarget?.id || ''"
+          :data-active-tab="shareTarget?.type || activeTab"
+          :data-package-id="selectedPackage?.value || ''"
+          :data-remark="shareRemark"
+        >
+          <wd-icon name="share-internal" size="30rpx" color="#ffffff" />
+          <text>确认转发</text>
+        </button>
+      </view>
+    </view>
+  </wd-popup>
 </template>
 
 <script setup lang="ts">
@@ -17,6 +122,18 @@ import { computed, ref } from 'vue'
 
 import { onPullDownRefresh, onReachBottom, onShareAppMessage } from '@dcloudio/uni-app'
 
+import {
+  getPackageListByTaskTypeAndAlbumIdApi,
+  getPackageListByTaskTypeApi,
+  shareAlbumByIdApi,
+  shareArticleByIdApi,
+} from '@/services/modules/information'
+import type {
+  AlbumPageNewItem,
+  ArticleItem,
+  SharePackageItem,
+} from '@/services/modules/information/type'
+
 import { useUserStore } from '@/stores/modules/user'
 
 import AcademicInfoPanel from './components/academic/AcademicInfoPanel.vue'
@@ -40,8 +157,20 @@ interface ShareDataset {
   id?: string | number
   title?: string
   activeTab?: TabKey
+  activetab?: TabKey
+  packageId?: string
+  remark?: string
 }
 
+interface ShareTarget {
+  id: string
+  title: string
+  type: TabKey
+}
+
+const ARTICLE_TASK_TYPE = '9'
+const ALBUM_TASK_TYPE = '8'
+
 const userStore = useUserStore()
 
 const isLoggedIn = computed<boolean>(() => {
@@ -61,6 +190,26 @@ const tabs: TabItem[] = [
 
 const activeTab = ref<TabKey>('academic')
 
+const sharePopupVisible = ref(false)
+const sharePackageList = ref<SharePackageItem[]>([])
+const selectedPackageValues = ref<Array<string | number>>([])
+const shareRemark = ref('')
+const shareTarget = ref<ShareTarget | null>(null)
+const sharePickerScrolling = ref(false)
+const loadingSharePackages = ref(false)
+
+const selectedPackage = computed<SharePackageItem | undefined>(() => {
+  const selectedValue = selectedPackageValues.value[0]
+
+  return sharePackageList.value.find((item) => String(item.value) === String(selectedValue))
+})
+
+const canSubmitShare = computed<boolean>(() => {
+  return Boolean(
+    shareTarget.value?.id && selectedPackage.value?.value && !sharePickerScrolling.value
+  )
+})
+
 const academicPanelRef = ref<PanelExpose | null>(null)
 const albumPanelRef = ref<PanelExpose | null>(null)
 
@@ -68,6 +217,122 @@ const currentPanel = computed<PanelExpose | null>(() => {
   return activeTab.value === 'academic' ? academicPanelRef.value : albumPanelRef.value
 })
 
+const showBlacklistWarning = (): boolean => {
+  if (!userStore.hasBlacklistRisk) return false
+
+  uni.showModal({
+    showCancel: false,
+    title: '提示',
+    content: '该账号存在风险，请联系管理员',
+  })
+
+  return true
+}
+
+const openArticleShare = async (item: ArticleItem): Promise<void> => {
+  console.log('qaq openArticleShare')
+
+  await openShare({
+    id: String(item.id),
+    title: item.title,
+    type: 'academic',
+  })
+}
+
+const openAlbumShare = async (item: AlbumPageNewItem): Promise<void> => {
+  await openShare({
+    id: String(item.id),
+    title: item.xcmc || '未命名相册',
+    type: 'album',
+  })
+}
+
+const openShare = async (target: ShareTarget): Promise<void> => {
+  if (loadingSharePackages.value || showBlacklistWarning()) return
+
+  loadingSharePackages.value = true
+  shareTarget.value = target
+  shareRemark.value = ''
+  sharePackageList.value = []
+  selectedPackageValues.value = []
+  sharePickerScrolling.value = false
+
+  try {
+    const res =
+      target.type === 'academic'
+        ? await getPackageListByTaskTypeApi(ARTICLE_TASK_TYPE)
+        : await getPackageListByTaskTypeAndAlbumIdApi(ALBUM_TASK_TYPE, target.id)
+    const packageList = Array.isArray(res.data) ? res.data : []
+
+    if (res.code !== 0 || packageList.length === 0) {
+      uni.showToast({
+        title: res.msg || '暂无可用积分包',
+        icon: 'none',
+      })
+      shareTarget.value = null
+      return
+    }
+
+    sharePackageList.value = packageList
+    selectedPackageValues.value = [packageList[0].value]
+    sharePopupVisible.value = true
+  } catch (error) {
+    console.error('获取转发积分包失败：', error)
+  } finally {
+    loadingSharePackages.value = false
+  }
+}
+
+const resetShareForm = (): void => {
+  shareTarget.value = null
+  sharePackageList.value = []
+  selectedPackageValues.value = []
+  shareRemark.value = ''
+  sharePickerScrolling.value = false
+}
+
+const reportShare = async (params: {
+  id: string
+  type: TabKey
+  packageId: string
+  remark: string
+}): Promise<void> => {
+  const userId = userStore.currentUserInfo?.userId || ''
+
+  if (!userId) return
+
+  try {
+    const commonParams = {
+      shareUserId: userId,
+      openUserId: userId,
+      type: 'share',
+      packageId: params.packageId,
+      sharePicUrl: '',
+      remark: params.remark,
+    } as const
+
+    const res =
+      params.type === 'academic'
+        ? await shareArticleByIdApi({
+            ...commonParams,
+            articleId: params.id,
+          })
+        : await shareAlbumByIdApi({
+            ...commonParams,
+            id: params.id,
+          })
+
+    if (res.msg) {
+      uni.showToast({
+        title: res.msg,
+        icon: 'none',
+      })
+    }
+  } catch (error) {
+    console.error('记录资讯转发失败：', error)
+  }
+}
+
 onReachBottom(() => {
   if (!isLoggedIn.value) return
 
@@ -90,13 +355,41 @@ onShareAppMessage((res) => {
 
   const id = dataset?.id
   const title = dataset?.title || '要易小助手'
-  const type = dataset?.activeTab || activeTab.value
+  const type = dataset?.activeTab || dataset?.activetab || activeTab.value
+
+  if (!id) {
+    return {
+      title,
+      path: '/pages/information/index',
+    }
+  }
+
+  const query = [`type=${type}`, `id=${encodeURIComponent(String(id))}`]
+
+  const shareUserId = userStore.currentUserInfo?.userId || ''
+  const packageId = dataset?.packageId || selectedPackage.value?.value || ''
+  const remark = dataset?.remark ?? shareRemark.value
+
+  if (shareUserId && packageId) {
+    query.push(
+      `shareUserId=${encodeURIComponent(shareUserId)}`,
+      `packageId=${encodeURIComponent(packageId)}`,
+      `remark=${encodeURIComponent(remark)}`
+    )
+
+    void reportShare({
+      id: String(id),
+      type,
+      packageId,
+      remark,
+    })
+  }
+
+  sharePopupVisible.value = false
 
   return {
     title,
-    path: id
-      ? `/pages-sub-packages/information/detail/index?type=${type}&id=${id}`
-      : '/pages/information/index',
+    path: `/pages/information/detail/index?${query.join('&')}`,
   }
 })
 </script>
@@ -106,4 +399,242 @@ onShareAppMessage((res) => {
   min-height: 100vh;
   background: #fff;
 }
+
+.share-popup {
+  box-sizing: border-box;
+  width: 100%;
+  overflow: hidden;
+  padding-bottom: max(24rpx, env(safe-area-inset-bottom));
+  background: #ffffff;
+}
+
+.share-popup__hero {
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding: 34rpx 88rpx 30rpx 32rpx;
+  background:
+    radial-gradient(circle at 86% 0%, rgba(82, 179, 255, 0.18) 0, transparent 42%),
+    linear-gradient(135deg, #eef8ff 0%, #f8fbff 54%, #ffffff 100%);
+  border-bottom: 1rpx solid rgba(47, 139, 230, 0.08);
+}
+
+.share-popup__hero-icon {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 76rpx;
+  height: 76rpx;
+  margin-right: 22rpx;
+  background: linear-gradient(135deg, #54b9ff 0%, #267fe8 100%);
+  border-radius: 24rpx;
+  box-shadow: 0 12rpx 28rpx rgba(47, 139, 230, 0.25);
+}
+
+.share-popup__hero-content {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.share-popup__title {
+  color: #172033;
+  font-size: 36rpx;
+  font-weight: 700;
+  line-height: 50rpx;
+}
+
+.share-popup__subtitle {
+  margin-top: 4rpx;
+  color: #7b8798;
+  font-size: 24rpx;
+  line-height: 34rpx;
+}
+
+.share-popup__close {
+  position: absolute;
+  top: 28rpx;
+  right: 28rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 56rpx;
+  height: 56rpx;
+  background: rgba(255, 255, 255, 0.8);
+  border: 1rpx solid rgba(102, 112, 133, 0.1);
+  border-radius: 50%;
+}
+
+.share-popup__close--hover {
+  opacity: 0.72;
+}
+
+.share-popup__body {
+  padding: 24rpx 28rpx 8rpx;
+}
+
+.share-popup__notice {
+  display: flex;
+  align-items: flex-start;
+  padding: 18rpx 20rpx;
+  background: linear-gradient(135deg, #fff5f5 0%, #fff9f8 100%);
+  border: 1rpx solid rgba(229, 72, 77, 0.12);
+  border-radius: 16rpx;
+}
+
+.share-popup__notice-icon {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  margin: 2rpx 12rpx 0 0;
+}
+
+.share-popup__notice-text {
+  color: #c74449;
+  font-size: 24rpx;
+  line-height: 36rpx;
+}
+
+.share-popup__section {
+  margin-top: 24rpx;
+  padding: 22rpx 22rpx 18rpx;
+  background: #ffffff;
+  border: 1rpx solid #e9eef5;
+  border-radius: 22rpx;
+  box-shadow: 0 8rpx 26rpx rgba(31, 45, 61, 0.045);
+}
+
+.share-popup__section--remark {
+  padding-bottom: 22rpx;
+}
+
+.share-popup__section-header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 20rpx;
+}
+
+.share-popup__label,
+.share-popup__section-desc {
+  display: block;
+}
+
+.share-popup__label {
+  color: #263246;
+  font-size: 29rpx;
+  font-weight: 650;
+  line-height: 40rpx;
+}
+
+.share-popup__section-desc {
+  margin-top: 2rpx;
+  color: #98a2b3;
+  font-size: 22rpx;
+  line-height: 32rpx;
+}
+
+.share-popup__count {
+  flex-shrink: 0;
+  padding: 6rpx 14rpx;
+  color: #2f8be6;
+  font-size: 22rpx;
+  line-height: 30rpx;
+  background: #edf7ff;
+  border-radius: 999rpx;
+}
+
+.share-popup__picker-wrap {
+  position: relative;
+  margin-top: 14rpx;
+  overflow: hidden;
+  background: linear-gradient(180deg, #fbfdff 0%, #f5f9fd 100%);
+  border: 1rpx solid #edf2f7;
+  border-radius: 16rpx;
+}
+
+:deep(.share-package-picker) {
+  --wot-picker-view-bg: transparent;
+  --wot-picker-view-padding: 0 12rpx;
+  --wot-picker-view-mask-start-color: rgba(248, 251, 254, 0.96);
+  --wot-picker-view-mask-end-color: rgba(248, 251, 254, 0.2);
+  --wot-picker-view-column-item-height: 48px;
+  --wot-picker-view-column-item-font-size: 28rpx;
+  --wot-picker-view-column-item-color: #7d899a;
+  --wot-picker-view-column-item-font-weight-active: 650;
+  --wot-picker-view-roller-bg: rgba(47, 139, 230, 0.1);
+  --wot-picker-view-roller-border-radius: 14rpx;
+}
+
+:deep(.share-package-picker .wd-picker-view__column-item--active) {
+  color: #237fd7;
+}
+
+.share-popup__remark-count {
+  flex-shrink: 0;
+  padding-top: 8rpx;
+  color: #a3acba;
+  font-size: 22rpx;
+  line-height: 30rpx;
+}
+
+.share-popup__input-wrap {
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 78rpx;
+  padding: 0 22rpx;
+  margin-top: 16rpx;
+  background: #f8fafc;
+  border: 1rpx solid #e7ecf2;
+  border-radius: 14rpx;
+}
+
+.share-popup__input {
+  width: 100%;
+  height: 74rpx;
+  color: #263246;
+  font-size: 27rpx;
+  line-height: 74rpx;
+}
+
+.share-popup__placeholder {
+  color: #b0b8c4;
+}
+
+.share-popup__confirm {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12rpx;
+  width: 100%;
+  height: 88rpx;
+  padding: 0;
+  margin: 26rpx 0 0;
+  color: #ffffff;
+  font-size: 30rpx;
+  font-weight: 600;
+  line-height: 88rpx;
+  background: linear-gradient(135deg, #53b7fb 0%, #2f8be6 58%, #2477d8 100%);
+  border: 0;
+  border-radius: 18rpx;
+  box-shadow: 0 12rpx 28rpx rgba(47, 139, 230, 0.24);
+}
+
+.share-popup__confirm::after {
+  border: 0;
+}
+
+.share-popup__confirm--hover {
+  opacity: 0.86;
+}
+
+.share-popup__confirm[disabled] {
+  color: rgba(255, 255, 255, 0.82);
+  background: linear-gradient(135deg, #b9c8d6 0%, #a9bac9 100%);
+  box-shadow: none;
+}
 </style>

src/services/modules/information/index.ts

@@ -6,6 +6,9 @@ import type {
   ArticleItem,
   ArticlePageRequest,
   ArticlePageResponse,
+  GetPackageListByTaskTypeResponse,
+  ShareAlbumRequest,
+  ShareArticleRequest,
 } from './type'
 
 export const getArticlePageApi = (data: ArticlePageRequest) => {
@@ -29,3 +32,33 @@ export const getArticleByIdApi = (id: string) => {
 export const getAlbumByIdApi = (id: string) => {
   return http.get<AlbumPageNewItem>(`/admin/api/getAlbumById?id=${id}`)
 }
+
+export const getPackageListByTaskTypeApi = (type: string) => {
+  return http.get<GetPackageListByTaskTypeResponse>(
+    `/admin/api/getPackageListByTaskType`,
+    { type },
+    {
+      loading: true,
+      loadingText: '加载中...',
+    }
+  )
+}
+
+export const getPackageListByTaskTypeAndAlbumIdApi = (type: string, albumId: string) => {
+  return http.get<GetPackageListByTaskTypeResponse>(
+    `/admin/api/getPackageListByTaskTypeAndAlbumId`,
+    { type, albumId },
+    {
+      loading: true,
+      loadingText: '加载中...',
+    }
+  )
+}
+
+export const shareArticleByIdApi = (params: ShareArticleRequest) => {
+  return http.get<unknown>(`/admin/api/shareArticleById`, params)
+}
+
+export const shareAlbumByIdApi = (params: ShareAlbumRequest) => {
+  return http.get<unknown>(`/admin/api/shareAlbumById`, params)
+}

src/services/modules/information/type.d.ts

@@ -81,3 +81,30 @@ export interface AlbumPageNewItem {
   updateUser: string | null
   wb: string
 }
+
+export interface SharePackageItem {
+  value: string
+  label: string
+  deptId: string
+  relDeptId: string
+  drugProducer: string
+}
+
+export type GetPackageListByTaskTypeResponse = SharePackageItem[]
+
+export interface ShareRequestBase {
+  shareUserId: string
+  openUserId: string
+  type: 'share'
+  packageId: string
+  sharePicUrl: string
+  remark: string
+}
+
+export interface ShareArticleRequest extends ShareRequestBase {
+  articleId: string
+}
+
+export interface ShareAlbumRequest extends ShareRequestBase {
+  id: string
+}

src/types/mp-html.d.ts

@@ -0,0 +1,5 @@
+declare module 'mp-html/dist/uni-app/components/mp-html/mp-html' {
+  const mpHtml: any
+
+  export default mpHtml
+}