changes

components/common/Avatarbox.vue

@@ -0,0 +1,15 @@
+<template>  
+    <div :class="`cbox-${type}-${size} mx-0 px-0`" @click="$emit('justclick')" :style="image? 'border: none' : ''">
+      <figure class="image" v-if="image">
+      <img class="is-rounded" :src="`${$path()}download?name=${image}`">
+    </figure>
+    <div v-else>
+      <span>{{text}}</span>
+      </div>
+    </div>
+</template>
+<script>
+  export default {
+    props: ['text', 'image', 'type', 'size'] 
+  }
+</script>

components/common/Editor.vue

@@ -0,0 +1,36 @@
+<template>
+  <ClientOnly>
+    <QuillEditor v-model:content="content" content-type="html" theme="snow" :toolbar="toolbarOptions" @text-change="textChange"
+    style="font-size: 16px; height: 450px;" />
+  </ClientOnly>
+</template>
+<script setup>
+import { QuillEditor } from '@vueup/vue-quill'
+import '@vueup/vue-quill/dist/vue-quill.snow.css'
+const emit = defineEmits(['content', 'modalevent'])
+  var props = defineProps({
+    text: String,
+    row: Object,
+    pagename: String,
+    api: String
+  })
+  // Custom toolbar options
+  const toolbarOptions = [
+    [{ header: [1, 2, 3, 4, 5, 6, false] }],
+    ['bold', 'italic', 'underline', 'strike'],
+    ['blockquote', 'code-block'],
+    [{ header: 1 }, { header: 2 }],
+    [{ list: 'ordered' }, { list: 'bullet' }],
+    [{ script: 'sub' }, { script: 'super' }],
+    [{ indent: '-1' }, { indent: '+1' }],
+    [{ color: [] }, { background: [] }],
+    [{ align: [] }],
+    ['clean'],
+    ['link', 'image', 'video']
+  ]
+  var content = props.text
+  function textChange() {
+    emit('content', content)
+    emit('modalevent', {name: 'content', data: content})
+  }
+</script>

components/common/InputEmail.vue

@@ -0,0 +1,37 @@
+<template>
+   <div class="control has-icons-left">
+  <input :class="`input ${error? 'is-danger' : ''} ${disabled? 'has-text-black' : ''}`" type="text" 
+  :placeholder="placeholder || ''" v-model="value" @keyup="doCheck" :disabled="disabled || false">
+  <span class="icon is-left">
+    <SvgIcon v-bind="{name: 'email.svg', type: 'gray', size: 21}"></SvgIcon>
+  </span>
+</div>
+</template>
+<script>
+export default {
+  props: ['record', 'attr', 'placeholder', 'disabled'],
+  data() {
+    return {
+      value: this.record[this.attr]? this.$copy(this.record[this.attr]) : undefined,
+      error: undefined
+    }
+  },
+  watch: {
+    record: function(newVal) {
+      this.value = this.record[this.attr]? this.$copy(this.record[this.attr]) : undefined
+    }
+  },
+  methods: {
+    doCheck() {
+      if(this.$empty(this.value)) {
+        this.value = undefined
+        this.error = false
+        return this.$emit('email', null)
+      }
+      let check = this.$errEmail(this.value)
+      this.error = check? true : false
+      this.$emit('email', this.value)
+    }
+  }
+}
+</script>

components/common/InputNumber.vue

@@ -0,0 +1,40 @@
+<template>
+   <div class="control has-icons-left">
+  <input :class="`input ${disabled? 'has-text-black' : ''}`" type="text" :placeholder="placeholder || ''" v-model="value" @keyup="doCheck" 
+  :disabled="disabled || false">
+  <span class="icon is-left">
+    <SvgIcon v-bind="{name: 'calculator.svg', type: 'gray', size: 22}"></SvgIcon>
+  </span>
+</div>
+</template>
+<script>
+export default {
+  props: ['record', 'attr', 'placeholder', 'disabled'],
+  data() {
+    return {
+      value: this.record[this.attr]? this.$copy(this.record[this.attr]) : undefined,
+      timer: undefined
+    }
+  },
+  created() {
+    if(this.value) this.value = this.$numtoString(this.value)
+  },
+  watch: {
+    record: function(newVal) {
+      this.value = this.$numtoString(this.record[this.attr])
+    }
+  },
+  methods: {
+    doCheck() {
+      if(this.timer) clearTimeout(this.timer)
+      this.timer = setTimeout(()=>this.checkChange(), 500)
+    },
+    checkChange() {
+      if(!this.$empty(this.value)) {
+        this.value = this.$numtoString(this.$formatNumber(this.value))
+        this.$emit('number', this.$formatNumber(this.value))
+      } else this.$formatNumber('number', null)
+    }
+  }
+}
+</script>

