会员权益

pages/component/diy/activityDiy.vue

@@ -0,0 +1,227 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-商会活动 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-activity" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="activity-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<view class="activity-list" :style="{rowGap: itemSpace}" v-if="activityList.length">
+			<view class="list-item flex" v-for="item in activityList" :key="item.id" @click="toDetails(item.id, item.activity_auth)">
+				<image class="item-image" :src="item.images" mode="aspectFill" v-if="showParams.showImg" :style="{ width: imgWidth, height: imgHeight, borderRadius: borderRadius}"></image>
+				<view class="item-info flex-item" :style="{height: imgHeight}">
+					<view class="info-title text-ellipsis" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
+					<view class="info-tag flex align-items-center">
+						<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconTime +')'}" v-if="showStyle.showIcon && iconTime"></view>
+						<text class="text flex-item text-ellipsis" :style="{fontSize: contentSize}">{{item.start_time}} | {{item.week}}</text>
+					</view>
+					<view class="info-tag flex align-items-center" v-if="item.organizing_method == 1">
+						<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconNetwork +')'}" v-if="showStyle.showIcon && iconNetwork"></view>
+						<text class="text flex-item text-ellipsis" :style="{fontSize: contentSize}">报名成功后查看</text>
+					</view>
+					<view class="info-tag flex align-items-center" v-else-if="item.organizing_method == 2">
+						<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconLocation +')'}" v-if="showStyle.showIcon && iconLocation"></view>
+						<text class="text flex-item text-ellipsis" :style="{fontSize: contentSize}">{{item.address}}</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import { mapState } from "vuex"
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "activityDiy",
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				// 活动列表
+				activityList: [],
+			};
+		},
+		computed: {
+			...mapState({
+				themeColor: state => state.app.themeColor
+			}),
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			imgWidth() {
+				return uni.upx2px(this.showStyle.imgWidth * 2) + 'px';
+			},
+			imgHeight() {
+				return uni.upx2px(this.showStyle.imgHeight * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			iconSize() {
+				return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
+			},
+			iconTime() {
+				return svgData.svgToUrl("time", this.showStyle.iconColor)
+			},
+			iconLocation() {
+				return svgData.svgToUrl("location", this.showStyle.iconColor)
+			},
+			iconNetwork() {
+				return svgData.svgToUrl("network", this.showStyle.iconColor)
+			},
+			contentSize() {
+				return uni.upx2px(this.showStyle.contentSize * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getActivityList()
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		methods: {
+			// 获取活动列表
+			getActivityList() {
+				this.$util.request("activity.list", {
+					page: 1,
+					limit: this.showParams.count
+				}).then(res => {
+					if (res.code == 1) {
+						this.activityList = res.data.data
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取活动列表 ', error)
+				})
+			},
+			// 跳转详情
+			toDetails(id, state) {
+				if (state == 2) {
+					if (!uni.getStorageSync("token")) {
+						uni.showModal({
+							title: "系统提示",
+							content: "该活动为会员专属，请登录后查看",
+							confirmColor: this.themeColor,
+							confirmText: "前往登录",
+							success: (res) => {
+								if (res.confirm) {
+									uni.navigateTo({
+										url: "/pages/login/index"
+									})
+								}
+							}
+						})
+						return
+					}
+					this.$util.toPage({
+						mode: 1,
+						path: "/pagesActivity/index/details?id=" + id
+					})
+				} else {
+					this.$util.toPage({
+						mode: 1,
+						path: "/pagesActivity/index/details?id=" + id
+					})
+				}
+			},
+			// 跳转活动列表
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pagesActivity/index/index"
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.diy-activity {
+		.activity-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.activity-list {
+			display: flex;
+			flex-direction: column;
+
+			.list-item {
+				.item-image {
+					margin-right: 32rpx;
+				}
+
+				.item-info {
+					display: flex;
+					flex-direction: column;
+					justify-content: space-between;
+
+					.info-title {
+						color: #5A5B6E;
+						line-height: 1.3;
+					}
+
+					.info-tag {
+						.icon {
+							margin-right: 10rpx;
+						}
+
+						.text {
+							color: #8D929C;
+							line-height: 1.3;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/albumDiy.vue

@@ -0,0 +1,299 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-商会相册 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="component-album" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="album-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<view class="album-list" :style="{rowGap: itemSpace}" v-if="albumList.length">
+			<view class="list-item flex" v-for="item in albumList" :key="item.id" @click="toDetails(item.id)">
+				<view class="item-timeline">
+					<view class="timeline-time" v-if="item.showTime.month && item.showTime.day">
+						<text :style="{fontSize: timeSize}">{{item.showTime.month}}/</text>
+						<text :style="{fontSize: timeSizeSmall}">{{item.showTime.day}}</text>
+					</view>
+					<view class="timeline-time" v-else>{{item.release_date}}</view>
+					<view class="timeline-point" :style="{background: showStyle.iconColor}"></view>
+					<view class="timeline-line"></view>
+				</view>
+				<view class="item-content flex-item">
+					<view class="content-title text-ellipsis-more" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
+					<view class="content-box" v-if="item.files">
+						<block v-if="item.type == 1">
+							<view class="box-single" v-if="item.showImages.length == 1">
+								<image class="image" :src="item.showImages[0]" :style="{borderRadius: borderRadius}" mode="aspectFill"></image>
+							</view>
+							<view class="box-multiple" v-else-if="item.showImages.length">
+								<view class="multiple-image" v-for="(img, index) in item.showImages" :key="index">
+									<image class="image" :src="img" :style="{borderRadius: borderRadius}" mode="aspectFill"></image>
+								</view>
+							</view>
+						</block>
+						<view class="box-cover" v-else-if="item.type == 2">
+							<image class="cover-image" :src="item.image" mode="aspectFill"></image>
+							<image class="cover-play" src="/static/play.png" mode="aspectFit"></image>
+							<view class="cover-mask"></view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "albumDiy",
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				// 相册列表
+				albumList: [],
+			};
+		},
+		computed: {
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			timeSize() {
+				return uni.upx2px(this.showStyle.timeSize * 2) + 'px';
+			},
+			timeSizeSmall() {
+				return uni.upx2px((this.showStyle.timeSize - 4) * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getAlbumList()
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		methods: {
+			// 获取商会相册
+			getAlbumList() {
+				this.$util.request("album.albumDiyList", {
+					limit: this.showParams.count,
+				}).then(res => {
+					if (res.code == 1) {
+						this.albumList = res.data
+						for (let i in this.albumList) {
+							if (this.albumList[i].release_date) {
+								this.albumList[i].showTime = this.cutDate(this.albumList[i].release_date)
+							}
+							if (this.albumList[i].type == 1 && this.albumList[i].files) {
+								if (typeof(this.albumList[i].files) == "string") {
+									this.albumList[i].showImages = this.albumList[i].files.split(",")
+								} else {
+									this.albumList[i].showImages = this.albumList[i].files
+								}
+							}
+						}
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取相册列表', error)
+				})
+			},
+			// 截取日期
+			cutDate(time) {
+				let parts = time.split('/');
+				let result = {}
+				if (parts && parts.length == 3) {
+					result = {
+						month: parts[1],
+						day: parts[2]
+					};
+				}
+				return result
+			},
+			// 跳转相册详情
+			toDetails(id) {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pagesTools/album/details?id=" + id
+				})
+			},
+			// 跳转相册列表
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pagesTools/album/index"
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.component-album {
+		.album-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.album-list {
+			display: flex;
+			flex-direction: column;
+
+			.list-item {
+				.item-timeline {
+					display: flex;
+					flex-direction: column;
+
+					.timeline-time {
+						color: #5A5B6E;
+						font-size: 32rpx;
+						font-weight: 600;
+						line-height: 44rpx;
+					}
+
+					.timeline-point {
+						width: 20rpx;
+						height: 20rpx;
+						border-radius: 4rpx;
+						background: var(--theme-color);
+					}
+
+					.timeline-line {
+						width: 2rpx;
+						height: 100%;
+						flex: 1;
+						background: #F0F0F0;
+					}
+				}
+
+				.item-content {
+					margin-left: 16rpx;
+					position: relative;
+
+					.content-title {
+						color: #5A5B6E;
+						font-size: 28rpx;
+						line-height: 40rpx;
+					}
+
+					.content-box {
+						margin-top: 16rpx;
+
+						.box-single {
+							width: 100%;
+							height: 240rpx;
+							border-radius: 16rpx;
+							overflow: hidden;
+						}
+
+						.box-multiple {
+							display: flex;
+							flex-wrap: wrap;
+							column-gap: 2%;
+							row-gap: 16rpx;
+
+							.multiple-image {
+								width: 32%;
+								height: 0;
+								padding-top: 32%;
+								border-radius: 16rpx;
+								overflow: hidden;
+								position: relative;
+
+								.image {
+									position: absolute;
+									top: 0;
+									left: 0;
+									width: 100%;
+									height: 100%;
+								}
+							}
+						}
+
+						.box-cover {
+							width: 100%;
+							height: 240rpx;
+							border-radius: 16rpx;
+							overflow: hidden;
+							position: relative;
+
+							.cover-image {
+								width: 100%;
+								height: 100%;
+							}
+
+							.cover-play {
+								position: absolute;
+								top: 50%;
+								left: 50%;
+								transform: translate(-50%, -50%);
+								width: 64rpx;
+								height: 64rpx;
+								border-radius: 50%;
+							}
+
+							.cover-mask {
+								position: absolute;
+								top: 0;
+								right: 0;
+								bottom: 0;
+								left: 0;
+								background: rgba(0, 0, 0, 0.3);
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/articleDiy.vue

@@ -0,0 +1,231 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-平台动态 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-article" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="article-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<view class="article-list" :style="{rowGap: itemSpace }" v-if="articleList.length">
+			<view class="list-item" :class="{'flex-row-reverse': showStyle.imgFloat == 'right'}" v-for="(item,index) in articleList" :key="index" @click="toDetails(item)">
+				<view class="item-left" v-if="showParams.showImg">
+					<image mode="aspectFill" :src="item.image" :style="{ width: imgWidth, height: imgHeight, float: showStyle.imgFloat || 'left', borderRadius: borderRadius}"></image>
+				</view>
+				<view class="item-right" :style="{height: imgHeight}">
+					<view class="right-title" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.title}}</view>
+					<view class="right-group flex align-items-center">
+						<view class="group-view flex align-items-center" v-if="showParams.showReadNum">
+							<image class="icon" src="/static/see.png" mode="aspectFit" :style="{width: viewSize, height: viewSize}"></image>
+							<text class="number" :style="{fontSize: dateSize}">{{item.read_num}}</text>
+						</view>
+						<view class="group-date flex-item" :style="{fontSize: dateSize, textAlign: (!showParams.showReadNum && showStyle.imgFloat == 'right') ? 'left' : 'right'}">{{item.createtime}}</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: 'articleDiy',
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				articleList: [],
+			}
+		},
+		computed: {
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			imgWidth() {
+				return uni.upx2px(this.showStyle.imgWidth * 2) + 'px';
+			},
+			imgHeight() {
+				return uni.upx2px(this.showStyle.imgHeight * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			dateSize() {
+				return uni.upx2px(this.showStyle.dateSize * 2) + 'px';
+			},
+			viewSize() {
+				return uni.upx2px((this.showStyle.dateSize + 4) * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getArticleList()
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		methods: {
+			// 获取新闻列表
+			getArticleList() {
+				let catId = ""
+				if (this.showParams.category) {
+					catId = this.showParams.category
+				} else if (this.showParams.link && this.showParams.link.type == "Article") {
+					catId = this.showParams.link.path.split("?id=")[1]
+				}
+				this.$util.request("main.article.list", {
+					page: 1,
+					limit: this.showParams.count,
+					cat_id: catId
+				}).then(res => {
+					if (res.code == 1) {
+						this.articleList = res.data.data
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取新闻列表 ', error)
+				})
+			},
+			// 跳转查看更多
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: `/pages/article/index?id=${this.showParams.category}&title=${encodeURIComponent(this.showParams.titleText || "")}`
+				})
+			},
+			// 跳转新闻详情
+			toDetails(item) {
+				if (item.type == 2) {
+					this.$util.toPage({
+						mode: 4,
+						path: item.link,
+					})
+					this.$util.request("main.article.updateReadNum", { id: item.id })
+				} else {
+					var title = ""
+					if (this.showTitle) title = this.showParams.titleText || ""
+					else title = this.showParams.categoryName || ""
+					this.$util.toPage({
+						mode: 1,
+						path: `/pages/article/details?id=${item.id}&title=${title || ""}`
+					})
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-article {
+		.article-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.article-list {
+			display: flex;
+			flex-direction: column;
+
+			.list-item {
+				overflow: hidden;
+				display: flex;
+				align-items: center;
+				column-gap: 10px;
+
+				&.flex-row-reverse {
+					flex-direction: row-reverse;
+				}
+
+				.item-right {
+					display: flex;
+					flex-direction: column;
+					justify-content: space-between;
+					flex: 1;
+
+					.right-title {
+						line-height: 1.3;
+						color: #333;
+						display: -webkit-box;
+						word-break: break-all;
+						text-overflow: ellipsis;
+						overflow: hidden;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 3;
+					}
+
+					.right-group {
+						margin-top: 16rpx;
+						column-gap: 8px;
+
+						.group-view {
+							.icon {
+								width: 32rpx;
+								height: 32rpx;
+							}
+
+							.number {
+								margin-left: 8rpx;
+								color: #5A5B6E;
+								font-size: 24rpx;
+								line-height: 1.2;
+							}
+						}
+
+						.group-date {
+							color: #5A5B6E;
+							line-height: 1.2;
+							text-align: right;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/blankDiy.vue

@@ -0,0 +1,30 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-辅助空白 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-blank" :style="{height: height, background: showStyle.background, borderRadius: itemBorderRadius}"></view>
+</template>
+
+<script>
+	export default {
+		name: 'blankDiy',
+		props: ['showStyle'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			height() {
+				return uni.upx2px(this.showStyle.height * 2) + 'px';
+			},
+		},
+	}
+</script>

pages/component/diy/carouselDiy.vue

@@ -0,0 +1,147 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-图片轮播 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-carousel" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<swiper class="carousel-list" autoplay :interval="showParams.interval" :duration="500" circular @change='change' :previous-margin="showParams.type === 'card' ? '120rpx' : '0rpx'" :next-margin="showParams.type === 'card' ? '120rpx' : '0rpx'" :style="{height: height, marginTop:showParams.type === 'card' ? '20rpx' : '0rpx', borderRadius: borderRadius}">
+			<swiper-item v-for="(item, index) in showData" :key='index'>
+				<button class="list-item clear" :class="[showParams.type != 'card' ? '' : (current == index ? 'crown-active' : 'crown')]" open-type="contact" :style="{width: iconSize, height: iconSize}" v-if="item.link && item.link.type == 'Service'">
+					<image class="item-img" :src="getImagePath(item.imgUrl)" :style="{ borderRadius: showParams.type === 'card' ? '10rpx' : '0rpx'}" mode="aspectFill" @click="onClick(item.link)"></image>
+				</button>
+				<view class="list-item" :class="[showParams.type != 'card' ? '' : (current == index ? 'crown-active' : 'crown')]" v-else>
+					<image class="item-img" :src="getImagePath(item.imgUrl)" :style="{ borderRadius: showParams.type === 'card' ? '10rpx' : '0rpx'}" mode="aspectFill" @click="onClick(item.link)"></image>
+					<!-- #ifdef H5 -->
+					<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
+						<script type="text/wxtag-template">
+							<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+							<view class="btn"></view>
+						</script>
+					</wx-open-launch-weapp>
+					<!-- #endif -->
+				</view>
+			</swiper-item>
+		</swiper>
+		<view class="carousel-dots flex" :style="{paddingBottom: paddingTop}">
+			<view class="dots-item" :style="{background: current == i ? (showStyle.dotColor || themeColor) : '#ffffff'}" v-for="(d, i) in showData" :key='i'></view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { mapState } from "vuex"
+	export default {
+		name: 'carouselDiy',
+		props: ['showStyle', 'showData', 'showParams', 'domain'],
+		data() {
+			return {
+				current: 0,
+			}
+		},
+		computed: {
+			...mapState({
+				themeColor: state => state.app.themeColor,
+			}),
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			height() {
+				return uni.upx2px(this.showStyle.height * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			// 点击事件
+			onClick(e) {
+				if (!e) return;
+				this.$emit("onClick", e)
+			},
+			// 改变事件
+			change(event) {
+				this.current = event.detail.current
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.diy-carousel {
+		position: relative;
+
+		.carousel-list {
+			overflow: hidden;
+
+			.list-item {
+				position: relative;
+				height: 100%;
+				transition: 1.2s;
+
+				&.crown {
+					transform: scale(0.93, 0.85);
+				}
+
+				&.crown-active {
+					transform: scale(1);
+				}
+
+				.item-img {
+					width: 100%;
+					height: 100%;
+				}
+
+				.item-absolute {
+					display: block;
+					position: absolute;
+					top: 0;
+					left: 0;
+					right: 0;
+					bottom: 0;
+				}
+			}
+		}
+
+		.carousel-dots {
+			display: flex;
+			position: absolute;
+			left: 50%;
+			transform: translateX(-50%);
+			bottom: 24rpx;
+
+			.dots-item {
+				width: 24rpx;
+				height: 8rpx;
+				border-radius: 8rpx;
+				background: #FFFFFF;
+				margin-right: 4rpx;
+
+				&:last-child {
+					margin-right: 0;
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/chainsDiy.vue

@@ -0,0 +1,299 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-活动接龙 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-chains" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="chains-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<view class="chains-list" :style="{rowGap: itemSpace}" v-if="chainsList.length">
+			<view class="list-item" v-for="item in chainsList" :key="item.id" @click="toDetails(item.id, item.jielong_auth)">
+				<view class="item-title text-ellipsis" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
+				<view class="item-tag flex justify-content-between">
+					<view class="tag-box flex" :style="{fontSize: contentSize}">
+						<text style="margin-left: 0;">{{item.expire_time}}</text>
+						<text v-if="item.type == 1">自由接龙</text>
+						<text v-else>限定接龙</text>
+					</view>
+					<view class="tag-box flex" :style="{fontSize: contentSize}">
+						<text>浏览{{item.page_view}}</text>
+						<text>参与{{item.part_total}}</text>
+					</view>
+				</view>
+				<view class="item-btn flex align-items-center">
+					<!-- #ifdef MP-WEIXIN -->
+					<button open-type="share" class="btn-box clear flex align-items-center" @click.stop="setShareData(item)">
+						<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconInvite +')'}" v-if="showStyle.showIcon && iconInvite"></view>
+						<text class="text" :style="{fontSize: btnSize}">邀请填写</text>
+					</button>
+					<!-- #endif -->
+					<!-- #ifndef MP-WEIXIN -->
+					<view class="btn-box flex align-items-center">
+						<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconInvite +')'}" v-if="showStyle.showIcon && iconInvite"></view>
+						<text class="text" :style="{fontSize: btnSize}">填写接龙</text>
+					</view>
+					<!-- #endif -->
+					<view class="btn-line"></view>
+					<view class="btn-box justify-content-end flex align-items-center" @click.stop="onContact(item.mobile)">
+						<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconPhone +')'}" v-if="showStyle.showIcon && iconPhone"></view>
+						<text class="text" :style="{fontSize: btnSize}">电话</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import { mapState } from "vuex"
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "chainsDiy",
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				chainsList: [],
+			};
+		},
+		computed: {
+			...mapState({
+				themeColor: state => state.app.themeColor,
+				jielongImg: state => state.app.jielongImg,
+			}),
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			contentSize() {
+				return uni.upx2px(this.showStyle.contentSize * 2) + 'px';
+			},
+			iconSize() {
+				return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
+			},
+			btnSize() {
+				return uni.upx2px(this.showStyle.btnSize * 2) + 'px';
+			},
+			iconInvite() {
+				return svgData.svgToUrl("invite", this.showStyle.iconColor)
+			},
+			iconPhone() {
+				return svgData.svgToUrl("phone", this.showStyle.iconColor)
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getChainsList()
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		methods: {
+			// 获取活动接龙
+			getChainsList() {
+				this.$util.request("sequence.chainsList", {
+					page: 1,
+					limit: this.showParams.count,
+				}).then(res => {
+					if (res.code == 1) {
+						this.chainsList = res.data.data
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取接龙列表', error)
+				})
+			},
+			// 跳转接龙详情 
+			toDetails(id, state) {
+				if (state == 2) {
+					this.getMemberState(() => {
+						this.$util.toPage({
+							mode: 1,
+							path: "/pagesTools/sequence/details?id=" + id
+						})
+					})
+				} else {
+					this.$util.toPage({
+						mode: 1,
+						path: "/pagesTools/sequence/details?id=" + id
+					})
+				}
+			},
+			// 获取会员状态
+			getMemberState(fn) {
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})
+				this.$util.request("member.state").then(res => {
+					uni.hideLoading()
+					if (res.code == 1) {
+						if (res.data.state.state == 6) {
+							fn()
+						} else if (res.data.state.state == -1) {
+							uni.showModal({
+								title: "系统提示",
+								content: "此页面需成为会员后可查看！",
+								confirmColor: this.themeColor,
+								confirmText: "去加入",
+								success: (res) => {
+									if (res.confirm) {
+										this.$util.toPage({
+											mode: 1,
+											path: "/pages/member/apply/index"
+										})
+									}
+								}
+							})
+						} else {
+							uni.showModal({
+								title: "系统提示",
+								content: "此页面需成为会员后可查看！",
+								confirmColor: this.themeColor,
+								confirmText: "前往查看",
+								success: (res) => {
+									if (res.confirm) {
+										uni.switchTab({
+											url: "/pages/mine/index"
+										})
+									}
+								}
+							})
+						}
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取会员状态 ', error)
+				})
+			},
+			// 跳转接龙列表
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pagesTools/sequence/index"
+				})
+			},
+			// 联系电话
+			onContact(phone) {
+				this.$util.toPage({
+					mode: 6,
+					phone: phone,
+				})
+			},
+			// 设置分享数据
+			setShareData(item) {
+				this.$emit('setShareData', {
+					title: item.name,
+					path: '/pagesTools/sequence/details?id=' + item.id,
+					imageUrl: this.jielongImg,
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.diy-chains {
+		.chains-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.chains-list {
+			display: flex;
+			flex-direction: column;
+
+			.list-item {
+				.item-title {
+					color: #5A5B6E;
+					line-height: 1.3;
+				}
+
+				.item-tag {
+					margin-top: 16rpx;
+
+					.tag-box {
+						text {
+							color: #999999;
+							line-height: 1.4;
+							margin-left: 16rpx;
+						}
+					}
+				}
+
+				.item-btn {
+					margin-top: 32rpx;
+					border-top: 1rpx solid #E8E8E8;
+					padding-top: 32rpx;
+
+					.btn-box {
+						flex: 1;
+						padding: 0 48rpx;
+
+						.text {
+							margin-left: 8rpx;
+							color: #5A5B6E;
+							line-height: 1.4;
+						}
+					}
+
+					.btn-line {
+						width: 0;
+						height: 32rpx;
+						border-left: 1rpx solid #E8E8E8;
+					}
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/cubeDiy.vue

@@ -0,0 +1,266 @@
+	<!-- +----------------------------------------------------------------------
+	| 麦沃德科技赋能开发者，助力商协会发展
+	+----------------------------------------------------------------------
+	| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
+	+----------------------------------------------------------------------
+	| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
+	+----------------------------------------------------------------------
+	| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
+	+----------------------------------------------------------------------
+	| 组件-图片魔方 开发者: 麦沃德科技-半夏 
+	+---------------------------------------------------------------------- -->
+
+	<template>
+		<view class="diy-cube" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+			<!-- 橱窗布局 -->
+			<view class="cube-display" v-if="showStyle.layout == -1 ">
+				<view class="display-left" :style="{width: showStyle.imgWidth + '%', paddingReft: itemSpace}" v-if="showStyle.imgFloat == 'left'">
+					<button class="clear" open-type="contact" v-if="showData[0].link && showData[0].link.type == 'Service'">
+						<image class="image" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+					</button>
+					<block v-else>
+						<image class="image" @click="onClick(showData[0].link)" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+						<!-- #ifdef H5 -->
+						<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[0].link.appid" :path="showData[0].link.path" v-if="showData[0].link && showData[0].link.type == 'WXMp'">
+							<script type="text/wxtag-template">
+								<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+								<view class="btn"></view>
+							</script>
+						</wx-open-launch-weapp>
+						<!-- #endif -->
+					</block>
+				</view>
+				<view class="display-right" :style="'width:' + (100 - showStyle.imgWidth) + '%; ' + (showStyle.imgFloat == 'right' ? ('padding-right:' + itemSpace) : ('padding-left:' + itemSpace))" v-if="showStyle.model == 1">
+					<view class="right-1" v-if="showData.length >= 2" :style="{paddingBottom: itemSpace}">
+						<button class="clear" open-type="contact" v-if="showData[1].link && showData[1].link.type == 'Service'">
+							<image class="image" :src="getImagePath(showData[1].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+						</button>
+						<block v-else>
+							<image class="image" @click="onClick(showData[1].link)" :src="getImagePath(showData[1].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+							<!-- #ifdef H5 -->
+							<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[1].link.appid" :path="showData[1].link.path" v-if="showData[1].link && showData[1].link.type == 'WXMp'">
+								<script type="text/wxtag-template">
+									<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+									<view class="btn"></view>
+								</script>
+							</wx-open-launch-weapp>
+							<!-- #endif -->
+						</block>
+					</view>
+					<view class="right-2" :style="{paddingTop: itemSpace}">
+						<view class="right-2-left" v-if="showData.length >= 3" :style="{paddingRight: itemSpace}">
+							<button class="clear" open-type="contact" v-if="showData[2].link && showData[2].link.type == 'Service'">
+								<image class="image" :src="getImagePath(showData[2].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+							</button>
+							<block v-else>
+								<image class="image" @click="onClick(showData[2].link)" :src="getImagePath(showData[2].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+								<!-- #ifdef H5 -->
+								<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[2].link.appid" :path="showData[2].link.path" v-if="showData[2].link && showData[2].link.type == 'WXMp'">
+									<script type="text/wxtag-template">
+										<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+										<view class="btn"></view>
+									</script>
+								</wx-open-launch-weapp>
+								<!-- #endif -->
+							</block>
+						</view>
+						<view class="right-2-right" v-if="showData.length >= 4" :style="{paddingLeft: itemSpace}">
+							<button class="clear" open-type="contact" v-if="showData[3].link && showData[3].link.type == 'Service'">
+								<image class="image" :src="getImagePath(showData[3].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+							</button>
+							<block v-else>
+								<image class="image" @click="onClick(showData[3].link)" :src="getImagePath(showData[3].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+								<!-- #ifdef H5 -->
+								<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[3].link.appid" :path="showData[3].link.path" v-if="showData[3].link && showData[3].link.type == 'WXMp'">
+									<script type="text/wxtag-template">
+										<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+										<view class="btn"></view>
+									</script>
+								</wx-open-launch-weapp>
+								<!-- #endif -->
+							</block>
+						</view>
+					</view>
+				</view>
+				<view class="display-right" :style="'width:' + (100 - showStyle.imgWidth) + '%; ' + (showStyle.imgFloat == 'right' ? ('padding-right:' + itemSpace) : ('padding-left:' + itemSpace))" v-else>
+					<view class="right-3" :style="{margin: '-' + itemSpace + ' 0', height: `calc(100% + ${itemSpace} + ${itemSpace})`}">
+						<view class="item" v-for="(img, num) in showData" :key="num" v-if="num > 0 && num < 4" :style="{height:`calc(100% / ${showData.length > 4 ? 3 : showData.length - 1})`, padding: itemSpace + ' 0'}">
+							<button class="clear" open-type="contact" v-if="img.link && img.link.type == 'Service'">
+								<image class="image" :src="getImagePath(img.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+							</button>
+							<block v-else>
+								<image class="image" @click="onClick(img.link)" :src="getImagePath(img.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+								<!-- #ifdef H5 -->
+								<wx-open-launch-weapp class="diy-cube-absolute" :appid="img.link.appid" :path="img.link.path" v-if="img.link && img.link.type == 'WXMp'">
+									<script type="text/wxtag-template">
+										<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+										<view class="btn"></view>
+									</script>
+								</wx-open-launch-weapp>
+								<!-- #endif -->
+							</block>
+						</view>
+					</view>
+				</view>
+				<view class="display-left" :style="{width: showStyle.imgWidth + '%', paddingLeft: itemSpace}" v-if="showStyle.imgFloat == 'right'">
+					<button class="clear" open-type="contact" v-if="showData[0].link && showData[0].link.type == 'Service'">
+						<image class="image" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+					</button>
+					<block v-else>
+						<image class="image" @click="onClick(showData[0].link)" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+						<!-- #ifdef H5 -->
+						<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[0].link.appid" :path="showData[0].link.path" v-if="showData[0].link && showData[0].link.type == 'WXMp'">
+							<script type="text/wxtag-template">
+								<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+								<view class="btn"></view>
+							</script>
+						</wx-open-launch-weapp>
+						<!-- #endif -->
+					</block>
+				</view>
+			</view>
+			<!-- 分列布局 -->
+			<view class="cube-list" :style="{margin: '-' + itemSpace}" v-else>
+				<view class="list-item" :style="{width: `calc(100% / ${showStyle.layout})`, padding: itemSpace}" v-for="(item, index) in showData" :key="index">
+					<button class="clear" open-type="contact" v-if="item.link && item.link.type == 'Service'">
+						<image :src="getImagePath(item.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+					</button>
+					<block v-else>
+						<image :src="getImagePath(item.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}" @click="onClick(item.link)"></image>
+						<!-- #ifdef H5 -->
+						<wx-open-launch-weapp class="diy-cube-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
+							<script type="text/wxtag-template">
+								<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+								<view class="btn"></view>
+							</script>
+						</wx-open-launch-weapp>
+						<!-- #endif -->
+					</block>
+				</view>
+			</view>
+		</view>
+	</template>
+
+	<script>
+		export default {
+			name: 'cubeDiy',
+			props: ['showStyle', 'showData', 'domain'],
+			computed: {
+				itemBorderRadius() {
+					return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+				},
+				height() {
+					return uni.upx2px(this.showStyle.height * 2) + 'px';
+				},
+				borderRadius() {
+					return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+				},
+				paddingTop() {
+					return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+				},
+				paddingLeft() {
+					return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+				},
+				itemSpace() {
+					return uni.upx2px(this.showStyle.itemSpace) + 'px';
+				},
+			},
+			methods: {
+				// 获取图片地址
+				getImagePath(url) {
+					if (url.indexOf('http') > -1) {
+						return url
+					} else {
+						return this.domain + url
+					}
+				},
+				// 点击事件
+				onClick(e) {
+					if (!e) return;
+					this.$emit("onClick", e)
+				},
+			}
+		}
+	</script>
+
+	<style lang="scss">
+		.diy-cube {
+			overflow: hidden;
+
+			.cube-list {
+				display: flex;
+				flex-wrap: wrap;
+
+				.list-item {
+					position: relative;
+					width: 100%;
+					height: 100%;
+				}
+			}
+
+			.cube-display {
+				width: 100%;
+				display: flex;
+				align-items: center;
+
+				.display-left {
+					width: 50%;
+					height: 100%;
+					position: relative;
+				}
+
+				.display-right {
+					width: auto;
+					height: 100%;
+					display: flex;
+					flex-direction: column;
+
+					.right-1 {
+						width: 100%;
+						height: 50%;
+						position: relative;
+					}
+
+					.right-2 {
+						width: 100%;
+						height: 50%;
+						display: flex;
+
+						.right-2-left {
+							position: relative;
+							width: 50%;
+							height: 100%;
+						}
+
+						.right-2-right {
+							position: relative;
+							width: 50%;
+							height: 100%;
+						}
+					}
+
+					.right-3 {
+						width: 100%;
+						height: 100%;
+						display: flex;
+						flex-direction: column;
+
+						.item {
+							position: relative;
+							width: 100%;
+							flex: 1;
+						}
+					}
+				}
+			}
+
+			.diy-cube-absolute {
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+			}
+		}
+	</style>

pages/component/diy/demandDiy.vue

@@ -0,0 +1,335 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-会员供需 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-demand" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="demand-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<view class="demand-list" :style="{rowGap: itemSpace }" v-if="demandList.length">
+			<view class="list-item" v-for="(item, index) in demandList" :key="index" @click="toDetails(item.id)">
+				<view class="item-top flex align-items-center">
+					<image class="top-avatar" :src="item.member.avatar" mode="aspectFill"></image>
+					<view class="top-info flex-item">
+						<view class="info-title text-ellipsis">{{ item.member.name }}</view>
+						<view class="info-subtitle text-ellipsis">{{ item.member.level_name }} | {{ item.time }}</view>
+					</view>
+					<view class="top-btn" @click.stop="onContact(item.member.mobile)" :style="{background: showStyle.btnColor, color: showStyle.btnTextColor}" v-if="showParams.showContact">联系TA</view>
+				</view>
+				<view class="item-center">
+					<view class="center-title text-ellipsis" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{ item.title }}</view>
+					<view class="center-content text-ellipsis-more" :style="{fontSize: contentSize}">{{ item.content }}</view>
+					<view class="center-image" :class="{'special-image': (item.images.length < 3 || item.images.length === 4)}" v-if="item.images.length">
+						<view class="image-box" v-for="(img, num) in item.images" :key="num" @click.stop="previewImage(item.images, num)">
+							<image class="image" :src="img" mode="aspectFill"></image>
+						</view>
+					</view>
+				</view>
+				<view class="item-bottom flex justify-content-between align-items-center">
+					<view class="bottom-label flex-item">
+						<view class="label-box inline-flex align-items-center" v-if="item.address">
+							<view class="box-icon" :style="{'background-image': 'url('+ iconAddress +')'}" v-if="iconAddress"></view>
+							<text class="box-text flex-item text-ellipsis" :style="{color: showStyle.addressColor}">{{item.address}}</text>
+							<view class="box-bg" :style="{background: showStyle.addressColor}"></view>
+						</view>
+					</view>
+					<view class="bottom-other flex align-items-center">
+						<view class="other-item flex align-items-center">
+							<image class="icon" src="/static/see.png" mode="aspectFit"></image>
+							<text class="text">{{ item.page_view }}</text>
+						</view>
+						<button open-type="share" class="other-item clear flex align-items-center" @click.stop="setShareData(item)">
+							<image class="icon" src="/static/share.png" mode="aspectFit"></image>
+							<text class="text">分享</text>
+						</button>
+					</view>
+				</view>
+			</view>
+		</view>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: 'demandDiy',
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				demandList: [],
+			}
+		},
+		computed: {
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			contentSize() {
+				return uni.upx2px(this.showStyle.contentSize * 2) + 'px';
+			},
+			iconAddress() {
+				return svgData.svgToUrl("address", this.showStyle.addressColor)
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getDemandList()
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		methods: {
+			// 获取供需列表
+			getDemandList() {
+				this.$util.request("demand.businessDiyList", {
+					limit: this.showParams.count,
+					category_id: this.showParams.category || ""
+				}).then(res => {
+					if (res.code == 1) {
+						let list = res.data || []
+						list.forEach((el) => {
+							el.images = this.splitImages(el.images)
+							if (el.createtime) el.time = this.$util.getDateBeforeNow(el.createtime)
+						});
+						this.demandList = list;
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取供需列表 ', error)
+				})
+			},
+			// 字符串转数组格式图片
+			splitImages(images) {
+				try {
+					if (images) return images.split(',');
+					else return []
+				} catch (error) {
+					return [];
+				}
+			},
+			// 跳转查看更多
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: `/pages/demand/index`
+				})
+			},
+			// 跳转供需详情
+			toDetails(id) {
+				this.$util.toPage({
+					mode: 1,
+					path: `/pagesDemand/demand/details?id=${id}`
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-demand {
+		.demand-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.demand-list {
+			display: flex;
+			flex-direction: column;
+
+			.list-item {
+				.item-top {
+					.top-avatar {
+						width: 96rpx;
+						height: 96rpx;
+						border-radius: 50%;
+					}
+
+					.top-info {
+						margin-left: 24rpx;
+
+						.info-title {
+							color: #5A5B6E;
+							font-size: 32rpx;
+							font-weight: 600;
+							line-height: 44rpx;
+						}
+
+						.info-subtitle {
+							margin-top: 12rpx;
+							color: #666;
+							font-size: 28rpx;
+							line-height: 40rpx;
+						}
+					}
+
+					.top-btn {
+						margin-left: 24rpx;
+						padding: 8rpx 16rpx;
+						color: #FFF;
+						text-align: center;
+						font-size: 24rpx;
+						line-height: 34rpx;
+						border-radius: 8rpx;
+					}
+				}
+
+				.item-center {
+					margin-top: 32rpx;
+
+					.center-title {
+						color: #5A5B6E;
+						font-size: 32rpx;
+						font-weight: 600;
+						line-height: 44rpx;
+					}
+
+					.center-content {
+						margin-top: 24rpx;
+						color: #5A5B6E;
+						font-size: 28rpx;
+						line-height: 40rpx;
+					}
+
+					.center-image {
+						display: flex;
+						flex-wrap: wrap;
+						margin-top: 16rpx;
+						column-gap: 2%;
+						row-gap: 14rpx;
+
+						.image-box {
+							width: 32%;
+							height: 0;
+							padding-top: 32%;
+							position: relative;
+							border-radius: 16rpx;
+							overflow: hidden;
+
+							.image {
+								position: absolute;
+								top: 0;
+								left: 0;
+								right: 0;
+								bottom: 0;
+							}
+						}
+
+						&.special-image {
+							justify-content: space-between;
+							column-gap: 0;
+
+							.image-box {
+								width: calc(50% - 8rpx);
+								padding-top: calc(50% - 8rpx);
+							}
+						}
+					}
+				}
+
+				.item-bottom {
+					margin-top: 24rpx;
+
+					.bottom-label {
+						max-width: 280rpx;
+
+						.label-box {
+							max-width: 100%;
+							padding: 6rpx 18rpx 6rpx 8rpx;
+							position: relative;
+							z-index: 1;
+							border-radius: 8rpx;
+							overflow: hidden;
+
+							.box-bg {
+								position: absolute;
+								top: 0;
+								left: 0;
+								right: 0;
+								bottom: 0;
+								z-index: -1;
+								opacity: 0.1;
+							}
+
+							.box-icon {
+								width: 24rpx;
+								height: 24rpx;
+								background-size: 24rpx;
+							}
+
+							.box-text {
+								margin-left: 8rpx;
+								font-size: 20rpx;
+								line-height: 28rpx;
+							}
+						}
+					}
+
+					.bottom-other {
+						.other-item {
+							margin-left: 32rpx;
+
+							.icon {
+								width: 32rpx;
+								height: 32rpx;
+							}
+
+							.text {
+								margin-left: 8rpx;
+								color: #5A5B6E;
+								font-size: 28rpx;
+								line-height: 40rpx;
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/floatDiy.vue

@@ -0,0 +1,124 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会与发展 
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-悬浮按钮 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-float" :style="{right: right, bottom: bottom, opacity: showStyle.opacity / 100}">
+		<block v-if="showParams.type == 'service'">
+			<button open-type="contact" class="btn-normal">
+				<view class="float-icon">
+					<image :src="getImagePath(showParams.image)"></image>
+				</view>
+			</button>
+		</block>
+		<block v-else>
+			<button class="btn-normal" @click="onClick(showParams.link)">
+				<view class="float-icon">
+					<image :src="getImagePath(showParams.image)"></image>
+				</view>
+				<!-- #ifdef H5 -->
+				<wx-open-launch-weapp class="float-absolute" :appid="showParams.link.appid" :path="showParams.link.path" v-if="showParams.link && showParams.link.type == 'WXMp'">
+					<script type="text/wxtag-template">
+						<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+							<view class="btn"></view>
+						</script>
+				</wx-open-launch-weapp>
+				<!-- #endif -->
+			</button>
+		</block>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'floatDiy',
+		props: ['showStyle', 'showParams', 'domain'],
+		computed: {
+			right() {
+				return uni.upx2px(this.showStyle.right * 2) + '%';
+			},
+			bottom() {
+				return uni.upx2px(this.showStyle.bottom * 2) + '%';
+			}
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			// 点击事件
+			onClick(e) {
+				if (this.showParams.type != 'link' && !this.showParams.link) return;
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+
+<style>
+	/* 在线客服 */
+	.diy-float {
+		position: fixed;
+		z-index: 999;
+	}
+
+	.diy-float .float-icon {
+		padding: 10rpx;
+	}
+
+	.diy-float .float-icon image {
+		display: block;
+		width: 90rpx;
+		height: 90rpx;
+	}
+
+	.diy-float .float-absolute {
+		display: block;
+		position: absolute;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+	}
+
+	.btn-normal {
+		position: relative;
+		display: block;
+		margin: 0;
+		padding: 0;
+		line-height: normal;
+		background: none;
+		border-radius: 0;
+		box-shadow: none;
+		border: none;
+		font-size: unset;
+		text-align: unset;
+		overflow: visible;
+		color: inherit;
+	}
+
+	.btn-normal:after {
+		border: none;
+	}
+
+	.btn-normal.button-hover {
+		color: inherit;
+	}
+
+	button:after {
+		content: none;
+		border: none;
+	}
+</style>

pages/component/diy/goodsDiy.vue

@@ -0,0 +1,165 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-商城商品 开发者: 麦沃德科技-半夏
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-goods" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="goods-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<view class="goods-list flex flex-wrap justify-content-between" :style="{rowGap: itemSpace}" v-if="goodsList">
+			<view class="list-item" v-for="item in goodsList" :key="item.id" @click="toDetails(item.id)">
+				<image class="item-image" :src="item.image" :style="{height: imgHeight, borderRadius: `${borderRadius} ${borderRadius} 0 0`}" mode="aspectFill"></image>
+				<view class="item-name text-ellipsis-more" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
+				<view class="item-price" :style="{fontSize: priceSize, color: showStyle.priceColor}">￥{{item.price}}</view>
+			</view>
+		</view>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "goodsDiy",
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				goodsList: [],
+			};
+		},
+		computed: {
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			imgHeight() {
+				return uni.upx2px(this.showStyle.imgHeight * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			priceSize() {
+				return uni.upx2px(this.showStyle.priceSize * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getGoodsList()
+				},
+				immediate: true,
+				deep: true
+			}
+		},
+		methods: {
+			// 获取商城商品
+			getGoodsList() {
+				this.$util.request("mall.goodsList", {
+					page: 1,
+					limit: 4
+				}).then(res => {
+					if (res.code == 1) {
+						this.goodsList = res.data.data
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取商城商品', error)
+				})
+			},
+			// 跳转商城详情
+			toDetails(id) {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pagesMall/goods/details?id=" + id
+				})
+			},
+			// 跳转商城列表
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pages/mall/index"
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-goods {
+		.goods-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.goods-list {
+			.list-item {
+				width: calc(50% - 16rpx);
+				padding-bottom: 20rpx;
+
+				.item-image {
+					width: 100%;
+					height: 296rpx;
+				}
+
+				.item-name {
+					line-height: 40rpx;
+					height: 80rpx;
+					color: #000000;
+					margin-top: 16rpx;
+					padding: 0 16rpx;
+				}
+
+				.item-price {
+					margin-top: 16rpx;
+					font-weight: 600;
+					line-height: 1.3;
+					padding: 0 16rpx;
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/imagesDiy.vue

@@ -0,0 +1,96 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-单图组 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-images" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="item-image" v-for="(item, index) in showData" :key="index" :style="{paddingTop: paddingTop}">
+			<button class="clear" open-type="contact" v-if="item.link && item.link.type == 'Service'">
+				<image :src="getImagePath(item.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
+			</button>
+			<block v-else>
+				<image :src="getImagePath(item.imgUrl)" mode="widthFix" @click="onClick(item.link)" :style="{borderRadius: borderRadius}"></image>
+				<!-- #ifdef H5 -->
+				<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
+					<script type="text/wxtag-template">
+						<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+							<view class="btn"></view>
+						</script>
+				</wx-open-launch-weapp>
+				<!-- #endif -->
+			</block>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'imagesDiy',
+		props: ['showStyle', 'showData', 'domain'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			// 跳转
+			onClick(e) {
+					
+				if (!e) return;
+			
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-images {
+		.item-image {
+			position: relative;
+
+			&:first-child {
+				padding-top: 0 !important;
+			}
+
+			image {
+				display: block;
+				width: 100%;
+			}
+		}
+
+		.item-absolute {
+			display: block;
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			bottom: 0;
+		}
+	}
+</style>

pages/component/diy/index.vue

@@ -0,0 +1,248 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-自定义装修 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view :style="{padding: paddingTop + ' ' + paddingLeft}">
+		<block v-for="(item,index) in showData.items" :key='index'>
+			<!-- 图片轮播 -->
+			<block v-if="item.type == 'carouselDiy'">
+				<carousel-diy :showStyle="item.style" :showData="item.data" :showParams="item.params" :domain="showData.domain" @onClick="onClick"></carousel-diy>
+			</block>
+			<!-- 单图组 -->
+			<block v-if="item.type == 'imagesDiy'">
+				<images-diy :showStyle="item.style" :showData="item.data" :domain="showData.domain" @onClick="onClick"></images-diy>
+			</block>
+			<!-- 导航组 -->
+			<block v-if="item.type == 'navDiy'">
+				<nav-diy :showStyle="item.style" :showData="item.data" :domain="showData.domain" @onClick="onClick"></nav-diy>
+			</block>
+			<!-- 图片魔方 -->
+			<block v-if="item.type == 'cubeDiy'">
+				<cube-diy :showStyle="item.style" :showData="item.data" :domain="showData.domain" @onClick="onClick"></cube-diy>
+			</block>
+			<!-- 信息卡片 -->
+			<block v-if="item.type == 'infoCardDiy'">
+				<info-card-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain" @onClick="onClick"></info-card-diy>
+			</block>
+			<!-- 按钮组 -->
+			<block v-if="item.type == 'textButtonDiy'">
+				<text-button-diy :showStyle="item.style" :showData="item.data" @onClick="onClick"></text-button-diy>
+			</block>
+			<!-- 标题 -->
+			<block v-if="item.type == 'titleDiy'">
+				<title-diy :showStyle="item.style" :showParams="item.params" @onClick="onClick"></title-diy>
+			</block>
+			<!-- 视频 -->
+			<block v-if="item.type == 'videoDiy'">
+				<video-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain"></video-diy>
+			</block>
+			<!-- 地图 -->
+			<block v-if="item.type == 'mapDiy'">
+				<map-diy :showStyle="item.style" :showParams="item.params"></map-diy>
+			</block>
+			<!-- 平台动态 -->
+			<block v-if="item.type == 'articleDiy'">
+				<article-diy :ref="'articleDiy_' + index" :showStyle="item.style" :showParams="item.params"></article-diy>
+			</block>
+			<!-- 商会介绍 -->
+			<block v-if="item.type == 'introduceDiy'">
+				<introduce-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain"></introduce-diy>
+			</block>
+			<!-- 会员展示 -->
+			<block v-if="item.type == 'memberDiy'">
+				<member-diy :ref="'memberDiy_' + index" :showStyle="item.style" :showParams="item.params"></member-diy>
+			</block>
+			<!-- 商会活动 -->
+			<block v-if="item.type == 'activityDiy'">
+				<activity-diy :ref="'activityDiy_' + index" :showStyle="item.style" :showParams="item.params"></activity-diy>
+			</block>
+			<!-- 活动接龙 -->
+			<block v-if="item.type == 'chainsDiy'">
+				<chains-diy :ref="'chainsDiy_' + index" :showStyle="item.style" :showParams="item.params" @setShareData="setShareData"></chains-diy>
+			</block>
+			<!-- 商会相册 -->
+			<block v-if="item.type == 'albumDiy'">
+				<album-diy :ref="'albumDiy_' + index" :showStyle="item.style" :showParams="item.params"></album-diy>
+			</block>
+			<!-- 商城商品 -->
+			<block v-if="item.type == 'goodsDiy'">
+				<goods-diy :ref="'goodsDiy_' + index" :showStyle="item.style" :showParams="item.params"></goods-diy>
+			</block>
+			<!-- 会员供需 -->
+			<block v-if="item.type == 'demandDiy'">
+				<demand-diy :ref="'demandDiy_' + index" :showStyle="item.style" :showParams="item.params"></demand-diy>
+			</block>
+			<!-- 会员地图 -->
+			<block v-if="item.type == 'memberMapDiy'">
+				<member-map-diy :ref="'memberMapDiy_' + index" :showMap="item.map" :showCategory="item.category" :spaceHeight="spaceHeight"></member-map-diy>
+			</block>
+			<!-- 搜索 -->
+			<block v-if="item.type == 'searchDiy'">
+				<search-diy :showStyle="item.style" :showParams="item.params"></search-diy>
+			</block>
+			<!-- 辅助线条 -->
+			<block v-if="item.type == 'lineDiy'">
+				<line-diy :showStyle="item.style"></line-diy>
+			</block>
+			<!-- 辅助空白 -->
+			<block v-if="item.type == 'blankDiy'">
+				<blank-diy :showStyle="item.style"></blank-diy>
+			</block>
+			<!-- 消息通知 -->
+			<block v-if="item.type == 'noticeDiy'">
+				<notice-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain"></notice-diy>
+			</block>
+			<!-- 文本组 -->
+			<block v-if="item.type == 'textDiy'">
+				<text-diy :showStyle="item.style"></text-diy>
+			</block>
+			<!-- 富文本 -->
+			<block v-if="item.type == 'richTextDiy'">
+				<rich-text-diy :showStyle="item.style" :showParams="item.params"></rich-text-diy>
+			</block>
+			<!-- 警告提示 -->
+			<block v-if="item.type == 'warnDiy'">
+				<warn-diy :showStyle="item.style" :showParams="item.params"></warn-diy>
+			</block>
+			<!-- 时间线 -->
+			<block v-if="item.type == 'timelineDiy'">
+				<timeline-diy :showStyle="item.style" :showData="item.data"></timeline-diy>
+			</block>
+			<!-- 悬浮按钮 -->
+			<block v-if="item.type == 'floatDiy'">
+				<float-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain" @onClick="onClick"></float-diy>
+			</block>
+		</block>
+	</view>
+</template>
+
+<script>
+	import carouselDiy from './carouselDiy.vue'
+	import imagesDiy from './imagesDiy.vue'
+	import navDiy from './navDiy.vue'
+	import cubeDiy from './cubeDiy.vue'
+	import infoCardDiy from './infoCardDiy.vue'
+	import textButtonDiy from './textButtonDiy.vue'
+	import titleDiy from './titleDiy.vue'
+	import videoDiy from './videoDiy.vue'
+	import mapDiy from './mapDiy.vue'
+	import articleDiy from './articleDiy.vue'
+	import introduceDiy from './introduceDiy.vue'
+	import memberDiy from './memberDiy.vue'
+	import activityDiy from './activityDiy.vue'
+	import chainsDiy from './chainsDiy.vue'
+	import albumDiy from './albumDiy.vue'
+	import goodsDiy from './goodsDiy.vue'
+	import demandDiy from './demandDiy.vue'
+	import memberMapDiy from './memberMapDiy.vue'
+	import searchDiy from './searchDiy.vue'
+	import lineDiy from './lineDiy.vue'
+	import blankDiy from './blankDiy.vue'
+	import noticeDiy from './noticeDiy.vue'
+	import textDiy from './textDiy.vue'
+	import richTextDiy from './richTextDiy.vue'
+	import warnDiy from './warnDiy.vue'
+	import timelineDiy from './timelineDiy.vue'
+	import floatDiy from './floatDiy.vue'
+
+	export default {
+		components: {
+			carouselDiy,
+			imagesDiy,
+			navDiy,
+			cubeDiy,
+			infoCardDiy,
+			textButtonDiy,
+			titleDiy,
+			videoDiy,
+			mapDiy,
+			articleDiy,
+			introduceDiy,
+			memberDiy,
+			activityDiy,
+			chainsDiy,
+			albumDiy,
+			goodsDiy,
+			demandDiy,
+			memberMapDiy,
+			searchDiy,
+			lineDiy,
+			blankDiy,
+			noticeDiy,
+			textDiy,
+			richTextDiy,
+			warnDiy,
+			timelineDiy,
+			floatDiy,
+		},
+		props: ['showData', 'spaceHeight'],
+		computed: {
+			paddingTop() {
+				return uni.upx2px(this.showData.page.style.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showData.page.style.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 更新数据
+			updateData() {
+				for (var key in this.$refs) {
+					const type = key.split("_")[0]
+					switch (type) {
+						case "articleDiy":
+							this.$refs[key][0].getArticleList()
+							break;
+						case "memberDiy":
+							this.$refs[key][0].getMemberList()
+							break;
+						case "activityDiy":
+							this.$refs[key][0].getActivityList()
+							break;
+						case "chainsDiy":
+							this.$refs[key][0].getChainsList()
+							break;
+						case "albumDiy":
+							this.$refs[key][0].getAlbumList()
+							break;
+						case "goodsDiy":
+							this.$refs[key][0].getGoodsList()
+							break;
+						case "demandDiy":
+							this.$refs[key][0].getDemandList()
+							break;
+						case "memberMapDiy":
+							this.$refs[key][0].getMemberList()
+							break;
+						default:
+							break;
+					}
+				}
+			},
+			// 按钮点击
+			onClick(e) {
+				console.log(e,'===========>')
+				if (!e) return;
+				if (e.type == "Fixed" && (e.Fixed_type == "Fixed_type_7" || e.Fixed_type == "Fixed_type_8")) {
+					this.$emit("toPage", e)
+				} else {
+					console.log('走到了这里')
+					this.$util.openLink(e);
+				}
+			},
+			// 设置分享数据
+			setShareData(data) {
+				this.$emit('setShareData', data)
+			},
+		}
+	}
+</script>

pages/component/diy/infoCardDiy.vue

@@ -0,0 +1,135 @@
+<!-- +----------------------------------------------------------------------
+	| 麦沃德科技赋能开发者，助力商协会发展
+	+----------------------------------------------------------------------
+	| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
+	+----------------------------------------------------------------------
+	| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
+	+----------------------------------------------------------------------
+	| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
+	+----------------------------------------------------------------------
+	| 组件-信息卡片 开发者: 麦沃德科技-半夏 
+	+---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-info-card" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<image class="card-image" mode="aspectFill" :src="getImagePath(showParams.image)" :style="{borderRadius: borderRadius}"></image>
+		<view class="card-box">
+			<view class="title">{{showParams.title}}</view>
+			<view class="content">{{showParams.content}}</view>
+			<button class="btn clear" open-type="contact" :style="{background: showStyle.btnBackground, borderRadius: btnBorderRadius, color: showStyle.btnColor}" v-if="showParams.link && showParams.link.type == 'Service'">{{showParams.btnTxt}}</button>
+			<view class="btn" @click="onClick(showParams.link)" :style="{background: showStyle.btnBackground, borderRadius: btnBorderRadius, color: showStyle.btnColor}" v-else>
+				<text>{{showParams.btnTxt}}</text>
+				<!-- #ifdef H5 -->
+				<wx-open-launch-weapp class="absolute" :appid="showParams.link.appid" :path="showParams.link.path" v-if="showParams.link && showParams.link.type == 'WXMp'">
+					<script type="text/wxtag-template">
+						<style> .wx-btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+							<view class="wx-btn"></view>
+						</script>
+				</wx-open-launch-weapp>
+				<!-- #endif -->
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'infoCardDiy',
+		props: ['showStyle', 'showParams', 'domain'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			btnBorderRadius() {
+				return uni.upx2px(this.showStyle.btnBorderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			onClick(e) {
+				if (!e) return;
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-info-card {
+		display: flex;
+
+		.card-image {
+			width: 200rpx;
+			height: 200rpx;
+		}
+
+		.card-box {
+			flex: 1;
+			overflow: hidden;
+			margin-left: 20rpx;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+			align-items: flex-end;
+
+			.title {
+				width: 100%;
+				font-size: 28rpx;
+				line-height: 1.3;
+				font-weight: 700;
+				color: #333;
+			}
+
+			.content {
+				width: 100%;
+				font-size: 24rpx;
+				line-height: 1.4;
+				margin: 16rpx 0;
+				color: #333;
+				word-wrap: normal;
+				display: -webkit-box;
+				word-break: break-all;
+				text-overflow: ellipsis;
+				overflow: hidden;
+				-webkit-box-orient: vertical;
+				-webkit-line-clamp: 2;
+			}
+
+			.btn {
+				position: relative;
+				width: auto;
+				height: auto;
+				display: inline-block;
+				padding: 0 28rpx;
+				font-size: 24rpx;
+				line-height: 54rpx;
+				text-align: center;
+
+				.absolute {
+					display: block;
+					position: absolute;
+					top: 0;
+					left: 0;
+					right: 0;
+					bottom: 0;
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/introduceDiy.vue

@@ -0,0 +1,90 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-商会介绍 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-introduce" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<image class="introduce-image" :src="getImagePath(showParams.imgUrl)" :style="{width: iconSize, height: iconSize, borderRadius: borderRadius}" mode="aspectFill"></image>
+		<text class="introduce-title" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{showParams.name}}</text>
+		<view class="introduce-btn" :style="{fontSize: btnSize, borderRadius: btnBorderRadius, background: `linear-gradient(90deg, ${showStyle.btnColor1} 0, ${showStyle.btnColor2} 100%)`}" @click="onClick()">{{showParams.btnName}}</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'introduceDiy',
+		props: ['showStyle', 'showParams', 'domain'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			iconSize() {
+				return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
+			},
+			btnBorderRadius() {
+				return uni.upx2px(this.showStyle.btnBorderRadius * 2) + 'px';
+			},
+			btnSize() {
+				return uni.upx2px(this.showStyle.btnSize * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			// 点击事件
+			onClick() {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pages/index/association"
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-introduce {
+		display: flex;
+		align-items: center;
+
+		.introduce-title {
+			margin-left: 16rpx;
+			color: #5A5B6E;
+			line-height: 1.3;
+			flex: 1;
+		}
+
+		.introduce-btn {
+			margin-left: 16rpx;
+			color: #ffffff;
+			line-height: 1.3;
+			padding: 14rpx 40rpx;
+		}
+	}
+</style>

pages/component/diy/lineDiy.vue

@@ -0,0 +1,45 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-辅助线 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-line" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="line" :style="{borderTop: line}">
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'lineDiy',
+		props: ['showStyle'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			line() {
+				return uni.upx2px(this.showStyle.lineHeight * 2) + 'px' + ' ' + this.showStyle.lineStyle + ' ' + this.showStyle.lineColor;
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.diy-line .line {
+		width: 100%;
+	}
+</style>

pages/component/diy/mapDiy.vue

@@ -0,0 +1,56 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-地图组 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-map" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<map class="map" :latitude="showParams.latitude" :longitude="showParams.longitude" :style="{height: height}" @click="onClick"></map>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'mapDiy',
+		props: ['showStyle', 'showParams'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			height() {
+				return uni.upx2px(this.showStyle.height * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 点击事件
+			onClick() {
+				this.$util.toPage({
+					mode: 7,
+					address: {
+						latitude: this.showParams.latitude,
+						longitude: this.showParams.longitude,
+					},
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-map .map {
+		width: 100%;
+	}
+</style>

pages/component/diy/memberDiy.vue

@@ -0,0 +1,218 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-可滚动会员列表 开发者: 麦沃德科技-半夏
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-member" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="member-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
+			<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
+			<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
+				<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
+				<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
+			</view>
+		</view>
+		<block v-if="memberList.length">
+			<view class="member-swiper" v-if="showStyle.isAutoRoll">
+				<z-swiper v-model="memberList" :options="{loop: (memberList.length > 9 ? true : false), autoplay: {delay: showStyle.rollDelay || 2000, disableOnInteraction: false}, speed: showStyle.rollSpeed || 1000, slidesPerView: 'auto', spaceBetween: showStyle.itemSpace}">
+					<z-swiper-item v-for="(item, index) in memberList" :key="index" :custom-style="{width: iconSize}">
+						<view class="swiper-item" @click="toDetails(item.id)">
+							<image class="item-avatar" :style="{width: iconSize, height: iconSize, borderRadius: iconRadius}" :src="item.avatar" mode="aspectFill"></image>
+							<view class="item-label text-ellipsis" :style="{fontSize: pSize, color: showStyle.pColor, background: showStyle.pBackground, borderRadius: showStyle.pRadiusType == 'full' ? pRadius : showStyle.pRadiusType == 'half' ? `0 ${pRadius} 0 ${pRadius}` : 0}">{{item.level_name}}</view>
+							<view class="item-name text-ellipsis" :style="{fontSize: nameSize, color: showStyle.nameColor,}">{{item.name}}</view>
+						</view>
+					</z-swiper-item>
+				</z-swiper>
+			</view>
+			<scroll-view scroll-x class="member-scroll" v-else>
+				<view class="scroll-item" :style="{width: iconSize, marginLeft: itemSpace}" v-for="item in memberList" :key="item.id" @click="toDetails(item.id)">
+					<image class="item-avatar" :style="{width: iconSize, height: iconSize, borderRadius: iconRadius}" :src="item.avatar" mode="aspectFill"></image>
+					<view class="item-label text-ellipsis" :style="{
+						fontSize: pSize,
+						color: showStyle.pColor,
+						background: showStyle.pBackground,
+						borderRadius: showStyle.pRadiusType == 'full' ? pRadius : showStyle.pRadiusType == 'half' ? `0 ${pRadius} 0 ${pRadius}` : 0
+					}">{{item.level_name}}</view>
+					<view class="item-name text-ellipsis" :style="{fontSize: nameSize, color: showStyle.nameColor,}">{{item.name}}</view>
+				</view>
+			</scroll-view>
+		</block>
+		<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "memberDiy",
+		props: ['showStyle', 'showParams'],
+		data() {
+			return {
+				// 会员列表
+				memberList: [],
+				// 轮播图高度
+				carouselHeight: 0,
+			};
+		},
+		computed: {
+			titleFontSize() {
+				return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
+			},
+			titleBtnSize() {
+				return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
+			},
+			titleIconMore() {
+				return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
+			},
+			titleIconSize() {
+				return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
+			},
+			titleSpace() {
+				return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			iconRadius() {
+				return uni.upx2px(this.showStyle.iconRadius * 2) + 'px';
+			},
+			iconSize() {
+				return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
+			},
+			pSize() {
+				return uni.upx2px(this.showStyle.pSize * 2) + 'px';
+			},
+			pRadius() {
+				return uni.upx2px(this.showStyle.pRadius * 2) + 'px';
+			},
+			nameSize() {
+				return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		watch: {
+			showParams: {
+				handler(value) {
+					if (value) this.getMemberList()
+				},
+				immediate: true,
+				deep: true
+			},
+			showStyle: {
+				handler(value) {
+					if (value) {
+						this.carouselHeight = `calc(${uni.upx2px((value.iconSize + value.pSize + value.nameSize) * 2)}px + 22rpx)`
+					}
+				},
+				immediate: true,
+				deep: true
+			},
+		},
+		methods: {
+			// 跳转会员详情
+			toDetails(id) {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pages/member/details?id=" + id
+				})
+			},
+			// 获取会员列表
+			getMemberList() {
+				this.$util.request("member.diyList", {
+					limit: this.showParams.count,
+				}).then(res => {
+					if (res.code == 1) {
+						this.memberList = res.data
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取会员列表 ', error)
+				})
+			},
+			// 跳转会员列表
+			toMore() {
+				this.$util.toPage({
+					mode: 1,
+					path: "/pages/member/index"
+				})
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.diy-member {
+		.member-title {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.member-scroll {
+			white-space: nowrap;
+
+			.scroll-item {
+				display: inline-block;
+
+				&:first-child {
+					margin-left: 0 !important;
+				}
+
+				.item-label {
+					line-height: 1;
+					padding: 10rpx 8rpx;
+					margin-top: -16rpx;
+					text-align: center;
+					position: relative;
+					z-index: 1;
+				}
+
+				.item-name {
+					color: #5A5B6E;
+					line-height: 1;
+					margin-top: 18rpx;
+					text-align: center;
+				}
+			}
+		}
+
+		.member-swiper {
+			.swiper-item {
+				.item-label {
+					line-height: 1;
+					padding: 10rpx 8rpx;
+					margin-top: -16rpx;
+					text-align: center;
+					position: relative;
+					z-index: 1;
+				}
+
+				.item-name {
+					color: #5A5B6E;
+					line-height: 1;
+					margin-top: 18rpx;
+					text-align: center;
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/memberMapDiy.vue

@@ -0,0 +1,695 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-会员地图 开发者: 麦沃德科技-半夏
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-member-map" :class="{'flex-column': showCategory.styleMode == 2 && showMap.heightType == 1}" :style="{height: showMap.heightType == 2 ? `auto` : `calc(100vh - ${spaceHeight}px)`, background: showMap.background, borderRadius: mapItemBorderRadius}" v-if="loadEnd">
+		<view class="map-classify style-2" v-if="showCategory.styleMode == 2 && classifyList.length" @scrolltolower="scrollBottom" :style="{background: showCategory.background, padding: `0 ${categoryPaddingLeft}`}">
+			<scroll-view scroll-x class="classify-list" :style="{padding: `${categoryPaddingTop} 0`}">
+				<view class="list-item" @click="changeClassify(-1)" :style="{
+					background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+					borderRadius: categoryBtnBorderRadius, 
+					padding: categoryBtnPadding,
+					color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
+					<text>全部</text>
+				</view>
+				<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
+					marginLeft: categoryItemSpace, 
+					background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+					borderRadius: categoryBtnBorderRadius, 
+					padding: categoryBtnPadding,
+					color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
+					<text>{{item.name}}</text>
+				</view>
+			</scroll-view>
+			<view class="classify-more" @click="handleExpand(1)">
+				<view class="more-icon" :style="{'background-image': 'url('+ categoryIconDown +')'}" v-if="categoryIconDown"></view>
+				<text class="more-text" :style="{color: showCategory.expandColor}">展开列表</text>
+			</view>
+		</view>
+		<view class="map-classify style-1" v-else-if="classifyList.length" :style="{
+			top: categoryMarginTop,
+			left: showCategory.position == 'right' ? 'initial' : categoryMarginLeft,
+			right: showCategory.position == 'right' ? categoryMarginLeft : 'initial',
+			width: showCategory.widthType == 2 ? `${showCategory.widthNumber}%` : 'auto',
+			maxWidth: `calc((100% - ${categoryMarginLeft} - ${categoryMarginLeft}) * ${showCategory.widthType == 2 ? `${showCategory.widthNumber / 100}` : 1})`,
+			maxHeight: showMap.heightType == 2 ? categoryMaxHeight : `calc(100vh - ${spaceHeight}px - ${categoryMaxHeight})`,
+			alignItems: showCategory.position == 'right' ? 'flex-end' : 'flex-start'}">
+			<view class="classify-more" :class="{collapse: !isExpandCategory1}" @click="handleExpand()" :style="{
+				background: showCategory.background,
+				borderRadius: isExpandCategory1 ? categoryBorderRadius : (showCategory.position == 'right' ? `${categoryBorderRadius} 0 0 ${categoryBorderRadius}` : `0 ${categoryBorderRadius} ${categoryBorderRadius} 0`),
+				left: showCategory.position == 'right' ? 'initial' : `-${categoryMarginLeft}`,
+				right: showCategory.position == 'right' ? `-${categoryMarginLeft}` : 'initial',}">
+				<text class="more-text" :style="{color: showCategory.expandColor}">{{isExpandCategory1 ? "收起" : "展开"}}列表</text>
+				<view class="more-icon" :style="{'background-image': 'url('+ categoryIconDown +')'}" v-if="categoryIconDown"></view>
+			</view>
+			<!-- #ifdef MP-WEIXIN -->
+			<uni-transition style="width: 100%;" :mode-class="showCategory.position == 'right' ? 'slide-right' : 'slide-left'" :duration="80" :show="isExpandCategory1">
+				<scroll-view scroll-y @scrolltolower="scrollBottom" :style="{
+					borderRadius: categoryBorderRadius,
+					background: showCategory.background,
+					maxHeight: showMap.heightType == 2 ? `calc(${categoryMaxHeight} - 80rpx)` : `calc(100vh - 80rpx - ${spaceHeight}px - ${categoryMaxHeight})`}">
+					<view class="classify-list" :style="{rowGap: categoryItemSpace, padding: `${categoryPaddingTop} ${categoryPaddingLeft}`}">
+						<view class="list-item" @click="changeClassify(-1)" :style="{
+							background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+							borderRadius: categoryBtnBorderRadius, 
+							padding: categoryBtnPadding,
+							color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
+							<text>全部</text>
+						</view>
+						<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
+							background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+							borderRadius: categoryBtnBorderRadius, 
+							padding: categoryBtnPadding,
+							color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
+							<text>{{item.name}}</text>
+						</view>
+					</view>
+				</scroll-view>
+			</uni-transition>
+			<!-- #endif -->
+			<!-- #ifndef MP-WEIXIN -->
+			<scroll-view scroll-y @scrolltolower="scrollBottom" v-if="isExpandCategory1" :style="{
+				borderRadius: categoryBorderRadius,
+				background: showCategory.background,
+				maxHeight: showMap.heightType == 2 ? `calc(${categoryMaxHeight} - 80rpx)` : `calc(100vh - 80rpx - ${spaceHeight}px - ${categoryMaxHeight})`}">
+				<view class="classify-list" :style="{rowGap: categoryItemSpace, padding: `${categoryPaddingTop} ${categoryPaddingLeft}`}">
+					<view class="list-item" @click="changeClassify(-1)" :style="{
+						background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+						borderRadius: categoryBtnBorderRadius, 
+						padding: categoryBtnPadding,
+						color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
+						<text>全部</text>
+					</view>
+					<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
+						background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+						borderRadius: categoryBtnBorderRadius, 
+						padding: categoryBtnPadding,
+						color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
+						<text>{{item.name}}</text>
+					</view>
+				</view>
+			</scroll-view>
+			<!-- #endif -->
+		</view>
+		<view class="map-context" :style="{height: showMap.heightType == 2 ? mapHeight : '100%', padding: mapPadding}">
+			<map class="map" id="map" :style="{borderRadius: mapBorderRadius}" :markers="markersList" :include-points="includePoints" @callouttap="toMemberDetails" @markertap="toMemberDetails">
+				<!-- #ifdef MP-WEIXIN -->
+				<cover-view slot="callout" class="map-callout" v-if="memberList.length">
+					<cover-view :marker-id="Number(item.id)" v-for="item in memberList" :key="item.id">
+						<cover-view class="callout-item">
+							<cover-image class="item-avatar" :src="item.avatar"></cover-image>
+							<cover-view class="item-name">{{item.name}}</cover-view>
+						</cover-view>
+					</cover-view>
+				</cover-view>
+				<!-- #endif -->
+			</map>
+		</view>
+		<view class="map-popup" v-if="showCategory.styleMode == 2 && isExpandCategory2">
+			<view class="popup-classify" :style="{background: showCategory.background, padding: `0 ${categoryPaddingLeft}`}">
+				<scroll-view scroll-y class="classify-scroll" :style="{maxHeight: `${componentHeight}px`, padding: `${categoryPaddingTop} 0`}">
+					<view class="scroll-list" :style="{gap: categoryItemSpace}">
+						<view class="list-item" @click="changeClassify(-1)" :style="{
+							background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+							borderRadius: categoryBtnBorderRadius, 
+							padding: categoryBtnPadding,
+							color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
+							<text>全部</text>
+						</view>
+						<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
+							background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground), 
+							borderRadius: categoryBtnBorderRadius, 
+							padding: categoryBtnPadding,
+							color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
+							<text>{{item.name}}</text>
+						</view>
+					</view>
+					<view class="scroll-space"></view>
+				</scroll-view>
+				<view class="classify-more" :style="{background: showCategory.background}" @click="handleExpand(2)">
+					<view class="more-icon" style="transform: rotate(180deg);" :style="{'background-image': 'url('+ categoryIconDown +')'}" v-if="categoryIconDown"></view>
+					<text class="more-text" :style="{color: showCategory.expandColor}">收起列表</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "memberMapDiy",
+		props: ['showMap', 'showCategory', 'spaceHeight'],
+		data() {
+			return {
+				// 加载完成
+				loadEnd: false,
+				// 分类列表 1.行业分类，2.分支机构，3.会员级别
+				classifyList: [],
+				// 已选分类
+				selectClassify: [],
+				// 分类查询参数
+				page: 1,
+				limit: 100,
+				hasMore: false,
+				// 会员列表
+				memberList: [],
+				// 地图标记点
+				markersList: [],
+				// 所有标记点
+				includePoints: [],
+				// 查询数据防抖延时器
+				loadTimer: null,
+				// 页面跳转防抖延时器
+				toPageTimer: null,
+				// 分类弹窗是否展开-样式1
+				isExpandCategory1: true,
+				// 分类弹窗是否展开-样式2
+				isExpandCategory2: false,
+				// 组件高度
+				componentHeight: 0,
+			};
+		},
+		computed: {
+			mapItemBorderRadius() {
+				return uni.upx2px(this.showMap.itemBorderRadius * 2) + 'px';
+			},
+			mapHeight() {
+				if (this.showMap.heightType == 2) {
+					return uni.upx2px(this.showMap.height * 2) + 'px';
+				} else {
+					return '100%';
+				}
+			},
+			mapBorderRadius() {
+				return uni.upx2px(this.showMap.borderRadius * 2) + 'px';
+			},
+			mapPadding() {
+				return `${uni.upx2px(this.showMap.paddingTop * 2)}px ${uni.upx2px(this.showMap.paddingLeft * 2)}px`;
+			},
+			categoryBorderRadius() {
+				return uni.upx2px(this.showCategory.borderRadius * 2) + 'px';
+			},
+			categoryMaxHeight() {
+				var maxHeight = 0
+				if (this.showMap.heightType == 2) {
+					maxHeight = this.showMap.height - (this.showCategory.marginTop * 2)
+					return uni.upx2px(maxHeight * 2) + 'px';
+				} else {
+					maxHeight = this.showCategory.marginTop * 2
+					return uni.upx2px(maxHeight * 2) + 'px';
+				}
+			},
+			categoryMarginTop() {
+				return `${uni.upx2px(this.showCategory.marginTop * 2)}px`
+			},
+			categoryMarginLeft() {
+				return `${uni.upx2px(this.showCategory.marginLeft * 2)}px`
+			},
+			categoryIconDown() {
+				return svgData.svgToUrl("expand", this.showCategory.expandColor)
+			},
+			categoryPaddingTop() {
+				return `${uni.upx2px(this.showCategory.paddingTop * 2)}px`
+			},
+			categoryPaddingLeft() {
+				return `${uni.upx2px(this.showCategory.paddingLeft * 2)}px`
+			},
+			categoryItemSpace() {
+				return uni.upx2px(this.showCategory.itemSpace * 2) + 'px';
+			},
+			categoryBtnBorderRadius() {
+				return uni.upx2px(this.showCategory.btnBorderRadius * 2) + 'px';
+			},
+			categoryBtnPadding() {
+				return `${uni.upx2px(this.showCategory.btnPaddingTop * 2)}px ${uni.upx2px(this.showCategory.btnPaddingLeft * 2)}px`
+			},
+		},
+		watch: {
+			showCategory: {
+				handler(value) {
+					if (value) {
+						this.getClassifyList()
+						this.getMemberList()
+					}
+				},
+				immediate: true,
+				deep: true
+			},
+		},
+		destroyed() {
+			if (this.loadTimer) clearTimeout(this.loadTimer)
+			if (this.toPageTimer) clearTimeout(this.toPageTimer)
+		},
+		methods: {
+			// 获取会员列表
+			getMemberList() {
+				var data = { type: this.showCategory.type }
+				if (this.selectClassify.length) {
+					if (this.showCategory.type == 1) {
+						data.member_level_id = this.selectClassify.join(",")
+					} else if (this.showCategory.type == 2) {
+						data.industry_category_id = this.selectClassify.join(",")
+					} else if (this.showCategory.type == 3) {
+						data.institution_id = this.selectClassify.join(",")
+					}
+				}
+				this.$util.request("member.memberMapList", data).then(res => {
+					if (res.code == 1) {
+						this.memberList = res.data || []
+						var markersPoints = []
+						res.data.forEach((item) => {
+							if (item.latitude && item.longitude) {
+								markersPoints.push({
+									id: Number(item.id),
+									latitude: item.latitude,
+									longitude: item.longitude,
+									// #ifdef H5
+									iconPath: item.avatar,
+									width: 28,
+									height: 28,
+									callout: {
+										display: "ALWAYS",
+										content: item.name,
+										fontSize: 12,
+										borderRadius: 4,
+										padding: 5,
+									},
+									// #endif
+									// #ifdef MP-WEIXIN
+									iconPath: "/static/point.png",
+									width: 20,
+									height: 20,
+									customCallout: {
+										anchorX: 0,
+										anchorY: 28,
+										display: "ALWAYS",
+									},
+									// #endif
+								})
+							}
+						});
+						// #ifdef MP-WEIXIN
+						this.markersList = markersPoints
+						// #endif
+						// #ifndef MP-WEIXIN
+						this.markersList = []
+						this.$nextTick(() => {
+							this.markersList = markersPoints
+						})
+						// #endif
+						const allPoints = res.data.filter(el => el.latitude && el.longitude).map(item => ({
+							latitude: item.latitude,
+							longitude: item.longitude,
+						}));
+						// #ifdef MP-WEIXIN
+						this._mapContext = uni.createMapContext('map', this);
+						this._mapContext.initMarkerCluster({
+							enableDefaultStyle: false,
+							zoomOnClick: true,
+							gridSize: 60,
+						});
+						this._mapContext.includePoints({
+							padding: [100, 100, 100, 100],
+							points: allPoints,
+						});
+						// #endif
+						// #ifndef MP-WEIXIN
+						this.includePoints = this.calculateBounds(allPoints)
+						// #endif
+					} else {
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					console.error('获取会员列表 ', error)
+				})
+			},
+			// 计算所有点的边界
+			calculateBounds(points) {
+				if (!points || points.length === 0) return null;
+				let minLat = Infinity;
+				let maxLat = -Infinity;
+				let minLng = Infinity;
+				let maxLng = -Infinity;
+				points.forEach(point => {
+					const lat = point.latitude;
+					const lng = point.longitude;
+					minLat = Math.min(minLat, lat);
+					maxLat = Math.max(maxLat, lat);
+					minLng = Math.min(minLng, lng);
+					maxLng = Math.max(maxLng, lng);
+				});
+				const latRange = maxLat - minLat;
+				const lngRange = maxLng - minLng;
+				const topPadding = latRange * 0.4;
+				const bottomPadding = latRange * 0.3;
+				const leftPadding = lngRange * 0.3;
+				const rightPadding = lngRange * 0.3;
+				minLat = minLat - bottomPadding;
+				maxLat = maxLat + topPadding;
+				minLng = minLng - leftPadding;
+				maxLng = maxLng + rightPadding;
+				return [{ latitude: minLat, longitude: minLng }, { latitude: maxLat, longitude: maxLng }];
+			},
+			// 获取分类列表
+			getClassifyList() {
+				// type: 1.会员级别，2.行业分类，3.分支机构
+				const endFunction = () => {
+					this.loadEnd = true
+					setTimeout(() => {
+						uni.createSelectorQuery().in(this).select('.diy-member-map').boundingClientRect(data => {
+							this.componentHeight = data?.height
+						}).exec();
+					}, 200);
+				}
+				if (this.showCategory.type == 2) {
+					this.getIndustry(() => {
+						endFunction()
+					})
+				} else if (this.showCategory.type == 3) {
+					this.page = 1
+					this.getInstitution(() => {
+						endFunction()
+					})
+				} else {
+					this.getMemberLevel(() => {
+						endFunction()
+					})
+				}
+			},
+			// 获取会员级别
+			getMemberLevel(fn) {
+				this.$util.request("member.level").then(res => {
+					if (res.code == 1) {
+						this.classifyList = res.data || []
+						if (fn) fn()
+					} else {
+						if (fn) fn()
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					if (fn) fn()
+					console.error('获取会员级别 ', error)
+				})
+			},
+			// 获取行业分类
+			getIndustry(fn) {
+				this.$util.request("member.industry").then(res => {
+					if (res.code == 1) {
+						this.classifyList = res.data || []
+						if (fn) fn()
+					} else {
+						if (fn) fn()
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					if (fn) fn()
+					console.error('获取行业分类 ', error)
+				})
+			},
+			// 获取分支机构
+			getInstitution(fn) {
+				this.$util.request("institution.list", {
+					page: this.page,
+					limit: this.limit
+				}).then(res => {
+					if (res.code == 1) {
+						let list = res.data.data
+						this.hasMore = this.page < res.data.total / this.limit ? true : false
+						this.classifyList = this.page == 1 ? list : [...this.classifyList, ...list];
+						if (fn) fn()
+					} else {
+						if (fn) fn()
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				}).catch(error => {
+					if (fn) fn()
+					console.error('获取机构列表', error)
+				})
+			},
+			// 滚动到底部
+			scrollBottom() {
+				if (this.hasMore) {
+					this.page++
+					this.getInstitution()
+				}
+			},
+			// 更换分类
+			changeClassify(id) {
+				if (id == -1) {
+					this.selectClassify = []
+				} else {
+					const index = this.selectClassify.findIndex(item => item == id)
+					if (index > -1) {
+						this.$delete(this.selectClassify, index)
+					} else {
+						this.selectClassify.push(id)
+					}
+				}
+				if (this.loadTimer) clearTimeout(this.loadTimer)
+				this.loadTimer = setTimeout(() => {
+					this.getMemberList()
+				}, 400);
+			},
+			// 跳转会员详情
+			toMemberDetails(res) {
+				if (this.toPageTimer) clearTimeout(this.toPageTimer)
+				this.toPageTimer = setTimeout(() => {
+					this.$util.toPage({
+						mode: 1,
+						path: "/pages/member/details?id=" + res.detail.markerId,
+					})
+				}, 50);
+			},
+			// 展开/折叠分类列表
+			handleExpand(type) {
+				uni.createSelectorQuery().in(this).select('.diy-member-map').boundingClientRect(data => {
+					this.componentHeight = data?.height
+				}).exec();
+				if (this.showCategory.styleMode == 2) {
+					this.isExpandCategory2 = type == 1 ? true : false
+				} else {
+					this.isExpandCategory1 = !this.isExpandCategory1
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-member-map {
+		position: relative;
+		overflow: hidden;
+
+		&.flex-column {
+			display: flex;
+			flex-direction: column;
+		}
+
+		.map-context {
+			width: 100%;
+			height: 100%;
+			flex: 1;
+			overflow: hidden;
+
+			.map {
+				width: 100%;
+				height: 100%;
+				overflow: hidden;
+			}
+
+			.callout-item {
+				display: flex;
+				align-items: center;
+				padding: 16rpx;
+				border-radius: 16rpx;
+				background: #FFF;
+
+				.item-avatar {
+					width: 56rpx;
+					height: 56rpx;
+					border-radius: 16rpx;
+					object-fit: cover;
+					margin-right: 8rpx;
+				}
+
+				.item-name {
+					color: #5A5B6E;
+					font-size: 28rpx;
+					font-weight: 500;
+					line-height: 40rpx;
+				}
+			}
+		}
+
+		.map-classify {
+			display: flex;
+			flex-direction: column;
+			box-sizing: border-box;
+
+			.classify-list {
+				height: 100%;
+
+				.list-item {
+					line-height: 1.4;
+					text-align: center;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					word-break: break-all;
+				}
+			}
+
+			.classify-more {
+				display: flex;
+				justify-content: center;
+				align-items: center;
+				padding: 12rpx 24rpx;
+				gap: 8rpx;
+
+				.more-icon {
+					width: 32rpx;
+					height: 32rpx;
+				}
+
+				.more-text {
+					font-size: 24rpx;
+					line-height: 32rpx;
+				}
+			}
+
+			&.style-1 {
+				position: absolute;
+				z-index: 9;
+
+				.classify-list {
+					display: flex;
+					flex-direction: column;
+				}
+
+				.classify-more {
+					min-width: 184rpx;
+					margin-bottom: 16rpx;
+					width: 100%;
+
+					.more-icon {
+						transform: rotate(90deg);
+					}
+
+					&.collapse {
+						position: relative;
+						width: fit-content;
+
+						.more-icon {
+							transform: rotate(-90deg);
+						}
+					}
+				}
+			}
+
+			&.style-2 {
+				.classify-list {
+					white-space: nowrap;
+					overflow: hidden;
+
+					.list-item {
+						display: inline-block;
+					}
+				}
+			}
+		}
+
+		.map-more {
+			position: absolute;
+			top: 0;
+			left: 0;
+			z-index: 9;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			padding: 12rpx 24rpx;
+
+			.more-icon {
+				width: 32rpx;
+				height: 32rpx;
+			}
+
+			.more-text {
+				font-size: 24rpx;
+				line-height: 32rpx;
+			}
+		}
+
+		.map-popup {
+			position: absolute;
+			top: 0;
+			right: 0;
+			left: 0;
+
+			.popup-classify {
+				position: relative;
+
+				.classify-scroll {
+					box-sizing: border-box;
+
+					.scroll-list {
+						display: flex;
+						flex-wrap: wrap;
+
+						.list-item {
+							line-height: 1.4;
+							text-align: center;
+						}
+					}
+
+					.scroll-space {
+						width: 100%;
+						height: 56rpx;
+					}
+				}
+
+				.classify-more {
+					position: absolute;
+					bottom: 0;
+					left: 0;
+					right: 0;
+					display: flex;
+					justify-content: center;
+					align-items: center;
+					padding: 12rpx 24rpx;
+
+					.more-icon {
+						width: 32rpx;
+						height: 32rpx;
+					}
+
+					.more-text {
+						font-size: 24rpx;
+						line-height: 32rpx;
+					}
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/menuDiy.vue

@@ -0,0 +1,124 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-按钮组 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-menu">
+		<block v-for="(item, index) in showData" :key="index">
+			<button class="menu-item clear" open-type="contact" :style="{marginTop: (index >= parseInt(showStyle.rowsNum) ? itemSpace : 0), width: `calc(100% / ${showStyle.rowsNum})`}" v-if="item.link && item.link.type == 'Service'">
+				<view class="item-image" :style="{width: iconSize, height: iconSize}">
+					<image mode="widthFix" :src="getImagePath(item.imgUrl)" :style="{borderRadius: borderRadius}"></image>
+				</view>
+				<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
+			</button>
+			<view class="menu-item" :style="{marginTop: (index >= parseInt(showStyle.rowsNum) ? itemSpace : 0), width: `calc(100% / ${showStyle.rowsNum})`}" @click="onClick(item.link, item.text)" v-else>
+				<view class="item-image" :style="{width: iconSize, height: iconSize}">
+					<image mode="widthFix" :src="getImagePath(item.imgUrl)" :style="{borderRadius: borderRadius}"></image>
+				</view>
+				<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
+				<!-- #ifdef H5 -->
+				<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
+					<script type="text/wxtag-template">
+						<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+						<view class="btn"></view>
+					</script>
+				</wx-open-launch-weapp>
+				<!-- #endif -->
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'menuDiy',
+		props: ['showStyle', 'showData', 'domain'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			iconSize() {
+				let size = this.showStyle.iconSize || 44
+				return uni.upx2px(size * 2) + 'px';
+			},
+			borderRadius() {
+				return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
+			},
+			fontSize() {
+				let size = this.showStyle.fontSize || 14
+				return uni.upx2px(size * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemSpace() {
+				return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
+			},
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			// 点击事件
+			onClick(e, title) {
+				if (!e) return;
+				if (e.type == "Custom" && e.path.indexOf('/pages/article/index') > -1) {
+					if (e.path.indexOf("?") > -1) e.path += `&title=${encodeURIComponent(title || "")}`
+					else e.path += `?title=${encodeURIComponent(title || "")}`
+				}
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+<style lang="scss">
+	.diy-menu {
+		display: flex;
+		flex-wrap: wrap;
+
+		.menu-item {
+			position: relative;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+
+			.item-image {
+				width: 88rpx;
+				height: 88rpx;
+				margin-bottom: 12rpx;
+			}
+
+			.item-text {
+				width: 100%;
+				line-height: 1;
+				font-size: 28rpx;
+				text-align: center;
+			}
+
+			.item-absolute {
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+			}
+		}
+	}
+</style>

pages/component/diy/navDiy.vue

@@ -0,0 +1,140 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-导航组 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-nav" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<block v-if="!showStyle.rowsLimit || showStyle.rowsLimit == -1">
+			<menu-diy :showStyle="showStyle" :showData="showData" :domain="domain" @onClick="onClick"></menu-diy>
+		</block>
+		<block v-else-if="menuList.length == 1">
+			<menu-diy :showStyle="showStyle" :showData="menuList[0]" :domain="domain" @onClick="onClick"></menu-diy>
+		</block>
+		<block v-else>
+			<swiper :style="{height: carouselHeight}" @change="carouselChange">
+				<swiper-item v-for="(menu, number) in menuList" :key="number">
+					<menu-diy :showStyle="showStyle" :showData="menu" :domain="domain" @onClick="onClick"></menu-diy>
+				</swiper-item>
+			</swiper>
+			<view class="carousel-dots">
+				<view class="dots-item" :style="{background: carouseIndex == i ? (showStyle.dotColor || themeColor) : '#F1F1F1'}" v-for="(d, i) in menuList" :key="i"></view>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	import { mapState } from "vuex"
+	import menuDiy from './menuDiy.vue'
+	export default {
+		name: 'navDiy',
+		components: {
+			menuDiy
+		},
+		props: ['showStyle', 'showData', 'showParams', 'domain'],
+		data() {
+			return {
+				// 已选索引
+				carouseIndex: 0,
+				// 菜单列表
+				menuList: [],
+				// 轮播图高度
+				carouselHeight: 0,
+			};
+		},
+		watch: {
+			showData: {
+				handler(value) {
+					if (value && value.length) {
+						console.log(value,'==========value============')
+						this.menuList = this.splitArray(value);
+					}
+				},
+				immediate: true,
+				deep: true
+			},
+			showStyle: {
+				handler(value) {
+					if (value) {
+						let height = 0
+						let iconSize = value.iconSize || 44
+						let fontSize = value.fontSize || 14
+						if (value.rowsLimit) {
+							height = `calc(${uni.upx2px(((iconSize + fontSize) * value.rowsLimit + value.itemSpace * (value.rowsLimit - 1)) * 2)}px + ${12 * value.rowsLimit}rpx)`
+						}
+						this.carouselHeight = height;
+					}
+				},
+				immediate: true,
+				deep: true
+			},
+		},
+		computed: {
+			...mapState({
+				themeColor: state => state.app.themeColor,
+			}),
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 轮播图切换
+			carouselChange(e) {
+				this.carouseIndex = e.detail.current
+			},
+			// 切割数组
+			splitArray(arr) {
+				var result = [];
+				if (this.showStyle.rowsLimit && this.showStyle.rowsLimit > 0 && arr.length > this.showStyle.rowsNum * this.showStyle.rowsLimit) {
+					for (var i = 0; i < arr.length; i += parseInt(this.showStyle.rowsNum * this.showStyle.rowsLimit)) {
+						var chunk = arr.slice(i, i + parseInt(this.showStyle.rowsNum * this.showStyle.rowsLimit));
+						result.push(chunk);
+					}
+				} else {
+					result[0] = arr
+				}
+				return result;
+			},
+			// 点击事件
+			onClick(e) {
+				if (!e) return;
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+<style lang="scss">
+	.diy-nav {
+		.carousel-dots {
+			display: flex;
+			justify-content: center;
+			padding-top: 20px;
+
+			.dots-item {
+				width: 24rpx;
+				height: 8rpx;
+				border-radius: 8rpx;
+				background: #F1F1F1;
+				margin-right: 4rpx;
+
+				&:last-child {
+					margin-right: 0;
+				}
+			}
+		}
+	}
+</style>

pages/component/diy/noticeDiy.vue

@@ -0,0 +1,386 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-消息通知 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view v-if="show" class="uni-noticebar" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}" @click="onClick">
+		<view v-if="showParams.showImg && showParams.icon" class="zan-noticebar__left-icon" style="float: left;">
+			<image :src="getImagePath(showParams.icon)" mode="aspectFit" />
+		</view>
+		<view ref="textBox" class="uni-noticebar__content-wrapper" :class="{'uni-noticebar__content-wrapper--scrollable':scrollable, 'uni-noticebar__content-wrapper--single':!scrollable && (single || moreText)}">
+			<view :id="elIdBox" class="uni-noticebar__content" :class="{'uni-noticebar__content--scrollable':scrollable, 'uni-noticebar__content--single':!scrollable && (single || moreText)}">
+				<text :id="elId" ref="animationEle" class="uni-noticebar__content-text" :class="{'uni-noticebar__content-text--scrollable':scrollable,'uni-noticebar__content-text--single':!scrollable && (single || moreText)}" :style="{color: showStyle.textColor, width:wrapWidth+'px', 'animationDuration': animationDuration, '-webkit-animationDuration': animationDuration ,animationPlayState: webviewHide?'paused':animationPlayState,'-webkit-animationPlayState':webviewHide?'paused':animationPlayState, animationDelay: animationDelay, '-webkit-animationDelay':animationDelay}">{{showParams.text}}</text>
+			</view>
+		</view>
+		<view v-if="showGetMore === true || showGetMore === 'true'" class="uni-noticebar__more" @click="clickMore">
+			<text v-if="moreText" :style="{ color: moreColor }" class="uni-noticebar__more-text">{{ moreText }}</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const dom = weex.requireModule('dom');
+	const animation = weex.requireModule('animation');
+	// #endif
+	export default {
+		name: 'notice',
+		props: {
+			moreText: {
+				type: String,
+				default: ''
+			},
+			speed: {
+				// 默认1s滚动100px
+				type: Number,
+				default: 100
+			},
+			moreColor: {
+				type: String,
+				default: '#999999'
+			},
+			single: {
+				// 是否单行
+				type: [Boolean, String],
+				default: false
+			},
+			scrollable: {
+				// 是否滚动，添加后控制单行效果取消
+				type: [Boolean, String],
+				default: true
+			},
+			showGetMore: {
+				// 是否显示右侧查看更多
+				type: [Boolean, String],
+				default: false
+			},
+			showClose: {
+				// 是否显示左侧关闭按钮
+				type: [Boolean, String],
+				default: false
+			},
+			showStyle: {},
+			showParams: {},
+			domain: '',
+		},
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		data() {
+			const elId = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
+			const elIdBox = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
+			return {
+				textWidth: 0,
+				boxWidth: 0,
+				wrapWidth: '',
+				webviewHide: false,
+				// #ifdef APP-NVUE
+				stopAnimation: false,
+				// #endif
+				elId: elId,
+				elIdBox: elIdBox,
+				show: true,
+				animationDuration: 'none',
+				animationPlayState: 'paused',
+				animationDelay: '0s',
+			}
+		},
+		mounted() {
+			// #ifdef APP-PLUS
+			var pages = getCurrentPages();
+			var page = pages[pages.length - 1];
+			var currentWebview = page.$getAppWebview();
+			currentWebview.addEventListener('hide', () => {
+				this.webviewHide = true
+			})
+			currentWebview.addEventListener('show', () => {
+				this.webviewHide = false
+			})
+			// #endif
+			this.$nextTick(() => {
+				this.initSize()
+			})
+		},
+		// #ifdef APP-NVUE
+		beforeDestroy() {
+			this.stopAnimation = true
+		},
+		// #endif
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+			initSize() {
+				if (this.scrollable) {
+					// #ifndef APP-NVUE
+					let query = [],
+						boxWidth = 0,
+						textWidth = 0;
+					let textQuery = new Promise((resolve, reject) => {
+						uni.createSelectorQuery()
+							// #ifndef MP-ALIPAY
+							.in(this)
+							// #endif
+							.select(`#${this.elId}`)
+							.boundingClientRect()
+							.exec(ret => {
+								this.textWidth = ret[0].width
+								resolve()
+							})
+					})
+					let boxQuery = new Promise((resolve, reject) => {
+						uni.createSelectorQuery()
+							// #ifndef MP-ALIPAY
+							.in(this)
+							// #endif
+							.select(`#${this.elIdBox}`)
+							.boundingClientRect()
+							.exec(ret => {
+								this.boxWidth = ret[0].width
+								resolve()
+							})
+					})
+					query.push(textQuery)
+					query.push(boxQuery)
+					Promise.all(query).then(() => {
+						this.animationDuration = `${this.textWidth / this.speed}s`
+						this.animationDelay = `-${this.boxWidth / this.speed}s`
+						setTimeout(() => {
+							this.animationPlayState = 'running'
+						}, 1000)
+					})
+					// #endif
+					// #ifdef APP-NVUE
+					dom.getComponentRect(this.$refs['animationEle'], (res) => {
+						let winWidth = uni.getSystemInfoSync().windowWidth
+						this.textWidth = res.size.width
+						animation.transition(this.$refs['animationEle'], {
+							styles: {
+								transform: `translateX(-${winWidth}px)`
+							},
+							duration: 0,
+							timingFunction: 'linear',
+							delay: 0
+						}, () => {
+							if (!this.stopAnimation) {
+								animation.transition(this.$refs['animationEle'], {
+									styles: {
+										transform: `translateX(-${this.textWidth}px)`
+									},
+									timingFunction: 'linear',
+									duration: (this.textWidth - winWidth) / this.speed * 1000,
+									delay: 1000
+								}, () => {
+									if (!this.stopAnimation) {
+										this.loopAnimation()
+									}
+								});
+							}
+						});
+					})
+					// #endif
+				}
+				// #ifdef APP-NVUE
+				if (!this.scrollable && (this.single || this.moreText)) {
+					dom.getComponentRect(this.$refs['textBox'], (res) => {
+						this.wrapWidth = res.size.width
+					})
+				}
+				// #endif
+			},
+			loopAnimation() {
+				// #ifdef APP-NVUE
+				animation.transition(this.$refs['animationEle'], {
+					styles: {
+						transform: `translateX(0px)`
+					},
+					duration: 0
+				}, () => {
+					if (!this.stopAnimation) {
+						animation.transition(this.$refs['animationEle'], {
+							styles: {
+								transform: `translateX(-${this.textWidth}px)`
+							},
+							duration: this.textWidth / this.speed * 1000,
+							timingFunction: 'linear',
+							delay: 0
+						}, () => {
+							if (!this.stopAnimation) {
+								this.loopAnimation()
+							}
+						});
+					}
+				});
+				// #endif
+			},
+			clickMore() {
+				this.$emit('getmore')
+			},
+			close() {
+				this.show = false;
+				this.$emit('close')
+			},
+			onClick() {
+				this.$emit('click')
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.uni-noticebar {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		width: 100%;
+		box-sizing: border-box;
+		/* #endif */
+		flex-direction: row;
+		align-items: center;
+		padding: 6px 12px;
+		// margin-bottom: 10px;
+	}
+
+	.uni-noticebar-close {
+		margin-right: 5px;
+	}
+
+	.uni-noticebar-icon {
+		margin-right: 5px;
+	}
+
+	.uni-noticebar__content-wrapper {
+		flex: 1;
+		flex-direction: column;
+		overflow: hidden;
+	}
+
+	.uni-noticebar__content-wrapper--single {
+		/* #ifndef APP-NVUE */
+		line-height: 18px;
+		/* #endif */
+	}
+
+	.uni-noticebar__content-wrapper--single,
+	.uni-noticebar__content-wrapper--scrollable {
+		flex-direction: row;
+	}
+
+	/* #ifndef APP-NVUE */
+	.uni-noticebar__content-wrapper--scrollable {
+		position: relative;
+		height: 18px;
+	}
+
+	/* #endif */
+
+	.uni-noticebar__content--scrollable {
+		/* #ifdef APP-NVUE */
+		flex: 0;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		flex: 1;
+		display: block;
+		overflow: hidden;
+		/* #endif */
+	}
+
+	.uni-noticebar__content--single {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex: none;
+		width: 100%;
+		justify-content: center;
+		/* #endif */
+	}
+
+	.uni-noticebar__content-text {
+		font-size: 14px;
+		line-height: 18px;
+		/* #ifndef APP-NVUE */
+		word-break: break-all;
+		/* #endif */
+	}
+
+	.uni-noticebar__content-text--single {
+		/* #ifdef APP-NVUE */
+		lines: 1;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		display: block;
+		width: 100%;
+		white-space: nowrap;
+		/* #endif */
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+
+	.uni-noticebar__content-text--scrollable {
+		/* #ifdef APP-NVUE */
+		lines: 1;
+		padding-left: 750rpx;
+		/* #endif */
+		/* #ifndef APP-NVUE */
+		position: absolute;
+		display: block;
+		height: 18px;
+		line-height: 18px;
+		white-space: nowrap;
+		padding-left: 100%;
+		animation: notice 10s 0s linear infinite both;
+		animation-play-state: paused;
+		/* #endif */
+	}
+
+	.uni-noticebar__more {
+		/* #ifndef APP-NVUE */
+		display: inline-flex;
+		/* #endif */
+		flex-direction: row;
+		flex-wrap: nowrap;
+		align-items: center;
+		padding-left: 5px;
+	}
+
+	.uni-noticebar__more-text {
+		font-size: 14px;
+	}
+
+	@keyframes notice {
+		100% {
+			transform: translate3d(-100%, 0, 0);
+		}
+	}
+
+	.zan-noticebar__left-icon {
+		height: 36upx;
+		min-width: 40upx;
+		padding-top: 2upx;
+		box-sizing: border-box;
+	}
+
+	.zan-noticebar__left-icon>image {
+		width: 32upx;
+		height: 32upx;
+	}
+</style>

pages/component/diy/richTextDiy.vue

@@ -0,0 +1,36 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-富文本 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<!-- 富文本 -->
+	<view class="diy-richText" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<mp-html :content="showParams.content" />
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'richTextDiy',
+		props: ['showStyle', 'showParams'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+	}
+</script>

pages/component/diy/searchDiy.vue

@@ -0,0 +1,95 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-搜索 开发者: 麦沃德科技-半夏
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-search" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="search-input" :style="{'--placeholder-color': showStyle.placeholderColor, padding: inputPaddingTop + ' ' + inputPaddingLeft, background: showStyle.inputBackground, borderRadius: inputBorderRadius}">
+			<view :style="{'background-image': 'url('+ iconSearch +')', width: iconSize, height: iconSize, backgroundSize: iconSize}" v-if="iconSearch"></view>
+			<input class="input-box" type="text" confirm-type="search" :style="{fontSize: fontSize, color: showStyle.inputColor}" :placeholder="showParams.placeholder" placeholder-class="placeholder" @confirm="handleSearch" />
+		</view>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: "searchDiy",
+		props: ['showStyle', 'showParams'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			iconSearch() {
+				return svgData.svgToUrl("search", this.showStyle.iconColor)
+			},
+			iconSize() {
+				return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
+			},
+			fontSize() {
+				return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
+			},
+			inputBorderRadius() {
+				return uni.upx2px(this.showStyle.inputBorderRadius * 2) + 'px';
+			},
+			inputPaddingTop() {
+				return uni.upx2px(this.showStyle.inputPaddingTop * 2) + 'px';
+			},
+			inputPaddingLeft() {
+				return uni.upx2px(this.showStyle.inputPaddingLeft * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 搜索
+			handleSearch(e) {
+				if (!e.detail.value) {
+					uni.showToast({
+						icon: "none",
+						title: this.showParams.placeholder,
+						duration: 2000
+					})
+					return
+				}
+				this.$util.toPage({
+					mode: 1,
+					path: `/pages/diy/search?keyword=${encodeURIComponent(e.detail.value)}`
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-search {
+		.search-input {
+			display: flex;
+			align-items: center;
+
+			.input-box {
+				width: 100%;
+				height: auto;
+				min-height: auto;
+				line-height: 1.4;
+				margin-left: 16rpx;
+			}
+
+			.placeholder {
+				color: var(--placeholder-color);
+			}
+		}
+	}
+</style>

pages/component/diy/textButtonDiy.vue

@@ -0,0 +1,88 @@
+<!-- +----------------------------------------------------------------------
+	| 麦沃德科技赋能开发者，助力商协会发展
+	+----------------------------------------------------------------------
+	| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
+	+----------------------------------------------------------------------
+	| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
+	+----------------------------------------------------------------------
+	| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
+	+----------------------------------------------------------------------
+	| 组件-按钮组 开发者: 麦沃德科技-半夏 
+	+---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-text-button" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<block v-for="(item, index) in showData" :key="index">
+			<button class="item clear" open-type="contact" :style="{color: showStyle.textColor, fontSize: fontSize}" v-if="item.link && item.link.type == 'Service'">
+				{{item.text}}
+			</button>
+			<view class="item" :style="{color: showStyle.textColor, fontSize: fontSize}" @click="onClick(item.link)" v-else>
+				<text>{{item.text}}</text>
+				<!-- #ifdef H5 -->
+				<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
+					<script type="text/wxtag-template">
+						<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+						<view class="btn"></view>
+					</script>
+				</wx-open-launch-weapp>
+				<!-- #endif -->
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'textButtonDiy',
+		props: ['showStyle', 'showData'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			fontSize() {
+				return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			onClick(e) {
+				if (!e) return;
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+<style lang="scss">
+	.diy-text-button {
+		height: auto;
+
+		.item {
+			position: relative;
+			padding: 0.5rem;
+			text-align: center;
+			position: relative;
+			color: #666;
+			font-size: 0.75rem;
+			width: 1%;
+			display: table-cell;
+			-webkit-user-select: none;
+			-moz-user-select: none;
+			transition: background-color 300ms;
+			-webkit-transition: background-color 300ms;
+
+			.item-absolute {
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+			}
+		}
+	}
+</style>

pages/component/diy/textDiy.vue

@@ -0,0 +1,40 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-文本组 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view :style="{background: showStyle.background, borderRadius: itemBorderRadius, padding: paddingTop +' '+ paddingLeft, textAlign: showStyle.textAlign, color: showStyle.textColor, fontSize: fontSize}">
+		<text v-if="showStyle.fontStyle == 'bold'" style="font-weight: bold;">{{showStyle.text}}</text>
+		<text v-else-if="showStyle.fontStyle == 'italic'" style="font-style: italic;">{{showStyle.text}}</text>
+		<text v-else>{{showStyle.text}}</text>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'textDiy',
+		props: ['showStyle'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			fontSize() {
+				return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+	}
+</script>

pages/component/diy/timelineDiy.vue

@@ -0,0 +1,55 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-时间线 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-timeline" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<u-time-line>
+			<u-time-line-item v-for="(item,index) in showData" :key="index" :bgColor="item.color">
+				<template v-slot:content>
+					<view>
+						<view class="u-order-desc">{{item.content}}</view>
+						<view class="u-order-time" v-if="item.hide">{{item.time}}</view>
+					</view>
+				</template>
+			</u-time-line-item>
+		</u-time-line>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: ['showStyle', 'showData'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.diy-timeline .u-order-time {
+		color: rgb(200, 200, 200);
+		font-size: 26rpx;
+		margin-top: 10rpx;
+	}
+	
+	.diy-timeline .u-time-axis-item {
+		margin-top: 32rpx;
+	}
+</style>

pages/component/diy/titleDiy.vue

@@ -0,0 +1,106 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-标题 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-title" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<view class="title-text" :style="{fontSize: fontSize, color: showStyle.color}">
+			<text class="italic" v-if="showStyle.fontStyle == 'italic'">{{showParams.title}}</text>
+			<text class="bold" v-else-if="showStyle.fontStyle == 'bold'">{{showParams.title}}</text>
+			<text v-else>{{showParams.title}}</text>
+		</view>
+		<button class="title-btn clear" open-type="contact" v-if="showParams.link && showParams.link.type == 'Service'">
+			<text :style="{fontSize: btnSize, color: showStyle.btnColor}" v-if="showParams.btnType == 'text'">{{showParams.btnText}}</text>
+			<view class="btn" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconMore +')'}" v-else-if="iconMore && showParams.btnType == 'icon'"></view>
+		</button>
+		<view class="title-btn" @click="onClick(showParams.link)" v-else>
+			<text :style="{fontSize: btnSize, color: showStyle.btnColor}" v-if="showParams.btnType == 'text'">{{showParams.btnText}}</text>
+			<view class="btn" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconMore +')'}" v-else-if="iconMore && showParams.btnType == 'icon'"></view>
+			<!-- #ifdef H5 -->
+			<wx-open-launch-weapp class="btn-absolute" :appid="showParams.link.appid" :path="showParams.link.path" v-if="showParams.link && showParams.link.type == 'WXMp'">
+				<script type="text/wxtag-template">
+					<style> .wx-btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
+					<view class="wx-btn"></view>
+				</script>
+			</wx-open-launch-weapp>
+			<!-- #endif -->
+		</view>
+	</view>
+</template>
+
+<script>
+	import svgData from "@/common/svg.js"
+	export default {
+		name: 'titleDiy',
+		props: ['showStyle', 'showParams'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			fontSize() {
+				return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
+			},
+			btnSize() {
+				return uni.upx2px(this.showStyle.btnSize * 2) + 'px';
+			},
+			iconSize() {
+				return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
+			},
+			iconMore() {
+				return svgData.svgToUrl("more", this.showStyle.btnColor)
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		methods: {
+			// 点击事件
+			onClick(e) {
+				if (!e) return;
+				this.$emit("onClick", e)
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.diy-title {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+
+		.title-text {
+			.italic {
+				font-style: italic;
+			}
+
+			.bold {
+				font-weight: bold;
+			}
+		}
+
+		.title-btn {
+			position: relative;
+
+			.btn-absolute {
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+			}
+		}
+	}
+</style>

pages/component/diy/videoDiy.vue

@@ -0,0 +1,52 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-视频 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<view class="diy-video" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+		<video :src="showParams.videoUrl" :poster="getImagePath(showParams.poster)" :autoplay="showParams.autoplay == 1" controls="false"></video>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'videoDiy',
+		props: ['showStyle', 'showParams', 'domain'],
+		computed: {
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+		},
+		methods: {
+			// 获取图片地址
+			getImagePath(url) {
+				if (url.indexOf('http') > -1) {
+					return url
+				} else {
+					return this.domain + url
+				}
+			},
+		},
+	}
+</script>
+
+<style lang="scss">
+	.diy-video video {
+		width: 100%;
+		display: block;
+	}
+</style>

pages/component/diy/warnDiy.vue

@@ -0,0 +1,48 @@
+<!-- +----------------------------------------------------------------------
+| 麦沃德科技赋能开发者，助力商协会发展
++----------------------------------------------------------------------
+| Copyright (c) 2017～2024  www.wdsxh.cn    All rights reserved.
++----------------------------------------------------------------------
+| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
++----------------------------------------------------------------------
+| Author: MY WORLD Team <bd@maiwd.cn>   www.maiwd.cn
++----------------------------------------------------------------------
+| 组件-警告提示 开发者: 麦沃德科技-半夏 
++---------------------------------------------------------------------- -->
+
+<template>
+	<block v-if="isshow">
+		<view :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
+			<u-alert-tips :type="showStyle.type" :title="showParams.title" :description="showParams.description" :close-able="showParams.closable" :show="show" @close="onClick" :show-icon="showParams.showIcon"></u-alert-tips>
+		</view>
+	</block>
+</template>
+
+<script>
+	export default {
+		props: ['showStyle', 'showParams'],
+		computed: {
+			itemBorderRadius() {
+				return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
+			},
+			paddingTop() {
+				return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
+			},
+			paddingLeft() {
+				return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
+			},
+		},
+		data() {
+			return {
+				show: true,
+				isshow: true,
+			}
+		},
+		methods: {
+			onClick() {
+				this.show = false;
+				this.isshow = false;
+			}
+		}
+	}
+</script>