sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改页面显示

master
于肖磊 2024-09-26 16:00:26 +08:00
parent 6e156b8350
commit 987b8d0c59
9 changed files with 67 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/diy/carousel.vue
View File

@ -4,7 +4,7 @@
<block v-if="form.carousel_type == 'card'">
<swiper-item v-for="(item, index) in new_list" :key="index" class="flex-row align-c" :data-value="item.carousel_link.page" @tap="url_open">
<view class="swiper-item" :style="img_style" :class="['scale-defalt', { 'scale-1': animationData === index }]">
<imageEmpty :propImageSrc="item.carousel_img[0]" :propTypeStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.carousel_img[0]" :propStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
<view v-if="new_style.video_is_show == '1' && item.carousel_video.length > 0" :class="{ 'x-middle': new_style.video_location == 'center', 'right-0': new_style.video_location == 'flex-end' }" class="video-class flex-row pa gap-10 align-c oh" :style="video_style" @tap.stop="video_play(item.carousel_video)">
<block v-if="new_style.video_type == 'img'">
@ -21,8 +21,8 @@
</block>
<block v-else>
<swiper-item v-for="(item, index) in new_list" :key="index" :style="{ 'padding-right': new_style.image_spacing * 2 + 'rpx' }">
<view class="item-image flex-row jc-c align-c wh-auto ht-auto pr" :style="img_style">
<imageEmpty :propImageSrc="item.carousel_img[0]" :propTypeStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
<view class="wh-auto ht-auto pr" :style="img_style">
<imageEmpty :propImageSrc="item.carousel_img[0]" :propStyle="img_style" :propImgFit="img_fit" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
<view v-if="new_style.video_is_show == '1' && item.carousel_video.length > 0" :class="{ 'x-middle': new_style.video_location == 'center', 'right-0': new_style.video_location == 'flex-end' }" class="video-class flex-row pa gap-10 align-c oh" :style="video_style" @tap.stop="video_play(item.carousel_video)">
<block v-if="new_style.video_type == 'img'">

29
components/diy/float-window.vue
View File

