Patrick
/
acaresydney_ts
Следить 1
В избранное 0
Форкнуть 0
Код Задачи 0 Pull Request'ы 0 Релизы 0 Вики Активность
Просмотр исходного кода

has date picker field for boundary dates

master
patrick 6 лет назад
Родитель
ca1972f5cc
Сommit
f3361ab0f6
5 измененных файлов: 491 добавлений и 183 удалений
Единый вид
Diff Options
Show Stats Download Patch File Download Diff File
  1. +213
    -168
      css/bts_timesheet.css
  2. +195
    -0
      html/timesheet.html
  3. +71
    -13
      js/bts_timesheet.js
  4. +6
    -1
      js/feedback_card.js
  5. +6
    -1
      ts.php

+ 213
- 168
css/bts_timesheet.css Просмотреть файл

overflow: hidden; overflow: hidden;
} }


.bts_hidden{
z-index: -1;
.bts_hidden {
z-index: -1;
} }


.blink_me { .blink_me {
animation: blinker 0.3s linear infinite;
animation: blinker 0.3s linear infinite;
} }


@keyframes blinker {
50% { opacity: 0; }
@keyframes blinker {
50% {
opacity: 0;
}
} }


.titlebar_gradient { .titlebar_gradient {
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6e6b4', endColorstr='#ed9017',GradientType=0 ); /* IE6-9 */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6e6b4', endColorstr='#ed9017',GradientType=0 ); /* IE6-9 */
} }



.sheettitle h1:hover{
text-decoration: underline;
font-weight: bolder;
cursor: pointer;
animation: blinker 1s linear infinite;
.sheettitle h1:hover {
text-decoration: underline;
font-weight: bolder;
cursor: pointer;
animation: blinker 1s linear infinite;
} }


.timesheets { .timesheets {
} }


.timesheets .workspace img { .timesheets .workspace img {
display: block;
margin-top: 140px;
margin-left:auto;
margin-right:auto;
display: block;
margin-top: 140px;
margin-left: auto;
margin-right: auto;
} }



.timesheets .statusbar { .timesheets .statusbar {
position: relative; position: relative;
height: 40px; height: 40px;
height: calc(100vh - 80px); height: calc(100vh - 80px);
background-color: dimgrey; background-color: dimgrey;
overflow: hidden; overflow: hidden;
text-align: center;
text-align: center;

/* scroll-behavior: smooth; */ /* scroll-behavior: smooth; */
} }


} }


.statusbar .wifi i, .statusbar .wifi i,
.statusbar .xero i {
.statusbar .xero i,
.statusbar .csv i {
font-size: 20px; font-size: 20px;
color: red; color: red;
position: absolute; position: absolute;
width: 40px; width: 40px;
height: 100%; height: 100%;
margin-left: 0px; margin-left: 0px;
margin-right: 100px;
margin-right: 5px;
display: inline-block; display: inline-block;
background-color: white; background-color: white;
box-shadow: inset 0px 0px 2px black; box-shadow: inset 0px 0px 2px black;
box-shadow: 0px 0px 10px white; box-shadow: 0px 0px 10px white;
} }


.statusbar .csv {
width: 40px;
height: 100%;
margin-left: 0px;
margin-right: 5px;
display: inline-block;
background-color: white;
box-shadow: inset 0px 0px 2px black;
border-radius: 100px;
background-image: url(http://acaresydney.com.au/wp-content/uploads/2019/08/csv.png);
background-size: 40px;
box-shadow: 0px 0px 10px white;
}

.statusbar .xero:hover, .statusbar .xero:hover,
.statusbar .wifi:hover {
.statusbar .wifi:hover,
.statusbar .csv:hover {
box-shadow: 0px 0px 3px black; box-shadow: 0px 0px 3px black;
} }


display: inline-block; display: inline-block;
position: absolute; position: absolute;
right: 220px; right: 220px;
} }

.statusbar #woh:hover { .statusbar #woh:hover {
cursor: pointer;
animation: blinker 0.3s linear infinite;
cursor: pointer;
animation: blinker 0.3s linear infinite;
} }

