分享一个基于uni-app的蛋糕商城订购小程序的设计与实现(源码、调试、LW、开题、PPT)

💕💕作者:计算机源码社
💕💕个人简介:本人 八年开发经验,擅长Java、Python、PHP、.NET、Node.js、Android、微信小程序、爬虫、大数据、机器学习等,大家有这一块的问题可以一起交流!
💕💕学习资料、程序开发、技术解答、文档报告
💕💕如需要源码,可以扫取文章下方二维码联系咨询

💕💕Java项目
💕💕微信小程序项目
💕💕Android项目
💕💕Python项目
💕💕PHP项目
💕💕ASP.NET项目
💕💕Node.js项目
💕💕选题推荐

项目实战|基于uniapp蛋糕订购小程序蛋糕销售小程序源码

1、选题背景

  随着移动互联网的快速发展和智能手机的普及,消费者的购物习惯发生了显著变化,线上订购已成为许多人的首选方式。在此背景下,蛋糕行业也面临着转型升级的需求。传统的蛋糕店营销模式已难以满足现代消费者对便捷性、个性化和即时服务的追求。同时,小程序作为一种轻量级应用,因其使用方便、无需下载安装等特点,正在成为商家触达用户的重要渠道。
uni-app作为一种跨平台开发框架,能够同时满足多个平台的开发需求,大大提高了开发效率。在这样的技术和市场环境下,开发一个基于uni-app的蛋糕订购小程序成为顺应时代潮流的选择。这种模式不仅能为消费者提供更便捷的订购体验,还能帮助蛋糕店拓展销售渠道、提高运营效率、增强用户粘性。通过整合蛋糕展示、在线订购、用户互动等功能,小程序将为蛋糕行业的数字化转型提供有力支持。

2、研究目的和意义

  基于uni-app的蛋糕订购小程序旨在打造一个全面、便捷、互动的蛋糕购买平台。该小程序的主要目的是通过数字化手段整合蛋糕店的销售、管理和客户服务流程,为用户提供从浏览、选购到评价的一站式服务体验。对于用户而言,系统致力于提供丰富的蛋糕信息展示、便捷的订购流程、个性化的推荐服务,以及积分兑换等增值功能,满足现代消费者对便利性和个性化服务的需求。对于管理员,系统旨在提供全面的后台管理工具,包括用户管理、商品管理、订单处理、客户服务等,以提高运营效率,优化业务流程。通过整合在线聊天、评价系统等互动功能,小程序还致力于增强用户粘性,建立良好的客户关系。最终,该系统的开发目的是为蛋糕店提供一个有力的数字化经营工具,以应对市场竞争,扩大客户群体,提升品牌影响力。
  基于uni-app的蛋糕订购小程序的开发具有重要的实际意义和长远价值。首先,在移动互联网时代,该小程序的开发顺应了消费者线上购物的趋势,为蛋糕店提供了一个新的销售渠道,有助于扩大市场份额,提高经营效益。通过数字化平台,蛋糕店可以更精准地了解客户需求,优化产品结构,提升服务质量。其次,小程序的便捷性和跨平台特性,使得用户可以随时随地浏览和订购蛋糕,大大提高了用户体验和购买转化率。对于蛋糕店而言,小程序的开发有助于降低运营成本,提高管理效率,实现精准营销。从长远来看,这一系统的应用将推动蛋糕行业的数字化转型,促进行业标准化和规范化发展。此外,基于uni-app开发的跨平台解决方案,为其他餐饮零售行业的移动应用开发提供了借鉴,具有一定的技术创新意义。总的来说,该小程序的开发不仅能够满足当前市场需求,还能为蛋糕行业的未来发展提供新的思路和动力。

3、系统功能设计

在这里插入图片描述

管理员功能模块:
用户管理:
查看、搜索和管理用户信息
设置用户权限,如禁用或启用账号
查看用户的订单历史和消费记录

蛋糕资讯管理:
发布、编辑和删除蛋糕相关的新闻和活动信息
设置资讯的展示顺序和可见性
管理资讯的分类和标签

蛋糕信息管理:
添加新的蛋糕产品,包括名称、描述、价格、图片等
编辑现有蛋糕信息
管理蛋糕的上架/下架状态和库存

蛋糕分类管理:
创建、编辑和删除蛋糕分类
设置分类的层级关系和展示顺序

蛋糕口味管理:
添加、编辑和删除蛋糕口味选项
管理口味与蛋糕的关联

