!12 商城装修

Merge pull request !12 from 疯狂的世界/master-vue3
pull/14/MERGE
芋道源码 2023-11-06 06:59:16 +00:00 committed by Gitee
commit c7df3c9fbd
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
8 changed files with 51 additions and 41 deletions

View File

@ -2,7 +2,7 @@
<view v-if="template">
<s-layout title="首页" navbar="custom" tabbar="/pages/index/index" :bgStyle="template.page"
:navbarStyle="template.style?.navbar" onShareAppMessage>
<s-block v-for="(item, index) in template.components" :key="index" :styles="item.style">
<s-block v-for="(item, index) in template.components" :key="index" :styles="item.property.style">
<s-block-item :type="item.id" :data="item.property" :styles="item.property.style" />
</s-block>
<!-- 广告模块 -->

View File

@ -1,12 +1,12 @@
<template>
<view>
<s-image-block v-if="type === 'imageBlock'" :data="data" :styles="styles" />
<s-image-banner v-if="type === 'imageBanner'" :data="data" :styles="styles" />
<s-video-block v-if="type === 'videoPlayer'" :data="data" :styles="styles" />
<s-image-block v-if="type === 'ImageBar'" :data="data" :styles="styles" />
<s-image-banner v-if="type === 'Carousel'" :data="data" :styles="styles" />
<s-video-block v-if="type === 'VideoPlayer'" :data="data" :styles="styles" />
<s-image-cube v-if="type === 'imageCube'" :data="data" :styles="styles" />
<s-notice-block v-if="type === 'NoticeBar'" :data="data" />
<s-search-block v-if="type === 'searchBlock'" :data="data" :navbar="false" />
<s-search-block v-if="type === 'SearchBar'" :data="data" :styles="styles" :navbar="false" />
<s-title-block v-if="type === 'titleBlock'" :data="data" :styles="styles" />
<s-line-block v-if="type === 'lineBlock'" :data="data" />

View File

@ -20,12 +20,12 @@
const elBackground = computed(() => {
if (props.styles) {
if (props.styles.background.type == 'color')
return { background: props.styles.background.bgColor };
if (props.styles.background.type == 'image')
if (props.styles.bgType === 'color')
return { background: props.styles.bgColor };
if (props.styles.bgType === 'img')
return {
background: `url(${sheep.$url.cdn(
props.styles.background.bgImage,
props.styles.bgImage,
)}) no-repeat top center / 100% auto`,
};
}
@ -34,15 +34,18 @@
const elStyles = computed(() => {
if (props.styles) {
return {
marginTop: `${props.styles.marginTop}px`,
marginBottom: props.styles.marginBottom + 'px',
marginLeft: `${props.styles.marginLeft}px`,
marginRight: props.styles.marginRight + 'px',
'border-top-left-radius': props.styles.borderRadiusTop + 'px',
'border-top-right-radius': props.styles.borderRadiusTop + 'px',
'border-bottom-left-radius': props.styles.borderRadiusBottom + 'px',
'border-bottom-right-radius': props.styles.borderRadiusBottom + 'px',
padding: props.styles.padding + 'px',
marginTop: `${props.styles.marginTop || 0}px`,
marginBottom: `${props.styles.marginBottom || 0}px`,
marginLeft: `${props.styles.marginLeft || 0}px`,
marginRight: `${props.styles.marginRight || 0}px`,
paddingTop: `${props.styles.paddingTop || 0}px`,
paddingRight: `${props.styles.paddingRight || 0}px`,
paddingBottom: `${props.styles.paddingBottom || 0}px`,
paddingLeft: `${props.styles.paddingLeft || 0}px`,
borderTopLeftRadius: `${props.styles.borderTopLeftRadius || 0}px`,
borderTopRightRadius: `${props.styles.borderTopRightRadius || 0}px`,
borderBottomRightRadius: `${props.styles.borderBottomRightRadius || 0}px`,
borderBottomLeftRadius: `${props.styles.borderBottomLeftRadius || 0}px`,
overflow: 'hidden',
};
}

View File

@ -1,12 +1,13 @@
<template>
<su-swiper
:list="imgList"
:dotStyle="dotMap[data.indicator]"
imageMode="widthFix"
:dotStyle="data.indicator === 'dot' ? 'long' : 'tag'"
imageMode="scaleToFill"
dotCur="bg-mask-40"
:seizeHeight="300"
:autoplay="data.autoplay"
:interval="Number(data.interval)"
:interval="data.interval * 1000"
:mode="data.type"
/>
</template>
@ -14,10 +15,7 @@
import { computed } from 'vue';
import sheep from '@/sheep';
const dotMap = {
1: 'long',
2: 'tag',
};
//
const props = defineProps({
data: {
type: Object,
@ -30,11 +28,15 @@
});
const imgList = computed(() =>
props.data.list.map((item) => ({
...item,
src: sheep.$url.cdn(item.src),
poster: sheep.$url.cdn(item.poster),
})),
props.data.items.map((item) => {
const src = item.type === 'img' ? item.imgUrl : item.videoUrl;
return {
...item,
type: item.type === 'img' ? 'image' : 'video',
src: sheep.$url.cdn(src),
poster: sheep.$url.cdn(item.imgUrl),
};
}),
);
</script>

View File

@ -1,6 +1,6 @@
<template>
<view @tap="sheep.$router.go(data?.url)">
<su-image :src="sheep.$url.cdn(data.src)" mode="widthFix"></su-image>
<su-image :src="sheep.$url.cdn(data.imgUrl)" mode="widthFix"></su-image>
</view>
</template>

View File

@ -29,24 +29,23 @@
v-model="state.searchVal"
/>
<view class="keyword-link ss-flex">
<view v-for="(item, index) in data.keywords" :key="index">
<view v-for="(item, index) in data.hotKeywords" :key="index">
<view
class="ss-m-r-16"
:style="[{ color: item.color }]"
@tap.stop="sheep.$router.go('/pages/goods/list', { keyword: item.text })"
>{{ item.text }}</view
:style="[{ color: data.textColor }]"
@tap.stop="sheep.$router.go('/pages/goods/list', { keyword: item })"
>{{ item }}</view
>
</view>
</view>
<view v-if="data.keywords && data.keywords.length && navbar" class="ss-flex">
<view v-if="data.hotKeywords && data.hotKeywords.length && navbar" class="ss-flex">
<button
class="ss-reset-button keyword-btn"
v-for="(item, index) in data.keywords"
v-for="(item, index) in data.hotKeywords"
:key="index"
:style="[{ color: item.color, marginRight: '10rpx' }]"
:style="[{ color: data.textColor, marginRight: '10rpx' }]"
>
{{ item.text }}
{{ item }}
</button>
</view>
</view>

View File

@ -4,8 +4,9 @@
class="sss"
:uid="guid()"
:src="sheep.$url.cdn(data.videoUrl)"
:poster="sheep.$url.cdn(data.src)"
:poster="sheep.$url.cdn(data.posterUrl)"
:height="styles.height * 2"
:autoplay="data.autoplay"
></su-video>
</template>

View File

@ -18,6 +18,7 @@
@pause="pause"
@ended="end"
:poster="poster"
:autoplay="autoplay"
>
<!-- #ifdef APP-PLUS -->
<cover-view :style="{ transform: 'translateX(' + moveX + 'px)' }" />
@ -90,6 +91,10 @@
type: String,
default: 'https://img1.baidu.com/it/u=1601695551,235775011&fm=26&fmt=auto',
},
autoplay: {
type: Boolean,
default: false,
}
});
//