|
@@ -1,153 +1,181 @@
|
|
|
<template>
|
|
|
- <j-modal
|
|
|
- :title="title"
|
|
|
- :width="800"
|
|
|
- :visible="visible"
|
|
|
- :confirmLoading="confirmLoading"
|
|
|
- switchFullscreen
|
|
|
- @ok="handleOk"
|
|
|
- @cancel="handleCancel"
|
|
|
- cancelText="关闭">
|
|
|
-
|
|
|
+ <j-modal :title="title" :width="800" :visible="visible" :confirmLoading="confirmLoading" switchFullscreen
|
|
|
+ @ok="handleOk" @cancel="handleCancel" cancelText="关闭">
|
|
|
+
|
|
|
<a-spin :spinning="confirmLoading">
|
|
|
<a-form :form="form">
|
|
|
-
|
|
|
- <a-form-item
|
|
|
- :labelCol="labelCol"
|
|
|
- :wrapperCol="wrapperCol"
|
|
|
- label="员工姓名">
|
|
|
- <j-select-user-by-dep v-decorator="['userId', validatorRules.realname]"/>
|
|
|
-
|
|
|
- </a-form-item>
|
|
|
- <a-form-item
|
|
|
- :labelCol="labelCol"
|
|
|
- :wrapperCol="wrapperCol"
|
|
|
- label="部门名称">
|
|
|
- <a-input :disabled="true" placeholder="请输入部门名称" v-decorator="['deptNames', validatorRules.deptname ]" />
|
|
|
- </a-form-item>
|
|
|
- <a-form-item
|
|
|
- <a-form-item
|
|
|
- :labelCol="labelCol"
|
|
|
- :wrapperCol="wrapperCol"
|
|
|
- label="合同类型">
|
|
|
- <j-dict-select-tag v-decorator="['contractType', validatorRules.type]" :triggerChange="true" placeholder="请选择合同类型"
|
|
|
- dictCode="contract_type" />
|
|
|
-
|
|
|
+
|
|
|
+ <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="员工姓名">
|
|
|
+ <j-select-user-by-dep v-decorator="['userId', validatorRules.realname]" />
|
|
|
+
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="部门名称">
|
|
|
+ <a-input :disabled="true" placeholder="请输入部门名称" v-decorator="['deptNames', validatorRules.deptname ]" />
|
|
|
</a-form-item>
|
|
|
- <a-form-item
|
|
|
- :labelCol="labelCol"
|
|
|
- :wrapperCol="wrapperCol"
|
|
|
- label="开始时间">
|
|
|
- <a-date-picker showTime format='YYYY-MM-DD' v-decorator="[ 'startDate', validatorRules.startDate]" />
|
|
|
+ <a-form-item <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="合同类型">
|
|
|
+ <j-dict-select-tag v-decorator="['contractType', validatorRules.type]" :triggerChange="true"
|
|
|
+ placeholder="请选择合同类型" dictCode="contract_type" />
|
|
|
+
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="开始时间">
|
|
|
+ <a-date-picker format='YYYY-MM-DD' v-decorator="[ 'startDate', validatorRules.startDate]" />
|
|
|
</a-form-item>
|
|
|
- <a-form-item
|
|
|
- :labelCol="labelCol"
|
|
|
- :wrapperCol="wrapperCol"
|
|
|
- label="结束时间">
|
|
|
- <a-date-picker showTime format='YYYY-MM-DD' v-decorator="[ 'endDate', validatorRules.endDate]" />
|
|
|
+
|
|
|
+ <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="结束时间">
|
|
|
+ <a-date-picker :disabled-date="disabledDate" format='YYYY-MM-DD'
|
|
|
+ v-decorator="[ 'endDate', validatorRules.endDate]" />
|
|
|
</a-form-item>
|
|
|
-
|
|
|
+
|
|
|
</a-form>
|
|
|
</a-spin>
|
|
|
</j-modal>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { httpAction,getAction } from '@/api/manage'
|
|
|
+ import {
|
|
|
+ httpAction,
|
|
|
+ getAction
|
|
|
+ } from '@/api/manage'
|
|
|
import pick from 'lodash.pick'
|
|
|
import moment from "moment"
|
|
|
-import JSelectMultiUser from '@/components/jeecgbiz/JSelectMultiUser'
|
|
|
-import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
|
|
|
+ import JSelectMultiUser from '@/components/jeecgbiz/JSelectMultiUser'
|
|
|
+ import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
|
|
|
export default {
|
|
|
name: "UserContractModal",
|
|
|
- components: {JSelectMultiUser,JSelectUserByDep},
|
|
|
- data () {
|
|
|
+ components: {
|
|
|
+ JSelectMultiUser,
|
|
|
+ JSelectUserByDep
|
|
|
+ },
|
|
|
+ data() {
|
|
|
return {
|
|
|
- title:"操作",
|
|
|
+ title: "操作",
|
|
|
visible: false,
|
|
|
model: {},
|
|
|
- userid:"",
|
|
|
- deptid:"",
|
|
|
+ userid: "",
|
|
|
+ deptid: "",
|
|
|
labelCol: {
|
|
|
- xs: { span: 24 },
|
|
|
- sm: { span: 5 },
|
|
|
+ xs: {
|
|
|
+ span: 24
|
|
|
+ },
|
|
|
+ sm: {
|
|
|
+ span: 5
|
|
|
+ },
|
|
|
},
|
|
|
wrapperCol: {
|
|
|
- xs: { span: 24 },
|
|
|
- sm: { span: 16 },
|
|
|
+ xs: {
|
|
|
+ span: 24
|
|
|
+ },
|
|
|
+ sm: {
|
|
|
+ span: 16
|
|
|
+ },
|
|
|
},
|
|
|
|
|
|
confirmLoading: false,
|
|
|
form: this.$form.createForm(this),
|
|
|
- validatorRules:{
|
|
|
- realname:{rules: [{ required: true, message: '请输入员工名称!' },{
|
|
|
- validator: this.validateRealname
|
|
|
- }]},
|
|
|
- deptname:{rules: [{ required: true, message: '请输入部门名称!' },
|
|
|
- ]},
|
|
|
- type:{rules: [{ required: true, message: '请选择合同类型' }]},
|
|
|
- startDate:{rules: [{ required: true, message: '请选择合同开始日期' }]},
|
|
|
- endDate:{rules: [{ required: true, message: '请选择合同结束日期' }]},
|
|
|
+ validatorRules: {
|
|
|
+ realname: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入员工名称!'
|
|
|
+ }, {
|
|
|
+ validator: this.validateRealname
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ deptname: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ message: '请输入部门名称!'
|
|
|
+ }, ]
|
|
|
+ },
|
|
|
+ type: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ message: '请选择合同类型'
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ startDate: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ message: '请选择合同开始日期'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ validator: this.validatestartDate
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ endDate: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ message: '请选择合同结束日期'
|
|
|
+ }]
|
|
|
+ },
|
|
|
},
|
|
|
url: {
|
|
|
add: "/usercontract/userContract/add",
|
|
|
edit: "/usercontract/userContract/edit",
|
|
|
- dept:"/sys/user/queryUsersByusername"
|
|
|
+ dept: "/sys/user/queryUsersByusername"
|
|
|
},
|
|
|
}
|
|
|
},
|
|
|
- created () {
|
|
|
- },
|
|
|
+ created() {},
|
|
|
methods: {
|
|
|
- add () {
|
|
|
+ disabledDate(current) {
|
|
|
+ var startDate= this.form.getFieldValue('startDate');
|
|
|
+ return current && current < moment(startDate).endOf('day');
|
|
|
+ },
|
|
|
+ add() {
|
|
|
this.edit({});
|
|
|
},
|
|
|
- edit (record) {
|
|
|
+ edit(record) {
|
|
|
this.form.resetFields();
|
|
|
this.model = Object.assign({}, record);
|
|
|
this.visible = true;
|
|
|
- this.deptid=record.deptId;
|
|
|
+ this.deptid = record.deptId;
|
|
|
this.$nextTick(() => {
|
|
|
- this.form.setFieldsValue(pick(this.model,'userId','contractType','deptNames'))
|
|
|
- //时间格式化
|
|
|
- this.form.setFieldsValue({startDate:this.model.startDate?moment(this.model.startDate):null})
|
|
|
- this.form.setFieldsValue({endDate:this.model.endDate?moment(this.model.endDate):null})
|
|
|
+ this.form.setFieldsValue(pick(this.model, 'userId', 'contractType', 'deptNames'))
|
|
|
+ //时间格式化
|
|
|
+ this.form.setFieldsValue({
|
|
|
+ startDate: this.model.startDate ? moment(this.model.startDate) : null
|
|
|
+ })
|
|
|
+ this.form.setFieldsValue({
|
|
|
+ endDate: this.model.endDate ? moment(this.model.endDate) : null
|
|
|
+ })
|
|
|
});
|
|
|
|
|
|
},
|
|
|
- close () {
|
|
|
+ close() {
|
|
|
this.$emit('close');
|
|
|
this.visible = false;
|
|
|
},
|
|
|
- handleOk () {
|
|
|
+ handleOk() {
|
|
|
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;
|
|
|
+ if (!this.model.id) {
|
|
|
+ httpurl += this.url.add;
|
|
|
method = 'post';
|
|
|
- }else{
|
|
|
- httpurl+=this.url.edit;
|
|
|
- method = 'put';
|
|
|
+ } else {
|
|
|
+ httpurl += this.url.edit;
|
|
|
+ method = 'put';
|
|
|
}
|
|
|
let formData = Object.assign(this.model, values);
|
|
|
-
|
|
|
- formData.deptId=this.deptid;
|
|
|
+
|
|
|
+ formData.deptId = this.deptid;
|
|
|
//时间格式化
|
|
|
- formData.startDate = formData.startDate?formData.startDate.format('YYYY-MM-DD HH:mm:ss'):null;
|
|
|
- formData.endDate = formData.endDate?formData.endDate.format('YYYY-MM-DD HH:mm:ss'):null;
|
|
|
-
|
|
|
+ formData.startDate = formData.startDate ? formData.startDate.format('YYYY-MM-DD HH:mm:ss') : null;
|
|
|
+ formData.endDate = formData.endDate ? formData.endDate.format('YYYY-MM-DD HH:mm:ss') : null;
|
|
|
+
|
|
|
console.log(formData)
|
|
|
- httpAction(httpurl,formData,method).then((res)=>{
|
|
|
- if(res.success){
|
|
|
+ httpAction(httpurl, formData, method).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
that.$message.success(res.message);
|
|
|
that.$emit('ok');
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
that.$message.warning(res.message);
|
|
|
}
|
|
|
}).finally(() => {
|
|
@@ -160,52 +188,60 @@ import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- handleCancel () {
|
|
|
+ handleCancel() {
|
|
|
this.close()
|
|
|
},
|
|
|
+ validatestartDate(rule, value, callback) {
|
|
|
+ if (!value) {
|
|
|
+ callback()
|
|
|
+ } else {
|
|
|
+ callback()
|
|
|
+ this.form.setFieldsValue({
|
|
|
+ endDate:null
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
validateRealname(rule, value, callback) {
|
|
|
if (!value) {
|
|
|
callback()
|
|
|
- this.deptid="";
|
|
|
+ this.deptid = "";
|
|
|
this.form.setFieldsValue({
|
|
|
- deptNames:""
|
|
|
+ deptNames: ""
|
|
|
})
|
|
|
} else {
|
|
|
this.queryDeptName(value);
|
|
|
callback()
|
|
|
}
|
|
|
},
|
|
|
- queryDeptName(e){
|
|
|
- getAction(this.url.dept,{id:e}).then((res)=>{
|
|
|
- if(res.success){
|
|
|
- if(res.result.length>0){
|
|
|
- var list=res.result;
|
|
|
- var deptids=[];
|
|
|
- var deptname=[];
|
|
|
- for(var i=0;i<list.length;i++){
|
|
|
+ queryDeptName(e) {
|
|
|
+ getAction(this.url.dept, {
|
|
|
+ id: e
|
|
|
+ }).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ if (res.result.length > 0) {
|
|
|
+ var list = res.result;
|
|
|
+ var deptids = [];
|
|
|
+ var deptname = [];
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
deptids.push(list[i].deptid);
|
|
|
deptname.push(list[i].deptname);
|
|
|
}
|
|
|
- this.deptid=deptids.join(",");
|
|
|
+ this.deptid = deptids.join(",");
|
|
|
this.form.setFieldsValue({
|
|
|
- deptNames:deptname.join(",")
|
|
|
+ deptNames: deptname.join(",")
|
|
|
})
|
|
|
- }else{
|
|
|
- this.deptid="";
|
|
|
+ } else {
|
|
|
+ this.deptid = "";
|
|
|
this.form.setFieldsValue({
|
|
|
- deptNames:""
|
|
|
+ deptNames: ""
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
}
|
|
|
- }).finally(() => {
|
|
|
- this.form.setFieldsValue({
|
|
|
- userId:e
|
|
|
- })
|
|
|
})
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
|
|
|
}
|
|
|
}
|
|
@@ -213,4 +249,4 @@ import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
|
|
|
-</style>
|
|
|
+</style>
|