Browse Source

图片样式修改

yjt_vue
ting 5 months ago
parent
commit
7c27cac8b0
  1. 2
      package.json
  2. 12
      src/api/CanApi.js
  3. BIN
      src/assets/image.png
  4. 81
      src/views/FrontView.vue

2
package.json

@ -4,7 +4,7 @@
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite",
"dev": "vite --host 0.0.0.0",
"build": "vite build", "build": "vite build",
"preview": "vite preview" "preview": "vite preview"
}, },

12
src/api/CanApi.js

@ -2,18 +2,18 @@ import service from "."
const CanApi = { const CanApi = {
//获取候选人列表 //获取候选人列表
getCandidates(jwcode){
return service.get('/getCandidates/'+`${jwcode}`);
getCandidates(token){
return service.post('/getCandidates/',token);
}, },
//投票 //投票
Vote(voter){
Vote(token,code){
console.log("+++++++++") console.log("+++++++++")
return service.post('/vote',voter)
return service.post('/vote',{token,code})
}, },
//查看详情 //查看详情
Detail(code){
return service.get('/getVotesByCandidate/'+`${code}`)
Detail(token){
return service.get('/getVotesByCandidate/'+`${token}`)
} }
} }

BIN
src/assets/image.png

Before

Width: 45  |  Height: 36  |  Size: 3.3 KiB

After

Width: 400  |  Height: 400  |  Size: 113 KiB

81
src/views/FrontView.vue

