first commit
This commit is contained in:
@@ -0,0 +1,579 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.van-form {
|
||||
/*max-height: calc(100vh - 200px);*/
|
||||
/*overflow-y: scroll;*/
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
|
||||
.van-cell-houseType {
|
||||
border-bottom: 1px solid #ebedf0;
|
||||
}
|
||||
|
||||
.form-houseType-notice-bar {
|
||||
background-color: #FFF;
|
||||
}
|
||||
|
||||
.van-cell-label-wrap {
|
||||
position: relative;
|
||||
padding-left: 120px;
|
||||
}
|
||||
|
||||
.van-cell-label-wrap > .van-cell-label-img {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.van-cell-label-desc {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 120px;
|
||||
max-height: 120px;
|
||||
padding: 0 0 0 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.van-cell-label-desc > div {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.form-submit-button {
|
||||
/*position: fixed;*/
|
||||
/*bottom: 55px;*/
|
||||
/*left: 50%;*/
|
||||
/*height: 44px;*/
|
||||
/*width: 90%;*/
|
||||
/*transform: translateX(-50%);*/
|
||||
/*background-color: #FFF;*/
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 20px 24px 10px 24px;
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 20px;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.van-doc-card > div:first-child {
|
||||
border: 2px #50e644 solid;
|
||||
width: 26px;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 26px;
|
||||
}
|
||||
|
||||
.van-doc-card .title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.van-doc-card .title > div:first-child {
|
||||
width: 80%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.van-doc-card .title > div:last-child {
|
||||
font-weight: normal;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
.van-doc-card .room {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.room_text {
|
||||
margin-left: 36px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.room_text span {
|
||||
color: grey;
|
||||
}
|
||||
|
||||
.room_more {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
color: #1867b0;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app">
|
||||
<van-sticky>
|
||||
<van-nav-bar :title="actInfo.actName" @click-left="history.back()" fixed left-arrow placeholder></van-nav-bar>
|
||||
</van-sticky>
|
||||
|
||||
<template v-if="tabbarActive===0">
|
||||
<van-notice-bar class="form-houseType-notice-bar" color="#1989fa" left-icon="info-o">
|
||||
填写时间: {{actInfo.startTime + ' 至 ' + actInfo.endTime}}
|
||||
</van-notice-bar>
|
||||
|
||||
<van-form @submit="onSubmit">
|
||||
<van-field
|
||||
readonly
|
||||
:rules="[{ required: true, message: '请填写您的工号' }]"
|
||||
label="工号"
|
||||
name="loginName"
|
||||
placeholder="工号"
|
||||
v-model="formData.loginName"
|
||||
></van-field>
|
||||
<van-field
|
||||
readonly
|
||||
:rules="[{ required: true, message: '请填写您的姓名' }]"
|
||||
label="姓名"
|
||||
name="userName"
|
||||
placeholder="姓名"
|
||||
v-model="formData.userName"
|
||||
></van-field>
|
||||
<van-field
|
||||
readonly
|
||||
:rules="[{ required: true, message: '请填写您的单位' }]"
|
||||
label="单位"
|
||||
name="unitName"
|
||||
placeholder="单位"
|
||||
v-model="formData.unitName"
|
||||
></van-field>
|
||||
<van-field
|
||||
:rules="[{ required: true, message: '请选择您的出生日期' }]"
|
||||
:value="formData.birthday"
|
||||
@click="showDatePicker('birthday')"
|
||||
clickable
|
||||
label="出生日期"
|
||||
name="birthday"
|
||||
placeholder="点击选择出生日期"
|
||||
readonly
|
||||
></van-field>
|
||||
<van-field
|
||||
:rules="[{ required: true, message: '请选择您的工作时间' }]"
|
||||
:value="formData.joinWorkTime"
|
||||
@click="showDatePicker('joinWorkTime')"
|
||||
clickable
|
||||
label="工作时间"
|
||||
name="joinWorkTime"
|
||||
placeholder="点击选择工作时间"
|
||||
readonly
|
||||
></van-field>
|
||||
<van-field
|
||||
:rules="[{ required: true, message: '请选择您的进校时间' }]"
|
||||
:value="formData.schoolTime"
|
||||
@click="showDatePicker('schoolTime')"
|
||||
clickable
|
||||
label="进校时间"
|
||||
name="schoolTime"
|
||||
placeholder="点击选择进校时间"
|
||||
readonly
|
||||
></van-field>
|
||||
<van-field
|
||||
:rules="[{ required: true, message: '请填写您的职称职务(以最高职称职务为准)' }]"
|
||||
label="职称职务"
|
||||
maxlength="20"
|
||||
name="titlePosition"
|
||||
placeholder="以最高职称职务为准"
|
||||
v-model="formData.titlePosition"
|
||||
></van-field>
|
||||
<van-field
|
||||
:rules="[{ required: true, message: '请选择您的职称职务评定时间' }]"
|
||||
:value="formData.titleAsAssessmentTime"
|
||||
@click="showDatePicker('titleAsAssessmentTime')"
|
||||
clickable
|
||||
label="职称职务评定时间"
|
||||
name="titleAsAssessmentTime"
|
||||
placeholder="职称职务评定时间"
|
||||
readonly
|
||||
>
|
||||
<template #label>
|
||||
<div>
|
||||
<div>职称职务</div>
|
||||
<div>评定时间</div>
|
||||
</div>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field :rules="[{ validator: validatorBoolean, message: '请选择' }]" label="是否双职工" name="isDoubleStaff">
|
||||
<template #input>
|
||||
<van-radio-group direction="horizontal" v-model="formData.isDoubleStaff">
|
||||
<van-radio :name="true" shape="square">是</van-radio>
|
||||
<van-radio :name="false" shape="square">否</van-radio>
|
||||
</van-radio-group>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field :rules="[{ validator: validatorBoolean, message: '请选择' }]" label="是否服从调配"
|
||||
name="whetherToAllocate">
|
||||
<template #input>
|
||||
<van-radio-group direction="horizontal" v-model="formData.whetherToAllocate">
|
||||
<van-radio :name="true" shape="square">是</van-radio>
|
||||
<van-radio :name="false" shape="square">否</van-radio>
|
||||
</van-radio-group>
|
||||
</template>
|
||||
</van-field>
|
||||
|
||||
<van-notice-bar class="form-houseType-notice-bar" color="#1989fa" left-icon="info-o">
|
||||
拟认购户型（可选三种）
|
||||
</van-notice-bar>
|
||||
|
||||
<van-checkbox-group style="margin-bottom: 10px" v-model="formData.selectHouseIdList">
|
||||
<van-cell-group>
|
||||
<van-cell
|
||||
:key="item.id"
|
||||
:title="'户型'+(index+1)"
|
||||
@click="houseTypeToggle(item.id)"
|
||||
class="van-cell-houseType"
|
||||
clickable
|
||||
v-for="(item, index) in houseTypeList">
|
||||
<template #label>
|
||||
<div class="van-cell-label-wrap">
|
||||
<div class="van-cell-label-img">
|
||||
<van-image
|
||||
:src="APP_DOMAIN+'/file_server/fileStreamPreview?id='+item.imgFiles[0].id"
|
||||
@click.stop="vant.ImagePreview([APP_DOMAIN+'/file_server/fileStreamPreview?id='+item.imgFiles[0].id])"
|
||||
height="120"
|
||||
width="120"
|
||||
></van-image>
|
||||
</div>
|
||||
<div class="van-cell-label-desc">
|
||||
<div>户型面积：{{item.area + 'm²'}}</div>
|
||||
<div>总共套数：{{item.number}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #right-icon>
|
||||
<van-checkbox :name="item.id" @click="houseTypeToggle(item.id)"
|
||||
ref="checkboxes"></van-checkbox>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-checkbox-group>
|
||||
|
||||
<div class="form-submit-button">
|
||||
<van-button :color="themeColor"
|
||||
:disabled="moment().unix() >= moment(actInfo.endTime).unix()
|
||||
|| moment().unix() <= moment(actInfo.startTime).unix()
|
||||
|| !this.hasPermission"
|
||||
block native-type="submit">
|
||||
{{submitText}}
|
||||
</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
|
||||
<van-popup position="bottom" v-model="datePickerVisible">
|
||||
<van-datetime-picker
|
||||
:max-date="maxDate"
|
||||
:min-date="minDate"
|
||||
@cancel="datePickerVisible = false"
|
||||
@confirm="confirmDate"
|
||||
type="date"
|
||||
v-model="datePickerTempVal"
|
||||
></van-datetime-picker>
|
||||
</van-popup>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<van-list :finished="finished" :finished-text="tableData.length>0?'没有更多了':''"
|
||||
@load="pageData"
|
||||
v-if="tableData && tableData.length>0"
|
||||
v-model="loading">
|
||||
<div class="van-doc-card" v-for="o in tableData">
|
||||
<div></div>
|
||||
<div class="title">
|
||||
<div>
|
||||
{{o.tempActHouse.actName}}
|
||||
</div>
|
||||
<div @click="goEdit(o)">去修改 ></div>
|
||||
</div>
|
||||
<div :style="'height: ' + o.divHeight + '; overflow: hidden'">
|
||||
<div class="room" v-for="item in o.selectHouseIdList">
|
||||
<van-image v-for="pic in houseTypeList.find(x => x.id === item.houseTypeId).imgFiles"
|
||||
width="5rem"
|
||||
height="5rem"
|
||||
fit="contain"
|
||||
:src="APP_DOMAIN + '/file_server/fileStreamPreview?id=' + pic.id"
|
||||
@click.stop="vant.ImagePreview([APP_DOMAIN + '/file_server/fileStreamPreview?id=' + pic.id])">
|
||||
</van-image>
|
||||
<div class="room_text">
|
||||
<div style="margin: 6px 0px 10px 0px;">
|
||||
<label style="font-weight: bold">
|
||||
{{houseTypeList.find(x => x.id === item.houseTypeId).area}}m²
|
||||
</label>
|
||||
户型
|
||||
</div>
|
||||
<div>
|
||||
<span>户型面积：</span>
|
||||
{{houseTypeList.find(x => x.id === item.houseTypeId).area}}m²
|
||||
</div>
|
||||
<div>
|
||||
<span>总共套数：</span>
|
||||
{{houseTypeList.find(x => x.id === item.houseTypeId).number}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="room_more"
|
||||
@click="() => {o.expandMore = !o.expandMore; o.divHeight = !o.expandMore ? '120px' : '100%'}">
|
||||
{{!o.expandMore ? '查看更多' : '收起'}}
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty description="暂无数据" v-else></van-empty>
|
||||
</template>
|
||||
|
||||
<van-tabbar @change="tabbarChange" v-model="tabbarActive">
|
||||
<van-tabbar-item icon="edit">填写</van-tabbar-item>
|
||||
<van-tabbar-item icon="friends-o">我的</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [mobileMixins],
|
||||
computed: {
|
||||
submitText() {
|
||||
if (!this.hasPermission) {
|
||||
return '无权限提交'
|
||||
}
|
||||
|
||||
if (moment().unix() > moment(this.actInfo.endTime).unix()) {
|
||||
return '已结束'
|
||||
} else if (moment().unix() < moment(this.actInfo.startTime).unix()) {
|
||||
return '未开始'
|
||||
} else {
|
||||
if (this.formData.id) {
|
||||
return '重新提交'
|
||||
} else {
|
||||
return '提交'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
actId: GetQueryString("actId"),
|
||||
actInfo: {},
|
||||
formData: {
|
||||
loginName: null,
|
||||
selectHouseIdList: []
|
||||
},
|
||||
datePickerVisible: false,
|
||||
minDate: new Date(1960, 1, 1),
|
||||
maxDate: new Date(),
|
||||
datePickerTempVal: null,
|
||||
clickFormDateField: null,
|
||||
houseTypeList: [],
|
||||
tabbarActive: 0,
|
||||
validatorBoolean(value) {
|
||||
return value != null
|
||||
},
|
||||
hasPermission: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getHouseTypeList() {
|
||||
const resp = await $.post('/platform/tempActivity/house/getHouseTypeList/' + this.actId)
|
||||
if (resp.code === 0) {
|
||||
this.houseTypeList = resp.data
|
||||
}
|
||||
},
|
||||
showDatePicker(field) {
|
||||
this.clickFormDateField = field
|
||||
if (this.formData[field]) {
|
||||
this.datePickerTempVal = new Date(this.formData[field])
|
||||
} else {
|
||||
this.datePickerTempVal = this.minDate
|
||||
}
|
||||
this.datePickerVisible = true
|
||||
},
|
||||
confirmDate(time) {
|
||||
this.$set(this.formData, this.clickFormDateField, moment(time).format('YYYY-MM-DD'))
|
||||
this.datePickerVisible = false
|
||||
},
|
||||
async onSubmit(values) {
|
||||
if (!this.hasPermission) {
|
||||
return
|
||||
}
|
||||
|
||||
const methodName = this.formData.id ? "/doEdit" : "/doAdd"
|
||||
if (methodName === '/doAdd' && this.tableData.length > 0) {
|
||||
vant.Toast('您已经提交过了，请到我的页面查看')
|
||||
return
|
||||
}
|
||||
|
||||
if (this.formData.selectHouseIdList.length === 0) {
|
||||
vant.Toast('请至少选择一种房型')
|
||||
return
|
||||
}
|
||||
|
||||
const fd = clone(this.formData)
|
||||
fd.selectHouseIdList = fd.selectHouseIdList.map(v => {
|
||||
return {houseTypeId: v}
|
||||
})
|
||||
fd.actId = this.actId
|
||||
const toast = vant.Toast.loading({
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
overlay: true,
|
||||
message: '提交中',
|
||||
})
|
||||
const resp = await $.post('/platform/tempActivity/house/mobileForm' + methodName, {
|
||||
tempActHouseUserSel: JSON.stringify(fd)
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
if (resp.code === 0) {
|
||||
toast.message = '提交成功'
|
||||
toast.type = 'success'
|
||||
} else {
|
||||
toast.message = '提交失败'
|
||||
toast.type = 'fail'
|
||||
}
|
||||
setTimeout(() => {
|
||||
toast.clear()
|
||||
}, 500)
|
||||
}, 1500)
|
||||
|
||||
this.tableData = []
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.pageSize = 5
|
||||
await this.getApplyData()
|
||||
|
||||
},
|
||||
|
||||
houseTypeToggle(id) {
|
||||
const selectHouseIdList = this.formData.selectHouseIdList
|
||||
const index = selectHouseIdList.findIndex(v => v === id)
|
||||
if (index > -1) {
|
||||
this.$refs.checkboxes.find(v => v.name === id).toggle()
|
||||
} else {
|
||||
if (selectHouseIdList.length < 3) {
|
||||
this.$refs.checkboxes.find(v => v.name === id).toggle()
|
||||
} else {
|
||||
vant.Toast('最多只能选择三项')
|
||||
}
|
||||
}
|
||||
},
|
||||
checkIsEdit() {
|
||||
const id = GetQueryString("id")
|
||||
if (id) {
|
||||
|
||||
} else {
|
||||
|
||||
}
|
||||
},
|
||||
async getActInfo() {
|
||||
const resp = await $.post('/platform/tempActivity/house/getActInfo/' + this.actId)
|
||||
if (resp.code === 0) {
|
||||
this.actInfo = resp.data
|
||||
}
|
||||
},
|
||||
tabbarChange(val) {
|
||||
|
||||
},
|
||||
//获取申请记录
|
||||
async getApplyData() {
|
||||
const params = clone(this.pageForm)
|
||||
params.actId = this.actId
|
||||
const resp = await $.post('/platform/tempActivity/house/getApplyData', params)
|
||||
if (resp.code === 0) {
|
||||
|
||||
resp.data.list.forEach(v => {
|
||||
v.birthday = moment(v.birthday).format('YYYY-MM-DD')
|
||||
v.joinWorkTime = moment(v.joinWorkTime).format('YYYY-MM-DD')
|
||||
v.schoolTime = moment(v.schoolTime).format('YYYY-MM-DD')
|
||||
v.titleAsAssessmentTime = moment(v.titleAsAssessmentTime).format('YYYY-MM-DD')
|
||||
v.expandMore = false
|
||||
v.divHeight = '120px'
|
||||
})
|
||||
|
||||
if (resp.data.list.length === 0) {
|
||||
this.tableData = []
|
||||
this.loading = false
|
||||
this.finished = true
|
||||
} else {
|
||||
this.tableData = this.tableData.concat(resp.data.list)
|
||||
}
|
||||
if (this.tableData.length === resp.data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
this.mLoading = false
|
||||
},
|
||||
goEdit(o) {
|
||||
const co = clone(o)
|
||||
co.selectHouseIdList = co.selectHouseIdList.map(v => v.houseTypeId)
|
||||
this.formData = co
|
||||
this.tabbarActive = 0
|
||||
},
|
||||
initUserInfo() {
|
||||
this.$set(this.formData, 'loginName', "${@shiro.getPrincipalProperty('loginname')}")
|
||||
this.$set(this.formData, 'userName', "${@shiro.getPrincipalProperty('username')}")
|
||||
this.$set(this.formData, 'unitName', "${@shiro.getPrincipalProperty('unit').getName()}")
|
||||
this.$set(this.formData, 'birthday', "${@shiro.getPrincipalProperty('birthday')}")
|
||||
this.$set(this.formData, 'joinWorkTime', null)
|
||||
this.$set(this.formData, 'schoolTime', "${@shiro.getPrincipalProperty('schoolTime')}")
|
||||
this.$set(this.formData, 'titlePosition', null)
|
||||
this.$set(this.formData, 'titleAsAssessmentTime', null)
|
||||
this.$set(this.formData, 'isDoubleStaff', null)
|
||||
this.$set(this.formData, 'whetherToAllocate', null)
|
||||
this.$set(this.formData, 'selectHouseIdList', [])
|
||||
},
|
||||
async checkInWhiteList() {
|
||||
const actId = this.actId
|
||||
const loginName = "${@shiro.getPrincipalProperty('loginname')}"
|
||||
const resp = await $.post('/platform/tempActivity/house/checkInWhiteList/' + actId + '/' + loginName)
|
||||
return resp
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
if (!this.actId) {
|
||||
vant.Toast('参数不合法')
|
||||
return
|
||||
}
|
||||
const isWhiteUserResp = await this.checkInWhiteList()
|
||||
if (isWhiteUserResp.code !== 0) {
|
||||
this.hasPermission = false
|
||||
vant.Dialog.alert({
|
||||
title: '提示',
|
||||
message: isWhiteUserResp.msg,
|
||||
}).then(() => {
|
||||
const agent = window.navigator.userAgent.toLowerCase()
|
||||
if (agent.match(/MicroMessenger/i)) {
|
||||
WeixinJSBridge.call('closeWindow')
|
||||
} else {
|
||||
window.close()
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.hasPermission = true
|
||||
}
|
||||
this.getActInfo()
|
||||
this.getHouseTypeList()
|
||||
this.getApplyData()
|
||||
this.checkIsEdit()
|
||||
this.initUserInfo()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,10 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Title</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user