|
@@ -4,7 +4,7 @@ import TrendCard from './components/TrendCard.vue';
|
|
|
import SimpleCard from './components/SimpleCard.vue';
|
|
|
import Divider from './components/Divider.vue';
|
|
|
import Echarts from '@/components/ReEcharts/index.vue';
|
|
|
-import { EChartsOption } from 'echarts';
|
|
|
+import { EChartsOption, use } from 'echarts';
|
|
|
import { dayjs } from 'element-plus';
|
|
|
import {
|
|
|
getSummaryData,
|
|
@@ -55,6 +55,10 @@ type PromptType = {
|
|
|
sliceDate: [Date, Date];
|
|
|
};
|
|
|
|
|
|
+const select1 = ref<HTMLDivElement>();
|
|
|
+const select2 = ref<HTMLDivElement>();
|
|
|
+const select3 = ref<HTMLDivElement>();
|
|
|
+
|
|
|
const bulletinPrompt = reactive<PromptType>({
|
|
|
permission: 0,
|
|
|
date: 0,
|
|
@@ -123,7 +127,7 @@ watchEffect(() => {
|
|
|
...(bulletinPrompt.date === ('ignore' as any)
|
|
|
? {
|
|
|
startDate: dayjs(bulletinPrompt.sliceDate[0]).format('YYYY-MM-DD'),
|
|
|
- endData: dayjs(bulletinPrompt.sliceDate[1]).format('YYYY-MM-DD')
|
|
|
+ endDate: dayjs(bulletinPrompt.sliceDate[1]).format('YYYY-MM-DD')
|
|
|
}
|
|
|
: { dateType: bulletinPrompt.date }),
|
|
|
queryType: bulletinPrompt.permission
|
|
@@ -135,7 +139,7 @@ watchEffect(() => {
|
|
|
...(stagePrompt.date === ('ignore' as any)
|
|
|
? {
|
|
|
startDate: dayjs(stagePrompt.sliceDate[0]).format('YYYY-MM-DD'),
|
|
|
- endData: dayjs(stagePrompt.sliceDate[1]).format('YYYY-MM-DD')
|
|
|
+ endDate: dayjs(stagePrompt.sliceDate[1]).format('YYYY-MM-DD')
|
|
|
}
|
|
|
: { dateType: stagePrompt.date }),
|
|
|
queryType: stagePrompt.permission
|
|
@@ -147,7 +151,7 @@ watchEffect(() => {
|
|
|
...(summaryPrompt.date === ('ignore' as any)
|
|
|
? {
|
|
|
startDate: dayjs(summaryPrompt.sliceDate[0]).format('YYYY-MM-DD'),
|
|
|
- endData: dayjs(summaryPrompt.sliceDate[1]).format('YYYY-MM-DD')
|
|
|
+ endDate: dayjs(summaryPrompt.sliceDate[1]).format('YYYY-MM-DD')
|
|
|
}
|
|
|
: { dateType: summaryPrompt.date }),
|
|
|
queryType: summaryPrompt.permission
|
|
@@ -178,12 +182,13 @@ watchEffect(() => {
|
|
|
</div>
|
|
|
<div class="w-40">
|
|
|
<el-select
|
|
|
+ ref="select1"
|
|
|
size="small"
|
|
|
:model-value="bulletinPrompt.date"
|
|
|
@change="(value) => (bulletinPrompt.date = value)"
|
|
|
>
|
|
|
<el-option v-for="date in dateOptions" :label="date.label" :value="date.value" />
|
|
|
- <el-option label="自定义" value="ignore">
|
|
|
+ <el-option label="自定义" value="ignore" disabled>
|
|
|
<div class="flex gap-2 w-80">
|
|
|
<el-date-picker
|
|
|
size="small"
|
|
@@ -194,7 +199,7 @@ watchEffect(() => {
|
|
|
start-placeholder="开始日期"
|
|
|
end-placeholder="结束日期"
|
|
|
/>
|
|
|
- <el-button size="small" type="primary">确认</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="select1?.blur">确认</el-button>
|
|
|
</div>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
@@ -271,13 +276,14 @@ watchEffect(() => {
|
|
|
</div>
|
|
|
<div class="w-40">
|
|
|
<el-select
|
|
|
+ ref="select2"
|
|
|
clearable
|
|
|
size="small"
|
|
|
:model-value="summaryPrompt.date"
|
|
|
@change="(value) => (summaryPrompt.date = value)"
|
|
|
>
|
|
|
<el-option v-for="date in dateOptions" :label="date.label" :value="date.value" />
|
|
|
- <el-option label="自定义" value="ignore">
|
|
|
+ <el-option label="自定义" value="ignore" disabled>
|
|
|
<div class="flex gap-2 w-80">
|
|
|
<el-date-picker
|
|
|
size="small"
|
|
@@ -288,7 +294,7 @@ watchEffect(() => {
|
|
|
start-placeholder="开始日期"
|
|
|
end-placeholder="结束日期"
|
|
|
/>
|
|
|
- <el-button size="small" type="primary">确认</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="select2?.blur">确认</el-button>
|
|
|
</div>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
@@ -363,13 +369,14 @@ watchEffect(() => {
|
|
|
</div>
|
|
|
<div class="w-40">
|
|
|
<el-select
|
|
|
+ ref="select3"
|
|
|
clearable
|
|
|
size="small"
|
|
|
:model-value="stagePrompt.date"
|
|
|
@change="(value) => (stagePrompt.date = value)"
|
|
|
>
|
|
|
<el-option v-for="date in dateOptions" :label="date.label" :value="date.value" />
|
|
|
- <el-option label="自定义" value="ignore">
|
|
|
+ <el-option label="自定义" value="ignore" disabled>
|
|
|
<div class="flex gap-2 w-80">
|
|
|
<el-date-picker
|
|
|
size="small"
|
|
@@ -380,7 +387,7 @@ watchEffect(() => {
|
|
|
start-placeholder="开始日期"
|
|
|
end-placeholder="结束日期"
|
|
|
/>
|
|
|
- <el-button size="small" type="primary">确认</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="select3?.blur">确认</el-button>
|
|
|
</div>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
@@ -392,25 +399,5 @@ watchEffect(() => {
|
|
|
</div>
|
|
|
</div>
|
|
|
</section>
|
|
|
- <!-- <nav class="flex-1 min-w-60 sticky right-0 top-9 max-lg:hidden">
|
|
|
- <div class="border border-gray-200 rounded w-3/4 text-sm text-gray-500">
|
|
|
- <div class="p-2" v-for="primission in permissionOptions">
|
|
|
- {{ primission.label }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="border border-gray-200 rounded text-sm text-gray-500 mt-4">
|
|
|
- <div class="p-2" v-for="date in dateOptions">{{ date.label }}</div>
|
|
|
- <div class="p-2">
|
|
|
- <div>自定义</div>
|
|
|
- <el-date-picker
|
|
|
- type="daterange"
|
|
|
- class="max-w-full mt-2"
|
|
|
- v-model="defineDate"
|
|
|
- start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </nav> -->
|
|
|
</div>
|
|
|
</template>
|