110 lines
5.0 KiB
JavaScript
110 lines
5.0 KiB
JavaScript
let m = require('mithril')
|
|
let _ = require('lodash')
|
|
let category = require('../models/category')
|
|
let nav = require('./nav')
|
|
let Loading = require('./Loading')
|
|
|
|
var createCategory = {
|
|
oninit: function() {
|
|
category.loadList()
|
|
},
|
|
current: [],
|
|
view: function() {
|
|
return m('main.documentation', m('section', [
|
|
m('h1', 'Kategori'),
|
|
category.loading ? m(Loading) :
|
|
m('.flex.two-600.full.grow', [
|
|
m('div', m('form', {
|
|
onsubmit: function(e) {
|
|
e.preventDefault()
|
|
category.entry()
|
|
}
|
|
}, [
|
|
m('h2', 'Tambah Kategori'),
|
|
m('.flex.three-600.two.grow', [
|
|
m('.third-600.full', m('label', {for: 'category'}, 'Nama')),
|
|
m('.two-third-600.full', m('input', {
|
|
type: 'text',
|
|
name: 'category',
|
|
autocomplete: 'off',
|
|
oninput: m.withAttr('value', function(value) {
|
|
category.current.category = value
|
|
}),
|
|
value: _.isString(category.current.category) ? category.current.category : ''
|
|
})),
|
|
m('.third-600.full', m('label', {for: 'background'}, 'Background')),
|
|
m('.two-third-600.full', m('input', {
|
|
type: 'color',
|
|
name: 'background',
|
|
oninput: m.withAttr('value', function(value) {
|
|
category.current.background = value
|
|
}),
|
|
value: _.isString(category.current.background) ? category.current.background : ''
|
|
})),
|
|
m('.third-600.full', m('label', {for: 'foreground'}, 'Teks')),
|
|
m('.two-third-600.full', m('input', {
|
|
type: 'color',
|
|
name: 'foreground',
|
|
oninput: m.withAttr('value', function(value) {
|
|
category.current.foreground = value
|
|
}),
|
|
value: _.isString(category.current.foreground) ? category.current.foreground : ''
|
|
})),
|
|
m('button.pseudo.full', {
|
|
type: 'submit'
|
|
}, [
|
|
m('i.fa.fa-plus.fa-fw', {
|
|
'aria-hidden': 'true'
|
|
}),
|
|
m('span', 'Tambah')
|
|
])
|
|
])
|
|
])),
|
|
m('div', [
|
|
m('h2', 'List'),
|
|
m('ul', {
|
|
style: 'margin-top:0;'
|
|
}, category.list.map(function(cat) {
|
|
return m('li', [
|
|
m('div', {
|
|
style: 'height: initial; text-align: center; border-radius: 5px; background-color: ' + cat.background + '; color: ' + cat.foreground + ';'
|
|
}, m('span', cat.category)),
|
|
m('.flex.two-600.full.grow', {
|
|
style: 'margin: 0;'
|
|
}, [
|
|
m('div', m('a.pseudo.button.full', {
|
|
style: 'cursor: pointer;',
|
|
onclick: function() {
|
|
m.route.set('/kategori/' + cat.id)
|
|
}
|
|
}, [
|
|
m('i.fa.fa-edit.fa-fw'),
|
|
m('span', {
|
|
style: 'font-size: smaller'
|
|
}, 'Ubah')
|
|
])),
|
|
m('div', m('button.pseudo.full', {
|
|
style: 'height: inherit',
|
|
onclick: function() {
|
|
category.toggleStatus(cat.id)
|
|
}
|
|
}, [
|
|
m('i.fa.fa-fw', {
|
|
class: (cat.status == 1) ? 'fa-times-circle-o' : 'fa-check'
|
|
}),
|
|
m('span', {
|
|
style: 'font-size: smaller;'
|
|
}, (cat.status == 1) ? 'Matikan' : 'Aktifkan')
|
|
]))
|
|
]),
|
|
m('.fourth-600.none')
|
|
])
|
|
}))
|
|
])
|
|
])
|
|
]))
|
|
}
|
|
}
|
|
|
|
module.exports = createCategory
|