Subprograma del centro comercial WeChat basado en Java SpringBoot y Vue UniAPP

        Resumen

        En los últimos años, con la mejora continua de la infraestructura de red de mi país y el desarrollo continuo de la tecnología de la información, los métodos de pago de terceros se han popularizado ampliamente y las compras en línea se han convertido en una parte importante de la vida de las personas. La plataforma de PC puede ser suficiente. Puedes disfrutar comprando en casa.

        El subprograma WeChat de compras en línea basado en teléfonos móviles aprovecha la portabilidad de los terminales inteligentes para permitir al público comprar sus productos favoritos en cualquier momento y en cualquier lugar. El modelo de compras orientado a la comunidad se origina a partir del concepto de O2O, que combina transacciones de productos básicos fuera de línea con la Internet y hace de Internet una experiencia de compra en línea.plataforma comercial. El sistema se basa en Internet, toma el entorno del círculo de vida como unidad básica y aprovecha al máximo la infraestructura de información de la comunidad. El nuevo modelo de comercio electrónico que combina pequeñas tiendas físicas y tiendas en línea alrededor del círculo de vida. es un nuevo avance en el comercio electrónico tradicional. Su enfoque en línea está en las necesidades de conveniencia de los consumidores, más en satisfacer el marketing interactivo de los miembros y la afluencia de tiendas físicas, y su enfoque fuera de línea es más en brindar a los usuarios mejores y más convenientes servicios modernos de experiencia de compra inteligente, por lo que desarrollar un sistema de tienda basado en estos widgets de WeChat se ha convertido en una necesidad, y para los graduados en informática, aplicar las computadoras en la gestión práctica de la información también es una actividad práctica significativa.

        El núcleo del desarrollo del nuevo comercio minorista es satisfacer las necesidades de los clientes en escenarios de compras específicos. Con el desarrollo de Internet móvil y la tendencia de desarrollo de la informatización y la tecnología de los clientes, el método de compra rápida y la entrega rápida son cada vez más favorecido por los usuarios, dijo que proporcionar canales de compra en línea convenientes y rápidos para las tiendas físicas es una forma importante de mejorar la experiencia del cliente y mejorar la eficiencia minorista. Los minoristas extranjeros generalmente ofrecen servicios de compras comunitarias en línea y fuera de línea. A juzgar por los principales sistemas de compras en línea actuales, existen principalmente sistemas de compras basados ​​en PC, sistemas de compras de aplicaciones y portales de compras que dependen de aplicaciones de terceros. A principios de 2017, el lanzamiento oficial de los miniprogramas WeChat activó aún más el ecosistema WeChat. En comparación con las aplicaciones nativas, la característica más importante de los miniprogramas WeChat es que los usuarios no necesitan descargarlos e instalarlos, y pueden obtenerlos escaneando o buscando La plataforma de subprogramas liviana puede conectar mejor los servicios fuera de línea.

 

Las funciones realizadas por todo el proyecto.

Los tres roles son administradores, comerciantes y compradores, todos los cuales son programas pequeños. Inicie sesión con autorización de WeChat.

Usuarios comunes: 1. Explorar información de productos, ver categorías 2. Explorar información de productos recomendados (recomendado según el volumen de ventas) 3. Agregar carrito de compras y pagar pedidos 4. Ver detalles de pedidos personales y evaluar pedidos 5. Solicitar convertirse en comerciante 6. Modificar recibos Dirección de carga y otras funciones;

Comerciantes: 1. Administre toda la información del producto, puede cargar productos 2. Administre toda la información del pedido, entregue productos, etc .;

Administrador: gestionar categorías de productos, revisar productos, etc.

 

 

tecnología utilizada

Marco utilizado: marco backend SpringBoot, lenguaje java. Marco front-end UniApp, sintaxis Vue.js.

Base de datos utilizada: MySql5.7 u 8

Parte de la visualización del código.

