@kyfe/ks-query-table 0.0.21 → 0.0.22

package/kuasheng-ui/utils/init-event.js

@@ -0,0 +1,20 @@
+import {http} from './http'
+// 检查request有没有加载
+export function initEvent() {
+  if (window.ks && window.ks.request) {
+    dispatchEvent()
+  } else {
+    setTimeout(() => {
+      if (window.ks && window.ks.request) {
+        _dispatchEvent()
+      } else {
+        initEvent()
+      }
+    }, 300)
+  }
+}
+function _dispatchEvent() {
+  window.dispatchEvent(new CustomEvent('__ks_ready__', {
+    detail: {http}
+  }))
+}

package/kuasheng-ui/utils/log.js

@@ -0,0 +1,309 @@
+import bus from './bus'
+import { getToken } from './token'
+import { md5Http, getKsEnv } from './common'
+// import {http} from './http'
+
+const axios = window.axios
+const API_CODE = 'cts.trace.uploadWebActionLog'
+
+const collectApiMap = {
+  uat: 'https://collect-uat.ky-express.com/json/collector',
+  prd: 'https://collect.ky-express.com/json/collector'
+}
+
+class LogPlugin {
+  constructor (option = {}) {
+    this.userId = option.userId
+    this.menuId = option.menuId
+    this.countThreshold = option.countThreshold || 10
+    this.timeThreshold = option.timeThreshold || 10 //秒
+    this.sizeThreshold = option.sizeThreshold || 10  //kb
+    this.deounceThreshold = option.deounceThreshold || 300 //毫秒
+    this.uploadDebouncTime = null
+    this.initTime = Date.now()
+    this.reportList = []
+    this.lastActionName = ''
+    this.lastActionId = ''
+    this.immediateReport = false
+    this.ignoreUrl = [API_CODE].concat(option.ignoreUrl || [])
+    this.ignoreClass = ['log-disabled','el-dialog__wrapper','main-panel'].concat(option.ignoreClass || [])
+    this.ignoreTag = ['canvas'].concat(option.ignoreTag || [])
+    this.init()
+    // this.firstReport()
+  }
+
+  init () {
+    this.ignoreUrl.push('mcs.user.menu.access.report')
+    window.setInterval(this.checkReport.bind(this), this.timeThreshold * 1000)
+    this.addEventListener()
+  }
+
+  setOption(option) {
+    Object.keys(option).forEach(item => {
+      if (this.hasOwnProperty(item)) {
+        this[item] = option[item]
+      }
+    })
+    console.log(this)
+  }
+
+  async reportOnInit() {
+    let menu = window.ksui && window.ksui.menu
+    let info = await window.ks.getUserInfo()
+    let user = info.userInfo || {}
+    let userId = this.userId || user.id
+    if (!userId || !menu.id) {
+      console.warn(`[log-plugin 首次上报] userId或menuId未获取到`)
+      return
+    }
+    let report = this.getNormalizerReport()
+    report.menuId = menu.id
+    report.userId = userId
+    report.location = 'h5'
+    report.navigator = navigator.appVersion || navigator.userAgent
+    report.navigator = report.navigator + ' KSUI:' + window.ksui.version
+    report.xpath = this.makeActionId()
+    report.action = '首次进入'
+    report.startTime = String(this.initTime)
+    report.endTime = '0'
+    report.url = 'h5'
+    report.httpStatus = '200'
+    // `${user.id}-${now}-${random(4)}-${menu.id || 'xxxx'}`
+    report.webTraceId = `${userId}-${menu && menu.id || 'xxxx'}-${String(this.initTime)}-${this.lastActionId || this.randomCode()}-${Math.floor(1000 + 1000 * Math.random())}`
+    // report.webTraceId = userId + '-' + Date.now() + '-' + Math.floor(1000 + 1000 * Math.random()) + '-' + menu.id
+    report.requestHeaders = `${userId}-${String(menu.id)}-${String(this.initTime)}`
+    report.resCode = 0
+    console.log('首次上报', report)
+    report.immediate = true
+    this.reportList.push(report)
+    this.checkReport()
+  }
+
+  firstReport() {
+    if (window.ks && window.ks.request) {
+      this.reportOnInit()
+    } else {
+      setTimeout(() => {
+        if (window.ks && window.ks.request) {
+          this.reportOnInit()
+        } else {
+          this.firstReport()
+        }
+      }, 10)
+    }
+  }
+
+  getNormalizerReport () {
+    return {
+      xpath: '', // 事件id
+      action: '', // 事件名称
+      userId: this.userId || window.ksui && window.ksui.user &&  window.ksui.user.id,
+      menuId: '',
+      startTime: '',
+      endTime: '',
+      url: '',
+      requestHeaders: '', // 模块首次进入时间
+      requestBody: '', // 弃用
+      responseHeaders: '', // 弃用
+      responseData: '', // 弃用
+      httpStatus: '',
+      webTraceId: '',
+      resCode: '',
+      immediate: this.immediateReport
+    }
+  }
+
+  checkReport () {
+
+    if (this.reportList.some(item => item.immediate)) {
+      console.log(`[log-plugin] 触发立即上报`)
+      this.upload()
+      this.clear()
+      return
+    }
+    if (this.uploadDebouncTime) {
+      clearTimeout(this.uploadDebouncTime)
+    }
+    if (this.reportList.length >= this.countThreshold) {
+      console.log(`[log-plugin] 达到采集条数: ${this.countThreshold}上报`)
+      this.upload()
+      this.clear()
+    } else {
+      this.uploadDebouncTime = setTimeout(() => {
+        this.upload()
+        this.clear()
+      }, this.deounceThreshold)
+    }
+  }
+
+  clear () {
+    this.reportList = []
+  }
+
+  upload () {
+    if (!this.reportList.length) return
+    const data = this.reportList
+    const token = getToken()
+    const menu = window.ksui.menu
+    const env = getKsEnv()
+    const now = Date.now()
+    const headers = {
+      // timestamp: Date.now(),
+      // $config: {
+      //   _tips: false
+      // }
+      format: 'JSON',
+      method: API_CODE,
+      appkey: '50159',
+      token: getToken(),
+      timestamp: now,
+      'X-Env': env || 'uat',
+      'X-menu-id': menu.id,
+      sign: md5Http(token, now, data)
+    }
+    const BaseUrl = collectApiMap[env] || collectApiMap['uat']
+    axios({
+      method: 'post',
+      url: `${BaseUrl}?${API_CODE}`,
+      data,
+      headers
+    }).then(() => {
+      console.log(`[log-plugin] 日志上报成功`)
+    }).catch(error => {
+      console.log(error)
+      console.log(`[log-plugin] 日志上报失败`)
+    })
+    // http(API_CODE, 50159, data, {headers}).then(() => {
+    //   console.log(`[log-plugin] 日志上报成功`)
+    // }).catch(error => {
+    //   console.log(error)
+    //   console.log(`[log-plugin] 日志上报失败`)
+    // })
+  }
+
+  makeReport(axiosResponse) {
+    let ua = navigator.appVersion || navigator.userAgent
+    let config = axiosResponse.config
+    let menuId = this.menuId || config.headers['X-menu-id']
+    let report = this.getNormalizerReport()
+    if (!report.userId) {
+      console.warn(`[log-plugin] userId未获取到,请设置userId: ksui.log.userId = "用户id"`)
+      return false
+    }
+    if (!menuId) {
+      console.warn(`[log-plugin] menuId未获取到,请设置menuId: ksui.log.menuId = "菜单id"`)
+      return false
+    }
+    if (!/^[0-9]+$/.test(menuId)) {
+      console.warn(`[log-plugin] menuId格式错误: ${menuId}, 应该是全数字`)
+      return false
+    }
+    report.menuId = String(menuId)
+    report.location = config.location || ''
+    report.navigator = ua
+    report.xpath = config.lastActionId || ''
+    report.action = config.lastActionName || ''
+    report.startTime = String(config.startTime || 0)
+    report.endTime = String(Date.now())
+    report.url = config.url || ''
+    report.httpStatus = String(axiosResponse.status || '')
+    report.webTraceId = config.headers['x-webtrace-id']
+    report.requestHeaders = `${report.userId}-${String(menuId)}-${String(this.initTime)}`
+    if (axiosResponse.data && axiosResponse.data.code !== undefined) {
+      report.resCode = String(axiosResponse.data.code)
+    }
+    return report
+  }
+
+  collectRequest (config) {
+    config.startTime = config.headers.timestamp || Date.now()
+    config.lastActionName = this.lastActionName
+    config.lastActionId = this.lastActionId
+    config.location = location.host
+  }
+
+  collectResponse (axiosResponse) {
+    let conf = axiosResponse.config
+    // 过滤掉不走开放平台的接口,第三方接口不采集
+    if (!conf.headers || !conf.headers.method) {
+      return
+    }
+    // 过滤掉标注为不上报日志的接口
+    if (conf.$config && conf.$config._log === false) {
+      return
+    }
+    // 过滤不上报的method
+    if (this.ignoreUrl.some(url => conf.headers.method.indexOf(url) >= 0) || this.ignoreUrl.some(url => conf.url.indexOf(url) >= 0)) {
+      return
+    }
+    if (conf.lastActionName && conf.lastActionId ) {
+      let report = this.makeReport(axiosResponse)
+      if (report) {
+        this.immediateReport = false
+        this.reportList.push(report)
+        this.checkReport()
+      }
+    }
+  }
+
+  randomCode () {
+    let id = this.userId || window.ksui && window.ksui.user && window.ksui.user.id || ''
+    return '' + id + Date.now() + Math.floor(1000 + 1000 * Math.random())
+  }
+
+  isIgnore (dom) {
+    if (!dom) return true
+    let classList = dom.className
+    let tagName = dom.tagName && dom.tagName.toLocaleLowerCase()
+    let ignore = this.ignoreClass.some(c => typeof classList === 'string' && classList.indexOf(c) >= 0) || this.ignoreTag.some(t => tagName.indexOf(t) >= 0)
+    return ignore
+  }
+
+  handleEvent (e) {
+    if (this.isIgnore(e.target)) {
+      this.lastActionName = ''
+      this.lastActionId = ''
+    } else {
+      let text = e.target.textContent || ''
+      this.lastActionName = text ? text.trim().replace(/\s/g, '').substr(0, 10) : text
+      this.lastActionId = this.randomCode()
+    }
+  }
+
+  // 自定义日志事件名称
+  click (option = {}) {
+    if (typeof option === 'string') {
+      this.lastActionName = option
+      return
+    }
+    if (option.actionName) {
+      this.lastActionName = option.actionName
+    }
+    if (option.actionId) {
+      this.lastActionId = option.actionId
+    }
+    if (option.immediate) {
+      this.immediateReport = option.immediate
+    }
+  }
+
+  addEventListener () {
+    document.addEventListener('click', this.handleEvent.bind(this), true)
+    bus.$on('httpStart', this.collectRequest.bind(this))
+    bus.$on('httpEnd', this.collectResponse.bind(this))
+  }
+
+  makeActionId() {
+    return this.randomCode()
+  }
+  // httpStart(request) {
+  //   this.collectRequest(request)
+  // }
+
+  // httpEnd(response) {
+  //   this.collectResponse(response)
+  // }
+
+}
+
+export default new LogPlugin()

