eztech-core-components 1.0.0

package/comps/MomentAddCode.vue

@@ -0,0 +1,91 @@
+<template>
+  <span v-if="viewType === 'table'">{{ unit === 'unlimited' ? '' : val }} {{ title }}</span>
+  <div v-else class="flex gap-2">
+    <el-input-number
+      v-model="val"
+      class="flex-1"
+      :min="0"
+      :max="1000"
+      :disabled="unit === 'unlimited'"
+      :size="size"
+      controls-position="right"
+      @change="setValue"
+    />
+    <el-select
+      v-model="unit"
+      class="flex-1"
+      placeholder="Сонгох.."
+      :size="size"
+      @change="setValue"
+    >
+      <el-option v-for="item in units" :key="item.code" :value="item.code" :label="item.title" />
+    </el-select>
+  </div>
+</template>
+<script>
+import { get } from 'lodash'
+export default {
+  name: 'MomentAddCode',
+  props: {
+    value: {
+      type: String,
+      default: null
+    },
+    viewType: {
+      type: String,
+      default: ''
+    },
+    size: {
+      type: String,
+      default: 'small'
+    }
+  },
+  data () {
+    return {
+      val: 0,
+      unit: null,
+      units: [
+        { code: 'minutes', title: 'Минут' },
+        { code: 'hours', title: 'Цаг' },
+        { code: 'days', title: 'Хоног' },
+        { code: 'months', title: 'Сар' },
+        { code: 'years', title: 'Жил' },
+        { code: 'unlimited', title: 'Хугацаагүй' }
+      ]
+    }
+  },
+  computed: {
+    title () {
+      return get(this.units.find(c => c.code === this.unit), 'title')
+    }
+  },
+  watch: {
+    value () {
+      if (!this.unit || this.viewType === 'table') {
+        this.setVal()
+      }
+    }
+  },
+  created () {
+    this.setVal()
+  },
+  methods: {
+    setVal () {
+      if (this.value && this.value.includes(':')) {
+        this.val = Number(this.value.split(':')[0] || 0)
+        this.unit = this.value.split(':')[1]
+      }
+    },
+    setValue () {
+      if (this.unit === 'unlimited') {
+        this.val = 0
+        this.$emit('input', '0:unlimited')
+      } else if (this.val > 0 && this.unit) {
+        this.$emit('input', `${this.val}:${this.unit}`)
+      } else {
+        this.$emit('input', null)
+      }
+    }
+  }
+}
+</script>

package/comps/SclHandbook.vue

