Table MySkills

This commit is contained in:
Paolo Arena
2021-10-08 00:38:22 +02:00
parent eb4156fc89
commit 48128235f8
22 changed files with 1250 additions and 1184 deletions

View File

@@ -55,11 +55,18 @@ export default defineComponent({
function refreshval() {
myarrvalues.value = []
// console.table(options)
// console.log('options', props.options)
if (props.options) {
props.options.forEach((rec: any, index) => {
if (props.type === costanti.FieldType.multiselect) {
if (!!myval.value) {
/*
console.log('rec', rec)
console.log('optval', props.optval)
console.log('optlab', props.optlab)
console.log('myval.value', myval.value)
console.log('rec[props.optval]', rec[props.optval])
*/
// @ts-ignore
if (myval.value.includes(rec[props.optval])) {
const mydata: any = {
@@ -71,6 +78,18 @@ export default defineComponent({
color: tools.getColorByIndexBest(index)
}
if (rec['color']) {
mydata.color = rec['color']
}
/*
if (rec['theme']) {
mydata.class = rec['theme']
}
*/
// console.log('mydata', mydata)
if (tools.isObject(props.optlab)) {
// @ts-ignore
mydata.label = props.options.filter((myrec: any) => myrec[props.optval] === mydata.value).map(props.optlab)
@@ -80,6 +99,8 @@ export default defineComponent({
mydata.label = rec[props.optlab]
}
// console.log('mydata.label', mydata.label)
if (props.opticon)
mydata.icon = rec[props.opticon]
if (props.optcolor)

View File

@@ -32,6 +32,16 @@ export default defineComponent({
required: false,
default: '',
},
indrec: {
type: Number,
required: false,
default: -1,
},
mysubsubkey: {
type: String,
required: false,
default: '',
},
type: {
type: Number,
required: true,
@@ -183,7 +193,7 @@ export default defineComponent({
function savefield(value: any, initialval: any, myq: any) {
myvalue.value = value
setValDb(myq, props.mykey, myvalue.value, props.type, props.serv, props.table, props.mysubkey, props.id)
setValDb(myq, props.mykey, myvalue.value, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey)
}
function savefieldboolean(value: any) {
@@ -192,7 +202,7 @@ export default defineComponent({
else
myvalue.value = value
setValDb($q, props.mykey, myvalue, props.type, props.serv, props.table, props.mysubkey, props.id)
setValDb($q, props.mykey, myvalue, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey)
}
function selectcountry({ name, iso2, dialCode }: { name: string, iso2: string, dialCode: string }) {

View File

@@ -122,7 +122,7 @@ export default defineComponent({
function mounted() {
// console.log('mounted')
if ((props.subfield !== '') && (props.subfield !== '')) {
if (props.subfield !== '') {
if (props.row[props.field] === undefined) {
myrow.value[props.field] = {}
myvalue.value = ''

View File

@@ -114,18 +114,19 @@
<CMyChipList
@update:model-value="changevalRec"
:type="costanti.FieldType.multiselect"
:value="myvalue"
v-model:value="myvalue"
:options="globalStore.getTableJoinByName(col.jointable)"
:optval="fieldsTable.getKeyByTable(col.jointable)"
:optlab="fieldsTable.getLabelByTable(col.jointable)"
:opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.select">
myvalue: {{ myvalue }}
<CMyChipList
@update:model-value="changevalRec"
myclass="text-center"
:type="costanti.FieldType.select"
:value="myvalue"
v-model:value="myvalue"
:options="globalStore.getTableJoinByName(col.jointable)"
:optval="fieldsTable.getKeyByTable(col.jointable)"
:optlab="fieldsTable.getLabelByTable(col.jointable)"
@@ -133,7 +134,8 @@
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.boolean">
<q-toggle
dark color="green" v-model="myvalue" :label="col.title"
dark color="green"
v-model:value="myvalue" :label="col.title"
:disable="disable && col.name !== 'profile.saw_zoom_presentation'"
@update:model-value="changevalRec"></q-toggle>
</div>
@@ -319,7 +321,7 @@
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.select">
<CMySelect
:label="col.title"
:label="col.label"
v-model:value="scope.value"
:optval="fieldsTable.getKeyByTable(col.jointable)"
:optlab="fieldsTable.getLabelByTable(col.jointable)"
@@ -369,7 +371,6 @@
</div>
<div v-else-if="col.fieldtype === costanti.FieldType.multiselect">
<div>join: {{ col.jointable }}</div>
<q-select
v-model="scope.value"
@@ -385,7 +386,7 @@
:option-label="fieldsTable.getLabelByTable(col.jointable)"
:option-value="fieldsTable.getKeyByTable(col.jointable)"
style="min-width: 150px"
@update:model-value="changeCol">
@update:model-value="changeval">
</q-select>
</div>

View File

@@ -11,7 +11,7 @@ export default defineComponent({
type: Array,
required: true,
},
value: [String, Number, Array],
value: [String, Number],
label: {
type: String,
required: true,
@@ -57,7 +57,7 @@ export default defineComponent({
const userStore = useUserStore()
const globalStore = useGlobalStore()
const myvalue = ref('')
const myvalue = ref(<string | number>'')
function changeval(newval: any) {
console.log('changeval', newval)
@@ -67,21 +67,29 @@ export default defineComponent({
}
function mounted() {
console.log('mounted', mounted)
if (props.options) {
const rec: any = props.options.find((myrec: any) => myrec[`${props.optval}`] === props.value)
// console.log('rec', rec)
if (!props.useinput) {
if (props.value) {
myvalue.value = props.value.toString()
}
} else {
if (rec) {
if (props.funcgetvaluebyid)
myvalue.value = props.funcgetvaluebyid(rec[`${props.optval}`])
else
myvalue.value = rec[`${props.optlab}`]
/*
console.log('rec', rec, 'props.useinput', props.useinput)
console.log('props.value', props.value)
console.log('options', props.options)
console.log('optval', props.optval)
console.log('optlab', props.optlab)
*/
// console.log('myvalue', myvalue, 'optval', optval, 'rec', rec[`${optval}`])
if (rec) {
if (props.funcgetvaluebyid)
myvalue.value = props.funcgetvaluebyid(rec[`${props.optval}`])
else
myvalue.value = rec[`${props.optlab}`]
// console.log('myvalue', myvalue, 'optval', optval, 'rec', rec[`${optval}`])
} else {
if (!props.useinput) {
if (props.value) {
myvalue.value = props.value
}
}
}
}

View File

@@ -0,0 +1,29 @@
.cltitlebg{
}
.titletext {
color: white;
font-size: 3rem;
font-weight: 500;
line-height: 3rem;
text-shadow: .25rem .25rem .5rem black;
letter-spacing: .00937em;
opacity: 0.9;
}
@media (max-width: 718px) {
// PER VERSIONE MOBILE
.titletext {
color: white;
font-size: 2rem;
font-weight: 500;
line-height: 2rem;
text-shadow: .25rem .25rem .5rem black;
}
}
.q-img__content > div{
background: rgba(0,0,0,0.17) !important;
}

56
src/components/CSkill/CSkill.ts Executable file
View File

@@ -0,0 +1,56 @@
import {
defineComponent, onBeforeMount, onBeforeUnmount, onMounted, ref, toRef, toRefs, watch,
} from 'vue'
import { tools } from '@store/Modules/tools'
import { CMyFieldDb } from '@/components/CMyFieldDb'
import { costanti } from '@costanti'
import { useGlobalStore } from '@store/globalStore'
import { useUserStore } from '@store/UserStore'
import { colmySkills } from '@store/Modules/fieldsTable'
import { CGridTableRec } from '@/components/CGridTableRec'
export default defineComponent({
name: 'CSkill',
props: {
defaultnewrec: {
type: Function,
required: false,
},
},
components: {
CMyFieldDb, CGridTableRec,
},
setup(props, { attrs, slots, emit }) {
const mytable = 'users'
const globalStore = useGlobalStore()
const userStore = useUserStore()
async function createNewRecordInUserTable() {
console.log('createNewRecordInUserTable')
let mydata = {
table: mytable,
data: {
userId: userStore.my._id,
data: {},
field: 'myskills'
}
};
if (props.defaultnewrec) {
mydata.data.data = props.defaultnewrec
}
console.log('mydata', mydata)
const data = await globalStore.saveSubRec(mydata)
}
return {
tools,
costanti,
colmySkills,
}
},
})

View File

@@ -0,0 +1,46 @@
<template>
<div>
Competenze:<br>
<div class="q-ma-sm q-gutter-sm q-pa-xs">
<CGridTableRec
prop_mytable="myskills"
prop_mytitle="Mie Competenze"
:prop_mycolumns="colmySkills"
prop_colkey="idSkill"
nodataLabel="Nessuna Competenza inserita"
noresultLabel="Il filtro selezionato non ha trovato nessun risultato">
</CGridTableRec>
</div>
<div class="row">
<!--
<q-btn
flat dense color="primary"
:label="$t('grid.addrecord')"
@click="createNewRecordInUserTable">
</q-btn>
<CMyFieldDb
title="Competenza"
table="users"
mykey="profile"
mysubkey="myskills"
indrec=0
mysubsubkey="idSkill"
:type="costanti.FieldType.binary">
</CMyFieldDb>
-->
</div>
</div>
Servizi:<br>
</template>
<script lang="ts" src="./CSkill.ts">
</script>
<style lang="scss" scoped>
@import './CSkill.scss';
</style>

1
src/components/CSkill/index.ts Executable file
View File

@@ -0,0 +1 @@
export { default as CSkill } from './CSkill.vue'