other components...

src/components/CMyFieldDb/CMyFieldDb.ts

@@ -0,0 +1,164 @@
+import { Component, Prop, Watch } from 'vue-property-decorator'
+
+import { tools } from '../../store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+
+import { QEditor } from 'quasar'
+import { CMyEditor } from '../CMyEditor'
+import MixinBase from '../../mixins/mixin-base'
+import { fieldsTable } from '../../store/Modules/fieldsTable'
+import { IColGridTable } from '../../model'
+import { CMySelect } from '../CMySelect'
+import { GlobalStore, UserStore } from '../../store/Modules'
+import { CMyChipList } from '../CMyChipList'
+import { CMyToggleList } from '../CMyToggleList'
+import translate from '@src/globalroutines/util'
+import { CDateTime } from '../CDateTime'
+
+@Component({
+  name: 'CMyFieldDb',
+  components: { CMyEditor, CMySelect, CMyChipList, CMyToggleList, CDateTime }
+})
+
+export default class CMyFieldDb extends MixinBase {
+  @Prop({ required: true }) public title
+  @Prop({ required: true }) public mykey: string
+  @Prop({ required: false, default: '' }) public mysubkey: string
+  @Prop({ required: true }) public type: number
+  @Prop({ required: false, default: false }) public serv: boolean
+  @Prop({ required: false, default: false }) public disable: boolean
+  @Prop({ required: false, default: '' }) public jointable: string
+  @Prop({ required: false, default: 'settings' }) public table: string
+  @Prop({ required: false, default: '' }) public myimg: string
+  @Prop({ required: false, default: '' }) public id: string
+  @Prop({ required: false, default: '' }) public idmain: string
+
+  public $t
+  public myvalue = ''
+  public col: IColGridTable = { name: 'test' }
+  public canEdit: boolean = true
+  public countryname = ''
+
+  public created() {
+    this.crea()
+  }
+
+  public crea() {
+
+    this.myvalue = this.getValDb(this.mykey, this.serv, '', this.table, this.mysubkey, this.id, this.idmain)
+    this.col.jointable = this.jointable
+    this.col.fieldtype = this.type
+    this.col.label = this.title
+
+    // console.log('CMyFieldDb crea', this.myvalue)
+  }
+
+  @Watch('id')
+  public idchanged(value) {
+    this.crea()
+  }
+
+  public getclassCol(col) {
+    if (col) {
+      let mycl = (this.disable || col.disable) ? '' : 'colmodif '
+      mycl += ((col.fieldtype === tools.FieldType.date) || (col.fieldtype === tools.FieldType.onlydate)) ? ' coldate flex flex-container ' : ''
+
+      return mycl
+    } else {
+      return ''
+    }
+  }
+
+  public visuValByType(val) {
+    if (this.col.fieldtype === tools.FieldType.date) {
+      if (val === undefined) {
+        return '[]'
+      } else {
+        return tools.getstrDateTime(val)
+      }
+    } else if (this.col.fieldtype === tools.FieldType.onlydate) {
+      if (val === undefined) {
+        return '[]'
+      } else {
+        return tools.getstrDate(val)
+      }
+    } else if (this.col.fieldtype === tools.FieldType.boolean) {
+      return (val) ? this.$t('dialog.yes') : this.$t('dialog.no')
+    } else if (this.col.fieldtype === tools.FieldType.binary) {
+      if (val === undefined)
+        return '[---]'
+      else
+        return fieldsTable.getArrStrByValueBinary(this, this.col, val)
+    } else if (this.col.fieldtype === tools.FieldType.select) {
+      if (val === undefined)
+        return '[---]'
+      else
+        return fieldsTable.getValueByTable(this.col, val)
+    } else if (this.col.fieldtype === tools.FieldType.multiselect) {
+      if (val === undefined)
+        return '[---]'
+      else
+        return fieldsTable.getMultiValueByTable(this.col, val)
+    } else if (this.col.fieldtype === tools.FieldType.multioption) {
+      if (val === undefined)
+        return '[---]'
+      else
+        return fieldsTable.getMultiValueByTable(this.col, val)
+    } else if (this.col.fieldtype === tools.FieldType.password) {
+      if (val === undefined)
+        return '[---]'
+      else
+        return '***************'
+    } else {
+      if (val === undefined)
+        return ' <span class="text-grey">(' + translate('reg.select') + ')</span> '
+      else if (val === '') {
+        return ' <span class="text-grey">(' + translate('reg.select') + ')</span> '
+      } else {
+        let mystr = tools.firstchars(val, 5000)
+        if (val) {
+          if (val.length > 5000)
+            mystr += '...'
+        } else {
+          return val
+        }
+        return mystr
+      }
+    }
+  }
+
+  get mycl() {
+    if (this.disable) {
+      return 'cldisable'
+    }
+  }
+
+  get myvalprinted() {
+    return this.visuValByType(this.myvalue)
+  }
+
+  public savefield(value, initialval) {
+    this.myvalue = value
+    this.setValDb(this.mykey, this.myvalue, this.type, this.serv, this.table, this.mysubkey, this.id)
+  }
+
+  public savefieldboolean(value) {
+    if (this.myvalue === undefined)
+      this.myvalue = 'true'
+    else
+      this.myvalue = value
+
+    this.setValDb(this.mykey, this.myvalue, this.type, this.serv, this.table, this.mysubkey, this.id)
+  }
+
+  public selectcountry({ name, iso2, dialCode }) {
+    // console.log(name, iso2, dialCode)
+    this.myvalue = iso2
+    this.countryname = name
+  }
+
+  public intcode_change(coderec) {
+    this.myvalue = '+' + coderec.dialCode
+  }
+
+}