@@ -0,0 +1,135 @@
+<template>
+  <div class="w-full flex flex-row gap-2">
+    <div class="max-w-full w-[210mm] px-[20mm] sm:px-12 py-4 flex flex-col gap-4 bg-white rounded quill-container">
+      <div v-if="loading" class="flex justify-center py-10 text-coreSecondaryText gap-2">
+        <i class="el-icon-loading" />
+        <span class="ml-2">Түр хүлээнэ үү..</span>
+      </div>
+      <div
+        v-for="item in listValue.filter(c => c._id === lesson?._id)"
+        :key="item._id"
+        class="flex flex-col gap-2 ql-editor"
+      >
+        <div class="text-lg text-center font-medium py-1 text-corePrimaryText">
+          {{ item.title.trim() }}
+        </div>
+        <div v-if="item.description" class="py-2 text-corePrimaryText leading-5">
+          <i class="el-icon-info text-coreSecondaryText pr-[2px]" /> {{ item.description }}
+        </div>
+        <div class="core-content text-sm text-justify text-corePrimaryText list-disc" @click="handleClickHtml" v-html="item.html_content" />
+      </div>
+    </div>
+    <div class="h-auto sm:h-full overflow-y-auto w-full md:w-52 rounded bg-white border flex flex-col">
+      <!-- <div class="flex flex-col text-sm leading-4 cursor-pointer border-b last:border-b-0 px-4 py-2">Гарын авлагыг татах</div> -->
+      <div
+        v-for="(item) in listValue"
+        :key="item._id"
+        :class="['flex flex-col text-sm leading-4 cursor-pointer border-b last:border-b-0 px-4 py-2', {
+          'bg-coreBlue text-white': lesson?._id === item._id,
+          'hover:bg-coreBgHover': lesson?._id !== item._id
+        }]"
+        @click="lesson_id = item._id"
+      >
+        {{ item.title.trim() }}
+      </div>
+    </div>
+    <core-zoom-image v-model="currentImage" :images="currentImages" />
+  </div>
+</template>
+<script>
+import { mapGetters } from 'vuex'
+export default {
+  props: {
+    projectId: { type: [String, Number], default: '5' },
+    tableName: { type: String, default: 'scl_handbooks' },
+    api_id: { type: [String, Number], default: null },
+    handbooks: { type: Array, default: () => { return [] } }
+  },
+  data () {
+    return {
+      loading: false,
+      list: [],
+      text: '',
+      currentImage: null
+    }
+  },
+  computed: {
+    ...mapGetters('settings', ['env']),
+    lesson_id: {
+      set (val) {
+        this.$router.push({ query: { ...this.$route.query, lesson_id: val } })
+      },
+      get () {
+        return this.$route.query.lesson_id
+      }
+    },
+    lesson () {
+      if (!this.lesson_id) {
+        return this.listValue[0]
+      }
+      return this.listValue.find(c => c._id === this.lesson_id)
+    },
+    listValue () {
+      return this.handbooks.length > 0 ? this.handbooks : this.list
+    },
+    currentImages () {
+      const regex = /<img[^>]*\s+src="([^"]*)"/gi
+      const matches = []
+      for (const item of this.listValue) {
+        const content = item.html_content
+        let match
+        while ((match = regex.exec(content)) !== null) {
+          matches.push(match[1])
+        }
+      }
+      console.log('matches', matches)
+      return matches
+    }
+  },
+  mounted () {
+    this.getList()
+  },
+  methods: {
+    htmlContent (html_content) {
+      return html_content.replace(/<img\s+([^>]*?)src\s*=\s*["']?([^"'\s>]+)["']?([^>]*?)>/g, (match, p1, p2, p3) => {
+        try {
+          const url = new URL(p2)
+          if (url.pathname.startsWith('/file/')) {
+            return `<img ${p1}src="/api${url.pathname}"${p3} style="width: 100%; height: auto;">`
+          } else {
+            return `<img ${p1}src="${p2}"${p3} style="width: 100%; height: auto;">`
+          }
+        } catch (err) {
+          return `<img ${p1}src="${p2}"${p3} style="width: 100%; height: auto;">`
+        }
+      })
+      // .replace(/\t/g, '&nbsp;&nbsp;&nbsp;&nbsp;')
+    },
+    handleClickHtml ($event) {
+      const target = $event.target
+      if (target.tagName === 'IMG') {
+        this.currentImage = target.src
+      }
+    },
+    async getList () {
+      if (this.loading || this.handbooks.length > 0) {
+        return
+      }
+      try {
+        this.list = []
+        this.loading = true
+        const { data } = await this.$axios.get(`list/${this.projectId}/${this.tableName}`, {
+          params: {
+            search: JSON.stringify({ api_id: { val: this.api_id, t: 'number', op: 'eq' } })
+          }
+        })
+        this.list = data
+      } catch (err) {
+        this.$showError(err)
+      } finally {
+        this.loading = false
+      }
+    }
+  }
+}
+</script>

package/comps/Sign/Dialog.vue

