267 lines
10 KiB
HTML
267 lines
10 KiB
HTML
<!--年度活动统计 djx -->
|
|
<!--#
|
|
layout("/layouts/platform.html"){
|
|
#-->
|
|
<style>
|
|
|
|
.el-divider--horizontal {
|
|
margin: 46px 0px;
|
|
}
|
|
|
|
.layout .header {
|
|
background-color: #e6a23c;
|
|
color: white;
|
|
}
|
|
|
|
.text {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.item {
|
|
margin-bottom: 18px;
|
|
}
|
|
|
|
.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-input--mini .el-input__inner {
|
|
height: 23px;
|
|
line-height: 23px;
|
|
}
|
|
|
|
.el-card__body {
|
|
padding: 0px;
|
|
}
|
|
|
|
.el-table-containera {
|
|
padding-top: 5px;
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.el-card__header {
|
|
background-color: #ebeef5;
|
|
/*ebb563*/
|
|
padding: 8px 10px;
|
|
border-bottom: 1px solid #EBEEF5;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
</style>
|
|
<div id="app" v-cloak>
|
|
|
|
<el-card class="box-card">
|
|
<div slot="header" class="clearfix">
|
|
<div style="text-align: center;font-size: 16px;">文体活动一览表</div>
|
|
</div>
|
|
</el-card>
|
|
|
|
<el-card class="box-card">
|
|
<el-row class="header bg-white shadow"
|
|
style="padding-left: 5px;padding-right: 5px;background-color: #e6f1fe;">
|
|
<el-row gutter="5">
|
|
<el-col :span="20">
|
|
<div class="btn-group tool-button mt5" style="width: 100%">
|
|
<el-select v-model="value" @change="selVal" placeholder="请选择" style="width: 100%">
|
|
<el-option label="校工会活动" value="1"></el-option>
|
|
<el-option label="院级工会活动" value="2"></el-option>
|
|
<el-option label="协会活动" value="3"></el-option>
|
|
</el-select>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<div class="btn-group tool-button mt5" style="width: 100%">
|
|
<el-date-picker style="width: 100%" @change="selVal(value)"
|
|
v-model="pageForm.year"
|
|
type="year"
|
|
value-format="yyyy"
|
|
placeholder="选择年">
|
|
</el-date-picker>
|
|
</div>
|
|
</el-col>
|
|
</el-row>
|
|
</el-row>
|
|
</el-card>
|
|
|
|
<!--表格-->
|
|
<el-row class="el-table-container" v-show="xhdShow">
|
|
<el-card class="box-card">
|
|
<el-table :data="tableData" v-loading="loading" element-loading-text="拼命加载中"
|
|
element-loading-spinner="el-icon-loading" element-loading-background="white" size="medium"
|
|
:header-cell-style="{background:'#F5F5F5',color:'#606266'}">
|
|
<el-table-column label="序号" header-align="center" align="center" type="index">
|
|
<template scope="scope"><span>{{scope.$index+1}}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="活动名称" prop="xhdmc" header-align="center" align="center"></el-table-column>
|
|
|
|
<el-table-column label="时间" prop="name" header-align="center" align="center">
|
|
<template scope="scope"><span>{{scope.row.hdkssj}} 至 {{scope.row.hdjssj}}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="活动情况" prop="name" header-align="center" align="center">
|
|
<template scope="scope"><span>{{scope.row.cjdw}}个分会参加活动，参与活动人数共计：{{scope.row.ybmnumber}}人，工作人员数共计：{{scope.row.gznumber}}人</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center">
|
|
<template scope="scope">
|
|
<el-button @click="exportFFmd(scope.row.id)">
|
|
导出名单
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-card>
|
|
</el-row>
|
|
|
|
<el-row class="el-table-container" v-show="fhdShow">
|
|
<el-card class="box-card">
|
|
<el-table :data="fhData" v-loading="loading" element-loading-text="拼命加载中"
|
|
element-loading-spinner="el-icon-loading" element-loading-background="white" size="medium"
|
|
:header-cell-style="{background:'#F5F5F5',color:'#606266'}">
|
|
<el-table-column label="序号" header-align="center" align="center" type="index">
|
|
<template scope="scope"><span>{{scope.$index+1}}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="活动名称" prop="fhdmc" header-align="center" align="center"></el-table-column>
|
|
|
|
<el-table-column label="时间" prop="name" header-align="center" align="center">
|
|
<template scope="scope"><span>{{scope.row.hdkssj}} 至 {{scope.row.hdjssj}}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="基层工会" prop="unionname" header-align="center" align="center"></el-table-column>
|
|
<el-table-column label="活动情况" prop="name" header-align="center" align="center">
|
|
<template scope="scope"><span>参与活动人数共计：{{scope.row.rs}}人，取消报名共计：{{scope.row.qxrs}}人</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-card>
|
|
</el-row>
|
|
|
|
<el-row class="el-table-container" v-show="stShow">
|
|
<el-card class="box-card">
|
|
<el-table :data="stData" v-loading="loading" element-loading-text="拼命加载中"
|
|
element-loading-spinner="el-icon-loading" element-loading-background="white" size="medium"
|
|
:header-cell-style="{background:'#F5F5F5',color:'#606266'}">
|
|
<el-table-column label="序号" header-align="center" align="center" type="index">
|
|
<template scope="scope"><span>{{scope.$index+1}}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="活动名称" prop="hdmc" header-align="center" align="center"></el-table-column>
|
|
|
|
<el-table-column label="时间" prop="name" header-align="center" align="center">
|
|
<template scope="scope"><span>{{scope.row.hdkssj}} 至 {{scope.row.hdjssj}}</span></template>
|
|
</el-table-column>
|
|
<el-table-column label="所属协会" prop="stmc" header-align="center" align="center"></el-table-column>
|
|
<el-table-column label="活动情况" prop="name" header-align="center" align="center">
|
|
<template scope="scope"><span>参与活动人数共计：{{scope.row.rs}}人，取消报名共计：{{scope.row.qxrs}}人</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-card>
|
|
</el-row>
|
|
|
|
<el-divider content-position="left"><span style="font-size: 16px;color: #409eff">参与活动总人次：{{total.count}} 人次;</span>
|
|
</el-divider>
|
|
|
|
</div>
|
|
<script>
|
|
new Vue({
|
|
el: "#app",
|
|
data: function () {
|
|
return {
|
|
pageForm: {//分页
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
totalCount: 0,
|
|
searchKeyword: "",
|
|
year: new Date().getFullYear() + '',
|
|
},
|
|
tableData: [],//表格
|
|
total: "",
|
|
value: "",
|
|
xhdShow: true,
|
|
fhdShow: false,
|
|
stShow: false,
|
|
loading: true,
|
|
|
|
fhData: [],
|
|
stData: [],
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
exportFFmd(id) {
|
|
window.location.href = '/platform/hd/hdcxtj/ndhdtj/exportFFmd?id=' + id
|
|
},
|
|
pageData: function () {//表格展示数据
|
|
var self = this;
|
|
|
|
$.post(base + "/platform/hd/hdcxtj/ndhdtj/data", {year: self.pageForm.year}, function (data) {
|
|
|
|
if (data.code == 0) {
|
|
self.value = '1';
|
|
self.tableData = data.data.data;
|
|
console.log(data.data.data)
|
|
self.total = data.data.total;
|
|
setTimeout(function () {
|
|
self.loading = false;
|
|
}, 200);
|
|
} else {
|
|
self.$message({
|
|
message: data.msg,
|
|
type: 'error'
|
|
});
|
|
}
|
|
}, "json");
|
|
},
|
|
selVal: function (obj) {
|
|
var self = this;
|
|
self.loading = true;
|
|
if (obj == "2") {
|
|
self.xhdShow = false;
|
|
self.fhdShow = true;
|
|
self.stShow = false;
|
|
$.post(base + "/platform/hd/hdcxtj/ndhdtj/fhData", {year: self.pageForm.year}, function (data) {
|
|
if (data.code == 0) {
|
|
self.fhData = data.data.data;
|
|
self.total = data.data.total;
|
|
}
|
|
}, "json");
|
|
} else if (obj == "3") {
|
|
self.xhdShow = false;
|
|
self.fhdShow = false;
|
|
self.stShow = true;
|
|
$.post(base + "/platform/hd/hdcxtj/ndhdtj/stData", {year: self.pageForm.year}, function (data) {
|
|
if (data.code == 0) {
|
|
self.stData = data.data.data;
|
|
self.total = data.data.total;
|
|
}
|
|
}, "json");
|
|
} else if (obj == "1") {
|
|
self.xhdShow = true;
|
|
self.fhdShow = false;
|
|
self.stShow = false;
|
|
self.pageData();
|
|
}
|
|
setTimeout(function () {
|
|
self.loading = false;
|
|
}, 200);
|
|
}
|
|
},
|
|
created: function () {
|
|
this.pageData();
|
|
}
|
|
})
|
|
</script>
|
|
<!--#
|
|
}
|
|
#-->
|