agilebuilder-ui 1.0.0

package/packages/scan-code-input/src/scan-code-input-colse.vue

@@ -0,0 +1,140 @@
+<template>
+  <div class>
+    <video
+      id="video"
+      ref="video"
+      height="300"
+      class="video vjs-fluid"
+      autoplay
+      @click="clickVideo"
+    />
+    <div v-show="tipShow" class="tip">
+      {{ tipMsg }}
+    </div>
+  </div>
+</template>
+
+<script type="text/ecmascript-6">
+import { $on, $off, $once, $emit } from '../../utils/gogocodeTransfer';
+import { BrowserMultiFormatReader } from '@zxing/library'
+
+export default {name: 'ScanCodeInputColse',
+components: {},
+props: {
+  colseVideo: {
+    type: Boolean,
+    default: false
+  }
+},
+data() {
+  return {
+    loadingShow: false,
+    codeReader: new BrowserMultiFormatReader(),
+    textContent: null,
+    vin: null,
+    tipMsg: this.$t('messageVideo.attemptingToIdentify'),
+    tipShow: false,
+    isVideo: false
+  };
+},
+created() {
+  this.openScan()
+},
+beforeUnmount() {
+  console.log('销毁定时器')
+  this.codeReader.reset()
+},
+methods: {
+  async openScan() {
+    const that = this
+    that.codeReader.listVideoInputDevices().then((videoInputDevices) => {
+      that.tipShow = true
+      that.tipMsg = this.$t('messageVideo.callingRearCamera')
+      console.log('videoInputDevices', videoInputDevices)
+      // 默认获取第一个摄像头设备id
+      let firstDeviceId = videoInputDevices[0].deviceId
+      // 获取第一个摄像头设备的名称
+      const videoInputDeviceslablestr = JSON.stringify(videoInputDevices[0].label)
+      if (videoInputDevices.length > 1) {
+        // 判断是否后置摄像头
+        if (videoInputDeviceslablestr.indexOf('back') > -1) {
+          firstDeviceId = videoInputDevices[0].deviceId
+        } else {
+          firstDeviceId = videoInputDevices[1].deviceId
+        }
+      }
+      that.decodeFromInputVideoFunc(firstDeviceId)
+    }).catch((err) => {
+      that.tipShow = false
+      console.error(err)
+    })
+  },
+  async openScanTwo() {
+    const that = this
+    // codeReader.reset() // 重置
+    // that.textContent = null // 重置
+    that.codeReader = await new BrowserMultiFormatReader()
+    that.codeReader.listVideoInputDevices().then((videoInputDevices) => {
+      that.tipShow = true
+      that.tipMsg = this.$t('messageVideo.callingRearCamera')
+      console.log('videoInputDevices', videoInputDevices)
+      // 默认获取第一个摄像头设备id
+      let firstDeviceId = videoInputDevices[0].deviceId
+      // 获取第一个摄像头设备的名称
+      const videoInputDeviceslablestr = JSON.stringify(videoInputDevices[0].label)
+      if (videoInputDevices.length > 1) {
+        // 判断是否后置摄像头
+        if (videoInputDeviceslablestr.indexOf('back') > -1) {
+          firstDeviceId = videoInputDevices[0].deviceId
+        } else {
+          firstDeviceId = videoInputDevices[1].deviceId
+        }
+      }
+      that.decodeFromInputVideoFunc(firstDeviceId)
+    }).catch((err) => {
+      that.tipShow = false
+      console.error(err)
+    })
+  },
+  decodeFromInputVideoFunc(firstDeviceId) {
+    const that = this
+    that.codeReader.reset() // 重置
+    that.textContent = null // 重置
+    that.codeReader.decodeFromVideoDevice(firstDeviceId, 'video', (result, err) => {
+      that.tipMsg = this.$t('messageVideo.attemptingToIdentify')
+      // let nowContent = null
+      that.textContent = null
+      if (result) {
+        console.log(result)
+        that.textContent = result.text
+        if (that.textContent) {
+          that.tipShow = false
+          that.msgBoxFunc(that.textContent)
+        }
+      }
+      if (err && !(err)) {
+        that.tipMsg = this.$t('messageVideo.identificationFailed')
+        setTimeout(() => {
+          that.tipShow = false
+        }, 2000)
+        console.error(err)
+      }
+    })
+  },
+  // that.$createDialog 是 cube-ui滴滴 messageBox ,到这一步 二维码值已出，这里是可有可无的代码块，看各自项目ui使用情况 自行替换 messageBox
+  msgBoxFunc(textContent) {
+    const that = this
+    that.vin = textContent
+    $emit(that, "close",that.vin)
+    that.codeReader.reset()
+  },
+  clickVideo() {
+    if (this.colseVideo) {
+      $emit(this, "close",this.vin)
+      this.codeReader.reset()
+    }
+  }
+},
+                emits:['close',]
+            }
+</script>

package/packages/scan-code-input/src/scan-code-input.vue

