stuzer05/random-web-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Activity

Add unix timestamp tool

Browse Source
This commit is contained in:
Illya Marchenko 2024-07-01 12:52:27 +03:00
parent 339470df5f
commit 910af3c57c
Signed by: stuzer05
GPG Key ID: A6ABAAA9268F9F4F
6 changed files with 183 additions and 2819 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
bun.lockb Executable file
View File

Binary file not shown.

2799
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

40
package.json
View File

@ -9,29 +9,29 @@
},
"dependencies": {
"@monaco-editor/loader": "^1.4.0",
"autoprefixer": "^10",
"axios": "^0.27.2",
"cronstrue": "^2.47.0",
"autoprefixer": "^10.4.19",
"axios": "^1.6.0",
"cronstrue": "^2.50.0",
"easyqrcodejs": "^4.6.1",
"mitt": "^3.0.0",
"pinia": "^2.0.14",
"postcss": "^8.4.35",
"sql-formatter": "^15.0.2",
"tailwindcss": "^3",
"vue": "^3.2.36",
"vue-axios": "^3.4.1",
"vue-router": "^4.0.15"
"mitt": "^3.0.1",
"moment": "^2.30.1",
"pinia": "^2.1.7",
"postcss": "^8.4.39",
"sql-formatter": "^15.3.2",
"tailwindcss": "^3.4.4",
"vue": "^3.4.31",
"vue-axios": "^3.5.2",
"vue-router": "^4.4.0"
},
"devDependencies": {
"@rushstack/eslint-patch": "^1.1.0",
"@vitejs/plugin-vue": "^2.3.3",
"@vue/eslint-config-prettier": "^7.0.0",
"autoprefixer": "^10.4.7",
"eslint": "^8.5.0",
"eslint-plugin-vue": "^8.2.0",
"prettier": "^2.5.1",
"sass": "^1.52.3",
"vite": "^2.9.17",
"@rushstack/eslint-patch": "^1.10.3",
"@vitejs/plugin-vue": "^2.3.4",
"@vue/eslint-config-prettier": "^7.1.0",
"eslint": "^8.57.0",
"eslint-plugin-vue": "^8.7.1",
"prettier": "^2.8.8",
"sass": "^1.77.6",
"vite": "^2.9.18",
"vue-cli-plugin-tailwind": "~3.0.0"
}
}

1
src/components/Sidebar.vue
View File