package/kuasheng-ui/utils/token.js

@@ -0,0 +1,9 @@
+// 掉接口获取token
+export const getToken = () => {
+  return sessionStorage.getItem('ks_token') || ''
+}
+
+export const setToken = token => {
+  token = token || ''
+  sessionStorage.setItem('ks_token', token)
+}

package/kuasheng-ui/utils/type.js

@@ -0,0 +1,45 @@
+export const toString = Object.prototype.toString;
+
+export const is = (type, primitive = false) => {
+  return function (obj) {
+    return primitive
+      ? typeof obj === type.toLowerCase()
+      : toString.call(obj) === `[object ${type}]`;
+  };
+};
+
+/**
+ * @method 检测当前类型是否为函数
+ * @param item 检测当前类型
+ * @returns { Boolean } 如果是函数则返回true、否则返回false
+ */
+export function isFunction(item) {
+  return is('Function')(item);
+}
+
+/**
+ * @method 检测当前类型是否为字符串
+ * @param item 检测当前类型
+ * @returns { Boolean } 如果是字符串则返回true、否则返回false
+ */
+export function isString(item) {
+  return is('String', true)(item);
+}
+ 
+/**
+ * @method 检测当前类型是否为数字
+ * @param item 检测当前类型
+ * @returns { Boolean } 如果是数字则返回true、否则返回false
+ */
+export function isNumber(item) {
+  return is('Number', true)(item);
+}
+
+/**
+ * @method 检测当前类型是否为布尔
+ * @param item 检测当前类型
+ * @returns { Boolean } 如果是布尔则返回true、否则返回false
+ */
+export function isBoolean(item) {
+  return is('Boolean', true)(item);
+}

