feat: 年份、年月组件增加动态时间

This commit is contained in:
fit2cloud-chenyw 2022-01-11 16:30:47 +08:00
parent 7c75816e10
commit 7d9214c203
11 changed files with 227 additions and 55 deletions

View File

@ -3,6 +3,10 @@ import {
HYPERLINKS
} from '@/components/canvas/custom-component/component-list'
import {
ApplicationContext
} from '@/utils/ApplicationContext'
export function deepCopy(target) {
if (typeof target === 'object') {
const result = Array.isArray(target) ? [] : {}
@ -62,25 +66,10 @@ export function mobile2MainCanvas(mainSource, mobileSource) {
export function panelInit(componentDatas) {
componentDatas.forEach(item => {
if (item.component && item.component === 'de-date') {
if (item.serviceName === 'timeDateWidget' && item.options.attrs && !item.options.attrs.default) {
item.options.attrs.default = {
isDynamic: false,
dkey: 0,
dynamicPrefix: 1,
dynamicInfill: 'day',
dynamicSuffix: 'before'
}
}
if (item.serviceName === 'timeDateRangeWidget' && item.options.attrs && !item.options.attrs.default) {
item.options.attrs.default = {
isDynamic: false,
dkey: 0,
sDynamicPrefix: 1,
sDynamicInfill: 'day',
sDynamicSuffix: 'before',
eDynamicPrefix: 1,
eDynamicInfill: 'day',
eDynamicSuffix: 'after'
if (item.options.attrs && !item.options.attrs.default) {
const widget = ApplicationContext.getService(item.serviceName)
if (widget && widget.defaultSetting) {
item.options.attrs.default = widget.defaultSetting()
}
}
}

View File

@ -72,9 +72,7 @@ export default {
this.setCondition()
},
'defaultValueStr': function(value, old) {
if ((this.element.serviceName === 'timeDateWidget' || this.element.serviceName === 'timeDateRangeWidget') &&
this.element.options.attrs.default.isDynamic) {
//
if (this.element.options.attrs.default.isDynamic) {
return
}
if (value === old) return
@ -82,13 +80,10 @@ export default {
this.dateChange(value)
},
'defaultoptions': function(val, old) {
// console.log('default chaneg')
if (this.element.serviceName !== 'timeDateWidget' || this.element.serviceName === 'timeDateRangeWidget') {
if (!this.element.options.attrs.default.isDynamic) {
this.values = this.fillValueDerfault()
this.dateChange(this.values)
return
}
if (!this.element.options.attrs.default.isDynamic) {
this.values = this.fillValueDerfault()
this.dateChange(this.values)
return
}
if (val === old) return
const widget = ApplicationContext.getService(this.element.serviceName)
@ -97,9 +92,7 @@ export default {
}
},
created() {
if ((this.element.serviceName === 'timeDateWidget' || this.element.serviceName === 'timeDateRangeWidget') && this
.element.options.attrs.default && this.element.options
.attrs.default.isDynamic) {
if (this.element.options.attrs.default && this.element.options.attrs.default.isDynamic) {
if (this.element.options.attrs.default) {
const widget = ApplicationContext.getService(this.element.serviceName)
this.values = widget.dynamicDateFormNow(this.element)

View File

@ -80,6 +80,9 @@ class TimeDateRangeServiceImpl extends WidgetService {
return field['deType'] === 1
})
}
defaultSetting() {
return dialogPanel.options.attrs.default
}
getStartDayOfWeek() {
var now = new Date() // 当前日期
var nowDayOfWeek = now.getDay()

View File

@ -21,7 +21,23 @@ const dialogPanel = {
dkey: 0,
dynamicPrefix: 1,
dynamicInfill: 'day',
dynamicSuffix: 'before'
dynamicSuffix: 'before',
radioOptions: [{ value: false, text: 'dynamic_time.fix' }, { value: true, text: 'dynamic_time.dynamic' }],
relativeOptions: [
{ value: 0, text: 'dynamic_time.today' },
{ value: 1, text: 'dynamic_time.yesterday' },
{ value: 2, text: 'dynamic_time.firstOfMonth' },
{ value: 3, text: 'dynamic_time.custom' }
],
custom: {
unitsOptions: [
{ value: 'day', text: 'dynamic_time.date' },
{ value: 'week', text: 'dynamic_time.week' },
{ value: 'month', text: 'dynamic_time.month' },
{ value: 'year', text: 'dynamic_time.year' }
],
limits: [1, 12]
}
}
},
value: ''
@ -75,6 +91,9 @@ class TimeDateServiceImpl extends WidgetService {
return field['deType'] === 1
})
}
defaultSetting() {
return dialogPanel.options.attrs.default
}
dynamicDateFormNow(element) {
if (element.options.attrs.default === null || typeof element.options.attrs.default === 'undefined' || !element.options.attrs.default.isDynamic) return null

View File

@ -13,7 +13,27 @@ const dialogPanel = {
placeholder: 'deyearmonth.placeholder',
viewIds: [],
fieldId: '',
dragItems: []
dragItems: [],
default: {
isDynamic: false,
dkey: 0,
dynamicPrefix: 1,
dynamicInfill: 'month',
dynamicSuffix: 'before',
radioOptions: [{ value: false, text: 'dynamic_month.fix' }, { value: true, text: 'dynamic_month.dynamic' }],
relativeOptions: [
{ value: 0, text: 'dynamic_month.current' },
{ value: 1, text: 'dynamic_month.last' },
{ value: 2, text: 'dynamic_month.firstOfYear' },
{ value: 3, text: 'dynamic_time.custom' }
],
custom: {
unitsOptions: [
{ value: 'month', text: 'dynamic_time.month' }
],
limits: [0, 10]
}
}
},
value: ''
},
@ -64,6 +84,39 @@ class TimeMonthServiceImpl extends WidgetService {
return field['deType'] === 1
})
}
defaultSetting() {
return dialogPanel.options.attrs.default
}
dynamicDateFormNow(element) {
const now = new Date()
const nowMonth = now.getMonth()
const nowYear = now.getFullYear()
const nowDate = now.getDate()
if (element.options.attrs.default === null || typeof element.options.attrs.default === 'undefined' || !element.options.attrs.default.isDynamic) return null
if (element.options.attrs.default.dkey === 0) {
return Date.now()
}
if (element.options.attrs.default.dkey === 1) {
return new Date(nowYear, nowMonth - 1, nowDate).getTime()
}
if (element.options.attrs.default.dkey === 2) {
return new Date(nowYear, 0, 1).getTime()
}
if (element.options.attrs.default.dkey === 3) {
const dynamicPrefix = parseInt(element.options.attrs.default.dynamicPrefix)
const dynamicSuffix = element.options.attrs.default.dynamicSuffix
if (dynamicSuffix === 'before') {
return new Date(nowYear, nowMonth - dynamicPrefix, nowDate).getTime()
} else {
return new Date(nowYear, nowMonth + dynamicPrefix, nowDate).getTime()
}
}
}
}
const timeMonthServiceImpl = new TimeMonthServiceImpl()
export default timeMonthServiceImpl

View File

@ -13,7 +13,26 @@ const dialogPanel = {
placeholder: 'deyear.placeholder',
viewIds: [],
fieldId: '',
dragItems: []
dragItems: [],
default: {
isDynamic: false,
dkey: 0,
dynamicPrefix: 1,
dynamicInfill: 'year',
dynamicSuffix: 'before',
radioOptions: [{ value: false, text: 'dynamic_year.fix' }, { value: true, text: 'dynamic_year.dynamic' }],
relativeOptions: [
{ value: 0, text: 'dynamic_year.current' },
{ value: 1, text: 'dynamic_year.last' },
{ value: 2, text: 'dynamic_time.custom' }
],
custom: {
unitsOptions: [
{ value: 'year', text: 'dynamic_time.year' }
],
limits: [0, 10]
}
}
},
value: ''
},
@ -65,6 +84,36 @@ class TimeYearServiceImpl extends WidgetService {
return field['deType'] === 1
})
}
defaultSetting() {
return dialogPanel.options.attrs.default
}
dynamicDateFormNow(element) {
if (element.options.attrs.default === null || typeof element.options.attrs.default === 'undefined' || !element.options.attrs.default.isDynamic) return null
if (element.options.attrs.default.dkey === 0) {
return Date.now()
}
if (element.options.attrs.default.dkey === 1) {
const now = new Date()
const nowYear = now.getFullYear()
const nowMonth = now.getMonth()
const nowDate = now.getDate()
return new Date(nowYear - 1, nowMonth, nowDate).getTime()
}
if (element.options.attrs.default.dkey === 2) {
const dynamicPrefix = parseInt(element.options.attrs.default.dynamicPrefix)
const dynamicSuffix = element.options.attrs.default.dynamicSuffix
const now = new Date()
const nowMonth = now.getMonth()
const nowYear = now.getFullYear()
const nowDate = now.getDate()
return new Date(dynamicSuffix === 'before' ? (nowYear - dynamicPrefix) : (nowYear + dynamicPrefix), nowMonth, nowDate).getTime()
}
}
}
const timeYearServiceImpl = new TimeYearServiceImpl()
export default timeYearServiceImpl

View File

@ -1758,5 +1758,18 @@ export default {
cmonth: 'This Month',
cquarter: 'This Quarter',
cyear: 'This Year'
},
dynamic_year: {
fix: 'Fixed Year',
dynamic: 'Dynamic Year',
current: 'This Year',
last: 'Last Year'
},
dynamic_month: {
fix: 'Fixed Month',
dynamic: 'Dynamic Month',
current: 'This Month',
last: 'Last Month',
firstOfYear: 'First month of this year'
}
}

View File

@ -1770,5 +1770,18 @@ export default {
cmonth: '本月',
cquarter: '本季',
cyear: '本年'
},
dynamic_year: {
fix: '固定年份',
dynamic: '動態年份',
current: '當年',
last: '去年'
},
dynamic_month: {
fix: '固定年月',
dynamic: '動態年月',
current: '本月',
last: '上月',
firstOfYear: '當年首月'
}
}

View File

@ -1780,5 +1780,19 @@ export default {
cmonth: '本月',
cquarter: '本季',
cyear: '本年'
},
dynamic_year: {
fix: '固定年份',
dynamic: '动态年份',
current: '当年',
last: '去年'
},
dynamic_month: {
fix: '固定年月',
dynamic: '动态年月',
current: '当月',
last: '上月',
firstOfYear: '当年首月'
}
}

View File

@ -4,8 +4,14 @@
<el-form-item :label="$t('dynamic_time.set_default')">
<el-radio-group v-model="element.options.attrs.default.isDynamic" @change="dynamicChange">
<el-radio :label="false">{{ $t('dynamic_time.fix') }}</el-radio>
<el-radio :label="true">{{ $t('dynamic_time.dynamic') }}</el-radio>
<el-radio
v-for="(item, index) in defaultSetting.radioOptions"
:key="index"
:label="item.value"
>
{{ $t(item.text) }}
</el-radio>
</el-radio-group>
</el-form-item>
@ -17,10 +23,13 @@
class="relative-time"
@change="dkeyChange"
>
<el-option :label="$t('dynamic_time.today')" :value="0" />
<el-option :label="$t('dynamic_time.yesterday')" :value="1" />
<el-option :label="$t('dynamic_time.firstOfMonth')" :value="2" />
<el-option :label="$t('dynamic_time.custom')" :value="3" />
<el-option
v-for="(item, index) in defaultSetting.relativeOptions"
:key="item.value + index"
:label="$t(item.text)"
:value="item.value"
/>
</el-select>
</el-form-item>
@ -28,7 +37,7 @@
<div class="inline">
<el-form-item
v-if="element.options.attrs.default.isDynamic && element.options.attrs.default.dkey === 3"
v-if="element.options.attrs.default.isDynamic && element.options.attrs.default.dkey === (defaultSetting.relativeOptions.length - 1)"
label=""
>
<el-input
@ -42,7 +51,7 @@
</el-form-item>
<el-form-item
v-if="element.options.attrs.default.isDynamic && element.options.attrs.default.dkey === 3"
v-if="element.options.attrs.default.isDynamic && element.options.attrs.default.dkey === (defaultSetting.relativeOptions.length - 1)"
label=""
class="no-label-item"
>
@ -50,17 +59,21 @@
v-model="element.options.attrs.default.dynamicInfill"
size="mini"
placeholder=""
:disabled="defaultSetting.custom && defaultSetting.custom.unitsOptions && defaultSetting.custom.unitsOptions.length === 1"
@change="dynamicInfillChange"
>
<el-option :label="$t('dynamic_time.date')" value="day" />
<el-option :label="$t('dynamic_time.week')" value="week" />
<el-option :label="$t('dynamic_time.month')" value="month" />
<el-option :label="$t('dynamic_time.year')" value="year" />
<el-option
v-for="(item, index) in defaultSetting.custom.unitsOptions"
:key="item.value + index"
:label="$t(item.text)"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item
v-if="element.options.attrs.default.isDynamic && element.options.attrs.default.dkey === 3"
v-if="element.options.attrs.default.isDynamic && element.options.attrs.default.dkey === (defaultSetting.relativeOptions.length - 1)"
label=""
class="no-label-item"
>
@ -79,7 +92,13 @@
</div>
<el-form-item v-if="element.options.attrs.default.isDynamic" :label="$t('dynamic_time.preview')">
<el-date-picker v-model="dval" type="date" disabled placeholder="" class="relative-time" />
<el-date-picker
v-model="dval"
:type="element.options.attrs.type"
disabled
placeholder=""
class="relative-time"
/>
</el-form-item>
<el-form-item v-else :label="$t('dynamic_time.set')">
@ -115,6 +134,13 @@ export default {
dval: null
}
},
computed: {
defaultSetting() {
const widget = ApplicationContext.getService(this.element.serviceName)
const setting = widget.defaultSetting()
return setting
}
},
created() {
this.setDval()
},

