|
|
@@ -0,0 +1,347 @@
|
|
|
+<template>
|
|
|
+ <div class="edu-training-edit">
|
|
|
+ <DialogCom
|
|
|
+ :title="title"
|
|
|
+ @close="onHide"
|
|
|
+ :visible.sync="isShow"
|
|
|
+ width="1000px"
|
|
|
+ >
|
|
|
+ <div class="page-body">
|
|
|
+ <el-form
|
|
|
+ ref="form"
|
|
|
+ :model="formData"
|
|
|
+ :rules="formDataRules"
|
|
|
+ label-width="120px"
|
|
|
+ >
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item prop="reasons" label="出入事由">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.reasons"
|
|
|
+ placeholder="请输入出入事由"
|
|
|
+ :length="200"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="接待机构" prop="receptionOrgIds">
|
|
|
+ <org-tree-select v-model="formData.receptionOrgIds" ref="orgTreeSelect">
|
|
|
+ </org-tree-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="介绍信编号" prop="letterNo">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.letterNo"
|
|
|
+ placeholder="请输入介绍信编号"
|
|
|
+ :length="200"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item prop="range" label="介绍信有效期">
|
|
|
+ <DataRangePicker
|
|
|
+ v-model="formData.range"
|
|
|
+ key="daterange"
|
|
|
+ type="daterange"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="上传介绍信" prop="letterFile">
|
|
|
+ <K-file-upload
|
|
|
+ ref="upload"
|
|
|
+ :defaultValue="formFileListDefualtValue"
|
|
|
+ v-model="formData.letterFile"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="备注" prop="description">
|
|
|
+ <el-input
|
|
|
+ v-model="formData.description"
|
|
|
+ placeholder="请输入备注"
|
|
|
+ maxlength="100"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="10" class="mb8">
|
|
|
+ <el-col :span="1.5">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ plain
|
|
|
+ icon="el-icon-plus"
|
|
|
+ size="mini"
|
|
|
+ @click="handleAddUser"
|
|
|
+ >新增人员</el-button
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-table :data="formData.userInfos">
|
|
|
+ <el-table-column label="人员姓名" align="center" prop="userName" />
|
|
|
+ <el-table-column label="单位" align="center" prop="companyName" />
|
|
|
+ <el-table-column label="证件号码" align="center" prop="idCard">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="证件照" align="center" prop="imgFile">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <img width="50" height="50" :src="scope.row.imgFile" />
|
|
|
+ </template> </el-table-column
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ align="center"
|
|
|
+ class-name="small-padding fixed-width"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="text" @click="editUser(scope.row)"
|
|
|
+ >编辑</el-button
|
|
|
+ >
|
|
|
+ <el-button size="mini" type="text" @click="remove(scope.row)"
|
|
|
+ >移除</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <DialogCom
|
|
|
+ title="添加出入人员"
|
|
|
+ :visible.sync="open"
|
|
|
+ width="600px"
|
|
|
+ append-to-body
|
|
|
+ @close="onHideUser"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ ref="formUser"
|
|
|
+ :model="userInfo"
|
|
|
+ :rules="userInfoRules"
|
|
|
+ label-width="120px"
|
|
|
+ >
|
|
|
+ <el-form-item label="人员姓名" prop="userName">
|
|
|
+ <el-input v-model="userInfo.userName" placeholder="请输入姓名" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="单位" prop="companyName">
|
|
|
+ <el-input v-model="userInfo.companyName" placeholder="请输入单位" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="证件号码" prop="idCard">
|
|
|
+ <el-input v-model="userInfo.idCard" placeholder="请输入证件号码" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="imgFile" label="上传证件照">
|
|
|
+ <!-- <ImageListPreview v-model="userInfo.imgFile"></ImageListPreview> -->
|
|
|
+ <imgUpload ref="uploadimage" type="more" :value="userInfo.imgFile"
|
|
|
+ @input="imageListChanged"></imgUpload>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitUser">确 定</el-button>
|
|
|
+ <el-button @click="onHideUser">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </DialogCom>
|
|
|
+
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
+ <el-button @click="onHide">取 消</el-button>
|
|
|
+ </div>
|
|
|
+ </DialogCom>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { mapState, mapMutations } from "vuex";
|
|
|
+import {
|
|
|
+ listLetter,
|
|
|
+ getLetter,
|
|
|
+ delLetter,
|
|
|
+ addLetter,
|
|
|
+ updateLetter,
|
|
|
+} from "@/api/core/letter";
|
|
|
+import OrgTreeSelect from "@/components/orgTreeSelect";
|
|
|
+import KFileUpload from "@/components/K-FileUpload/index.vue";
|
|
|
+import dayjs from "dayjs";
|
|
|
+import imgUpload from "@/components/ImageUpload";
|
|
|
+import DataRangePicker from "@/components/dateTime/daterange.picker.vue";
|
|
|
+export default {
|
|
|
+ components: { OrgTreeSelect, KFileUpload, imgUpload,DataRangePicker },
|
|
|
+ data() {
|
|
|
+ const params = this.$route.params;
|
|
|
+ return {
|
|
|
+ id: params ? params.id : null,
|
|
|
+ isShow: false,
|
|
|
+ title: "录入介绍信",
|
|
|
+ formData: this.reset(),
|
|
|
+ formDataRules: {
|
|
|
+ reasons: [{ required: true, message: "请输入出入事由" }],
|
|
|
+ letterNo: [{ required: true, message: "请输入介绍信编号" }],
|
|
|
+ receptionOrgIds: [{ required: true, message: "请选择接待机构" }],
|
|
|
+ range: [{ required: true, message: "请选择介绍信有效期" }],
|
|
|
+ userInfos: [{ required: true, message: "请添加出入人员" }],
|
|
|
+ letterFile:[{ required: true, message: "请上传介绍信" }],
|
|
|
+ },
|
|
|
+ userInfoRules: {
|
|
|
+ userName: [{ required: true, message: "请输入姓名" }],
|
|
|
+ companyName: [{ required: true, message: "请输入单位" }],
|
|
|
+ idCard: [{ required: true, message: "请输入证件号码" }],
|
|
|
+ imgFile: [{ required: true, message: "请上传证件照" }],
|
|
|
+ },
|
|
|
+ startDatepickerOptions: {
|
|
|
+ disabledDate: this.endDisabledDate,
|
|
|
+ },
|
|
|
+ endDatepickerOptions: {
|
|
|
+ disabledDate: this.endDisabledDate,
|
|
|
+ },
|
|
|
+ formFileListDefualtValue: [],
|
|
|
+ open: false,
|
|
|
+ userInfo: this.resetUserInfo(),
|
|
|
+ imageList: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ dicts: ["letter_status"],
|
|
|
+ props: {},
|
|
|
+ watch: {},
|
|
|
+ created() {},
|
|
|
+ computed: {
|
|
|
+ ...mapState(["loginUser", "org"]),
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapMutations([]),
|
|
|
+ reset(other = {}) {
|
|
|
+ return {
|
|
|
+ reasons: null,
|
|
|
+ letterNo:null,
|
|
|
+ receptionOrgIds: [],
|
|
|
+ range:[],
|
|
|
+ description: null,
|
|
|
+ letterFile: [],
|
|
|
+ userInfos: [],
|
|
|
+ type:1,
|
|
|
+ status:0,
|
|
|
+ ...other,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ resetUserInfo() {
|
|
|
+ return {
|
|
|
+ userName: null,
|
|
|
+ companyName: null,
|
|
|
+ idCard: null,
|
|
|
+ imgFile: null,
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ async show(id, other = {}) {
|
|
|
+ if (id) {
|
|
|
+ this.title = "修改介绍信";
|
|
|
+ this.isShow = true;
|
|
|
+ getLetter(id).then((response) => {
|
|
|
+ let tempRange=[];
|
|
|
+ tempRange.push(dayjs(response.data.startTime));
|
|
|
+ tempRange.push(new Date(response.data.endTime));
|
|
|
+ response.data.range=tempRange;
|
|
|
+ this.formData = response.data;
|
|
|
+ this.formFileListDefualtValue=this.formData.letterFile;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ else
|
|
|
+ {
|
|
|
+ this.isShow = true;
|
|
|
+ this.title = "录入介绍信";
|
|
|
+ this.formData = this.reset();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleAddUser() {
|
|
|
+ this.open = true;
|
|
|
+ },
|
|
|
+ imageListChanged(list) {
|
|
|
+ this.userInfo.imgFile = list;
|
|
|
+ },
|
|
|
+ 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) {
|
|
|
+ if (
|
|
|
+ dayjs(this.formData.startTime).isAfter(dayjs(this.formData.endTime))
|
|
|
+ ) {
|
|
|
+ this.formData.endTime = this.formData.startTime;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ endDateChanged(time) {
|
|
|
+ if (
|
|
|
+ dayjs(this.formData.startTime).isAfter(dayjs(this.formData.endTime))
|
|
|
+ ) {
|
|
|
+ this.formData.startTime = this.formData.endTime;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onHide() {
|
|
|
+ this.isShow = false;
|
|
|
+ this.formData = this.reset();
|
|
|
+ },
|
|
|
+ onHideUser() {
|
|
|
+ this.open = false;
|
|
|
+ this.imageList = [];
|
|
|
+ this.userInfo = this.resetUserInfo();
|
|
|
+ },
|
|
|
+ submitUser() {
|
|
|
+ this.$refs["formUser"].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.open = false;
|
|
|
+ console.log("================", this.userInfo);
|
|
|
+ this.formData.userInfos.push(this.userInfo);
|
|
|
+ this.userInfo = this.resetUserInfo();
|
|
|
+ this.imageList = [];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ submitForm() {
|
|
|
+ this.$refs["form"].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ if (this.formData.userInfos.length <= 0) {
|
|
|
+ this.$message.error("请添加人员");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ console.log("================", this.formData);
|
|
|
+ if (this.formData.id != null) {
|
|
|
+ updateLetter(this.formData).then((response) => {
|
|
|
+ this.$modal.msgSuccess("修改成功");
|
|
|
+ this.isShow = false;
|
|
|
+ this.formData = this.reset();
|
|
|
+ this.$emit("success", this.formData);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ addLetter(this.formData).then((response) => {
|
|
|
+ this.$modal.msgSuccess("新增成功");
|
|
|
+ this.isShow = false;
|
|
|
+ this.formData = this.reset();
|
|
|
+ this.$emit("success", this.formData);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ editUser(row) {
|
|
|
+ this.open = true;
|
|
|
+ this.userInfo = row;
|
|
|
+ },
|
|
|
+ remove(row) {
|
|
|
+ console.log("================", row);
|
|
|
+ this.formData.userInfos.splice(this.formData.userInfos.indexOf(row), 1);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|