components/common/InputPhone.vue

@@ -0,0 +1,37 @@
+<template>
+   <div class="control has-icons-left">
+  <input :class="`input ${error? 'is-danger' : ''} ${disabled? 'has-text-black' : ''}`" type="text" 
+  :placeholder="placeholder || ''" v-model="value" @keyup="doCheck" :disabled="disabled || false">
+  <span class="icon is-left">
+    <SvgIcon v-bind="{name: 'phone.png', type: 'gray', size: 20}"></SvgIcon>
+  </span>
+</div>
+</template>
+<script>
+export default {
+  props: ['record', 'attr', 'placeholder', 'disabled'],
+  data() {
+    return {
+      value: this.record[this.attr]? this.$copy(this.record[this.attr]) : undefined,
+      error: undefined
+    }
+  },
+  watch: {
+    record: function(newVal) {
+      this.value = this.record[this.attr]? this.$copy(this.record[this.attr]) : undefined
+    }
+  },
+  methods: {
+    doCheck() {
+      if(this.$empty(this.value)) {
+        this.value = undefined
+        this.error = false
+        return this.$emit('phone', null)
+      }
+      let check = this.$errPhone(this.value)
+      this.error = check? true : false
+      this.$emit('phone', this.value)
+    }
+  }
+}
+</script>

components/common/JobView.vue

@@ -0,0 +1,107 @@
+<template>
+<div>
+<div class="columns is-multiline mx-0">
+    <div class="column is-3">
+      <div class="field">
+  <label class="label">{{findLang('name')}}<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input has-text-black" type="text" placeholder="" disabled v-model="record.fullname">
+  </div>
+</div>
+    </div>
+    <div class="column is-6">
+      <div class="field">
+  <label class="label">{{findLang('job')}}<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input has-text-black" type="text" placeholder="" disabled v-model="record.job__title">
+  </div>
+</div>
+    </div>
+    <div class="column is-3">
+      <div class="field">
+  <label class="label">{{findLang('phone')}}<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input has-text-black" type="text" placeholder="" disabled v-model="record.phone">
+  </div>
+  <p class="help is-danger" v-if="errors.phone">{{ errors.phone }}</p>
+</div>
+    </div>
+    <div class="column is-4">
+      <div class="field">
+  <label class="label">Email<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input has-text-black" type="text" disabled placeholder="" v-model="record.email">
+  </div>
+</div>
+    </div>
+    <div class="column is-5">
+      <div class="field">
+  <label class="label">{{findLang('address')}}<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input has-text-black" type="text" disabled placeholder="" v-model="record.address">
+  </div>
+</div>
+    </div>
+    <div class="column is-3">
+      <div class="field">
+  <label class="label">{{findLang('apply-date')}}<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input has-text-black" type="text" placeholder="" disabled :value="$dayjs(record.create_time).format('DD/MM/YYYY hh:mm')">
+  </div>
+</div>
+    </div>
+    <div class="column is-9">
+      <div class="field">
+  <label class="label">Link<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <input class="input" type="text" disabled placeholder="" v-model="record.link">
+  </div>
+</div>
+    </div>
+    <div class="column is-3">
+      <div class="field">
+  <label class="label">{{findLang('status')}}<b class="ml-1 has-text-danger">*</b></label>
+  <div class="control">
+    <SearchBox v-bind="{api:'applyresult', field: store.lang==='en'? 'en' : 'name', column:[store.lang==='en'? 'en' : 'name'], 
+    first: true, optionid: record.result, sort: 'name', position: 'is-top-left'}" @option="selected('_result', $event)"></SearchBox>
+  </div>
+  <p class="help is-danger" v-if="errors.url_web">{{ errors.url_web }}</p>
+</div>
+    </div>
+  <div class="column is-12">
+    <div class="mt-3">
+      <button class="button is-primary has-text-white" @click="save()">{{findLang('save')}}</button>
+    </div>
+  </div>
+</div>
+</div>
+</template>
+<script>
+import { useStore } from '~/stores/index'
+export default {
+  setup() {
+    const store = useStore()
+    return { store }
+  },
+  props: ['pagename', 'row'],
+  data() {
+    return {
+      errors: {},
+      record: this.$copy(this.row || {})
+    }
+  },
+  methods: {
+    findLang(code) {
+      let found = this.$find(this.store.common, {code: code})
+      return found? found[this.store.lang] : null
+    },
+    selected(attr, obj) {
+      this.record.result = obj.id 
+    },
+    async save() {
+      let found = this.$findapi('jobapply')
+      await this.$updaterow('jobapply', this.record, found.params.values, this.pagename)
+    }
+  }
+}
+</script>