@@ -0,0 +1,321 @@
+<template>
+  <el-dialog
+    width="600px"
+    append-to-body
+    :show-close="true"
+    class="action-dialog signature-dialog"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    :title="dialogTitle"
+    :visible.sync="modelVisible"
+    :before-close="handleClose"
+  >
+    <div v-if="noSignature">
+      <div class="text-content">
+        <slot name="content" />
+        <div class="transfer-content">
+          <div class="left-item" style="margin-left: auto;">
+            <slot name="left" />
+          </div>
+          <i class="transfer-icon el-icon el-icon-d-arrow-right" />
+          <div class="right-item" style="margin-right: auto;">
+            <slot name="right" />
+          </div>
+        </div>
+        <slot name="form-wrapper" />
+      </div>
+    </div>
+    <div v-else class="bg-white p-4">
+      <!-- {{ !serialNumberLoading }} {{ serialNumber }} -->
+      <!-- <el-alert v-if="!serialNumberLoading && !serialNumber" class="sign-message" style="margin-bottom: 20px" title="Та эхлээд өөрийн хэрэглэгчийн эрхдээ тоон гэрчилгээгээ холбоно уу" type="error" :closable="false" center show-icon /> -->
+      <el-steps :space="200" :active="step" simple class="bg-white">
+        <el-step title="Токен сонгох" icon="el-icon-cpu" />
+        <el-step title="Нэвтрэх" icon="el-icon-user" />
+        <el-step title="Гэрчилгээ сонгох" icon="el-icon-key" />
+        <!-- <el-step title="Шилжүүлэх" icon="el-icon-position" /> -->
+      </el-steps>
+      <div v-if="step === 0" style="padding: 20px 25px; display: flex; justify-content: center; align-items: center; flex-direction: column">
+        <el-table v-loading="loadingDevice" border :data="devices" highlight-current-row @current-change="handleSelectDevice">
+          <el-table-column label="№" type="index" width="35" />
+          <el-table-column label="#" width="35">
+            <template slot-scope="scope">
+              <el-checkbox :value="selectedDevice && selectedDevice.serialNumber === scope.row.serialNumber" />
+            </template>
+          </el-table-column>
+          <el-table-column prop="serialNumber" label="Сериал дугаар" />
+          <el-table-column prop="deviceName" label="Токен-ны нэр" />
+        </el-table>
+      </div>
+      <div v-if="step === 1" style="padding: 20px 25px; display: flex; justify-content: center; align-items: center; flex-direction: column">
+        <el-alert class="sign-message" description="Та тоон гарын үсгийн токен пин кодоо оруулна уу" :title="`Токен төхөөрөмж: ${ selectedDevice && selectedDevice.serialNumber }`" type="info" :closable="false" center show-icon />
+        <input type="text" name="dummy_username" style="display:none">
+        <input type="password" name="dummy_password" style="display:none">
+        <el-input v-model="pin" prefix-icon="el-icon-key" placeholder="Пин код" autocomplete="off" show-password size="medium" style="margin-top: 15px; " type="password" />
+      </div>
+      <div v-if="step === 2" style="padding: 20px 25px; display: flex; justify-content: center; align-items: center; flex-direction: column">
+        <el-alert class="sign-message" title="Та ашиглах тоон гарын үсгээ сонгоно уу" type="info" :closable="false" center show-icon />
+        <el-table style="padding-top: 10px;width: 100%" :data="list" highlight-current-row @current-change="(row) => selectedRow = row">
+          <el-table-column type="pkId" width="30">
+            <!-- <template slot-scope="scope"> -->
+            <!-- <ss-icon v-if="selectedRow && selectedRow.pkId === scope.row.pkId" name="check" class="icon" :size="15" color="var(--text-success-color)" /> -->
+            <!-- </template> -->
+          </el-table-column>
+          <el-table-column prop="subject" label="Эзэмшигчийн мэдээлэл" width="285">
+            <template slot-scope="scope">
+              <b>{{ scope.row.subject.CN }}</b> ({{ scope.row.subject.O }})
+            </template>
+          </el-table-column>
+          <el-table-column prop="before" label="Эхлэх" />
+          <el-table-column prop="after" label="Дуусах" />
+        </el-table>
+      </div>
+      <!-- <div v-if="step === 3">
+        <div class="text-content">
+          <slot name="content" />
+          <div class="transfer-content">
+            <div class="left-item" style="margin-left: auto;">
+              <slot name="left" />
+            </div>
+            <i class="transfer-icon el-icon el-icon-d-arrow-right" />
+            <div class="right-item" style="margin-right: auto;">
+              <slot name="right" />
+            </div>
+          </div>
+          <slot name="form-wrapper" />
+        </div>
+        <sign-info v-if="isSigned" :data="subject" />
+      </div> -->
+    </div>
+    <div slot="footer">
+      <slot name="alert" />
+      <div v-if="noSignature">
+        <el-button :loading="loading" :disabled="!isSigned && !noSignature" :type="isSigned ? 'success' : noSignature ? 'warning' : 'primary'" icon="el-icon-s-check" plain @click="handleAction">
+          {{ isReturn ? 'Буцаах' : isTransfer ? 'Шилжүүлэх' : isOtherUserApproved ? confirmTitle : completeTitle }}
+        </el-button>
+      </div>
+      <div v-else v-loading="serialNumberLoading">
+        <el-button v-if="step == 0" v-loading="loadingDevice" type="primary" @click.prevent="handleNextStep()">
+          Үргэлжлүүлэх
+        </el-button>
+        <el-button v-if="step === 1" v-loading="isSigning" type="primary" :disabled="!serialNumber" @click.prevent="handleSignRequest(selectedDevice ? selectedDevice.pkId : null)">
+          Үргэлжлүүлэх
+        </el-button>
+        <el-button v-if="step === 2" v-loading="isSigning || loading" type="primary" :disabled="selectedRow == null" @click.prevent="handleCertificateSelect()">
+          Гарын үсэг зурах
+        </el-button>
+        <!-- <el-button v-if="step === 3" :disabled="!noSignature && !isSigned" :loading="loading" type="success" icon="el-icon-s-check" @click="handleAction">
+          {{ isReturn ? 'Буцаах' : isTransfer ? 'Шилжүүлэх' : isOtherUserApproved ? confirmTitle : completeTitle }}
+        </el-button> -->
+        <el-button plain :disabled="loading" @click="handleClose">
+          Болих
+        </el-button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+// import { base64ToBlob } from '../../utils/helpers'
+// import DocumentService from '@/services/document/DocumentService'
+// import UserService from '@/services/hrm/UserService'
+import { mapGetters } from 'vuex'
+export default {
+  name: 'SignDialog',
+  props: {
+    visible: { type: Boolean, default: false },
+    loading: { type: Boolean, default: false },
+    isSigned: { type: Boolean, default: false },
+    noSignature: { type: Boolean, default: false },
+    document: { type: Object, default: () => {} },
+    isReturn: { type: Boolean, default: false },
+    isTransfer: { type: Boolean, default: false },
+    isOtherUserApproved: { type: Boolean, default: false },
+    dialogTitle: { type: String, default: null },
+    documentData: { type: String, default: null },
+    confirmTitle: { type: String, default: null },
+    completeTitle: { type: String, default: null }
+  },
+  data () {
+    return {
+      serialNumber: null,
+      serialNumberLoading: false,
+      temp: null,
+      socket: null,
+      pin: null,
+      sign: null,
+      devices: [],
+      loadingDevice: false,
+      selectedDevice: null,
+      selectedRow: null,
+      list: [],
+      step: 0,
+      subject: null,
+      isSigning: false,
+      certificate: null,
+      signature: null
+    }
+  },
+  computed: {
+    ...mapGetters('user', ['token']),
+    modelVisible: {
+      get () { return this.visible },
+      set (val) { this.$emit('update:visible', val) }
+    }
+  },
+  watch: {
+    visible (value) {
+      if (value) {
+        this.loadSerialNumber()
+        this.handleGetDevices()
+      }
+    }
+  },
+  mounted () {
+    if (this.visible) {
+      this.loadSerialNumber()
+      this.handleGetDevices()
+    }
+  },
+  methods: {
+    handleNextStep () {
+      if (this.selectedDevice) {
+        this.step = 1
+      } else {
+        // handleErrorMessage(this, { type: 'error', description: 'Токен төхөөрөмж сонгоно уу.' })
+      }
+    },
+    handleGetDevices () {
+      this.loadingDevice = true
+      this.devices = []
+      this.selectedDevice = null
+      this.handleSignRequest(null, 'getDevices', true)
+    },
+    handleSelectDevice (row) {
+      this.selectedDevice = row
+    },
+    loadSerialNumber () {
+      // this.serialNumber = 'fdsafdsafdsafdsafdsa'
+      // this.serialNumberLoading = false
+      // this.serialNumberLoading = true
+      // UserService.getSerialNumber(this.$store.getters.userKey._id).then((response) => {
+      //   this.serialNumber = response.data && response.data.serialNumber ? response.data.serialNumber : null
+      //   this.serialNumberLoading = false
+      // }).catch((error) => {
+      //   this.$showError(error)
+      //   this.serialNumberLoading = false
+      // })
+    },
+    handleClose () {
+      this.pin = null
+      this.sign = null
+      this.subject = null
+      this.certificate = null
+      this.signature = null
+      this.isSigning = false
+      this.step = 0
+      this.list = []
+      this.selectedRow = null
+      this.socket = null
+      // this.$emit('onClose')
+      this.modelVisible = false
+    },
+    handleCertificateSelect () {
+      this.$emit('onCertificateSelect', this.selectedRow)
+    },
+    handleSignRequest (pkId = null, type, noPin, base64String, filename, docId, subject) {
+      this.certificate = null
+      this.signature = null
+      this.isSigning = true
+      this.socket = new WebSocket('ws://127.0.0.1:59012/etoken')
+      const pkId1 = pkId
+      const docId1 = docId
+      const subject1 = subject
+      this.socket.onclose = (evt) => {
+        this.sign = null
+        this.subject = null
+        this.certificate = null
+        this.signature = null
+        this.isSigning = false
+      }
+      this.socket.onopen = (evt) => {
+        try {
+          if (this.pin || noPin) {
+            const request = JSON.stringify({
+              text: base64String,
+              pin: this.pin,
+              id: docId1 || '321',
+              deviceSerial: this.selectedDevice ? this.selectedDevice.serialNumber : null,
+              library: this.selectedDevice ? this.selectedDevice.library : null,
+              pkId: pkId1,
+              code: type || (pkId1 ? 'signPdf' : 'getCertificates')
+            })
+            this.socket.send(request, 0)
+            this.isSigning = true
+          }
+        } catch (err) {
+          this.$showError(err)
+        }
+      }
+      this.socket.onerror = () => {
+        this.$showError('ШШЕГ Тоон гарын үсэг програмтай холбогдож чадсангүй')
+        this.isSigning = false
+        this.loadingDevice = false
+        this.socket.close()
+      }
+      this.socket.onmessage = (evt) => {
+        try {
+          this.isSigning = false
+          const res = JSON.parse(evt.data)
+          if (res.success) {
+            if (res.code === 'getDevices') {
+              this.devices = res.devices
+              if (res.devices && res.devices.length === 1) {
+                this.selectedDevice = this.devices[0]
+                this.step = 1
+              }
+              this.loadingDevice = false
+            }
+            if (res.code === 'signPdf') {
+              this.$emit('onSignedPdf', pkId1, res.signature, filename, subject1)
+            }
+            if (res.code === 'getCertificates') {
+              this.$showSuccess(res.message)
+              // handleErrorMessage(this, { type: 'success', description: res.message })
+              this.step = 2
+              this.list = []
+              res.list.forEach((element) => {
+                const subjectData = {}
+                element.subject.replaceAll('\\,', '&&').split(',').forEach((subj) => {
+                  const values = subj.replaceAll('&&', ',').split('=')
+                  subjectData[values[0]] = values[1]
+                })
+                element.subject = subjectData
+                this.list.push(element)
+              })
+              if (this.list.length === 1) {
+                this.selectedRow = this.list[0]
+              }
+            }
+          } else if (res.message) {
+            // handleErrorMessage(this, { type: 'error', description: res.message })
+            this.$showError(res.message)
+          }
+          this.socket.close()
+        } catch (err) {
+          this.$showError(err)
+        }
+      }
+    },
+
+    handleAction () {
+      if (this.isReturn) {
+        this.$emit('onAction', 'RETURN')
+      } else if (this.isTransfer) {
+        this.$emit('onAction', 'TRANSFERUSER')
+      } else {
+        this.$emit('onAction', this.isOtherUserApproved ? 'TRANSFER' : 'COMPLETE')
+      }
+    }
+  }
+}
+</script>

