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账号。icon-default.png?t=N7T8https://www.bilibili.com/video/BV1ea4y137xf/

投票后 跳转列表页面:

uni.navigateTo({url:"/pages/createVoteList/createVoteList"})

新建voteDetail页面 投票详情页面

{"path": "pages/voteDetail/voteDetail","style": {"navigationBarTitleText": "投票明细"}}
		goVoteDetailPage:function(){uni.navigateTo({url:"/pages/voteDetail/voteDetail?id="+this.vote.id})},
<template><view class="options"><view class="option" v-for="item in vote.voteItemList"><view class="name_vote_number"><text class="name">{{item.name}}</text><view class="number"> [ {{item.number}} ] 票</view></view><view><view class="detail" @click="goVotePeopleDetail(item.id,item.name)">查看明细</view></view></view></view>
</template><script>import {getBaseUrl, requestUtil} from "../../util/requestUtil.js"export default{data(){return{vote:{}}},onLoad(e) {console.log(e.id);this.getVoteInfo(e.id)},methods:{getVoteInfo:async function(id){const result=await requestUtil({url:"/vote/"+id,method:"get"});console.log(result)this.vote=result.vote;},goVotePeopleDetail:function(itemId,itemName){uni.navigateTo({url:"/pages/votePeopleDetail/votePeopleDetail?voteId="+this.vote.id+"&voteItemId="+itemId+"&voteItemName="+itemName})}}}
</script><style lang="scss">.options{margin-top: 0px;padding: 10px;padding-top: 0px;padding-bottom: 70px;.option{margin-top: 10px;display: flex;justify-content: space-between;padding: 15px;border-radius: 10px;background-color: white;.name_vote_number{.name{padding-left: 2px;font-weight: bolder;}.number{padding-top: 5px;color: blue;font-size: 11px;}}.detail{margin-top: 10px;padding: 5px;padding-top: 8px;padding-bottom: 8px;border-radius: 10px;background-color: #e6eeff;font-size: 12px;width: 55px;text-align: center;}}}</style>

新建votePeopleDetail页面 投票人详情页面

		{"path": "pages/votePeopleDetail/votePeopleDetail","style": {"navigationBarTitleText": "投票人明细"}}
<template><view class="detail"><view class="header"><view><text class="option">[选项]</text>&nbsp;&nbsp;<text class="itemName">{{voteItemName}}</text>&nbsp;&nbsp;</view><view><text class="total">[共{{voteDetailList.length}}票]</text></view></view><view class="list"><block v-for="(value,index) in voteDetailList" :key="index"><view class="item"><view class="people"><view class="user_image"><image :src="this.baseUrl+'/image/userAvatar/'+value.wxUserInfo.avatarUrl" ></image></view><view class="user_name_wrap"><text class="nick_name">{{value.wxUserInfo.nickName}}</text><text class="vote_date">投票时间:{{value.voteDate}}</text></view></view></view></block></view></view>
</template><script>import {getBaseUrl, requestUtil} from "../../util/requestUtil.js"export default{data(){return{voteDetailList:[],voteItemName:'',baseUrl:''}},onLoad(e) {console.log(e.voteId);console.log(e.voteItemId);console.log(e.voteItemName);this.voteItemName=e.voteItemNamethis.getVoteDetailInfo(e.voteId,e.voteItemId);this.baseUrl=getBaseUrl();},methods:{getVoteDetailInfo:async function(voteId,voteItemId){const result=await requestUtil({url:"/voteDetail/"+voteId+"/"+voteItemId,method:"get"});console.log(result)this.voteDetailList=result.voteDetailList;}}}</script><style lang="scss">.detail{.header{padding-left: 20px;padding-top: 20px;padding-bottom: 20px;padding-right: 20px;display: flex;justify-content: space-between;.option{color: green;}.total{color: green;font-size: 13px;}}.list{.item{background-color: white;margin-bottom: 5px;padding: 10px;.people{display: flex;flex-direction: row;.user_image{width: 100rpx;height: 100rpx;text-align: center;padding: 0rpx;margin: 0rpx;image{border-radius: 50%;width: 90rpx;height: 90rpx;}}.user_name_wrap{display: flex;flex-direction: column;padding-left: 10px;.nick_name{}.vote_date{padding-top: 10rpx;font-size: 25rpx;}}}}}}</style>
   /*** 根据id查询投票人详情* @param voteId* @param voteItemId* @return*/@GetMapping("/{voteId}/{voteItemId}")public R findById(@PathVariable(value = "voteId")Integer voteId,@PathVariable(value = "voteItemId")Integer voteItemId){List<VoteDetail> voteDetailList = voteDetailService.list(new QueryWrapper<VoteDetail>().eq("vote_id", voteId).eq("vote_item_id", voteItemId));for(VoteDetail voteDetail:voteDetailList){WxUserInfo wxUserInfo = wxUserInfoService.getOne(new QueryWrapper<WxUserInfo>().eq("openid", voteDetail.getOpenid()));voteDetail.setWxUserInfo(wxUserInfo);}Map<String,Object> resultMap=new HashMap<>();resultMap.put("voteDetailList",voteDetailList);return R.ok(resultMap);}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/629168.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

图像处理------亮度

from PIL import Imagedef change_brightness(img: Image, level: float) -> Image:"""按照给定的亮度等级&#xff0c;改变图片的亮度"""def brightness(c: int) -> float:return 128 level (c - 128)if not -255.0 < level < 25…

leetcode234. 回文链表

题目 给你一个单链表的头节点 head &#xff0c;请你判断该链表是否为回文链表。如果是&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 示例 1&#xff1a; 输入&#xff1a;head [1,2,2,1] 输出&#xff1a;true示例 2&#xff1a; 输入&#xff1a;hea…

《手把手教你》系列技巧篇(十)-java+ selenium自动化测试-元素定位大法之By class name(详细教程)

1.简介 按宏哥计划&#xff0c;本文继续介绍WebDriver关于元素定位大法&#xff0c;这篇介绍By ClassName。看到ID&#xff0c;NAME这些方法的讲解&#xff0c;小伙伴们和童鞋们应该知道&#xff0c;要做好Web自动化测试&#xff0c;最好是需要了解一些前端的基本知识。有了前端…

养成密码管理习惯,保障个人数字安全

在当今数字时代&#xff0c;保障个人信息的安全已经变得至关重要。创建和维护安全、复杂的密码是防范潜在攻击者的首要步骤。密码不仅仅是数字世界的通行证&#xff0c;更是个人隐私的最后一道防线。在本文中&#xff0c;我们将深入探讨密码安全管理的重要性。 在当今数字时代…

超实用+全覆盖!17个大分类,近500款主流实用精品AI工具导航,太贴心了!总有一款适合你。

超实用全覆盖&#xff01;17个大分类&#xff0c;近500款主流实用精品AI工具导航&#xff0c;太贴心了&#xff01;总有一款适合你。 大家好&#xff01;我是老码农。 今天给大家分享的这个工具导航&#xff1a;非常棒。 那棒在哪里呢&#xff1f; 第1点&#xff1a;非常垂…

0、机器学习导论课程所用到的数据集

房价竞争 在本机器学习课程学习过程中用到的数据集。 本课程所需数据集夸克网盘下载链接:https://pan.quark.cn/s/9b4e9a1246b2 提取码:uDzP 文件描述 train.csv:训练数据集test.csv:测试数据集data_description.txt:每个列的完整描述,最初由Dean De Cock准备,但为了与这…

Leetcode23-数组能形成多少数对(2341)

1、题目 给你一个下标从 0 开始的整数数组 nums 。在一步操作中&#xff0c;你可以执行以下步骤&#xff1a; 从 nums 选出 两个 相等的 整数 从 nums 中移除这两个整数&#xff0c;形成一个 数对 请你在 nums 上多次执行此操作直到无法继续执行。 返回一个下标从 0 开始、长…

USB8814动态信号采集卡——声音振动类信号处理的理想之选!

背景介绍&#xff1a; 科技的发展在一定程度上依赖于对信号的处理&#xff0c;信号处理技术的先进性在很大程度上决定了科技发展的速度和方向。数字信号处理技术的崛起&#xff0c;彻底改变了传统的信息与信号处理方式&#xff0c;使得数据采集这一前期工作在数字系统中发挥着…

JavaScript 学习笔记(Day1)

「写在前面」 本文为 b 站黑马程序员 pink 老师 JavaScript 教程的学习笔记。本着自己学习、分享他人的态度&#xff0c;分享学习笔记&#xff0c;希望能对大家有所帮助。 目录 1 课程介绍 2 课程软件准备工作 3 JavaScript 介绍 4 变量 5 常量 6 数据类型 7 类型转换 8 实战案…

leetcode2719. 统计整数数目

Problem: 2719. 统计整数数目 文章目录 题目思路复杂度Code 题目 给你两个数字字符串 num1 和 num2 &#xff0c;以及两个整数 max_sum 和 min_sum 。如果一个整数 x 满足以下条件&#xff0c;我们称它是一个好整数&#xff1a; num1 < x < num2 min_sum < digit_su…

最新GPT科研应用与AI绘图及论文高效写作

详情点击链接&#xff1a;最新GPT科研应用与AI绘图及论文高效写作 一OpenAI 1.最新大模型GPT-4 Turbo 2.最新发布的高级数据分析&#xff0c;AI画图&#xff0c;图像识别&#xff0c;文档API 3.GPT Store 4.从0到1创建自己的GPT应用 5. 模型Gemini以及大模型Claude2二定制…

(每日持续更新)jdk api之FileOutputStream基础、应用、实战

博主18年的互联网软件开发经验&#xff0c;从一名程序员小白逐步成为了一名架构师&#xff0c;我想通过平台将经验分享给大家&#xff0c;因此博主每天会在各个大牛网站点赞量超高的博客等寻找该技术栈的资料结合自己的经验&#xff0c;晚上进行用心精简、整理、总结、定稿&…

dp--1143. 最长公共子序列/medium 理解度B

1143. 最长公共子序列 1、题目2、题目分析3、解题步骤4、复杂度最优解代码示例5、抽象与扩展 1、题目 给你两个单词 word1 和 word2&#xff0c; 请返回将 word1 转换成 word2 所使用的最少操作数 。 你可以对一个单词进行如下三种操作&#xff1a; 插入一个字符删除一个字…

huggingface学习 | 云服务器使用git-lfs下载huggingface上的模型文件

文章目录 一、找到需要下载的huggingface文件二、准备工作&#xff08;一&#xff09;安装git-lfs&#xff08;二&#xff09; 配置git ssh 三、检查ssh连接huggingface是否成功 一、找到需要下载的huggingface文件 huggingface官网链接&#xff1a;https://huggingface.co/ 以…

Python和Java代码实现:切线法求解一维最优化问题

Python和Java代码实现&#xff1a;切线法求解一维最优化问题 代码实现Python代码Java代码 求解实例 根据概念查询&#xff0c;切线法定义如下&#xff1a; 切线法&#xff08;Tangent Method&#xff09;是一种用于求解非线性方程的数值方法。它也被称为牛顿法&#xff08;Newt…

Backtrader 文档学习-Indicators 开发

Backtrader 文档学习-Indicators 开发 1. Indicators 开发需要 Indicators 开发需要&#xff1a; 从Indicator(直接或从已存在的子类)继承派生的类定义中包括Lines指标必须至少有Line。既可以从现有的Line派生&#xff0c;也可以用已定义的Line选择性地定义可以改变行为的参…

HarmonyOS之sqlite数据库的使用

从API Version 9开始&#xff0c;鸿蒙开发中sqlite使用新接口ohos.data.relationalStore 但是 relationalStore在 getRdbStore操作时&#xff0c;在预览模式运行或者远程模拟器运行都会报错&#xff0c;导致无法使用。查了一圈说只有在真机上可以正常使用&#xff0c;因此这里…

分布式搜索引擎ElasticSearch——基础

分布式搜索引擎ElasticSearch——基础 文章目录 分布式搜索引擎ElasticSearch——基础初识elasticsearch什么是elasticsearchelasticsearch的发展正向索引和倒排索引安装elasticsearch&#xff0c;kibana部署单点es创建网络加载镜像运行 部署kibana部署DevTools 安装IK分词器在…

java----多态

什么是多态 多态是指同一个类型的对象在不同情况下表现出不同的行为。具体来说&#xff0c;多态包括两种类型&#xff1a;静态多态和动态多态。 静态多态&#xff08;编译时多态&#xff09;是通过方法重载实现的&#xff0c;即在同一个类中有多个同名但参数列表不同的方法&…

人类的逻辑常常是演绎、归纳和溯因推理混合

人类的逻辑推理往往是一种综合运用不同推理方式的能力。 演绎推理是从已知的前提出发&#xff0c;推断出必然的结论。通过逻辑规则的应用&#xff0c;人们可以从一些已知的事实或前提出发&#xff0c;得出一个必然成立的结论。演绎推理是一种严密的推理方式&#xff0c;它能够保…