<template> <view class="flex-col justify-start relative page" :style="{ backgroundImage: 'url(' + bkgPubilcPath + ')' }"> <view class="section" :style="{ backgroundImage: 'url(' + bkgPubilcPath + ')' }"></view> <image class="image pos" :src="homeUrl + '/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="homeUrl + '/xzyy.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="homeUrl + '/jyty.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="homeUrl + '/tjsp.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="jumpToActivity"> <image class="shrink-0 self-center image_4" :src="homeUrl + '/hdzx.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"; import { getFonts } from '../../common/globalFont'; import { getZSFont } from '../../common/globalFont'; import { homeUrl,bkgPubilcPath } from '../../common/globalImagesUrl'; const bkgUrl = ref(homeUrl + '/bkg.png') onShow(() => { uni.removeStorageSync('businessId') }) onLoad(()=>{ getFonts() getZSFont() getMyUser() }) 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: 'error', title: "未登录" }) } } const jump_xiezhen =()=>{ //跳转写真预约 uni.navigateTo({ url: '/pages/book/myPhotoProducts/myPhotoProducts' }) } const jump_feiyi =()=>{ //跳转非遗工坊 uni.navigateTo({ url: '/pages/workshop/index/index' }) } const jump_store =()=>{ uni.switchTab({ url: '/pages/store-home/main/testMain' }) } const jumpToActivity = () => { uni.navigateTo({ url: '../activity/activityMain/activityMain' }) } //为了上架的提示框 const showTest = ref(false) const showStop =()=>{ showTest.value = true // uni.navigateTo({ // url: '../activity/activityHome/activityHome' // }) } </script> <style lang="scss" scoped> .ml-7 { margin-left: 4.13rpx; } .page { // background-image: url(https://123.249.108.160:8888/api/file/downloadFile?objectKey=feiyi/miniProgram/home/bkg.png); background-size: 100% 100%; background-repeat: no-repeat; width: 100%; overflow-y: auto; overflow-x: hidden; height: 100vh; } .section { // height: 1415.63rpx; } .image { opacity: 0.35; width: 86vw; height: 127.5vw; } .pos { position: absolute; left: 0; top: 0; } .text { color: #C35C5D; font-size: 37.5rpx; font-family: 'FangZhengFonts'; line-height: 36.92rpx; } .pos_6 { position: absolute; left: 50%; bottom: 30%; 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; top: 676.8rpx; } .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: 0; right: 0; bottom: 50rpx; margin: 0 auto; } .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: #323232; } .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; color: #F29FA3; } .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>