agilebuilder-ui 1.0.0

package/src/utils/validate.js

@@ -0,0 +1,34 @@
+/**
+ * Created by jiachenpan on 16/11/18.
+ */
+
+export function validUsername(str) {
+  // const valid_map = ['admin', 'editor']
+  // return valid_map.indexOf(str.trim()) >= 0
+  return true
+}
+
+/* 合法uri*/
+export function validateURL(textval) {
+  const urlregex =
+    /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
+  return urlregex.test(textval)
+}
+
+/* 小写字母*/
+export function validateLowerCase(str) {
+  const reg = /^[a-z]+$/
+  return reg.test(str)
+}
+
+/* 大写字母*/
+export function validateUpperCase(str) {
+  const reg = /^[A-Z]+$/
+  return reg.test(str)
+}
+
+/* 大小写字母*/
+export function validateAlphabets(str) {
+  const reg = /^[A-Za-z]+$/
+  return reg.test(str)
+}

package/src/utils/watermark.js

@@ -0,0 +1,108 @@
+'use strict'
+// import ssoService from '../api/sso-service'
+const watermark = {}
+
+const setWatermark = (str, parma, paramId) => {
+  let id = '1.23452384164.123412415'
+  if (paramId) {
+    id = paramId
+  }
+  if (document.getElementById(id) !== null) {
+    if (document.getElementById('pdfDom')) {
+      var cell1 = document.getElementById('pdfDom')
+      cell1.removeChild(document.getElementById(id))
+    } else {
+      document.body.removeChild(document.getElementById(id))
+    }
+  }
+  const can = document.createElement('canvas')
+  can.width = parma && parma.width && parma.width !== '' ? parma.width : '400' // 单个水印的宽高
+  can.height =
+    parma && parma.height && parma.height !== '' ? parma.height : '200'
+
+  const cans = can.getContext('2d')
+  cans.rotate((20 * Math.PI) / 160) // 水印偏转角度
+  cans.font =
+    parma && parma.font && parma.font !== '' ? parma.font : '17px Vedana' // 设置样式
+  cans.fillStyle =
+    parma && parma.color && parma.color !== ''
+      ? parma.color
+      : 'rgba(200, 200, 200, 0.40)' // 水印字体颜色
+  cans.textAlign = 'left'
+  cans.textBaseline = 'Middle'
+  cans.fillText(str, 60, 40)
+
+  const div = document.createElement('div')
+  div.id = id
+  div.style.pointerEvents = 'none'
+  div.style.top = '80px'
+  div.style.left = '200px'
+  div.style.position = 'fixed'
+  div.style.zIndex = '10000'
+  div.style.width = '70%'
+  div.style.height = '80%'
+  div.style.background =
+    'url(' + can.toDataURL('image/png') + ') left top repeat'
+
+  if (document.getElementById('pdfDom')) {
+    var cell = document.getElementById('pdfDom')
+    cell.appendChild(div)
+  } else {
+    document.body.appendChild(div)
+  }
+  return id
+}
+
+// 该方法只允许调用一次
+export function showWatermark(label, parma, user, paramId) {
+  var date = new Date()
+  date = formatDate(date, 'yyyy-MM-dd')
+  setTimeout(() => {
+    var str =
+      label && label !== '' ? label : user ? user.name + '  ' + date : date
+    let id = setWatermark(str, parma, paramId)
+    setInterval(() => {
+      if (document.getElementById(id) === null) {
+        id = setWatermark(str, parma, paramId)
+      }
+    }, 500)
+    window.onresize = () => {
+      setWatermark(str, parma, paramId)
+    }
+  })
+}
+// watermark.set = (label, parma) => {
+
+// }
+
+const formatDate = (date, fmt) => {
+  if (/(y+)/.test(fmt)) {
+    fmt = fmt.replace(
+      RegExp.$1,
+      (date.getFullYear() + '').substr(4 - RegExp.$1.length)
+    )
+  }
+  const o = {
+    'M+': date.getMonth() + 1,
+    'd+': date.getDate(),
+    'h+': date.getHours(),
+    'm+': date.getMinutes(),
+    's+': date.getSeconds(),
+  }
+  for (const k in o) {
+    if (new RegExp(`(${k})`).test(fmt)) {
+      const str = o[k] + ''
+      fmt = fmt.replace(
+        RegExp.$1,
+        RegExp.$1.length === 1 ? str : padLeftZero(str)
+      )
+    }
+  }
+  return fmt
+}
+
+function padLeftZero(str) {
+  return ('00' + str).substr(str.length)
+}
+
+export default watermark