package/comps/Sign/Info.vue

@@ -0,0 +1,43 @@
+<template>
+  <div v-if="data" class="signature">
+    <el-divider content-position="center">
+      ТООН ГАРЫН ҮСГИЙН МЭДЭЭЛЭЛ
+    </el-divider>
+    <div>
+      <div>Сериал дугаар : </div>{{ data.serialNumber }}
+    </div>
+    <div>
+      <div>Дуусах огноо : </div>{{ $moment(data.expireAt).format('YYYY-MM-DD') }}
+    </div>
+    <div v-for="(property, index) in data.subject" :key="`p_${index}`">
+      <div weight="bold">
+        {{ property.label }} :
+      </div> {{ property.value }}
+    </div>
+    <div v-if="data.issuer.filter((i) => ['name', 'organizationName'].indexOf(i.key) > -1)">
+      <div>Гэрчилгээ олгосон : </div>
+      <b v-if="name = data.issuer.find((i) => i.key === 'organizationName')">
+        {{ name.value }}
+      </b>
+      <template v-if="name = data.issuer.find((i) => i.key === 'name')">
+        ( {{ name.value }} )
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'SignInfo',
+  props: {
+    data: { type: Object, default: () => {} }
+  },
+  watch: {
+    visible (value) {
+      if (value) {
+        // this.initializeSocket()
+      }
+    }
+  }
+}
+</script>

