培训心得

src/router/index.js

@@ -457,6 +457,12 @@ const train = [
     meta: { title: '课程培训' },
     component: () => import('@/views/trainVidoe/viewVideo.vue'),
   },
+  {
+    path: '/experience/index',
+    name: 'train_experience',
+    meta: { title: '培训心得' },
+    component: () => import('@/views/train-plan/experience.vue'),
+  },
 ];
 
 const statistics = [

src/store/index.js

@@ -42,6 +42,7 @@ import trainvideo from '@frame/store/trainvideo';
 import personalscore from '@frame/store/personalscore';
 import groupscore from '@frame/store/groupscore';
 import cerconfirm from '@frame/store/cerconfirm';
+import experience from '@frame/store/experience';
 import * as ustate from '@frame/store/user/state';
 import * as umutations from '@frame/store/user/mutations';
 import * as dostate from '@frame/store/setting/state';
@@ -96,6 +97,7 @@ export default new Vuex.Store({
     personalscore,
     groupscore,
     cerconfirm,
+    experience,
   },
   state: { ...ustate, ...dostate },
   mutations: { ...umutations, ...domutations },

src/views/train-plan/experience.vue

@@ -0,0 +1,140 @@
+<template>
+  <div id="experience">
+    <list-frame title="培训心得" @query="search" :total="total" :needFilter="false" :needAdd="false" :needPag="true">
+      <el-form size="small" :inline="true">
+        <el-form-item label="班级">
+          <el-select v-model="searchInfo.classid" placeholder="请选择班级">
+            <el-option v-for="(c, index) in classList" :key="index" :label="`${c.name.includes('班') ? c.name : `${c.name}班`}`" :value="c._id"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <to-export></to-export>
+      <data-table :fields="fields" :data="list" :opera="opera" @view="toView" @delete="toDelete"></data-table>
+    </list-frame>
+    <el-dialog :visible.sync="dialog" title="培训心得" @close="toClose" width="30%">
+      <data-form :data="form" :fields="formFields" :rules="{}" :needSave="false">
+        <template #custom="{item, form}">
+          <template v-if="item.model === 'content'">
+            <el-input type="textarea" v-model="form[item.model]" :readonly="true" :autosize="{ minRows: 4, maxRows: 20 }"></el-input>
+          </template>
+        </template>
+      </data-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import _ from 'lodash';
+import toExport from './parts/experience-export.vue';
+import listFrame from '@frame/layout/admin/list-frame';
+import dataForm from '@frame/components/form';
+import dataTable from '@frame/components/data-table';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: experience } = createNamespacedHelpers('experience');
+const { mapActions: classes } = createNamespacedHelpers('classes');
+const { mapActions: trainplan } = createNamespacedHelpers('trainplan');
+export default {
+  metaInfo: { title: '培训心得' },
+  name: 'experience',
+  props: {},
+  components: {
+    listFrame,
+    dataTable,
+    dataForm,
+    toExport,
+  },
+  data: () => ({
+    opera: [
+      {
+        label: '查看',
+        icon: 'el-icon-view',
+        method: 'view',
+      },
+      {
+        label: '删除',
+        icon: 'el-icon-delete',
+        method: 'delete',
+      },
+    ],
+    fields: [
+      { label: '姓名', prop: 'stuname' },
+      { label: '职务', prop: 'stujob' },
+    ],
+    list: [],
+    classList: [],
+    searchInfo: {},
+    total: 0,
+    dialog: false,
+    form: {},
+    formFields: [
+      { label: '姓名', model: 'stuname', type: 'text' },
+      { label: '职务', model: 'stujob', type: 'text' },
+      { label: '培训心得标题', model: 'title', type: 'text' },
+      { label: '培训心得', model: 'content', custom: true },
+    ],
+  }),
+  async created() {
+    await this.getOtherList();
+  },
+  computed: { ...mapState(['user', 'defaultOption']) },
+  methods: {
+    ...classes({ getClass: 'query' }),
+    ...experience(['query']),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      this.$set(this, `total`, 0);
+      const res = await this.query({ ...this.searchInfo, skip, limit });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        this.$set(this, `total`, res.total);
+      }
+    },
+    async getOtherList() {
+      const { termid } = this.defaultOption;
+      if (!termid) return;
+      const res = await this.getClass({ termid });
+      if (this.$checkRes(res)) {
+        let duplicate = _.cloneDeep(res.data);
+        duplicate = duplicate.map(i => {
+          if (parseInt(i.name)) {
+            i.order = parseInt(i.name);
+          } else {
+            // i.order = i.name;
+          }
+          return i;
+        });
+        duplicate = _.orderBy(duplicate, ['order'], ['asc']);
+        this.$set(this, `classList`, duplicate);
+      }
+    },
+    // 查看
+    toView({ data }) {
+      this.$set(this, `form`, data);
+      this.dialog = true;
+    },
+    // 删除
+    toDelete({ data }) {
+      console.log(data);
+    },
+    // 保存
+    turnSave({ data }) {},
+    // 关闭
+    toClose() {
+      this.form = {};
+      this.dialog = false;
+    },
+  },
+  watch: {
+    searchInfo: {
+      deep: true,
+      handler(val) {
+        if (val) {
+          const keys = Object.keys(val);
+          if (keys.length > 0) this.search();
+        }
+      },
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/train-plan/parts/experience-export.vue

@@ -0,0 +1,141 @@
+<template>
+  <div id="experience-export">
+    <el-row class="btn_bar" type="flex" justify="end">
+      <el-col :span="2">
+        <el-button type="primary" size="small" @click="dialog = true">导出培训心得</el-button>
+      </el-col>
+    </el-row>
+    <el-dialog title="请选择要导出培训心得的范围" width="30%" :visible.sync="dialog" center @close="toClose">
+      <el-form size="small">
+        <el-form-item label="年度计划">
+          <el-select clearable v-model="form.planid" @change="toGetTerm">
+            <el-option v-for="(i, index) in planList" :key="index" :label="i.title" :value="i._id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="期(可选)">
+          <el-select clearable v-model="form.termid" @change="selectTerm">
+            <el-option v-for="(i, index) in termList" :key="index" :label="`第${i.term}期`" :value="i._id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="批(可选)">
+          <el-select clearable v-model="form.batchid">
+            <el-option v-for="(i, index) in batchList" :key="index" :label="`第${i.batch}批`" :value="i._id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="班(可选)">
+          <el-select clearable v-model="form.classid" @change="selectClass">
+            <el-option v-for="(c, index) in classList" :key="index" :label="`${c.name.includes('班') ? c.name : `${c.name}班`}`" :value="c._id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="人(可选)">
+          <el-select clearable v-model="form.studentid">
+            <el-option v-for="(i, index) in studentList" :key="index" :label="`${i.name}(${i.job})`" :value="i._id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-row type="flex" justify="space-around">
+          <el-col :span="2">
+            <el-button type="primary" size="small" @click="toExport">导出</el-button>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+const _ = require('lodash');
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: experience } = createNamespacedHelpers('experience');
+const { mapActions: classes } = createNamespacedHelpers('classes');
+const { mapActions: trainplan } = createNamespacedHelpers('trainplan');
+const { mapActions: student } = createNamespacedHelpers('student');
+export default {
+  name: 'experience-export',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      dialog: false,
+      form: {},
+      planList: [],
+      termList: [],
+      batchList: [],
+      classList: [],
+      studentList: [],
+    };
+  },
+  async created() {
+    await this.toGetPlan();
+  },
+  methods: {
+    ...experience(['export']),
+    ...student({ getStudent: 'query' }),
+    ...trainplan({ getPlan: 'query' }),
+    ...classes({ getClass: 'query' }),
+    // 查询年度计划
+    async toGetPlan() {
+      const res = await this.getPlan();
+      if (this.$checkRes(res)) this.$set(this, `planList`, res.data);
+    },
+    // 找到期列表
+    async toGetTerm(planid) {
+      const res = await this.planList.find(f => f._id === planid);
+      if (!res) return;
+      const { termnum } = res;
+      this.$set(this, `termList`, termnum);
+    },
+    // 找到批次列表,查询班级列表
+    async selectTerm(termid) {
+      const r = this.termList.find(f => f._id === termid);
+      if (!r) return;
+      const { batchnum } = r;
+      this.$set(this, `batchList`, batchnum);
+      const stures = await this.getClass({ termid });
+      if (this.$checkRes(stures)) {
+        let duplicate = _.cloneDeep(stures.data);
+        duplicate = duplicate.map(i => {
+          if (parseInt(i.name)) {
+            i.order = parseInt(i.name);
+          } else {
+            // i.order = i.name;
+          }
+          return i;
+        });
+        duplicate = _.orderBy(duplicate, ['order'], ['asc']);
+        this.$set(this, `classList`, duplicate);
+      }
+    },
+    // 找到班级的班长,学委
+    async selectClass(classid) {
+      const bzres = await this.getStudent({ classid, job: '班长' });
+      const xwres = await this.getStudent({ classid, job: '学委' });
+      let arr = [];
+      if (this.$checkRes(bzres)) arr = [...arr, ...bzres.data];
+      if (this.$checkRes(xwres)) arr = [...arr, ...xwres.data];
+      this.$set(this, `studentList`, arr);
+    },
+    //导出
+    async toExport() {
+      const res = await this.export(this.form);
+      if (this.$checkRes(res, '导出成功', res.errmsg || '导出失败')) {
+        window.open(res.data);
+      }
+    },
+    toClose() {
+      this.dialog = false;
+      this.$set(this, `form`, {});
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>