优化项目结构

components/cm-module/homeIndex/quickOperation.vue

@@ -1,129 +0,0 @@
-<template>
-    <!-- 快捷运营 -->
-    <view class="container-pages">
-		<scroll-view scroll-x>
-			<view class="tui-goods__list">
-				<view class="tui-goods__item" v-for="(item, index) in list"  @click="NavToDetailPage(item)">
-					<view class="list-title">
-						<view class="title-1">
-							<view class="title-1-item">
-								<view style="display: inline-block;">{{ item.name }}</view>
-								<text class="title-2-item">GO></text>
-							</view>
-						</view>
-						<view class="title-2">{{item.remark || ''}}</view>
-					</view>
-					<view class="list-icon">
-						<image class="image" :src="item.icon" mode=""></image>
-					</view>
-				</view>
-			</view>
-		</scroll-view>	
-    </view>
-</template>
-
-<script>
-import cmsMixins from '@/mixins/cmsMixins.js'
-import { mapState } from 'vuex'
-export default {
-    mixins: [cmsMixins],
-    props: {
-        list: {
-            type: Array,
-            default: () => []
-        }
-    },
-    data() {
-        return {
-			shortcutList:[],
-            current: 0 // 切换轮播
-        }
-    },
-	created() {
-		this.shortcutList = this.list
-	},
-    computed: {
-        ...mapState(['hasLogin']),
-    },
-    watch: {},
-    mounted() {},
-    methods: {
-        // 链接跳转
-        NavToDetailPage(pros) {
-            // 采美快捷运营点击量统计
-            this.cmsMoudleHits(4, pros.id)
-			this.$api.FlooryNavigateTo(pros)
-        },
-        swiperChange(e) {
-            //轮播图切换
-            this.current = e.detail.current
-        }
-    }
-}
-</script>
-
-<style lang="scss" scoped>
-	
-.container-pages {
-	width: 100%;
-	height: 152rpx;
-	padding: 24rpx 24rpx 0 24rpx;
-	float: left;
-	background-color: #f7f7f7;
-	box-sizing: border-box;
-	background-color: #f7f7f7;
-	overflow: hidden;
-	display: flex;
-	align-items: center;
-	.tui-goods__list {
-		display: flex;
-		align-items: center;
-		.tui-goods__item {
-			background-color: #fff;
-			height: 128rpx;
-			border-radius: 16rpx;
-			box-sizing: border-box;
-			margin-right: 16rpx;
-			padding:24rpx 12rpx 24rpx 18rpx;
-			display: flex;
-			align-items: center;
-			background: linear-gradient(180deg, #FFF1EB 0%, #FFFFFF 100%);
-			.list-title {
-			    .title-1 {
-			        .title-1-item {
-			            color: #333333;
-			            font-size: 28rpx;
-			            width: 196rpx;
-			            display: flex;
-			            align-items: center;
-			            .title-2-item {
-			                width: 62rpx;
-			                height: 32rpx;
-			                background: #ff5b00;
-			                border-radius: 16rpx;
-			                font-size: 22rpx;
-			                text-align: center;
-			                height: 32rpx;
-			                color: white;
-			                margin-left: 6rpx;
-			            }
-			        }
-			    }
-			    .title-2 {
-			        color: #999999;
-			        font-size: 22rpx;
-			    }
-			}
-			.list-icon {
-			    height: 100%;
-			    border-radius: 50%;
-			    overflow: hidden;
-				.image{
-					width: 80rpx;
-					height: 100%;
-				}
-			}
-		}	
-	}
-}
-</style>

components/uni-transition/createAnimation.js

@@ -1,128 +0,0 @@
-// const defaultOption = {
-// 	duration: 300,
-// 	timingFunction: 'linear',
-// 	delay: 0,
-// 	transformOrigin: '50% 50% 0'
-// }
-// #ifdef APP-NVUE
-const nvueAnimation = uni.requireNativePlugin('animation')
-// #endif
-class MPAnimation {
-	constructor(options, _this) {
-		this.options = options
-		this.animation = uni.createAnimation(options)
-		this.currentStepAnimates = {}
-		this.next = 0
-		this.$ = _this
-
-	}
-
-	_nvuePushAnimates(type, args) {
-		let aniObj = this.currentStepAnimates[this.next]
-		let styles = {}
-		if (!aniObj) {
-			styles = {
-				styles: {},
-				config: {}
-			}
-		} else {
-			styles = aniObj
-		}
-		if (animateTypes1.includes(type)) {
-			if (!styles.styles.transform) {
-				styles.styles.transform = ''
-			}
-			let unit = ''
-			if(type === 'rotate'){
-				unit = 'deg'
-			}
-			styles.styles.transform += `${type}(${args+unit}) `
-		} else {
-			styles.styles[type] = `${args}`
-		}
-		this.currentStepAnimates[this.next] = styles
-	}
-	_animateRun(styles = {}, config = {}) {
-		let ref = this.$.$refs['ani'].ref
-		if (!ref) return
-		return new Promise((resolve, reject) => {
-			nvueAnimation.transition(ref, {
-				styles,
-				...config
-			}, res => {
-				resolve()
-			})
-		})
-	}
-
-	_nvueNextAnimate(animates, step = 0, fn) {
-		let obj = animates[step]
-		if (obj) {
-			let {
-				styles,
-				config
-			} = obj
-			this._animateRun(styles, config).then(() => {
-				step += 1
-				this._nvueNextAnimate(animates, step, fn)
-			})
-		} else {
-			this.currentStepAnimates = {}
-			typeof fn === 'function' && fn()
-			this.isEnd = true
-		}
-	}
-
-	step(config = {}) {
-		// #ifndef APP-NVUE
-		this.animation.step(config)
-		// #endif
-		// #ifdef APP-NVUE
-		this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config)
-		this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin
-		this.next++
-		// #endif
-		return this
-	}
-
-	run(fn) {
-		// #ifndef APP-NVUE
-		this.$.animationData = this.animation.export()
-		this.$.timer = setTimeout(() => {
-			typeof fn === 'function' && fn()
-		}, this.$.durationTime)
-		// #endif
-		// #ifdef APP-NVUE
-		this.isEnd = false
-		let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref
-		if(!ref) return
-		this._nvueNextAnimate(this.currentStepAnimates, 0, fn)
-		this.next = 0
-		// #endif
-	}
-}
-
-
-const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d',
-	'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY',
-	'translateZ'
-]
-const animateTypes2 = ['opacity', 'backgroundColor']
-const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom']
-animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => {
-	MPAnimation.prototype[type] = function(...args) {
-		// #ifndef APP-NVUE
-		this.animation[type](...args)
-		// #endif
-		// #ifdef APP-NVUE
-		this._nvuePushAnimates(type, args)
-		// #endif
-		return this
-	}
-})
-
-export function createAnimation(option, _this) {
-	if(!_this) return
-	clearTimeout(_this.timer)
-	return new MPAnimation(option, _this)
-}

components/uni-transition/uni-transition.vue

@@ -1,277 +0,0 @@
-<template>
-	<view v-if="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
-</template>
-
-<script>
-import { createAnimation } from './createAnimation'
-
-/**
- * Transition 过渡动画
- * @description 简单过渡动画组件
- * @tutorial https://ext.dcloud.net.cn/plugin?id=985
- * @property {Boolean} show = [false|true] 控制组件显示或隐藏
- * @property {Array|String} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
- *  @value fade 渐隐渐出过渡
- *  @value slide-top 由上至下过渡
- *  @value slide-right 由右至左过渡
- *  @value slide-bottom 由下至上过渡
- *  @value slide-left 由左至右过渡
- *  @value zoom-in 由小到大过渡
- *  @value zoom-out 由大到小过渡
- * @property {Number} duration 过渡动画持续时间
- * @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
- */
-export default {
-	name: 'uniTransition',
-	emits:['click','change'],
-	props: {
-		show: {
-			type: Boolean,
-			default: false
-		},
-		modeClass: {
-			type: [Array, String],
-			default() {
-				return 'fade'
-			}
-		},
-		duration: {
-			type: Number,
-			default: 300
-		},
-		styles: {
-			type: Object,
-			default() {
-				return {}
-			}
-		},
-		customClass:{
-			type: String,
-			default: ''
-		}
-	},
-	data() {
-		return {
-			isShow: false,
-			transform: '',
-			opacity: 1,
-			animationData: {},
-			durationTime: 300,
-			config: {}
-		}
-	},
-	watch: {
-		show: {
-			handler(newVal) {
-				if (newVal) {
-					this.open()
-				} else {
-					// 避免上来就执行 close,导致动画错乱
-					if (this.isShow) {
-						this.close()
-					}
-				}
-			},
-			immediate: true
-		}
-	},
-	computed: {
-		// 生成样式数据
-		stylesObject() {
-			let styles = {
-				...this.styles,
-				'transition-duration': this.duration / 1000 + 's'
-			}
-			let transform = ''
-			for (let i in styles) {
-				let line = this.toLine(i)
-				transform += line + ':' + styles[i] + ';'
-			}
-			return transform
-		},
-		// 初始化动画条件
-		transformStyles() {
-			return 'transform:' + this.transform + ';' + 'opacity:' + this.opacity + ';' + this.stylesObject
-		}
-	},
-	created() {
-		// 动画默认配置
-		this.config = {
-			duration: this.duration,
-			timingFunction: 'ease',
-			transformOrigin: '50% 50%',
-			delay: 0
-		}
-		this.durationTime = this.duration
-	},
-	methods: {
-		/**
-		 *  ref 触发 初始化动画
-		 */
-		init(obj = {}) {
-			if (obj.duration) {
-				this.durationTime = obj.duration
-			}
-			this.animation = createAnimation(Object.assign(this.config, obj),this)
-		},
-		/**
-		 * 点击组件触发回调
-		 */
-		onClick() {
-			this.$emit('click', {
-				detail: this.isShow
-			})
-		},
-		/**
-		 * ref 触发 动画分组
-		 * @param {Object} obj
-		 */
-		step(obj, config = {}) {
-			if (!this.animation) return
-			for (let i in obj) {
-				try {
-					if(typeof obj[i] === 'object'){
-						this.animation[i](...obj[i])
-					}else{
-						this.animation[i](obj[i])
-					}
-				} catch (e) {
-					console.error(`方法 ${i} 不存在`)
-				}
-			}
-			this.animation.step(config)
-			return this
-		},
-		/**
-		 *  ref 触发 执行动画
-		 */
-		run(fn) {
-			if (!this.animation) return
-			this.animation.run(fn)
-		},
-		// 开始过度动画
-		open() {
-			clearTimeout(this.timer)
-			this.transform = ''
-			this.isShow = true
-			let { opacity, transform } = this.styleInit(false)
-			if (typeof opacity !== 'undefined') {
-				this.opacity = opacity
-			}
-			this.transform = transform
-			// 确保动态样式已经生效后，执行动画，如果不加 nextTick ，会导致 wx 动画执行异常
-			this.$nextTick(() => {
-				// TODO 定时器保证动画完全执行，目前有些问题，后面会取消定时器
-				this.timer = setTimeout(() => {
-					this.animation = createAnimation(this.config, this)
-					this.tranfromInit(false).step()
-					this.animation.run()
-					this.$emit('change', {
-						detail: this.isShow
-					})
-				}, 20)
-			})
-		},
-		// 关闭过度动画
-		close(type) {
-			if (!this.animation) return
-			this.tranfromInit(true)
-				.step()
-				.run(() => {
-					this.isShow = false
-					this.animationData = null
-					this.animation = null
-					let { opacity, transform } = this.styleInit(false)
-					this.opacity = opacity || 1
-					this.transform = transform
-					this.$emit('change', {
-						detail: this.isShow
-					})
-				})
-		},
-		// 处理动画开始前的默认样式
-		styleInit(type) {
-			let styles = {
-				transform: ''
-			}
-			let buildStyle = (type, mode) => {
-				if (mode === 'fade') {
-					styles.opacity = this.animationType(type)[mode]
-				} else {
-					styles.transform += this.animationType(type)[mode] + ' '
-				}
-			}
-			if (typeof this.modeClass === 'string') {
-				buildStyle(type, this.modeClass)
-			} else {
-				this.modeClass.forEach(mode => {
-					buildStyle(type, mode)
-				})
-			}
-			return styles
-		},
-		// 处理内置组合动画
-		tranfromInit(type) {
-			let buildTranfrom = (type, mode) => {
-				let aniNum = null
-				if (mode === 'fade') {
-					aniNum = type ? 0 : 1
-				} else {
-					aniNum = type ? '-100%' : '0'
-					if (mode === 'zoom-in') {
-						aniNum = type ? 0.8 : 1
-					}
-					if (mode === 'zoom-out') {
-						aniNum = type ? 1.2 : 1
-					}
-					if (mode === 'slide-right') {
-						aniNum = type ? '100%' : '0'
-					}
-					if (mode === 'slide-bottom') {
-						aniNum = type ? '100%' : '0'
-					}
-				}
-				this.animation[this.animationMode()[mode]](aniNum)
-			}
-			if (typeof this.modeClass === 'string') {
-				buildTranfrom(type, this.modeClass)
-			} else {
-				this.modeClass.forEach(mode => {
-					buildTranfrom(type, mode)
-				})
-			}
-
-			return this.animation
-		},
-		animationType(type) {
-			return {
-				fade: type ? 1 : 0,
-				'slide-top': `translateY(${type ? '0' : '-100%'})`,
-				'slide-right': `translateX(${type ? '0' : '100%'})`,
-				'slide-bottom': `translateY(${type ? '0' : '100%'})`,
-				'slide-left': `translateX(${type ? '0' : '-100%'})`,
-				'zoom-in': `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
-				'zoom-out': `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
-			}
-		},
-		// 内置动画类型与实际动画对应字典
-		animationMode() {
-			return {
-				fade: 'opacity',
-				'slide-top': 'translateY',
-				'slide-right': 'translateX',
-				'slide-bottom': 'translateY',
-				'slide-left': 'translateX',
-				'zoom-in': 'scale',
-				'zoom-out': 'scale'
-			}
-		},
-		// 驼峰转中横线
-		toLine(name) {
-			return name.replace(/([A-Z])/g, '-$1').toLowerCase()
-		}
-	}
-}
-</script>
-
-<style></style>

components/cm-module/homeIndex/pageFloor.vue → pages/goods/components/pageFloor.vue

@@ -44,14 +44,14 @@
 </template>
 
 <script>
