|
|
|
|
@ -1,98 +1,126 @@
|
|
|
|
|
<template> |
|
|
|
|
<el-row :gutter="8" justify="space-between"> |
|
|
|
|
<el-row justify="space-between"> |
|
|
|
|
<el-col :span="14"> |
|
|
|
|
<el-form :model="queryParams" class="queryForm" inline> |
|
|
|
|
<el-form-item label="按区域" prop="region"> |
|
|
|
|
<el-select v-model="queryParams.region" placeholder="请选择区域" size="large"> |
|
|
|
|
<el-option |
|
|
|
|
v-for="option in area" |
|
|
|
|
:key="option.value" |
|
|
|
|
:value="option.value" |
|
|
|
|
:label="option.label" |
|
|
|
|
/> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
<el-form-item label="按周期" prop="selectWeek"> |
|
|
|
|
<el-select |
|
|
|
|
v-model="queryParams.selectWeek" |
|
|
|
|
placeholder="请选择周期" |
|
|
|
|
clearable |
|
|
|
|
size="large" |
|
|
|
|
> |
|
|
|
|
<el-option |
|
|
|
|
v-for="option in getIntDictOptions(DICT_TYPE.SELECT_WEEK)" |
|
|
|
|
:key="option.value" |
|
|
|
|
:value="option.value" |
|
|
|
|
:label="option.label" |
|
|
|
|
/> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-form> |
|
|
|
|
</el-col> |
|
|
|
|
<section class="flex gap-20px"> |
|
|
|
|
<el-button type="primary" plain> |
|
|
|
|
<Icon icon="ep:search" /> |
|
|
|
|
查询 |
|
|
|
|
</el-button> |
|
|
|
|
<el-button> |
|
|
|
|
<Icon icon="ep:refresh" /> |
|
|
|
|
重置 |
|
|
|
|
</el-button> |
|
|
|
|
</section> |
|
|
|
|
</el-row> |
|
|
|
|
<el-row :gutter="20" justify="space-between"> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" :height="280"> |
|
|
|
|
<el-card shadow="hover" class="mb-8px"> |
|
|
|
|
<template #header> |
|
|
|
|
执法完成率 |
|
|
|
|
</template> |
|
|
|
|
<el-card shadow="hover" class="mb-20px"> |
|
|
|
|
<template #header> 任务进度 </template> |
|
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
|
<Echart :options="pieOptionsData" :height="280" /> |
|
|
|
|
<Echart :options="pieOptionsData" :height="338" /> |
|
|
|
|
</el-skeleton> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24"> |
|
|
|
|
<el-card shadow="hover" class="mb-8px"> |
|
|
|
|
<template #header> |
|
|
|
|
执法与整改 |
|
|
|
|
</template> |
|
|
|
|
<el-card shadow="hover"> |
|
|
|
|
<template #header> 执法整改 </template> |
|
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
|
<Echart :options="barOptionsData" :height="280" /> |
|
|
|
|
<Echart :options="barOptionsData" :height="338" /> |
|
|
|
|
</el-skeleton> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24"> |
|
|
|
|
<el-card shadow="hover" class="mb-8px"> |
|
|
|
|
<el-card shadow="hover"> |
|
|
|
|
<template #header> |
|
|
|
|
任务与执法 |
|
|
|
|
<section class="flex justify-between"> |
|
|
|
|
<span>任务执法</span> |
|
|
|
|
<span class="color-#A8ABB2 font-normal"> 近6个月走势 </span> |
|
|
|
|
</section> |
|
|
|
|
</template> |
|
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
|
<Echart :options="lineOptions" :height="280" /> |
|
|
|
|
<Echart :options="lineOptionsData" :height="338" /> |
|
|
|
|
</el-skeleton> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
<el-row :gutter="8" justify="space-between"> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-8px"> |
|
|
|
|
<el-row :gutter="20" justify="space-between"> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-20px"> |
|
|
|
|
<el-card ref="taskNewCard" shadow="never"> |
|
|
|
|
<template #header> |
|
|
|
|
最新任务 |
|
|
|
|
</template> |
|
|
|
|
<template #header> 最新任务 </template> |
|
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
|
<div v-for="(item, index) in tasks" :key="`dynamics-${index}`"> |
|
|
|
|
<div> |
|
|
|
|
<div class="text-12px flex justify-between"> |
|
|
|
|
<span>{{ item.title }}</span> |
|
|
|
|
<span class="mr-10">{{ item.user }}</span> |
|
|
|
|
<span class="mr-10">{{ item.date }}</span> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<section class="p-24px flex flex-col gap-24px block"> |
|
|
|
|
<div |
|
|
|
|
v-for="(item, index) in tasks" |
|
|
|
|
:key="`dynamics-${index}`" |
|
|
|
|
class="text-15px flex justify-between" |
|
|
|
|
> |
|
|
|
|
<span class="color-#303133">{{ item.title }}</span> |
|
|
|
|
<span class="color-#606266">{{ item.user }}</span> |
|
|
|
|
<span class="color-#909399">{{ item.date }}</span> |
|
|
|
|
</div> |
|
|
|
|
<el-divider height="10px" class="m-4 p-0" style="margin:8px 0" /> |
|
|
|
|
</div> |
|
|
|
|
</section> |
|
|
|
|
</el-skeleton> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-8px"> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24"> |
|
|
|
|
<el-card shadow="never"> |
|
|
|
|
<template #header> |
|
|
|
|
逾期排行 |
|
|
|
|
</template> |
|
|
|
|
<template #header> 整改排名 </template> |
|
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
|
<div v-for="(item, index) in notice2" :key="`dynamics-${index}`"> |
|
|
|
|
<template v-if="item.type === '资质逾期'"> |
|
|
|
|
<div> |
|
|
|
|
<div class="text-12px flex justify-between"> |
|
|
|
|
<span>{{ item.title }}</span> |
|
|
|
|
<span class="mr-10">{{ item.days }}</span> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
<el-divider height="10px" class="m-4 p-0" style="margin:8px 0" /> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
<section class="p-24px flex flex-col gap-24px block"> |
|
|
|
|
<div |
|
|
|
|
v-for="(item, index) in notice1" |
|
|
|
|
:key="`dynamics-${index}`" |
|
|
|
|
class="text-15px flex justify-between" |
|
|
|
|
> |
|
|
|
|
<span class="color-#303133">{{ item.name }}</span> |
|
|
|
|
<span class="color-#909399">{{ item.count }}次</span> |
|
|
|
|
</div> |
|
|
|
|
</section> |
|
|
|
|
</el-skeleton> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-8px"> |
|
|
|
|
<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24"> |
|
|
|
|
<el-card shadow="never"> |
|
|
|
|
<template #header> |
|
|
|
|
整改排行 |
|
|
|
|
</template> |
|
|
|
|
<template #header> 资质临期 </template> |
|
|
|
|
<el-skeleton :loading="loading" animated> |
|
|
|
|
<div v-for="(item, index) in notice2" :key="`dynamics-${index}`"> |
|
|
|
|
<template v-if="item.type === '整改次数'"> |
|
|
|
|
|
|
|
|
|
<div> |
|
|
|
|
<div class="text-12px flex justify-between"> |
|
|
|
|
<span>{{ item.title }}</span> |
|
|
|
|
<span class="mr-10">{{ item.days }}</span> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<section class="p-24px flex flex-col gap-24px block"> |
|
|
|
|
<div |
|
|
|
|
v-for="(item, index) in notice2" |
|
|
|
|
:key="`dynamics-${index}`" |
|
|
|
|
class="text-15px flex justify-between" |
|
|
|
|
> |
|
|
|
|
<span class="color-#303133">{{ item.name }}</span> |
|
|
|
|
<span class="color-#909399">{{ item.count }}天</span> |
|
|
|
|
</div> |
|
|
|
|
<el-divider height="10px" class="m-4 p-0" style="margin:8px 0" /> |
|
|
|
|
</template> |
|
|
|
|
</div> |
|
|
|
|
</section> |
|
|
|
|
</el-skeleton> |
|
|
|
|
</el-card> |
|
|
|
|
</el-col> |
|
|
|
|
@ -101,23 +129,27 @@
|
|
|
|
|
<script lang="ts" setup> |
|
|
|
|
import { set } from 'lodash-es' |
|
|
|
|
import { EChartsOption } from 'echarts' |
|
|
|
|
import { pieOptions, barOptions,lineOptions } from './echarts-data' |
|
|
|
|
import { pieOptions, barOptions, lineOptions } from './echarts-data' |
|
|
|
|
import { HomeApi } from '@/api/home' |
|
|
|
|
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict' |
|
|
|
|
|
|
|
|
|
defineOptions({ name: 'Home' }) |
|
|
|
|
|
|
|
|
|
const { t } = useI18n() |
|
|
|
|
const loading = ref(true) |
|
|
|
|
const pieOptionsData = reactive<EChartsOption>(pieOptions) as EChartsOption |
|
|
|
|
const barOptionsData = reactive<EChartsOption>(barOptions) as EChartsOption |
|
|
|
|
const lineOptionsData = reactive<EChartsOption>(lineOptions) as EChartsOption |
|
|
|
|
|
|
|
|
|
const queryParams = reactive({ |
|
|
|
|
selectWeek: '', |
|
|
|
|
region: '' |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
const area = ref<any[]>([]) |
|
|
|
|
|
|
|
|
|
// 监听两个卡片高度变化并保持同步 |
|
|
|
|
const taskNewCard = ref() |
|
|
|
|
|
|
|
|
|
// 使用ResizeObserver监听高度变化 |
|
|
|
|
onMounted(() => { |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const tasks = reactive<any>([ |
|
|
|
|
{ |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
@ -179,188 +211,121 @@ const tasks = reactive<any>([
|
|
|
|
|
user: '刘十二', |
|
|
|
|
status: 2 |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
]) |
|
|
|
|
|
|
|
|
|
const notice2 = reactive<any>([ |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
date: '2023-01-01 12:00:00', |
|
|
|
|
days: '逾期1天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
date: '2023-01-01 12:00:00', |
|
|
|
|
days: '整改1次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
date: '2023-01-01 12:00:00', |
|
|
|
|
days: '逾期1天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
date: '2023-01-01 12:00:00', |
|
|
|
|
days: '整改1次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
date: '2023-01-01 12:00:00', |
|
|
|
|
days: '逾期1天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '义县一公司环保信息', |
|
|
|
|
date: '2023-01-01 12:00:00', |
|
|
|
|
days: '整改1次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '锦州二公司安全检查', |
|
|
|
|
date: '2023-01-02 12:00:00', |
|
|
|
|
days: '逾期2天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '锦州二公司安全检查', |
|
|
|
|
date: '2023-01-02 12:00:00', |
|
|
|
|
days: '整改2次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '北镇三公司环评整改', |
|
|
|
|
date: '2023-01-03 12:00:00', |
|
|
|
|
days: '逾期3天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '北镇三公司环评整改', |
|
|
|
|
date: '2023-01-03 12:00:00', |
|
|
|
|
days: '整改3次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '凌海四公司排污监测', |
|
|
|
|
date: '2023-01-04 12:00:00', |
|
|
|
|
days: '逾期4天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '凌海四公司排污监测', |
|
|
|
|
date: '2023-01-04 12:00:00', |
|
|
|
|
days: '整改4次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '黑山五公司设备巡检', |
|
|
|
|
date: '2023-01-05 12:00:00', |
|
|
|
|
days: '逾期5天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '黑山五公司设备巡检', |
|
|
|
|
date: '2023-01-05 12:00:00', |
|
|
|
|
days: '整改5次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '义县六公司安全培训', |
|
|
|
|
date: '2023-01-06 12:00:00', |
|
|
|
|
days: '逾期6天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '义县六公司安全培训', |
|
|
|
|
date: '2023-01-06 12:00:00', |
|
|
|
|
days: '整改6次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '大石桥七公司隐患排查', |
|
|
|
|
date: '2023-01-07 12:00:00', |
|
|
|
|
days: '逾期7天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '大石桥七公司隐患排查', |
|
|
|
|
date: '2023-01-07 12:00:00', |
|
|
|
|
days: '整改7次' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '资质逾期', |
|
|
|
|
title: '盘锦八公司应急演练', |
|
|
|
|
date: '2023-01-08 12:00:00', |
|
|
|
|
days: '逾期8天' |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
type: '整改次数', |
|
|
|
|
title: '盘锦八公司应急演练', |
|
|
|
|
date: '2023-01-08 12:00:00', |
|
|
|
|
days: '整改8次' |
|
|
|
|
} |
|
|
|
|
]) |
|
|
|
|
const notice1 = ref<any[]>([]) |
|
|
|
|
|
|
|
|
|
const notice2 = ref<any[]>([]) |
|
|
|
|
|
|
|
|
|
// 用户来源 |
|
|
|
|
const getUserAccessSource = async () => { |
|
|
|
|
const data = [ |
|
|
|
|
{ value: 335, name: '执法一队' }, |
|
|
|
|
{ value: 310, name: '执法二队' }, |
|
|
|
|
{ value: 234, name: '执法三队' }, |
|
|
|
|
{ value: 135, name: '执法四队' }, |
|
|
|
|
{ value: 1548, name: '执法五队' } |
|
|
|
|
] |
|
|
|
|
set( |
|
|
|
|
pieOptionsData, |
|
|
|
|
'legend.data', |
|
|
|
|
data.map((v) => t(v.name)) |
|
|
|
|
) |
|
|
|
|
pieOptionsData!.series![0].data = data.map((v) => { |
|
|
|
|
return { |
|
|
|
|
name: t(v.name), |
|
|
|
|
value: v.value |
|
|
|
|
} |
|
|
|
|
// 完成率 |
|
|
|
|
const getPieData = async () => { |
|
|
|
|
const res = await HomeApi.getPieData(queryParams) |
|
|
|
|
const data = res.completionRate |
|
|
|
|
.sort((a, b) => b.value - a.value) |
|
|
|
|
.map((item: any, index: number) => { |
|
|
|
|
return { |
|
|
|
|
value: item.pieValue, |
|
|
|
|
name: item.name, |
|
|
|
|
itemStyle: { |
|
|
|
|
color: getGradientColor(index, res.completionRate.length) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
if (res.taskCompletionRate != 100) { |
|
|
|
|
data.push({ |
|
|
|
|
name: '', |
|
|
|
|
value: 100 - Number(res.taskCompletionRate), |
|
|
|
|
itemStyle: { |
|
|
|
|
color: '#fff' |
|
|
|
|
}, |
|
|
|
|
label: { |
|
|
|
|
show: false |
|
|
|
|
}, |
|
|
|
|
labelLine: { |
|
|
|
|
show: false |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
set(pieOptions, 'title.text', `${res.taskCompletionRate}%`) |
|
|
|
|
set(pieOptions, 'series.data', data) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 近6个月执法走势 |
|
|
|
|
const getS3Data = async () => { |
|
|
|
|
const res = await HomeApi.getTaskNumDoing() |
|
|
|
|
let data1 = [] as any |
|
|
|
|
let data2 = [] as any |
|
|
|
|
res.forEach((item: any) => { |
|
|
|
|
data1.push({ name: item.month, value: item.taskCount }) |
|
|
|
|
data2.push({ name: item.month, value: item.inspectionCount }) |
|
|
|
|
}) |
|
|
|
|
set(lineOptions, 'series[0].data', data1) |
|
|
|
|
set(lineOptions, 'series[1].data', data2) |
|
|
|
|
set(lineOptions, 'xAxis.data', res.map(i=>i.month)) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 整改排名、资质临期 |
|
|
|
|
const getS5S6 = async () => { |
|
|
|
|
notice2.value = await HomeApi.getListData({ ...queryParams, type: 1, size: 8 }) |
|
|
|
|
notice1.value = await HomeApi.getListData({ ...queryParams, type: 2, size: 8 }) |
|
|
|
|
} |
|
|
|
|
const barOptionsData = reactive<EChartsOption>(barOptions) as EChartsOption |
|
|
|
|
|
|
|
|
|
// 周活跃量 |
|
|
|
|
const getWeeklyUserActivity = async () => { |
|
|
|
|
const data = [ |
|
|
|
|
{ value: 325, name: '一月' }, |
|
|
|
|
{ value: 423, name: '二月' }, |
|
|
|
|
{ value: 632, name: '三月' }, |
|
|
|
|
{ value: 234, name: '四月' }, |
|
|
|
|
{ value: 464, name: '五月' }, |
|
|
|
|
{ value: 322, name: '六月' }, |
|
|
|
|
{ value: 324, name: '七月' } |
|
|
|
|
] |
|
|
|
|
set( |
|
|
|
|
barOptionsData, |
|
|
|
|
'xAxis.data', |
|
|
|
|
data.map((v) => t(v.name)) |
|
|
|
|
) |
|
|
|
|
set(barOptionsData, 'series', [ |
|
|
|
|
{ |
|
|
|
|
name: '任务数', |
|
|
|
|
data: data.map((v) => v.value), |
|
|
|
|
type: 'bar' |
|
|
|
|
} |
|
|
|
|
]) |
|
|
|
|
const getArea = async () => { |
|
|
|
|
area.value = await HomeApi.getArea() |
|
|
|
|
queryParams.region = area.value[0].value |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const getAllApi = async () => { |
|
|
|
|
await Promise.all([ |
|
|
|
|
getUserAccessSource(), |
|
|
|
|
getWeeklyUserActivity() |
|
|
|
|
]) |
|
|
|
|
const init = async () => { |
|
|
|
|
await getArea() |
|
|
|
|
await getData() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const getData = async () => { |
|
|
|
|
await Promise.all([getPieData(), getS3Data(), getS5S6()]) |
|
|
|
|
loading.value = false |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
getAllApi() |
|
|
|
|
// 饼图颜色 |
|
|
|
|
const getGradientColor = (index, total) => { |
|
|
|
|
let opacity = 1 - index / total + 0.1 |
|
|
|
|
if (index == 0) opacity = 1 |
|
|
|
|
return `rgba(64, 158, 255, ${opacity > 1 ? 1 : opacity})` |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
init() |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
|
::v-deep(.el-card__header) { |
|
|
|
|
padding: 16px; |
|
|
|
|
color: #303133; |
|
|
|
|
font-size: 14px; |
|
|
|
|
line-height: 24px; |
|
|
|
|
font-weight: bold; |
|
|
|
|
} |
|
|
|
|
::v-deep(.el-card__body) { |
|
|
|
|
padding: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.block { |
|
|
|
|
height: 376px; |
|
|
|
|
} |
|
|
|
|
.queryForm { |
|
|
|
|
display: flex; |
|
|
|
|
flex-flow: row nowrap; |
|
|
|
|
.el-form-item--default { |
|
|
|
|
margin-bottom: 20px; |
|
|
|
|
} |
|
|
|
|
.el-form-item { |
|
|
|
|
width: 400px; |
|
|
|
|
margin-right: 20px; |
|
|
|
|
display: flex; |
|
|
|
|
flex-flow: row nowrap; |
|
|
|
|
align-items: center; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
::v-deep(.el-button + .el-button) { |
|
|
|
|
margin-left: 0 !important; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
