Adding feature to toggle status

parent 90c144e0
...@@ -18,7 +18,16 @@ ...@@ -18,7 +18,16 @@
<div class="box-body"> <div class="box-body">
<div class="sc-table"> <div class="sc-table">
<div class="tool-bar el-row" style="padding-bottom: 20px;"> <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'}"> <router-link :to="{name: 'admin.page.page.create'}">
<el-button type="primary"><i class="el-icon-edit"></i> <el-button type="primary"><i class="el-icon-edit"></i>
{{ trans('page.create page') }} {{ trans('page.create page') }}
...@@ -35,8 +44,19 @@ ...@@ -35,8 +44,19 @@
:data="data" :data="data"
stripe stripe
style="width: 100%" style="width: 100%"
ref="pageTable"
v-loading.body="tableIsLoading" 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 prop="id" label="Id" width="100" sortable="custom">
</el-table-column> </el-table-column>
<el-table-column prop="translations.title" :label="trans('page.title')"> <el-table-column prop="translations.title" :label="trans('page.title')">
...@@ -99,6 +119,13 @@ ...@@ -99,6 +119,13 @@
links: {}, links: {},
searchQuery: '', searchQuery: '',
tableIsLoading: false, tableIsLoading: false,
showExtraButtons: false,
selectedPages: {},
}
},
watch: {
selectedPages() {
this.selectedPages.length >= 1 ? this.showExtraButtons = true : this.showExtraButtons = false;
} }
}, },
methods: { methods: {
...@@ -149,6 +176,33 @@ ...@@ -149,6 +176,33 @@
this.tableIsLoading = true; this.tableIsLoading = true;
this.queryServer({search: query}); 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() { mounted() {
this.fetchData(); this.fetchData();
......
...@@ -31247,6 +31247,9 @@ var app = new _vue2.default({ ...@@ -31247,6 +31247,9 @@ var app = new _vue2.default({
}); });
window.axios.interceptors.response.use(null, function (error) { window.axios.interceptors.response.use(null, function (error) {
if (error.response === undefined) {
console.log(error);
}
if (error.response.status === 403) { if (error.response.status === 403) {
app.$notify.error({ app.$notify.error({
title: app.$t('core.unauthorized'), title: app.$t('core.unauthorized'),
...@@ -72773,6 +72776,26 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de ...@@ -72773,6 +72776,26 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
// //
// //
// //
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var _data = void 0; var _data = void 0;
...@@ -72791,10 +72814,17 @@ exports.default = { ...@@ -72791,10 +72814,17 @@ exports.default = {
}, },
links: {}, links: {},
searchQuery: '', searchQuery: '',
tableIsLoading: false tableIsLoading: false,
showExtraButtons: false,
selectedPages: {}
}; };
}, },
watch: {
selectedPages: function selectedPages() {
this.selectedPages.length >= 1 ? this.showExtraButtons = true : this.showExtraButtons = false;
}
},
methods: { methods: {
queryServer: function queryServer(customProperties) { queryServer: function queryServer(customProperties) {
var _this = this; var _this = this;
...@@ -72843,6 +72873,33 @@ exports.default = { ...@@ -72843,6 +72873,33 @@ exports.default = {
console.log('searching:' + query); console.log('searching:' + query);
this.tableIsLoading = true; this.tableIsLoading = true;
this.queryServer({ search: query }); 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() { mounted: function mounted() {
...@@ -72917,8 +72974,28 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c ...@@ -72917,8 +72974,28 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
"padding-bottom": "20px" "padding-bottom": "20px"
} }
}, [_c('div', { }, [_c('div', {
staticClass: "actions el-col el-col-5" staticClass: "actions el-col el-col-8"
}, [_c('router-link', { }, [(_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: { attrs: {
"to": { "to": {
name: 'admin.page.page.create' name: 'admin.page.page.create'
...@@ -72956,6 +73033,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c ...@@ -72956,6 +73033,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
"body": true "body": true
} }
}], }],
ref: "pageTable",
staticStyle: { staticStyle: {
"width": "100%" "width": "100%"
}, },
...@@ -72964,9 +73042,29 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c ...@@ -72964,9 +73042,29 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c
"stripe": "" "stripe": ""
}, },
on: { on: {
"sort-change": _vm.handleSortChange "sort-change": _vm.handleSortChange,
"selection-change": _vm.handleSelectionChange
} }
}, [_c('el-table-column', { }, [_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: { attrs: {
"prop": "id", "prop": "id",
"label": "Id", "label": "Id",
...@@ -74343,7 +74441,7 @@ if(false) { ...@@ -74343,7 +74441,7 @@ if(false) {
/* 122 */ /* 122 */
/***/ (function(module, exports, __webpack_require__) { /***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(123)(undefined); exports = module.exports = __webpack_require__(143)(undefined);
// imports // imports
...@@ -74354,88 +74452,7 @@ exports.push([module.i, "\n.ckeditor::after {\n content: \"\";\n display: ...@@ -74354,88 +74452,7 @@ exports.push([module.i, "\n.ckeditor::after {\n content: \"\";\n display:
/***/ }), /***/ }),
/* 123 */ /* 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 + ' */';
}
/***/ }),
/* 124 */ /* 124 */
/***/ (function(module, exports, __webpack_require__) { /***/ (function(module, exports, __webpack_require__) {
...@@ -75110,5 +75127,95 @@ if (false) { ...@@ -75110,5 +75127,95 @@ if (false) {
// removed by extract-text-webpack-plugin // 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