forked from github/dataease
feat: 过滤条件
This commit is contained in:
fit2cloud-chenyw
parent
fb53686109
commit
5ec60144e8
@ -13,27 +13,24 @@
|
||||
export default {
|
||||
|
||||
props: {
|
||||
options: {
|
||||
element: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
inDraw: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
options: null,
|
||||
operator: 'eq',
|
||||
values: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
// this.defaultOptions = Object.assign({}, this.options)
|
||||
// const dom = this.$refs[this.options.refId]
|
||||
// for (const key in this.options.attrs) {
|
||||
// if (Object.hasOwnProperty.call(this.defaultOptions.attrs, key)) {
|
||||
// const element = this.defaultOptions.attrs[key]
|
||||
// dom.$props[key] = element
|
||||
// }
|
||||
// }
|
||||
})
|
||||
created() {
|
||||
this.options = this.element.options
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -14,10 +14,24 @@
|
||||
export default {
|
||||
|
||||
props: {
|
||||
options: {
|
||||
element: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
inDraw: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
options: null,
|
||||
operator: 'eq',
|
||||
values: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.options = this.element.options
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,39 +0,0 @@
|
||||
<script>
|
||||
import { ApplicationContext } from '@/utils/ApplicationContext'
|
||||
import store from '@/store'
|
||||
export default {
|
||||
name: 'DeDrawingWidget',
|
||||
functional: true,
|
||||
props: {
|
||||
serviceName: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
|
||||
render(createElement, context) {
|
||||
const widgetInfo = ApplicationContext.getService(context.props.serviceName)
|
||||
// const widgetInfo = context.props.widgetInfo
|
||||
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: curComponent || drawInfo || dialogInfo
|
||||
},
|
||||
style: context.data.style,
|
||||
on: {
|
||||
'value-change': value => {
|
||||
context.listeners['filter-value-change'] && context.listeners['filter-value-change'](value)
|
||||
}
|
||||
}
|
||||
},
|
||||
context.data,
|
||||
context.children
|
||||
)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
|
||||
<el-input v-if="options!== null && options.attrs!==null" v-model="options.value" style="width:260px;" :placeholder="options.attrs.placeholder">
|
||||
<el-input v-if="options!== null && options.attrs!==null" v-model="options.value" style="width: 260px" :placeholder="options.attrs.placeholder">
|
||||
|
||||
<el-button slot="append" icon="el-icon-search" />
|
||||
</el-input>
|
||||
@ -11,20 +11,24 @@
|
||||
export default {
|
||||
|
||||
props: {
|
||||
options: {
|
||||
element: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
inDraw: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
options: null,
|
||||
operator: 'eq',
|
||||
values: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
|
||||
})
|
||||
created() {
|
||||
this.options = this.element.options
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -11,10 +11,24 @@
|
||||
export default {
|
||||
|
||||
props: {
|
||||
options: {
|
||||
element: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
inDraw: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
options: null,
|
||||
operator: 'eq',
|
||||
values: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.options = this.element.options
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,83 +0,0 @@
|
||||
|
||||
import { DrawWidgetService } from '../service/DrawWidgetService'
|
||||
|
||||
const leftPanel = {
|
||||
// name: 'text-select',
|
||||
icon: 'iconfont icon-xialakuang',
|
||||
label: '文本下拉',
|
||||
defaultClass: 'text-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
multiple: false,
|
||||
placeholder: '请选择',
|
||||
datas: [],
|
||||
key: 'id',
|
||||
label: 'text',
|
||||
value: 'id'
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'text-filter',
|
||||
component: 'de-select'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
component: 'de-select'
|
||||
}
|
||||
|
||||
class MySelectImpl extends DrawWidgetService {
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'mySelectWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = true
|
||||
}
|
||||
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
filterFieldMethod(fields) {
|
||||
return fields.filter(field => {
|
||||
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
|
||||
@ -31,8 +31,8 @@ requireComponent.keys().forEach(fileName => {
|
||||
)
|
||||
})
|
||||
|
||||
// const req = require.context('./serviceImpl', false, /\.js$/)
|
||||
const req = require.context('./drawServiceImpl', false, /\.js$/)
|
||||
const req = require.context('./serviceImpl', false, /\.js$/)
|
||||
// const req = require.context('./drawServiceImpl', false, /\.js$/)
|
||||
const requireAll = requireContext => requireContext.keys()
|
||||
|
||||
const widgets = {}
|
||||
|
||||
@ -1,53 +0,0 @@
|
||||
import store from '@/store'
|
||||
export const commonStyle = {
|
||||
rotate: 0,
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
export const commonAttr = {
|
||||
animations: [],
|
||||
events: {},
|
||||
groupStyle: {}, // 当一个组件成为 Group 的子组件时使用
|
||||
isLock: false // 是否锁定组件
|
||||
}
|
||||
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.storeWidget()
|
||||
}
|
||||
/**
|
||||
* 存储数据到本地
|
||||
* @param {本地存储路径} path
|
||||
* @param {要存储的数据} data
|
||||
*/
|
||||
store(path, data) {
|
||||
store.dispatch(path, data)
|
||||
}
|
||||
|
||||
getLeftPanel() {
|
||||
return this.initLeftPanel()
|
||||
}
|
||||
|
||||
getDialogPanel() {
|
||||
return this.initFilterDialog()
|
||||
}
|
||||
|
||||
getDrawPanel() {
|
||||
let drawPanel = this.initDrawPanel()
|
||||
drawPanel.serviceName = this.options.name
|
||||
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 drawPanel
|
||||
}
|
||||
storeWidget() {
|
||||
this.store('application/loadBean', { key: this.name, value: this })
|
||||
}
|
||||
}
|
||||
@ -12,20 +12,42 @@ export const commonAttr = {
|
||||
}
|
||||
export class WidgetService {
|
||||
constructor(options) {
|
||||
this.options = options
|
||||
this.name = options.name
|
||||
options = { ...commonAttr, ...options }
|
||||
Object.assign(this, options)
|
||||
this.style = { ...commonStyle, ...options.style }
|
||||
this.type = 'custom'
|
||||
// this.leftPanelPath = 'application/addLeftWidget'
|
||||
// this.dialogPanelPath = 'application/addDialogWidget'
|
||||
// this.drawPanelPath = 'application/addDrawWidget'
|
||||
this.storeWidget()
|
||||
}
|
||||
/**
|
||||
* 存储数据到本地
|
||||
* @param {本地存储路径} path
|
||||
* @param {要存储的数据} data
|
||||
*/
|
||||
store(path, data) {
|
||||
store.dispatch(path, data)
|
||||
}
|
||||
|
||||
getLeftPanel() {
|
||||
return this.initLeftPanel()
|
||||
}
|
||||
|
||||
getDialogPanel() {
|
||||
return this.initFilterDialog()
|
||||
}
|
||||
|
||||
getDrawPanel() {
|
||||
let drawPanel = this.initDrawPanel()
|
||||
drawPanel.serviceName = this.options.name
|
||||
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 drawPanel
|
||||
}
|
||||
storeWidget() {
|
||||
store.dispatch('application/loadBean', { key: this.name, value: this })
|
||||
}
|
||||
initWidget() {
|
||||
console.log('this is initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
console.log('this is toDrawWidget')
|
||||
this.store('application/loadBean', { key: this.name, value: this })
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,50 +1,50 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'buttonSureWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-chaxunsousuo',
|
||||
label: '确定',
|
||||
defaultClass: 'time-filter'
|
||||
}
|
||||
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 100,
|
||||
height: 34,
|
||||
borderWidth: '',
|
||||
borderColor: '',
|
||||
borderRadius: '',
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: '',
|
||||
backgroundColor: ''
|
||||
color: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-button',
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
type: 'primary',
|
||||
round: true
|
||||
},
|
||||
value: '测试按钮'
|
||||
}
|
||||
},
|
||||
component: 'de-button'
|
||||
}
|
||||
|
||||
class ButtonSureServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'buttonSureWidget' })
|
||||
super(options)
|
||||
this.filterDialog = false
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
// console.log('this is first initWidget')
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
}
|
||||
const buttonSureServiceImpl = new ButtonSureServiceImpl({ name: 'buttonSureWidget' })
|
||||
const buttonSureServiceImpl = new ButtonSureServiceImpl()
|
||||
export default buttonSureServiceImpl
|
||||
|
||||
@ -1,65 +1,65 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'textInputWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-shuru',
|
||||
label: '文本搜索',
|
||||
defaultClass: 'text-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
attrs: {
|
||||
placeholder: '请选择'
|
||||
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'text-filter',
|
||||
component: 'de-input-search'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 100,
|
||||
height: 34,
|
||||
borderWidth: '',
|
||||
borderColor: '',
|
||||
borderRadius: '',
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: '',
|
||||
backgroundColor: ''
|
||||
color: ''
|
||||
},
|
||||
defaultClass: 'text-filter',
|
||||
component: 'de-input-search',
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
placeholder: '请输入关键字'
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
filterDialog: true
|
||||
component: 'de-input-search'
|
||||
}
|
||||
|
||||
class TextInputServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'textInputWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
// console.log('this is first initWidget')
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
dynamicStype() {
|
||||
return {
|
||||
'background-color': 'rgba(35,190,239,.1)'
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
filterFieldMethod(fields) {
|
||||
return fields.filter(field => {
|
||||
return field['deType'] === 0
|
||||
})
|
||||
}
|
||||
// dynamicIconStype() {
|
||||
// return {
|
||||
// color: '#23beef'
|
||||
// }
|
||||
// }
|
||||
}
|
||||
const textInputServiceImpl = new TextInputServiceImpl({ name: 'textInputWidget' })
|
||||
const textInputServiceImpl = new TextInputServiceImpl()
|
||||
export default textInputServiceImpl
|
||||
|
||||
@ -1,20 +1,14 @@
|
||||
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'textSelectWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-xialakuang',
|
||||
label: '文本下拉',
|
||||
style: {
|
||||
width: 200,
|
||||
height: 22,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
defaultClass: 'text-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
multiple: false,
|
||||
placeholder: '请选择',
|
||||
@ -26,29 +20,44 @@ const defaultOptions = {
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'text-filter',
|
||||
component: 'de-select',
|
||||
filterDialog: true
|
||||
component: 'de-select'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
component: 'de-select'
|
||||
}
|
||||
|
||||
class TextSelectServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'textSelectWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = true
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
setOptionDatas(data) {
|
||||
this.options.attrs.datas = data
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
filterFieldMethod(fields) {
|
||||
@ -56,6 +65,16 @@ class TextSelectServiceImpl extends WidgetService {
|
||||
return field['deType'] === 0
|
||||
})
|
||||
}
|
||||
|
||||
optionDatas(datas) {
|
||||
if (!datas) return null
|
||||
return datas.map(item => {
|
||||
return {
|
||||
id: item,
|
||||
text: item
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
const textSelectServiceImpl = new TextSelectServiceImpl({ name: 'textSelectWidget' })
|
||||
const textSelectServiceImpl = new TextSelectServiceImpl()
|
||||
export default textSelectServiceImpl
|
||||
|
||||
@ -1,20 +1,13 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'timeDateRangeWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-riqi',
|
||||
label: '日期范围',
|
||||
style: {
|
||||
width: 200,
|
||||
height: 22,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
defaultClass: 'time-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
type: 'daterange',
|
||||
rangeSeparator: '至',
|
||||
@ -24,25 +17,45 @@ const defaultOptions = {
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-date',
|
||||
filterDialog: true
|
||||
component: 'de-date'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
component: 'de-date'
|
||||
}
|
||||
|
||||
class TimeDateRangeServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'timeDateRangeWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
filterFieldMethod(fields) {
|
||||
return fields.filter(field => {
|
||||
@ -50,5 +63,5 @@ class TimeDateRangeServiceImpl extends WidgetService {
|
||||
})
|
||||
}
|
||||
}
|
||||
const timeDateRangeServiceImpl = new TimeDateRangeServiceImpl({ name: 'timeDateRangeWidget' })
|
||||
const timeDateRangeServiceImpl = new TimeDateRangeServiceImpl()
|
||||
export default timeDateRangeServiceImpl
|
||||
|
||||
@ -1,11 +1,27 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'timeDateWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-ri',
|
||||
label: '日期',
|
||||
defaultClass: 'time-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
attrs: {
|
||||
type: 'date',
|
||||
placeholder: '请选择日期'
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-date'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 200,
|
||||
height: 22,
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
@ -13,35 +29,31 @@ const defaultOptions = {
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
type: 'date',
|
||||
placeholder: '请选择日期'
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-date',
|
||||
filterDialog: true
|
||||
component: 'de-date'
|
||||
}
|
||||
|
||||
class TimeDateServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'timeDateWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
filterFieldMethod(fields) {
|
||||
return fields.filter(field => {
|
||||
|
||||
@ -1,20 +1,13 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'timeMonthWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-yue',
|
||||
label: '年月',
|
||||
style: {
|
||||
width: 200,
|
||||
height: 22,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
defaultClass: 'time-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
type: 'month',
|
||||
placeholder: '请选择年月'
|
||||
@ -22,25 +15,45 @@ const defaultOptions = {
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-date',
|
||||
filterDialog: true
|
||||
component: 'de-date'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
component: 'de-date'
|
||||
}
|
||||
|
||||
class TimeMonthServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'timeMonthWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
filterFieldMethod(fields) {
|
||||
return fields.filter(field => {
|
||||
@ -48,5 +61,5 @@ class TimeMonthServiceImpl extends WidgetService {
|
||||
})
|
||||
}
|
||||
}
|
||||
const timeMonthServiceImpl = new TimeMonthServiceImpl({ name: 'timeMonthWidget' })
|
||||
const timeMonthServiceImpl = new TimeMonthServiceImpl()
|
||||
export default timeMonthServiceImpl
|
||||
|
||||
@ -1,11 +1,26 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'timeQuarterWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-jidu',
|
||||
label: '季度',
|
||||
defaultClass: 'time-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
attrs: {
|
||||
placeholder: '请选择年份'
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-quarter'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 200,
|
||||
height: 22,
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
@ -13,34 +28,31 @@ const defaultOptions = {
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
|
||||
placeholder: '请选择季度'
|
||||
},
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-quarter',
|
||||
filterDialog: true
|
||||
component: 'de-quarter'
|
||||
}
|
||||
|
||||
class TimeQuarterServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'timeQuarterWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
filterFieldMethod(fields) {
|
||||
return fields.filter(field => {
|
||||
@ -48,5 +60,5 @@ class TimeQuarterServiceImpl extends WidgetService {
|
||||
})
|
||||
}
|
||||
}
|
||||
const timeQuarterServiceImpl = new TimeQuarterServiceImpl({ name: 'timeQuarterWidget' })
|
||||
const timeQuarterServiceImpl = new TimeQuarterServiceImpl()
|
||||
export default timeQuarterServiceImpl
|
||||
|
||||
@ -1,20 +1,13 @@
|
||||
import { WidgetService } from '../service/WidgetService'
|
||||
const defaultOptions = {
|
||||
name: 'timeYearWidget',
|
||||
|
||||
const leftPanel = {
|
||||
icon: 'iconfont icon-nian',
|
||||
label: '年份',
|
||||
style: {
|
||||
width: 200,
|
||||
height: 22,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
defaultClass: 'time-filter'
|
||||
}
|
||||
|
||||
const dialogPanel = {
|
||||
options: {
|
||||
refId: '1234567890',
|
||||
attrs: {
|
||||
type: 'year',
|
||||
placeholder: '请选择年份'
|
||||
@ -22,25 +15,45 @@ const defaultOptions = {
|
||||
value: ''
|
||||
},
|
||||
defaultClass: 'time-filter',
|
||||
component: 'de-date',
|
||||
filterDialog: true
|
||||
component: 'de-date'
|
||||
}
|
||||
const drawPanel = {
|
||||
type: 'custom',
|
||||
style: {
|
||||
width: 300,
|
||||
height: 35,
|
||||
fontSize: 14,
|
||||
fontWeight: 500,
|
||||
lineHeight: '',
|
||||
letterSpacing: 0,
|
||||
textAlign: '',
|
||||
color: ''
|
||||
},
|
||||
component: 'de-date'
|
||||
}
|
||||
|
||||
class TimeYearServiceImpl extends WidgetService {
|
||||
constructor(options) {
|
||||
Object.assign(options, defaultOptions)
|
||||
constructor(options = {}) {
|
||||
Object.assign(options, { name: 'timeYearWidget' })
|
||||
super(options)
|
||||
this.filterDialog = true
|
||||
this.showSwitch = false
|
||||
}
|
||||
|
||||
initWidget() {
|
||||
initLeftPanel() {
|
||||
const value = JSON.parse(JSON.stringify(leftPanel))
|
||||
return value
|
||||
// console.log('this is first initWidget')
|
||||
}
|
||||
toDrawWidget() {
|
||||
// console.log('this is first toDrawWidget')
|
||||
}
|
||||
// 移动到画布之前回掉
|
||||
beforeToDraw() {
|
||||
|
||||
initFilterDialog() {
|
||||
const value = JSON.parse(JSON.stringify(dialogPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
initDrawPanel() {
|
||||
const value = JSON.parse(JSON.stringify(drawPanel))
|
||||
return value
|
||||
}
|
||||
|
||||
filterFieldMethod(fields) {
|
||||
@ -49,5 +62,5 @@ class TimeYearServiceImpl extends WidgetService {
|
||||
})
|
||||
}
|
||||
}
|
||||
const timeYearServiceImpl = new TimeYearServiceImpl({ name: 'timeYearWidget' })
|
||||
const timeYearServiceImpl = new TimeYearServiceImpl()
|
||||
export default timeYearServiceImpl
|
||||
|
||||
@ -237,12 +237,18 @@ export default {
|
||||
if (values && values.length > 0) {
|
||||
const value = values[0]
|
||||
const fieldId = value.id
|
||||
this.widget && fieldValues(fieldId).then(res => {
|
||||
this.componentInfo.options.attrs.datas = this.widget.optionDatas(res.data)
|
||||
if (this.widget && this.widget.optionDatas) {
|
||||
fieldValues(fieldId).then(res => {
|
||||
this.componentInfo.options.attrs.datas = this.widget.optionDatas(res.data)
|
||||
this.componentInfo.options.attrs.fieldId = fieldId
|
||||
this.componentInfo.options.attrs.dragItems = values
|
||||
this.$emit('re-fresh-component', this.componentInfo)
|
||||
})
|
||||
} else {
|
||||
this.componentInfo.options.attrs.fieldId = fieldId
|
||||
this.componentInfo.options.attrs.dragItems = values
|
||||
this.$emit('re-fresh-component', this.componentInfo)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -36,28 +36,28 @@ export default {
|
||||
return {
|
||||
componentList,
|
||||
panelInfo: this.$store.state.panel.panelInfo,
|
||||
// widgetSubjects: {
|
||||
// '文本过滤组件': [
|
||||
// 'mySelectWidget'
|
||||
// ]
|
||||
// }
|
||||
widgetSubjects: {
|
||||
'时间过滤组件': [
|
||||
'timeYearWidget',
|
||||
'timeMonthWidget',
|
||||
'timeQuarterWidget',
|
||||
'timeDateWidget',
|
||||
'timeDateRangeWidget'
|
||||
|
||||
],
|
||||
'文本过滤组件': [
|
||||
'mySelectWidget'
|
||||
'textSelectWidget',
|
||||
'textInputWidget'
|
||||
],
|
||||
'按钮': [
|
||||
'buttonSureWidget'
|
||||
]
|
||||
}
|
||||
// widgetSubjects: {
|
||||
// '时间过滤组件': [
|
||||
// 'timeYearWidget',
|
||||
// 'timeMonthWidget',
|
||||
// 'timeQuarterWidget',
|
||||
// 'timeDateWidget',
|
||||
// 'timeDateRangeWidget'
|
||||
|
||||
// ],
|
||||
// '文本过滤组件': [
|
||||
// 'textSelectWidget',
|
||||
// 'textInputWidget'
|
||||
// ],
|
||||
// '按钮': [
|
||||
// 'buttonSureWidget'
|
||||
// ]
|
||||
// }
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user