281 lines
8.9 KiB
HTML
281 lines
8.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>外来人员登记</title>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
|
|
<link rel="stylesheet" type="text/css" href="../../assets/css/vant.css" />
|
|
<script src="../../assets/js/axios.min.js"></script>
|
|
<script src="../../assets/js/moment.js"></script>
|
|
<!-- vue -->
|
|
<script src="../../../bi/js/vue.js"></script>
|
|
<!--全局配置-->
|
|
<script src="../../../config.js"></script>
|
|
<script src="../../assets/js/vant.min.js"></script>
|
|
<script type="text/javascript" src="../../../bi/js/jquery-3.7.1.min.js"></script>
|
|
<style>
|
|
.wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app" style="padding: 50px 20px 0 20px;">
|
|
<van-form @submit="save" validate-trigger="onSubmit" colon label-width="90px">
|
|
<van-field
|
|
required
|
|
v-model="form.SOURCE_UNIT"
|
|
label="来源单位"
|
|
placeholder="请输入来源单位"
|
|
:rules="[{ required: true, message: '请输入来源单位' }]"
|
|
></van-field>
|
|
<van-field
|
|
required
|
|
v-model="form.ADMISSION_NUMBER"
|
|
type="digit"
|
|
label="入场人数"
|
|
placeholder="请输入入场人数"
|
|
:rules="[{ required: true, message: '请输入入场人数' }]"
|
|
></van-field>
|
|
<van-field
|
|
required
|
|
v-model="form.NAME"
|
|
label="姓名"
|
|
placeholder="请输入姓名"
|
|
:rules="[{ required: true, message: '请输入姓名' }]"
|
|
></van-field>
|
|
<van-field
|
|
required
|
|
v-model="form.PHONO_NUMBER"
|
|
type="digit"
|
|
label="手机号"
|
|
placeholder="请输入手机号"
|
|
maxlength="11"
|
|
:rules="[{ required: true, message: '请输入手机号' },
|
|
{ min: 11, max: 11, message: '请输入11位手机号码' },
|
|
{
|
|
pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
|
|
message: '请输入正确的手机号码'
|
|
}]"
|
|
></van-field>
|
|
<div style="margin: 16px;">
|
|
<van-button round block type="primary" size="small" native-type="button" @click="addOther">添加</van-button>
|
|
</div>
|
|
<div v-for="(item,index) in form.other" :key="item.id">
|
|
<van-field
|
|
required
|
|
v-model="item.NAME"
|
|
label="姓名"
|
|
placeholder="请输入姓名"
|
|
:rules="[{ required: true, message: '请输入姓名' }]"
|
|
></van-field>
|
|
<van-field
|
|
required
|
|
v-model="item.PHONO_NUMBER"
|
|
type="digit"
|
|
label="手机号"
|
|
placeholder="请输入手机号"
|
|
maxlength="11"
|
|
:rules="[{ required: true, message: '请输入手机号' },
|
|
{ min: 11, max: 11, message: '请输入11位手机号码' },
|
|
{
|
|
pattern: /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/,
|
|
message: '请输入正确的手机号码'
|
|
}]"
|
|
></van-field>
|
|
<div style="margin: 16px;">
|
|
<van-button round block type="danger" size="small" native-type="button" @click="removeOther(index)">删除</van-button>
|
|
</div>
|
|
</div>
|
|
<van-field
|
|
required
|
|
v-model="form.SUBJECT_MATTER"
|
|
label="入场事由"
|
|
placeholder="请输入入场事由"
|
|
:rules="[{ required: true, message: '请输入入场事由' }]"
|
|
></van-field>
|
|
<van-field
|
|
required
|
|
readonly
|
|
clickable
|
|
:value="form.STARTTIME"
|
|
label="开始申请用时"
|
|
placeholder="点击选择开始申请用时"
|
|
@click="startTimeShowPicker = true"
|
|
:rules="[{ required: true, message: '请选择开始申请用时' }]"
|
|
></van-field>
|
|
<van-popup v-model="startTimeShowPicker" position="bottom">
|
|
<van-datetime-picker
|
|
:min-date="new Date()"
|
|
@confirm="startTimeConfirm"
|
|
@cancel="startTimeShowPicker = false"
|
|
></van-datetime-picker>
|
|
</van-popup>
|
|
<van-field
|
|
required
|
|
readonly
|
|
clickable
|
|
:value="form.ENDTIME"
|
|
label="结束申请用时"
|
|
placeholder="点击选择结束申请用时"
|
|
@click="endTimeShowPicker = true"
|
|
:rules="[{ required: true, message: '请选择结束申请用时' }]"
|
|
></van-field>
|
|
<van-popup v-model="endTimeShowPicker" position="bottom">
|
|
<van-datetime-picker
|
|
:min-date="new Date()"
|
|
@confirm="endTimeConfirm"
|
|
@cancel="endTimeShowPicker = false"
|
|
></van-datetime-picker>
|
|
</van-popup>
|
|
<van-field
|
|
required
|
|
readonly
|
|
clickable
|
|
:value="form.EXAMINE_DEPARTMENT_NAME"
|
|
label="审核部门"
|
|
placeholder="点击选择审核部门"
|
|
@click="departmentShowPicker = true"
|
|
:rules="[{ required: true, message: '请选择审核部门' }]"
|
|
></van-field>
|
|
<van-popup v-model="departmentShowPicker" position="bottom">
|
|
<van-picker
|
|
value-key="NAME"
|
|
show-toolbar
|
|
:columns="examineDeptList"
|
|
@confirm="departmentConfirm"
|
|
@cancel="departmentShowPicker = false"
|
|
></van-picker>
|
|
</van-popup>
|
|
<div style="margin: 16px;">
|
|
<van-button round block type="info" native-type="submit">提交</van-button>
|
|
</div>
|
|
</van-form>
|
|
<van-overlay :show="loading">
|
|
<div class="wrapper">
|
|
<van-loading color="#0094ff" size="24px" vertical>数据提交中...</van-loading>
|
|
</div>
|
|
</van-overlay>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
var vm = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
CORPINFO_ID: "",
|
|
loading: false,
|
|
examineDeptList: [],
|
|
form: {
|
|
APPLICATION_TIME: '',
|
|
SOURCE_UNIT: '',
|
|
ADMISSION_NUMBER: '',
|
|
NAME: '',
|
|
PHONO_NUMBER: '',
|
|
SUBJECT_MATTER: '',
|
|
EXAMINE_DEPARTMENT_ID: '',
|
|
EXAMINE_DEPARTMENT_NAME: '',
|
|
other: [], // 其他验收人员
|
|
STARTTIME: '',
|
|
ENDTIME: ''
|
|
},
|
|
startTimeShowPicker:false,
|
|
endTimeShowPicker:false,
|
|
departmentShowPicker:false,
|
|
},
|
|
created() {
|
|
this.init();
|
|
this.getDeptList()
|
|
},
|
|
methods: {
|
|
//初始执行
|
|
init() {
|
|
this.CORPINFO_ID = this.getUrlKey('CORPINFO_ID');
|
|
},
|
|
// 保存
|
|
save() {
|
|
if(moment(this.form.STARTTIME).valueOf() > moment(this.form.ENDTIME).valueOf()){
|
|
this.$toast.fail('结束用时不能晚于开始用时');
|
|
return false
|
|
}
|
|
if (moment(this.form.STARTTIME).diff(moment(this.form.ENDTIME), 'minute') < -1440) {
|
|
this.$toast.fail('申请用时不能超过24小时');
|
|
return false
|
|
}
|
|
this.loading = true
|
|
$.ajax({
|
|
xhrFields: {
|
|
withCredentials: true
|
|
},
|
|
type: 'POST',
|
|
url: config.httpurl + 'outsiders/scanadd',
|
|
dataType: 'json',
|
|
data: {
|
|
SOURCE_UNIT: this.form.SOURCE_UNIT,
|
|
ADMISSION_NUMBER: this.form.ADMISSION_NUMBER,
|
|
NAME: this.form.NAME,
|
|
PHONO_NUMBER: this.form.PHONO_NUMBER,
|
|
OTHER: JSON.stringify(this.form.other),
|
|
SUBJECT_MATTER: this.form.SUBJECT_MATTER,
|
|
APPLICATION_TIME: this.form.STARTTIME +','+this.form.ENDTIME,
|
|
STARTTIME: this.form.STARTTIME,
|
|
ENDTIME: this.form.ENDTIME,
|
|
EXAMINE_DEPARTMENT_ID:this.form.EXAMINE_DEPARTMENT_ID,
|
|
CORPINFO_ID: this.CORPINFO_ID
|
|
},
|
|
success: function(data) {
|
|
window.location.href = './success.html'
|
|
}
|
|
})
|
|
},
|
|
getDeptList() {
|
|
let data = new FormData();
|
|
data.append('FIELD_ITEM','IS_TO_EXAMINE');
|
|
data.append('CORPINFO_ID',this.CORPINFO_ID);
|
|
axios.post(config.httpurl+'/app/sys/listForDoor',data)
|
|
.then((data) => {
|
|
this.examineDeptList = data.data.list
|
|
console.info(data)
|
|
console.info(this.examineDeptList)
|
|
}).catch((e) => {
|
|
console.info(e)
|
|
})
|
|
},
|
|
//根据url参数名称获取参数值
|
|
getUrlKey: function (name) {
|
|
return decodeURIComponent(
|
|
(new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
|
|
},
|
|
// 动态--验收部门 添加
|
|
addOther() {
|
|
var o = { 'NAME': '', 'PHONO_NUMBER': '',id:Math.random() }
|
|
this.form.other.push(o)
|
|
},
|
|
// 动态--验收部门 删除
|
|
removeOther: function(index) {
|
|
this.form.other.splice(index, 1)
|
|
},
|
|
startTimeConfirm(e){
|
|
this.form.STARTTIME = moment(e).format('YYYY-MM-DD HH:mm')
|
|
this.startTimeShowPicker = false
|
|
},
|
|
endTimeConfirm(e){
|
|
this.form.ENDTIME = moment(e).format('YYYY-MM-DD HH:mm')
|
|
this.endTimeShowPicker = false
|
|
},
|
|
departmentConfirm(e){
|
|
this.form.EXAMINE_DEPARTMENT_ID = e.DEPARTMENT_ID
|
|
this.form.EXAMINE_DEPARTMENT_NAME = e.NAME
|
|
this.departmentShowPicker = false
|
|
}
|
|
},
|
|
mounted() {
|
|
this.init()
|
|
}
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|