- CGallery MyFieldDB
This commit is contained in:
Paolo Arena
@@ -1,21 +1,12 @@
|
||||
import { defineComponent, PropType, ref, watch } from 'vue'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { useI18n } from '@/boot/i18n'
|
||||
import { useUserStore } from '@store/UserStore'
|
||||
import { useGlobalStore } from '@store/globalStore'
|
||||
import { IColGridTable } from 'model'
|
||||
import { fieldsTable } from '@store/Modules/fieldsTable'
|
||||
import { tools } from '@store/Modules/tools'
|
||||
import { toolsext } from '@store/Modules/toolsext'
|
||||
import { costanti } from '@costanti'
|
||||
import MixinBase from '../../mixins/mixin-base'
|
||||
import MixinUsers from '../../mixins/mixin-users'
|
||||
import { CMyEditor } from '@/components/CMyEditor'
|
||||
import { CMySelect } from '@/components/CMySelect'
|
||||
import { CMyChipList } from '@/components/CMyChipList'
|
||||
import { CMyToggleList } from '@/components/CMyToggleList'
|
||||
import { CDateTime } from '@/components/CDateTime'
|
||||
import { CGallery } from '@/components/CGallery'
|
||||
import { CMyPopupEdit } from '@/components/CMyPopupEdit'
|
||||
import { IColGridTable } from 'model'
|
||||
|
||||
|
||||
export default defineComponent({
|
||||
@@ -84,184 +75,22 @@ export default defineComponent({
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
components: { CMyEditor, CMySelect, CMyChipList, CMyToggleList, CDateTime, CGallery },
|
||||
components: { CMyPopupEdit },
|
||||
setup(props, { emit }) {
|
||||
const $q = useQuasar()
|
||||
const { t } = useI18n()
|
||||
const globalStore = useGlobalStore()
|
||||
|
||||
const myvalue = ref('')
|
||||
|
||||
const col: IColGridTable = { name: 'test' }
|
||||
|
||||
const canEdit = ref(true)
|
||||
|
||||
const countryname = ref('')
|
||||
|
||||
const { setValDb, getValDb } = MixinBase()
|
||||
const { getMyUsername } = MixinUsers()
|
||||
|
||||
function crea() {
|
||||
|
||||
myvalue.value = getValDb(props.mykey, props.serv, '', props.table, props.mysubkey, props.id, props.idmain)
|
||||
col.jointable = props.jointable
|
||||
col.fieldtype = props.type
|
||||
col.label = props.title
|
||||
|
||||
// console.log('CMyFieldDb crea', myvalue)
|
||||
}
|
||||
|
||||
watch(() => props.id, (newval, oldval) => {
|
||||
crea()
|
||||
})
|
||||
|
||||
function getclassCol(col: any) {
|
||||
if (col) {
|
||||
let mycl = (props.disable || col.disable) ? '' : 'colmodif '
|
||||
mycl += ((col.fieldtype === costanti.FieldType.date) || (col.fieldtype === costanti.FieldType.onlydate)) ? ' coldate flex flex-container ' : ''
|
||||
|
||||
return mycl
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
|
||||
function visuValByType(val: any) {
|
||||
if (col.fieldtype === costanti.FieldType.date) {
|
||||
if (val === undefined) {
|
||||
return '[]'
|
||||
} else {
|
||||
return tools.getstrDateTime(val)
|
||||
}
|
||||
} else if (col.fieldtype === costanti.FieldType.onlydate) {
|
||||
if (val === undefined) {
|
||||
return '[]'
|
||||
} else {
|
||||
return tools.getstrDate(val)
|
||||
}
|
||||
} else if (col.fieldtype === costanti.FieldType.boolean) {
|
||||
return (val) ? t('dialog.yes') : t('dialog.no')
|
||||
} else if (col.fieldtype === costanti.FieldType.binary) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getArrStrByValueBinary(col, val)
|
||||
} else if (col.fieldtype === costanti.FieldType.select) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getValueByTable(col, val)
|
||||
} else if (col.fieldtype === costanti.FieldType.multiselect) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getMultiValueByTable(col, val)
|
||||
} else if (col.fieldtype === costanti.FieldType.multioption) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getMultiValueByTable(col, val)
|
||||
} else if (col.fieldtype === costanti.FieldType.password) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return '***************'
|
||||
} else {
|
||||
if (val === undefined)
|
||||
return ' <span class="text-grey">(' + t('reg.select') + ')</span> '
|
||||
else if (val === '') {
|
||||
return ' <span class="text-grey">(' + t('reg.select') + ')</span> '
|
||||
} else {
|
||||
let mystr = tools.firstchars(val, 5000)
|
||||
if (val) {
|
||||
if (val.length > 5000)
|
||||
mystr += '...'
|
||||
} else {
|
||||
return val
|
||||
}
|
||||
return mystr
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function mycl() {
|
||||
if (props.disable) {
|
||||
return 'cldisable'
|
||||
}
|
||||
}
|
||||
|
||||
function myvalprinted() {
|
||||
return visuValByType(myvalue.value)
|
||||
}
|
||||
|
||||
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, props.indrec, props.mysubsubkey)
|
||||
}
|
||||
|
||||
function savefieldboolean(value: any) {
|
||||
if (myvalue.value === undefined)
|
||||
myvalue.value = 'true'
|
||||
else
|
||||
myvalue.value = value
|
||||
|
||||
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 }) {
|
||||
// console.log(name, iso2, dialCode)
|
||||
myvalue.value = iso2
|
||||
countryname.value = name
|
||||
}
|
||||
|
||||
function intcode_change(coderec: any) {
|
||||
myvalue.value = '+' + coderec.dialCode
|
||||
}
|
||||
|
||||
function onInput(phone: any, phoneObject: any, input: any) {
|
||||
if (phoneObject?.formatted) {
|
||||
myvalue.value = phoneObject.formatted
|
||||
}
|
||||
}
|
||||
|
||||
function uploaded(info: any) {
|
||||
|
||||
if (info.files) {
|
||||
myvalue.value = tools.geturlrelativeprofile()+ '/' + getMyUsername() + '/' + info.files[0].name
|
||||
console.log('uploaded', myvalue.value)
|
||||
savefield(myvalue.value, '', $q)
|
||||
}
|
||||
// info.files[0].name
|
||||
}
|
||||
|
||||
function removephoto() {
|
||||
myvalue.value = ''
|
||||
savefield(myvalue.value, '', $q)
|
||||
}
|
||||
|
||||
crea()
|
||||
const col = ref(<IColGridTable> { name: 'test' })
|
||||
const row = ref({})
|
||||
|
||||
return {
|
||||
mycl,
|
||||
intcode_change,
|
||||
selectcountry,
|
||||
savefieldboolean,
|
||||
savefield,
|
||||
myvalprinted,
|
||||
getclassCol,
|
||||
canEdit,
|
||||
myvalue,
|
||||
col,
|
||||
countryname,
|
||||
onInput,
|
||||
tools,
|
||||
costanti,
|
||||
myq: $q,
|
||||
fieldsTable,
|
||||
globalStore,
|
||||
uploaded,
|
||||
getMyUsername,
|
||||
removephoto,
|
||||
col,
|
||||
row,
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
@@ -19,6 +19,38 @@
|
||||
</template>
|
||||
</q-field>
|
||||
</div>
|
||||
|
||||
<div :class="` q-ma-sm q-pa-sm col-grow rounded-borders `" style="border: 1px solid #bbb">
|
||||
<CMyPopupEdit
|
||||
:title="title"
|
||||
:field="mykey"
|
||||
:subfield="mysubkey"
|
||||
:mysubsubkey="mysubsubkey"
|
||||
:indrec="indrec"
|
||||
:type="type"
|
||||
:serv="serv"
|
||||
:disable="disable"
|
||||
:jointable="jointable"
|
||||
:table="table"
|
||||
:myimg="myimg"
|
||||
:id="id"
|
||||
:idmain="idmain"
|
||||
:canEdit="true"
|
||||
:mycol="col"
|
||||
v-model:row="row"
|
||||
minuteinterval="1"
|
||||
>
|
||||
|
||||
</CMyPopupEdit>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
|
||||
@save="SaveValue"
|
||||
@show="selItem(props.row, col)"
|
||||
@showandsave="showandsel"
|
||||
|
||||
|
||||
<div :class="getclassCol(col) + ` q-ma-sm q-pa-sm col-grow rounded-borders `" style="border: 1px solid #bbb">
|
||||
<div v-if="type === costanti.FieldType.date">
|
||||
<CDateTime
|
||||
@@ -53,7 +85,6 @@
|
||||
:optlab="fieldsTable.getLabelByTable(col.jointable)"
|
||||
:opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
|
||||
</div>
|
||||
<!-- Show Value -->
|
||||
<div v-else-if="type === costanti.FieldType.nationality">
|
||||
<q-input
|
||||
input-class="cursor-pointer text-center"
|
||||
@@ -65,14 +96,6 @@
|
||||
>
|
||||
|
||||
<div class="hidden">
|
||||
<!--<vue-country-code
|
||||
:defaultCountry="myvalue"
|
||||
:disabledFetchingCountry="true"
|
||||
@onSelect="selectcountry"
|
||||
:preferredCountries="tools.getprefCountries"
|
||||
:dropdownOptions="{ disabledDialCode: true }">
|
||||
|
||||
</vue-country-code>-->
|
||||
</div>
|
||||
|
||||
</q-input>
|
||||
@@ -222,14 +245,6 @@
|
||||
|
||||
<template v-slot:prepend>
|
||||
<div style="font-size: 1rem;">
|
||||
<!--<vue-country-code
|
||||
:defaultCountry="myvalue"
|
||||
:disabledFetchingCountry="true"
|
||||
@onSelect="selectcountry"
|
||||
:preferredCountries="tools.getprefCountries"
|
||||
:dropdownOptions="{ disabledDialCode: true }">
|
||||
|
||||
</vue-country-code>-->
|
||||
</div>
|
||||
</template>
|
||||
</q-input>
|
||||
@@ -241,17 +256,6 @@
|
||||
<div v-else-if="col.fieldtype === costanti.FieldType.intcode">
|
||||
|
||||
<div class="justify-center q-gutter-sm clgutter q-mt-sm">
|
||||
<!--<vue-tel-input
|
||||
@country-changed="intcode_change"
|
||||
:value="myvalue"
|
||||
@update:model-value="onInput"
|
||||
:disabledFetchingCountry="true"
|
||||
:preferredCountries="tools.getprefCountries"
|
||||
:placeholder="$t('reg.cell')"
|
||||
:enabledCountryCode="true"
|
||||
inputClasses="clCell"
|
||||
wrapperClasses="clCellCode">
|
||||
</vue-tel-input>-->
|
||||
<div style="height: 180px;">
|
||||
|
||||
</div>
|
||||
@@ -268,25 +272,6 @@
|
||||
:isarray="true">
|
||||
</CMyToggleList>
|
||||
|
||||
<!--
|
||||
<q-select
|
||||
v-model="scope.value"
|
||||
rounded
|
||||
dense
|
||||
outlined
|
||||
multiple
|
||||
options-dense
|
||||
:display-value="fieldsTable.getTitleByTable(col.jointable)"
|
||||
emit-value
|
||||
map-options
|
||||
:options="globalStore.getTableJoinByName(col.jointable)"
|
||||
:option-label="fieldsTable.getLabelByTable(col.jointable)"
|
||||
:option-value="fieldsTable.getKeyByTable(col.jointable)"
|
||||
style="min-width: 150px"
|
||||
>
|
||||
|
||||
</q-select>
|
||||
-->
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === costanti.FieldType.multioption">
|
||||
</div>
|
||||
@@ -316,7 +301,8 @@
|
||||
color="blue" icon="fas fa-trash-alt" size="sm"
|
||||
@click="removephoto"></q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user