package/kuasheng-ui/utils/validate.js

@@ -0,0 +1,20 @@
+export const valid = (data, schema) => {
+  Object.keys(schema).forEach(key => {
+    validate(data[key], schema[key])
+  })
+}
+
+const validate = (value, rules) => {
+  rules.forEach(rule => {
+    Object.keys(rule).forEach(item => {
+      [item](value, rule[item])
+    })
+  })
+}
+
+const type = (value, type) => {
+  if (typeof value === type) {
+    return true
+  }
+  return false
+}

package/kuasheng-ui/utils/watermark.js

@@ -0,0 +1,67 @@
+// 添加自定义水印
+export const customWatermark = (text = '', el = '.ksui-container, .van-dialog, .ksui-card, .ks-table', color = 'rgba(0,0,0,0.1)', rotate = 30) => {
+  let canvas = document.createElement('canvas')
+  let ctx = canvas.getContext('2d')
+  ctx.font = '100 12px PingFangSC'
+  // 角度转弧度
+  rotate = (rotate * Math.PI) / 180
+  let text1 = ''
+  let text2 = ''
+  // text参数是数组则文本分两行
+  if (Array.isArray(text)) {
+    text1 = text[0]
+    text2 = text[1]
+  } else {
+    text1 = text
+  }
+  let text1Width = ctx.measureText(text1).width
+  let text2Width = ctx.measureText(text2).width
+  let l = text1Width > text2Width ? text1Width : text2Width
+  // 将文本长度作为斜边求两个直角边
+  let top = Math.floor(l * Math.sin(rotate))
+  let left = Math.floor(l * Math.cos(rotate))
+
+  let dpr = window.devicePixelRatio
+  const cssWidth = left + 50
+  const cssHeight = top + 80
+
+  // canvas.style.width = cssWidth + 'px'
+  // canvas.style.height = cssHeight + 'px'
+  
+  canvas.width = cssWidth * dpr
+  canvas.height = cssHeight * dpr
+  
+  ctx.scale(dpr, dpr)
+  ctx.fillStyle = color
+  ctx.textBaseline = 'middle'
+  ctx.rotate(-rotate)
+  ctx.fillText(text1, 0, top)
+  ctx.fillText(text2, 0, top + 10)
+
+  let encode = canvas.toDataURL('image/png')
+  let style = document.createElement('style')
+  style.type = 'text/css'
+  style.innerHTML = `${el}{background-image:url(${encode});background-size: ${cssWidth}px ${cssHeight}px;}`
+  document.querySelector('head').appendChild(style)
+}
+
+/**
+ * 添加水印方法，调用ksui.watermark
+ * @param {string} employeeNumber 工号
+ * @param {sting} el css选择器
+ * @param {string} color 水印文字颜色（格式rgba）
+ */
+const watermark = (employeeNumber = '', el = '.ksui-container, .van-dialog, .ksui-card, .ks-table', color = '#F0F3F9') => {
+  let date = new Date()
+  const f = num => {
+    let str = String(num)
+    return str.length === 1 ? '0' + str : str
+  }
+  let text = [
+    `${employeeNumber}`,
+    `${date.getFullYear()}/${f(date.getMonth() + 1)}/${f(date.getDate())} ${f(date.getHours())}:${f(date.getMinutes())}:${f(date.getSeconds())}`
+  ]
+  customWatermark(text, el, color)
+}
+
+export default watermark

