377 lines
17 KiB
HTML
377 lines
17 KiB
HTML
<!--#
|
|
layout("/layouts/platform.html"){
|
|
#-->
|
|
|
|
|
|
<style>
|
|
.clearBtn {
|
|
position: absolute;
|
|
right: 20px;
|
|
top: 20px;
|
|
}
|
|
</style>
|
|
|
|
<div id="app" v-cloak>
|
|
<guava ref="guava">
|
|
<template>
|
|
<el-row class="header navbar bg-white shadow">
|
|
<div class="btn-group tool-button mt5">
|
|
<el-date-picker
|
|
v-model="pageForm.year"
|
|
type="year"
|
|
value-format="yyyy" style="width: 150px"
|
|
placeholder="选择年">
|
|
</el-date-picker>
|
|
</div>
|
|
|
|
<div class="btn-group tool-button mt5">
|
|
<el-input placeholder="请输入内容" clearable v-model="pageForm.searchKeyword"
|
|
@keyup.enter.native="doSearch">
|
|
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型"
|
|
style="width: 120px;">
|
|
<el-option label="活动名称" value="hd.name"></el-option>
|
|
</el-select>
|
|
</el-input>
|
|
</div>
|
|
|
|
<div class="btn-group tool-button mt5" v-if="all">
|
|
<el-select v-model="pageForm.type" placeholder="活动组织单位" filterable clearable style="width: 160px;">
|
|
<el-option
|
|
v-for="item in [{id:1,name:'校工会活动'},{id:2,name:'院级工会活动'},{id:3,name:'协会活动'}]"
|
|
:key="item.id"
|
|
:label="item.name"
|
|
:value="item.id">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
|
|
<div class="btn-group tool-button mt5" v-if="all">
|
|
<el-select v-model="pageForm.unionId" placeholder="工会" filterable clearable
|
|
:disabled="[1].includes(pageForm.type)" style="width: 160px;">
|
|
<el-option
|
|
v-for="item in unions"
|
|
:key="item.id"
|
|
:label="item.unionname"
|
|
:value="item.id">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
|
|
<div class="btn-group tool-button mt5" v-if="all">
|
|
<el-select v-model="pageForm.clubId" placeholder="协会" filterable clearable
|
|
:disabled="[1].includes(pageForm.type)" style="width: 160px;">
|
|
<el-option
|
|
v-for="item in clubs"
|
|
:key="item.id"
|
|
:label="item.name"
|
|
:value="item.id">
|
|
</el-option>
|
|
</el-select>
|
|
</div>
|
|
|
|
<div class="btn-group tool-button mt5">
|
|
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
|
</div>
|
|
</el-row>
|
|
<el-row class="el-table-container">
|
|
<el-table :data="tableData" style="width: 100%" row-key="id" @sort-change="pageOrder">
|
|
<el-table-column align="center" header-align="center" label="序号" type="index">
|
|
<template scope="scope">
|
|
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="活动名称" prop="name" header-align="center" align="left" show-overflow-tooltip>
|
|
<template scope="{row}">
|
|
<el-link type="primary" @click="openView(row)"><i>{{row.name}}</i></el-link>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="活动类型" prop="style" header-align="center"
|
|
align="center" sortable></el-table-column>
|
|
|
|
<el-table-column label="活动项目" prop="project" header-align="center"
|
|
align="center" sortable></el-table-column>
|
|
|
|
<el-table-column label="活动组织单位" prop="be_time" header-align="center"
|
|
align="center" sortable>
|
|
<template scope="{row:{type,unionname,clubname}}">
|
|
<span v-if="type==1">校工会活动</span>
|
|
<span v-if="type==2&&unionname">{{unionname}}</span>
|
|
<span v-if="type==3&&clubname">{{clubname}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="活动日期" prop="be_time" header-align="center"
|
|
align="center" sortable>
|
|
<template scope="{row:{be_time,end_time}}">
|
|
{{moment(be_time).format('YYYY-MM-DD')}}
|
|
<!-- {{be_time}} - {{end_time}}-->
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column label="活动状态" prop="status" header-align="center"
|
|
align="center" sortable>
|
|
<template scope="{row:{apply_be_time,apply_end_time,be_time,end_time}}">
|
|
<div v-html="getStatus(apply_be_time,apply_end_time,be_time,end_time)"></div>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column align="center" header-align="center" label="操作" width="180px">
|
|
<template scope="{row}">
|
|
<el-button size="mini" icon="el-icon-zoom-in" @click="openView(row)">查看</el-button>
|
|
<el-button icon="el-icon-upload" size="mini" @click="openAdd(row)">上传</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-row>
|
|
<!--#include("/layouts/pagination.html"){}#-->
|
|
</template>
|
|
|
|
<template #edit>
|
|
|
|
<el-form :model="formData" ref="form" :rules="formRules" label-width="120px">
|
|
<el-form-item label="填写资料信息 " label-width="135px" class="view-header">
|
|
</el-form-item>
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item prop="activity_name" label="活  动">
|
|
<el-input disabled v-model="formData.activity_name" type="text"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item prop="username" label="上传人">
|
|
<el-input disabled v-model="formData.username" type="text"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item prop="name" label="资料名称">
|
|
<el-input maxlength="100" placeholder="请填写资料名称" v-model="formData.name"
|
|
type="text"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item prop="type" label="资料类型">
|
|
<el-select v-model="formData.type" placeholder="请选择资料类型"
|
|
style="width: 100%;">
|
|
<el-option
|
|
v-for="item in fileType"
|
|
:key="item.name"
|
|
:label="item.name"
|
|
:value="item.name">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item prop="files" label="文  件">
|
|
<file-upload :files.sync="formData.files" card></file-upload>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
</el-form>
|
|
|
|
<div style="float: right;margin: 20px 0">
|
|
<el-button plain type="primary" @click="doAdd">确 定</el-button>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<template #view>
|
|
<div class="block">
|
|
<el-timeline>
|
|
<el-timeline-item v-for="(v,k) in files" :timestamp="k" placement="top" icon="el-icon-more"
|
|
type="primary">
|
|
<el-card v-for="file,i in v" style="margin-bottom: 20px;position: relative">
|
|
|
|
<div class="clearBtn">
|
|
<el-button circle icon="el-icon-delete" @click="doDelete(k,i,file.id)"></el-button>
|
|
</div>
|
|
|
|
<div style="display: flex;flex-direction:row;">
|
|
<h4>{{file.name}} </h4>
|
|
<h4><span style="font-size: 14px;color: rgb(200,200,200)">{{file.type}}</span></h4>
|
|
</div>
|
|
|
|
<div style="margin: 20px 0">
|
|
<file-upload :files="file.files"
|
|
:view="true"></file-upload>
|
|
</div>
|
|
|
|
<div style="text-align: right" class="text-primary">{{file.user_name}}</div>
|
|
</el-card>
|
|
</el-timeline-item>
|
|
</el-timeline>
|
|
</div>
|
|
</template>
|
|
</guava>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
|
|
const all = "${@shiro.hasAnyRoles('sysadmin,A06,xghhdwy')}" === 'true'
|
|
const union = "${@shiro.hasAnyRoles('H04,gh08')}" === 'true'
|
|
const club = "${@shiro.hasAnyRoles('H02')}" === 'true'
|
|
|
|
const vue = new Vue({
|
|
el: '#app',
|
|
mixins: [initTableMixins],
|
|
data() {
|
|
return {
|
|
tableData: [],
|
|
pageForm: {
|
|
searchName: 'hd.name',
|
|
year: moment().format("YYYY")
|
|
},
|
|
formRules: {
|
|
username: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
|
activity_name: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
|
name: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
|
type: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
|
files: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
|
},
|
|
unions: [],
|
|
clubs: [],
|
|
all, union, club,
|
|
fileType: [],
|
|
files: {},
|
|
}
|
|
},
|
|
components: {
|
|
'guava': httpVueLoader('/components/plugins/Guava.vue'),
|
|
'file-upload': httpVueLoader('/components/plugins/FileUpload.vue'),
|
|
},
|
|
methods: {
|
|
getStatus(apply_start_time, apply_end_time, start_time, end_time) {
|
|
// if (close) {
|
|
// return `<span class="el-tag el-tag--info el-tag--light">活动已关闭</span>`
|
|
// }
|
|
const now = moment().valueOf()
|
|
const dateNow = moment(moment(moment().format('YYYY-MM-DD')).valueOf()).valueOf()
|
|
|
|
if (dateNow < moment(apply_start_time).valueOf()) {
|
|
return `<span class="el-tag el-tag--danger el-tag--light">未开始报名</span>`
|
|
} else if (moment(apply_start_time).valueOf() <= dateNow && dateNow <= moment(apply_end_time).valueOf()) {
|
|
return `<span class="el-tag el-tag--success el-tag--light">活动报名中</span>`
|
|
} else if (moment(apply_end_time).valueOf() < now && now < moment(start_time).valueOf()) {
|
|
return `<span class="el-tag el-tag--warning el-tag--light">报名已结束</span>`
|
|
} else if (moment(start_time).valueOf() < now && now < moment(end_time).valueOf()) {
|
|
return `<span class="el-tag el-tag--light">活动进行中</span>`
|
|
} else if (moment(end_time).valueOf() < now) {
|
|
return `<span class="el-tag el-tag--info el-tag--light">活动已结束</span>`
|
|
}
|
|
},
|
|
doDelete(key, index, id) {
|
|
this.$confirm('确定要删除吗？', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning',
|
|
callback: (a, b) => {
|
|
if ("confirm" == a) {//确认后再执行
|
|
$.post(loc() + "/delete", {id: id}, (data) => {
|
|
if (data.code == 0) {
|
|
this.$message.success(data.msg)
|
|
|
|
this.files[key].splice(index, 1)
|
|
|
|
if (!this.files[key].length) {
|
|
delete this.files[key]
|
|
|
|
let i = 0
|
|
for (let k in this.files) {
|
|
i += this.files[k].length
|
|
}
|
|
if (!i) {
|
|
this.$refs.guava.index()
|
|
}
|
|
}
|
|
|
|
} else {
|
|
this.$message.error(data.msg)
|
|
}
|
|
}, "json");
|
|
}
|
|
}
|
|
});
|
|
},
|
|
doAdd() {
|
|
this.$refs["form"].validate(async (valid) => {
|
|
if (valid) {
|
|
const loading = this.$loading({
|
|
lock: true,
|
|
text: '正在提交...',
|
|
spinner: 'el-icon-loading',
|
|
background: COVER_LAYER_COLOR
|
|
});
|
|
|
|
const resp = await $.post(location.href + "/doAdd", {
|
|
data: JSON.stringify(this.formData),
|
|
})
|
|
|
|
closeLoadingFunc(loading, resp, async () => {
|
|
this.$refs.guava.index()
|
|
this.openView({id: this.formData.activity_id})
|
|
}, (data, msg) => {
|
|
this.$message.error(msg);
|
|
})
|
|
}
|
|
});
|
|
},
|
|
async openView(row) {
|
|
const {id} = row
|
|
|
|
this.$set(row, "loading", true)
|
|
|
|
const resp = await $.get(loc() + "/getFiles", {id})
|
|
|
|
requestLaterFun(resp, (v) => {
|
|
this.$set(row, "loading", false)
|
|
if (!Object.keys(v).length) {
|
|
this.$notify({
|
|
title: '警告',
|
|
message: '该活动尚未上传资料！',
|
|
type: 'warning'
|
|
});
|
|
this.$refs.guava.index()
|
|
return
|
|
}
|
|
|
|
this.files = v
|
|
this.$refs.guava.view()
|
|
})
|
|
},
|
|
openAdd(row) {
|
|
this.formData = {
|
|
activity_id: row.id,
|
|
activity_name: row.name,
|
|
username: "${@shiro.getPrincipalProperty('username')}"
|
|
}
|
|
this.$refs.guava.edit()
|
|
if (this.$refs['form']) {
|
|
this.$refs['form'].resetFields()
|
|
}
|
|
},
|
|
},
|
|
async created() {
|
|
this.pageData();
|
|
if (all) {
|
|
this.unions = await getUnions()
|
|
this.clubs = await getClubs()
|
|
}
|
|
this.fileType = await getFileType()
|
|
}
|
|
})
|
|
</script>
|
|
<!--#
|
|
}
|
|
#-->
|