227 lines
8.5 KiB
HTML
227 lines
8.5 KiB
HTML
<!--数据看板 djx 2019-07-24-->
|
||
<!--#
|
||
layout("/layouts/platform.html"){
|
||
#-->
|
||
|
||
<style>
|
||
|
||
.clearfix {
|
||
font-weight: bold;
|
||
|
||
}
|
||
|
||
.el-card__header {
|
||
background-color: #ebeef5;
|
||
/*ebb563*/
|
||
padding: 8px 10px;
|
||
border-bottom: 1px solid #EBEEF5;
|
||
-webkit-box-sizing: border-box;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.el-card__body {
|
||
padding: 15px 5px 5px 5px;
|
||
}
|
||
|
||
.el-card {
|
||
margin-bottom: 5px;
|
||
}
|
||
|
||
.el-calendar-table .current {
|
||
height: 150px !important;
|
||
}
|
||
|
||
.el-calendar-table .el-calendar-day {
|
||
-webkit-box-sizing: border-box;
|
||
box-sizing: border-box;
|
||
padding: 8px;
|
||
height: 100%;
|
||
}
|
||
|
||
.el-calendar-table th {
|
||
text-align: center;
|
||
}
|
||
</style>
|
||
|
||
<div id="app" v-cloak>
|
||
<!-- <el-row class="header navbar bg-white shadow" style="padding-left: 5px;padding-right: 5px;background-color: #e6f1fe;">-->
|
||
<!-- <div class="btn-group tool-button mt5" style="width: 100%">-->
|
||
<!-- <el-date-picker-->
|
||
<!-- v-model="year"-->
|
||
<!-- type="year"-->
|
||
<!-- style="width: 100%"-->
|
||
<!-- value-format="yyyy"-->
|
||
<!-- :clearable="true"-->
|
||
<!-- placeholder="选择年份">-->
|
||
<!-- </el-date-picker>-->
|
||
<!-- </div>-->
|
||
<!-- </el-row>-->
|
||
|
||
<div style="float: left;width: 100%;">
|
||
<el-card class="box-card">
|
||
<!-- <div slot="header" class="clearfix">
|
||
<span>活动日历：</span>
|
||
</div>-->
|
||
<div class="text item">
|
||
<el-calendar v-model="day">
|
||
<!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
|
||
<template
|
||
slot="dateCell"
|
||
slot-scope="{date, data}">
|
||
<p :class="data.isSelected ? 'is-selected' : ''">
|
||
{{ data.day.split('-').slice(1).join('-') }}
|
||
</p>
|
||
<div v-for="item,index in yy.filter(v => data.day.toString() == v.lab.substring(0, 10).toString())">
|
||
<el-popover
|
||
placement="top-start"
|
||
:title="item.val"
|
||
width="280"
|
||
trigger="hover"
|
||
>
|
||
<div style="font-size: 8px;margin-bottom: 20px">
|
||
<el-row>
|
||
<el-col :span="8"><b>主办单位</b>：</el-col>
|
||
<el-col :span="16">{{item.zbdwname}}</el-col>
|
||
</el-row>
|
||
<el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>开始时间</b>：</el-col>
|
||
<el-col :span="16">{{item.lab.substring(5,16)}}</el-col>
|
||
</el-row>
|
||
<el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>报名链接</b>：</el-col>
|
||
<el-col :span="16">
|
||
<el-link style="font-size: 8px" type="primary" href="/platform/hd/hdbm" target="_blank">
|
||
点击报名
|
||
</el-link>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
<div slot="reference"
|
||
style="font-size: 8px;margin-bottom: 20px">
|
||
<el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>活动{{index+1}}</b>：</el-col>
|
||
<el-col :span="16">{{item.val}}</el-col>
|
||
</el-row>
|
||
</div>
|
||
</el-popover>
|
||
|
||
</div>
|
||
<div v-for="item,index in msglist.filter(v => data.day.toString()==formatAt(v.sendat))">
|
||
<el-popover
|
||
placement="top-start"
|
||
:title="item.title"
|
||
width="250"
|
||
trigger="hover"
|
||
>
|
||
<div style="font-size: 8px;margin-bottom: 20px">
|
||
|
||
<el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>发送时间</b>：</el-col>
|
||
<el-col :span="16">{{formatAt(item.sendat)}}</el-col>
|
||
</el-row>
|
||
<el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>发送人</b>：</el-col>
|
||
<el-col :span="16">{{item.username}}</el-col>
|
||
</el-row>
|
||
</div>
|
||
<div slot="reference"
|
||
style="font-size: 8px;margin-bottom: 20px">
|
||
<el-row>
|
||
<el-col :span="8"><b>通知{{index+1}}</b>：</el-col>
|
||
<el-col :span="16">{{item.title}}</el-col>
|
||
</el-row>
|
||
<!-- <el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>发送时间</b>：</el-col>
|
||
<el-col :span="16">{{formatAt(item.sendat)}}</el-col>
|
||
</el-row>
|
||
<el-row style="margin-top: 10px">
|
||
<el-col :span="8"><b>发送人</b>：</el-col>
|
||
<el-col :span="16">{{item.username}}</el-col>
|
||
</el-row>-->
|
||
</div>
|
||
</el-popover>
|
||
|
||
</div>
|
||
</template>
|
||
</el-calendar>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<script>
|
||
|
||
const vue = new Vue({
|
||
el: "#app",
|
||
data: function () {
|
||
return {
|
||
/*列表*/
|
||
tableData: [],
|
||
year: "",
|
||
|
||
first: [],
|
||
xhdJf: [],
|
||
fhhdJf: [],
|
||
sthdJf: [],
|
||
|
||
hdxm: [],
|
||
xhd: [],
|
||
fhhd: [],
|
||
sthd: [],
|
||
|
||
xhdgs: [],
|
||
fhdgs: [],
|
||
sthdgs: [],
|
||
yylist: [],
|
||
yy: [],
|
||
day: "",
|
||
msglist: []
|
||
}
|
||
},
|
||
methods: {
|
||
formatAt(val) {
|
||
if (val && val > 0)
|
||
return moment(val * 1000).format("YYYY-MM-DD");
|
||
return "";
|
||
},
|
||
yyxx: function () {
|
||
|
||
$.post(base + "/platform/hdsjkb/getYyxx").then(res => {
|
||
this.yylist = res.data;
|
||
this.yylist.xhd.forEach(val => {
|
||
this.yy.push({"lab": val.hdkssj, val: val.xhdmc, zbdwname: val.zbdwname})
|
||
})
|
||
this.yylist.fhd.forEach(val => {
|
||
this.yy.push({"lab": val.hdkssj, val: val.fhdmc, zbdwname: val.zbdwname})
|
||
})
|
||
this.yylist.sthd.forEach(val => {
|
||
this.yy.push({"lab": val.hdkssj, val: val.hdmc, zbdwname: val.zbdwname})
|
||
})
|
||
})
|
||
},
|
||
msg: function () {
|
||
$.post(base + "/platform/hdsjkb/getMessage").then(res => {
|
||
this.msglist = res.data;
|
||
})
|
||
}
|
||
},
|
||
created: function () {
|
||
this.yyxx();
|
||
this.msg();
|
||
},
|
||
mounted: function () {
|
||
|
||
},
|
||
watch: {
|
||
"day": function (val, oldval) {
|
||
|
||
}
|
||
}
|
||
})
|
||
|
||
</script>
|
||
|
||
<!--#
|
||
}
|
||
#--> |