components/common/NoteInfo.vue

@@ -0,0 +1,121 @@
+<template>
+  <div>
+    <template v-if="data">
+      <article class="message is-findata" v-if="data.length===0">
+  <div class="message-body py-2 fs-16">
+    Chưa có <b>ghi chú</b> nào được lưu
+  </div>
+</article>
+    <template v-else>
+    <article class="media" v-for="(v,i) in data">
+  <figure class="media-left">
+      <Avatarbox v-bind="{text: v.user__fullname.substring(0,1).toUpperCase(), size: 'two', type: 'findata'}" />
+  </figure>
+  <div class="media-content">
+    <div>
+      <p class="fs-15">
+        {{ v.detail }}
+      </p>
+      <p class="mt-1 has-text-grey">
+        <span class="icon-text">
+        <span>{{v.user__fullname}}</span>
+        <span class="ml-3">{{ $dayjs(v['create_time']).fromNow(true) }}</span>
+        <template v-if="login.id===v.user">
+          <a class="ml-3" @click="edit(v)">
+            <SvgIcon v-bind="{name: 'pen1.svg', type: 'gray', size: 22}"></SvgIcon>
+          </a>
+          <a class="ml-3" @click="askConfirm(v, i)">
+            <SvgIcon v-bind="{name: 'bin.svg', type: 'gray', size: 22}"></SvgIcon>
+          </a>
+        </template>
+    </span>
+      </p>
+    </div>
+  </div>
+</article>
+</template>
+</template>
+     <div class="field is-grouped mt-3">
+      <div class="control is-expanded">
+        <textarea class="textarea" rows="1" placeholder="Viết ghi chú tại đây" v-model="detail"></textarea>
+      </div>
+      <div class="control">
+       <button class="button is-primary has-text-white" @click="save()">Lưu</button>
+      </div>
+    </div>
+    <Modal @close="showmodal=undefined" v-bind="showmodal" v-if="showmodal" @confirm="confirm()"></Modal>
+  </div>
+</template>
+<script>
+export default {
+  props: ['row', 'api', 'pagename'],
+  data() {
+    return {
+      data: undefined,
+      detail: undefined,
+      vbind2: {image: undefined, text: 'ABC', size: 'two', type: 'findata'},
+      current: undefined,
+      showmodal: undefined,
+      obj: undefined
+    }
+  },
+  async created() {
+    if(!this.row) return 
+    this.data = await this.$getdata(this.api, {ref: this.row.id})
+  },
+  computed: {
+    login: {
+      get: function() {return this.$store.state.login},
+      set: function(val) {this.$store.commit("updateLogin", {login: val})}
+    }
+  },
+  methods: {
+    async save() {
+      if(this.$empty(this.detail)) return this.$snackbar('Chưa nhập nội dung ghi chú')
+      let data = {user: this.$store.state.login.id, detail: this.detail, ref: this.row.id}
+      if(this.current) {
+        data = this.$copy(this.current)
+        data.detail = this.detail
+      }
+      let rs = data.id? await this.$updateapi(this.api, data) : await this.$insertapi(this.api, data)  
+      if(!rs) return
+      this.detail = undefined
+      if(this.current) {
+        this.current = undefined
+        let idx = this.$findIndex(this.data, {id: rs.id})
+        this.$set(this.data, idx, rs)
+      } else {
+        this.data.push(rs)
+        let rows = this.$copy(this.$store.state[this.pagename].data)
+        let idx = this.$findIndex(rows, {id: this.row.id})
+        let copy = this.$copy(this.row)
+        copy.count_note += 1
+        rows[idx] = copy
+        this.$store.commit('updateState', {name: this.pagename, key: 'update', data: {data: rows}})
+      }
+    },
+    edit(v) {
+      this.current = this.$copy(v)
+      this.detail = v.detail
+    },
+    askConfirm(v, i) {
+      this.obj = {v: v, i: i}
+      this.showmodal = {component: `dialog/Confirm`,vbind: {content: 'Bạn có muốn xóa ghi chú này không?', duration: 10}, 
+      title: 'Xóa ghi chú', width: '500px', height: '100px'}
+    },
+    async confirm() {
+      let v = this.obj.v
+      let i = this.obj.i
+      let rs = await this.$deleteapi(this.api, v.id)
+      if(rs==='error') return
+      this.$delete(this.data, i)
+      let rows = this.$copy(this.$store.state[this.pagename].data)
+      let idx = this.$findIndex(rows, {id: this.row.id})
+      let copy = this.$copy(this.row)
+      copy.count_note -= 1
+      rows[idx] = copy
+      this.$store.commit('updateState', {name: this.pagename, key: 'update', data: {data: rows}})
+    }
+  }
+}
+</script>

