Commit b969a69b by Cat

zd 社团bug修改

parent a38f89b4
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryForm" ref="queryForm" size="small" :inline="true" label-width="80px"> <el-form
:model="queryForm"
ref="queryForm"
size="small"
:inline="true"
label-width="80px"
>
<el-form-item prop="name" label="社团名称"> <el-form-item prop="name" label="社团名称">
<el-input v-model="queryForm.name" placeholder="社团名称"></el-input> <el-input v-model="queryForm.name" placeholder="社团名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item prop="teachers" label="指导教师"> <el-form-item prop="teachers" label="指导教师">
<el-input v-model="queryForm.teachers" placeholder="指导教师"></el-input> <el-input
v-model="queryForm.teachers"
placeholder="指导教师"
></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd()">新增</el-button> <el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="handleAdd()"
>新增</el-button
>
</el-col> </el-col>
</el-row> </el-row>
<!-- 列表 --> <!-- 列表 -->
<div class="listBlock"> <div class="listBlock">
<div class="itemBlock" v-for="(task, index) in tasks" :key="index"> <div class="itemBlock" v-for="(task, index) in tasks" :key="index">
<div style=" <div
style="
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
"> "
>
<div style="width: 50%"> <div style="width: 50%">
<!-- 任务详细信息 --> <!-- 任务详细信息 -->
<div class="task-info"> <div class="task-info">
...@@ -52,17 +77,49 @@ ...@@ -52,17 +77,49 @@
<!-- 按钮 --> <!-- 按钮 -->
<div class="task-buttons"> <div class="task-buttons">
<el-button style="margin-left: 10px" size="mini" type="danger" round @click="handleDelete(task)">删除 <el-button
style="margin-left: 10px"
size="mini"
type="danger"
round
@click="handleDelete(task)"
>删除
</el-button> </el-button>
<el-button type="success" size="small" round <el-button
@click="clubRegistrationReview(task.id, task.teachers)">社团报名审核</el-button> type="success"
<el-button type="info" size="small" round @click="clubActivityRecord(task.id)">社团活动记录</el-button> size="small"
<el-button type="warning" size="small" round @click="memberManagement(task.id)">成员管理 round
@click="clubRegistrationReview(task.id, task.teachers)"
>社团报名审核</el-button
>
<el-button
type="info"
size="small"
round
@click="clubActivityRecord(task.id)"
>社团活动记录</el-button
>
<el-button
type="warning"
size="small"
round
@click="memberManagement(task.id)"
>成员管理
</el-button> </el-button>
<el-button class="purpleBtn" size="small" round type="primary" <el-button
@click="communityStyle(task.id, task.teachers)">社团风采 class="purpleBtn"
size="small"
round
type="primary"
@click="communityStyle(task.id, task.teachers)"
>社团风采
</el-button> </el-button>
<el-button type="primary" size="small" round @click="basicInformation(task.id, task.teachers)">基础信息管理 <el-button
type="primary"
size="small"
round
@click="basicInformation(task.id, task.teachers)"
>基础信息管理
</el-button> </el-button>
</div> </div>
</div> </div>
...@@ -72,22 +129,45 @@ ...@@ -72,22 +129,45 @@
<el-form ref="form" :model="form" :rules="rules" label-width="110px"> <el-form ref="form" :model="form" :rules="rules" label-width="110px">
<div> <div>
<el-form-item label="社团名称" prop="name"> <el-form-item label="社团名称" prop="name">
<el-input v-model="form.name" placeholder="请输入社团名称"></el-input> <el-input
v-model="form.name"
placeholder="请输入社团名称"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="指导教师" prop="teachers"> <el-form-item label="指导教师" prop="teachers">
<el-select style="width: 100%" multiple v-model="form.teachers" filterable placeholder="请选择指导教师" <el-select
@change="changeTeacher"> style="width: 100%"
<el-option v-for="item in teacherInfo" :key="item.teacherCode" :label="item.teacherName" multiple
:value="item.teacherCode"> v-model="form.teachers"
filterable
placeholder="请选择指导教师"
@change="changeTeacher"
>
<el-option
v-for="item in teacherInfo"
:key="item.id"
:label="item.teacherName"
:value="item.id"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="社团宗旨" prop="aim"> <el-form-item label="社团宗旨" prop="aim">
<el-input type="textarea" :rows="4" v-model="form.aim" placeholder="请输入社团宗旨"></el-input> <el-input
type="textarea"
:rows="4"
v-model="form.aim"
placeholder="请输入社团宗旨"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="社团简介" prop="intro"> <el-form-item label="社团简介" prop="intro">
<el-input type="textarea" :rows="4" v-model="form.intro" placeholder="请输入社团简介"></el-input> <el-input
type="textarea"
:rows="4"
v-model="form.intro"
placeholder="请输入社团简介"
></el-input>
</el-form-item> </el-form-item>
</div> </div>
</el-form> </el-form>
...@@ -175,14 +255,29 @@ export default { ...@@ -175,14 +255,29 @@ export default {
}, },
// 查询教师姓名、id // 查询教师姓名、id
changeTeacher(value) { changeTeacher(value) {
// // console.log("value", value);
// this.teachersId = []; //初始化数据
// this.teachers = []; //初始化数据
// for (let i = 0; i <= value.length - 1; i++) {
// this.teacherInfo.find((item) => {
// //这里的options就是数据源
// if (item.teacherCode == value[i]) {
// this.teachersId.push(item.teacherCode); //这里的value我改成了id
// this.teachers.push(item.teacherName); //这里的label我改成了roleName
// }
// });
// }
// console.log("this.teachersId ", this.teachersId);
// console.log("this.teachers ", this.teachers);
// console.log("value", value); // console.log("value", value);
this.teachersId = []; //初始化数据 this.teachersId = []; //初始化数据
this.teachers = []; //初始化数据 this.teachers = []; //初始化数据
for (let i = 0; i <= value.length - 1; i++) { for (let i = 0; i <= value.length - 1; i++) {
this.teacherInfo.find((item) => { this.teacherInfo.find((item) => {
//这里的options就是数据源 //这里的options就是数据源
if (item.teacherCode == value[i]) { if (item.id == value[i]) {
this.teachersId.push(item.teacherCode); //这里的value我改成了id this.teachersId.push(item.id); //这里的value我改成了id
this.teachers.push(item.teacherName); //这里的label我改成了roleName this.teachers.push(item.teacherName); //这里的label我改成了roleName
} }
}); });
...@@ -288,7 +383,7 @@ export default { ...@@ -288,7 +383,7 @@ export default {
this.$message.success("修改成功"); this.$message.success("修改成功");
this.open = false; this.open = false;
}) })
.catch((err) => { }); .catch((err) => {});
} else { } else {
// 新增 // 新增
const params = { const params = {
...@@ -305,7 +400,7 @@ export default { ...@@ -305,7 +400,7 @@ export default {
this.$message.success("新增成功"); this.$message.success("新增成功");
this.open = false; this.open = false;
}) })
.catch((err) => { }); .catch((err) => {});
} }
} }
}); });
...@@ -323,7 +418,7 @@ export default { ...@@ -323,7 +418,7 @@ export default {
this.getList(); this.getList();
this.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}) })
.catch(() => { }); .catch(() => {});
}, },
// 重置表单 // 重置表单
reset() { reset() {
...@@ -386,7 +481,7 @@ export default { ...@@ -386,7 +481,7 @@ export default {
text-align: left; text-align: left;
} }
.task-level>span { .task-level > span {
margin-right: 25px; margin-right: 25px;
} }
...@@ -410,13 +505,13 @@ export default { ...@@ -410,13 +505,13 @@ export default {
padding-left: 60%; padding-left: 60%;
} }
.task-count>.count { .task-count > .count {
font-weight: bold; font-weight: bold;
color: #307def; color: #307def;
font-size: 45px; font-size: 45px;
} }
.task-count>.sun { .task-count > .sun {
color: rgba(16, 16, 16, 1); color: rgba(16, 16, 16, 1);
font-size: 18px; font-size: 18px;
text-align: center; text-align: center;
......
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="标题" prop="picName">
<el-input v-model="queryParams.picName" placeholder="请输入标题" clearable/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" icon="el-icon-plus" size="mini" @click="handleAdd">修改
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete">删除
</el-button>
</el-col>
<!-- <el-col :span="1.5">-->
<!-- <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"-->
<!-- v-hasPermi="['system:pic:export']">导出-->
<!-- </el-button>-->
<!-- </el-col>-->
<!-- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>-->
</el-row>
<el-table v-loading="loading" ref="table" :data="picList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="序号" align="center" prop="seqencing" width="80"/>
<el-table-column label="活动主题" align="center" prop="picName"/>
<el-table-column label="活动开始时间" align="center" prop="picName"/>
<el-table-column label="活动结束时间" align="center" prop="picName"/>
<el-table-column label="活动负责人" align="center" prop="picName"/>
<el-table-column label="所属社团" align="center" prop="picName"/>
<el-table-column label="备注" align="center" prop="picName"/>
<el-table-column label="附件" align="center" prop="picName">
<template slot-scope="scope">
<!-- <ListImage :image-url="pev+scope.row.picUrl"></ListImage>-->
<!-- previewSrcList 开启预览大图的功能。-->
<el-image
style="width: 100px; height: 100px"
:src="scope.row.url"
:preview-src-list="srcList">
</el-image>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">编辑
</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleCheck(scope.row)">查看
</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<!-- 添加或修改社团主题对话框 -->
<el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="90px" style="width: 80%; margin: auto">
<el-form-item label="活动主题">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="活动开始时间">
<el-date-picker
v-model="form.value1"
type="datetime"
placeholder="选择活动开始时间">
</el-date-picker>
</el-form-item>
<el-form-item label="活动结束时间">
<el-date-picker
v-model="form.value1"
type="datetime"
placeholder="选择活动结束时间">
</el-date-picker>
</el-form-item>
<el-form-item label="活动负责人">
<el-select v-model="value" filterable placeholder="请选择活动负责人">
<el-option
v-for="item in activeOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="所属社团">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item prop="gardenEmblem"
style="display: flex; text-align: center; justify-content: center; transform: translateX(-30px)">
<!-- <el-upload v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"-->
<!-- :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload" :on-remove="handleRemove"-->
<!-- :http-request="uploadImage" :limit="1" >-->
<el-upload :disabled="check == true ? true : false" v-loading="uploadLoading" class="avatar-uploader" action="#" accept="image/*"
:show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload" :on-remove="handleRemove"
:limit="1" >
<img v-if="imageUrl" :src="imageUrl" class="avatar"/>
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="风采主题:" prop="picName">
<el-input :readonly="check == true ? true : false" v-model="form.picName" placeholder="请输入风采主题" style="width: 100%"/>
</el-form-item>
</el-col>
<!-- <el-col :span="12">-->
<!-- <el-form-item label="排序:" prop="seqencing">-->
<!-- <el-input-number v-model="form.seqencing" controls-position="right" style="width: 100%"-->
<!-- :min="1"></el-input-number>-->
<!-- </el-form-item>-->
<!-- </el-col>-->
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {listPic, getPic, delPic, addPic, updatePic, updateState} from '@/api/smartSchool/schoolManage/introduce/pic'
import picAvatar from '@/views/smartSchool/schoolManage/introduce/schoolInfo/profile/picAvatar'
import {changeUserStatus} from '@/api/system/user'
import {uploadImage as commonUpload} from '@/api/common'
import {ExportType, TEXT_SIZE} from '@/enums/common'
export default {
name: 'clubActivityRecord',
components: {picAvatar},
data() {
return {
pev: process.env.VUE_APP_BASE_API,
// 输入框字数限制
TEXT_SIZE,
//是否上传的院徽
isUploadPic: false,
//照片是否删除
options: [
{
value: 0,
label: '否'
},
{
value: 1,
label: '是'
}
],
//获取子组件传来的信息
pic: [],
// 图片路径
imageUrl: undefined,
// 图片上传遮罩层
uploadLoading: false,
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 园区照片表格数据
picList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
picName: null
},
// 表单参数
form: {},
// 表单校验
rules: {
picName: [{required: true, message: '请输入相片名称', trigger: 'blur'}],
seqencing: [{required: true, message: '请输入排序', trigger: 'blur'}],
remark: [{max: TEXT_SIZE, message: '备注信息在0到200字之间', trigger: 'blur'}]
},
//设置table列隐藏与显示
columns: [
{key: 0, label: `园区照片`, visible: true},
{key: 1, label: `相片名称`, visible: true},
// {key: 2, label: `相片路径`, visible: true},
{key: 2, label: `排序`, visible: true},
{key: 3, label: `备注`, visible: true},
{key: 4, label: `创建者`, visible: true},
{key: 5, label: `创建时间`, visible: true},
{key: 6, label: `操作`, visible: true}
],
// 作为临时图片展示
tempImage: '',
// 导出选项
exportOptions: {
title: '选择导出类别',
open: false
},
//查看状态
check:false,
//活动负责人下拉框
activeOptions:[{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}]
}
},
created() {
this.getList()
},
watch: {
pic: {
handler(newValue, oldValue) {
console.log('watch----oldValue', oldValue)
console.log('watch----newValue', newValue)
this.isUploadPic = newValue[3]
}
}
},
methods: {
//是否删除 选中值发生变化时id处理函数
selectChangeHandler(value) {
this.form.isShow = value
},
/** 查询园区照片列表 */
getList() {
this.loading = true
this.picList = []
listPic(this.queryParams).then(response => {
this.picList = response.rows
this.total = response.total
this.loading = false
})
},
//获取图片信息
getSchoolInfoPic(val) {
this.pic = val
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset() {
this.form = {
params: {},
id: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
delFlag: null,
picName: null,
picUrl: null,
seqencing: null,
isShow: 0
}
this.imageUrl = ''
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
this.throttle(() => {
this.queryParams.pageNum = 1
this.getList()
})
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.check = false
this.reset()
this.open = true
this.title = '新增社团风采'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const ids = row.id || this.ids
getPic(ids).then(response => {
this.form = response.data
this.imageUrl = this.pev + this.form.picUrl
this.open = true
this.title = '修改园区照片'
})
},
/** 查看按钮操作 */
handleCheck(row){
this.check = true
this.open = true
this.title = '查看社团风采'
},
// 上传成功回调
handleAvatarSuccess(res, file) {
this.imageUrl = res.data.url
console.log(file)
this.commonUpload(file)
},
// 上传前格式和图片大小限制
beforeAvatarUpload(file) {
const type = file.type === 'image/jpeg' || 'image/jpg' || 'image/webp' || 'image/png'
const isLt2M = file.size / 1024 / 1024 < 2
if (!type) {
this.$message.error('图片格式不正确!(只能包含jpg,png,webp,JPEG)')
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 2MB!')
}
return type && isLt2M
},
//删除图片
handleRemove(file, fileList){
this.imageUrl = ''
},
// 上传图片
uploadImage(file) {
const fileData = file.file
const formData = new FormData()
formData.append('file', fileData)
this.uploadLoading = true
commonUpload(formData)
.then(response => {
this.uploadLoading = false
this.$modal.msgSuccess('上传成功')
this.imageUrl = this.pev + response.url
// this.form.picUrl = process.env.VUE_APP_BASE_API + response.url
this.form.picUrl = response.url
})
.catch(error => {
this.uploadLoading = false
})
},
/** 提交按钮 */
submitForm() {
this.$refs['form'].validate(valid => {
if (valid) {
this.$modal.loading('正在上传数据,请稍等...')
if (this.form.id != null) {
updatePic({
...this.form
})
.then(response => {
this.$modal.closeLoading()
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
.catch(error => {
this.$modal.closeLoading()
})
} else {
addPic({
...this.form,
isShow: '0'
})
.then(response => {
this.$modal.closeLoading()
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
.catch(error => {
this.$modal.closeLoading()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids
if (ids) {
this.$modal
.confirm(`是否确认删除选中的${Object.hasOwnProperty.call(ids, 'length') ? ids.length : 1}条数据?`)
.then(() => {
this.$modal.loading('正在处理数据,请稍等...')
return delPic(ids)
})
.then(() => {
this.$modal.closeLoading()
this.getList()
this.$modal.msgSuccess('删除成功')
})
.catch(() => {
this.$modal.closeLoading()
})
}
},
/** 是否发布 */
handleIsShow(row) {
this.$modal
.confirm(row.isShow === '1' ? '是否确认显示为轮播图?' : '是否取消显示为轮播图?')
.then(() => {
this.$modal.loading('正在修改状态,请稍等...')
updateState(row.id, row.isShow)
.then(response => {
this.$modal.closeLoading()
this.$modal.msgSuccess('修改成功')
})
.catch(error => {
this.$modal.closeLoading()
row.isShow = row.isShow === '0' ? '1' : '0'
})
})
.catch(() => {
row.isShow = row.isShow === '0' ? '1' : '0'
})
}
}
}
</script>
<style scoped>
.avatar,
.avatar-uploader,
.el-icon-plus {
width: 650px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment