harrybomrah
/
property_hire
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added add hire page for the backend and few bug fixes

This commit is contained in:
rulingcom 2025-01-17 21:21:32 +08:00
parent 7fc2694054
commit ee8d97081f
11 changed files with 991 additions and 945 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/controllers/admin/property_hires_controller.rb
View File

@ -60,6 +60,14 @@ class Admin::PropertyHiresController < OrbitAdminController
def edit_hire
@phire = PHire.find(params[:id])
end
def add_hire
@property = Property.find(params[:id])
@phire = @property.p_hires.new
end
def memberdetails
member = MemberProfile.find(params[:userid])
render :json => {"email" => member.email, "name" => member.name, "phone" => member.mobile_no}.to_json
end
def update_hire
@phire = PHire.find(params[:id])
@phire.update_attributes(phire_params)

2
app/controllers/property_hires_controller.rb
View File

@ -33,7 +33,7 @@ class PropertyHiresController < ApplicationController
"today" => t("property_hire.today"),
"day" => t("property_hire.day"),
"week" => t("property_hire.week"),
"month" => t("property_hire.month"),
"month" => t("property_hire._month"),
"language" => OrbitHelper.get_site_locale
},
"manage_booking_btn" => (OrbitHelper.current_user.nil? ? false : true),

973
app/views/admin/property_hires/_admin_hire.html.erb Normal file
View File

