<template> <view class="flex-col justify-start relative page"> <view class="section"></view> <image class="image pos" src="https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FCSSXOwDH-flower.png" /> <text class="text pos_6">限定手制|非量售卖</text> <text class="font pos_2">匠</text> <text class="font pos_3">承</text> <text class="font pos_4">非</text> <text class="font pos_5">遗</text> <view class="grid pos_7"> <view class="flex-row grid-item" @click="jump_xiezhen"> <image class="shrink-0 self-center image_2" src="https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FenkBYRuk-firsticon.png" /> <view class="ml-4 flex-col items-center flex-1 self-start group"> <text class="font_2 text_2">写真预约</text> <text class="mt-14 font_3 text_3">伊人摸样,丹青绘画</text> </view> </view> <view class="flex-row items-center grid-item_2" @click="jump_feiyi"> <image class="shrink-0 image_3" src="https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FKLEsLGUY-secondicon.png" /> <view class="flex-col items-center flex-1 ml-7"> <text class="font_2">手作材包</text> <text class="mt-14 font_3">朴物良社,匠心手作</text> </view> </view> <view class="flex-row grid-item_3" @click="jump_store"> <image class="shrink-0 self-center image_5" src="https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FoHoMDXDs-tirdicon2.png" /> <view class="flex-col items-center flex-1 self-start group_2 ml-7"> <text class="font_2 text_5">推荐商品</text> <text class="mt-12 font_3 text_6">伊人摸样,丹青绘画</text> </view> </view> <view class="flex-row relative grid-item_4" @click="showStop"> <image class="shrink-0 self-center image_4" src="https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FlMKuKgjS-fourthicon.png" /> <text class="self-start font_2 text_4">活动咨询</text> <text class="font_3 pos_8">朴物良社,匠心手作</text> </view> </view> </view> </template> <script setup> import {inject, ref} from 'vue' import { baseUrl, testUrl , suiUrl} from '@/api/request'; import { onShow,onLoad } from "@dcloudio/uni-app"; onShow(() => { uni.removeStorageSync('businessId') getMyUser() }) onLoad(()=>{ getFonts() }) const getMyUser = async () =>{ const res = await uni.request({ url: baseUrl + '/user/get/login', method: 'GET', header: { // 读取JSESSIONID 'cookie': wx.getStorageSync("cookie") } }) console.log('获取用户信息==>',res.data) if( res.data.code === 40100 ) { uni.navigateTo({ url: '/pages/login/login' }) uni.showToast({ icon: 'loading', title: "请登录" }) } } const jump_xiezhen =()=>{ //跳转写真预约 uni.navigateTo({ url: '/pages/book/photoProducts/photoProducts' }) } const jump_feiyi =()=>{ //跳转非遗工坊 uni.navigateTo({ url: '/pages/workshop/index/index' }) } const jump_store =()=>{ uni.switchTab({ url: '/pages/store-home/main/testMain' }) } const getFonts =()=>{ uni.loadFontFace({ family: 'ZhongShanFonts', source: `url("https://carbon2.obs.cn-north-4.myhuaweicloud.com/fonts/ZhongShanFonts.ttf")`, success:(res) =>{ console.log('success',res); }, fail:(err) => { console.log('err',err); } }) uni.loadFontFace({ family: 'FangZhengFonts', source: `url("https://carbon2.obs.cn-north-4.myhuaweicloud.com/fonts/FangZhengFonts.TTF")`, success:(res) =>{ console.log('success',res); }, fail:(err) => { console.log('err',err); } }) } //为了上架的提示框 const showStop =()=>{ uni.showModal({ title: '提示', content: '正在开发中!' }) } </script> <style lang="scss" scoped> .ml-7 { margin-left: 4.13rpx; } .page { background-image: url('https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FQfLHXSAU-feiyigongfangbeijin.png'); background-size: 100% 100%; background-repeat: no-repeat; width: 100%; overflow-y: auto; overflow-x: hidden; height: 100%; } .section { background-image: url('https://carbon2.obs.cn-north-4.myhuaweicloud.com:443/feiyi%2Ftest%2F0%2FQfLHXSAU-feiyigongfangbeijin.png'); background-size: 100% 100%; background-repeat: no-repeat; width: 750rpx; height: 1415.63rpx; } .image { opacity: 0.35; width: 96vw; height: 137.5vw; } .pos { position: absolute; left: 0; right: 30rpx; top: 0; } .text { color: #C35C5D; font-size: 37.5rpx; font-family: FangZhengFonts; line-height: 36.92rpx; } .pos_6 { position: absolute; left: 50%; bottom: 435.51rpx; transform: translateX(-50%); } .font { font-size: 168.75rpx; font-family: ZhongShanFonts; line-height: 202.5rpx; color: #C35C5D; } .pos_2 { position: absolute; right: 156.19rpx; top: 71.25rpx; } .pos_3 { position: absolute; right: 114.81rpx; top: 273.43rpx; } .pos_4 { position: absolute; right: 165.41rpx; top: 474.62rpx; } .pos_5 { position: absolute; right: 114.81rpx; bottom: 543.26rpx; } .grid { width: 646.88rpx; height: 305.63rpx; display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 56.38rpx; column-gap: 80.76rpx; } .pos_7 { position: absolute; left: 45rpx; top: 1059.38rpx; } .grid-item { padding: 22.5rpx 11.25rpx 22.5rpx 18.75rpx; background-color: #ffffff; border-radius: 46.88rpx; } .image_2 { width: 73.13rpx; height: 78.75rpx; } .group { margin-top: 11.25rpx; } .font_2 { font-size: 28.13rpx; font-family: FangZhengFonts; line-height: 26.47rpx; color: #000000; } .text_2 { line-height: 27.36rpx; } .grid-item_2 { padding: 22.5rpx 3.75rpx 22.5rpx 15rpx; background-color: #ffffff; border-radius: 46.88rpx; } .image_3 { width: 76.88rpx; height: 76.88rpx; } .grid-item_3 { padding: 22.5rpx 3.75rpx 22.5rpx 11.25rpx; background-color: #ffffff; border-radius: 46.88rpx; } .image_5 { width: 80.63rpx; height: 78.75rpx; } .group_2 { margin-top: 15rpx; } .text_5 { line-height: 27.02rpx; } .font_3 { font-size: 18.75rpx; font-family: FangZhengFonts; line-height: 17.29rpx; color: #faddde; } .text_3 { line-height: 18.09rpx; } .text_6 { line-height: 18.09rpx; } .grid-item_4 { padding: 16.88rpx 9.38rpx; background-color: #ffffff; border-radius: 46.88rpx; width: 281.25rpx; } .image_4 { width: 103.13rpx; height: 91.88rpx; } .text_4 { margin-left: 18.75rpx; margin-top: 15rpx; } .pos_8 { position: absolute; right: 18.14rpx; bottom: 24.28rpx; } /* 隐藏滚动条 */ ::-webkit-scrollbar { display: none; } @import url(../../common/css/global.css); </style>