110 lines
4.4 KiB
HTML
110 lines
4.4 KiB
HTML
<!--#
|
||
layout("/layouts/platform.html"){
|
||
#-->
|
||
<style>
|
||
.el-popover__title {
|
||
font-size: 15px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.my-mt {
|
||
margin-top: 15px;
|
||
}
|
||
</style>
|
||
|
||
<div id="app" class="platform" v-cloak>
|
||
<guava ref="guava">
|
||
<template>
|
||
<el-calendar>
|
||
<template slot="dateCell" slot-scope="{date, data}">
|
||
<p :class="data.isSelected ? 'is-selected' : ''">
|
||
{{ data.day.split('-').slice(1).join('-') }} {{ data.isSelected ? '✔️' : ''}}
|
||
</p>
|
||
|
||
<div v-for="item in tableData">
|
||
<div v-if="data.day.toString()==moment(item.startTime).format('YYYY-MM-DD')">
|
||
<el-popover placement="top-start" title="活动信息" width="320" trigger="hover">
|
||
|
||
<div style="font-size: 10px">
|
||
<el-row class="my-mt">
|
||
<el-col :span="5"><b>主办单位</b>：</el-col>
|
||
<el-col :span="19">{{item.unitName}}</el-col>
|
||
</el-row>
|
||
<el-row class="my-mt">
|
||
<el-col :span="5"><b>活动地址</b>：</el-col>
|
||
<el-col :span="19">{{item.address}}</el-col>
|
||
</el-row>
|
||
<el-row class="my-mt">
|
||
<el-col :span="5"><b>报名时间</b>：</el-col>
|
||
<el-col :span="19">{{moment(item.applyStartTime).format('YYYY-MM-DD HH:mm')}} 至
|
||
{{moment(item.applyEndTime).format('YYYY-MM-DD HH:mm')}}
|
||
</el-col>
|
||
</el-row>
|
||
<el-row class="my-mt">
|
||
<el-col :span="5"><b>活动时间</b>：</el-col>
|
||
<el-col :span="19">{{moment(item.startTime).format('YYYY-MM-DD HH:mm')}} 至
|
||
{{moment(item.endTime).format('YYYY-MM-DD HH:mm')}}
|
||
</el-col>
|
||
</el-row>
|
||
<el-row class="my-mt">
|
||
<el-col :span="5"><b>报名链接</b>：</el-col>
|
||
<el-col :span="19">
|
||
<el-link style="font-size: 8px" type="primary" target="_blank"
|
||
@click="djbm">
|
||
点击报名
|
||
</el-link>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
|
||
<span class="text-primary" slot="reference">
|
||
{{item.name}}-(<span
|
||
v-html="activity.school.getStatus(item.close,item.applyStartTime,item.applyEndTime,item.startTime,item.endTime)"></span>)
|
||
</span>
|
||
</el-popover>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</el-calendar>
|
||
</template>
|
||
</guava>
|
||
</div>
|
||
|
||
<script>
|
||
var vue = new Vue({
|
||
el: '#app',
|
||
data() {
|
||
return {
|
||
tableKey: new Date().getTime(),
|
||
tabLoading: false,
|
||
tableData: []
|
||
}
|
||
},
|
||
components: {
|
||
'guava': httpVueLoader('/components/plugins/Guava.vue'),
|
||
},
|
||
methods: {
|
||
djbm() {
|
||
sublime.jumpPagePjax('/platform/activity/apply')
|
||
},
|
||
async getData() {
|
||
this.tabLoading = true
|
||
const resp = await $.get(loc() + "/getData")
|
||
this.tabLoading = false
|
||
if(resp.code===0){
|
||
this.tableData = resp.data
|
||
this.tableKey = new Date().getTime()
|
||
}else{
|
||
this.notifyWarning(resp.msg)
|
||
}
|
||
}
|
||
},
|
||
async created() {
|
||
await this.getData()
|
||
}
|
||
})
|
||
</script>
|
||
<!--#
|
||
}
|
||
#-->
|