7 changed files with 196 additions and 11 deletions
-
83marko/page/logs/components/import-log-modal/component.js
-
44marko/page/logs/components/import-log-modal/index.marko
-
9marko/page/logs/components/import-log-modal/style.less
-
1marko/page/logs/components/logs-menu/index.marko
-
1marko/page/logs/components/page/index.marko
-
22package-lock.json
-
47rpdata/api/Log.js
@ -0,0 +1,83 @@ |
|||||
|
const {tz} = require("moment-timezone") |
||||
|
|
||||
|
const {logsApi} = require("../../../../../rpdata/api/Log") |
||||
|
|
||||
|
module.exports = class { |
||||
|
onCreate(input) { |
||||
|
this.state = { |
||||
|
error: null, |
||||
|
loading: false, |
||||
|
imported: null, |
||||
|
values: { |
||||
|
importer: "MircLike", |
||||
|
timezone: tz.guess() || "UTC", |
||||
|
channelName: "", |
||||
|
date: "", |
||||
|
data: "", |
||||
|
}, |
||||
|
timezones: tz.names(), |
||||
|
} |
||||
|
|
||||
|
this.first = false |
||||
|
} |
||||
|
|
||||
|
change(key, ev) { |
||||
|
this.state.values[key] = ev.target.value |
||||
|
this.state.values = Object.assign({}, this.state.values) |
||||
|
} |
||||
|
|
||||
|
open() { |
||||
|
this.state.loading = false |
||||
|
} |
||||
|
|
||||
|
close() { |
||||
|
this.emit("close") |
||||
|
|
||||
|
this.state.values = { |
||||
|
importer: "MircLike", |
||||
|
timezone: tz.guess() || "UTC", |
||||
|
channelName: "", |
||||
|
date: "", |
||||
|
data: "", |
||||
|
} |
||||
|
this.state.imported = null |
||||
|
this.state.loading = false |
||||
|
} |
||||
|
|
||||
|
save() { |
||||
|
if (this.state.loading) { |
||||
|
return |
||||
|
} |
||||
|
this.state.error = null; |
||||
|
|
||||
|
const input = Object.assign({}, this.state.values) |
||||
|
if (input.date != "" && input.importer !== "ForumLog") { |
||||
|
input.date = new Date(input.date) |
||||
|
if (Number.isNaN(input.date)) { |
||||
|
this.state.error = "Invalid date" |
||||
|
return |
||||
|
} |
||||
|
} else if (input.importer === "MircLike") { |
||||
|
this.state.error = "Date is required for mIRC-like logs" |
||||
|
return |
||||
|
} else { |
||||
|
input.date = null; |
||||
|
} |
||||
|
|
||||
|
if (input.channelName.length < 2 || input.channelName.includes(" ") || input.channelName.includes(" ") || input.channelName.charAt(0) !== "#") { |
||||
|
this.state.error = "A valid channelName name is required" |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
this.state.loading = true |
||||
|
logsApi.import(input).then(logs => { |
||||
|
this.state.imported = logs |
||||
|
}).catch(errs => { |
||||
|
console.warn("Import failed:", errs) |
||||
|
|
||||
|
this.state.error = "Import failed: " + errs[0].message |
||||
|
}).then(() => { |
||||
|
this.state.loading = false |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,44 @@ |
|||||
|
import moment from "moment" |
||||
|
|
||||
|
<modal class="modal color-text nolabel" key="modal" enabled=(input.enabled) closable on-close("close") on-open("open") > |
||||
|
<if(state.imported == null)> |
||||
|
<h1>Import Log</h1> |
||||
|
|
||||
|
<p key="error" class="color-error">${state.error}</p> |
||||
|
|
||||
|
<label>Type</label> |
||||
|
<select key="importer" autofocus class="big" placeholder="Kind" on-change("change", "importer") value=state.values.importer> |
||||
|
<option value="MircLike" selected=(state.values.importer === "MircLike")>mIRC-Like log</option> |
||||
|
<option value="ForumLog" selected=(state.values.importer === "ForumLog")>Forum Log</option> |
||||
|
</select> |
||||
|
|
||||
|
<label>Timezone</label> |
||||
|
<select key="timezone" class="big" placeholder="Kind" on-change("change", "timezone") value=state.values.timezone> |
||||
|
<option for(tz in state.timezones) value=tz selected=(state.values.timezone === tz)>${tz}</option> |
||||
|
</select> |
||||
|
|
||||
|
<label>Channel</label> |
||||
|
<input key="channelName" placeholder="(Required)" class="big" on-change("change", "channelName") value=state.values.channelName /> |
||||
|
|
||||
|
<if(state.values.importer === "MircLike")> |
||||
|
<label>Date</label> |
||||
|
<input key="date" class="big" placeholder="(Required)" on-change("change", "date") value=state.values.date /> |
||||
|
</if> |
||||
|
|
||||
|
<label>Content</label> |
||||
|
<textarea key="data" placeholder="(Required)" class="tall" on-change("change", "data") value=state.values.data /> |
||||
|
|
||||
|
<button disabled=state.loading on-click("save")>Import</button> |
||||
|
</if> |
||||
|
<else> |
||||
|
<h1>Import Successful</h1> |
||||
|
|
||||
|
<p>The following logs were imported.</p> |
||||
|
|
||||
|
<ol class="imported-log-list"> |
||||
|
<for (log in state.imported)> |
||||
|
<li><a class="color-primary" href=("/logs/" + log.id)>${log.id} (${moment(log.date).format("MMMM D, YYYY")})</a></li> |
||||
|
</for> |
||||
|
</ol> |
||||
|
</else> |
||||
|
</modal> |
||||
@ -0,0 +1,9 @@ |
|||||
|
ol.imported-log-list { |
||||
|
color: #777; |
||||
|
|
||||
|
li { |
||||
|
a:hover { |
||||
|
text-decoration: underline; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue