other components... (2)
This commit is contained in:
Paolo Arena
0
src/components/CMyPopupEdit/CMyPopupEdit.scss
Executable file
0
src/components/CMyPopupEdit/CMyPopupEdit.scss
Executable file
338
src/components/CMyPopupEdit/CMyPopupEdit.ts
Executable file
338
src/components/CMyPopupEdit/CMyPopupEdit.ts
Executable file
@@ -0,0 +1,338 @@
|
||||
import { defineComponent, onMounted, ref, toRef } from 'vue'
|
||||
import { useI18n } from '@src/boot/i18n'
|
||||
import { useUserStore } from '@store/UserStore'
|
||||
import { useGlobalStore } from '@store/globalStore'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { IColGridTable } from 'model'
|
||||
import { CMyChipList } from '../CMyChipList'
|
||||
import { CDate } from '../CDate'
|
||||
import { CDateTime } from '../CDateTime'
|
||||
import { CMyToggleList } from '../CMyToggleList'
|
||||
import { CMySelect } from '../CMySelect'
|
||||
import { CMyEditor } from '../CMyEditor'
|
||||
import { CGallery } from '../CGallery'
|
||||
import { tools } from '@store/Modules/tools'
|
||||
import { costanti } from '@costanti'
|
||||
|
||||
import { fieldsTable } from '@store/Modules/fieldsTable'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'CMyPopupEdit',
|
||||
props: {
|
||||
row: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
col: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
canEdit: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
field: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
subfield: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
showall: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
view: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'row',
|
||||
},
|
||||
minuteinterval: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '5',
|
||||
},
|
||||
disable: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
visulabel: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
|
||||
},
|
||||
components: { CMyChipList, CDateTime, CDate, CMyToggleList, CMySelect, CMyEditor, CGallery },
|
||||
setup(props, { emit }) {
|
||||
const $q = useQuasar()
|
||||
const { t } = useI18n()
|
||||
const userStore = useUserStore()
|
||||
const globalStore = useGlobalStore()
|
||||
|
||||
const myvalue = ref('')
|
||||
const myvalueprec = ref('false')
|
||||
const countryname = ref('')
|
||||
const visueditor = ref(false)
|
||||
const showeditor = ref(true)
|
||||
|
||||
const myrow = toRef(props, 'row')
|
||||
|
||||
function isviewfield() {
|
||||
return props.view === 'field'
|
||||
}
|
||||
|
||||
function changeval(newval: any) {
|
||||
console.log('changeval update:row', newval)
|
||||
emit('update:row', newval)
|
||||
}
|
||||
|
||||
function getrealval(newval: any) {
|
||||
if (props.col.fieldtype === costanti.FieldType.hours) {
|
||||
newval = newval.value
|
||||
}
|
||||
}
|
||||
|
||||
function changevalRec(newval: any) {
|
||||
console.log('row', props.row, 'col', props.col, 'newval', newval)
|
||||
console.log('row[col.name]', props.row[props.col.name])
|
||||
myrow.value[props.col.name] = newval
|
||||
console.log('changevalRec update:row', newval)
|
||||
emit('update:row', props.row)
|
||||
}
|
||||
|
||||
function changevalRecHours(newval: any) {
|
||||
if (props.col.fieldtype === costanti.FieldType.hours) {
|
||||
newval = newval.value
|
||||
}
|
||||
changevalRec(newval)
|
||||
|
||||
myvalue.value = newval
|
||||
}
|
||||
|
||||
function updatedata() {
|
||||
mounted()
|
||||
}
|
||||
|
||||
function mounted() {
|
||||
// console.log('mounted')
|
||||
if ((props.subfield !== '') && (props.subfield !== '')) {
|
||||
if (props.row[props.field] === undefined) {
|
||||
myrow.value[props.field] = {}
|
||||
myvalue.value = ''
|
||||
} else {
|
||||
myvalue.value = myrow.value[props.field][props.subfield]
|
||||
}
|
||||
} else {
|
||||
if (props.field !== '')
|
||||
myvalue.value = myrow.value[props.field]
|
||||
else {
|
||||
// @ts-ignore
|
||||
myvalue.value = myrow.value
|
||||
}
|
||||
}
|
||||
|
||||
myvalueprec.value = myvalue.value
|
||||
|
||||
// console.log('myvalueprec', myvalueprec)
|
||||
}
|
||||
|
||||
function OpenEdit() {
|
||||
// console.log('OpenEdit')
|
||||
emit('show')
|
||||
}
|
||||
|
||||
function getval() {
|
||||
let myval: any = 'false'
|
||||
|
||||
if ((props.subfield !== '') && (props.subfield !== '')) {
|
||||
if (myrow.value[props.field] === undefined) {
|
||||
myrow.value[props.field] = {}
|
||||
myval = ''
|
||||
} else {
|
||||
myval = myrow.value[props.field][props.subfield]
|
||||
}
|
||||
} else {
|
||||
if (props.field !== '')
|
||||
myval = myrow.value[props.field]
|
||||
else
|
||||
myval = myrow.value
|
||||
}
|
||||
|
||||
return myval
|
||||
}
|
||||
|
||||
function SaveValueInt(newVal: any, valinitial: any) {
|
||||
|
||||
// console.log('SaveValueInt', newVal, valinitial)
|
||||
|
||||
// Update value in table memory
|
||||
if (props.subfield !== '') {
|
||||
if (myrow.value[props.field] === undefined)
|
||||
myrow.value[props.field] = {}
|
||||
myrow.value[props.field][props.subfield] = newVal
|
||||
} else {
|
||||
if (props.field !== '')
|
||||
myrow.value[props.field] = newVal
|
||||
else
|
||||
myrow.value = newVal
|
||||
}
|
||||
|
||||
emit('save', newVal, valinitial)
|
||||
}
|
||||
|
||||
function annulla(val: any) {
|
||||
emit('annulla', true)
|
||||
}
|
||||
|
||||
function Savedb(newVal: any, valinitial: any) {
|
||||
|
||||
if (props.col.fieldtype === costanti.FieldType.boolean) {
|
||||
// console.log('myvalue', myvalue, newVal, myvalueprec)
|
||||
if (myvalueprec.value === undefined) {
|
||||
newVal = true
|
||||
myvalueprec.value = myvalue.value
|
||||
myvalue.value = newVal
|
||||
}
|
||||
// console.log('DOPO myvalue', myvalue, newVal, myvalueprec)
|
||||
}
|
||||
|
||||
// console.log('Savedb', newVal)
|
||||
|
||||
emit('showandsave', props.row, props.col, newVal, valinitial)
|
||||
visueditor.value = false
|
||||
}
|
||||
|
||||
function visuValByType(val: any, col: IColGridTable, row: any) {
|
||||
if (col === undefined || row === undefined)
|
||||
return
|
||||
|
||||
// let val = ''
|
||||
// if (props.col.subfield !== '') {
|
||||
// if (row[props.col.field] === undefined)
|
||||
// row[props.col.field] = {}
|
||||
//
|
||||
// val = row[props.col.field][props.col.subfield]
|
||||
// } else {
|
||||
// val = row[props.col.field]
|
||||
// }
|
||||
//
|
||||
if (props.col.fieldtype === costanti.FieldType.date) {
|
||||
if (val === undefined) {
|
||||
return '[]'
|
||||
} else {
|
||||
return tools.getstrDateTime(val)
|
||||
}
|
||||
} else if (props.col.fieldtype === costanti.FieldType.onlydate) {
|
||||
if (val === undefined) {
|
||||
return '[]'
|
||||
} else {
|
||||
return tools.getstrDate(val)
|
||||
}
|
||||
} else if (props.col.fieldtype === costanti.FieldType.boolean) {
|
||||
return (val) ? t('dialog.yes') : t('dialog.no')
|
||||
} else if (props.col.fieldtype === costanti.FieldType.binary) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getArrStrByValueBinary(col, val)
|
||||
} else if (props.col.fieldtype === costanti.FieldType.select) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getValueByTable(col, val)
|
||||
} else if (props.col.fieldtype === costanti.FieldType.multiselect) {
|
||||
if (val === undefined)
|
||||
return '[---]'
|
||||
else
|
||||
return globalStore.getMultiValueByTable(col, val)
|
||||
} else {
|
||||
if (val === undefined || val === null)
|
||||
return '[]'
|
||||
else if (val === '') {
|
||||
return '[]'
|
||||
} else {
|
||||
let mystr = ''
|
||||
if (props.showall) {
|
||||
return val
|
||||
} else {
|
||||
mystr = tools.firstchars(val, tools.MAX_CHARACTERS)
|
||||
}
|
||||
if (val) {
|
||||
if (val.length > tools.MAX_CHARACTERS)
|
||||
mystr += '...'
|
||||
} else {
|
||||
return val
|
||||
}
|
||||
return mystr
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function visInNewRec(col: any) {
|
||||
return !props.col.notShowInNewRec
|
||||
}
|
||||
|
||||
function getclassCol(col: any) {
|
||||
if (col) {
|
||||
let mycl = (props.col.disable || isviewfield) ? '' : 'colmodif'
|
||||
mycl += ((props.col.fieldtype === costanti.FieldType.date) || (props.col.fieldtype === costanti.FieldType.onlydate)) ? ' coldate flex flex-container' : ''
|
||||
|
||||
return mycl
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
function selectcountry({ name, iso2, dialCode }: { name: string, iso2: string, dialCode: string}) {
|
||||
// console.log(name, iso2, dialCode)
|
||||
myvalueprec.value = myvalue.value
|
||||
myvalue.value = iso2
|
||||
countryname.value = name
|
||||
}
|
||||
|
||||
function intcode_change(coderec: any) {
|
||||
myvalueprec.value = myvalue.value
|
||||
myvalue.value = '+' + coderec.dialCode
|
||||
}
|
||||
|
||||
function onInput(phone: any, phoneObject: any, input: any) {
|
||||
if (phoneObject?.formatted) {
|
||||
myvalue.value = phoneObject.formatted
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(mounted)
|
||||
|
||||
return {
|
||||
myvalue,
|
||||
countryname,
|
||||
visueditor,
|
||||
showeditor,
|
||||
isviewfield,
|
||||
changeval,
|
||||
changevalRec,
|
||||
changevalRecHours,
|
||||
updatedata,
|
||||
OpenEdit,
|
||||
getval,
|
||||
SaveValueInt,
|
||||
annulla,
|
||||
Savedb,
|
||||
visuValByType,
|
||||
visInNewRec,
|
||||
getclassCol,
|
||||
selectcountry,
|
||||
intcode_change,
|
||||
tools,
|
||||
fieldsTable,
|
||||
onInput,
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
398
src/components/CMyPopupEdit/CMyPopupEdit.vue
Executable file
398
src/components/CMyPopupEdit/CMyPopupEdit.vue
Executable file
@@ -0,0 +1,398 @@
|
||||
<template>
|
||||
<div :class="getclassCol(col)">
|
||||
<div v-if="visulabel" class="flex">
|
||||
<div v-if="visInNewRec(col)" style="flex-grow: 1;">
|
||||
<div v-if="col.fieldtype === tools.FieldType.string">
|
||||
<q-input
|
||||
v-model="myvalue"
|
||||
autogrow
|
||||
@keyup.enter.stop
|
||||
@input="changevalRec"
|
||||
autofocus
|
||||
:label="col.label">
|
||||
</q-input>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.date">
|
||||
<CDateTime
|
||||
:label="col.label"
|
||||
class="cursor-pointer"
|
||||
:valueDate="myvalue"
|
||||
:readonly="false"
|
||||
:minuteinterval="minuteinterval"
|
||||
:dense="true"
|
||||
@input="changevalRec"
|
||||
canEdit="true"
|
||||
@savetoclose="SaveValueInt"
|
||||
@show="OpenEdit">
|
||||
</CDateTime>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.onlydate">
|
||||
<CDateTime
|
||||
:label="col.label"
|
||||
class="cursor-pointer"
|
||||
:valueDate="myvalue"
|
||||
:readonly="false"
|
||||
:minuteinterval="minuteinterval"
|
||||
:dense="true"
|
||||
@input="changevalRec"
|
||||
canEdit="true"
|
||||
@savetoclose="SaveValueInt"
|
||||
@show="OpenEdit"
|
||||
view="date">
|
||||
</CDateTime>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.number">
|
||||
<q-input
|
||||
v-model="myvalue" type="number"
|
||||
autofocus
|
||||
@input="changevalRec"
|
||||
:label="col.label"
|
||||
>
|
||||
|
||||
</q-input>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.hours">
|
||||
<div class="row">
|
||||
<q-input
|
||||
v-model="myvalue" type="number"
|
||||
autofocus
|
||||
@input="changevalRec"
|
||||
style="max-width: 100px;"
|
||||
:label="col.label"
|
||||
>
|
||||
|
||||
</q-input>
|
||||
|
||||
<CMySelect
|
||||
label="Ore" v-model:value="myvalue"
|
||||
optval="value" optlab="label"
|
||||
:dense="false"
|
||||
:use-input="false"
|
||||
@changeval="changevalRecHours"
|
||||
style="max-width: 100px;"
|
||||
:options="tools.SelectHours">
|
||||
</CMySelect>
|
||||
</div>
|
||||
|
||||
<!--<q-input v-model="myvalue" type="number"
|
||||
autofocus
|
||||
@input="changevalRec"
|
||||
:label="col.label">
|
||||
</q-input>
|
||||
-->
|
||||
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.listimages">
|
||||
<CGallery
|
||||
:gall="row" :listimages="myvalue" :edit="isviewfield"
|
||||
@showandsave="Savedb"
|
||||
@input="changevalRec"
|
||||
>
|
||||
|
||||
</CGallery>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.image">
|
||||
<CGallery
|
||||
:gall="row" :listimages="myvalue" :edit="isviewfield"
|
||||
@input="changevalRec"
|
||||
@showandsave="Savedb">
|
||||
|
||||
</CGallery>
|
||||
</div>
|
||||
<div v-if="col.fieldtype === tools.FieldType.binary">
|
||||
<CMyChipList
|
||||
:type="tools.FieldType.binary"
|
||||
:value="myvalue"
|
||||
@input="changevalRec"
|
||||
:options="fieldsTable.getTableJoinByName(col.jointable)"
|
||||
:optval="fieldsTable.getKeyByTable(col.jointable)"
|
||||
:optlab="fieldsTable.getLabelByTable(col.jointable)"
|
||||
:opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
|
||||
</div>
|
||||
<!-- Show Value -->
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.multiselect">
|
||||
<CMyChipList
|
||||
@input="changevalRec"
|
||||
:type="tools.FieldType.multiselect"
|
||||
:value="myvalue"
|
||||
:options="fieldsTable.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 === tools.FieldType.select">
|
||||
<CMyChipList
|
||||
@input="changevalRec"
|
||||
myclass="text-center"
|
||||
:type="tools.FieldType.select"
|
||||
:value="myvalue"
|
||||
:options="fieldsTable.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 === tools.FieldType.boolean">
|
||||
<q-toggle
|
||||
dark color="green" v-model="myvalue" :label="col.title"
|
||||
:disable="disable && col.name !== 'profile.saw_zoom_presentation'"
|
||||
@input="changevalRec"></q-toggle>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.html">
|
||||
<div v-html="visuValByType(myvalue, col, row)" @click="visueditor = true">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-if="col.fieldtype === tools.FieldType.listimages">
|
||||
<CGallery
|
||||
:gall="row" :listimages="myvalue" :edit="isviewfield"
|
||||
@showandsave="Savedb">
|
||||
|
||||
</CGallery>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.image">
|
||||
<CGallery
|
||||
:gall="row" :listimages="myvalue" :edit="isviewfield"
|
||||
@showandsave="Savedb">
|
||||
|
||||
</CGallery>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.nationality">
|
||||
<div>
|
||||
{{ myvalue }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.intcode">
|
||||
<div>
|
||||
{{ myvalue }}
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!-- Edit Value -->
|
||||
<span v-if="col.fieldtype === tools.FieldType.date">
|
||||
<CDateTime
|
||||
:label="col.label"
|
||||
class="cursor-pointer"
|
||||
:valueDate="myvalue"
|
||||
:readonly="false"
|
||||
:minuteinterval="minuteinterval"
|
||||
:dense="true"
|
||||
:canEdit="canEdit"
|
||||
@savetoclose="SaveValueInt"
|
||||
@show="OpenEdit">
|
||||
</CDateTime>
|
||||
</span>
|
||||
<span v-else-if="col.fieldtype === tools.FieldType.onlydate">
|
||||
<CDateTime
|
||||
:label="col.label"
|
||||
class="cursor-pointer"
|
||||
:valueDate="myvalue"
|
||||
:readonly="false"
|
||||
:minuteinterval="minuteinterval"
|
||||
:dense="true"
|
||||
:canEdit="canEdit"
|
||||
@savetoclose="SaveValueInt"
|
||||
@show="OpenEdit"
|
||||
view="date">
|
||||
</CDateTime>
|
||||
</span>
|
||||
<div v-else>
|
||||
<div>
|
||||
<div v-if="col.fieldtype === tools.FieldType.binary">
|
||||
<CMyChipList
|
||||
:type="tools.FieldType.binary"
|
||||
:value="myvalue"
|
||||
:options="fieldsTable.getTableJoinByName(col.jointable)"
|
||||
:optval="fieldsTable.getKeyByTable(col.jointable)"
|
||||
:optlab="fieldsTable.getLabelByTable(col.jointable)"
|
||||
:opticon="fieldsTable.getIconByTable(col.jointable)"></CMyChipList>
|
||||
</div>
|
||||
<!-- Show Value -->
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.multiselect">
|
||||
<CMyChipList
|
||||
:type="tools.FieldType.multiselect"
|
||||
:value="myvalue"
|
||||
:options="fieldsTable.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 === tools.FieldType.select">
|
||||
<CMyChipList
|
||||
myclass="text-center"
|
||||
:type="tools.FieldType.select"
|
||||
:value="myvalue"
|
||||
:options="fieldsTable.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 === tools.FieldType.boolean">
|
||||
<q-toggle
|
||||
dark color="green" v-model="myvalue" :label="col.title"
|
||||
:disable="disable && col.name !== 'profile.saw_zoom_presentation'"
|
||||
@input="Savedb"></q-toggle>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.html">
|
||||
<div v-html="visuValByType(myvalue, col, row)" @click="visueditor = true">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ visuValByType(myvalue, col, row) }}
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="col.fieldtype === tools.FieldType.html">
|
||||
|
||||
<!--<q-dialog v-model="showeditor">-->
|
||||
<CMyEditor
|
||||
v-if="visueditor" v-model:value="myvalue" :title="col.title" @keyup.enter.stop
|
||||
@showandsave="Savedb" @annulla="visueditor=false">
|
||||
|
||||
</CMyEditor>
|
||||
<!--</q-dialog>-->
|
||||
</div>
|
||||
<q-popup-edit
|
||||
v-if="canEdit && col.fieldtype !== tools.FieldType.html"
|
||||
v-model="myvalue"
|
||||
:disable="col.disable"
|
||||
:title="col.title"
|
||||
buttons
|
||||
persistent
|
||||
@save="SaveValueInt"
|
||||
@show="OpenEdit">
|
||||
|
||||
<div v-if="col.fieldtype === tools.FieldType.boolean">
|
||||
<q-checkbox v-model="myvalue" :label="col.title">
|
||||
</q-checkbox>
|
||||
{{ visuValByType(myvalue, col, row) }}
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.string">
|
||||
<q-input
|
||||
v-model="myvalue"
|
||||
autogrow
|
||||
@keyup.enter.stop
|
||||
autofocus>
|
||||
|
||||
</q-input>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.password">
|
||||
<q-input
|
||||
v-model="myvalue"
|
||||
type="password"
|
||||
@keyup.enter.stop
|
||||
autofocus>
|
||||
|
||||
</q-input>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.number">
|
||||
<q-input
|
||||
v-model="myvalue" type="number"
|
||||
autofocus>
|
||||
|
||||
</q-input>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.hours">
|
||||
<q-input
|
||||
v-model="myvalue" type="number"
|
||||
autofocus>
|
||||
|
||||
</q-input>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.binary">
|
||||
<CMyToggleList
|
||||
:label="col.title"
|
||||
:options="fieldsTable.getTableJoinByName(col.jointable)"
|
||||
v-model:value="myvalue"
|
||||
:optval="fieldsTable.getKeyByTable(col.jointable)"
|
||||
:optlab="fieldsTable.getLabelByTable(col.jointable)">
|
||||
</CMyToggleList>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.select">
|
||||
<CMySelect
|
||||
:label="col.title"
|
||||
v-model:value="myvalue"
|
||||
:optval="fieldsTable.getKeyByTable(col.jointable)"
|
||||
:optlab="fieldsTable.getLabelByTable(col.jointable)"
|
||||
:options="fieldsTable.getTableJoinByName(col.jointable)"
|
||||
:useinput="false">
|
||||
</CMySelect>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.nationality">
|
||||
<div class="justify-center q-gutter-sm clgutter q-mt-sm">
|
||||
<q-input
|
||||
v-model="countryname"
|
||||
:readonly="true"
|
||||
rounded dense
|
||||
debounce="1000"
|
||||
>
|
||||
|
||||
<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>
|
||||
<div style="height: 180px;">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.intcode">
|
||||
|
||||
<vue-tel-input
|
||||
@country-changed="intcode_change"
|
||||
:value="myvalue"
|
||||
@input="oninput"
|
||||
:placeholder="$t('reg.cell')"
|
||||
:enabledCountryCode="true"
|
||||
inputClasses="clCell"
|
||||
wrapperClasses="clCellCode">
|
||||
</vue-tel-input>
|
||||
|
||||
</div>
|
||||
<div v-else-if="col.fieldtype === tools.FieldType.multiselect">
|
||||
<div>join: {{ col.jointable }}</div>
|
||||
|
||||
<q-select
|
||||
v-model="myvalue"
|
||||
rounded
|
||||
outlined
|
||||
multiple
|
||||
dense
|
||||
options-dense
|
||||
:display-value="fieldsTable.getTitleByTable(col.jointable)"
|
||||
emit-value
|
||||
map-options
|
||||
:options="fieldsTable.getTableJoinByName(col.jointable)"
|
||||
:option-label="fieldsTable.getLabelByTable(col.jointable)"
|
||||
:option-value="fieldsTable.getKeyByTable(col.jointable)"
|
||||
style="min-width: 150px"
|
||||
@input="changeCol">
|
||||
|
||||
</q-select>
|
||||
</div>
|
||||
</q-popup-edit>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./CMyPopupEdit.ts">
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './CMyPopupEdit.scss';
|
||||
</style>
|
||||
1
src/components/CMyPopupEdit/index.ts
Executable file
1
src/components/CMyPopupEdit/index.ts
Executable file
@@ -0,0 +1 @@
|
||||
export {default as CMyPopupEdit} from './CMyPopupEdit.vue'
|
||||
Reference in New Issue
Block a user