package/comps/Sign/InfoDialog.vue

@@ -0,0 +1,78 @@
+<template>
+  <el-dialog width="650px" :show-close="false" class="action-dialog signature-dialog" :close-on-click-modal="true" :close-on-press-escape="false" :title="dialogTitle" :visible.sync="modelVisible" :before-close="handleClose">
+    <div v-loading="loading" style="min-height: 50px">
+      <template v-if="data">
+        <div style="margin: var(--padding-small) var(--padding-xlarge); display: flex;flex-direction: row;justify-content: space-between;">
+          <!-- <sg-profile
+            v-if="data.user"
+            :p-number-of-lines="1"
+            :icon-size="$store.getters.systemDefaultProfileSize"
+            :name="data.user.userInfoId ? data.user.userInfoId.surname.slice(0, 1) + ' ' + data.user.userInfoId.givenName : ' - '"
+            :position="data.user.positionId ? data.user.positionId.name : '-'"
+            :userKeyId="data.user._id"
+            :haveImage="true"
+          /> -->
+          <el-tag v-if="data.date" type="info" style="margin-left: auto; margin-right: 5px">
+            <i class="el-icon-time" />
+            <span style="margin-left: 5px">{{ data.date ? $moment(data.date).format('YYYY-MM-DD HH:mm') : ' - ' }}</span>
+          </el-tag>
+        </div>
+        <!-- <document-sign-info v-if="data.info" :isShowTitle="false" :data="data.info" /> -->
+      </template>
+      <div v-else-if="!loading && !data" style="padding-top: var(--padding-large); padding-bottom: var(--padding-xxlarge); text-align: center">
+        Мэдээлэл байхгүй байна.
+      </div>
+    </div>
+    <div slot="footer">
+      <el-button plain :disabled="loading" @click="handleClose">
+        Хаах
+      </el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+export default {
+  name: 'SignInfoDialog',
+  props: {
+    visible: { type: Boolean, default: false },
+    filter: { type: Object, default: () => {} },
+    dialogTitle: { type: String, default: 'Зурсан тоон гарын үсгийн мэдээлэл' }
+  },
+  data () {
+    return {
+      loading: false,
+      data: null
+    }
+  },
+  computed: {
+    modelVisible: {
+      get () { return this.visible },
+      set (val) { this.$emit('update:visible', val) }
+    }
+  },
+  watch: {
+    visible (value) {
+      if (value && this.filter) {
+        this.handleLoad()
+        // this.initializeSocket()
+      }
+    }
+  },
+  methods: {
+    handleLoad () {
+      this.loading = true
+      this.$store.dispatch('GET_SIGNATURE_DOCUMENT', { id: this.filter.docRequestId, statusCode: this.filter.statusCode, userId: this.filter.userId }).then((response) => {
+        this.data = response
+        this.loading = false
+      }, (error) => {
+        this.loading = false
+        this.$showError(error)
+      })
+    },
+    handleClose () {
+      this.data = null
+      this.$emit('onClose')
+    }
+  }
+}
+</script>