quasar-factory-lib 0.1.9 → 0.1.11
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/dist/components/ListSkeleton/ListSkeleton.vue.d.ts +2 -0
- package/dist/components/ListSkeleton/index.d.ts +7 -0
- package/dist/components/SkeletonFormCreateTask/SkeletonFormCreateTask.vue.d.ts +2 -0
- package/dist/components/SkeletonFormCreateTask/index.d.ts +7 -0
- package/dist/components/SkeletonTaskList/SkeletonTaskList.vue.d.ts +2 -0
- package/dist/components/SkeletonTaskList/index.d.ts +7 -0
- package/dist/components/Table/Table.vue.d.ts +2 -1
- package/dist/components/index.d.ts +3 -0
- package/dist/components/plugins.d.ts +4 -1
- package/dist/index.d.ts +1 -1
- package/dist/layouts/PdaLayout.vue.d.ts +2 -41
- package/dist/pages/TablePage.vue.d.ts +2 -1
- package/dist/quasar-factory-lib.js +4598 -4351
- package/dist/quasar-factory-lib.umd.cjs +12 -12
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/components/ListSkeleton/ListSkeleton.vue +65 -0
- package/src/components/ListSkeleton/index.ts +16 -0
- package/src/components/SkeletonFormCreateTask/SkeletonFormCreateTask.vue +57 -0
- package/src/components/SkeletonFormCreateTask/index.ts +16 -0
- package/src/components/SkeletonTaskList/SkeletonTaskList.vue +47 -0
- package/src/components/SkeletonTaskList/index.ts +16 -0
- package/src/components/Table/Table.vue +2 -1
- package/src/components/index.ts +8 -1
- package/src/components/plugins.ts +4 -1
- package/src/index.ts +6 -2
- package/src/layouts/PdaLayout.vue +3 -10
package/package.json
CHANGED
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="q-pa-md">
|
|
3
|
+
<q-item>
|
|
4
|
+
<q-item-section>
|
|
5
|
+
<q-item-label>
|
|
6
|
+
<q-skeleton type="text" />
|
|
7
|
+
</q-item-label>
|
|
8
|
+
<q-item-label caption>
|
|
9
|
+
<q-skeleton
|
|
10
|
+
type="text"
|
|
11
|
+
width="65%"
|
|
12
|
+
/>
|
|
13
|
+
</q-item-label>
|
|
14
|
+
</q-item-section>
|
|
15
|
+
</q-item>
|
|
16
|
+
|
|
17
|
+
<q-item>
|
|
18
|
+
<q-item-section>
|
|
19
|
+
<q-item-label>
|
|
20
|
+
<q-skeleton type="text" />
|
|
21
|
+
</q-item-label>
|
|
22
|
+
<q-item-label caption>
|
|
23
|
+
<q-skeleton
|
|
24
|
+
type="text"
|
|
25
|
+
width="90%"
|
|
26
|
+
/>
|
|
27
|
+
</q-item-label>
|
|
28
|
+
</q-item-section>
|
|
29
|
+
</q-item>
|
|
30
|
+
|
|
31
|
+
<q-item>
|
|
32
|
+
<q-item-section>
|
|
33
|
+
<q-item-label>
|
|
34
|
+
<q-skeleton
|
|
35
|
+
type="text"
|
|
36
|
+
width="50%"
|
|
37
|
+
/>
|
|
38
|
+
</q-item-label>
|
|
39
|
+
<q-item-label caption>
|
|
40
|
+
<q-skeleton type="text" />
|
|
41
|
+
</q-item-label>
|
|
42
|
+
</q-item-section>
|
|
43
|
+
</q-item>
|
|
44
|
+
|
|
45
|
+
<q-item>
|
|
46
|
+
<q-item-section>
|
|
47
|
+
<q-item-label>
|
|
48
|
+
<q-skeleton
|
|
49
|
+
type="text"
|
|
50
|
+
width="35%"
|
|
51
|
+
/>
|
|
52
|
+
</q-item-label>
|
|
53
|
+
<q-item-label caption>
|
|
54
|
+
<q-skeleton type="text" />
|
|
55
|
+
</q-item-label>
|
|
56
|
+
</q-item-section>
|
|
57
|
+
</q-item>
|
|
58
|
+
</div>
|
|
59
|
+
</template>
|
|
60
|
+
<script lang="ts">
|
|
61
|
+
export default {
|
|
62
|
+
name: 'ListSkeleton',
|
|
63
|
+
}
|
|
64
|
+
</script>
|
|
65
|
+
<style></style>
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { App, Plugin } from 'vue'
|
|
2
|
+
|
|
3
|
+
import ListSkeleton from './ListSkeleton.vue'
|
|
4
|
+
|
|
5
|
+
import { registerComponent } from '@/utils/plugins'
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
/** export ListSkeleton plugin */
|
|
9
|
+
export default {
|
|
10
|
+
install (app: App) {
|
|
11
|
+
registerComponent(app, 'ListSkeleton', ListSkeleton)
|
|
12
|
+
}
|
|
13
|
+
} as Plugin
|
|
14
|
+
|
|
15
|
+
/** export ListSkeleton components */
|
|
16
|
+
export { ListSkeleton as ListSkeleton }
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<q-card class="my-card fixed-center">
|
|
4
|
+
<q-item>
|
|
5
|
+
<q-item-section>
|
|
6
|
+
<q-item-label>
|
|
7
|
+
<q-skeleton type="text" />
|
|
8
|
+
</q-item-label>
|
|
9
|
+
<q-item-label caption>
|
|
10
|
+
<q-skeleton type="text" />
|
|
11
|
+
</q-item-label>
|
|
12
|
+
</q-item-section>
|
|
13
|
+
</q-item>
|
|
14
|
+
|
|
15
|
+
<q-item-label>
|
|
16
|
+
<q-skeleton
|
|
17
|
+
type="QInput"
|
|
18
|
+
class="q-mr-sm q-ml-sm"
|
|
19
|
+
/>
|
|
20
|
+
</q-item-label>
|
|
21
|
+
|
|
22
|
+
<q-card-actions>
|
|
23
|
+
<q-skeleton
|
|
24
|
+
type="QBtn"
|
|
25
|
+
width="120px"
|
|
26
|
+
class="q-mr-sm float-left"
|
|
27
|
+
/>
|
|
28
|
+
<q-skeleton
|
|
29
|
+
type="QBtn"
|
|
30
|
+
width="120px"
|
|
31
|
+
class="q-mr-sm float-right"
|
|
32
|
+
/>
|
|
33
|
+
</q-card-actions>
|
|
34
|
+
</q-card>
|
|
35
|
+
</div>
|
|
36
|
+
</template>
|
|
37
|
+
<script lang="ts">
|
|
38
|
+
export default {
|
|
39
|
+
name: 'SkeletonFormCreateTask',
|
|
40
|
+
}
|
|
41
|
+
</script>
|
|
42
|
+
<style scoped>
|
|
43
|
+
.q-card {
|
|
44
|
+
width: 400px;
|
|
45
|
+
}
|
|
46
|
+
@media only screen and (max-width: 1100px) {
|
|
47
|
+
.q-card {
|
|
48
|
+
width: 300px;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
@media only screen and (max-width: 350px) {
|
|
52
|
+
.q-card {
|
|
53
|
+
margin: auto;
|
|
54
|
+
height: auto;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
</style>
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { App, Plugin } from 'vue'
|
|
2
|
+
|
|
3
|
+
import SkeletonFormCreateTask from './SkeletonFormCreateTask.vue'
|
|
4
|
+
|
|
5
|
+
import { registerComponent } from '@/utils/plugins'
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
/** export v plugin */
|
|
9
|
+
export default {
|
|
10
|
+
install (app: App) {
|
|
11
|
+
registerComponent(app, 'SkeletonFormCreateTask', SkeletonFormCreateTask)
|
|
12
|
+
}
|
|
13
|
+
} as Plugin
|
|
14
|
+
|
|
15
|
+
/** export v components */
|
|
16
|
+
export { SkeletonFormCreateTask as SkeletonFormCreateTask }
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<q-card>
|
|
4
|
+
<q-item>
|
|
5
|
+
<q-item-section>
|
|
6
|
+
<q-item-label>
|
|
7
|
+
<q-skeleton type="text" />
|
|
8
|
+
</q-item-label>
|
|
9
|
+
<q-item-label caption>
|
|
10
|
+
<q-skeleton type="text" />
|
|
11
|
+
</q-item-label>
|
|
12
|
+
</q-item-section>
|
|
13
|
+
<q-item-section avatar>
|
|
14
|
+
<q-skeleton type="QAvatar" />
|
|
15
|
+
</q-item-section>
|
|
16
|
+
</q-item>
|
|
17
|
+
|
|
18
|
+
<q-item>
|
|
19
|
+
<q-skeleton type="QBadge" />
|
|
20
|
+
</q-item>
|
|
21
|
+
|
|
22
|
+
<q-item-label>
|
|
23
|
+
<q-skeleton
|
|
24
|
+
v-for="n in 3"
|
|
25
|
+
:key="n"
|
|
26
|
+
type="text"
|
|
27
|
+
/>
|
|
28
|
+
</q-item-label>
|
|
29
|
+
|
|
30
|
+
<q-card-actions>
|
|
31
|
+
<q-skeleton
|
|
32
|
+
v-for="n in 4"
|
|
33
|
+
:key="n"
|
|
34
|
+
size="25px"
|
|
35
|
+
type="QBtn"
|
|
36
|
+
class="q-mr-sm"
|
|
37
|
+
/>
|
|
38
|
+
</q-card-actions>
|
|
39
|
+
</q-card>
|
|
40
|
+
</div>
|
|
41
|
+
</template>
|
|
42
|
+
<script lang="ts">
|
|
43
|
+
export default {
|
|
44
|
+
name: 'SkeletonTaskList',
|
|
45
|
+
}
|
|
46
|
+
</script>
|
|
47
|
+
<style></style>
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { App, Plugin } from 'vue'
|
|
2
|
+
|
|
3
|
+
import SkeletonTaskList from './SkeletonTaskList.vue'
|
|
4
|
+
|
|
5
|
+
import { registerComponent } from '@/utils/plugins'
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
/** export SkeletonTaskList plugin */
|
|
9
|
+
export default {
|
|
10
|
+
install (app: App) {
|
|
11
|
+
registerComponent(app, 'SkeletonTaskList', SkeletonTaskList)
|
|
12
|
+
}
|
|
13
|
+
} as Plugin
|
|
14
|
+
|
|
15
|
+
/** export SkeletonTaskList components */
|
|
16
|
+
export { SkeletonTaskList as SkeletonTaskList }
|
|
@@ -247,7 +247,8 @@ export default defineComponent({
|
|
|
247
247
|
'operatorMachineAssignmentAssignMachine',
|
|
248
248
|
'operatorMachineAssignmentSetDate',
|
|
249
249
|
'operatorMachineAssignmentSetPartialMachineCenter',
|
|
250
|
-
'operatorMachineAssignmentSeeDetail'
|
|
250
|
+
'operatorMachineAssignmentSeeDetail',
|
|
251
|
+
'onClickOpenDialogOperators'
|
|
251
252
|
|
|
252
253
|
],
|
|
253
254
|
data () {
|
package/src/components/index.ts
CHANGED
|
@@ -7,4 +7,11 @@ export * from './TableRowsCounter'
|
|
|
7
7
|
export * from './NavBarSkeleton'
|
|
8
8
|
export * from './AlertLabelsWithError'
|
|
9
9
|
export * from './FormSkeleton'
|
|
10
|
-
export * from './SkeletonAreas'
|
|
10
|
+
export * from './SkeletonAreas'
|
|
11
|
+
export * from './ListSkeleton'
|
|
12
|
+
export * from './SkeletonTaskList'
|
|
13
|
+
export * from './SkeletonFormCreateTask'
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
@@ -8,5 +8,8 @@ import NavBarSkeleton from './NavBarSkeleton'
|
|
|
8
8
|
import AlertLabelsWithError from './AlertLabelsWithError'
|
|
9
9
|
import FormSkeleton from './FormSkeleton'
|
|
10
10
|
import SkeletonAreas from './SkeletonAreas'
|
|
11
|
-
|
|
11
|
+
import ListSkeleton from './ListSkeleton'
|
|
12
|
+
import SkeletonTaskList from './SkeletonTaskList'
|
|
13
|
+
import SkeletonFormCreateTask from './SkeletonFormCreateTask'
|
|
14
|
+
export { MyTable, AlertDialog, ConfirmDialog, TaskNavBar, ConfirmedTask, TableRowsCounter, NavBarSkeleton, AlertLabelsWithError, FormSkeleton, SkeletonAreas, ListSkeleton, SkeletonTaskList, SkeletonFormCreateTask }
|
|
12
15
|
|
package/src/index.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import '@quasar/extras/material-icons/material-icons.css'
|
|
2
2
|
import { Quasar } from 'quasar'
|
|
3
3
|
import { App, Plugin } from 'vue'
|
|
4
|
-
import { MyTable, AlertDialog, ConfirmDialog, TaskNavBar, ConfirmedTask, TableRowsCounter, NavBarSkeleton, AlertLabelsWithError, FormSkeleton, SkeletonAreas} from './components/plugins.ts'
|
|
4
|
+
import { MyTable, AlertDialog, ConfirmDialog, TaskNavBar, ConfirmedTask, TableRowsCounter, NavBarSkeleton, AlertLabelsWithError, FormSkeleton, SkeletonAreas, ListSkeleton, SkeletonTaskList, SkeletonFormCreateTask } from './components/plugins.ts'
|
|
5
5
|
import { registerPlugin, setVueInstance } from './utils/plugins.ts'
|
|
6
6
|
import TranslateKeys from './i18n/translateKeys.ts'
|
|
7
7
|
import { createPinia } from 'pinia'
|
|
8
|
-
export { MyTable, AlertDialog, ConfirmDialog, TaskNavBar, ConfirmedTask, TableRowsCounter, NavBarSkeleton, AlertLabelsWithError, FormSkeleton, SkeletonAreas } from './components/index.ts'
|
|
8
|
+
export { MyTable, AlertDialog, ConfirmDialog, TaskNavBar, ConfirmedTask, TableRowsCounter, NavBarSkeleton, AlertLabelsWithError, FormSkeleton, SkeletonAreas, ListSkeleton, SkeletonTaskList, SkeletonFormCreateTask } from './components/index.ts'
|
|
9
9
|
|
|
10
10
|
export type { TranslateKeys }
|
|
11
11
|
// import plugins from "./components/plugins";
|
|
@@ -31,6 +31,10 @@ const plugin: Plugin = {
|
|
|
31
31
|
registerPlugin(app, AlertLabelsWithError)
|
|
32
32
|
registerPlugin(app, FormSkeleton)
|
|
33
33
|
registerPlugin(app, SkeletonAreas)
|
|
34
|
+
registerPlugin(app, ListSkeleton)
|
|
35
|
+
registerPlugin(app, SkeletonTaskList)
|
|
36
|
+
registerPlugin(app, SkeletonFormCreateTask)
|
|
37
|
+
|
|
34
38
|
app.use(i18n)
|
|
35
39
|
app.use(pinia)
|
|
36
40
|
i18n.global.locale = 'en'
|
|
@@ -59,9 +59,6 @@
|
|
|
59
59
|
@on-drag-end="(args) => {
|
|
60
60
|
console.log(args, 'end')
|
|
61
61
|
}"
|
|
62
|
-
@onUpdateSelected="(details) => {
|
|
63
|
-
console.log(details, 'details')
|
|
64
|
-
}"
|
|
65
62
|
/>
|
|
66
63
|
<q-page-sticky
|
|
67
64
|
v-if="smallDevice"
|
|
@@ -95,7 +92,7 @@ export default {
|
|
|
95
92
|
Table,
|
|
96
93
|
TableRowsCounter,
|
|
97
94
|
AlertLabelsWithError,
|
|
98
|
-
NavBarSkeleton
|
|
95
|
+
NavBarSkeleton
|
|
99
96
|
},
|
|
100
97
|
data () {
|
|
101
98
|
return {
|
|
@@ -144,12 +141,8 @@ export default {
|
|
|
144
141
|
label: 'Boolean Icon',
|
|
145
142
|
align: 'left',
|
|
146
143
|
sortable: true,
|
|
147
|
-
showCustomizedIcon: true,
|
|
148
|
-
type: 'boolean'
|
|
149
|
-
customizedIconNameCaseTrue: 'warning',
|
|
150
|
-
customizedIconNameCaseFalse: 'edit',
|
|
151
|
-
customizedIconColorCaseTrue: 'negative',
|
|
152
|
-
customizedIconColorCaseFalse: 'positive',
|
|
144
|
+
showCustomizedIcon: true,
|
|
145
|
+
type: 'boolean'
|
|
153
146
|
},
|
|
154
147
|
{
|
|
155
148
|
name: 'calories',
|