Browse Source

Update delete project

pull/10/head
Hironsan 6 years ago
parent
commit
48dafcd28b
4 changed files with 27 additions and 2 deletions
  1. BIN
      app/db.sqlite3
  2. 2
      app/server/static/bundle/projects.js
  3. 5
      app/server/static/js/projects.js
  4. 22
      app/server/templates/projects.html

BIN
app/db.sqlite3

2
app/server/static/bundle/projects.js

@ -460,7 +460,7 @@ eval("var g;\n\n// This works in non-strict mode\ng = (function() {\n\treturn th
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ \"./node_modules/axios/index.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__);\n\n\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfCookieName = 'csrftoken';\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfHeaderName = 'X-CSRFToken';\nconst baseUrl = window.location.href.split('/').slice(0, 3).join('/');\n\n\nconst vm = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n el: '#projects_root',\n delimiters: ['[[', ']]'],\n data: {\n items: [],\n selectedType: 'All',\n isActive: false,\n },\n\n methods: {\n getProjects() {\n axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(`${baseUrl}/api/projects`).then((response) => {\n this.items = response.data;\n });\n },\n\n deleteProject(project) {\n axios__WEBPACK_IMPORTED_MODULE_1___default.a.delete(`${baseUrl}/api/projects/${project.id}/`).then((response) => {\n });\n },\n\n updateSelectedType(type) {\n this.selectedType = type;\n },\n },\n\n computed: {\n uniqueProjectTypes() {\n const types = [];\n for (let i = 0; i < this.items.length; i++) {\n const item = this.items[i];\n types.push(item.project_type);\n }\n const uniqueTypes = Array.from(new Set(types));\n\n return uniqueTypes;\n },\n\n filteredProjects() {\n // filter projects\n const projects = [];\n for (let i = 0; i < this.items.length; i++) {\n const item = this.items[i];\n if ((this.selectedType === 'All') || (item.project_type === this.selectedType)) {\n projects.push(item);\n }\n }\n // create nested projects\n const nestedProjects = [];\n for (let i = 0; i < Math.ceil(projects.length / 3); i++) {\n const p = projects.slice(i * 3, (i + 1) * 3);\n nestedProjects.push(p);\n }\n return nestedProjects;\n },\n },\n\n created() {\n this.getProjects();\n },\n});\n\n\n//# sourceURL=webpack:///./static/js/projects.js?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.esm.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ \"./node_modules/axios/index.js\");\n/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__);\n\n\n\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfCookieName = 'csrftoken';\naxios__WEBPACK_IMPORTED_MODULE_1___default.a.defaults.xsrfHeaderName = 'X-CSRFToken';\nconst baseUrl = window.location.href.split('/').slice(0, 3).join('/');\n\n\nconst vm = new vue__WEBPACK_IMPORTED_MODULE_0__[\"default\"]({\n el: '#projects_root',\n delimiters: ['[[', ']]'],\n data: {\n items: [],\n selectedType: 'All',\n isActive: false,\n isDelete: false,\n },\n\n methods: {\n getProjects() {\n axios__WEBPACK_IMPORTED_MODULE_1___default.a.get(`${baseUrl}/api/projects`).then((response) => {\n this.items = response.data;\n });\n },\n\n deleteProject(project) {\n axios__WEBPACK_IMPORTED_MODULE_1___default.a.delete(`${baseUrl}/api/projects/${project.id}/`).then((response) => {\n this.isDelete = false;\n const index = this.items.indexOf(project);\n this.items.splice(index, 1);\n });\n },\n\n updateSelectedType(type) {\n this.selectedType = type;\n },\n },\n\n computed: {\n uniqueProjectTypes() {\n const types = [];\n for (let i = 0; i < this.items.length; i++) {\n const item = this.items[i];\n types.push(item.project_type);\n }\n const uniqueTypes = Array.from(new Set(types));\n\n return uniqueTypes;\n },\n\n filteredProjects() {\n // filter projects\n const projects = [];\n for (let i = 0; i < this.items.length; i++) {\n const item = this.items[i];\n if ((this.selectedType === 'All') || (item.project_type === this.selectedType)) {\n projects.push(item);\n }\n }\n // create nested projects\n const nestedProjects = [];\n for (let i = 0; i < Math.ceil(projects.length / 3); i++) {\n const p = projects.slice(i * 3, (i + 1) * 3);\n nestedProjects.push(p);\n }\n return nestedProjects;\n },\n },\n\n created() {\n this.getProjects();\n },\n});\n\n\n//# sourceURL=webpack:///./static/js/projects.js?");
/***/ })

5
app/server/static/js/projects.js

@ -1,5 +1,6 @@
import Vue from 'vue';
import axios from 'axios';
axios.defaults.xsrfCookieName = 'csrftoken';
axios.defaults.xsrfHeaderName = 'X-CSRFToken';
const baseUrl = window.location.href.split('/').slice(0, 3).join('/');
@ -12,6 +13,7 @@ const vm = new Vue({
items: [],
selectedType: 'All',
isActive: false,
isDelete: false,
},
methods: {
@ -23,6 +25,9 @@ const vm = new Vue({
deleteProject(project) {
axios.delete(`${baseUrl}/api/projects/${project.id}/`).then((response) => {
this.isDelete = false;
const index = this.items.indexOf(project);
this.items.splice(index, 1);
});
},

22
app/server/templates/projects.html

@ -74,8 +74,11 @@
</div>
</div>
<div class="columns features" v-for="projects in filteredProjects">
<div class="column is-4" v-for="project in projects">
<div class="card is-shady">
<div class="card-image">
<figure class="image is-4by3">
@ -93,9 +96,26 @@
</div>
</div>
{% if user.is_superuser %}
<!-- Modal card for creating project. -->
<div class="modal" :class="{ 'is-active': isDelete }">
<div class="modal-background"></div>
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Delete Project</p>
<button class="delete" aria-label="close" @click="isDelete=!isDelete"></button>
</header>
<section class="modal-card-body">
Are you sure you want to delete project?
</section>
<footer class="modal-card-foot" style="background-color:#dbdbdb !important;padding:20px !important;">
<button class="button is-danger" @click="deleteProject(project)">Delete</button>
<button class="button" @click="isDelete=!isDelete">Cancel</button>
</footer>
</div>
</div>
<div class="card-footer">
<a v-bind:href="'/projects/' + project.id + '/docs'" class="card-footer-item">Edit</a>
<a href="" class="card-footer-item has-text-danger" style="font-weight:700" @click="deleteProject(project)">Delete</a>
<a href="#1" class="card-footer-item has-text-danger" style="font-weight:700" @click="isDelete=!isDelete">Delete</a>
</div>
{% endif %}
</div>

Loading…
Cancel
Save