订单管理:
查看所有订单信息
处理订单状态变更(如确认订单、安排配送等)
处理退款申请

查看评价信息:
浏览用户对蛋糕的评价
回复用户评价
管理评价的显示状态

聊天回复:
回复用户的在线咨询
查看聊天历史记录

用户功能模块:
查看蛋糕信息:
浏览蛋糕列表和详细信息
搜索特定蛋糕
查看蛋糕的评论

查看蛋糕资讯:
浏览蛋糕相关的新闻和活动信息
查看资讯详情

收藏蛋糕:
将喜欢的蛋糕添加到收藏列表
管理收藏列表

添加购物车:
将选择的蛋糕添加到购物车
管理购物车中的商品(修改数量、删除等)

下单购买蛋糕:
选择蛋糕和数量
填写配送信息
选择支付方式并完成支付
查看订单状态

评价蛋糕:
对购买过的蛋糕进行评分和评价
查看和管理自己的评价历史

在线聊天:
与客服进行实时在线对话
查看聊天历史记录

积分兑换蛋糕:
查看可用积分
使用积分兑换指定蛋糕
查看积分兑换记录

4、系统页面设计

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

如需要源码,可以扫取文章下方二维码联系咨询

5、参考文献

[1]闫娇娇.基于Think PHP+Vue商城管理系统的设计与实现[J].电脑知识与技术,2023,19(34):59-62.DOI:10.14004/j.cnki.ckt.2023.1834.
[2]郑妍,张未名,张润园,等.基于云开发和微信小程序的爱宠家系统[J].电脑编程技巧与维护,2023,(06):79-81.DOI:10.16184/j.cnki.comprg.2023.06.050.
[3]韩本东.基于DeepFM的直播商城系统设计与实现[D].北京交通大学,2023. DOI:10.26944/d.cnki.gbfju.2023.003274.
[4]李宇杰.基于微服务架构的电商微信小程序的设计与实现[D].华东师范大学,2023. DOI:10.27149/d.cnki.ghdsu.2023.003555.
[5]赵冲冲.基于Dubbo框架的购物商城的设计和实现[D].北京交通大学,2022. DOI:10.26944/d.cnki.gbfju.2022.000794.
[6]焦自程.基于uni-app框架的购物商城小程序的设计与实现[J].信息与电脑(理论版),2022,34(08):168-170.
[7]杜雨荃,王晓菊,田立勤.基于微信小程序的网上购物系统的设计与实现[J].网络安全技术与应用,2022,(04):60-62.
[8]李常宝.基于微信小程序的电子商城的设计与开发[J].吕梁教育学院学报,2021,38(03):133-136.
[9]徐超.基于协同过滤的智能推荐商城系统的设计与实现[D].南昌大学,2021. DOI:10.27232/d.cnki.gnchu.2021.002264.
[10]胡杨林.基于微服务和小程序的电子商城设计与实现[D].西北大学,2021. DOI:10.27405/d.cnki.gxbdu.2021.000827.
[11]马静.基于微信小程序的购物商城系统的设计与实现[J].微型电脑应用,2021,37(03):31-34.
[12]康娇兰.基于微信小程序的区块链商城系统的设计与实现[D].华中科技大学,2021. DOI:10.27157/d.cnki.ghzku.2021.004151.

6、核心代码