package/kuasheng-ui/version.js

@@ -0,0 +1 @@
+export default '3.0.43'

package/ky-apm/client.js

@@ -0,0 +1,37 @@
+/** 
+ * ky-apm 采集上报模块
+ * 白名单 white-list
+ * http
+ * 
+ */
+ import {warnLog} from './warn-log';
+
+ class Client {
+  constructor(appConfig) {
+    this.appConfig = appConfig; 
+   }
+   getConfig() {
+    return this.appConfig
+   }
+  // 上报模块
+   reportData (data) {
+     // 判断类型(轻应用、erp、自定义上传)
+     try {
+       if (this.appConfig.customReport && typeof this.appConfig.customReport === 'function') {
+         this.appConfig.customReport(data)
+       } else if (this.appConfig.app === 'apm-ks') {
+         // 轻应用
+         window.ksui && window.ksui.http(this.appConfig.reportUrl, this.appConfig.appkey, data)
+       } else if (this.appConfig.app === 'apm-erp') {
+         // 铸剑(需要将铸剑的http实例传入)
+         if (this.appConfig.$http && typeof this.appConfig.$http === 'function') {
+           this.appConfig.$http(this.appConfig.reportUrl, data, { log: false, cancel: true, appkey: this.appConfig.appkey })
+         }
+       }
+       console.log('[kyApm上报成功]')
+     } catch (error) { 
+       warnLog(error)
+     }
+   }
+ }
+ export default Client

