Compare commits

...

10 Commits

Author SHA1 Message Date
stt
8355fc6aed Merge branch 'main' of http://192.168.1.22:3000/Web/admin-govern 2025-12-04 14:51:25 +08:00
stt
23bc2d8f05 组件查询时间加必填校验 2025-12-04 14:51:21 +08:00
guanj
43caddffa3 修改 echart样式 2025-12-04 10:33:48 +08:00
stt
3accaf3079 日期下拉默认修改 2025-12-04 10:30:19 +08:00
guanj
5687367602 Merge branch 'main' of http://192.168.1.22:3000/Web/admin-govern 2025-12-04 09:37:58 +08:00
guanj
b8ee530557 修改驾驶舱zoom缩放问题 2025-12-04 09:37:38 +08:00
stt
0518127792 公共时间修改 2025-12-03 16:30:42 +08:00
guanj
5db43cd4b1 微调 2025-12-03 15:37:08 +08:00
guanj
bf0657cbbc 在线设备录入添加参数
修改组件管理时间线配置
2025-12-03 14:56:57 +08:00
stt
bcb1535d4d 日历只月的时候调接口 2025-12-03 13:26:03 +08:00
18 changed files with 1944 additions and 1426 deletions

View File

@@ -25,3 +25,12 @@ export function offlineDataUploadMakeUp(data: any) {
data
})
}
//设备补召操作
// 根据id集合获取敏感负荷用户列表
export function getListByIds() {
return createAxios({
url: '/cs-harmonic-boot/pqSensitiveUser/getListByIds',
method: 'POST',
})
}

View File

@@ -116,3 +116,11 @@ export const start = (params: any) => {
params
})
}
// 查询监测对象类型
export const getDicDataByTypeCode = (params: any) => {
return request({
url: '/system-boot/dictData/getDicDataByTypeCode',
method: 'get',
params
})
}

View File

