|  | @@ -0,0 +1,317 @@
 | 
	
		
			
				|  |  | +<template>
 | 
	
		
			
				|  |  | +  <a-modal
 | 
	
		
			
				|  |  | +    :title="title"
 | 
	
		
			
				|  |  | +    :width="width"
 | 
	
		
			
				|  |  | +    :visible="visible"
 | 
	
		
			
				|  |  | +    :confirmLoading="confirmLoading"
 | 
	
		
			
				|  |  | +    @ok="handleOk"
 | 
	
		
			
				|  |  | +    @cancel="handleCancel"
 | 
	
		
			
				|  |  | +    cancelText="关闭">
 | 
	
		
			
				|  |  | +    <a-spin :spinning="confirmLoading">
 | 
	
		
			
				|  |  | +      <a-form :form="form">
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +        <a-form-item label="会议名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-input v-decorator="[ 'name', validatorRules.name]" placeholder="请输入会议名称"></a-input>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="开始日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <j-date placeholder="请选择开始日期" :getCalendarContainer="node => node.parentNode" dateFormat="YYYY-MM-DD HH:mm" show-time v-decorator="[ 'startTime', validatorRules.startTime]" style="width: 100%"/>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="结束日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <j-date placeholder="请选择结束日期" :getCalendarContainer="node => node.parentNode" dateFormat="YYYY-MM-DD HH:mm" show-time v-decorator="[ 'endTime', validatorRules.endTime]" style="width: 100%"/>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="会议地点" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-select placeholder="请选择" v-decorator="[ 'roomId', validatorRules.roomId]">
 | 
	
		
			
				|  |  | +            <!-- <a-select-option :value="undefined">请选择</a-select-option> -->
 | 
	
		
			
				|  |  | +            <a-select-option
 | 
	
		
			
				|  |  | +              v-for="(item,index) in rooms"
 | 
	
		
			
				|  |  | +              :key="index"
 | 
	
		
			
				|  |  | +              :value="item.id">
 | 
	
		
			
				|  |  | +              {{ item.name }}
 | 
	
		
			
				|  |  | +            </a-select-option>
 | 
	
		
			
				|  |  | +          </a-select>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="主持人" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-select
 | 
	
		
			
				|  |  | +                placeholder="请选择主持人"
 | 
	
		
			
				|  |  | +                v-model="selectedHost"
 | 
	
		
			
				|  |  | +                @dropdownVisibleChange="selectHost"
 | 
	
		
			
				|  |  | +              >
 | 
	
		
			
				|  |  | +              </a-select>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="记录人" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-select
 | 
	
		
			
				|  |  | +                placeholder="请选择记录人"
 | 
	
		
			
				|  |  | +                v-model="selectedRecorder"
 | 
	
		
			
				|  |  | +                @dropdownVisibleChange="selectRecorder"
 | 
	
		
			
				|  |  | +              >
 | 
	
		
			
				|  |  | +              </a-select>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="博馆参会人" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-select
 | 
	
		
			
				|  |  | +                mode="multiple"
 | 
	
		
			
				|  |  | +                placeholder="请选择博馆参会人"
 | 
	
		
			
				|  |  | +                v-model="selectedParticipant"
 | 
	
		
			
				|  |  | +                @dropdownVisibleChange="selectParticipant"
 | 
	
		
			
				|  |  | +              >
 | 
	
		
			
				|  |  | +              </a-select>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="其他参会人" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-input v-decorator="[ 'others', validatorRules.others]" placeholder="请输入其他参会人"></a-input>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        <a-form-item label="会议议程" :labelCol="labelCol" :wrapperCol="wrapperCol">
 | 
	
		
			
				|  |  | +          <a-input v-decorator="[ 'schedule', validatorRules.schedule]" placeholder="请输入会议议程"></a-input>
 | 
	
		
			
				|  |  | +        </a-form-item>
 | 
	
		
			
				|  |  | +        
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +        <user-select-modal ref="HostSelectModal" @choseUser="chooseHost" selectionType="radio"></user-select-modal>
 | 
	
		
			
				|  |  | +        <user-select-modal ref="RecorderSelectModal" @choseUser="chooseRecorder" selectionType="radio"></user-select-modal>
 | 
	
		
			
				|  |  | +        <user-select-modal ref="ParticipantSelectModal" @choseUser="chooseParticipant"></user-select-modal>
 | 
	
		
			
				|  |  | +      </a-form>
 | 
	
		
			
				|  |  | +    </a-spin>
 | 
	
		
			
				|  |  | +  </a-modal>
 | 
	
		
			
				|  |  | +</template>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +<script>
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +  import { httpAction, getAction } from '@/api/manage'
 | 
	
		
			
				|  |  | +  import pick from 'lodash.pick'
 | 
	
		
			
				|  |  | +  import { validateDuplicateValue } from '@/utils/util'
 | 
	
		
			
				|  |  | +  import JDate from '@/components/jeecg/JDate'  
 | 
	
		
			
				|  |  | +  import moment from 'moment'
 | 
	
		
			
				|  |  | +  import UserSelectModal from '../componet/UserSelectModal'
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +  export default {
 | 
	
		
			
				|  |  | +    name: "MeetingApplyModal",
 | 
	
		
			
				|  |  | +    components: { 
 | 
	
		
			
				|  |  | +      JDate,
 | 
	
		
			
				|  |  | +      UserSelectModal,
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    data () {
 | 
	
		
			
				|  |  | +      return {
 | 
	
		
			
				|  |  | +        form: this.$form.createForm(this),
 | 
	
		
			
				|  |  | +        title:"操作",
 | 
	
		
			
				|  |  | +        width:800,
 | 
	
		
			
				|  |  | +        visible: false,
 | 
	
		
			
				|  |  | +        model: {
 | 
	
		
			
				|  |  | +          host:'',
 | 
	
		
			
				|  |  | +          recorder:'',
 | 
	
		
			
				|  |  | +          participant:'',
 | 
	
		
			
				|  |  | +          hostId:'',
 | 
	
		
			
				|  |  | +          recorderId:'',
 | 
	
		
			
				|  |  | +          participantIds:'',
 | 
	
		
			
				|  |  | +          roomId:''
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        labelCol: {
 | 
	
		
			
				|  |  | +          xs: { span: 24 },
 | 
	
		
			
				|  |  | +          sm: { span: 5 },
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        wrapperCol: {
 | 
	
		
			
				|  |  | +          xs: { span: 24 },
 | 
	
		
			
				|  |  | +          sm: { span: 16 },
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        confirmLoading: false,
 | 
	
		
			
				|  |  | +        validatorRules: {
 | 
	
		
			
				|  |  | +          name: {rules: [
 | 
	
		
			
				|  |  | +            { required: true, message: '请输入名称!' }
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          startTime: {rules: [
 | 
	
		
			
				|  |  | +            { required: true, message: '请选择开始时间!' },
 | 
	
		
			
				|  |  | +            { validator: this.startTimeValidate }
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          endTime: {rules: [
 | 
	
		
			
				|  |  | +            { required: true, message: '请选择结束时间!' },
 | 
	
		
			
				|  |  | +            { validator: this.endTimeValidate }
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          place: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          host: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          recorder: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          participant: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          others: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          schedule: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          roomId: {rules: [
 | 
	
		
			
				|  |  | +            { required: true, message: '请选择会议地点!' }
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          hostId: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          recorderId: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +          participantIds: {rules: [
 | 
	
		
			
				|  |  | +          ]},
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        url: {
 | 
	
		
			
				|  |  | +          add: "/oa/meetingApply/add",
 | 
	
		
			
				|  |  | +          edit: "/oa/meetingApply/edit",
 | 
	
		
			
				|  |  | +          all: "/oa/meetingRoom/all",
 | 
	
		
			
				|  |  | +        },
 | 
	
		
			
				|  |  | +        rooms: [],
 | 
	
		
			
				|  |  | +        selectedHostIds: [],
 | 
	
		
			
				|  |  | +        selectedHost: [],
 | 
	
		
			
				|  |  | +        selectedRecorderIds: [],
 | 
	
		
			
				|  |  | +        selectedRecorder: [],
 | 
	
		
			
				|  |  | +        selectedParticipantIds: [],
 | 
	
		
			
				|  |  | +        selectedParticipant: [],
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    mounted () {
 | 
	
		
			
				|  |  | +      this.initRooms()
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    methods: {
 | 
	
		
			
				|  |  | +      add () {
 | 
	
		
			
				|  |  | +        this.edit({});
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      edit (record) {
 | 
	
		
			
				|  |  | +        this.form.resetFields();
 | 
	
		
			
				|  |  | +        this.model = Object.assign({}, record);
 | 
	
		
			
				|  |  | +        this.visible = true;
 | 
	
		
			
				|  |  | +        this.$nextTick(() => {
 | 
	
		
			
				|  |  | +          this.form.setFieldsValue(pick(this.model,'name','startTime','endTime','place','host','recorder','participant','others','schedule','accessory','roomId','hostId','recorderId','participantIds'))
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +        if(this.model!=undefined){
 | 
	
		
			
				|  |  | +          this.selectedHost = this.model.host==undefined||this.model.host.length==0?[]:this.model.host.split(",")
 | 
	
		
			
				|  |  | +          this.selectedHostIds = this.model.hostId==undefined||this.model.hostId.length==0?[]:this.model.hostId.split(",")
 | 
	
		
			
				|  |  | +          this.selectedRecorder = this.model.recorder==undefined||this.model.recorder.length==0?[]:this.model.recorder.split(",")
 | 
	
		
			
				|  |  | +          this.selectedRecorderIds = this.model.recorderId==undefined||this.model.recorderId.length==0?[]:this.model.recorderId.split(",")
 | 
	
		
			
				|  |  | +          this.selectedParticipantIds = this.model.participantIds==undefined||this.model.participantIds.length==0?[]:this.model.participantIds.split(",")
 | 
	
		
			
				|  |  | +          this.selectedParticipant = this.model.participant==undefined||this.model.participant.length==0?[]:this.model.participant.split(",")
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      close () {
 | 
	
		
			
				|  |  | +        this.$emit('close');
 | 
	
		
			
				|  |  | +        this.visible = false;
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      handleOk () {
 | 
	
		
			
				|  |  | +        console.log('start');
 | 
	
		
			
				|  |  | +        const that = this;
 | 
	
		
			
				|  |  | +        // 触发表单验证
 | 
	
		
			
				|  |  | +        this.form.validateFields((err, values) => {
 | 
	
		
			
				|  |  | +          if (!err) {
 | 
	
		
			
				|  |  | +            that.confirmLoading = true;
 | 
	
		
			
				|  |  | +            let httpurl = '';
 | 
	
		
			
				|  |  | +            let method = '';
 | 
	
		
			
				|  |  | +            if(!this.model.id){
 | 
	
		
			
				|  |  | +              httpurl+=this.url.add;
 | 
	
		
			
				|  |  | +              method = 'post';
 | 
	
		
			
				|  |  | +            }else{
 | 
	
		
			
				|  |  | +              httpurl+=this.url.edit;
 | 
	
		
			
				|  |  | +               method = 'put';
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +            let formData = Object.assign(that.model, values);
 | 
	
		
			
				|  |  | +            formData.hostId = that.selectedHostIds.join(',')
 | 
	
		
			
				|  |  | +            formData.host = that.selectedHost.join(',')
 | 
	
		
			
				|  |  | +            formData.recorderId = that.selectedRecorderIds.join(',')
 | 
	
		
			
				|  |  | +            formData.recorder = that.selectedRecorder.join(',')
 | 
	
		
			
				|  |  | +            formData.participantIds = that.selectedParticipantIds.join(',')
 | 
	
		
			
				|  |  | +            formData.participant = that.selectedParticipant.join(',')
 | 
	
		
			
				|  |  | +            console.log("表单提交数据",formData)
 | 
	
		
			
				|  |  | +            httpAction(httpurl,formData,method).then((res)=>{
 | 
	
		
			
				|  |  | +              if(res.success){
 | 
	
		
			
				|  |  | +                that.$message.success(res.message);
 | 
	
		
			
				|  |  | +                that.$emit('ok');
 | 
	
		
			
				|  |  | +                that.close();
 | 
	
		
			
				|  |  | +              }else{
 | 
	
		
			
				|  |  | +                that.$message.warning(res.message);
 | 
	
		
			
				|  |  | +              }
 | 
	
		
			
				|  |  | +            }).finally(() => {
 | 
	
		
			
				|  |  | +              that.confirmLoading = false;
 | 
	
		
			
				|  |  | +            })
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +         
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      handleCancel () {
 | 
	
		
			
				|  |  | +        this.close()
 | 
	
		
			
				|  |  | +        this.resetUser()
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      resetUser () {
 | 
	
		
			
				|  |  | +        this.selectedHost = []
 | 
	
		
			
				|  |  | +        this.selectedHostIds = []
 | 
	
		
			
				|  |  | +        this.selectedRecorder = []
 | 
	
		
			
				|  |  | +        this.selectedRecorderIds = []
 | 
	
		
			
				|  |  | +        this.selectedParticipantIds = []
 | 
	
		
			
				|  |  | +        this.selectedParticipant = []
 | 
	
		
			
				|  |  | +        this.$refs.HostSelectModal.edit(null, null)
 | 
	
		
			
				|  |  | +        this.$refs.RecorderSelectModal.edit(null, null)
 | 
	
		
			
				|  |  | +        this.$refs.ParticipantSelectModal.edit(null, null)
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      popupCallback(row){
 | 
	
		
			
				|  |  | +        this.form.setFieldsValue(pick(row,'name','startTime','endTime','place','host','recorder','participant','others','schedule','accessory','roomId','hostId','recorderId','participantIds'))
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      initRooms(){
 | 
	
		
			
				|  |  | +        getAction(this.url.all).then((res)=>{
 | 
	
		
			
				|  |  | +          if(res.success){
 | 
	
		
			
				|  |  | +            this.rooms = res.result
 | 
	
		
			
				|  |  | +          }else {
 | 
	
		
			
				|  |  | +            this.$message.warning(res.message)
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +        })
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      selectHost () {
 | 
	
		
			
				|  |  | +        this.$refs.HostSelectModal.add(this.selectedHost, this.selectedHostIds)
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      // 子modal回调
 | 
	
		
			
				|  |  | +      chooseHost: function (userList) {
 | 
	
		
			
				|  |  | +        console.log(userList.length);
 | 
	
		
			
				|  |  | +          this.selectedHost = []
 | 
	
		
			
				|  |  | +          this.selectedHostIds = []
 | 
	
		
			
				|  |  | +          for (var i = 0; i < userList.length; i++) {
 | 
	
		
			
				|  |  | +              this.selectedHost.push(userList[i].realname)
 | 
	
		
			
				|  |  | +              this.selectedHostIds.push(userList[i].id)
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      selectRecorder () {
 | 
	
		
			
				|  |  | +        this.$refs.RecorderSelectModal.add(this.selectedRecorder, this.selectedRecorderIds)
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      // 子modal回调
 | 
	
		
			
				|  |  | +      chooseRecorder: function (userList) {
 | 
	
		
			
				|  |  | +        console.log(userList.length);
 | 
	
		
			
				|  |  | +          this.selectedRecorder = []
 | 
	
		
			
				|  |  | +          this.selectedRecorderIds = []
 | 
	
		
			
				|  |  | +          for (var i = 0; i < userList.length; i++) {
 | 
	
		
			
				|  |  | +              this.selectedRecorder.push(userList[i].realname)
 | 
	
		
			
				|  |  | +              this.selectedRecorderIds.push(userList[i].id)
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      selectParticipant () {
 | 
	
		
			
				|  |  | +        this.$refs.ParticipantSelectModal.add(this.selectedParticipant, this.selectedParticipantIds)
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      // 子modal回调
 | 
	
		
			
				|  |  | +      chooseParticipant: function (userList) {
 | 
	
		
			
				|  |  | +        console.log(userList.length);
 | 
	
		
			
				|  |  | +          this.selectedParticipant = []
 | 
	
		
			
				|  |  | +          this.selectedParticipantIds = []
 | 
	
		
			
				|  |  | +          for (var i = 0; i < userList.length; i++) {
 | 
	
		
			
				|  |  | +              this.selectedParticipant.push(userList[i].realname)
 | 
	
		
			
				|  |  | +              this.selectedParticipantIds.push(userList[i].id)
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      startTimeValidate (rule, value, callback) {
 | 
	
		
			
				|  |  | +          let endTime = this.form.getFieldValue('endTime')
 | 
	
		
			
				|  |  | +          if (!value || !endTime) {
 | 
	
		
			
				|  |  | +              callback()
 | 
	
		
			
				|  |  | +          } else if (moment(value).isBefore(endTime)) {
 | 
	
		
			
				|  |  | +              callback()
 | 
	
		
			
				|  |  | +          } else {
 | 
	
		
			
				|  |  | +              callback('开始时间需小于结束时间')
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      endTimeValidate (rule, value, callback) {
 | 
	
		
			
				|  |  | +          let startTime = this.form.getFieldValue('startTime')
 | 
	
		
			
				|  |  | +          if (!value || !startTime) {
 | 
	
		
			
				|  |  | +              callback()
 | 
	
		
			
				|  |  | +          } else if (moment(startTime).isBefore(value)) {
 | 
	
		
			
				|  |  | +              callback()
 | 
	
		
			
				|  |  | +          } else {
 | 
	
		
			
				|  |  | +              callback('结束时间需大于开始时间')
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +      
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +  }
 | 
	
		
			
				|  |  | +</script>
 |