<template>
<view class="content">
	<view :style='{"minHeight":"100vh","padding":"0px 0 80rpx","borderColor":"#21d5ae","background":"#fff","borderWidth":"0px 0 0","width":"100%","position":"relative","borderStyle":"dashed","height":"auto"}'>
		<form :style='{"width":"100%","padding":"60rpx 40rpx","background":"none","height":"auto"}' class="app-update-pv">
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">蛋糕名称</view>
				<input :style='{"border":"0","padding":"0px 20rpx","margin":"0px","color":"#666","borderRadius":"8rpx","flex":"1","background":"rgba(255, 255, 255, 0)","fontSize":"28rpx"}' :disabled="ro.dangaomingcheng" v-model="ruleForm.dangaomingcheng" placeholder="蛋糕名称"></input>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class=" select">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">蛋糕分类</view>
				<picker :style='{"width":"100%","flex":"1","height":"auto"}' @change="dangaofenleiChange" :value="dangaofenleiIndex"  :range="dangaofenleiOptions">
					<view :style='{"width":"100%","lineHeight":"80rpx","fontSize":"28rpx","color":"#666"}' class="uni-input">{{ruleForm.dangaofenlei?ruleForm.dangaofenlei:"请选择蛋糕分类"}}</view>
				</picker>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class=" select">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">口味</view>
				<picker :style='{"width":"100%","flex":"1","height":"auto"}' @change="kouweiChange" :value="kouweiIndex"  :range="kouweiOptions">
					<view :style='{"width":"100%","lineHeight":"80rpx","fontSize":"28rpx","color":"#666"}' class="uni-input">{{ruleForm.kouwei?ruleForm.kouwei:"请选择口味"}}</view>
				</picker>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="" @tap="fengmianTap">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">封面</view>
				<image :style='{"width":"72rpx","margin":"12rpx 0","borderRadius":"100%","objectFit":"cover","display":"block","height":"72rpx"}' class="avator" v-if="ruleForm.fengmian" :src="baseUrl+ruleForm.fengmian.split(',')[0]" mode="aspectFill"></image>
				<image :style='{"width":"72rpx","margin":"12rpx 0","borderRadius":"100%","objectFit":"cover","display":"block","height":"72rpx"}' class="avator" v-else src="../../static/gen/upload.png" mode="aspectFill"></image>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">颜色</view>
				<input :style='{"border":"0","padding":"0px 20rpx","margin":"0px","color":"#666","borderRadius":"8rpx","flex":"1","background":"rgba(255, 255, 255, 0)","fontSize":"28rpx"}' :disabled="ro.yanse" v-model="ruleForm.yanse" placeholder="颜色"></input>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">蛋糕尺寸</view>
				<input :style='{"border":"0","padding":"0px 20rpx","margin":"0px","color":"#666","borderRadius":"8rpx","flex":"1","background":"rgba(255, 255, 255, 0)","fontSize":"28rpx"}' :disabled="ro.dangaochicun" v-model="ruleForm.dangaochicun" placeholder="蛋糕尺寸"></input>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class=" select">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">上架日期</view>
				<picker :style='{"width":"100%","flex":"1","height":"auto"}' mode="date" :value="ruleForm.shangjiariqi" @change="shangjiariqiChange">
					<view :style='{"width":"100%","lineHeight":"80rpx","fontSize":"28rpx","color":"#666"}' class="uni-input">{{ruleForm.shangjiariqi?ruleForm.shangjiariqi:"请选择上架日期"}}</view>
				</picker>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">积分</view>
				<input :style='{"border":"0","padding":"0px 20rpx","margin":"0px","color":"#666","borderRadius":"8rpx","flex":"1","background":"rgba(255, 255, 255, 0)","fontSize":"28rpx"}' :disabled="ro.jf" v-model="ruleForm.jf" placeholder="积分"></input>
			</view>
			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">价格</view>
				<input :style='{"border":"0","padding":"0px 20rpx","margin":"0px","color":"#666","borderRadius":"8rpx","flex":"1","background":"rgba(255, 255, 255, 0)","fontSize":"28rpx"}' :disabled="ro.price" v-model="ruleForm.price" placeholder="价格"></input>
			</view>
			
			<!---->
 

			<view :style='{"padding":"0 20rpx 0px","boxShadow":"inset 0px 0px 0px 0px #f9edd9","margin":"0 0 32rpx","borderColor":"#e9be70","borderRadius":"0px","borderWidth":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","display":"flex","width":"100%","lineHeight":"88rpx","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"160rpx","padding":"0 20rpx 0 0","fontSize":"28rpx","color":"#844819","textAlign":"right"}' class="title">装饰品</view>
				<textarea :style='{"border":"0","minHeight":"240rpx","padding":"40rpx 40rpx","margin":"0px","color":"#666","borderRadius":"8rpx","flex":"1","background":"none","fontSize":"28rpx"}' v-model="ruleForm.zhuangshipin" placeholder="装饰品"></textarea>
			</view>
			
			<view :style='{"padding":"12rpx 0","margin":"0 0 24rpx 0","borderColor":"#ccc","borderWidth":"0 0 0px 0","width":"100%","borderStyle":"solid","height":"auto"}' class="">
				<view :style='{"width":"100%","lineHeight":"80rpx","fontSize":"28rpx","color":"#844819","fontWeight":"500"}' class="title">蛋糕详情</view>
                <xia-editor ref="editor" :style='{"minHeight":"300rpx","padding":"24rpx 32rpx","boxShadow":"inset 0px 0px 0px 0px #f9edd9","borderColor":"#e9be70","borderRadius":"0px","background":"url(http://codegen.caihongy.cn/20230303/adcda4c7311148a1913eb708c6fdebf0.png) no-repeat left top,url(http://codegen.caihongy.cn/20230303/41517a62f11849869c71aed71b75484e.png) no-repeat right bottom,#fffcf3","borderWidth":"0px","width":"100%","borderStyle":"solid","height":"auto"}' v-model="ruleForm.dangaoxiangqing" placeholder="蛋糕详情" @editorChange="dangaoxiangqingChange"></xia-editor>
			</view>
			
			<view :style='{"padding":"0px","margin":"40rpx 0 0 0","background":"none","display":"flex","width":"100%","justifyContent":"center","height":"auto"}' class="btn" >
				<button :style='{"padding":"0 40rpx","boxShadow":"0px 0px 0px #ccc","margin":"0 40rpx 0 0","borderColor":"#6dd5cb","color":"#fff","display":"inline","minWidth":"220rpx","borderRadius":"0px","background":"#ec9e69","borderWidth":"0px","width":"auto","lineHeight":"72rpx","fontSize":"28rpx","borderStyle":"solid","height":"80rpx"}' @tap="onSubmitTap" class="bg-red">提交</button>
			</view>
		</form>

		<w-picker mode="dateTime" step="1" :current="false" :hasSecond="false" @confirm="clicktimeConfirm" ref="clicktime" themeColor="#333333"></w-picker>
	</view>
