期课表,差最后还原

src/views/train-plan/parts/lesson-table.vue

@@ -1,51 +1,70 @@
 <template>
   <div id="lesson-table">
-    <data-form :data="form" :fields="fields" :rules="{}" @save="handleSave" :needSave="false" :reset="false">
-      <template #radios="{item, form}">
-        <template v-if="item.model == 'type'">
+    <el-form :model="form" size="mini" style="padding:20px" label-width="100px">
+      <el-form-item label="日期">{{ form.date }}</el-form-item>
+      <el-form-item label="类型">
+        <el-radio-group v-model="form.type">
           <el-radio @change="radioClearForm" v-for="(i, index) in dayType" :key="index" :label="i.label">{{ i.label }}</el-radio>
-        </template>
-      </template>
-      <template #options="{item, form}">
-        <template v-if="item.model == 'subname'">
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="活动安排" v-if="form.type == '活动'">
+        <el-select v-model="form.subname" placeholder="请选择活动">
           <el-option v-for="(i, index) in actList" :key="index" :label="i.label" :value="i.label"></el-option>
-        </template>
-        <template v-if="item.model == 'subid'">
-          1
-          <!-- <el-option v-for="(i, index) in subjectList" :key="index" :label="i.name" :value="i.id"></el-option> -->
-        </template>
-      </template>
-
-      <template #custom="{item, form}">
-        <template v-if="item.model == 'name'">
-          <el-input v-model="form.name" :readonly="true" placeholder="点击选择教师" @click.native="toChooseTeacher"></el-input>
-        </template>
+        </el-select>
+      </el-form-item>
+      <template v-if="form.type == '课程'">
+        <el-form-item label="课程安排">
+          <el-select v-model="form.subid" placeholder="请选择课程">
+            <el-option v-for="(i, index) in subjectList" :key="index" :label="i.name" :value="i.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="教师安排">
+          <el-form-item v-for="(i, index) in cList" :key="index" :label="`${i.class_num}班`" label-width="50px">
+            <el-input v-model="i.name" :readonly="true" placeholder="点击选择教师" @click.native="toChooseTeacher(i.classid)"></el-input>
+          </el-form-item>
+        </el-form-item>
       </template>
