887f0939 by xiaomiao

--no commit message

2 parents 9e68d2ca 6480e08e
/*
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-05-17 10:24:24
* @LastEditTime: 2023-07-25 14:46:16
*/
import request from '@/utils/request'
let SERVER = window.config ? window.config : JSON.parse(localStorage.getItem('ApiUrl'))
......@@ -69,6 +69,18 @@ export function leftMenu (data) {
data
})
}
/**
* @description: 进度查询获取左侧列表
* @param {*} data
* @author: renchao
*/
export function jdcxLeftMenu (data) {
return request({
url: SERVER.SERVERAPI + '/rest/business/workFlow/jdcxLeftMenu',
method: 'post',
data
})
}
/**
* @description: 获取下一环节信息
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-20 10:22:20
* @LastEditTime: 2023-07-25 16:06:03
-->
<template>
<label class="el-checkbox" :class="[
......@@ -46,9 +46,7 @@
default: ''
}
},
componentName: 'ElCheckbox',
data () {
return {
selfModel: false,
......@@ -56,7 +54,6 @@
isLimitExceeded: false
};
},
computed: {
model: {
/**
......@@ -129,7 +126,6 @@
store () {
return this._checkboxGroup ? this._checkboxGroup.value : this.value;
},
/**
* @description: isLimitDisabled
* @author: renchao
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:10:17
-->
<template>
<transition name="el-loading-fade" @after-leave="handleAfterLeave">
<div v-show="visible" class="el-loading-mask" :style="{ backgroundColor: background || '' }"
......@@ -9,37 +14,35 @@
</div>
</transition>
</template>
<script>
export default {
data () {
return {
text: null,
spinner: null,
background: null,
fullscreen: true,
visible: false,
customClass: ''
};
},
methods: {
handleAfterLeave () {
this.$emit('after-leave');
export default {
data () {
return {
text: null,
spinner: null,
background: null,
fullscreen: true,
visible: false,
customClass: ''
};
},
setText (text) {
this.text = text;
methods: {
handleAfterLeave () {
this.$emit('after-leave');
},
setText (text) {
this.text = text;
}
}
}
};
};
</script>
<style scoped lang="scss">
.el-loading-spinner {
margin-top: -100px !important;
.el-loading-spinner {
margin-top: -100px !important;
.img {
width: 80px;
height: 80px;
.img {
width: 80px;
height: 80px;
}
}
}
</style>
\ No newline at end of file
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:10:08
-->
<template>
<transition name="fade">
<!--主要内容-->
......@@ -18,163 +23,163 @@
</transition>
</template>
<script>
export default {
props: {
noticeList: {
type: Array,
default: []
}
},
data () {
return {
speed: 50, // 速度(单位px/s)
backWidth: '', // 父级宽度
backHeight: '', // 父级高度
wordLength: '', // 文本长度
state: 1,
firstAnimationTime: '', // 状态一动画效果
secondAnimationTime: '', // 状态二动画效果
};
},
watch: {
noticeList: {
handler (newName, oldName) {
let that = this
this.Listener();
setTimeout(res => {
that.getData();
}, 100);
},
deep: true
}
},
methods: {
/**
* @description: handleNotice
* @param {*} item
* @author: renchao
*/
handleNotice (item) {
this.$alertMes(item.noticeTitle, item.noticeContent)
},
/**
* @description: 获取数据
* @author: renchao
*/
getData () {
let style = document.styleSheets[0];
let text = this.$refs.text;
let back = this.$refs.back;
this.backWidth = back.offsetWidth;
this.backHeight = back.offsetHeight;
text.style.lineHeight = this.backHeight + 'px';
this.wordLength = text.offsetWidth;
this.ComputationTime(); // 计算时间
style.insertRule(
`@keyframes firstAnimation {0% {left:0px;}100% {left:-${this.wordLength}px;}}`
);
style.insertRule(
`@keyframes secondAnimation {0% {left:${this.backWidth}px;}100% {left:-${this.wordLength}px;}}`
);
setTimeout(res => {
this.changeState();
}, 300);
export default {
props: {
noticeList: {
type: Array,
default: []
}
},
/**
* @description: 用速度计算时间(想要保持速度一样,2种状态时间不同需算出)
* @author: renchao
*/
ComputationTime () {
this.firstAnimationTime = this.wordLength / this.speed;
this.secondAnimationTime =
(this.wordLength + this.backWidth) / this.speed;
data () {
return {
speed: 50, // 速度(单位px/s)
backWidth: '', // 父级宽度
backHeight: '', // 父级高度
wordLength: '', // 文本长度
state: 1,
firstAnimationTime: '', // 状态一动画效果
secondAnimationTime: '', // 状态二动画效果
};
},
/**
* @description: 根据状态切换动画
* @author: renchao
*/
changeState () {
let text = this.$refs.text;
if (this.state == 1) {
text.style.animation = `firstAnimation ${this.firstAnimationTime}s linear`;
this.state = 2;
} else {
text.style.animation = `secondAnimation ${this.secondAnimationTime}s linear infinite`;
watch: {
noticeList: {
handler (newName, oldName) {
let that = this
this.Listener();
setTimeout(res => {
that.getData();
}, 100);
},
deep: true
}
},
/**
* @description: Listener
* @author: renchao
*/
Listener () {
let text = this.$refs.text;
text.addEventListener(
'animationend',
res => {
methods: {
/**
* @description: handleNotice
* @param {*} item
* @author: renchao
*/
handleNotice (item) {
this.$alertMes(item.noticeTitle, item.noticeContent)
},
/**
* @description: 获取数据
* @author: renchao
*/
getData () {
let style = document.styleSheets[0];
let text = this.$refs.text;
let back = this.$refs.back;
this.backWidth = back.offsetWidth;
this.backHeight = back.offsetHeight;
text.style.lineHeight = this.backHeight + 'px';
this.wordLength = text.offsetWidth;
this.ComputationTime(); // 计算时间
style.insertRule(
`@keyframes firstAnimation {0% {left:0px;}100% {left:-${this.wordLength}px;}}`
);
style.insertRule(
`@keyframes secondAnimation {0% {left:${this.backWidth}px;}100% {left:-${this.wordLength}px;}}`
);
setTimeout(res => {
this.changeState();
},
false
)
},
/**
* @description: mouseOver
* @author: renchao
*/
mouseOver () {
let text = this.$refs.text;
text.style.animationPlayState = 'paused'
},
/**
* @description: mouseLeave
* @author: renchao
*/
mouseLeave () {
let text = this.$refs.text;
text.style.animationPlayState = ''
}, 300);
},
/**
* @description: 用速度计算时间(想要保持速度一样,2种状态时间不同需算出)
* @author: renchao
*/
ComputationTime () {
this.firstAnimationTime = this.wordLength / this.speed;
this.secondAnimationTime =
(this.wordLength + this.backWidth) / this.speed;
},
/**
* @description: 根据状态切换动画
* @author: renchao
*/
changeState () {
let text = this.$refs.text;
if (this.state == 1) {
text.style.animation = `firstAnimation ${this.firstAnimationTime}s linear`;
this.state = 2;
} else {
text.style.animation = `secondAnimation ${this.secondAnimationTime}s linear infinite`;
}
},
/**
* @description: Listener
* @author: renchao
*/
Listener () {
let text = this.$refs.text;
text.addEventListener(
'animationend',
res => {
this.changeState();
},
false
)
},
/**
* @description: mouseOver
* @author: renchao
*/
mouseOver () {
let text = this.$refs.text;
text.style.animationPlayState = 'paused'
},
/**
* @description: mouseLeave
* @author: renchao
*/
mouseLeave () {
let text = this.$refs.text;
text.style.animationPlayState = ''
}
}
}
};
};
</script>
<style lang="scss" scoped>
.noticebar {
display: flex;
align-items: center;
width: 100%;
height: 28px;
background: rgba(0, 0, 0, 0.1);
.noticebar {
display: flex;
align-items: center;
width: 100%;
height: 28px;
background: rgba(0, 0, 0, 0.1);
.icon {
img {
height: 100%;
width: 100%;
.icon {
img {
height: 100%;
width: 100%;
}
}
}
.back {
overflow: hidden;
white-space: nowrap;
margin: 0 auto;
height: 100%;
width: 100%;
cursor: pointer;
position: relative;
font-size: 14px;
color: #fff;
.text {
position: absolute;
display: inline-block;
padding: 2px 0;
display: flex;
.back {
overflow: hidden;
white-space: nowrap;
margin: 0 auto;
height: 100%;
width: 100%;
cursor: pointer;
position: relative;
font-size: 14px;
color: #fff;
p {
margin-right: 80px;
.text {
position: absolute;
display: inline-block;
padding: 2px 0;
display: flex;
align-items: center;
height: 28px;
line-height: 28px;
p {
margin-right: 80px;
display: flex;
align-items: center;
height: 28px;
line-height: 28px;
}
}
}
}
}
</style>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:09:59
-->
<template>
<div style="width: 100%;height: 100%">
<vue-photo-zoom-pro :width="bigWidth" :url="url" :type="type" :scale="scale" :out-show="showType"
......@@ -5,7 +10,6 @@
</vue-photo-zoom-pro>
</div>
</template>
<script>
import vuePhotoZoomPro from '@/components/PhotoZoom/vue-photo-zoom-pro'
export default {
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:06:21
-->
<template>
<transition name="msgbox-fade" v-if="myShow">
<div class="ls-mask" v-loading="loading">
......@@ -21,181 +26,179 @@
</transition>
</template>
<script>
export default {
name: 'index',
data () {
return {
title: '标题',
editItem: "",
formData: undefined,//父组件传递的参数 负责传给子组件
btnShow: false,
cancel: function () { },
confirm: function () { },
cancelText: '取消',
confirmText: '确认',
isSync: false,
isShow: false,
myShow: false,
titleStyle: 'center',
width: "75%",
height: "auto",
contentHeight: "",
iconClass: "",
key: 0
}
},
props: {
loading: { type: Boolean, default: false },
},
watch: {
isShow (newValue) {
this.editItem = this.loadViewFn(this.editItem)
document.body.appendChild(this.$el);
this.myShow = newValue
}
},
mounted () {
/**
* @description: 计算滚动条高度
* @author: renchao
*/
setTimeout(() => {
if (this.btnShow) {
if (this.height == 'auto') {
this.contentHeight = (this.$refs.contentRef.offsetHeight) + 'px'
} else {
this.contentHeight = this.height
}
} else {
if (this.height == 'auto') {
this.contentHeight = (this.$refs.contentRef.offsetHeight) + 'px'
export default {
name: 'index',
data () {
return {
title: '标题',
editItem: "",
formData: undefined,//父组件传递的参数 负责传给子组件
btnShow: false,
cancel: function () { },
confirm: function () { },
cancelText: '取消',
confirmText: '确认',
isSync: false,
isShow: false,
myShow: false,
titleStyle: 'center',
width: "75%",
height: "auto",
contentHeight: "",
iconClass: "",
key: 0
}
},
props: {
loading: { type: Boolean, default: false },
},
watch: {
isShow (newValue) {
this.editItem = this.loadViewFn(this.editItem)
document.body.appendChild(this.$el);
this.myShow = newValue
}
},
mounted () {
/**
* @description: 计算滚动条高度
* @author: renchao
*/
setTimeout(() => {
if (this.btnShow) {
if (this.height == 'auto') {
this.contentHeight = (this.$refs.contentRef.offsetHeight) + 'px'
} else {
this.contentHeight = this.height
}
} else {
this.contentHeight = this.height
if (this.height == 'auto') {
this.contentHeight = (this.$refs.contentRef.offsetHeight) + 'px'
} else {
this.contentHeight = this.height
}
}
}
}, 300)
},
methods: {
/**
* @description: onCancel
* @author: renchao
*/
onCancel () {
this.isShow = false
this.cancel()
}, 300)
},
/**
* @description: onConfirm
* @author: renchao
*/
onConfirm () {
this.loading = true
let res = new Promise((resolve, reject) => {
this.confirm()
resolve(true)
})
if (res) {
methods: {
/**
* @description: onCancel
* @author: renchao
*/
onCancel () {
this.isShow = false
this.cancel()
},
/**
* @description: onConfirm
* @author: renchao
*/
onConfirm () {
this.loading = true
let res = new Promise((resolve, reject) => {
this.confirm()
resolve(true)
})
if (res) {
this.isShow = false
}
},
/**
* @description: loadingFn
* @param {*} e
* @author: renchao
*/
loadingFn (e) { //加载状态
this.loading = e
},
/**
* @description: loadViewFn
* @param {*} view
* @author: renchao
*/
loadViewFn (view) {
return (r) =>
require.ensure([], () =>
r(require(`@/views/${view}.vue`))
)
}
},
/**
* @description: loadingFn
* @param {*} e
* @author: renchao
*/
loadingFn (e) { //加载状态
this.loading = e
},
/**
* @description: loadViewFn
* @param {*} view
* @author: renchao
*/
loadViewFn (view) {
return (r) =>
require.ensure([], () =>
r(require(`@/views/${view}.vue`))
)
}
},
destroyed () {
if (this.appendToBody && this.$el && this.$el.parentNode) {
this.$el.parentNode.removeChild(this.$el);
destroyed () {
if (this.appendToBody && this.$el && this.$el.parentNode) {
this.$el.parentNode.removeChild(this.$el);
}
}
}
}
</script>
<style scoped lang="scss" >
.ls-mask {
width: 100%;
height: 100%;
z-index: 2000;
position: fixed;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.3);
}
.ls-mask-window {
background: white;
position: relative;
left: 50%;
top: 50%;
min-height: 200px;
transform: translate(-50%, -50%);
border-radius: 5px;
overflow: hidden;
}
.ls-mask {
width: 100%;
height: 100%;
z-index: 2000;
position: fixed;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.3);
}
.ls-mask-window b {
padding-left: 5px;
}
.ls-mask-window {
background: white;
position: relative;
left: 50%;
top: 50%;
min-height: 200px;
transform: translate(-50%, -50%);
border-radius: 5px;
overflow: hidden;
}
.ls-title {
padding: 16px;
color: #ffffff;
font-size: 16px;
background: linear-gradient(3deg, #409EFF, #a7cbee);
}
.ls-mask-window b {
padding-left: 5px;
}
.ls-title .svg-icon {
font-size: 18px;
}
.ls-title {
padding: 16px;
color: #ffffff;
font-size: 16px;
background: linear-gradient(3deg, #409eff, #a7cbee);
}
.mask-content {
padding: 20px;
width: 100%;
min-height: 30%;
max-height: 90vh;
overflow-y: scroll;
}
.ls-title .svg-icon {
font-size: 18px;
}
.ls-mask-footer {
height: 50px;
display: flex;
justify-content: center;
width: 100%;
position: absolute;
border-top: 1px solid $borderColor;
bottom: 0;
background: #ffffff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
overflow: hidden;
}
.mask-content {
padding: 20px;
width: 100%;
min-height: 30%;
max-height: 90vh;
overflow-y: scroll;
}
.ls-mask-footer {
height: 50px;
display: flex;
justify-content: center;
width: 100%;
position: absolute;
border-top: 1px solid $borderColor;
bottom: 0;
background: #ffffff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
overflow: hidden;
}
/deep/.closeStyle {
position: absolute;
top: 13px;
right: 26px;
font-size: 24px;
cursor: pointer;
color: #409EFF;
}
/deep/.closeStyle {
position: absolute;
top: 13px;
right: 26px;
font-size: 24px;
cursor: pointer;
color: #409eff;
}
/deep/.el-loading-mask {
background: none;
}
/deep/.el-loading-mask {
background: none;
}
</style>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:08:30
-->
<template>
<transition name="msgbox-fade">
<div class="ls-mask" v-if="myShow">
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:08:55
-->
<!--显示svg文件图标-->
<template>
<div v-if="isExternal" :style="styleExternalIcon" class="svg-external-icon svg-icon" v-on="$listeners" />
......@@ -5,59 +10,58 @@
<use :xlink:href="iconName" />
</svg>
</template>
<script>
// doc: https://panjiachen.github.io/vue-element-admin-site/feature/component/svg-icon.html#usage
import { isExternal } from '@/utils/validate'
// doc: https://panjiachen.github.io/vue-element-admin-site/feature/component/svg-icon.html#usage
import { isExternal } from '@/utils/validate'
export default {
name: 'SvgIcon',
props: {
iconClass: {
type: String,
required: true
},
className: {
type: String,
default: ''
}
},
computed: {
isExternal() {
return isExternal(this.iconClass)
},
iconName() {
return `#icon-${this.iconClass}`
},
svgClass() {
if (this.className) {
return 'svg-icon ' + this.className
} else {
return 'svg-icon'
export default {
name: 'SvgIcon',
props: {
iconClass: {
type: String,
required: true
},
className: {
type: String,
default: ''
}
},
styleExternalIcon() {
return {
mask: `url(${this.iconClass}) no-repeat 50% 50%`,
'-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%`
computed: {
isExternal () {
return isExternal(this.iconClass)
},
iconName () {
return `#icon-${this.iconClass}`
},
svgClass () {
if (this.className) {
return 'svg-icon ' + this.className
} else {
return 'svg-icon'
}
},
styleExternalIcon () {
return {
mask: `url(${this.iconClass}) no-repeat 50% 50%`,
'-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%`
}
}
}
}
}
</script>
<style scoped>
.svg-icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
.svg-icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
.svg-external-icon {
background-color: currentColor;
mask-size: cover!important;
display: inline-block;
}
.svg-external-icon {
background-color: currentColor;
mask-size: cover !important;
display: inline-block;
}
</style>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:09:09
-->
<template>
<el-color-picker v-model="theme"
:predefine="['#409EFF', '#1890ff', '#304156', '#212121', '#11a983', '#13c2c2', '#6959CD', '#f5222d',]"
......@@ -5,137 +10,154 @@
</template>
<script>
const version = require('element-ui/package.json').version // element-ui version from node_modules
const ORIGINAL_THEME = '#409EFF' // default color
export default {
data () {
return {
chalk: '', // content of theme-chalk css
theme: ''
}
},
computed: {
defaultTheme () {
return this.$store.state.app.theme
}
},
watch: {
defaultTheme: {
handler: function (val, oldVal) {
this.theme = val
},
immediate: true
const version = require('element-ui/package.json').version // element-ui version from node_modules
const ORIGINAL_THEME = '#409EFF' // default color
export default {
data () {
return {
chalk: '', // content of theme-chalk css
theme: ''
}
},
async theme (val) {
const oldVal = this.chalk ? this.theme : ORIGINAL_THEME
if (typeof val !== 'string') return
const themeCluster = this.getThemeCluster(val.replace('#', ''))
const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
console.log(themeCluster, originalCluster)
const $message = this.$message({
message: ' Compiling the theme',
customClass: 'theme-message',
type: 'success',
duration: 0,
iconClass: 'el-icon-loading'
})
const getHandler = (variable, id) => {
return () => {
const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''))
const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster)
let styleTag = document.getElementById(id)
if (!styleTag) {
styleTag = document.createElement('style')
styleTag.setAttribute('id', id)
document.head.appendChild(styleTag)
computed: {
defaultTheme () {
return this.$store.state.app.theme
}
},
watch: {
defaultTheme: {
handler: function (val, oldVal) {
this.theme = val
},
immediate: true
},
async theme (val) {
const oldVal = this.chalk ? this.theme : ORIGINAL_THEME
if (typeof val !== 'string') return
const themeCluster = this.getThemeCluster(val.replace('#', ''))
const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
console.log(themeCluster, originalCluster)
const $message = this.$message({
message: ' Compiling the theme',
customClass: 'theme-message',
type: 'success',
duration: 0,
iconClass: 'el-icon-loading'
})
const getHandler = (variable, id) => {
return () => {
const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''))
const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster)
let styleTag = document.getElementById(id)
if (!styleTag) {
styleTag = document.createElement('style')
styleTag.setAttribute('id', id)
document.head.appendChild(styleTag)
}
styleTag.innerText = newStyle
}
styleTag.innerText = newStyle
}
}
if (!this.chalk) {
const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css`
await this.getCSSString(url, 'chalk')
}
if (!this.chalk) {
const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css`
await this.getCSSString(url, 'chalk')
}
const chalkHandler = getHandler('chalk', 'chalk-style')
const chalkHandler = getHandler('chalk', 'chalk-style')
chalkHandler()
chalkHandler()
const styles = [].slice.call(document.querySelectorAll('style'))
.filter(style => {
const text = style.innerText
return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text)
const styles = [].slice.call(document.querySelectorAll('style'))
.filter(style => {
const text = style.innerText
return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text)
})
styles.forEach(style => {
const { innerText } = style
if (typeof innerText !== 'string') return
style.innerText = this.updateStyle(innerText, originalCluster, themeCluster)
})
styles.forEach(style => {
const { innerText } = style
if (typeof innerText !== 'string') return
style.innerText = this.updateStyle(innerText, originalCluster, themeCluster)
})
this.$emit('change', val)
this.$emit('change', val)
$message.close()
}
},
methods: {
/**
* @description: updateStyle
* @param {*} style
* @param {*} oldCluster
* @param {*} newCluster
* @author: renchao
*/
updateStyle (style, oldCluster, newCluster) {
let newStyle = style
oldCluster.forEach((color, index) => {
newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index])
})
return newStyle
$message.close()
}
},
/**
* @description: getCSSString
* @param {*} url
* @param {*} variable
* @author: renchao
*/
getCSSString (url, variable) {
return new Promise(resolve => {
const xhr = new XMLHttpRequest()
xhr.onreadystatechange = () => {
if (xhr.readyState === 4 && xhr.status === 200) {
this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '')
resolve()
methods: {
/**
* @description: updateStyle
* @param {*} style
* @param {*} oldCluster
* @param {*} newCluster
* @author: renchao
*/
updateStyle (style, oldCluster, newCluster) {
let newStyle = style
oldCluster.forEach((color, index) => {
newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index])
})
return newStyle
},
/**
* @description: getCSSString
* @param {*} url
* @param {*} variable
* @author: renchao
*/
getCSSString (url, variable) {
return new Promise(resolve => {
const xhr = new XMLHttpRequest()
xhr.onreadystatechange = () => {
if (xhr.readyState === 4 && xhr.status === 200) {
this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '')
resolve()
}
}
xhr.open('GET', url)
xhr.send()
})
},
/**
* @description: getThemeCluster
* @param {*} theme
* @author: renchao
*/
getThemeCluster (theme) {
const tintColor = (color, tint) => {
let red = parseInt(color.slice(0, 2), 16)
let green = parseInt(color.slice(2, 4), 16)
let blue = parseInt(color.slice(4, 6), 16)
if (tint === 0) { // when primary color is in its rgb space
return [red, green, blue].join(',')
} else {
red += Math.round(tint * (255 - red))
green += Math.round(tint * (255 - green))
blue += Math.round(tint * (255 - blue))
red = red.toString(16)
green = green.toString(16)
blue = blue.toString(16)
return `#${red}${green}${blue}`
}
}
xhr.open('GET', url)
xhr.send()
})
},
/**
* @description: getThemeCluster
* @param {*} theme
* @author: renchao
*/
getThemeCluster (theme) {
const tintColor = (color, tint) => {
let red = parseInt(color.slice(0, 2), 16)
let green = parseInt(color.slice(2, 4), 16)
let blue = parseInt(color.slice(4, 6), 16)
if (tint === 0) { // when primary color is in its rgb space
return [red, green, blue].join(',')
} else {
red += Math.round(tint * (255 - red))
green += Math.round(tint * (255 - green))
blue += Math.round(tint * (255 - blue))
const shadeColor = (color, shade) => {
let red = parseInt(color.slice(0, 2), 16)
let green = parseInt(color.slice(2, 4), 16)
let blue = parseInt(color.slice(4, 6), 16)
red = Math.round((1 - shade) * red)
green = Math.round((1 - shade) * green)
blue = Math.round((1 - shade) * blue)
red = red.toString(16)
green = green.toString(16)
......@@ -143,48 +165,31 @@ export default {
return `#${red}${green}${blue}`
}
}
const shadeColor = (color, shade) => {
let red = parseInt(color.slice(0, 2), 16)
let green = parseInt(color.slice(2, 4), 16)
let blue = parseInt(color.slice(4, 6), 16)
red = Math.round((1 - shade) * red)
green = Math.round((1 - shade) * green)
blue = Math.round((1 - shade) * blue)
red = red.toString(16)
green = green.toString(16)
blue = blue.toString(16)
return `#${red}${green}${blue}`
}
const clusters = [theme]
for (let i = 0; i <= 9; i++) {
clusters.push(tintColor(theme, Number((i / 10).toFixed(2))))
const clusters = [theme]
for (let i = 0; i <= 9; i++) {
clusters.push(tintColor(theme, Number((i / 10).toFixed(2))))
}
clusters.push(shadeColor(theme, 0.1))
return clusters
}
clusters.push(shadeColor(theme, 0.1))
return clusters
}
}
}
</script>
<style>
.theme-message,
.theme-picker-dropdown {
z-index: 99999 !important;
}
.theme-picker .el-color-picker__trigger {
height: 26px !important;
width: 26px !important;
padding: 2px;
}
.theme-picker-dropdown .el-color-dropdown__link-btn {
display: none;
}
.theme-message,
.theme-picker-dropdown {
z-index: 99999 !important;
}
.theme-picker .el-color-picker__trigger {
height: 26px !important;
width: 26px !important;
padding: 2px;
}
.theme-picker-dropdown .el-color-dropdown__link-btn {
display: none;
}
</style>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:08:48
-->
<template>
<el-image-viewer :on-close="closeViewer" :url-list="urlList">
</el-image-viewer>
</template>
<script>
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
export default {
components: {
ElImageViewer,
},
props: {
urlList: {
type: Array,
default: function () {
return []
}
}
},
data () {
return {
wrapperElem: null
}
},
mounted () {
this.$nextTick(() => {
let wrapper = document.getElementsByClassName(
'el-image-viewer__actions__inner'
)
let downImg = document.createElement('i')
downImg.setAttribute('class', 'el-icon-download')
wrapper[0].appendChild(downImg)
if (wrapper.length > 0) {
this.wrapperElem = wrapper[0]
this.wrapperElem.addEventListener('click', this.hideCusBtn)
import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
export default {
components: {
ElImageViewer,
},
props: {
urlList: {
type: Array,
default: function () {
return []
}
}
})
},
methods: {
/**
* @description: closeViewer
* @author: renchao
*/
closeViewer () {
this.$emit('close-viewer')
},
/**
* @description: hideCusBtn
* @param {*} e
* @author: renchao
*/
hideCusBtn (e) {
let className = e.target.className
if (className === 'el-icon-download') {
let imgUrl = document.getElementsByClassName(
'el-image-viewer__canvas'
)[0].children[0].src
this.downloadImage(imgUrl)
data () {
return {
wrapperElem: null
}
},
/**
* @description: downloadImage
* @param {*} imgUrl
* @author: renchao
*/
downloadImage (imgUrl) {
let tmpArr = imgUrl.split('/')
let fileName = tmpArr[tmpArr.length - 1]
window.URL = window.URL || window.webkitURL
let xhr = new XMLHttpRequest()
xhr.open('get', imgUrl, true)
xhr.responseType = 'blob'
xhr.onload = function () {
if (this.status == 200) {
//得到一个blob对象
let blob = this.response
let fileUrl = window.URL.createObjectURL(blob)
let a = document.createElement('a')
; (document.body || document.documentElement).appendChild(a)
a.href = fileUrl
if ('download' in a) {
a.download = fileName
} else {
a.setAttribute('download', fileName)
mounted () {
this.$nextTick(() => {
let wrapper = document.getElementsByClassName(
'el-image-viewer__actions__inner'
)
let downImg = document.createElement('i')
downImg.setAttribute('class', 'el-icon-download')
wrapper[0].appendChild(downImg)
if (wrapper.length > 0) {
this.wrapperElem = wrapper[0]
this.wrapperElem.addEventListener('click', this.hideCusBtn)
}
})
},
methods: {
/**
* @description: closeViewer
* @author: renchao
*/
closeViewer () {
this.$emit('close-viewer')
},
/**
* @description: hideCusBtn
* @param {*} e
* @author: renchao
*/
hideCusBtn (e) {
let className = e.target.className
if (className === 'el-icon-download') {
let imgUrl = document.getElementsByClassName(
'el-image-viewer__canvas'
)[0].children[0].src
this.downloadImage(imgUrl)
}
},
/**
* @description: downloadImage
* @param {*} imgUrl
* @author: renchao
*/
downloadImage (imgUrl) {
let tmpArr = imgUrl.split('/')
let fileName = tmpArr[tmpArr.length - 1]
window.URL = window.URL || window.webkitURL
let xhr = new XMLHttpRequest()
xhr.open('get', imgUrl, true)
xhr.responseType = 'blob'
xhr.onload = function () {
if (this.status == 200) {
//得到一个blob对象
let blob = this.response
let fileUrl = window.URL.createObjectURL(blob)
let a = document.createElement('a')
; (document.body || document.documentElement).appendChild(a)
a.href = fileUrl
if ('download' in a) {
a.download = fileName
} else {
a.setAttribute('download', fileName)
}
a.target = '_self'
a.click()
a.remove()
}
a.target = '_self'
a.click()
a.remove()
}
}
xhr.send()
xhr.send()
},
},
},
}
}
</script>
<style lang="scss" scoped>
/deep/ .el-image-viewer__close {
color: #ffffff;
}
/deep/ .el-image-viewer__close {
color: #ffffff;
}
</style>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:09:44
-->
<template>
<transition name="msgbox-fade">
<div class="ls-mask" v-if="myShow">
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-25 16:10:52
-->
<template>
<div class="app-wrapper">
<navbar />
......@@ -11,59 +16,59 @@
</div>
</template>
<script>
import { AppMain, Navbar, Sidebar, TagsView } from './components'
import ResizeMixin from './mixin/ResizeHandler'
import { mapState } from 'vuex'
export default {
name: 'Layout',
components: {
AppMain,
Navbar,
Sidebar,
TagsView
},
mixins: [ResizeMixin],
computed: {
...mapState({
sidebar: state => state.app.sidebar,
needTagsView: state => state.settings.tagsView,
fixedHeader: state => state.settings.fixedHeader
})
import { AppMain, Navbar, Sidebar, TagsView } from './components'
import ResizeMixin from './mixin/ResizeHandler'
import { mapState } from 'vuex'
export default {
name: 'Layout',
components: {
AppMain,
Navbar,
Sidebar,
TagsView
},
mixins: [ResizeMixin],
computed: {
...mapState({
sidebar: state => state.app.sidebar,
needTagsView: state => state.settings.tagsView,
fixedHeader: state => state.settings.fixedHeader
})
}
}
}
</script>
<style lang="scss" scoped>
@import "~@/styles/mixin.scss";
@import "~@/styles/mixin.scss";
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
.app-wrapper {
@include clearfix;
position: relative;
height: 100%;
width: 100%;
&.mobile.openSidebar {
position: fixed;
top: 0;
&.mobile.openSidebar {
position: fixed;
top: 0;
}
}
}
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.drawer-bg {
background: #000;
opacity: 0.3;
width: 100%;
top: 0;
height: 100%;
position: absolute;
z-index: 999;
}
.fixed-header {
width: 100%;
transition: width 0.28s;
}
.fixed-header {
width: 100%;
transition: width 0.28s;
}
.el-dropdown-menu--small {
padding: 0;
width: 5px;
}
.el-dropdown-menu--small {
padding: 0;
width: 5px;
}
</style>
......
......@@ -117,9 +117,9 @@
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
message: "已取消删除"
})
})
}
}
}
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 14:12:17
* @LastEditTime: 2023-07-25 09:27:43
-->
<template>
<div class="from-clues">
......@@ -122,10 +122,10 @@
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
},
})
})
}
}
};
</script>
<style scoped lang="scss">
......
......@@ -76,7 +76,6 @@
* @author: renchao
*/
handleSubmit () {
debugger
this.$refs['ruleForm'].validate((valid) => {
if (valid) {
this.$parent.addSave(this.ruleForm);
......
<!--
* @Description: 页面提供插件下载
* @Autor: renchao
* @LastEditTime: 2023-06-13 15:49:55
* @LastEditTime: 2023-07-25 09:25:56
-->
<template>
<div class='downLoad'>
......@@ -21,6 +21,10 @@
}
},
methods: {
/**
* @description:
* @author: renchao
*/
handleDown () {
let a = document.createElement('a')
a.style.display = 'none'
......
<!--
* @Description: 流程图
* @Autor: renchao
* @LastEditTime: 2023-07-19 16:04:34
* @LastEditTime: 2023-07-25 09:26:01
-->
<template>
<div class='flowChart'>
......@@ -9,7 +9,6 @@
</div>
</template>
<script>
export default {
props: {
formData: {
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 10:15:01
* @LastEditTime: 2023-07-25 09:26:10
-->
<template>
<div class="from-clues">
......@@ -79,6 +79,10 @@
}
})
},
/**
* @description:
* @author: renchao
*/
zslqClick () {
this.$popupDialog("不动产权证领取", "workflow/components/dialog/zslq", {}, '80%', true)
}
......
<!--
* @Description: workFrame左侧菜单列表-普通
* @Autor: renchao
* @LastEditTime: 2023-07-21 10:15:11
* @LastEditTime: 2023-07-25 14:55:49
-->
<template>
<div class="leftmenu" :class="{ 'animation-map-drawer': isShowdrawer }">
......@@ -40,7 +40,7 @@
</template>
<script>
import { mapGetters } from 'vuex'
import { leftMenu, deleteSlbdcdy } from "@/api/workFlow.js"
import { leftMenu, deleteSlbdcdy, jdcxLeftMenu } from "@/api/workFlow.js"
export default {
data () {
return {
......@@ -85,26 +85,47 @@
loadBdcdylist () {
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
if (this.$route.query.bestepid) {
formdata.append("bestepid", this.bestepid);
}
if (this.$route.query.bsmBusiness) {
formdata.append("bsmBusiness", this.$route.query.bsmBusiness);
}
leftMenu(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.unitData = res.result;
window.unitData = res.result;
this.currentSelectProps = res.result[0];
this.$emit('getCurrentSelectProps', this.currentSelectProps);
this.judgeBatchShow();
if (this.showBatch) {
//满足批量查封/批量抵押按钮出现 即先展示批量表单
this.batchUnitClick();
} else {
//默认选择单元列表第一个
this.unitClick(0);
if (this.$route.query.type == 'jdcx') {
jdcxLeftMenu(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.unitData = res.result;
window.unitData = res.result;
this.currentSelectProps = res.result[0];
this.$emit('getCurrentSelectProps', this.currentSelectProps);
this.judgeBatchShow();
if (this.showBatch) {
//满足批量查封/批量抵押按钮出现 即先展示批量表单
this.batchUnitClick();
} else {
//默认选择单元列表第一个
this.unitClick(0);
}
}
}
})
})
} else {
leftMenu(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.unitData = res.result;
window.unitData = res.result;
this.currentSelectProps = res.result[0];
this.$emit('getCurrentSelectProps', this.currentSelectProps);
this.judgeBatchShow();
if (this.showBatch) {
//满足批量查封/批量抵押按钮出现 即先展示批量表单
this.batchUnitClick();
} else {
//默认选择单元列表第一个
this.unitClick(0);
}
}
})
}
},
//批量按钮判断
/**
......@@ -177,9 +198,8 @@
* @author: renchao
*/
batchUnitClick () {
debugger
this.currentSelectProps.batchOperation = true;
// this.activeIndex = "-1";
this.activeIndex = "-1";
this.$parent.stepForm(0);
},
......@@ -201,7 +221,7 @@
* @author: renchao
*/
unitClick (index) {
if(this.unitData.length==0) return
if (this.unitData.length == 0) return
this.currentSelectProps = this.unitData[index];
this.currentSelectProps.batchOperation = false;
this.activeIndex = index.toString();
......
<!--
* @Description: workFrame左侧菜单列表-分割
* @Autor: renchao
* @LastEditTime: 2023-07-17 16:21:24
* @LastEditTime: 2023-07-25 14:52:40
-->
<template>
<div class="leftmenu" :class="{ 'animation-map-drawer': isShowdrawer }">
......@@ -53,7 +53,7 @@
</template>
<script>
import { mapGetters } from 'vuex'
import { leftMenu, deleteFlow } from "@/api/workFlow.js"
import { leftMenu, deleteFlow, jdcxLeftMenu } from "@/api/workFlow.js"
export default {
data () {
return {
......@@ -102,26 +102,47 @@
loadBdcdylist () {
var formdata = new FormData();
formdata.append("bsmSlsq", this.bsmSlsq);
formdata.append("bestepid", this.bestepid);
if (this.$route.query.bestepid) {
formdata.append("bestepid", this.bestepid);
}
if (this.$route.query.bsmBusiness) {
formdata.append("bsmBusiness", this.$route.query.bsmBusiness);
}
leftMenu(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.aroundUnitData = res.result.filter(item => item.bglx == '1')
this.afterUnitData = res.result.filter(item => item.bglx == '2')
this.currentSelectProps = res.result[0];
this.$emit('getCurrentSelectProps', this.currentSelectProps);
this.judgeBatchShow();
if (this.showBatch) {
//满足批量查封/批量抵押按钮出现 即先展示批量表单
this.batchUnitClick();
} else {
//默认选择单元列表第一个
this.unitClick(0);
if (this.$route.query.type == 'jdcx') {
jdcxLeftMenu(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.aroundUnitData = res.result.filter(item => item.bglx == '1')
this.afterUnitData = res.result.filter(item => item.bglx == '2')
this.currentSelectProps = res.result[0];
this.$emit('getCurrentSelectProps', this.currentSelectProps);
this.judgeBatchShow();
if (this.showBatch) {
//满足批量查封/批量抵押按钮出现 即先展示批量表单
this.batchUnitClick();
} else {
//默认选择单元列表第一个
this.unitClick(0);
}
}
}
})
})
} else {
leftMenu(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.aroundUnitData = res.result.filter(item => item.bglx == '1')
this.afterUnitData = res.result.filter(item => item.bglx == '2')
this.currentSelectProps = res.result[0];
this.$emit('getCurrentSelectProps', this.currentSelectProps);
this.judgeBatchShow();
if (this.showBatch) {
//满足批量查封/批量抵押按钮出现 即先展示批量表单
this.batchUnitClick();
} else {
//默认选择单元列表第一个
this.unitClick(0);
}
}
})
}
},
//批量按钮判断
/**
......@@ -178,7 +199,7 @@
});
},
//批量按钮点击事件
//批量按钮点击事件
/**
* @description: 批量按钮点击事件
* @author: renchao
......
......@@ -10,8 +10,7 @@
v-show="!isLoading"
ref="processCanvas"
class="process-canvas"
style="height: 280px"
/>
style="height: 280px" />
<!-- 自定义箭头样式,用于成功状态下流程连线箭头 -->
<defs ref="customSuccessDefs">
<marker
......@@ -21,8 +20,7 @@
ref-y="10"
marker-width="10"
marker-height="10"
orient="auto"
>
orient="auto">
<path
class="success-arrow"
d="M 1 5 L 11 10 L 1 15 Z"
......@@ -30,8 +28,7 @@
stroke-width: 1px;
stroke-linecap: round;
stroke-dasharray: 10000, 1;
"
/>
" />
</marker>
<marker
id="conditional-flow-marker-white-success"
......@@ -40,8 +37,7 @@
ref-y="10"
marker-width="10"
marker-height="10"
orient="auto"
>
orient="auto">
<path
class="success-conditional"
d="M 0 10 L 8 6 L 16 10 L 8 14 Z"
......@@ -49,8 +45,7 @@
stroke-width: 1px;
stroke-linecap: round;
stroke-dasharray: 10000, 1;
"
/>
" />
</marker>
</defs>
<!-- 自定义箭头样式,用于失败状态下流程连线箭头 -->
......@@ -62,8 +57,7 @@
ref-y="10"
marker-width="10"
marker-height="10"
orient="auto"
>
orient="auto">
<path
class="fail-arrow"
d="M 1 5 L 11 10 L 1 15 Z"
......@@ -71,8 +65,7 @@
stroke-width: 1px;
stroke-linecap: round;
stroke-dasharray: 10000, 1;
"
/>
" />
</marker>
<marker
id="conditional-flow-marker-white-fail"
......@@ -81,8 +74,7 @@
ref-y="10"
marker-width="10"
marker-height="10"
orient="auto"
>
orient="auto">
<path
class="fail-conditional"
d="M 0 10 L 8 6 L 16 10 L 8 14 Z"
......@@ -90,8 +82,7 @@
stroke-width: 1px;
stroke-linecap: round;
stroke-dasharray: 10000, 1;
"
/>
" />
</marker>
</defs>
......@@ -104,8 +95,7 @@
:plain="true"
:disabled="defaultZoom <= 0.3"
icon="el-icon-zoom-out"
@click="processZoomOut()"
/>
@click="processZoomOut()" />
<el-button size="medium" type="default" style="width: 90px">{{
Math.floor(this.defaultZoom * 10 * 10) + "%"
}}</el-button>
......@@ -115,14 +105,12 @@
:plain="true"
:disabled="defaultZoom >= 3.9"
icon="el-icon-zoom-in"
@click="processZoomIn()"
/>
@click="processZoomIn()" />
<el-button
size="medium"
type="default"
icon="el-icon-c-scale-to-original"
@click="processReZoom()"
/>
@click="processReZoom()" />
<slot />
</el-button-group>
</el-row>
......@@ -135,8 +123,7 @@
v-for="item in selectOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
:value="item.value">
</el-option>
</el-select>
<el-table
......@@ -144,15 +131,13 @@
:data="taskCommentList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
header-cell-class-name="table-header-gray">
<el-table-column
label="序号"
header-align="center"
align="center"
type="index"
width="55px"
/>
width="55px" />
<el-table-column label="流程状态" header-align="center" align="center">
<template slot-scope="scope">
<div v-if="scope.row.endTime">已完结</div>
......@@ -163,35 +148,30 @@
label="环节名称"
prop="name"
minWidth="100"
align="center"
/>
align="center" />
<el-table-column
label="办理人"
prop="agent"
minWidth="120"
align="center"
/>
align="center" />
<el-table-column
label="转入时间"
prop="createTime"
:formatter="formatDate"
width="160"
align="center"
/>
align="center" />
<el-table-column
label="认领时间"
prop="claimTime"
:formatter="formatDate"
width="160"
align="center"
/>
align="center" />
<el-table-column
label="转出时间"
prop="endTime"
:formatter="formatDate"
width="160"
align="center"
/>
align="center" />
<el-table-column label="操作方式" prop="controls" align="center" />
<el-table-column label="意见" prop="idea" align="center" />
</el-table>
......@@ -199,386 +179,386 @@
</div>
</template>
<script>
import "@/styles/package/theme/index.scss";
import BpmnViewer from "bpmn-js/lib/Viewer";
import MoveCanvasModule from "diagram-js/lib/navigation/movecanvas";
export default {
props: {
formData: {
type: Object,
default: {},
},
},
data() {
return {
dlgTitle: undefined,
defaultZoom: 1,
// 是否正在加载流程图
isLoading: true,
bpmnViewer: undefined,
// 已完成流程元素
processNodeInfo: undefined,
// 当前任务id
selectTaskId: undefined,
// 任务节点审批记录
taskList: [],
taskCommentList: [],
// 已完成任务悬浮延迟Timer
hoverTimer: null,
// 下拉
selectValue: "",
selectOptions: [],
};
},
created() {
this.$nextTick(() => {
// 获取流程记录
this.getCommentList();
this.setProcessStatus(this.formData.finishedInfo);
this.importXML(this.formData.xml);
});
},
destroyed() {
this.clearViewer();
},
methods: {
/**
* @description: formatDate
* @param {*} row
* @param {*} column
* @author: renchao
*/
formatDate(row, column) {
let data = row[column.property];
if (data == null) {
return null;
}
let dt = new Date(data);
return (
dt.getFullYear() +
"-" +
(dt.getMonth() + 1) +
"-" +
dt.getDate() +
" " +
dt.getHours() +
":" +
dt.getMinutes() +
":" +
dt.getSeconds()
);
},
/**
* @description: processReZoom
* @author: renchao
*/
processReZoom() {
this.defaultZoom = 1;
this.bpmnViewer.get("canvas").zoom("fit-viewport", "auto");
},
/**
* @description: processZoomIn
* @param {*} zoomStep
* @author: renchao
*/
processZoomIn(zoomStep = 0.1) {
const newZoom = Math.floor(this.defaultZoom * 100 + zoomStep * 100) / 100;
if (newZoom > 4) {
throw new Error(
"[Process Designer Warn ]: The zoom ratio cannot be greater than 4"
);
}
this.defaultZoom = newZoom;
this.bpmnViewer.get("canvas").zoom(this.defaultZoom);
},
/**
* @description: processZoomOut
* @param {*} zoomStep
* @author: renchao
*/
processZoomOut(zoomStep = 0.1) {
const newZoom = Math.floor(this.defaultZoom * 100 - zoomStep * 100) / 100;
if (newZoom < 0.2) {
throw new Error(
"[Process Designer Warn ]: The zoom ratio cannot be scss than 0.2"
);
}
this.defaultZoom = newZoom;
this.bpmnViewer.get("canvas").zoom(this.defaultZoom);
},
/**
* @description: getOperationTagType
* @param {*} type
* @author: renchao
*/
getOperationTagType(type) {
return "success";
},
// 流程图预览清空
/**
* @description: 流程图预览清空
* @param {*} e
* @author: renchao
*/
clearViewer(a) {
if (this.$refs.processCanvas) {
this.$refs.processCanvas.innerHTML = "";
}
if (this.bpmnViewer) {
this.bpmnViewer.destroy();
}
this.bpmnViewer = null;
import "@/styles/package/theme/index.scss";
import BpmnViewer from "bpmn-js/lib/Viewer";
import MoveCanvasModule from "diagram-js/lib/navigation/movecanvas";
export default {
props: {
formData: {
type: Object,
default: {},
},
},
// 添加自定义箭头
/**
* @description: 添加自定义箭头
* @author: renchao
*/
addCustomDefs() {
const canvas = this.bpmnViewer.get("canvas");
const svg = canvas._svg;
const customSuccessDefs = this.$refs.customSuccessDefs;
const customFailDefs = this.$refs.customFailDefs;
svg.appendChild(customSuccessDefs);
svg.appendChild(customFailDefs);
data () {
return {
dlgTitle: undefined,
defaultZoom: 1,
// 是否正在加载流程图
isLoading: true,
bpmnViewer: undefined,
// 已完成流程元素
processNodeInfo: undefined,
// 当前任务id
selectTaskId: undefined,
// 任务节点审批记录
taskList: [],
taskCommentList: [],
// 已完成任务悬浮延迟Timer
hoverTimer: null,
// 下拉
selectValue: "",
selectOptions: [],
};
},
// 任务悬浮弹窗
/**
* @description: 任务悬浮弹窗
* @param {*} element
* @author: renchao
*/
onSelectElement(element) {
this.selectTaskId = undefined;
this.dlgTitle = undefined;
let allfinishedTaskSet = [
...this.processNodeInfo.finishedTaskSet,
...this.processNodeInfo.unfinishedTaskSet,
];
if (this.processNodeInfo == null || allfinishedTaskSet == null) return;
if (element == null || allfinishedTaskSet.indexOf(element.id) === -1) {
return;
}
this.selectTaskId = element.id;
this.selectValue = element.id;
this.dlgTitle = element.businessObject
? element.businessObject.name
: undefined;
// 计算当前悬浮任务审批记录,如果记录为空不显示弹窗
this.taskCommentList = (this.taskList || []).filter((item) => {
return item.taskDefinitionKey === this.selectTaskId;
created () {
this.$nextTick(() => {
// 获取流程记录
this.getCommentList();
this.setProcessStatus(this.formData.finishedInfo);
this.importXML(this.formData.xml);
});
if (this.taskCommentList.length == 0) {
this.taskCommentList = this.taskList;
}
},
// 下拉列表切换
/**
* @description: 下拉列表切换
* @param {*} val
* @author: renchao
*/
handleSelect(val) {
this.taskCommentList = (this.taskList || []).filter((item) => {
return item.taskDefinitionKey === val;
});
if (this.taskCommentList.length == 0) {
this.taskCommentList = this.taskList;
}
destroyed () {
this.clearViewer();
},
// 显示流程图
/**
* @description: 显示流程图
* @param {*} xml
* @author: renchao
*/
async importXML(xml) {
let xmlData = this.$x2js.xml2js(xml).definitions.process;
this.selectOptions = xmlData.userTask.map((item) => {
return { value: item._id, label: item._name };
});
this.selectOptions = [
{ value: xmlData.startEvent._id, label: "浏览记录" },
...this.selectOptions,
];
this.selectOptions = this.selectOptions
.map((item) => {
if (this.formData.finishedInfo.finishedTaskSet.includes(item.value)) {
return item;
}
if (
this.formData.finishedInfo.unfinishedTaskSet.includes(item.value)
) {
return item;
}
})
.filter(Boolean);
this.selectValue = xmlData.startEvent._id;
this.clearViewer("a");
if (xml != null && xml !== "") {
try {
this.bpmnViewer = new BpmnViewer({
additionalModules: [
// 移动整个画布
MoveCanvasModule,
],
container: this.$refs.processCanvas,
});
// 任务节点悬浮事件
this.bpmnViewer.on("element.click", ({ element }) => {
this.onSelectElement(element);
});
await this.bpmnViewer.importXML(xml);
this.isLoading = true;
this.addCustomDefs();
} catch (e) {
this.clearViewer("b");
} finally {
this.isLoading = false;
this.setProcessStatus(this.processNodeInfo);
this.$nextTick(() => {
this.processReZoom();
});
methods: {
/**
* @description: formatDate
* @param {*} row
* @param {*} column
* @author: renchao
*/
formatDate (row, column) {
let data = row[column.property];
if (data == null) {
return null;
}
}
},
// 获取流程记录
/**
* @description: 获取流程记录
* @author: renchao
*/
getCommentList() {
this.formData.allCommentList.forEach(async (item, index) => {
// item.comments.forEach(element => {
// if(element.type=="COMPLETE"){
// this.formData.allCommentList[index].idea=element.message
// this.formData.allCommentList[index].controls="完成"
// }
// });
let type = item.comments[item.comments.length - 1].type;
this.formData.allCommentList[index].idea =
item.comments[item.comments.length - 1].message;
// 操作方式
let controls = "";
switch (type) {
case "COMPLETE":
controls = "完成";
break;
case "CLAIM":
controls = "完成";
break;
case "ASSIGN":
controls = "转办";
break;
case "DELEGATE":
controls = "委派";
break;
case "UNCLAIM":
controls = "取消认领";
break;
case "STOP":
controls = "终止";
break;
case "BACK":
controls = "退回";
break;
let dt = new Date(data);
return (
dt.getFullYear() +
"-" +
(dt.getMonth() + 1) +
"-" +
dt.getDate() +
" " +
dt.getHours() +
":" +
dt.getMinutes() +
":" +
dt.getSeconds()
);
},
/**
* @description: processReZoom
* @author: renchao
*/
processReZoom () {
this.defaultZoom = 1;
this.bpmnViewer.get("canvas").zoom("fit-viewport", "auto");
},
/**
* @description: processZoomIn
* @param {*} zoomStep
* @author: renchao
*/
processZoomIn (zoomStep = 0.1) {
const newZoom = Math.floor(this.defaultZoom * 100 + zoomStep * 100) / 100;
if (newZoom > 4) {
throw new Error(
"[Process Designer Warn ]: The zoom ratio cannot be greater than 4"
);
}
this.formData.allCommentList[index].controls = controls;
this.formData.allCommentList[index].agent = item.assignee.name;
});
this.formData.handlinglist.forEach(async (item, index) => {
if (item.assignee.name) {
this.formData.handlinglist[index].agent = item.assignee.name;
} else {
let str = "";
item.countersign.forEach((item) => {
str += item.name + ",";
});
str = str.slice(0, -1);
this.formData.allCommentList[index].agent = str;
this.defaultZoom = newZoom;
this.bpmnViewer.get("canvas").zoom(this.defaultZoom);
},
/**
* @description: processZoomOut
* @param {*} zoomStep
* @author: renchao
*/
processZoomOut (zoomStep = 0.1) {
const newZoom = Math.floor(this.defaultZoom * 100 - zoomStep * 100) / 100;
if (newZoom < 0.2) {
throw new Error(
"[Process Designer Warn ]: The zoom ratio cannot be scss than 0.2"
);
}
});
this.taskList = [
...this.formData.allCommentList,
...this.formData.handlinglist,
];
// this.taskList =this.formData.allCommentList;
// 处理数据之后赋值
this.taskCommentList = this.taskList;
},
// 设置流程图元素状态
/**
* @description: 设置流程图元素状态
* @param {*} processNodeInfo
* @author: renchao
*/
setProcessStatus(processNodeInfo) {
this.processNodeInfo = processNodeInfo;
if (
this.isLoading ||
this.processNodeInfo == null ||
this.bpmnViewer == null
)
return;
const {
finishedTaskSet,
rejectedTaskSet,
unfinishedTaskSet,
finishedSequenceFlowSet,
} = this.processNodeInfo;
const canvas = this.bpmnViewer.get("canvas");
const elementRegistry = this.bpmnViewer.get("elementRegistry");
if (Array.isArray(finishedSequenceFlowSet)) {
finishedSequenceFlowSet.forEach((item) => {
if (item != null) {
canvas.addMarker(item, "success");
const element = elementRegistry.get(item);
const conditionExpression =
element.businessObject.conditionExpression;
if (conditionExpression) {
canvas.addMarker(item, "condition-expression");
this.defaultZoom = newZoom;
this.bpmnViewer.get("canvas").zoom(this.defaultZoom);
},
/**
* @description: getOperationTagType
* @param {*} type
* @author: renchao
*/
getOperationTagType (type) {
return "success";
},
// 流程图预览清空
/**
* @description: 流程图预览清空
* @param {*} e
* @author: renchao
*/
clearViewer (a) {
if (this.$refs.processCanvas) {
this.$refs.processCanvas.innerHTML = "";
}
if (this.bpmnViewer) {
this.bpmnViewer.destroy();
}
this.bpmnViewer = null;
},
// 添加自定义箭头
/**
* @description: 添加自定义箭头
* @author: renchao
*/
addCustomDefs () {
const canvas = this.bpmnViewer.get("canvas");
const svg = canvas._svg;
const customSuccessDefs = this.$refs.customSuccessDefs;
const customFailDefs = this.$refs.customFailDefs;
svg.appendChild(customSuccessDefs);
svg.appendChild(customFailDefs);
},
// 任务悬浮弹窗
/**
* @description: 任务悬浮弹窗
* @param {*} element
* @author: renchao
*/
onSelectElement (element) {
this.selectTaskId = undefined;
this.dlgTitle = undefined;
let allfinishedTaskSet = [
...this.processNodeInfo.finishedTaskSet,
...this.processNodeInfo.unfinishedTaskSet,
];
if (this.processNodeInfo == null || allfinishedTaskSet == null) return;
if (element == null || allfinishedTaskSet.indexOf(element.id) === -1) {
return;
}
this.selectTaskId = element.id;
this.selectValue = element.id;
this.dlgTitle = element.businessObject
? element.businessObject.name
: undefined;
// 计算当前悬浮任务审批记录,如果记录为空不显示弹窗
this.taskCommentList = (this.taskList || []).filter((item) => {
return item.taskDefinitionKey === this.selectTaskId;
});
if (this.taskCommentList.length == 0) {
this.taskCommentList = this.taskList;
}
},
// 下拉列表切换
/**
* @description: 下拉列表切换
* @param {*} val
* @author: renchao
*/
handleSelect (val) {
this.taskCommentList = (this.taskList || []).filter((item) => {
return item.taskDefinitionKey === val;
});
if (this.taskCommentList.length == 0) {
this.taskCommentList = this.taskList;
}
},
// 显示流程图
/**
* @description: 显示流程图
* @param {*} xml
* @author: renchao
*/
async importXML (xml) {
let xmlData = this.$x2js.xml2js(xml).definitions.process;
this.selectOptions = xmlData.userTask.map((item) => {
return { value: item._id, label: item._name };
});
this.selectOptions = [
{ value: xmlData.startEvent._id, label: "浏览记录" },
...this.selectOptions,
];
this.selectOptions = this.selectOptions
.map((item) => {
if (this.formData.finishedInfo.finishedTaskSet.includes(item.value)) {
return item;
}
if (
this.formData.finishedInfo.unfinishedTaskSet.includes(item.value)
) {
return item;
}
})
.filter(Boolean);
this.selectValue = xmlData.startEvent._id;
this.clearViewer("a");
if (xml != null && xml !== "") {
try {
this.bpmnViewer = new BpmnViewer({
additionalModules: [
// 移动整个画布
MoveCanvasModule,
],
container: this.$refs.processCanvas,
});
// 任务节点悬浮事件
this.bpmnViewer.on("element.click", ({ element }) => {
this.onSelectElement(element);
});
await this.bpmnViewer.importXML(xml);
this.isLoading = true;
this.addCustomDefs();
} catch (e) {
this.clearViewer("b");
} finally {
this.isLoading = false;
this.setProcessStatus(this.processNodeInfo);
this.$nextTick(() => {
this.processReZoom();
});
}
}
},
// 获取流程记录
/**
* @description: 获取流程记录
* @author: renchao
*/
getCommentList () {
this.formData.allCommentList.forEach(async (item, index) => {
// item.comments.forEach(element => {
// if(element.type=="COMPLETE"){
// this.formData.allCommentList[index].idea=element.message
// this.formData.allCommentList[index].controls="完成"
// }
// });
let type = item.comments[item.comments.length - 1].type;
this.formData.allCommentList[index].idea =
item.comments[item.comments.length - 1].message;
// 操作方式
let controls = "";
switch (type) {
case "COMPLETE":
controls = "完成";
break;
case "CLAIM":
controls = "完成";
break;
case "ASSIGN":
controls = "转办";
break;
case "DELEGATE":
controls = "委派";
break;
case "UNCLAIM":
controls = "取消认领";
break;
case "STOP":
controls = "终止";
break;
case "BACK":
controls = "退回";
break;
}
this.formData.allCommentList[index].controls = controls;
this.formData.allCommentList[index].agent = item.assignee.name;
});
}
if (Array.isArray(finishedTaskSet)) {
finishedTaskSet.forEach((item) => canvas.addMarker(item, "success"));
}
if (Array.isArray(unfinishedTaskSet)) {
unfinishedTaskSet.forEach((item) => canvas.addMarker(item, "primary"));
}
if (Array.isArray(rejectedTaskSet)) {
rejectedTaskSet.forEach((item) => {
if (item != null) {
const element = elementRegistry.get(item);
if (element.type.includes("Task")) {
canvas.addMarker(item, "danger");
} else {
canvas.addMarker(item, "warning");
}
this.formData.handlinglist.forEach(async (item, index) => {
if (item.assignee.name) {
this.formData.handlinglist[index].agent = item.assignee.name;
} else {
let str = "";
item.countersign.forEach((item) => {
str += item.name + ",";
});
str = str.slice(0, -1);
this.formData.allCommentList[index].agent = str;
}
});
}
this.taskList = [
...this.formData.allCommentList,
...this.formData.handlinglist,
];
// this.taskList =this.formData.allCommentList;
// 处理数据之后赋值
this.taskCommentList = this.taskList;
},
// 设置流程图元素状态
/**
* @description: 设置流程图元素状态
* @param {*} processNodeInfo
* @author: renchao
*/
setProcessStatus (processNodeInfo) {
this.processNodeInfo = processNodeInfo;
if (
this.isLoading ||
this.processNodeInfo == null ||
this.bpmnViewer == null
)
return;
const {
finishedTaskSet,
rejectedTaskSet,
unfinishedTaskSet,
finishedSequenceFlowSet,
} = this.processNodeInfo;
const canvas = this.bpmnViewer.get("canvas");
const elementRegistry = this.bpmnViewer.get("elementRegistry");
if (Array.isArray(finishedSequenceFlowSet)) {
finishedSequenceFlowSet.forEach((item) => {
if (item != null) {
canvas.addMarker(item, "success");
const element = elementRegistry.get(item);
const conditionExpression =
element.businessObject.conditionExpression;
if (conditionExpression) {
canvas.addMarker(item, "condition-expression");
}
}
});
}
if (Array.isArray(finishedTaskSet)) {
finishedTaskSet.forEach((item) => canvas.addMarker(item, "success"));
}
if (Array.isArray(unfinishedTaskSet)) {
unfinishedTaskSet.forEach((item) => canvas.addMarker(item, "primary"));
}
if (Array.isArray(rejectedTaskSet)) {
rejectedTaskSet.forEach((item) => {
if (item != null) {
const element = elementRegistry.get(item);
if (element.type.includes("Task")) {
canvas.addMarker(item, "danger");
} else {
canvas.addMarker(item, "warning");
}
}
});
}
},
},
},
};
};
</script>
<style scoped lang="scss">
.information-list {
height: 220px;
margin-top: 10px;
.information-list {
height: 220px;
margin-top: 10px;
p {
font-size: 16px;
line-height: 24px;
p {
font-size: 16px;
line-height: 24px;
}
}
/deep/.bjs-powered-by {
display: none;
}
}
/deep/.bjs-powered-by {
display: none;
}
// /deep/.information-list {
// height: 170px;
// overflow: visible;
// }
// /deep/.information-list {
// height: 170px;
// overflow: visible;
// }
</style>
......
......@@ -41,7 +41,7 @@
<span>印刷序列号:{{ item.ysxlh }}</span>
</div>
</div>
<div class="card_padding">
<div class="card_padding" v-if="ableOperation">
<div class="top_line middle_margin"></div>
<div class="text" v-if="item.ysxlh">
<el-button class="operation_button" type="text" @click="openInvalidDiglog(item)">再次打印({{ item.szcs
......@@ -79,6 +79,8 @@
props: {},
data () {
return {
//表单是否可操作
ableOperation: true,
dialog: false,
tableData: [],
bdcqzlx: 1,
......@@ -100,7 +102,8 @@
}
},
created () {
this.list();
this.list()
this.ableOperation = this.$parent.currentSelectTab.ableOperation
},
methods: {
//初始化列表
......
......@@ -32,6 +32,7 @@
v-model="tdyt"
:disabled="!ableOperation"
noOptionsText="暂无数据"
placeholder=''
:show-count="true"
:options="dictData['tdyt']"
:normalizer="normalizer"
......@@ -315,5 +316,4 @@
/deep/.el-table th {
height: 30px !important;
}
</style>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 09:39:34
* @LastEditTime: 2023-07-25 16:15:39
-->
<template>
<div class="container">
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-06-09 16:55:31
* @LastEditTime: 2023-07-25 16:15:46
-->
<template>
<div class="container">
......@@ -93,7 +93,7 @@
currentSelectProps: {},
//是否开启材料分屏
splitScreen: false,
ableOperation:false,
ableOperation: false,
//材料分屏表单
clxxForm: "",
//材料信息选择卡索引
......@@ -125,8 +125,14 @@
//获取单元对应的所有表单信息
this.tabList = res.result;
//默认加载第一个表单信息
this.tabName = res.result[0].value;
this.ableOperation=this.tabList[0].ableOperation
//默认加载第一个表单信息
let arr = res.result.filter(item => item.defaultForm)
if (arr.length > 0) {
this.tabName = arr[0].value;
} else {
this.tabName = res.result[0].value;
}
this.ableOperation = this.tabList[0].ableOperation
//批量操作无分屏按钮
if (index != null) {
//处理分屏材料信息
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 15:03:20
* @LastEditTime: 2023-07-25 09:21:53
-->
<template>
<div class="from-clues">
......@@ -264,10 +264,10 @@
} else {
this.$message.error("用户任务权限判断失败,请联系管理员");
}
});
},
},
};
})
}
}
}
</script>
<style scoped lang="scss">
@import "~@/styles/public.scss";
......
<!--
* @Description: 受理信息
* @Autor: renchao
* @LastEditTime: 2023-07-21 14:27:15
* @LastEditTime: 2023-07-25 09:22:40
-->
<template>
<div class="slxx">
......@@ -332,7 +332,6 @@
upDateYwrxxList (val) {
this.ruleForm.ywrList = _.cloneDeep(val);
},
/**
* @description: onSubmit
* @author: renchao
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-20 09:32:18
* @LastEditTime: 2023-07-25 09:23:05
-->
<template>
<!-- 受理信息 -->
......@@ -296,9 +296,9 @@
console.log(res);
//this.ruleForm = { ...res.result, ...res.result.zdjbxxdatas, ...res.result.qlxxdatas, ...res.result.jsydsyqdatas }
}
});
},
},
})
}
}
};
</script>
<style scoped lang='scss'>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-14 11:09:33
* @LastEditTime: 2023-07-25 09:23:20
-->
<template>
<!-- 受理信息 -->
......@@ -320,7 +320,10 @@
})
}
}
console.log("this.ruleFormmmmmmmmm", this.ruleForm);
/**
* @description: saveData
* @author: renchao
*/
saveData(this.ruleForm).then((res) => {
if (res.code === 200) {
this.$message({
......
......@@ -2,7 +2,7 @@
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-05-25 08:59:49
* @LastEditTime: 2023-07-25 09:23:42
-->
<template>
<!-- 受理信息 -->
......@@ -336,10 +336,10 @@ export default {
},
"80%",
true
);
},
},
};
)
}
}
}
</script>
<style scoped lang="scss">
@import "~@/styles/public.scss";
......
......@@ -352,8 +352,8 @@
})
this.ruleForm.nydsyq.ydyhflmc = itemLx.dname;
}
},
};
}
}
</script>
<style scoped lang='scss'>
@import "~@/styles/public.scss";
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-20 09:30:51
* @LastEditTime: 2023-07-25 09:24:18
-->
<template>
<!-- 受理信息 -->
......@@ -472,6 +472,10 @@
});
}
}
/**
* @description: saveData
* @author: renchao
*/
saveData(this.ruleForm).then((res) => {
if (res.code === 200) {
this.$message({
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 15:03:46
* @LastEditTime: 2023-07-25 09:21:40
-->
<template>
<div class="from-clues">
......@@ -232,11 +232,9 @@
);
window.open(href, `workFrameView${item.bsmSlsq}`);
}
},
},
};
}
}
}
</script>
<style scoped lang="scss">
@import "~@/styles/public.scss";
......
......@@ -391,7 +391,6 @@
<style scoped lang='scss'>
@import "~@/styles/mixin.scss";
@import "./ywsq.scss";
/deep/.el-collapse-item__content {
padding-bottom: 0;
}
......
......@@ -148,7 +148,7 @@
flex: 1;
width: 100%;
padding: 3px;
font-size: 16px;
}
p:nth-child(2) {
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 14:04:15
* @LastEditTime: 2023-07-25 14:47:41
-->
<template>
<div class="from-clues">
......@@ -195,23 +195,7 @@
this.$popupDialog('楼盘表', 'lpb/index', {
bsm: ''
}, '85%')
},
// ywhClick (item) {
// const { href } = this.$router.resolve(
// "/djbworkFrame?bdcdyid=" +
// item.bdcdyid+
// "&bdcdyh=" +
// item.bdcdyh+
// "&qllx="+
// item.qllx+
// "&bsmQlxx="+
// item.bsmQlxx+
// "&viewtype=1"
// );
// localStorage.setItem('ywbl', JSON.stringify(item));
// window.open(href, `urlname${item.bdcdyid}`);
// },
}
}
}
</script>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-07-24 14:02:07
* @LastEditTime: 2023-07-25 16:34:27
-->
<template>
<div class="from-clues">
......@@ -151,7 +151,7 @@
* @author: renchao
*/
openDialog (item) {
const { href } = this.$router.resolve('/workFrameView?bsmSlsq=' + item.bsmSlsq + '&bestepid=' + item.bestepid + '&bsmBusiness=' + item.bsmBusiness + '&viewtype=3')
const { href } = this.$router.resolve('/workFrameView?bsmSlsq=' + item.bsmSlsq + '&bestepid=' + item.bestepid + '&bsmBusiness=' + item.bsmBusiness + '&viewtype=3' + '&type=jdcx')
window.open(href, `urlname${item.bsmSlsq}`)
}
}
......