-import templateA from '@/components/cm-module/pageTemplate/templateA.vue'
-import templateB from '@/components/cm-module/pageTemplate/templateB.vue'
-import templateC from '@/components/cm-module/pageTemplate/templateC.vue'
-import templateD from '@/components/cm-module/pageTemplate/templateD.vue'
-import templateE from '@/components/cm-module/pageTemplate/templateE.vue'
-import templateF from '@/components/cm-module/pageTemplate/templateF.vue'
-import templateG from '@/components/cm-module/pageTemplate/templateG.vue'
-import templateH from '@/components/cm-module/pageTemplate/templateH.vue'
+import templateA from './template-page/templateA.vue'
+import templateB from './template-page/templateB.vue'
+import templateC from './template-page/templateC.vue'
+import templateD from './template-page/templateD.vue'
+import templateE from './template-page/templateE.vue'
+import templateF from './template-page/templateF.vue'
+import templateG from './template-page/templateG.vue'
+import templateH from './template-page/templateH.vue'
 export default {
 	name: 'pageFloor',
 	components: {

pages/goods/good-floor-temp.vue

@@ -39,7 +39,7 @@
 import { mapState, mapMutations } from 'vuex'
 import customFloor from '@/components/cm-custom/custom-floor' //自定义导航
 import templateNav from '@/components/cm-module/pageTemplate/templateNav.vue'
-import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
+import pageFloor from './components/pageFloor.vue'
 import authorize from '@/common/config/authorize.js'
 import wxLogin from '@/common/config/wxLogin.js'
 

pages/goods/good-floor.vue

@@ -27,7 +27,7 @@
 import { mapState, mapMutations } from 'vuex'
 import customFloor from '@/components/cm-custom/custom-floor' //自定义导航
 import templateNav from '@/components/cm-module/pageTemplate/templateNav.vue'
-import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
+import pageFloor from './components/pageFloor.vue'
 import authorize from '@/common/config/authorize.js'
 import wxLogin from '@/common/config/wxLogin.js'
 

pages/goods/good-floorMore.vue

@@ -39,12 +39,12 @@
 
 <script>
 import { mapState, mapMutations } from 'vuex'
-import templateA from '@/components/cm-module/pageFloorTemplate/templateA.vue'
-import templateB from '@/components/cm-module/pageFloorTemplate/templateB.vue'
-import templateC from '@/components/cm-module/pageFloorTemplate/templateC.vue'
-import templateD from '@/components/cm-module/pageFloorTemplate/templateD.vue'
-import templateE from '@/components/cm-module/pageFloorTemplate/templateE.vue'
-import templateF from '@/components/cm-module/pageFloorTemplate/templateF.vue'
+import templateA from './components/template-floor/templateA.vue'
+import templateB from './components/template-floor/templateB.vue'
+import templateC from './components/template-floor/templateC.vue'
+import templateD from './components/template-floor/templateD.vue'
+import templateE from './components/template-floor/templateE.vue'
+import templateF from './components/template-floor/templateF.vue'
 export default {
 	components: {
 		templateA,

pages/goods/goods-classify.vue

@@ -352,7 +352,7 @@
 			</view>
 		</tui-drawer>
 		<!-- 透明模态层 -->
-		<modal-layer v-if="isModallayer"></modal-layer>
+		<modal-layer v-if="isModallayer" />
 	</view>
 </template>
 

pages/h5/activity/activity-floorMore.vue

@@ -82,15 +82,15 @@
 <script>
 	import { mapState,mapMutations} from 'vuex'
 	//引入产品模板
-	import productA from '@/components/cm-module/pageFloorTemplate/templateA.vue'
-	import productB from '@/components/cm-module/pageFloorTemplate/templateB.vue'
-	import productC from '@/components/cm-module/pageFloorTemplate/templateC.vue'
-	import productD from '@/components/cm-module/pageFloorTemplate/templateD.vue'
-	import productE from '@/components/cm-module/pageFloorTemplate/templateE.vue'
-	import productG from '@/components/cm-module/pageFloorTemplate/templateG.vue'
-	import productI from '@/components/cm-module/pageFloorTemplate/templateI.vue'
-	import productJ from '@/components/cm-module/pageFloorTemplate/templateJ.vue'
-	import productK from '@/components/cm-module/pageFloorTemplate/templateK.vue'
+	import productA from './components/template-floor/templateA.vue'
+	import productB from './components/template-floor/templateB.vue'
+	import productC from './components/template-floor/templateC.vue'
+	import productD from './components/template-floor/templateD.vue'
+	import productE from './components/template-floor/templateE.vue'
+	import productG from './components/template-floor/templateG.vue'
+	import productI from './components/template-floor/templateI.vue'
+	import productJ from './components/template-floor/templateJ.vue'
+	import productK from './components/template-floor/templateK.vue'
 	//引入图片模板
 	import pictureD from './components/template-picture/templateD.vue'
 	import pictureF from './components/template-picture/templateF.vue'

pages/h5/activity/components/active-floor.vue

@@ -109,17 +109,17 @@
 
 <script>
 //引入产品模板
-import productA from '@/components/cm-module/pageTemplate/templateA.vue'
-import productB from '@/components/cm-module/pageTemplate/templateB.vue'
-import productC from '@/components/cm-module/pageTemplate/templateC.vue'
-import productD from '@/components/cm-module/pageTemplate/templateD.vue'
-import productE from '@/components/cm-module/pageTemplate/templateE.vue'
-import productF from '@/components/cm-module/pageTemplate/templateF.vue'
-import productG from '@/components/cm-module/pageTemplate/templateG.vue'
-import productH from '@/components/cm-module/pageTemplate/templateH.vue'
-import productI from '@/components/cm-module/pageTemplate/templateI.vue'
-import productJ from '@/components/cm-module/pageTemplate/templateJ.vue'
-import productK from '@/components/cm-module/pageTemplate/templateK.vue'
+import productA from './template-page/templateA.vue'
+import productB from './template-page/templateB.vue'
+import productC from './template-page/templateC.vue'
+import productD from './template-page/templateD.vue'
+import productE from './template-page/templateE.vue'
+import productF from './template-page/templateF.vue'
+import productG from './template-page/templateG.vue'
+import productH from './template-page/templateH.vue'
+import productI from './template-page/templateI.vue'
+import productJ from './template-page/templateJ.vue'
+import productK from './template-page/templateK.vue'
 //引入图片模板
 import pictureA from './template-picture/templateA.vue'
 import pictureB from './template-picture/templateB.vue'

pages/h5/activity/components/template-floor/templateA.vue

@@ -0,0 +1,298 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateA',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateB.vue

@@ -0,0 +1,314 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateB',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateC.vue

@@ -0,0 +1,347 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateC',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateD.vue

@@ -0,0 +1,341 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_03">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage3"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType3,
+						floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+						floorData.floorContent.adsLink3,
+						floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateE.vue

@@ -0,0 +1,311 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateE',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateF.vue

@@ -0,0 +1,278 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateG',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-30;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateG.vue

@@ -0,0 +1,274 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateG',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api.getStorage().then(resolve => {
+				this.shopId = resolve.shopId ? resolve.shopId : 0
+			})
+			this.floorData = data
+			// console.log(this.floorData)
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-30;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateI.vue

@@ -0,0 +1,342 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_03">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage3"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType3,
+						floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+						floorData.floorContent.adsLink3,
+						floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api.getStorage().then(resolve => {
+				this.shopId = resolve.shopId ? resolve.shopId : 0
+			})
+			this.floorData = data
+			// console.log(this.floorData)
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+
+		&.ad_02,
+		&.ad_03 {
+			width: 339rpx;
+			height: 260rpx;
+			.item-img-gg {
+				width: 339rpx;
+				height: 260rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateJ.vue

@@ -0,0 +1,357 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item-ad clearfix">
+			<view class="floor-item-left">
+				<image
+					class="item-img-gg"
+					:src="floorData.floorContent.appletsAdsImage1"
+					@click="
+						BannerNavigateTo(
+							floorData.floorContent.linkType1,
+							floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+							floorData.floorContent.adsLink1,
+							floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+						)
+					"
+					mode="aspectFill"
+				>
+				</image>
+			</view>
+			<view class="floor_item_right">
+				<image
+					class="item-img-gg"
+					:src="floorData.floorContent.appletsAdsImage2"
+					@click="
+						BannerNavigateTo(
+							floorData.floorContent.linkType2,
+							floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+							floorData.floorContent.adsLink2,
+							floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+						)
+					"
+					mode="aspectFill"
+				>
+				</image>
+				<image
+					class="item-img-gg"
+					:src="floorData.floorContent.appletsAdsImage3"
+					@click="
+						BannerNavigateTo(
+							floorData.floorContent.linkType3,
+							floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+							floorData.floorContent.adsLink3,
+							floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+						)
+					"
+					mode="aspectFill"
+				>
+				</image>
+			</view>
+		</view>
+
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<template>
+					<template-Tags :product="item.product"></template-Tags>
+				</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api.getStorage().then(resolve => {
+				this.shopId = resolve.shopId ? resolve.shopId : 0
+			})
+			this.floorData = data
+			// console.log(this.floorData)
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+
+	.floor-item-ad {
+		width: 100%;
+		margin-bottom: 24rpx;
+		.floor-item-left,
+		.floor_item_right {
+			width: 339rpx;
+			height: 516rpx;
+		}
+		.floor-item-left {
+			margin-right: 20rpx;
+			float: left;
+			.item-img-gg {
+				width: 339rpx;
+				height: 516rpx;
+				border-radius: 16rpx;
+			}
+		}
+		.floor_item_right {
+			float: left;
+			.item-img-gg {
+				width: 100%;
+				height: 246rpx;
+				display: block;
+				border-radius: 16rpx;
+				&:nth-child(1) {
+					margin-bottom: 24rpx;
+				}
+			}
+		}
+	}
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-floor/templateK.vue

@@ -0,0 +1,403 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item-ad clearfix">
+			<view class="floor-item-left">
+				<image
+					class="item-img-gg"
+					:src="floorData.floorContent.appletsAdsImage1"
+					@click="
+						BannerNavigateTo(
+							floorData.floorContent.linkType1,
+							floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+							floorData.floorContent.adsLink1,
+							floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+						)
+					"
+					mode="aspectFill"
+				>
+				</image>
+			</view>
+			<view class="floor_item_right">
+				<image
+					class="item-img-gg"
+					:src="floorData.floorContent.appletsAdsImage2"
+					@click="
+						BannerNavigateTo(
+							floorData.floorContent.linkType2,
+							floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+							floorData.floorContent.adsLink2,
+							floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+						)
+					"
+					mode="aspectFill"
+				>
+				</image>
+				<image
+					class="item-img-gg"
+					:src="floorData.floorContent.appletsAdsImage3"
+					@click="
+						BannerNavigateTo(
+							floorData.floorContent.linkType3,
+							floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+							floorData.floorContent.adsLink3,
+							floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+						)
+					"
+					mode="aspectFill"
+				>
+				</image>
+			</view>
+		</view>
+
+		<view class="floor-item-ad ad-row2 clearfix">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage3"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType3,
+						floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+						floorData.floorContent.adsLink3,
+						floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api.getStorage().then(resolve => {
+				this.shopId = resolve.shopId ? resolve.shopId : 0
+			})
+			this.floorData = data
+			// console.log(this.floorData)
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+
+	.floor-item-ad {
+		width: 100%;
+		margin-bottom: 20rpx;
+		.floor-item-left,
+		.floor_item_right {
+			width: 339rpx;
+			height: 516rpx;
+		}
+		.floor-item-left {
+			margin-right: 20rpx;
+			float: left;
+			.item-img-gg {
+				width: 339rpx;
+				height: 516rpx;
+				border-radius: 16rpx;
+			}
+		}
+		.floor_item_right {
+			float: left;
+			.item-img-gg {
+				width: 100%;
+				height: 246rpx;
+				display: block;
+				border-radius: 16rpx;
+				&:nth-child(1) {
+					margin-bottom: 24rpx;
+				}
+			}
+		}
+		&.ad-row2 {
+			width: 100%;
+			margin: 24rpx 0;
+			.item-img-gg {
+				width: 339rpx;
+				height: 246rpx;
+				float: left;
+				display: block;
+				border-radius: 16rpx;
+				&:nth-child(1) {
+					margin-right: 20rpx;
+				}
+			}
+		}
+	}
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+
+		&:nth-child(even) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateA.vue

@@ -0,0 +1,297 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 3"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+export default {
+	name: 'templateA',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateB.vue

@@ -0,0 +1,314 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 2"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+export default {
+	name: 'templateB',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateC.vue

@@ -0,0 +1,348 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 3"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateC',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateD.vue

@@ -0,0 +1,342 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_03">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage3"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType3,
+						floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+						floorData.floorContent.adsLink3,
+						floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 2"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateE.vue

@@ -0,0 +1,313 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+
+export default {
+	name: 'templateE',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		line-height: 36rpx;
+        background: #ffffff;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateF.vue

@@ -0,0 +1,330 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateF',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateG.vue

@@ -0,0 +1,280 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateG',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-30;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/h5/activity/components/template-page/templateH.vue

@@ -0,0 +1,361 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="recommend-list" :style="hasLessProduct ? 'height:269px' : ''">
+			<swiper
+				class="tui-banner-swiper"
+				:autoplay="true"
+				:interval="5000"
+				:duration="500"
+				:circular="true"
+				@change="swiperChange"
+				:style="hasLessProduct ? 'height:269px' : ''"
+			>
+				<swiper-item v-for="(product, index) in productList" :key="index">
+					<view
+						class="floor-item ad_04 clearfix"
+						v-for="(item, idx) in product"
+						:key="idx"
+						@click.stop="navToDetailPage(item)"
+					>
+						<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+						<template-Type :product="item.product"></template-Type>
+						<view class="floor-item_tag" v-if="item.listType == 2">
+							<text>{{ item.label }}</text>
+						</view>
+						<view class="floor-item-content">
+							<view class="title tui-skeleton-rect">
+								<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+								<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+									>{{ item.name }}
+								</text>
+							</view>
+							<view class="floor-item-price" v-if="item.listType == 1">
+								<template>
+									<template-Tags :product="item.product"></template-Tags>
+								</template>
+								<view v-if="hasLogin">
+									<template v-if="item.product.productCategory == 1">
+										<template-Price  :product="item.product"></template-Price>
+									</template>
+									<template v-else>
+										<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+											<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+										</view>
+										<view class="price tui-skeleton-rect" v-else>
+											<text class="p sm">￥</text>
+											<text class="p big">{{ item.product.price | NumFormat }}</text>
+										</view>
+									</template>
+								</view>
+								<view v-else class="no-price">
+									<template v-if="item.product.productCategory == 1">
+										<view class="p-stars">
+											<text class="p-no">￥</text>
+											<uni-grader
+												:grade="Number(item.product.priceGrade)"
+												:margin="14"
+											></uni-grader>
+										</view>
+									</template>
+									<template v-else>
+										<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+									</template>
+								</view>
+							</view>
+						</view>
+					</view>
+				</swiper-item>
+			</swiper>
+			<view class="swiper__recommenddots-box" v-if="productList.length > 1">
+				<view
+					v-for="(item, idx) in productList"
+					:key="idx"
+					:class="[idx === swiperCurrent ? 'swiper__dots-long' : 'none']"
+					:data-index="swiperCurrent"
+					class="swiper__dots-item"
+				>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateH',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			productList: [],
+			current: 100,
+			swiperCurrent: 0,
+			pageSize: 4,
+			productCount: 0
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity']),
+		hasLessProduct() {
+			return this.productCount <= 2
+		}
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+			this.productCount = data.floorImageList.length
+			if (this.productCount > 0) {
+				this.productList.splice(0, this.productList.length)
+				for (var i = 0, j = data.floorImageList.length; i < j; i += this.pageSize) {
+					this.productList.push(data.floorImageList.slice(i, i + this.pageSize))
+				}
+			}
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		tabClick(index) {
+			//轮播图切换
+			this.current = index
+		},
+		swiperChange(e) {
+			//轮播切换
+			const index = e.detail.current
+			this.swiperCurrent = index
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.recommend-list {
+		width: 100%;
+		height: 1100rpx;
+		position: relative;
+		padding-bottom: 20rpx;
+		.tui-banner-swiper {
+			width: 100%;
+			margin: 0 auto;
+			height: 1100rpx;
+			overflow: hidden;
+			transform: translateY(0);
+			.floor-item {
+				width: 339rpx;
+				height: 516rpx;
+				margin-right: 20rpx;
+				font-size: $font-size-24;
+				color: $text-color;
+				background: #ffffff;
+				line-height: 36rpx;
+				border-radius: 16rpx;
+				margin-bottom: 20rpx;
+				float: left;
+				box-sizing: border-box;
+				position: relative;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				.item-img {
+					width: 339rpx;
+					height: 339rpx;
+					border-radius: 16rpx 16rpx 0 0;
+					display: block;
+					margin-bottom: 8rpx;
+				}
+				.floor-item_tag {
+					width: 100%;
+					height: 32rpx;
+					float: left;
+					margin: 20rpx 0;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+					text {
+						display: inline-block;
+						padding: 0 8rpx;
+						border: 1px solid #e3ebf7;
+						border-radius: 8rpx;
+						color: #9aa5b5;
+						font-size: $font-size-22;
+						line-height: 32rpx;
+						text-align: center;
+						float: left;
+					}
+				}
+				.floor-item-content {
+					width: 100%;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+				.floor-item-act {
+					display: block;
+					width: 100%;
+					height: 32rpx;
+					text-align: center;
+					box-sizing: border-box;
+				}
+				.title-none {
+					font-size: $font-size-26;
+					color: #ff2a2a;
+					line-height: 54rpx;
+				}
+				.title {
+					width: 100%;
+					height: 70rpx;
+					display: flex;
+					line-height: 35rpx;
+					flex-direction: column;
+					margin: 8rpx 0;
+					padding: 0;
+					position: relative;
+					.mclap {
+						width: 100%;
+						line-height: 35rpx;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						word-break: break-all;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						overflow: hidden;
+						font-size: 26rpx;
+						&.indent {
+							text-indent: 95rpx;
+						}
+					}
+					.mclap-tag {
+						display: block;
+						width: 84rpx;
+						height: 32rpx;
+						background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+						border-radius: 4rpx 48rpx 4px 4px;
+						line-height: 32rpx;
+						font-size: $font-size-22;
+						color: #ffffff;
+						text-align: center;
+						position: absolute;
+						left: 0;
+						top: 0;
+					}
+				}
+				.no-price {
+					height: 54rpx;
+					line-height: 54rpx;
+					display: flex;
+					box-sizing: border-box;
+					.p-no {
+						font-size: $font-size-28;
+						color: $text-color;
+						display: block;
+						float: left;
+					}
+					.p-stars {
+						float: left;
+					}
+				}
+				.price {
+					color: #ff2a2a;
+					line-height: 54rpx;
+					&.none {
+						text-decoration: line-through;
+						color: #999999;
+					}
+					.sm {
+						font-size: $font-size-24;
+					}
+					.big {
+						font-size: $font-size-28;
+					}
+				}
+			}
+		}
+	}
+	.swiper__recommenddots-box {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 60rpx;
+		.swiper__dots-item {
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 100%;
+			margin-left: 6px;
+			background-color: rgba(225, 86, 22, 0.3);
+		}
+		.swiper__dots-long {
+			width: 32rpx;
+			height: 8rpx;
+			border-radius: 4rpx;
+			background-color: #FF5B00;
+			transition: all 0.4s;
+		}
+	}
+}
+</style>

pages/search/search-second.vue

@@ -52,13 +52,13 @@
 			</view>
 		</view>
 		<!-- 透明模态层 -->
-		<modal-layer v-if='isModallayer'></modal-layer>
+		<modal-layer v-if='isModallayer' />
 	</view>
 </template>
 
 <script>
 	import { mapState,mapMutations } from 'vuex'
-	import modalLayer from "@/components/modal-layer"
+	import modalLayer from '@/components/modal-layer'
 	import uniGrader from '@/components/uni-grade/uni-grade.vue'
 	import authorize from '@/common/config/authorize.js'
 	
@@ -101,7 +101,7 @@
 		},
 		created() {
 			this.$api.getStorage().then((resolve) => {
-				this.userId = resolve.userId ? resolve.userId : '';
+				this.userId = resolve.userId ? resolve.userId : ''
 				this.getListFromServer()
 			})
 		},
@@ -111,7 +111,7 @@
 		methods:{
 			subMitSearch() {//搜索
 				if (this.name == '') {
-					this.$util.msg('请输入商品关键字',2000);
+					this.$util.msg('请输入商品关键字',2000)
 				}else{
 					this.getListFromServer()
 					// 友盟埋点二手商品搜索点击
@@ -125,12 +125,12 @@
 				}
 			},
 			getListFromServer(loadMore) {
-				this.showLoading = true;
-				this.loadingNow = true;
-				this.loadingText = '加载中';
-				this.showEmpty = false;				
+				this.showLoading = true
+				this.loadingNow = true
+				this.loadingText = '加载中'
+				this.showEmpty = false				
 				if(loadMore) {
-					this.pageNum += 1;
+					this.pageNum += 1
 				}
 				let params = {
 						userId:this.userId,
@@ -142,44 +142,44 @@
 				}
 				this.SecondService.SeconHandProductList(params).then(response =>{
 					this.isShowWrapper = true
-					const resData = response.data;
-					const resList = resData.results;
+					const resData = response.data
+					const resList = resData.results
 					if(resList && resList.length > 0){
-						this.total = resData.totalRecord;
-						this.hasNextPage = resData.hasNextPage;
-						this.showEmpty = false;
+						this.total = resData.totalRecord
+						this.hasNextPage = resData.hasNextPage
+						this.showEmpty = false
 						if(loadMore) {
-							this.listData = [...this.listData,...resList];
+							this.listData = [...this.listData,...resList]
 						} else {
-							this.listData = [...resList];
+							this.listData = [...resList]
 						}
 						// 防上拉暴滑
-						this.pullFlag = false;
-						setTimeout(()=>{ this.pullFlag = true; },500)
+						this.pullFlag = false
+						setTimeout(()=>{ this.pullFlag = true },500)
 						// 底部提示文案
 						if(this.hasNextPage) {
-							this.loadingText = '上拉加载更多';
+							this.loadingText = '上拉加载更多'
 						} else {
-							this.showLoading = true;
-							this.loadingNow = false;
+							this.showLoading = true
+							this.loadingNow = false
 						}
 					} else {
 						if(!loadMore) {
-							this.showEmpty = true;
+							this.showEmpty = true
 						}
 					}
 				}).catch(error =>{
-					this.$util.msg(error.msg,2000);
+					this.$util.msg(error.msg,2000)
 				})
 			},
 			scrolltolower() {
 				if(this.hasNextPage && this.pullFlag) {
-					this.getListFromServer(true);
+					this.getListFromServer(true)
 				}
 			},
 			onShowClose () {//输入框失去焦点时触发
 				if(this.name != ''){
-					this.isShowClose = true;
+					this.isShowClose = true
 				}else{					
 					this.isShowClose = false
 				}
@@ -202,19 +202,19 @@
 				this.getListFromServer()
 			},
 			keywordsClick (item) {//关键词搜索与历史搜索
-				this.name = item;
-				this.isShowClose = true;
-				this.subMitSearch();
+				this.name = item
+				this.isShowClose = true
+				this.subMitSearch()
 			},
 			navToDetailPage(id) {
-				this.isModallayer = true;
-				this.$api.navigateTo(`/pages/second/product/product-details?id=${id}`);
-				this.isModallayer = false;
+				this.isModallayer = true
+				this.$api.navigateTo(`/pages/second/product/product-details?id=${id}`)
+				this.isModallayer = false
 			},
 			setScrollHeight() {
-				const {windowHeight, pixelRatio} = wx.getSystemInfoSync();
-				this.windowHeight = windowHeight - 1;
-				this.scrollHeight = windowHeight - 1;
+				const {windowHeight, pixelRatio} = wx.getSystemInfoSync()
+				this.windowHeight = windowHeight - 1
+				this.scrollHeight = windowHeight - 1
 			},
 			toLoginPage() {
 				let searchLoginType = 'search'
@@ -223,11 +223,11 @@
 				})
 			},
 			topBubble() {//显隐搜索项
-				this.show = !this.show;
+				this.show = !this.show
 			},
 		},
 		onShow() {
-			this.setScrollHeight();
+			this.setScrollHeight()
 		}
 	}
 </script>

pages/second/product/product-list.vue

@@ -98,7 +98,7 @@
 					 <text  class="release" @click.stop="NavigatorRelease" >我要发布</text>
 				</view>
 				<!-- 透明模态层 -->
-				<modal-layer v-if='isModallayer'></modal-layer>
+				<modal-layer v-if='isModallayer' />
 		</view>
 	</view>
 </template>

pages/seller/cart/components/buyagainList.vue

@@ -98,7 +98,7 @@
 		>
 		</cm-drag>
 		<!-- 透明模态层 -->
-		<modal-layer v-if="isModallayer"></modal-layer>
+		<modal-layer v-if="isModallayer" />
 	</view>
 </template>
 

pages/seller/cart/components/secondHand.vue

@@ -89,16 +89,16 @@
 				 @btnTouchend="btnTouchend">
 		</cm-drag>	 -->	
 		<!-- 透明模态层 -->
-		<modal-layer v-if='isModallayer'></modal-layer>
+		<modal-layer v-if='isModallayer' />
 	</view>
 </template>
 
 <script>
 	import listSkeleton from '@/components/cm-module/listTemplate/listSkeleton'
-	import modalLayer from "@/components/modal-layer"
+	import modalLayer from '@/components/modal-layer'
 	import uniStars from '@/components/uni-stars/uni-stars.vue'
 	import cmDrag from '@/components/cm-custom/cm-drag.vue'
-	import { mapState,mapMutations } from 'vuex';
+	import { mapState,mapMutations } from 'vuex'
 	export default{
 		name:'productList',
 		components:{
@@ -150,7 +150,7 @@
 			}
 		},
 		created() {
-			this.setScrollHeight();		
+			this.setScrollHeight()		
 			this.$api.getComStorage('userInfo').then((resolve) =>{
 				if(resolve.userIdentity == 1){
 					this.identity = 1
@@ -170,20 +170,20 @@
 		methods:{
 			scrolltolower() {
 				if(this.hasNextPage && this.pullFlag) {
-					this.getProductAgainInfo(true);
+					this.getProductAgainInfo(true)
 				}
 			},
 			setScrollHeight() {
-				const {windowHeight, pixelRatio} = wx.getSystemInfoSync();
-				this.windowHeight = windowHeight - 1;
-				this.scrollHeight = windowHeight - 1;
+				const {windowHeight, pixelRatio} = wx.getSystemInfoSync()
+				this.windowHeight = windowHeight - 1
+				this.scrollHeight = windowHeight - 1
 			},
 			getProductAgainInfo(loadMore) {//搜索商品
-				this.showLoading = true;
-				this.loadingNow = true;
-				this.loadingText = '加载中';
-				this.isShowEmpty = false;				
-				if(loadMore) {this.pageNum += 1;}
+				this.showLoading = true
+				this.loadingNow = true
+				this.loadingText = '加载中'
+				this.isShowEmpty = false				
+				if(loadMore) {this.pageNum += 1}
 				let params = {
 						secondHandType:this.secondHandType,
 						instrumentType:this.instrumentType,
@@ -196,32 +196,32 @@
 					const resData = response.data
 					const results = resData.results
 					if(results && results.length > 0){
-						this.hasNextPage = resData.hasNextPage;
-						this.showEmpty = false;
+						this.hasNextPage = resData.hasNextPage
+						this.showEmpty = false
 						if(loadMore) {
-							this.listData = [...this.listData,...results];
+							this.listData = [...this.listData,...results]
 						} else {
-							this.listData = [...results];
-							this.showSkeleton = false;
+							this.listData = [...results]
+							this.showSkeleton = false
 						}
 						// 防上拉暴滑
-						this.pullFlag = false;
-						setTimeout(()=>{ this.pullFlag = true; },500)
+						this.pullFlag = false
+						setTimeout(()=>{ this.pullFlag = true },500)
 						// 底部提示文案
 						if(this.hasNextPage) {
-							this.loadingText = '上拉加载更多';
+							this.loadingText = '上拉加载更多'
 						} else {
-							this.showLoading = true;
-							this.loadingNow = false;
+							this.showLoading = true
+							this.loadingNow = false
 						}
 					} else {
 						if(!loadMore) {
-							this.isShowEmpty = true;
+							this.isShowEmpty = true
 							this.isShowEmptyText ='暂无相关商品'
 						}
 					}
 				}).catch(error =>{
-					this.$util.msg(error.msg,2000);
+					this.$util.msg(error.msg,2000)
 				})
 			},
 			searchOpertor(){//搜索商品
@@ -229,21 +229,21 @@
 					// this.$util.msg('请输入商品关键词',2000)
 					this.secondHandType = 1
 					this.instrumentType=''
-					this.getProductAgainInfo();
+					this.getProductAgainInfo()
 				}else{
 					this.pageNum = 1
-					this.showSkeleton = true;
-					this.getProductAgainInfo();
+					this.showSkeleton = true
+					this.getProductAgainInfo()
 					this.isFocus = false
 				}
 			},
 			operationHanld(prop){
-				this.$emit('operationConfim',prop);
+				this.$emit('operationConfim',prop)
 			},
 			navToDetailPage(id) {
-				this.isModallayer = true;
-				this.$api.navigateTo(`/pages/second/product/product-details?id=${id}`);
-				this.isModallayer = false;
+				this.isModallayer = true
+				this.$api.navigateTo(`/pages/second/product/product-details?id=${id}`)
+				this.isModallayer = false
 			},
 			onShowClose () {//输入框失去焦点时触发
 				if(this.searchKeyword != ''){
@@ -253,16 +253,16 @@
 				}
 			},
 			delInputText(){//清除输入框内容
-				this.searchKeyword = '';
-				this.listData =[];
+				this.searchKeyword = ''
+				this.listData =[]
 				this.isFocus = true
-				this.isShowClose = false;
-				this.loadingNow = false;
-				this.isShowEmpty = true;
+				this.isShowClose = false
+				this.loadingNow = false
+				this.isShowEmpty = true
 				this.isShowEmptyText ='暂无相关商品'
-				this.secondHandType = 1;
-				this.instrumentType='';
-				this.getProductAgainInfo();
+				this.secondHandType = 1
+				this.instrumentType=''
+				this.getProductAgainInfo()
 			},
 			isInterceptHtmlFn(text){
 				let name = this.$reg.interceptHtmlFn(text)
@@ -290,10 +290,10 @@
 				if(index==0){
 					this.instrumentType=''
 				}
-				this.getProductAgainInfo();
+				this.getProductAgainInfo()
 			},
 			toFixedFn(text){//处理小数点后两位数
-				return Number(text).toFixed(2);
+				return Number(text).toFixed(2)
 			},
 			hideTabIndexSelect(){
 				this.isTabIndexSelect = false

pages/seller/components/home.vue

@@ -27,13 +27,13 @@
 
 <script>
 	import authorize from '@/common/config/authorize.js'
-	import customer from '@/components/cm-module/homeIndex/customer.vue'
-	import banner from '@/components/cm-module/homeIndex/banner.vue'
-	import navbars from '@/components/cm-module/homeIndex/navbars.vue'
-	import hotFloor from '@/components/cm-module/homeIndex/hotFloor.vue'
-	import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
-	import pageSpecial from '@/components/cm-module/homeIndex/pageSpecial.vue'
-	import supplierList from '@/components/cm-module/homeIndex/supplierList.vue'
+	import customer from './homeIndex/customer.vue'
+	import banner from './homeIndex/banner.vue'
+	import navbars from './homeIndex/navbars.vue'
+	import hotFloor from './homeIndex/hotFloor.vue'
+	import pageFloor from './homeIndex/pageFloor.vue'
+	import pageSpecial from './homeIndex/pageSpecial.vue'
+	import supplierList from './homeIndex/supplierList.vue'
 	import { mapState,mapMutations} from 'vuex'
 	export default {
 		components:{

components/cm-module/homeIndex/hotFloor.vue → pages/seller/components/homeIndex/hotFloor.vue

@@ -20,7 +20,7 @@
 </template>
 
 <script>
-import templateL from '@/components/cm-module/pageTemplate/templateL.vue'
+import templateL from './template-page/templateL.vue'
 export default {
 	name: 'pageFloor',
 	components: {

pages/seller/components/homeIndex/pageFloor.vue

@@ -0,0 +1,150 @@
+<template>
+	<view>
+		<view class="page-content clearfix" v-for="(page, index) in list" :key="index">
+			<view class="tui-group-name" v-if="page.floorContent">
+				<view class="tui-group-title">
+					<view class="tui-group-l">{{ page.title }}</view>
+					<view
+						class="tui-group-r"
+						v-if="page.floorContent.templateType != '8'"
+						@click="NavToDetailPage(page)"
+					>
+						<text>更多</text> <text class="iconfont icon-xiayibu"></text>
+					</view>
+				</view>
+				<view class="tui-sub__desc">{{ page.detail }}</view>
+			</view>
+
+			<template v-if="page.floorContent.templateType == '1'">
+				<templateA :pageData="page" :userIdentity="userIdentity"></templateA>
+			</template>
+			<template v-if="page.floorContent.templateType == '2'">
+				<templateB :pageData="page" :userIdentity="userIdentity"></templateB>
+			</template>
+			<template v-if="page.floorContent.templateType == '3'">
+				<templateC :pageData="page" :userIdentity="userIdentity"></templateC>
+			</template>
+			<template v-if="page.floorContent.templateType == '4'">
+				<templateD :pageData="page" :userIdentity="userIdentity"></templateD>
+			</template>
+			<template v-if="page.floorContent.templateType == '5'">
+				<templateE :pageData="page" :userIdentity="userIdentity"></templateE>
+			</template>
+			<template v-if="page.floorContent.templateType == '6'">
+				<templateF :pageData="page" :userIdentity="userIdentity"></templateF>
+			</template>
+			<template v-if="page.floorContent.templateType == '7'">
+				<templateG :pageData="page" :userIdentity="userIdentity"></templateG>
+			</template>
+			<template v-if="page.floorContent.templateType == '8'">
+				<templateH :pageData="page" :userIdentity="userIdentity"></templateH>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+import templateA from './template-page/templateA.vue'
+import templateB from './template-page/templateB.vue'
+import templateC from './template-page/templateC.vue'
+import templateD from './template-page/templateD.vue'
+import templateE from './template-page/templateE.vue'
+import templateF from './template-page/templateF.vue'
+import templateG from './template-page/templateG.vue'
+import templateH from './template-page/templateH.vue'
+export default {
+	name: 'pageFloor',
+	components: {
+		templateA,
+		templateB,
+		templateC,
+		templateD,
+		templateE,
+		templateF,
+		templateG,
+		templateH
+	},
+	props: {
+		list: {
+			type: Array
+		},
+		pageType: {
+			type: Number
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			pageFloorList: []
+		}
+	},
+	created() {
+		
+	},
+	watch: {
+		list: {
+			handler: function (el) {//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.list = el
+			},
+			deep: true
+		}
+	},
+	methods: {
+		NavToDetailPage(page) {
+			//跳转
+			this.$api.navigateTo(
+				`/pages/goods/good-floorMore?pageType=${this.pageType}&floorId=${page.id}&title=${
+					page.title
+				}`
+			)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.page-content {
+	background-color: #f7f7f7;
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	float: left;
+}
+.tui-group-name {
+	width: 100%;
+	height: 92rpx;
+	padding: 20rpx 0;
+}
+.tui-group-title {
+	width: 100%;
+	float: left;
+	.tui-group-l {
+		float: left;
+		font-size: 34rpx;
+		font-weight: bold;
+		text-align: left;
+		line-height: 49rpx;
+		color: #333;
+	}
+	.tui-group-r {
+		float: right;
+		font-size: $font-size-24;
+		text-align: right;
+		line-height: 49rpx;
+		color: #999999;
+		.icon-xiayibu {
+			font-size: $font-size-30;
+			color: #999999;
+		}
+	}
+}
+.tui-sub__desc {
+	width: 100%;
+	float: left;
+	color: rgba(153, 153, 153, 0.9);
+	font-size: $font-size-26;
+}
+</style>

pages/seller/components/homeIndex/template-page/templateA.vue

@@ -0,0 +1,297 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 3"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+export default {
+	name: 'templateA',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateB.vue

@@ -0,0 +1,314 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 2"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+export default {
+	name: 'templateB',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateC.vue

@@ -0,0 +1,348 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 3"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateC',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateD.vue

@@ -0,0 +1,342 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_03">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage3"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType3,
+						floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+						floorData.floorContent.adsLink3,
+						floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 2"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateE.vue

@@ -0,0 +1,313 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+
+export default {
+	name: 'templateE',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		line-height: 36rpx;
+        background: #ffffff;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateF.vue

@@ -0,0 +1,330 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateF',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateG.vue

@@ -0,0 +1,280 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateG',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-30;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/seller/components/homeIndex/template-page/templateH.vue

@@ -0,0 +1,361 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="recommend-list" :style="hasLessProduct ? 'height:269px' : ''">
+			<swiper
+				class="tui-banner-swiper"
+				:autoplay="true"
+				:interval="5000"
+				:duration="500"
+				:circular="true"
+				@change="swiperChange"
+				:style="hasLessProduct ? 'height:269px' : ''"
+			>
+				<swiper-item v-for="(product, index) in productList" :key="index">
+					<view
+						class="floor-item ad_04 clearfix"
+						v-for="(item, idx) in product"
+						:key="idx"
+						@click.stop="navToDetailPage(item)"
+					>
+						<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+						<template-Type :product="item.product"></template-Type>
+						<view class="floor-item_tag" v-if="item.listType == 2">
+							<text>{{ item.label }}</text>
+						</view>
+						<view class="floor-item-content">
+							<view class="title tui-skeleton-rect">
+								<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+								<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+									>{{ item.name }}
+								</text>
+							</view>
+							<view class="floor-item-price" v-if="item.listType == 1">
+								<template>
+									<template-Tags :product="item.product"></template-Tags>
+								</template>
+								<view v-if="hasLogin">
+									<template v-if="item.product.productCategory == 1">
+										<template-Price  :product="item.product"></template-Price>
+									</template>
+									<template v-else>
+										<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+											<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+										</view>
+										<view class="price tui-skeleton-rect" v-else>
+											<text class="p sm">￥</text>
+											<text class="p big">{{ item.product.price | NumFormat }}</text>
+										</view>
+									</template>
+								</view>
+								<view v-else class="no-price">
+									<template v-if="item.product.productCategory == 1">
+										<view class="p-stars">
+											<text class="p-no">￥</text>
+											<uni-grader
+												:grade="Number(item.product.priceGrade)"
+												:margin="14"
+											></uni-grader>
+										</view>
+									</template>
+									<template v-else>
+										<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+									</template>
+								</view>
+							</view>
+						</view>
+					</view>
+				</swiper-item>
+			</swiper>
+			<view class="swiper__recommenddots-box" v-if="productList.length > 1">
+				<view
+					v-for="(item, idx) in productList"
+					:key="idx"
+					:class="[idx === swiperCurrent ? 'swiper__dots-long' : 'none']"
+					:data-index="swiperCurrent"
+					class="swiper__dots-item"
+				>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateH',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			productList: [],
+			current: 100,
+			swiperCurrent: 0,
+			pageSize: 4,
+			productCount: 0
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity']),
+		hasLessProduct() {
+			return this.productCount <= 2
+		}
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+			this.productCount = data.floorImageList.length
+			if (this.productCount > 0) {
+				this.productList.splice(0, this.productList.length)
+				for (var i = 0, j = data.floorImageList.length; i < j; i += this.pageSize) {
+					this.productList.push(data.floorImageList.slice(i, i + this.pageSize))
+				}
+			}
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		tabClick(index) {
+			//轮播图切换
+			this.current = index
+		},
+		swiperChange(e) {
+			//轮播切换
+			const index = e.detail.current
+			this.swiperCurrent = index
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.recommend-list {
+		width: 100%;
+		height: 1100rpx;
+		position: relative;
+		padding-bottom: 20rpx;
+		.tui-banner-swiper {
+			width: 100%;
+			margin: 0 auto;
+			height: 1100rpx;
+			overflow: hidden;
+			transform: translateY(0);
+			.floor-item {
+				width: 339rpx;
+				height: 516rpx;
+				margin-right: 20rpx;
+				font-size: $font-size-24;
+				color: $text-color;
+				background: #ffffff;
+				line-height: 36rpx;
+				border-radius: 16rpx;
+				margin-bottom: 20rpx;
+				float: left;
+				box-sizing: border-box;
+				position: relative;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				.item-img {
+					width: 339rpx;
+					height: 339rpx;
+					border-radius: 16rpx 16rpx 0 0;
+					display: block;
+					margin-bottom: 8rpx;
+				}
+				.floor-item_tag {
+					width: 100%;
+					height: 32rpx;
+					float: left;
+					margin: 20rpx 0;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+					text {
+						display: inline-block;
+						padding: 0 8rpx;
+						border: 1px solid #e3ebf7;
+						border-radius: 8rpx;
+						color: #9aa5b5;
+						font-size: $font-size-22;
+						line-height: 32rpx;
+						text-align: center;
+						float: left;
+					}
+				}
+				.floor-item-content {
+					width: 100%;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+				.floor-item-act {
+					display: block;
+					width: 100%;
+					height: 32rpx;
+					text-align: center;
+					box-sizing: border-box;
+				}
+				.title-none {
+					font-size: $font-size-26;
+					color: #ff2a2a;
+					line-height: 54rpx;
+				}
+				.title {
+					width: 100%;
+					height: 70rpx;
+					display: flex;
+					line-height: 35rpx;
+					flex-direction: column;
+					margin: 8rpx 0;
+					padding: 0;
+					position: relative;
+					.mclap {
+						width: 100%;
+						line-height: 35rpx;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						word-break: break-all;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						overflow: hidden;
+						font-size: 26rpx;
+						&.indent {
+							text-indent: 95rpx;
+						}
+					}
+					.mclap-tag {
+						display: block;
+						width: 84rpx;
+						height: 32rpx;
+						background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+						border-radius: 4rpx 48rpx 4px 4px;
+						line-height: 32rpx;
+						font-size: $font-size-22;
+						color: #ffffff;
+						text-align: center;
+						position: absolute;
+						left: 0;
+						top: 0;
+					}
+				}
+				.no-price {
+					height: 54rpx;
+					line-height: 54rpx;
+					display: flex;
+					box-sizing: border-box;
+					.p-no {
+						font-size: $font-size-28;
+						color: $text-color;
+						display: block;
+						float: left;
+					}
+					.p-stars {
+						float: left;
+					}
+				}
+				.price {
+					color: #ff2a2a;
+					line-height: 54rpx;
+					&.none {
+						text-decoration: line-through;
+						color: #999999;
+					}
+					.sm {
+						font-size: $font-size-24;
+					}
+					.big {
+						font-size: $font-size-28;
+					}
+				}
+			}
+		}
+	}
+	.swiper__recommenddots-box {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 60rpx;
+		.swiper__dots-item {
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 100%;
+			margin-left: 6px;
+			background-color: rgba(225, 86, 22, 0.3);
+		}
+		.swiper__dots-long {
+			width: 32rpx;
+			height: 8rpx;
+			border-radius: 4rpx;
+			background-color: #FF5B00;
+			transition: all 0.4s;
+		}
+	}
+}
+</style>

pages/seller/order/order-historylist.vue

@@ -268,7 +268,7 @@
 			:maskClosable="false"
 		/>
 		<!-- 透明模态层 -->
-		<modal-layer v-if="isModalLayer"></modal-layer>
+		<modal-layer v-if="isModalLayer" />
 	</view>
 </template>
 

pages/seller/order/order-list.vue

@@ -276,7 +276,7 @@
 			@shareConfirm="onShareAppMessage"
 		/>
 		<!-- 透明模态层 -->
-		<modal-layer v-if="isModalLayer"></modal-layer>
+		<modal-layer v-if="isModalLayer" />
 		<view class="aganBj" v-show="showAgan">
 			<view class="alertAgan">
 				<text class="title">{{ promptitle }}</text>

pages/seller/order/search-order.vue

@@ -245,7 +245,7 @@
 			:maskClosable="false"
 		/>
 		<!-- 透明模态层 -->
-		<modal-layer v-if="isModalLayer"></modal-layer>
+		<modal-layer v-if="isModalLayer" />
 	</view>
 </template>
 

pages/supplier/components/home.vue

@@ -27,13 +27,13 @@
 
 <script>
 	import authorize from '@/common/config/authorize.js'
-	import customer from '@/components/cm-module/homeIndex/customer.vue'
-	import banner from '@/components/cm-module/homeIndex/banner.vue'
-	import navbars from '@/components/cm-module/homeIndex/navbars.vue'
-	import hotFloor from '@/components/cm-module/homeIndex/hotFloor.vue'
-	import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
-	import pageSpecial from '@/components/cm-module/homeIndex/pageSpecial.vue'
-	import supplierList from '@/components/cm-module/homeIndex/supplierList.vue'
+	import customer from './homeIndex/customer.vue'
+	import banner from './homeIndex/banner.vue'
+	import navbars from './homeIndex/navbars.vue'
+	import hotFloor from './homeIndex/hotFloor.vue'
+	import pageFloor from './homeIndex/pageFloor.vue'
+	import pageSpecial from './homeIndex/pageSpecial.vue'
+	import supplierList from './homeIndex/supplierList.vue'
 	import { mapState,mapMutations} from 'vuex'
 	export default {
 		components:{
@@ -56,7 +56,7 @@
 					textLeft: this.$store.state.isIphone,
 					textColor: '#333333'
 				},
-                 isIphoneX: this.$store.state.isIphone,
+                isIphoneX: this.$store.state.isIphone,
 				CustomBar:this.CustomBar,// 顶部导航栏高度
 				userID:0,
 				clubStatus:'',

pages/supplier/components/homeIndex/banner.vue

@@ -0,0 +1,312 @@
+<template>
+	<view class="banner">
+<!-- 		<view class="swiper-banner-msg">
+			<view class="content">
+				<view class="item le">
+					<view class="item-icon">
+						<text class="iconfont icon-zhengpin1"></text>
+					</view>
+					<view class="item-sm">
+						<text>正品保证</text>
+					</view>
+				</view>
+				<view class="item ce">
+					<view class="item-icon">
+						<text class="iconfont icon-jigou1"></text>
+					</view>
+					<view class="item-sm">
+						<text>12000+机构</text>
+					</view>
+				</view>
+				<view class="item ri">
+					<view class="item-sm">
+						<text>100+供应商</text>
+					</view>
+					<view class="item-icon">
+						<text class="iconfont icon-gongyingshang1"></text>
+					</view>
+				</view>
+			</view>
+		</view -->
+		<!-- <view class="tui-rolling-view">
+			<view class="tui-rolling-content">
+				<view class="tui-rolling-news">
+					<text class="tui-roll-label">公告：</text>
+					<swiper vertical autoplay circular interval="3500" class="tui-swiper">
+						<swiper-item v-for="(item, index) in list" :key="index" class="tui-swiper-item">
+							<view class="tui-news-item" @tap="detail(item)">
+								<text class="news-dot"></text> {{ item.title }}
+							</view>
+						</swiper-item>
+					</swiper>
+					<view class="tui-roll-more" @tap="newsList(item)">
+						更多<text class="iconfont icon-xiayibu"></text>
+					</view>
+				</view>
+			</view>
+		</view> -->
+		<view class="swiper-banner-content">
+			<view class="swiper-banner-box">
+				<swiper
+					class="tui-banner-swiper tui-banner tui-skeleton-fillet"
+					:autoplay="true"
+					:interval="5000"
+					:duration="500"
+					@change="swiperChange"
+					:circular="true"
+				>
+					<swiper-item v-for="(item, index) in list" :key="index" @click.stop="NavToDetailPage(item)">
+						<image :src="item.image" class="tui-slide-image" mode="scaleToFill" />
+					</swiper-item>
+				</swiper>
+				<view class="swiper__dots-box" v-if="list.length > 1">
+					<view
+						v-for="(item, idx) in list"
+						:key="idx"
+						:class="[idx === current ? 'swiper__dots-long' : 'none']"
+						:data-index="current"
+						class="swiper__dots-item"
+					>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import cmsMixins from '@/mixins/cmsMixins.js'
+export default {
+	mixins: [cmsMixins],
+	name: 'banner',
+	props: {
+		list: {
+			type: Array
+		}
+	},
+	data() {
+		return {
+			current: 0,
+			StatusBar: this.StatusBar
+		}
+	},
+	created() {
+		
+	},
+	computed: {},
+	methods: {
+		detail(item){// 跳转公告详情
+			this.$api.navigateTo(`/pages/service/news-detailes?id=${item.id}`)
+		},
+		newsList(){// 公告列表
+			this.$api.navigateTo('/pages/service/news-list')
+		},
+		swiperChange(e) {
+			//轮播图切换
+			const index = e.detail.current
+			this.current = index
+		},
+		NavToDetailPage(item) {
+			//跳转
+			this.cmsSysStatistics(1, item.id)
+			this.$api.FlooryNavigateTo(item)
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+.banner {
+	margin-top: 150rpx;
+	background: #f7f7f7;
+}
+.swiper-banner-content {
+	width: 100%;
+	height: auto;
+	position: relative;
+	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
+}
+.swiper-banner-box {
+	width: 100%;
+	height: auto;
+	position: relative;
+	background-size: cover;
+	display: flex;
+	opacity: 1;
+	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
+}
+.tui-banner-swiper {
+	width: 702rpx;
+	margin: 10rpx auto;
+	height: 280rpx;
+	border-radius: 16rpx;
+	overflow: hidden;
+	transform: translateY(0);
+	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
+	.banner-item {
+		border-radius: 16rpx;
+	}
+	.tui-slide-image {
+		width: 100%;
+		height: 280rpx;
+		display: block;
+	}
+}
+.swiper__dots-box {
+	position: absolute;
+	bottom: 30rpx;
+	left: 0;
+	right: 0;
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex: 1;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	.swiper__dots-item {
+		width: 8rpx;
+		height: 8rpx;
+		border-radius: 100%;
+		margin-left: 6px;
+		background-color: rgba(255, 255, 255, 0.7);
+	}
+	.swiper__dots-long {
+		width: 35rpx;
+		height: 8rpx;
+		border-radius: 4rpx;
+		background-color: #ffff;
+		transition: all 0.4s;
+	}
+}
+.swiper-banner-msg {
+	width: 100%;
+	height: 48rpx;
+	box-sizing: border-box;
+	background-color: #FFFFFF;
+	padding: 0 24rpx;
+	.content {
+		width: 100%;
+		height: 48rpx;
+		box-sizing: border-box;
+		padding: 0 24rpx;
+		border-radius: 16rpx;
+		.item {
+			width: 30%;
+			height: 48rpx;
+			float: left;
+			.item-icon{
+				height: 48rpx;
+				line-height: 48rpx;
+				float: left;
+				margin-right: 2px;
+				.iconfont {
+					color: #ffffff;
+					font-size: $font-size-28;
+				}
+			}
+			.item-sm{
+				line-height: 48rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				float: left;
+			}
+			&.le {
+				width: 37%;
+				text-align: left;
+			}
+			&.ce {
+				width: 25%;
+				text-align: center;
+			}
+			&.ri {
+				width: 37%;
+				.item-icon{
+					float: right;
+				}
+				.item-sm{
+					float: right;
+				}
+			}
+		}
+	}
+}
+.tui-rolling-view {
+	width: 100%;
+	height: 96rpx;
+	background-color: #FF5B00;
+}
+.tui-rolling-content{
+	width: 100%;
+	height: 100%;
+	box-sizing: border-box;
+	padding: 20rpx 24rpx;
+	border-radius: 24rpx 24rpx 0 0;
+	background-color: #FFFFFF;
+}
+.tui-rolling-news {
+	width: 100%;
+	padding: 0 20rpx;
+	border-radius: 8rpx;
+	box-sizing: border-box;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-wrap: nowrap;
+	line-height: 56rpx;
+	background: #fff7f3;
+	background-size: cover;
+	.tui-roll-label {
+		font-weight: bold;
+		font-size: $font-size-26;
+		color: #ff5b00;
+	}
+	.tui-roll-more {
+		font-size: $font-size-24;
+		color: #999999;
+		.icon-xiayibu {
+			font-size: $font-size-22;
+		}
+	}
+}
+
+.tui-swiper {
+	font-size: 28rpx;
+	height: 50rpx;
+	flex: 1;
+}
+
+.tui-swiper-item {
+	display: flex;
+	align-items: center;
+}
+
+.tui-news-item {
+	width: 480rpx;
+	line-height: 28rpx;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	font-size: $font-size-24;
+	color: #666666;
+	.news-dot {
+		display: inline-block;
+		width: 10rpx;
+		height: 10rpx;
+		background-color: #999999;
+		border-radius: 50%;
+		margin-right: 8rpx;
+		float: left;
+		margin-top: 10rpx;
+	}
+}
+.tui-drop-item {
+	color: #333;
+	height: 80rpx;
+	font-size: 28rpx;
+	padding: 20rpx 40rpx 20rpx 40rpx;
+	box-sizing: border-box;
+	display: inline-block;
+	width: 50%;
+}
+</style>

pages/supplier/components/homeIndex/coupon.vue

@@ -0,0 +1,52 @@
+<template name="navbars">
+	<view>
+		<view class="coupon-content clearfix" @click="navigator('/pages/user/coupon/coupon-collection')">
+			<image src="https://static.caimei365.com/app/img/icon/icon-coupon-banner@2x.png" mode=""></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState,mapMutations } from 'vuex'
+	export default{
+		name:'navbars',
+		data() {
+			return{
+				
+			}
+		},
+		created(){
+			
+		},
+		computed: {
+			...mapState(['hasLogin','userInfo','isWxAuthorize'])
+		},
+		methods:{
+			navigator(url){
+				// 友盟埋点收集首页优惠券宣传图点击
+				if (process.env.NODE_ENV != 'development') {
+					this.$uma.trackEvent('Um_Event_homeCouponBannerClick', {
+						Um_Key_PageName: '采美商城首页',
+						Um_Key_SourcePage: '首页优惠券宣传图',
+					})
+				}
+				this.$api.navigateTo(url)
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.coupon-content{
+		width: 100%;
+		height: 254rpx;
+		box-sizing: border-box;
+		padding: 32rpx 24rpx 12rpx 24rpx;
+		background-color: #f7f7f7;
+		image{
+			width: 100%;
+			height: 210rpx;
+			display: block;
+		}
+	}
+</style>

pages/supplier/components/homeIndex/customer.vue

@@ -0,0 +1,394 @@
+<template name="headerNavbar">
+    <!-- 自定义导航栏 -->
+    <view>
+        <view class="navbar-wrap" :class="isScroll ? opacityNav : ''" :style="{
+				height: CustomBar + 78 + 'px',
+				paddingTop: StatusBar + 'px'
+			}">
+            <view class="navbar-text" :style="{
+					color: navbarData.textColor ? navbarData.textColor : '',
+					lineHeight: CustomBar - ( StatusBar + 4 ) + 'px;',
+					fontSize: fontSizeSetting + 'px;',
+					paddingLeft: navbarData.textLeft ? '' : 12 + 'px'
+				}" :class="platformClass">
+                {{ navbarData.title ? navbarData.title : ' ' }}
+            </view>
+            <view class="search-input">
+                <view class="gosearch-btn" @click="this.$api.navigateTo(clickPath)">
+                    <view class="search-icon"><text class="iconfont icon-iconfonticonfontsousuo1"></text></view>
+                    <view class="search-text">{{ hotSearchText }}</view>
+                    <view class="search-btn">搜索</view>
+                </view>
+                <view class="gosearch-kf">
+                    <view class="contact-btn" @click.stop="handleToChat">
+                        <text class="iconfont icon-AIzhushou"></text>
+                    </view>
+                </view>
+            </view>
+            <view class="swiper-banner-nav">
+                <scroll-view class="scroll-view_H" scroll-x="true">
+                    <view class="tui-goods__item active">首页</view>
+                    <view class="tui-goods__item" v-for="(navs, index) in navBarsList"
+                        :key="index"
+                        @click="NavToDetailPage(navs,index)">
+                        {{ navs.name }}
+                    </view>
+                </scroll-view>
+                <view class="swiper-nav-icon" @click="showDropScreenShow">
+                    <text class="iconfont"
+                        :class="dropScreenShow ? 'icon-xiangshangjiantou':'icon-xiangxiajiantou'"></text>
+                </view>
+            </view>
+        </view>
+        <!--顶部下拉筛选弹层 属性-->
+        <tui-top-dropdown backgroundColor="#FFFFFF" :show="dropScreenShow" :height="310" :paddingbtm="10"
+            :translatey="dropScreenH" @close="btnCloseDrop">
+            <scroll-view class="tui-scroll-box" scroll-y :scroll-top="scrollTop">
+                <view class="tui-seizeaseat-24">
+                    <view class="tui-drop-item tui-icon-middle">全部分类</view>
+                    <view class="tui-drop-item tui-icon-middle active">首页</view>
+                    <view class="tui-drop-item tui-icon-middle" v-for="(item, index) in navBarsList" :key="index"
+                        @tap.stop="NavToDetailPage(item,index)" :data-index="index">
+                        {{ item.name }}
+                    </view>
+                </view>
+            </scroll-view>
+        </tui-top-dropdown>
+    </view>
+</template>
+
+<script>
+    var self
+    export default {
+        name: 'headerNavbar',
+        components: {},
+        props: {
+            navbarData: {
+                // 由父页面传递的数据
+                type: Object
+            },
+            navBarsList: {
+                type: Array
+            },
+            isScroll: {
+                type: Boolean,
+                default: () => false
+            }
+        },
+        data() {
+            return {
+                clickPath: '/pages/search/search',
+                hotSearchText: '搜索商品/项目仪器',
+                CustomBar: this.CustomBar, // 顶部导航栏高度
+                StatusBar: this.StatusBar,
+                fontSizeSetting: this.fontSizeSetting,
+                screenWidth: this.screenWidth,
+                capsule: this.capsule,
+                platformClass: this.platformClass,
+                opacityNav: 'opacityNav', // 渐变颜色
+                height: 64, //header高度
+                scrollTop: 0,
+                dropScreenH: this.CustomBar + 78, //下拉筛选框距顶部距离
+                dropScreenShow: false,
+                animationData: {}
+
+            }
+        },
+        created() {
+            if (getCurrentPages().length === 1) {
+                // 当只有一个页面时
+                this.navbarData.haveBack = false
+            } else {
+                this.navbarData.haveBack = true
+            }
+            let obj = {}
+            // #ifdef MP-WEIXIN
+            obj = wx.getMenuButtonBoundingClientRect()
+            // #endif
+            uni.getSystemInfo({
+                success: res => {
+                    this.height = obj.top ? obj.top + obj.height + 8 : res.statusBarHeight + 44
+                    //略小，避免误差带来的影响
+                    this.dropScreenH = (this.height * 750) / res.windowWidth + 148
+                }
+            })
+            console.log('dropScreenH', this.dropScreenH)
+        },
+        onLoad() {},
+        onPageScroll(e) {
+            console.log(e)
+        },
+        methods: {
+            BackPage: function() {
+                this.$emit('navigateBack')
+            },
+            _goSearchPath: function() {
+                this.$emit('goSearchPath')
+            },
+            _goHome: function() {
+                uni.switchTab({
+                    url: '/pages/tabBar/home/index'
+                })
+            },
+            NavToDetailPage(item, index) { //跳转
+                if (index === 3) {
+                    let linkPath = 'https://static.caimei365.com/app/caimei-activity-h5/html/2023/activity_02.html'
+                    this.$api.navigateTo(`/pages/h5/activity/activity?link=${linkPath}&linkId=382`)
+                } else {
+                    /**
+                     * 页面跳转
+                     **/
+                    this.$api.FlooryNavigateTo(item)
+                }
+            },
+            showDropScreenShow() {
+                this.dropScreenShow = !this.dropScreenShow
+                if (this.dropScreenShow) {
+                    // 禁止页面滚动  
+                    uni.setScrollEnabled(false)
+                } else {
+                    // 禁止页面滚动
+                    uni.setScrollEnabled(true)
+                }
+            },
+            btnCloseDrop() {
+                this.dropScreenShow = false
+            },
+            handleToChat(){
+                this.$api.navigateTo('/pages/user/chats/index')
+            },
+            handleContact(e) {
+                console.log(e.detail.path)
+                console.log(e.detail.query)
+            }
+        },
+        onShow() {}
+    }
+</script>
+
+<style lang="scss" scoped>
+    .navbar-wrap {
+        position: fixed;
+        width: 100%;
+        top: 0;
+        z-index: 9999;
+        box-sizing: border-box;
+        background: #ffffff url(https://static.caimei365.com/app/img/bg/home_cumres_bg@2x.png);
+        background-size: cover;
+        border-bottom: none;
+    }
+    
+    .opacityNav {}
+
+    .navbar-text {
+        font-size: 30rpx;
+        color: #000000;
+        font-weight: 500;
+    }
+
+    .navbar-text.center {
+        text-align: center;
+    }
+
+    .navbar-text.left {
+        text-align: left;
+        padding-left: 45px;
+    }
+
+    .navbar-icon {
+        position: fixed;
+        display: flex;
+        box-sizing: border-box;
+    }
+
+    .navbar-icon .iconfont {
+        display: inline-block;
+        overflow: hidden;
+        font-size: 44rpx;
+        padding-right: 40rpx;
+        margin-top: 1px;
+    }
+
+    .navbar-icon .icon-iconfonticonfontsousuo1 {
+        color: #000000;
+    }
+
+    .navbar-icon view {
+        height: 18px;
+        border-left: 0.5px solid rgba(0, 0, 0, 0.3);
+        margin-top: 6px;
+    }
+
+    .navbar-loading {
+        background: #fff;
+        text-align: center;
+    }
+
+    .search-input {
+        width: 100%;
+        height: 70rpx;
+        padding: 0 24rpx 0rpx 24rpx;
+        box-sizing: border-box;
+        margin-top: 10rpx;
+        .gosearch-btn {
+            width: 632rpx;
+            height: 100%;
+            padding: 5rpx;
+            border-radius: 40rpx;
+            background: #f0f0f0;
+            color: #8a8a8a;
+            background: #ffffff;
+            position: relative;
+            box-sizing: border-box;
+            padding-left: 80rpx;
+            border: 1px solid #ff5b00;
+            float: left;
+
+            .search-icon {
+                width: 80rpx;
+                height: 56rpx;
+                position: absolute;
+                left: 0;
+                top: 9rpx;
+                text-align: center;
+                line-height: 56rpx;
+
+                .icon-iconfonticonfontsousuo1 {
+                    margin: 0 6rpx;
+                    font-size: $font-size-40;
+                    color: #8a8a8a;
+                    z-index: 10;
+                }
+            }
+
+            .search-text {
+                font-size: $font-size-24;
+                line-height: 56rpx;
+                color: #8a8a8a;
+                float: left;
+            }
+
+            .search-btn {
+                width: 120rpx;
+                height: 58rpx;
+                border-radius: 30rpx;
+                background: $btn-confirm;
+                line-height: 58rpx;
+                text-align: center;
+                font-size: $font-size-28;
+                color: #ffffff;
+                float: right;
+            }
+        }
+
+        .gosearch-kf {
+            width: 70rpx;
+            height: 70rpx;
+            border-radius: 50%;
+            float: left;
+            line-height: 70rpx;
+            text-align: center;
+            .contact-btn {
+                width: 70rpx;
+                height: 70rpx;
+                background-color: rgba(0, 0, 0, 0);
+                line-height: 70rpx;
+                text-align: center;
+                .iconfont {
+                    font-size: 50rpx;
+                    color: #ff5b00;
+                }
+            }
+        }
+    }
+
+    .swiper-banner-nav {
+        width: 100%;
+        height: 80rpx;
+        box-sizing: border-box;
+        padding: 15rpx 76rpx 15rpx 24rpx;
+        overflow: hidden;
+        display: flex;
+        align-items: center;
+        position: relative;
+
+        .swiper-nav-icon {
+            width: 76rpx;
+            height: 80rpx;
+            line-height: 80rpx;
+            text-align: center;
+            position: absolute;
+            right: 0;
+            top: 0;
+
+            .iconfont {
+                font-size: $font-size-28;
+                color: #666666;
+            }
+        }
+
+        .scroll-view_H {
+            white-space: nowrap;
+            width: 100%;
+
+            .tui-goods__item {
+                display: inline-block;
+                margin: 0 20rpx;
+                height: 50rpx;
+                line-height: 50rpx;
+                font-size: $font-size-24;
+                color: #333333;
+                text-align: center;
+
+                &.active {
+                    color: #ff5b00;
+                    font-weight: bold;
+                    position: relative;
+
+                    &::before {
+                        content: '';
+                        width: 20rpx;
+                        height: 4rpx;
+                        border-radius: 2rpx;
+                        background: #ff5b00;
+                        position: absolute;
+                        bottom: 0;
+                        left: 50%;
+                        margin-left: -10rpx;
+                    }
+                }
+            }
+        }
+    }
+    .tui-scroll-box {
+        height: 280rpx;
+        overflow: hidden;
+    }
+
+    .tui-seizeaseat-24 {
+        width: 100%;
+        height: auto;
+        box-sizing: border-box;
+        padding: 24rpx;
+
+        .tui-drop-item {
+            padding: 0 20rpx;
+            height: 56rpx;
+            float: left;
+            line-height: 56rpx;
+            background: #f5f5f5;
+            font-size: 24rpx;
+            margin: 12rpx 8rpx;
+            text-align: center;
+            border: 1px solid #f5f5f5;
+            color: #333333;
+            border-radius: 28rpx;
+
+            &.active {
+                background: #ffffff;
+                border-color: #ff5b00;
+                color: #ff5b00;
+            }
+        }
+    }
+</style>

pages/supplier/components/homeIndex/hotFloor.vue

@@ -0,0 +1,294 @@
+<template>
+	<view>
+		<view class="section_hot clearfix" v-for="(page, index) in list" :key="index">
+			<view class="tui-group-name">
+				<view class="tui-group-title">
+					<view class="tui-group-l">{{ page.title }}</view>
+				</view>
+				<view class="tui-sub__desc">{{ page.detail }}</view>
+				<view
+					class="tui-group-r"
+					@click="NavtoHotPage"
+				>
+				</view>
+			</view>
+			<template>
+				<templateL :pageData="page" :userIdentity="userIdentity" :autoplay="autoplay"></templateL>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+import templateL from './template-page/templateL.vue'
+export default {
+	name: 'pageFloor',
+	components: {
+		templateL
+	},
+	props: {
+		list: {
+			type: Array
+		},
+		userIdentity: {
+			type: Number
+		},
+		autoplay: {
+		    type: Boolean,
+		    default: true
+		},
+	},
+	data() {
+		return {
+			
+		}
+	},
+	created() {
+		
+	},
+	watch: {
+		list: {
+			handler: function (el) {//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.list = el
+			},
+			deep: true
+		}
+	},
+	methods: {
+		NavtoHotPage(){//跳新品橱窗页
+			this.$api.navigateTo('/pages/goods/good-hot')
+		},
+		NavToDetailPage(page) {
+			//跳转
+			this.$api.navigateTo(
+				`/pages/goods/good-floorMore?pageType=${this.pageType}&floorId=${page.id}&title=${
+					page.title
+				}`
+			)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_hot {
+	width: 100%;
+	height: 1290rpx;
+	background: url(https://static.caimei365.com/app/img/hot/hot-bg.png);
+	background-size: cover;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	float: left;
+	border-radius: 50rpx 50rpx 0 0;
+}
+.tui-group-name {
+	width: 100%;
+	height: 165rpx;
+	box-sizing: border-box;
+	padding: 40rpx 0 20rpx 0;
+	position: relative;
+	border-radius: 16rpx 16rpx 0 0;
+	.tui-group-r {
+		width: 144rpx;
+		height: 54rpx;
+		background: url(https://static.caimei365.com/app/img/hot/hot-bt@2x.png);
+		background-size: cover;
+		position: absolute;
+		right: 16rpx;
+		top: 69rpx;
+	}
+}
+.tui-group-title {
+	width: 100%;
+	height: 50rpx;
+	line-height: 50rpx;
+	float: left;
+	.tui-group-l {
+		float: left;
+		font-size: 38rpx;
+		font-weight: bold;
+		text-align: left;
+		color: #ffffff;
+	}
+}
+.tui-sub__desc {
+	width: 100%;
+	float: left;
+	line-height: 50rpx;
+	color: #ffffff;
+	font-size: $font-size-28;
+}
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.recommend-list {
+		width: 100%;
+		height: 1100rpx;
+		position: relative;
+		padding-bottom: 20rpx;
+		.tui-banner-swiper {
+			width: 100%;
+			margin: 0 auto;
+			height: 1100rpx;
+			overflow: hidden;
+			transform: translateY(0);
+			.floor-item {
+				width: 339rpx;
+				height: 516rpx;
+				margin-right: 20rpx;
+				font-size: $font-size-24;
+				color: $text-color;
+				background: #ffffff;
+				line-height: 36rpx;
+				border-radius: 16rpx;
+				margin-bottom: 20rpx;
+				float: left;
+				box-sizing: border-box;
+				position: relative;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				.item-img {
+					width: 339rpx;
+					height: 339rpx;
+					border-radius: 16rpx 16rpx 0 0;
+					display: block;
+					margin-bottom: 8rpx;
+				}
+				.floor-item_tag {
+					width: 100%;
+					height: 32rpx;
+					float: left;
+					margin: 20rpx 0;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+					text {
+						display: inline-block;
+						padding: 0 8rpx;
+						border: 1px solid #e3ebf7;
+						border-radius: 8rpx;
+						color: #9aa5b5;
+						font-size: $font-size-22;
+						line-height: 32rpx;
+						text-align: center;
+						float: left;
+					}
+				}
+				.floor-item-content {
+					width: 100%;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+				.floor-item-act {
+					display: block;
+					width: 100%;
+					height: 32rpx;
+					text-align: center;
+					box-sizing: border-box;
+				}
+				.title-none {
+					font-size: $font-size-26;
+					color: #ff2a2a;
+					line-height: 54rpx;
+				}
+				.title {
+					width: 100%;
+					height: 70rpx;
+					display: flex;
+					line-height: 35rpx;
+					flex-direction: column;
+					margin: 8rpx 0;
+					padding: 0;
+					position: relative;
+					.mclap {
+						width: 100%;
+						line-height: 35rpx;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						word-break: break-all;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						overflow: hidden;
+						font-size: 26rpx;
+						&.indent {
+							text-indent: 95rpx;
+						}
+					}
+					.mclap-tag {
+						display: block;
+						width: 84rpx;
+						height: 32rpx;
+						background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+						border-radius: 4rpx 48rpx 4px 4px;
+						line-height: 32rpx;
+						font-size: $font-size-22;
+						color: #ffffff;
+						text-align: center;
+						position: absolute;
+						left: 0;
+						top: 0;
+					}
+				}
+				.no-price {
+					height: 54rpx;
+					line-height: 54rpx;
+					display: flex;
+					box-sizing: border-box;
+					.p-no {
+						font-size: $font-size-28;
+						color: $text-color;
+						display: block;
+						float: left;
+					}
+					.p-stars {
+						float: left;
+					}
+				}
+				.price {
+					color: #ff2a2a;
+					line-height: 54rpx;
+					&.none {
+						text-decoration: line-through;
+						color: #999999;
+					}
+					.sm {
+						font-size: $font-size-24;
+					}
+					.big {
+						font-size: $font-size-28;
+					}
+				}
+			}
+		}
+	}
+	.swiper__recommenddots-box {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 60rpx;
+		.swiper__dots-item {
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 100%;
+			margin-left: 6px;
+			background-color: #FFFFFF;
+		}
+		.swiper__dots-long {
+			width: 32rpx;
+			height: 8rpx;
+			border-radius: 4rpx;
+			background-color: #FFFFFF;
+			transition: all 0.4s;
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/navbars.vue

@@ -0,0 +1,110 @@
+<template name="navbars">
+	<view class="navbar">
+		<view class="navbars-content clearfix">
+			<view class="nav-item" v-for="(item, index) in navList" :key="index" @click="NavToDetailPage(item, index)">
+				<view class="icon"> <image class="icon-image" :src="item.icon" mode="widthFix"></image> </view>
+				<view class="name">{{ item.name }}</view>
+			</view>
+			<view class="nav-item" @click="handleMore" v-if="list.length === 9 || list.length > 9">
+				<view class="icon">
+					<image
+						class="icon-image"
+						src="https://static.caimei365.com/app/img/icon/icon-navs-more@2x.png"
+						mode="widthFix"
+					></image>
+				</view>
+				<view class="name">更多</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import cmsMixins from '@/mixins/cmsMixins.js'
+export default {
+	mixins: [cmsMixins],
+	name: 'navbars',
+	props: {
+		list: {
+			type: Array
+		}
+	},
+	data() {
+		return {
+			current: 100,
+			navList: []
+		}
+	},
+	created() {
+		this.initData(this.list)
+	},
+	computed: {},
+	methods: {
+		initData(list) {
+			this.navList = list.slice(0, 9)
+		},
+		handleMore() {
+			this.$api.navigateTo('/pages/goods/channel')
+		},
+		NavToDetailPage(pros, index) {
+			// 采美快捷运营点击量统计
+			this.cmsMoudleHits(4, pros.id)
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+.navbar {
+	background: #f7f7f7;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+    width: 100%;
+    box-sizing: border-box;
+    padding: 0 24rpx;
+}
+.navbars-content {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	padding: 20rpx 0 0 0;
+	background-color: #fff;
+	border-radius: 16rpx;
+	margin-top: 10rpx;
+	.nav-item {
+		width: 20%;
+		height: auto;
+		float: left;
+		margin-bottom: 12rpx;
+		.icon {
+			width: 80rpx;
+			height: 80rpx;
+			margin: 0 auto;
+			position: relative;
+			.icon-image {
+				width: 80rpx;
+				height: 80rpx;
+				display: block;
+			}
+			.icon-new {
+				width: 44rpx;
+				height: 22rpx;
+				display: block;
+				position: absolute;
+				right: 0;
+				top: 20rpx;
+			}
+		}
+		.name {
+			width: 100%;
+			height: 40rpx;
+			line-height: 40rpx;
+			text-align: center;
+			font-size: $font-size-24;
+			color: #333333;
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/pageFloor.vue

@@ -0,0 +1,150 @@
+<template>
+	<view>
+		<view class="page-content clearfix" v-for="(page, index) in list" :key="index">
+			<view class="tui-group-name" v-if="page.floorContent">
+				<view class="tui-group-title">
+					<view class="tui-group-l">{{ page.title }}</view>
+					<view
+						class="tui-group-r"
+						v-if="page.floorContent.templateType != '8'"
+						@click="NavToDetailPage(page)"
+					>
+						<text>更多</text> <text class="iconfont icon-xiayibu"></text>
+					</view>
+				</view>
+				<view class="tui-sub__desc">{{ page.detail }}</view>
+			</view>
+
+			<template v-if="page.floorContent.templateType == '1'">
+				<templateA :pageData="page" :userIdentity="userIdentity"></templateA>
+			</template>
+			<template v-if="page.floorContent.templateType == '2'">
+				<templateB :pageData="page" :userIdentity="userIdentity"></templateB>
+			</template>
+			<template v-if="page.floorContent.templateType == '3'">
+				<templateC :pageData="page" :userIdentity="userIdentity"></templateC>
+			</template>
+			<template v-if="page.floorContent.templateType == '4'">
+				<templateD :pageData="page" :userIdentity="userIdentity"></templateD>
+			</template>
+			<template v-if="page.floorContent.templateType == '5'">
+				<templateE :pageData="page" :userIdentity="userIdentity"></templateE>
+			</template>
+			<template v-if="page.floorContent.templateType == '6'">
+				<templateF :pageData="page" :userIdentity="userIdentity"></templateF>
+			</template>
+			<template v-if="page.floorContent.templateType == '7'">
+				<templateG :pageData="page" :userIdentity="userIdentity"></templateG>
+			</template>
+			<template v-if="page.floorContent.templateType == '8'">
+				<templateH :pageData="page" :userIdentity="userIdentity"></templateH>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+import templateA from './template-page/templateA.vue'
+import templateB from './template-page/templateB.vue'
+import templateC from './template-page/templateC.vue'
+import templateD from './template-page/templateD.vue'
+import templateE from './template-page/templateE.vue'
+import templateF from './template-page/templateF.vue'
+import templateG from './template-page/templateG.vue'
+import templateH from './template-page/templateH.vue'
+export default {
+	name: 'pageFloor',
+	components: {
+		templateA,
+		templateB,
+		templateC,
+		templateD,
+		templateE,
+		templateF,
+		templateG,
+		templateH
+	},
+	props: {
+		list: {
+			type: Array
+		},
+		pageType: {
+			type: Number
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			pageFloorList: []
+		}
+	},
+	created() {
+		
+	},
+	watch: {
+		list: {
+			handler: function (el) {//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.list = el
+			},
+			deep: true
+		}
+	},
+	methods: {
+		NavToDetailPage(page) {
+			//跳转
+			this.$api.navigateTo(
+				`/pages/goods/good-floorMore?pageType=${this.pageType}&floorId=${page.id}&title=${
+					page.title
+				}`
+			)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.page-content {
+	background-color: #f7f7f7;
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	float: left;
+}
+.tui-group-name {
+	width: 100%;
+	height: 92rpx;
+	padding: 20rpx 0;
+}
+.tui-group-title {
+	width: 100%;
+	float: left;
+	.tui-group-l {
+		float: left;
+		font-size: 34rpx;
+		font-weight: bold;
+		text-align: left;
+		line-height: 49rpx;
+		color: #333;
+	}
+	.tui-group-r {
+		float: right;
+		font-size: $font-size-24;
+		text-align: right;
+		line-height: 49rpx;
+		color: #999999;
+		.icon-xiayibu {
+			font-size: $font-size-30;
+			color: #999999;
+		}
+	}
+}
+.tui-sub__desc {
+	width: 100%;
+	float: left;
+	color: rgba(153, 153, 153, 0.9);
+	font-size: $font-size-26;
+}
+</style>

pages/supplier/components/homeIndex/pageSpecial.vue

@@ -0,0 +1,492 @@
+<template name="pagesProduct">
+	<view>
+		<view class="container-pages">
+			<scroll-view scroll-x class="tui-goods__scroll-view">
+				<view class="tui-goods__list">
+					<view class="tui-goods__item ross" v-if="shopAdvert.length>0">
+						<swiper class="tui-goods__ross" 
+								circular 
+								@change="swiperChange"
+								:indicator-dots="false" 
+								:autoplay="true"
+								:interval="5000"
+								:duration="500"
+							>
+							<swiper-item v-for="(item, index) in shopAdvert" :key="item">
+								<view class="tui-goods__ross" @click="NavToDetailPage(item)">
+									<image class="ross-image" :src="item.appImage" mode=""></image>
+								</view>
+							</swiper-item>
+						</swiper>
+						<view class="swiper__dots-box">
+						    <view
+						        v-for="(item, idx) in shopAdvert"
+						        :key="idx"
+						        :class="[idx === current ? 'swiper__dots-long' : 'none']"
+						        :data-index="current"
+						        class="swiper__dots-item"
+						    ></view>
+						</view>
+					</view>
+					<view class="tui-goods__item" v-if="tempData.liveList != ''">
+						<view class="tui-group-name" @click="LiveGoPath">
+							<view class="tui-group-title"><text>采美LIVE</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(live, flIndex) in tempData.liveList"
+							:key="flIndex"
+							@click="LiveGoPathPros(live)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="live.homePageImage" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ live.liveTitle }}</view>
+								<view class="tui-goods__statu">
+									<text class="iconfont icon-weikaishi" v-if="live.liveStatus == 1"></text>
+									<image
+										:src="iconLive"
+										mode="widthFix"
+										class="icon-live"
+										v-if="live.liveStatus == 2"
+									></image>
+									<text class="iconfont icon-jieshu" v-if="live.liveStatus == 3"></text>
+									<text>{{ live.liveStatus | statusType }}</text>
+								</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ live.liveTitle }}</view>
+						</view>
+					</view>
+					<view class="tui-goods__item" v-if="tempData.cmImageList != ''">
+						<view class="tui-group-name" @click="NewActivityList">
+							<view class="tui-group-title"><text>最新活动</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(cmImage, flIndex) in tempData.cmImageList"
+							:key="flIndex"
+							@click="NewActivityListPath(cmImage)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="cmImage.homePageImage" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ cmImage.title }}</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ cmImage.title }}</view>
+						</view>
+					</view>
+					<view class="tui-goods__item" v-if="tempData.infoList != ''">
+						<view
+							class="tui-group-name"
+							@click="NavArticlePath('https://www.caimei365.com/info/center-3-1.html')"
+						>
+							<view class="tui-group-title"><text>热门文章</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(info, flIndex) in tempData.infoList"
+							:key="flIndex"
+							@click="NavArticlePath(info.link)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="info.homePageImage" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ info.title }}</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ info.title }}</view>
+						</view>
+					</view>
+					<!-- 采美百科 -->
+					<view class="tui-goods__item" v-if="tempData.baikeList.length > 0">
+						<view
+							class="tui-group-name"
+							@click="NavArticlePath('https://www.caimei365.com/encyclopedia/product.html')"
+						>
+							<view class="tui-group-title"><text>热门百科</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(item, flIndex) in tempData.baikeList"
+							:key="flIndex"
+							@click="NavArticlePath(item.link)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="item.image" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ item.name }}</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ item.name }}</view>
+						</view>
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import cmsMixins from '@/mixins/cmsMixins.js'
+export default {
+	mixins: [cmsMixins],
+	name: 'pagesProduct',
+	props: {
+		templateData: {
+			type: Object
+		}
+	},
+	data() {
+		return {
+			tempData: {},
+			current: 0 ,// 切换轮播
+			iconLive: 'https://static.caimei365.com/app/img/icon/icon-live.gif'
+		}
+	},
+	filters: {
+		statusType: function(value) {
+			switch (value) {
+				case 1:
+					return '未开始'
+					break
+				case 2:
+					return '直播中'
+					break
+				case 3:
+					return '看回放'
+					break
+			}
+		},
+		NumFormat: function(value) {
+			//处理金额
+			return Number(value).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.templateData)
+	},
+	computed: {
+		...mapState(['shopAdvert'])
+	},
+	methods: {
+		initData(data) {
+			this.tempData = data
+		},
+		swiperChange(e) {//轮播图切换
+			this.current = e.detail.current
+		},
+		NavToDetailPage(item) {
+            console.log(item)
+            // 采美供应商广告图点击量统计
+            this.cmsMoudleHits(5, item.id)
+			//跳转
+			this.$api.FlooryNavigateTo(item)
+		},
+		NavArticlePath(LINK) {
+			// 友盟埋点首页文章模块点击
+			if (process.env.NODE_ENV != 'development') {
+				this.$uma.trackEvent('Um_Event_HomeArticleTemplateClick', {
+					Um_Key_ArticleLink: `${LINK}`,
+					Um_Key_PageName: '首页文章模块',
+					Um_Key_SourcePage: '商城首页'
+				})
+			}
+			// 采美埋点首页文章模块数据统计
+			this.cmsSysStatistics(4)
+			this.$api.navigateTo(`/pages/h5/article/path?link=${LINK}`)
+		},
+		NewActivityList() {
+			this.$api.navigateTo('/pages/h5/activity/activity-list')
+		},
+		NewActivityListPath(pros) {
+			// 友盟埋点首页活动模块点击
+			if (process.env.NODE_ENV != 'development') {
+				this.$uma.trackEvent('Um_Event_HomeActivityTemplateClick', {
+					Um_Key_ActivityName: `${pros.title}`,
+					Um_Key_PageName: '首页活动模块',
+					Um_Key_SourcePage: '商城首页'
+				})
+			}
+			// 采美埋点首页活动模块数据统计
+			this.cmsSysStatistics(3)
+			/**
+			 * 页面跳转类型
+			 * 1、二级页面,2、搜索项目仪器,3、直播页面,4、自由页面,5、商品详情,6、仪器项目详情,7、供应商主页
+			 * 8、专题活动页,9、二手市场介绍,10、二手商品列表,11、二手商品发布,12、商品搜索,13、信息详情
+			 * 14、品牌招商介绍页,15、维修保养介绍页,16、首页,17、注册页,18、信息中心,19、供应商列表
+			 **/
+			if (pros.linkType) {
+				console.log(pros.linkType)
+				const typeMap = {
+					1: `/pages/goods/goods-instrument?linkId=${pros.linkParam.id}&title=${pros.name}`,
+					2: `/pages/goods/instrument-details?id=${pros.linkParam.id}`,
+					4:`/pages/h5/activity/activity?link=${pros.appletsLink}&linkId=${pros.linkParam.id}`,
+					5: `/pages/goods/product?id=${pros.linkParam.id}`,
+					// 7:`/pages/supplier/user/my-shop?shopId=${pros.linkParam.id}`,
+					8: '/pages/h5/activity/activity-list',
+					9: '/pages/second/form/introduce',
+					10: '/pages/second/product/product-list',
+					11: '/pages/second/form/form',
+					12: `/pages/search/search?keyWord=${pros.linkParam.keyword}`,
+					13: `/pages/h5/article/path?link=${pros.link}`,
+					14: `/pages/h5/article/path?link=${pros.link}`,
+					15: `/pages/h5/article/path?link=${pros.link}`,
+					17: '/pages/login/register-select',
+					18: `/pages/h5/article/path?link=${pros.link}`,
+					19: `/pages/search/search-supplier?keyWord=${pros.linkParam.keyword}`,
+					20: `/pages/goods/good-floor?linkId=${pros.linkParam.id}&title=${pros.name}`,
+					21: '/pages/h5/activity/meobohui',
+					22: `/pages/goods/good-floor-temp?linkId=${pros.linkParam.id}&title=${pros.name}`,
+					23: `/pages/h5/activity/activity-topic?linkId=${pros.linkParam.id}`, //活动专题页面
+					25: '/pages/goods/goods-doc-list', //美业资料
+					28: `/pages/h5/article/path?link=${pros.link}`, // 采美认证通
+					29: '/pages/user/coupon/coupon-collection' //领券中心
+				}
+				const url = typeMap[pros.linkType]
+				uni.navigateTo({
+					url: url
+				})
+			}
+            // 采美活动点击量统计
+            this.cmsMoudleHits(3, pros.id)
+		},
+		LiveGoPath() {
+			//查看直播
+			this.$api.navigateTo('/pages/h5/article/path-live')
+
+			// uni.navigateToMiniProgram({
+			// 	appId: 'wx92d650b253f8f2e3',
+			// 	path: '/pages/index/index',
+			// 	extraData: {
+			// 		'data1': 'test'
+			// 	},
+			// 	envVersion: 'develop',
+			// 	success(res) {
+			// 		// 打开成功
+			// 		console.log(res)
+			// 	}
+			// })
+		},
+		LiveGoPathPros(live) {
+			// 友盟埋点首页直播模块点击
+			if (process.env.NODE_ENV != 'development') {
+				this.$uma.trackEvent('Um_Event_HomeLiveTemplateClick', {
+					Um_Key_LiveName: `${live.liveTitle}`,
+					Um_Key_PageName: '首页直播模块',
+					Um_Key_SourcePage: '商城首页'
+				})
+			}
+			// 采美埋点首页直播模块数据统计
+			this.cmsSysStatistics(2)
+			this.$api.navigateTo(`/pages/h5/article/page-image?title=${live.liveTitle}&image=${live.advertisingImage}`)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.container-pages {
+	width: 100%;
+	height: 476rpx;
+	padding:16rpx 24rpx 0 24rpx;
+	float: left;
+	background-color: #f7f7f7;
+	box-sizing: border-box;
+	background-color: #f7f7f7;
+	overflow: hidden;
+	display: flex;
+	align-items: center;
+    .tui-goods__scroll-view{
+        width: 100%;
+        border-radius: 16rpx;
+        overflow: hidden;
+    }
+	.tui-goods__list {
+        width: 100%;
+		display: flex;
+		align-items: center;
+        margin-top: 2px;
+	}
+	.tui-goods__item {
+		background-color: #fff;
+		width: 307rpx;
+		height: 460rpx;
+		border-radius: 16rpx;
+		box-sizing: border-box;
+		margin-right: 16rpx;
+		padding: 17rpx;
+		&.ross{
+			padding: 0;
+			position: relative;
+			.swiper__dots-box{
+				position: absolute;
+				bottom: 30rpx;
+				left: 0;
+				right: 0;
+				/* #ifndef APP-NVUE */
+				display: flex;
+				/* #endif */
+				flex: 1;
+				flex-direction: row;
+				justify-content: center;
+				align-items: center;
+				.swiper__dots-item{
+					width: 8rpx;
+					height: 8rpx;
+					border-radius: 100%;
+					margin-left: 6px;
+					background-color:rgba(255,255,255,.7);
+				}
+				.swiper__dots-long{
+					width: 35rpx;
+					height: 8rpx;
+					border-radius: 4rpx;
+					background-color: #ffff;
+					transition: all 0.4s;
+				}
+			}
+		}
+		.tui-goods__ross{
+			width: 307rpx;
+			height: 460rpx;
+			text-align: center;
+			line-height: 460rpx;
+			color: #fff;
+			font-size: 40rpx;
+			float: left;
+			border-radius: 16rpx;
+            overflow: hidden;
+			.ross-image{
+				width: 100%;
+				height: 100%;
+				display: block;
+			}
+		}
+	}
+	.tui-group-name {
+		width: 100%;
+		height: 36rpx;
+		float: left;
+		margin-bottom: 13rpx;
+		.tui-group-title {
+			font-size: 24rpx;
+			line-height: 36rpx;
+			float: left;
+			color: #333333;
+		}
+		.icon-xiayibu {
+			font-size: 26rpx;
+			line-height: 36rpx;
+			float: right;
+			color: #909090;
+		}
+	}
+	.tui-goods__main {
+		width: 100%;
+		height: auto;
+		float: left;
+		position: relative;
+		&.one {
+			margin-bottom: 14rpx;
+		}
+	}
+	.tui-goods__imgbox {
+		width: 273rpx;
+		height: 273rpx;
+		box-sizing: border-box;
+		border-radius: 8rpx;
+	}
+	.tui-goods__img {
+		max-width: 273rpx;
+		max-height: 273rpx;
+		border-radius: 8rpx;
+		display: block;
+	}
+	.tui-goods__name {
+		width: 100%;
+		height: 48rpx;
+		float: left;
+		line-height: 48rpx;
+		box-sizing: border-box;
+		padding-left: 12rpx;
+		font-size: $font-size-24;
+		color: #ffffff;
+		background-color: rgba(0, 0, 0, 0.4);
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		border-radius: 0 0 8rpx 8rpx;
+	}
+	.tui-goods__statu {
+		padding-left: 45rpx;
+		padding-right: 10rpx;
+		height: 35rpx;
+		position: absolute;
+		top: 17rpx;
+		left: 17rpx;
+		background-color: rgba(0, 0, 0, 0.4);
+		border-radius: 18rpx;
+		line-height: 35rpx;
+		color: #ffffff;
+		text-align: right;
+		font-size: $font-size-20;
+		.icon-live {
+			width: 17rpx;
+			height: 17rpx;
+			display: block;
+			margin: 0 auto;
+			position: absolute;
+			left: 15rpx;
+			top: 9rpx;
+		}
+		.iconfont {
+			width: 35rpx;
+			height: 35rpx;
+			line-height: 35rpx;
+			display: block;
+			position: absolute;
+			left: 10rpx;
+			font-size: $font-size-26;
+			&.icon-weikaishi {
+				color: #e56d00;
+				left: 0;
+			}
+			&.icon-jieshu {
+				color: #ffffff;
+				left: 0;
+				font-size: 22rpx;
+			}
+		}
+	}
+	.tui-goods__text {
+		width: 100%;
+		height: 44rpx;
+		float: left;
+		line-height: 44rpx;
+		box-sizing: border-box;
+		padding-left: 12rpx;
+		font-size: $font-size-24;
+		color: #666666;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		position: relative;
+		&::before {
+			content: '';
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 50%;
+			background-color: #cccccc;
+			position: absolute;
+			left: 0;
+			top: 18rpx;
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/supplierList.vue

@@ -0,0 +1,168 @@
+<template>
+    <view class="supplier-content clearfix">
+        <view class="tui-group-name">
+            <view class="tui-group-title">
+                <view class="tui-group-l">优质供应商</view>
+                <view class="tui-group-r" @click="handleMoreShop">
+                    <text>更多</text> <text class="iconfont icon-xiayibu"></text>
+                </view>
+            </view>
+            <view class="tui-sub__desc">采美正品联盟 质量保证</view>
+        </view>
+        <view class="supplier-banner">
+            <image :src="banner" mode=""
+                @click="BannerNavigateTo(supplierObj.linkType,supplierObj.linkParam.id,supplierObj.wwwLink,supplierObj.linkParam.keyword)">
+            </image>
+        </view>
+        <view class="swiper-goods-box">
+            <view class="goods-box-item" v-for="(item,index) in supplierList" :key="index"
+                @click="NavToDetailPage(item)">
+                <image :src="item.image" mode="" class="box-item-image"></image>
+                <view class="box-item-mask">{{ item.supplierName }}</view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+    export default {
+        name: "supplierList",
+        props: {
+            supplierObj: {
+                type: Object
+            }
+        },
+        data() {
+            return {
+                banner: '',
+                supplierList: []
+            }
+        },
+        created() {
+            this.initData(this.supplierObj)
+        },
+        methods: {
+            initData(data) {
+                this.banner = data.crmImage
+                this.supplierList = data.qualitySupplierList.slice(0, 12)
+            },
+            BannerNavigateTo(linkType, linkId, linkHref, keyword) { //跳转
+                this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+            },
+            NavToDetailPage(item) { //跳转
+                this.$api.navigateTo(`/pages/supplier/user/my-shop?shopId=${item.linkParam.id}`)
+            },
+            handleMoreShop() {
+            	this.$api.navigateTo('/pages/goods/goods-shop-list')
+            },
+        }
+    }
+</script>
+
+<style lang="scss">
+    .supplier-content {
+        background-color: #F7F7F7;
+        width: 100%;
+        height: auto;
+        box-sizing: border-box;
+        padding: 0 24rpx;
+    }
+
+    .tui-group-name {
+        width: 100%;
+        height: 92rpx;
+        padding: 20rpx 0;
+    }
+
+    .tui-group-title {
+    	width: 100%;
+    	float: left;
+    	.tui-group-l {
+    		float: left;
+    		font-size: 34rpx;
+    		font-weight: bold;
+    		text-align: left;
+    		line-height: 49rpx;
+    		color: #333;
+    	}
+    	.tui-group-r {
+    		float: right;
+    		font-size: $font-size-24;
+    		text-align: right;
+    		line-height: 49rpx;
+    		color: #999999;
+    		.icon-xiayibu {
+    			font-size: $font-size-30;
+    			color: #999999;
+    		}
+    	}
+    }
+
+    .tui-sub__desc {
+        width: 100%;
+        float: left;
+        color: rgba(153, 153, 153, 0.9);
+        font-size: $font-size-26;
+    }
+
+    .supplier-banner {
+        width: 100%;
+        height: 240rpx;
+        float: left;
+        margin-top: 24rpx;
+        border-radius: 16rpx;
+        overflow: hidden;
+        image {
+            width: 100%;
+            height: 240rpx;
+            display: block;
+        }
+    }
+
+    .swiper-goods-box {
+        width: 100%;
+        height: auto;
+        float: left;
+        margin-top: 24rpx;
+
+        .goods-box-item {
+            width: 160rpx;
+            height: 200rpx;
+            float: left;
+            margin-right: 20rpx;
+            margin-bottom: 20rpx;
+            background-color: #FFFFFF;
+
+            &:nth-child(4n) {
+                margin-right: 0;
+            }
+
+            .box-item-image {
+                width: 160rpx;
+                height: 160rpx;
+                display: block;
+                float: left;
+            }
+
+            .box-item-mask {
+                width: 100%;
+                height: 40rpx;
+                line-height: 40rpx;
+                font-size: $font-size-20;
+                text-align: center;
+                color: #666666;
+                background-color: #f9f9f9;
+                float: left;
+                box-sizing: border-box;
+                padding: 0 20rpx;
+                white-space: normal;
+                word-break: break-all;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                display: -webkit-box;
+                -webkit-box-orient: vertical;
+                -webkit-line-clamp: 1;
+            }
+        }
+    }
+</style>

pages/supplier/components/homeIndex/template-page/templateA.vue

@@ -0,0 +1,297 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 3"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+export default {
+	name: 'templateA',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateB.vue

@@ -0,0 +1,314 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 2"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+export default {
+	name: 'templateB',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateC.vue

@@ -0,0 +1,348 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 3"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateC',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateD.vue

@@ -0,0 +1,342 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_02">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage2"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType2,
+						floorData.floorContent.linkParam2.id ? floorData.floorContent.linkParam2.id : '',
+						floorData.floorContent.adsLink2,
+						floorData.floorContent.linkParam2.keyword ? floorData.floorContent.linkParam2.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view class="floor-item ad_03">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage3"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType3,
+						floorData.floorContent.linkParam3.id ? floorData.floorContent.linkParam3.id : '',
+						floorData.floorContent.adsLink3,
+						floorData.floorContent.linkParam3.keyword ? floorData.floorContent.linkParam3.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 2"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateD',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateE.vue

@@ -0,0 +1,313 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+
+export default {
+	name: 'templateE',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		line-height: 36rpx;
+        background: #ffffff;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&.ad_02 {
+			margin-right: 20rpx;
+		}
+		&:nth-child(odd) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateF.vue

@@ -0,0 +1,330 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="floor-item ad_01">
+			<image
+				class="item-img-gg"
+				:src="floorData.floorContent.appletsAdsImage1"
+				@click="
+					BannerNavigateTo(
+						floorData.floorContent.linkType1,
+						floorData.floorContent.linkParam1.id ? floorData.floorContent.linkParam1.id : '',
+						floorData.floorContent.adsLink1,
+						floorData.floorContent.linkParam1.keyword ? floorData.floorContent.linkParam1.keyword : ''
+					)
+				"
+				mode="aspectFill"
+			>
+			</image>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateF',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		},
+		BannerNavigateTo(linkType, linkId, linkHref, keyword) {
+			//跳转商品详情页
+			this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&.ad_01 {
+			width: 100%;
+			height: 240rpx;
+			margin-right: 0;
+			.item-img-gg {
+				width: 100%;
+				height: 240rpx;
+				display: block;
+				border-radius: 16rpx;
+			}
+		}
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 8rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			margin-bottom: 20rpx;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-28;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateG.vue

@@ -0,0 +1,280 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view
+			class="floor-item ad_04 clearfix"
+			v-for="(item, idx) in floorData.floorImageList"
+			v-if="idx < 4"
+			:key="idx"
+			@click.stop="navToDetailPage(item)"
+		>
+			<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+			<template-Type :product="item.product"></template-Type>
+			<view class="floor-item_tag" v-if="item.listType == 2">
+				<text>{{ item.label }}</text>
+			</view>
+			<view class="floor-item-content">
+				<view class="title tui-skeleton-rect">
+					<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+					<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+						>{{ item.name }}
+					</text>
+				</view>
+				<view class="floor-item-price" v-if="item.listType == 1">
+					<template>
+						<template-Tags :product="item.product"></template-Tags>
+					</template>
+					<view v-if="hasLogin">
+						<template v-if="item.product.productCategory == 1">
+							<template-Price  :product="item.product"></template-Price>
+						</template>
+						<template v-else>
+							<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+								<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+							</view>
+							<view class="price tui-skeleton-rect" v-else>
+								<text class="p sm">￥</text>
+								<text class="p big">{{ item.product.price | NumFormat }}</text>
+							</view>
+						</template>
+					</view>
+					<view v-else class="no-price">
+						<template v-if="item.product.productCategory == 1">
+							<view class="p-stars">
+								<text class="p-no">￥</text>
+								<uni-grader :grade="Number(item.product.priceGrade)" :margin="14"></uni-grader>
+							</view>
+						</template>
+						<template v-else>
+							<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+						</template>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateG',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			floorData: {}
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity'])
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.floorData = data
+			// console.log(this.floorData)
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.floor-item {
+		width: 339rpx;
+		height: 516rpx;
+		margin-right: 20rpx;
+		font-size: $font-size-24;
+		color: $text-color;
+		background: #ffffff;
+		line-height: 36rpx;
+		border-radius: 16rpx;
+		margin-bottom: 20rpx;
+		float: left;
+		box-sizing: border-box;
+		position: relative;
+		&:nth-child(2n) {
+			margin-right: 0;
+		}
+		.item-img-gg {
+			width: 339rpx;
+			height: 516rpx;
+			display: block;
+			border-radius: 16rpx;
+		}
+		.item-img {
+			width: 339rpx;
+			height: 339rpx;
+			border-radius: 16rpx 16rpx 0 0;
+			display: block;
+			margin-bottom: 8rpx;
+		}
+		.floor-item_tag {
+			width: 100%;
+			height: 32rpx;
+			float: left;
+			margin: 20rpx 0;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+			text {
+				display: inline-block;
+				padding: 0 8rpx;
+				border: 1px solid #e3ebf7;
+				border-radius: 8rpx;
+				color: #9aa5b5;
+				font-size: $font-size-22;
+				line-height: 32rpx;
+				text-align: center;
+				float: left;
+			}
+		}
+		.floor-item-content {
+			width: 100%;
+			padding: 0 20rpx;
+			box-sizing: border-box;
+		}
+		.floor-item-act {
+			display: block;
+			width: 100%;
+			height: 32rpx;
+			text-align: center;
+			box-sizing: border-box;
+		}
+		.title-none {
+			font-size: $font-size-26;
+			color: #ff2a2a;
+			line-height: 54rpx;
+		}
+		.title {
+			width: 100%;
+			height: 70rpx;
+			display: flex;
+			line-height: 35rpx;
+			flex-direction: column;
+			margin: 8rpx 0;
+			padding: 0;
+			position: relative;
+			.mclap {
+				width: 100%;
+				line-height: 35rpx;
+				text-overflow: ellipsis;
+				display: -webkit-box;
+				word-break: break-all;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+				overflow: hidden;
+				font-size: 26rpx;
+				&.indent {
+					text-indent: 95rpx;
+				}
+			}
+			.mclap-tag {
+				display: block;
+				width: 84rpx;
+				height: 32rpx;
+				background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+				border-radius: 4rpx 48rpx 4px 4px;
+				line-height: 32rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				text-align: center;
+				position: absolute;
+				left: 0;
+				top: 0;
+			}
+		}
+		.no-price {
+			height: 54rpx;
+			line-height: 54rpx;
+			display: flex;
+			box-sizing: border-box;
+			.p-no {
+				font-size: $font-size-30;
+				color: $text-color;
+				display: block;
+				float: left;
+			}
+			.p-stars {
+				float: left;
+			}
+		}
+		.price {
+			color: #ff2a2a;
+			line-height: 54rpx;
+			&.none {
+				text-decoration: line-through;
+				color: #999999;
+			}
+			.sm {
+				font-size: $font-size-24;
+			}
+			.big {
+				font-size: $font-size-28;
+			}
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateH.vue

@@ -0,0 +1,361 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="recommend-list" :style="hasLessProduct ? 'height:269px' : ''">
+			<swiper
+				class="tui-banner-swiper"
+				:autoplay="true"
+				:interval="5000"
+				:duration="500"
+				:circular="true"
+				@change="swiperChange"
+				:style="hasLessProduct ? 'height:269px' : ''"
+			>
+				<swiper-item v-for="(product, index) in productList" :key="index">
+					<view
+						class="floor-item ad_04 clearfix"
+						v-for="(item, idx) in product"
+						:key="idx"
+						@click.stop="navToDetailPage(item)"
+					>
+						<image class="item-img tui-skeleton-fillet" :src="item.image" mode="aspectFill"></image>
+						<template-Type :product="item.product"></template-Type>
+						<view class="floor-item_tag" v-if="item.listType == 2">
+							<text>{{ item.label }}</text>
+						</view>
+						<view class="floor-item-content">
+							<view class="title tui-skeleton-rect">
+								<text class="mclap-tag" v-if="item.product.beautyActFlag == '1'">美博会</text>
+								<text class="mclap" :class="item.product.beautyActFlag == '1' ? 'indent' : ''"
+									>{{ item.name }}
+								</text>
+							</view>
+							<view class="floor-item-price" v-if="item.listType == 1">
+								<template>
+									<template-Tags :product="item.product"></template-Tags>
+								</template>
+								<view v-if="hasLogin">
+									<template v-if="item.product.productCategory == 1">
+										<template-Price  :product="item.product"></template-Price>
+									</template>
+									<template v-else>
+										<view class="price tui-skeleton-rect" v-if="item.product.detailTalkFlag == '2'">
+											<text class="p sm">￥</text> <text class="p big">价格详聊</text>
+										</view>
+										<view class="price tui-skeleton-rect" v-else>
+											<text class="p sm">￥</text>
+											<text class="p big">{{ item.product.price | NumFormat }}</text>
+										</view>
+									</template>
+								</view>
+								<view v-else class="no-price">
+									<template v-if="item.product.productCategory == 1">
+										<view class="p-stars">
+											<text class="p-no">￥</text>
+											<uni-grader
+												:grade="Number(item.product.priceGrade)"
+												:margin="14"
+											></uni-grader>
+										</view>
+									</template>
+									<template v-else>
+										<view class="p-stars"> <text class="p-no">￥登录可见</text> </view>
+									</template>
+								</view>
+							</view>
+						</view>
+					</view>
+				</swiper-item>
+			</swiper>
+			<view class="swiper__recommenddots-box" v-if="productList.length > 1">
+				<view
+					v-for="(item, idx) in productList"
+					:key="idx"
+					:class="[idx === swiperCurrent ? 'swiper__dots-long' : 'none']"
+					:data-index="swiperCurrent"
+					class="swiper__dots-item"
+				>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import uniGrader from '@/components/uni-grade/uni-grade.vue'
+import templateTags from '@/components/cm-module/pageTemplate/templateTags.vue'
+import templatePrice from '@/components/cm-module/pageTemplate/templatePrice.vue'
+import templateType from '@/components/cm-module/pageTemplate/templateType.vue'
+
+export default {
+	name: 'templateH',
+	components: {
+		uniGrader,
+		templateTags,
+		templatePrice,
+		templateType
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			shopId: 0,
+			productList: [],
+			current: 100,
+			swiperCurrent: 0,
+			pageSize: 4,
+			productCount: 0
+		}
+	},
+	filters: {
+		NumFormat: function(text) {
+			//处理金额
+			return Number(text).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		...mapState(['hasLogin', 'userInfo', 'isActivity']),
+		hasLessProduct() {
+			return this.productCount <= 2
+		}
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		initData(data) {
+			this.$api
+				.getStorage()
+				.then(resolve => {
+					this.shopId = resolve.shopId ? resolve.shopId : 0
+				})
+				.catch(err => {
+					console.log('err', err)
+				})
+			this.productCount = data.floorImageList.length
+			if (this.productCount > 0) {
+				this.productList.splice(0, this.productList.length)
+				for (var i = 0, j = data.floorImageList.length; i < j; i += this.pageSize) {
+					this.productList.push(data.floorImageList.slice(i, i + this.pageSize))
+				}
+			}
+		},
+		PromotionsFormat(promo) {
+			//促销活动类型数据处理
+			if (promo != null) {
+				if (promo.type == 1 && promo.mode == 1) {
+					return true
+				} else {
+					return false
+				}
+			}
+			return false
+		},
+		tabClick(index) {
+			//轮播图切换
+			this.current = index
+		},
+		swiperChange(e) {
+			//轮播切换
+			const index = e.detail.current
+			this.swiperCurrent = index
+		},
+		navToDetailPage(pros) {
+			//跳转商品详情页
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.recommend-list {
+		width: 100%;
+		height: 1100rpx;
+		position: relative;
+		padding-bottom: 20rpx;
+		.tui-banner-swiper {
+			width: 100%;
+			margin: 0 auto;
+			height: 1100rpx;
+			overflow: hidden;
+			transform: translateY(0);
+			.floor-item {
+				width: 339rpx;
+				height: 516rpx;
+				margin-right: 20rpx;
+				font-size: $font-size-24;
+				color: $text-color;
+				background: #ffffff;
+				line-height: 36rpx;
+				border-radius: 16rpx;
+				margin-bottom: 20rpx;
+				float: left;
+				box-sizing: border-box;
+				position: relative;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				.item-img {
+					width: 339rpx;
+					height: 339rpx;
+					border-radius: 16rpx 16rpx 0 0;
+					display: block;
+					margin-bottom: 8rpx;
+				}
+				.floor-item_tag {
+					width: 100%;
+					height: 32rpx;
+					float: left;
+					margin: 20rpx 0;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+					text {
+						display: inline-block;
+						padding: 0 8rpx;
+						border: 1px solid #e3ebf7;
+						border-radius: 8rpx;
+						color: #9aa5b5;
+						font-size: $font-size-22;
+						line-height: 32rpx;
+						text-align: center;
+						float: left;
+					}
+				}
+				.floor-item-content {
+					width: 100%;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+				.floor-item-act {
+					display: block;
+					width: 100%;
+					height: 32rpx;
+					text-align: center;
+					box-sizing: border-box;
+				}
+				.title-none {
+					font-size: $font-size-26;
+					color: #ff2a2a;
+					line-height: 54rpx;
+				}
+				.title {
+					width: 100%;
+					height: 70rpx;
+					display: flex;
+					line-height: 35rpx;
+					flex-direction: column;
+					margin: 8rpx 0;
+					padding: 0;
+					position: relative;
+					.mclap {
+						width: 100%;
+						line-height: 35rpx;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						word-break: break-all;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						overflow: hidden;
+						font-size: 26rpx;
+						&.indent {
+							text-indent: 95rpx;
+						}
+					}
+					.mclap-tag {
+						display: block;
+						width: 84rpx;
+						height: 32rpx;
+						background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+						border-radius: 4rpx 48rpx 4px 4px;
+						line-height: 32rpx;
+						font-size: $font-size-22;
+						color: #ffffff;
+						text-align: center;
+						position: absolute;
+						left: 0;
+						top: 0;
+					}
+				}
+				.no-price {
+					height: 54rpx;
+					line-height: 54rpx;
+					display: flex;
+					box-sizing: border-box;
+					.p-no {
+						font-size: $font-size-28;
+						color: $text-color;
+						display: block;
+						float: left;
+					}
+					.p-stars {
+						float: left;
+					}
+				}
+				.price {
+					color: #ff2a2a;
+					line-height: 54rpx;
+					&.none {
+						text-decoration: line-through;
+						color: #999999;
+					}
+					.sm {
+						font-size: $font-size-24;
+					}
+					.big {
+						font-size: $font-size-28;
+					}
+				}
+			}
+		}
+	}
+	.swiper__recommenddots-box {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 60rpx;
+		.swiper__dots-item {
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 100%;
+			margin-left: 6px;
+			background-color: rgba(225, 86, 22, 0.3);
+		}
+		.swiper__dots-long {
+			width: 32rpx;
+			height: 8rpx;
+			border-radius: 4rpx;
+			background-color: #FF5B00;
+			transition: all 0.4s;
+		}
+	}
+}
+</style>

pages/supplier/components/homeIndex/template-page/templateL.vue

@@ -0,0 +1,194 @@
+<template>
+	<view class="section_page_main clearfix">
+		<view class="recommend-list">
+			<cm-simple-swiper
+				@change="onChange"
+				:current="current"
+				:circular="true"
+				:swiperHeight="1120"
+				:indicatorDots="true"
+				:indicatorColor="'rgba(255, 255, 255, 0.39)'"
+				:indicator-active-color="'#FFFFFF'"
+				:data="productList"
+				:columns="2"
+				:rows="swiperRows"
+				:gapY="12"
+				:gapX="12"
+				:autoFill="true"
+				:autoplay="autoplay"
+				padding="0 10rpx"
+			>
+				<template v-slot:slide="{ row }">
+					 <template-product :data="row.product"></template-product>
+				</template>
+			</cm-simple-swiper>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import CmSimpleSwiper from '@/components/cm-simple-swiper/cm-simple-swiper.vue'
+import TemplateProduct from '@/components/cm-module/pageTemplate/template-product.vue'
+export default {
+	name: 'templateH',
+	components: {
+		CmSimpleSwiper,
+		TemplateProduct 
+	},
+	props: {
+		pageData: {
+			type: Object
+		},
+		userIdentity: {
+			type: Number
+		},
+		autoplay: {
+		    type: Boolean,
+		    default: true
+		},
+	},
+	data() {
+		return {
+			shopId: 0,
+			productList: [],
+			current: 0,
+			swiperCurrent: 0,
+			pageSize: 4,
+			productCount: 0
+		}
+	},
+	created() {
+		this.initData(this.pageData)
+	},
+	computed: {
+		swiperRows() {
+		    return this.productList.length === 1 ? 1 : 2
+		},
+		swiperHeight() {
+		    return 516 * this.swiperRows
+		}
+	},
+	watch: {
+		pageData: {
+			handler: function(el) {
+				//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.pageData = el
+				this.initData(this.pageData)
+			},
+			deep: true
+		}
+	},
+	methods: {
+		async initData(data) {
+			const userInfo = await this.$api.getStorage()
+			this.shopId = userInfo.shopId ? userInfo.shopId : 0
+			this.productList = data.floorImageList4
+			// if (this.productCount > 0) {
+			// 	this.productList.splice(0, this.productList.length)
+			// 	for (var i = 0, j = data.floorImageList4.length; i < j; i += this.pageSize) {
+			// 		this.productList.push(data.floorImageList4.slice(i, i + this.pageSize))
+			// 	}
+			// }
+		},
+		onChange(e) {
+		    this.current = e.current
+		},
+	}
+}
+</script>
+
+<style lang="scss">
+.section_hot {
+	width: 100%;
+	height: 1290rpx;
+	background: url(https://static.caimei365.com/app/img/hot/hot-bg.png);
+	background-size: cover;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	float: left;
+}
+.tui-group-name {
+	width: 100%;
+	height: 165rpx;
+	box-sizing: border-box;
+	padding: 40rpx 0 20rpx 0;
+	position: relative;
+	.tui-group-r {
+		width: 144rpx;
+		height: 54rpx;
+		background: url(https://static.caimei365.com/app/img/hot/hot-bt@2x.png);
+		background-size: cover;
+		position: absolute;
+		right: 16rpx;
+		top: 69rpx;
+	}
+}
+.tui-group-title {
+	width: 100%;
+	height: 50rpx;
+	line-height: 50rpx;
+	float: left;
+	.tui-group-l {
+		float: left;
+		font-size: 38rpx;
+		font-weight: bold;
+		text-align: left;
+		color: #ffffff;
+	}
+}
+.tui-sub__desc {
+	width: 100%;
+	float: left;
+	line-height: 50rpx;
+	color: #ffffff;
+	font-size: $font-size-28;
+}
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.recommend-list {
+		width: 100%;
+		height: 1100rpx;
+		position: relative;
+		padding-bottom: 20rpx;
+		.tui-banner-swiper {
+			width: 100%;
+			margin: 0 auto;
+			height: 1100rpx;
+			overflow: hidden;
+			transform: translateY(0);
+			
+		}
+	}
+	.swiper__recommenddots-box {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 60rpx;
+		.swiper__dots-item {
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 100%;
+			margin-left: 6px;
+			background-color: #ffffff;
+		}
+		.swiper__dots-long {
+			width: 32rpx;
+			height: 8rpx;
+			border-radius: 4rpx;
+			background-color: #ffffff;
+			transition: all 0.4s;
+		}
+	}
+}
+</style>

pages/tabBar/home/components/banner.vue

@@ -0,0 +1,312 @@
+<template>
+	<view class="banner">
+<!-- 		<view class="swiper-banner-msg">
+			<view class="content">
+				<view class="item le">
+					<view class="item-icon">
+						<text class="iconfont icon-zhengpin1"></text>
+					</view>
+					<view class="item-sm">
+						<text>正品保证</text>
+					</view>
+				</view>
+				<view class="item ce">
+					<view class="item-icon">
+						<text class="iconfont icon-jigou1"></text>
+					</view>
+					<view class="item-sm">
+						<text>12000+机构</text>
+					</view>
+				</view>
+				<view class="item ri">
+					<view class="item-sm">
+						<text>100+供应商</text>
+					</view>
+					<view class="item-icon">
+						<text class="iconfont icon-gongyingshang1"></text>
+					</view>
+				</view>
+			</view>
+		</view -->
+		<!-- <view class="tui-rolling-view">
+			<view class="tui-rolling-content">
+				<view class="tui-rolling-news">
+					<text class="tui-roll-label">公告：</text>
+					<swiper vertical autoplay circular interval="3500" class="tui-swiper">
+						<swiper-item v-for="(item, index) in list" :key="index" class="tui-swiper-item">
+							<view class="tui-news-item" @tap="detail(item)">
+								<text class="news-dot"></text> {{ item.title }}
+							</view>
+						</swiper-item>
+					</swiper>
+					<view class="tui-roll-more" @tap="newsList(item)">
+						更多<text class="iconfont icon-xiayibu"></text>
+					</view>
+				</view>
+			</view>
+		</view> -->
+		<view class="swiper-banner-content">
+			<view class="swiper-banner-box">
+				<swiper
+					class="tui-banner-swiper tui-banner tui-skeleton-fillet"
+					:autoplay="true"
+					:interval="5000"
+					:duration="500"
+					@change="swiperChange"
+					:circular="true"
+				>
+					<swiper-item v-for="(item, index) in list" :key="index" @click.stop="NavToDetailPage(item)">
+						<image :src="item.image" class="tui-slide-image" mode="scaleToFill" />
+					</swiper-item>
+				</swiper>
+				<view class="swiper__dots-box" v-if="list.length > 1">
+					<view
+						v-for="(item, idx) in list"
+						:key="idx"
+						:class="[idx === current ? 'swiper__dots-long' : 'none']"
+						:data-index="current"
+						class="swiper__dots-item"
+					>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import cmsMixins from '@/mixins/cmsMixins.js'
+export default {
+	mixins: [cmsMixins],
+	name: 'banner',
+	props: {
+		list: {
+			type: Array
+		}
+	},
+	data() {
+		return {
+			current: 0,
+			StatusBar: this.StatusBar
+		}
+	},
+	created() {
+		
+	},
+	computed: {},
+	methods: {
+		detail(item){// 跳转公告详情
+			this.$api.navigateTo(`/pages/service/news-detailes?id=${item.id}`)
+		},
+		newsList(){// 公告列表
+			this.$api.navigateTo('/pages/service/news-list')
+		},
+		swiperChange(e) {
+			//轮播图切换
+			const index = e.detail.current
+			this.current = index
+		},
+		NavToDetailPage(item) {
+			//跳转
+			this.cmsSysStatistics(1, item.id)
+			this.$api.FlooryNavigateTo(item)
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+.banner {
+	margin-top: 150rpx;
+	background: #f7f7f7;
+}
+.swiper-banner-content {
+	width: 100%;
+	height: auto;
+	position: relative;
+	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
+}
+.swiper-banner-box {
+	width: 100%;
+	height: auto;
+	position: relative;
+	background-size: cover;
+	display: flex;
+	opacity: 1;
+	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
+}
+.tui-banner-swiper {
+	width: 702rpx;
+	margin: 10rpx auto;
+	height: 280rpx;
+	border-radius: 16rpx;
+	overflow: hidden;
+	transform: translateY(0);
+	background: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0) 100%);
+	.banner-item {
+		border-radius: 16rpx;
+	}
+	.tui-slide-image {
+		width: 100%;
+		height: 280rpx;
+		display: block;
+	}
+}
+.swiper__dots-box {
+	position: absolute;
+	bottom: 30rpx;
+	left: 0;
+	right: 0;
+	/* #ifndef APP-NVUE */
+	display: flex;
+	/* #endif */
+	flex: 1;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	.swiper__dots-item {
+		width: 8rpx;
+		height: 8rpx;
+		border-radius: 100%;
+		margin-left: 6px;
+		background-color: rgba(255, 255, 255, 0.7);
+	}
+	.swiper__dots-long {
+		width: 35rpx;
+		height: 8rpx;
+		border-radius: 4rpx;
+		background-color: #ffff;
+		transition: all 0.4s;
+	}
+}
+.swiper-banner-msg {
+	width: 100%;
+	height: 48rpx;
+	box-sizing: border-box;
+	background-color: #FFFFFF;
+	padding: 0 24rpx;
+	.content {
+		width: 100%;
+		height: 48rpx;
+		box-sizing: border-box;
+		padding: 0 24rpx;
+		border-radius: 16rpx;
+		.item {
+			width: 30%;
+			height: 48rpx;
+			float: left;
+			.item-icon{
+				height: 48rpx;
+				line-height: 48rpx;
+				float: left;
+				margin-right: 2px;
+				.iconfont {
+					color: #ffffff;
+					font-size: $font-size-28;
+				}
+			}
+			.item-sm{
+				line-height: 48rpx;
+				font-size: $font-size-22;
+				color: #ffffff;
+				float: left;
+			}
+			&.le {
+				width: 37%;
+				text-align: left;
+			}
+			&.ce {
+				width: 25%;
+				text-align: center;
+			}
+			&.ri {
+				width: 37%;
+				.item-icon{
+					float: right;
+				}
+				.item-sm{
+					float: right;
+				}
+			}
+		}
+	}
+}
+.tui-rolling-view {
+	width: 100%;
+	height: 96rpx;
+	background-color: #FF5B00;
+}
+.tui-rolling-content{
+	width: 100%;
+	height: 100%;
+	box-sizing: border-box;
+	padding: 20rpx 24rpx;
+	border-radius: 24rpx 24rpx 0 0;
+	background-color: #FFFFFF;
+}
+.tui-rolling-news {
+	width: 100%;
+	padding: 0 20rpx;
+	border-radius: 8rpx;
+	box-sizing: border-box;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-wrap: nowrap;
+	line-height: 56rpx;
+	background: #fff7f3;
+	background-size: cover;
+	.tui-roll-label {
+		font-weight: bold;
+		font-size: $font-size-26;
+		color: #ff5b00;
+	}
+	.tui-roll-more {
+		font-size: $font-size-24;
+		color: #999999;
+		.icon-xiayibu {
+			font-size: $font-size-22;
+		}
+	}
+}
+
+.tui-swiper {
+	font-size: 28rpx;
+	height: 50rpx;
+	flex: 1;
+}
+
+.tui-swiper-item {
+	display: flex;
+	align-items: center;
+}
+
+.tui-news-item {
+	width: 480rpx;
+	line-height: 28rpx;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	font-size: $font-size-24;
+	color: #666666;
+	.news-dot {
+		display: inline-block;
+		width: 10rpx;
+		height: 10rpx;
+		background-color: #999999;
+		border-radius: 50%;
+		margin-right: 8rpx;
+		float: left;
+		margin-top: 10rpx;
+	}
+}
+.tui-drop-item {
+	color: #333;
+	height: 80rpx;
+	font-size: 28rpx;
+	padding: 20rpx 40rpx 20rpx 40rpx;
+	box-sizing: border-box;
+	display: inline-block;
+	width: 50%;
+}
+</style>

pages/tabBar/home/components/coupon.vue

@@ -0,0 +1,52 @@
+<template name="navbars">
+	<view>
+		<view class="coupon-content clearfix" @click="navigator('/pages/user/coupon/coupon-collection')">
+			<image src="https://static.caimei365.com/app/img/icon/icon-coupon-banner@2x.png" mode=""></image>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState,mapMutations } from 'vuex'
+	export default{
+		name:'navbars',
+		data() {
+			return{
+				
+			}
+		},
+		created(){
+			
+		},
+		computed: {
+			...mapState(['hasLogin','userInfo','isWxAuthorize'])
+		},
+		methods:{
+			navigator(url){
+				// 友盟埋点收集首页优惠券宣传图点击
+				if (process.env.NODE_ENV != 'development') {
+					this.$uma.trackEvent('Um_Event_homeCouponBannerClick', {
+						Um_Key_PageName: '采美商城首页',
+						Um_Key_SourcePage: '首页优惠券宣传图',
+					})
+				}
+				this.$api.navigateTo(url)
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.coupon-content{
+		width: 100%;
+		height: 254rpx;
+		box-sizing: border-box;
+		padding: 32rpx 24rpx 12rpx 24rpx;
+		background-color: #f7f7f7;
+		image{
+			width: 100%;
+			height: 210rpx;
+			display: block;
+		}
+	}
+</style>

pages/tabBar/home/components/customer.vue

@@ -0,0 +1,394 @@
+<template name="headerNavbar">
+    <!-- 自定义导航栏 -->
+    <view>
+        <view class="navbar-wrap" :class="isScroll ? opacityNav : ''" :style="{
+				height: CustomBar + 78 + 'px',
+				paddingTop: StatusBar + 'px'
+			}">
+            <view class="navbar-text" :style="{
+					color: navbarData.textColor ? navbarData.textColor : '',
+					lineHeight: CustomBar - ( StatusBar + 4 ) + 'px;',
+					fontSize: fontSizeSetting + 'px;',
+					paddingLeft: navbarData.textLeft ? '' : 12 + 'px'
+				}" :class="platformClass">
+                {{ navbarData.title ? navbarData.title : ' ' }}
+            </view>
+            <view class="search-input">
+                <view class="gosearch-btn" @click="this.$api.navigateTo(clickPath)">
+                    <view class="search-icon"><text class="iconfont icon-iconfonticonfontsousuo1"></text></view>
+                    <view class="search-text">{{ hotSearchText }}</view>
+                    <view class="search-btn">搜索</view>
+                </view>
+                <view class="gosearch-kf">
+                    <view class="contact-btn" @click.stop="handleToChat">
+                        <text class="iconfont icon-AIzhushou"></text>
+                    </view>
+                </view>
+            </view>
+            <view class="swiper-banner-nav">
+                <scroll-view class="scroll-view_H" scroll-x="true">
+                    <view class="tui-goods__item active">首页</view>
+                    <view class="tui-goods__item" v-for="(navs, index) in navBarsList"
+                        :key="index"
+                        @click="NavToDetailPage(navs,index)">
+                        {{ navs.name }}
+                    </view>
+                </scroll-view>
+                <view class="swiper-nav-icon" @click="showDropScreenShow">
+                    <text class="iconfont"
+                        :class="dropScreenShow ? 'icon-xiangshangjiantou':'icon-xiangxiajiantou'"></text>
+                </view>
+            </view>
+        </view>
+        <!--顶部下拉筛选弹层 属性-->
+        <tui-top-dropdown backgroundColor="#FFFFFF" :show="dropScreenShow" :height="310" :paddingbtm="10"
+            :translatey="dropScreenH" @close="btnCloseDrop">
+            <scroll-view class="tui-scroll-box" scroll-y :scroll-top="scrollTop">
+                <view class="tui-seizeaseat-24">
+                    <view class="tui-drop-item tui-icon-middle">全部分类</view>
+                    <view class="tui-drop-item tui-icon-middle active">首页</view>
+                    <view class="tui-drop-item tui-icon-middle" v-for="(item, index) in navBarsList" :key="index"
+                        @tap.stop="NavToDetailPage(item,index)" :data-index="index">
+                        {{ item.name }}
+                    </view>
+                </view>
+            </scroll-view>
+        </tui-top-dropdown>
+    </view>
+</template>
+
+<script>
+    var self
+    export default {
+        name: 'headerNavbar',
+        components: {},
+        props: {
+            navbarData: {
+                // 由父页面传递的数据
+                type: Object
+            },
+            navBarsList: {
+                type: Array
+            },
+            isScroll: {
+                type: Boolean,
+                default: () => false
+            }
+        },
+        data() {
+            return {
+                clickPath: '/pages/search/search',
+                hotSearchText: '搜索商品/项目仪器',
+                CustomBar: this.CustomBar, // 顶部导航栏高度
+                StatusBar: this.StatusBar,
+                fontSizeSetting: this.fontSizeSetting,
+                screenWidth: this.screenWidth,
+                capsule: this.capsule,
+                platformClass: this.platformClass,
+                opacityNav: 'opacityNav', // 渐变颜色
+                height: 64, //header高度
+                scrollTop: 0,
+                dropScreenH: this.CustomBar + 78, //下拉筛选框距顶部距离
+                dropScreenShow: false,
+                animationData: {}
+
+            }
+        },
+        created() {
+            if (getCurrentPages().length === 1) {
+                // 当只有一个页面时
+                this.navbarData.haveBack = false
+            } else {
+                this.navbarData.haveBack = true
+            }
+            let obj = {}
+            // #ifdef MP-WEIXIN
+            obj = wx.getMenuButtonBoundingClientRect()
+            // #endif
+            uni.getSystemInfo({
+                success: res => {
+                    this.height = obj.top ? obj.top + obj.height + 8 : res.statusBarHeight + 44
+                    //略小，避免误差带来的影响
+                    this.dropScreenH = (this.height * 750) / res.windowWidth + 148
+                }
+            })
+            console.log('dropScreenH', this.dropScreenH)
+        },
+        onLoad() {},
+        onPageScroll(e) {
+            console.log(e)
+        },
+        methods: {
+            BackPage: function() {
+                this.$emit('navigateBack')
+            },
+            _goSearchPath: function() {
+                this.$emit('goSearchPath')
+            },
+            _goHome: function() {
+                uni.switchTab({
+                    url: '/pages/tabBar/home/index'
+                })
+            },
+            NavToDetailPage(item, index) { //跳转
+                if (index === 3) {
+                    let linkPath = 'https://static.caimei365.com/app/caimei-activity-h5/html/2023/activity_02.html'
+                    this.$api.navigateTo(`/pages/h5/activity/activity?link=${linkPath}&linkId=382`)
+                } else {
+                    /**
+                     * 页面跳转
+                     **/
+                    this.$api.FlooryNavigateTo(item)
+                }
+            },
+            showDropScreenShow() {
+                this.dropScreenShow = !this.dropScreenShow
+                if (this.dropScreenShow) {
+                    // 禁止页面滚动  
+                    uni.setScrollEnabled(false)
+                } else {
+                    // 禁止页面滚动
+                    uni.setScrollEnabled(true)
+                }
+            },
+            btnCloseDrop() {
+                this.dropScreenShow = false
+            },
+            handleToChat(){
+                this.$api.navigateTo('/pages/user/chats/index')
+            },
+            handleContact(e) {
+                console.log(e.detail.path)
+                console.log(e.detail.query)
+            }
+        },
+        onShow() {}
+    }
+</script>
+
+<style lang="scss" scoped>
+    .navbar-wrap {
+        position: fixed;
+        width: 100%;
+        top: 0;
+        z-index: 9999;
+        box-sizing: border-box;
+        background: #ffffff url(https://static.caimei365.com/app/img/bg/home_cumres_bg@2x.png);
+        background-size: cover;
+        border-bottom: none;
+    }
+    
+    .opacityNav {}
+
+    .navbar-text {
+        font-size: 30rpx;
+        color: #000000;
+        font-weight: 500;
+    }
+
+    .navbar-text.center {
+        text-align: center;
+    }
+
+    .navbar-text.left {
+        text-align: left;
+        padding-left: 45px;
+    }
+
+    .navbar-icon {
+        position: fixed;
+        display: flex;
+        box-sizing: border-box;
+    }
+
+    .navbar-icon .iconfont {
+        display: inline-block;
+        overflow: hidden;
+        font-size: 44rpx;
+        padding-right: 40rpx;
+        margin-top: 1px;
+    }
+
+    .navbar-icon .icon-iconfonticonfontsousuo1 {
+        color: #000000;
+    }
+
+    .navbar-icon view {
+        height: 18px;
+        border-left: 0.5px solid rgba(0, 0, 0, 0.3);
+        margin-top: 6px;
+    }
+
+    .navbar-loading {
+        background: #fff;
+        text-align: center;
+    }
+
+    .search-input {
+        width: 100%;
+        height: 70rpx;
+        padding: 0 24rpx 0rpx 24rpx;
+        box-sizing: border-box;
+        margin-top: 10rpx;
+        .gosearch-btn {
+            width: 632rpx;
+            height: 100%;
+            padding: 5rpx;
+            border-radius: 40rpx;
+            background: #f0f0f0;
+            color: #8a8a8a;
+            background: #ffffff;
+            position: relative;
+            box-sizing: border-box;
+            padding-left: 80rpx;
+            border: 1px solid #ff5b00;
+            float: left;
+
+            .search-icon {
+                width: 80rpx;
+                height: 56rpx;
+                position: absolute;
+                left: 0;
+                top: 9rpx;
+                text-align: center;
+                line-height: 56rpx;
+
+                .icon-iconfonticonfontsousuo1 {
+                    margin: 0 6rpx;
+                    font-size: $font-size-40;
+                    color: #8a8a8a;
+                    z-index: 10;
+                }
+            }
+
+            .search-text {
+                font-size: $font-size-24;
+                line-height: 56rpx;
+                color: #8a8a8a;
+                float: left;
+            }
+
+            .search-btn {
+                width: 120rpx;
+                height: 58rpx;
+                border-radius: 30rpx;
+                background: $btn-confirm;
+                line-height: 58rpx;
+                text-align: center;
+                font-size: $font-size-28;
+                color: #ffffff;
+                float: right;
+            }
+        }
+
+        .gosearch-kf {
+            width: 70rpx;
+            height: 70rpx;
+            border-radius: 50%;
+            float: left;
+            line-height: 70rpx;
+            text-align: center;
+            .contact-btn {
+                width: 70rpx;
+                height: 70rpx;
+                background-color: rgba(0, 0, 0, 0);
+                line-height: 70rpx;
+                text-align: center;
+                .iconfont {
+                    font-size: 50rpx;
+                    color: #ff5b00;
+                }
+            }
+        }
+    }
+
+    .swiper-banner-nav {
+        width: 100%;
+        height: 80rpx;
+        box-sizing: border-box;
+        padding: 15rpx 76rpx 15rpx 24rpx;
+        overflow: hidden;
+        display: flex;
+        align-items: center;
+        position: relative;
+
+        .swiper-nav-icon {
+            width: 76rpx;
+            height: 80rpx;
+            line-height: 80rpx;
+            text-align: center;
+            position: absolute;
+            right: 0;
+            top: 0;
+
+            .iconfont {
+                font-size: $font-size-28;
+                color: #666666;
+            }
+        }
+
+        .scroll-view_H {
+            white-space: nowrap;
+            width: 100%;
+
+            .tui-goods__item {
+                display: inline-block;
+                margin: 0 20rpx;
+                height: 50rpx;
+                line-height: 50rpx;
+                font-size: $font-size-24;
+                color: #333333;
+                text-align: center;
+
+                &.active {
+                    color: #ff5b00;
+                    font-weight: bold;
+                    position: relative;
+
+                    &::before {
+                        content: '';
+                        width: 20rpx;
+                        height: 4rpx;
+                        border-radius: 2rpx;
+                        background: #ff5b00;
+                        position: absolute;
+                        bottom: 0;
+                        left: 50%;
+                        margin-left: -10rpx;
+                    }
+                }
+            }
+        }
+    }
+    .tui-scroll-box {
+        height: 280rpx;
+        overflow: hidden;
+    }
+
+    .tui-seizeaseat-24 {
+        width: 100%;
+        height: auto;
+        box-sizing: border-box;
+        padding: 24rpx;
+
+        .tui-drop-item {
+            padding: 0 20rpx;
+            height: 56rpx;
+            float: left;
+            line-height: 56rpx;
+            background: #f5f5f5;
+            font-size: 24rpx;
+            margin: 12rpx 8rpx;
+            text-align: center;
+            border: 1px solid #f5f5f5;
+            color: #333333;
+            border-radius: 28rpx;
+
+            &.active {
+                background: #ffffff;
+                border-color: #ff5b00;
+                color: #ff5b00;
+            }
+        }
+    }
+</style>

pages/tabBar/home/components/hotFloor.vue

@@ -0,0 +1,294 @@
+<template>
+	<view>
+		<view class="section_hot clearfix" v-for="(page, index) in list" :key="index">
+			<view class="tui-group-name">
+				<view class="tui-group-title">
+					<view class="tui-group-l">{{ page.title }}</view>
+				</view>
+				<view class="tui-sub__desc">{{ page.detail }}</view>
+				<view
+					class="tui-group-r"
+					@click="NavtoHotPage"
+				>
+				</view>
+			</view>
+			<template>
+				<templateL :pageData="page" :userIdentity="userIdentity" :autoplay="autoplay"></templateL>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+import templateL from './template-page/templateL.vue'
+export default {
+	name: 'pageFloor',
+	components: {
+		templateL
+	},
+	props: {
+		list: {
+			type: Array
+		},
+		userIdentity: {
+			type: Number
+		},
+		autoplay: {
+		    type: Boolean,
+		    default: true
+		},
+	},
+	data() {
+		return {
+			
+		}
+	},
+	created() {
+		
+	},
+	watch: {
+		list: {
+			handler: function (el) {//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.list = el
+			},
+			deep: true
+		}
+	},
+	methods: {
+		NavtoHotPage(){//跳新品橱窗页
+			this.$api.navigateTo('/pages/goods/good-hot')
+		},
+		NavToDetailPage(page) {
+			//跳转
+			this.$api.navigateTo(
+				`/pages/goods/good-floorMore?pageType=${this.pageType}&floorId=${page.id}&title=${
+					page.title
+				}`
+			)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.section_hot {
+	width: 100%;
+	height: 1290rpx;
+	background: url(https://static.caimei365.com/app/img/hot/hot-bg.png);
+	background-size: cover;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	float: left;
+	border-radius: 50rpx 50rpx 0 0;
+}
+.tui-group-name {
+	width: 100%;
+	height: 165rpx;
+	box-sizing: border-box;
+	padding: 40rpx 0 20rpx 0;
+	position: relative;
+	border-radius: 16rpx 16rpx 0 0;
+	.tui-group-r {
+		width: 144rpx;
+		height: 54rpx;
+		background: url(https://static.caimei365.com/app/img/hot/hot-bt@2x.png);
+		background-size: cover;
+		position: absolute;
+		right: 16rpx;
+		top: 69rpx;
+	}
+}
+.tui-group-title {
+	width: 100%;
+	height: 50rpx;
+	line-height: 50rpx;
+	float: left;
+	.tui-group-l {
+		float: left;
+		font-size: 38rpx;
+		font-weight: bold;
+		text-align: left;
+		color: #ffffff;
+	}
+}
+.tui-sub__desc {
+	width: 100%;
+	float: left;
+	line-height: 50rpx;
+	color: #ffffff;
+	font-size: $font-size-28;
+}
+.section_page_main {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	.recommend-list {
+		width: 100%;
+		height: 1100rpx;
+		position: relative;
+		padding-bottom: 20rpx;
+		.tui-banner-swiper {
+			width: 100%;
+			margin: 0 auto;
+			height: 1100rpx;
+			overflow: hidden;
+			transform: translateY(0);
+			.floor-item {
+				width: 339rpx;
+				height: 516rpx;
+				margin-right: 20rpx;
+				font-size: $font-size-24;
+				color: $text-color;
+				background: #ffffff;
+				line-height: 36rpx;
+				border-radius: 16rpx;
+				margin-bottom: 20rpx;
+				float: left;
+				box-sizing: border-box;
+				position: relative;
+				&:nth-child(2n) {
+					margin-right: 0;
+				}
+				.item-img {
+					width: 339rpx;
+					height: 339rpx;
+					border-radius: 16rpx 16rpx 0 0;
+					display: block;
+					margin-bottom: 8rpx;
+				}
+				.floor-item_tag {
+					width: 100%;
+					height: 32rpx;
+					float: left;
+					margin: 20rpx 0;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+					text {
+						display: inline-block;
+						padding: 0 8rpx;
+						border: 1px solid #e3ebf7;
+						border-radius: 8rpx;
+						color: #9aa5b5;
+						font-size: $font-size-22;
+						line-height: 32rpx;
+						text-align: center;
+						float: left;
+					}
+				}
+				.floor-item-content {
+					width: 100%;
+					padding: 0 20rpx;
+					box-sizing: border-box;
+				}
+				.floor-item-act {
+					display: block;
+					width: 100%;
+					height: 32rpx;
+					text-align: center;
+					box-sizing: border-box;
+				}
+				.title-none {
+					font-size: $font-size-26;
+					color: #ff2a2a;
+					line-height: 54rpx;
+				}
+				.title {
+					width: 100%;
+					height: 70rpx;
+					display: flex;
+					line-height: 35rpx;
+					flex-direction: column;
+					margin: 8rpx 0;
+					padding: 0;
+					position: relative;
+					.mclap {
+						width: 100%;
+						line-height: 35rpx;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						word-break: break-all;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						overflow: hidden;
+						font-size: 26rpx;
+						&.indent {
+							text-indent: 95rpx;
+						}
+					}
+					.mclap-tag {
+						display: block;
+						width: 84rpx;
+						height: 32rpx;
+						background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);
+						border-radius: 4rpx 48rpx 4px 4px;
+						line-height: 32rpx;
+						font-size: $font-size-22;
+						color: #ffffff;
+						text-align: center;
+						position: absolute;
+						left: 0;
+						top: 0;
+					}
+				}
+				.no-price {
+					height: 54rpx;
+					line-height: 54rpx;
+					display: flex;
+					box-sizing: border-box;
+					.p-no {
+						font-size: $font-size-28;
+						color: $text-color;
+						display: block;
+						float: left;
+					}
+					.p-stars {
+						float: left;
+					}
+				}
+				.price {
+					color: #ff2a2a;
+					line-height: 54rpx;
+					&.none {
+						text-decoration: line-through;
+						color: #999999;
+					}
+					.sm {
+						font-size: $font-size-24;
+					}
+					.big {
+						font-size: $font-size-28;
+					}
+				}
+			}
+		}
+	}
+	.swiper__recommenddots-box {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+		height: 60rpx;
+		.swiper__dots-item {
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 100%;
+			margin-left: 6px;
+			background-color: #FFFFFF;
+		}
+		.swiper__dots-long {
+			width: 32rpx;
+			height: 8rpx;
+			border-radius: 4rpx;
+			background-color: #FFFFFF;
+			transition: all 0.4s;
+		}
+	}
+}
+</style>

pages/tabBar/home/components/navbars.vue

@@ -0,0 +1,110 @@
+<template name="navbars">
+	<view class="navbar">
+		<view class="navbars-content clearfix">
+			<view class="nav-item" v-for="(item, index) in navList" :key="index" @click="NavToDetailPage(item, index)">
+				<view class="icon"> <image class="icon-image" :src="item.icon" mode="widthFix"></image> </view>
+				<view class="name">{{ item.name }}</view>
+			</view>
+			<view class="nav-item" @click="handleMore" v-if="list.length === 9 || list.length > 9">
+				<view class="icon">
+					<image
+						class="icon-image"
+						src="https://static.caimei365.com/app/img/icon/icon-navs-more@2x.png"
+						mode="widthFix"
+					></image>
+				</view>
+				<view class="name">更多</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import cmsMixins from '@/mixins/cmsMixins.js'
+export default {
+	mixins: [cmsMixins],
+	name: 'navbars',
+	props: {
+		list: {
+			type: Array
+		}
+	},
+	data() {
+		return {
+			current: 100,
+			navList: []
+		}
+	},
+	created() {
+		this.initData(this.list)
+	},
+	computed: {},
+	methods: {
+		initData(list) {
+			this.navList = list.slice(0, 9)
+		},
+		handleMore() {
+			this.$api.navigateTo('/pages/goods/channel')
+		},
+		NavToDetailPage(pros, index) {
+			// 采美快捷运营点击量统计
+			this.cmsMoudleHits(4, pros.id)
+			this.$api.FlooryNavigateTo(pros)
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+.navbar {
+	background: #f7f7f7;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+    width: 100%;
+    box-sizing: border-box;
+    padding: 0 24rpx;
+}
+.navbars-content {
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	padding: 20rpx 0 0 0;
+	background-color: #fff;
+	border-radius: 16rpx;
+	margin-top: 10rpx;
+	.nav-item {
+		width: 20%;
+		height: auto;
+		float: left;
+		margin-bottom: 12rpx;
+		.icon {
+			width: 80rpx;
+			height: 80rpx;
+			margin: 0 auto;
+			position: relative;
+			.icon-image {
+				width: 80rpx;
+				height: 80rpx;
+				display: block;
+			}
+			.icon-new {
+				width: 44rpx;
+				height: 22rpx;
+				display: block;
+				position: absolute;
+				right: 0;
+				top: 20rpx;
+			}
+		}
+		.name {
+			width: 100%;
+			height: 40rpx;
+			line-height: 40rpx;
+			text-align: center;
+			font-size: $font-size-24;
+			color: #333333;
+		}
+	}
+}
+</style>

pages/tabBar/home/components/pageFloor.vue

@@ -0,0 +1,150 @@
+<template>
+	<view>
+		<view class="page-content clearfix" v-for="(page, index) in list" :key="index">
+			<view class="tui-group-name" v-if="page.floorContent">
+				<view class="tui-group-title">
+					<view class="tui-group-l">{{ page.title }}</view>
+					<view
+						class="tui-group-r"
+						v-if="page.floorContent.templateType != '8'"
+						@click="NavToDetailPage(page)"
+					>
+						<text>更多</text> <text class="iconfont icon-xiayibu"></text>
+					</view>
+				</view>
+				<view class="tui-sub__desc">{{ page.detail }}</view>
+			</view>
+
+			<template v-if="page.floorContent.templateType == '1'">
+				<templateA :pageData="page" :userIdentity="userIdentity"></templateA>
+			</template>
+			<template v-if="page.floorContent.templateType == '2'">
+				<templateB :pageData="page" :userIdentity="userIdentity"></templateB>
+			</template>
+			<template v-if="page.floorContent.templateType == '3'">
+				<templateC :pageData="page" :userIdentity="userIdentity"></templateC>
+			</template>
+			<template v-if="page.floorContent.templateType == '4'">
+				<templateD :pageData="page" :userIdentity="userIdentity"></templateD>
+			</template>
+			<template v-if="page.floorContent.templateType == '5'">
+				<templateE :pageData="page" :userIdentity="userIdentity"></templateE>
+			</template>
+			<template v-if="page.floorContent.templateType == '6'">
+				<templateF :pageData="page" :userIdentity="userIdentity"></templateF>
+			</template>
+			<template v-if="page.floorContent.templateType == '7'">
+				<templateG :pageData="page" :userIdentity="userIdentity"></templateG>
+			</template>
+			<template v-if="page.floorContent.templateType == '8'">
+				<templateH :pageData="page" :userIdentity="userIdentity"></templateH>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+import templateA from './template-page/templateA.vue'
+import templateB from './template-page/templateB.vue'
+import templateC from './template-page/templateC.vue'
+import templateD from './template-page/templateD.vue'
+import templateE from './template-page/templateE.vue'
+import templateF from './template-page/templateF.vue'
+import templateG from './template-page/templateG.vue'
+import templateH from './template-page/templateH.vue'
+export default {
+	name: 'pageFloor',
+	components: {
+		templateA,
+		templateB,
+		templateC,
+		templateD,
+		templateE,
+		templateF,
+		templateG,
+		templateH
+	},
+	props: {
+		list: {
+			type: Array
+		},
+		pageType: {
+			type: Number
+		},
+		userIdentity: {
+			type: Number
+		}
+	},
+	data() {
+		return {
+			pageFloorList: []
+		}
+	},
+	created() {
+		
+	},
+	watch: {
+		list: {
+			handler: function (el) {//监听对象的变换使用 function，箭头函数容易出现this指向不正确
+				this.list = el
+			},
+			deep: true
+		}
+	},
+	methods: {
+		NavToDetailPage(page) {
+			//跳转
+			this.$api.navigateTo(
+				`/pages/goods/good-floorMore?pageType=${this.pageType}&floorId=${page.id}&title=${
+					page.title
+				}`
+			)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.page-content {
+	background-color: #f7f7f7;
+	width: 100%;
+	height: auto;
+	box-sizing: border-box;
+	padding: 0 24rpx;
+	float: left;
+}
+.tui-group-name {
+	width: 100%;
+	height: 92rpx;
+	padding: 20rpx 0;
+}
+.tui-group-title {
+	width: 100%;
+	float: left;
+	.tui-group-l {
+		float: left;
+		font-size: 34rpx;
+		font-weight: bold;
+		text-align: left;
+		line-height: 49rpx;
+		color: #333;
+	}
+	.tui-group-r {
+		float: right;
+		font-size: $font-size-24;
+		text-align: right;
+		line-height: 49rpx;
+		color: #999999;
+		.icon-xiayibu {
+			font-size: $font-size-30;
+			color: #999999;
+		}
+	}
+}
+.tui-sub__desc {
+	width: 100%;
+	float: left;
+	color: rgba(153, 153, 153, 0.9);
+	font-size: $font-size-26;
+}
+</style>

pages/tabBar/home/components/pageSpecial.vue

@@ -0,0 +1,492 @@
+<template name="pagesProduct">
+	<view>
+		<view class="container-pages">
+			<scroll-view scroll-x class="tui-goods__scroll-view">
+				<view class="tui-goods__list">
+					<view class="tui-goods__item ross" v-if="shopAdvert.length>0">
+						<swiper class="tui-goods__ross" 
+								circular 
+								@change="swiperChange"
+								:indicator-dots="false" 
+								:autoplay="true"
+								:interval="5000"
+								:duration="500"
+							>
+							<swiper-item v-for="(item, index) in shopAdvert" :key="item">
+								<view class="tui-goods__ross" @click="NavToDetailPage(item)">
+									<image class="ross-image" :src="item.appImage" mode=""></image>
+								</view>
+							</swiper-item>
+						</swiper>
+						<view class="swiper__dots-box">
+						    <view
+						        v-for="(item, idx) in shopAdvert"
+						        :key="idx"
+						        :class="[idx === current ? 'swiper__dots-long' : 'none']"
+						        :data-index="current"
+						        class="swiper__dots-item"
+						    ></view>
+						</view>
+					</view>
+					<view class="tui-goods__item" v-if="tempData.liveList != ''">
+						<view class="tui-group-name" @click="LiveGoPath">
+							<view class="tui-group-title"><text>采美LIVE</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(live, flIndex) in tempData.liveList"
+							:key="flIndex"
+							@click="LiveGoPathPros(live)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="live.homePageImage" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ live.liveTitle }}</view>
+								<view class="tui-goods__statu">
+									<text class="iconfont icon-weikaishi" v-if="live.liveStatus == 1"></text>
+									<image
+										:src="iconLive"
+										mode="widthFix"
+										class="icon-live"
+										v-if="live.liveStatus == 2"
+									></image>
+									<text class="iconfont icon-jieshu" v-if="live.liveStatus == 3"></text>
+									<text>{{ live.liveStatus | statusType }}</text>
+								</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ live.liveTitle }}</view>
+						</view>
+					</view>
+					<view class="tui-goods__item" v-if="tempData.cmImageList != ''">
+						<view class="tui-group-name" @click="NewActivityList">
+							<view class="tui-group-title"><text>最新活动</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(cmImage, flIndex) in tempData.cmImageList"
+							:key="flIndex"
+							@click="NewActivityListPath(cmImage)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="cmImage.homePageImage" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ cmImage.title }}</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ cmImage.title }}</view>
+						</view>
+					</view>
+					<view class="tui-goods__item" v-if="tempData.infoList != ''">
+						<view
+							class="tui-group-name"
+							@click="NavArticlePath('https://www.caimei365.com/info/center-3-1.html')"
+						>
+							<view class="tui-group-title"><text>热门文章</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(info, flIndex) in tempData.infoList"
+							:key="flIndex"
+							@click="NavArticlePath(info.link)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="info.homePageImage" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ info.title }}</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ info.title }}</view>
+						</view>
+					</view>
+					<!-- 采美百科 -->
+					<view class="tui-goods__item" v-if="tempData.baikeList.length > 0">
+						<view
+							class="tui-group-name"
+							@click="NavArticlePath('https://www.caimei365.com/encyclopedia/product.html')"
+						>
+							<view class="tui-group-title"><text>热门百科</text></view>
+							<view class="iconfont icon-xiayibu"></view>
+						</view>
+						<view
+							class="tui-goods__main"
+							:class="flIndex == 0 ? 'one' : ''"
+							v-for="(item, flIndex) in tempData.baikeList"
+							:key="flIndex"
+							@click="NavArticlePath(item.link)"
+						>
+							<view class="tui-goods__imgbox" v-if="flIndex === 0">
+								<image :src="item.image" mode="" class="tui-goods__img"></image>
+								<view class="tui-goods__name">{{ item.name }}</view>
+							</view>
+							<view class="tui-goods__text" v-if="flIndex > 0">{{ item.name }}</view>
+						</view>
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+	</view>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex'
+import cmsMixins from '@/mixins/cmsMixins.js'
+export default {
+	mixins: [cmsMixins],
+	name: 'pagesProduct',
+	props: {
+		templateData: {
+			type: Object
+		}
+	},
+	data() {
+		return {
+			tempData: {},
+			current: 0 ,// 切换轮播
+			iconLive: 'https://static.caimei365.com/app/img/icon/icon-live.gif'
+		}
+	},
+	filters: {
+		statusType: function(value) {
+			switch (value) {
+				case 1:
+					return '未开始'
+					break
+				case 2:
+					return '直播中'
+					break
+				case 3:
+					return '看回放'
+					break
+			}
+		},
+		NumFormat: function(value) {
+			//处理金额
+			return Number(value).toFixed(2)
+		}
+	},
+	created() {
+		this.initData(this.templateData)
+	},
+	computed: {
+		...mapState(['shopAdvert'])
+	},
+	methods: {
+		initData(data) {
+			this.tempData = data
+		},
+		swiperChange(e) {//轮播图切换
+			this.current = e.detail.current
+		},
+		NavToDetailPage(item) {
+            console.log(item)
+            // 采美供应商广告图点击量统计
+            this.cmsMoudleHits(5, item.id)
+			//跳转
+			this.$api.FlooryNavigateTo(item)
+		},
+		NavArticlePath(LINK) {
+			// 友盟埋点首页文章模块点击
+			if (process.env.NODE_ENV != 'development') {
+				this.$uma.trackEvent('Um_Event_HomeArticleTemplateClick', {
+					Um_Key_ArticleLink: `${LINK}`,
+					Um_Key_PageName: '首页文章模块',
+					Um_Key_SourcePage: '商城首页'
+				})
+			}
+			// 采美埋点首页文章模块数据统计
+			this.cmsSysStatistics(4)
+			this.$api.navigateTo(`/pages/h5/article/path?link=${LINK}`)
+		},
+		NewActivityList() {
+			this.$api.navigateTo('/pages/h5/activity/activity-list')
+		},
+		NewActivityListPath(pros) {
+			// 友盟埋点首页活动模块点击
+			if (process.env.NODE_ENV != 'development') {
+				this.$uma.trackEvent('Um_Event_HomeActivityTemplateClick', {
+					Um_Key_ActivityName: `${pros.title}`,
+					Um_Key_PageName: '首页活动模块',
+					Um_Key_SourcePage: '商城首页'
+				})
+			}
+			// 采美埋点首页活动模块数据统计
+			this.cmsSysStatistics(3)
+			/**
+			 * 页面跳转类型
+			 * 1、二级页面,2、搜索项目仪器,3、直播页面,4、自由页面,5、商品详情,6、仪器项目详情,7、供应商主页
+			 * 8、专题活动页,9、二手市场介绍,10、二手商品列表,11、二手商品发布,12、商品搜索,13、信息详情
+			 * 14、品牌招商介绍页,15、维修保养介绍页,16、首页,17、注册页,18、信息中心,19、供应商列表
+			 **/
+			if (pros.linkType) {
+				console.log(pros.linkType)
+				const typeMap = {
+					1: `/pages/goods/goods-instrument?linkId=${pros.linkParam.id}&title=${pros.name}`,
+					2: `/pages/goods/instrument-details?id=${pros.linkParam.id}`,
+					4:`/pages/h5/activity/activity?link=${pros.appletsLink}&linkId=${pros.linkParam.id}`,
+					5: `/pages/goods/product?id=${pros.linkParam.id}`,
+					// 7:`/pages/supplier/user/my-shop?shopId=${pros.linkParam.id}`,
+					8: '/pages/h5/activity/activity-list',
+					9: '/pages/second/form/introduce',
+					10: '/pages/second/product/product-list',
+					11: '/pages/second/form/form',
+					12: `/pages/search/search?keyWord=${pros.linkParam.keyword}`,
+					13: `/pages/h5/article/path?link=${pros.link}`,
+					14: `/pages/h5/article/path?link=${pros.link}`,
+					15: `/pages/h5/article/path?link=${pros.link}`,
+					17: '/pages/login/register-select',
+					18: `/pages/h5/article/path?link=${pros.link}`,
+					19: `/pages/search/search-supplier?keyWord=${pros.linkParam.keyword}`,
+					20: `/pages/goods/good-floor?linkId=${pros.linkParam.id}&title=${pros.name}`,
+					21: '/pages/h5/activity/meobohui',
+					22: `/pages/goods/good-floor-temp?linkId=${pros.linkParam.id}&title=${pros.name}`,
+					23: `/pages/h5/activity/activity-topic?linkId=${pros.linkParam.id}`, //活动专题页面
+					25: '/pages/goods/goods-doc-list', //美业资料
+					28: `/pages/h5/article/path?link=${pros.link}`, // 采美认证通
+					29: '/pages/user/coupon/coupon-collection' //领券中心
+				}
+				const url = typeMap[pros.linkType]
+				uni.navigateTo({
+					url: url
+				})
+			}
+            // 采美活动点击量统计
+            this.cmsMoudleHits(3, pros.id)
+		},
+		LiveGoPath() {
+			//查看直播
+			this.$api.navigateTo('/pages/h5/article/path-live')
+
+			// uni.navigateToMiniProgram({
+			// 	appId: 'wx92d650b253f8f2e3',
+			// 	path: '/pages/index/index',
+			// 	extraData: {
+			// 		'data1': 'test'
+			// 	},
+			// 	envVersion: 'develop',
+			// 	success(res) {
+			// 		// 打开成功
+			// 		console.log(res)
+			// 	}
+			// })
+		},
+		LiveGoPathPros(live) {
+			// 友盟埋点首页直播模块点击
+			if (process.env.NODE_ENV != 'development') {
+				this.$uma.trackEvent('Um_Event_HomeLiveTemplateClick', {
+					Um_Key_LiveName: `${live.liveTitle}`,
+					Um_Key_PageName: '首页直播模块',
+					Um_Key_SourcePage: '商城首页'
+				})
+			}
+			// 采美埋点首页直播模块数据统计
+			this.cmsSysStatistics(2)
+			this.$api.navigateTo(`/pages/h5/article/page-image?title=${live.liveTitle}&image=${live.advertisingImage}`)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.container-pages {
+	width: 100%;
+	height: 476rpx;
+	padding:16rpx 24rpx 0 24rpx;
+	float: left;
+	background-color: #f7f7f7;
+	box-sizing: border-box;
+	background-color: #f7f7f7;
+	overflow: hidden;
+	display: flex;
+	align-items: center;
+    .tui-goods__scroll-view{
+        width: 100%;
+        border-radius: 16rpx;
+        overflow: hidden;
+    }
+	.tui-goods__list {
+        width: 100%;
+		display: flex;
+		align-items: center;
+        margin-top: 2px;
+	}
+	.tui-goods__item {
+		background-color: #fff;
+		width: 307rpx;
+		height: 460rpx;
+		border-radius: 16rpx;
+		box-sizing: border-box;
+		margin-right: 16rpx;
+		padding: 17rpx;
+		&.ross{
+			padding: 0;
+			position: relative;
+			.swiper__dots-box{
+				position: absolute;
+				bottom: 30rpx;
+				left: 0;
+				right: 0;
+				/* #ifndef APP-NVUE */
+				display: flex;
+				/* #endif */
+				flex: 1;
+				flex-direction: row;
+				justify-content: center;
+				align-items: center;
+				.swiper__dots-item{
+					width: 8rpx;
+					height: 8rpx;
+					border-radius: 100%;
+					margin-left: 6px;
+					background-color:rgba(255,255,255,.7);
+				}
+				.swiper__dots-long{
+					width: 35rpx;
+					height: 8rpx;
+					border-radius: 4rpx;
+					background-color: #ffff;
+					transition: all 0.4s;
+				}
+			}
+		}
+		.tui-goods__ross{
+			width: 307rpx;
+			height: 460rpx;
+			text-align: center;
+			line-height: 460rpx;
+			color: #fff;
+			font-size: 40rpx;
+			float: left;
+			border-radius: 16rpx;
+            overflow: hidden;
+			.ross-image{
+				width: 100%;
+				height: 100%;
+				display: block;
+			}
+		}
+	}
+	.tui-group-name {
+		width: 100%;
+		height: 36rpx;
+		float: left;
+		margin-bottom: 13rpx;
+		.tui-group-title {
+			font-size: 24rpx;
+			line-height: 36rpx;
+			float: left;
+			color: #333333;
+		}
+		.icon-xiayibu {
+			font-size: 26rpx;
+			line-height: 36rpx;
+			float: right;
+			color: #909090;
+		}
+	}
+	.tui-goods__main {
+		width: 100%;
+		height: auto;
+		float: left;
+		position: relative;
+		&.one {
+			margin-bottom: 14rpx;
+		}
+	}
+	.tui-goods__imgbox {
+		width: 273rpx;
+		height: 273rpx;
+		box-sizing: border-box;
+		border-radius: 8rpx;
+	}
+	.tui-goods__img {
+		max-width: 273rpx;
+		max-height: 273rpx;
+		border-radius: 8rpx;
+		display: block;
+	}
+	.tui-goods__name {
+		width: 100%;
+		height: 48rpx;
+		float: left;
+		line-height: 48rpx;
+		box-sizing: border-box;
+		padding-left: 12rpx;
+		font-size: $font-size-24;
+		color: #ffffff;
+		background-color: rgba(0, 0, 0, 0.4);
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		border-radius: 0 0 8rpx 8rpx;
+	}
+	.tui-goods__statu {
+		padding-left: 45rpx;
+		padding-right: 10rpx;
+		height: 35rpx;
+		position: absolute;
+		top: 17rpx;
+		left: 17rpx;
+		background-color: rgba(0, 0, 0, 0.4);
+		border-radius: 18rpx;
+		line-height: 35rpx;
+		color: #ffffff;
+		text-align: right;
+		font-size: $font-size-20;
+		.icon-live {
+			width: 17rpx;
+			height: 17rpx;
+			display: block;
+			margin: 0 auto;
+			position: absolute;
+			left: 15rpx;
+			top: 9rpx;
+		}
+		.iconfont {
+			width: 35rpx;
+			height: 35rpx;
+			line-height: 35rpx;
+			display: block;
+			position: absolute;
+			left: 10rpx;
+			font-size: $font-size-26;
+			&.icon-weikaishi {
+				color: #e56d00;
+				left: 0;
+			}
+			&.icon-jieshu {
+				color: #ffffff;
+				left: 0;
+				font-size: 22rpx;
+			}
+		}
+	}
+	.tui-goods__text {
+		width: 100%;
+		height: 44rpx;
+		float: left;
+		line-height: 44rpx;
+		box-sizing: border-box;
+		padding-left: 12rpx;
+		font-size: $font-size-24;
+		color: #666666;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		overflow: hidden;
+		position: relative;
+		&::before {
+			content: '';
+			width: 8rpx;
+			height: 8rpx;
+			border-radius: 50%;
+			background-color: #cccccc;
+			position: absolute;
+			left: 0;
+			top: 18rpx;
+		}
+	}
+}
+</style>

pages/tabBar/home/components/supplierList.vue

@@ -0,0 +1,168 @@
+<template>
+    <view class="supplier-content clearfix">
+        <view class="tui-group-name">
+            <view class="tui-group-title">
+                <view class="tui-group-l">优质供应商</view>
+                <view class="tui-group-r" @click="handleMoreShop">
+                    <text>更多</text> <text class="iconfont icon-xiayibu"></text>
+                </view>
+            </view>
+            <view class="tui-sub__desc">采美正品联盟 质量保证</view>
+        </view>
+        <view class="supplier-banner">
+            <image :src="banner" mode=""
+                @click="BannerNavigateTo(supplierObj.linkType,supplierObj.linkParam.id,supplierObj.wwwLink,supplierObj.linkParam.keyword)">
+            </image>
+        </view>
+        <view class="swiper-goods-box">
+            <view class="goods-box-item" v-for="(item,index) in supplierList" :key="index"
+                @click="NavToDetailPage(item)">
+                <image :src="item.image" mode="" class="box-item-image"></image>
+                <view class="box-item-mask">{{ item.supplierName }}</view>
+            </view>
+        </view>
+    </view>
+</template>
+
+<script>
+    export default {
+        name: "supplierList",
+        props: {
+            supplierObj: {
+                type: Object
+            }
+        },
+        data() {
+            return {
+                banner: '',
+                supplierList: []
+            }
+        },
+        created() {
+            this.initData(this.supplierObj)
+        },
+        methods: {
+            initData(data) {
+                this.banner = data.crmImage
+                this.supplierList = data.qualitySupplierList.slice(0, 12)
+            },
+            BannerNavigateTo(linkType, linkId, linkHref, keyword) { //跳转
+                this.$api.BannerNavigateTo(linkType, linkId, linkHref, keyword)
+            },
+            NavToDetailPage(item) { //跳转
+                this.$api.navigateTo(`/pages/supplier/user/my-shop?shopId=${item.linkParam.id}`)
+            },
+            handleMoreShop() {
+            	this.$api.navigateTo('/pages/goods/goods-shop-list')
+            },
+        }
+    }
+</script>
+
+<style lang="scss">
+    .supplier-content {
+        background-color: #F7F7F7;
+        width: 100%;
+        height: auto;
+        box-sizing: border-box;
+        padding: 0 24rpx;
+    }
+
+    .tui-group-name {
+        width: 100%;
+        height: 92rpx;
+        padding: 20rpx 0;
+    }
+
+    .tui-group-title {
+    	width: 100%;
+    	float: left;
+    	.tui-group-l {
+    		float: left;
+    		font-size: 34rpx;
+    		font-weight: bold;
+    		text-align: left;
+    		line-height: 49rpx;
+    		color: #333;
+    	}
+    	.tui-group-r {
+    		float: right;
+    		font-size: $font-size-24;
+    		text-align: right;
+    		line-height: 49rpx;
+    		color: #999999;
+    		.icon-xiayibu {
+    			font-size: $font-size-30;
+    			color: #999999;
+    		}
+    	}
+    }
+
+    .tui-sub__desc {
+        width: 100%;
+        float: left;
+        color: rgba(153, 153, 153, 0.9);
+        font-size: $font-size-26;
+    }
+
+    .supplier-banner {
+        width: 100%;
+        height: 240rpx;
+        float: left;
+        margin-top: 24rpx;
+        border-radius: 16rpx;
+        overflow: hidden;
+        image {
+            width: 100%;
+            height: 240rpx;
+            display: block;
+        }
+    }
+
+    .swiper-goods-box {
+        width: 100%;
+        height: auto;
+        float: left;
+        margin-top: 24rpx;
+
+        .goods-box-item {
+            width: 160rpx;
+            height: 200rpx;
+            float: left;
+            margin-right: 20rpx;
+            margin-bottom: 20rpx;
+            background-color: #FFFFFF;
+
+            &:nth-child(4n) {
+                margin-right: 0;
+            }
+
+            .box-item-image {
+                width: 160rpx;
+                height: 160rpx;
+                display: block;
+                float: left;
+            }
+
+            .box-item-mask {
+                width: 100%;
+                height: 40rpx;
+                line-height: 40rpx;
+                font-size: $font-size-20;
+                text-align: center;
+                color: #666666;
+                background-color: #f9f9f9;
+                float: left;
+                box-sizing: border-box;
+                padding: 0 20rpx;
+                white-space: normal;
+                word-break: break-all;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                display: -webkit-box;
+                -webkit-box-orient: vertical;
+                -webkit-line-clamp: 1;
+            }
+        }
+    }
+</style>