</view>
</template>

<script>
	import wPicker from "@/components/w-picker/w-picker.vue";
    import xiaEditor from '@/components/xia-editor/xia-editor';
	export default {
		data() {
			return {
				cross:'',
				ruleForm: {
				dangaomingcheng: '',
				dangaofenlei: '',
				kouwei: '',
				fengmian: '',
				yanse: '',
				zhuangshipin: '',
				dangaochicun: '',
				shangjiariqi: '',
				dangaoxiangqing: '',
				jf: '',
				price: '',
				},
				dangaofenleiOptions: [],
				dangaofenleiIndex: 0,
				kouweiOptions: [],
				kouweiIndex: 0,
				// 登陆用户信息
				user: {},
                ro:{
                   dangaomingcheng : false,
                   dangaofenlei : false,
                   kouwei : false,
                   fengmian : false,
                   yanse : false,
                   zhuangshipin : false,
                   dangaochicun : false,
                   shangjiariqi : false,
                   dangaoxiangqing : false,
                   clicktime : false,
                   clicknum : false,
                   jf : false,
                   price : false,
                },
			}
		},
		components: {
			wPicker,
            xiaEditor
		},
		computed: {
			baseUrl() {
				return this.$base.url;
			},



		},
		async onLoad(options) {
            this.ruleForm.shangjiariqi = this.$utils.getCurDate();
			let table = uni.getStorageSync("nowTable");
			// 获取用户信息
			let res = await this.$api.session(table);
			this.user = res.data;
			
			// ss读取


			// 下拉框
			res = await this.$api.option(`dangaofenlei`,`dangaofenlei`,{});
			this.dangaofenleiOptions = res.data;
            this.dangaofenleiOptions.unshift("请选择蛋糕分类");
			// 下拉框
			res = await this.$api.option(`kouwei`,`kouwei`,{});
			this.kouweiOptions = res.data;
            this.kouweiOptions.unshift("请选择口味");

			// 如果有登陆,获取登陆后保存的userid
			this.ruleForm.userid = uni.getStorageSync("userid")
			if (options.refid) {
				// 如果上一级页面传递了refid,获取改refid数据信息
				this.ruleForm.refid = options.refid;
				this.ruleForm.nickname = uni.getStorageSync("nickname");
			}
			// 如果是更新操作
			if (options.id) {
				this.ruleForm.id = options.id;
				// 获取信息
				res = await this.$api.info(`dangaoxinxi`, this.ruleForm.id);
				this.ruleForm = res.data;
			}
			// 跨表
			this.cross = options.cross;
			if(options.cross){
				var obj = uni.getStorageSync('crossObj');
				for (var o in obj){
					if(o=='dangaomingcheng'){
					this.ruleForm.dangaomingcheng = obj[o];
					this.ro.dangaomingcheng = true;
					continue;
					}
					if(o=='dangaofenlei'){
					this.ruleForm.dangaofenlei = obj[o];
					this.ro.dangaofenlei = true;
					continue;
					}
					if(o=='kouwei'){
					this.ruleForm.kouwei = obj[o];
					this.ro.kouwei = true;
					continue;
					}
					if(o=='fengmian'){
					this.ruleForm.fengmian = obj[o].split(",")[0];
					this.ro.fengmian = true;
					continue;
					}
					if(o=='yanse'){
					this.ruleForm.yanse = obj[o];
					this.ro.yanse = true;
					continue;
					}
					if(o=='zhuangshipin'){
					this.ruleForm.zhuangshipin = obj[o];
					this.ro.zhuangshipin = true;
					continue;
					}
					if(o=='dangaochicun'){
					this.ruleForm.dangaochicun = obj[o];
					this.ro.dangaochicun = true;
					continue;
					}
					if(o=='shangjiariqi'){
					this.ruleForm.shangjiariqi = obj[o];
					this.ro.shangjiariqi = true;
					continue;
					}
					if(o=='dangaoxiangqing'){
					this.ruleForm.dangaoxiangqing = obj[o];
					this.ro.dangaoxiangqing = true;
					continue;
					}
					if(o=='clicktime'){
					this.ruleForm.clicktime = obj[o];
					this.ro.clicktime = true;
					continue;
					}
					if(o=='clicknum'){
					this.ruleForm.clicknum = obj[o];
					this.ro.clicknum = true;
					continue;
					}
					if(o=='jf'){
					this.ruleForm.jf = obj[o];
					this.ro.jf = true;
					continue;
					}
					if(o=='price'){
					this.ruleForm.price = obj[o];
					this.ro.price = true;
					continue;
					}
				}
			}
			this.styleChange()
		},
		methods: {
            dangaoxiangqingChange(e) {
                this.ruleForm.dangaoxiangqing = e
            },
			styleChange() {
				this.$nextTick(()=>{
					// document.querySelectorAll('.app-update-pv . .uni-input-input').forEach(el=>{
					//   el.style.backgroundColor = this.addUpdateForm.input.content.backgroundColor
					// })
				})
			},

			// 多级联动参数

			shangjiariqiChange(e) {
				this.ruleForm.shangjiariqi = e.target.value;
				this.$forceUpdate();
			},

			// 日长控件选择日期时间
			clicktimeConfirm(val) {
				console.log(val)
				this.ruleForm.clicktime = val.result;
				this.$forceUpdate();
			},

			// 下拉变化
			dangaofenleiChange(e) {
				this.dangaofenleiIndex = e.target.value
				this.ruleForm.dangaofenlei = this.dangaofenleiOptions[this.dangaofenleiIndex]
			},
			// 下拉变化
			kouweiChange(e) {
				this.kouweiIndex = e.target.value
				this.ruleForm.kouwei = this.kouweiOptions[this.kouweiIndex]
			},

			fengmianTap() {
				let _this = this;
				this.$api.upload(function(res) {
					_this.ruleForm.fengmian = 'upload/' + res.file;
					_this.$forceUpdate();
					_this.$nextTick(()=>{
						_this.styleChange()
					})
				});
			},

			getUUID () {
				return new Date().getTime();
			},
			async onSubmitTap() {

//跨表计算判断
				var obj;
				if((!this.ruleForm.dangaomingcheng)){
					this.$utils.msg(`蛋糕名称不能为空`);
					return
				}
				if((!this.ruleForm.dangaofenlei)){
					this.$utils.msg(`蛋糕分类不能为空`);
					return
				}
				if(this.ruleForm.clicknum&&(!this.$validate.isIntNumer(this.ruleForm.clicknum))){
					this.$utils.msg(`点击次数应输入整数`);
					return
				}
				if(this.ruleForm.jf&&(!this.$validate.isIntNumer(this.ruleForm.jf))){
					this.$utils.msg(`积分应输入整数`);
					return
				}
				if((!this.ruleForm.price)){
					this.$utils.msg(`价格不能为空`);
					return
				}
				if(this.ruleForm.price&&(!this.$validate.isNumber(this.ruleForm.price))){
					this.$utils.msg(`价格应输入数字`);
					return
				}
				//更新跨表属性
			       var crossuserid;
			       var crossrefid;
			       var crossoptnum;
				if(this.cross){
					var statusColumnName = uni.getStorageSync('statusColumnName');
					var statusColumnValue = uni.getStorageSync('statusColumnValue');
					if(statusColumnName!='') {
                        if(!obj) {
						    obj = uni.getStorageSync('crossObj');
                        }
						if(!statusColumnName.startsWith("[")) {
							for (var o in obj){
								if(o==statusColumnName){
									obj[o] = statusColumnValue;
								}

							}
							var table = uni.getStorageSync('crossTable');
							await this.$api.update(`${table}`, obj);
						} else {
						       crossuserid=Number(uni.getStorageSync('userid'));
						       crossrefid=obj['id'];
						       crossoptnum=uni.getStorageSync('statusColumnName');
						       crossoptnum=crossoptnum.replace(/\[/,"").replace(/\]/,"");
						}
					}
				}
				if(crossrefid && crossuserid) {
					this.ruleForm.crossuserid=crossuserid;
					this.ruleForm.crossrefid=crossrefid;
					let params = {
						page: 1,
						limit:10,
						crossuserid:crossuserid,
						crossrefid:crossrefid,
					}
					let res = await this.$api.list(`dangaoxinxi`, params);
					if (res.data.total >= crossoptnum) {
						this.$utils.msg(uni.getStorageSync('tips'));
						return false;
					} else {
                //跨表计算
						if(this.ruleForm.id){
							await this.$api.update(`dangaoxinxi`, this.ruleForm);
						}else{
							await this.$api.add(`dangaoxinxi`, this.ruleForm);
						}
						this.$utils.msgBack('提交成功');
					}
				} else {
                //跨表计算
					if(this.ruleForm.id){
						await this.$api.update(`dangaoxinxi`, this.ruleForm);
					}else{
						await this.$api.add(`dangaoxinxi`, this.ruleForm);
					}
					this.$utils.msgBack('提交成功');
				}
			},
			optionsChange(e) {
				this.index = e.target.value
			},
			bindDateChange(e) {
				this.date = e.target.value
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			toggleTab(str) {
				this.$refs[str].show();
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		min-height: calc(100vh - 44px);
		box-sizing: border-box;
	}
</style>

💕💕作者:计算机源码社
💕💕个人简介:本人 八年开发经验,擅长Java、Python、PHP、.NET、Node.js、Android、微信小程序、爬虫、大数据、机器学习等,大家有这一块的问题可以一起交流!
💕💕学习资料、程序开发、技术解答、文档报告
💕💕如需要源码,可以扫取文章下方二维码联系咨询

SpringBoot 是一个简化了构建独立部署的生产级Java应用的框架,而 UniApp 则是一个跨平台的开发工具,它允许开发者使用一套代码库创建适应多个平台的小程序。如果你想结合 SpringBoot 和 UniApp 开发一个基于微信小程序蛋糕订购系统,可以按照以下步骤设计: 1. **项目初始化**: - 使用 Spring Initializr 创建一个新的 Maven 或 Gradle Spring Boot 应用。 - 添加必要的依赖,如 Thymeleaf (用于前端模板), Swagger (API文档) 和 UniApp SDK。 ```java dependencies { implementation('org.springframework.boot:spring-boot-starter-web') implementation('org.springframework.boot:spring-boot-starter-thymeleaf') annotationProcessor('io.springfox:springfox-gradle-plugin') } ``` 2. **服务端 API 设计**: - 定义 RESTful API 接口,比如 `CakeController`,处理订单、商品信息等操作。 ```java @RestController public class CakeController { // GET /cakes 获取所有蛋糕信息 @GetMapping("/cakes") List<Cake> getAllCakes(); // POST /orders/place 订购蛋糕 @PostMapping("/orders/place") Order placeOrder(@RequestBody OrderRequest request); } ``` 3. **数据库模型**: - 设计数据库实体类,例如 `Cake`, `Order` 等,并使用 JPA 进行映射。 4. **前端界面**: - 使用 UniApp 的 Vue 或 TypeScript 框架编写页面布局和交互逻辑,通过网络请求访问后端 API 获取数据并渲染到小程序中。 5. **微信小程序集成**: - 在 UniApp 中配置微信小程序环境,使用 wx.request 调用你的 Spring Boot 后台 API。 6. **登录注册功能**: - 设计用户管理模块,包括用户登录验证、权限控制等。 7. **错误处理和安全性**: - 使用 Spring Security 对 API 进行保护,添加异常处理和日志记录。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值