Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

sulistiyono #13

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
node_modules
3 changes: 2 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
# kanban
# kanban
https://kanban-example.firebaseapp.com/#/
5 changes: 5 additions & 0 deletions babel.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
module.exports = {
presets: [
['@vue/app', { useBuiltIns: 'entry' }]
]
}
11,854 changes: 11,854 additions & 0 deletions package-lock.json

Large diffs are not rendered by default.

26 changes: 26 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
{
"name": "sulistyo-group",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.4",
"@fortawesome/vue-fontawesome": "^0.1.1",
"axios": "^0.18.0",
"firebase": "^5.5.0",
"vue": "^2.5.17",
"vue-router": "^3.0.1",
"vue-styled-components": "^1.4.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.0.0",
"@vue/cli-plugin-eslint": "^3.0.0",
"@vue/cli-service": "^3.0.0",
"@vue/eslint-config-standard": "^3.0.3",
"vue-template-compiler": "^2.5.17"
}
}
Binary file added public/favicon.ico
Binary file not shown.
35 changes: 35 additions & 0 deletions public/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,500,700,900" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Lato:300,500,700,900" rel="stylesheet">

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous"></script>
<!-- Font awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU"
crossorigin="anonymous">
<title>Kanban Firebase</title>
</head>

<body>
<noscript>
<strong>We're sorry but test-client doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>

</html>
14 changes: 14 additions & 0 deletions src/App.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
<template>
<div id="app">
<router-view/>
</div>
</template>

<script>
export default {
created () {},
data: function () {
return {}
}
}
</script>
Binary file added src/assets/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
79 changes: 79 additions & 0 deletions src/components/ContentCard.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
<template>
<div class="card">
<div class="card-header">{{item.title}}</div>
<div class="card-body">
<p>
Description:
<span>{{item.description}}</span>
</p>
<p>
Assigned to :
<span>{{item.assigned}}</span>
</p>
<a @click="removeItem" class="btn btn-outline-danger">delete</a>
<a @click="actionOne" class="btn btn-outline-success">{{buttonOne}}</a>
<a @click="actionTwo" v-if="buttonTwo" class="btn btn-outline-warning">{{buttonTwo}}</a>
</div>
</div>
</template>

<script>
import database from "../assets/config.js";

export default {
name: "ContentCard",
data: function() {
return {
buttonOne: "",
buttonTwo: ""
};
},
props: ["item", "name"],
methods: {
actionOne() {
database.ref(`/${this.item.id}`).remove();
database.ref("/").push({
title: this.item.title,
description: this.item.description,
assigned: this.item.assigned,
status: this.buttonOne
});
},
actionTwo() {
database.ref(`/${this.item.id}`).remove();
database.ref("/").push({
title: this.item.title,
description: this.item.description,
assigned: this.item.assigned,
status: this.buttonTwo
});
},
removeItem() {
database.ref(`/${this.item.id}`).remove();
}
},
created() {
if (this.name === "Back-Log") {
this.buttonOne = "To-Do";
this.buttonTwo = null;
} else if (this.name === "To-Do") {
this.buttonOne = "Back-Log";
this.buttonTwo = "Doing";
} else if (this.name === "Doing") {
this.buttonOne = "Done";
this.buttonTwo = "To-Do";
} else if (this.name === "Done") {
this.buttonOne = "Doing";
this.buttonTwo = null;
}
}
};
</script>

<style scoped>
.btn {
padding-top: 2px;
padding-bottom: 2px;
margin: 5px;
}
</style>
62 changes: 62 additions & 0 deletions src/components/KanbanCard.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
<template>
<div class="card">
<div class="card">
<div id="Back-Log" class="card-header" v-if="data.name==`Back-Log`">{{data.name}}</div>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Indentasinya di rapihkan

Suggested change
<div id="Back-Log" class="card-header" v-if="data.name==`Back-Log`">{{data.name}}</div>
<div id="Back-Log" class="card-header" v-if="data.name === `Back-Log`">{{data.name}}</div>

<div id="To-Do" class="card-header" v-if="data.name==`To-Do`">{{data.name}}</div>
<div id="Doing" class="card-header" v-if="data.name==`Doing`">{{data.name}}</div>
<div id="Done" class="card-header" v-if="data.name==`Done`">{{data.name}}</div>
<ContentCard v-for="(item) in data.data" :key="item.id" :item="item" :name="data.name"></ContentCard>
</div>
</div>
</template>

<script>
import ContentCard from "@/components/ContentCard.vue";
export default {
name: "KanbanCard",
components: {
ContentCard
},
data: function() {

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Kalau ga ada data ga usah di initialized kaya gini juga ga maslah

return {};
},
props: ["data"],
created() {
this.cardTitle = this.title;
}
};
</script>

<style scoped>
.card {
margin: 5px;
}
#Back-Log {
font-size: 20px;
color: #ffff;
width: 100%;
height: 100%;
background-color: red;
}
#To-Do {
font-size: 20px;
color: #ffff;
width: 100%;
height: 100%;
background-color: #ff9900;
}
#Doing {
font-size: 20px;
color: #ffff;
width: 100%;
height: 100%;
background-color: #0066ff;
}
#Done {
font-size: 20px;
color: #ffff;
width: 100%;
height: 100%;
background-color: green;
}
</style>
89 changes: 89 additions & 0 deletions src/components/MainHeader.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
<template>
<div class="main-header">
<div class="container">
<h2 style="float:left;margin-top:20px;font-weight:bold">
<hr>kanban
<span style="color:#00b33c;">Board</span>
<hr>
</h2>

<button
type="button"
class="btn btn-primary"
data-toggle="modal"
data-target="#exampleModalCenter"
style="float:right; margin-top:30px"
>New Task</button>
</div>

<!-- Modal -->
<div
class="modal fade"
id="exampleModalCenter"
tabindex="-1"
role="dialog"
aria-labelledby="exampleModalCenterTitle"
aria-hidden="true"
>
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalCenterTitle">New Task</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="exampleInputEmail1" style="float:left">Title</label>
<input type="text" class="form-control" v-model="taskName">
</div>
<div class="form-group">
<label for="exampleInputEmail1" style="float:left">Description :</label>
<input type="text" class="form-control" v-model="description">
</div>
<div class="form-group">
<label for="exampleInputEmail1" style="float:left">Assigned To:</label>
<input type="text" class="form-control" v-model="assigned">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" @click="sendItem">Save changes</button>
</div>
</div>
</div>
</div>
</div>
</template>

<script>
import database from "../assets/config.js";

export default {
name: "MainHeader",
data() {
return {
taskName: "",
description: "",
assigned: ""
};
},
methods: {
sendItem() {
database.ref("/").push({
title: this.taskName,
description: this.description,
assigned: this.assigned,
status: "Back-Log"
});
this.taskName = "";
this.description = "";
this.assigned = "";
}
}
};
</script>

<style scoped>
</style>
13 changes: 13 additions & 0 deletions src/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import Vue from 'vue'
import App from './App.vue'
import router from './router'

import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
Vue.component('font-awesome-icon', FontAwesomeIcon)

Vue.config.productionTip = false

new Vue({
router,
render: h => h(App)
}).$mount('#app')
15 changes: 15 additions & 0 deletions src/router.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import Vue from 'vue'
import Router from 'vue-router'
import Home from './views/Home.vue'

Vue.use(Router)

export default new Router({
routes: [
{
path: '/',
name: 'home',
component: Home
}
]
})
Loading