<template>
	<view class="content">
		<view class="navbar">
			<view 
				v-for="(item, index) in navList" :key="index" 
				class="nav-item" 
				:class="{current: tabCurrentIndex === index}"
				@click="tabClick(index)"
			>
				{
   
   {item.text}}
			</view>
		</view>

		<swiper :current="tabCurrentIndex" class="swiper-box" duration="300" @change="changeTab">
			<swiper-item class="tab-content" v-for="(tabItem,tabIndex) in navList" :key="tabIndex">
				<scroll-view 
					class="list-scroll-content" 
					scroll-y
					@scrolltolower="loadData"
				>
					<!-- 空白页 -->
					<empty v-if=" tabItem.orderList.length === 0"></empty>
					
					<!-- 订单列表 -->
					<view 
						v-for="(item,index) in tabItem.orderList" :key="index"
						class="order-item"
					>
						<view class="i-top b-b">
							<text class="time">{
   
   {item.createTime}}</text>
							<text class="state" :style="{color: item.stateTipColor}">{
   
   {getStat(item.stat)}}</text>
							<text 
								v-if="item.state===9" 
								class="del-btn yticon icon-iconfontshanchu1"
								@click="deleteOrder(index)"
							></text>
						</view>
						
						<scroll-view v-if="item.goods.length > 1" class="goods-box" scroll-x>
							<view
								v-for="(goodsItem, goodsIndex) in item.goods" :key="goodsIndex"
								class="goods-item"
							>
								<image class="goods-img" :src="picUrl + goodsItem.pic1" mode="aspectFill"></image>
							</view>
						</scroll-view>
						<view 
							v-if="item.goods.length === 1" 
							class="goods-box-single"
							v-for="(goodsItem, goodsIndex) in item.goods" :key="goodsIndex"
						>
							<image class="goods-img" :src="picUrl + goodsItem.pic1" mode="aspectFill"></image>
							<view class="right">
								<text class="title clamp">{
   
   {goodsItem.title}}</text>
								<text class="attr-box">{
   
   {goodsItem.name}}  x {
   
   {goodsItem.num}}</text>
								<text class="price">{
   
   {goodsItem.price}}</text>
							</view>
						</view>
						
						<view class="price-box">
							共
							<text class="num">{
   
   {item.goods.length}}</text>
							件商品 实付款
							<text class="price">{
   
   {item.priceAll}}</text>
						</view>
						<view class="action-box b-t" v-if="item.stat == 3">
							<!-- <button class="action-btn" @click="cancelOrder(item)">取消订单</button> -->
							<button class="action-btn recom"  @click="getComment(item)">立即评价</button>
						</view>
						<view class="action-box b-t" v-if="item.stat == 2&&user.uid == item.userFk">
							<button class="action-btn recom" @click="changeOrder(item.id,3)">收货</button>
						</view>
						<view class="action-box b-t" v-if="item.stat == 1&&user.type == 2">
							<button class="action-btn recom" @click="changeOrder(item.id,2)">发货</button>
						</view>
						<view class="action-box b-t" v-if="item.stat == 4">
							<text class="u-tips-color">已完成</text>
						</view>
					</view>
					 
					<uni-load-more :status="tabItem.loadingType"></uni-load-more>
					
				</scroll-view>
			</swiper-item>
		</swiper>
		
		<u-modal v-model="show" title="评论" @confirm="commentSub">
			<view class="slot-content">

				<view class="u-flex u-p-20 u-border-bottom" v-if="selItem.length > 0" v-for="(item ,index) in selItem">
					<image style="width: 100rpx;height:100rpx;" :src="picUrl+item.pic1"></image>
					<u-input class="u-m-20 u-m-l-30" type="text" placeholder="请输入评论" v-model="item.memo" placeholderStyle="textAlign:center"/>
				</view>
				
			</view>
		</u-modal>
		
	</view>
</template> 

Subprograma del centro comercial WeChat basado en SpringBoot y UniAPP

Supongo que te gusta

Origin blog.csdn.net/qq_28245905/article/details/131549322
Recomendado
Clasificación