|
@@ -1,13 +1,15 @@
|
|
<template>
|
|
<template>
|
|
- <div class="app-container">
|
|
|
|
- <FullCalendar defaultView="dayGridMonth" :options="calendarOptions" locale="zh-cn" firstDay="1" weekNumberCalculation="ISO"
|
|
|
|
|
|
+ <div class="app-container" v-if="isReloadData">
|
|
|
|
+ <FullCalendar v-loading="loading" defaultView="dayGridMonth" :options="calendarOptions" locale="zh-cn" firstDay="1" weekNumberCalculation="ISO"
|
|
showNonCurrentDates="false"
|
|
showNonCurrentDates="false"
|
|
:eventTimeFormat="evnetTime"
|
|
:eventTimeFormat="evnetTime"
|
|
:header="header"
|
|
:header="header"
|
|
|
|
+ :lang="lang"
|
|
:buttonText="buttonText"
|
|
:buttonText="buttonText"
|
|
@dateClick="handleDateClick"
|
|
@dateClick="handleDateClick"
|
|
@eventClick="handleEventClick"
|
|
@eventClick="handleEventClick"
|
|
/>
|
|
/>
|
|
|
|
+<!-- 添加日程-->
|
|
<el-dialog :visible.sync="schedule" title="添加日程" append-to-body width="40%" @click="close">
|
|
<el-dialog :visible.sync="schedule" title="添加日程" append-to-body width="40%" @click="close">
|
|
<el-row :gutter="12">
|
|
<el-row :gutter="12">
|
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
|
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
|
@@ -52,14 +54,61 @@
|
|
<el-button type="primary" @click="submit()">确定</el-button>
|
|
<el-button type="primary" @click="submit()">确定</el-button>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</el-dialog>
|
|
|
|
+<!-- 编辑日程-->
|
|
|
|
+ <el-dialog :visible.sync="schedule1" title="编辑日程" append-to-body width="40%" >
|
|
|
|
+ <el-row :gutter="12">
|
|
|
|
+ <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
|
|
|
+ <el-col :span="24">
|
|
|
|
+ <el-form-item label="开始时间" prop="field101">
|
|
|
|
+ <el-date-picker
|
|
|
|
+ v-model="formData.start"
|
|
|
|
+ type="datetime"
|
|
|
|
+ :style="{width: '100%'}"
|
|
|
|
+ placeholder="选择日期时间">
|
|
|
|
+ </el-date-picker>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-col>
|
|
|
|
+
|
|
|
|
+ <el-col :span="24">
|
|
|
|
+ <el-form-item label="结束时间" prop="field101">
|
|
|
|
+ <el-date-picker
|
|
|
|
+ v-model="formData.finish"
|
|
|
|
+ type="datetime"
|
|
|
|
+ :style="{width: '100%'}"
|
|
|
|
+ placeholder="选择日期时间">
|
|
|
|
+ </el-date-picker>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-col>
|
|
|
|
+
|
|
|
|
+ <el-col :span="24">
|
|
|
|
+ <el-form-item label="提前提醒" prop="field108">
|
|
|
|
+ <el-input v-model="formData.hour" placeholder="小时提醒我" clearable :style="{width: '100%'}">
|
|
|
|
+ </el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="24">
|
|
|
|
+ <el-form-item label="日程内容" prop="field109">
|
|
|
|
+ <el-input v-model="formData.incident" type="textarea" placeholder="记录你将要做的一件事"
|
|
|
|
+ :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-row>
|
|
|
|
+ <div slot="footer">
|
|
|
|
+ <el-button @click="schedule1 = false">取消</el-button>
|
|
|
|
+ <el-button type="primary" @click="updatarc()">修改</el-button>
|
|
|
|
+ <el-button type="danger" @click="deletrichen()">删除</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </el-dialog>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
- import { addRemindEvents,selectList,delSchenule} from "@/api/officework/index";
|
|
|
|
|
|
+ import { addRemindEvents,selectList,delSchenule,findList,updatarichen} from "@/api/officework/index";
|
|
import FullCalendar from '@fullcalendar/vue'
|
|
import FullCalendar from '@fullcalendar/vue'
|
|
import dayGridPlugin from '@fullcalendar/daygrid'
|
|
import dayGridPlugin from '@fullcalendar/daygrid'
|
|
import interactionPlugin from '@fullcalendar/interaction'
|
|
import interactionPlugin from '@fullcalendar/interaction'
|
|
import '@fullcalendar/core/main.css';
|
|
import '@fullcalendar/core/main.css';
|
|
|
|
+ import '@fullcalendar/core/locales/zh-cn.js'
|
|
import { formatDate } from '@fullcalendar/vue';
|
|
import { formatDate } from '@fullcalendar/vue';
|
|
|
|
|
|
let str = formatDate(new Date(), {
|
|
let str = formatDate(new Date(), {
|
|
@@ -78,13 +127,17 @@
|
|
},
|
|
},
|
|
data(){
|
|
data(){
|
|
return {
|
|
return {
|
|
|
|
+ isReloadData: true,
|
|
|
|
+ loading:true,
|
|
dialogVisible:false,
|
|
dialogVisible:false,
|
|
qqq:'',
|
|
qqq:'',
|
|
kaishi:'',
|
|
kaishi:'',
|
|
jieshu:'',
|
|
jieshu:'',
|
|
eveid:'',
|
|
eveid:'',
|
|
schedule: false,
|
|
schedule: false,
|
|
|
|
+ schedule1:false,
|
|
formData: {
|
|
formData: {
|
|
|
|
+ id:"",
|
|
start: null,
|
|
start: null,
|
|
field105: null,
|
|
field105: null,
|
|
finish: null,
|
|
finish: null,
|
|
@@ -154,10 +207,30 @@
|
|
this.toList();
|
|
this.toList();
|
|
},
|
|
},
|
|
methods:{
|
|
methods:{
|
|
|
|
+ //修改日程
|
|
|
|
+ updatarc(){
|
|
|
|
+
|
|
|
|
+ updatarichen(this.formData).then(response => {
|
|
|
|
+ if (response.code === 200) {
|
|
|
|
+ this.msgSuccess("修改成功");
|
|
|
|
+ this.schedule=false;
|
|
|
|
+ this.toList();
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ this.resetForm();
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ reload() {
|
|
|
|
+ this.isReloadData = false;
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
+ this.isReloadData = true;
|
|
|
|
+ });
|
|
|
|
+ },
|
|
toList (){
|
|
toList (){
|
|
|
|
+ this.loading = true;
|
|
selectList(this.formData).then(response => {
|
|
selectList(this.formData).then(response => {
|
|
console.log(response.rows)
|
|
console.log(response.rows)
|
|
-
|
|
|
|
for(var i = 0; i < response.rows.length;i++){
|
|
for(var i = 0; i < response.rows.length;i++){
|
|
this.calendarOptions.events.push({ // add new event data
|
|
this.calendarOptions.events.push({ // add new event data
|
|
title: response.rows[i].incident,
|
|
title: response.rows[i].incident,
|
|
@@ -167,6 +240,7 @@
|
|
// allDay: arg.allDay
|
|
// allDay: arg.allDay
|
|
});
|
|
});
|
|
}
|
|
}
|
|
|
|
+ this.loading = false;
|
|
|
|
|
|
// this.toList();
|
|
// this.toList();
|
|
console.log( this.calendarOptions.events)
|
|
console.log( this.calendarOptions.events)
|
|
@@ -200,7 +274,18 @@
|
|
// alert('日程安排为:' + info.event.title);
|
|
// alert('日程安排为:' + info.event.title);
|
|
// console.log(info.event)
|
|
// console.log(info.event)
|
|
this.eveid = info.event._def.extendedProps.defId
|
|
this.eveid = info.event._def.extendedProps.defId
|
|
- this.deletrichen();
|
|
|
|
|
|
+
|
|
|
|
+ this.schedule1 = true;
|
|
|
|
+ // this.updatarc();
|
|
|
|
+ let defId = this.eveid;
|
|
|
|
+ var formdata = new FormData;
|
|
|
|
+ formdata.append('id', defId)
|
|
|
|
+ findList(defId).then(response =>{
|
|
|
|
+ console.log(response.rows[0])
|
|
|
|
+ this.formData= response.rows[0];
|
|
|
|
+
|
|
|
|
+ });
|
|
|
|
+ // this.deletrichen();
|
|
//alert('Coordinates: ' + info.jsEvent.pageX + ',' + info.jsEvent.pageY);
|
|
//alert('Coordinates: ' + info.jsEvent.pageX + ',' + info.jsEvent.pageY);
|
|
//alert('View: ' + info.view.type);
|
|
//alert('View: ' + info.view.type);
|
|
|
|
|
|
@@ -220,21 +305,23 @@
|
|
},
|
|
},
|
|
//删除日程
|
|
//删除日程
|
|
deletrichen(){
|
|
deletrichen(){
|
|
- let defId = this.eveid;
|
|
|
|
|
|
+ let defId = this.eveid;
|
|
|
|
+ var formdata = new FormData
|
|
|
|
+ formdata.append('id', defId)
|
|
this.$confirm('是否确认删除日程?', "警告", {
|
|
this.$confirm('是否确认删除日程?', "警告", {
|
|
- confirmButtonText: "确定",
|
|
|
|
- cancelButtonText: "取消",
|
|
|
|
- type: "warning"
|
|
|
|
|
|
+ confirmButtonText: '确定',
|
|
|
|
+ cancelButtonText: '取消',
|
|
|
|
+ type: 'warning'
|
|
}).then(function() {
|
|
}).then(function() {
|
|
- var formdata = new FormData
|
|
|
|
- formdata.append('id', defId)
|
|
|
|
return delSchenule(formdata);
|
|
return delSchenule(formdata);
|
|
}).then(() => {
|
|
}).then(() => {
|
|
- this.toList();
|
|
|
|
|
|
+ this.reload();
|
|
this.msgSuccess("删除成功");
|
|
this.msgSuccess("删除成功");
|
|
|
|
+ this.schedule1 = false;
|
|
}).catch(function() {});
|
|
}).catch(function() {});
|
|
|
|
|
|
|
|
|
|
|
|
+
|
|
},
|
|
},
|
|
resetForm() {
|
|
resetForm() {
|
|
this.formData=[];
|
|
this.formData=[];
|