-    </data-form>
+      <el-form-item label="是否全天" v-if="form.is_last">
+        <el-radio-group v-model="form.allday">
+          <el-radio label="全天">全天</el-radio>
+          <el-radio label="半天">半天</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item>
+        <el-row type="flex" align="middle" justify="center">
+          <el-col :span="2">
+            <el-button type="primary" @click="handleSave">保存</el-button>
+          </el-col>
+        </el-row>
+      </el-form-item>
+    </el-form>
+    <el-dialog title="选择教师" :visible.sync="dialog" :destroy-on-close="true" :append-to-body="true">
+      <teacher-select :schoolList="schoolList" :subjectList="subjectList" :subjectid="form.subid" @selTea="selTea"> </teacher-select>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import _ from 'lodash';
+import teacherSelect from './teacher.vue';
 import dataForm from '@frame/components/form';
 import { mapState, createNamespacedHelpers } from 'vuex';
 export default {
   name: 'lesson-table',
   props: {
     data: { type: Object, default: () => {} },
+    subjectList: { type: Array, default: () => [] },
+    schoolList: { type: Array, default: () => [] },
+    classList: { type: Array, default: () => [] },
   },
-  components: { dataForm },
+  components: { teacherSelect }, //dataForm
   data: function() {
     var that = this;
     return {
       form: _.cloneDeep(that.data),
-      fields: [
-        { label: '日期', model: 'date', type: 'text' },
-        { label: '类型', model: 'type', type: 'radio' },
-        { label: '课程安排', model: 'subid', type: 'select', display: (fields, form) => that.fieldDisplay(fields, form) },
-        { label: '活动安排', model: 'subname', type: 'select', display: (fields, form) => that.fieldDisplay(fields, form) },
-        { label: '教师', model: 'name', custom: true, display: (fields, form) => that.fieldDisplay(fields, form) },
-      ],
+      cList: _.cloneDeep(that.classList),
+      dialog: false,
+      isChange: undefined,
       dayType: [{ label: '活动' }, { label: '课程' }],
       actList: [
         { label: '--' },
@@ -63,8 +82,22 @@ export default {
   },
   created() {},
   methods: {
-    handleSave({ data }) {
-      console.log(data);
+    handleSave() {
+      let dForm = _.cloneDeep(this.form);
+      if (_.get(dForm, 'subid')) {
+        dForm.subname = this.subjectList.find(f => f.id == _.get(dForm, 'subid')).name;
+      }
+      let dList = _.cloneDeep(this.cList);
+      this.$emit('save', { form: dForm, classList: dList });
+    },
+    //选择教师
+    selTea(data) {
+      let { teaname: name, teaid: id } = data;
+      this.dialog = false;
+      let i = this.cList.findIndex(f => f.classid == this.isChange);
+      let o = this.cList.find(f => f.classid == this.isChange);
+      o = { ...o, name, id };
+      this.$set(this.cList, i, o);
     },
     //field的显示
     fieldDisplay(f, form) {
@@ -75,10 +108,24 @@ export default {
     //修改类型清除数据
     radioClearForm(data) {
       if (data == '活动') {
-        delete this.form.subid;
+        this.clearTeaInfo();
         this.form.subname = '--';
       }
     },
+    clearTeaInfo() {
+      delete this.form.subid;
+      let narr = this.cList.map(i => {
+        i.id = undefined;
+        i.name = undefined;
+        return i;
+      });
+      this.$set(this, `cList`, narr);
+      this.$forceUpdate();
+    },
+    async toChooseTeacher(classid) {
+      this.$set(this, `isChange`, classid);
+      this.dialog = true;
+    },
   },
   computed: {
     ...mapState(['user']),

src/views/train-plan/parts/term-class-from.vue

@@ -0,0 +1,133 @@
+<template>
+  <div id="term-class-from">
+    <el-form :model="form" size="mini" style="padding:20px" label-width="100px">
+      <el-form-item :label="label">
+        <el-form-item v-for="(cl, index) in classList" :key="index" :label="`${cl.class_num}班`" label-width="50px">
+          <template v-if="form.type == 'headteacher'">
+            <el-select v-model="cl.id" :placeholder="`请选择${label}`">
+              <el-option-group v-for="(dept, index) in list" :label="dept.name" :key="index">
+                <el-option v-for="(i, tIndex) in dept.list" :key="`${index}-${tIndex}`" :label="i.name" :value="i._id"></el-option>
+              </el-option-group>
+            </el-select>
+          </template>
+          <el-select v-model="cl.id" :placeholder="`请选择${label}`" v-else>
+            <el-option v-for="(i, index) in list" :key="index" :label="i.name" :value="i._id"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form-item>
+      <el-form-item>
+        <el-row type="flex" align="middle" justify="center">
+          <el-col :span="2">
+            <el-button type="primary" @click="handleSave">保存</el-button>
+          </el-col>
+        </el-row>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import _ from 'lodash';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'term-class-from',
+  props: {
+    data: { type: Object, default: () => {} },
+    lyTeacherList: { type: Array, default: () => [] },
+    headTeacherList: { type: Array, default: () => [] },
+    locationList: { type: Array, default: () => [] },
+  },
+  components: {},
+  data: function() {
+    return {
+      form: {},
+      classList: [],
+      label: '',
+      list: [],
+    };
+  },
+  created() {},
+  methods: {
+    handleSave() {
+      let dForm = _.cloneDeep(this.form);
+      let dList = _.cloneDeep(this.classList);
+      dList = dList.map(i => {
+        if (i.id) {
+          let r;
+          let dataList = _.cloneDeep(this.list);
+          if (dForm.type == 'headteacher') {
+            dataList = _.flatten(dataList.map(i => i.list));
+            r = dataList.find(f => f._id == i.id);
+          } else r = dataList.find(f => f._id == i.id);
+          if (r) i.name = r.name;
+        }
+        return i;
+      });
+      let r = {};
+      dList.map(c => {
+        let { class_num, ...info } = c;
+        let keys = Object.keys(info);
+        for (const key of keys) {
+          r[`${key}_${class_num}`] = info[key];
+        }
+      });
+      r = { ...dForm, ...r };
+      this.$emit('save', r);
+    },
+    setData(data) {
+      let { index, batch, date, type, ...others } = data;
+      let obj = { index, batch, date, type };
+      this.$set(this, `form`, obj);
+      this.getAttr();
+      let keys = Object.keys(others);
+      let indexs = _.uniq(keys.map(key => key.match(/\d+(.\d+)?/g)[0]));
+      let arr = indexs.map(i => {
+        let gks = keys.filter(f => f.includes(i));
+        gks = gks.map(gk => {
+          let o = [];
+          o.push(gk.split('_')[0]);
+          o.push(others[gk]);
+          return o;
+        });
+        let res = _.fromPairs(gks);
+        res = { ...res, class_num: i };
+        return res;
+      });
+      this.$set(this, `classList`, arr);
+    },
+    getAttr() {
+      let { type } = this.form;
+      if (type == 'headteacher') {
+        this.$set(this, `list`, this.headTeacherList);
+        this.label = '班主任';
+      } else if (type == 'lyteacher') {
+        this.$set(this, `list`, this.lyTeacherList);
+        this.label = '礼仪课教师';
+      } else {
+        this.$set(this, `list`, this.locationList);
+        this.label = '教室地点';
+      }
+    },
+  },
+  watch: {
+    data: {
+      handler(val) {
+        this.setData(val);
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/train-plan/parts/term-lesson-form.vue

@@ -1,15 +1,6 @@
 <template>
   <div id="term-lesson-form">
-    <el-tabs v-model="active" style="padding:10px">
-      <el-tab-pane v-for="(i, index) in form" :key="index" :label="`${i.class_num}班`" :name="`${i.class_num}`">
-        <lt :ref="`lt${index}`" :data="i" @save="toSave"></lt>
-      </el-tab-pane>
-      <el-row type="flex" align="middle" justify="center">
-        <el-col :span="2">
-          <el-button type="primary" size="mini" @click="getSaveData">保存</el-button>
-        </el-col>
-      </el-row>
-    </el-tabs>
+    <lt :ref="`lt`" :data="form" :classList="classList" @save="toSave" v-bind="$attrs"></lt>
   </div>
 </template>
 
@@ -25,16 +16,17 @@ export default {
   components: { lt },
   data: function() {
     return {
-      active: '1',
-      form: [],
+      form: {},
+      classList: [],
     };
   },
   created() {},
   methods: {
     setData(val) {
-      let { batch, date, is_last, subname, subid, type: dataType, ...others } = val;
-      let obj = { batch, date, is_last, subname, subid, dataType };
+      let { index, batch, date, is_last, subname, subid, type: dataType, allday, ...others } = val;
+      let obj = { index, batch, date, is_last, subname, subid, dataType, allday };
       obj.type = subid ? '课程' : '活动';
+      this.$set(this, `form`, obj);
       let keys = Object.keys(others);
       let indexs = _.uniq(keys.map(key => key.match(/\d+(.\d+)?/g)[0]));
       let arr = indexs.map(i => {
@@ -46,17 +38,24 @@ export default {
           return o;
         });
         let res = _.fromPairs(gks);
-        res = { ...res, ...obj, class_num: i };
+        res = { ...res, class_num: i };
         return res;
       });
-      this.$set(this, `form`, arr);
+      this.$set(this, `classList`, arr);
     },
-    toSave(data) {
-      console.log('in function:toSave');
-      console.log(data);
-    },
-    getSaveData() {
-      console.log('in function:getSaveData to get data witch need to submit');
+    toSave({ form, classList }) {
+      let { dataType: type, ...f } = form;
+      form = { ...f, type };
+      let r = {};
+      classList.map(c => {
+        let { class_num, ...info } = c;
+        let keys = Object.keys(info);
+        for (const key of keys) {
+          r[`${key}_${class_num}`] = info[key];
+        }
+      });
+      r = { ...form, ...r };
+      this.$emit('save', r);
     },
   },
   computed: {

src/views/train-plan/parts/term-lesson-table.vue

@@ -68,13 +68,14 @@ export default {
     cellClick(row, column) {
       let keys = Object.keys(row);
       if (keys.length <= 0) return;
+      let index = this.list.findIndex(f => _.isEqual(f, row));
       let prop = _.get(column, 'property');
       let type = _.get(row, `type`);
-      if ((prop && prop.includes('name')) || type == 'allday') {
-        let obj = { ...row, batch: this.batch };
+      if (prop && prop.includes('name')) {
+        let obj = { ...row, batch: this.batch, index };
         if (type == 'lesson') {
           let arr = this.data;
-          let fr = arr.filter(f => moment(f.date).isValid() && Object.keys(f).length > 0);
+          let fr = arr.filter(f => f.type == 'lesson' && Object.keys(f).length > 0);
           obj.is_last = _.isEqualWith(_.last(fr), row, (ob, ot) => ob.date == ot.date);
           this.$emit('lesson', obj);
         } else this.$emit('other', obj);

src/views/train-plan/term-lesson.vue

@@ -7,10 +7,20 @@
         </el-col>
       </el-row>
     </detail-frame>
-    <el-drawer title="课程安排" :visible.sync="lDrawer">
-      <lesson-form :data="form"></lesson-form>
+    <el-drawer title="课程安排" :visible.sync="lDrawer" :destroy-on-close="true" @close="toClose">
+      <lesson-form v-if="lDrawer" v-loading="dloading" :data="form" :subjectList="subjectList" :schoolList="schoolList" @save="lessonSave"></lesson-form>
+    </el-drawer>
+    <el-drawer title="其他安排" :visible.sync="oDrawer" :destroy-on-close="true" @close="toClose">
+      <class-form
+        v-if="oDrawer"
+        :data="form"
+        :locationList="locationList"
+        :headTeacherList="headTeacherList"
+        :lyTeacherList="lyTeacherList"
+        v-loading="dloading"
+        @save="lessonSave"
+      ></class-form>
     </el-drawer>
-    <el-drawer title="其他安排" :visible.sync="oDrawer"></el-drawer>
   </div>
 </template>
 
@@ -21,6 +31,7 @@ const moment = require('moment');
 moment.locale('zh-cn');
 import lessonTable from './parts/term-lesson-table';
 import lessonForm from './parts/term-lesson-form';
+import classForm from './parts/term-class-from';
 import detailFrame from '@frame/layout/admin/detail-frame';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: lesson } = createNamespacedHelpers('lesson');
@@ -33,13 +44,16 @@ const { mapActions: dirPlan } = createNamespacedHelpers('dirPlan'); //班主任
 const { mapActions: teaplan } = createNamespacedHelpers('teaPlan');
 const { mapActions: mapDept } = createNamespacedHelpers('dept');
 const { mapActions: director } = createNamespacedHelpers('director');
+const { mapActions: school } = createNamespacedHelpers('school'); //给选老师组件使用.这个页面请求完就不销毁了
+const { mapActions: subject } = createNamespacedHelpers('subject');
 export default {
   name: 'term-lesson',
   props: {},
-  components: { detailFrame, lessonTable, lessonForm },
+  components: { detailFrame, lessonTable, lessonForm, classForm },
   data: function() {
     return {
       loading: true,
+      dloading: false,
       lDrawer: false,
       oDrawer: false,
       form: {},
@@ -52,6 +66,8 @@ export default {
       lyTeacherList: [],
       deptList: [],
       headTeacherList: [],
+      schoolList: [],
+      subjectList: [],
     };
   },
   created() {
@@ -61,7 +77,9 @@ export default {
     ...lesson({ getLesson: 'query' }),
     ...classes({ getClass: 'query' }),
 
+    ...subject({ getSubject: 'query' }),
     ...director({ getDirector: 'fetch' }),
+    ...school({ getSchool: 'query' }),
     ...location({ getLocationList: 'query' }),
     ...teacher({ getTeacherList: 'query', getTeacher: 'fetch' }),
     ...dirPlan({ dirQuery: 'getDirTeacher' }),
@@ -244,38 +262,24 @@ export default {
       if (this.lyTeacherList.length <= 0) {
         arr.push(this.getTeacherList({ islyteacher: '1', status: '4' }));
       }
+      if (this.schoolList.length <= 0) {
+        arr.push(this.getSchool());
+      }
       if (this.deptList.length <= 0) {
         arr.push(this.getDept());
       }
+      if (this.subjectList.length <= 0) {
+        arr.push(this.getSubject());
+      }
       axios.all(arr).then(
-        axios.spread((r1, r2, r3) => {
+        axios.spread((r1, r2, r3, r4, r5) => {
           if (r1) this.$set(this, `locationList`, r1.data);
           if (r2) this.$set(this, `lyTeacherList`, r2.data);
-          if (r3) this.$set(this, `deptList`, r3.data);
+          if (r3) this.$set(this, `schoolList`, r3.data);
+          if (r4) this.$set(this, `deptList`, r4.data);
+          if (r5) this.$set(this, `subjectList`, r5.data);
         })
       );
-      // if (this.headTeacherList.length <= 0) {
-      //   res = await this.findTeacher({ planid: data.planid, termid: data.termid, batchid: data.batchid });
-      //   let duplicate = _.cloneDeep(res.data);
-      //   if (this.$checkRes(res)) {
-      //     //班主任按部门分组
-      //     let group = _.groupBy(res.data, 'department');
-      //     let keys = Object.keys(group);
-      //     let arr = keys.map(key => {
-      //       let r = this.deptList.find(f => f.id == key);
-      //       let obj = {};
-      //       if (r) {
-      //         obj.name = r.name;
-      //         obj.list = group[key];
-      //       }
-      //       return obj;
-      //     });
-      //     this.$set(this, `headTeacherList`, arr);
-      //     //班主任筛选可以当礼仪老师列表,和 礼仪教师列表合并
-      //     duplicate = duplicate.filter(f => f.islyteacher == '1');
-      //     this.$set(this, `lyTeacherList`, [...this.lyTeacherList, ...duplicate]);
-      //   }
-      // }
     },
     //初始化,将每个班级的班主任,礼仪课老师,教室id=>名称
     async searchClassPerson(obj) {
@@ -302,15 +306,67 @@ export default {
       // }
     },
     toLesson(data) {
-      console.log(`in lesson`);
+      let { is_last, batch } = data;
+      if (is_last) {
+        let last = _.last(this.list[batch - 1]);
+        let { date } = last;
+        data.allday = date;
+      }
       this.$set(this, `form`, data);
       this.lDrawer = true;
     },
-    toOther(data) {
-      console.log(`in other`);
-      console.log(data);
-      this.$set(this, `form`, data);
+    async toOther(data) {
       this.oDrawer = true;
+      this.dloading = true;
+      let { type } = data;
+      if (type != 'jslocation') await this.getHeadTeacher(data);
+      this.$set(this, `form`, data);
+      this.dloading = false;
+    },
+    lessonSave(data) {
+      let { index, batch, is_last, allday, ...info } = data;
+      if (is_last) {
+        //TODO 改变半天/全天
+        this.$set(this.list[batch - 1], this.list[batch - 1].length - 1, { date: allday, type: 'allday' });
+      }
+      this.$set(this.list[batch - 1], index, { batch, ...info });
+      this.toClose();
+    },
+    toClose() {
+      this.lDrawer = false;
+      this.oDrawer = false;
+      this.form = {};
+    },
+    async getHeadTeacher(data) {
+      let batchid;
+      let { type } = data;
+      let { planid, termid } = this.options;
+      let keys = Object.keys(data).filter(f => f.includes('classid'));
+      if (keys.length <= 0) return;
+      let cla = this.classList.find(f => f._id == data[keys[0]]);
+      if (!cla) return;
+      batchid = cla.batchid;
+      let res = await this.findTeacher({ planid, termid, batchid });
+      if (this.$checkRes(res)) {
+        let duplicate = _.cloneDeep(res.data);
+        if (type == 'headteacher') {
+          let group = _.groupBy(res.data, 'department');
+          let keys = Object.keys(group);
+          let arr = keys.map(key => {
+            let r = this.deptList.find(f => f.id == key);
+            let obj = {};
+            if (r) {
+              obj.name = r.name;
+              obj.list = group[key];
+            }
+            return obj;
+          });
+          this.$set(this, `headTeacherList`, arr);
+        } else if (type == 'lyteacher') {
+          duplicate = duplicate.filter(f => f.islyteacher == '1');
+          this.$set(this, `lyTeacherList`, _.uniqBy([...this.lyTeacherList, ...duplicate], '_id'));
+        }
+      }
     },
   },
   watch: {