package/ky-apm/customHttp.js

@@ -0,0 +1,38 @@
+// 该 js 是提供给客户端帮忙注入到轻应用，hook了请求，自定义上报请求到 apm 平台（走原生请求采集不到请求日志）
+if (window.ks && window.ks.request && !window.__APMCUSTOMHTTP) {
+  window.ks.request = function (method, body = {}, headers = {}) {
+    return new Promise((resolve, reject) => {
+        window.ks.callFunc({
+          method: 'request',
+          params: {
+              method,
+              body,
+              headers
+          }
+      }).then(resp => {
+          resolve(resp)
+          try {
+            if (window._apm ) {
+              let now = Date.now()
+              const rt = now - headers.timestamp
+              window._apm('sendAPILog', {
+                url: method || '', // 请求地址
+                method: 2, // 请求类型：2=POST
+                rc: 200, // 请求状态
+                rt: rt,
+                traceid: headers.webTraceId || '',
+                req_body: '',
+                req_query: ''
+              })
+              window.__APMCUSTOMHTTP = true
+              console.log('上报apm自定义')
+            }
+          } catch (error) {
+            console.error('【apm自定义上报http错误】:', error)
+          }
+      }).catch(err => {
+          reject(err)
+      })
+    })
+  }
+}

package/ky-apm/index.js

@@ -0,0 +1,68 @@
+/** 
+ * ky-apm 采集上报模块
+ * 白名单 white-list
+ * http
+ * 
+ */
+import {warnLog} from './warn-log';
+import Client from './client'
+import SelfError from './plugins/self-error.js'
+import PerformancePlugin from './plugins/performance.js'
+var plugins = [PerformancePlugin]
+var defaultConfig = {
+  reportUrl: 'fmk.monitor.frontexception.log.report',
+  appkey: '55212',
+  performance: { // 性能相关参数
+    durationTime: 2000, // 性能采集的统计时长阀值
+  },
+  navigator: navigator && navigator.userAgent || '',
+  app: 'apm-ks', // apm-ks, apm-erp
+  module: '',   // 当前模块名称
+  userName: '',  // 当前用户姓名
+  userId: '',  // 当前用户userId
+  logType: 'performance', // 性能采集: performance
+  logId: 'kyApm',
+  whiteList: [] // 需要监控的白名单userId列表
+}
+
+var kyApm = {
+  init (config = {}) {
+    try {
+      if (this.isInit) {
+        warnLog('KyApm已经初始化,请勿重复初始化！')
+        return false
+      }
+      if (config.whiteList && config.whiteList.length && !config.whiteList.includes(config.userId)) {
+        warnLog('该用户不在收集白名单中,KyApm不采集数据！')
+        return false
+      }
+      this.isInit = false
+      this.config = { ...defaultConfig, ...config }
+      this.client = new Client(this.config)
+      this.selfError = new SelfError(this.client, this.config)
+      this.initPlugins(this.client, this.selfError)
+      this.isInit =  true
+      console.log('KyApm初始化成功')
+    } catch (error) {
+      console.log('----', this.selfError)
+      warnLog(error)
+    }
+  },
+  initPlugins (client, selfError) {
+    try {
+      plugins.forEach(plugin => {
+        new plugin(client, selfError)
+      })
+    } catch (error) {
+      this.selfError.error(error)
+      warnLog(error)
+    }
+  }
+}
+
+// 浏览器环境直接挂载插件
+if (typeof window !== 'undefined' && !window.kyApm) {
+  window.kyApm = kyApm
+}
+
+export default kyApm