Files
2026-09-08 19:49:21 +08:00

495 lines
26 KiB
HTML
Raw Permalink Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!--#
layout("/mobile/platform.html"){
#-->
<style>
#app {
background: #ececec;
}
.tips .content {
height: calc(80vh - 49px);
overflow-y: scroll;
position: relative;
/*padding: 5px*/
}
.tips .content h1, h2, h3, h4, h5, h6 {
font-weight: unset;
margin: 10px;
}
.tips .button-wrap {
position: absolute;
left: 0;
right: 0;
bottom: 0;
}
.table-container {
overflow-x: auto;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
max-height: 300px;
overflow-y: scroll;
font-size: 14px;
color: #646566;
}
.table-container table {
border-collapse: collapse;
width: 100%;
background: #fff;
}
.table-container table td {
padding: 10px;
text-align: left;
border: 1px solid #ddd;
min-width: 100px; /* 设置单元格固定宽度 */
}
.table-container table tr:first-child td {
/*border-top: none;*/
}
.table-container table tr td {
/*border-left: none;*/
}
.table-container table td {
/*background-color: #f2f2f2;*/
}
.siteUsageTabs .van-tabs__wrap {
/*border-top-left-radius: 10px;*/
/*border-top-right-radius: 10px;*/
}
.siteUsageTabs .van-tab__text {
display: flex;
gap: 10px;
}
.siteUsageTabs .van-tab--active .van-tab__text {
color: rgb(0, 78, 100);
font-weight: bold;
}
.siteUsageTabs .van-tabs__line {
display: none;
}
</style>
<div id="app" v-cloak>
<div>
<van-nav-bar title="职工之家场地预约" left-arrow placeholder fixed
@click-left="history.back()"></van-nav-bar>
<div class="van-sidebar-item van-sidebar-item--select" style="margin-top: 10px!important;">
近一周预约情况
</div>
<van-tabs v-model="tabActive" class="siteUsageTabs">
<van-tab :title="k" v-for="(v,k) in allSiteUsageInfo" :item="k">
<template #title>
<svg t="1702637676312" class="icon" viewBox="0 0 1111 1024" version="1.1"
xmlns="http://www.w3.org/2000/svg" p-id="7468" width="20" height="20">
<path d="M463.784229 127.356343a9.698743 9.698743 0 0 1-9.713372-9.669486c0-5.3248 4.344686-9.654857 9.713372-9.654857h103.658057c5.339429 0 9.698743 4.330057 9.698743 9.654857 0 5.3248-4.359314 9.654857-9.698743 9.654857h-103.658057z m150.176914 0a9.698743 9.698743 0 0 1-9.713372-9.669486c0-5.3248 4.359314-9.654857 9.713372-9.654857h34.040686c5.354057 0 9.713371 4.330057 9.713371 9.654857 0 5.3248-4.359314 9.654857-9.713371 9.654857H613.961143zM51.243886 36.571429a14.599314 14.599314 0 0 0-14.555429 14.584685v549.653943l3.364572-1.243428c67.978971-25.1904 125.952-66.706286 172.295314-123.406629 71.723886-87.771429 103.892114-197.778286 118.272-274.578286 15.4624-82.7392 14.218971-147.265829 14.160457-149.972114a18.139429 18.139429 0 0 1 3.349943-11.044571l2.735543-3.9936H51.243886z m703.619657 4.008228c2.296686 3.2768 3.466971 7.109486 3.364571 11.044572-0.073143 2.633143-1.579886 65.8432 14.160457 149.942857 14.336 76.8 46.4896 186.748343 118.286629 274.578285 46.928457 57.431771 105.632914 99.240229 174.4896 124.298972 2.048 0.731429 3.949714 1.872457 5.792914 3.4816l4.125257 3.554743V51.170743a14.599314 14.599314 0 0 0-14.555428-14.584686H752.054857l2.779429 4.008229zM36.688457 752.7424c0 8.045714 6.538971 14.584686 14.555429 14.584686h215.508114l0.146286-2.369829a18.578286 18.578286 0 0 1 5.983085-12.682971c51.258514-47.162514 60.298971-119.456914 46.518858-170.174172-4.8128-17.495771-20.3776-60.430629-61.513143-80.866743l-12.551315-6.2464-9.025828 10.708115C185.782857 565.496686 123.318857 609.206857 50.673371 635.611429a18.870857 18.870857 0 0 1-6.436571 1.170285c-1.418971 0-2.779429-0.321829-4.447086-0.731428l-3.101257-0.775315v117.4528z m755.712 14.584686l-3.569371-4.183772c-43.680914-51.156114-59.538286-124.269714-41.428115-190.829714 11.790629-43.344457 37.156571-78.599314 71.402058-99.240229l15.594057-9.376914-9.654857-15.433143a597.825829 597.825829 0 0 1-48.405943-96.241371c-17.759086-44.704914-31.6416-93.622857-41.194057-145.393372-16.325486-88.298057-14.5408-153.365943-14.453029-156.086857 0.117029-3.584 1.2288-7.021714 3.232914-9.991314l2.691657-3.949714H376.290743l2.735543 3.949714c2.048 2.954971 3.1744 6.407314 3.291428 9.976686 0.087771 2.720914 1.872457 67.774171-14.482285 156.086857-9.537829 51.755886-23.405714 100.688457-41.179429 145.408a601.512229 601.512229 0 0 1-48.391314 96.241371l-9.654857 15.433143 15.5648 9.376914c34.230857 20.626286 59.582171 55.851886 71.402057 99.210972 18.154057 66.603886 2.296686 139.717486-41.398857 190.858971l-3.569372 4.183772h481.792z m268.127086 0a14.599314 14.599314 0 0 0 14.555428-14.584686v-124.416l-4.139885 3.627886c-2.530743 2.194286-6.685257 4.827429-12.214857 4.827428a19.017143 19.017143 0 0 1-6.392686-1.141028c-72.630857-26.433829-135.080229-70.158629-185.636572-129.9456l-9.040457-10.708115-12.551314 6.2464c-41.150171 20.450743-56.700343 63.370971-61.483886 80.881372-13.809371 50.702629-4.783543 122.997029 46.533486 170.159543 3.569371 3.262171 5.690514 7.767771 5.968457 12.668343l0.146286 2.384457h224.256zM51.243886 803.913143A51.273143 51.273143 0 0 1 0 752.7424V51.170743A51.273143 51.273143 0 0 1 51.243886 0h1009.283657A51.273143 51.273143 0 0 1 1111.771429 51.170743v701.571657a51.273143 51.273143 0 0 1-51.243886 51.170743H51.243886z m-6.977829 105.003886a18.768457 18.768457 0 0 1-18.768457-18.724572c0-10.327771 8.426057-18.724571 18.768457-18.724571h234.8032c10.3424 0 18.768457 8.3968 18.768457 18.724571 0 10.313143-8.426057 18.724571-18.768457 18.724572H44.266057z m394.210743 0a18.768457 18.768457 0 0 1-18.753829-18.724572c0-10.327771 8.411429-18.724571 18.753829-18.724571h234.832457c10.3424 0 18.753829 8.3968 18.753829 18.724571 0 10.313143-8.411429 18.724571-18.753829 18.724572H438.4768z m394.210743 0a18.753829 18.753829 0 0 1-18.753829-18.724572c0-10.327771 8.411429-18.724571 18.753829-18.724571h234.832457c10.3424 0 18.753829 8.3968 18.753829 18.724571 0 10.313143-8.411429 18.724571-18.753829 18.724572H832.687543zM236.982857 1024a18.768457 18.768457 0 0 1-18.768457-18.724571c0-10.313143 8.426057-18.724571 18.768457-18.724572h234.832457c10.3424 0 18.768457 8.411429 18.768457 18.724572 0 10.327771-8.426057 18.724571-18.768457 18.724571H236.982857z m394.210743 0a18.753829 18.753829 0 0 1-18.753829-18.724571c0-10.313143 8.411429-18.724571 18.753829-18.724572H866.011429c10.3424 0 18.753829 8.411429 18.753828 18.724572 0 10.327771-8.411429 18.724571-18.753828 18.724571H631.1936z"
fill="#44BBE0" p-id="7469"></path>
</svg>
{{k}}
</template>
<div class="table-container">
<table>
<thead>
<tr>
<td>开始时间</td>
<td>结束时间</td>
<td>预约人姓名</td>
<td>预约人部门</td>
<td>预约事由</td>
</tr>
</thead>
<tbody>
<tr v-for="item in v" :key="item.id">
<td>{{item.reserve_start_time}}</td>
<td>{{item.reserve_end_time}}</td>
<td>{{item.reserve_person_username}}</td>
<td>{{item.reserve_person_unitname}}</td>
<td>{{item.reserve_cause}}</td>
</tr>
</tbody>
</table>
</div>
</van-tab>
</van-tabs>
<div class="van-sidebar-item van-sidebar-item--select" style="margin-top: 10px!important;">
填写预约信息
</div>
<van-form @submit="onSubmit">
<van-cell-group class="">
<van-field readonly :value="formData.reserve_person_username" name="reserve_person_username"
label="预约人姓名"></van-field>
<van-field readonly :value="formData.reserve_person_loginname" name="reserve_person_loginname"
label="预约人工号"></van-field>
<van-field readonly :value="formData.reserve_person_sex" name="reserve_person_sex"
label="预约人性别"></van-field>
<van-field readonly :value="formData.reserve_person_phone" name="reserve_person_phone"
label="预约人电话"></van-field>
<van-field readonly :value="formData.reserve_person_unitname" name="reserve_person_unitname"
label="预约人部门"></van-field>
<van-field readonly :value="formData.reserve_person_unionname" name="reserve_person_unionname"
label="预约人工会"></van-field>
<van-field readonly
clickable
name="site_name"
:value="formData.site_name"
label="预约场地"
placeholder="点击选择预约场地"
:rules="[{ required: true, message: '请选择' }]"
required
@click="showSitePicker = true"
>
</van-field>
<van-field readonly clickable
label="预约开始时间"
:value="formData.reserve_start_time"
name="reserve_start_time"
:rules="[{ required: true, message: '请选择' }]"
placeholder="请选择预约开始时间"
required
@click="startTimePicker = true">
</van-field>
<van-field readonly clickable
label="预约结束时间"
:value="formData.reserve_end_time"
name="reserve_end_time"
:rules="[{ required: true, message: '请选择' }]"
placeholder="请选择预约结束时间"
required
@click="endTimePicker = true">
</van-field>
<!-- <van-field v-model="formData.reserve_activity"-->
<!-- name="reserve_activity"-->
<!-- :rules="[{ required: true, message: '请填写' }]"-->
<!-- placeholder="请填写预约活动项目"-->
<!-- required-->
<!-- label="预约活动项目"></van-field>-->
<van-field v-model="formData.reserve_cause"
name="reserve_cause"
rows="1"
autosize
type="textarea"
:rules="[{ required: true, message: '请填写' }]"
placeholder="请填写预约事由"
required
label="预约事由"></van-field>
<van-field v-model="formData.reserve_join_user_num"
name="reserve_join_user_num"
:rules="[{ required: true, message: '请填写' }]"
placeholder="请填写预约参加人数"
required
label="参加人数"></van-field>
<!-- <van-field v-model="formData.reserve_demand"-->
<!-- name="reserve_demand"-->
<!-- rows="1"-->
<!-- autosize-->
<!-- type="textarea"-->
<!-- :rules="[{ required: true, message: '请填写' }]"-->
<!-- placeholder="请填写预约场地需求"-->
<!-- required-->
<!-- label="场地需求"></van-field>-->
</van-cell-group>
<div style="margin: 16px;">
<van-button round block type="info" native-type="submit">提交</van-button>
</div>
</van-form>
<van-popup v-model="showTips" :style="{ height: '80%',width:'90%' }" round>
<div class="tips">
<div class="content">
<div style="padding: 0 20px">
<h4>职工之家场地预约</h4>
<h4>主管部门:校工会</h4>
<h3 style="text-align: center">欢迎使用《职工之家场地预约申请流程》服务!</h3>
<h4 style="font-weight: bold">流程说明:</h4>
<h4 style="font-weight: bold">
一、为提高职工之家场地使用效率,充分保障我校相关活动正常有序开展,特制订本管理规定。</h4>
<h4 style="font-weight: bold">
二、职工之家场地是服务于学校及各部门教职工重大会议及重要文化活动的重要场所,由校工会遵循“申请与统筹协调”相结合的原则统一调度与管理。</h4>
<h4 style="font-weight: bold">三、场地管理</h4>
<div style="padding-left: 30px;">
<h4>
1.校工会现有场地3个,位于校工会一层。其中多功能厅座位80个,党员之家会议室座位20个,研讨室座位12个。</h4>
<h4>
2.职工之家场地的使用安排遵循校级活动优先的原则,兼顾院系活动。如无校级重大会议及活动安排,则按照预约时间顺序安排使用。</h4>
<h4>
3.校工会负责场地的使用协调、保障场地及设备日常维护;仅提供开水服务,会场布置(大屏设备调试等)及善后工作由各使用单位自行负责。</h4>
<h4>
4.各使用单位应负责参会人员在会场内的组织和管理工作,保证会后公共设施完好并物归原位,做好使用期间的安全防范等工作。</h4>
</div>
<h4 style="font-weight: bold">四、职工之家场地申请使用程序</h4>
<div style="padding-left: 30px;">
<h4>
1.使用单位至少提前两天使用南京体育学院信息门户中的“智慧工会系统”申请,经审批通过后方可使用。</h4>
<h4>
2.需要使用多媒体设备(电子大屏、音视频设备)的单位,请与信息化中心联系,并委派专人提前一天到校工会调试,校工会原则上不提供现场值守服务。</h4>
<h4>3.校工会对每次使用情况进行登记、检查与反馈。</h4>
</div>
<h4 style="font-weight: bold">
五、各单位、个人在会场时应自觉遵守以下要求,拒不执行者,校工会有权取消其使用资格。</h4>
<div style="padding-left: 30px;">
<h4>1.全场禁止吸烟,禁止餐饮。</h4>
<h4>
2.讲究卫生,禁止随地吐痰、乱丢垃圾;自觉维护良好的秩序,严禁大声喧哗;使用结束后应保持场地干净整洁,会议物品应及时清理。</h4>
<h4>
3.爱护场地内部的设备、设施、家具和陈设。使用后负责将物品摆放回原位并保证电子大屏及音响等多媒体设备完好,造成损坏须照价赔偿。</h4>
<h4>
4.如需张贴会标、条幅,须按照管理人员要求在指定位置张贴悬挂,会后应及时拆除;因随意张贴损坏墙面等设施应给予修复或照价赔偿。</h4>
<h4>5.严禁使用礼花、喷雾、鞭炮等危险物品。</h4>
<h4>
6.遇到紧急或异常情况,使用单位应及时报告,并采取应急措施,积极配合有关部门做好善后处理工作。</h4>
</div>
<h4 style="font-weight: bold">六、本管理规定的解释权归校工会。</h4>
<h4 style="font-weight: bold">七、相关事项联系方式:</h4>
<div style="padding-left: 30px;">
<h4>多功能厅、研讨室使用咨询——校工会办公室</h4>
<h4>联系电话:84755127</h4>
<h4>党员之家会议室使用咨询——党委组织部、综合考核办公室</h4>
<h4>联系电话:84755117 </h4>
</div>
<br/>
</div>
</div>
<div class="button-wrap">
<van-button type="info" block @click="showTips=false">开始办理</van-button>
</div>
</div>
</van-popup>
<van-popup v-model="startTimePicker" position="bottom">
<van-datetime-picker
v-model="startTime"
type="datetime"
title="选择预约开始时间"
@confirm="onStartTimeConfirm"
@cancel="startTimePicker = false"
:min-date="startMinDate"
></van-datetime-picker>
</van-popup>
<van-popup v-model="endTimePicker" position="bottom">
<van-datetime-picker
v-model="endTime"
type="datetime"
title="选择预约结束时间"
@confirm="onEndTimeConfirm"
@cancel="endTimePicker = false"
:min-date="endMinDate"
></van-datetime-picker>
</van-popup>
<van-popup v-model="showSitePicker" position="bottom">
<van-picker
title="请选择需要预约的场地"
show-toolbar
:columns="siteColumns"
@confirm="onSiteConfirm"
@cancel="showSitePicker = false">
<template #option="option">
<div style="display: flex; flex-direction: column; align-items: center;">
<div>{{ option.name }}</div>
</div>
</template>
</van-picker>
</van-popup>
</div>
</div>
<script>
var vue = new Vue({
el: '#app',
mixins: [mobileMixins],
data() {
return {
showTips: true,
formData: {},
showSitePicker: false,
startTimePicker: false,
endTimePicker: false,
startTime: null,
endTime: null,
siteColumns: [],
showSiteUsage: false,
allSiteUsageInfo: {},
tabActive: null,
// startMinDate: moment().add(1, 'days').toDate(),
// endMinDate: moment().add(1, 'days').add(30, 'minute').toDate(),
startMinDate: moment().add(0, 'days').toDate(),
endMinDate: moment().add(0, 'days').add(30, 'minute').toDate(),
// endMaxDate: moment().add(2, 'days').toDate()
}
},
methods: {
async onSubmit(values) {
console.log(this.formData)
const resp = await $.get('/platform/activity/site/apply/checkApplyTime', {
time: this.formData.reserve_start_time,
endTime: this.formData.reserve_end_time,
siteId: this.formData.site_id
})
if (resp.code === 1) {
this.$toast(resp.msg)
this.formData.reserve_start_time = ''
this.formData.reserve_end_time = ''
return
}
const {site_name, reserve_start_time, reserve_end_time} = this.formData
this.$dialog.confirm({
title: '提示',
message: '您确定要提交' + site_name + '\n' + reserve_start_time + "\n至\n" + reserve_end_time + '\n的预约吗?',
}).then(async () => {
const loading = this.$toast.loading({
message: '提交中...',
forbidClick: true,
});
const {
data,
code,
msg
} = await $.post('/platform/activity/site/apply/insert', {"siteReserve": JSON.stringify(this.formData)})
loading.clear()
if (code === 0) {
this.$toast.success(msg)
setTimeout(() => {
location.href = '/mobile/activity/site/mine'
}, 500)
} else {
this.$toast.fail(msg)
}
}).catch(() => {
})
},
onStartTimeConfirm(time) {
const hours = time.getHours();
const minutes = time.getMinutes();
const day = time.getDay()
if (time.getFullYear() === 2024 && time.getMonth() === 3 && time.getDate() === 28){
} else if (day === 0 || day === 6){
this.$toast('周六周日预约不了喔')
return
}
// if (day === 0 || day === 6) {
// this.$toast('周六周日预约不了喔')
// return
// }
if (time.getFullYear() === 2024 && time.getMonth() === 2 && (time.getDate() === 14 || time.getDate() === 15)) {
this.$toast('由于2024年3月14,15两日开展教代会会议故无法申请该两天的场地。')
return
}
if (hours < 8 || (hours === 8 && minutes < 30)) {
this.$toast('请预约上午8点半之后的时间')
return
}
this.formData.reserve_start_time = moment(time).format('YYYY-MM-DD HH:mm:ss');
this.startTimePicker = false;
},
onEndTimeConfirm(time) {
if (!this.formData.reserve_start_time) {
this.$toast('请先选择预约开始时间')
return
}
const day = time.getDay()
const hours = time.getHours();
const minutes = time.getMinutes();
if (time.getFullYear() === 2024 && time.getMonth() === 3 && time.getDate() === 28){
} else if (day === 0 || day === 6){
this.$toast('周六周日预约不了喔')
return
}
// if (day === 0 || day === 6) {
// this.$toast('周六周日预约不了喔')
// return
// }
if (time.getFullYear() === 2024 && time.getMonth() === 2 && (time.getDate() === 14 || time.getDate() === 15)) {
this.$toast('由于2024年3月14,15两日开展教代会会议故无法申请该两天的场地。')
return
}
if (hours > 17 || (hours >= 17 && minutes > 0)) {
this.$toast('结束时间不能超过下午5点')
return
}
const isSameDay = moment(this.formData.reserve_start_time).isSame(moment(time), 'day')
if (!isSameDay) {
this.$toast('不能跨天预约喔')
return
}
this.formData.reserve_end_time = moment(time).format('YYYY-MM-DD HH:mm:ss');
this.endTimePicker = false;
},
onSiteConfirm(value, index) {
this.$set(this.formData, 'site_name', value.name)
this.$set(this.formData, 'site_id', value.id)
this.showSitePicker = false
},
async listSite() {
const {data} = await $.get(loc() + '/listSite')
this.siteColumns = data
},
async applyUserInfo() {
const {data} = await $.get('/platform/activity/site/apply/applyUserInfo')
this.$set(this.formData, 'reserve_person_id', data.reserve_person_id)
this.$set(this.formData, 'reserve_person_username', data.reserve_person_username)
this.$set(this.formData, 'reserve_person_loginname', data.reserve_person_loginname)
this.$set(this.formData, 'reserve_person_sex', data.reserve_person_sex)
this.$set(this.formData, 'reserve_person_phone', data.reserve_person_phone)
this.$set(this.formData, 'reserve_person_unitname', data.reserve_person_unitname)
this.$set(this.formData, 'reserve_person_unionname', data.reserve_person_unionname)
this.$set(this.formData, 'reserve_person_unionid', data.reserve_person_unionid)
},
async init() {
const id = GetQueryString('id')
if (id) {
} else {
await this.applyUserInfo()
}
},
async allSiteUsage() {
const {data} = await $.get('/platform/activity/site/apply/allSiteUsage')
this.allSiteUsageInfo = data
}
},
created() {
this.listSite()
this.allSiteUsage()
this.init()
}
})
</script>
<!--#
}
#-->