当我想将时间划分为整数时,出现此错误:<template>
<div>
<div class="calendar-top-container">
<div class="close">
<img width="20" height="20"
src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a0/OOjs_UI_icon_close.svg/1200px-OOjs_UI_icon_close.png"
alt=""
/>
</div>
<div class="headline-mounth-container">
<div class="mount-container-icon">
<div>
<date-pick
v-model="date"
:format="format"
:parseDate="parseDate"
:formatDate="formatDate"
>
<template v-slot:default="{ toggle, inputValue }">
<div style="display: flex; align-items: center">
<div class="mount-container">
<h1>
<span class="mount-title">
<span class="dow"
>{{ inputValue.split(",")[0] }},
</span>
<span class="date">{{ inputValue.split(",")[1] }}</span>
</span>
</h1>
</div>
<div
@click="toggle"
style="display: flex; align-items: center; cursor: pointer"
>
<img
width="18"
height="18"
style="margin-right: 5px"
src="~@/assets/Images/Calendar/bx_bx-calendar.svg"
alt="Calendar"
/>
<img src="~@/assets/Images/Calendar/arrow.svg" alt="" />
</div>
</div>
</template>
</date-pick>
</div>
</div>
<div class="switched-container">
<div>
<p
v-on:click="enabled = !enabled"
v-bind:class="[enabled ? null : 'firstActive']"
class="switch-desc"
>
This week
</p>
</div>
<div class="switched-child-container">
<switches
class="switches-style"
v-model="enabled"
theme="bootstrap"
color="danger"
></switches>
</div>
<div>
<p
v-on:click="enabled = !enabled"
v-bind:class="[enabled ? 'secondActive' : null]"
class="switch-desc"
>
Next week
</p>
</div>
</div>
</div>
</div>
<div class="calendar-container">
<div class="calendar-wrapper">
<div class="headline-dots-group">
<div class="dots-group">
<div class="first-dot-group">
<div class="dot-group">
<div><p>Standart</p></div>
<div class="dot dot-1"></div>
</div>
<div class="dot-group">
<div><p>Standart</p></div>
<div class="dot dot-2"></div>
</div>
</div>
<div class="second-dot-group">
<div class="dot-group">
<div><p>Standart</p></div>
<div class="dot dot-3"></div>
</div>
<div class="dot-group">
<div><p>Standart</p></div>
<div class="dot dot-4"></div>
</div>
</div>
</div>
<div class="time-title">
<h2>GIRLS</h2>
</div>
<div class="girls-list">
<div
v-for="(item, index) in girlsList"
:key="index"
class="girl-info"
>
<div>
<img :src="item.avatarSrc" alt="" />
</div>
<div>
<div class="girl-name-container">
<p>{{ item.girlName }}</p>
</div>
<div class="girl-time-container">
<div>
<span class="girl-time">{{ item.girlTime }}</span>
</div>
<div>
<span class="day-of-time">PM</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="time-container">
<div class="Container Flipped">
<div class="Content">
<div>
<ul>
<li v-for="item in timeSlots" :key="item">
{{ item }}
</li>
</ul>
</div>
<div class="time-progress-container">
<ul>
<li
style="display: block"
class="date-container"
v-for="(item, index) in timeSlots"
:key="index"
>
{{ item }}
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="view-container">
<div class="View">
<div>
<p>View</p>
</div>
<div>
<img width="20" height="20" src="https://pics.freeicons.io/uploads/icons/png/15211315791553239378-512.png" alt="" />
</div>
<div>
<img width="20" height="20"
src="https://pics.freeicons.io/uploads/icons/png/15211315791553239378-512.png"
alt=""
/>
</div>
</div>
<div class="right-bg"></div>
</div>
</div>
</div>
</div>
</template>
<style scoped>
.date-container {
height: 56px;
background: #2d2d2d;
}
/* girl-list */
.girl-name-container {
display: flex;
justify-content: flex-end;
}
.girls-list {
height: 350px;
padding-top: 10px;
overflow: auto;
direction: rtl;
}
.girl-info {
display: flex;
align-items: flex-end;
flex-direction: row-reverse;
margin-bottom: 5px;
}
.girl-info div img {
margin-right: 10px;
border-radius: 5px;
width: 91px;
height: 50px;
max-width: 100%;
}
.girl-info div p {
font-family: "Montserrat-Medium";
font-size: 13px;
margin: 0;
}
.girl-time,
.day-of-time {
font-size: 10px;
font-family: "Montserrat-Medium";
font-weight: 600;
}
.girl-time-container {
display: flex;
flex-direction: row-reverse;
}
.girl-time {
margin-right: 5px;
color: #CC003D;
}
.day-of-time {
color: #000000;
}
/* ****************** */
/* time-progress */
.time-progress-container {
width: 100%;
height: 100%;
background: orange;
margin-top: 10px;
}
/* ****************** */
/* switched-container */
.date {
color: #000;
}
.vue-switcher-theme--bulma.vue-switcher-color--default.vue-switcher--unchecked
div:after {
background-color: #f5f5f5 !important;
}
.switched-container {
display: flex;
align-items: center;
}
.switched-container div p {
font-family: Montserrat-Medium;
font-size: 10px;
}
.switched-child-container {
margin: 0 10px 0 10px;
}
.switch-desc {
cursor: pointer;
}
.firstActive,
.secondActive {
color: #74C8C5;
}
.headline-mounth-container {
display: flex;
align-items: center;
justify-content: space-between;
}
/* ***************** */
.calendar-top-container {
width: 97%;
margin: auto;
padding-top: 30px;
}
.close {
display: flex;
justify-content: flex-end;
}
.mount-container-icon {
display: flex;
}
.mount-container h1 {
font-family: Montserrat-Medium;
font-size: 30px;
margin-right: 18px;
}
.mount-title {
font-style: normal;
font-weight: bold;
line-height: 40px;
text-align: center;
color: #CC003D;
}
.mount-title::first-letter {
color: yellow;
}
.calendar-container {
border: 1px solid #BDBCBA;
padding-top: 16px;
margin-top: 10px;
}
/* -------Time Title------ */
.time-title {
width: 100%;
background: #74C8C5;
height: 46px;
margin-top: 30px;
display: flex;
align-items: center;
}
.time-title h2 {
margin: 0;
letter-spacing: 0.2em;
margin-left: 25px;
color: #FFFFFF;
font-family: "Second-Montserrat-Bold";
letter-spacing: 0.2em;
-webkit-text-stroke: 1px black;
}
/* --------------- */
.calendar-wrapper {
display: flex;
width: 100%;
}
.view-container {
position: relative;
}
.View {
display: flex;
align-items: center;
justify-content: space-evenly;
background: #B0B0B0;
border-radius: 5px;
width: 88px;
height: 24px;
margin-left: 15px;
margin-top: 15px;
margin-right: 25px;
}
.View div p {
font-family: Montserrat-Medium;
font-size: 11px;
color: #ffffff;
}
.right-bg {
width: 100%;
height: 46px;
background: #74C8C5;
margin-top: 37px;
}
/* **************** */
.headline-dots-group {
position: relative;
}
.dots-group {
margin-left: 15px;
margin-right: 15px;
}
.first-dot-group,
.second-dot-group {
display: flex;
align-items: center;
}
.first-dot-group {
margin-bottom: 10px;
}
.dot {
width: 16px;
height: 16px;
border-radius: 100%;
background: orange;
margin: 0 10px 0 10px;
}
.dot-group {
display: flex;
align-items: center;
flex-direction: row-reverse;
}
.dot-group div p {
margin: 0;
font-family: Montserrat-Medium;
text-transform: capitalize;
font-feature-settings: "case" on;
color: #000000;
}
.dot-1 {
background: #CC003D;
}
.dot-2 {
background: #F79501;
}
.dot-3 {
background: #74C8C5;
}
.dot-4 {
background: #76ED00;
}
/**********************/
/* width */
::-webkit-scrollbar {
width: 5px;
height: 10px;
}
/* Track */
::-webkit-scrollbar-track {
background: #E5E5E5;
border-radius: 5px;
}
/* Handle */
::-webkit-scrollbar-thumb {
background: #CC003D;
border-radius: 5px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #b30000;
}
@font-face {
src: url(~@/assets/fonts/FontsForClosePage/Montserrat-Bold.ttf);
font-family: "Second-Montserrat-Bold";
}
.Container {
padding-bottom: 61px;
overflow-y: auto;
}
.Flipped,
.Flipped .Content {
transform: rotateX(180deg);
-ms-transform: rotateX(180deg); /* IE 9 */
-webkit-transform: rotateX(180deg); /* Safari and Chrome */
height: 100%;
}
.Flipped {
overflow-y: hidden;
}
.Content {
width: max-content;
background: #74C8C5;
padding: 10px;
padding-left: 0;
padding-right: 0;
height: 100%;
}
.time-container {
padding: 10px;
overflow-y: auto;
overflow: hidden;
flex-basis: 80%;
margin-top: 15px;
padding-bottom: 61px;
padding-left: 0;
padding-right: 0;
flex-basis: auto;
}
ul {
display: flex;
align-items: center;
margin: 0;
padding: 0;
}
li {
display: flex;
white-space: nowrap;
background: #FFFFFF;
margin-right: 8px;
border-radius: 7px;
list-style-type: none;
padding: 5px 10px 5px 10px;
font-family: "Second-Montserrat-Bold";
font-size: 12px;
line-height: 16px;
text-align: center;
color: #000000;
}
@font-face {
src: url(~@/assets/GlobalFonts/Montserrat-Medium.ttf);
font-family: "Montserrat-Medium";
}
</style>
<style>
.vue-switcher-theme--bootstrap.vue-switcher-color--danger.vue-switcher--unchecked
div,
.vue-switcher-theme--bootstrap.vue-switcher-color--danger div {
background: #FFFFFF;
border: 1px solid #E5E5E5;
box-sizing: border-box;
box-shadow: inset 0px 0px 5px rgb(0 0 0 / 25%);
}
.vdpInnerWrap {
position: absolute;
width: 100%;
left: 320px;
top: 50%;
transform: translateY(-15%);
}
@media screen and (max-width: 630px) {
.vdpInnerWrap {
position: static;
left: 0;
top: 0;
transform: translateY(0);
}
}
</style>
<script>
import Switches from "vue-switches";
import DatePick from "vue-date-pick";
import fecha from "fecha";
import "./vueDatePick.scss";
let ts = require("time-slots-generator");
export default {
name: "HelloWorld",
data() {
return {
enabled: false,
showCalendar: false,
format: "dddd, MMMM D",
date: fecha.format(new Date(), "dddd, MMMM D"),
timeSlots: ts.getTimeSlots([], true, "quarter"),
girlsList: [
{
avatarSrc: "https://i.ibb.co/G0nLSQ8/Girl-1.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/qJB12x6/Girl-2.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/6sHVnmD/Girl-3.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/tb5z0Yg/Girl-4.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/q9SfcrS/Girl-5.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/TrybWr6/Girl-6.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/q9SfcrS/Girl-5.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
{
avatarSrc: "https://i.ibb.co/TrybWr6/Girl-6.png",
girlName: "Milena Williams",
girlTime: "12:00 - 16:00 PM",
},
],
};
},
methods: {
showCalendarFunc() {
this.showCalendar = !this.showCalendar;
},
parseDate(dateString, format) {
return fecha.parse(dateString, format);
},
formatDate(dateObj, format) {
return fecha.format(dateObj, format);
},
},
components: {
Switches,
DatePick,
},
};
</script>
。
postgres 有没有函数可以将时间除以整数?
例如:ERROR: operator does not exist: timestamp with time zone / integer
是带时区的时间戳,我想要 "2013-11-14 07:46:15+03:30"
答案 0 :(得分:0)
我认为问题在于它没有被存储为数字。如果我明白你在问什么,你想要的是自纪元以来的时间,而不是像 01/01/1992
之类的东西。
How to convert date time into unix epoch value in Postgres? 讨论了几种将其转换为纪元的方法,但关键的是 select extract(epoch from ts) from data
或 select date_part('epoch', ts) from data;
,其中 data
是您的表,而 {{1} } 是你的时间戳。那么你应该可以除以一个整数。
答案 1 :(得分:0)
我找到了解决这个问题的方法:
SELECT to_timestamp(extract(epoch from DATE)/2) AS date FROM Table
其中 DATE 是带时区的时间戳,Table 是给定的表。 结果的类型是带时区的时间戳。