View File

@ -3,11 +3,11 @@
<el-col :span="24">
<div class="filter-content">
<el-card
v-if="element.serviceName && element.serviceName !== 'timeDateWidget' && element.serviceName !== 'timeDateRangeWidget'"
v-if="element.component && element.component !== 'de-date'"
class="box-card"
>
<div style="margin-bottom: 10px;">
<span>默认值设置</span>
<span>{{ $t('dynamic_time.set_default') }}</span>
</div>
<div class="custom-component-class">
<component
@ -22,13 +22,13 @@
</el-card>
<el-card v-if="element.serviceName && element.serviceName === 'timeDateWidget'" class="box-card">
<de-date-default v-if="element.serviceName && element.serviceName === 'timeDateWidget'" :element="element" />
<el-card v-if="element.component && element.component === 'de-date' && element.serviceName && element.serviceName !== 'timeDateRangeWidget'" class="box-card">
<de-date-default v-if="element.component === 'de-date' && element.serviceName !== 'timeDateRangeWidget'" :element="element" />
</el-card>
<el-card v-if="element.serviceName && element.serviceName === 'timeDateRangeWidget'" class="box-card">
<el-card v-if="element.component && element.component === 'de-date' && element.serviceName && element.serviceName === 'timeDateRangeWidget'" class="box-card">
<de-date-range-default
v-if="element.serviceName && element.serviceName === 'timeDateRangeWidget'"
v-if="element.component === 'de-date' && element.serviceName === 'timeDateRangeWidget'"
:element="element"
/>
</el-card>