.workinghours label { .workinghours label {
transform: unset; transform: unset;
left: 0; left: 0;
div.prevweek span:hover, div.prevweek span:hover,
div.nextweek span:hover { div.nextweek span:hover {
box-shadow: 1px 1px 10px black; box-shadow: 1px 1px 10px black;
border-radius: 20px;
color: black;
border-radius: 20px;
color: black;
} }


div.nextweek { div.nextweek {


div.weekly div.weekname { div.weekly div.weekname {
position: relative; position: relative;
width: 130px;
width: 170px;
top: -5px; top: -5px;
border: 2px solid grey; border: 2px solid grey;
border-radius: 10px; border-radius: 10px;
text-align: center; text-align: center;
color: white;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,28343b+100;Grey+Black+3D */
background: rgb(181,189,200); /* Old browsers */
background: -moz-linear-gradient(top, rgba(181,189,200,1) 0%, rgba(130,140,149,1) 36%, rgba(40,52,59,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=0 ); /* IE6-9 */
color: white;

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,28343b+100;Grey+Black+3D */
background: rgb(181,189,200); /* Old browsers */
background: -moz-linear-gradient(top, rgba(181,189,200,1) 0%, rgba(130,140,149,1) 36%, rgba(40,52,59,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=0 ); /* IE6-9 */
}

div.weekly div.weekname input{
width: 80px;
height: 20px;
border:0px;
background-color:transparent;
color: white;
padding-left:4px;
padding-right:4px;
} }


div.weekly div.weekname.prev { div.weekly div.weekname.prev {
} }


div.weekly >div.weekname:hover, div.weekly >div.weekname:hover,
div.weekly div[name='copyschedule']:hover
{
cursor: pointer;
box-shadow: 0px 0px 10px #2c87f0;
div.weekly div[name='copyschedule']:hover {
cursor: pointer;
box-shadow: 0px 0px 10px #2c87f0;
} }


div.weekly div.copyprogress { div.weekly div.copyprogress {
top: 0px; top: 0px;
border-radius: 2px; border-radius: 2px;
box-shadow: inset 1px 1px 2px black; box-shadow: inset 1px 1px 2px black;
text-align:center;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fefcea+0,f1da36+100;Gold+3D */
background: rgb(254,252,234); /* Old browsers */
background: -moz-linear-gradient(top, rgba(254,252,234,1) 0%, rgba(241,218,54,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 ); /* IE6-9 */
text-align: center;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fefcea+0,f1da36+100;Gold+3D */
background: rgb(254,252,234); /* Old browsers */
background: -moz-linear-gradient(top, rgba(254,252,234,1) 0%, rgba(241,218,54,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 ); /* IE6-9 */
} }


div.copyprogress div[name='copyschedule'] { div.copyprogress div[name='copyschedule'] {
position: relative; position: relative;
top: -5px; top: -5px;
width: 100px;
width: 150px;
height: 25px; height: 25px;
padding: 0px; padding: 0px;
border-radius: 10px; border-radius: 10px;
margin: auto;
z-index: 1;
color: white;


margin:auto;
z-index:1;
color: white;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,28343b+100;Grey+Black+3D */
background: rgb(181,189,200); /* Old browsers */
background: -moz-linear-gradient(top, rgba(181,189,200,1) 0%, rgba(130,140,149,1) 36%, rgba(40,52,59,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=0 ); /* IE6-9 */
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,28343b+100;Grey+Black+3D */
background: rgb(181,189,200); /* Old browsers */
background: -moz-linear-gradient(top, rgba(181,189,200,1) 0%, rgba(130,140,149,1) 36%, rgba(40,52,59,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=0 ); /* IE6-9 */
}

#gotoweek {
width: 50%;
background-color: transparent;
border: 0px;
color: white;
font-weight: 900;
} }


div.weekdays { div.weekdays {
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
} }

div.week1:hover, div.week1:hover,
div.week2:Hover { div.week2:Hover {
border-radius: 20px;
box-shadow: 0px 0px 2px #2c87f0 inset;
cursor: pointer;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebf1f6+0,abd3ee+50,89c3eb+51,d5ebfb+100;Blue+Gloss+%234 */
background: rgb(235,241,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(235,241,246,1) 0%, rgba(171,211,238,1) 50%, rgba(137,195,235,1) 51%, rgba(213,235,251,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=0 ); /* IE6-9 */
border-radius: 20px;
box-shadow: 0px 0px 2px #2c87f0 inset;
cursor: pointer;

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebf1f6+0,abd3ee+50,89c3eb+51,d5ebfb+100;Blue+Gloss+%234 */
background: rgb(235,241,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(235,241,246,1) 0%, rgba(171,211,238,1) 50%, rgba(137,195,235,1) 51%, rgba(213,235,251,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=0 ); /* IE6-9 */
} }


div.week1.filtered, div.week1.filtered,
div.week2.filtered{
border-radius: 20px;
/* background:white; */
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebf1f6+0,abd3ee+50,89c3eb+51,d5ebfb+100;Blue+Gloss+%234 */
background: rgb(235,241,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(235,241,246,1) 0%, rgba(171,211,238,1) 50%, rgba(137,195,235,1) 51%, rgba(213,235,251,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=0 ); /* IE6-9 */
div.week2.filtered {
border-radius: 20px;

/* background:white; */
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebf1f6+0,abd3ee+50,89c3eb+51,d5ebfb+100;Blue+Gloss+%234 */
background: rgb(235,241,246); /* Old browsers */
background: -moz-linear-gradient(top, rgba(235,241,246,1) 0%, rgba(171,211,238,1) 50%, rgba(137,195,235,1) 51%, rgba(213,235,251,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(235,241,246,1) 0%,rgba(171,211,238,1) 50%,rgba(137,195,235,1) 51%,rgba(213,235,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=0 ); /* IE6-9 */
} }


div.week1:after, div.week1:after,
height: 40px; height: 40px;
margin-top: 5px; margin-top: 5px;
font-weight: bolder; font-weight: bolder;
border-radius: 10px;
border-radius: 10px;
} }


div.week1 div:hover, div.week1 div:hover,
div.week2 div:hover
{
cursor:pointer;
box-shadow: 0px 0px 10px red;
div.week2 div:hover {
cursor: pointer;
box-shadow: 0px 0px 10px red;
} }


div.week1 > div { div.week1 > div {
box-shadow: 0px 0px 10px white inset; box-shadow: 0px 0px 10px white inset;
} }
.week1color{
color: black;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebe9f9+0,d8d0ef+50,cec7ec+51,c1bfea+100;Purple+3D+%231 */
background: #ebe9f9; /* Old browsers */
background: -moz-linear-gradient(top, #ebe9f9 0%, #d8d0ef 50%, #cec7ec 51%, #c1bfea 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ebe9f9 0%,#d8d0ef 50%,#cec7ec 51%,#c1bfea 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ebe9f9 0%,#d8d0ef 50%,#cec7ec 51%,#c1bfea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebe9f9', endColorstr='#c1bfea',GradientType=0 ); /* IE6-9 */

.week1color {
color: black;

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ebe9f9+0,d8d0ef+50,cec7ec+51,c1bfea+100;Purple+3D+%231 */
background: #ebe9f9; /* Old browsers */
background: -moz-linear-gradient(top, #ebe9f9 0%, #d8d0ef 50%, #cec7ec 51%, #c1bfea 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ebe9f9 0%,#d8d0ef 50%,#cec7ec 51%,#c1bfea 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ebe9f9 0%,#d8d0ef 50%,#cec7ec 51%,#c1bfea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebe9f9', endColorstr='#c1bfea',GradientType=0 ); /* IE6-9 */
} }


div.week2 > div { div.week2 > div {
box-shadow: 0px 0px 10px white inset; box-shadow: 0px 0px 10px white inset;
} }
.week2color{
color:white;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#627d4d+0,1f3b08+100;Olive+3D */
background: #627d4d; /* Old browsers */
background: -moz-linear-gradient(top, #627d4d 0%, #1f3b08 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #627d4d 0%,#1f3b08 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #627d4d 0%,#1f3b08 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#627d4d', endColorstr='#1f3b08',GradientType=0 ); /* IE6-9 */

.week2color {
color: white;

/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#627d4d+0,1f3b08+100;Olive+3D */
background: #627d4d; /* Old browsers */
background: -moz-linear-gradient(top, #627d4d 0%, #1f3b08 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #627d4d 0%,#1f3b08 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #627d4d 0%,#1f3b08 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#627d4d', endColorstr='#1f3b08',GradientType=0 ); /* IE6-9 */
} }


div.assignment > div { div.assignment > div {
width: 100%; width: 100%;
text-align: left; text-align: left;
border-collapse: collapse; border-collapse: collapse;
border:0px;
border: 0px;
} }


div.blueTable.emptyrecord{
background-color: #eeeeee;
div.blueTable.emptyrecord {
background-color: #eeeeee;
} }


.divTable.blueTable .divTableCell, .divTable.blueTable .divTableCell,
/* DivTable.com */ /* DivTable.com */
.divTable { .divTable {
display: table; display: table;
margin: 3px 0px 3px 0px;
margin: 3px 0px 3px 0px;
} }


.divTable.highlight{
box-shadow: 1px 1px 10px green;
.divTable.highlight {
box-shadow: 1px 1px 10px green;
} }


.divTable.invalidjob.highlight{
box-shadow: 1px 1px 10px #f50202;
.divTable.invalidjob.highlight {
box-shadow: 1px 1px 10px #f50202;
} }


.divTable.highlight.newcopy{
box-shadow: 1px 1px 10px orange;
border:5px orange solid;
.divTable.highlight.newcopy {
box-shadow: 1px 1px 10px orange;
border: 5px orange solid;
} }



.divTableRow { .divTableRow {
display: table-row; display: table-row;
} }


.divTableRow.errmsg{
background-color:white;
font-weight:bolder;
color:red;
.divTableRow.errmsg {
background-color: white;
font-weight: bolder;
color: red;
} }


.divTableHeading { .divTableHeading {
} }


div.bstart, div.bstart,
div.bfinish{
width:11%;
div.bfinish {
width: 11%;
} }


div.brate{
width: 10%;
max-width: 20px;
}
.divTable div > select{
width: 100%;
height: 100%;
div.brate {
width: 10%;
max-width: 20px;
} }


.divTable div > select {
width: 100%;
height: 100%;
}


div.bdelete, div.bdelete,
div.bsave, div.bsave,
div.bconfirmed { div.bconfirmed {
text-align:center;
text-align: center;
width: 5%; width: 5%;
} }


div.brating{
div.brating {
text-align: center; text-align: center;
cursor: pointer;
cursor: pointer;
} }



.brating { .brating {
unicode-bidi: bidi-override;
direction: rtl;
unicode-bidi: bidi-override;
direction: rtl;
} }

div.workspace .brating > span:hover:before, div.workspace .brating > span:hover:before,
div.workspace .brating > span:hover ~ span:before { div.workspace .brating > span:hover ~ span:before {
content: "\2605";
position: absolute;
content: "\2605";
position: absolute;
} }


div.bsave span.ticon-copy{
div.bsave span.ticon-copy {
display: none; display: none;
} }
div.bsave span.ticon-save{

div.bsave span.ticon-save {
display: inline-block; display: inline-block;
border: 3px solid lightgrey;
border: 3px solid lightgrey;
padding: 5px; padding: 5px;
border-radius: 5px; border-radius: 5px;
color: black;
cursor: pointer;
color: black;
cursor: pointer;
} }
div.bsave.saved span.ticon-save{

div.bsave.saved span.ticon-save {
display: none; display: none;
} }


div.bsave.saved span.ticon-copy{
div.bsave.saved span.ticon-copy {
display: inline-block; display: inline-block;
border: 3px solid orange; border: 3px solid orange;
padding: 5px; padding: 5px;
border-radius: 20px; border-radius: 20px;
color: orange;
color: orange;
} }
div.bdelete span.ticon-trash{

div.bdelete span.ticon-trash {
display: inline-block; display: inline-block;
border: 3px solid lightgrey; border: 3px solid lightgrey;
padding: 5px; padding: 5px;
border-radius: 5px; border-radius: 5px;
color: red;
cursor: pointer;
color: red;
cursor: pointer;
} }


div.workspace div > span:hover{
box-shadow:0px 0px 10px black;
div.workspace div > span:hover {
box-shadow: 0px 0px 10px black;
} }


div.divTableHeading div > span:hover{
cursor: pointer;
animation: blinker 0.3s linear infinite;
div.divTableHeading div > span:hover {
cursor: pointer;
animation: blinker 0.3s linear infinite;
} }


/* short code for the table */ /* short code for the table */
div.btos select, div.btos select,
div.bstart input, div.bstart input,
div.bfinish input{
width: 100%;
height: 98%;
div.bfinish input {
width: 100%;
height: 98%;
} }


div.divTable.validjob{
border: 0px solid white;
div.divTable.validjob {
border: 0px solid white;
} }


div.divTable.invalidjob{
border-left: 2px solid red;
border-right: 2px solid red;
div.divTable.invalidjob {
border-left: 2px solid red;
border-right: 2px solid red;
} }


div.divTable .invalid{
background-color:yellow;
div.divTable .invalid {
background-color: yellow;
} }
/* end of div table */


/* end of div table */
/* pop up message box */ /* pop up message box */
.bts_message .ult_modal-body{
height:50vh;
overflow:scroll;
.bts_message .ult_modal-body {
height: 50vh;
overflow: scroll;
} }
.bts_message .ult_modal-body .sent{
color: green;

.bts_message .ult_modal-body .sent {
color: green;
} }
.bts_message .ult_modal-body .nojob{
color: dimgrey;

.bts_message .ult_modal-body .nojob {
color: dimgrey;
} }
.bts_message .ult_modal-body .error{
color : red;

.bts_message .ult_modal-body .error {
color: red;
} }
.bts_message .ult_modal-body .span{
font-weight:900;

.bts_message .ult_modal-body .span {
font-weight: 900;
} }

+ 195
- 0
html/timesheet.html Просмотреть файл

<div class='peoplebar left'>
<div class='b_search titlebar_gradient'>
<span class="ticon ticon-search"></span>
<input type="text" placeholder="staff">
<span class="ticon ticon-times-circle-o"></span>
</div>
<button class='peoplelist' name='up'>
<span class="ticon ticon-angle-double-up"></span>
</button>
<div class="stafflist userlist">
<img>
</div>
<button class='peoplelist' name='down'>
<span class="ticon ticon-angle-double-down"></span>
</button>
</div>
<div class='peoplebar right'>
<div class='b_search titlebar_gradient'>
<span class="ticon ticon-search"></span>
<input type="text" placeholder="client">
<span class="ticon ticon-times-circle-o"></span>
</div>
<button class='peoplelist' name='up'>
<span class="ticon ticon-angle-double-up"></span>
</button>
<div class="clientlist userlist">
<img>
</div>
<button class='peoplelist' name='down'>
<span class="ticon ticon-angle-double-down"></span>
</button>
</div>
<div class='timesheets'>
<div class='sheettitle titlebar_gradient'>
<h1>Web Office - Today:<span name='today'> Today </span> </h1>
</div>
<div class='sheetsheader'>
<div class='weekly'>
<div class='weekname prev'>
<input id='week1b' type=text class='boundary_datepicker' value="2019-07-01" placeholder="2019-07-01">Week
<span name='week1'>10</span>
<i class="ticon ticon-caret-right"></i>
</div>
<div class='copyprogress'>
<div name='copyschedule'>
Add a Job
<span class='ticon ticon-plus'></span>
</div>
</div>
<div class='weekname next'>
<i class="ticon ticon-caret-left"></i>
Week
<span name='week2'>11</span>
<input id='week2b' type=text class='boundary_datepicker' value="2019-07-01" placeholder="2019-07-01">
</div>
<div class="weekdays">
<div class='week1'>
<div class='week1color'>
<span name='w1n1'>Mon</span>
<br>
<span class="weekday" name='w1d1'>12</span>
</div>
<div class='week1color'>
<span name='w1n2'>Tue</span>
<br>
<span class="weekday" name='w1d2'>12</span>
</div>
<div class='week1color'>
<span name='w1n3'>Wed</span>
<br>
<span class="weekday" name='w1d3'>12</span>
</div>
<div class='week1color'>
<span name='w1n4'>Thu</span>
<br>
<span class="weekday" name='w1d4'>12</span>
</div>
<div class='week1color'>
<span name='w1n5'>Fri</span>
<br>
<span class="weekday" name='w1d5'>12</span>
</div>
<div class='week1color'>
<span name='w1n6'>Sat</span>
<br>
<span class="weekday" name='w1d6'>12</span>
</div>
<div class='week1color'>
<span name='w1n7'>Sun</span>
<br>
<span class="weekday" name='w1d7'>12</span>
</div>
</div>
<div class='week2'>
<div class='week2color'>
<span name='w2n1'>Mon</span>
<br>
<span class="weekday" name='w2d1'>12</span>
</div>
<div class='week2color'>
<span name='w2n2'>Tue</span>
<br>
<span class="weekday" name='w2d2'>12</span>
</div>
<div class='week2color'>
<span name='w2n3'>Wed</span>
<br>
<span class="weekday" name='w2d3'>12</span>
</div>
<div class='week2color'>
<span name='w2n4'>Thu</span>
<br>
<span class="weekday" name='w2d4'>12</span>
</div>
<div class='week2color'>
<span name='w2n5'>Fri</span>
<br>
<span class="weekday" name='w2d5'>12</span>
</div>
<div class='week2color'>
<span name='w2n6'>Sat</span>
<br>
<span class="weekday" name='w2d6'>12</span>
</div>
<div class='week2color'>
<span name='w2n7'>Sun</span>
<br>
<span class="weekday" name='w2d7'>12</span>
</div>
</div>
</div>
</div>
<div class='prevweek left'>
<span class="ticon ticon-arrow-circle-left"></span>
</div>
<div class='nextweek right'>
<span class="ticon ticon-arrow-circle-right"></span>
</div>
<div class="sheettableheader">
<div class="divTable blueTable">
<div class="divTableHeading">
<div class="divTableRow">
<div class="divTableHead btos">Type of Service</div>
<div class="divTableHead bstart">Start</div>
<div class="divTableHead bfinish">Finish</div>
<div class="divTableHead brate">Hourly Rate</div>
<div class="divTableHead bstaff">Staff</div>
<div class="divTableHead bclient">Client</div>
<div class="divTableHead bconfirmed">Ack</div>
<div class="divTableHead brating">
<span class="ticon ticon-star"></span>
<span class="ticon ticon-star"></span>
<span class="ticon ticon-star"></span>
<span class="ticon ticon-star"></span>
<span class="ticon ticon-star"></span>
</div>
<div class="divTableHead bdelete">
<span class="ticon ticon-plus"></span>
</div>
<div class="divTableHead bsave">
<span class="ticon ticon-save"></span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class='workspace'>
<img src="#">
</div>
<div class='statusbar titlebar_gradient'>
<div class='xero'>
<i class="ticon ticon-times"></i>
</div>
<div class='wifi'>
<i class="ticon ticon-times"></i>
</div>
<div class='csv'>
<i class="ticon ticon-times"></i>
</div>
<div class='wages'>
$
<div name='number'>
3214
</div>
</div>
<div class='workinghours'>
<label for='woh'> Total Hours</label>
<input id="woh" type="text" value="1553.5" readonly>
</div>
<button name='confirmschedule'>
Confirm Schedule
</button>
</div>
</div>

+ 71
- 13
js/bts_timesheet.js Просмотреть файл

else else
$('div.wifi i').hide(); $('div.wifi i').hide();
} }
function csv(t){
if (t)
$('div.csv i').show();
else
$('div.csv i').hide();
}

function init_user_search(){ function init_user_search(){
$('div.b_search input').keyup(debounce(function(e){ $('div.b_search input').keyup(debounce(function(e){
function init_weekdays(){ function init_weekdays(){
var curr = new Date; // get current date var curr = new Date; // get current date
// First day is the day of the month - the day of the week
init_weekdays_by_anchor(curr, true);
return;
}

function init_weekdays_by_anchor(anchor, is_week1){
var curr = new Date(anchor); // get the date;
if (!is_week1){ //it is week2, shift for 7 days;
curr.setDate(curr.getDate() -7); //curr will be changed;
}

var first = curr.getDate() - curr.getDay() + 1; //+1 we want Mon as first var first = curr.getDate() - curr.getDay() + 1; //+1 we want Mon as first
var last = first + 6; // last day is the first day + 6 var last = first + 6; // last day is the first day + 6

//var firstday = new Date(curr.setDate(first)); //Mon
//var lastday = new Date(curr.setDate(last)); //Sun
if (curr.getDay() == 0 ){// it's Sunday;
last = curr.getDate();
first = last - 6;
}
var pos = 1; //first lot var pos = 1; //first lot
for (var i=first; i<=last; i++) for (var i=first; i<=last; i++)
{ {
var now = new Date;
var now = new Date(curr);
var d1 = new Date(now.setDate(i)); var d1 = new Date(now.setDate(i));
now = new Date;
now = new Date(curr);
var d2 = new Date(now.setDate(i+7)); var d2 = new Date(now.setDate(i+7));
set_day_number(1,pos, d1); //week 1 set_day_number(1,pos, d1); //week 1
set_day_number(2,pos, d2); //week 2 set_day_number(2,pos, d2); //week 2
pos +=1; pos +=1;
} }
} }

function set_day_number(week, index, date){ function set_day_number(week, index, date){
var selector = 'span[name="w'+week+'d'+index+'"]'; var selector = 'span[name="w'+week+'d'+index+'"]';
$(selector).html(date.getDate()); $(selector).html(date.getDate());
$(selector).data({date:date}); $(selector).data({date:date});
console.log('set w%d-d%d %o', week,index,date);
//console.log('set w%d-d%d %o', week,index,date);
} }
function set_today(){ function set_today(){
var num = date.get_week_number(); var num = date.get_week_number();
$('div.weekly span[name="week1"]').html(num); $('div.weekly span[name="week1"]').html(num);
$('div.weekly span[name="week2"]').html(num+1); $('div.weekly span[name="week2"]').html(num+1);
set_week_boundry();
}
function set_week_boundry()
{
var date = $('span[name="w1d1"]').data().date;
$('#week1b').attr('value', format_date(date));
var date = $('span[name="w2d7"]').data().date;
$('#week2b').attr('value', format_date(date));
} }
function number_of_unsaved_job(){ function number_of_unsaved_job(){
$(e).data({data:newdate}); $(e).data({data:newdate});
}); });
set_week_number(); set_week_number();
load_timesheet();
debounced_load_timesheet();
}); });
$('div.nextweek.right').click(function(){ $('div.nextweek.right').click(function(){
if (number_of_unsaved_job() > 0){ if (number_of_unsaved_job() > 0){
$(e).data({data:newdate}); $(e).data({data:newdate});
}); });
set_week_number(); set_week_number();
load_timesheet();
debounced_load_timesheet();
}); });
$('div.weekly div.weekname.prev >input ').click(function(e){
e.stopPropagation();
});
$('div.weekly div.weekname.prev >input ').change(function(e){
var date = $('#week1b').attr('value');
init_weekdays_by_anchor(date, true);
set_week_number();
debounced_load_timesheet();
});
$('div.weekly div.weekname.prev').click(function(){ $('div.weekly div.weekname.prev').click(function(){
if (!confirm ('copy entire week to next week? ')) if (!confirm ('copy entire week to next week? '))
return; return;
show_jobs(job_els); show_jobs(job_els);
debounced_calculate(); debounced_calculate();
}); });

$('div.weekly div.weekname.next > input').click(function(e){
e.stopPropagation();
});
$('div.weekly div.weekname.next').click(function(){
alert('you can only copy from past to future (left to right)');
$('div.weekly div.weekname.next >input ').change(function(e){
e.stopPropagation();
var date = $('#week2b').attr('value');
init_weekdays_by_anchor(date, false);
set_week_number();
debounced_load_timesheet();
});
$('div.weekly div.weekname.next').click(function(e){
$(e).find('input').trigger('click');
}); });

$('div.week1 > div').click(function(e){ $('div.week1 > div').click(function(e){
e.stopPropagation(); e.stopPropagation();
if ($('div.bstart input.blink_me').length == 0){ if ($('div.bstart input.blink_me').length == 0){
$('div.bstart input').removeClass('blink_me'); $('div.bstart input').removeClass('blink_me');
} }
$('div.sheettitle h1').click(function(){
$('div.sheettitle h1 span').click(function(){
reset_title_to_today(); reset_title_to_today();
load_timesheet(); load_timesheet();
}); });
set_week_number(); set_week_number();
} }


var debounced_load_timesheet = debounce(load_timesheet,1000);
function load_timesheet() function load_timesheet()
{ {
list_clients(); list_clients();
xero(false); xero(false);
wifi(false); wifi(false);
csv(false);
init_user_search(); init_user_search();
//ajax_earning_rate(); //ajax_earning_rate();
reset_title_to_today(); reset_title_to_today();
// } // }
init_ts(); init_ts();

// $( "#week1b" ).datepicker("option", "dateFormat", "yy-mm-dd");
// $( "#week2b" ).datepicker("option", "dateFormat", "yy-mm-dd");
/*________________________________________________________________________*/ /*________________________________________________________________________*/
}); });

+ 6
- 1
js/feedback_card.js Просмотреть файл

function get_this_week_start(){ function get_this_week_start(){
var curr = new Date; // get current date var curr = new Date; // get current date
// First day is the day of the month - the day of the week
var first = curr.getDate() - curr.getDay() + 1; //+1 we want Mon as first var first = curr.getDate() - curr.getDay() + 1; //+1 we want Mon as first
var last = first + 6; // last day is the first day + 6 var last = first + 6; // last day is the first day + 6
// First day is the day of the month - the day of the week
if(curr.getDay()==0)//sunday
{
last = curr.getDate();
first = last - 6;
}


var firstday = new Date(curr.setDate(first)); //Mon var firstday = new Date(curr.setDate(first)); //Mon
firstday.setHours(0,0,0); firstday.setHours(0,0,0);

+ 6
- 1
ts.php Просмотреть файл

add_shortcode( 'bts_type_of_service', array($this, 'bts_type_of_service')); add_shortcode( 'bts_type_of_service', array($this, 'bts_type_of_service'));
add_shortcode( 'bts_staff_job_summary', array($this, 'bts_staff_job_summary')); add_shortcode( 'bts_staff_job_summary', array($this, 'bts_staff_job_summary'));
add_shortcode( 'bts_feedback_card', array($this, 'bts_feedback_card')); add_shortcode( 'bts_feedback_card', array($this, 'bts_feedback_card'));
add_shortcode( 'bb_timesheet_canvas', array($this, 'bb_timesheet_canvas'));
//user profile page //user profile page
add_shortcode( 'bts_user_name', array($this,'bts_user_name')); add_shortcode( 'bts_user_name', array($this,'bts_user_name'));
{ {
return $this->template('bts_feedback_card', 'feedback_card.html'); return $this->template('bts_feedback_card', 'feedback_card.html');
} }
public function bb_timesheet_canvas($attr)
{
return file_get_contents(plugin_dir_path(__FILE__) . "/html/timesheet.html");
}
//generate template based on html file //generate template based on html file
private function template($id, $file) private function template($id, $file)
{ {

Редактирование Предпросмотр
Загрузка…
Отмена
Сохранить