洋浦学校 八大中心后台管理 心育活动管理前端开发

init
gongdi 3 years ago
parent 1570ad8522
commit e7eea7aa4b

@ -0,0 +1,332 @@
<template>
<div class="club-activity-info-content-style">
<a-spin :spinning="pageLoading">
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>课程名称</div>
<div class="li-box li-right">
<a-input v-model="courseName" placeholder="请输入课程名称" :maxLength="100"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>课程日期</div>
<div class="li-box li-right">
<a-date-picker :locale="locale"
v-model="courseDate"
:getCalendarContainer="getCalendarContainer()"
:format="dateFormat"
@change="onChange"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>主讲人</div>
<div class="li-box li-right">
<a-input v-model="courseSpeaker" placeholder="请输入主讲人" :maxLength="100"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>课程地址</div>
<div class="li-box li-right">
<a-input v-model="coursePlace" placeholder="请输入课程地址" :maxLength="100"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left"><span class="must-option-style">*</span>参加人员</div>
<div class="li-box li-right">
<a-textarea v-model="attendees" placeholder="请输入参加人员" :maxLength="1000"/>
</div>
</div>
<div class="add-record-row-style">
<div class="li-box li-left">附件</div>
<div class="li-box li-right">
<Upload :type="1" :multiple="true" title="点击上传" :option="{}" :canDownload="false"
:fileData="attachmentJson"
ref="fileUploadCertificate"
@uploadComplete="certificateFile"
/>
</div>
</div>
<div class="add-record-row-style button-row-style">
<a-button type="primary" class="button-style" @click="submit">
提交
</a-button>
<a-button class="button-style" @click="cancel"></a-button>
</div>
</a-spin>
</div>
</template>
<script>
import {Spin, Button, Cascader, Input, InputNumber, Modal, Select, DatePicker,Icon,TimePicker} from 'ant-design-vue';
import InterConfig from '../interConfig';
import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
import moment from 'moment';
import ATextarea from "ant-design-vue/es/input/TextArea";
import Upload from '../../../../../../components/common/uploader/Upload.vue';
export default{
props: {
courseId: {
type: String,
default: ""
}
},
data(){
return {
pageLoading: false,
courseName:"",
locale,
courseDate:"",
courseSpeaker:"",
coursePlace:"",
attendees:"",
dateFormat: "YYYY-MM-DD",
attachmentJson:[]
}
},
created(){
if (this.$props.courseId !== "") {
this.getInfo();
}
},
methods: {
getCalendarContainer: function () {
return triggerNode => triggerNode.parentNode;
},
onChange(value, dateString) {
if (dateString === "") {
this.courseDate = null;
} else {
this.courseDate = moment(dateString).format("YYYY-MM-DD");
}
},
getInfo: function () {
let param = {
course_id: this.$props.courseId,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getPsychologyInfo.url,
params: param,
method: InterConfig.getPsychologyInfo.method,
isTestLogin: InterConfig.getPsychologyInfo.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
let info = resData.data;
this.courseName = info.course_name;
this.courseDate = info.course_date;
this.coursePlace = info.course_place;
this.courseSpeaker = info.course_speaker;
this.attendees = info.attendees;
if(Object.keys(info.attachment_json).length > 0){
this.attachmentJson.push(info.attachment_json);
}
if(Array.isArray(info.attachment_json)){
this.attachmentJson = info.attachment_json;
}
}
})
},
certificateFile:function(file){
this.attachmentJson = file;
},
submit: function () {
if (this.courseName.trim() === "") {
Modal.warning({
title: "请输入课程名称",
content: "",
centered: true
})
return;
}
if (this.courseDate === "") {
Modal.warning({
title: "请选择课程日期",
content: "",
centered: true
})
return;
}
if (this.courseSpeaker.trim() === "") {
Modal.warning({
title: "请输入主讲人",
content: "",
centered: true
})
return;
}
if (this.coursePlace.trim() === "") {
Modal.warning({
title: "请输入课程地点",
content: "",
centered: true
})
return;
}
if (this.attendees.trim() === "") {
Modal.warning({
title: "请输入参加人员",
content: "",
centered: true
})
return;
}
let param = {
course_name: this.courseName,
course_date:this.courseDate,
course_speaker:this.courseSpeaker,
course_place:this.coursePlace,
attendees:this.attendees,
attachment_json:JSON.stringify(this.attachmentJson),
person_id: this.BaseConfig.userInfo.person_id,
identity_id: this.BaseConfig.userInfo.identity_id,
bureau_id: this.BaseConfig.person_info_my.bureau_id,
}
if(this.$props.courseId !== ""){
param.course_id = this.$props.courseId;
}
this.pageLoading = true;
this.InterfaceConfig.callInterface([{
url: InterConfig.savePsychology.url,
params: param,
method: InterConfig.savePsychology.method,
isTestLogin: InterConfig.savePsychology.isTestLogin,
}], (result) => {
this.pageLoading = false;
let resData = result[0].data;
if (resData.code === 2000) {
Modal.success({
title: "操作成功",
content: "",
centered: true
});
this.cancel();
}
})
},
cancel: function () {
this.$emit("cancel");
}
},
components: {
ATextarea,
ASpin: Spin,
ASelect: Select,
ASelectOption: Select.Option,
AInput: Input,
ADatePicker: DatePicker,
ATimePicker:TimePicker,
Upload,
AButton: Button,
AIcon:Icon,
}
}
</script>
<style scoped lang="scss">
.club-activity-info-content-style {
width: 100%;
height: auto;
font-size: 1rem;
color: black;
.add-record-row-style {
width: 50%;
min-height: 3rem;
margin: 0.5rem auto;
display: flex;
.li-box {
min-height: 3rem;
line-height: 3rem;
.must-option-style {
color: red;
margin-right: 0.2rem;
}
}
.li-left {
width: 15%;
text-align: right;
}
.li-right {
width: 85%;
.person-list-content-style {
width: 700px;
height: 500px;
background-color: #ebebeb;
.list-content-style {
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
.honor-person-info {
width: auto;
height: 180px;
border: 1px solid #31a8fa;
margin: 0.5rem 0 0 0.5rem;
display: flex;
flex-direction: column;
justify-content: center;
.person-name {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
}
/deep/ .img-style {
margin-right: 0 !important;
}
}
}
}
.ant-select {
width: 100px;
}
.no-border-input-style {
border-top: 0 !important;
border-left: 0 !important;
border-right: 0 !important;
}
.photo-container-style {
display: flex;
align-items: center;
align-content: center;
justify-content: center;
justify-items: center;
width: 120px !important;
border: 1px solid #e5e5e5;
height: 160px;
background-color: white;
position: relative;
.operate-class {
position: absolute;
bottom: 0.1rem;
color: #31a8fa;
font-size: 1rem;
cursor: pointer;
display: none;
}
.photo-size-style {
display: flex;
align-items: center;
align-content: center;
justify-items: center;
justify-content: center;
}
}
.edit-style {
&:hover {
.operate-class {
display: inline-block;
}
}
}
}
}
.button-row-style {
width: 50%;
margin: auto;
display: flex;
justify-content: center;
align-items: center;
.button-style {
margin-left: 0.5rem;
}
}
}
</style>

