186 lines
3.5 KiB
Vue
186 lines
3.5 KiB
Vue
<template>
|
||
<view class="begin">
|
||
<view class="title">
|
||
活动详情
|
||
</view>
|
||
<view class="content">
|
||
<view class="voluteer_card" v-if="ever">
|
||
<image :src="`http://124.93.196.45:10091/Neusoft/times-model${ever.picPath}`"></image>
|
||
<view class="voluteer_card_bottom">
|
||
<p>{{ever.title}}</p>
|
||
<p>活动时间：
|
||
{{ever.startDate}}~{{ever.endDate}}
|
||
</p>
|
||
<p>发起方：{{ever.sponsor}}</p>
|
||
</view>
|
||
</view>
|
||
<view class="voluteer_card_all">
|
||
<p>活动详情</p>
|
||
<p>{{ever.content}}</p>
|
||
</view>
|
||
<view class="voluteer_bottom">
|
||
<view><text>{{ever.signUpNum}}</text>人已报名</view>
|
||
<view @click="succ">报名</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
props: {},
|
||
data() {
|
||
return {
|
||
id: null,
|
||
morevalue: null,
|
||
ever: null
|
||
}
|
||
},
|
||
async mounted() {
|
||
this.ever = (await this.requests("down", `/activity/app-o/detail?id=${this.id}`)).data
|
||
console.log(this.ever);
|
||
},
|
||
onLoad(option) {
|
||
this.id = option.id
|
||
},
|
||
methods: {
|
||
async requests(updown, path) {
|
||
let response
|
||
if (updown == "up") {
|
||
response = await fetch(`http://124.93.196.45:10091/Neusoft/times-model${path}`, {
|
||
method: "POST",
|
||
headers: {
|
||
"Content-Type": "application/json",
|
||
},
|
||
body: JSON.stringify({
|
||
"password": "0CYdq6Hn",
|
||
"username": "6dOMIgIU"
|
||
})
|
||
})
|
||
} else if (updown == "down") {
|
||
response = await fetch(`http://124.93.196.45:10091/Neusoft/times-model${path}`, {
|
||
method: "GET",
|
||
headers: {
|
||
"Content-Type": "application/json",
|
||
"Authorization": (await this.requests("up", "/app/login")).token
|
||
},
|
||
})
|
||
|
||
}
|
||
const data = await response.json()
|
||
console.log(data)
|
||
return data
|
||
},
|
||
succ(){
|
||
uni.showToast({
|
||
title: '报名成功！',
|
||
icon: 'success'
|
||
})
|
||
}
|
||
}
|
||
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.begin {
|
||
background-color: rgb(221, 221, 221);
|
||
}
|
||
|
||
.title {
|
||
font-size: 1.3rem;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
background-color: #fff;
|
||
}
|
||
|
||
.voluteer_card {
|
||
height: 34.5vh;
|
||
background-color: #fff;
|
||
margin: 2%;
|
||
border-radius: 10px;
|
||
}
|
||
|
||
.voluteer_card image {
|
||
width: 100%;
|
||
height: 25vh;
|
||
border-radius: 10px;
|
||
}
|
||
|
||
.voluteer_card_bottom {
|
||
padding: 0% 4%;
|
||
}
|
||
|
||
.voluteer_card_bottom p:nth-child(1) {
|
||
font-size: 1.2rem;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.voluteer_card_bottom p:not(:nth-child(1)) {
|
||
font-size: 0.8rem;
|
||
padding: 1% 0;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.voluteer_card_bottom p:last-child {
|
||
padding-bottom: 2%;
|
||
}
|
||
|
||
.voluteer_card_bottom+view {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 0% 4% 2% 4%;
|
||
}
|
||
|
||
.voluteer_card_all {
|
||
height: 60vh;
|
||
background-color: #fff;
|
||
margin: 2%;
|
||
border-radius: 10px;
|
||
padding: 3%;
|
||
}
|
||
|
||
.voluteer_card_all p:first-child {
|
||
font-size: 1.2rem;
|
||
font-weight: bold;
|
||
border-left: 5px solid #C2050F;
|
||
padding-left: 3%;
|
||
}
|
||
|
||
.voluteer_card_all p:nth-child(2) {
|
||
padding: 5%;
|
||
}
|
||
|
||
.voluteer_bottom {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
height: 5vh;
|
||
line-height: 5vh;
|
||
background-color: white;
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 100vw;
|
||
text-align: center;
|
||
}
|
||
|
||
.voluteer_bottom view:nth-child(1) {
|
||
width: 50%;
|
||
background-color: #f9f9f9;
|
||
}
|
||
|
||
.voluteer_bottom view:nth-child(1) text {
|
||
color: #C2050F;
|
||
font-weight:bold ;
|
||
}
|
||
|
||
.voluteer_bottom view:nth-child(2) {
|
||
width: 50%;
|
||
background-color:#C2050F;
|
||
}
|
||
</style>
|