|
|
@@ -0,0 +1,407 @@
|
|
|
+<template>
|
|
|
+ <div class="edu-training-edit">
|
|
|
+ <DialogCom :title="'新增培训任务'" :close="onHide" :visible.sync="isShow" width="960px">
|
|
|
+ <div class="page-body">
|
|
|
+ <el-form :model="formData" :rules="formDataRules" size="small" ref="perform" label-position="right"
|
|
|
+ label-width="120px" label-prefix=":">
|
|
|
+
|
|
|
+ <!-- 培训主题 -->
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item prop="title" label="培训主题">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.title"
|
|
|
+ :maxlength="32"
|
|
|
+ placeholder="请输入培训主题"
|
|
|
+ clearable
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item prop="startDate" label="开始日期">
|
|
|
+ <el-date-picker v-model="formData.startDate" @change="startDateChanged"
|
|
|
+ :picker-options="startDatepickerOptions"
|
|
|
+ align="right" type="date" placeholder="选择开始日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item prop="endDate" label="结束日期">
|
|
|
+ <el-date-picker style="width: 100%" v-model="formData.endDate" :picker-options="endDatepickerOptions"
|
|
|
+ align="right" type="date"
|
|
|
+ placeholder="选择结束日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="机构类型" prop="execOrgType">
|
|
|
+ <el-select style="width: 100%" v-model="formData.execOrgType" placeholder="请选择执行机构类型"
|
|
|
+ @change="execOrgTypeChanged()">
|
|
|
+
|
|
|
+ <el-option v-for="dict in getUserOrgType" :key="dict.value" :label="dict.label"
|
|
|
+ :value="parseInt(dict.value)"></el-option>
|
|
|
+
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item v-show="formData.execOrgType" label="培训机构" prop="planExecOrgIdList">
|
|
|
+ <org-tree-select
|
|
|
+ v-model="formData.planExecOrgIdList"
|
|
|
+ :queryData="formData.execOrgType"
|
|
|
+ ref="orgTreeSelect"
|
|
|
+ :enabledCheckOrgTypes="formData.execOrgType"
|
|
|
+ :disable="true">
|
|
|
+ </org-tree-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <!-- 内容 -->
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-form-item prop="content" label="培训内容">
|
|
|
+ <k-textarea v-model="formData.content" placeholder="请输入培训内容" :length="2000"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="上传文件" prop="fileList">
|
|
|
+ <K-file-upload ref="upload" :defaultValue="formFileListDefualtValue" v-model="formData.fileList"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="">
|
|
|
+ <el-button type="primary" @click="showSelectFile">从学习资料中选择</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="onHide">取消</el-button>
|
|
|
+ <el-button type="primary" @click="onSave">暂存</el-button>
|
|
|
+ <el-button type="primary" @click="onSubmit">提交</el-button>
|
|
|
+ </div>
|
|
|
+ </DialogCom>
|
|
|
+ <DialogSelectFile
|
|
|
+ ref="DialogSelectFile"
|
|
|
+ :defaultSelect=defaultSelect
|
|
|
+ @select="fileSelected"
|
|
|
+ :orgId="orgId"
|
|
|
+ ></DialogSelectFile>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import {mapState, mapMutations} from "vuex";
|
|
|
+import {getEduTask, recordEduTask} from "@/api/core/edu/eduTask";
|
|
|
+import dayjs from "dayjs";
|
|
|
+import KTextarea from "@/components/common/textarea.vue";
|
|
|
+import KSelect from "@/components/common/userselect.vue";
|
|
|
+import imgUpload from "@/components/ImageUpload/index.vue";
|
|
|
+import OrgTreeSelect from '@/components/orgTreeSelect'
|
|
|
+import DialogSelectFile from "../plan/dialog.select.file.vue"
|
|
|
+import KFileUpload from "@/components/K-FileUpload/index.vue";
|
|
|
+export default {
|
|
|
+ components: {KTextarea, KFileUpload,KSelect, imgUpload, OrgTreeSelect,DialogSelectFile},
|
|
|
+ data() {
|
|
|
+ const params = this.$route.params;
|
|
|
+ return {
|
|
|
+ id: params ? params.id : null,
|
|
|
+ isShow: false,
|
|
|
+ formData: this.reset(),
|
|
|
+ formDataRules: {
|
|
|
+ type: [{required: true, message: "请选择类型"}],
|
|
|
+ content: [{required: true, message: "请输入内容"}],
|
|
|
+ absenceList: [{required: true, type: "array", message: "请选择参与人员"}],
|
|
|
+ trainingStartDateTime: [{required: true, message: "请输入培训时间"}],
|
|
|
+ trainingEndDateTime: [{required: true, message: "请输入培训时间"}],
|
|
|
+ note: [{required: true, message: "请输入总结"}],
|
|
|
+ imageList: [{required: true, message: "请上传图片"}],
|
|
|
+ },
|
|
|
+ startDatepickerOptions: {
|
|
|
+ disabledDate(time) {
|
|
|
+ return false;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ endDatepickerOptions: {
|
|
|
+ disabledDate: this.endDisabledDate,
|
|
|
+ },
|
|
|
+ orgId: null,
|
|
|
+ defaultSelect: [],
|
|
|
+ formFileListDefualtValue: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ dicts: ['edu_type', 'edu_task_status', 'sys_org_type'],
|
|
|
+ props: {},
|
|
|
+ watch: {},
|
|
|
+ computed: {
|
|
|
+ ...mapState(["loginUser", "org",]),
|
|
|
+ getUserOrgType() {
|
|
|
+ console.log("computed allSysOrgTypes", this.dict.type.sys_org_type, this.$store.getters.orgType);
|
|
|
+ let tempArry = [];
|
|
|
+ this.dict.type.sys_org_type.forEach(x => {
|
|
|
+ if (Number(x.value) >= this.$store.getters.orgType) {
|
|
|
+ tempArry.push(x);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // console.log("computed getUserOrgType",tempArry);
|
|
|
+ return tempArry;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapMutations([]),
|
|
|
+ reset(other = {}) {
|
|
|
+ return {
|
|
|
+ // hostId: null,
|
|
|
+ // recorderId: null,
|
|
|
+ trainingStartDateTime: null,
|
|
|
+ trainingEndDateTime: null,
|
|
|
+ // dueCount: null,
|
|
|
+ // actualCount: null,
|
|
|
+ content: null,
|
|
|
+ title: null,
|
|
|
+ eduJobId: null,
|
|
|
+ imageList: "",
|
|
|
+ absenceList: [],
|
|
|
+ absentList: [],
|
|
|
+ orgList: [],
|
|
|
+ fileList: [],
|
|
|
+ ...other,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ /*async refresh(id, other) {
|
|
|
+ // this.formData = id
|
|
|
+ // ? await this.$api.eduTraining.one(id)
|
|
|
+ // : this.reset(other);
|
|
|
+
|
|
|
+ if (!id) {
|
|
|
+ this.reset(other);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let _this = this;
|
|
|
+ getEduTask(id).then(response => {
|
|
|
+ this.loading = false;
|
|
|
+ // _this.formData = response.data;
|
|
|
+ if (response.data.taskUserList) {
|
|
|
+ let list1 = response.data.taskUserList.filter((element) =>
|
|
|
+ element.type === 1
|
|
|
+ );
|
|
|
+ console.log("list1", list1)
|
|
|
+ response.data.absenceList = list1 ? list1.map((a) => {
|
|
|
+ return a.userId;
|
|
|
+ })
|
|
|
+ : [];
|
|
|
+
|
|
|
+ let list2 = response.data.taskUserList.filter((element) =>
|
|
|
+ element.type === 2
|
|
|
+ );
|
|
|
+ console.log("list2", list2)
|
|
|
+ response.data.absentList = list2 ? list2.map((a) => {
|
|
|
+ return a.userId;
|
|
|
+ })
|
|
|
+ : [];
|
|
|
+ } else {
|
|
|
+ response.data.absenceList = [];
|
|
|
+ response.data.absentList = [];
|
|
|
+ }
|
|
|
+
|
|
|
+ if (response.data.imageList == null) {
|
|
|
+ response.data.imageList = "";
|
|
|
+ }
|
|
|
+ if (response.data.fileList == null) {
|
|
|
+ response.data.fileList = [];
|
|
|
+ }
|
|
|
+ this.formData = response.data;
|
|
|
+ })
|
|
|
+ console.log("getEduTask", this.formData);
|
|
|
+ },*/
|
|
|
+ async show(id, other = {}) {
|
|
|
+ this.isShow = true;
|
|
|
+ },
|
|
|
+ imageListChanged(list) {
|
|
|
+ this.formData.imageList = list;
|
|
|
+ console.log("imageListChanged", this.formData.imageList);
|
|
|
+ },
|
|
|
+ showSelectFile() {
|
|
|
+ this.$refs["DialogSelectFile"].show();
|
|
|
+ },
|
|
|
+ fileSelected(list) {
|
|
|
+ if (!list) return;
|
|
|
+ let tempArry=[];
|
|
|
+ list.forEach(x => {
|
|
|
+ tempArry=tempArry.concat(x.fileList);
|
|
|
+ })
|
|
|
+ console.log("tempArry",tempArry,this.form.fileList);
|
|
|
+ if(this.form.fileList){
|
|
|
+ this.formFileListDefualtValue =this.form.fileList.concat(tempArry);
|
|
|
+ }
|
|
|
+ else{
|
|
|
+ this.formFileListDefualtValue =tempArry;
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ absentUserSelectChanged(list) {
|
|
|
+ console.log(list);
|
|
|
+ // 将类型为2的数据删除
|
|
|
+ if (this.formData.taskUserList) {
|
|
|
+ this.formData.taskUserList = this.formData.taskUserList.filter(x => x.type == 1);
|
|
|
+ } else {
|
|
|
+ this.formData.taskUserList = [];
|
|
|
+ }
|
|
|
+ let tempList = list.map(x => {
|
|
|
+ return {
|
|
|
+ userId: x.id,
|
|
|
+ userName: x.name,
|
|
|
+ type: 2
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if (!tempList) return;
|
|
|
+ this.formData.taskUserList = this.formData.taskUserList.concat(tempList);
|
|
|
+ console.log("absentUserSelectChanged", list, this.formData.taskUserList);
|
|
|
+ },
|
|
|
+ absenceUserSelectChanged(list) {
|
|
|
+ // 将类型为1的数据删除
|
|
|
+ if (this.formData.taskUserList) {
|
|
|
+ this.formData.taskUserList = this.formData.taskUserList.filter(x => x.type == 2);
|
|
|
+ } else {
|
|
|
+ this.formData.taskUserList = [];
|
|
|
+ }
|
|
|
+ let tempList = list.map(x => {
|
|
|
+ return {
|
|
|
+ userId: x.id,
|
|
|
+ userName: x.name,
|
|
|
+ type: 1
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (!tempList) return;
|
|
|
+ this.formData.taskUserList = this.formData.taskUserList.concat(tempList);
|
|
|
+ // console.log("absenceUserSelectChanged", list, this.formData.taskUserList,this.formData.absenceList);
|
|
|
+ // this.formData.absenceList=list.map(item=>item.id);
|
|
|
+
|
|
|
+ // console.log("absenceUserSelectChanged", list, this.formData.taskUserList,this.formData.absenceList);
|
|
|
+ },
|
|
|
+ // 事件
|
|
|
+ onHide() {
|
|
|
+ this.isShow = false;
|
|
|
+ this.formData = this.reset();
|
|
|
+ this.$refs["uploadimage"].clearFiles();
|
|
|
+ },
|
|
|
+ async onSave() {
|
|
|
+ if (!this.validatePerson()) {
|
|
|
+ this.$message.error("参与人员与缺席人员重复,请重新选择!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ //判断trainingStartDateTime大于trainingEndDateTime就返回
|
|
|
+ if (dayjs(this.formData.trainingStartDateTime).isAfter(dayjs(this.formData.trainingEndDateTime))) {
|
|
|
+ this.$message.error("培训开始时间不能大于培训结束时间!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let request = {submitType: 1, ...this.formData};
|
|
|
+ delete request.absenceList;
|
|
|
+ delete request.absentList;
|
|
|
+
|
|
|
+ if (request.trainingStartDateTime)
|
|
|
+ request.trainingStartDateTime = dayjs(request.trainingStartDateTime).format('YYYY-MM-DD HH:mm:ss')
|
|
|
+
|
|
|
+ if (request.trainingEndDateTime)
|
|
|
+ request.trainingEndDateTime = dayjs(request.trainingEndDateTime).format('YYYY-MM-DD HH:mm:ss')
|
|
|
+ // if(request.imageList)
|
|
|
+ // request.imageList=request.imageList.split(',').map(x=>{return x;});
|
|
|
+ // request.taskUserList = [];
|
|
|
+ recordEduTask(request).then((v) => {
|
|
|
+ this.$emit("success", this.formData);
|
|
|
+ this.onHide();
|
|
|
+ this.$modal.msgSuccess("培训登记暂存成功");
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async onSubmit() {
|
|
|
+ //console.log("onSubmit this.formData", this.formData)
|
|
|
+ await this.$refs.perform.validate();
|
|
|
+ //判断trainingStartDateTime大于trainingEndDateTime就返回
|
|
|
+ if (dayjs(this.formData.trainingStartDateTime).isAfter(dayjs(this.formData.trainingEndDateTime))) {
|
|
|
+ this.$message.error("培训开始时间不能大于培训结束时间!");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // this.formData.taskUserList=[];
|
|
|
+ console.log("onSubmit this.formData", this.formData)
|
|
|
+ console.log(this.formData.taskUserList);
|
|
|
+ this.formData.taskUserList = this.formData.taskUserList ? this.formData.taskUserList : []
|
|
|
+ if (this.formData.taskUserList.length == 0 || this.formData.taskUserList.filter(item => item.type == 1).length == 0) {
|
|
|
+ this.$message.error("参与人员不能为空,请重新选择!");
|
|
|
+ } else if (!this.validatePerson()) {
|
|
|
+ this.$message.error("参与人员与缺席人员重复,请重新选择!");
|
|
|
+ } else {
|
|
|
+ let request = {submitType: 2, ...this.formData};
|
|
|
+ delete request.absenceList;
|
|
|
+ delete request.absentList;
|
|
|
+
|
|
|
+ if (request.trainingStartDateTime) {
|
|
|
+ request.trainingStartDateTime = dayjs(request.trainingStartDateTime).format('YYYY-MM-DD HH:mm:ss')
|
|
|
+ }
|
|
|
+
|
|
|
+ if (request.trainingEndDateTime) {
|
|
|
+ request.trainingEndDateTime = dayjs(request.trainingEndDateTime).format('YYYY-MM-DD HH:mm:ss')
|
|
|
+ }
|
|
|
+
|
|
|
+ // request.taskUserList = [];
|
|
|
+ recordEduTask(request).then((v) => {
|
|
|
+ this.$emit("success", this.formData);
|
|
|
+ this.onHide();
|
|
|
+ this.$modal.msgSuccess("培训登记提交成功");
|
|
|
+ });
|
|
|
+ // this.$emit("success");
|
|
|
+ // this.onHide();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ validatePerson() {
|
|
|
+ for (let i = 0; i < this.formData.absenceList.length; i++) {
|
|
|
+ let absence = this.formData.absenceList[i];
|
|
|
+ if (this.formData.absentList.indexOf(absence) >= 0) {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ uploadTriggerEvent(value) {
|
|
|
+ },
|
|
|
+
|
|
|
+ endDisabledDate(time) {
|
|
|
+ //小于开始日期禁止选择
|
|
|
+ let startDate = new Date();
|
|
|
+ startDate.setTime(startDate.getTime() - 3600 * 1000 * 24);
|
|
|
+ if (this.formData.trainingStartDateTime) {
|
|
|
+ startDate = new Date(dayjs(this.formData.trainingStartDateTime).format('YYYY-MM-DD'));
|
|
|
+ startDate.setTime(startDate.getTime() - 3600 * 1000 * 24);
|
|
|
+ }
|
|
|
+ return time.getTime() < new Date(startDate).getTime()
|
|
|
+
|
|
|
+ },
|
|
|
+ startDateChanged(time) {
|
|
|
+ console.log("startDateChanged", time, this.formData.trainingStartDateTime, this.formData.trainingEndDateTime)
|
|
|
+ if (dayjs(this.formData.trainingStartDateTime).isAfter(dayjs(this.formData.trainingEndDateTime))) {
|
|
|
+ this.formData.trainingEndDateTime = this.formData.trainingStartDateTime;
|
|
|
+ console.log("trainingEndDateTime", this.formData.trainingEndDateTime)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ endDateChanged(time) {
|
|
|
+ console.log("startDateChanged", time, this.formData.trainingStartDateTime, this.formData.trainingEndDateTime)
|
|
|
+ if (dayjs(this.formData.trainingStartDateTime).isAfter(dayjs(this.formData.trainingEndDateTime))) {
|
|
|
+ this.formData.trainingStartDateTime = this.formData.trainingEndDateTime;
|
|
|
+ console.log("trainingEndDateTime", this.formData.trainingEndDateTime)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ execOrgTypeChanged(row) {
|
|
|
+ this.$refs['orgTreeSelect'].clear();
|
|
|
+ this.initRoleList(this.form.execOrgType);
|
|
|
+ // this.form.planExecOrgIdList = [];
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<!-- <style lang="less">
|
|
|
+.edu-training-edit {
|
|
|
+}
|
|
|
+</style> -->
|