@ -1,13 +1,13 @@
<template>
<view v-if="form.button_img.length > 0" class="pa" :style="style">
<view v-if="form.button_img.length > 0" class="pf float-window" :style="style">
<view class="flex-row align-c jc-c" @click="url_open">
<view class="spread flex-row align-c jc-c">
<view class="float-window-spread flex-row align-c jc-c">
<block v-if="new_style.float_style == 'diffuse'">
<view class="ring" :style="color"></view>
<view class="ring" :style="color"></view>
</block>
<view class="img">
<imageEmpty :propImageSrc="form.button_img[0]" :propTypeStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
<imageEmpty :propImageSrc="form.button_img[0]" :propStyle="color" propImgFit="aspectFill" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
</view>
</view>
</view>
@ -72,21 +72,24 @@
<style scoped lang="scss">
.img {
width: 100rpx;
height: 100rpx;
width: 90rpx;
height: 90rpx;
border-radius: 50%;
}
.float-window {
z-index: 103;
}
/**
* 呼吸灯
*/
.spread {
* 呼吸灯
*/
.float-window-spread {
position: relative;
z-index: 1;
width: 100rpx;
height: 100rpx;
width: 120rpx;
height: 120rpx;
border-radius: 50%;
}
.spread .ring {
.float-window-spread .ring {
/* 速度为1.5 * 层数 = 实际运行速度，速度修改则 animation-delay 属性也修改相同速度 */
animation: pulsing 1.5s ease-out infinite;
border-radius: 100%;
@ -95,13 +98,13 @@
position: absolute;
}
/* 速度为1*层数 */
.spread .ring:nth-of-type(1) {
.float-window-spread .ring:nth-of-type(1) {
-webkit-animation-delay: -1.5s;
animation-delay: -1.5s;
}
/* 速度为1*层数 */
.spread .ring:nth-of-type(2) {
.float-window-spread .ring:nth-of-type(2) {
-webkit-animation-delay: -2s;
animation-delay: -2s;
}

8
components/diy/goods-list.vue
View File

@ -16,10 +16,10 @@
<block v-else>
<block v-if="!isEmpty(item)">
<view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + theme">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
<view v-else :class="'flex-img' + theme">
<imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
</block>
<view class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
@ -106,10 +106,10 @@
<view v-for="(item, index) in item1.split_list" :key="index" class="pr" :class="layout_type" :style="layout_style" :data-value="item.goods_url" @tap="url_event">
<block v-if="!isEmpty(item)">
<view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + theme">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
<view v-else :class="'flex-img' + theme">
<imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
</block>
<view class="flex-col flex-1 jc-sb content gap-10" :style="content_style">

2
components/diy/modules/custom/model-image.vue
View File

@ -1,6 +1,6 @@
<template>
<view class="img-outer pr wh-auto ht-auto" :style="border_style" @tap="url_open(form.link)">
<imageEmpty :propImageSrc="img" :propTypeStyle="image_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
<imageEmpty :propImageSrc="img" :propStyle="image_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
</view>
</template>
<script>

8
components/diy/modules/data-magic/magic-carousel.vue
View File

@ -1,13 +1,13 @@
<template>
<swiper circular="true" :autoplay="value.data_style.is_roll == '1'" :interval="value.data_style.interval_time * 1000" :duration="500" :vertical="value.data_style.rotation_direction == 'vertical'" class="swiper" style="height: 100%" @change="carousel_change">
<swiper-item v-for="(item1, index1) in value.data_content.list" :key="index1">
<swiper circular="true" :autoplay="propValue.data_style.is_roll == '1'" :interval="propValue.data_style.interval_time * 1000" :duration="500" :vertical="propValue.data_style.rotation_direction == 'vertical'" class="swiper" style="height: 100%" @change="carousel_change">
<swiper-item v-for="(item1, index1) in propValue.data_content.list" :key="index1">
<template v-if="propType === 'img'">
<view :data-value="item1.carousel_link.page" @tap="url_event">
<imageEmpty :propImageSrc="item1.carousel_img[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item1.carousel_img[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<template v-else>
<product-list-show :propOuterflex="value.outerflex" :propFlex="value.flex" :propNum="value.num" :propActived="propActived" :propIsShow="value.data_content.is_show" :propChunkPadding="value.data_style.chunk_padding" :propValue="item1.split_list" :propContentImgRadius="propContentImgRadius" @url_event="url_event"></product-list-show>
<product-list-show :propOuterflex="propValue.outerflex" :propFlex="propValue.flex" :propNum="propValue.num" :propActived="propActived" :propIsShow="propValue.data_content.is_show" :propChunkPadding="propValue.data_style.chunk_padding" :propValue="item1.split_list" :propContentImgRadius="propContentImgRadius" @url_event="url_event"></product-list-show>
</template>
</swiper-item>
</swiper>

40
components/diy/modules/data-magic/product-list-show.vue
View File

@ -2,12 +2,16 @@
<view v-if="propOuterflex == 'row'" class="wh-auto ht-auto">
<view class="flex-row gap-10 align-c wh-auto ht-auto">
<template v-if="propFlex === 'row'">
<view v-for="(item, index) in value" :key="index" class="flex-row gap-10 half-width ht-auto" :data-value="item.goods_url" @tap="url_event">
<view v-for="(item, index) in propValue" :key="index" class="flex-row gap-10 half-width ht-auto" :data-value="item.goods_url" @tap="url_event">
<template v-if="!isEmpty(item.new_cover)">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<template v-else>
<imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<view v-if="!isEmpty(propIsShow)" class="flex-col wh-auto ht-auto tl gap-10">
<view v-if="propIsShow.includes('title')" class="text-line-2 text-size-md shop-title">{{ item.title }}</view>
@ -22,13 +26,17 @@
</view>
</template>
<template v-else-if="propActived != 7 || propNum !== 1">
<view v-for="(item, index) in value" :key="index" :class="['flex-col gap-10 ht-auto', { 'half-width': propNum !== 1, 'wh-auto': propNum == 1 }]" :data-value="item.goods_url" @tap="url_event">
<view v-for="(item, index) in propValue" :key="index" :class="['flex-col gap-10 ht-auto', { 'half-width': propNum !== 1, 'wh-auto': propNum == 1 }]" :data-value="item.goods_url" @tap="url_event">
<view class="wh-auto ht-auto pr">
<template v-if="!isEmpty(item.new_cover)">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<template v-else>
<imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<view v-if="propIsShow.includes('price')" class="price-suspension text-line-1">
{{ item.show_price_symbol }}{{ item.min_price }}
@ -41,12 +49,16 @@
</view>
</template>
<template v-else>
<view v-for="(item, index) in value" :key="index" class="flex-col wh-auto ht-auto" :data-value="item.goods_url" @tap="url_event">
<view v-for="(item, index) in propValue" :key="index" class="flex-col wh-auto ht-auto" :data-value="item.goods_url" @tap="url_event">
<template v-if="!isEmpty(item.new_cover)">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<template v-else>
<imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<view v-if="!isEmpty(propIsShow)" class="flex-col wh-auto tl gap-10" :style="img_padding_computer">
<view v-if="propIsShow.includes('title')" class="text-line-2 text-size-md shop-title">{{ item.title }}</view>
@ -65,12 +77,16 @@
<view v-else class="wh-auto ht-auto">
<view class="flex-col gap-20 align-c wh-auto ht-auto">
<template v-if="propFlex === 'row'">
<view v-for="(item, index) in value" :key="index" class="flex-row gap-10 align-c wh-auto ht-auto shop-max-height" :data-value="item.goods_url" @tap="url_event">
<view v-for="(item, index) in propValue" :key="index" class="flex-row gap-10 align-c wh-auto ht-auto shop-max-height" :data-value="item.goods_url" @tap="url_event">
<template v-if="!isEmpty(item.new_cover)">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<template v-else>
<imageEmpty :propImageSrc="item.images" :propTypeStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
<view class="wh-auto ht-auto">
<imageEmpty :propImageSrc="item.images" :propStyle="propContentImgRadius" propErrorStyle="width: 80rpx;height: 80rpx;"></imageEmpty>
</view>
</template>
<view v-if="!isEmpty(propIsShow)" class="flex-col wh-auto ht-auto tl gap-20">
<view v-if="propIsShow.includes('title')" class="text-line-2 text-size-md shop-title">{{ item.title }}</view>

6
components/diy/modules/image-empty.vue
View File

@ -1,5 +1,5 @@
<template>
<view :class="['oh img_wh', propTypeClass]" :style="empty_outer_style + propTypeStyle">
<view :class="['oh img_wh', propClass]" :style="empty_outer_style + propStyle">
<image :src="imageUrl" @error="handleImageError" :mode="propImgFit" :style="empty_style" />
</view>
</template>
@ -20,11 +20,11 @@
type: String,
default: () => 'aspectFill',
},
propTypeStyle: {
propStyle: {
type: String,
default: () => '',
},
propTypeClass: {
propClass: {
type: String,
default: () => '',
},

6
components/diy/nav-group.vue
View File

@ -4,8 +4,10 @@
<swiper-item v-for="(item, index) in nav_content_list" :key="index" class="flex-row align-c">
<view class="bannerImg flex-row flex-wrap wh-auto gap-x-10">
<view v-for="(item1, index1) in item.split_list" :key="index1" class="flex-col gap-10 align-c" :style="{ width: group_width }" :data-value="item1.link.page" @tap="url_open_event">
<view v-if="['image_with_text', 'image'].includes(nav_style)" class="top-img flex-row align-c jc-c">
<imageEmpty :propImageSrc="item1.img[0]" :propTypeStyle="img_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
<view v-if="['image_with_text', 'image'].includes(nav_style)" class="flex-row align-c jc-c">
<view class="top-img">
<imageEmpty :propImageSrc="item1.img[0]" :propStyle="img_style" propErrorStyle="width: 60rpx;height: 60rpx;"></imageEmpty>
</view>
</view>
<view v-if="['image_with_text', 'text'].includes(nav_style)" class="size-12 ma-0" :style="text_style">{{ item1.title }}</view>
</view>

8
components/diy/seckill.vue
View File

@ -40,10 +40,10 @@
<template v-if="!isEmpty(item)">
<view class="oh pr" :class="'flex-img' + form.shop_style_type">
<view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + form.shop_style_type">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
</view>
<view v-else :class="'flex-img' + form.shop_style_type">
<imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
</view>
<view v-if="form.seckill_subscript_show == '1'" class="text-size-xs nowrap corner-marker" :style="corner_marker">
<text class="text-line-1">{{ form.subscript_text }}</text>
@ -103,10 +103,10 @@
<template v-if="!isEmpty(item)">
<view class="oh pr wh-auto ht-auto">
<view v-if="!isEmpty(item.new_cover)" :class="'flex-img' + form.shop_style_type">
<imageEmpty :propImageSrc="item.new_cover[0]" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.new_cover[0]" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
</view>
<view v-else :class="'flex-img' + form.shop_style_type">
<imageEmpty :propImageSrc="item.images" :propTypeStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
<imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width:100rpx; height: 100rpx;"></imageEmpty>
</view>
<view v-if="form.seckill_subscript_show == '1'" class="text-size-xs nowrap corner-marker" :style="corner_marker">
<text class="text-line-1">{{ form.subscript_text }}</text>