Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
D
dataease
项目
项目
详情
活动
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
图表
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
zhu
dataease
Commits
e5715d68
提交
e5715d68
authored
4月 16, 2021
作者:
fit2cloud-chenyw
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat:优化查询条件
上级
94a2395c
隐藏空白字符变更
内嵌
并排
正在显示
18 个修改的文件
包含
279 行增加
和
260 行删除
+279
-260
ContextMenu.vue
...d/src/components/canvas/components/Editor/ContextMenu.vue
+8
-0
MarkLine.vue
...tend/src/components/canvas/components/Editor/MarkLine.vue
+1
-1
Preview.vue
frontend/src/components/canvas/components/Editor/Preview.vue
+0
-2
PreviewEject.vue
.../src/components/canvas/components/Editor/PreviewEject.vue
+0
-2
PreviewFullScreen.vue
...components/canvas/components/Editor/PreviewFullScreen.vue
+0
-1
index.vue
frontend/src/components/canvas/components/Editor/index.vue
+38
-8
compose.js
frontend/src/components/canvas/store/compose.js
+79
-79
style.js
frontend/src/components/canvas/utils/style.js
+45
-45
DeDrawingWidget.vue
frontend/src/components/widget/DeWidget/DeDrawingWidget.vue
+6
-7
DeSelect.vue
frontend/src/components/widget/DeWidget/DeSelect.vue
+15
-3
Condition.js
frontend/src/components/widget/bean/Condition.js
+14
-0
widget.js
frontend/src/components/widget/bean/widget.js
+0
-8
MySelectImpl.js
...end/src/components/widget/drawServiceImpl/MySelectImpl.js
+21
-26
DrawWidgetService.js
frontend/src/components/widget/service/DrawWidgetService.js
+15
-46
index.vue
frontend/src/views/panel/edit/index.vue
+26
-17
filterDialog.vue
frontend/src/views/panel/filter/filterDialog.vue
+10
-11
index.vue
frontend/src/views/panel/filter/index.vue
+1
-3
PanelViewShow.vue
frontend/src/views/panel/list/PanelViewShow.vue
+0
-1
没有找到文件。
frontend/src/components/canvas/components/Editor/ContextMenu.vue
浏览文件 @
e5715d68
...
...
@@ -65,6 +65,7 @@ export default {
},
cut
()
{
this
.
deleteCurCondition
()
this
.
$store
.
commit
(
'cut'
)
},
...
...
@@ -78,10 +79,17 @@ export default {
},
deleteComponent
()
{
this
.
deleteCurCondition
()
this
.
$store
.
commit
(
'deleteComponent'
)
this
.
$store
.
commit
(
'recordSnapshot'
)
},
deleteCurCondition
()
{
if
(
this
.
curComponent
.
type
===
'custom'
)
{
bus
.
$emit
(
'delete-condition'
,
{
componentId
:
this
.
curComponent
.
id
})
}
},
upComponent
()
{
this
.
$store
.
commit
(
'upComponent'
)
this
.
$store
.
commit
(
'recordSnapshot'
)
...
...
frontend/src/components/canvas/components/Editor/MarkLine.vue
浏览文件 @
e5715d68
...
...
@@ -61,7 +61,7 @@ export default {
this
.
hideLine
()
components
.
forEach
(
component
=>
{
if
(
component
==
this
.
curComponent
)
return
if
(
component
==
=
this
.
curComponent
)
return
const
componentStyle
=
getComponentRotatedStyle
(
component
.
style
)
const
{
top
,
left
,
bottom
,
right
}
=
componentStyle
const
componentHalfwidth
=
componentStyle
.
width
/
2
...
...
frontend/src/components/canvas/components/Editor/Preview.vue
浏览文件 @
e5715d68
...
...
@@ -61,13 +61,11 @@ export default {
])
},
mounted
()
{
debugger
const
_this
=
this
const
erd
=
elementResizeDetectorMaker
()
// 监听div变动事件
erd
.
listenTo
(
document
.
getElementById
(
'canvasInfo'
),
element
=>
{
_this
.
$nextTick
(()
=>
{
debugger
_this
.
restore
()
})
})
...
...
frontend/src/components/canvas/components/Editor/PreviewEject.vue
浏览文件 @
e5715d68
...
...
@@ -71,7 +71,6 @@ export default {
})
})
window
.
onresize
=
()
=>
{
debugger
this
.
resize
()
}
// this.resize()
...
...
@@ -88,7 +87,6 @@ export default {
this
.
handleScaleChange
()
},
restore
()
{
debugger
this
.
panelId
=
this
.
$route
.
path
.
split
(
'/'
)[
2
]
// 加载视图数据
get
(
'panel/group/findOne/'
+
this
.
panelId
).
then
(
response
=>
{
...
...
frontend/src/components/canvas/components/Editor/PreviewFullScreen.vue
浏览文件 @
e5715d68
...
...
@@ -19,7 +19,6 @@ export default {
methods
:
{
toDir
()
{
debugger
this
.
$router
.
replace
(
'/panel/index'
)
bus
.
$emit
(
'PanelSwitchComponent'
,
{
name
:
'PanelEdit'
})
}
...
...
frontend/src/components/canvas/components/Editor/index.vue
浏览文件 @
e5715d68
...
...
@@ -25,14 +25,14 @@
:class=
"
{ lock: item.isLock }"
>
<de-drawing-widget
<component
:is=
"item.component"
v-if=
"item.type==='custom'"
:id=
"'component' + item.id"
class=
"component"
:style=
"getComponentStyle(item.style)"
:service-name=
"item.widgetService.name"
:panel-id=
"panelInfo.id"
@
filter-value-change=
"filterValueChange"
:style=
"item.style"
:element=
"item"
@
set-condition-value=
"setConditionValue"
/>
<component
...
...
@@ -67,6 +67,7 @@
<
script
>
import
{
mapState
}
from
'vuex'
import
Shape
from
'./Shape'
// eslint-disable-next-line no-unused-vars
import
{
getStyle
,
getComponentRotatedStyle
}
from
'@/components/canvas/utils/style'
import
{
$
}
from
'@/components/canvas/utils/utils'
import
ContextMenu
from
'./ContextMenu'
...
...
@@ -75,7 +76,8 @@ import Area from './Area'
import
eventBus
from
'@/components/canvas/utils/eventBus'
import
Grid
from
'./Grid'
import
{
changeStyleWithScale
}
from
'@/components/canvas/utils/translate'
import
{
Condition
}
from
'@/components/widget/bean/Condition'
import
bus
from
'@/utils/bus'
export
default
{
components
:
{
Shape
,
ContextMenu
,
MarkLine
,
Area
,
Grid
},
props
:
{
...
...
@@ -94,7 +96,8 @@ export default {
},
width
:
0
,
height
:
0
,
isShowArea
:
false
isShowArea
:
false
,
conditions
:
[]
}
},
computed
:
{
...
...
@@ -116,6 +119,9 @@ export default {
eventBus
.
$on
(
'hideArea'
,
()
=>
{
this
.
hideArea
()
})
bus
.
$on
(
'delete-condition'
,
condition
=>
{
this
.
deleteCondition
(
condition
)
})
},
methods
:
{
changeStyleWithScale
,
...
...
@@ -281,7 +287,8 @@ export default {
},
getComponentStyle
(
style
)
{
return
getStyle
(
style
,
[
'top'
,
'left'
,
'width'
,
'height'
,
'rotate'
])
// return getStyle(style, ['top', 'left', 'width', 'height', 'rotate'])
return
style
},
handleInput
(
element
,
value
)
{
...
...
@@ -290,6 +297,7 @@ export default {
},
getTextareaHeight
(
element
,
text
)
{
// eslint-disable-next-line prefer-const
let
{
lineHeight
,
fontSize
,
height
}
=
element
.
style
if
(
lineHeight
===
''
)
{
lineHeight
=
1.5
...
...
@@ -301,6 +309,28 @@ export default {
filterValueChange
(
value
)
{
console
.
log
(
'emit:'
+
value
)
},
setConditionValue
(
obj
)
{
const
{
component
,
value
,
operator
}
=
obj
const
fieldId
=
component
.
options
.
attrs
.
fieldId
const
condition
=
new
Condition
(
component
.
id
,
fieldId
,
operator
,
value
,
null
)
this
.
addCondition
(
condition
)
},
addCondition
(
condition
)
{
this
.
conditions
.
push
(
condition
)
this
.
executeSearch
()
},
deleteCondition
(
condition
)
{
this
.
conditions
=
this
.
conditions
.
filter
(
item
=>
{
const
componentIdSuitable
=
!
condition
.
componentId
||
(
item
.
componentId
===
condition
.
componentId
)
const
fieldIdSuitable
=
!
condition
.
fieldId
||
(
item
.
fieldId
===
condition
.
fieldId
)
return
!
(
componentIdSuitable
&&
fieldIdSuitable
)
})
this
.
executeSearch
()
},
executeSearch
()
{
console
.
log
(
'当前查询条件是: '
+
JSON
.
stringify
(
this
.
conditions
))
}
}
}
...
...
frontend/src/components/canvas/store/compose.js
浏览文件 @
e5715d68
...
...
@@ -6,95 +6,95 @@ import { $ } from '@/components/canvas/utils/utils'
import
{
commonStyle
,
commonAttr
}
from
'@/components/canvas/custom-component/component-list'
export
default
{
state
:
{
areaData
:
{
// 选中区域包含的组件以及区域位移信息
style
:
{
top
:
0
,
left
:
0
,
width
:
0
,
height
:
0
,
},
components
:
[],
},
editor
:
null
,
state
:
{
areaData
:
{
// 选中区域包含的组件以及区域位移信息
style
:
{
top
:
0
,
left
:
0
,
width
:
0
,
height
:
0
},
components
:
[]
},
editor
:
null
},
mutations
:
{
getEditor
(
state
)
{
state
.
editor
=
$
(
'#editor'
)
},
mutations
:
{
getEditor
(
state
)
{
state
.
editor
=
$
(
'#editor'
)
},
setAreaData
(
state
,
data
)
{
state
.
areaData
=
data
},
setAreaData
(
state
,
data
)
{
state
.
areaData
=
data
},
compose
({
componentData
,
areaData
,
editor
})
{
const
components
=
[]
areaData
.
components
.
forEach
(
component
=>
{
if
(
component
.
component
!
=
'Group'
)
{
components
.
push
(
component
)
}
else
{
// 如果要组合的组件中,已经存在组合数据,则需要提前拆分
const
parentStyle
=
{
...
component
.
style
}
const
subComponents
=
component
.
propValue
const
editorRect
=
editor
.
getBoundingClientRect
()
compose
({
componentData
,
areaData
,
editor
})
{
const
components
=
[]
areaData
.
components
.
forEach
(
component
=>
{
if
(
component
.
component
!=
=
'Group'
)
{
components
.
push
(
component
)
}
else
{
// 如果要组合的组件中,已经存在组合数据,则需要提前拆分
const
parentStyle
=
{
...
component
.
style
}
const
subComponents
=
component
.
propValue
const
editorRect
=
editor
.
getBoundingClientRect
()
store
.
commit
(
'deleteComponent'
)
subComponents
.
forEach
(
component
=>
{
decomposeComponent
(
component
,
editorRect
,
parentStyle
)
store
.
commit
(
'addComponent'
,
{
component
})
})
store
.
commit
(
'deleteComponent'
)
subComponents
.
forEach
(
component
=>
{
decomposeComponent
(
component
,
editorRect
,
parentStyle
)
store
.
commit
(
'addComponent'
,
{
component
})
})
components
.
push
(...
component
.
propValue
)
store
.
commit
(
'batchDeleteComponent'
,
component
.
propValue
)
}
})
components
.
push
(...
component
.
propValue
)
store
.
commit
(
'batchDeleteComponent'
,
component
.
propValue
)
}
})
store
.
commit
(
'addComponent'
,
{
component
:
{
id
:
generateID
(),
component
:
'Group'
,
...
commonAttr
,
style
:
{
...
commonStyle
,
...
areaData
.
style
,
},
propValue
:
components
,
},
})
store
.
commit
(
'addComponent'
,
{
component
:
{
id
:
generateID
(),
component
:
'Group'
,
...
commonAttr
,
style
:
{
...
commonStyle
,
...
areaData
.
style
},
propValue
:
components
}
})
eventBus
.
$emit
(
'hideArea'
)
eventBus
.
$emit
(
'hideArea'
)
store
.
commit
(
'batchDeleteComponent'
,
areaData
.
components
)
store
.
commit
(
'setCurComponent'
,
{
component
:
componentData
[
componentData
.
length
-
1
],
index
:
componentData
.
length
-
1
,
})
store
.
commit
(
'batchDeleteComponent'
,
areaData
.
components
)
store
.
commit
(
'setCurComponent'
,
{
component
:
componentData
[
componentData
.
length
-
1
],
index
:
componentData
.
length
-
1
})
areaData
.
components
=
[]
},
areaData
.
components
=
[]
},
// 将已经放到 Group 组件数据删除,也就是在 componentData 中删除,因为它们已经放到 Group 组件中了
batchDeleteComponent
({
componentData
},
deleteData
)
{
deleteData
.
forEach
(
component
=>
{
for
(
let
i
=
0
,
len
=
componentData
.
length
;
i
<
len
;
i
++
)
{
if
(
component
.
id
==
componentData
[
i
].
id
)
{
componentData
.
splice
(
i
,
1
)
break
}
}
})
},
// 将已经放到 Group 组件数据删除,也就是在 componentData 中删除,因为它们已经放到 Group 组件中了
batchDeleteComponent
({
componentData
},
deleteData
)
{
deleteData
.
forEach
(
component
=>
{
for
(
let
i
=
0
,
len
=
componentData
.
length
;
i
<
len
;
i
++
)
{
if
(
component
.
id
==
componentData
[
i
].
id
)
{
componentData
.
splice
(
i
,
1
)
break
}
}
})
},
decompose
({
curComponent
,
editor
})
{
const
parentStyle
=
{
...
curComponent
.
style
}
const
components
=
curComponent
.
propValue
const
editorRect
=
editor
.
getBoundingClientRect
()
decompose
({
curComponent
,
editor
})
{
const
parentStyle
=
{
...
curComponent
.
style
}
const
components
=
curComponent
.
propValue
const
editorRect
=
editor
.
getBoundingClientRect
()
store
.
commit
(
'deleteComponent'
)
components
.
forEach
(
component
=>
{
decomposeComponent
(
component
,
editorRect
,
parentStyle
)
store
.
commit
(
'addComponent'
,
{
component
})
})
},
},
store
.
commit
(
'deleteComponent'
)
components
.
forEach
(
component
=>
{
decomposeComponent
(
component
,
editorRect
,
parentStyle
)
store
.
commit
(
'addComponent'
,
{
component
})
})
}
}
}
frontend/src/components/canvas/utils/style.js
浏览文件 @
e5715d68
import
{
sin
,
cos
}
from
'@/components/canvas/utils/translate'
export
function
getStyle
(
style
,
filter
=
[])
{
const
needUnit
=
[
'fontSize'
,
'width'
,
'height'
,
'top'
,
'left'
,
'borderWidth'
,
'letterSpacing'
,
'borderRadius'
,
]
const
result
=
{}
Object
.
keys
(
style
).
forEach
(
key
=>
{
if
(
!
filter
.
includes
(
key
))
{
if
(
key
!=
'rotate'
)
{
result
[
key
]
=
style
[
key
]
if
(
needUnit
.
includes
(
key
))
{
result
[
key
]
+=
'px'
}
}
else
{
result
.
transform
=
key
+
'('
+
style
[
key
]
+
'deg)'
}
const
needUnit
=
[
'fontSize'
,
'width'
,
'height'
,
'top'
,
'left'
,
'borderWidth'
,
'letterSpacing'
,
'borderRadius'
]
const
result
=
{}
Object
.
keys
(
style
).
forEach
(
key
=>
{
if
(
!
filter
.
includes
(
key
))
{
if
(
key
!==
'rotate'
)
{
result
[
key
]
=
style
[
key
]
if
(
needUnit
.
includes
(
key
))
{
result
[
key
]
+=
'px'
}
})
}
else
{
result
.
transform
=
key
+
'('
+
style
[
key
]
+
'deg)'
}
}
})
return
result
return
result
}
// 获取一个组件旋转 rotate 后的样式
export
function
getComponentRotatedStyle
(
style
)
{
style
=
{
...
style
}
if
(
style
.
rotate
!=
0
)
{
const
newWidth
=
style
.
width
*
cos
(
style
.
rotate
)
+
style
.
height
*
sin
(
style
.
rotate
)
const
diffX
=
(
style
.
width
-
newWidth
)
/
2
// 旋转后范围变小是正值,变大是负值
style
.
left
+=
diffX
style
.
right
=
style
.
left
+
newWidth
const
newHeight
=
style
.
height
*
cos
(
style
.
rotate
)
+
style
.
width
*
sin
(
style
.
rotate
)
const
diffY
=
(
newHeight
-
style
.
height
)
/
2
// 始终是正
style
.
top
-=
diffY
style
.
bottom
=
style
.
top
+
newHeight
style
.
width
=
newWidth
style
.
height
=
newHeight
}
else
{
style
.
bottom
=
style
.
top
+
style
.
height
style
.
right
=
style
.
left
+
style
.
width
}
return
style
style
=
{
...
style
}
if
(
style
.
rotate
!=
0
)
{
const
newWidth
=
style
.
width
*
cos
(
style
.
rotate
)
+
style
.
height
*
sin
(
style
.
rotate
)
const
diffX
=
(
style
.
width
-
newWidth
)
/
2
// 旋转后范围变小是正值,变大是负值
style
.
left
+=
diffX
style
.
right
=
style
.
left
+
newWidth
const
newHeight
=
style
.
height
*
cos
(
style
.
rotate
)
+
style
.
width
*
sin
(
style
.
rotate
)
const
diffY
=
(
newHeight
-
style
.
height
)
/
2
// 始终是正
style
.
top
-=
diffY
style
.
bottom
=
style
.
top
+
newHeight
style
.
width
=
newWidth
style
.
height
=
newHeight
}
else
{
style
.
bottom
=
style
.
top
+
style
.
height
style
.
right
=
style
.
left
+
style
.
width
}
return
style
}
frontend/src/components/widget/DeWidget/DeDrawingWidget.vue
浏览文件 @
e5715d68
<
script
>
import
{
ApplicationContext
}
from
'@/utils/ApplicationContext'
import
store
from
'@/store'
export
default
{
name
:
'DeDrawingWidget'
,
functional
:
true
,
...
...
@@ -7,25 +8,23 @@ export default {
serviceName
:
{
type
:
String
,
default
:
null
},
panelId
:
{
type
:
String
,
default
:
null
}
},
render
(
createElement
,
context
)
{
const
widgetInfo
=
ApplicationContext
.
getService
(
context
.
props
.
serviceName
)
// const widgetInfo = context.props.widgetInfo
const
panelId
=
context
.
props
.
panelId
const
dialogInfo
=
widgetInfo
.
getDialogPanel
&&
widgetInfo
.
getDialogPanel
(
panelId
)
||
null
const
dialogInfo
=
widgetInfo
.
getDialogPanel
&&
widgetInfo
.
getDialogPanel
()
||
null
const
drawInfo
=
widgetInfo
.
getDrawPanel
&&
widgetInfo
.
getDrawPanel
()
||
null
const
curComponent
=
store
.
state
.
curComponent
if
(
!
dialogInfo
)
{
throw
new
Error
(
'系统错误'
)
}
return
createElement
(
dialogInfo
.
component
,
{
props
:
{
element
:
dialogInfo
element
:
curComponent
||
drawInfo
||
dialogInfo
},
style
:
context
.
data
.
style
,
on
:
{
'value-change'
:
value
=>
{
context
.
listeners
[
'filter-value-change'
]
&&
context
.
listeners
[
'filter-value-change'
](
value
)
...
...
frontend/src/components/widget/DeWidget/DeSelect.vue
浏览文件 @
e5715d68
<
template
>
<el-select
v-if=
"options!== null && options.attrs!==null"
v-model=
"options.value"
:placeholder=
"options.attrs.placeholder"
@
change=
"changeValue"
>
<el-select
v-if=
"options!== null && options.attrs!==null"
v-model=
"options.value"
:
style=
"element.style"
:
placeholder=
"options.attrs.placeholder"
@
change=
"changeValue"
>
<el-option
v-for=
"item in options.attrs.datas"
:key=
"item[options.attrs.key]"
...
...
@@ -12,19 +12,31 @@
</
template
>
<
script
>
export
default
{
props
:
{
element
:
{
type
:
Object
,
default
:
null
},
inDraw
:
{
type
:
Boolean
,
default
:
true
}
},
data
()
{
return
{
options
:
null
options
:
null
,
operator
:
'eq'
}
},
watch
:
{
'element.style'
:
function
(
value
)
{
// console.log(value)
}
},
created
()
{
this
.
options
=
this
.
element
.
options
},
...
...
@@ -35,7 +47,7 @@ export default {
},
methods
:
{
changeValue
(
value
)
{
this
.
$emit
(
'value-change'
,
value
)
this
.
inDraw
&&
this
.
$emit
(
'set-condition-value'
,
{
component
:
this
.
element
,
value
:
value
,
operator
:
this
.
operator
}
)
}
}
}
...
...
frontend/src/components/widget/bean/Condition.js
0 → 100644
浏览文件 @
e5715d68
/**
* fieldId 字段ID
* value 字段值
* viewIds 过滤视图范围
*/
export
class
Condition
{
constructor
(
componentId
,
fieldId
,
operator
,
value
,
viewIds
)
{
this
.
componentId
=
componentId
this
.
fieldId
=
fieldId
this
.
operator
=
operator
||
'eq'
this
.
value
=
value
this
.
viewIds
=
viewIds
}
}
frontend/src/components/widget/bean/widget.js
deleted
100644 → 0
浏览文件 @
94a2395c
export
class
Widget
{
constructor
(
options
=
{})
{
this
.
type
=
options
.
type
this
.
default_style
=
options
.
default_style
this
.
icon
=
options
.
icon
this
.
lable
=
options
.
label
}
}
frontend/src/components/widget/drawServiceImpl/MySelectImpl.js
浏览文件 @
e5715d68
import
{
DrawWidgetService
}
from
'../service/DrawWidgetService'
const
leftPanel
=
{
...
...
@@ -42,39 +43,23 @@ class MySelectImpl extends DrawWidgetService {
constructor
(
options
=
{})
{
Object
.
assign
(
options
,
{
name
:
'mySelectWidget'
})
super
(
options
)
this
.
filterDialog
=
true
}
initLeftPanel
(
uuid
)
{
uuid
=
uuid
||
this
.
uuid
()
this
.
setLeftPanel
(
uuid
,
leftPanel
)
return
uuid
initLeftPanel
()
{
const
value
=
JSON
.
parse
(
JSON
.
stringify
(
leftPanel
))
return
value
// console.log('this is first initWidget')
}
initFilterDialog
(
uuid
)
{
uuid
=
uuid
||
this
.
uuid
()
this
.
setDialogPanel
(
uuid
,
dialogPanel
)
return
uuid
}
initDrawPanel
(
uuid
)
{
uuid
=
uuid
||
this
.
uuid
()
this
.
setDrawPanel
(
uuid
,
drawPanel
)
return
uuid
}
toDrawWidget
()
{
// console.log('this is first toDrawWidget')
initFilterDialog
()
{
const
value
=
JSON
.
parse
(
JSON
.
stringify
(
dialogPanel
))
return
value
}
// 移动到画布之前回掉
beforeToDraw
()
{
}
setOptionDatas
(
uuid
,
data
)
{
const
dialogPanel
=
this
.
getDialogPanel
(
uuid
)
dialogPanel
.
options
.
attrs
.
datas
=
data
this
.
setDialogPanel
(
uuid
,
dialogPanel
)
initDrawPanel
()
{
const
value
=
JSON
.
parse
(
JSON
.
stringify
(
drawPanel
))
return
value
}
filterFieldMethod
(
fields
)
{
...
...
@@ -82,6 +67,16 @@ class MySelectImpl extends DrawWidgetService {
return
field
[
'deType'
]
===
0
})
}
optionDatas
(
datas
)
{
if
(
!
datas
)
return
null
return
datas
.
map
(
item
=>
{
return
{
id
:
item
,
text
:
item
}
})
}
}
const
mySelectImpl
=
new
MySelectImpl
()
export
default
mySelectImpl
frontend/src/components/widget/service/DrawWidgetService.js
浏览文件 @
e5715d68
import
store
from
'@/store'
import
{
uuid
}
from
'vue-uuid'
export
const
commonStyle
=
{
rotate
:
0
,
opacity
:
1
...
...
@@ -15,9 +14,9 @@ export class DrawWidgetService {
constructor
(
options
)
{
this
.
options
=
options
this
.
name
=
options
.
name
this
.
leftPanelPath
=
'application/addLeftWidget'
this
.
dialogPanelPath
=
'application/addDialogWidget'
this
.
drawPanelPath
=
'application/addDrawWidget'
//
this.leftPanelPath = 'application/addLeftWidget'
//
this.dialogPanelPath = 'application/addDialogWidget'
//
this.drawPanelPath = 'application/addDrawWidget'
this
.
storeWidget
()
}
/**
...
...
@@ -28,56 +27,26 @@ export class DrawWidgetService {
store
(
path
,
data
)
{
store
.
dispatch
(
path
,
data
)
}
uuid
()
{
return
uuid
.
v1
()
}
setLeftPanel
(
uuid
,
leftPanel
)
{
this
.
store
(
this
.
leftPanelPath
,
{
uuid
:
uuid
,
leftPanel
:
leftPanel
})
}
getLeftPanel
(
uuid
)
{
if
(
!
store
.
getters
.
leftWidgetMap
[
uuid
])
{
this
.
initLeftPanel
&&
this
.
initLeftPanel
(
uuid
)
}
return
store
.
getters
.
leftWidgetMap
[
uuid
]
}
setDialogPanel
(
uuid
,
dialogPanel
)
{
this
.
store
(
this
.
dialogPanelPath
,
{
uuid
:
uuid
,
dialogPanel
:
dialogPanel
})
}
getDialogPanel
(
uuid
)
{
if
(
!
store
.
getters
.
dialogWidgetMap
[
uuid
])
{
this
.
initFilterDialog
&&
this
.
initFilterDialog
(
uuid
)
}
return
store
.
getters
.
dialogWidgetMap
[
uuid
]
getLeftPanel
()
{
return
this
.
initLeftPanel
()
}
setDrawPanel
(
uuid
,
drawPanel
)
{
if
(
!
store
.
getters
.
drawWidgetMap
[
uuid
])
{
// 第一次
drawPanel
.
style
=
Object
.
assign
(
drawPanel
.
style
,
commonStyle
)
drawPanel
=
Object
.
assign
(
drawPanel
,
commonAttr
)
if
(
this
.
initFilterDialog
)
{
// 需要弹窗
const
dialogOptions
=
this
.
getDialogPanel
(
uuid
)
drawPanel
=
Object
.
assign
(
drawPanel
,
dialogOptions
)
}
}
this
.
store
(
this
.
drawPanelPath
,
{
uuid
:
uuid
,
drawPanel
:
drawPanel
})
getDialogPanel
()
{
return
this
.
initFilterDialog
()
}
getDrawPanel
(
uuid
)
{
if
(
!
store
.
getters
.
drawWidgetMap
[
uuid
])
{
this
.
initDrawPanel
&&
this
.
initDrawPanel
(
uuid
)
getDrawPanel
()
{
let
drawPanel
=
this
.
initDrawPanel
()
drawPanel
.
style
=
Object
.
assign
(
drawPanel
.
style
,
commonStyle
)
drawPanel
=
Object
.
assign
(
drawPanel
,
commonAttr
)
if
(
this
.
filterDialog
)
{
const
dialogOptions
=
this
.
getDialogPanel
()
drawPanel
=
Object
.
assign
(
drawPanel
,
dialogOptions
)
}
return
store
.
getters
.
drawWidgetMap
[
uuid
]
return
drawPanel
}
storeWidget
()
{
// store.dispatch('application/loadBean', { key: this.name, value: this })
this
.
store
(
'application/loadBean'
,
{
key
:
this
.
name
,
value
:
this
})
}
initWidget
()
{
console
.
log
(
'this is initWidget'
)
}
toDrawWidget
()
{
console
.
log
(
'this is toDrawWidget'
)
}
}
frontend/src/views/panel/edit/index.vue
浏览文件 @
e5715d68
...
...
@@ -74,13 +74,20 @@
:visible
.
sync=
"filterVisible"
custom-class=
"de-filter-dialog"
>
<filter-dialog
v-if=
"filterVisible && currentWidget"
:widget-info=
"currentWidget"
@
re-fresh-component=
"reFreshComponent"
>
<de-drawing-widget
<filter-dialog
v-if=
"filterVisible && currentWidget"
:widget-info=
"currentWidget"
:component-info=
"currentFilterCom"
@
re-fresh-component=
"reFreshComponent"
>
<
!--
<
de-drawing-widget
v-if=
"filterVisible"
style=
"width: 100% !important;"
class=
"component"
:service-name=
"currentWidget.name"
:panel-id=
"panelInfo.id"
/>
-->
<component
:is=
"currentFilterCom.component"
:id=
"'component' + currentFilterCom.id"
class=
"component"
:style=
"currentFilterCom.style"
:element=
"currentFilterCom"
:in-draw=
"false"
/>
</filter-dialog>
<!--
<div
slot=
"footer"
class=
"dialog-footer"
>
...
...
@@ -143,7 +150,8 @@ export default {
activeName
:
'attr'
,
reSelectAnimateIndex
:
undefined
,
filterVisible
:
false
,
currentWidget
:
null
currentWidget
:
null
,
currentFilterCom
:
null
}
},
...
...
@@ -171,7 +179,6 @@ export default {
}
},
panelInfo
(
newVal
,
oldVal
)
{
debugger
this
.
init
(
newVal
.
id
)
}
},
...
...
@@ -193,7 +200,6 @@ export default {
},
methods
:
{
init
(
panelId
)
{
debugger
// 如果临时画布有数据 则使用临时画布数据(视图编辑的时候 会保存临时画布数据)
const
componentDataTemp
=
this
.
$store
.
state
.
panel
.
componentDataTemp
const
canvasStyleDataTemp
=
this
.
$store
.
state
.
panel
.
canvasStyleDataTemp
...
...
@@ -267,17 +273,16 @@ export default {
}
else
{
this
.
currentWidget
=
ApplicationContext
.
getService
(
componentInfo
.
id
)
const
drawPanel
=
this
.
currentWidget
.
getDrawPanel
(
this
.
panelInfo
.
id
)
drawPanel
.
style
.
top
=
e
.
offsetY
drawPanel
.
style
.
left
=
e
.
offsetX
drawPanel
.
id
=
newComponentId
this
.
currentWidget
.
setDrawPanel
(
this
.
panelInfo
.
id
,
drawPanel
)
if
(
this
.
currentWidget
.
initFilterDialog
)
{
this
.
currentFilterCom
=
this
.
currentWidget
.
getDrawPanel
(
this
.
panelInfo
.
id
)
this
.
currentFilterCom
.
style
.
top
=
e
.
offsetY
this
.
currentFilterCom
.
style
.
left
=
e
.
offsetX
this
.
currentFilterCom
.
id
=
newComponentId
if
(
this
.
currentWidget
.
filterDialog
)
{
this
.
show
=
false
this
.
openFilterDiolog
()
return
}
component
=
deepCopy
(
drawPanel
)
component
=
deepCopy
(
this
.
currentFilterCom
)
}
component
.
style
.
top
=
e
.
offsetY
...
...
@@ -285,6 +290,11 @@ export default {
component
.
id
=
newComponentId
this
.
$store
.
commit
(
'addComponent'
,
{
component
})
this
.
$store
.
commit
(
'recordSnapshot'
)
this
.
clearCurrentInfo
()
},
clearCurrentInfo
()
{
this
.
currentWidget
=
null
this
.
currentFilterCom
=
null
},
handleDragOver
(
e
)
{
...
...
@@ -316,17 +326,16 @@ export default {
cancelFilter
()
{
this
.
filterVisible
=
false
this
.
currentWidget
=
null
this
.
clearCurrentInfo
()
},
sureFilter
()
{
const
currentComponent
=
this
.
currentWidget
.
getDrawPanel
(
this
.
panelInfo
.
id
)
currentComponent
.
widgetService
=
this
.
currentWidget
const
component
=
deepCopy
(
currentComponent
)
const
component
=
deepCopy
(
this
.
currentFilterCom
)
this
.
$store
.
commit
(
'addComponent'
,
{
component
})
this
.
$store
.
commit
(
'recordSnapshot'
)
this
.
cancelFilter
()
},
reFreshComponent
(
component
)
{
this
.
current
Component
=
component
this
.
current
FilterCom
=
component
}
}
}
...
...
frontend/src/views/panel/filter/filterDialog.vue
浏览文件 @
e5715d68
...
...
@@ -160,6 +160,10 @@ export default {
widgetInfo
:
{
type
:
Object
,
default
:
null
},
componentInfo
:
{
type
:
Object
,
default
:
null
}
},
data
()
{
...
...
@@ -181,22 +185,17 @@ export default {
fieldValues
:
[]
}
},
computed
:
{
uuid
()
{
return
this
.
$store
.
state
.
panel
.
panelInfo
.
id
}
},
watch
:
{
selectField
(
values
)
{
if
(
values
&&
values
.
length
>
0
)
{
const
value
=
values
[
0
]
const
fieldId
=
value
.
id
this
.
widget
&&
this
.
widget
.
setOptionDatas
&&
fieldValues
(
fieldId
).
then
(
res
=>
{
const
datas
=
res
.
data
.
map
(
item
=>
{
return
{
id
:
item
,
text
:
item
}
})
this
.
widget
.
setOptionDatas
(
this
.
uuid
,
datas
)
// this.$emit('re-fresh-component', this.componentInfo)
const
info
=
this
.
componentInfo
this
.
widget
&&
fieldValues
(
fieldId
).
then
(
res
=>
{
info
.
options
.
attrs
.
datas
=
this
.
widget
.
optionDatas
(
res
.
data
)
info
.
options
.
attrs
.
fieldId
=
fieldId
this
.
$emit
(
're-fresh-component'
,
info
)
})
}
}
...
...
frontend/src/views/panel/filter/index.vue
浏览文件 @
e5715d68
...
...
@@ -65,10 +65,8 @@ export default {
const
widgetNames
=
this
.
widgetSubjects
[
key
]
this
.
widgetSubjects
[
key
]
=
widgetNames
.
map
(
widgetName
=>
{
const
widget
=
ApplicationContext
.
getService
(
widgetName
)
const
uuid
=
this
.
panelInfo
.
id
// widget.initLeftPanel(uuid)
const
result
=
{
widgetName
:
widgetName
}
Object
.
assign
(
result
,
widget
.
getLeftPanel
(
uuid
))
Object
.
assign
(
result
,
widget
.
getLeftPanel
())
return
result
})
}
...
...
frontend/src/views/panel/list/PanelViewShow.vue
浏览文件 @
e5715d68
...
...
@@ -69,7 +69,6 @@ export default {
},
saveToTemplate
()
{
html2canvas
(
this
.
$refs
.
imageWrapper
).
then
(
canvas
=>
{
debugger
const
snapShot
=
canvas
.
toDataURL
(
'image/jpeg'
,
0.5
)
// 0.5是图片质量
if
(
snapShot
!==
''
)
{
const
templateInfo
=
{
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论