components/common/Notebox.vue

@@ -0,0 +1,14 @@
+<template>
+  <span class="dot-primary" @click="doClick()">{{ row.count_note || '+' }}</span>
+</template>
+<script>
+export default {
+  props: ['row', 'api', 'pagename'],
+  methods: {
+    doClick() {
+      let obj = {component: 'common/NoteInfo', title: 'Ghi chú', width: '50%', vbind: {row: this.row, api: this.api, pagename: this.pagename}}
+      this.$emit('open', {name: 'dataevent',  data: {modal: obj}})
+    }
+  }
+}
+</script>

components/common/Phone.vue

@@ -0,0 +1,54 @@
+<template>
+  <div>
+    <p class="fsb-30">{{ text }}
+      <a class="ml-5" @click="copy()">
+      <SvgIcon v-bind="{name: 'copy.svg', type: 'gray', size: 24}"></SvgIcon>
+      </a>
+    </p>
+    <p class="buttons mt-5 pt-2">
+      <button class="button is-primary has-text-white mr" @click="call()">Call</button>
+      <button class="button is-primary has-text-white mr-2" @click="sms()">SMS</button>
+      <button class="button is-dark mr-2" @click="openZalo()">Zalo</button>
+    </p>
+    <Modal @close="showmodal=undefined" v-bind="showmodal" v-if="showmodal"></Modal>
+  </div>
+</template>
+<script>
+export default {
+  props: ['row', 'pagename'],
+  data() {
+    return {
+      text: undefined,
+      phone: this.row.customer__phone || this.row.party__phone || this.row.phone,
+      showmodal: undefined
+    }
+  },
+  created() {
+    var format = function(s) {
+      return `${s.slice(0,3)} ${s.slice(3,6)} ${s.slice(6, 20)}`
+    }
+    this.text = format(this.phone)
+  },
+  methods: {
+    call() {
+      window.open(`tel:${this.phone}`)
+    },
+    sms() {
+      window.open(`sms:${this.phone}`)
+    },
+    sendSms() {
+      let api = this.row.code.indexOf('CN')>=0? 'customersms' : undefined
+      if(this.row.code.indexOf('LN')>=0) api = 'loansms'
+      else if(this.row.code.indexOf('TS')>=0) api = 'collateralsms'
+      this.showmodal = {component: 'user/Sms', title: 'Nhắn tin SMS', width: '50%', height: '400px', 
+      vbind: {row: this.row, pagename: this.pagename, api: api}}
+    },
+    copy() {
+      this.$copyToClipboard(this.phone)
+    },
+    openZalo() {
+      window.open(`https://zalo.me/${this.phone}`, '_blank')
+    }
+  }
+}
+</script>