@ -3,6 +3,24 @@ import CanApi from '@/api/CanApi';
import { defaultInitialZIndex, ElMessage } from 'element-plus'; import { defaultInitialZIndex, ElMessage } from 'element-plus';
import { ref } from 'vue'; import { ref } from 'vue';
//
var url = "https://wwww.voted?token=9H0l5gBX0kPIbYe1rBrnbZi0+fEeMx8pywnIlrmTxo5EOPR/wjWDV7w7+ZUseiBtf9kFa/atmNx6QfSpv5w"
var token = null;
function getToken() {
var url = "https://wwww.voted?token=9H0l5gBX0kPIbYe1rBrnbZi0+fEeMx8pywnIlrmTxo5EOPR/wjWDV7w7+ZUseiBtf9kFa/atmNx6QfSpv5w"
// 使 URL URL
var parsedUrl = new URL(url);
// 使 URLSearchParams token
// token = parsedUrl.searchParams.get("token");
token = "9H0l5gBX0kPIbYe1rBrnbZi0+fEeMx8pywnIlrmTxo5EOPR/wjWDV7w7+ZUseiBtf9kFa/atmNx6QfSpv5w";
console.log("token字符串:",token); // token
// token = JSON.parse(tokenStr);
// console.log("token json:",token);
}
getToken();
// //
const candidates = ref([]) const candidates = ref([])
const first = ref(); const first = ref();
@ -86,8 +104,8 @@ const backCandidates = ref([
]) ])
let key = 10017; let key = 10017;
// //
function loadCandidates(jwcode) {
CanApi.getCandidates(jwcode).then(result => {
function loadCandidates(token) {
CanApi.getCandidates(token).then(result => {
candidates.value = result.data; candidates.value = result.data;
candidates.value = result.data; candidates.value = result.data;
first.value = candidates.value[0]; // first.value = candidates.value[0]; //
@ -105,26 +123,19 @@ function loadCandidates(jwcode) {
console.log("候选人:", backCandidates.value); console.log("候选人:", backCandidates.value);
}) })
} }
loadCandidates(key);
loadCandidates(token);
// //
const voter = ref({
jwCode: key,
candidateJwCode: 20010,
name: "小辉"
})
function vote(code) { function vote(code) {
console.log("code:", code) console.log("code:", code)
voter.value.candidateJwCode = code;
console.log("voter:", voter.value)
// voter.value.voterJwcode,voter.value.candidateJwcode,voter.value.voterName // voter.value.voterJwcode,voter.value.candidateJwcode,voter.value.voterName
CanApi.Vote(voter.value).then(result => {
CanApi.Vote(token,code).then(result => {
if (result.code == 10000) { if (result.code == 10000) {
ElMessage.success(result.msg); ElMessage.success(result.msg);
loadCandidates(key);
loadCandidates(token);
} else { } else {
ElMessage.error(result.msg) ElMessage.error(result.msg)
loadCandidates(key);
loadCandidates(token);
} }
}) })
} }
@ -359,17 +370,17 @@ function vote(code) {
.cover2 { .cover2 {
position: absolute; position: absolute;
left: 11.5%;
top: -6%;
width: 19%;
height: 12%;
left: 11.7%;
top: -5.9%;
width: 19.1%;
height: 9%;
border-radius: 50%; border-radius: 50%;
} }
.one-button2 { .one-button2 {
position: absolute; position: absolute;
left: 9%; left: 9%;
top: 3%;
top: 2%;
width: 22%; width: 22%;
height: 3.5%; height: 3.5%;
border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px;
@ -388,7 +399,7 @@ function vote(code) {
.buttoned2 { .buttoned2 {
position: absolute; position: absolute;
left: 9%; left: 9%;
top: 3%;
top: 2%;
width: 22%; width: 22%;
height: 3.5%; height: 3.5%;
border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px;
@ -407,7 +418,7 @@ function vote(code) {
.votes2 { .votes2 {
position: absolute; position: absolute;
left: 11%; left: 11%;
top: 7%;
top: 6%;
width: 25%; width: 25%;
height: 3%; height: 3%;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -425,7 +436,7 @@ function vote(code) {
height: 15%; height: 15%;
position: absolute; position: absolute;
left: 14%; left: 14%;
top: 12%;
top: 10.5%;
/* z-index: 999; */ /* z-index: 999; */
} }
@ -436,7 +447,7 @@ function vote(code) {
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
left: 38%; left: 38%;
top: -11%;
top: -10%;
width: 25%; width: 25%;
height: 20%; height: 20%;
} }
@ -444,10 +455,10 @@ function vote(code) {
.cover1 { .cover1 {
position: absolute; position: absolute;
left: 41%;
top: -9.5%;
width: 19%;
height: 12%;
left: 40.9%;
top: -8%;
width: 19.1%;
height: 9%;
border-radius: 50%; border-radius: 50%;
} }
@ -509,7 +520,7 @@ function vote(code) {
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
left: 47%; left: 47%;
top: 9.5%;
top: 8.5%;
width: 5%; width: 5%;
height: 15%; height: 15%;
/* z-index: 999; */ /* z-index: 999; */
@ -528,10 +539,10 @@ function vote(code) {
.cover3 { .cover3 {
position: absolute; position: absolute;
left: 71%;
left: 70.8%;
top: -6%; top: -6%;
width: 19%;
height: 12%;
width: 19.1%;
height: 9%;
border-radius: 50%; border-radius: 50%;
} }
@ -539,7 +550,7 @@ function vote(code) {
position: absolute; position: absolute;
left: 69%; left: 69%;
top: 3%;
top: 2%;
width: 22%; width: 22%;
height: 3.5%; height: 3.5%;
border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px;
@ -558,7 +569,7 @@ function vote(code) {
.buttoned3 { .buttoned3 {
position: absolute; position: absolute;
left: 69%; left: 69%;
top: 3%;
top: 2%;
width: 22%; width: 22%;
height: 3.5%; height: 3.5%;
border-radius: 20px 20px 20px 20px; border-radius: 20px 20px 20px 20px;
@ -577,7 +588,7 @@ function vote(code) {
.votes3 { .votes3 {
position: absolute; position: absolute;
left: 72%; left: 72%;
top: 7%;
top: 6%;
width: 25%; width: 25%;
height: 3%; height: 3%;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
@ -594,7 +605,7 @@ function vote(code) {
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
left: 75%; left: 75%;
top: 12%;
top: 10.5%;
width: 7%; width: 7%;
height: 15%; height: 15%;
/* z-index: 999; */ /* z-index: 999; */
@ -650,7 +661,7 @@ function vote(code) {
height: 18%; height: 18%;
border-radius: 50%; border-radius: 50%;
/* 圆形头像 */ /* 圆形头像 */
margin-right: 2%;
margin-right: 2%;
} }
.votes { .votes {

Loading…
Cancel
Save