@ -0,0 +1,973 @@
<style type="text/css">
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.row{
margin-left: 0;
}
.form-group {
margin-bottom: 0.9375em;
clear: both;
}
@media (min-width:768px){
.modal-content {
-webkit-box-shadow: 0 0.3125em 0.9375em rgb(0 0 0 / 50%);
box-shadow: 0 0.3125em 0.9375em rgb(0 0 0 / 50%);
}
.col-sm-offset-2 {
margin-left: 16.66666667%;
}
.form-horizontal .control-label {
padding-top: 0.4375em;
margin-bottom: 0;
width: auto;
text-align: right;
}
[class*="col-sm"],[class*="col-md"]{
float: left;
position: relative;
min-height: 0.0625em;
padding-right: 0.9375em;
padding-left: 0.9375em;
}
.form-horizontal .col-sm-2 {
width: 16.66666667%;
}
.form-horizontal .col-sm-5 {
width: 41.66666667%;
}
.form-horizontal .col-sm-10 {
width: 83.33333333%;
}
.form-horizontal .col-md-4 > * {
padding: 0 0.5em;
}
.form-horizontal .col-md-8 > * {
padding: 0 1em;
}
.form-horizontal .col-md-4{
width: 33.3%;
}
.form-horizontal .col-md-8{
width: 66.6%;
}
}
.modal-content {
position: relative;
background-color: #fff;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 0.0625em solid #999;
border: 0.0625em solid rgba(0,0,0,.2);
border-radius: 0.375em;
outline: 0;
-webkit-box-shadow: 0 0.1875em 0.5625em rgb(0 0 0 / 50%);
box-shadow: 0 0.1875em 0.5625em rgb(0 0 0 / 50%);
}
.modal-header {
padding: 0.9375em;
border-bottom: 0.0625em solid #e5e5e5;
}
.modal-body {
position: relative;
padding: 0.9375em;
max-height: 400px;
overflow: initial;
}
.input-append{
font-size: 1em;
display: block;
}
</style>
<%= content_for :page_specific_css do %>
<% ["basic/bootstrap-datetimepicker.css","property_hire_fullcalendar.css","property_hire_calendar"].each do |css| %>
<%= stylesheet_link_tag css %>
<% end %>
<% end %>
<script src="/assets/validator.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Intl.DateTimeFormat,Intl.DateTimeFormat.~locale.en,Intl.NumberFormat.~locale.en"></script>
<script type="text/javascript" src="/assets/property_hire_fullcalendar.min.js"></script>
<script type="text/javascript" src="/assets/property_hire_calendar_frontend.js"></script>
<%
hire = @phire
property = @phire.property
%>
<% data = {"carousel_display_style"=>"width: #{property.carousel_image_width};"}
recover = true
allow_no_logins_user = false
calendar_type = property.calendar_type.to_i rescue 0
right_col = 12
label_col = 2
input_col = 10
if calendar_type == 0
right_col -= 7
label_col += 2
input_col -= 2
end
url = "admin"
all_day_settings = property.all_day_settings
%>
<style type="text/css">
.w-ba-banner{
position: relative;
}
ul.list-unstyled li {
list-style: none;
}
.s-annc__related-link-list, .s-annc__related-file-list{
display: inline-block;
}
#sec1{
float: left;
}
.btn-toolbar {
margin-top: 0;
}
.form-group .controls{
margin-left: 0;
}
@media (min-width: 1200px){
.col-lg-7{
width: 58.3%;
float: left;
}
.col-lg-5{
width: 41.7%;
float: left;
}
}
@media (min-width: 768px){
.form-horizontal .col-sm-4 {
width: 33.33333333%;
}
.form-horizontal .col-sm-8 {
width: 66.66666667%;
}
.form-horizontal .col-sm-2 {
width: 16.66666667%;
}
.form-horizontal .col-sm-10 {
width: 83.33333333%;
}
.form-horizontal .col-sm-offset-4 {
margin-left: 33.33%;
}
}
</style>
<style type="text/css">
.full-size-img img {
width: 100%;
}
.full-size-img {
width: 100%;
}
.s-annc__sub-img.pull-right {
margin-left: 2em;
}
.s-annc__sub-img.pull-left {
margin-right: 2em;
}
strong.carousel__description {
color: white;
}
.carousel_images{
<%=data["carousel_display_style"]%>
}
@media (max-width: 767px){
.carousel_images{
width: 100%;
}
}
.carousel_img_item{
display: none;
float: left;
}
.controlplay {
position: absolute;
right: 1em;
top: 3%;
z-index: 200;
}
.controlplay a {
display: inline-block;
margin-right: 0.25em;
cursor: pointer;
padding: 5px 10px;
border: 1px solid rgba(255,255,255,0.5);
background: rgba(0,0,0,0.2);
}
.controlplay a i {
font-family: FontAwesome;
position: relative;
font-size: 1rem;
line-height: 1;
color: #FFF;
vertical-align: middle;
font-style: unset;
}
.controlplay .resume-slide i::before {
content: "\f04b";
}
.controlplay .pause-slide i::before {
content: "\f04c";
}
ul.button-mid .prev-button {
transition: 0.4s;
position: relative;
float: left;
left: 0.5rem;
width: 2.5rem;
height: 2.5rem;
font-size: 2.2rem;
color: #ffffff;
background: rgba(0,0,0,0.2);
text-align: center;
line-height: 2.5rem;
top: 50%;
position: absolute;
transform: translateY(-50%);
z-index: 999;
}
ul.button-mid .next-button {
float: right;
transition: 0.4s;
position: relative;
right: 0.5rem;
width: 2.5rem;
height: 2.5rem;
font-size: 2.2rem;
color: #fff;
background: rgba(0,0,0,0.2);
text-align: center;
line-height: 2.5rem;
top: 50%;
position: absolute;
transform: translateY(-50%);
z-index: 999;
}
.carousel_images_slide{
padding: 3em;
}
.carousel_img_item img{
cursor: pointer;
}
@media (max-width: 479px){
.carousel_img_item:nth-child(-n+1){
display: block;
width: 100%;
float: left;
}
.carousel_img_item{
width: 100%;
}
}
@media (min-width: 480px){
.carousel_img_item:nth-child(-n+2){
display: block;
width: 50%;
float: left;
}
.carousel_img_item{
width: 50%;
}
}
@media (min-width: 768px){
.carousel_img_item:nth-child(-n+3){
display: block;
width: 33%;
float: left;
}
.carousel_img_item{
width: 33%;
}
}
@media (min-width: 1280px){
.carousel_img_item:nth-child(-n+4){
display: block;
width: 25%;
float: left;
}
.carousel_img_item{
width: 25%;
}
}
form#hire_form .form-group input,form#hire_form .form-group select, form#hire_form .form-group textarea{
min-width: 100%;
max-width: 300px;
}
form#hire_form .form-group input[name="_rucaptcha"], form#hire_form .form-group input[type="submit"], form#hire_form .form-group input[type="radio"], form#hire_form .form-group input[type="checkbox"]{
width: auto;
min-width: auto;
position: relative;
margin-left: 0;
}
form#hire_form .form-control {
display: block;
width: 100%;
height: auto;
padding: 0.375em 1.125em;
font-size: 0.875em;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 0.0625em solid #ccc;
border-radius: 0.25em;
-webkit-box-shadow: inset 0 0.0625em 0.0625em rgb(0 0 0 / 8%);
box-shadow: inset 0 0.0625em 0.0625em rgb(0 0 0 / 8%);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.form-horizontal .form-group {
margin-bottom: 0.9375em;
display: inline-block;
width: 100%;
}
</style>
<% if !property.can_be_hired_frontend %>
<script type="text/javascript">
alert("This property is unavailable for hire.");
window.location.href = "<%= "/" + I18n.locale.to_s + url %>";
</script>
<% end %>
<% if !allow_no_logins_user && current_user.nil? %>
<script type="text/javascript">
alert("Please login before you hire.");
window.location.href = "<%= "/" + I18n.locale.to_s + url %>";
</script>
<% else %>
<script type="text/javascript">
var pick_date_mode = <%=property.set_availability%>;
</script>
<h3 class="property_title"><%= property.title.html_safe %></h3>
<article class="s-annc s-property">
<section class="s-annc__post-wrap">
<% if property.display_img %>
<div class="s-annc__sub-img full-size-img">
<img src="<%=property.image.url%>" alt="<%=property.title%>">
<span class="s-annc__img_description"><%=property.title.html_safe%></span>
</div>
<% end %>
<h4 class="property_subtitle"><%= property.property_usage.html_safe %></h4>
<% property_carousel_images = property.property_carousel_images %>
<% if property_carousel_images.count != 0 %>
<div class="carousel_images">
<div class="w-ba-banner ba-banner-widget-1">
<div class="w-ba-banner__wrap cycle-slideshow"
data-list="property_carousel_images"
data-level="0"
data-cycle-slides=".property_carousel_slide"
data-cycle-log="false"
data-cycle-auto-height="0"
data-cycle-speed="300"
data-cycle-timeout="5000"
data-cycle-fx="fade"
data-pager-active-class="active-slide"
data-cycle-swipe=true
data-cycle-swipe-fx="scrollHorz"
>
<% property_carousel_images.each do |carousel_image| %>
<div class="w-ba-banner__slide property_carousel_slide"
data-cycle-title="{{description_text}}"
>
<img class="w-ba-banner__image banner-responsive" src="<%=carousel_image.file.url %>" alt="<%=carousel_image.description_text %>">
<div class="ad-overlay w-ad-banner__overlay property_carousel__overlay">
<p><strong class="carousel__description"><%=carousel_image.description %></strong></p>
</div>
<div class="transitionfade"></div>
</div>
<% end %>
</div>
<ul class="controlplay"><a class="resume-slide" title="<%=data["resume_btn_title"]%>"><i></i></a><a class="pause-slide" title="<%=data["pause_btn_title"]%>"><i></i></a></ul>
<ul class="button-mid">
<i class="fa fa-angle-left prev-button" aria-hidden="true" title="<%=data["prev_btn_title"]%>"></i>
<i class="fa fa-angle-right next-button" aria-hidden="true" title="<%=data["next_btn_title"]%>"></i>
</ul>
</div>
</div>
<% end %>
<div class="property_note"><%= property.note.html_safe %></div>
</section>
<ul class="s-property__related-wrap list-unstyled no-print">
<% if property.property_files.count != 0%>
<li class="s-annc__related-file s-property__related-file">
<i class="fa fa-fw fa-paperclip"></i>
<div class="s-annc__related-file-list s-property__related-file-list" data-list="property_files" data-level="0">
<% property.property_files.each do |property_file| %>
<a class="s-annc__flie-title s-property__flie-title btn btn-default btn-sm" href="<%=property_file.file.url %>" title="<%=property_file.title %>"><%=property_file.title %></a>
<% end %>
</div>
</li>
<% end %>
<% if property.property_links.count != 0%>
<li class="s-annc__related-link s-property__related-link">
<i class="fa fa-fw fa-link"></i>
<div class="s-annc__related-link-list s-property__related-link-list" data-list="bulletin_links" data-level="0">
<% property.property_links.each do |property_link| %>
<a class="s-annc__link-title s-property__link-title btn btn-default btn-sm" href="<%=property_link.url %>" target="_blank"><%=property_link.display_title %></a>
<% end %>
</div>
</li>
<% end %>
</ul>
<% if session["hire-save-msg"].present? %>
<div id="property-unavaialable-alert" class="alert alert-danger" role="alert"><b>Sorry! </b><span> <%= session["hire-save-msg"] %></span></div>
<script type="text/javascript">alert("<%= session["hire-save-msg"] %>")</script>
<% session.delete("hire-save-msg") %>
<% end %>
</article>
<% if property.calendar_type == 0 %>
<div id="orbit_calendar" class="col-lg-<%=12-right_col%>">
<div id="sec1">
<div class="btn-toolbar" id="navigation">
<div id="calendar-nav">
<div class="btn-group">
<button class="btn btn-default btn-sm" id="today_btn">Today</button>
</div>
</div>
</div>
<div class="form-inline" id="range_selection"></div>
</div>
<div id='sec3' class="btn-toolbar">
<div class="btn-group calendar_mode">
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" >day</button>
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" >week</button>
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" >month</button>
</div>
<button id="refresh_btn" class="btn btn-default btn-sm">
<i class="icons-cycle"></i>
</button>
</div>
<div class="pull-right">
<button class="btn btn-default btn-sm" id="prev_month_btn">
<i class="icon-chevron-left"></i>
</button>
<button class="btn btn-default btn-sm" id="next_month_btn">
<i class="icon-chevron-right"></i>
</button>
</div>
<div class="clearfix"></div>
<div id="view_holder">
<h3 id="current_title" class="current_day_title"></h3>
<div id="calendar"></div>
<div id="calendar_agenda"></div>
</div>
<div id="calendar-loading"></div>
<div id="hidden_timepicker" class="hide">
<span id="hidden_title" class="pull-left" style="margin-right: 1em;font-weight: bold;"></span>
<div style="display: grid;">
<span id="hidden_date" class="pull-left" style="margin-right: 1em;"></span>
<%= fields_for :timepicker do |f|%>
<%= f.time_picker :timepicker, :no_label => true, :new_record => hire.new_record? && !recover,:format=>"HH:mm", :class => "pull-left", :data=>{"picker-type" => "range", "range" => "end", "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<% end %>
<div class="pull-left btn-group" style="margin-top: 0.5em;">
<button id="confirm_date" class="btn btn-primary btn-sm" style="margin-right: 0.5em;" onclick="set_datetimepicker()"><%=t("property_hire.confirm")%></button>
<button id="cancel_date" class="btn btn-primary btn-sm" onclick="goto_calendar()"><%=t("property_hire.cancel")%></button>
</div>
</div>
<div style="clear: both;"></div>
<hr>
</div>
</div>
<div id="event_quick_view" class="modal" style="width: 300px; display:none; margin:0 0 0 0;"></div>
<script type="text/javascript">
var property_id = "<%= property.id.to_s %>";
var calendar = new Calendar("#calendar",property_id);
function pick_hire_date(date,allow_times){
if(window.processing_hire)
return;
window.processing_hire = true;
try{
var date_target = $("#date_target_block").find("input");
var offset = date_target.offset();
if(date_target.val() == date){
scrollTo(0,offset.top - 40);
return;
}
$("#date_target_block").find("input").val(date);
var select_target;
if($("#hire_time_range_block").find("select").length == 0){
select_target = $("<select name=\""+$("#hire_time_range_block").find("input").attr("name")+"\"></select>");
$("#hire_time_range_block").find("input").remove();
}
else{
select_target = $("#hire_time_range_block").find("select").eq(0);
}
select_target = select_target.empty();
select_target.append("<option value=\"\"><%=t("property_hire.please_select")%></option>");
allow_times.forEach(function(allow_time){
select_target.append("<option value=\""+allow_time[2]+"\">"+allow_time[3]+"</option>");
});
select_target.appendTo($("#hire_time_range_block"));
scrollTo(0,offset.top - 40);
}catch(e){};
window.processing_hire = false;
}
function change_pick(target){
if( $(target).attr("id") == "pick_recurring_end_date"){
if($('#p_hire_recurring_interval').val() == ""){
alert("<%=t("property_hire.please_select_recurring_interval")%>");
$('#p_hire_recurring_interval').focus();
return;
}
$("#calendar").data("recurring_interval", $('#p_hire_recurring_interval').val());
}
$("#hidden_timepicker").addClass("hide");
$("#calendar").data("target","#"+$(target).attr("id"));
$("#calendar").data("title", $(target).parents(".col-sm-10").prev("label").text().replace("*",""));
$("#calendar").addClass("active_picker");
goto_calendar();
}
$("#calendar").on("select_time",function(ev,date_str){
$("#hidden_date").text(date_str);
$("#hidden_title").text($("#calendar").data("title"));
$('#hidden_timepicker .time_picker').addClass("pull-left");
$("#hidden_timepicker").removeClass("hide");
var target = $('#timepicker');
var window_width = $(window).width();
var window_height = $(window).height();
var target_offset = target.offset();
scrollTo(target_offset.left - window_width / 2, target_offset.top - window_height / 2);
$('#timepicker').trigger('focus');
})
$("#calendar").on("init_time",function(ev,time_str){
$('#timepicker').val(time_str);
})
function set_datetimepicker(){
var date_time = $("#hidden_date").text() + " " + $('#timepicker').val();
var start_date, end_date, interval = null, recurring_end_date = null;
var target = $("#calendar").data("target");
if(target == "#pick_start_date"){
start_date = date_time;
end_date = $("#p_hire_end_time").val();
}else if(target == "#pick_end_date"){
end_date = date_time;
start_date = $("#p_hire_start_time").val();
}else if(target == "#pick_recurring_end_date"){
if(pick_date_mode){
start_date = $("#p_hire_date").val();
end_date = start_date;
}else{
start_date = $("#p_hire_start_time").val();
end_date = $("#p_hire_end_time").val();
}
interval = $("#p_hire_recurring_interval").val();
recurring_end_date = date_time;
}
end_date = (end_date == "" ? null : end_date);
start_date = (start_date == "" ? null : start_date);
if(start_date != null && end_date != null && $("#p_hire_start_time").val() != "" && $("#p_hire_end_time").val() != ""){
if(start_date > end_date){
if(target == "#pick_start_date"){
end_date = start_date.split(" ")[0] + " " + end_date.split(" ")[1];
$("#p_hire_end_time").val(end_date);
}else{
start_date = end_date.split(" ")[0] + " " + start_date.split(" ")[1];
$("#p_hire_start_time").val(start_date);
}
}
}
var check_only = (start_date == null || end_date == null);
if(check_available(start_date,end_date,interval,recurring_end_date,check_only)){
var target = $($("#calendar").data("target"));
target.prev().find("input").val(date_time);
$("#hidden_timepicker").addClass("hide");
$("#calendar").removeClass("active_picker");
var window_width = $(window).width();
var window_height = $(window).height();
var target_offset = target.offset();
scrollTo(target_offset.left - window_width / 2, target_offset.top - window_height / 2);
}else{
if(window.check_message !== ""){
alert(window.check_message.replace(/<br>/g,"\n"));
}else{
alert('<%=t("property_hire.unavailability")%>');
}
}
}
function goto_calendar(){
$("#hidden_timepicker").addClass("hide");
var offset = $('#orbit_calendar').offset();
scrollTo(0,offset.top-40);
window.setTimeout(function(){
scrollTo(0,offset.top-40);
},500);
}
</script>
<% end %>
<div class="col-lg-<%=right_col%>">
<%= form_for hire, :url => "/xhr/property_hires/make_booking", html: { class: "form-horizontal", id: "hire_form" } do |f| %>
<% if property.set_availability %>
<div class="form-group">
<%= f.label :date, "*"+t("property_hire.date"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>" id="date_target_block">
<% if calendar_type == 0 %>
<%= f.text_field :date, :value=>(recover ? f.object.date.to_s : t("property_hire.please_choose_date")),:readonly=>"",:onclick=>"goto_calendar()" %>
<% else %>
<%= f.datetime_picker :date, :no_label => true, :new_record => hire.new_record? && !recover ,:class => "pull-left", :picker_type => "date", :format=>"yyyy/MM/dd", :data=>{ "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<% end %>
</div>
</div>
<div class="form-group">
<%= f.label :time, "*"+t("property_hire.time"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>" id="hire_time_range_block">
<% property_day_setting = recover ? hire.property_day_setting : nil %>
<% if property_day_setting %>
<%= select_tag "#{f.object_name}[time]", options_for_select([[t("property_hire.please_select"),""],[property_day_setting.title,property_day_setting.id.to_s]],hire.property_day_setting_id), :required=>"required" %>
<% else %>
<% if property.calendar_type == 0 %>
<%= f.text_field :time, :value=>t("property_hire.please_choose_date"),:readonly=>"",:onclick=>"goto_calendar()" %>
<% else %>
<%= select_tag "#{f.object_name}[time]", options_for_select([[t("property_hire.please_choose_date"),""]]), :required=>"required" %>
<% end %>
<% end %>
</div>
</div>
<% else %>
<div class="form-group">
<%= f.label :start_time, "*"+t("property_hire.start_time"), :class => "col-sm-#{label_col} control-label" %>
<% if property.calendar_type == 0 %>
<div class="col-sm-<%=input_col%>">
<%= f.datetime_picker :start_time, :no_label => true, :new_record => hire.new_record? && !recover,:class => "pull-left", :data=>{"picker-type" => "range", "range" => "start", "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<button type="button" id="pick_start_date" onclick="change_pick(this)" class="btn btn-primary btn-sm pull-left" style="margin-left: 1em;"><%=t("property_hire.pick_from_calendar")%></button>
</div>
<% end %>
</div>
<div class="form-group">
<%= f.label :end_time, "*"+t("property_hire.end_time"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>">
<%= f.datetime_picker :end_time, :no_label => true, :new_record => hire.new_record? && !recover,:class => "pull-left", :data=>{"picker-type" => "range", "range" => "end", "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<button type="button" id="pick_end_date" onclick="change_pick(this)" class="btn btn-primary btn-sm pull-left" style="margin-left: 1em;"><%=t("property_hire.pick_from_calendar")%></button>
</div>
</div>
<% end %>
<!-- ############# recurring ############# -->
<div class="form-group">
<%= f.label :recurring, t("property_hire.recurring"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-1">
<%= f.check_box :recurring %>
</div>
</div>
<div id="recurring-block" <%= hire.recurring ? "" : "style=display:none;" %>>
<div class="form-group">
<%= f.label :recurring_interval, t("property_hire.recurring_interval"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-1">
<%= f.select :recurring_interval, PHire::INTERVALS.collect{|int| [t("property_hire.recurring_interval_types.#{int}"), int] }, {:prompt => t('property_hire.select_interval')}, {:data => {"fv-validation" => "requiredifrecurring;" , "fv-messages" => "Cannot be empty;"}} %>
</div>
</div>
<div class="form-group">
<%= f.label :recurring_end_date, "*"+t("property_hire.recurring_end_date"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>">
<%= f.datetime_picker :recurring_end_date, :no_label => true, :new_record => hire.new_record? && !recover, :class=>"pull-left", :data=>{"fv-validation" => "requiredifrecurring;", "fv-messages" => "Cannot be empty;"} %>
<% if calendar_type == 0 %>
<button type="button" id="pick_recurring_end_date" onclick="change_pick(this)" class="btn btn-primary btn-sm pull-left" style="margin-left: 1em;"><%=t("property_hire.pick_from_calendar")%></button>
<% end %>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-<%=label_col%> col-sm-<%=input_col%>">
<div id="property-avaialable-alert" style="margin-bottom: 5px; padding: 10px; display: none;<%#= 'display: none;' unless recover %>" class="alert alert-success" role="alert"><%=t("property_hire.this_property_is_available",:default=>"<b>Hooray! </b>This property is available.").html_safe%></div>
<div id="property-unavaialable-alert" style="margin-bottom: 5px; padding: 10px; display: none;" class="alert alert-danger" role="alert"><b>Sorry! </b><span> This property is available.</span></div>
<div id="values-alert" style="margin-bottom: 5px; padding: 10px; display: none;" class="alert alert-warning" role="alert">
<% hint1 = t("property_hire.please_select_recurring_interval_and_recurring_end_time",:default=>"") %>
<% if hint1 == ""%>
<b>Please! </b><span> Select an interval time and recurring event end date.</span>
<% else %>
<span><b><%=hint1%></b></span>
<% end %>
</div>
</div>
<% if property.set_unavailibility %>
<div class="col-sm-offset-<%=label_col%> col-sm-<%=input_col%>">
<b><%= t("property_hire.Unavailibility_Schedule") %></b>
<div>
<%= property.render_unavailable_message%>
</div>
</div>
<% end %>
</div>
<div class="form-group">
<label for="" class="col-sm-<%=label_col%> control-label"></label>
<div class="col-sm-<%=input_col%>">
<a href="/xhr/property_hires/check_availability" id="check-avail-btn" class="btn btn-primary"><%= t('property_hire.check_availibility') %></a>
<img style="display: none;" width="40" src="/assets/spin.gif" id="spinner" />
</div>
</div>
<div class="form-group">
<div class="content-box">
<%= render partial: 'admin/member_selects/email_selection_box', locals: {field: 'userid', email_members: []} %>
</div>
</div>
<% default_values = {"hiring_person_email" => ( current_user.member_profile.email rescue ""),
"hiring_person_number" => ( current_user.member_profile.mobile_no rescue ""),
"hiring_person_name" => ( current_user.name rescue "")
} %>
<% if recover
default_values = default_values.merge(Property::FIELDSNAME.map{|f| [f,hire.send(f)]}.to_h)
end %>
<%= f.hidden_field :hiring_person_id, :value => (current_user.member_profile.id.to_s rescue "") %>
<% custom_field_inputs = {} %>
<% custom_field_type = {"note_for_hire"=>"text_area"} %>
<% if(property.enable_notes_selector rescue false) %>
<% custom_field_inputs["note_for_hire"] = render(:partial=>"property_hires/notes_selector",:locals=>{:f=>f,:property=>property,:label_col=>label_col,:input_col=>input_col,:hire=>hire}) %>
<% end %>
<% fields_name = property.get_all_fields %>
<% has_p_hire_fields = property.p_hire_fields_enabled.count != 0
p_hire_fields = {}
if has_p_hire_fields
p_hire_fields = property.p_hire_fields_enabled.map{|rf| [rf.id.to_s,rf]}.to_h
end
%>
<% @form_index = 0 %>
<% fields_name.each do |field_name| %>
<% if has_p_hire_fields && field_name.include?("p_hire_fields") %>
<div class="form-group">
<% rf = p_hire_fields[field_name.sub("p_hire_fields.",'')] %>
<% next if rf.nil? %>
<%= rf.block_helper(property,@form_index,false,"p_hire",hire, rf.to_require,label_col) %>
</div>
<% @form_index = @form_index +1 %>
<% else %>
<% if(property[field_name]["enable"] == "1" rescue true) %>
<% required = (property[field_name]["required"] == "true" rescue false) %>
<% if custom_field_inputs[field_name] %>
<%= custom_field_inputs[field_name] %>
<% else %>
<div class="form-group">
<%= f.label field_name, (required ? "*" : "") + property.custom_text(field_name,"name"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>">
<% placeholder = property.custom_text(field_name,"placeholder") %>
<% if custom_field_type[field_name] %>
<%= f.send(custom_field_type[field_name], field_name , {:class => "form-control", :placeholder => placeholder, :value => default_values[field_name], :data => (required ? {"fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} : nil)}) %>
<% else %>
<%= f.text_field field_name, :class => "form-control", :placeholder => placeholder, :value => default_values[field_name], :data => (required ? {"fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} : nil) %>
<% end %>
</div>
</div>
<% end %>
<% end %>
<% end %>
<% end %>
<% if allow_no_logins_user && current_user.nil? %>
<!-- 驗證碼 -->
<div class="form-group">
<label for="note" class="col-sm-<%=label_col%> control-label"><%= t('property_hire.recaptcha.recaptcha') %></label>
<div class="col-sm-<%=input_col%>">
<%= gotcha_error %>
<%= gotcha %>
</div>
</div>
<% end %>
<div class="form-group">
<div class="col-sm-offset-<%=label_col%> col-sm-<%=input_col%>">
<% if f.object.id.present? %>
<%= f.hidden_field :id %>
<% end %>
<%= f.submit t("property_hire.save"), :class => "btn btn-primary" %>
<%= f.hidden_field :property_id, :value => property.id %>
<input type="hidden" name="url" value="<%= url %>" />
<input type="hidden" id="dates_validated" name="dates_validated" value="<%=recover ? 1 : 0 %>" data-fv-validation="checkForDates;" data-fv-messages="Please make sure first if dates are available.;">
</div>
</div>
<% end %>
</div>
<div class="clearfix"></div>
<div style="height: 50px;"></div>
<script type="text/javascript">
var property_id = "<%= property.id.to_s %>";
var timezone = (new Date().getTimezoneOffset() / -60).toString();
var all_day_settings = <%= all_day_settings.to_json.html_safe %>;
if(timezone[0] != "-"){
timezone = "+" + timezone;
}
$("#p_hire_date").on("change",function(){
var _this = $(this);
var date = new Date(_this.val());
if(date.getTime()){
var wday = date.getDay();
var select_target = $("#p_hire_time");
if(select_target.data("wday") == wday){
return;
}
select_target.empty();
select_target.data("wday",wday);
if(all_day_settings[wday]){
select_target.append("<option value=\"\"><%=t("property_hire.please_select")%></option>");
all_day_settings[wday].forEach(function(allow_time){
select_target.append("<option value=\""+allow_time[0]+"\">"+allow_time[1]+"</option>");
});
}else{
select_target.append("<option value=\"\"><%=t("property_hire.no_time_can_select",:default=>"No time can be selected!")%></option>");
}
}
})
var check_available = function(stime,etime,interval,recurring_end_date,check_only,property_id){
var el = $("#check-avail-btn"),
url = $("#check-avail-btn").attr("href"),
spinner = $("#spinner"),
time_setting_id = $("#hire_time_range_block select").val();
if(Number.isNaN(new Date(stime).getDate())){
window.check_message = "<%=t("property_hire.please_choose_date")%>";
if(!check_only){
$("#property-unavaialable-alert").find("span").html(window.check_message);
$("#property-unavaialable-alert").show();
}
spinner.hide();
el.show();
return false;
}
if(time_setting_id == ""){
window.check_message = "<%=t("property_hire.please_select_time")%>";
if(!check_only){
$("#property-unavaialable-alert").find("span").html(window.check_message);
$("#property-unavaialable-alert").show();
}
$("#hire_time_range_block select").focus();
$("#hire_time_range_block select").css("border","2px solid red");
spinner.hide();
el.show();
return false;
}
stime = stime || etime;
etime = etime || stime;
property_id = property_id || window.property_id;
data = {
"stime": stime,
"etime": etime,
"property_id": property_id,
"locale": "<%=I18n.locale%>",
"timezone": timezone,
"time_setting_id": time_setting_id,
"phire_id": "<%=hire.id.to_s%>"
}
data["interval"] = interval;
data["recurring_end_date"] = recurring_end_date;
var flag = false;
window.check_message = "";
$.ajax({
"url" : url,
"type" : "get",
"data" : data,
"dataType" : "json",
"async": false
}).done(function(data){
if(data.success){
$("#dates_validated").val("1");
$("#property-unavaialable-alert").hide();
flag = true;
if(!check_only){
$("#property-avaialable-alert").show();
}
}else{
$("#dates_validated").val("0");
$("#property-avaialable-alert").hide();
window.check_message = data.msg;
window.check_message = window.check_message.replace(/{(.*)}/,function(v){
return getDateString(new Date(RegExp.$1),datetime_format,is_chinese);
})
if(!check_only){
$("#property-unavaialable-alert").find("span").html(window.check_message);
$("#property-unavaialable-alert").show();
}
}
spinner.hide();
el.show();
})
return flag;
}
$(document).on("change","#hire_time_range_block select",function(){
$(this).css("border","");
})
$("#check-avail-btn").on("click",function(){
var el = $(this),
url = $(this).attr("href"),
spinner = $("#spinner");
$(".alert").hide();
var stime, etime;
if(pick_date_mode){
stime = $("#p_hire_date").val();
etime = stime;
}else{
stime = $("#p_hire_start_time").val();
etime = $("#p_hire_end_time").val();
}
var interval = null, recurring_end_date = null, is_recurring = false;;
if($("#p_hire_recurring").is(":checked")){
is_recurring = true;
interval = $("#p_hire_recurring_interval").val(),
recurring_end_date = $("#p_hire_recurring_end_date").val();
if(interval == "" || recurring_end_date == ""){
$("#values-alert").show();
return false;
}
}
spinner.show();
el.hide();
check_available(stime,etime,interval,recurring_end_date);
return false;
})
$("#unavailable-schedule").on("click",function(){
})
var hireForm = new FormValidator($("#hire_form"));
hireForm.validate_functions.checkForDates = function(value,element){
return value == "1";
}
hireForm.validate_functions.requiredifrecurring = function(value, element){
if($("#p_hire_recurring").is(":checked")){
return value != "";
}else{
return true;
}
}
$("#p_hire_recurring").on("click",function(){
$("#dates_validated").val("0");
$("#property-avaialable-alert").hide();
$("#property-unavaialable-alert").hide();
if($(this).is(":checked")){
$("#recurring-block").slideDown();
}else{
$("#recurring-block").slideUp();
}
})
</script>
<script type="text/javascript">
const targetNode = document.getElementById("selected_email_users");
const config = { attributes: true, childList: true, subtree: true };
const callback = (mutationList, observer) => {
console.log(mutationList);
for (const mutation of mutationList) {
if (mutation.type === "childList") {
var userid = $("#selected_email_users").find("input[type=hidden]:first").val();
if(userid != null){
$.ajax({
"url" : "<%= memberdetails_admin_property_hire_path(property.id) %>",
"data" : {"userid" : userid},
"type" : "get",
"dataType" : "json"
}).done(function (data) {
$("#p_hire_hiring_person_email").val(data.email);
$("#p_hire_hiring_person_name").val(data.name);
$("#p_hire_hiring_person_number").val(data.phone);
})
}
}
}
};
const observer = new MutationObserver(callback);
observer.observe(targetNode, config);
</script>
<% end %>

1
app/views/admin/property_hires/add_hire.html.erb Normal file
View File

@ -0,0 +1 @@
<%= render :partial => "admin_hire" %>

941
app/views/admin/property_hires/edit_hire.html.erb
View File

@ -1,940 +1 @@
<style type="text/css">
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.row{
margin-left: 0;
}
.form-group {
margin-bottom: 0.9375em;
clear: both;
}
@media (min-width:768px){
.modal-content {
-webkit-box-shadow: 0 0.3125em 0.9375em rgb(0 0 0 / 50%);
box-shadow: 0 0.3125em 0.9375em rgb(0 0 0 / 50%);
}
.col-sm-offset-2 {
margin-left: 16.66666667%;
}
.form-horizontal .control-label {
padding-top: 0.4375em;
margin-bottom: 0;
width: auto;
text-align: right;
}
[class*="col-sm"],[class*="col-md"]{
float: left;
position: relative;
min-height: 0.0625em;
padding-right: 0.9375em;
padding-left: 0.9375em;
}
.form-horizontal .col-sm-2 {
width: 16.66666667%;
}
.form-horizontal .col-sm-5 {
width: 41.66666667%;
}
.form-horizontal .col-sm-10 {
width: 83.33333333%;
}
.form-horizontal .col-md-4 > * {
padding: 0 0.5em;
}
.form-horizontal .col-md-8 > * {
padding: 0 1em;
}
.form-horizontal .col-md-4{
width: 33.3%;
}
.form-horizontal .col-md-8{
width: 66.6%;
}
}
.modal-content {
position: relative;
background-color: #fff;
-webkit-background-clip: padding-box;
background-clip: padding-box;
border: 0.0625em solid #999;
border: 0.0625em solid rgba(0,0,0,.2);
border-radius: 0.375em;
outline: 0;
-webkit-box-shadow: 0 0.1875em 0.5625em rgb(0 0 0 / 50%);
box-shadow: 0 0.1875em 0.5625em rgb(0 0 0 / 50%);
}
.modal-header {
padding: 0.9375em;
border-bottom: 0.0625em solid #e5e5e5;
}
.modal-body {
position: relative;
padding: 0.9375em;
max-height: 400px;
overflow: initial;
}
.input-append{
font-size: 1em;
display: block;
}
</style>
<%= content_for :page_specific_css do %>
<% ["basic/bootstrap-datetimepicker.css","property_hire_fullcalendar.css","property_hire_calendar"].each do |css| %>
<%= stylesheet_link_tag css %>
<% end %>
<% end %>
<script src="/assets/validator.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Intl.DateTimeFormat,Intl.DateTimeFormat.~locale.en,Intl.NumberFormat.~locale.en"></script>
<script type="text/javascript" src="/assets/property_hire_fullcalendar.min.js"></script>
<script type="text/javascript" src="/assets/property_hire_calendar_frontend.js"></script>
<%
hire = @phire
property = @phire.property
%>
<% data = {"carousel_display_style"=>"width: #{property.carousel_image_width};"}
recover = true
allow_no_logins_user = false
calendar_type = property.calendar_type.to_i rescue 0
right_col = 12
label_col = 2
input_col = 10
if calendar_type == 0
right_col -= 7
label_col += 2
input_col -= 2
end
url = "admin"
all_day_settings = property.all_day_settings
%>
<style type="text/css">
.w-ba-banner{
position: relative;
}
ul.list-unstyled li {
list-style: none;
}
.s-annc__related-link-list, .s-annc__related-file-list{
display: inline-block;
}
#sec1{
float: left;
}
.btn-toolbar {
margin-top: 0;
}
.form-group .controls{
margin-left: 0;
}
@media (min-width: 1200px){
.col-lg-7{
width: 58.3%;
float: left;
}
.col-lg-5{
width: 41.7%;
float: left;
}
}
@media (min-width: 768px){
.form-horizontal .col-sm-4 {
width: 33.33333333%;
}
.form-horizontal .col-sm-8 {
width: 66.66666667%;
}
.form-horizontal .col-sm-2 {
width: 16.66666667%;
}
.form-horizontal .col-sm-10 {
width: 83.33333333%;
}
.form-horizontal .col-sm-offset-4 {
margin-left: 33.33%;
}
}
</style>
<style type="text/css">
.full-size-img img {
width: 100%;
}
.full-size-img {
width: 100%;
}
.s-annc__sub-img.pull-right {
margin-left: 2em;
}
.s-annc__sub-img.pull-left {
margin-right: 2em;
}
strong.carousel__description {
color: white;
}
.carousel_images{
<%=data["carousel_display_style"]%>
}
@media (max-width: 767px){
.carousel_images{
width: 100%;
}
}
.carousel_img_item{
display: none;
float: left;
}
.controlplay {
position: absolute;
right: 1em;
top: 3%;
z-index: 200;
}
.controlplay a {
display: inline-block;
margin-right: 0.25em;
cursor: pointer;
padding: 5px 10px;
border: 1px solid rgba(255,255,255,0.5);
background: rgba(0,0,0,0.2);
}
.controlplay a i {
font-family: FontAwesome;
position: relative;
font-size: 1rem;
line-height: 1;
color: #FFF;
vertical-align: middle;
font-style: unset;
}
.controlplay .resume-slide i::before {
content: "\f04b";
}
.controlplay .pause-slide i::before {
content: "\f04c";
}
ul.button-mid .prev-button {
transition: 0.4s;
position: relative;
float: left;
left: 0.5rem;
width: 2.5rem;
height: 2.5rem;
font-size: 2.2rem;
color: #ffffff;
background: rgba(0,0,0,0.2);
text-align: center;
line-height: 2.5rem;
top: 50%;
position: absolute;
transform: translateY(-50%);
z-index: 999;
}
ul.button-mid .next-button {
float: right;
transition: 0.4s;
position: relative;
right: 0.5rem;
width: 2.5rem;
height: 2.5rem;
font-size: 2.2rem;
color: #fff;
background: rgba(0,0,0,0.2);
text-align: center;
line-height: 2.5rem;
top: 50%;
position: absolute;
transform: translateY(-50%);
z-index: 999;
}
.carousel_images_slide{
padding: 3em;
}
.carousel_img_item img{
cursor: pointer;
}
@media (max-width: 479px){
.carousel_img_item:nth-child(-n+1){
display: block;
width: 100%;
float: left;
}
.carousel_img_item{
width: 100%;
}
}
@media (min-width: 480px){
.carousel_img_item:nth-child(-n+2){
display: block;
width: 50%;
float: left;
}
.carousel_img_item{
width: 50%;
}
}
@media (min-width: 768px){
.carousel_img_item:nth-child(-n+3){
display: block;
width: 33%;
float: left;
}
.carousel_img_item{
width: 33%;
}
}
@media (min-width: 1280px){
.carousel_img_item:nth-child(-n+4){
display: block;
width: 25%;
float: left;
}
.carousel_img_item{
width: 25%;
}
}
form#hire_form .form-group input,form#hire_form .form-group select, form#hire_form .form-group textarea{
min-width: 100%;
max-width: 300px;
}
form#hire_form .form-group input[name="_rucaptcha"], form#hire_form .form-group input[type="submit"], form#hire_form .form-group input[type="radio"], form#hire_form .form-group input[type="checkbox"]{
width: auto;
min-width: auto;
position: relative;
margin-left: 0;
}
form#hire_form .form-control {
display: block;
width: 100%;
height: auto;
padding: 0.375em 1.125em;
font-size: 0.875em;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 0.0625em solid #ccc;
border-radius: 0.25em;
-webkit-box-shadow: inset 0 0.0625em 0.0625em rgb(0 0 0 / 8%);
box-shadow: inset 0 0.0625em 0.0625em rgb(0 0 0 / 8%);
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.form-horizontal .form-group {
margin-bottom: 0.9375em;
display: inline-block;
width: 100%;
}
</style>
<% if !property.can_be_hired_frontend %>
<script type="text/javascript">
alert("This property is unavailable for hire.");
window.location.href = "<%= "/" + I18n.locale.to_s + url %>";
</script>
<% end %>
<% if !allow_no_logins_user && current_user.nil? %>
<script type="text/javascript">
alert("Please login before you hire.");
window.location.href = "<%= "/" + I18n.locale.to_s + url %>";
</script>
<% else %>
<script type="text/javascript">
var pick_date_mode = <%=property.set_availability%>;
</script>
<h3 class="property_title"><%= property.title.html_safe %></h3>
<article class="s-annc s-property">
<section class="s-annc__post-wrap">
<% if property.display_img %>
<div class="s-annc__sub-img full-size-img">
<img src="<%=property.image.url%>" alt="<%=property.title%>">
<span class="s-annc__img_description"><%=property.title.html_safe%></span>
</div>
<% end %>
<h4 class="property_subtitle"><%= property.property_usage.html_safe %></h4>
<% property_carousel_images = property.property_carousel_images %>
<% if property_carousel_images.count != 0 %>
<div class="carousel_images">
<div class="w-ba-banner ba-banner-widget-1">
<div class="w-ba-banner__wrap cycle-slideshow"
data-list="property_carousel_images"
data-level="0"
data-cycle-slides=".property_carousel_slide"
data-cycle-log="false"
data-cycle-auto-height="0"
data-cycle-speed="300"
data-cycle-timeout="5000"
data-cycle-fx="fade"
data-pager-active-class="active-slide"
data-cycle-swipe=true
data-cycle-swipe-fx="scrollHorz"
>
<% property_carousel_images.each do |carousel_image| %>
<div class="w-ba-banner__slide property_carousel_slide"
data-cycle-title="{{description_text}}"
>
<img class="w-ba-banner__image banner-responsive" src="<%=carousel_image.file.url %>" alt="<%=carousel_image.description_text %>">
<div class="ad-overlay w-ad-banner__overlay property_carousel__overlay">
<p><strong class="carousel__description"><%=carousel_image.description %></strong></p>
</div>
<div class="transitionfade"></div>
</div>
<% end %>
</div>
<ul class="controlplay"><a class="resume-slide" title="<%=data["resume_btn_title"]%>"><i></i></a><a class="pause-slide" title="<%=data["pause_btn_title"]%>"><i></i></a></ul>
<ul class="button-mid">
<i class="fa fa-angle-left prev-button" aria-hidden="true" title="<%=data["prev_btn_title"]%>"></i>
<i class="fa fa-angle-right next-button" aria-hidden="true" title="<%=data["next_btn_title"]%>"></i>
</ul>
</div>
</div>
<% end %>
<div class="property_note"><%= property.note.html_safe %></div>
</section>
<ul class="s-property__related-wrap list-unstyled no-print">
<% if property.property_files.count != 0%>
<li class="s-annc__related-file s-property__related-file">
<i class="fa fa-fw fa-paperclip"></i>
<div class="s-annc__related-file-list s-property__related-file-list" data-list="property_files" data-level="0">
<% property.property_files.each do |property_file| %>
<a class="s-annc__flie-title s-property__flie-title btn btn-default btn-sm" href="<%=property_file.file.url %>" title="<%=property_file.title %>"><%=property_file.title %></a>
<% end %>
</div>
</li>
<% end %>
<% if property.property_links.count != 0%>
<li class="s-annc__related-link s-property__related-link">
<i class="fa fa-fw fa-link"></i>
<div class="s-annc__related-link-list s-property__related-link-list" data-list="bulletin_links" data-level="0">
<% property.property_links.each do |property_link| %>
<a class="s-annc__link-title s-property__link-title btn btn-default btn-sm" href="<%=property_link.url %>" target="_blank"><%=property_link.display_title %></a>
<% end %>
</div>
</li>
<% end %>
</ul>
<% if session["hire-save-msg"].present? %>
<div id="property-unavaialable-alert" class="alert alert-danger" role="alert"><b>Sorry! </b><span> <%= session["hire-save-msg"] %></span></div>
<script type="text/javascript">alert("<%= session["hire-save-msg"] %>")</script>
<% session.delete("hire-save-msg") %>
<% end %>
</article>
<% if property.calendar_type == 0 %>
<div id="orbit_calendar" class="col-lg-<%=12-right_col%>">
<div id="sec1">
<div class="btn-toolbar" id="navigation">
<div id="calendar-nav">
<div class="btn-group">
<button class="btn btn-default btn-sm" id="today_btn">Today</button>
</div>
</div>
</div>
<div class="form-inline" id="range_selection"></div>
</div>
<div id='sec3' class="btn-toolbar">
<div class="btn-group calendar_mode">
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" >day</button>
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" >week</button>
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" >month</button>
</div>
<button id="refresh_btn" class="btn btn-default btn-sm">
<i class="icons-cycle"></i>
</button>
</div>
<div class="pull-right">
<button class="btn btn-default btn-sm" id="prev_month_btn">
<i class="icon-chevron-left"></i>
</button>
<button class="btn btn-default btn-sm" id="next_month_btn">
<i class="icon-chevron-right"></i>
</button>
</div>
<div class="clearfix"></div>
<div id="view_holder">
<h3 id="current_title" class="current_day_title"></h3>
<div id="calendar"></div>
<div id="calendar_agenda"></div>
</div>
<div id="calendar-loading"></div>
<div id="hidden_timepicker" class="hide">
<span id="hidden_title" class="pull-left" style="margin-right: 1em;font-weight: bold;"></span>
<div style="display: grid;">
<span id="hidden_date" class="pull-left" style="margin-right: 1em;"></span>
<%= fields_for :timepicker do |f|%>
<%= f.time_picker :timepicker, :no_label => true, :new_record => hire.new_record? && !recover,:format=>"HH:mm", :class => "pull-left", :data=>{"picker-type" => "range", "range" => "end", "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<% end %>
<div class="pull-left btn-group" style="margin-top: 0.5em;">
<button id="confirm_date" class="btn btn-primary btn-sm" style="margin-right: 0.5em;" onclick="set_datetimepicker()"><%=t("property_hire.confirm")%></button>
<button id="cancel_date" class="btn btn-primary btn-sm" onclick="goto_calendar()"><%=t("property_hire.cancel")%></button>
</div>
</div>
<div style="clear: both;"></div>
<hr>
</div>
</div>
<div id="event_quick_view" class="modal" style="width: 300px; display:none; margin:0 0 0 0;"></div>
<script type="text/javascript">
var property_id = "<%= property.id.to_s %>";
var calendar = new Calendar("#calendar",property_id);
function pick_hire_date(date,allow_times){
if(window.processing_hire)
return;
window.processing_hire = true;
try{
var date_target = $("#date_target_block").find("input");
var offset = date_target.offset();
if(date_target.val() == date){
scrollTo(0,offset.top - 40);
return;
}
$("#date_target_block").find("input").val(date);
var select_target;
if($("#hire_time_range_block").find("select").length == 0){
select_target = $("<select name=\""+$("#hire_time_range_block").find("input").attr("name")+"\"></select>");
$("#hire_time_range_block").find("input").remove();
}
else{
select_target = $("#hire_time_range_block").find("select").eq(0);
}
select_target = select_target.empty();
select_target.append("<option value=\"\"><%=t("property_hire.please_select")%></option>");
allow_times.forEach(function(allow_time){
select_target.append("<option value=\""+allow_time[2]+"\">"+allow_time[3]+"</option>");
});
select_target.appendTo($("#hire_time_range_block"));
scrollTo(0,offset.top - 40);
}catch(e){};
window.processing_hire = false;
}
function change_pick(target){
if( $(target).attr("id") == "pick_recurring_end_date"){
if($('#p_hire_recurring_interval').val() == ""){
alert("<%=t("property_hire.please_select_recurring_interval")%>");
$('#p_hire_recurring_interval').focus();
return;
}
$("#calendar").data("recurring_interval", $('#p_hire_recurring_interval').val());
}
$("#hidden_timepicker").addClass("hide");
$("#calendar").data("target","#"+$(target).attr("id"));
$("#calendar").data("title", $(target).parents(".col-sm-10").prev("label").text().replace("*",""));
$("#calendar").addClass("active_picker");
goto_calendar();
}
$("#calendar").on("select_time",function(ev,date_str){
$("#hidden_date").text(date_str);
$("#hidden_title").text($("#calendar").data("title"));
$('#hidden_timepicker .time_picker').addClass("pull-left");
$("#hidden_timepicker").removeClass("hide");
var target = $('#timepicker');
var window_width = $(window).width();
var window_height = $(window).height();
var target_offset = target.offset();
scrollTo(target_offset.left - window_width / 2, target_offset.top - window_height / 2);
$('#timepicker').trigger('focus');
})
$("#calendar").on("init_time",function(ev,time_str){
$('#timepicker').val(time_str);
})
function set_datetimepicker(){
var date_time = $("#hidden_date").text() + " " + $('#timepicker').val();
var start_date, end_date, interval = null, recurring_end_date = null;
var target = $("#calendar").data("target");
if(target == "#pick_start_date"){
start_date = date_time;
end_date = $("#p_hire_end_time").val();
}else if(target == "#pick_end_date"){
end_date = date_time;
start_date = $("#p_hire_start_time").val();
}else if(target == "#pick_recurring_end_date"){
if(pick_date_mode){
start_date = $("#p_hire_date").val();
end_date = start_date;
}else{
start_date = $("#p_hire_start_time").val();
end_date = $("#p_hire_end_time").val();
}
interval = $("#p_hire_recurring_interval").val();
recurring_end_date = date_time;
}
end_date = (end_date == "" ? null : end_date);
start_date = (start_date == "" ? null : start_date);
if(start_date != null && end_date != null && $("#p_hire_start_time").val() != "" && $("#p_hire_end_time").val() != ""){
if(start_date > end_date){
if(target == "#pick_start_date"){
end_date = start_date.split(" ")[0] + " " + end_date.split(" ")[1];
$("#p_hire_end_time").val(end_date);
}else{
start_date = end_date.split(" ")[0] + " " + start_date.split(" ")[1];
$("#p_hire_start_time").val(start_date);
}
}
}
var check_only = (start_date == null || end_date == null);
if(check_available(start_date,end_date,interval,recurring_end_date,check_only)){
var target = $($("#calendar").data("target"));
target.prev().find("input").val(date_time);
$("#hidden_timepicker").addClass("hide");
$("#calendar").removeClass("active_picker");
var window_width = $(window).width();
var window_height = $(window).height();
var target_offset = target.offset();
scrollTo(target_offset.left - window_width / 2, target_offset.top - window_height / 2);
}else{
if(window.check_message !== ""){
alert(window.check_message.replace(/<br>/g,"\n"));
}else{
alert('<%=t("property_hire.unavailability")%>');
}
}
}
function goto_calendar(){
$("#hidden_timepicker").addClass("hide");
var offset = $('#orbit_calendar').offset();
scrollTo(0,offset.top-40);
window.setTimeout(function(){
scrollTo(0,offset.top-40);
},500);
}
</script>
<% end %>
<div class="col-lg-<%=right_col%>">
<%= form_for hire, :url => "/xhr/property_hires/make_booking", html: { class: "form-horizontal", id: "hire_form" } do |f| %>
<% if property.set_availability %>
<div class="form-group">
<%= f.label :date, "*"+t("property_hire.date"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>" id="date_target_block">
<% if calendar_type == 0 %>
<%= f.text_field :date, :value=>(recover ? f.object.date.to_s : t("property_hire.please_choose_date")),:readonly=>"",:onclick=>"goto_calendar()" %>
<% else %>
<%= f.datetime_picker :date, :no_label => true, :new_record => hire.new_record? && !recover ,:class => "pull-left", :picker_type => "date", :format=>"yyyy/MM/dd", :data=>{ "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<% end %>
</div>
</div>
<div class="form-group">
<%= f.label :time, "*"+t("property_hire.time"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>" id="hire_time_range_block">
<% property_day_setting = recover ? hire.property_day_setting : nil %>
<% if property_day_setting %>
<%= select_tag "#{f.object_name}[time]", options_for_select([[t("property_hire.please_select"),""],[property_day_setting.title,property_day_setting.id.to_s]],hire.property_day_setting_id), :required=>"required" %>
<% else %>
<% if property.calendar_type == 0 %>
<%= f.text_field :time, :value=>t("property_hire.please_choose_date"),:readonly=>"",:onclick=>"goto_calendar()" %>
<% else %>
<%= select_tag "#{f.object_name}[time]", options_for_select([[t("property_hire.please_choose_date"),""]]), :required=>"required" %>
<% end %>
<% end %>
</div>
</div>
<% else %>
<div class="form-group">
<%= f.label :start_time, "*"+t("property_hire.start_time"), :class => "col-sm-#{label_col} control-label" %>
<% if property.calendar_type == 0 %>
<div class="col-sm-<%=input_col%>">
<%= f.datetime_picker :start_time, :no_label => true, :new_record => hire.new_record? && !recover,:class => "pull-left", :data=>{"picker-type" => "range", "range" => "start", "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<button type="button" id="pick_start_date" onclick="change_pick(this)" class="btn btn-primary btn-sm pull-left" style="margin-left: 1em;"><%=t("property_hire.pick_from_calendar")%></button>
</div>
<% end %>
</div>
<div class="form-group">
<%= f.label :end_time, "*"+t("property_hire.end_time"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>">
<%= f.datetime_picker :end_time, :no_label => true, :new_record => hire.new_record? && !recover,:class => "pull-left", :data=>{"picker-type" => "range", "range" => "end", "fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} %>
<button type="button" id="pick_end_date" onclick="change_pick(this)" class="btn btn-primary btn-sm pull-left" style="margin-left: 1em;"><%=t("property_hire.pick_from_calendar")%></button>
</div>
</div>
<% end %>
<!-- ############# recurring ############# -->
<div class="form-group">
<%= f.label :recurring, t("property_hire.recurring"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-1">
<%= f.check_box :recurring %>
</div>
</div>
<div id="recurring-block" <%= hire.recurring ? "" : "style=display:none;" %>>
<div class="form-group">
<%= f.label :recurring_interval, t("property_hire.recurring_interval"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-1">
<%= f.select :recurring_interval, PHire::INTERVALS.collect{|int| [t("property_hire.recurring_interval_types.#{int}"), int] }, {:prompt => t('property_hire.select_interval')}, {:data => {"fv-validation" => "requiredifrecurring;" , "fv-messages" => "Cannot be empty;"}} %>
</div>
</div>
<div class="form-group">
<%= f.label :recurring_end_date, "*"+t("property_hire.recurring_end_date"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>">
<%= f.datetime_picker :recurring_end_date, :no_label => true, :new_record => hire.new_record? && !recover, :class=>"pull-left", :data=>{"fv-validation" => "requiredifrecurring;", "fv-messages" => "Cannot be empty;"} %>
<% if calendar_type == 0 %>
<button type="button" id="pick_recurring_end_date" onclick="change_pick(this)" class="btn btn-primary btn-sm pull-left" style="margin-left: 1em;"><%=t("property_hire.pick_from_calendar")%></button>
<% end %>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-<%=label_col%> col-sm-<%=input_col%>">
<div id="property-avaialable-alert" style="margin-bottom: 5px; padding: 10px;<%= 'display: none;' unless recover %>" class="alert alert-success" role="alert"><%=t("property_hire.this_property_is_available",:default=>"<b>Hooray! </b>This property is available.").html_safe%></div>
<div id="property-unavaialable-alert" style="margin-bottom: 5px; padding: 10px; display: none;" class="alert alert-danger" role="alert"><b>Sorry! </b><span> This property is available.</span></div>
<div id="values-alert" style="margin-bottom: 5px; padding: 10px; display: none;" class="alert alert-warning" role="alert">
<% hint1 = t("property_hire.please_select_recurring_interval_and_recurring_end_time",:default=>"") %>
<% if hint1 == ""%>
<b>Please! </b><span> Select an interval time and recurring event end date.</span>
<% else %>
<span><b><%=hint1%></b></span>
<% end %>
</div>
</div>
<% if property.set_unavailibility %>
<div class="col-sm-offset-<%=label_col%> col-sm-<%=input_col%>">
<b><%= t("property_hire.Unavailibility_Schedule") %></b>
<div>
<%= property.render_unavailable_message%>
</div>
</div>
<% end %>
</div>
<div class="form-group">
<label for="" class="col-sm-<%=label_col%> control-label"></label>
<div class="col-sm-<%=input_col%>">
<a href="/xhr/property_hires/check_availability" id="check-avail-btn" class="btn btn-primary"><%= t('property_hire.check_availibility') %></a>
<img style="display: none;" width="40" src="/assets/spin.gif" id="spinner" />
</div>
</div>
<% default_values = {"hiring_person_email" => ( current_user.member_profile.email rescue ""),
"hiring_person_number" => ( current_user.member_profile.mobile_no rescue ""),
"hiring_person_name" => ( current_user.name rescue "")
} %>
<% if recover
default_values = default_values.merge(Property::FIELDSNAME.map{|f| [f,hire.send(f)]}.to_h)
end %>
<%= f.hidden_field :hiring_person_id, :value => (current_user.member_profile.id.to_s rescue "") %>
<% custom_field_inputs = {} %>
<% custom_field_type = {"note_for_hire"=>"text_area"} %>
<% if(property.enable_notes_selector rescue false) %>
<% custom_field_inputs["note_for_hire"] = render(:partial=>"property_hires/notes_selector",:locals=>{:f=>f,:property=>property,:label_col=>label_col,:input_col=>input_col,:hire=>hire}) %>
<% end %>
<% fields_name = property.get_all_fields %>
<% has_p_hire_fields = property.p_hire_fields_enabled.count != 0
p_hire_fields = {}
if has_p_hire_fields
p_hire_fields = property.p_hire_fields_enabled.map{|rf| [rf.id.to_s,rf]}.to_h
end
%>
<% @form_index = 0 %>
<% fields_name.each do |field_name| %>
<% if has_p_hire_fields && field_name.include?("p_hire_fields") %>
<div class="form-group">
<% rf = p_hire_fields[field_name.sub("p_hire_fields.",'')] %>
<% next if rf.nil? %>
<%= rf.block_helper(property,@form_index,false,"p_hire",hire, rf.to_require,label_col) %>
</div>
<% @form_index = @form_index +1 %>
<% else %>
<% if(property[field_name]["enable"] == "1" rescue true) %>
<% required = (property[field_name]["required"] == "true" rescue false) %>
<% if custom_field_inputs[field_name] %>
<%= custom_field_inputs[field_name] %>
<% else %>
<div class="form-group">
<%= f.label field_name, (required ? "*" : "") + property.custom_text(field_name,"name"), :class => "col-sm-#{label_col} control-label" %>
<div class="col-sm-<%=input_col%>">
<% placeholder = property.custom_text(field_name,"placeholder") %>
<% if custom_field_type[field_name] %>
<%= f.send(custom_field_type[field_name], field_name , {:class => "form-control", :placeholder => placeholder, :value => default_values[field_name], :data => (required ? {"fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} : nil)}) %>
<% else %>
<%= f.text_field field_name, :class => "form-control", :placeholder => placeholder, :value => default_values[field_name], :data => (required ? {"fv-validation" => "required;", "fv-messages" => "Cannot be empty;"} : nil) %>
<% end %>
</div>
</div>
<% end %>
<% end %>
<% end %>
<% end %>
<% if allow_no_logins_user && current_user.nil? %>
<!-- 驗證碼 -->
<div class="form-group">
<label for="note" class="col-sm-<%=label_col%> control-label"><%= t('property_hire.recaptcha.recaptcha') %></label>
<div class="col-sm-<%=input_col%>">
<%= gotcha_error %>
<%= gotcha %>
</div>
</div>
<% end %>
<div class="form-group">
<div class="col-sm-offset-<%=label_col%> col-sm-<%=input_col%>">
<% if f.object.id.present? %>
<%= f.hidden_field :id %>
<% end %>
<%= f.submit t("property_hire.save"), :class => "btn btn-primary" %>
<%= f.hidden_field :property_id, :value => property.id %>
<input type="hidden" name="url" value="<%= url %>" />
<input type="hidden" id="dates_validated" name="dates_validated" value="<%=recover ? 1 : 0 %>" data-fv-validation="checkForDates;" data-fv-messages="Please make sure first if dates are available.;">
</div>
</div>
<% end %>
</div>
<div class="clearfix"></div>
<div style="height: 50px;"></div>
<script type="text/javascript">
var property_id = "<%= property.id.to_s %>";
var timezone = (new Date().getTimezoneOffset() / -60).toString();
var all_day_settings = <%= all_day_settings.to_json.html_safe %>;
if(timezone[0] != "-"){
timezone = "+" + timezone;
}
$("#p_hire_date").on("change",function(){
var _this = $(this);
var date = new Date(_this.val());
if(date.getTime()){
var wday = date.getDay();
var select_target = $("#p_hire_time");
if(select_target.data("wday") == wday){
return;
}
select_target.empty();
select_target.data("wday",wday);
if(all_day_settings[wday]){
select_target.append("<option value=\"\"><%=t("property_hire.please_select")%></option>");
all_day_settings[wday].forEach(function(allow_time){
select_target.append("<option value=\""+allow_time[0]+"\">"+allow_time[1]+"</option>");
});
}else{
select_target.append("<option value=\"\"><%=t("property_hire.no_time_can_select",:default=>"No time can be selected!")%></option>");
}
}
})
var check_available = function(stime,etime,interval,recurring_end_date,check_only,property_id){
var el = $("#check-avail-btn"),
url = $("#check-avail-btn").attr("href"),
spinner = $("#spinner"),
time_setting_id = $("#hire_time_range_block select").val();
if(Number.isNaN(new Date(stime).getDate())){
window.check_message = "<%=t("property_hire.please_choose_date")%>";
if(!check_only){
$("#property-unavaialable-alert").find("span").html(window.check_message);
$("#property-unavaialable-alert").show();
}
spinner.hide();
el.show();
return false;
}
if(time_setting_id == ""){
window.check_message = "<%=t("property_hire.please_select_time")%>";
if(!check_only){
$("#property-unavaialable-alert").find("span").html(window.check_message);
$("#property-unavaialable-alert").show();
}
$("#hire_time_range_block select").focus();
$("#hire_time_range_block select").css("border","2px solid red");
spinner.hide();
el.show();
return false;
}
stime = stime || etime;
etime = etime || stime;
property_id = property_id || window.property_id;
data = {
"stime": stime,
"etime": etime,
"property_id": property_id,
"locale": "<%=I18n.locale%>",
"timezone": timezone,
"time_setting_id": time_setting_id,
"phire_id": "<%=hire.id.to_s%>"
}
data["interval"] = interval;
data["recurring_end_date"] = recurring_end_date;
var flag = false;
window.check_message = "";
$.ajax({
"url" : url,
"type" : "get",
"data" : data,
"dataType" : "json",
"async": false
}).done(function(data){
if(data.success){
$("#dates_validated").val("1");
$("#property-unavaialable-alert").hide();
flag = true;
if(!check_only){
$("#property-avaialable-alert").show();
}
}else{
$("#dates_validated").val("0");
$("#property-avaialable-alert").hide();
window.check_message = data.msg;
window.check_message = window.check_message.replace(/{(.*)}/,function(v){
return getDateString(new Date(RegExp.$1),datetime_format,is_chinese);
})
if(!check_only){
$("#property-unavaialable-alert").find("span").html(window.check_message);
$("#property-unavaialable-alert").show();
}
}
spinner.hide();
el.show();
})
return flag;
}
$(document).on("change","#hire_time_range_block select",function(){
$(this).css("border","");
})
$("#check-avail-btn").on("click",function(){
var el = $(this),
url = $(this).attr("href"),
spinner = $("#spinner");
$(".alert").hide();
var stime, etime;
if(pick_date_mode){
stime = $("#p_hire_date").val();
etime = stime;
}else{
stime = $("#p_hire_start_time").val();
etime = $("#p_hire_end_time").val();
}
var interval = null, recurring_end_date = null, is_recurring = false;;
if($("#p_hire_recurring").is(":checked")){
is_recurring = true;
interval = $("#p_hire_recurring_interval").val(),
recurring_end_date = $("#p_hire_recurring_end_date").val();
if(interval == "" || recurring_end_date == ""){
$("#values-alert").show();
return false;
}
}
spinner.show();
el.hide();
check_available(stime,etime,interval,recurring_end_date);
return false;
})
$("#unavailable-schedule").on("click",function(){
})
var hireForm = new FormValidator($("#hire_form"));
hireForm.validate_functions.checkForDates = function(value,element){
return value == "1";
}
hireForm.validate_functions.requiredifrecurring = function(value, element){
if($("#p_hire_recurring").is(":checked")){
return value != "";
}else{
return true;
}
}
$("#p_hire_recurring").on("click",function(){
$("#dates_validated").val("0");
$("#property-avaialable-alert").hide();
$("#property-unavaialable-alert").hide();
if($(this).is(":checked")){
$("#recurring-block").slideDown();
}else{
$("#recurring-block").slideUp();
}
})
</script>
<% end %>
<%= render :partial => "admin_hire" %>

1
app/views/admin/property_hires/show.html.erb
View File

@ -139,6 +139,7 @@
</table>
<div class="bottomnav clearfix">
<a href="<%= admin_property_hires_path %>" class="btn btn-warning">Back</a>
<a href="<%= add_hire_admin_property_hire_path(@property.id) %>" class="btn btn-success pull-right"><%= t("property_hire.admin_reserve") %></a>
<%= content_tag(:div, paginate(@bookings), class: "pagination pagination-centered") %>
</div>
<% end %>

2
app/views/property_hires/hire.html.erb
View File

@ -283,7 +283,7 @@
<div class="btn-group calendar_mode">
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" ><%= t("property_hire.day") %></button>
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" ><%= t("property_hire.week") %></button>
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" ><%= t("property_hire.month") %></button>
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" ><%= t("property_hire._month") %></button>
</div>
<button id="refresh_btn" class="btn btn-default btn-sm">
<i class="icons-cycle"></i>

2
app/views/property_hires/view_calendar.html.erb
View File

@ -35,7 +35,7 @@
<div class="btn-group calendar_mode">
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" ><%= t("property_hire.day") %></button>
<button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" ><%= t("property_hire.week") %></button>
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" ><%= t("property_hire.month") %></button>
<button class="btn btn-default active mode_switch btn-sm" data-mode="dayGridMonth" ><%= t("property_hire._month") %></button>
</div>
<button id="refresh_btn" class="btn btn-default btn-sm">
<i class="icons-cycle"></i>

2
config/locales/en.yml
View File

@ -208,8 +208,8 @@ en:
today: Today
day: Day
week: Week
month: Month
all_properties: All Properties
export_reservation_data: Export data
for_label: For Label
property_color: Property color
admin_reserve: Reserve

2
config/locales/zh_tw.yml
View File

@ -230,7 +230,7 @@ zh_tw:
today: 今天
day: 日模式
week: 週模式
month: 月模式
admin_reserve: 預約
all_properties: All Properties
export_reservation_data: Export data
for_label: For Label

2
config/routes.rb
View File

@ -18,6 +18,8 @@ Rails.application.routes.draw do
get "pass_booking"
delete "delete_booking_details"
get "edit_hire"
get "add_hire"
get "memberdetails"
patch "update_hire"
get "custom_fields"
get "fields_display_order"