cheflinkuser/src/pages-user/pages/member/index.vue

<script setup lang="ts">
import {appMembershipConfigGet, appMembershipRechargeItemGet} from "@/service";
import {getDictFineList} from "@/pages-store/service";
const { t, locale } = useI18n();
import Config from '@/config/index'
import {useConfigStore, useUserStore} from "@/store";
const configStore = useConfigStore()
const userStore = useUserStore();

function handleSubmit() {
  uni.navigateTo({
    url: '/pages-user/pages/member/join-member',
    success: function(res) {
      // 通过eventChannel向被打开页面传送数据
      res.eventChannel.emit('acceptDataFromOpenerPage', { data: membershipRechargeList.value })
    }
  })
}

const membershipConfig = ref({});
const memberText = ref({
  title_delivery: '',
  desc_delivery: '',
  title_pickup: '',
  desc_pickup: ''
})
onLoad(()=> {
  appMembershipConfigGet({}).then(res=> {
    console.log(res)
    membershipConfig.value = res.data;
  })
  let isZh = locale.value === 'zh-Hans'
  getDictFineList({
    dictType: 'member_text'
  }).then(res=> {
    if(res.data) {
      res.data.forEach(item => {
        // 去除dictValue前后的空格，确保属性匹配正确
        const key = item.dictValue.trim();
        // 检查memberText中是否存在该属性
        if (memberText.value.hasOwnProperty(key)) {
          memberText.value[key] = isZh ? item.remark : item.dictLabel;
        }
      });
    }
  })
  appMembershipRechargeItem()
})

const membershipRechargeItem = ref({})
const membershipRechargeList = ref([])
function appMembershipRechargeItem() {
  appMembershipRechargeItemGet({}).then(res=> {
    console.log(res)
    membershipRechargeList.value = res.data || []
    membershipRechargeItem.value = res.data[0] || {}
  })
}
</script>

<template>
  <view class="">
    <navbar />
    <view class="px-30rpx">
      <view class="mb-52rpx mt-20rpx">
        <view class="text-46rpx lh-46rpx text-#333 font-bold tracking-[.04em]">{{ Config.appName }}</view>
        <view class="text-32rpx lh-32rpx text-#999 font-500 tracking-[.04em] mt-24rpx">
          <text>(${{ membershipRechargeItem.rechargeAmount || 0 }}/{{ membershipRechargeItem.name || 0 }})</text>
          <template v-if="!userStore.userInfo.userMembershipVo">
            <!-- <text class="ml-20rpx text-#CE7138">{{ membershipRechargeItem.trialWeeksDisplay || 0 }} {{ t('pages-user.member.weeks') }}</text>
            <text class="ml-20rpx text-#CE7138">{{ t('pages-user.member.free') }}</text> -->
            <text class="ml-20rpx text-#CE7138">Free for 7 days</text>
            <!-- <image :src="membershipRechargeItem.image"></image> -->
          </template>
        </view>
      </view>
      <view class="h-160rpx rounded-16rpx bg-#FFEED8 border-#D8D8D8 border-solid border-1rpx flex-center-sb">
<!--        <view class="">-->
<!--          <view class="text-28rpx lh-32rpx text-#333 font-500 tracking-[.04em]">Chef OneOnly 2 orders are needed to recoup costs</view>-->
<!--          <view class="text-22rpx lh-22rpx text-#999 mt-12rpx tracking-[.04em]">Monthly average level of members</view>-->
<!--        </view>-->
        <image
            :src="membershipConfig?.purchasePageImage"
            class="w-full h-full shrink-0"
        ></image>
      </view>
      <view class="flex-center-sb gap-30rpx my-52rpx">
        <view class="w-full min-h-340rpx rounded-20rpx border-#D8D8D8 border-solid border-2rpx pb-26rpx px-28rpx pt-20rpx">
          <image
              src="@img/chef/136.png"
              class="w-98rpx h-98rpx mb-18rpx"
          ></image>
          <view class="text-26rpx lh-26rpx text-#333 font-500 tracking-[.06em] mb-38rpx">
            {{ memberText.title_delivery }}
          </view>
          <view class="text-22rpx lh-22rpx text-#7d7d7d tracking-[.06em]">
            {{ memberText.desc_delivery }}
          </view>
        </view>

        <!-- <view class="w-full min-h-340rpx rounded-20rpx border-#D8D8D8 border-solid border-2rpx pb-26rpx px-28rpx pt-20rpx">
          <image
              src="@img/chef/137.png"
              class="w-98rpx h-98rpx mb-18rpx"
          ></image>
          <view class="text-26rpx lh-26rpx text-#333 font-500 tracking-[.06em] mb-38rpx">
            {{ memberText.title_pickup }}
          </view>
          <view class="text-22rpx lh-22rpx text-#7d7d7d tracking-[.06em]">
            {{ memberText.desc_pickup }}
          </view>
        </view> -->
      </view>

<!--      <image-->
<!--          src="@img/ls/13.png"-->
<!--          class="w-full h-444rpx"-->
<!--      ></image>-->

      <view class="pb-40rpx">
        <mp-html
            selectable
            :preview-img="false"
            :show-img-menu="false"
            :tag-style="{
        div: 'white-space: pre-wrap;',
        p: 'white-space: pre-wrap;',
       img: 'width:100%;max-width: 100%;height:auto;',
      }"
            :content="(membershipConfig?.content)"
        ></mp-html>
      </view>

      <view class="h-98rpx"></view>

      <view class="fixed bottom-0 left-0 right-0 px-30rpx">
        <wd-button custom-class="!h-98rpx !text-30rpx !text-#fff !lh-98rpx !rounded-16rpx" block
                   @click="handleSubmit">{{ t('pages-user.member.btn-text') }} {{ Config.appName }}
        </wd-button>
        <view :style="[configStore.iosSafeBottomPlaceholder]"></view>
      </view>
    </view>
  </view>
</template>

<style>
page {
  background-color: #fff;
}
</style>