package/src/utils/workflow-util.js

@@ -0,0 +1,104 @@
+import { getI18n } from './util'
+/**
+ * 国际化显示流转历史
+ * @param {*} history
+ * @param {*} processNameI18n 流程名称国际化后的值
+ */
+export function i18nOperation(history, processNameI18n, processI18n, language) {
+  let operation = history.transactionResult
+  const historyType = history.historyType
+  if (!history.current && historyType) {
+    // 不是当前待办任务才需要国际化显示“流转操作”信息
+    if (history.transactionParams) {
+      const params = JSON.parse(history.transactionParams)
+      let i18nKey = historyType.toLowerCase()
+      const isButtonOperation = isCommonButtonOperation(historyType)
+      if (isButtonOperation) {
+        i18nKey = 'commonButtonOperation'
+      } else if (i18nKey === 'process_end') {
+        i18nKey = 'processEnd'
+      }
+      if (isButtonOperation || historyType === 'HISTORY_COMPLETE_TRANSFER') {
+        // 是普通任务办理按钮 或 完成移交任务时，才会传“操作”（例如：submit、save、approve等等）
+        // 需要把这些操作进行国际化显示。
+        // 在params中2对应的是操作
+        const buttonOperation = params['2']
+        // 国际化buttonOperation
+        params['key_2'] = getI18n().t('workflowButton.' + buttonOperation)
+      }
+      if (
+        i18nKey === 'process_start' &&
+        processNameI18n &&
+        processNameI18n !== null
+      ) {
+        // 表示发起流程时，流程名称要国际化显示
+        params['key_1'] = processNameI18n
+        operation = getI18n().t('workflowHistoryList.' + i18nKey, params)
+      } else {
+        const newParams = {}
+        for (const key in params) {
+          let newkey = key + ''
+          if((key + '').indexOf('key_') < 0) {
+            newkey = 'key_'+ newkey
+          }
+          newParams[newkey] = params[key]
+        }
+        if (processI18n && language) {
+          for (const key in params) {
+            let newkey = key + ''
+            if((key + '').indexOf('key_') < 0) {
+              newkey = 'key_'+ newkey
+            }
+            newParams[newkey] = params[key]
+            // param格式为：${taskNodeId:name.newHumanTask1##环节1}
+            const param = params[key]
+            if (param.indexOf('${taskNodeId:') >= 0) {
+              // 获得name.newHumanTask1
+              const taskI18nKey = param.substring(
+                param.indexOf(':') + 1,
+                param.indexOf('##')
+              )
+              // 获得 环节1
+              const taskName = param.substring(
+                param.indexOf('##') + 2,
+                param.lastIndexOf('}')
+              )
+              // 获得{zh_CN:xx, en_US:xx}
+              const taskNameI18n = processI18n[taskI18nKey]
+              if (
+                taskNameI18n &&
+                taskNameI18n[language] &&
+                taskNameI18n[language] !== ''
+              ) {
+                newParams[newkey] = taskNameI18n[language]
+              } else {
+                newParams[newkey] = taskName
+              }
+            }
+          }
+        }
+        operation = getI18n().t('workflowHistoryList.' + i18nKey, newParams)
+      }
+    } else {
+      operation = getI18n().t(
+        'workflowHistoryList.' + historyType.toLowerCase()
+      )
+    }
+  }
+  return operation
+}
+// 是否是正常按钮提交，例如：保存、提交、同意、不同意等
+function isCommonButtonOperation(historyType) {
+  return (
+    historyType === 'HISTORY_SUBMIT' ||
+    historyType === 'HISTORY_AGREE' ||
+    historyType === 'HISTORY_DISAGREE' ||
+    historyType === 'HISTORY_AGREEMENT' ||
+    historyType === 'HISTORY_OPPOSE' ||
+    historyType === 'HISTORY_KIKEN' ||
+    historyType === 'HISTORY_SIGNOFF' ||
+    historyType === 'HISTORY_SEND' ||
+    historyType === 'HISTORY_DISTRIBUTE' ||
+    historyType === 'HISTORY_READED'
+  )
+}

package/src/views/404.vue

