|  | @@ -0,0 +1,262 @@
 | 
	
		
			
				|  |  | +<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"
 | 
	
		
			
				|  |  | +          label-suffix=":"
 | 
	
		
			
				|  |  | +        >
 | 
	
		
			
				|  |  | +          <el-row>
 | 
	
		
			
				|  |  | +            <el-col :span="24">
 | 
	
		
			
				|  |  | +              <el-form-item label="介绍信类型">
 | 
	
		
			
				|  |  | +              <dict-tag :options="dict.type.out_in_type" :value="formData.letterType"/>
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +              <el-form-item label="介绍信编号">
 | 
	
		
			
				|  |  | +              {{formData.letterNo}}
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +              <el-form-item label="接待机构" prop="receptionOrgIds">
 | 
	
		
			
				|  |  | +                {{formData.orgName}}
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +            <el-col :span="24">
 | 
	
		
			
				|  |  | +              <el-form-item label="出入事由">
 | 
	
		
			
				|  |  | +              {{formData.letterReasons}}
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +              <el-form-item  label="介绍信有效期">
 | 
	
		
			
				|  |  | +              {{formData.startTimeStr+'~'+formData.endTimeStr}}
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +              <el-form-item  label="有效天数">
 | 
	
		
			
				|  |  | +                {{ formData.effectiveDays}}
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +            <el-col :span="24">
 | 
	
		
			
				|  |  | +              <el-form-item label="介绍信附件">
 | 
	
		
			
				|  |  | +                <image-file-list-preview v-model="formData.letterFile"></image-file-list-preview>
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +            <el-col :span="24">
 | 
	
		
			
				|  |  | +              <el-form-item label="备注" prop="letterNo">
 | 
	
		
			
				|  |  | +                {{formData.letterDescription}}
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +          </el-row>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +          <el-row :gutter="10" >
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +                <h3>
 | 
	
		
			
				|  |  | +                  <i class="el-icon-collection-tag"></i>
 | 
	
		
			
				|  |  | +                  人员信息
 | 
	
		
			
				|  |  | +                </h3>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +          </el-row>
 | 
	
		
			
				|  |  | +          <el-table border size="small" :data="formData.userInfos" height="300">
 | 
	
		
			
				|  |  | +                  <el-table-column label="序号"  align="center"  type="index" width="70" />
 | 
	
		
			
				|  |  | +                  <el-table-column label="申请单位" width="100" align="center" prop="companyName" />
 | 
	
		
			
				|  |  | +                  <el-table-column label="出入人员" width="100" align="center" prop="userName" />
 | 
	
		
			
				|  |  | +                  <el-table-column label="证件类型" width="100" align="center" prop="idType">
 | 
	
		
			
				|  |  | +                    <template slot-scope="scope">
 | 
	
		
			
				|  |  | +                    <dict-tag :options="dict.type.letter_id_type" :value="scope.row.idType"/>
 | 
	
		
			
				|  |  | +                  </template>
 | 
	
		
			
				|  |  | +                  </el-table-column>
 | 
	
		
			
				|  |  | +                  <el-table-column label="证件号码" width="200" align="center" prop="idCard">
 | 
	
		
			
				|  |  | +                  </el-table-column>
 | 
	
		
			
				|  |  | +                  <el-table-column label="证件图片" align="center" prop="imgFile">
 | 
	
		
			
				|  |  | +                    <template slot-scope="scope">
 | 
	
		
			
				|  |  | +                            <ImageListPreview v-model="scope.row.imgFile"></ImageListPreview>
 | 
	
		
			
				|  |  | +                          </template>
 | 
	
		
			
				|  |  | +                    </el-table-column>
 | 
	
		
			
				|  |  | +          </el-table>
 | 
	
		
			
				|  |  | +          <el-row :gutter="10">
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +                <h3>
 | 
	
		
			
				|  |  | +                  <i class="el-icon-collection-tag"></i>
 | 
	
		
			
				|  |  | +                  审批信息
 | 
	
		
			
				|  |  | +                </h3>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +          </el-row>
 | 
	
		
			
				|  |  | +          <el-row>
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +              <el-form-item label="审批操作" prop="approveStatus">
 | 
	
		
			
				|  |  | +                <el-radio v-model="formData.approveStatus" label="1">同意</el-radio>
 | 
	
		
			
				|  |  | +                <el-radio v-model="formData.approveStatus" label="2">不同意</el-radio>
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +            <el-col :span="12">
 | 
	
		
			
				|  |  | +              <el-form-item label="审批说明" prop="approveRemark">
 | 
	
		
			
				|  |  | +                <el-input
 | 
	
		
			
				|  |  | +                  v-model="formData.approveRemark"
 | 
	
		
			
				|  |  | +                  placeholder="请输入审批说明"
 | 
	
		
			
				|  |  | +                  maxlength="100"
 | 
	
		
			
				|  |  | +                />
 | 
	
		
			
				|  |  | +              </el-form-item>
 | 
	
		
			
				|  |  | +            </el-col>
 | 
	
		
			
				|  |  | +          </el-row>
 | 
	
		
			
				|  |  | +        </el-form>
 | 
	
		
			
				|  |  | +      </div>
 | 
	
		
			
				|  |  | +      <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 {
 | 
	
		
			
				|  |  | +  // getLetter,
 | 
	
		
			
				|  |  | +  getOutInRequest,
 | 
	
		
			
				|  |  | +  approveOutInRequest,
 | 
	
		
			
				|  |  | +} from "@/api/core/letter";
 | 
	
		
			
				|  |  | +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";
 | 
	
		
			
				|  |  | +import imageFileListPreview from "@/components/ImageFileListPreview/index.vue";
 | 
	
		
			
				|  |  | +export default {
 | 
	
		
			
				|  |  | +  components: {imageFileListPreview, KFileUpload, imgUpload,DataRangePicker },
 | 
	
		
			
				|  |  | +  data() {
 | 
	
		
			
				|  |  | +    const params = this.$route.params;
 | 
	
		
			
				|  |  | +    return {
 | 
	
		
			
				|  |  | +      id: params ? params.id : null,
 | 
	
		
			
				|  |  | +      isShow: false,
 | 
	
		
			
				|  |  | +      title: "出入事项审批",
 | 
	
		
			
				|  |  | +      formData: this.reset(),
 | 
	
		
			
				|  |  | +      formDataRules: {
 | 
	
		
			
				|  |  | +        approveStatus: [{ required: true, message: "请勾选审批结果" }],
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      formFileListDefualtValue: [],
 | 
	
		
			
				|  |  | +    };
 | 
	
		
			
				|  |  | +  },
 | 
	
		
			
				|  |  | +  dicts: ['out_in_type','letter_id_type'],
 | 
	
		
			
				|  |  | +  props: {},
 | 
	
		
			
				|  |  | +  watch: {},
 | 
	
		
			
				|  |  | +  created() {},
 | 
	
		
			
				|  |  | +  computed: {
 | 
	
		
			
				|  |  | +    ...mapState(["loginUser", "org"]),
 | 
	
		
			
				|  |  | +  },
 | 
	
		
			
				|  |  | +  methods: {
 | 
	
		
			
				|  |  | +    ...mapMutations([]),
 | 
	
		
			
				|  |  | +    reset(other = {}) {
 | 
	
		
			
				|  |  | +      return {
 | 
	
		
			
				|  |  | +        id: null,
 | 
	
		
			
				|  |  | +        reasons: null,
 | 
	
		
			
				|  |  | +        letterNo:null,
 | 
	
		
			
				|  |  | +        receptionOrgIds: [],
 | 
	
		
			
				|  |  | +        range:[],
 | 
	
		
			
				|  |  | +        description: null,
 | 
	
		
			
				|  |  | +        letterFile: [],
 | 
	
		
			
				|  |  | +        userInfos: [],
 | 
	
		
			
				|  |  | +        type:null,
 | 
	
		
			
				|  |  | +        approveRemark:null,
 | 
	
		
			
				|  |  | +        approveStatus:null,
 | 
	
		
			
				|  |  | +        approveSignImg:null,
 | 
	
		
			
				|  |  | +        ...other,
 | 
	
		
			
				|  |  | +      };
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    // checkApprove(rule,value,callback)
 | 
	
		
			
				|  |  | +    // {
 | 
	
		
			
				|  |  | +    //   console.log("checkApprove rule",rule);
 | 
	
		
			
				|  |  | +    //   console.log("checkApprove value",value);
 | 
	
		
			
				|  |  | +    //   console.log("checkApprove callback",callback);
 | 
	
		
			
				|  |  | +    // },
 | 
	
		
			
				|  |  | +    async show(id, signImg,other = {}) {
 | 
	
		
			
				|  |  | +      if (id) {
 | 
	
		
			
				|  |  | +        this.title = "出入事项审批";
 | 
	
		
			
				|  |  | +        this.isShow = true;
 | 
	
		
			
				|  |  | +        getOutInRequest(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.formData.approveStatus = "1";
 | 
	
		
			
				|  |  | +          this.formData.approveSignImg = signImg;
 | 
	
		
			
				|  |  | +          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();
 | 
	
		
			
				|  |  | +      this.$refs["upload"].clearFiles();
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    submitForm() {
 | 
	
		
			
				|  |  | +      this.$refs["form"].validate((valid) => {
 | 
	
		
			
				|  |  | +        if (valid) {
 | 
	
		
			
				|  |  | +          let  {approveRemark,approveStatus,id,approveSignImg} = this.formData;
 | 
	
		
			
				|  |  | +          let tempRquest={approveRemark,approveStatus,id:id,approveSignImg};
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +          approveOutInRequest(tempRquest).then((response) => {
 | 
	
		
			
				|  |  | +              this.$modal.msgSuccess("提交成功");
 | 
	
		
			
				|  |  | +              this.isShow = false;
 | 
	
		
			
				|  |  | +              this.formData = this.reset();
 | 
	
		
			
				|  |  | +              this.$emit("success", this.formData);
 | 
	
		
			
				|  |  | +            });
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      });
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +  },
 | 
	
		
			
				|  |  | +  mounted() {},
 | 
	
		
			
				|  |  | +};
 | 
	
		
			
				|  |  | +</script>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +
 |