@@ -8,6 +8,7 @@
datePicker
v-if="fullscreen"
:timeCacheFlag="false"
:timeKeyList="['3']"
></TableHeader>
<el-calendar
v-model="value"
@@ -44,6 +45,7 @@ import { ref, onMounted, provide, reactive, watch, h } from 'vue'
import TableStore from '@/utils/tableStore'
import TableHeader from '@/components/table/header/index.vue'
import { dayjs } from 'element-plus'
import { getTime } from '@/utils/formatTime'
const prop = defineProps({
w: { type: [String, Number] },
@@ -51,7 +53,8 @@ const prop = defineProps({
width: { type: [String, Number] },
height: { type: [String, Number] },
timeKey: { type: [String, Number] },
timeValue: { type: Object }
timeValue: { type: Object },
interval: { type: Number }
})
const headerHeight = ref(57)
@@ -95,11 +98,22 @@ const tableStore: any = new TableStore({
method: 'POST',
showPage: false,
column: [],
// beforeSearchFun: () => {
// if (!fullscreen.value && prop.timeValue && Array.isArray(prop.timeValue)) {
// tableStore.table.params.searchBeginTime = prop.timeValue[0]
// tableStore.table.params.searchEndTime = prop.timeValue[1]
// }
// },
beforeSearchFun: () => {
if (!fullscreen.value && prop.timeValue && Array.isArray(prop.timeValue)) {
tableStore.table.params.searchBeginTime = prop.timeValue[0]
tableStore.table.params.searchEndTime = prop.timeValue[1]
}
const time = getTime(
prop.interval ?? 0,
prop.timeKey,
tableStore.table.params.searchBeginTime && tableStore.table.params.searchEndTime
? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
: prop.timeValue
)
tableStore.table.params.searchBeginTime = time[0]
tableStore.table.params.searchEndTime = time[1]
},
loadCallback: () => {
value.value = tableStore.table.params.searchBeginTime
@@ -144,12 +158,25 @@ provide('tableStore', tableStore)
onMounted(() => {
nextTick(() => {
if (TableHeaderRef.value && typeof TableHeaderRef.value.setDatePicker === 'function') {
TableHeaderRef.value.setDatePicker([{ label: '月份', value: 3 }])
}
// if (TableHeaderRef.value && typeof TableHeaderRef.value.setDatePicker === 'function') {
// TableHeaderRef.value.setDatePicker([{ label: '月份', value: 3 }])
// }
if (fullscreen.value) {
if (prop.interval == 3) {
const time = getTime(
prop.interval ?? 0,
prop.timeKey,
tableStore.table.params.searchBeginTime && tableStore.table.params.searchEndTime
? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
: prop.timeValue
)
tableStore.table.params.searchBeginTime = time[0]
tableStore.table.params.searchEndTime = time[1]
TableHeaderRef.value.setTimeInterval(prop.timeValue)
} else {
TableHeaderRef.value.setInterval(3)
}
}
tableStore.index()
})
})
@@ -161,18 +188,14 @@ watch(
)
watch(
() => prop.timeValue,
// (newVal, oldVal) => {
// // 当外部时间值变化时,更新表格的时间参数
// if (newVal && (!oldVal || newVal[0] !== oldVal[0] || newVal[1] !== oldVal[1])) {
// tableStore.table.params.searchBeginTime = newVal[0]
// tableStore.table.params.searchEndTime = newVal[1]
// tableStore.index()
// }
// },
val => {
(newVal, oldVal) => {
// 当外部时间值变化时,更新表格的时间参数
if (newVal && (!oldVal || newVal[0] !== oldVal[0] || newVal[1] !== oldVal[1])) {
tableStore.table.params.searchBeginTime = newVal[0]
tableStore.table.params.searchEndTime = newVal[1]
tableStore.index()
}
},
{
deep: true
}

View File

@@ -21,7 +21,7 @@
:options="echartList"
:style="{
width: prop.width,
height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`
height: `calc(${prop.height} / 2 - ${headerHeight / 2}px + ${fullscreen ? 0 : 28}px )`,
}"
/>
<my-echart
@@ -187,43 +187,19 @@ const initProbabilityData = () => {
type: 'category',
name: '越限程度',
nameLocation: 'middle',
nameGap: 30,
nameGap: 50,
data: ['0-20%', '20-40%', '40-60%', '60-80%', '80-100%'],
axisLine: {
lineStyle: {
color: '#111'
}
},
axisLabel: {
color: '#111',
margin: 15
},
nameTextStyle: {
color: '#111'
}
},
yAxis3D: {
type: 'category',
name: '指标类型',
nameLocation: 'middle',
nameGap: 30,
nameGap: 50,
data: yAxisData,
nameTextStyle: {
color: '#111'
},
axisLine: {
show: true,
lineStyle: {
color: '#111'
}
},
axisLabel: {
color: '#111',
margin: 15
},
splitLine: {
lineStyle: {
color: ['#111'],
type: 'dashed',
opacity: 0.5
}
@@ -234,19 +210,8 @@ const initProbabilityData = () => {
name: '越限次数',
nameLocation: 'middle',
nameGap: 30,
nameTextStyle: {
color: '#111'
},
axisLine: {
lineStyle: {
color: '#111'
}
},
axisLabel: {
color: '#111'
},
min: 0,
max: zAxisMax // 使用计算出的最大值加5
minInterval: 10,
// max: 100
},
grid3D: {

View File

@@ -22,11 +22,10 @@ import { ref, onMounted, provide, reactive, watch, nextTick } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { getTimeOfTheMonth } from '@/utils/formatTime'
import { getTime } from '@/utils/formatTime'
import OverLimitDetails from '@/components/cockpit/indicatorFittingChart/components/overLimitDetails.vue'
import { useRoute } from 'vue-router'
import { useTimeCacheStore } from '@/stores/timeCache'
import { log } from 'console'
const prop = defineProps({
w: { type: [String, Number] },
@@ -34,7 +33,8 @@ const prop = defineProps({
width: { type: [String, Number] },
height: { type: [String, Number] },
timeKey: { type: [String, Number] },
timeValue: { type: Object }
timeValue: { type: Object },
interval: { type: Number }
})
const OverLimitDetailsRef = ref()
const headerHeight = ref(57)
@@ -104,8 +104,18 @@ const tableStore: any = new TableStore({
{ title: '主要存在的电能质量问题', field: 'problems', minWidth: '150', showOverflow: true }
],
beforeSearchFun: () => {
tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
// tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
// tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
const time = getTime(
prop.interval ?? 0,
prop.timeKey,
tableStore.table.params.searchBeginTime && tableStore.table.params.searchEndTime
? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
: prop.timeValue
)
tableStore.table.params.searchBeginTime = time[0]
tableStore.table.params.searchEndTime = time[1]
},
loadCallback: () => {
tableStore.table.height = `calc(${prop.height} - 80px)`

View File

@@ -1,7 +1,13 @@
<template>
<div>
<!--指标拟合图 -->
<TableHeader datePicker @selectChange="selectChange" v-if="fullscreen">
<TableHeader
datePicker
@selectChange="selectChange"
v-if="fullscreen"
ref="TableHeaderRef"
:timeKeyList="['4', '5']"
>
<template v-slot:select>
<el-form-item label="监测点">
<el-select v-model="tableStore.table.params.lineId" placeholder="请选择监测点" clearable>
@@ -75,6 +81,7 @@ import { useConfig } from '@/stores/config'
import { cslineList, fittingData } from '@/api/harmonic-boot/cockpit/cockpit'
import { queryByCode, queryCsDictTree } from '@/api/system-boot/dictTree'
import { ElMessage } from 'element-plus'
import { getTime } from '@/utils/formatTime'
const prop = defineProps({
w: { type: [String, Number] },
@@ -82,9 +89,12 @@ const prop = defineProps({
width: { type: [String, Number] },
height: { type: [String, Number] },
timeKey: { type: [String, Number] },
timeValue: { type: Object }
timeValue: { type: Object },
interval: { type: Number }
})
const TableHeaderRef = ref()
const config = useConfig()
const lineList: any = ref()
@@ -269,8 +279,17 @@ const tableStore: any = new TableStore({
column: [],
beforeSearchFun: () => {
// 设置时间参数
tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
// tableStore.table.params.searchBeginTime = tableStore.table.params.searchBeginTime || prop.timeValue?.[0]
// tableStore.table.params.searchEndTime = tableStore.table.params.searchEndTime || prop.timeValue?.[1]
const time = getTime(
prop.interval ?? 0,
prop.timeKey,
tableStore.table.params.searchBeginTime && tableStore.table.params.searchEndTime
? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
: prop.timeValue
)
tableStore.table.params.searchBeginTime = time[0]
tableStore.table.params.searchEndTime = time[1]
// 只有当 lineList 已加载且有数据时才设置默认 lineId
if (!tableStore.table.params.lineId && lineList.value && lineList.value.length > 0) {
@@ -373,6 +392,22 @@ watch(
)
onMounted(() => {
if (fullscreen.value) {
if (prop.interval == 4 || prop.interval == 5) {
const time = getTime(
prop.interval ?? 0,
prop.timeKey,
tableStore.table.params.searchBeginTime && tableStore.table.params.searchEndTime
? [tableStore.table.params.searchBeginTime, tableStore.table.params.searchEndTime]
: prop.timeValue
)
tableStore.table.params.searchBeginTime = time[0]
tableStore.table.params.searchEndTime = time[1]
TableHeaderRef.value.setTimeInterval(prop.timeValue)
} else {
TableHeaderRef.value.setInterval(5)
}
}
initLineList().then(() => {
initCode()
})

View File

@@ -68,7 +68,8 @@ const prop = defineProps({
width: { type: [String, Number] },
height: { type: [String, Number] },
timeKey: { type: [String, Number] },
timeValue: { type: Object }
timeValue: { type: Object },
interval: { type: [String, Number] }
})
const headerHeight = ref(57)
@@ -119,9 +120,14 @@ const tableStore: any = new TableStore({
column: [],
beforeSearchFun: () => {
if (!fullscreen.value && prop.timeValue && Array.isArray(prop.timeValue)) {
if (!fullscreen.value) {
if (prop.interval == 3 && prop.timeValue && Array.isArray(prop.timeValue)) {
tableStore.table.params.searchBeginTime = prop.timeValue[0]
tableStore.table.params.searchEndTime = prop.timeValue[1]
} else {
tableStore.table.params.searchBeginTime = '2025-12-1'
tableStore.table.params.searchEndTime = '2025-12-31'
}
}
},
@@ -152,16 +158,31 @@ onMounted(() => {
TableHeaderRef.value.setDatePicker([{ label: '月份', value: 3 }])
}
if (fullscreen.value) {
if (prop.interval == 3 && prop.timeValue && Array.isArray(prop.timeValue)) {
tableStore.table.params.searchBeginTime = prop.timeValue[0] || tableStore.table.params.searchBeginTime
tableStore.table.params.searchEndTime = prop.timeValue[1] || tableStore.table.params.searchEndTime
TableHeaderRef.value.setTimeInterval(prop.timeValue)
} else {
TableHeaderRef.value.setInterval(3)
}
}
tableStore.index()
})
})
watch(
() => prop.timeKey,
val => {
// tableStore.index()
}
)
watch(
() => prop.interval,
val => {
if (val == 3) {
tableStore.index()
}
}
)
watch(
() => prop.timeValue,

View File

@@ -302,34 +302,17 @@ const tableStore: any = new TableStore({
type: 'category',
name: '特征幅值',
data: xLabels,
axisLine: {
lineStyle: {
color: '#111'
}
},
axisLabel: {
color: '#111'
}
nameGap: 40,
},
yAxis3D: {
type: 'category',
name: '持续时间',
data: yLabels,
nameTextStyle: {
color: '#111'
},
axisLine: {
show: true,
lineStyle: {
color: '#111'
}
},
axisLabel: {
color: '#111'
},
nameGap: 40,
splitLine: {
lineStyle: {
color: ['#111'],
type: 'dashed',
opacity: 0.5
}
@@ -337,15 +320,16 @@ const tableStore: any = new TableStore({
},
zAxis3D: {
type: 'value',
splitNumber: 10,
minInterval: 10,
name: '暂态事件次数'
name: '暂态事件次数',
nameGap: 30,
},
grid3D: {
viewControl: {
projection: 'perspective',
distance: 250
},
boxWidth: 200,
boxDepth: 80,
light: {
@@ -369,20 +353,8 @@ const tableStore: any = new TableStore({
borderWidth: 1
}
},
itemStyle: {
opacity: 1
},
emphasis: {
label: {
textStyle: {
fontSize: 20,
color: '#900'
}
},
itemStyle: {
color: '#900'
}
}
}
]
}

View File

@@ -5,7 +5,7 @@
style="min-width: 90px; width: 90px; margin-right: 10px"
@change="timeChange"
>
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
<el-option v-for="item in filteredTimeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-date-picker
v-model.trim="timeValue"
@@ -35,13 +35,15 @@ interface Props {
theCurrentTime?: boolean
initialInterval?: number
initialTimeValue?: any
timeKeyList?: string[] //日期下拉
}
const props = withDefaults(defineProps<Props>(), {
nextFlag: false,
theCurrentTime: true,
initialInterval: 3,
initialTimeValue: undefined
initialTimeValue: undefined,
timeKeyList: () => []
})
const emit = defineEmits(['change'])
@@ -89,6 +91,18 @@ const shortcuts = [
}
}
]
// 计算过滤后的 timeOptions
const filteredTimeOptions = computed(() => {
if (!props.timeKeyList || props.timeKeyList.length === 0) {
return timeOptions.value
}
return timeOptions.value.filter((option: any) =>
props.timeKeyList.includes(option.value.toString())
)
})
onMounted(() => {
// 使用传入的初始值
if (props.initialInterval !== undefined) {

View File

@@ -15,6 +15,7 @@
:nextFlag="nextFlag"
:theCurrentTime="theCurrentTime"
@change="handleDatePickerChange"
:timeKeyList="props.timeKeyList"
></DatePicker>
</el-form-item>
@@ -89,6 +90,7 @@ interface Props {
showReset?: boolean //是否显示重置
showExport?: boolean //导出控制
timeCacheFlag?: boolean //是否取缓存时间
timeKeyList?: Array<string> //日期下拉列表
}
const props = withDefaults(defineProps<Props>(), {
@@ -99,7 +101,8 @@ const props = withDefaults(defineProps<Props>(), {
theCurrentTime: true,
showReset: true,
showExport: false,
timeCacheFlag: true
timeCacheFlag: true,
timeKeyList: () => [] // 修改为箭头函数返回空数组
})
// 处理 DatePicker 值变化事件

View File

@@ -361,3 +361,32 @@ export function getTimeOfTheMonth(key: any): [string, string] {
throw new Error('Invalid key')
}
}
/**
* 获取当月时间
* @param interval 组件外部时间 1 年 2 季 3 月 4 周 5 日
* @param timeList 组件勾选时间 []
* @param externalTime //外部传入时间
*/
export function getTime(interval: number, timeList: any, externalTime: any) {
// 1、先匹配时间
// 检查 interval 是否在 timeList 中
if (timeList && timeList.includes(interval.toString())) {
// 匹配上了,返回外部传入时间 externalTime
if (externalTime && externalTime.length >= 2) {
return [externalTime[0], externalTime[1]]
} else {
// 如果 externalTime 无效,回退到默认逻辑
return getTimeOfTheMonth(interval.toString())
}
} else {
// 没有匹配上,返回 timeList 中最后一项的时间范围
if (timeList && timeList.length > 0) {
const lastItem = timeList[timeList.length - 1]
return getTimeOfTheMonth(lastItem)
} else {
// 如果 timeList 为空,使用 interval 参数
return getTimeOfTheMonth(interval.toString())
}
}
}

File diff suppressed because it is too large Load Diff

View File

@@ -16,7 +16,6 @@
<el-button type="primary" icon="el-icon-Tools" @click="settings">设置</el-button>
</template>
</TableHeader>
<GridLayout
v-model:layout="layout"
:row-height="rowHeight"
@@ -26,6 +25,7 @@
:vertical-compact="false"
prevent-collision
:col-num="12"
:style="{ zoom: zoom }"
>
<template #item="{ item }">
<div class="box">
@@ -34,8 +34,8 @@
<Icon class="HelpFilled" :name="(item as LayoutItem).icon" />
{{ (item as LayoutItem).name }}
</div>
<!-- <FullScreen class="HelpFilled" style="cursor: pointer" @click="zoom(item)" /> -->
<img :src="flag ? img : img1" style="cursor: pointer; height: 16px" @click="zoom(item)" />
<!-- <FullScreen class="HelpFilled" style="cursor: pointer" @click="setZoom(item)" /> -->
<img :src="flag ? img : img1" style="cursor: pointer; height: 16px" @click="setZoom(item)" />
</div>
<div>
<component
@@ -46,7 +46,7 @@
:timeValue="datePickerRef?.timeValue || 3"
:height="rowHeight * item.h - seRowHeight(item.h) + 'px'"
:width="rowWidth * item.w - 30 + 'px'"
:timeKey="(item as LayoutItem).timeKey"
:timeKey="(item as LayoutItem).timeKeys"
:interval="datePickerRef?.interval"
:w="item.w"
:h="item.h"
@@ -80,13 +80,14 @@ const timeCacheStore = useTimeCacheStore()
defineOptions({
// name: 'dashboard/index'
})
// 定义类型
interface LayoutItem {
x: number
y: number
w: number
h: number
timeKey: number | string
timeKeys: any
i: string | number
name: string
path: string
@@ -95,6 +96,7 @@ interface LayoutItem {
loading?: boolean
error?: any
}
const zoom = ref(1)
const RoutingConfigRef = ref()
const key = ref(0)
const img = new URL(`@/assets/img/amplify.png`, import.meta.url).href
@@ -120,13 +122,16 @@ const componentMap = reactive(new Map<string, Component | string>())
const dataList: any = ref({})
// 获取主内容区域高度
const getMainHeight = () => {
const elMain = document.querySelector('.el-main')
return (elMain?.offsetHeight || 0) - 70
const elMain = document.querySelector('.el-main') as HTMLElement | null
zoom.value =
layout.value.length == 1 ? 1 : (elMain?.offsetHeight ?? 0) > 1080 ? 1 : (elMain?.offsetHeight ?? 0) / 1080
// console.log('🚀 ~ getMainHeight ~ elMain:', elMain?.offsetHeight)
return ((elMain?.offsetHeight || 0) - 70) / zoom.value
}
// 获取主内容区域高度
const getMainWidth = () => {
const elMain = document.querySelector('.el-main')
return (elMain?.offsetWidth || 0) - 20
const elMain = document.querySelector('.el-main') as HTMLElement | null
return ((elMain?.offsetWidth || 0) - 20) / zoom.value
}
// 初始化行高
@@ -170,8 +175,9 @@ const registerComponent = (path: string): Component | string | null => {
return null
}
}
// 缩放
const zoom = (value: any) => {
const setZoom = (value: any) => {
if (flag.value) {
layout.value = [{ ...value, x: 0, y: 0, w: 12, h: 6 }]
} else {
@@ -181,7 +187,6 @@ const zoom = (value: any) => {
component: registerComponent(item.path)
}))
}
console.log("🚀 ~ zoom ~ layout.value:", layout.value)
flag.value = !flag.value

View File

@@ -337,7 +337,7 @@ function dragEnd(row: any) {
name: row.name,
path: row.path,
icon: row.icon,
timeKey: row.timeKey
timeKeys: row.timeKeys
})
gridLayout.value.dragEvent('dragend', dragItem.i, dragItem.x, dragItem.y, dragItem.h, dragItem.w)
const item = gridLayout.value.getItem(dropId)

View File

@@ -43,7 +43,7 @@
:timeValue="datePickerRef.timeValue"
:height="rowHeight * item.h - seRowHeight(item.h) + 'px'"
:width="rowWidth * item.w - 30 + 'px'"
:timeKey="item.timeKey"
:timeKey="item.timeKeys"
/>
<div v-else class="pd10">组件加载失败...</div>
</div>

View File

@@ -1,14 +1,25 @@
<template>
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" width="1000px" :title="title"
@close="cancel">
<el-dialog
draggable
class="cn-operate-dialog"
v-model="dialogVisible"
width="1000px"
:title="title"
@close="cancel"
>
<div style="display: flex">
<el-form :inline="false" :model="form" label-width="auto" :rules="rules" ref="formRef" style="flex: 1">
<el-form-item class="top" label="组件名称" prop="name">
<el-input v-model="form.name" placeholder="请输入组件名称"></el-input>
</el-form-item>
<el-form-item class="top" label="父组件节点" prop="system">
<el-cascader v-model="form.system" :options="customDeptOption" :props="props" placeholder="请选择父组件节点"
style="width: 100%" />
<el-cascader
v-model="form.system"
:options="customDeptOption"
:props="props"
placeholder="请选择父组件节点"
style="width: 100%"
/>
</el-form-item>
<el-form-item label="组件图标" prop="icon">
<IconSelector v-model="form.icon" placeholder="请选择图标" />
@@ -19,24 +30,39 @@
<el-form-item class="top" label="组件路径" prop="path">
<el-input v-model="form.path" placeholder="请输入组件路径"></el-input>
</el-form-item>
<!-- <el-form-item class="top" label="组件查询时间">
<el-radio-group v-model="form.timeKey" style="width: 100%">
<el-form-item class="top" label="组件查询时间" prop="timeKeys">
<!-- <el-radio-group v-model="form.timeKeys" style="width: 100%">
<el-radio-button label="年" value="1" />
<el-radio-button label="季" value="2" />
<el-radio-button label="月" value="3" />
<el-radio-button label="周" value="4" />
<el-radio-button label="日" value="5" />
</el-radio-group>
</el-form-item> -->
</el-radio-group> -->
<el-checkbox-group v-model="form.timeKeys">
<el-checkbox-button value="1"></el-checkbox-button>
<el-checkbox-button value="2"></el-checkbox-button>
<el-checkbox-button value="3"></el-checkbox-button>
<el-checkbox-button value="4"></el-checkbox-button>
<el-checkbox-button value="5"></el-checkbox-button>
</el-checkbox-group>
</el-form-item>
<el-form-item class="top" label="组件排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入组件排序"></el-input>
</el-form-item>
</el-form>
<div style="width: 600px; height: 390px; overflow: hidden">
<div class="ml10" style="font-weight: 600">组件展示</div>
<component :is="registerComponent(form.path)" v-if="registerComponent(form.path)"
class="pd10 GridLayout" :key="form.path" :height="'350px'" :width="'580px'"
:timeKey="form.timeKey" :w="12" :h="6"/>
<component
:is="registerComponent(form.path)"
v-if="registerComponent(form.path)"
class="pd10 GridLayout"
:key="form.path"
:height="'350px'"
:width="'580px'"
:timeKey="form.timeKeys"
:w="12"
:h="6"
/>
<!-- <div class="pd10">组件加载失败...</div> -->
<el-empty v-else description="未查询到组件" style="height: 350px; width: 533px" />
</div>
@@ -67,7 +93,7 @@ const form = ref<anyObj>({
name: '',
sort: 100,
system: [],
timeKey: '3',
timeKeys: ['1', '2', '3', '4', '5'],
code: '',
path: ''
})
@@ -78,7 +104,8 @@ const rules = {
system: [{ required: true, message: '请先择父组件节点', trigger: 'change' }],
icon: [{ required: true, message: '请先择组件图标', trigger: 'change' }],
path: [{ required: true, message: '请输入组件路径', trigger: 'blur' }],
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }],
timeKeys: [{ required: true, message: '请选择组件查询时间', trigger: 'change' }]
}
const customDeptOption: any = ref([])
onMounted(() => {
@@ -98,6 +125,8 @@ const open = (text: string, data?: anyObj) => {
let Data = JSON.parse(JSON.stringify(data))
form.value = Data
form.value.system = [Data.systemType, Data.pid]
// form.value.timeKeys = Data.timeKeys.split(',').map(Number)
form.value.timeKeys = Data.timeKeys || []
}
}
const submit = () => {
@@ -105,7 +134,6 @@ const submit = () => {
if (valid) {
let url = ''
await html2canvas(document.querySelector('.GridLayout'), {
scale: 2
}).then(canvas => {
@@ -117,6 +145,7 @@ const submit = () => {
systemType: form.value.system[0],
pid: form.value.system[1],
image: url
}).then(res => {
ElMessage.success('新增成功!')
emit('submit')

View File

@@ -38,6 +38,7 @@ import { useDictData } from '@/stores/dictData'
import { getFatherComponent, componentAdd, componentEdit } from '@/api/user-boot/dept'
import { componentTree } from '@/api/user-boot/user'
import { pid } from 'process'
const dictData = useDictData()
const emit = defineEmits(['cancel', 'submit'])
const dialogVisible = ref(false)
@@ -47,7 +48,10 @@ const formRef = ref()
const form = ref<anyObj>({
name: '',
sort: 100,
system: ''
system: [],
timeKey: '3',
code: 'base',
})
const props = { label: 'name', value: 'id', checkStrictly: true }
const rules = {
@@ -110,7 +114,7 @@ const submit = () => {
await componentAdd({
...form.value,
systemType: form.value.system[0],
pid: form.value.system[1]
pid: form.value.system?.at(-1)
}).then(res => {
ElMessage.success('新增成功!')
emit('submit')

View File

@@ -90,15 +90,13 @@ const tableStore = new TableStore({
title: '确定删除?'
},
click: row => {
if (row.path == '' || row.path == null) {
} else {
deleteSubassembly({ id: row.id }).then(() => {
ElMessage.success('删除成功!')
tableStore.index()
})
}
}
}
]
}
],