@@ -0,0 +1,132 @@
+<template>
+  <div>
+    <el-input
+      :model-value="value"
+      :disable="disable"
+      :placeholder="placeholder"
+      :clearable="clearable"
+      :readonly="readonly"
+      :maxlength="maxlength"
+      @change="change"
+      @blur="blur"
+      @focus="focus"
+      @input="input"
+      @clear="clear"
+    >
+      <template v-slot:append>
+        <el-button
+          v-if="isMobile"
+          :icon="ElIconFullScreen"
+          @click="openVideo"
+        />
+      </template>
+      <!-- <el-button slot="append" icon="el-icon-full-screen" @click="openVideo" /> -->
+    </el-input>
+    <scan-code-input-colse
+      v-if="isShow"
+      :colse-video="colseVideo"
+      @close="closeVideo"
+    />
+  </div>
+</template>
+
+<script type="text/ecmascript-6">
+import { FullScreen as ElIconFullScreen } from '@element-plus/icons-vue'
+import { $on, $off, $once, $emit } from '../../utils/gogocodeTransfer';
+import scanCodeInputColse from './scan-code-input-colse.vue'
+import events from './events'
+export default {
+    data() {
+
+      return {
+          isMobile: false,
+isShow: false,
+scanCode: '',
+          ElIconFullScreen,
+      }
+    },
+    name: 'ScanCodeInput',
+components: {
+scanCodeInputColse
+},
+model: {
+prop: 'value',
+event: 'input'
+},
+props: {
+colseVideo: {
+type: Boolean,
+default: false
+},
+value: {
+type: String,
+default: null
+},
+disable: {
+type: Boolean,
+default: false
+},
+placeholder: {
+type: String,
+default: null
+},
+clearable: {
+type: Boolean,
+default: null
+},
+readonly: {
+type: Boolean,
+default: false
+},
+maxlength: {
+type: Number,
+default: null
+}
+},
+watch: {
+value: {
+deep: true,
+handler(val) {
+  this.scanCode = this.value
+}
+}
+},
+created() {
+// this.tipShow = true
+this.isMobile = this.equipment()
+this.scanCode = this.value
+},
+beforeUnmount() {
+
+},
+methods: {
+...events,
+equipment() {
+const flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
+if (flag) {
+  return flag
+} else {
+  try {
+    document.createEvent('TouchEvent')
+    return true
+  } catch (e) {
+    return false
+  }
+}
+},
+openVideo() {
+if (this.isShow) {
+  this.isShow = false
+} else {
+  this.isShow = true
+}
+},
+closeVideo(value) {
+this.isShow = false
+this.value = value
+$emit(this, "colse",value)
+}
+},
+emits:['colse','update:value',]
+}
+</script>

package/packages/secret-info/index.js

@@ -0,0 +1,7 @@
+import SecretInfo from './index.vue'
+
+SecretInfo.install = function (Vue) {
+  Vue.component(SecretInfo.name, SecretInfo)
+}
+
+export default SecretInfo

package/packages/secret-info/index.vue

@@ -0,0 +1,100 @@
+<template>
+  <span v-if="value !== undefined && value !== null && value !== ''">
+    <span v-if="isShow">
+      {{ decryInfo
+      }}<i
+        class="fa fa-eye"
+        style="margin-left: 5px"
+        @click="showHideSecretInfo"
+      />
+    </span>
+    <span v-else>
+      ******<i
+        class="fa fa-eye-slash"
+        style="margin-left: 5px"
+        @click="showHideSecretInfo"
+      />
+    </span>
+  </span>
+</template>
+
+<script>
+export default {
+  name: 'SecretInfo',
+  props: {
+    entity: {
+      type: Object,
+      default: null,
+    },
+    prop: {
+      type: String,
+      default: null,
+    },
+    value: {
+      type: String,
+      default: null,
+    },
+    tableName: {
+      type: String,
+      default: null,
+    },
+    listCode: {
+      type: String,
+      default: null,
+    },
+    pageCode: {
+      type: String,
+      default: null,
+    },
+    listName: {
+      type: String,
+      default: null,
+    },
+    fieldLabel: {
+      type: String,
+      default: null,
+    },
+  },
+  data() {
+    return {
+      isShow: false,
+      decryInfo: null,
+    }
+  },
+  methods: {
+    showHideSecretInfo() {
+      if (this.isShow) {
+        // 需要隐藏信息
+        this.isShow = false
+      } else {
+        // 需要显示信息
+        this.decryAndSaveLog()
+      }
+    },
+    decryAndSaveLog() {
+      const params = {
+        tableName: this.tableName,
+        listCode: this.listCode,
+        listName: this.listName,
+        pageCode: this.pageCode,
+        fieldName: this.prop,
+        fieldCnName: this.fieldLabel,
+        ciphertext: this.value,
+      }
+      if (this.entity) {
+        params.dataId = this.entity.ID ? this.entity.ID : this.entity.id
+      }
+      this.$http
+        .post(
+          this.baseAPI + '/component/super-pages/decodeAndMonitorSecretInfoLog',
+          params
+        )
+        .then((decryVal) => {
+          this.decryInfo = decryVal
+          this.isShow = true
+        })
+    },
+  },
+  emits: ['update:value'],
+}
+</script>

package/packages/super-grid/index.js

@@ -0,0 +1,7 @@
+import SuperGrid from './src/super-grid.vue'
+
+SuperGrid.install = function (Vue) {
+  Vue.component(SuperGrid.name, SuperGrid)
+}
+
+export default SuperGrid