@@ -0,0 +1,248 @@
+<template>
+  <div class="wscn-http404-container">
+    <div class="wscn-http404">
+      <div class="pic-404">
+        <img class="pic-404__parent" src="../../assets/404/404.png" alt="404" />
+        <img
+          class="pic-404__child left"
+          src="../../assets/404/404-cloud.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child mid"
+          src="../../assets/404/404-cloud.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child right"
+          src="../../assets/404/404-cloud.png"
+          alt="404"
+        />
+      </div>
+      <div class="bullshit">
+        <!-- <div class="bullshit__oops">
+                OOPS!
+              </div>
+              <div class="bullshit__info">
+                版权所有
+                <a class="link-type" href="https://wallstreetcn.com" target="_blank">
+                  华尔街见闻
+                </a>
+              </div> -->
+        <div class="bullshit__headline">
+          {{ message }}
+        </div>
+        <div class="bullshit__info">请检查您输入的网址是否正确</div>
+        <!-- <a href="" class="bullshit__return-home">
+                返回首页
+              </a> -->
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Page404',
+  computed: {
+    message() {
+      return '页面不存在'
+    },
+  },
+}
+</script>
+
+<style lang="scss" rel="stylesheet/scss" scoped>
+.wscn-http404-container {
+  transform: translate(-50%, -50%);
+  position: absolute;
+  top: 40%;
+  left: 50%;
+}
+.wscn-http404 {
+  position: relative;
+  width: 1200px;
+  padding: 0 50px;
+  overflow: hidden;
+  .pic-404 {
+    position: relative;
+    float: left;
+    width: 600px;
+    overflow: hidden;
+    &__parent {
+      width: 100%;
+    }
+    &__child {
+      position: absolute;
+      &.left {
+        width: 80px;
+        top: 17px;
+        left: 220px;
+        opacity: 0;
+        animation-name: cloudLeft;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      &.mid {
+        width: 46px;
+        top: 10px;
+        left: 420px;
+        opacity: 0;
+        animation-name: cloudMid;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1.2s;
+      }
+      &.right {
+        width: 62px;
+        top: 100px;
+        left: 500px;
+        opacity: 0;
+        animation-name: cloudRight;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      @keyframes cloudLeft {
+        0% {
+          top: 17px;
+          left: 220px;
+          opacity: 0;
+        }
+        20% {
+          top: 33px;
+          left: 188px;
+          opacity: 1;
+        }
+        80% {
+          top: 81px;
+          left: 92px;
+          opacity: 1;
+        }
+        100% {
+          top: 97px;
+          left: 60px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudMid {
+        0% {
+          top: 10px;
+          left: 420px;
+          opacity: 0;
+        }
+        20% {
+          top: 40px;
+          left: 360px;
+          opacity: 1;
+        }
+        70% {
+          top: 130px;
+          left: 180px;
+          opacity: 1;
+        }
+        100% {
+          top: 160px;
+          left: 120px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudRight {
+        0% {
+          top: 100px;
+          left: 500px;
+          opacity: 0;
+        }
+        20% {
+          top: 120px;
+          left: 460px;
+          opacity: 1;
+        }
+        80% {
+          top: 180px;
+          left: 340px;
+          opacity: 1;
+        }
+        100% {
+          top: 200px;
+          left: 300px;
+          opacity: 0;
+        }
+      }
+    }
+  }
+  .bullshit {
+    position: relative;
+    float: left;
+    width: 300px;
+    padding: 30px 0;
+    overflow: hidden;
+    &__oops {
+      font-size: 32px;
+      font-weight: bold;
+      line-height: 40px;
+      color: #1482f0;
+      opacity: 0;
+      margin-bottom: 20px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-fill-mode: forwards;
+    }
+    &__headline {
+      font-size: 20px;
+      line-height: 24px;
+      color: #222;
+      font-weight: bold;
+      opacity: 0;
+      margin-bottom: 10px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.1s;
+      animation-fill-mode: forwards;
+    }
+    &__info {
+      font-size: 13px;
+      line-height: 21px;
+      color: grey;
+      opacity: 0;
+      margin-bottom: 30px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.2s;
+      animation-fill-mode: forwards;
+    }
+    &__return-home {
+      display: block;
+      float: left;
+      width: 110px;
+      height: 36px;
+      background: #1482f0;
+      border-radius: 100px;
+      text-align: center;
+      color: #ffffff;
+      opacity: 0;
+      font-size: 14px;
+      line-height: 36px;
+      cursor: pointer;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.3s;
+      animation-fill-mode: forwards;
+    }
+    @keyframes slideUp {
+      0% {
+        transform: translateY(60px);
+        opacity: 0;
+      }
+      100% {
+        transform: translateY(0);
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>

package/src/views/dsc-component/Sidebar/Item.vue

@@ -0,0 +1,81 @@
+<script lang="jsx">
+import {defineComponent, h} from 'vue'
+import SvgIcon from '../../svg-icon/src/svg-icon'
+
+export default defineComponent ({
+	name: 'MenuItem',
+	functional: true,
+	props: {
+		icon: {
+			type: String,
+			default: ''
+		},
+		title: {
+			type: String,
+			default: ''
+		},
+		hasChildren: {
+			type: Boolean,
+			default: false
+		},
+		isRoot: {
+			type: Boolean,
+			default: false
+		}
+	},
+	render(props) {
+		const { title, hasChildren, isRoot } = props
+		let icon = props.icon
+		const vnodes = []
+		if (icon) {
+			if (icon.indexOf('fa-') === 0) {
+				// 表示以“fa-”开头，使用font-awesome中的图标
+				icon = 'fa ' + icon
+				vnodes.push(h('div', {style: {display: 'flex'}}, [h('i', {class: icon, style: {marginRight: '16px'}})]))
+				// vnodes.push(<div style='display: inline-block;overflow:hidden;'><i class={icon}/></div>)
+			} else if (icon.indexOf('svg-') === 0) {
+				icon = icon.substring(icon.indexOf('svg-') + 4)
+				vnodes.push(h('div', {style: {display: 'flex'}}, [h(SvgIcon, {'icon-class': icon})]))
+				// vnodes.push(<div style='display: inline-block;overflow:hidden;'><svg-icon icon-class={icon}/></div>)
+			} else {
+				icon += ' svg-icon'
+				vnodes.push(h('div', {style: {display: 'flex'}}, [h('i', {class: icon, style: {marginRight: '16px'}})]))
+				// vnodes.push(<div style='display: inline-block;overflow:hidden;'><i class={icon} /></div>)
+			}
+		}
+		if (title) {
+			let width = '130px'
+			if (hasChildren) {
+			// 当是父菜单时，为了使后面的三角能显示出来，需要将宽度设小点
+			// width = '100px'
+			// boe 反应左侧菜单栏无法展示全部文字，调整
+			width = '130px'
+			}
+			if (isRoot) {
+				// 是否是根目录，没有子菜单时
+				vnodes.push(h('div', {style:{display:'inline-block'}},
+						[h('div',{
+							title:title,
+							style:{display:'inline-block',width:width,overflow:'hidden','text-overflow':'ellipsis','white-space':'nowrap','word-break':'keep-all'}
+						}, title)])
+				)
+				// vnodes.push(<div style='display: inline-block'>
+				//   <div title={title} style={'display: inline-block;width:' + width + ';overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;'}>{(title)}</div>
+				// </div>)
+			} else {
+				// 有子菜单时
+				vnodes.push(h('div', {style:{display:'inline-block'}},
+						[h('div',{
+							title:title,
+							style:{display:'inline-block',width:width,overflow:'hidden','text-overflow':'ellipsis','white-space':'nowrap','word-break':'keep-all'}
+						}, title)])
+				)
+				// vnodes.push(<div slot='title' style='display: inline-block'>
+				//   <div title={title} style={'display: inline-block;width:' + width + ';overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:keep-all;'}>{(title)}</div>
+				// </div>)
+			}
+		}
+		return vnodes
+	}
+})
+</script>

package/src/views/dsc-component/Sidebar/Link.vue

@@ -0,0 +1,38 @@
+<template>
+  <div>
+    <!-- eslint-disable vue/require-component-is-->
+    <!-- <a v-if="isExter" :href="to.path" target="_blank" rel="noopener">
+          <slot />
+        </a> -->
+
+    <router-link v-if="!isOpenNewTab" :to="to">
+      <slot />
+    </router-link>
+    <div v-else>
+      <slot />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    to: {
+      type: Object,
+      required: true,
+    },
+  },
+  data() {
+    const isExter = this.to.isExternal
+    const openWay = this.to.openWay
+    let isOpenNewTab = false
+    if (openWay && openWay === 'NEW_PAGE_OPEN') {
+      isOpenNewTab = true
+    }
+    return {
+      isExter,
+      isOpenNewTab,
+    }
+  },
+}
+</script>