@nixweb/nixloc-ui 1.9.0 → 1.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/@nixweb/nixloc-ui/package.json +88 -88
- package/@nixweb/nixloc-ui/src/App.vue +13 -13
- package/@nixweb/nixloc-ui/src/component/forms/Button.vue +163 -163
- package/@nixweb/nixloc-ui/src/component/forms/CheckboxGroup.vue +69 -69
- package/@nixweb/nixloc-ui/src/component/forms/CheckboxServer.vue +192 -192
- package/@nixweb/nixloc-ui/src/component/forms/CheckboxSimple.vue +60 -60
- package/@nixweb/nixloc-ui/src/component/forms/Color.vue +38 -38
- package/@nixweb/nixloc-ui/src/component/forms/DateTime.vue +170 -170
- package/@nixweb/nixloc-ui/src/component/forms/Dropdown.vue +236 -236
- package/@nixweb/nixloc-ui/src/component/forms/EditorHtml.vue +132 -132
- package/@nixweb/nixloc-ui/src/component/forms/FileUpload.vue +170 -170
- package/@nixweb/nixloc-ui/src/component/forms/InputDecimal.vue +153 -153
- package/@nixweb/nixloc-ui/src/component/forms/InputNumber.vue +160 -160
- package/@nixweb/nixloc-ui/src/component/forms/InputPassword.vue +148 -148
- package/@nixweb/nixloc-ui/src/component/forms/InputText.vue +174 -174
- package/@nixweb/nixloc-ui/src/component/forms/Modal.vue +57 -57
- package/@nixweb/nixloc-ui/src/component/forms/RadioGroup.vue +91 -91
- package/@nixweb/nixloc-ui/src/component/forms/Select.vue +378 -378
- package/@nixweb/nixloc-ui/src/component/forms/SelectStatic.vue +198 -198
- package/@nixweb/nixloc-ui/src/component/forms/Slider.vue +18 -18
- package/@nixweb/nixloc-ui/src/component/forms/TextArea.vue +138 -138
- package/@nixweb/nixloc-ui/src/component/layout/Alert.vue +88 -88
- package/@nixweb/nixloc-ui/src/component/layout/Badge.vue +111 -111
- package/@nixweb/nixloc-ui/src/component/layout/FixedBar.vue +103 -103
- package/@nixweb/nixloc-ui/src/component/layout/Header.vue +56 -56
- package/@nixweb/nixloc-ui/src/component/layout/LoadingFullPage.vue +27 -27
- package/@nixweb/nixloc-ui/src/component/layout/Menu.vue +287 -287
- package/@nixweb/nixloc-ui/src/component/layout/Molded.vue +30 -30
- package/@nixweb/nixloc-ui/src/component/layout/Panel.vue +185 -185
- package/@nixweb/nixloc-ui/src/component/layout/Popover.vue +126 -126
- package/@nixweb/nixloc-ui/src/component/layout/ScrollBar.vue +57 -57
- package/@nixweb/nixloc-ui/src/component/layout/Wizard.vue +211 -211
- package/@nixweb/nixloc-ui/src/component/shared/Collapse.vue +131 -131
- package/@nixweb/nixloc-ui/src/component/shared/ExportPDF.vue +116 -116
- package/@nixweb/nixloc-ui/src/component/shared/HorizontalFilter.vue +64 -64
- package/@nixweb/nixloc-ui/src/component/shared/Loading.vue +107 -107
- package/@nixweb/nixloc-ui/src/component/shared/LoadingMoreButton.vue +23 -23
- package/@nixweb/nixloc-ui/src/component/shared/Messages.vue +109 -109
- package/@nixweb/nixloc-ui/src/component/shared/PDFViewer.vue +24 -24
- package/@nixweb/nixloc-ui/src/component/shared/Pagination.vue +108 -108
- package/@nixweb/nixloc-ui/src/component/shared/ProgressBar.vue +25 -25
- package/@nixweb/nixloc-ui/src/component/shared/QueryButton.vue +66 -66
- package/@nixweb/nixloc-ui/src/component/shared/Search.vue +174 -174
- package/@nixweb/nixloc-ui/src/component/shared/Table.vue +174 -174
- package/@nixweb/nixloc-ui/src/component/shared/TableButton.vue +36 -36
- package/@nixweb/nixloc-ui/src/component/shared/TableTotalization.vue +47 -47
- package/@nixweb/nixloc-ui/src/component/shared/Tip.vue +42 -42
- package/@nixweb/nixloc-ui/src/component/shared/Toast.vue +69 -69
- package/@nixweb/nixloc-ui/src/component/shared/VerticalFilter.vue +97 -97
- package/@nixweb/nixloc-ui/src/component/shared/query-builder/AddRule.vue +203 -203
- package/@nixweb/nixloc-ui/src/component/shared/query-builder/DynamicComponentList.vue +70 -70
- package/@nixweb/nixloc-ui/src/component/shared/query-builder/QueryBuilder.vue +69 -69
- package/@nixweb/nixloc-ui/src/component/shared/query-builder/utilities.js +21 -21
- package/@nixweb/nixloc-ui/src/component/template/ListViewWithDataHandler.vue +429 -429
- package/@nixweb/nixloc-ui/src/component/template/ViewTemplateConfiguration.vue +64 -64
- package/@nixweb/nixloc-ui/src/component/template/ViewTemplateWithSalveCancel.vue +32 -32
- package/@nixweb/nixloc-ui/src/component/template/ViewTemplateWithTable.vue +62 -62
- package/@nixweb/nixloc-ui/src/config/axios.js +9 -9
- package/@nixweb/nixloc-ui/src/config/dicas.js +14 -14
- package/@nixweb/nixloc-ui/src/config/router.js +13 -13
- package/@nixweb/nixloc-ui/src/config/token.js +14 -14
- package/@nixweb/nixloc-ui/src/main.js +23 -23
- package/@nixweb/nixloc-ui/src/store/modules/generic.js +815 -815
- package/@nixweb/nixloc-ui/src/store/modules/validation.js +38 -38
- package/@nixweb/nixloc-ui/src/store/store.js +13 -13
- package/package.json +1 -1
- package/src/component/training/CourseView.vue +16 -7
- package/src/component/value-objects/Address.vue +4 -2
|
@@ -1,89 +1,89 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@nixweb/nixloc-ui",
|
|
3
|
-
"version": "0.0.290",
|
|
4
|
-
"description": "Componentes UI",
|
|
5
|
-
"author": "Fábio Ávila <fabio@nixweb.com.br>",
|
|
6
|
-
"private": false,
|
|
7
|
-
"scripts": {
|
|
8
|
-
"serve": "vue-cli-service serve",
|
|
9
|
-
"build": "vue-cli-service build",
|
|
10
|
-
"lint": "vue-cli-service lint"
|
|
11
|
-
},
|
|
12
|
-
"dependencies": {
|
|
13
|
-
"@babel/polyfill": "^7.12.1",
|
|
14
|
-
"@ckeditor/ckeditor5-vue2": "^2.0.0",
|
|
15
|
-
"@fullcalendar/core": "^5.11.3",
|
|
16
|
-
"@fullcalendar/daygrid": "^5.11.3",
|
|
17
|
-
"@fullcalendar/interaction": "^5.11.3",
|
|
18
|
-
"@fullcalendar/list": "^5.11.3",
|
|
19
|
-
"@fullcalendar/timegrid": "^5.11.3",
|
|
20
|
-
"@fullcalendar/vue": "^5.11.2",
|
|
21
|
-
"axios": "^0.24.0",
|
|
22
|
-
"bootstrap-vue": "^2.0.0-rc.11",
|
|
23
|
-
"core-js": "^3.6.5",
|
|
24
|
-
"frappe-gantt": "^0.6.1",
|
|
25
|
-
"sass-loader": "^10.1.1",
|
|
26
|
-
"timeline-vuejs": "^1.1.7",
|
|
27
|
-
"v-runtime-template": "^1.10.0",
|
|
28
|
-
"vodal": "^2.4.0",
|
|
29
|
-
"vue": "^2.6.11",
|
|
30
|
-
"vue-color": "^2.7.0",
|
|
31
|
-
"vue-currency-filter": "^3.3.0",
|
|
32
|
-
"vue-html2pdf": "^1.8.0",
|
|
33
|
-
"vue-image-crop-upload": "^3.0.3",
|
|
34
|
-
"vue-js-toggle-button": "^1.3.0",
|
|
35
|
-
"vue-json-excel": "^0.3.0",
|
|
36
|
-
"vue-loading-template": "^1.3.0",
|
|
37
|
-
"vue-moment": "^4.0.0",
|
|
38
|
-
"vue-multiselect": "^2.1.0",
|
|
39
|
-
"vue-numeric": "^2.4.1",
|
|
40
|
-
"vue-pdf-app": "^2.1.0",
|
|
41
|
-
"vue-print-nb": "^1.7.5",
|
|
42
|
-
"vue-router": "^3.0.1",
|
|
43
|
-
"vue-simple-progress": "^1.1.1",
|
|
44
|
-
"vue-the-mask": "^0.11.1",
|
|
45
|
-
"vue-toasted": "^1.1.28",
|
|
46
|
-
"vue-toggles": "^1.1.4",
|
|
47
|
-
"vue-upload-file": "^1.1.0",
|
|
48
|
-
"vue2-datepicker": "^2.13.0",
|
|
49
|
-
"vue2-editor": "^2.6.6",
|
|
50
|
-
"vue2-google-maps": "^0.10.7",
|
|
51
|
-
"vuedraggable": "^2.24.3",
|
|
52
|
-
"vuejs-ace-editor": "^1.0.1",
|
|
53
|
-
"vuex": "^3.6.2",
|
|
54
|
-
"vuex-persistedstate": "^4.0.0"
|
|
55
|
-
},
|
|
56
|
-
"devDependencies": {
|
|
57
|
-
"@vue/cli-plugin-babel": "~4.5.0",
|
|
58
|
-
"@vue/cli-service": "~4.5.0",
|
|
59
|
-
"babel-eslint": "^10.1.0",
|
|
60
|
-
"eslint": "^6.7.2",
|
|
61
|
-
"eslint-plugin-vue": "^6.2.2",
|
|
62
|
-
"script-loader": "^0.7.2",
|
|
63
|
-
"vue-template-compiler": "^2.6.11"
|
|
64
|
-
},
|
|
65
|
-
"eslintConfig": {
|
|
66
|
-
"root": true,
|
|
67
|
-
"env": {
|
|
68
|
-
"node": true
|
|
69
|
-
},
|
|
70
|
-
"extends": [
|
|
71
|
-
"plugin:vue/essential",
|
|
72
|
-
"eslint:recommended"
|
|
73
|
-
],
|
|
74
|
-
"parserOptions": {
|
|
75
|
-
"parser": "babel-eslint"
|
|
76
|
-
},
|
|
77
|
-
"rules": {}
|
|
78
|
-
},
|
|
79
|
-
"engines": {
|
|
80
|
-
"node": "16.14.2",
|
|
81
|
-
"npm": ">= 3.0.0"
|
|
82
|
-
},
|
|
83
|
-
"browserslist": [
|
|
84
|
-
"> 1%",
|
|
85
|
-
"last 2 versions",
|
|
86
|
-
"not dead"
|
|
87
|
-
],
|
|
88
|
-
"main": "babel.config.js"
|
|
1
|
+
{
|
|
2
|
+
"name": "@nixweb/nixloc-ui",
|
|
3
|
+
"version": "0.0.290",
|
|
4
|
+
"description": "Componentes UI",
|
|
5
|
+
"author": "Fábio Ávila <fabio@nixweb.com.br>",
|
|
6
|
+
"private": false,
|
|
7
|
+
"scripts": {
|
|
8
|
+
"serve": "vue-cli-service serve",
|
|
9
|
+
"build": "vue-cli-service build",
|
|
10
|
+
"lint": "vue-cli-service lint"
|
|
11
|
+
},
|
|
12
|
+
"dependencies": {
|
|
13
|
+
"@babel/polyfill": "^7.12.1",
|
|
14
|
+
"@ckeditor/ckeditor5-vue2": "^2.0.0",
|
|
15
|
+
"@fullcalendar/core": "^5.11.3",
|
|
16
|
+
"@fullcalendar/daygrid": "^5.11.3",
|
|
17
|
+
"@fullcalendar/interaction": "^5.11.3",
|
|
18
|
+
"@fullcalendar/list": "^5.11.3",
|
|
19
|
+
"@fullcalendar/timegrid": "^5.11.3",
|
|
20
|
+
"@fullcalendar/vue": "^5.11.2",
|
|
21
|
+
"axios": "^0.24.0",
|
|
22
|
+
"bootstrap-vue": "^2.0.0-rc.11",
|
|
23
|
+
"core-js": "^3.6.5",
|
|
24
|
+
"frappe-gantt": "^0.6.1",
|
|
25
|
+
"sass-loader": "^10.1.1",
|
|
26
|
+
"timeline-vuejs": "^1.1.7",
|
|
27
|
+
"v-runtime-template": "^1.10.0",
|
|
28
|
+
"vodal": "^2.4.0",
|
|
29
|
+
"vue": "^2.6.11",
|
|
30
|
+
"vue-color": "^2.7.0",
|
|
31
|
+
"vue-currency-filter": "^3.3.0",
|
|
32
|
+
"vue-html2pdf": "^1.8.0",
|
|
33
|
+
"vue-image-crop-upload": "^3.0.3",
|
|
34
|
+
"vue-js-toggle-button": "^1.3.0",
|
|
35
|
+
"vue-json-excel": "^0.3.0",
|
|
36
|
+
"vue-loading-template": "^1.3.0",
|
|
37
|
+
"vue-moment": "^4.0.0",
|
|
38
|
+
"vue-multiselect": "^2.1.0",
|
|
39
|
+
"vue-numeric": "^2.4.1",
|
|
40
|
+
"vue-pdf-app": "^2.1.0",
|
|
41
|
+
"vue-print-nb": "^1.7.5",
|
|
42
|
+
"vue-router": "^3.0.1",
|
|
43
|
+
"vue-simple-progress": "^1.1.1",
|
|
44
|
+
"vue-the-mask": "^0.11.1",
|
|
45
|
+
"vue-toasted": "^1.1.28",
|
|
46
|
+
"vue-toggles": "^1.1.4",
|
|
47
|
+
"vue-upload-file": "^1.1.0",
|
|
48
|
+
"vue2-datepicker": "^2.13.0",
|
|
49
|
+
"vue2-editor": "^2.6.6",
|
|
50
|
+
"vue2-google-maps": "^0.10.7",
|
|
51
|
+
"vuedraggable": "^2.24.3",
|
|
52
|
+
"vuejs-ace-editor": "^1.0.1",
|
|
53
|
+
"vuex": "^3.6.2",
|
|
54
|
+
"vuex-persistedstate": "^4.0.0"
|
|
55
|
+
},
|
|
56
|
+
"devDependencies": {
|
|
57
|
+
"@vue/cli-plugin-babel": "~4.5.0",
|
|
58
|
+
"@vue/cli-service": "~4.5.0",
|
|
59
|
+
"babel-eslint": "^10.1.0",
|
|
60
|
+
"eslint": "^6.7.2",
|
|
61
|
+
"eslint-plugin-vue": "^6.2.2",
|
|
62
|
+
"script-loader": "^0.7.2",
|
|
63
|
+
"vue-template-compiler": "^2.6.11"
|
|
64
|
+
},
|
|
65
|
+
"eslintConfig": {
|
|
66
|
+
"root": true,
|
|
67
|
+
"env": {
|
|
68
|
+
"node": true
|
|
69
|
+
},
|
|
70
|
+
"extends": [
|
|
71
|
+
"plugin:vue/essential",
|
|
72
|
+
"eslint:recommended"
|
|
73
|
+
],
|
|
74
|
+
"parserOptions": {
|
|
75
|
+
"parser": "babel-eslint"
|
|
76
|
+
},
|
|
77
|
+
"rules": {}
|
|
78
|
+
},
|
|
79
|
+
"engines": {
|
|
80
|
+
"node": "16.14.2",
|
|
81
|
+
"npm": ">= 3.0.0"
|
|
82
|
+
},
|
|
83
|
+
"browserslist": [
|
|
84
|
+
"> 1%",
|
|
85
|
+
"last 2 versions",
|
|
86
|
+
"not dead"
|
|
87
|
+
],
|
|
88
|
+
"main": "babel.config.js"
|
|
89
89
|
}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div id="app">
|
|
3
|
-
<router-view :key="$route.fullPath"></router-view>
|
|
4
|
-
</div>
|
|
5
|
-
</template>
|
|
6
|
-
|
|
7
|
-
<script>
|
|
8
|
-
export default {
|
|
9
|
-
name: "App",
|
|
10
|
-
};
|
|
11
|
-
</script>
|
|
12
|
-
|
|
13
|
-
<style></style>
|
|
1
|
+
<template>
|
|
2
|
+
<div id="app">
|
|
3
|
+
<router-view :key="$route.fullPath"></router-view>
|
|
4
|
+
</div>
|
|
5
|
+
</template>
|
|
6
|
+
|
|
7
|
+
<script>
|
|
8
|
+
export default {
|
|
9
|
+
name: "App",
|
|
10
|
+
};
|
|
11
|
+
</script>
|
|
12
|
+
|
|
13
|
+
<style></style>
|
|
@@ -1,163 +1,163 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="c-div-button" v-b-tooltip.hover :title="tooltip">
|
|
3
|
-
<button :style="'background-color:' + backGroundColor + ';color:' + color" class="button" :class="{
|
|
4
|
-
small: size === 'small',
|
|
5
|
-
medium: size === 'medium',
|
|
6
|
-
large: size === 'large',
|
|
7
|
-
primary: type === 'primary',
|
|
8
|
-
success: type === 'success',
|
|
9
|
-
warning: type === 'warning',
|
|
10
|
-
info: type === 'info',
|
|
11
|
-
edit: type === 'edit',
|
|
12
|
-
danger: type === 'danger',
|
|
13
|
-
disabled: disabled,
|
|
14
|
-
}" :disabled="disabled" @click="execute()">
|
|
15
|
-
<i :class="classIcon" v-if="!isLoading(this._key) && classIcon"></i>
|
|
16
|
-
<span class="title-btn" v-if="!isLoading(this._key) && title">{{ title }}</span>
|
|
17
|
-
<vue-loading v-if="isLoading(this._key)" type="bubbles" color="#fff"
|
|
18
|
-
:size="{ width: '26px', height: '26px' }"></vue-loading>
|
|
19
|
-
</button>
|
|
20
|
-
</div>
|
|
21
|
-
</template>
|
|
22
|
-
|
|
23
|
-
<script>
|
|
24
|
-
import { mapGetters, mapMutations } from "vuex";
|
|
25
|
-
|
|
26
|
-
export default {
|
|
27
|
-
name: "Button",
|
|
28
|
-
props: {
|
|
29
|
-
_key: String,
|
|
30
|
-
title: String,
|
|
31
|
-
tooltip: String,
|
|
32
|
-
type: String,
|
|
33
|
-
size: String,
|
|
34
|
-
color: String,
|
|
35
|
-
backGroundColor: String,
|
|
36
|
-
eventName: String,
|
|
37
|
-
eventData: Object,
|
|
38
|
-
classIcon: String,
|
|
39
|
-
disabled: Boolean,
|
|
40
|
-
params: Object,
|
|
41
|
-
clicked: Function,
|
|
42
|
-
},
|
|
43
|
-
computed: {
|
|
44
|
-
...mapGetters("generic", ["isLoading"]),
|
|
45
|
-
},
|
|
46
|
-
methods: {
|
|
47
|
-
...mapMutations("generic", ["addLoading", "addEvent"]),
|
|
48
|
-
execute() {
|
|
49
|
-
if (this.eventName)
|
|
50
|
-
this.addEvent({
|
|
51
|
-
name: this.eventName,
|
|
52
|
-
data: this.eventData,
|
|
53
|
-
});
|
|
54
|
-
this.addLoading(this._key);
|
|
55
|
-
if (this.clicked) this.clicked(this.params);
|
|
56
|
-
this.tooltip = "";
|
|
57
|
-
},
|
|
58
|
-
},
|
|
59
|
-
};
|
|
60
|
-
</script>
|
|
61
|
-
<style scoped>
|
|
62
|
-
.c-div-button {
|
|
63
|
-
display: inline-block;
|
|
64
|
-
margin-left: 5px;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
.title-btn {
|
|
69
|
-
margin-left: 3px;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
.button {
|
|
73
|
-
padding: 8px 12px;
|
|
74
|
-
cursor: pointer;
|
|
75
|
-
border: none;
|
|
76
|
-
min-width: 33px;
|
|
77
|
-
border-radius: 30px !important;
|
|
78
|
-
font-size: 13px !important;
|
|
79
|
-
font-weight: 400;
|
|
80
|
-
letter-spacing: 1px !important;
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
.small {
|
|
84
|
-
padding: 3px 7px;
|
|
85
|
-
font-size: 13px;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
.medium {
|
|
89
|
-
padding: 7px 12px;
|
|
90
|
-
font-size: 14px;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
.large {
|
|
94
|
-
padding: 10px 15px;
|
|
95
|
-
font-size: 14px;
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
.disabled {
|
|
99
|
-
background: #bbbbbb !important;
|
|
100
|
-
border-color: #bbbbbb !important;
|
|
101
|
-
color: #fff;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
.primary {
|
|
105
|
-
background: #577696;
|
|
106
|
-
border-color: #577696;
|
|
107
|
-
color: #fff;
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
.primary:hover {
|
|
111
|
-
background: #355472;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
.success {
|
|
115
|
-
color: #fff;
|
|
116
|
-
background: #94aa2a;
|
|
117
|
-
border-color: #94aa2a;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
.success:hover {
|
|
121
|
-
background: #6d7e1c;
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
.info {
|
|
125
|
-
color: #fff;
|
|
126
|
-
border-color: #4ab4e2;
|
|
127
|
-
background: #4ab4e2;
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
.info:hover {
|
|
131
|
-
background: #3e90b3;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
.edit {
|
|
135
|
-
color: #fff;
|
|
136
|
-
border-color: #969799;
|
|
137
|
-
background: #969799;
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
.edit:hover {
|
|
141
|
-
background: #939394;
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
.warning {
|
|
145
|
-
color: #fff;
|
|
146
|
-
border-color: #f1bc31;
|
|
147
|
-
background: #f1bc31;
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
.warning:hover {
|
|
151
|
-
background: #a37d1b;
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
.danger {
|
|
155
|
-
color: #fff;
|
|
156
|
-
border-color: #f0134d;
|
|
157
|
-
background: #f0134d;
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
.danger:hover {
|
|
161
|
-
background: #c70f40;
|
|
162
|
-
}
|
|
163
|
-
</style>
|
|
1
|
+
<template>
|
|
2
|
+
<div class="c-div-button" v-b-tooltip.hover :title="tooltip">
|
|
3
|
+
<button :style="'background-color:' + backGroundColor + ';color:' + color" class="button" :class="{
|
|
4
|
+
small: size === 'small',
|
|
5
|
+
medium: size === 'medium',
|
|
6
|
+
large: size === 'large',
|
|
7
|
+
primary: type === 'primary',
|
|
8
|
+
success: type === 'success',
|
|
9
|
+
warning: type === 'warning',
|
|
10
|
+
info: type === 'info',
|
|
11
|
+
edit: type === 'edit',
|
|
12
|
+
danger: type === 'danger',
|
|
13
|
+
disabled: disabled,
|
|
14
|
+
}" :disabled="disabled" @click="execute()">
|
|
15
|
+
<i :class="classIcon" v-if="!isLoading(this._key) && classIcon"></i>
|
|
16
|
+
<span class="title-btn" v-if="!isLoading(this._key) && title">{{ title }}</span>
|
|
17
|
+
<vue-loading v-if="isLoading(this._key)" type="bubbles" color="#fff"
|
|
18
|
+
:size="{ width: '26px', height: '26px' }"></vue-loading>
|
|
19
|
+
</button>
|
|
20
|
+
</div>
|
|
21
|
+
</template>
|
|
22
|
+
|
|
23
|
+
<script>
|
|
24
|
+
import { mapGetters, mapMutations } from "vuex";
|
|
25
|
+
|
|
26
|
+
export default {
|
|
27
|
+
name: "Button",
|
|
28
|
+
props: {
|
|
29
|
+
_key: String,
|
|
30
|
+
title: String,
|
|
31
|
+
tooltip: String,
|
|
32
|
+
type: String,
|
|
33
|
+
size: String,
|
|
34
|
+
color: String,
|
|
35
|
+
backGroundColor: String,
|
|
36
|
+
eventName: String,
|
|
37
|
+
eventData: Object,
|
|
38
|
+
classIcon: String,
|
|
39
|
+
disabled: Boolean,
|
|
40
|
+
params: Object,
|
|
41
|
+
clicked: Function,
|
|
42
|
+
},
|
|
43
|
+
computed: {
|
|
44
|
+
...mapGetters("generic", ["isLoading"]),
|
|
45
|
+
},
|
|
46
|
+
methods: {
|
|
47
|
+
...mapMutations("generic", ["addLoading", "addEvent"]),
|
|
48
|
+
execute() {
|
|
49
|
+
if (this.eventName)
|
|
50
|
+
this.addEvent({
|
|
51
|
+
name: this.eventName,
|
|
52
|
+
data: this.eventData,
|
|
53
|
+
});
|
|
54
|
+
this.addLoading(this._key);
|
|
55
|
+
if (this.clicked) this.clicked(this.params);
|
|
56
|
+
this.tooltip = "";
|
|
57
|
+
},
|
|
58
|
+
},
|
|
59
|
+
};
|
|
60
|
+
</script>
|
|
61
|
+
<style scoped>
|
|
62
|
+
.c-div-button {
|
|
63
|
+
display: inline-block;
|
|
64
|
+
margin-left: 5px;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
.title-btn {
|
|
69
|
+
margin-left: 3px;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.button {
|
|
73
|
+
padding: 8px 12px;
|
|
74
|
+
cursor: pointer;
|
|
75
|
+
border: none;
|
|
76
|
+
min-width: 33px;
|
|
77
|
+
border-radius: 30px !important;
|
|
78
|
+
font-size: 13px !important;
|
|
79
|
+
font-weight: 400;
|
|
80
|
+
letter-spacing: 1px !important;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.small {
|
|
84
|
+
padding: 3px 7px;
|
|
85
|
+
font-size: 13px;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.medium {
|
|
89
|
+
padding: 7px 12px;
|
|
90
|
+
font-size: 14px;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.large {
|
|
94
|
+
padding: 10px 15px;
|
|
95
|
+
font-size: 14px;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
.disabled {
|
|
99
|
+
background: #bbbbbb !important;
|
|
100
|
+
border-color: #bbbbbb !important;
|
|
101
|
+
color: #fff;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.primary {
|
|
105
|
+
background: #577696;
|
|
106
|
+
border-color: #577696;
|
|
107
|
+
color: #fff;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.primary:hover {
|
|
111
|
+
background: #355472;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
.success {
|
|
115
|
+
color: #fff;
|
|
116
|
+
background: #94aa2a;
|
|
117
|
+
border-color: #94aa2a;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.success:hover {
|
|
121
|
+
background: #6d7e1c;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.info {
|
|
125
|
+
color: #fff;
|
|
126
|
+
border-color: #4ab4e2;
|
|
127
|
+
background: #4ab4e2;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
.info:hover {
|
|
131
|
+
background: #3e90b3;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.edit {
|
|
135
|
+
color: #fff;
|
|
136
|
+
border-color: #969799;
|
|
137
|
+
background: #969799;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.edit:hover {
|
|
141
|
+
background: #939394;
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.warning {
|
|
145
|
+
color: #fff;
|
|
146
|
+
border-color: #f1bc31;
|
|
147
|
+
background: #f1bc31;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
.warning:hover {
|
|
151
|
+
background: #a37d1b;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
.danger {
|
|
155
|
+
color: #fff;
|
|
156
|
+
border-color: #f0134d;
|
|
157
|
+
background: #f0134d;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
.danger:hover {
|
|
161
|
+
background: #c70f40;
|
|
162
|
+
}
|
|
163
|
+
</style>
|
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div>
|
|
3
|
-
<span class="title">{{ title }}</span>
|
|
4
|
-
<b-form-group>
|
|
5
|
-
<b-form-checkbox-group v-model="selected" :options="options" :stacked="stacked" disabled-field="disabled"
|
|
6
|
-
@click.native="execute"></b-form-checkbox-group>
|
|
7
|
-
</b-form-group>
|
|
8
|
-
</div>
|
|
9
|
-
</template>
|
|
10
|
-
|
|
11
|
-
<script>
|
|
12
|
-
import { mapMutations } from "vuex";
|
|
13
|
-
|
|
14
|
-
export default {
|
|
15
|
-
name: "CheckboxGroup",
|
|
16
|
-
props: {
|
|
17
|
-
title: String,
|
|
18
|
-
options: Array,
|
|
19
|
-
params: Object,
|
|
20
|
-
changed: Function,
|
|
21
|
-
clicked: Function,
|
|
22
|
-
initialValue: Array,
|
|
23
|
-
value: Array,
|
|
24
|
-
stacked: {
|
|
25
|
-
type: Boolean,
|
|
26
|
-
default: false,
|
|
27
|
-
},
|
|
28
|
-
markFormDirty: {
|
|
29
|
-
type: Boolean,
|
|
30
|
-
default: true,
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
data() {
|
|
34
|
-
return {
|
|
35
|
-
selected: [],
|
|
36
|
-
};
|
|
37
|
-
},
|
|
38
|
-
mounted() {
|
|
39
|
-
if (this.initialValue) this.selected = this.initialValue;
|
|
40
|
-
},
|
|
41
|
-
methods: {
|
|
42
|
-
...mapMutations("validation", ["updateFormDirty"]),
|
|
43
|
-
execute(event) {
|
|
44
|
-
if (this.markFormDirty) this.updateFormDirty(true);
|
|
45
|
-
this.$emit("input", this.selected);
|
|
46
|
-
let self = this;
|
|
47
|
-
setTimeout(function () {
|
|
48
|
-
// adicionado o pointerId para prevenir que não seja executado em duplicidade
|
|
49
|
-
if (self.clicked && event.pointerId === 1) self.clicked(self.params);
|
|
50
|
-
}, 100);
|
|
51
|
-
},
|
|
52
|
-
},
|
|
53
|
-
watch: {
|
|
54
|
-
selected: {
|
|
55
|
-
handler(value) {
|
|
56
|
-
this.$emit("input", value);
|
|
57
|
-
if (this.changed) this.changed(this.params);
|
|
58
|
-
},
|
|
59
|
-
deep: true,
|
|
60
|
-
},
|
|
61
|
-
initialValue: {
|
|
62
|
-
handler(value) {
|
|
63
|
-
if (this.initialValue) this.selected = this.initialValue;
|
|
64
|
-
},
|
|
65
|
-
deep: true,
|
|
66
|
-
},
|
|
67
|
-
},
|
|
68
|
-
};
|
|
69
|
-
</script>
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<span class="title">{{ title }}</span>
|
|
4
|
+
<b-form-group>
|
|
5
|
+
<b-form-checkbox-group v-model="selected" :options="options" :stacked="stacked" disabled-field="disabled"
|
|
6
|
+
@click.native="execute"></b-form-checkbox-group>
|
|
7
|
+
</b-form-group>
|
|
8
|
+
</div>
|
|
9
|
+
</template>
|
|
10
|
+
|
|
11
|
+
<script>
|
|
12
|
+
import { mapMutations } from "vuex";
|
|
13
|
+
|
|
14
|
+
export default {
|
|
15
|
+
name: "CheckboxGroup",
|
|
16
|
+
props: {
|
|
17
|
+
title: String,
|
|
18
|
+
options: Array,
|
|
19
|
+
params: Object,
|
|
20
|
+
changed: Function,
|
|
21
|
+
clicked: Function,
|
|
22
|
+
initialValue: Array,
|
|
23
|
+
value: Array,
|
|
24
|
+
stacked: {
|
|
25
|
+
type: Boolean,
|
|
26
|
+
default: false,
|
|
27
|
+
},
|
|
28
|
+
markFormDirty: {
|
|
29
|
+
type: Boolean,
|
|
30
|
+
default: true,
|
|
31
|
+
},
|
|
32
|
+
},
|
|
33
|
+
data() {
|
|
34
|
+
return {
|
|
35
|
+
selected: [],
|
|
36
|
+
};
|
|
37
|
+
},
|
|
38
|
+
mounted() {
|
|
39
|
+
if (this.initialValue) this.selected = this.initialValue;
|
|
40
|
+
},
|
|
41
|
+
methods: {
|
|
42
|
+
...mapMutations("validation", ["updateFormDirty"]),
|
|
43
|
+
execute(event) {
|
|
44
|
+
if (this.markFormDirty) this.updateFormDirty(true);
|
|
45
|
+
this.$emit("input", this.selected);
|
|
46
|
+
let self = this;
|
|
47
|
+
setTimeout(function () {
|
|
48
|
+
// adicionado o pointerId para prevenir que não seja executado em duplicidade
|
|
49
|
+
if (self.clicked && event.pointerId === 1) self.clicked(self.params);
|
|
50
|
+
}, 100);
|
|
51
|
+
},
|
|
52
|
+
},
|
|
53
|
+
watch: {
|
|
54
|
+
selected: {
|
|
55
|
+
handler(value) {
|
|
56
|
+
this.$emit("input", value);
|
|
57
|
+
if (this.changed) this.changed(this.params);
|
|
58
|
+
},
|
|
59
|
+
deep: true,
|
|
60
|
+
},
|
|
61
|
+
initialValue: {
|
|
62
|
+
handler(value) {
|
|
63
|
+
if (this.initialValue) this.selected = this.initialValue;
|
|
64
|
+
},
|
|
65
|
+
deep: true,
|
|
66
|
+
},
|
|
67
|
+
},
|
|
68
|
+
};
|
|
69
|
+
</script>
|