You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
442 lines
11 KiB
442 lines
11 KiB
3 years ago
|
<template>
|
||
|
<div class="bg-caiji">
|
||
|
<div class="title">
|
||
|
员工登记
|
||
|
</div>
|
||
|
<div class="main">
|
||
|
|
||
|
<div class="div_tab">
|
||
|
<div :class="['div_option','option_left',{'option_select':selectTab=='1'}]"> 员工登记</div>
|
||
|
<div :class="['div_option','option_right',{'option_select':selectTab=='2'}]">受众群体登记</div>
|
||
|
</div>
|
||
|
|
||
|
<div class="content">
|
||
|
|
||
|
<mt-cell title="*企业名称">
|
||
|
|
||
|
<span style="margin-right:20px">{{shequName}}</span>
|
||
|
</mt-cell>
|
||
|
<div class="line"></div>
|
||
|
|
||
|
<mt-field class="my-field"
|
||
|
:disableClear="true"
|
||
|
:label="'*姓名'"
|
||
|
placeholder="请输入"
|
||
|
v-model="formData.name"></mt-field>
|
||
|
<div class="line"></div>
|
||
|
<mt-field class="my-field"
|
||
|
:disableClear="true"
|
||
|
:label="'*手机号'"
|
||
|
placeholder="请输入"
|
||
|
type="tel"
|
||
|
v-model="formData.mobile"></mt-field>
|
||
|
<div class="line"></div>
|
||
|
<mt-field class="my-field"
|
||
|
:disableClear="true"
|
||
|
:label="'*身份证'"
|
||
|
placeholder="请输入"
|
||
|
v-model="formData.idNum"></mt-field>
|
||
|
<div class="line"></div>
|
||
|
|
||
|
<div @click="handelSel('detNum')">
|
||
|
<mt-cell :title="'*参加核酸检测次数'"
|
||
|
is-link>
|
||
|
<span class="picker_content"
|
||
|
v-if="formData.detNum">{{formData.detNumName}}</span>
|
||
|
<span v-else>请选择</span>
|
||
|
</mt-cell>
|
||
|
</div>
|
||
|
<div class="line"></div>
|
||
|
<div @click="handelSelData()">
|
||
|
<mt-cell :title="'*最近一次核酸检测时间'"
|
||
|
is-link>
|
||
|
<span class="picker_content"
|
||
|
v-if="formData.detData">{{formData.detDataName}}</span>
|
||
|
<span v-else>请选择</span>
|
||
|
</mt-cell>
|
||
|
</div>
|
||
|
<div class="line"></div>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
</div>
|
||
|
|
||
|
<div class="div-btn">
|
||
|
<mt-button @click="handleSubmit"
|
||
|
type="primary"
|
||
|
class="btn"
|
||
|
:disabled="btnDisabled"
|
||
|
size="small">提交</mt-button>
|
||
|
</div>
|
||
|
|
||
|
<mt-popup v-model="popupVisible"
|
||
|
popup-transition="popup-fade"
|
||
|
closeOnClickModal="true"
|
||
|
position="bottom">
|
||
|
<mt-picker :slots="popupSlots"
|
||
|
value-key="label"
|
||
|
@change="onPickerChange"
|
||
|
showToolbar>
|
||
|
<div class="picker-toolbar-title">
|
||
|
<div class="usi-btn-cancel"
|
||
|
@click="popupVisible = !popupVisible">取消</div>
|
||
|
<div class="">请选择</div>
|
||
|
<div class="usi-btn-sure"
|
||
|
@click="popupOk()">确定</div>
|
||
|
</div>
|
||
|
</mt-picker>
|
||
|
</mt-popup>
|
||
|
<mt-datetime-picker v-model="pickerVisible"
|
||
|
ref="pickerData"
|
||
|
type="date"
|
||
|
year-format="{value} 年"
|
||
|
month-format="{value} 月"
|
||
|
date-format="{value} 日"
|
||
|
@confirm="handleConfirm">
|
||
|
</mt-datetime-picker>
|
||
|
</div>
|
||
|
</template>
|
||
|
<script>
|
||
|
|
||
|
|
||
|
import { requestPost } from "@/js/dai/request";
|
||
|
import { Toast } from "mint-ui";
|
||
|
import { MessageBox } from 'mint-ui';
|
||
|
import { Loading } from 'element-ui' // 引入Loading服务
|
||
|
import { messages } from '@/i18n'
|
||
|
|
||
|
let loading // 加载动画
|
||
|
export default {
|
||
|
data () {
|
||
|
return {
|
||
|
selectTab: '1',
|
||
|
pickerVisible: '',
|
||
|
startDate: new Date(),
|
||
|
|
||
|
formData: {
|
||
|
name: '',
|
||
|
idNum: '',
|
||
|
mobile: '',
|
||
|
detNum: null,
|
||
|
detNumName: '',
|
||
|
detData: '',
|
||
|
detDataName: ''
|
||
|
},
|
||
|
|
||
|
btnDisabled: false,
|
||
|
popupVisible: false,
|
||
|
|
||
|
//二维码带来数据
|
||
|
shequId: '',//社区id 6e511da6816e53af4cda952365a26eb9 德兴路 1202807601961984002
|
||
|
shequName: '',//社区名称
|
||
|
customerId: '',//客户id 45687aa479955f9d06204d415238f7cc
|
||
|
|
||
|
selType: 'community',//弹出框所显示的数据类型:community、building、unit、room
|
||
|
pickerData: [],
|
||
|
|
||
|
selObj: {},
|
||
|
|
||
|
showMessagsBox: false,//是否显示人员未填写提示弹出框
|
||
|
|
||
|
detNumList: [],//参加核酸次数list
|
||
|
|
||
|
popupSlots: [//问题类型弹框数据
|
||
|
{
|
||
|
values: []
|
||
|
}
|
||
|
],
|
||
|
|
||
|
}
|
||
|
},
|
||
|
components: {},
|
||
|
computed: {
|
||
|
|
||
|
},
|
||
|
|
||
|
created () {
|
||
|
console.log(this.$route)
|
||
|
|
||
|
this.shequId = this.$route.params.id
|
||
|
this.customerId = this.$route.query.customerId
|
||
|
this.shequName = this.$route.query.name
|
||
|
document.title = this.shequName + '信息管理平台'
|
||
|
},
|
||
|
mounted () {
|
||
|
|
||
|
|
||
|
let envShow = process.env.VUE_APP_NODE_ENV
|
||
|
console.log('环境', envShow)
|
||
|
|
||
|
let internalShequId = ['1202807601961984002', '6e511da6816e53af4cda952365a26eb9', 'b058eb82d65d922fec9dc84f0348fc6a', '630c3c2dd1cd7a4d198c8558bce88324']
|
||
|
// let internalShequId = ['1202807601961984002',]
|
||
|
// if (envShow === 'dev' || envShow === 'prod:sit') { // 开发环境
|
||
|
// internalShequId = '6e511da6816e53af4cda952365a26eb9'
|
||
|
// } else if (envShow === 'prod:uat') { // 体验
|
||
|
// internalShequId = '6e511da6816e53af4cda952365a26eb9'
|
||
|
// } else if (envShow === 'prod') { // 生产
|
||
|
// 微笑崂山下的小寨子社区:b058eb82d65d922fec9dc84f0348fc6a
|
||
|
// 亿联街道下的亿联社区:630c3c2dd1cd7a4d198c8558bce88324
|
||
|
// internalShequId = '1202807601961984002'
|
||
|
// } else if (envShow === 'shibei_prod') { // 生产
|
||
|
// internalShequId = '1202807601961984002'
|
||
|
// }
|
||
|
|
||
|
this.formData.customerId = this.customerId
|
||
|
if (internalShequId.indexOf(this.shequId) > -1) {
|
||
|
this.formData.origin = 'internal'
|
||
|
} else {
|
||
|
this.formData.origin = 'external'
|
||
|
}
|
||
|
|
||
|
this.detNumList = []
|
||
|
for (let i = 0; i < 5; i++) {
|
||
|
let obj = {
|
||
|
value: i + '',
|
||
|
label: i + '次',
|
||
|
}
|
||
|
this.detNumList.push(obj)
|
||
|
}
|
||
|
|
||
|
|
||
|
},
|
||
|
|
||
|
methods: {
|
||
|
handelSelData () {
|
||
|
this.$refs.pickerData.open(); // 触发
|
||
|
// this.$refs.pickerData.close() ; // 关闭
|
||
|
},
|
||
|
|
||
|
handleConfirm (val) {
|
||
|
let time = new Date(val);
|
||
|
|
||
|
let year = time.getFullYear()
|
||
|
console.log(year)
|
||
|
|
||
|
},
|
||
|
|
||
|
handelSel (selType) {
|
||
|
this.selType = selType
|
||
|
|
||
|
if (selType === 'detNum') {
|
||
|
|
||
|
this.pickerData = this.detNumList
|
||
|
}
|
||
|
|
||
|
let obj = {
|
||
|
values: this.pickerData
|
||
|
}
|
||
|
|
||
|
this.popupSlots = []
|
||
|
this.popupSlots.push(obj)
|
||
|
this.popupVisible = !this.popupVisible
|
||
|
},
|
||
|
|
||
|
async handleSubmit () {
|
||
|
let message = this.validataFormData()
|
||
|
|
||
|
if (message) {
|
||
|
if (this.showMessagsBox) {
|
||
|
MessageBox.confirm(message).then(action => {
|
||
|
this.submit()
|
||
|
});
|
||
|
} else {
|
||
|
Toast({
|
||
|
message: message,
|
||
|
duration: 3000
|
||
|
});
|
||
|
}
|
||
|
} else {
|
||
|
this.submit()
|
||
|
}
|
||
|
|
||
|
|
||
|
},
|
||
|
async submit () {
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
console.log(this.formData)
|
||
|
|
||
|
this.btnDisabled = true
|
||
|
this.startLoading()
|
||
|
const url = "/epmetuser/icresicollect/save"
|
||
|
|
||
|
const { data, code, msg } = await requestPost(url, this.formData)
|
||
|
this.endLoading()
|
||
|
this.btnDisabled = false
|
||
|
if (code === 0) {
|
||
|
this.formData.shequName = this.shequName
|
||
|
this.$router.replace({
|
||
|
name: 'caijisuccess',
|
||
|
query: {
|
||
|
formData: this.formData
|
||
|
}
|
||
|
})
|
||
|
// Toast({
|
||
|
// message: '提交成功',
|
||
|
// duration: 3000
|
||
|
// });
|
||
|
|
||
|
} else {
|
||
|
Toast({
|
||
|
message: msg,
|
||
|
duration: 3000
|
||
|
});
|
||
|
|
||
|
}
|
||
|
},
|
||
|
|
||
|
//必填验证
|
||
|
validataFormData () {
|
||
|
|
||
|
let aletMessage = ''
|
||
|
this.showMessagsBox = false
|
||
|
if (this.formData.origin === 'internal') {//内部
|
||
|
if (!this.selVillage) {
|
||
|
aletMessage = '请选择小区'
|
||
|
|
||
|
return aletMessage
|
||
|
}
|
||
|
if (!this.selBuild) {
|
||
|
aletMessage = '请选择楼栋'
|
||
|
return aletMessage
|
||
|
}
|
||
|
|
||
|
if (!this.selUnit) {//没有选择单元
|
||
|
aletMessage = '请选择单元'
|
||
|
return aletMessage
|
||
|
|
||
|
} else {//选择了单元
|
||
|
if (this.selUnit.value === 'other') {//单元选择了其他
|
||
|
if (!this.unitContent) {
|
||
|
aletMessage = '请填写单元号'
|
||
|
return aletMessage
|
||
|
}
|
||
|
|
||
|
if (!this.homeContent) {//房屋必须填写内容
|
||
|
aletMessage = '请填写房屋'
|
||
|
return aletMessage
|
||
|
}
|
||
|
|
||
|
} else {//单元没有选择其他
|
||
|
if (!this.selHome) {
|
||
|
aletMessage = '请选择房屋'
|
||
|
return aletMessage
|
||
|
|
||
|
} else if (this.selHome.value === 'other' && !this.homeContent) {
|
||
|
aletMessage = '请填写房屋'
|
||
|
return aletMessage
|
||
|
}
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
|
||
|
} else {
|
||
|
if (!this.formData.address) {
|
||
|
aletMessage = '请填写地址'
|
||
|
return aletMessage
|
||
|
}
|
||
|
}
|
||
|
|
||
|
if (!this.selHomeType) {
|
||
|
aletMessage = '请选择房屋类型'
|
||
|
return aletMessage
|
||
|
}
|
||
|
if (!this.formData.houseHolderName) {
|
||
|
aletMessage = '请填写户主姓名'
|
||
|
return aletMessage
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
},
|
||
|
|
||
|
popupOk () {
|
||
|
|
||
|
if (this.selType === 'detNum') {
|
||
|
this.formData.detNum = this.selObj.value
|
||
|
this.formData.detNumName = this.selObj.label
|
||
|
}
|
||
|
this.popupVisible = false
|
||
|
|
||
|
},
|
||
|
|
||
|
onPickerChange (picker, values) {
|
||
|
|
||
|
this.selObj = values[0]
|
||
|
|
||
|
},
|
||
|
|
||
|
// 开启加载动画
|
||
|
startLoading () {
|
||
|
loading = Loading.service({
|
||
|
lock: true, // 是否锁定
|
||
|
text: '正在加载……', // 加载中需要显示的文字
|
||
|
background: 'rgba(0,0,0,.7)' // 背景颜色
|
||
|
})
|
||
|
},
|
||
|
// 结束加载动画
|
||
|
endLoading () {
|
||
|
// clearTimeout(timer);
|
||
|
if (loading) {
|
||
|
loading.close()
|
||
|
}
|
||
|
}
|
||
|
|
||
|
|
||
|
},
|
||
|
beforeDestroy () {
|
||
|
document.title = messages[val].brand.lg
|
||
|
},
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped >
|
||
|
@import "@/assets/scss/pages/staffRegister.scss";
|
||
|
/deep/ .mint-cell-wrapper {
|
||
|
padding: 0 5px 0 0;
|
||
|
}
|
||
|
.my-field /deep/ .mint-field-core {
|
||
|
text-align: right;
|
||
|
margin-right: 20px;
|
||
|
}
|
||
|
|
||
|
/deep/ .mint-popup-bottom {
|
||
|
height: 300px;
|
||
|
width: 100vw;
|
||
|
}
|
||
|
|
||
|
// /deep/ .picker {
|
||
|
// height: 300px;
|
||
|
// }
|
||
|
/deep/ .picker-items {
|
||
|
height: 250px;
|
||
|
width: 100vw;
|
||
|
}
|
||
|
/deep/ .picker-slot-center {
|
||
|
width: 100vw;
|
||
|
}
|
||
|
/deep/ .picker-center-highlight {
|
||
|
top: 35%;
|
||
|
}
|
||
|
.picker-toolbar-title {
|
||
|
display: flex;
|
||
|
flex-direction: row;
|
||
|
justify-content: space-around;
|
||
|
align-items: center;
|
||
|
background-color: #eee;
|
||
|
height: 44px;
|
||
|
line-height: 44px;
|
||
|
font-size: 16px;
|
||
|
.usi-btn-cancel,
|
||
|
.usi-btn-sure {
|
||
|
color: #26a2ff;
|
||
|
font-size: 16px;
|
||
|
}
|
||
|
}
|
||
|
</style>
|