Skip to content

P
Platform
Unverified Commit 02e81260 authored by Nicolas Widart's avatar Nicolas Widart
Browse files
Options

Adding feature to toggle status

parent 90c144e0
Hide whitespace changes
Inline Side-by-side
Showing with 250 additions and 89 deletions
Modules/Page/Assets/js/components/PageTableServerSide.vue
View file @ 02e81260
......@@ -18,7 +18,16 @@
<div class="box-body">
<div class="sc-table">
<div class="tool-bar el-row" style="padding-bottom: 20px;">
<div class="actions el-col el-col-5">
<div class="actions el-col el-col-8">
<el-dropdown @command="handleExtraActions" v-if="showExtraButtons">
<el-button type="primary">
{{ trans('core.table.actions') }}<i class="el-icon-caret-bottom el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="mark-online">Mark as online</el-dropdown-item>
<el-dropdown-item command="mark-offline">Mark as offline</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<router-link :to="{name: 'admin.page.page.create'}">
<el-button type="primary"><i class="el-icon-edit"></i>
{{ trans('page.create page') }}
......@@ -35,8 +44,19 @@
:data="data"
stripe
style="width: 100%"
ref="pageTable"
v-loading.body="tableIsLoading"
@sort-change="handleSortChange">
@sort-change="handleSortChange"
@selection-change="handleSelectionChange">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column :label="trans('page.status')" width="75">
<template scope="scope">
<i class="el-icon-fa-circle" :class="(scope.row.translations.status === true) ? 'text-success':'text-danger'"></i>
</template>
</el-table-column>
<el-table-column prop="id" label="Id" width="100" sortable="custom">
</el-table-column>
<el-table-column prop="translations.title" :label="trans('page.title')">
......@@ -99,6 +119,13 @@
links: {},
searchQuery: '',
tableIsLoading: false,
showExtraButtons: false,
selectedPages: {},
}
},
watch: {
selectedPages() {
this.selectedPages.length >= 1 ? this.showExtraButtons = true : this.showExtraButtons = false;
}
},
methods: {
......@@ -149,6 +176,33 @@
this.tableIsLoading = true;
this.queryServer({search: query});
},
handleExtraActions(action) {
let pageIds = _.map(this.selectedPages, function(elem) {
return elem.id;
});
axios.get(route('api.page.page.mark-status', {action: action, pageIds: JSON.stringify(pageIds)}))
.then(response => {
this.$message({
type: 'success',
message: response.data.message
});
this.$refs.pageTable.clearSelection();
this.data.find(function (page) {
if (pageIds.indexOf(page.id) >= 0) {
page.translations.status = action === 'mark-online';
}
});
})
.catch(error => {
this.$message({
type: 'error',
message: this.trans('core.something went wrong'),
});
})
},
handleSelectionChange(selectedPages) {
this.selectedPages = selectedPages;
},
},
mounted() {
this.fetchData();
......
public/js/app.js
View file @ 02e81260
......@@ -31247,6 +31247,9 @@ var app = new _vue2.default({
});
window.axios.interceptors.response.use(null, function (error) {
if (error.response === undefined) {
console.log(error);
}
if (error.response.status === 403) {
app.$notify.error({
title: app.$t('core.unauthorized'),
......@@ -72773,6 +72776,26 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var _data = void 0;
......@@ -72791,10 +72814,17 @@ exports.default = {
},
links: {},
searchQuery: '',
tableIsLoading: false
tableIsLoading: false,
showExtraButtons: false,
selectedPages: {}
};
},
watch: {
selectedPages: function selectedPages() {
this.selectedPages.length >= 1 ? this.showExtraButtons = true : this.showExtraButtons = false;
}
},
methods: {
queryServer: function queryServer(customProperties) {
var _this = this;
......@@ -72843,6 +72873,33 @@ exports.default = {
console.log('searching:' + query);
this.tableIsLoading = true;
this.queryServer({ search: query });
},
handleExtraActions: function handleExtraActions(action) {
var _this2 = this;
var pageIds = _lodash2.default.map(this.selectedPages, function (elem) {
return elem.id;
});
_axios2.default.get(route('api.page.page.mark-status', { action: action, pageIds: JSON.stringify(pageIds) })).then(function (response) {
_this2.$message({
type: 'success',
message: response.data.message
});
_this2.$refs.pageTable.clearSelection();
_this2.data.find(function (page) {
if (pageIds.indexOf(page.id) >= 0) {
page.translations.status = action === 'mark-online';
}
});
}).catch(function (error) {
_this2.$message({
type: 'error',
message: _this2.trans('core.something went wrong')
});
});
},
handleSelectionChange: function handleSelectionChange(selectedPages) {
this.selectedPages = selectedPages;
}
},
mounted: function mounted() {
......@@ -72917,8 +72974,28 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
"padding-bottom": "20px"
}
}, [_c('div', {
staticClass: "actions el-col el-col-5"
}, [_c('router-link', {
staticClass: "actions el-col el-col-8"
}, [(_vm.showExtraButtons) ? _c('el-dropdown', {
on: {
"command": _vm.handleExtraActions
}
}, [_c('el-button', {
attrs: {
"type": "primary"
}
}, [_vm._v("\n " + _vm._s(_vm.trans('core.table.actions'))), _c('i', {
staticClass: "el-icon-caret-bottom el-icon--right"
})]), _vm._v(" "), _c('el-dropdown-menu', {
slot: "dropdown"
}, [_c('el-dropdown-item', {
attrs: {
"command": "mark-online"
}
}, [_vm._v("Mark as online")]), _vm._v(" "), _c('el-dropdown-item', {
attrs: {
"command": "mark-offline"
}
}, [_vm._v("Mark as offline")])], 1)], 1) : _vm._e(), _vm._v(" "), _c('router-link', {
attrs: {
"to": {
name: 'admin.page.page.create'
......@@ -72956,6 +73033,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
"body": true
}
}],
ref: "pageTable",
staticStyle: {
"width": "100%"
},
......@@ -72964,9 +73042,29 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
"stripe": ""
},
on: {
"sort-change": _vm.handleSortChange
"sort-change": _vm.handleSortChange,
"selection-change": _vm.handleSelectionChange
}
}, [_c('el-table-column', {
attrs: {
"type": "selection",
"width": "55"
}
}), _vm._v(" "), _c('el-table-column', {
attrs: {
"label": _vm.trans('page.status'),
"width": "75"
},
scopedSlots: _vm._u([{
key: "default",
fn: function(scope) {
return [_c('i', {
staticClass: "el-icon-fa-circle",
class: (scope.row.translations.status === true) ? 'text-success' : 'text-danger'
})]
}
}])
}), _vm._v(" "), _c('el-table-column', {
attrs: {
"prop": "id",
"label": "Id",
......@@ -74343,7 +74441,7 @@ if(false) {
/* 122 */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(123)(undefined);
exports = module.exports = __webpack_require__(143)(undefined);
// imports
......@@ -74354,88 +74452,7 @@ exports.push([module.i, "\n.ckeditor::after {\n content: \"\";\n display:
/***/ }),
/* 123 */
/***/ (function(module, exports) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function(useSourceMap) {
var list = [];
// return the list of modules as css string
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if(item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
};
// import a list of modules into the list
list.i = function(modules, mediaQuery) {
if(typeof modules === "string")
modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for(var i = 0; i < this.length; i++) {
var id = this[i][0];
if(typeof id === "number")
alreadyImportedModules[id] = true;
}
for(i = 0; i < modules.length; i++) {
var item = modules[i];
// skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if(mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if(mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
}
// Adapted from convert-source-map (MIT)
function toComment(sourceMap) {
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ }),
/* 123 */,
/* 124 */
/***/ (function(module, exports, __webpack_require__) {
......@@ -75110,5 +75127,95 @@ if (false) {
// removed by extract-text-webpack-plugin
/***/ }),
/* 135 */,
/* 136 */,
/* 137 */,
/* 138 */,
/* 139 */,
/* 140 */,
/* 141 */,
/* 142 */,
/* 143 */
/***/ (function(module, exports) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function(useSourceMap) {
var list = [];
// return the list of modules as css string
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if(item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
};
// import a list of modules into the list
list.i = function(modules, mediaQuery) {
if(typeof modules === "string")
modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for(var i = 0; i < this.length; i++) {
var id = this[i][0];
if(typeof id === "number")
alreadyImportedModules[id] = true;
}
for(i = 0; i < modules.length; i++) {
var item = modules[i];
// skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if(typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if(mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if(mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */'
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
}
// Adapted from convert-source-map (MIT)
function toComment(sourceMap) {
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ })
/******/ ]);
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Technounit-GROUP 2023