uniapp微信小程序投票系统实战 (SpringBoot2+vue3.2+element plus ) -用户投票实现

锋哥原创的uniapp微信小程序投票系统实战:

uniapp微信小程序投票系统实战课程 (SpringBoot2+vue3.2+element plus ) ( 火爆连载更新中... )_哔哩哔哩_bilibiliuniapp微信小程序投票系统实战课程 (SpringBoot2+vue3.2+element plus ) ( 火爆连载更新中... )共计21条视频,包括:uniapp微信小程序投票系统实战课程 (SpringBoot2+vue3.2+element plus ) ( 火爆连载更新中... )、第2讲 投票项目后端架构搭建、第3讲 小程序端 TabBar搭建等,UP主更多精彩视频,请关注UP账号。https://www.bilibili.com/video/BV1ea4y137xf/新建用户投票详情表t_vote_detail:

sql 复制代码
create table `t_vote_detail` (
	`id` int (11),
	`vote_id` int (11),
	`vote_item_id` int (11),
	`vote_date` datetime ,
	`openid` varchar (600)
); 

新建VoteDetail实体:

java 复制代码
package com.java1234.entity;

import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableName;
import com.fasterxml.jackson.databind.annotation.JsonSerialize;
import lombok.Data;

import java.util.Date;

/**投票详情
 * @author java1234_小锋 (公众号:java1234)
 * @site www.java1234.vip
 * @company 南通小锋网络科技有限公司
 */
@TableName("t_vote_detail")
@Data
public class VoteDetail {

    private Integer id; // 编号

    private Integer voteId; // 投票ID

    private Integer voteItemId; // 投票选项ID

    private String openid; // 投票人openid

    @TableField(select=false,exist = false)
    private WxUserInfo wxUserInfo;

    @JsonSerialize(using=CustomDateTimeSerializer.class)
    private Date voteDate;  // 投票时间

}

新建VoteDetailMapper

java 复制代码
package com.java1234.mapper;

import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.java1234.entity.VoteDetail;

/**
 * 投票详情Mapper接口
 * @author java1234_小锋
 * @site www.java1234.com
 * @company 南通小锋网络科技有限公司
 * @create 2022-02-23 22:00
 */
public interface VoteDetailMapper extends BaseMapper<VoteDetail>{


}

新建IVoteDetailService

java 复制代码
package com.java1234.service;

import com.baomidou.mybatisplus.extension.service.IService;
import com.java1234.entity.VoteDetail;

/**
 * 投票详情Service接口
 * @author java1234_小锋
 * @site www.java1234.com
 * @company 南通小锋网络科技有限公司
 * @create 2022-02-23 22:01
 */
public interface IVoteDetailService extends IService<VoteDetail> {
}

新建IVoteDetailServiceImpl

java 复制代码
package com.java1234.service.impl;

import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
import com.java1234.entity.VoteDetail;
import com.java1234.mapper.VoteDetailMapper;
import com.java1234.service.IVoteDetailService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

/**
 * 投票详情Service实现类
 * @author java1234_小锋
 * @site www.java1234.com
 * @company 南通小锋网络科技有限公司
 * @create 2022-02-23 22:02
 */
@Service("voteDetailService")
public class IVoteDetailServiceImpl extends ServiceImpl<VoteDetailMapper, VoteDetail> implements IVoteDetailService {

    @Autowired
    private VoteDetailMapper voteDetailMapper;
}

新建VoteDetailController

java 复制代码
package com.java1234.controller;

import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.core.conditions.update.UpdateWrapper;
import com.java1234.entity.R;
import com.java1234.entity.VoteDetail;
import com.java1234.entity.VoteItem;
import com.java1234.service.IVoteDetailService;
import com.java1234.service.IVoteItemService;
import com.java1234.util.JwtUtils;
import io.jsonwebtoken.Claims;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.web.bind.annotation.*;

import java.util.Date;
import java.util.HashMap;
import java.util.Map;

/**
 * 投票详情Controller控制器
 * @author java1234_小锋 (公众号:java1234)
 * @site www.java1234.vip
 * @company 南通小锋网络科技有限公司
 */
@RestController
@RequestMapping("/voteDetail")
public class VoteDetailController {

    @Autowired
    private IVoteDetailService voteDetailService;

    @Autowired
    private IVoteItemService voteItemService;



    /**
     * 添加投票
     * @param voteDetail
     * @param token
     * @return
     */
    @RequestMapping("/add")
    @Transactional
    public R add(@RequestBody VoteDetail voteDetail, @RequestHeader String token){
        System.out.println("token="+token);
        Claims claims = JwtUtils.validateJWT(token).getClaims();
        System.out.println("openid="+claims.getId());
        String openid=claims.getId();
        int count = voteDetailService.count(new QueryWrapper<VoteDetail>().eq("openid", openid).eq("vote_id", voteDetail.getVoteId()));
        Map<String,Object> resultMap=new HashMap<>();
        if(count>0){
            resultMap.put("info","您已经投票过,不能重复投票!");
        }else {
            resultMap.put("info", "投票成功!");
            voteDetail.setOpenid(openid);
            voteDetail.setVoteDate(new Date());
            // 对指定投票项的number+1操作
            VoteItem voteItem=new VoteItem();
            voteItem.setId(voteDetail.getVoteItemId());

            voteItemService.update(new UpdateWrapper<VoteItem>().setSql("number=number+1").eq("id",voteDetail.getVoteItemId()));
            voteDetailService.save(voteDetail);
        }
        return R.ok(resultMap);
    }



}

前端投票提交:

java 复制代码
submitVote:async function(e){
				let form={
					voteItemId:this.sItem,
					voteId:this.vote.id
				}
				const result=await requestUtil({url:"/voteDetail/add",data:form,method:"post"});
				if(result.code==0){
					uni.showToast({
						icon:"success",
						title:result.info
					})
				}
			}
相关推荐
codingWhat12 小时前
小程序里「嵌」H5:一套完整可落地的 WebView 集成方案
前端·uni-app·webview
WangHappy1 天前
不写 Canvas 也能搞定!小程序图片导出的 WebView 通信方案
前端·微信小程序
小时前端2 天前
微信小程序选不了本地文件?用 web-view + H5 一招搞定
前端·微信小程序·uni-app
Mr_li2 天前
给 Vue 开发者的 uni-app 快速指南
vue.js·uni-app
anyup2 天前
🔥2026最推荐的跨平台方案:H5/小程序/App/鸿蒙,一套代码搞定
前端·uni-app·harmonyos
icebreaker2 天前
Weapp-vite:原生模式之外,多一种 Vue SFC 选择
前端·vue.js·微信小程序
icebreaker2 天前
重走 Vue 长征路 Weapp-vite:编译链路与 Wevu 运行时原理拆解
前端·vue.js·微信小程序
Mintopia3 天前
Vue3 项目如何迁移到 uni-app x:从纯 Web 到多端应用的系统指南
uni-app
Mintopia3 天前
uni-app x 发展前景技术分析:跨端统一的新阶段?
uni-app
不爱说话郭德纲4 天前
告别漫长的HbuilderX云打包排队!uni-app x 安卓本地打包保姆级教程(附白屏、包体积过大排坑指南)
android·前端·uni-app