@ -40,7 +40,7 @@
是否确定删除此条信息
</a-modal>
<template v-if="pageType === 1">
<HeartActivityInfo @cancel="cancel" :courseId="courseId"/>
</template>
</div>
</template>
@ -50,6 +50,7 @@
import Upload from '../../../../../../components/common/uploader/Upload.vue';
import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
import moment from 'moment';
import HeartActivityInfo from './heartActivityInfo.vue';
const tableColumn = [
{
dataIndex: 'index',
@ -106,77 +107,41 @@
tableColumn: tableColumn,
dataList: [],
loading: false,
activityId:"",//ID
clubId: "",
clubList:[],
activityName:"",
courseId:"",//ID
courseDate:"",//
coursePlace:"",//
courseSpeaker:"",//
attendees:"",//
visible: false,
pageNumber: 1,
pageSize: 3,
pageSize: 10,
totalPage: 0,
totalNum: 0,
}
},
created(){
this.getClubList();
this.getPsychologyList();
},
mounted(){
},
methods: {
getClubList:function(){
getPsychologyList:function(){
let param = {
bureau_id: this.BaseConfig.person_info_my.bureau_id,
club_name: "",
page_number: 1,
page_size: 1000000,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getClublist.url,
params: param,
method: InterConfig.getClublist.method,
isTestLogin: InterConfig.getClublist.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
let dataList = resData.data.list;
if(dataList && dataList.length > 0){
this.clubList = dataList;
this.clubId = dataList[0].club_id;
this.getClubActivityList();
}
}
})
},
onChange(value, dateString) {
this.activityDate = dateString;
},
search:function () {
this.getClubActivityList();
},
clubChange:function(value){
this.clubId = value;
this.getClubActivityList();
},
getClubActivityList: function () {
let param = {
bureau_id: this.BaseConfig.person_info_my.bureau_id,
club_id: this.clubId,
activity_name:this.activityName,
activity_date:this.activityDate,
activity_place:this.activityPlace,
course_name: this.courseName,
course_date:this.courseDate,
course_place:this.coursePlace,
course_speaker:this.courseSpeaker,
attendees:this.attendees,
page_number: this.pageNumber,
page_size: this.pageSize,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.getClubActivityList.url,
url: InterConfig.getPsychologyList.url,
params: param,
method: InterConfig.getClubActivityList.method,
isTestLogin: InterConfig.getClubActivityList.isTestLogin,
method: InterConfig.getPsychologyList.method,
isTestLogin: InterConfig.getPsychologyList.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
@ -192,38 +157,43 @@
}
})
},
onChange(value, dateString) {
this.courseDate = dateString;
},
search:function () {
this.getPsychologyList();
},
onPageChange: function (page) {
this.pageNumber = page;
this.getClubActivityList();
this.getPsychologyList();
},
toAdd: function () {
this.activityId = "";
this.courseId = "";
this.pageType = 1;
},
toEdit: function (record) {
this.pageType = 1;
this.activityId = record.activity_id + "";
this.courseId = record.course_id + "";
},
toDelete: function (record) {
this.activityId = record.activity_id + "";
this.courseId = record.course_id + "";
this.visible = true;
},
cancel: function () {
this.pageType = 0;
this.getClubList();
this.getPsychologyList();
},
//
handleOk: function () {
let param = {
activity_ids: this.activityId,
club_id:this.clubId,
course_ids: this.courseId,
bureau_id: this.BaseConfig.person_info_my.bureau_id,
}
this.InterfaceConfig.callInterface([{
url: InterConfig.deleteClubActivity.url,
url: InterConfig.deletePsychology.url,
params: param,
method: InterConfig.deleteClubActivity.method,
isTestLogin: InterConfig.deleteClubActivity.isTestLogin,
method: InterConfig.deletePsychology.method,
isTestLogin: InterConfig.deletePsychology.isTestLogin,
}], (result) => {
let resData = result[0].data;
if (resData.code === 2000) {
@ -233,13 +203,13 @@
centered: true
});
this.handleCancel();
this.getClubActivityList();
this.getPsychologyList();
}
})
},
//
handleCancel: function () {
this.activityId = "";
this.courseId = "";
this.visible = false;
}
},
@ -255,7 +225,7 @@
ASelect: Select,
ASelectOption: Select.Option,
Upload,
ActivityInfo,
HeartActivityInfo,
ADatePicker:DatePicker
}
}

Loading…
Cancel
Save