forked from github/dataease
commit
389c38beca
@ -24,7 +24,7 @@
|
||||
"axios": "^1.3.3",
|
||||
"crypto-js": "^4.1.1",
|
||||
"dayjs": "^1.11.9",
|
||||
"element-plus-secondary": "^0.4.15",
|
||||
"element-plus-secondary": "^0.4.16",
|
||||
"element-resize-detector": "^1.2.4",
|
||||
"file-saver": "^2.0.5",
|
||||
"html-to-image": "^1.11.11",
|
||||
|
@ -5,6 +5,7 @@ import { type DatePickType } from 'element-plus-secondary'
|
||||
import { getCustomTime } from './time-format'
|
||||
interface SelectConfig {
|
||||
timeType: string
|
||||
timeGranularityMultiple: DatePickType
|
||||
defaultValue: [Date, Date]
|
||||
selectValue: [Date, Date]
|
||||
defaultValueCheck: boolean
|
||||
@ -25,6 +26,7 @@ const props = defineProps({
|
||||
type: Object as PropType<SelectConfig>,
|
||||
default: () => {
|
||||
return {
|
||||
timeGranularityMultiple: 'datetimerange',
|
||||
defaultValue: [],
|
||||
selectValue: [],
|
||||
timeType: 'fixed',
|
||||
@ -136,14 +138,19 @@ const init = () => {
|
||||
onBeforeMount(() => {
|
||||
init()
|
||||
})
|
||||
|
||||
const formatDate = computed(() => {
|
||||
return (config.value.timeGranularityMultiple as string) === 'yearrange' ? 'YYYY' : undefined
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-date-picker
|
||||
disabled
|
||||
v-model="selectValue"
|
||||
type="datetimerange"
|
||||
:type="config.timeGranularityMultiple"
|
||||
:prefix-icon="Calendar"
|
||||
:format="formatDate"
|
||||
:range-separator="$t('cron.to')"
|
||||
:start-placeholder="$t('datasource.start_time')"
|
||||
:end-placeholder="$t('datasource.end_time')"
|
||||
|
@ -197,6 +197,12 @@ const setTypeChange = () => {
|
||||
nextTick(() => {
|
||||
curComponent.value.field.id = ''
|
||||
inputCom.value?.displayTypeChange?.()
|
||||
if (
|
||||
+curComponent.value.displayType === 7 &&
|
||||
['yearrange', 'monthrange', 'datetimerange'].includes(curComponent.value.timeGranularity)
|
||||
) {
|
||||
curComponent.value.timeGranularityMultiple = curComponent.value.timeGranularity
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
@ -635,6 +641,13 @@ const dynamicTime = computed(() => {
|
||||
|
||||
const relativeToCurrentTypeList = computed(() => {
|
||||
if (!curComponent.value) return []
|
||||
let index = ['year', 'month', 'date', 'datetime'].indexOf(curComponent.value.timeGranularity) + 1
|
||||
if (+curComponent.value.displayType === 7) {
|
||||
index =
|
||||
['yearrange', 'monthrange', 'datetimerange'].indexOf(
|
||||
curComponent.value.timeGranularityMultiple
|
||||
) + 1
|
||||
}
|
||||
return [
|
||||
{
|
||||
label: '年',
|
||||
@ -648,7 +661,7 @@ const relativeToCurrentTypeList = computed(() => {
|
||||
label: '日',
|
||||
value: 'date'
|
||||
}
|
||||
].slice(0, ['year', 'month', 'date', 'datetime'].indexOf(curComponent.value.timeGranularity) + 1)
|
||||
].slice(0, index)
|
||||
})
|
||||
|
||||
const timeGranularityChange = (val: string) => {
|
||||
@ -662,6 +675,15 @@ const timeGranularityChange = (val: string) => {
|
||||
curComponent.value.relativeToCurrent = relativeToCurrentList.value[0]?.value
|
||||
}
|
||||
}
|
||||
|
||||
const timeGranularityMultipleChange = (val: string) => {
|
||||
if (
|
||||
['yearrange', 'monthrange', 'datetimerange'].indexOf(val) <
|
||||
['year', 'month', 'date'].indexOf(curComponent.value.relativeToCurrentType)
|
||||
) {
|
||||
curComponent.value.relativeToCurrentType = 'year'
|
||||
}
|
||||
}
|
||||
const aroundList = [
|
||||
{
|
||||
label: '前',
|
||||
@ -968,9 +990,12 @@ defineExpose({
|
||||
<div class="value">
|
||||
<template v-if="curComponent.displayType === '7'">
|
||||
<el-select
|
||||
@change="timeGranularityMultipleChange"
|
||||
placeholder="请选择时间粒度"
|
||||
v-model="curComponent.timeGranularityMultiple"
|
||||
>
|
||||
<el-option label="年" value="yearrange" />
|
||||
<el-option label="年月" value="monthrange" />
|
||||
<el-option label="年月日时分秒" value="datetimerange" />
|
||||
</el-select>
|
||||
</template>
|
||||
@ -1284,7 +1309,13 @@ defineExpose({
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="dynamicTime && curComponent.displayType === '7'">
|
||||
<div class="setting">
|
||||
<div
|
||||
class="setting"
|
||||
:class="
|
||||
['yearrange', 'monthrange'].includes(curComponent.timeGranularityMultiple) &&
|
||||
'is-year-month-range'
|
||||
"
|
||||
>
|
||||
<div class="setting-label">开始时间</div>
|
||||
<div class="setting-input with-date range">
|
||||
<el-input-number
|
||||
@ -1311,7 +1342,13 @@ defineExpose({
|
||||
<el-time-picker v-model="curComponent.arbitraryTime" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting">
|
||||
<div
|
||||
class="setting"
|
||||
:class="
|
||||
['yearrange', 'monthrange'].includes(curComponent.timeGranularityMultiple) &&
|
||||
'is-year-month-range'
|
||||
"
|
||||
>
|
||||
<div class="setting-label">结束时间</div>
|
||||
<div class="setting-input with-date range">
|
||||
<el-input-number
|
||||
@ -1651,6 +1688,7 @@ defineExpose({
|
||||
padding-left: 24px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.range-title,
|
||||
.params-start,
|
||||
.params-end {
|
||||
@ -1729,6 +1767,20 @@ defineExpose({
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.is-year-month-range {
|
||||
.setting-input {
|
||||
&.with-date {
|
||||
.ed-input-number,
|
||||
.ed-select {
|
||||
width: 103px;
|
||||
}
|
||||
}
|
||||
.ed-date-editor.ed-input {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -121,6 +121,10 @@ onBeforeMount(() => {
|
||||
defineExpose({
|
||||
displayTypeChange
|
||||
})
|
||||
|
||||
const formatDate = computed(() => {
|
||||
return (config.value.timeGranularityMultiple as string) === 'yearrange' ? 'YYYY' : undefined
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -128,6 +132,7 @@ defineExpose({
|
||||
v-model="selectValue"
|
||||
:type="config.timeGranularityMultiple"
|
||||
:style="selectStyle"
|
||||
:format="formatDate"
|
||||
v-if="multiple"
|
||||
@change="handleValueChange"
|
||||
:prefix-icon="Calendar"
|
||||
|
@ -1102,7 +1102,7 @@ export default {
|
||||
select_year: '选择年',
|
||||
sql_variable_limit_1: '1、SQL 变量只能在 WHERE 条件中使用',
|
||||
sql_variable_limit_2:
|
||||
"2、示例:select * from table_name where column_name1='${'{'}param_name1{'}'}' and column_name2 in ( ${'{'}param_name2{'}'} ) ",
|
||||
"2、示例:select * from table_name where column_name1='${'{'}param_name1{'}'}' and column_name2 in (${'{'}param_name2{'}'})",
|
||||
select_month: '选择月',
|
||||
select_date: '选择日期',
|
||||
select_time: '选择时间',
|
||||
|
@ -759,10 +759,6 @@ const getMenuList = (val: boolean) => {
|
||||
height: calc(100vh - 56px);
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
|
||||
&.h100 {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.dataset-content {
|
||||
|
@ -1576,8 +1576,6 @@ const getMenuList = (val: boolean) => {
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
&.h100 {
|
||||
height: 100%;
|
||||
|
||||
.datasource-table {
|
||||
height: calc(100% - 140px);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user