@ -42,6 +42,7 @@ export default {
'humans_txt': 'humans.txt generator',
'file_base64_encode_decode': 'File base64 encode/decode',
'qr_code': 'QR code',
'unix_timestamp': 'Unix timestamp',
},
'Strings': {
'fix_ru_en_keyboard': 'Fix ru-en keyboard',

5
src/router/index.js
View File

@ -36,6 +36,11 @@ const router = createRouter({
name: 'qr_code',
component: () => import('../views/QRCode.vue'),
},
{
path: '/unix_timestamp',
name: 'unix_timestamp',
component: () => import('../views/UnixTimestamp.vue'),
},
/**
* String manipulation

157
src/views/UnixTimestamp.vue Normal file
View File

@ -0,0 +1,157 @@
<template>
<h2 class="tool-title">Unix timestamp</h2>
<hr class="mt-5 mb-5">
<table>
<thead>
<tr>
<th>Format</th>
<th>Date & Time</th>
<th></th>
</tr>
</thead>
<tbody>
<tr v-for="(value, format) in currentTimestampFormatted" :key="format">
<td>{{ format }}</td>
<td>{{ value }}</td>
<td><button @click="copyTimestamp(value)">📋</button></td>
</tr>
</tbody>
</table>
<hr class="mt-5 mb-5">
<div class="input-group">
<label for="inputTimestamp">Enter timestamp</label>
<div>
<input id="inputTimestamp" type="number" v-model="toolData.inputTimestamp" :placeholder="currentTimestamp">
<button @click="convertFromUnix">Convert</button>
</div>
</div>
<div class="input-group">
<label>Enter Date & Time</label>
<div>
<table class="table-date-and-time">
<thead>
<tr>
<th>Year</th>
<th>Month</th>
<th>Day</th>
<th>Hour (24)</th>
<th>Minute</th>
<th>Second</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="number" v-model="toolData.inputYear"></td>
<td><input type="number" v-model="toolData.inputMonth"></td>
<td><input type="number" v-model="toolData.inputDay"></td>
<td><input type="number" v-model="toolData.inputHour"></td>
<td><input type="number" v-model="toolData.inputMinute"></td>
<td><input type="number" v-model="toolData.inputSecond"></td>
<td><button @click="convertToUnix">Convert →</button></td>
</tr>
</tbody>
</table>
</div>
</div>
</template>
<script>
import moment from 'moment';
export default {
data() {
return {
toolData: {
inputTimestamp: '',
inputYear: moment().year(),
inputMonth: moment().month() + 1,
inputDay: moment().day(),
inputHour: moment().hour(),
inputMinute: moment().minute(),
inputSecond: moment().second(),
},
currentTimestamp: 0,
currentTimestampFormatted: {},
};
},
mounted() {
const updateCurrentTimestamp = () => {
this.currentTimestamp = moment().unix();
this.currentTimestampFormatted = {
'UTC': moment().utc().format('YYYY-MM-DDTHH:mm:ss[Z]'),
// 'UTC (local)': moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
'ISO 8601': moment().toISOString(),
// 'RFC 2822': moment().format('ddd, DD MMM YYYY HH:mm:ss ZZ'),
// 'RFC 850': moment().format('dddd, DD-MMM-YY HH:mm:ss [UTC]'),
// 'RFC 1036': moment().format('ddd, DD MMM YY HH:mm:ss ZZ'),
// 'RFC 1123': moment().format('ddd, DD MMM YYYY HH:mm:ss ZZ'),
// 'RFC 822': moment().format('ddd, DD MMM YY HH:mm:ss ZZ'),
// 'RFC 3339': moment().format('YYYY-MM-DDTHH:mm:ssZZ'),
'COOKIE': moment().format('dddd, DD-MMM-YYYY HH:mm:ss [UTC]'),
// 'RSS': moment().format('ddd, DD MMM YYYY HH:mm:ss ZZ'),
'Unix Epoch': moment().unix(),
'YYYY-DD-MM': moment().format('YYYY/MM/DD'),
'SQL DATETIME': moment().toISOString().replaceAll(/[ZT]/g, ' '),
'YYYY/DD/MM HH:MM:SS AM/PM': moment().format('YYYY/MM/DD HH:mm:ss A'),
'DD.MM.YYYY HH:MM:SS': moment().format('DD.MM.YYYY HH:mm:ss'),
};
};
updateCurrentTimestamp();
setInterval(updateCurrentTimestamp, 1000);
},
methods: {
convertFromUnix() {
let timestamp = this.toolData.inputTimestamp.length ? this.toolData.inputTimestamp : this.currentTimestamp;
const date = moment.unix(timestamp);
this.toolData.inputYear = date.year();
this.toolData.inputMonth = date.month() + 1;
this.toolData.inputDay = date.day();
this.toolData.inputHour = date.hour();
this.toolData.inputMinute = date.minute();
this.toolData.inputSecond = date.second();
},
convertToUnix() {
const date = moment({
year: this.toolData.inputYear,
month: this.toolData.inputMonth - 1, // Months are 0-indexed
day: this.toolData.inputDay,
hour: this.toolData.inputHour,
minute: this.toolData.inputMinute,
second: this.toolData.inputSecond
});
this.toolData.inputTimestamp = date.unix();
},
copyTimestamp(text) {
navigator.clipboard.writeText(text)
.then(() => {
// console.log('Timestamp copied to clipboard!');
})
.catch(err => {
// console.error('Failed to copy: ', err);
});
},
},
};
</script>
<style>
.table-date-and-time th {
text-align: left;
}
.table-date-and-time td input {
width: 80px;
}
</style>