ting 5 months ago
parent
commit
64f63de98c
  1. 55
      src/views/FrontView.vue

55
src/views/FrontView.vue

@ -25,7 +25,7 @@ const first = ref();
first.value = { first.value = {
id: 1, id: 1,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: false voted: false
} }
@ -33,7 +33,7 @@ const second = ref();
second.value = { second.value = {
id: 2, id: 2,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: false voted: false
} }
@ -41,7 +41,7 @@ const third = ref();
third.value = { third.value = {
id: 3, id: 3,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: false voted: false
} }
@ -50,7 +50,7 @@ const backCandidates = ref([
{ {
id: 4, id: 4,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: true voted: true
@ -58,14 +58,14 @@ const backCandidates = ref([
{ {
id: 5, id: 5,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: true voted: true
}, },
{ {
id: 6, id: 6,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: true voted: true
} }
@ -73,28 +73,28 @@ const backCandidates = ref([
{ {
id: 7, id: 7,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: false voted: false
}, },
{ {
id: 8, id: 8,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: true voted: true
}, },
{ {
id: 9, id: 9,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: true voted: true
}, },
{ {
id: 10, id: 10,
name: "tom", name: "tom",
avatar: "../assets/头像框.png",
avatar: "https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png",
votes: 100, votes: 100,
voted: false voted: false
} }
@ -149,11 +149,11 @@ function vote(code) {
<span class="channle-write">2025年财富大分配</span> <span class="channle-write">2025年财富大分配</span>
</div> </div>
<div class="title"> <div class="title">
<img class="duiyi" src="../assets/哪些市场 投资机会更多?.png">
<img class="duiyi" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7cb578552356d1a893f8de627210ba46.png">
</div> </div>
<!-- 投票规则 --> <!-- 投票规则 -->
<div class="rules"> <div class="rules">
<img class="rule-title" src="../assets/投票规则.png">
<img class="rule-title" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/39fb93653887ae79fd68296e2ff0ecf2.png">
<div class="rules-content"> <div class="rules-content">
每人每天最多可以投三票<br> 每人每天最多可以投三票<br>
当天不可重复投一个市场<br> 当天不可重复投一个市场<br>
@ -166,13 +166,13 @@ function vote(code) {
<div class="content"> <div class="content">
<!-- 一二三 --> <!-- 一二三 -->
<div class="yes"> <div class="yes">
<img class="yiersan" src="../assets/前三.png">
<img class="yiersan" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/d243f8736bd4b38ba311773652e7907c.png">
</div> </div>
<!-- 第二名 --> <!-- 第二名 -->
<div class="second" :second="second"> <div class="second" :second="second">
<!-- 头像图片 --> <!-- 头像图片 -->
<img class="cover2" :src="second.avatar"> <img class="cover2" :src="second.avatar">
<!-- <img class="cover2" src="../assets/flag_america.png"> -->
<!-- <img class="cover2" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7fc80db4c931cfa27f20c52ed4fc4479.png"> -->
<!-- 投票按钮 --> <!-- 投票按钮 -->
<div class="one-button2" v-if="second.voted == false" @click="vote(second.jwCode)">投票</div> <div class="one-button2" v-if="second.voted == false" @click="vote(second.jwCode)">投票</div>
<div class="buttoned2" v-else @click="vote(second.jwCode)">已投票</div> <div class="buttoned2" v-else @click="vote(second.jwCode)">已投票</div>
@ -185,7 +185,7 @@ function vote(code) {
<div class="first" :first="first"> <div class="first" :first="first">
<!-- 头像图片 --> <!-- 头像图片 -->
<img class="cover1" :src="first.avatar"> <img class="cover1" :src="first.avatar">
<!-- <img class="cover1" src="../assets/flag_america.png"> -->
<!-- <img class="cover1" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7fc80db4c931cfa27f20c52ed4fc4479.png"> -->
<!-- 投票按钮 --> <!-- 投票按钮 -->
<div class="one-button1" v-if="first.voted == false" @click="vote(first.jwCode)">投票</div> <div class="one-button1" v-if="first.voted == false" @click="vote(first.jwCode)">投票</div>
<div class="buttoned1" v-else @click="vote(first.jwCode)">已投票</div> <div class="buttoned1" v-else @click="vote(first.jwCode)">已投票</div>
@ -199,7 +199,7 @@ function vote(code) {
<!-- 头像图片 --> <!-- 头像图片 -->
<img class="cover3" :src="third.avatar"> <img class="cover3" :src="third.avatar">
<!-- <img class="cover3" src="../assets/flag_america.png"> -->
<!-- <img class="cover3" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7fc80db4c931cfa27f20c52ed4fc4479.png"> -->
<!-- 投票按钮 --> <!-- 投票按钮 -->
<div class="one-button3" v-if="third.voted == false" @click="vote(third.jwCode)">投票</div> <div class="one-button3" v-if="third.voted == false" @click="vote(third.jwCode)">投票</div>
<div class="buttoned3" v-else @click="vote(third.jwCode)">已投票</div> <div class="buttoned3" v-else @click="vote(third.jwCode)">已投票</div>
@ -217,8 +217,7 @@ function vote(code) {
<!-- 排名 --> <!-- 排名 -->
<div class="num">{{ index + 4 }}</div> <div class="num">{{ index + 4 }}</div>
<!-- 头像 --> <!-- 头像 -->
<!-- flag_america.png -->
<!-- <img class="list-avatar" src="../assets/flag_america.png"> -->
<!-- <img class="list-avatar" src="https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7fc80db4c931cfa27f20c52ed4fc4479.png"> -->
<img class="list-avatar" :src="backCandidate.avatar"> <img class="list-avatar" :src="backCandidate.avatar">
<!-- 投票数 --> <!-- 投票数 -->
<div class="votes">已有{{ backCandidate.votes }}人投票</div> <div class="votes">已有{{ backCandidate.votes }}人投票</div>
@ -236,7 +235,7 @@ function vote(code) {
/* 平板 */ /* 平板 */
@media (min-width: 750px) and (max-width:1280px) { @media (min-width: 750px) and (max-width:1280px) {
.container { .container {
background-image: url('../assets/bg.png');
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7a87b7f485fdd3fefcde98db68a04024.png);
background-repeat: no-repeat; background-repeat: no-repeat;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -252,7 +251,7 @@ function vote(code) {
/* 电脑 */ /* 电脑 */
@media (min-width:1280px) { @media (min-width:1280px) {
.container { .container {
background-image: url('../assets/bg.png');
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7a87b7f485fdd3fefcde98db68a04024.png);
background-repeat: no-repeat; background-repeat: no-repeat;
width: 38%; width: 38%;
height: 100%; height: 100%;
@ -267,7 +266,7 @@ function vote(code) {
@media (max-width:750px) { @media (max-width:750px) {
.container { .container {
background-image: url('../assets/bg.png');
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/7a87b7f485fdd3fefcde98db68a04024.png);
background-repeat: no-repeat; background-repeat: no-repeat;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -291,7 +290,7 @@ function vote(code) {
} }
.channle { .channle {
background-image: url(/src/assets/top.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/d6f7012e5781265719ceaba242d20d74.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
width: 65%; width: 65%;
@ -356,7 +355,7 @@ function vote(code) {
} }
.avatar-box2 { .avatar-box2 {
background-image: url(../assets/头像框.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png);
position: absolute; position: absolute;
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -427,7 +426,7 @@ function vote(code) {
} }
.num2 { .num2 {
background-image: url(../assets/2.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/e20b1a8fdb716de8584dfab7d1d49f10.png);
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
width: 7%; width: 7%;
@ -440,7 +439,7 @@ function vote(code) {
.avatar-box1 { .avatar-box1 {
background-image: url(../assets/头像框.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png);
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
@ -512,7 +511,7 @@ function vote(code) {
} }
.num1 { .num1 {
background-image: url(../assets/1.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/dde85537fa379638b3e071a2aa33c434.png);
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
@ -524,7 +523,7 @@ function vote(code) {
} }
.avatar-box3 { .avatar-box3 {
background-image: url(../assets/头像框.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/c2ead8be86eba03ebff62c7d0f3f875b.png);
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;
@ -597,7 +596,7 @@ function vote(code) {
.num3 { .num3 {
background-image: url(../assets/3.png);
background-image: url(https://cdn.legu168.com/jtzy/Product/pcjingwang/uploads/images/737192625328656cc5717014bd81c32e.png);
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
position: absolute; position: absolute;

Loading…
Cancel
Save