Web/admin-sjzx
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

全局下拉框添加filterable属性

Browse Source
This commit is contained in:
guanj
2026-07-15 09:21:35 +08:00
parent 04c5eb7185
commit dc3b3cfc74
166 changed files with 8767 additions and 8649 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/components/DictSelect/src/DictSelect.vue
View File

@@ -1,46 +1,46 @@
<!-- 数据字典 Select 选择器 -->
<template>
<el-select class="w-1/1" v-bind="attrs">
<template v-if="valueType === 'int'">
<el-option
v-for="(dict, index) in getIntDictOptions(dictType)"
:key="index"
:label="dict.label"
:value="dict.value"
/>
</template>
<template v-if="valueType === 'str'">
<el-option
v-for="(dict, index) in getStrDictOptions(dictType)"
:key="index"
:label="dict.label"
:value="dict.value"
/>
</template>
<template v-if="valueType === 'bool'">
<el-option
v-for="(dict, index) in getBoolDictOptions(dictType)"
:key="index"
:label="dict.label"
:value="dict.value"
/>
</template>
</el-select>
</template>
<script lang="ts" setup>
import { getBoolDictOptions, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
// 接受父组件参数
interface Props {
dictType: string // 字典类型
valueType: string // 字典值类型
}
withDefaults(defineProps<Props>(), {
dictType: '',
valueType: 'str'
})
const attrs = useAttrs()
defineOptions({ name: 'DictSelect' })
</script>
<!-- 数据字典 Select 选择器 -->
<template>
<el-select class="w-1/1" v-bind="attrs" filterable>
<template v-if="valueType === 'int'">
<el-option
v-for="(dict, index) in getIntDictOptions(dictType)"
:key="index"
:label="dict.label"
:value="dict.value"
/>
</template>
<template v-if="valueType === 'str'">
<el-option
v-for="(dict, index) in getStrDictOptions(dictType)"
:key="index"
:label="dict.label"
:value="dict.value"
/>
</template>
<template v-if="valueType === 'bool'">
<el-option
v-for="(dict, index) in getBoolDictOptions(dictType)"
:key="index"
:label="dict.label"
:value="dict.value"
/>
</template>
</el-select>
</template>
<script lang="ts" setup>
import { getBoolDictOptions, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
// 接受父组件参数
interface Props {
dictType: string // 字典类型
valueType: string // 字典值类型
}
withDefaults(defineProps<Props>(), {
dictType: '',
valueType: 'str'
})
const attrs = useAttrs()
defineOptions({ name: 'DictSelect' })
</script>

6
src/components/bpmnProcessDesigner/package/penal/flow-condition/FlowCondition.vue
View File

@@ -2,14 +2,14 @@
<div class="panel-tab__content">
<el-form :model="flowConditionForm" label-width="90px" size="small">
<el-form-item label="流转类型">
<el-select v-model="flowConditionForm.type" @change="updateFlowType">
<el-select v-model="flowConditionForm.type" @change="updateFlowType" filterable>
<el-option label="普通流转路径" value="normal" />
<el-option label="默认流转路径" value="default" />
<el-option label="条件流转路径" value="condition" />
</el-select>
</el-form-item>
<el-form-item label="条件格式" v-if="flowConditionForm.type === 'condition'" key="condition">
<el-select v-model="flowConditionForm.conditionType">
<el-select v-model="flowConditionForm.conditionType" filterable>
<el-option label="表达式" value="expression" />
<el-option label="脚本" value="script" />
</el-select>
@@ -33,7 +33,7 @@
<el-input v-model="flowConditionForm.language" clearable @change="updateFlowCondition" />
</el-form-item>
<el-form-item label="脚本类型" key="scriptType">
<el-select v-model="flowConditionForm.scriptType">
<el-select v-model="flowConditionForm.scriptType" filterable>
<el-option label="内联脚本" value="inlineScript" />
<el-option label="外部脚本" value="externalScript" />
</el-select>

962
src/components/bpmnProcessDesigner/package/penal/form/ElementForm.vue
View File

@@ -1,481 +1,481 @@
<template>
<div class="panel-tab__content">
<el-form label-width="80px">
<el-form-item label="流程表单">
<!-- <el-input v-model="formKey" clearable @change="updateElementFormKey" />-->
<el-select v-model="formKey" clearable @change="updateElementFormKey">
<el-option v-for="form in formList" :key="form.id" :label="form.name" :value="form.id" />
</el-select>
</el-form-item>
<!-- <el-form-item label="业务标识">-->
<!-- <el-select v-model="businessKey" @change="updateElementBusinessKey">-->
<!-- <el-option v-for="i in fieldList" :key="i.id" :value="i.id" :label="i.label" />-->
<!-- <el-option label="无" value="" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
</el-form>
<!--字段列表-->
<!-- <div class="element-property list-property">-->
<!-- <el-divider><Icon icon="ep:coin" /> 表单字段</el-divider>-->
<!-- <el-table :data="fieldList" max-height="240" fit border>-->
<!-- <el-table-column label="序号" type="index" width="50px" />-->
<!-- <el-table-column label="字段名称" prop="label" min-width="80px" show-overflow-tooltip />-->
<!-- <el-table-column-->
<!-- label="字段类型"-->
<!-- prop="type"-->
<!-- min-width="80px"-->
<!-- :formatter="(row) => fieldType[row.type] || row.type"-->
<!-- show-overflow-tooltip-->
<!-- />-->
<!-- <el-table-column-->
<!-- label="默认值"-->
<!-- prop="defaultValue"-->
<!-- min-width="80px"-->
<!-- show-overflow-tooltip-->
<!-- />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button type="primary" link @click="openFieldForm(scope, scope.$index)"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeField(scope, scope.$index)"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- </div>-->
<!-- <div class="element-drawer__button">-->
<!-- <XButton type="primary" proIcon="ep:plus" title="添加字段" @click="openFieldForm(null, -1)" />-->
<!-- </div>-->
<!--字段配置侧边栏-->
<!-- <el-drawer-->
<!-- v-model="fieldModelVisible"-->
<!-- title="字段配置"-->
<!-- :size="`${width}px`"-->
<!-- append-to-body-->
<!-- destroy-on-close-->
<!-- >-->
<!-- <el-form :model="formFieldForm" label-width="90px">-->
<!-- <el-form-item label="字段ID">-->
<!-- <el-input v-model="formFieldForm.id" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="类型">-->
<!-- <el-select-->
<!-- v-model="formFieldForm.typeType"-->
<!-- placeholder="请选择字段类型"-->
<!-- clearable-->
<!-- @change="changeFieldTypeType"-->
<!-- >-->
<!-- <el-option v-for="(value, key) of fieldType" :label="value" :value="key" :key="key" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="类型名称" v-if="formFieldForm.typeType === 'custom'">-->
<!-- <el-input v-model="formFieldForm.type" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="名称">-->
<!-- <el-input v-model="formFieldForm.label" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="时间格式" v-if="formFieldForm.typeType === 'date'">-->
<!-- <el-input v-model="formFieldForm.datePattern" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="默认值">-->
<!-- <el-input v-model="formFieldForm.defaultValue" clearable />-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- &lt;!&ndash; 枚举值设置 &ndash;&gt;-->
<!-- <template v-if="formFieldForm.type === 'enum'">-->
<!-- <el-divider key="enum-divider" />-->
<!-- <p class="listener-filed__title" key="enum-title">-->
<!-- <span><Icon icon="ep:menu" />枚举值列表：</span>-->
<!-- <el-button type="primary" @click="openFieldOptionForm(null, -1, 'enum')"-->
<!-- >添加枚举值</el-button-->
<!-- >-->
<!-- </p>-->
<!-- <el-table :data="fieldEnumList" key="enum-table" max-height="240" fit border>-->
<!-- <el-table-column label="序号" width="50px" type="index" />-->
<!-- <el-table-column label="枚举值编号" prop="id" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="枚举值名称" prop="name" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- @click="openFieldOptionForm(scope, scope.$index, 'enum')"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeFieldOptionItem(scope, scope.$index, 'enum')"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- </template>-->
<!-- &lt;!&ndash; 校验规则 &ndash;&gt;-->
<!-- <el-divider key="validation-divider" />-->
<!-- <p class="listener-filed__title" key="validation-title">-->
<!-- <span><Icon icon="ep:menu" />约束条件列表：</span>-->
<!-- <el-button type="primary" @click="openFieldOptionForm(null, -1, 'constraint')"-->
<!-- >添加约束</el-button-->
<!-- >-->
<!-- </p>-->
<!-- <el-table :data="fieldConstraintsList" key="validation-table" max-height="240" fit border>-->
<!-- <el-table-column label="序号" width="50px" type="index" />-->
<!-- <el-table-column label="约束名称" prop="name" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="约束配置" prop="config" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- @click="openFieldOptionForm(scope, scope.$index, 'constraint')"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeFieldOptionItem(scope, scope.$index, 'constraint')"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- &lt;!&ndash; 表单属性 &ndash;&gt;-->
<!-- <el-divider key="property-divider" />-->
<!-- <p class="listener-filed__title" key="property-title">-->
<!-- <span><Icon icon="ep:menu" />字段属性列表：</span>-->
<!-- <el-button type="primary" @click="openFieldOptionForm(null, -1, 'property')"-->
<!-- >添加属性</el-button-->
<!-- >-->
<!-- </p>-->
<!-- <el-table :data="fieldPropertiesList" key="property-table" max-height="240" fit border>-->
<!-- <el-table-column label="序号" width="50px" type="index" />-->
<!-- <el-table-column label="属性编号" prop="id" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- @click="openFieldOptionForm(scope, scope.$index, 'property')"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeFieldOptionItem(scope, scope.$index, 'property')"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- &lt;!&ndash; 底部按钮 &ndash;&gt;-->
<!-- <div class="element-drawer__button">-->
<!-- <el-button>取 消</el-button>-->
<!-- <el-button type="primary" @click="saveField">保 存</el-button>-->
<!-- </div>-->
<!-- </el-drawer>-->
<!-- <el-dialog-->
<!-- v-model="fieldOptionModelVisible"-->
<!-- :title="optionModelTitle"-->
<!-- width="600px"-->
<!-- append-to-body-->
<!-- destroy-on-close-->
<!-- >-->
<!-- <el-form :model="fieldOptionForm" label-width="96px">-->
<!-- <el-form-item label="编号/ID" v-if="fieldOptionType !== 'constraint'" key="option-id">-->
<!-- <el-input v-model="fieldOptionForm.id" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="名称" v-if="fieldOptionType !== 'property'" key="option-name">-->
<!-- <el-input v-model="fieldOptionForm.name" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="配置" v-if="fieldOptionType === 'constraint'" key="option-config">-->
<!-- <el-input v-model="fieldOptionForm.config" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="值" v-if="fieldOptionType === 'property'" key="option-value">-->
<!-- <el-input v-model="fieldOptionForm.value" clearable />-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- <template #footer>-->
<!-- <el-button @click="fieldOptionModelVisible = false">取 消</el-button>-->
<!-- <el-button type="primary" @click="saveFieldOption">确 定</el-button>-->
<!-- </template>-->
<!-- </el-dialog>-->
</div>
</template>
<script lang="ts" setup>
import { getFormSimpleList } from '@/api/bpm-boot/form'
defineOptions({ name: 'ElementForm' })
const props = defineProps({
id: String,
type: String
})
const prefix = inject('prefix')
const width = inject('width')
const formKey = ref('')
const businessKey = ref('')
const optionModelTitle = ref('')
const fieldList = ref<any[]>([])
const formFieldForm = ref<any>({})
const fieldType = ref({
long: '长整型',
string: '字符串',
boolean: '布尔类',
date: '日期类',
enum: '枚举类',
custom: '自定义类型'
})
const formFieldIndex = ref(-1) // 编辑中的字段， -1 为新增
const formFieldOptionIndex = ref(-1) // 编辑中的字段配置项， -1 为新增
const fieldModelVisible = ref(false)
const fieldOptionModelVisible = ref(false)
const fieldOptionForm = ref<any>({}) // 当前激活的字段配置项数据
const fieldOptionType = ref('') // 当前激活的字段配置项弹窗 类型
const fieldEnumList = ref<any[]>([]) // 枚举值列表
const fieldConstraintsList = ref<any[]>([]) // 约束条件列表
const fieldPropertiesList = ref<any[]>([]) // 绑定属性列表
const bpmnELement = ref()
const elExtensionElements = ref()
const formData = ref()
const otherExtensions = ref()
const bpmnInstances = () => (window as any)?.bpmnInstances
const resetFormList = () => {
bpmnELement.value = bpmnInstances().bpmnElement
formKey.value = bpmnELement.value.businessObject.formKey
// if (formKey.value?.length > 0) {
// formKey.value = parseInt(formKey.value)
// }
// 获取元素扩展属性 或者 创建扩展属性
elExtensionElements.value =
bpmnELement.value.businessObject.get('extensionElements') ||
bpmnInstances().moddle.create('bpmn:ExtensionElements', { values: [] })
// 获取元素表单配置 或者 创建新的表单配置
formData.value =
elExtensionElements.value.values.filter((ex) => ex.$type === `${prefix}:FormData`)?.[0] ||
bpmnInstances().moddle.create(`${prefix}:FormData`, { fields: [] })
// 业务标识 businessKey， 绑定在 formData 中
businessKey.value = formData.value.businessKey
// 保留剩余扩展元素，便于后面更新该元素对应属性
otherExtensions.value = elExtensionElements.value.values.filter(
(ex) => ex.$type !== `${prefix}:FormData`
)
// 复制原始值，填充表格
fieldList.value = JSON.parse(JSON.stringify(formData.value.fields || []))
// 更新元素扩展属性，避免后续报错
updateElementExtensions()
}
const updateElementFormKey = () => {
bpmnInstances().modeling.updateProperties(toRaw(bpmnELement.value), {
formKey: formKey.value
})
}
const updateElementBusinessKey = () => {
bpmnInstances().modeling.updateModdleProperties(toRaw(bpmnELement.value), formData.value, {
businessKey: businessKey.value
})
}
// 根据类型调整字段type
const changeFieldTypeType = (type) => {
// this.$set(this.formFieldForm, "type", type === "custom" ? "" : type);
formFieldForm.value['type'] = type === 'custom' ? '' : type
}
// 打开字段详情侧边栏
const openFieldForm = (field, index) => {
formFieldIndex.value = index
if (index !== -1) {
const FieldObject = formData.value.fields[index]
formFieldForm.value = JSON.parse(JSON.stringify(field))
// 设置自定义类型
// this.$set(this.formFieldForm, "typeType", !this.fieldType[field.type] ? "custom" : field.type);
formFieldForm.value['typeType'] = !fieldType.value[field.type] ? 'custom' : field.type
// 初始化枚举值列表
field.type === 'enum' &&
(fieldEnumList.value = JSON.parse(JSON.stringify(FieldObject?.values || [])))
// 初始化约束条件列表
fieldConstraintsList.value = JSON.parse(
JSON.stringify(FieldObject?.validation?.constraints || [])
)
// 初始化自定义属性列表
fieldPropertiesList.value = JSON.parse(JSON.stringify(FieldObject?.properties?.values || []))
} else {
formFieldForm.value = {}
// 初始化枚举值列表
fieldEnumList.value = []
// 初始化约束条件列表
fieldConstraintsList.value = []
// 初始化自定义属性列表
fieldPropertiesList.value = []
}
fieldModelVisible.value = true
}
// 打开字段 某个 配置项 弹窗
const openFieldOptionForm = (option, index, type) => {
fieldOptionModelVisible.value = true
fieldOptionType.value = type
formFieldOptionIndex.value = index
if (type === 'property') {
fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
return (optionModelTitle.value = '属性配置')
}
if (type === 'enum') {
fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
return (optionModelTitle.value = '枚举值配置')
}
fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
return (optionModelTitle.value = '约束条件配置')
}
// 保存字段 某个 配置项
const saveFieldOption = () => {
if (formFieldOptionIndex.value === -1) {
if (fieldOptionType.value === 'property') {
fieldPropertiesList.value.push(fieldOptionForm.value)
}
if (fieldOptionType.value === 'constraint') {
fieldConstraintsList.value.push(fieldOptionForm.value)
}
if (fieldOptionType.value === 'enum') {
fieldEnumList.value.push(fieldOptionForm.value)
}
} else {
fieldOptionType.value === 'property' &&
fieldPropertiesList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
fieldOptionType.value === 'constraint' &&
fieldConstraintsList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
fieldOptionType.value === 'enum' &&
fieldEnumList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
}
fieldOptionModelVisible.value = false
fieldOptionForm.value = {}
}
// 保存字段配置
const saveField = () => {
const { id, type, label, defaultValue, datePattern } = formFieldForm.value
const Field = bpmnInstances().moddle.create(`${prefix}:FormField`, { id, type, label })
defaultValue && (Field.defaultValue = defaultValue)
datePattern && (Field.datePattern = datePattern)
// 构建属性
if (fieldPropertiesList.value && fieldPropertiesList.value.length) {
const fieldPropertyList = fieldPropertiesList.value.map((fp) => {
return bpmnInstances().moddle.create(`${prefix}:Property`, {
id: fp.id,
value: fp.value
})
})
Field.properties = bpmnInstances().moddle.create(`${prefix}:Properties`, {
values: fieldPropertyList
})
}
// 构建校验规则
if (fieldConstraintsList.value && fieldConstraintsList.value.length) {
const fieldConstraintList = fieldConstraintsList.value.map((fc) => {
return bpmnInstances().moddle.create(`${prefix}:Constraint`, {
name: fc.name,
config: fc.config
})
})
Field.validation = bpmnInstances().moddle.create(`${prefix}:Validation`, {
constraints: fieldConstraintList
})
}
// 构建枚举值
if (fieldEnumList.value && fieldEnumList.value.length) {
Field.values = fieldEnumList.value.map((fe) => {
return bpmnInstances().moddle.create(`${prefix}:Value`, { name: fe.name, id: fe.id })
})
}
// 更新数组 与 表单配置实例
if (formFieldIndex.value === -1) {
fieldList.value.push(formFieldForm.value)
formData.value.fields.push(Field)
} else {
fieldList.value.splice(formFieldIndex.value, 1, formFieldForm.value)
formData.value.fields.splice(formFieldIndex.value, 1, Field)
}
updateElementExtensions()
fieldModelVisible.value = false
}
// 移除某个 字段的 配置项
const removeFieldOptionItem = (option, index, type) => {
// console.log(option, 'option')
if (type === 'property') {
fieldPropertiesList.value.splice(index, 1)
return
}
if (type === 'enum') {
fieldEnumList.value.splice(index, 1)
return
}
fieldConstraintsList.value.splice(index, 1)
}
// 移除 字段
const removeField = (field, index) => {
console.log(field, 'field')
fieldList.value.splice(index, 1)
formData.value.fields.splice(index, 1)
updateElementExtensions()
}
const updateElementExtensions = () => {
// 更新回扩展元素
const newElExtensionElements = bpmnInstances().moddle.create(`bpmn:ExtensionElements`, {
values: otherExtensions.value.concat(formData.value)
})
// 更新到元素上
bpmnInstances().modeling.updateProperties(toRaw(bpmnELement.value), {
extensionElements: newElExtensionElements
})
}
const formList = ref([]) // 流程表单的下拉框的数据
onMounted(async () => {
await getFormSimpleList().then(res => {
formList.value = res.data
})
})
watch(
() => props.id,
(val) => {
val &&
val.length &&
nextTick(() => {
resetFormList()
})
},
{ immediate: true }
)
</script>
<template>
<div class="panel-tab__content">
<el-form label-width="80px">
<el-form-item label="流程表单">
<!-- <el-input v-model="formKey" clearable @change="updateElementFormKey" />-->
<el-select v-model="formKey" clearable @change="updateElementFormKey" filterable>
<el-option v-for="form in formList" :key="form.id" :label="form.name" :value="form.id" />
</el-select>
</el-form-item>
<!-- <el-form-item label="业务标识">-->
<!-- <el-select v-model="businessKey" @change="updateElementBusinessKey">-->
<!-- <el-option v-for="i in fieldList" :key="i.id" :value="i.id" :label="i.label" />-->
<!-- <el-option label="无" value="" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
</el-form>
<!--字段列表-->
<!-- <div class="element-property list-property">-->
<!-- <el-divider><Icon icon="ep:coin" /> 表单字段</el-divider>-->
<!-- <el-table :data="fieldList" max-height="240" fit border>-->
<!-- <el-table-column label="序号" type="index" width="50px" />-->
<!-- <el-table-column label="字段名称" prop="label" min-width="80px" show-overflow-tooltip />-->
<!-- <el-table-column-->
<!-- label="字段类型"-->
<!-- prop="type"-->
<!-- min-width="80px"-->
<!-- :formatter="(row) => fieldType[row.type] || row.type"-->
<!-- show-overflow-tooltip-->
<!-- />-->
<!-- <el-table-column-->
<!-- label="默认值"-->
<!-- prop="defaultValue"-->
<!-- min-width="80px"-->
<!-- show-overflow-tooltip-->
<!-- />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button type="primary" link @click="openFieldForm(scope, scope.$index)"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeField(scope, scope.$index)"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- </div>-->
<!-- <div class="element-drawer__button">-->
<!-- <XButton type="primary" proIcon="ep:plus" title="添加字段" @click="openFieldForm(null, -1)" />-->
<!-- </div>-->
<!--字段配置侧边栏-->
<!-- <el-drawer-->
<!-- v-model="fieldModelVisible"-->
<!-- title="字段配置"-->
<!-- :size="`${width}px`"-->
<!-- append-to-body-->
<!-- destroy-on-close-->
<!-- >-->
<!-- <el-form :model="formFieldForm" label-width="90px">-->
<!-- <el-form-item label="字段ID">-->
<!-- <el-input v-model="formFieldForm.id" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="类型">-->
<!-- <el-select-->
<!-- v-model="formFieldForm.typeType"-->
<!-- placeholder="请选择字段类型"-->
<!-- clearable-->
<!-- @change="changeFieldTypeType"-->
<!-- >-->
<!-- <el-option v-for="(value, key) of fieldType" :label="value" :value="key" :key="key" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="类型名称" v-if="formFieldForm.typeType === 'custom'">-->
<!-- <el-input v-model="formFieldForm.type" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="名称">-->
<!-- <el-input v-model="formFieldForm.label" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="时间格式" v-if="formFieldForm.typeType === 'date'">-->
<!-- <el-input v-model="formFieldForm.datePattern" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="默认值">-->
<!-- <el-input v-model="formFieldForm.defaultValue" clearable />-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- &lt;!&ndash; 枚举值设置 &ndash;&gt;-->
<!-- <template v-if="formFieldForm.type === 'enum'">-->
<!-- <el-divider key="enum-divider" />-->
<!-- <p class="listener-filed__title" key="enum-title">-->
<!-- <span><Icon icon="ep:menu" />枚举值列表：</span>-->
<!-- <el-button type="primary" @click="openFieldOptionForm(null, -1, 'enum')"-->
<!-- >添加枚举值</el-button-->
<!-- >-->
<!-- </p>-->
<!-- <el-table :data="fieldEnumList" key="enum-table" max-height="240" fit border>-->
<!-- <el-table-column label="序号" width="50px" type="index" />-->
<!-- <el-table-column label="枚举值编号" prop="id" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="枚举值名称" prop="name" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- @click="openFieldOptionForm(scope, scope.$index, 'enum')"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeFieldOptionItem(scope, scope.$index, 'enum')"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- </template>-->
<!-- &lt;!&ndash; 校验规则 &ndash;&gt;-->
<!-- <el-divider key="validation-divider" />-->
<!-- <p class="listener-filed__title" key="validation-title">-->
<!-- <span><Icon icon="ep:menu" />约束条件列表：</span>-->
<!-- <el-button type="primary" @click="openFieldOptionForm(null, -1, 'constraint')"-->
<!-- >添加约束</el-button-->
<!-- >-->
<!-- </p>-->
<!-- <el-table :data="fieldConstraintsList" key="validation-table" max-height="240" fit border>-->
<!-- <el-table-column label="序号" width="50px" type="index" />-->
<!-- <el-table-column label="约束名称" prop="name" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="约束配置" prop="config" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- @click="openFieldOptionForm(scope, scope.$index, 'constraint')"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeFieldOptionItem(scope, scope.$index, 'constraint')"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- &lt;!&ndash; 表单属性 &ndash;&gt;-->
<!-- <el-divider key="property-divider" />-->
<!-- <p class="listener-filed__title" key="property-title">-->
<!-- <span><Icon icon="ep:menu" />字段属性列表：</span>-->
<!-- <el-button type="primary" @click="openFieldOptionForm(null, -1, 'property')"-->
<!-- >添加属性</el-button-->
<!-- >-->
<!-- </p>-->
<!-- <el-table :data="fieldPropertiesList" key="property-table" max-height="240" fit border>-->
<!-- <el-table-column label="序号" width="50px" type="index" />-->
<!-- <el-table-column label="属性编号" prop="id" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />-->
<!-- <el-table-column label="操作" width="90px">-->
<!-- <template #default="scope">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- @click="openFieldOptionForm(scope, scope.$index, 'property')"-->
<!-- >编辑</el-button-->
<!-- >-->
<!-- <el-divider direction="vertical" />-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- link-->
<!-- style="color: #ff4d4f"-->
<!-- @click="removeFieldOptionItem(scope, scope.$index, 'property')"-->
<!-- >移除</el-button-->
<!-- >-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
<!-- &lt;!&ndash; 底部按钮 &ndash;&gt;-->
<!-- <div class="element-drawer__button">-->
<!-- <el-button>取 消</el-button>-->
<!-- <el-button type="primary" @click="saveField">保 存</el-button>-->
<!-- </div>-->
<!-- </el-drawer>-->
<!-- <el-dialog-->
<!-- v-model="fieldOptionModelVisible"-->
<!-- :title="optionModelTitle"-->
<!-- width="600px"-->
<!-- append-to-body-->
<!-- destroy-on-close-->
<!-- >-->
<!-- <el-form :model="fieldOptionForm" label-width="96px">-->
<!-- <el-form-item label="编号/ID" v-if="fieldOptionType !== 'constraint'" key="option-id">-->
<!-- <el-input v-model="fieldOptionForm.id" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="名称" v-if="fieldOptionType !== 'property'" key="option-name">-->
<!-- <el-input v-model="fieldOptionForm.name" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="配置" v-if="fieldOptionType === 'constraint'" key="option-config">-->
<!-- <el-input v-model="fieldOptionForm.config" clearable />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="值" v-if="fieldOptionType === 'property'" key="option-value">-->
<!-- <el-input v-model="fieldOptionForm.value" clearable />-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- <template #footer>-->
<!-- <el-button @click="fieldOptionModelVisible = false">取 消</el-button>-->
<!-- <el-button type="primary" @click="saveFieldOption">确 定</el-button>-->
<!-- </template>-->
<!-- </el-dialog>-->
</div>
</template>
<script lang="ts" setup>
import { getFormSimpleList } from '@/api/bpm-boot/form'
defineOptions({ name: 'ElementForm' })
const props = defineProps({
id: String,
type: String
})
const prefix = inject('prefix')
const width = inject('width')
const formKey = ref('')
const businessKey = ref('')
const optionModelTitle = ref('')
const fieldList = ref<any[]>([])
const formFieldForm = ref<any>({})
const fieldType = ref({
long: '长整型',
string: '字符串',
boolean: '布尔类',
date: '日期类',
enum: '枚举类',
custom: '自定义类型'
})
const formFieldIndex = ref(-1) // 编辑中的字段， -1 为新增
const formFieldOptionIndex = ref(-1) // 编辑中的字段配置项， -1 为新增
const fieldModelVisible = ref(false)
const fieldOptionModelVisible = ref(false)
const fieldOptionForm = ref<any>({}) // 当前激活的字段配置项数据
const fieldOptionType = ref('') // 当前激活的字段配置项弹窗 类型
const fieldEnumList = ref<any[]>([]) // 枚举值列表
const fieldConstraintsList = ref<any[]>([]) // 约束条件列表
const fieldPropertiesList = ref<any[]>([]) // 绑定属性列表
const bpmnELement = ref()
const elExtensionElements = ref()
const formData = ref()
const otherExtensions = ref()
const bpmnInstances = () => (window as any)?.bpmnInstances
const resetFormList = () => {
bpmnELement.value = bpmnInstances().bpmnElement
formKey.value = bpmnELement.value.businessObject.formKey
// if (formKey.value?.length > 0) {
// formKey.value = parseInt(formKey.value)
// }
// 获取元素扩展属性 或者 创建扩展属性
elExtensionElements.value =
bpmnELement.value.businessObject.get('extensionElements') ||
bpmnInstances().moddle.create('bpmn:ExtensionElements', { values: [] })
// 获取元素表单配置 或者 创建新的表单配置
formData.value =
elExtensionElements.value.values.filter((ex) => ex.$type === `${prefix}:FormData`)?.[0] ||
bpmnInstances().moddle.create(`${prefix}:FormData`, { fields: [] })
// 业务标识 businessKey， 绑定在 formData 中
businessKey.value = formData.value.businessKey
// 保留剩余扩展元素，便于后面更新该元素对应属性
otherExtensions.value = elExtensionElements.value.values.filter(
(ex) => ex.$type !== `${prefix}:FormData`
)
// 复制原始值，填充表格
fieldList.value = JSON.parse(JSON.stringify(formData.value.fields || []))
// 更新元素扩展属性，避免后续报错
updateElementExtensions()
}
const updateElementFormKey = () => {
bpmnInstances().modeling.updateProperties(toRaw(bpmnELement.value), {
formKey: formKey.value
})
}
const updateElementBusinessKey = () => {
bpmnInstances().modeling.updateModdleProperties(toRaw(bpmnELement.value), formData.value, {
businessKey: businessKey.value
})
}
// 根据类型调整字段type
const changeFieldTypeType = (type) => {
// this.$set(this.formFieldForm, "type", type === "custom" ? "" : type);
formFieldForm.value['type'] = type === 'custom' ? '' : type
}
// 打开字段详情侧边栏
const openFieldForm = (field, index) => {
formFieldIndex.value = index
if (index !== -1) {
const FieldObject = formData.value.fields[index]
formFieldForm.value = JSON.parse(JSON.stringify(field))
// 设置自定义类型
// this.$set(this.formFieldForm, "typeType", !this.fieldType[field.type] ? "custom" : field.type);
formFieldForm.value['typeType'] = !fieldType.value[field.type] ? 'custom' : field.type
// 初始化枚举值列表
field.type === 'enum' &&
(fieldEnumList.value = JSON.parse(JSON.stringify(FieldObject?.values || [])))
// 初始化约束条件列表
fieldConstraintsList.value = JSON.parse(
JSON.stringify(FieldObject?.validation?.constraints || [])
)
// 初始化自定义属性列表
fieldPropertiesList.value = JSON.parse(JSON.stringify(FieldObject?.properties?.values || []))
} else {
formFieldForm.value = {}
// 初始化枚举值列表
fieldEnumList.value = []
// 初始化约束条件列表
fieldConstraintsList.value = []
// 初始化自定义属性列表
fieldPropertiesList.value = []
}
fieldModelVisible.value = true
}
// 打开字段 某个 配置项 弹窗
const openFieldOptionForm = (option, index, type) => {
fieldOptionModelVisible.value = true
fieldOptionType.value = type
formFieldOptionIndex.value = index
if (type === 'property') {
fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
return (optionModelTitle.value = '属性配置')
}
if (type === 'enum') {
fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
return (optionModelTitle.value = '枚举值配置')
}
fieldOptionForm.value = option ? JSON.parse(JSON.stringify(option)) : {}
return (optionModelTitle.value = '约束条件配置')
}
// 保存字段 某个 配置项
const saveFieldOption = () => {
if (formFieldOptionIndex.value === -1) {
if (fieldOptionType.value === 'property') {
fieldPropertiesList.value.push(fieldOptionForm.value)
}
if (fieldOptionType.value === 'constraint') {
fieldConstraintsList.value.push(fieldOptionForm.value)
}
if (fieldOptionType.value === 'enum') {
fieldEnumList.value.push(fieldOptionForm.value)
}
} else {
fieldOptionType.value === 'property' &&
fieldPropertiesList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
fieldOptionType.value === 'constraint' &&
fieldConstraintsList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
fieldOptionType.value === 'enum' &&
fieldEnumList.value.splice(formFieldOptionIndex.value, 1, fieldOptionForm.value)
}
fieldOptionModelVisible.value = false
fieldOptionForm.value = {}
}
// 保存字段配置
const saveField = () => {
const { id, type, label, defaultValue, datePattern } = formFieldForm.value
const Field = bpmnInstances().moddle.create(`${prefix}:FormField`, { id, type, label })
defaultValue && (Field.defaultValue = defaultValue)
datePattern && (Field.datePattern = datePattern)
// 构建属性
if (fieldPropertiesList.value && fieldPropertiesList.value.length) {
const fieldPropertyList = fieldPropertiesList.value.map((fp) => {
return bpmnInstances().moddle.create(`${prefix}:Property`, {
id: fp.id,
value: fp.value
})
})
Field.properties = bpmnInstances().moddle.create(`${prefix}:Properties`, {
values: fieldPropertyList
})
}
// 构建校验规则
if (fieldConstraintsList.value && fieldConstraintsList.value.length) {
const fieldConstraintList = fieldConstraintsList.value.map((fc) => {
return bpmnInstances().moddle.create(`${prefix}:Constraint`, {
name: fc.name,
config: fc.config
})
})
Field.validation = bpmnInstances().moddle.create(`${prefix}:Validation`, {
constraints: fieldConstraintList
})
}
// 构建枚举值
if (fieldEnumList.value && fieldEnumList.value.length) {
Field.values = fieldEnumList.value.map((fe) => {
return bpmnInstances().moddle.create(`${prefix}:Value`, { name: fe.name, id: fe.id })
})
}
// 更新数组 与 表单配置实例
if (formFieldIndex.value === -1) {
fieldList.value.push(formFieldForm.value)
formData.value.fields.push(Field)
} else {
fieldList.value.splice(formFieldIndex.value, 1, formFieldForm.value)
formData.value.fields.splice(formFieldIndex.value, 1, Field)
}
updateElementExtensions()
fieldModelVisible.value = false
}
// 移除某个 字段的 配置项
const removeFieldOptionItem = (option, index, type) => {
// console.log(option, 'option')
if (type === 'property') {
fieldPropertiesList.value.splice(index, 1)
return
}
if (type === 'enum') {
fieldEnumList.value.splice(index, 1)
return
}
fieldConstraintsList.value.splice(index, 1)
}
// 移除 字段
const removeField = (field, index) => {
console.log(field, 'field')
fieldList.value.splice(index, 1)
formData.value.fields.splice(index, 1)
updateElementExtensions()
}
const updateElementExtensions = () => {
// 更新回扩展元素
const newElExtensionElements = bpmnInstances().moddle.create(`bpmn:ExtensionElements`, {
values: otherExtensions.value.concat(formData.value)
})
// 更新到元素上
bpmnInstances().modeling.updateProperties(toRaw(bpmnELement.value), {
extensionElements: newElExtensionElements
})
}
const formList = ref([]) // 流程表单的下拉框的数据
onMounted(async () => {
await getFormSimpleList().then(res => {
formList.value = res.data
})
})
watch(
() => props.id,
(val) => {
val &&
val.length &&
nextTick(() => {
resetFormList()
})
},
{ immediate: true }
)
</script>

8
src/components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue
View File

@@ -64,7 +64,7 @@
prop='event'
:rules="{ required: true, trigger: ['blur', 'change'] }"
>
<el-select v-model='listenerForm.event'>
<el-select v-model='listenerForm.event' filterable>
<el-option label='start' value='start' />
<el-option label='end' value='end' />
</el-select>
@@ -74,7 +74,7 @@
prop='listenerType'
:rules="{ required: true, trigger: ['blur', 'change'] }"
>
<el-select v-model='listenerForm.listenerType'>
<el-select v-model='listenerForm.listenerType' filterable>
<el-option
v-for='i in Object.keys(listenerTypeObject)'
:key='i'
@@ -125,7 +125,7 @@
key='listener-script-type'
:rules="{ required: true, trigger: ['blur', 'change'], message: '请选择脚本类型' }"
>
<el-select v-model='listenerForm.scriptType'>
<el-select v-model='listenerForm.scriptType' filterable>
<el-option label='内联脚本' value='inlineScript' />
<el-option label='外部脚本' value='externalScript' />
</el-select>
@@ -228,7 +228,7 @@
prop='fieldType'
:rules="{ required: true, trigger: ['blur', 'change'] }"
>
<el-select v-model='listenerFieldForm.fieldType'>
<el-select v-model='listenerFieldForm.fieldType' filterable>
<el-option
v-for='i in Object.keys(fieldTypeObject)'
:key='i'

10
src/components/bpmnProcessDesigner/package/penal/listeners/UserTaskListeners.vue
View File

@@ -62,7 +62,7 @@
prop="event"
:rules="{ required: true, trigger: ['blur', 'change'] }"
>
<el-select v-model="listenerForm.event">
<el-select v-model="listenerForm.event" filterable>
<el-option
v-for="i in Object.keys(listenerEventTypeObject)"
:key="i"
@@ -83,7 +83,7 @@
prop="listenerType"
:rules="{ required: true, trigger: ['blur', 'change'] }"
>
<el-select v-model="listenerForm.listenerType">
<el-select v-model="listenerForm.listenerType" filterable>
<el-option
v-for="i in Object.keys(listenerTypeObject)"
:key="i"
@@ -134,7 +134,7 @@
key="listener-script-type"
:rules="{ required: true, trigger: ['blur', 'change'], message: '请选择脚本类型' }"
>
<el-select v-model="listenerForm.scriptType">
<el-select v-model="listenerForm.scriptType" filterable>
<el-option label="内联脚本" value="inlineScript" />
<el-option label="外部脚本" value="externalScript" />
</el-select>
@@ -161,7 +161,7 @@
<template v-if="listenerForm.event === 'timeout'">
<el-form-item label="定时器类型" prop="eventDefinitionType" key="eventDefinitionType">
<el-select v-model="listenerForm.eventDefinitionType">
<el-select v-model="listenerForm.eventDefinitionType" filterable>
<el-option label="统计时间" value="date" />
<el-option label="持续时长" value="duration" />
<el-option label="循环" value="cycle" />
@@ -259,7 +259,7 @@
prop="fieldType"
:rules="{ required: true, trigger: ['blur', 'change'] }"
>
<el-select v-model="listenerFieldForm.fieldType">
<el-select v-model="listenerFieldForm.fieldType" filterable>
<el-option
v-for="i in Object.keys(fieldTypeObject)"
:key="i"

560
src/components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue
View File

@@ -1,280 +1,280 @@
<template>
<div class="panel-tab__content">
<el-form label-width="90px">
<el-form-item label="快捷配置">
<el-button size="small" @click="changeConfig('依次审批')">依次审批</el-button>
<el-button size="small" @click="changeConfig('会签')">会签</el-button>
<el-button size="small" @click="changeConfig('或签')">或签</el-button>
</el-form-item>
<el-form-item label="会签类型">
<el-select v-model="loopCharacteristics" @change="changeLoopCharacteristicsType">
<el-option label="并行多重事件" value="ParallelMultiInstance" />
<el-option label="时序多重事件" value="SequentialMultiInstance" />
<el-option label="无" value="Null" />
</el-select>
</el-form-item>
<template
v-if="
loopCharacteristics === 'ParallelMultiInstance' ||
loopCharacteristics === 'SequentialMultiInstance'
"
>
<el-form-item label="循环数量" key="loopCardinality">
<el-input
v-model="loopInstanceForm.loopCardinality"
clearable
@change="updateLoopCardinality"
/>
</el-form-item>
<el-form-item label="集合" key="collection" v-show="false">
<el-input v-model="loopInstanceForm.collection" clearable @change="updateLoopBase" />
</el-form-item>
<!-- add by 芋艿：由于「元素变量」暂时用不到，所以这里 display 为 none -->
<el-form-item label="元素变量" key="elementVariable" style="display: none">
<el-input v-model="loopInstanceForm.elementVariable" clearable @change="updateLoopBase" />
</el-form-item>
<el-form-item label="完成条件" key="completionCondition">
<el-input
v-model="loopInstanceForm.completionCondition"
clearable
@change="updateLoopCondition"
/>
</el-form-item>
<!-- add by 芋艿：由于「异步状态」暂时用不到，所以这里 display 为 none -->
<el-form-item label="异步状态" key="async" style="display: none">
<el-checkbox
v-model="loopInstanceForm.asyncBefore"
label="异步前"
@change="updateLoopAsync('asyncBefore')"
/>
<el-checkbox
v-model="loopInstanceForm.asyncAfter"
label="异步后"
@change="updateLoopAsync('asyncAfter')"
/>
<el-checkbox
v-model="loopInstanceForm.exclusive"
v-if="loopInstanceForm.asyncAfter || loopInstanceForm.asyncBefore"
label="排除"
@change="updateLoopAsync('exclusive')"
/>
</el-form-item>
<el-form-item
label="重试周期"
prop="timeCycle"
v-if="loopInstanceForm.asyncAfter || loopInstanceForm.asyncBefore"
key="timeCycle"
>
<el-input v-model="loopInstanceForm.timeCycle" clearable @change="updateLoopTimeCycle" />
</el-form-item>
</template>
</el-form>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'ElementMultiInstance' })
const props = defineProps({
businessObject: Object,
type: String
})
const prefix = inject('prefix')
const loopCharacteristics = ref('')
//默认配置，用来覆盖原始不存在的选项，避免报错
const defaultLoopInstanceForm = ref({
completionCondition: '',
loopCardinality: '',
extensionElements: [],
asyncAfter: false,
asyncBefore: false,
exclusive: false
})
const loopInstanceForm = ref<any>({})
const bpmnElement = ref(null)
const multiLoopInstance = ref(null)
const bpmnInstances = () => (window as any)?.bpmnInstances
const getElementLoop = (businessObject) => {
if (!businessObject.loopCharacteristics) {
loopCharacteristics.value = 'Null'
loopInstanceForm.value = {}
return
}
if (businessObject.loopCharacteristics.$type === 'bpmn:StandardLoopCharacteristics') {
loopCharacteristics.value = 'StandardLoop'
loopInstanceForm.value = {}
return
}
if (businessObject.loopCharacteristics.isSequential) {
loopCharacteristics.value = 'SequentialMultiInstance'
} else {
loopCharacteristics.value = 'ParallelMultiInstance'
}
// 合并配置
loopInstanceForm.value = {
...defaultLoopInstanceForm.value,
...businessObject.loopCharacteristics,
completionCondition: businessObject.loopCharacteristics?.completionCondition?.body ?? '',
loopCardinality: businessObject.loopCharacteristics?.loopCardinality?.body ?? ''
}
// 保留当前元素 businessObject 上的 loopCharacteristics 实例
multiLoopInstance.value = bpmnInstances().bpmnElement.businessObject.loopCharacteristics
// 更新表单
if (
businessObject.loopCharacteristics.extensionElements &&
businessObject.loopCharacteristics.extensionElements.values &&
businessObject.loopCharacteristics.extensionElements.values.length
) {
loopInstanceForm.value['timeCycle'] =
businessObject.loopCharacteristics.extensionElements.values[0].body
}
}
const changeLoopCharacteristicsType = (type) => {
// this.loopInstanceForm = { ...this.defaultLoopInstanceForm }; // 切换类型取消原表单配置
// 取消多实例配置
if (type === 'Null') {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
loopCharacteristics: null
})
return
}
// 配置循环
if (type === 'StandardLoop') {
const loopCharacteristicsObject = bpmnInstances().moddle.create(
'bpmn:StandardLoopCharacteristics'
)
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
loopCharacteristics: loopCharacteristicsObject
})
multiLoopInstance.value = null
return
}
// 时序
if (type === 'SequentialMultiInstance') {
multiLoopInstance.value = bpmnInstances().moddle.create(
'bpmn:MultiInstanceLoopCharacteristics',
{ isSequential: true }
)
} else {
multiLoopInstance.value = bpmnInstances().moddle.create(
'bpmn:MultiInstanceLoopCharacteristics',
{ collection: '${coll_userList}' }
)
}
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
loopCharacteristics: toRaw(multiLoopInstance.value)
})
}
// 循环基数
const updateLoopCardinality = (cardinality) => {
let loopCardinality = null
if (cardinality && cardinality.length) {
loopCardinality = bpmnInstances().moddle.create('bpmn:FormalExpression', {
body: cardinality
})
}
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
loopCardinality
}
)
}
// 完成条件
const updateLoopCondition = (condition) => {
let completionCondition = null
if (condition && condition.length) {
completionCondition = bpmnInstances().moddle.create('bpmn:FormalExpression', {
body: condition
})
}
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
completionCondition
}
)
}
// 重试周期
const updateLoopTimeCycle = (timeCycle) => {
const extensionElements = bpmnInstances().moddle.create('bpmn:ExtensionElements', {
values: [
bpmnInstances().moddle.create(`${prefix}:FailedJobRetryTimeCycle`, {
body: timeCycle
})
]
})
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
extensionElements
}
)
}
// 直接更新的基础信息
const updateLoopBase = () => {
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
collection: loopInstanceForm.value.collection || null,
elementVariable: loopInstanceForm.value.elementVariable || null
}
)
}
// 各异步状态
const updateLoopAsync = (key) => {
const { asyncBefore, asyncAfter } = loopInstanceForm.value
let asyncAttr = Object.create(null)
if (!asyncBefore && !asyncAfter) {
// this.$set(this.loopInstanceForm, "exclusive", false);
loopInstanceForm.value['exclusive'] = false
asyncAttr = { asyncBefore: false, asyncAfter: false, exclusive: false, extensionElements: null }
} else {
asyncAttr[key] = loopInstanceForm.value[key]
}
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
asyncAttr
)
}
const changeConfig = (config) => {
if (config === '依次审批') {
changeLoopCharacteristicsType('SequentialMultiInstance')
updateLoopCardinality('1')
updateLoopCondition('${ nrOfCompletedInstances >= nrOfInstances }')
} else if (config === '会签') {
changeLoopCharacteristicsType('ParallelMultiInstance')
updateLoopCondition('${ nrOfCompletedInstances >= nrOfInstances }')
} else if (config === '或签') {
changeLoopCharacteristicsType('ParallelMultiInstance')
updateLoopCondition('${ nrOfCompletedInstances > 0 }')
}
}
onBeforeUnmount(() => {
multiLoopInstance.value = null
bpmnElement.value = null
})
watch(
() => props.businessObject,
(val) => {
bpmnElement.value = bpmnInstances().bpmnElement
getElementLoop(val)
},
{ immediate: true }
)
</script>
<template>
<div class="panel-tab__content">
<el-form label-width="90px">
<el-form-item label="快捷配置">
<el-button size="small" @click="changeConfig('依次审批')">依次审批</el-button>
<el-button size="small" @click="changeConfig('会签')">会签</el-button>
<el-button size="small" @click="changeConfig('或签')">或签</el-button>
</el-form-item>
<el-form-item label="会签类型">
<el-select v-model="loopCharacteristics" @change="changeLoopCharacteristicsType" filterable>
<el-option label="并行多重事件" value="ParallelMultiInstance" />
<el-option label="时序多重事件" value="SequentialMultiInstance" />
<el-option label="无" value="Null" />
</el-select>
</el-form-item>
<template
v-if="
loopCharacteristics === 'ParallelMultiInstance' ||
loopCharacteristics === 'SequentialMultiInstance'
"
>
<el-form-item label="循环数量" key="loopCardinality">
<el-input
v-model="loopInstanceForm.loopCardinality"
clearable
@change="updateLoopCardinality"
/>
</el-form-item>
<el-form-item label="集合" key="collection" v-show="false">
<el-input v-model="loopInstanceForm.collection" clearable @change="updateLoopBase" />
</el-form-item>
<!-- add by 芋艿：由于「元素变量」暂时用不到，所以这里 display 为 none -->
<el-form-item label="元素变量" key="elementVariable" style="display: none">
<el-input v-model="loopInstanceForm.elementVariable" clearable @change="updateLoopBase" />
</el-form-item>
<el-form-item label="完成条件" key="completionCondition">
<el-input
v-model="loopInstanceForm.completionCondition"
clearable
@change="updateLoopCondition"
/>
</el-form-item>
<!-- add by 芋艿：由于「异步状态」暂时用不到，所以这里 display 为 none -->
<el-form-item label="异步状态" key="async" style="display: none">
<el-checkbox
v-model="loopInstanceForm.asyncBefore"
label="异步前"
@change="updateLoopAsync('asyncBefore')"
/>
<el-checkbox
v-model="loopInstanceForm.asyncAfter"
label="异步后"
@change="updateLoopAsync('asyncAfter')"
/>
<el-checkbox
v-model="loopInstanceForm.exclusive"
v-if="loopInstanceForm.asyncAfter || loopInstanceForm.asyncBefore"
label="排除"
@change="updateLoopAsync('exclusive')"
/>
</el-form-item>
<el-form-item
label="重试周期"
prop="timeCycle"
v-if="loopInstanceForm.asyncAfter || loopInstanceForm.asyncBefore"
key="timeCycle"
>
<el-input v-model="loopInstanceForm.timeCycle" clearable @change="updateLoopTimeCycle" />
</el-form-item>
</template>
</el-form>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'ElementMultiInstance' })
const props = defineProps({
businessObject: Object,
type: String
})
const prefix = inject('prefix')
const loopCharacteristics = ref('')
//默认配置，用来覆盖原始不存在的选项，避免报错
const defaultLoopInstanceForm = ref({
completionCondition: '',
loopCardinality: '',
extensionElements: [],
asyncAfter: false,
asyncBefore: false,
exclusive: false
})
const loopInstanceForm = ref<any>({})
const bpmnElement = ref(null)
const multiLoopInstance = ref(null)
const bpmnInstances = () => (window as any)?.bpmnInstances
const getElementLoop = (businessObject) => {
if (!businessObject.loopCharacteristics) {
loopCharacteristics.value = 'Null'
loopInstanceForm.value = {}
return
}
if (businessObject.loopCharacteristics.$type === 'bpmn:StandardLoopCharacteristics') {
loopCharacteristics.value = 'StandardLoop'
loopInstanceForm.value = {}
return
}
if (businessObject.loopCharacteristics.isSequential) {
loopCharacteristics.value = 'SequentialMultiInstance'
} else {
loopCharacteristics.value = 'ParallelMultiInstance'
}
// 合并配置
loopInstanceForm.value = {
...defaultLoopInstanceForm.value,
...businessObject.loopCharacteristics,
completionCondition: businessObject.loopCharacteristics?.completionCondition?.body ?? '',
loopCardinality: businessObject.loopCharacteristics?.loopCardinality?.body ?? ''
}
// 保留当前元素 businessObject 上的 loopCharacteristics 实例
multiLoopInstance.value = bpmnInstances().bpmnElement.businessObject.loopCharacteristics
// 更新表单
if (
businessObject.loopCharacteristics.extensionElements &&
businessObject.loopCharacteristics.extensionElements.values &&
businessObject.loopCharacteristics.extensionElements.values.length
) {
loopInstanceForm.value['timeCycle'] =
businessObject.loopCharacteristics.extensionElements.values[0].body
}
}
const changeLoopCharacteristicsType = (type) => {
// this.loopInstanceForm = { ...this.defaultLoopInstanceForm }; // 切换类型取消原表单配置
// 取消多实例配置
if (type === 'Null') {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
loopCharacteristics: null
})
return
}
// 配置循环
if (type === 'StandardLoop') {
const loopCharacteristicsObject = bpmnInstances().moddle.create(
'bpmn:StandardLoopCharacteristics'
)
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
loopCharacteristics: loopCharacteristicsObject
})
multiLoopInstance.value = null
return
}
// 时序
if (type === 'SequentialMultiInstance') {
multiLoopInstance.value = bpmnInstances().moddle.create(
'bpmn:MultiInstanceLoopCharacteristics',
{ isSequential: true }
)
} else {
multiLoopInstance.value = bpmnInstances().moddle.create(
'bpmn:MultiInstanceLoopCharacteristics',
{ collection: '${coll_userList}' }
)
}
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
loopCharacteristics: toRaw(multiLoopInstance.value)
})
}
// 循环基数
const updateLoopCardinality = (cardinality) => {
let loopCardinality = null
if (cardinality && cardinality.length) {
loopCardinality = bpmnInstances().moddle.create('bpmn:FormalExpression', {
body: cardinality
})
}
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
loopCardinality
}
)
}
// 完成条件
const updateLoopCondition = (condition) => {
let completionCondition = null
if (condition && condition.length) {
completionCondition = bpmnInstances().moddle.create('bpmn:FormalExpression', {
body: condition
})
}
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
completionCondition
}
)
}
// 重试周期
const updateLoopTimeCycle = (timeCycle) => {
const extensionElements = bpmnInstances().moddle.create('bpmn:ExtensionElements', {
values: [
bpmnInstances().moddle.create(`${prefix}:FailedJobRetryTimeCycle`, {
body: timeCycle
})
]
})
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
extensionElements
}
)
}
// 直接更新的基础信息
const updateLoopBase = () => {
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
{
collection: loopInstanceForm.value.collection || null,
elementVariable: loopInstanceForm.value.elementVariable || null
}
)
}
// 各异步状态
const updateLoopAsync = (key) => {
const { asyncBefore, asyncAfter } = loopInstanceForm.value
let asyncAttr = Object.create(null)
if (!asyncBefore && !asyncAfter) {
// this.$set(this.loopInstanceForm, "exclusive", false);
loopInstanceForm.value['exclusive'] = false
asyncAttr = { asyncBefore: false, asyncAfter: false, exclusive: false, extensionElements: null }
} else {
asyncAttr[key] = loopInstanceForm.value[key]
}
bpmnInstances().modeling.updateModdleProperties(
toRaw(bpmnElement.value),
multiLoopInstance.value,
asyncAttr
)
}
const changeConfig = (config) => {
if (config === '依次审批') {
changeLoopCharacteristicsType('SequentialMultiInstance')
updateLoopCardinality('1')
updateLoopCondition('${ nrOfCompletedInstances >= nrOfInstances }')
} else if (config === '会签') {
changeLoopCharacteristicsType('ParallelMultiInstance')
updateLoopCondition('${ nrOfCompletedInstances >= nrOfInstances }')
} else if (config === '或签') {
changeLoopCharacteristicsType('ParallelMultiInstance')
updateLoopCondition('${ nrOfCompletedInstances > 0 }')
}
}
onBeforeUnmount(() => {
multiLoopInstance.value = null
bpmnElement.value = null
})
watch(
() => props.businessObject,
(val) => {
bpmnElement.value = bpmnInstances().bpmnElement
getElementLoop(val)
},
{ immediate: true }
)
</script>

250
src/components/bpmnProcessDesigner/package/penal/task/task-components/ReceiveTask.vue
View File

@@ -1,125 +1,125 @@
<template>
<div style="margin-top: 16px">
<el-form-item label="消息实例">
<div
style="
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: nowrap;
"
>
<el-select v-model="bindMessageId" @change="updateTaskMessage">
<el-option
v-for="key in Object.keys(messageMap)"
:value="key"
:label="messageMap[key]"
:key="key"
/>
</el-select>
<XButton
type="primary"
preIcon="ep:plus"
style="margin-left: 8px"
@click="openMessageModel"
/>
</div>
</el-form-item>
<el-dialog
v-model="messageModelVisible"
:close-on-click-modal="false"
title="创建新消息"
width="400px"
append-to-body
destroy-on-close
>
<el-form :model="newMessageForm" size="small" label-width="90px">
<el-form-item label="消息ID">
<el-input v-model="newMessageForm.id" clearable />
</el-form-item>
<el-form-item label="消息名称">
<el-input v-model="newMessageForm.name" clearable />
</el-form-item>
</el-form>
<template #footer>
<el-button size="small" type="primary" @click="createNewMessage">确 认</el-button>
</template>
</el-dialog>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'ReceiveTask' })
const props = defineProps({
id: String,
type: String
})
const message = useMessage()
const bindMessageId = ref('')
const newMessageForm = ref<any>({})
const messageMap = ref<any>({})
const messageModelVisible = ref(false)
const bpmnElement = ref<any>()
const bpmnMessageRefsMap = ref<any>()
const bpmnRootElements = ref<any>()
const bpmnInstances = () => (window as any).bpmnInstances
const getBindMessage = () => {
bpmnElement.value = bpmnInstances().bpmnElement
bindMessageId.value = bpmnElement.value.businessObject?.messageRef?.id || '-1'
}
const openMessageModel = () => {
messageModelVisible.value = true
newMessageForm.value = {}
}
const createNewMessage = () => {
if (messageMap.value[newMessageForm.value.id]) {
message.error('该消息已存在，请修改id后重新保存')
return
}
const newMessage = bpmnInstances().moddle.create('bpmn:Message', newMessageForm.value)
bpmnRootElements.value.push(newMessage)
messageMap.value[newMessageForm.value.id] = newMessageForm.value.name
bpmnMessageRefsMap.value[newMessageForm.value.id] = newMessage
messageModelVisible.value = false
}
const updateTaskMessage = (messageId) => {
if (messageId === '-1') {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
messageRef: null
})
} else {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
messageRef: bpmnMessageRefsMap.value[messageId]
})
}
}
onMounted(() => {
bpmnMessageRefsMap.value = Object.create(null)
bpmnRootElements.value = bpmnInstances().modeler.getDefinitions().rootElements
bpmnRootElements.value
.filter((el) => el.$type === 'bpmn:Message')
.forEach((m) => {
bpmnMessageRefsMap.value[m.id] = m
messageMap.value[m.id] = m.name
})
messageMap.value['-1'] = '无'
})
onBeforeUnmount(() => {
bpmnElement.value = null
})
watch(
() => props.id,
() => {
// bpmnElement.value = bpmnInstances().bpmnElement
nextTick(() => {
getBindMessage()
})
},
{ immediate: true }
)
</script>
<template>
<div style="margin-top: 16px">
<el-form-item label="消息实例">
<div
style="
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: nowrap;
"
>
<el-select v-model="bindMessageId" @change="updateTaskMessage" filterable>
<el-option
v-for="key in Object.keys(messageMap)"
:value="key"
:label="messageMap[key]"
:key="key"
/>
</el-select>
<XButton
type="primary"
preIcon="ep:plus"
style="margin-left: 8px"
@click="openMessageModel"
/>
</div>
</el-form-item>
<el-dialog
v-model="messageModelVisible"
:close-on-click-modal="false"
title="创建新消息"
width="400px"
append-to-body
destroy-on-close
>
<el-form :model="newMessageForm" size="small" label-width="90px">
<el-form-item label="消息ID">
<el-input v-model="newMessageForm.id" clearable />
</el-form-item>
<el-form-item label="消息名称">
<el-input v-model="newMessageForm.name" clearable />
</el-form-item>
</el-form>
<template #footer>
<el-button size="small" type="primary" @click="createNewMessage">确 认</el-button>
</template>
</el-dialog>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'ReceiveTask' })
const props = defineProps({
id: String,
type: String
})
const message = useMessage()
const bindMessageId = ref('')
const newMessageForm = ref<any>({})
const messageMap = ref<any>({})
const messageModelVisible = ref(false)
const bpmnElement = ref<any>()
const bpmnMessageRefsMap = ref<any>()
const bpmnRootElements = ref<any>()
const bpmnInstances = () => (window as any).bpmnInstances
const getBindMessage = () => {
bpmnElement.value = bpmnInstances().bpmnElement
bindMessageId.value = bpmnElement.value.businessObject?.messageRef?.id || '-1'
}
const openMessageModel = () => {
messageModelVisible.value = true
newMessageForm.value = {}
}
const createNewMessage = () => {
if (messageMap.value[newMessageForm.value.id]) {
message.error('该消息已存在，请修改id后重新保存')
return
}
const newMessage = bpmnInstances().moddle.create('bpmn:Message', newMessageForm.value)
bpmnRootElements.value.push(newMessage)
messageMap.value[newMessageForm.value.id] = newMessageForm.value.name
bpmnMessageRefsMap.value[newMessageForm.value.id] = newMessage
messageModelVisible.value = false
}
const updateTaskMessage = (messageId) => {
if (messageId === '-1') {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
messageRef: null
})
} else {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
messageRef: bpmnMessageRefsMap.value[messageId]
})
}
}
onMounted(() => {
bpmnMessageRefsMap.value = Object.create(null)
bpmnRootElements.value = bpmnInstances().modeler.getDefinitions().rootElements
bpmnRootElements.value
.filter((el) => el.$type === 'bpmn:Message')
.forEach((m) => {
bpmnMessageRefsMap.value[m.id] = m
messageMap.value[m.id] = m.name
})
messageMap.value['-1'] = '无'
})
onBeforeUnmount(() => {
bpmnElement.value = null
})
watch(
() => props.id,
() => {
// bpmnElement.value = bpmnInstances().bpmnElement
nextTick(() => {
getBindMessage()
})
},
{ immediate: true }
)
</script>

198
src/components/bpmnProcessDesigner/package/penal/task/task-components/ScriptTask.vue
View File

@@ -1,99 +1,99 @@
<template>
<div style="margin-top: 16px">
<el-form-item label="脚本格式">
<el-input
v-model="scriptTaskForm.scriptFormat"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
<el-form-item label="脚本类型">
<el-select v-model="scriptTaskForm.scriptType">
<el-option label="内联脚本" value="inline" />
<el-option label="外部资源" value="external" />
</el-select>
</el-form-item>
<el-form-item label="脚本" v-show="scriptTaskForm.scriptType === 'inline'">
<el-input
v-model="scriptTaskForm.script"
type="textarea"
resize="vertical"
:autosize="{ minRows: 2, maxRows: 4 }"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
<el-form-item label="资源地址" v-show="scriptTaskForm.scriptType === 'external'">
<el-input
v-model="scriptTaskForm.resource"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
<el-form-item label="结果变量">
<el-input
v-model="scriptTaskForm.resultVariable"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'ScriptTask' })
const props = defineProps({
id: String,
type: String
})
const defaultTaskForm = ref({
scriptFormat: '',
script: '',
resource: '',
resultVariable: ''
})
const scriptTaskForm = ref<any>({})
const bpmnElement = ref()
const bpmnInstances = () => (window as any)?.bpmnInstances
const resetTaskForm = () => {
for (let key in defaultTaskForm.value) {
let value = bpmnElement.value?.businessObject[key] || defaultTaskForm.value[key]
scriptTaskForm.value[key] = value
}
scriptTaskForm.value.scriptType = scriptTaskForm.value.script ? 'inline' : 'external'
}
const updateElementTask = () => {
let taskAttr = Object.create(null)
taskAttr.scriptFormat = scriptTaskForm.value.scriptFormat || null
taskAttr.resultVariable = scriptTaskForm.value.resultVariable || null
if (scriptTaskForm.value.scriptType === 'inline') {
taskAttr.script = scriptTaskForm.value.script || null
taskAttr.resource = null
} else {
taskAttr.resource = scriptTaskForm.value.resource || null
taskAttr.script = null
}
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), taskAttr)
}
onBeforeUnmount(() => {
bpmnElement.value = null
})
watch(
() => props.id,
() => {
bpmnElement.value = bpmnInstances().bpmnElement
nextTick(() => {
resetTaskForm()
})
},
{ immediate: true }
)
</script>
<template>
<div style="margin-top: 16px">
<el-form-item label="脚本格式">
<el-input
v-model="scriptTaskForm.scriptFormat"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
<el-form-item label="脚本类型">
<el-select v-model="scriptTaskForm.scriptType" filterable>
<el-option label="内联脚本" value="inline" />
<el-option label="外部资源" value="external" />
</el-select>
</el-form-item>
<el-form-item label="脚本" v-show="scriptTaskForm.scriptType === 'inline'">
<el-input
v-model="scriptTaskForm.script"
type="textarea"
resize="vertical"
:autosize="{ minRows: 2, maxRows: 4 }"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
<el-form-item label="资源地址" v-show="scriptTaskForm.scriptType === 'external'">
<el-input
v-model="scriptTaskForm.resource"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
<el-form-item label="结果变量">
<el-input
v-model="scriptTaskForm.resultVariable"
clearable
@input="updateElementTask()"
@change="updateElementTask()"
/>
</el-form-item>
</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'ScriptTask' })
const props = defineProps({
id: String,
type: String
})
const defaultTaskForm = ref({
scriptFormat: '',
script: '',
resource: '',
resultVariable: ''
})
const scriptTaskForm = ref<any>({})
const bpmnElement = ref()
const bpmnInstances = () => (window as any)?.bpmnInstances
const resetTaskForm = () => {
for (let key in defaultTaskForm.value) {
let value = bpmnElement.value?.businessObject[key] || defaultTaskForm.value[key]
scriptTaskForm.value[key] = value
}
scriptTaskForm.value.scriptType = scriptTaskForm.value.script ? 'inline' : 'external'
}
const updateElementTask = () => {
let taskAttr = Object.create(null)
taskAttr.scriptFormat = scriptTaskForm.value.scriptFormat || null
taskAttr.resultVariable = scriptTaskForm.value.resultVariable || null
if (scriptTaskForm.value.scriptType === 'inline') {
taskAttr.script = scriptTaskForm.value.script || null
taskAttr.resource = null
} else {
taskAttr.resource = scriptTaskForm.value.resource || null
taskAttr.script = null
}
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), taskAttr)
}
onBeforeUnmount(() => {
bpmnElement.value = null
})
watch(
() => props.id,
() => {
bpmnElement.value = bpmnInstances().bpmnElement
nextTick(() => {
resetTaskForm()
})
},
{ immediate: true }
)
</script>

373
src/components/bpmnProcessDesigner/package/penal/task/task-components/UserTask.vue
View File

@@ -1,185 +1,188 @@
<template>
<el-form label-width='100px'>
<el-form-item label='规则类型' prop='candidateStrategy'>
<el-select
v-model='userTaskForm.candidateStrategy'
clearable
style='width: 100%'
@change='changeCandidateStrategy'
>
<el-option
v-for='dict in RuleTypeList'
:key='dict.code'
:label='dict.name'
:value='dict.code'
/>
</el-select>
</el-form-item>
<el-form-item
v-if='userTaskForm.candidateStrategy == 10'
label='指定角色'
prop='candidateParam'
>
<el-select
v-model='userTaskForm.candidateParam'
clearable
multiple
style='width: 100%'
@change='updateElementTask'
>
<el-option v-for='item in roleOptions' :key='item.id' :label='item.name' :value='item.id' />
</el-select>
</el-form-item>
<el-form-item
v-if='userTaskForm.candidateStrategy == 20'
label='指定部门'
prop='candidateParam'
span='24'
>
<el-tree-select
ref='treeRef'
v-model='userTaskForm.candidateParam'
:data='deptTreeOptions'
:props='defaultProps'
empty-text='加载中，请稍后'
multiple
node-key='id'
show-checkbox
@change='updateElementTask'
/>
</el-form-item>
<el-form-item
v-if='userTaskForm.candidateStrategy == 30'
label='指定用户'
prop='candidateParam'
span='24'
>
<el-select
v-model='userTaskForm.candidateParam'
clearable
multiple
style='width: 100%'
@change='updateElementTask'
>
<el-option
v-for='item in userOptions'
:key='item.id'
:label='item.name'
:value='item.id'
/>
</el-select>
</el-form-item>
</el-form>
</template>
<script lang='ts' setup>
import { defaultProps, handleTree } from '@/utils/tree'
import { useDictData } from '@/stores/dictData'
const dictData = useDictData()
const RuleTypeList = ref()
import { getRoleSimpleList } from '@/api/user-boot/role'
import { getUserSimpleList } from '@/api/user-boot/user'
defineOptions({ name: 'UserTask' })
const props = defineProps({
id: String,
type: String
})
const userTaskForm = ref({
candidateStrategy: '', // 分配规则
candidateParam: [] // 分配选项
})
const bpmnElement = ref()
const bpmnInstances = () => (window as any)?.bpmnInstances
export interface optionVO {
id: string
name: string
}
const roleOptions = ref<optionVO[]>([]) // 角色列表
const userOptions = ref<optionVO[]>([]) // 用户列表
const deptTreeOptions = ref() // 部门树
const resetTaskForm = () => {
const businessObject = bpmnElement.value.businessObject
if (!businessObject) {
return
}
if (businessObject.candidateStrategy != undefined) {
userTaskForm.value.candidateStrategy = businessObject.candidateStrategy
} else {
userTaskForm.value.candidateStrategy = undefined
}
if (businessObject.candidateParam && businessObject.candidateParam.length > 0) {
if (userTaskForm.value.candidateStrategy === 60) {
// 特殊：流程表达式，只有一个 input 输入框
userTaskForm.value.candidateParam = [businessObject.candidateParam]
} else {
userTaskForm.value.candidateParam = businessObject.candidateParam.split(',')
}
} else {
userTaskForm.value.candidateParam = []
}
}
/** 更新 candidateStrategy 字段时，需要清空 candidateParam，并触发 bpmn 图更新 */
const changeCandidateStrategy = () => {
userTaskForm.value.candidateParam = []
updateElementTask()
}
/** 选中某个 options 时候，更新 bpmn 图 */
const updateElementTask = () => {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
candidateStrategy: userTaskForm.value.candidateStrategy,
candidateParam: userTaskForm.value.candidateParam.join(',')
})
}
// 打开监听器弹窗
const processExpressionDialogRef = ref()
const openProcessExpressionDialog = async () => {
processExpressionDialogRef.value.open()
}
const selectProcessExpression = (expression) => {
userTaskForm.value.candidateParam = [expression.expression]
}
watch(
() => props.id,
() => {
bpmnElement.value = bpmnInstances().bpmnElement
nextTick(() => {
resetTaskForm()
})
},
{ immediate: true }
)
onMounted(async () => {
// 获得角色列表
await getRoleSimpleList().then(res => {
roleOptions.value = res.data
})
// 获得用户列表
await getUserSimpleList().then(res => {
userOptions.value = res.data
})
//传入type的名称
RuleTypeList.value = dictData.getBasicData('rule_type')
//
// // 获得部门列表
// const deptOptions = await DeptApi.getSimpleDeptList()
// deptTreeOptions.value = handleTree(deptOptions, 'id')
})
onBeforeUnmount(() => {
bpmnElement.value = null
})
</script>
<template>
<el-form label-width='100px'>
<el-form-item label='规则类型' prop='candidateStrategy'>
<el-select
v-model='userTaskForm.candidateStrategy'
clearable
style='width: 100%'
@change='changeCandidateStrategy'
filterable
>
<el-option
v-for='dict in RuleTypeList'
:key='dict.code'
:label='dict.name'
:value='dict.code'
/>
</el-select>
</el-form-item>
<el-form-item
v-if='userTaskForm.candidateStrategy == 10'
label='指定角色'
prop='candidateParam'
>
<el-select
v-model='userTaskForm.candidateParam'
clearable
multiple
style='width: 100%'
@change='updateElementTask'
filterable
>
<el-option v-for='item in roleOptions' :key='item.id' :label='item.name' :value='item.id' />
</el-select>
</el-form-item>
<el-form-item
v-if='userTaskForm.candidateStrategy == 20'
label='指定部门'
prop='candidateParam'
span='24'
>
<el-tree-select
ref='treeRef'
v-model='userTaskForm.candidateParam'
:data='deptTreeOptions'
:props='defaultProps'
empty-text='加载中，请稍后'
multiple
node-key='id'
show-checkbox
@change='updateElementTask'
/>
</el-form-item>
<el-form-item
v-if='userTaskForm.candidateStrategy == 30'
label='指定用户'
prop='candidateParam'
span='24'
>
<el-select
v-model='userTaskForm.candidateParam'
clearable
multiple
style='width: 100%'
@change='updateElementTask'
filterable
>
<el-option
v-for='item in userOptions'
:key='item.id'
:label='item.name'
:value='item.id'
/>
</el-select>
</el-form-item>
</el-form>
</template>
<script lang='ts' setup>
import { defaultProps, handleTree } from '@/utils/tree'
import { useDictData } from '@/stores/dictData'
const dictData = useDictData()
const RuleTypeList = ref()
import { getRoleSimpleList } from '@/api/user-boot/role'
import { getUserSimpleList } from '@/api/user-boot/user'
defineOptions({ name: 'UserTask' })
const props = defineProps({
id: String,
type: String
})
const userTaskForm = ref({
candidateStrategy: '', // 分配规则
candidateParam: [] // 分配选项
})
const bpmnElement = ref()
const bpmnInstances = () => (window as any)?.bpmnInstances
export interface optionVO {
id: string
name: string
}
const roleOptions = ref<optionVO[]>([]) // 角色列表
const userOptions = ref<optionVO[]>([]) // 用户列表
const deptTreeOptions = ref() // 部门树
const resetTaskForm = () => {
const businessObject = bpmnElement.value.businessObject
if (!businessObject) {
return
}
if (businessObject.candidateStrategy != undefined) {
userTaskForm.value.candidateStrategy = businessObject.candidateStrategy
} else {
userTaskForm.value.candidateStrategy = undefined
}
if (businessObject.candidateParam && businessObject.candidateParam.length > 0) {
if (userTaskForm.value.candidateStrategy === 60) {
// 特殊：流程表达式，只有一个 input 输入框
userTaskForm.value.candidateParam = [businessObject.candidateParam]
} else {
userTaskForm.value.candidateParam = businessObject.candidateParam.split(',')
}
} else {
userTaskForm.value.candidateParam = []
}
}
/** 更新 candidateStrategy 字段时，需要清空 candidateParam，并触发 bpmn 图更新 */
const changeCandidateStrategy = () => {
userTaskForm.value.candidateParam = []
updateElementTask()
}
/** 选中某个 options 时候，更新 bpmn 图 */
const updateElementTask = () => {
bpmnInstances().modeling.updateProperties(toRaw(bpmnElement.value), {
candidateStrategy: userTaskForm.value.candidateStrategy,
candidateParam: userTaskForm.value.candidateParam.join(',')
})
}
// 打开监听器弹窗
const processExpressionDialogRef = ref()
const openProcessExpressionDialog = async () => {
processExpressionDialogRef.value.open()
}
const selectProcessExpression = (expression) => {
userTaskForm.value.candidateParam = [expression.expression]
}
watch(
() => props.id,
() => {
bpmnElement.value = bpmnInstances().bpmnElement
nextTick(() => {
resetTaskForm()
})
},
{ immediate: true }
)
onMounted(async () => {
// 获得角色列表
await getRoleSimpleList().then(res => {
roleOptions.value = res.data
})
// 获得用户列表
await getUserSimpleList().then(res => {
userOptions.value = res.data
})
//传入type的名称
RuleTypeList.value = dictData.getBasicData('rule_type')
//
// // 获得部门列表
// const deptOptions = await DeptApi.getSimpleDeptList()
// deptTreeOptions.value = handleTree(deptOptions, 'id')
})
onBeforeUnmount(() => {
bpmnElement.value = null
})
</script>

2
src/components/form/datePicker/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div :style="{ width: isMinuteData ? '750px' : '610px' }">
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange">
<el-select v-model="interval" style="min-width: 90px; width: 90px; margin-right: 10px" @change="timeChange" filterable>
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>

86
src/components/tree/pqs/Terminal.vue
View File

@@ -1,8 +1,7 @@
<template>
<Tree ref="treRef" :data="tree" style="height: 100%" :width="'100%'" :expanded="expanded" />
</template>
<!-- <div class="mb10">
<!-- <div class="mb10">
<el-button type="primary" icon="el-icon-Download" size="small" @click="exportExcelTemplate" :loading="loading">模版下载</el-button>
<el-button type="primary" icon="el-icon-Upload" size="small">导入</el-button>
<el-button type="primary" icon="el-icon-Download" size="small" @click="ledgerEverywhere" :loading="loading1">导出</el-button>
@@ -11,7 +10,7 @@
import { ref, nextTick } from 'vue'
import Tree from './index.vue'
import { getTerminalTree,downTerminalTemplate,exportTerminalBase } from '@/api/device-boot/Business'
import { getTerminalTree, downTerminalTemplate, exportTerminalBase } from '@/api/device-boot/Business'
import { useConfig } from '@/stores/config'
const VITE_FLAG = import.meta.env.VITE_NAME == 'jibei'
defineOptions({
@@ -88,40 +87,48 @@ const info = (id: any) => {
// })
// })
// } else {
res.data.forEach((item: any) => {
item.icon = 'el-icon-Menu'
item.plevel = item.level
item.level = (item.level + 1) * 100
item.children.forEach((item2: any) => {
item2.icon = 'el-icon-HomeFilled'
item2.plevel = item2.level
item2.level = (item2.level + 1) * 100
expanded.value.push(item2.id)
item2.children.forEach((item3: any) => {
item3.icon = 'el-icon-CollectionTag'
item3.plevel = item3.level
item3.level = (item3.level + 1) * 100
item3.children.forEach((item4: any) => {
item4.icon = 'el-icon-Flag'
item4.plevel = item4.level
item4.level = (item4.level + 1) * 100
item4.children.forEach((item5: any) => {
item5.icon = 'el-icon-OfficeBuilding'
item5.plevel = item5.level
item5.level = (item5.level == 7 ? 4 : item5.level + 1) * 100
item5.children.forEach((item6: any) => {
item6.icon = 'el-icon-Film'
item6.plevel = item6.level
item6.level = (item6.level + 1) * 100
item6.children.forEach((item7: any) => {
item7.icon = 'el-icon-Share'
item7.plevel = item7.level
item7.level = (item7.level + 1) * 100
item7.children.forEach((item8: any) => {
item8.icon = 'el-icon-Location'
item8.plevel = item8.level
item8.level = (item8.level + 1) * 100
})
res.data.forEach((item: any) => {
item.icon = 'el-icon-Menu'
item.color = 'var(--el-color-primary)'
item.plevel = item.level
item.level = (item.level + 1) * 100
item.children.forEach((item2: any) => {
item2.icon = 'el-icon-HomeFilled'
item2.color = 'var(--el-color-primary)'
item2.plevel = item2.level
item2.level = (item2.level + 1) * 100
expanded.value.push(item2.id)
item2.children.forEach((item3: any) => {
item3.icon = 'el-icon-CollectionTag'
item3.color = 'var(--el-color-primary)'
item3.plevel = item3.level
item3.level = (item3.level + 1) * 100
item3.children.forEach((item4: any) => {
item4.icon = 'el-icon-Flag'
item4.color = 'var(--el-color-primary)'
item4.plevel = item4.level
item4.level = (item4.level + 1) * 100
item4.children.forEach((item5: any) => {
item5.icon = 'el-icon-OfficeBuilding'
item5.color = 'var(--el-color-primary)'
item5.plevel = item5.level
item5.level = (item5.level == 7 ? 4 : item5.level + 1) * 100
item5.children.forEach((item6: any) => {
item6.icon =
item6.children?.[0]?.children?.length > 0 ? 'el-icon-Film' : 'el-icon-Share'
item6.color = 'var(--el-color-primary)'
item6.plevel = item6.level
item6.level = (item6.level + 1) * 100
item6.children.forEach((item7: any) => {
item7.icon = item7.children.length > 0 ? 'el-icon-Share' : 'el-icon-Location'
item7.color = 'var(--el-color-primary)'
item7.plevel = item7.level
item7.level = (item7.level + 1) * 100
item7.children.forEach((item8: any) => {
item8.icon = 'el-icon-Location'
item8.color = 'var(--el-color-primary)'
item8.plevel = item8.level
item8.level = (item8.level + 1) * 100
})
})
})
@@ -129,6 +136,7 @@ const info = (id: any) => {
})
})
})
})
// }
tree.value = res.data
@@ -149,7 +157,7 @@ const info = (id: any) => {
})
}
// 下载模版
const exportExcelTemplate = async() => {
const exportExcelTemplate = async () => {
loading.value = true
downTerminalTemplate().then((res: any) => {
let blob = new Blob([res], {
@@ -168,7 +176,7 @@ const exportExcelTemplate = async() => {
}, 0)
}
// 导出台账
const ledgerEverywhere = async() => {
const ledgerEverywhere = async () => {
loading1.value = true
exportTerminalBase().then((res: any) => {
let blob = new Blob([res], {

1
src/components/tree/pqs/pointTree.vue
View File

@@ -6,6 +6,7 @@
style="min-width: unset; padding: 10px 10px 0"
@change="loadData"
v-if="props.showSelect"
filterable
>
<el-option
v-for="item in classificationData"

905
src/layouts/admin/components/config.vue
View File

@@ -1,452 +1,453 @@
<template>
<div class="layout-config-drawer">
<el-drawer :model-value="configStore.layout.showDrawer" title="布局配置" size="310px" @close="onCloseDrawer">
<el-scrollbar class="layout-mode-style-scrollbar">
<el-form ref="formRef" :model="configStore.layout">
<div class="layout-mode-styles-box">
<el-divider border-style="dashed">布局方式</el-divider>
<div class="layout-mode-box-style">
<el-row class="layout-mode-box-style-row" :gutter="10">
<el-col :span="12">
<div
@click="setLayoutMode('Default')"
class="layout-mode-style default"
:class="configStore.layout.layoutMode == 'Default' ? 'active' : ''"
>
<div class="layout-mode-style-box">
<div class="layout-mode-style-aside"></div>
<div class="layout-mode-style-container-box">
<div class="layout-mode-style-header"></div>
<div class="layout-mode-style-container"></div>
</div>
</div>
<div class="layout-mode-style-name">默认</div>
</div>
</el-col>
<el-col :span="12">
<div
@click="setLayoutMode('Classic')"
class="layout-mode-style classic"
:class="configStore.layout.layoutMode == 'Classic' ? 'active' : ''"
>
<div class="layout-mode-style-box">
<div class="layout-mode-style-aside"></div>
<div class="layout-mode-style-container-box">
<div class="layout-mode-style-header"></div>
<div class="layout-mode-style-container"></div>
</div>
</div>
<div class="layout-mode-style-name">经典</div>
</div>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="12">
<div
@click="setLayoutMode('Streamline')"
class="layout-mode-style streamline"
:class="configStore.layout.layoutMode == 'Streamline' ? 'active' : ''"
>
<div class="layout-mode-style-box">
<div class="layout-mode-style-container-box">
<div class="layout-mode-style-header"></div>
<div class="layout-mode-style-container"></div>
</div>
</div>
<div class="layout-mode-style-name">单栏</div>
</div>
</el-col>
</el-row>
</div>
<el-divider border-style="dashed">全局</el-divider>
<div class="layout-config-global">
<el-form-item label="后台页面切换动画">
<el-select
@change="onCommitState($event, 'mainAnimation')"
:model-value="configStore.layout.mainAnimation"
:placeholder="'layouts.Please select an animation name'"
>
<el-option label="slide-right" value="slide-right"></el-option>
<el-option label="slide-left" value="slide-left"></el-option>
<el-option label="el-fade-in-linear" value="el-fade-in-linear"></el-option>
<el-option label="el-fade-in" value="el-fade-in"></el-option>
<el-option label="el-zoom-in-center" value="el-zoom-in-center"></el-option>
<el-option label="el-zoom-in-top" value="el-zoom-in-top"></el-option>
<el-option label="el-zoom-in-bottom" value="el-zoom-in-bottom"></el-option>
</el-select>
</el-form-item>
<el-form-item label="组件主题色">
<el-color-picker
@change="onCommitColorState($event, 'elementUiPrimary')"
:model-value="configStore.getColorVal('elementUiPrimary')"
/>
</el-form-item>
<el-form-item label="表格标题栏背景颜色">
<el-color-picker
@change="onCommitColorState($event, 'tableHeaderBackground')"
:model-value="configStore.getColorVal('tableHeaderBackground')"
/>
</el-form-item>
<el-form-item label="表格标题栏文字颜色">
<el-color-picker
@change="onCommitColorState($event, 'tableHeaderColor')"
:model-value="configStore.getColorVal('tableHeaderColor')"
/>
</el-form-item>
<el-form-item label="表格激活栏颜色">
<el-color-picker
@change="onCommitColorState($event, 'tableCurrent')"
:model-value="configStore.getColorVal('tableCurrent')"
/>
</el-form-item>
</div>
<el-divider border-style="dashed">侧边栏</el-divider>
<div class="layout-config-aside">
<el-form-item label="侧边菜单栏背景色">
<el-color-picker
@change="onCommitColorState($event, 'menuBackground')"
:model-value="configStore.getColorVal('menuBackground')"
/>
</el-form-item>
<el-form-item label="侧边菜单文字颜色">
<el-color-picker
@change="onCommitColorState($event, 'menuColor')"
:model-value="configStore.getColorVal('menuColor')"
/>
</el-form-item>
<el-form-item label="侧边菜单激活项背景色">
<el-color-picker
@change="onCommitColorState($event, 'menuActiveBackground')"
:model-value="configStore.getColorVal('menuActiveBackground')"
/>
</el-form-item>
<el-form-item label="侧边菜单激活项文字色">
<el-color-picker
@change="onCommitColorState($event, 'menuActiveColor')"
:model-value="configStore.getColorVal('menuActiveColor')"
/>
</el-form-item>
<el-form-item label="显示侧边菜单顶栏(LOGO栏)">
<el-switch
@change="onCommitState($event, 'menuShowTopBar')"
:model-value="configStore.layout.menuShowTopBar"
></el-switch>
</el-form-item>
<el-form-item label="侧边菜单顶栏背景色">
<el-color-picker
@change="onCommitColorState($event, 'menuTopBarBackground')"
:model-value="configStore.getColorVal('menuTopBarBackground')"
/>
</el-form-item>
<el-form-item label="侧边菜单宽度(展开时)">
<el-input
@input="onCommitState($event, 'menuWidth')"
type="number"
:step="10"
:model-value="configStore.layout.menuWidth"
>
<template #append>px</template>
</el-input>
</el-form-item>
<!-- <el-form-item label="侧边菜单默认图标">-->
<!-- <IconSelector-->
<!-- @change="onCommitMenuDefaultIcon($event, 'menuDefaultIcon')"-->
<!-- :model-value="configStore.layout.menuDefaultIcon"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="侧边菜单水平折叠">-->
<!-- <el-switch-->
<!-- @change="onCommitState($event, 'menuCollapse')"-->
<!-- :model-value="configStore.layout.menuCollapse"-->
<!-- ></el-switch>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="侧边菜单手风琴">-->
<!-- <el-switch-->
<!-- @change="onCommitState($event, 'menuUniqueOpened')"-->
<!-- :model-value="configStore.layout.menuUniqueOpened"-->
<!-- ></el-switch>-->
<!-- </el-form-item>-->
</div>
<el-divider border-style="dashed">顶栏</el-divider>
<div class="layout-config-aside">
<el-form-item label="顶栏背景色">
<el-color-picker
@change="onCommitColorState($event, 'headerBarBackground')"
:model-value="configStore.getColorVal('headerBarBackground')"
/>
</el-form-item>
<el-form-item label="顶栏文字色">
<el-color-picker
@change="onCommitColorState($event, 'headerBarTabColor')"
:model-value="configStore.getColorVal('headerBarTabColor')"
/>
</el-form-item>
<!-- <el-form-item label="顶栏悬停时背景色">-->
<!-- <el-color-picker-->
<!-- @change="onCommitColorState($event, 'headerBarHoverBackground')"-->
<!-- :model-value="configStore.getColorVal('headerBarHoverBackground')"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="顶栏菜单激活项背景色">-->
<!-- <el-color-picker-->
<!-- @change="onCommitColorState($event, 'headerBarTabActiveBackground')"-->
<!-- :model-value="configStore.getColorVal('headerBarTabActiveBackground')"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="顶栏菜单激活项文字色">-->
<!-- <el-color-picker-->
<!-- @change="onCommitColorState($event, 'headerBarTabActiveColor')"-->
<!-- :model-value="configStore.getColorVal('headerBarTabActiveColor')"-->
<!-- />-->
<!-- </el-form-item>-->
</div>
<el-popconfirm @confirm="restoreDefault" title="确定要恢复全部配置到默认值吗？">
<template #reference>
<div class="ba-center">
<el-button class="w80" type="info">恢复默认</el-button>
</div>
</template>
</el-popconfirm>
</div>
</el-form>
</el-scrollbar>
</el-drawer>
</div>
</template>
<script setup lang="ts">
import { useConfig } from '@/stores/config'
import { useNavTabs } from '@/stores/navTabs'
import { useRouter } from 'vue-router'
import IconSelector from '@/components/baInput/components/iconSelector.vue'
import { STORE_CONFIG } from '@/stores/constant/cacheKey'
import { Local, Session } from '@/utils/storage'
import type { Layout } from '@/stores/interface'
const configStore = useConfig()
const navTabs = useNavTabs()
const router = useRouter()
const onCommitState = (value: any, name: any) => {
configStore.setLayout(name, value)
}
const onCommitColorState = (value: string | null, name: keyof Layout) => {
if (value === null) return
const colors = configStore.layout[name] as string[]
if (configStore.layout.isDark) {
colors[1] = value
} else {
colors[0] = value
}
configStore.setLayout(name, colors)
}
const setLayoutMode = (mode: string) => {
configStore.setLayoutMode(mode)
}
// 修改默认菜单图标
const onCommitMenuDefaultIcon = (value: any, name: any) => {
configStore.setLayout(name, value)
const menus = navTabs.state.tabsViewRoutes
navTabs.setTabsViewRoutes([])
setTimeout(() => {
navTabs.setTabsViewRoutes(menus)
}, 200)
}
const onCloseDrawer = () => {
configStore.setLayout('showDrawer', false)
}
const restoreDefault = () => {
Local.remove(STORE_CONFIG)
router.go(0)
}
</script>
<style scoped lang="scss">
.layout-config-drawer :deep(.el-input__inner) {
padding: 0 0 0 6px;
}
.layout-config-drawer :deep(.el-input-group__append) {
padding: 0 10px;
}
.layout-config-drawer :deep(.el-drawer__header) {
margin-bottom: 0 !important;
}
.layout-config-drawer :deep(.el-drawer__body) {
padding: 0;
}
.layout-mode-styles-box {
padding: 20px;
}
.layout-mode-box-style-row {
margin-bottom: 15px;
}
.layout-mode-style {
position: relative;
height: 100px;
border: 1px solid var(--el-border-color-light);
border-radius: var(--el-border-radius-small);
&:hover,
&.active {
border: 1px solid var(--el-color-primary);
}
.layout-mode-style-name {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
color: var(--el-color-primary-light-5);
border-radius: 50%;
height: 50px;
width: 50px;
border: 1px solid var(--el-color-primary-light-3);
}
.layout-mode-style-box {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
&.default {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-aside {
width: 18%;
height: 90%;
background-color: var(--el-border-color-lighter);
}
.layout-mode-style-container-box {
width: 68%;
height: 90%;
margin-left: 4%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color-lighter);
}
.layout-mode-style-container {
width: 100%;
height: 85%;
background-color: var(--el-border-color-extra-light);
margin-top: 5%;
}
}
}
&.classic {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-aside {
width: 18%;
height: 100%;
background-color: var(--el-border-color-lighter);
}
.layout-mode-style-container-box {
width: 82%;
height: 100%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color);
}
.layout-mode-style-container {
width: 100%;
height: 90%;
background-color: var(--el-border-color-extra-light);
}
}
}
&.streamline {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-container-box {
width: 100%;
height: 100%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color);
}
.layout-mode-style-container {
width: 100%;
height: 90%;
background-color: var(--el-border-color-extra-light);
}
}
}
&.double {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-aside {
width: 18%;
height: 100%;
background-color: var(--el-border-color);
}
.layout-mode-style-container-box {
width: 82%;
height: 100%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color);
}
.layout-mode-style-container {
width: 100%;
height: 90%;
background-color: var(--el-border-color-extra-light);
}
}
}
}
.w80 {
width: 90%;
}
</style>
<template>
<div class="layout-config-drawer">
<el-drawer :model-value="configStore.layout.showDrawer" title="布局配置" size="310px" @close="onCloseDrawer">
<el-scrollbar class="layout-mode-style-scrollbar">
<el-form ref="formRef" :model="configStore.layout">
<div class="layout-mode-styles-box">
<el-divider border-style="dashed">布局方式</el-divider>
<div class="layout-mode-box-style">
<el-row class="layout-mode-box-style-row" :gutter="10">
<el-col :span="12">
<div
@click="setLayoutMode('Default')"
class="layout-mode-style default"
:class="configStore.layout.layoutMode == 'Default' ? 'active' : ''"
>
<div class="layout-mode-style-box">
<div class="layout-mode-style-aside"></div>
<div class="layout-mode-style-container-box">
<div class="layout-mode-style-header"></div>
<div class="layout-mode-style-container"></div>
</div>
</div>
<div class="layout-mode-style-name">默认</div>
</div>
</el-col>
<el-col :span="12">
<div
@click="setLayoutMode('Classic')"
class="layout-mode-style classic"
:class="configStore.layout.layoutMode == 'Classic' ? 'active' : ''"
>
<div class="layout-mode-style-box">
<div class="layout-mode-style-aside"></div>
<div class="layout-mode-style-container-box">
<div class="layout-mode-style-header"></div>
<div class="layout-mode-style-container"></div>
</div>
</div>
<div class="layout-mode-style-name">经典</div>
</div>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="12">
<div
@click="setLayoutMode('Streamline')"
class="layout-mode-style streamline"
:class="configStore.layout.layoutMode == 'Streamline' ? 'active' : ''"
>
<div class="layout-mode-style-box">
<div class="layout-mode-style-container-box">
<div class="layout-mode-style-header"></div>
<div class="layout-mode-style-container"></div>
</div>
</div>
<div class="layout-mode-style-name">单栏</div>
</div>
</el-col>
</el-row>
</div>
<el-divider border-style="dashed">全局</el-divider>
<div class="layout-config-global">
<el-form-item label="后台页面切换动画">
<el-select
@change="onCommitState($event, 'mainAnimation')"
:model-value="configStore.layout.mainAnimation"
:placeholder="'layouts.Please select an animation name'"
filterable
>
<el-option label="slide-right" value="slide-right"></el-option>
<el-option label="slide-left" value="slide-left"></el-option>
<el-option label="el-fade-in-linear" value="el-fade-in-linear"></el-option>
<el-option label="el-fade-in" value="el-fade-in"></el-option>
<el-option label="el-zoom-in-center" value="el-zoom-in-center"></el-option>
<el-option label="el-zoom-in-top" value="el-zoom-in-top"></el-option>
<el-option label="el-zoom-in-bottom" value="el-zoom-in-bottom"></el-option>
</el-select>
</el-form-item>
<el-form-item label="组件主题色">
<el-color-picker
@change="onCommitColorState($event, 'elementUiPrimary')"
:model-value="configStore.getColorVal('elementUiPrimary')"
/>
</el-form-item>
<el-form-item label="表格标题栏背景颜色">
<el-color-picker
@change="onCommitColorState($event, 'tableHeaderBackground')"
:model-value="configStore.getColorVal('tableHeaderBackground')"
/>
</el-form-item>
<el-form-item label="表格标题栏文字颜色">
<el-color-picker
@change="onCommitColorState($event, 'tableHeaderColor')"
:model-value="configStore.getColorVal('tableHeaderColor')"
/>
</el-form-item>
<el-form-item label="表格激活栏颜色">
<el-color-picker
@change="onCommitColorState($event, 'tableCurrent')"
:model-value="configStore.getColorVal('tableCurrent')"
/>
</el-form-item>
</div>
<el-divider border-style="dashed">侧边栏</el-divider>
<div class="layout-config-aside">
<el-form-item label="侧边菜单栏背景色">
<el-color-picker
@change="onCommitColorState($event, 'menuBackground')"
:model-value="configStore.getColorVal('menuBackground')"
/>
</el-form-item>
<el-form-item label="侧边菜单文字颜色">
<el-color-picker
@change="onCommitColorState($event, 'menuColor')"
:model-value="configStore.getColorVal('menuColor')"
/>
</el-form-item>
<el-form-item label="侧边菜单激活项背景色">
<el-color-picker
@change="onCommitColorState($event, 'menuActiveBackground')"
:model-value="configStore.getColorVal('menuActiveBackground')"
/>
</el-form-item>
<el-form-item label="侧边菜单激活项文字色">
<el-color-picker
@change="onCommitColorState($event, 'menuActiveColor')"
:model-value="configStore.getColorVal('menuActiveColor')"
/>
</el-form-item>
<el-form-item label="显示侧边菜单顶栏(LOGO栏)">
<el-switch
@change="onCommitState($event, 'menuShowTopBar')"
:model-value="configStore.layout.menuShowTopBar"
></el-switch>
</el-form-item>
<el-form-item label="侧边菜单顶栏背景色">
<el-color-picker
@change="onCommitColorState($event, 'menuTopBarBackground')"
:model-value="configStore.getColorVal('menuTopBarBackground')"
/>
</el-form-item>
<el-form-item label="侧边菜单宽度(展开时)">
<el-input
@input="onCommitState($event, 'menuWidth')"
type="number"
:step="10"
:model-value="configStore.layout.menuWidth"
>
<template #append>px</template>
</el-input>
</el-form-item>
<!-- <el-form-item label="侧边菜单默认图标">-->
<!-- <IconSelector-->
<!-- @change="onCommitMenuDefaultIcon($event, 'menuDefaultIcon')"-->
<!-- :model-value="configStore.layout.menuDefaultIcon"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="侧边菜单水平折叠">-->
<!-- <el-switch-->
<!-- @change="onCommitState($event, 'menuCollapse')"-->
<!-- :model-value="configStore.layout.menuCollapse"-->
<!-- ></el-switch>-->
<!-- </el-form-item>-->
<!-- <el-form-item label="侧边菜单手风琴">-->
<!-- <el-switch-->
<!-- @change="onCommitState($event, 'menuUniqueOpened')"-->
<!-- :model-value="configStore.layout.menuUniqueOpened"-->
<!-- ></el-switch>-->
<!-- </el-form-item>-->
</div>
<el-divider border-style="dashed">顶栏</el-divider>
<div class="layout-config-aside">
<el-form-item label="顶栏背景色">
<el-color-picker
@change="onCommitColorState($event, 'headerBarBackground')"
:model-value="configStore.getColorVal('headerBarBackground')"
/>
</el-form-item>
<el-form-item label="顶栏文字色">
<el-color-picker
@change="onCommitColorState($event, 'headerBarTabColor')"
:model-value="configStore.getColorVal('headerBarTabColor')"
/>
</el-form-item>
<!-- <el-form-item label="顶栏悬停时背景色">-->
<!-- <el-color-picker-->
<!-- @change="onCommitColorState($event, 'headerBarHoverBackground')"-->
<!-- :model-value="configStore.getColorVal('headerBarHoverBackground')"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="顶栏菜单激活项背景色">-->
<!-- <el-color-picker-->
<!-- @change="onCommitColorState($event, 'headerBarTabActiveBackground')"-->
<!-- :model-value="configStore.getColorVal('headerBarTabActiveBackground')"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="顶栏菜单激活项文字色">-->
<!-- <el-color-picker-->
<!-- @change="onCommitColorState($event, 'headerBarTabActiveColor')"-->
<!-- :model-value="configStore.getColorVal('headerBarTabActiveColor')"-->
<!-- />-->
<!-- </el-form-item>-->
</div>
<el-popconfirm @confirm="restoreDefault" title="确定要恢复全部配置到默认值吗？">
<template #reference>
<div class="ba-center">
<el-button class="w80" type="info">恢复默认</el-button>
</div>
</template>
</el-popconfirm>
</div>
</el-form>
</el-scrollbar>
</el-drawer>
</div>
</template>
<script setup lang="ts">
import { useConfig } from '@/stores/config'
import { useNavTabs } from '@/stores/navTabs'
import { useRouter } from 'vue-router'
import IconSelector from '@/components/baInput/components/iconSelector.vue'
import { STORE_CONFIG } from '@/stores/constant/cacheKey'
import { Local, Session } from '@/utils/storage'
import type { Layout } from '@/stores/interface'
const configStore = useConfig()
const navTabs = useNavTabs()
const router = useRouter()
const onCommitState = (value: any, name: any) => {
configStore.setLayout(name, value)
}
const onCommitColorState = (value: string | null, name: keyof Layout) => {
if (value === null) return
const colors = configStore.layout[name] as string[]
if (configStore.layout.isDark) {
colors[1] = value
} else {
colors[0] = value
}
configStore.setLayout(name, colors)
}
const setLayoutMode = (mode: string) => {
configStore.setLayoutMode(mode)
}
// 修改默认菜单图标
const onCommitMenuDefaultIcon = (value: any, name: any) => {
configStore.setLayout(name, value)
const menus = navTabs.state.tabsViewRoutes
navTabs.setTabsViewRoutes([])
setTimeout(() => {
navTabs.setTabsViewRoutes(menus)
}, 200)
}
const onCloseDrawer = () => {
configStore.setLayout('showDrawer', false)
}
const restoreDefault = () => {
Local.remove(STORE_CONFIG)
router.go(0)
}
</script>
<style scoped lang="scss">
.layout-config-drawer :deep(.el-input__inner) {
padding: 0 0 0 6px;
}
.layout-config-drawer :deep(.el-input-group__append) {
padding: 0 10px;
}
.layout-config-drawer :deep(.el-drawer__header) {
margin-bottom: 0 !important;
}
.layout-config-drawer :deep(.el-drawer__body) {
padding: 0;
}
.layout-mode-styles-box {
padding: 20px;
}
.layout-mode-box-style-row {
margin-bottom: 15px;
}
.layout-mode-style {
position: relative;
height: 100px;
border: 1px solid var(--el-border-color-light);
border-radius: var(--el-border-radius-small);
&:hover,
&.active {
border: 1px solid var(--el-color-primary);
}
.layout-mode-style-name {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
color: var(--el-color-primary-light-5);
border-radius: 50%;
height: 50px;
width: 50px;
border: 1px solid var(--el-color-primary-light-3);
}
.layout-mode-style-box {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
&.default {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-aside {
width: 18%;
height: 90%;
background-color: var(--el-border-color-lighter);
}
.layout-mode-style-container-box {
width: 68%;
height: 90%;
margin-left: 4%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color-lighter);
}
.layout-mode-style-container {
width: 100%;
height: 85%;
background-color: var(--el-border-color-extra-light);
margin-top: 5%;
}
}
}
&.classic {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-aside {
width: 18%;
height: 100%;
background-color: var(--el-border-color-lighter);
}
.layout-mode-style-container-box {
width: 82%;
height: 100%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color);
}
.layout-mode-style-container {
width: 100%;
height: 90%;
background-color: var(--el-border-color-extra-light);
}
}
}
&.streamline {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-container-box {
width: 100%;
height: 100%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color);
}
.layout-mode-style-container {
width: 100%;
height: 90%;
background-color: var(--el-border-color-extra-light);
}
}
}
&.double {
display: flex;
align-items: center;
justify-content: center;
.layout-mode-style-aside {
width: 18%;
height: 100%;
background-color: var(--el-border-color);
}
.layout-mode-style-container-box {
width: 82%;
height: 100%;
.layout-mode-style-header {
width: 100%;
height: 10%;
background-color: var(--el-border-color);
}
.layout-mode-style-container {
width: 100%;
height: 90%;
background-color: var(--el-border-color-extra-light);
}
}
}
}
.w80 {
width: 90%;
}
</style>

15
src/layouts/admin/router-view/main.vue
View File

@@ -1,9 +1,13 @@
<template>
<el-main class="layout-main" :style="mainHeight()">
<router-view v-slot="{ Component }">
<transition :name="config.layout.mainAnimation">
<router-view v-slot="{ Component, route: viewRoute }">
<transition :name="config.layout.mainAnimation" mode="out-in">
<keep-alive :include="state.keepAliveComponentNameList">
<component :is="Component" :key="state.componentKey || undefined" />
<component
:is="Component"
v-if="Component"
:key="state.componentKey || viewRoute.fullPath"
/>
</keep-alive>
</transition>
</router-view>
@@ -51,9 +55,10 @@ onBeforeMount(() => {
state.keepAliveComponentNameList = state.keepAliveComponentNameList.filter(
(name: string) => menu.meta.keepalive !== name
)
state.componentKey = ''
// 临时换 key 强制卸载，再在 nextTick 恢复为路由 fullPath，避免 keep-alive 缓存错乱
state.componentKey = `${menu.fullPath || menu.path}__refresh__${Date.now()}`
nextTick(() => {
state.componentKey = menu.path
state.componentKey = ''
addKeepAliveComponentName(menu.meta.keepalive as string)
})
})

294
src/views/LN/newEnergy/newEnergyLedger/components/addForm.vue
View File

@@ -1,147 +1,147 @@
<template>
<!-- 新增 -->
<el-dialog draggable :title="title" v-model="userAdd" width="500px" :before-close="cancel">
<el-form :inline="true" ref="formRef" :model="addData" label-width="auto" class="form-one" :rules="rules">
<el-form-item label="新能源场站名称:" prop="name">
<el-input v-model="addData.name" clearable placeholder="请输入新能源场站名称"></el-input>
</el-form-item>
<el-form-item label="干扰源类型:" prop="stationType">
<el-select v-model="addData.stationType" clearable collapse-tags placeholder="请选择干扰源类型">
<el-option v-for="item in newEnergy" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="电压等级:" prop="scale">
<el-select v-model="addData.scale" clearable collapse-tags placeholder="请选择电压等级">
<el-option v-for="item in scaleList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="额定有功功率(kW):" prop="ratedPower">
<el-input-number v-model="addData.ratedPower" :min="0" style="width: 100%" />
</el-form-item>
<el-form-item label="经度：" prop="longitude">
<el-input v-model="addData.longitude" type="text" placeholder="请输入经度" />
</el-form-item>
<el-form-item label="纬度：" prop="latitude">
<el-input v-model="addData.latitude" type="text" placeholder="请输入纬度" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="cancel">取消</el-button>
<el-button type="primary" @click="config">确定</el-button>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { useDictData } from '@/stores/dictData'
import { ElMessage } from 'element-plus'
import { editNewStation } from '@/api/device-boot/newEnergy'
const dictData = useDictData()
const userAdd = ref(false)
const title = ref('')
const newEnergy = dictData.getBasicData('new_station_type')
const scaleList = dictData.getBasicData('Dev_Voltage_Stand')
const emit = defineEmits(['onSubmit'])
const rules = reactive({
stationType: [{ required: true, message: '请选择干扰源类型', trigger: 'change' }],
scale: [{ required: true, message: '请选择电压等级', trigger: 'change' }],
name: [{ required: true, message: '请输入干扰源用户名称', trigger: 'blur' }],
ratedPower: [{ required: true, message: '请输入额定功率', trigger: 'blur' }],
longitude: [
{
required: true,
message: '请输入经度',
trigger: 'blur'
},
{
validator: (rule, value, callback) => {
if (!longitudeReg.test(value)) {
callback(new Error('请输入有效的经度'))
} else {
callback()
}
},
trigger: 'change'
}
],
latitude: [
{
required: true,
message: '请输入纬度',
trigger: 'blur'
},
{
validator: (rule, value, callback) => {
if (!latitudeReg.test(value)) {
callback(new Error('请输入有效的纬度'))
} else {
callback()
}
},
trigger: 'change'
}
]
})
// 经度正则表达式
const longitudeReg = /^[-+]?((180(\.0{1,10})?)|(1[0-7][0-9](\.\d{1,10})?)|([1-9]?\d(\.\d{1,10})?)|(0(\.\d{1,10})?))$/
// 纬度正则表达式
const latitudeReg = /^[-+]?((90(\.0{1,10})?)|([1-8]?\d(\.\d{1,10})?)|(0(\.\d{1,10})?))$/
const addData = ref({
scale: '',
stationType: '',
name: '',
ratedPower: 0,
longitude: '',
latitude: ''
})
const formRef = ref()
// 新增
const config = () => {
formRef.value.validate((valid: any) => {
if (valid) {
editNewStation(addData.value).then((res: any) => {
ElMessage.success(title.value + '成功!')
emit('onSubmit')
cancel()
})
}
})
}
// 重置
const cancel = () => {
// formRef.value.resetFields()
userAdd.value = false
}
const open = (row: any) => {
addData.value = {
scale: '',
stationType: '',
name: '',
ratedPower: 0,
longitude: '',
latitude: ''
}
title.value = row.title
if (row.title === '修改') {
addData.value = {
id: row.row.id,
scale: row.row.scale,
stationType: row.row.stationType,
name: row.row.name,
ratedPower: row.row.ratedPower - 0,
longitude: row.row.longitude,
latitude: row.row.latitude
}
}
userAdd.value = true
setTimeout(() => {
formRef.value.clearValidate()
}, 20)
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>
<template>
<!-- 新增 -->
<el-dialog draggable :title="title" v-model="userAdd" width="500px" :before-close="cancel">
<el-form :inline="true" ref="formRef" :model="addData" label-width="auto" class="form-one" :rules="rules">
<el-form-item label="新能源场站名称:" prop="name">
<el-input v-model="addData.name" clearable placeholder="请输入新能源场站名称"></el-input>
</el-form-item>
<el-form-item label="干扰源类型:" prop="stationType">
<el-select v-model="addData.stationType" clearable collapse-tags placeholder="请选择干扰源类型" filterable>
<el-option v-for="item in newEnergy" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="电压等级:" prop="scale">
<el-select v-model="addData.scale" clearable collapse-tags placeholder="请选择电压等级" filterable>
<el-option v-for="item in scaleList" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="额定有功功率(kW):" prop="ratedPower">
<el-input-number v-model="addData.ratedPower" :min="0" style="width: 100%" />
</el-form-item>
<el-form-item label="经度：" prop="longitude">
<el-input v-model="addData.longitude" type="text" placeholder="请输入经度" />
</el-form-item>
<el-form-item label="纬度：" prop="latitude">
<el-input v-model="addData.latitude" type="text" placeholder="请输入纬度" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="cancel">取消</el-button>
<el-button type="primary" @click="config">确定</el-button>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { useDictData } from '@/stores/dictData'
import { ElMessage } from 'element-plus'
import { editNewStation } from '@/api/device-boot/newEnergy'
const dictData = useDictData()
const userAdd = ref(false)
const title = ref('')
const newEnergy = dictData.getBasicData('new_station_type')
const scaleList = dictData.getBasicData('Dev_Voltage_Stand')
const emit = defineEmits(['onSubmit'])
const rules = reactive({
stationType: [{ required: true, message: '请选择干扰源类型', trigger: 'change' }],
scale: [{ required: true, message: '请选择电压等级', trigger: 'change' }],
name: [{ required: true, message: '请输入干扰源用户名称', trigger: 'blur' }],
ratedPower: [{ required: true, message: '请输入额定功率', trigger: 'blur' }],
longitude: [
{
required: true,
message: '请输入经度',
trigger: 'blur'
},
{
validator: (rule, value, callback) => {
if (!longitudeReg.test(value)) {
callback(new Error('请输入有效的经度'))
} else {
callback()
}
},
trigger: 'change'
}
],
latitude: [
{
required: true,
message: '请输入纬度',
trigger: 'blur'
},
{
validator: (rule, value, callback) => {
if (!latitudeReg.test(value)) {
callback(new Error('请输入有效的纬度'))
} else {
callback()
}
},
trigger: 'change'
}
]
})
// 经度正则表达式
const longitudeReg = /^[-+]?((180(\.0{1,10})?)|(1[0-7][0-9](\.\d{1,10})?)|([1-9]?\d(\.\d{1,10})?)|(0(\.\d{1,10})?))$/
// 纬度正则表达式
const latitudeReg = /^[-+]?((90(\.0{1,10})?)|([1-8]?\d(\.\d{1,10})?)|(0(\.\d{1,10})?))$/
const addData = ref({
scale: '',
stationType: '',
name: '',
ratedPower: 0,
longitude: '',
latitude: ''
})
const formRef = ref()
// 新增
const config = () => {
formRef.value.validate((valid: any) => {
if (valid) {
editNewStation(addData.value).then((res: any) => {
ElMessage.success(title.value + '成功!')
emit('onSubmit')
cancel()
})
}
})
}
// 重置
const cancel = () => {
// formRef.value.resetFields()
userAdd.value = false
}
const open = (row: any) => {
addData.value = {
scale: '',
stationType: '',
name: '',
ratedPower: 0,
longitude: '',
latitude: ''
}
title.value = row.title
if (row.title === '修改') {
addData.value = {
id: row.row.id,
scale: row.row.scale,
stationType: row.row.stationType,
name: row.row.name,
ratedPower: row.row.ratedPower - 0,
longitude: row.row.longitude,
latitude: row.row.latitude
}
}
userAdd.value = true
setTimeout(() => {
formRef.value.clearValidate()
}, 20)
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>

6
src/views/pqs/auditManage/auditList/index.vue
View File

@@ -20,7 +20,7 @@
</el-select>
</el-form-item>
<el-form-item label="事件类型:">
<el-select v-model="tableStore.table.params.type" placeholder="事件类型" clearable>
<el-select v-model="tableStore.table.params.type" placeholder="事件类型" clearable filterable>
<el-option
v-for="item in eventType"
:key="item.id"
@@ -30,7 +30,7 @@
</el-select>
</el-form-item>
<el-form-item label="操作类型:">
<el-select v-model="tableStore.table.params.operateType" placeholder="操作类型" clearable>
<el-select v-model="tableStore.table.params.operateType" placeholder="操作类型" clearable filterable>
<el-option
v-for="item in operationType"
:key="item.value"
@@ -40,7 +40,7 @@
</el-select>
</el-form-item>
<el-form-item label="操作结果:">
<el-select v-model="tableStore.table.params.result" placeholder="操作结果" clearable>
<el-select v-model="tableStore.table.params.result" placeholder="操作结果" clearable filterable>
<el-option
v-for="item in resultList"
:key="item.id"

4
src/views/pqs/auditManage/auditList/statistics.vue
View File

@@ -13,7 +13,7 @@
</el-select>
</el-form-item>
<el-form-item label="事件类型:">
<el-select v-model="tableStore.table.params.type" placeholder="事件类型" clearable>
<el-select v-model="tableStore.table.params.type" placeholder="事件类型" clearable filterable>
<el-option
v-for="item in eventType"
:key="item.id"
@@ -23,7 +23,7 @@
</el-select>
</el-form-item>
<el-form-item label="操作类型:">
<el-select v-model="tableStore.table.params.operateType" placeholder="操作类型" clearable>
<el-select v-model="tableStore.table.params.operateType" placeholder="操作类型" clearable filterable>
<el-option
v-for="item in operationType"
:key="item.value"

8
src/views/pqs/bearingCapacity/evaluationList/components/charge.vue
View File

@@ -17,7 +17,7 @@
style="max-width: 500px; margin: auto"
>
<el-form-item label="用户模式" prop="userMode">
<el-select v-model="form.userMode" placeholder="请选择用户模式">
<el-select v-model="form.userMode" placeholder="请选择用户模式" filterable>
<el-option
v-for="item in ModeList"
:key="item.id"
@@ -31,6 +31,7 @@
v-model="form.ptType"
@change="form.connectionMode = ''"
placeholder="请选择接线类型"
filterable
>
<el-option
v-for="item in connection"
@@ -46,12 +47,12 @@
</el-select>
</el-form-item>
<el-form-item label="功率因数" prop="k">
<el-select v-model="form.k" clearable placeholder="请选择功率因数">
<el-select v-model="form.k" clearable placeholder="请选择功率因数" filterable>
<el-option v-for="item in factor" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="电压等级" prop="scale">
<el-select v-model="form.scale" clearable placeholder="请选择电压等级">
<el-select v-model="form.scale" clearable placeholder="请选择电压等级" filterable>
<el-option
v-for="item in levelList"
:key="item.id"
@@ -91,6 +92,7 @@
style="width: 240px"
:disabled="props.rowList.id != undefined"
@change="selChange"
filterable
>
<el-option
v-for="item in userData"

1
src/views/pqs/bearingCapacity/evaluationList/components/photovoltaic.vue
View File

@@ -83,6 +83,7 @@
v-model="harmonicValue"
placeholder="请选择谐波"
@change="amplitudeQuery"
filterable
>
<el-option
v-for="item in harmonic"

1
src/views/pqs/bearingCapacity/evaluationList/index.vue
View File

@@ -8,6 +8,7 @@
v-model="tableStore.table.params.evaluateType"
clearable
placeholder="请选择评估类型"
filterable
>
<el-option v-for="item in uesrList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>

2
src/views/pqs/bearingCapacity/userManagement/equipment.vue
View File

@@ -31,7 +31,7 @@
/>
</el-form-item>
<el-form-item label="电压等级" prop="devScale">
<el-select v-model="form.devScale" clearable placeholder="请选择电压等级">
<el-select v-model="form.devScale" clearable placeholder="请选择电压等级" filterable>
<el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>

5
src/views/pqs/bearingCapacity/userManagement/index.vue
View File

@@ -8,6 +8,7 @@
v-model.trim="tableStore.table.params.userType"
clearable
placeholder="请选择用户类型"
filterable
>
<el-option v-for="item in uesrList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
@@ -21,7 +22,7 @@
<el-dialog draggable v-model="dialogVisible" :title="title" width="600" :before-close="handleClose">
<el-form ref="ruleFormRef" :model="form" label-width="170px" :disabled="disabled" :rules="rules">
<el-form-item label="用户类型：" prop="userType">
<el-select v-model="form.userType" clearable placeholder="请选择用户类型" @change="useChange">
<el-select v-model="form.userType" clearable placeholder="请选择用户类型" @change="useChange" filterable>
<el-option v-for="item in uesrList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
@@ -36,7 +37,7 @@
</el-form-item>
<el-form-item label="电压等级：" prop="voltage">
<el-select v-model="form.voltage" clearable collapse-tags placeholder="请选择电压等级">
<el-select v-model="form.voltage" clearable collapse-tags placeholder="请选择电压等级" filterable>
<el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>

2
src/views/pqs/business/log/TerminalLog/index.vue
View File

@@ -3,7 +3,7 @@
<TableHeader datePicker showExport>
<template v-slot:select>
<el-form-item label="日志类型">
<el-select v-model="tableStore.table.params.type" clearable placeholder="请选择日志类型">
<el-select v-model="tableStore.table.params.type" clearable placeholder="请选择日志类型" filterable>
<el-option v-for="item in fontdveoption" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>

7
src/views/pqs/business/terminal/FrontManagement/index.vue
View File

@@ -9,6 +9,7 @@
v-model="tableStore.table.params.nodeGrade"
clearable
placeholder="请选择前置等级"
filterable
>
<el-option
v-for="item in fontdveoption"
@@ -19,7 +20,7 @@
</el-select>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="tableStore.table.params.searchState" clearable placeholder="请选择状态">
<el-select v-model="tableStore.table.params.searchState" clearable placeholder="请选择状态" filterable>
<el-option
v-for="item in statusoption"
:key="item.id"
@@ -137,7 +138,7 @@
<el-input v-model="formData.ip" placeholder="请输入Ip"></el-input>
</el-form-item>
<el-form-item label="等级:" prop="nodeGrade" class="top">
<el-select v-model="formData.nodeGrade" placeholder="请选择等级" style="width: 100%">
<el-select v-model="formData.nodeGrade" placeholder="请选择等级" style="width: 100%" filterable>
<el-option
v-for="item in fontdveoption"
:key="item.id"
@@ -192,7 +193,7 @@
<Bind ref="bindRef" />
<!-- 绑定进程号 -->
<el-dialog draggable title="绑定进程号" v-model="popUps" :close-on-click-modal="false" width="400px">
<el-select v-model="processNo" placeholder="请选择进程号" style="width: 100%">
<el-select v-model="processNo" placeholder="请选择进程号" style="width: 100%" filterable>
<el-option
v-for="item in dataSource"
:key="item.name"

8
src/views/pqs/business/terminal/ProgramManagement/index.vue
View File

@@ -3,7 +3,7 @@
<TableHeader>
<template #select>
<el-form-item label="终端型号">
<el-select v-model="tableStore.table.params.devType" clearable placeholder="请选择终端型号">
<el-select v-model="tableStore.table.params.devType" clearable placeholder="请选择终端型号" filterable>
<el-option
v-for="item in teriminaloption"
:key="item.id"
@@ -13,7 +13,7 @@
</el-select>
</el-form-item>
<el-form-item label="终端状态">
<el-select v-model="tableStore.table.params.runFlag" clearable placeholder="请选择终端状态">
<el-select v-model="tableStore.table.params.runFlag" clearable placeholder="请选择终端状态" filterable>
<el-option
v-for="item in teriminalstatusoption"
:key="item.id"
@@ -23,7 +23,7 @@
</el-select>
</el-form-item>
<el-form-item label="通讯状态">
<el-select v-model="tableStore.table.params.comFlag" clearable placeholder="请选择通讯状态">
<el-select v-model="tableStore.table.params.comFlag" clearable placeholder="请选择通讯状态" filterable>
<el-option
v-for="item in stateoption"
:key="item.id"
@@ -33,7 +33,7 @@
</el-select>
</el-form-item>
<!-- <el-form-item label="程序版本">
<el-select v-model="tableStore.table.params.program" clearable placeholder="请选择程序版本">
<el-select v-model="tableStore.table.params.program" clearable placeholder="请选择程序版本" filterable>
<el-option
v-for="item in programoption"
:key="item.id"

2
src/views/pqs/business/terminal/TerminalManagement/components/disposition.vue
View File

@@ -4,7 +4,7 @@
<el-dialog draggable :title="title" v-model="dialogVisible" width="50%" :before-close="cancel">
<el-form :inline="true" :model="formInline" style="display: flex; justify-content: space-between">
<el-form-item label="终端状态">
<el-select v-model="formInline.state" placeholder="Select" size="large" style="width: 240px">
<el-select v-model="formInline.state" placeholder="Select" size="large" style="width: 240px" filterable>
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>

4
src/views/pqs/business/terminal/TerminalManagement/index.vue
View File

@@ -18,7 +18,7 @@
</el-select>
</el-form-item>
<el-form-item label="终端状态">
<el-select v-model="tableStore.table.params.runFlag" clearable placeholder="请选择终端状态">
<el-select v-model="tableStore.table.params.runFlag" clearable placeholder="请选择终端状态" filterable>
<el-option
v-for="item in teriminalstatusoption"
:key="item.id"
@@ -28,7 +28,7 @@
</el-select>
</el-form-item>
<el-form-item label="通讯状态">
<el-select v-model="tableStore.table.params.comFlag" clearable placeholder="请选择通讯状态">
<el-select v-model="tableStore.table.params.comFlag" clearable placeholder="请选择通讯状态" filterable>
<el-option
v-for="item in stateoption"
:key="item.id"

36
src/views/pqs/business/terminal/deviceter/index.vue
View File

@@ -2005,28 +2005,28 @@ const arrdess: any = ref((rule: any, value: any, callback: any) => {
}
})
/**经度 */
const lngff: any = ref((rule: any, value: any, callback: any) => {
let reg1 = /^(([1-9]\d?)|(1[0-7]\d))(\.\d{1,6})|180|0(\.\d{1,6})?/
if (reg1.test(value)) {
return true
} else if (value == '') {
/** 经度：-180 ~ 180，最多 6 位小数 */
const lngff = (_rule: any, value: any, callback: any) => {
if (value === '' || value === null || value === undefined) {
return callback(new Error('请输入经度'))
} else {
callback(new Error('请输入正确经度'))
}
})
/**纬度 */
const latff: any = ref((rule: any, value: any, callback: any) => {
let reg2 = /^(\-|\+)?([0-8]?\d{1}\.\d{0,6}|90\.0{0,6}|[0-8]?\d{1}|90)$/
if (reg2.test(value)) {
return true
} else if (value == '') {
const reg = /^[+-]?(?:180(?:\.0{1,6})?|(?:1[0-7]\d|[1-9]?\d)(?:\.\d{1,6})?)$/
if (!reg.test(String(value))) {
return callback(new Error('请输入正确经度（-180~180，最多6位小数）'))
}
callback()
}
/** 纬度：-90 ~ 90，最多 6 位小数 */
const latff = (_rule: any, value: any, callback: any) => {
if (value === '' || value === null || value === undefined) {
return callback(new Error('请输入纬度'))
} else {
callback(new Error('请输入正确纬度'))
}
})
const reg = /^[+-]?(?:90(?:\.0{1,6})?|[1-8]?\d(?:\.\d{1,6})?)$/
if (!reg.test(String(value))) {
return callback(new Error('请输入正确纬度（-90~90，最多6位小数）'))
}
callback()
}
const plevel = ref(0)
const nodeDataList = ref()
const nodeEventList = ref()

2
src/views/pqs/business/terminal/sensitiveLoadMange/detail.vue
View File

@@ -8,7 +8,7 @@
<el-input v-model.trim="form.name" placeholder="请输入敏感用户名称"></el-input>
</el-form-item>
<el-form-item label="敏感负荷类型" prop="loadType">
<el-select v-model.trim="form.loadType" filterable clearable placeholder="请选择数据分类">
<el-select v-model.trim="form.loadType" filterable clearable placeholder="请选择数据分类" >
<el-option
v-for="item in DataTypeSelect"
:key="item.id"

2
src/views/pqs/business/terminal/terminaCkeck/index.vue
View File

@@ -3,7 +3,7 @@
<TableHeader ref="TableHeaderRef" showCustomColumn>
<template #select>
<el-form-item label="地市">
<el-select v-model="tableStore.table.params.city" clearable placeholder="请选择地市">
<el-select v-model="tableStore.table.params.city" clearable placeholder="请选择地市" filterable>
<el-option
v-for="item in areaOptionList"
:key="item.id"

2
src/views/pqs/business/terminal/transformerStrategy/components/addLedger.vue
View File

@@ -77,7 +77,7 @@
<el-input v-model="ruleForm.tfName" placeholder="请输入" clearable maxlength="32" show-word-limit></el-input>
</el-form-item>
<el-form-item label="接线方式:" prop="wiring" class="top">
<el-select style="width: 100%" v-model="ruleForm.wiring" clearable placeholder="请选择接线方式">
<el-select style="width: 100%" v-model="ruleForm.wiring" clearable placeholder="请选择接线方式" filterable>
<el-option
v-for="item in connectionType"
:key="item.id"

21
src/views/pqs/business/terminal/userLedger/components/addForm.vue
View File

@@ -34,7 +34,7 @@
<el-input v-model.trim="form.orgId" :disabled="true" autocomplete="off" />
</el-form-item> -->
<el-form-item for="-" label="所在地市：" prop="city">
<el-select v-model="form.city" clearable placeholder="请选择所在地市">
<el-select v-model="form.city" clearable placeholder="请选择所在地市" filterable>
<el-option
v-for="item in areaOptionList"
:key="item.id"
@@ -76,7 +76,7 @@
</el-form-item>
<el-form-item for="-" label="用户性质：">
<!-- :disabled="resendId != '' && title != '编辑'" -->
<el-select v-model="form.userType" placeholder="请选择用户性质">
<el-select v-model="form.userType" placeholder="请选择用户性质" filterable>
<el-option
v-for="(item, index) in userTypeList"
:label="item.label"
@@ -97,7 +97,7 @@
</el-form-item>
<el-form-item for="-" label="用户状态：">
<el-select v-model="form.userStatus" placeholder="请选择用户状态">
<el-select v-model="form.userStatus" placeholder="请选择用户状态" filterable>
<el-option
v-for="(item, index) in userStateList"
:label="item.label"
@@ -161,7 +161,7 @@
/>
</el-form-item>
<el-form-item for="-" label="电压等级：">
<el-select v-model="form.voltageLevel" placeholder="请选择电压等级" node-key="id">
<el-select v-model="form.voltageLevel" placeholder="请选择电压等级" node-key="id" filterable>
<el-option
v-for="(item, index) in voltageLevelList"
:label="item.name"
@@ -171,7 +171,7 @@
</el-select>
</el-form-item>
<el-form-item for="-" label="所属电站：" prop="stationId">
<el-select v-model="form.stationId" filterable placeholder="请选择所属电站">
<el-select v-model="form.stationId" filterable placeholder="请选择所属电站" >
<el-option v-for="(item, index) in stationList" :label="item.name" :value="item.id" :key="index" />
</el-select>
</el-form-item>
@@ -200,7 +200,7 @@
</el-form-item>
<el-form-item for="-" v-if="form.userType != '0' && form.userType != '1'" label="评估类型：">
<el-select v-model="form.evaluationType" placeholder="请选择评估类型">
<el-select v-model="form.evaluationType" placeholder="请选择评估类型" filterable>
<el-option
v-for="(item, index) in evaluationTypeList"
:key="index"
@@ -275,7 +275,7 @@
</el-input>
</el-form-item>-->
<el-form-item for="-" v-if="form.userType == '6'" label="行业：">
<el-select v-model="form.industry" placeholder="请选择行业">
<el-select v-model="form.industry" placeholder="请选择行业" filterable>
<el-option v-for="(item, index) in industryList" :label="item.name" :value="item.id" :key="index" />
</el-select>
</el-form-item>
@@ -296,7 +296,7 @@
multiple
collapse-tags
collapse-tags-tooltip
placeholder="请选择敏感电能质量指标"
placeholder="请选择敏感电能质量指标" filterable
>
<el-option
v-for="(item, index) in energyQualityIndexList"
@@ -335,12 +335,12 @@
</el-radio-group>
</el-form-item>
<el-form-item for="-" v-if="form.userType == '6' && isInterferencemanagement" label="负荷级别：">
<el-select v-model="form.loadLevel" collapse-tags collapse-tags-tooltip placeholder="请选择负荷级别">
<el-select v-model="form.loadLevel" collapse-tags collapse-tags-tooltip placeholder="请选择负荷级别" filterable>
<el-option
v-for="(item, index) in loadLevelOptionList"
:label="item.name"
:value="item.id"
:key="index"
:key="index"
/>
</el-select>
</el-form-item>
@@ -350,6 +350,7 @@
collapse-tags
collapse-tags-tooltip
placeholder="请选择供电电源情况"
filterable
>
<el-option
v-for="(item, index) in powerSupplyInfoOptionList"

2
src/views/pqs/business/terminal/userLedger/index.vue
View File

@@ -13,7 +13,7 @@
></el-input>
</el-form-item>
<el-form-item label="所在地市">
<el-select v-model="tableStore.table.params.city" clearable placeholder="请选择所在地市">
<el-select v-model="tableStore.table.params.city" clearable placeholder="请选择所在地市" filterable>
<el-option
v-for="item in areaOptionList"
:key="item.id"

2
src/views/pqs/database/algorithm/components/form.vue
View File

@@ -15,7 +15,7 @@
<el-input v-model="form.name" placeholder="请输入算法名称" clearable maxlength="32" show-word-limit @input="handleInput('name', $event)"/>
</el-form-item>
<el-form-item label="计算周期" prop="period" v-if="title == '修改算法' ? TreeList.level == 4 : TreeList.level == 3">
<el-select v-model="form.period" placeholder="请选择计算周期" clearable>
<el-select v-model="form.period" placeholder="请选择计算周期" clearable filterable>
<el-option v-for="item in cycle" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>

2
src/views/pqs/database/standard/components/addTree.vue
View File

@@ -4,7 +4,7 @@
<el-form :inline="false" :model="form" label-width="auto" class="form-one" :rules="rules" ref="formRef">
<el-form-item label="上级名称" v-if="title == '新增'">
<el-select v-model="form.pid" placeholder="请选择上级名称" clearable>
<el-select v-model="form.pid" placeholder="请选择上级名称" clearable filterable>
<el-option v-for="item in dataTree" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>

7
src/views/pqs/harmonicMonitoring/area/SteadyState/index.vue
View File

@@ -9,6 +9,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -28,6 +29,7 @@
placeholder="请选择电压等级"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -43,6 +45,7 @@
clearable
style="width: 100%"
placeholder="请选择电网标识"
filterable
>
<el-option
v-for="item in powerFlagList"
@@ -61,6 +64,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"
@@ -79,7 +83,8 @@
placeholder="请选择干扰源类型"
style="width: 100%"
value-key="id"
>
filterable
>
<el-option
v-for="(item, index) in interfereoption"
:key="index"

4
src/views/pqs/harmonicMonitoring/area/TransientEventList/index.vue
View File

@@ -17,6 +17,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option
v-for="item in classificationData"
@@ -35,6 +36,7 @@
clearable
value-key="id"
placeholder="请选择电压等级"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -52,6 +54,7 @@
clearable
value-key="id"
placeholder="请选择终端厂家"
filterable
>
<el-option
v-for="item in terminaloption"
@@ -69,6 +72,7 @@
clearable
value-key="id"
placeholder="请选择干扰源类型"
filterable
>
<el-option
v-for="item in interfereoption"

10
src/views/pqs/harmonicMonitoring/area/getIntegrityData/index.vue
View File

@@ -6,7 +6,7 @@
<template #select>
<el-form-item label="统计类型">
<el-select v-model="formData.statisticalType" placeholder="请选择统计类型" value-key="id"
style="width: 100%">
style="width: 100%" filterable>
<el-option v-for="item in classificationData" :key="item.id" :label="item.name"
:value="item"></el-option>
</el-select>
@@ -36,28 +36,28 @@
</el-form-item>
<el-form-item label="电压等级">
<el-select v-model="formData.scale" multiple collapse-tags clearable placeholder="请选择电压等级"
style="width: 100%" value-key="id">
style="width: 100%" value-key="id" filterable>
<el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name"
:value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="终端厂家">
<el-select v-model="formData.manufacturer" multiple collapse-tags clearable
placeholder="请选择终端厂家" style="width: 100%" value-key="id">
placeholder="请选择终端厂家" style="width: 100%" value-key="id" filterable>
<el-option v-for="(item, index) in terminaloption" :key="index" :label="item.name"
:value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="干扰源类型">
<el-select v-model="formData.loadType" multiple collapse-tags clearable placeholder="请选择干扰源类型"
style="width: 100%" value-key="id">
style="width: 100%" value-key="id" filterable>
<el-option v-for="(item, index) in interfereoption" :key="index" :label="item.name"
:value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="通讯状态">
<el-select v-model="tableStore.table.params.comFlagStatus" clearable placeholder="请选择通讯状态"
style="width: 100%">
style="width: 100%" filterable>
<el-option label="正常" value="1" />
<el-option label="中断" value="0" />

6
src/views/pqs/harmonicMonitoring/area/harmonicDistortionRate/index.vue
View File

@@ -9,6 +9,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -28,6 +29,7 @@
placeholder="请选择电压等级"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -46,6 +48,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"
@@ -64,6 +67,7 @@
placeholder="请选择干扰源类型"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in interfereoption"
@@ -74,7 +78,7 @@
</el-select>
</el-form-item>
<el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志" filterable>
<el-option
v-for="item in sign"
:key="item.id"

6
src/views/pqs/harmonicMonitoring/area/harmonicDistortionRate/index1.vue
View File

@@ -8,6 +8,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -27,6 +28,7 @@
placeholder="请选择电压等级"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -45,6 +47,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"
@@ -64,6 +67,7 @@
placeholder="请选择干扰源类型"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in interfereoption"
@@ -74,7 +78,7 @@
</el-select>
</el-form-item>
<el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志" filterable>
<el-option v-for="item in sign" :key="item.id" :label="item.name" :value="item.algoDescribe" />
</el-select>
</el-form-item>

4
src/views/pqs/harmonicMonitoring/area/onlinerate/index.vue
View File

@@ -9,6 +9,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -57,6 +58,7 @@
placeholder="请选择电压等级"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -75,6 +77,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"
@@ -93,6 +96,7 @@
placeholder="请选择干扰源类型"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in interfereoption"

2
src/views/pqs/harmonicMonitoring/area/powerAssessment/index.vue
View File

@@ -3,7 +3,7 @@
<TableHeader area datePicker ref="header">
<template v-slot:select>
<el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志" filterable>
<el-option v-for="item in sign" :key="item.id" :label="item.name" :value="item.algoDescribe" />
</el-select>
</el-form-item>

6
src/views/pqs/harmonicMonitoring/area/qualifiedRate/index.vue
View File

@@ -9,6 +9,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -28,6 +29,7 @@
placeholder="请选择电压等级"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -46,6 +48,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"
@@ -64,6 +67,7 @@
placeholder="请选择干扰源类型"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in interfereoption"
@@ -74,7 +78,7 @@
</el-select>
</el-form-item>
<el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志" filterable>
<el-option
v-for="item in sign"
:key="item.id"

5
src/views/pqs/harmonicMonitoring/area/qualifiedRate/index1.vue
View File

@@ -8,6 +8,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -27,6 +28,7 @@
placeholder="请选择电压等级"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -45,6 +47,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"
@@ -74,7 +77,7 @@
</el-select>
</el-form-item>
<el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志" filterable>
<el-option v-for="item in sign" :key="item.id" :label="item.name" :value="item.algoDescribe" />
</el-select>
</el-form-item>

2
src/views/pqs/harmonicMonitoring/area/terminalonlinerate/index.vue
View File

@@ -9,6 +9,7 @@
placeholder="请选择统计类型"
value-key="id"
style="width: 100%"
filterable
>
<el-option
v-for="item in classificationData"
@@ -28,6 +29,7 @@
placeholder="请选择终端厂家"
style="width: 100%"
value-key="id"
filterable
>
<el-option
v-for="(item, index) in terminaloption"

2
src/views/pqs/harmonicMonitoring/detailed/alarmStatistics/index.vue
View File

@@ -4,7 +4,7 @@
<TableHeader date-picker area showExport showCustomColumn>
<template #select>
<!-- <el-form-item label="统计类型:">
<el-select v-model="tableStore.table.params.statisticalType" placeholder="请选择统计类型" value-key="id">
<el-select v-model="tableStore.table.params.statisticalType" placeholder="请选择统计类型" value-key="id" filterable>
<el-option v-for="item in classificationData" :key="item.id" :label="item.name" :value="item">
</el-option>
</el-select>

1589
src/views/pqs/harmonicMonitoring/detailed/dirtyAreas/index.vue
View File

File diff suppressed because it is too large Load Diff

4
src/views/pqs/harmonicMonitoring/detailed/harmonicStatistics/index.vue
View File

@@ -3,12 +3,12 @@
<TableHeader datePicker ref="header">
<template v-slot:select>
<el-form-item label="统计类型">
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型" filterable>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>
<el-form-item label="电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志">
<el-select v-model="tableStore.table.params.powerFlag" placeholder="请选择电网标志" filterable >
<el-option v-for="item in sign" :key="item.id" :label="item.name" :value="item.algoDescribe" />
</el-select>
</el-form-item>

2
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/MonitoringPointTab.vue
View File

@@ -17,6 +17,7 @@
value-key="id"
placeholder="请选择统计类型"
@change="handleStatisticalTypeChange"
filterable
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
@@ -26,6 +27,7 @@
v-model="tableStore.table.params.powerFlag"
placeholder="请选择电网标志"
@change="handleFilterChange"
filterable
>
<el-option label="全部" value="0"></el-option>
<el-option label="电网侧" value="1"></el-option>

4
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/SubstationTab.vue
View File

@@ -15,7 +15,8 @@
<el-select
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
placeholder="请选择统计类型"
filterable
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
@@ -25,6 +26,7 @@
v-model="tableStore.table.params.powerFlag"
placeholder="请选择电网标志"
@change="handleFilterChange"
filterable
>
<el-option label="全部" value="0"></el-option>
<el-option label="电网侧" value="1"></el-option>

1
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/regionalAssessment.vue
View File

@@ -7,6 +7,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>

1
src/views/pqs/harmonicMonitoring/detailed/pollutionReport/components/userEvaluation.vue
View File

@@ -7,6 +7,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>

2
src/views/pqs/harmonicMonitoring/detailed/powerQualityPollutionMap/index.vue
View File

@@ -3,7 +3,7 @@
<TableHeader area date-picker ref="header">
<template v-slot:select>
<el-form-item label="统计类型">
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型" filterable>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</el-form-item>

1
src/views/pqs/harmonicMonitoring/detailed/regionalStatistics/index.vue
View File

@@ -7,6 +7,7 @@
v-model="tableStore.table.params.statisticalType"
placeholder="请选择统计类型"
value-key="id"
filterable
>
<el-option
v-for="item in classificationData"

6
src/views/pqs/harmonicMonitoring/embed/lntegruty/components/echart.vue
View File

@@ -6,6 +6,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option
v-for="item in classificationData"
@@ -24,6 +25,7 @@
clearable
value-key="id"
placeholder="请选择电压等级"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -41,6 +43,7 @@
clearable
value-key="id"
placeholder="请选择终端厂家"
filterable
>
<el-option
v-for="item in terminaloption"
@@ -58,7 +61,8 @@
clearable
value-key="id"
placeholder="请选择干扰源类型"
>
filterable
>
<el-option
v-for="item in interfereoption"
:key="item.id"

4
src/views/pqs/harmonicMonitoring/embed/lntegruty/components/table.vue
View File

@@ -13,6 +13,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option
v-for="item in classificationData"
@@ -31,6 +32,7 @@
clearable
value-key="id"
placeholder="请选择电压等级"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -48,6 +50,7 @@
clearable
value-key="id"
placeholder="请选择终端厂家"
filterable
>
<el-option
v-for="item in terminaloption"
@@ -65,6 +68,7 @@
clearable
value-key="id"
placeholder="请选择干扰源类型"
filterable
>
<el-option
v-for="item in interfereoption"

4
src/views/pqs/harmonicMonitoring/embed/lntegruty/components_JB/echart.vue
View File

@@ -6,6 +6,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option
v-for="item in classificationData"
@@ -24,6 +25,7 @@
clearable
value-key="id"
placeholder="请选择电压等级"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -41,6 +43,7 @@
clearable
value-key="id"
placeholder="请选择终端厂家"
filterable
>
<el-option
v-for="item in terminaloption"
@@ -58,6 +61,7 @@
clearable
value-key="id"
placeholder="请选择干扰源类型"
filterable
>
<el-option
v-for="item in interfereoption"

4
src/views/pqs/harmonicMonitoring/embed/lntegruty/components_JB/table.vue
View File

@@ -13,6 +13,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option
v-for="item in classificationData"
@@ -31,6 +32,7 @@
clearable
value-key="id"
placeholder="请选择电压等级"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -48,6 +50,7 @@
clearable
value-key="id"
placeholder="请选择终端厂家"
filterable
>
<el-option
v-for="item in terminaloption"
@@ -65,6 +68,7 @@
clearable
value-key="id"
placeholder="请选择干扰源类型"
filterable
>
<el-option
v-for="item in interfereoption"

2
src/views/pqs/harmonicMonitoring/embed/lntegruty/index_JB.vue
View File

@@ -3,7 +3,7 @@
<TableHeader date-picker area ref="TableHeaderRef">
<template v-slot:select>
<el-form-item label="运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态" filterable>
<el-option
v-for="item in runFlagList"
:key="item.id"

4
src/views/pqs/harmonicMonitoring/embed/onlinerate/components/echart.vue
View File

@@ -6,6 +6,7 @@
v-model="tableStore.table.params.statisticalType"
value-key="id"
placeholder="请选择统计类型"
filterable
>
<el-option
v-for="item in classificationData"
@@ -24,6 +25,7 @@
clearable
value-key="id"
placeholder="请选择电压等级"
filterable
>
<el-option
v-for="item in voltageleveloption"
@@ -41,6 +43,7 @@
clearable
value-key="id"
placeholder="请选择终端厂家"
filterable
>
<el-option
v-for="item in terminaloption"
@@ -58,6 +61,7 @@
clearable
value-key="id"
placeholder="请选择干扰源类型"
filterable
>
<el-option
v-for="item in interfereoption"

8
src/views/pqs/harmonicMonitoring/embed/onlinerate/components/table.vue
View File

@@ -5,7 +5,7 @@
<el-input v-model="tableStore.table.params.filterName" @keyup="searchEvent" placeholder="输入关键字筛选" />
</el-form-item>
<el-form-item label="统计类型:">
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
<el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型" filterable>
<el-option v-for="item in classificationData" :key="item.id" :label="item.name"
:value="item"></el-option>
</el-select>
@@ -13,21 +13,21 @@
<el-form-item label="电压等级:">
<el-select v-model="tableStore.table.params.scale" multiple collapse-tags clearable value-key="id"
placeholder="请选择电压等级">
placeholder="请选择电压等级" filterable>
<el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name"
:value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="终端厂家:">
<el-select v-model="tableStore.table.params.manufacturer" multiple collapse-tags clearable
value-key="id" placeholder="请选择终端厂家">
value-key="id" placeholder="请选择终端厂家" filterable>
<el-option v-for="item in terminaloption" :key="item.id" :label="item.name"
:value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="干扰源类型:">
<el-select v-model="tableStore.table.params.loadType" multiple collapse-tags clearable value-key="id"
placeholder="请选择干扰源类型">
placeholder="请选择干扰源类型" filterable>
<el-option v-for="item in interfereoption" :key="item.id" :label="item.name"
:value="item"></el-option>
</el-select>

2
src/views/pqs/harmonicMonitoring/embed/onlinerate/index_JB.vue
View File

@@ -3,7 +3,7 @@
<TableHeader date-picker area ref="TableHeaderRef">
<template v-slot:select>
<el-form-item label="运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态" filterable>
<el-option
v-for="item in runFlagList"
:key="item.id"

4
src/views/pqs/harmonicMonitoring/monitoringPoint/online/gaojingshujutongji/index.vue
View File

@@ -28,7 +28,7 @@
</el-select>
</el-form-item>
<el-form-item label="谐波次数:" v-if="showXieBoCiShu">
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波">
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波" filterable>
<el-option
v-for="item in harmonicOptions"
:key="item.value"
@@ -38,7 +38,7 @@
</el-select>
</el-form-item>
<el-form-item v-if="showJianXieBoCiShu" label="间谐波次数:">
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波">
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波" filterable>
<el-option
v-for="item in inharmonicOptions"
:key="item.value"

2
src/views/pqs/harmonicMonitoring/monitoringPoint/online/gaojingshujutongji/index_JB.vue
View File

@@ -6,7 +6,7 @@
<el-select
v-model="tableStore.table.params.targetId"
clearable
filterable
collapse-tags
collapse-tags-tooltip
placeholder="请选择超标指标"

2
src/views/pqs/harmonicMonitoring/monitoringPoint/online/shishishuju/spectrum.vue
View File

@@ -3,7 +3,7 @@
<el-button class="shutDown" icon="el-icon-Back" @click="emit('shutDown')">返回</el-button>
<div class="select">
<div class="mr10">谐波次数</div>
<el-select v-model="selectValue" style="width: 100px" @change="loading = true">
<el-select v-model="selectValue" style="width: 100px" @change="loading = true" filterable>
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>

815
src/views/pqs/harmonicMonitoring/monitoringPoint/online/shishishuju/trend.vue
View File

@@ -1,407 +1,408 @@
<template>
<div class="pt50">
<el-button class="shutDown" icon="el-icon-Back" @click="emit('shutDown')">返回</el-button>
<div class="select">
<el-form :model="searchForm" id="history_select">
<el-form-item label="稳态指标">
<el-select
multiple
collapse-tags
collapse-tags-tooltip
v-model.trim="searchForm.index"
placeholder="请选择统计指标"
:multiple-limit="3"
value-key="id"
@change="change"
>
<el-option
v-for="(item, index) in indexOptions"
:label="item.name"
:key="index"
:value="item"
></el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<div v-loading="loading" id="trend">
<div :style="height" v-for="(item, index) in searchForm.index" :key="index">
<MyEchart ref="MyEchartRef" :options="item.echartsData" :isInterVal="true" @group="group"></MyEchart>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted, onBeforeUnmount } from 'vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { mainHeight } from '@/utils/layout'
import { timeFormat } from '@/utils/common'
import { useConfig } from '@/stores/config'
import { yMethod } from '@/utils/echartMethod'
import html2canvas from 'html2canvas'
import * as echarts from 'echarts' // 全引入
const config = useConfig()
const props = defineProps({
ptName: {
type: String
}
})
const loading = ref(true)
const emit = defineEmits(['shutDown'])
const searchForm: any = ref({ index: [] })
const timeList = ref([])
const MyEchartRef = ref()
const height = ref(mainHeight(150, 2))
//统计指标
const indexOptions: any = ref([
{
id: 0,
name: '电压总有效值(kV)',
children: [
{ name: 'vRmsA', phase: props.ptName == 'star' ? 'A相' : 'AB相', data: [] },
{ name: 'vRmsB', phase: props.ptName == 'star' ? 'B相' : 'BC相', data: [] },
{ name: 'vRmsC', phase: props.ptName == 'star' ? 'C相' : 'CA相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'kV',
data: []
},
{
id: 1,
name: '电流总有效值(A)',
children: [
{ name: 'iRmsA', phase: 'A相', data: [] },
{ name: 'iRmsB', phase: 'B相', data: [] },
{ name: 'iRmsC', phase: 'C相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'A',
data: []
},
{
id: 2,
name: '有功功率(kW)',
children:
props.ptName == 'star'
? [
{ name: 'pA', phase: 'A相', data: [] },
{ name: 'pB', phase: 'B相', data: [] },
{ name: 'pC', phase: 'C相', data: [] },
{ name: 'pTot', phase: '总', data: [] }
]
: [{ name: 'pTot', phase: '总', data: [] }],
color: props.ptName == 'star' ? ['#DAA520', '#2E8B57', '#A52a2a', '#000'] : ['#000'],
unit: 'kW',
data: []
},
{
id: 3,
name: '无功功率(kW)',
children:
props.ptName == 'star'
? [
{ name: 'qA', phase: 'A相', data: [] },
{ name: 'qB', phase: 'B相', data: [] },
{ name: 'qC', phase: 'C相', data: [] },
{ name: 'qTot', phase: '总', data: [] }
]
: [{ name: 'qTot', phase: '总', data: [] }],
color: props.ptName == 'star' ? ['#DAA520', '#2E8B57', '#A52a2a', '#000'] : ['#000'],
unit: 'kW',
data: []
},
{
id: 4,
name: '基波电压总有效值(kV)',
children: [
{ name: 'v1A', phase: props.ptName == 'star' ? 'A相' : 'AB相', data: [] },
{ name: 'v1B', phase: props.ptName == 'star' ? 'B相' : 'BC相', data: [] },
{ name: 'v1C', phase: props.ptName == 'star' ? 'C相' : 'CA相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'kV',
data: []
},
{
id: 5,
name: '基波电流总有效值(A)',
children: [
{ name: 'i1A', phase: 'A相', data: [] },
{ name: 'i1B', phase: 'B相', data: [] },
{ name: 'i1C', phase: 'C相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'A',
data: []
},
{
id: 6,
name: '频率(Hz)',
children: [
{ name: 'freq', phase: '频率', data: [] },
{ name: 'freqDev', phase: '频率偏差', data: [] }
],
color: [config.layout.elementUiPrimary[0], '#00BFF5'],
unit: 'Hz',
data: []
},
{
id: 7,
name: '电压不平衡度(%)',
children: [{ name: 'vUnbalance', phase: '电压不平衡度', data: [] }],
color: [config.layout.elementUiPrimary[0]],
unit: '%',
data: []
},
{
id: 8,
name: '电流不平衡度(%)',
children: [{ name: 'iUnbalance', phase: '电流不平衡度', data: [] }],
color: [config.layout.elementUiPrimary[0]],
unit: '%',
data: []
}
])
const group = (e: any) => {
e.group = 'group'
}
const change = () => {
height.value = mainHeight(150, searchForm.value.index.length)
// let name = searchForm.value.index.map(item => item.name)
// let list = indexOptions.value.filter(item => !name.includes(item.name))
loading.value = true
searchForm.value.index.forEach((item: any) => {
item.echartsData.xAxis.data = []
item.echartsData.series.forEach((child: any) => {
child.data = []
})
})
// console.log("🚀 ~ change ~ MyEchartRef.value[0]?.getChart():", MyEchartRef.value[0]?.getChart())
}
onMounted(() => {
setEcharts()
searchForm.value.index.push(...[indexOptions.value[0], indexOptions.value[1]])
})
const init = (row: any) => {
// timeList.value.push(timeFormat(row.TIME - 0))
searchForm.value.index.forEach((item: any, index: any) => {
// item.echartsData.xAxis.data.push(timeFormat(row.TIME - 0))
let time = timeFormat(row.TIME - 0)
switch (item.name) {
case '电压总有效值(kV)':
item.echartsData.series[0].data.push([
time,
Math.floor((props.ptName == 'star' ? row.V.A?.VRMS : row.V.A?.VRMS_LVR) * 100) / 100
])
item.echartsData.series[1].data.push([
time,
Math.floor((props.ptName == 'star' ? row.V.B?.VRMS : row.V.B?.VRMS_LVR) * 100) / 100
])
item.echartsData.series[2].data.push([
time,
Math.floor((props.ptName == 'star' ? row.V.C?.VRMS : row.V.C?.VRMS_LVR) * 100) / 100
])
break
case '电流总有效值(A)':
item.echartsData.series[0].data.push([time, Math.floor(row.I.A?.IRMS * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.I.B?.IRMS * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.I.C?.IRMS * 100) / 100])
break
case '有功功率(kW)':
if (props.ptName == 'star') {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.A?.P * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.PQ.B?.P * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.PQ.C?.P * 100) / 100])
item.echartsData.series[3].data.push([time, Math.floor(row.PQ.T?.P * 100) / 100])
} else {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.T?.P * 100) / 100])
}
break
case '无功功率(kW)':
if (props.ptName == 'star') {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.A?.Q * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.PQ.B?.Q * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.PQ.C?.Q * 100) / 100])
item.echartsData.series[3].data.push([time, Math.floor(row.PQ.T?.Q * 100) / 100])
} else {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.T?.Q * 100) / 100])
}
break
case '基波电压总有效值(kV)':
item.echartsData.series[0].data.push([time, Math.floor(row.V.A?.V1 * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.V.B?.V1 * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.V.C?.V1 * 100) / 100])
break
case '基波电流总有效值(A)':
item.echartsData.series[0].data.push([time, Math.floor(row.I.A?.I1 * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.I.B?.I1 * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.I.C?.I1 * 100) / 100])
break
case '频率(Hz)':
item.echartsData.series[0].data.push([time, Math.floor(row.V.T?.FREQ * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.V.T?.DELTA_FREQ * 100) / 100])
break
case '电压不平衡度(%)':
item.echartsData.series[0].data.push([time, Math.floor(row.V.T?.V_UNBAN * 100) / 100])
break
case '电流不平衡度(%)':
item.echartsData.series[0].data.push([time, Math.floor(row.I.T?.I_UNBAN * 100) / 100])
break
}
item.echartsData.series.forEach((item1: any) => {
if (item1.data.length > 60) {
item1.data.shift()
}
})
let [min, max] = yMethod([].concat(...item.echartsData.series.map(k => k.data).map(k1 => k1.map(k2 => k2[1]))))
item.echartsData.yAxis.min = min
item.echartsData.yAxis.max = max
})
MyEchartRef.value[0]?.setOptions(searchForm.value.index[0].echartsData)
MyEchartRef.value[1]?.setOptions(searchForm.value.index[1].echartsData)
MyEchartRef.value[2]?.setOptions(searchForm.value.index[2].echartsData)
if (loading.value) {
echarts.connect('group')
}
loading.value = false
}
const setEcharts = () => {
indexOptions.value.forEach((item: any, index: any) => {
item.echartsData = {
title: {
text: item.name
},
xAxis: {
name: '时间',
type: 'time',
axisLabel: {
interval: 0, // 强制显示所有标签
formatter: {
day: '{MM}-{dd}',
month: '{MM}',
year: '{yyyy}'
}
},
data: []
},
yAxis: {
// type: 'value',
name: item.unit,
splitNumber: 5,
minInterval: 1,
alignTicks: true // 强制对齐刻度
},
toolbox: {
right: 20,
top: 15,
show: index == 0 ? true : false,
feature: {
// 移除默认的 saveAsImage
// saveAsImage: { title: '保存图片' }
myCustomDownload: {
title: '', // 按钮标题
icon: 'path://M892.342857 463.238095l-73.142857-68.266666-258.438095 258.438095V29.257143h-97.52381v624.152381L204.8 394.971429 131.657143 463.238095l380.342857 380.342857zM107.27619 897.219048h804.571429v97.523809H107.27619z', // 自定义图标路径
onclick: function () {
html2canvas(document.getElementById('trend'), {
scale: 1
}).then(function (canvas) {
// 创建a标签，实现下载
let creatIMg = document.createElement('a')
creatIMg.download = '实时趋势.png' // 设置下载的文件名，
creatIMg.href = canvas.toDataURL() // 下载url
creatIMg.click()
creatIMg.remove() // 下载之后把创建的元素删除
})
}
}
}
},
tooltip: {
axisPointer: {
type: 'cross',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.55)',
borderWidth: 0,
formatter(params: any) {
const xname = params[0].value[0]
let str = `${xname}<br>`
params.forEach((el: any, index: any) => {
let marker = ''
// if (el.value[3] == 'dashed') {
// for (let i = 0; i < 3; i++) {
// marker += `<span style="display:inline-block;border: 2px ${el.color} solid;margin-right:5px;width:10px;height:0px;background-color:#ffffff00;"></span>`
// }
// } else {
// marker = `<span style="display:inline-block;border: 2px ${el.color} ${el.value[3]};margin-right:5px;width:40px;height:0px;background-color:#ffffff00;"></span>`
// }
str += `${el.marker} ${el.seriesName.split('(')[0]}：${
el.value[1] ? el.value[1] + ' ' + (el.value[2] || '') : '-'
}<br>`
})
return str
}
},
series: []
}
item.children.map((zz: any, zzIndex: any) => {
item.echartsData.series.push({
name: zz.phase,
type: 'line',
increment: true,
itemStyle: {
barBorderRadius: [3, 3, 0, 0],
color: [...item.color][zzIndex]
},
data: [],
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
})
})
})
}
onBeforeUnmount(() => {
echarts.disconnect('group')
})
defineExpose({
init
})
</script>
<style lang="scss" scoped>
.shutDown {
position: absolute;
right: 10px;
top: 10px;
}
.select {
position: absolute;
top: 10px;
display: flex;
align-items: center;
font-size: 14px;
}
</style>
<template>
<div class="pt50">
<el-button class="shutDown" icon="el-icon-Back" @click="emit('shutDown')">返回</el-button>
<div class="select">
<el-form :model="searchForm" id="history_select">
<el-form-item label="稳态指标">
<el-select
multiple
collapse-tags
collapse-tags-tooltip
v-model.trim="searchForm.index"
placeholder="请选择统计指标"
:multiple-limit="3"
value-key="id"
@change="change"
filterable
>
<el-option
v-for="(item, index) in indexOptions"
:label="item.name"
:key="index"
:value="item"
></el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<div v-loading="loading" id="trend">
<div :style="height" v-for="(item, index) in searchForm.index" :key="index">
<MyEchart ref="MyEchartRef" :options="item.echartsData" :isInterVal="true" @group="group"></MyEchart>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted, onBeforeUnmount } from 'vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { mainHeight } from '@/utils/layout'
import { timeFormat } from '@/utils/common'
import { useConfig } from '@/stores/config'
import { yMethod } from '@/utils/echartMethod'
import html2canvas from 'html2canvas'
import * as echarts from 'echarts' // 全引入
const config = useConfig()
const props = defineProps({
ptName: {
type: String
}
})
const loading = ref(true)
const emit = defineEmits(['shutDown'])
const searchForm: any = ref({ index: [] })
const timeList = ref([])
const MyEchartRef = ref()
const height = ref(mainHeight(150, 2))
//统计指标
const indexOptions: any = ref([
{
id: 0,
name: '电压总有效值(kV)',
children: [
{ name: 'vRmsA', phase: props.ptName == 'star' ? 'A相' : 'AB相', data: [] },
{ name: 'vRmsB', phase: props.ptName == 'star' ? 'B相' : 'BC相', data: [] },
{ name: 'vRmsC', phase: props.ptName == 'star' ? 'C相' : 'CA相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'kV',
data: []
},
{
id: 1,
name: '电流总有效值(A)',
children: [
{ name: 'iRmsA', phase: 'A相', data: [] },
{ name: 'iRmsB', phase: 'B相', data: [] },
{ name: 'iRmsC', phase: 'C相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'A',
data: []
},
{
id: 2,
name: '有功功率(kW)',
children:
props.ptName == 'star'
? [
{ name: 'pA', phase: 'A相', data: [] },
{ name: 'pB', phase: 'B相', data: [] },
{ name: 'pC', phase: 'C相', data: [] },
{ name: 'pTot', phase: '总', data: [] }
]
: [{ name: 'pTot', phase: '总', data: [] }],
color: props.ptName == 'star' ? ['#DAA520', '#2E8B57', '#A52a2a', '#000'] : ['#000'],
unit: 'kW',
data: []
},
{
id: 3,
name: '无功功率(kW)',
children:
props.ptName == 'star'
? [
{ name: 'qA', phase: 'A相', data: [] },
{ name: 'qB', phase: 'B相', data: [] },
{ name: 'qC', phase: 'C相', data: [] },
{ name: 'qTot', phase: '总', data: [] }
]
: [{ name: 'qTot', phase: '总', data: [] }],
color: props.ptName == 'star' ? ['#DAA520', '#2E8B57', '#A52a2a', '#000'] : ['#000'],
unit: 'kW',
data: []
},
{
id: 4,
name: '基波电压总有效值(kV)',
children: [
{ name: 'v1A', phase: props.ptName == 'star' ? 'A相' : 'AB相', data: [] },
{ name: 'v1B', phase: props.ptName == 'star' ? 'B相' : 'BC相', data: [] },
{ name: 'v1C', phase: props.ptName == 'star' ? 'C相' : 'CA相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'kV',
data: []
},
{
id: 5,
name: '基波电流总有效值(A)',
children: [
{ name: 'i1A', phase: 'A相', data: [] },
{ name: 'i1B', phase: 'B相', data: [] },
{ name: 'i1C', phase: 'C相', data: [] }
],
color: ['#DAA520', '#2E8B57', '#A52a2a'],
unit: 'A',
data: []
},
{
id: 6,
name: '频率(Hz)',
children: [
{ name: 'freq', phase: '频率', data: [] },
{ name: 'freqDev', phase: '频率偏差', data: [] }
],
color: [config.layout.elementUiPrimary[0], '#00BFF5'],
unit: 'Hz',
data: []
},
{
id: 7,
name: '电压不平衡度(%)',
children: [{ name: 'vUnbalance', phase: '电压不平衡度', data: [] }],
color: [config.layout.elementUiPrimary[0]],
unit: '%',
data: []
},
{
id: 8,
name: '电流不平衡度(%)',
children: [{ name: 'iUnbalance', phase: '电流不平衡度', data: [] }],
color: [config.layout.elementUiPrimary[0]],
unit: '%',
data: []
}
])
const group = (e: any) => {
e.group = 'group'
}
const change = () => {
height.value = mainHeight(150, searchForm.value.index.length)
// let name = searchForm.value.index.map(item => item.name)
// let list = indexOptions.value.filter(item => !name.includes(item.name))
loading.value = true
searchForm.value.index.forEach((item: any) => {
item.echartsData.xAxis.data = []
item.echartsData.series.forEach((child: any) => {
child.data = []
})
})
// console.log("🚀 ~ change ~ MyEchartRef.value[0]?.getChart():", MyEchartRef.value[0]?.getChart())
}
onMounted(() => {
setEcharts()
searchForm.value.index.push(...[indexOptions.value[0], indexOptions.value[1]])
})
const init = (row: any) => {
// timeList.value.push(timeFormat(row.TIME - 0))
searchForm.value.index.forEach((item: any, index: any) => {
// item.echartsData.xAxis.data.push(timeFormat(row.TIME - 0))
let time = timeFormat(row.TIME - 0)
switch (item.name) {
case '电压总有效值(kV)':
item.echartsData.series[0].data.push([
time,
Math.floor((props.ptName == 'star' ? row.V.A?.VRMS : row.V.A?.VRMS_LVR) * 100) / 100
])
item.echartsData.series[1].data.push([
time,
Math.floor((props.ptName == 'star' ? row.V.B?.VRMS : row.V.B?.VRMS_LVR) * 100) / 100
])
item.echartsData.series[2].data.push([
time,
Math.floor((props.ptName == 'star' ? row.V.C?.VRMS : row.V.C?.VRMS_LVR) * 100) / 100
])
break
case '电流总有效值(A)':
item.echartsData.series[0].data.push([time, Math.floor(row.I.A?.IRMS * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.I.B?.IRMS * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.I.C?.IRMS * 100) / 100])
break
case '有功功率(kW)':
if (props.ptName == 'star') {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.A?.P * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.PQ.B?.P * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.PQ.C?.P * 100) / 100])
item.echartsData.series[3].data.push([time, Math.floor(row.PQ.T?.P * 100) / 100])
} else {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.T?.P * 100) / 100])
}
break
case '无功功率(kW)':
if (props.ptName == 'star') {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.A?.Q * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.PQ.B?.Q * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.PQ.C?.Q * 100) / 100])
item.echartsData.series[3].data.push([time, Math.floor(row.PQ.T?.Q * 100) / 100])
} else {
item.echartsData.series[0].data.push([time, Math.floor(row.PQ.T?.Q * 100) / 100])
}
break
case '基波电压总有效值(kV)':
item.echartsData.series[0].data.push([time, Math.floor(row.V.A?.V1 * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.V.B?.V1 * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.V.C?.V1 * 100) / 100])
break
case '基波电流总有效值(A)':
item.echartsData.series[0].data.push([time, Math.floor(row.I.A?.I1 * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.I.B?.I1 * 100) / 100])
item.echartsData.series[2].data.push([time, Math.floor(row.I.C?.I1 * 100) / 100])
break
case '频率(Hz)':
item.echartsData.series[0].data.push([time, Math.floor(row.V.T?.FREQ * 100) / 100])
item.echartsData.series[1].data.push([time, Math.floor(row.V.T?.DELTA_FREQ * 100) / 100])
break
case '电压不平衡度(%)':
item.echartsData.series[0].data.push([time, Math.floor(row.V.T?.V_UNBAN * 100) / 100])
break
case '电流不平衡度(%)':
item.echartsData.series[0].data.push([time, Math.floor(row.I.T?.I_UNBAN * 100) / 100])
break
}
item.echartsData.series.forEach((item1: any) => {
if (item1.data.length > 60) {
item1.data.shift()
}
})
let [min, max] = yMethod([].concat(...item.echartsData.series.map(k => k.data).map(k1 => k1.map(k2 => k2[1]))))
item.echartsData.yAxis.min = min
item.echartsData.yAxis.max = max
})
MyEchartRef.value[0]?.setOptions(searchForm.value.index[0].echartsData)
MyEchartRef.value[1]?.setOptions(searchForm.value.index[1].echartsData)
MyEchartRef.value[2]?.setOptions(searchForm.value.index[2].echartsData)
if (loading.value) {
echarts.connect('group')
}
loading.value = false
}
const setEcharts = () => {
indexOptions.value.forEach((item: any, index: any) => {
item.echartsData = {
title: {
text: item.name
},
xAxis: {
name: '时间',
type: 'time',
axisLabel: {
interval: 0, // 强制显示所有标签
formatter: {
day: '{MM}-{dd}',
month: '{MM}',
year: '{yyyy}'
}
},
data: []
},
yAxis: {
// type: 'value',
name: item.unit,
splitNumber: 5,
minInterval: 1,
alignTicks: true // 强制对齐刻度
},
toolbox: {
right: 20,
top: 15,
show: index == 0 ? true : false,
feature: {
// 移除默认的 saveAsImage
// saveAsImage: { title: '保存图片' }
myCustomDownload: {
title: '', // 按钮标题
icon: 'path://M892.342857 463.238095l-73.142857-68.266666-258.438095 258.438095V29.257143h-97.52381v624.152381L204.8 394.971429 131.657143 463.238095l380.342857 380.342857zM107.27619 897.219048h804.571429v97.523809H107.27619z', // 自定义图标路径
onclick: function () {
html2canvas(document.getElementById('trend'), {
scale: 1
}).then(function (canvas) {
// 创建a标签，实现下载
let creatIMg = document.createElement('a')
creatIMg.download = '实时趋势.png' // 设置下载的文件名，
creatIMg.href = canvas.toDataURL() // 下载url
creatIMg.click()
creatIMg.remove() // 下载之后把创建的元素删除
})
}
}
}
},
tooltip: {
axisPointer: {
type: 'cross',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.55)',
borderWidth: 0,
formatter(params: any) {
const xname = params[0].value[0]
let str = `${xname}<br>`
params.forEach((el: any, index: any) => {
let marker = ''
// if (el.value[3] == 'dashed') {
// for (let i = 0; i < 3; i++) {
// marker += `<span style="display:inline-block;border: 2px ${el.color} solid;margin-right:5px;width:10px;height:0px;background-color:#ffffff00;"></span>`
// }
// } else {
// marker = `<span style="display:inline-block;border: 2px ${el.color} ${el.value[3]};margin-right:5px;width:40px;height:0px;background-color:#ffffff00;"></span>`
// }
str += `${el.marker} ${el.seriesName.split('(')[0]}：${
el.value[1] ? el.value[1] + ' ' + (el.value[2] || '') : '-'
}<br>`
})
return str
}
},
series: []
}
item.children.map((zz: any, zzIndex: any) => {
item.echartsData.series.push({
name: zz.phase,
type: 'line',
increment: true,
itemStyle: {
barBorderRadius: [3, 3, 0, 0],
color: [...item.color][zzIndex]
},
data: [],
smooth: true, // 这里设置平滑曲线
symbol: 'none' // 设置为 'none' 去掉折点小圆
})
})
})
}
onBeforeUnmount(() => {
echarts.disconnect('group')
})
defineExpose({
init
})
</script>
<style lang="scss" scoped>
.shutDown {
position: absolute;
right: 10px;
top: 10px;
}
.select {
position: absolute;
top: 10px;
display: flex;
align-items: center;
font-size: 14px;
}
</style>

2
src/views/pqs/harmonicMonitoring/monitoringPoint/online/statisticalReport/index.vue
View File

@@ -3,7 +3,7 @@
<TableHeader ref="TableHeaderRef" datePicker @selectChange="selectChange">
<template v-slot:select>
<el-form-item label="模板策略">
<el-select v-model="Template" @change="changetype" placeholder="请选择模版" value-key="id">
<el-select v-model="Template" @change="changetype" placeholder="请选择模版" value-key="id" filterable>
<el-option
v-for="item in templatePolicy"
:key="item.id"

6
src/views/pqs/harmonicMonitoring/monitoringPoint/online/wentaishujufenxi/index.vue
View File

@@ -30,7 +30,7 @@
</el-select>
</el-form-item>
<el-form-item label="数值类型:">
<el-select style="width: 100%" v-model="formData.valueType" placeholder="请选择类型">
<el-select style="width: 100%" v-model="formData.valueType" placeholder="请选择类型" filterable>
<el-option
v-for="item in typeOptions"
:key="item.value"
@@ -40,7 +40,7 @@
</el-select>
</el-form-item>
<el-form-item label="谐波次数:" v-show="showXieBoCiShu">
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波">
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波" filterable>
<el-option
v-for="item in harmonicOptions"
:key="item.value"
@@ -50,7 +50,7 @@
</el-select>
</el-form-item>
<el-form-item v-show="showJianXieBoCiShu" label="间谐波次数:">
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波">
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波" filterable>
<el-option
v-for="item in inharmonicOptions"
:key="item.value"

6
src/views/pqs/harmonicMonitoring/monitoringPoint/online/wentaishujufenxi/index1.vue
View File

@@ -17,19 +17,19 @@
</el-select>
</el-form-item>
<el-form-item label="数值类型:">
<el-select style="width: 100%" v-model="formData.valueType" placeholder="请选择类型">
<el-select style="width: 100%" v-model="formData.valueType" placeholder="请选择类型" filterable>
<el-option v-for="item in typeOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="谐波次数:" v-if="showXieBoCiShu">
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波">
<el-select style="width: 100%" v-model="formData.harmonic" placeholder="请选择谐波" filterable>
<el-option v-for="item in harmonicOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="showJianXieBoCiShu" label="间谐波次数:">
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波">
<el-select style="width: 100%" v-model="formData.inHarmonic" placeholder="请选择间谐波" filterable>
<el-option v-for="item in inharmonicOptions" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>

2
src/views/pqs/harmonicMonitoring/monitoringPoint/online/wentaizhibiaohegelv/index.vue
View File

@@ -6,7 +6,7 @@
<DatePicker ref="datePickerRef"></DatePicker>
</el-form-item>
<el-form-item label="对比">
<el-select v-model="searchType" clearable placeholder="可选择同比、环比">
<el-select v-model="searchType" clearable placeholder="可选择同比、环比" filterable>
<el-option
v-for="item in searchTypeOptions"
:key="item.value"

2
src/views/pqs/harmonicMonitoring/monitoringPoint/online/yunxingzhuangtai/index.vue
View File

@@ -6,7 +6,7 @@
<DatePicker ref="datePickerRef"></DatePicker>
</el-form-item>
<el-form-item label="对比">
<el-select v-model="searchType" clearable placeholder="可选择同比、环比">
<el-select v-model="searchType" clearable placeholder="可选择同比、环比" filterable>
<el-option v-for="item in searchTypeOptions" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>

1
src/views/pqs/harmonicMonitoring/reportForms/region/index.vue
View File

@@ -44,6 +44,7 @@
value-key="id"
placeholder="请选择电压等级"
style="width: 260px;"
filterable
>
<el-option
v-for="item in voltageleveloption"

2
src/views/pqs/harmonicMonitoring/reportForms/statistics/index.vue
View File

@@ -19,7 +19,7 @@
</el-radio-group>
</el-form-item>
<el-form-item label="模板策略">
<el-select v-model="Template" @change="changetype" placeholder="请选择模版" value-key="id">
<el-select v-model="Template" @change="changetype" placeholder="请选择模版" value-key="id" filterable>
<el-option
v-for="item in templatePolicy"
:key="item.id"

465
src/views/pqs/panorama/components/details/point.vue
View File

@@ -1,232 +1,233 @@
<template>
<!-- 监测点详情 -->
<el-dialog draggable title="监测点统计" v-model="dialogVisible" width="1400px" :before-close="handleClose">
<el-row style="height: 300px" :gutter="20">
<el-col :span="12">
<div class="title">
<span>趋势分析</span>
<!-- <el-select v-model="time" style="width: 80px; margin-right: 80px" @change="analysis">
<el-option label="年" value="1" />
<el-option label="月" value="3" />
</el-select> -->
<el-radio-group v-model="time" style="margin-right: 50px" @change="analysis" size="small">
<el-radio-button label="1">年</el-radio-button>
<el-radio-button label="3">月</el-radio-button>
</el-radio-group>
</div>
<MyEChart style="height: 260px" :options="trendEChart" />
</el-col>
<el-col :span="12">
<div class="title">
<span>分布统计</span>
<el-select
v-model="statisticalType"
value-key="id"
style="width: 120px; margin-right: 80px"
@change="statiStics"
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</div>
<div class="pie">
<MyEChart style="height: 260px" :options="picEChart" />
</div>
</el-col>
</el-row>
<div>
<div class="title">
<span>区域监测点统计</span>
</div>
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="325px" :data="tableData">
<vxe-column field="orgName" title="区域" :formatter="formatter" />
<vxe-column field="num" title="监测点个数" sortable :formatter="formatter" />
<vxe-column field="integrityRate" sortable title="完整率(%)" />
<vxe-column field="onLineRate" sortable title="在线率(%)" />
<vxe-column field="outOfStandardRate" sortable title="超标监测点占比(%)" />
</vxe-table>
</div>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import MyEChart from '@/components/echarts/MyEchart.vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { useDictData } from '@/stores/dictData'
import { getGridDiagramLineTendency, getGridDiagramLineData, getHalfReport } from '@/api/device-boot/panorama'
const dictData = useDictData()
const dialogVisible: any = ref(false)
const Voltage = dictData.getBasicData('Dev_Voltage_Stand')
const tableData: any = ref([])
const options = dictData.getBasicData('Statistical_Type', ['Report_Type', 'Power_Network'])
const time = ref('1')
const statisticalType = ref(options[0])
const loadTypeArr = dictData.getBasicData('Interference_Source')
const rowList: any = ref({})
const trendEChart: any = ref()
const picEChart = ref()
const open = async (row: any) => {
time.value = '1'
rowList.value = {
deviceInfoParam: {
...row
},
pageNum: 1,
pageSize: 1000,
...row
}
analysis(1)
// 统计
statiStics()
// 监测点列表
getGridDiagramLineData({
...rowList.value,
statisticalType: rowList.value.deviceInfoParam.statisticalType
}).then((res: any) => {
tableData.value = res.data
})
dialogVisible.value = true
}
// 分析
const analysis = (e: any) => {
let time = rowList.value.searchBeginTime.slice(0, 4) + `-01-01`
// 分析
getGridDiagramLineTendency({ ...rowList.value, searchBeginTime: time, type: e }).then(res => {
let name = []
let data = []
let num = 0
for (let k in res.data) {
name.push(k)
// num = num + res.data[k]
data.push(res.data[k])
}
trendEChart.value = {
title: {
text: '在线监测点总数量'
},
xAxis: {
name: '时间',
data: name
},
legend: {
show: false
},
yAxis: {
name: '个'
},
options: {
dataZoom: null,
series: [
{
name: '接入',
type: 'line',
data: data,
smooth: true,
label: {
show: true,
position: 'top',
fontSize: 12
}
}
]
}
}
})
}
// 统计
const statiStics = () => {
getGridDiagramLineData({ ...rowList.value, statisticalType: statisticalType.value }).then(res => {
picEChart.value = {
title: {
text: ''
},
xAxis: {
data: res.data.map((item: any) => item.orgName)
},
yAxis: {
name: '%',
min: 0,
max: 100
},
options: {
dataZoom: null,
series: [
{
name: '数据完整性',
type: 'bar',
data: res.data.map((item: any) => item.integrityRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
},
{
name: '在线率',
type: 'bar',
data: res.data.map((item: any) => item.onLineRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
},
{
name: '超标监测点占比',
type: 'bar',
data: res.data.map((item: any) => item.outOfStandardRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
}
]
}
}
})
}
const formatter = (row: any) => {
if (row.column.field == 'orgName') {
return row.cellValue.match(/[\u4e00-\u9fa5]+/g).join('')
} else if (row.column.field == 'num') {
return row.row.orgName.match(/\(([^]+)\)/)[1]
} else {
return row.cellValue
}
}
const handleClose = () => {
tableData.value = []
dialogVisible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-select) {
min-width: 80px;
}
.title {
display: flex;
justify-content: space-between;
margin: 10px;
span {
font-weight: 550;
font-size: 18px;
}
}
.pie {
display: flex;
justify-content: space-around;
}
:deep(.el-table thead) {
color: #000;
}
</style>
<template>
<!-- 监测点详情 -->
<el-dialog draggable title="监测点统计" v-model="dialogVisible" width="1400px" :before-close="handleClose">
<el-row style="height: 300px" :gutter="20">
<el-col :span="12">
<div class="title">
<span>趋势分析</span>
<!-- <el-select v-model="time" style="width: 80px; margin-right: 80px" @change="analysis">
<el-option label="年" value="1" />
<el-option label="月" value="3" />
</el-select> -->
<el-radio-group v-model="time" style="margin-right: 50px" @change="analysis" size="small">
<el-radio-button label="1">年</el-radio-button>
<el-radio-button label="3">月</el-radio-button>
</el-radio-group>
</div>
<MyEChart style="height: 260px" :options="trendEChart" />
</el-col>
<el-col :span="12">
<div class="title">
<span>分布统计</span>
<el-select
v-model="statisticalType"
value-key="id"
style="width: 120px; margin-right: 80px"
@change="statiStics"
filterable
>
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item" />
</el-select>
</div>
<div class="pie">
<MyEChart style="height: 260px" :options="picEChart" />
</div>
</el-col>
</el-row>
<div>
<div class="title">
<span>区域监测点统计</span>
</div>
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="325px" :data="tableData">
<vxe-column field="orgName" title="区域" :formatter="formatter" />
<vxe-column field="num" title="监测点个数" sortable :formatter="formatter" />
<vxe-column field="integrityRate" sortable title="完整率(%)" />
<vxe-column field="onLineRate" sortable title="在线率(%)" />
<vxe-column field="outOfStandardRate" sortable title="超标监测点占比(%)" />
</vxe-table>
</div>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import MyEChart from '@/components/echarts/MyEchart.vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import { useDictData } from '@/stores/dictData'
import { getGridDiagramLineTendency, getGridDiagramLineData, getHalfReport } from '@/api/device-boot/panorama'
const dictData = useDictData()
const dialogVisible: any = ref(false)
const Voltage = dictData.getBasicData('Dev_Voltage_Stand')
const tableData: any = ref([])
const options = dictData.getBasicData('Statistical_Type', ['Report_Type', 'Power_Network'])
const time = ref('1')
const statisticalType = ref(options[0])
const loadTypeArr = dictData.getBasicData('Interference_Source')
const rowList: any = ref({})
const trendEChart: any = ref()
const picEChart = ref()
const open = async (row: any) => {
time.value = '1'
rowList.value = {
deviceInfoParam: {
...row
},
pageNum: 1,
pageSize: 1000,
...row
}
analysis(1)
// 统计
statiStics()
// 监测点列表
getGridDiagramLineData({
...rowList.value,
statisticalType: rowList.value.deviceInfoParam.statisticalType
}).then((res: any) => {
tableData.value = res.data
})
dialogVisible.value = true
}
// 分析
const analysis = (e: any) => {
let time = rowList.value.searchBeginTime.slice(0, 4) + `-01-01`
// 分析
getGridDiagramLineTendency({ ...rowList.value, searchBeginTime: time, type: e }).then(res => {
let name = []
let data = []
let num = 0
for (let k in res.data) {
name.push(k)
// num = num + res.data[k]
data.push(res.data[k])
}
trendEChart.value = {
title: {
text: '在线监测点总数量'
},
xAxis: {
name: '时间',
data: name
},
legend: {
show: false
},
yAxis: {
name: '个'
},
options: {
dataZoom: null,
series: [
{
name: '接入',
type: 'line',
data: data,
smooth: true,
label: {
show: true,
position: 'top',
fontSize: 12
}
}
]
}
}
})
}
// 统计
const statiStics = () => {
getGridDiagramLineData({ ...rowList.value, statisticalType: statisticalType.value }).then(res => {
picEChart.value = {
title: {
text: ''
},
xAxis: {
data: res.data.map((item: any) => item.orgName)
},
yAxis: {
name: '%',
min: 0,
max: 100
},
options: {
dataZoom: null,
series: [
{
name: '数据完整性',
type: 'bar',
data: res.data.map((item: any) => item.integrityRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
},
{
name: '在线率',
type: 'bar',
data: res.data.map((item: any) => item.onLineRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
},
{
name: '超标监测点占比',
type: 'bar',
data: res.data.map((item: any) => item.outOfStandardRate),
label: {
show: true,
position: 'top',
fontSize: 12
}
}
]
}
}
})
}
const formatter = (row: any) => {
if (row.column.field == 'orgName') {
return row.cellValue.match(/[\u4e00-\u9fa5]+/g).join('')
} else if (row.column.field == 'num') {
return row.row.orgName.match(/\(([^]+)\)/)[1]
} else {
return row.cellValue
}
}
const handleClose = () => {
tableData.value = []
dialogVisible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-select) {
min-width: 80px;
}
.title {
display: flex;
justify-content: space-between;
margin: 10px;
span {
font-weight: 550;
font-size: 18px;
}
}
.pie {
display: flex;
justify-content: space-around;
}
:deep(.el-table thead) {
color: #000;
}
</style>

2
src/views/pqs/panorama/components/line/history.vue
View File

@@ -1,7 +1,7 @@
<template>
<DatePicker ref="datePickerRef" style="display: none" theCurrentTime />
<el-select class="conditions mr20" v-model="formData.conditions" placeholder="请选择指标" style="width: 200px"
@change="History">
@change="History" filterable>
<el-option-group v-for="group in indexOptions" :key="group.label" :label="group.label">
<el-option v-for="item in group.options" :key="item.value" :label="item.label"
:value="item.value"></el-option>

4
src/views/pqs/panorama/components/mapR.vue
View File

@@ -108,7 +108,7 @@
</span>
</div>
<el-select v-model="harmonicType" style="width: 120px" @change="harmonicChange" size="small">
<el-select v-model="harmonicType" style="width: 120px" @change="harmonicChange" size="small" filterable>
<el-option
v-for="item in options"
:key="item.value"
@@ -155,7 +155,7 @@
</div>
</div>
<el-select v-model="value" style="width: 120px" size="small" @change="transientChange">
<el-select v-model="value" style="width: 120px" size="small" @change="transientChange" filterable>
<el-option v-for="item in options1" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</div>

2
src/views/pqs/qualityInspeection/panorama/components/line/history.vue
View File

@@ -1,7 +1,7 @@
<template>
<DatePicker ref="datePickerRef" style="display: none" theCurrentTime />
<el-select class="conditions" v-model="formData.conditions" placeholder="请选择指标" style="width: 200px"
@change="History">
@change="History" filterable>
<el-option-group v-for="group in indexOptions" :key="group.label" :label="group.label">
<el-option v-for="item in group.options" :key="item.value" :label="item.label"
:value="item.value"></el-option>

4
src/views/pqs/qualityInspeection/panorama/components/mapR.vue
View File

@@ -86,7 +86,7 @@
</span>
</div>
<el-select v-model="harmonicType" style="width: 120px" @change="harmonicChange" size="small">
<el-select v-model="harmonicType" style="width: 120px" @change="harmonicChange" size="small" filterable>
<el-option
v-for="item in options"
:key="item.value"
@@ -133,7 +133,7 @@
</div>
</div>
<el-select v-model="value" style="width: 120px" size="small" @change="transientChange">
<el-select v-model="value" style="width: 120px" size="small" @change="transientChange" filterable>
<el-option v-for="item in options1" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</div>

4
src/views/pqs/runManage/alarmCleaning/components/alarm.vue
View File

@@ -18,7 +18,7 @@
</el-select>
</el-form-item> -->
<el-form-item label="运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态" filterable>
<el-option
v-for="item in runFlagList"
:key="item.id"
@@ -28,7 +28,7 @@
</el-select>
</el-form-item>
<el-form-item label="终端厂家">
<el-select v-model="tableStore.table.params.manufacturer" clearable placeholder="请选择终端厂家">
<el-select v-model="tableStore.table.params.manufacturer" clearable placeholder="请选择终端厂家" filterable>
<el-option
v-for="item in terminaloption"
:key="item.id"

2
src/views/pqs/runManage/alarmCleaning/components/alarmDetails.vue
View File

@@ -31,6 +31,7 @@
placeholder="请选择告警天数"
style="width: 180px"
@change="change"
filterable
>
<el-option
v-for="item in dateList"
@@ -47,6 +48,7 @@
clearable
placeholder="请选择指标"
style="width: 150px"
>
<el-option
v-for="item in targetList"

2
src/views/pqs/runManage/assessment/components/dictionary/components/cable/form.vue
View File

@@ -11,7 +11,7 @@
/>
</el-form-item>
<el-form-item label="线缆类型" prop="linetypeType">
<el-select v-model="form.linetypeType" placeholder="请选择线缆类型">
<el-select v-model="form.linetypeType" placeholder="请选择线缆类型" filterable>
<el-option label="架空线" value="01"></el-option>
<el-option label="电缆" value="02"></el-option>
</el-select>

4
src/views/pqs/runManage/assessment/components/dictionary/components/transformer/form.vue
View File

@@ -15,7 +15,7 @@
<el-input-number v-model.trim="form.transCapa" show-word-limit placeholder="请输入值"></el-input-number>
</el-form-item>
<el-form-item label="高压侧电压" prop="transhighScale">
<el-select v-model="form.transhighScale" placeholder="请选择高压侧电压">
<el-select v-model="form.transhighScale" placeholder="请选择高压侧电压" filterable>
<el-option
v-for="item in voltageLevelList"
:key="item.id"
@@ -25,7 +25,7 @@
</el-select>
</el-form-item>
<el-form-item label="低压侧电压" prop="translowScale">
<el-select v-model="form.translowScale" placeholder="请选择低压侧电压">
<el-select v-model="form.translowScale" placeholder="请选择低压侧电压" filterable>
<el-option
v-for="item in voltageLevelList"
:key="item.id"

23
src/views/pqs/runManage/assessment/components/uese/form.vue
View File

@@ -39,7 +39,7 @@
/>
</el-form-item>
<el-form-item label="用户电压等级" prop="userScale">
<el-select v-model="form.userScale" clearable placeholder="请选择电压等级">
<el-select v-model="form.userScale" clearable placeholder="请选择电压等级" filterable>
<el-option
v-for="item in voltageleveloption"
:key="item.id"
@@ -59,13 +59,13 @@
></el-input-number>
</el-form-item>
<el-form-item label="是否包含电容器" prop="withCapacitor">
<el-select v-model="form.withCapacitor" placeholder="请选择是否包含电容器" clearable>
<el-select v-model="form.withCapacitor" placeholder="请选择是否包含电容器" clearable filterable>
<el-option label="是" value="01" />
<el-option label="否" value="00" />
</el-select>
</el-form-item>
<el-form-item label="用户负荷类型" prop="isWindfarm">
<el-select v-model="form.isWindfarm" clearable placeholder="请选择用户负荷类型">
<el-select v-model="form.isWindfarm" clearable placeholder="请选择用户负荷类型" filterable>
<el-option label="风电场" value="01"></el-option>
<el-option label="光伏" value="02"></el-option>
<el-option label="其他" value="03"></el-option>
@@ -80,13 +80,13 @@
></el-input-number>
</el-form-item>
<el-form-item label="是否单相负荷" prop="singleLoad">
<el-select v-model="form.singleLoad" clearable placeholder="请选择是否单相负荷">
<el-select v-model="form.singleLoad" clearable placeholder="请选择是否单相负荷" filterable>
<el-option label="是" value="00"></el-option>
<el-option label="否" value="01"></el-option>
</el-select>
</el-form-item>
<el-form-item label="预测评估关联">
<el-select v-model="assessMentId" filterable clearable placeholder="请选择预测评估关联">
<el-select v-model="assessMentId" clearable placeholder="请选择预测评估关联" filterable>
<el-option
v-for="option in userList.filter(
item =>
@@ -113,10 +113,11 @@
<el-form-item label="接入变电站" prop="powerstationId">
<el-select
v-model="form.powerstationId"
filterable
clearable
@change="changePowerstation"
placeholder="请选择接入变电站"
filterable
>
<el-option
v-for="item in powerstationList"
@@ -127,7 +128,7 @@
</el-select>
</el-form-item>
<el-form-item label="变电站电压等级" prop="powerstationScale">
<el-select v-model="form.powerstationScale" disabled clearable placeholder="请选择变电站电压等级">
<el-select v-model="form.powerstationScale" disabled clearable placeholder="请选择变电站电压等级" filterable>
<el-option
v-for="item in voltageleveloption"
:key="item.id"
@@ -137,7 +138,7 @@
</el-select>
</el-form-item>
<el-form-item label="接入母线" prop="busId">
<el-select v-model="form.busId" clearable @change="changeBus" placeholder="请选择母线">
<el-select v-model="form.busId" clearable @change="changeBus" placeholder="请选择母线" filterable>
<el-option
v-for="item in busList"
:key="item.id"
@@ -147,7 +148,7 @@
</el-select>
</el-form-item>
<el-form-item label="母线电压等级" prop="busScale">
<el-select v-model="form.busScale" disabled clearable placeholder="请选择母线电压等级">
<el-select v-model="form.busScale" disabled clearable placeholder="请选择母线电压等级" filterable>
<el-option
v-for="item in voltageleveloption"
:key="item.id"
@@ -178,7 +179,7 @@
></el-input-number>
</el-form-item>
<el-form-item label="PCC点名称" prop="lineId">
<el-select v-model="form.lineId" clearable @change="LineChange" placeholder="请选择PCC点">
<el-select v-model="form.lineId" clearable @change="LineChange" placeholder="请选择PCC点" filterable>
<el-option
v-for="item in pccList"
:key="item.id"
@@ -189,7 +190,7 @@
</el-form-item>
<el-form-item label="导线类型" prop="linetypeId">
<el-select v-model="form.linetypeId" clearable placeholder="请选择导线类型">
<el-select v-model="form.linetypeId" clearable placeholder="请选择导线类型" filterable >
<el-option
v-for="item in linetypeList"
:key="item.linetypeId"

4
src/views/pqs/runManage/cleaning/components/abnormal.vue
View File

@@ -18,7 +18,7 @@
</el-select>
</el-form-item> -->
<el-form-item label="运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态" filterable>
<el-option
v-for="item in runFlagList"
:key="item.id"
@@ -28,7 +28,7 @@
</el-select>
</el-form-item>
<el-form-item label="终端厂家">
<el-select v-model="tableStore.table.params.manufacturer" clearable placeholder="请选择终端厂家">
<el-select v-model="tableStore.table.params.manufacturer" clearable placeholder="请选择终端厂家" filterable>
<el-option
v-for="item in terminaloption"
:key="item.id"

4
src/views/pqs/runManage/cleaning/components/anomalyDetails.vue
View File

@@ -34,6 +34,7 @@
placeholder="请选择异常天数"
style="width: 180px"
@change="change"
filterable
>
<el-option
v-for="item in dateList"
@@ -46,10 +47,11 @@
<el-form-item label="统计指标" v-if="numKey != 0">
<el-select
v-model="targetKey"
filterable
clearable
placeholder="请选择指标"
style="width: 150px"
filterable
>
<el-option
v-for="item in targetList"

220
src/views/pqs/runManage/runEvaluate/components/regionDetails.vue
View File

@@ -1,110 +1,110 @@
<template>
<el-dialog v-model="dialogVisible" title="区域终端运行评价详情" width="50%" draggable>
<el-form :inline="true" :model="formInline">
<el-form-item label="所在地市">
<el-select v-model="formInline.value" style="width: 240px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="运行状态">
<el-select v-model="formInline.value1" style="width: 240px">
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item style="position: absolute; right: 0">
<el-button type="primary" icon="el-icon-Search">查询</el-button>
</el-form-item>
</el-form>
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="500px" :data="tableData">
<vxe-column field="num" title="终端名称" />
<vxe-column field="num1" title="所在地市" />
<vxe-column field="num2" title="所属变电站" />
<vxe-column field="num3" title="终端型号" />
<vxe-column field="num4" title="完整率(%)" />
<vxe-column field="num4" title="在线率(%)" />
<vxe-column field="num4" title="合格率(%)" />
<vxe-column field="num5" title="运行状态">
<template #default="{ row }">
<el-tag v-if="row.num5 == 1" effect="dark" type="success">在运</el-tag>
<el-tag v-if="row.num5 == 2" effect="dark" type="error">停运</el-tag>
</template>
</vxe-column>
</vxe-table>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const dialogVisible = ref(false)
const radio1 = ref('1')
const tableData = ref([
{
num: '测试终端1',
num1: '张家口',
num2: '测试变电站1',
num3: 'npqs_571_1',
num4: '100',
num5: 1
},
{
num: '测试终端2',
num1: '张家口',
num2: '测试变电站2',
num3: 'npqs_571_2',
num4: '100',
num5: 1
},
{
num: '测试终端3',
num1: '张家口',
num2: '测试变电站3',
num3: 'npqs_571_3',
num4: '100',
num5: 1
}
])
const formInline = reactive({
value: '',
value1: '',
})
const options = [
{
value: '1',
label: '张家口'
},
{
value: '2',
label: '承德'
},
{
value: '3',
label: '唐山'
},
{
value: '4',
label: '秦皇岛'
},
{
value: '5',
label: '廊坊'
}
]
const options1 = [
{
value: '1',
label: '在运'
},
{
value: '2',
label: '停运'
},
]
const open = () => {
dialogVisible.value = true
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>
<template>
<el-dialog v-model="dialogVisible" title="区域终端运行评价详情" width="50%" draggable>
<el-form :inline="true" :model="formInline">
<el-form-item label="所在地市">
<el-select v-model="formInline.value" style="width: 240px" filterable>
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="运行状态">
<el-select v-model="formInline.value1" style="width: 240px" filterable>
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
<el-form-item style="position: absolute; right: 0">
<el-button type="primary" icon="el-icon-Search">查询</el-button>
</el-form-item>
</el-form>
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="500px" :data="tableData">
<vxe-column field="num" title="终端名称" />
<vxe-column field="num1" title="所在地市" />
<vxe-column field="num2" title="所属变电站" />
<vxe-column field="num3" title="终端型号" />
<vxe-column field="num4" title="完整率(%)" />
<vxe-column field="num4" title="在线率(%)" />
<vxe-column field="num4" title="合格率(%)" />
<vxe-column field="num5" title="运行状态">
<template #default="{ row }">
<el-tag v-if="row.num5 == 1" effect="dark" type="success">在运</el-tag>
<el-tag v-if="row.num5 == 2" effect="dark" type="error">停运</el-tag>
</template>
</vxe-column>
</vxe-table>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const dialogVisible = ref(false)
const radio1 = ref('1')
const tableData = ref([
{
num: '测试终端1',
num1: '张家口',
num2: '测试变电站1',
num3: 'npqs_571_1',
num4: '100',
num5: 1
},
{
num: '测试终端2',
num1: '张家口',
num2: '测试变电站2',
num3: 'npqs_571_2',
num4: '100',
num5: 1
},
{
num: '测试终端3',
num1: '张家口',
num2: '测试变电站3',
num3: 'npqs_571_3',
num4: '100',
num5: 1
}
])
const formInline = reactive({
value: '',
value1: '',
})
const options = [
{
value: '1',
label: '张家口'
},
{
value: '2',
label: '承德'
},
{
value: '3',
label: '唐山'
},
{
value: '4',
label: '秦皇岛'
},
{
value: '5',
label: '廊坊'
}
]
const options1 = [
{
value: '1',
label: '在运'
},
{
value: '2',
label: '停运'
},
]
const open = () => {
dialogVisible.value = true
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>

1
src/views/pqs/runManage/runEvaluate/index.vue
View File

@@ -8,6 +8,7 @@
clearable
style="width: 100%"
placeholder="请选择电网标识"
filterable
>
<el-option
v-for="item in powerFlagList"

2
src/views/pqs/runManage/runEvaluate/index_JB.vue
View File

@@ -3,7 +3,7 @@
<TableHeader date-picker ref="TableHeaderRef">
<template v-slot:select>
<el-form-item label="运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态">
<el-select v-model="tableStore.table.params.lineRunFlag" clearable placeholder="请选择运行状态" filterable>
<el-option v-for="item in runFlagList" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>

1066
src/views/pqs/supervise/electricalEnergy/components/NewlyAdd.vue
View File

File diff suppressed because it is too large Load Diff

8
src/views/pqs/supervise/electricalEnergy/components/audit.vue
View File

@@ -3,17 +3,17 @@
<TableHeader area datePicker ref="TableHeaderRef" showCustomColumn>
<template #select>
<el-form-item label="问题来源">
<el-select v-model="tableStore.table.params.problemSources" clearable placeholder="请选择问题来源">
<el-select v-model="tableStore.table.params.problemSources" clearable placeholder="请选择问题来源" filterable>
<el-option
v-for="item in problemData"
:key="item.code"
v-for="item in problemData"
:key="item.code"
:label="item.name"
:value="item.code"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="填报进度">
<el-select v-model="tableStore.table.params.reportProcess" clearable placeholder="请选择填报进度">
<el-select v-model="tableStore.table.params.reportProcess" clearable placeholder="请选择填报进度" filterable>
<el-option
v-for="item in fillingProgress"
:key="item.id"

448
src/views/pqs/supervise/electricalEnergy/components/detail.vue
View File

@@ -1,224 +1,224 @@
<template>
<el-dialog draggable title="详情" v-model="dialogVisible" width="1400px" :before-close="handleClose">
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="指标" name="1">
<el-divider content-position="left" style="font-size: 18px">问题基本信息</el-divider>
<el-form :model="addData" :inline="true" disabled label-width="100px">
<el-form-item label="所属单位:">
<el-input v-model="addData.orgName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="问题名称:">
<el-input v-model="addData.problemName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="问题编号:">
<el-input v-model="addData.powerQualityProblemNo" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="问题来源:">
<el-select v-model="addData.problemSources">
<el-option
v-for="item in problemData"
:key="item.code"
:label="item.name"
:value="item.code"
></el-option>
</el-select>
</el-form-item>
</el-form>
<!-- 在线监测超标问题 -->
<el-form :inline="true" label-width="100px" disabled v-if="problemSources == '在线监测告警'">
<el-form-item label="变电站:">
<el-input v-model="addData.sustationName"></el-input>
</el-form-item>
<el-form-item label="母线:">
<el-input v-model="addData.barName"></el-input>
</el-form-item>
<el-form-item label="监测点名称:">
<el-input v-model="addData.measurementPointName"></el-input>
</el-form-item>
<el-form-item label="监测点编号:">
<el-input v-model="addData.measurementPointId"></el-input>
</el-form-item>
<el-form-item label="监测对象类型:">
<el-input v-model="addData.loadType"></el-input>
</el-form-item>
<el-form-item label="监测对象:">
<el-input v-model="addData.objName"></el-input>
</el-form-item>
<el-form-item label="电压等级:">
<el-input v-model="addData.voltageLevel"></el-input>
</el-form-item>
</el-form>
<!-- 普测超标 -->
<el-form :inline="true" label-width="100px" disabled v-if="problemSources == '普测超标'">
<el-form-item label="普测计划名称:">
<el-input v-model="addData.planName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="所属变电站:">
<el-input v-model="addData.substationName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="母线名称:">
<el-input v-model="addData.busBarName" placeholder="请填写"></el-input>
</el-form-item>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">
问题指标
</el-divider>
<el-form-item label="稳态指标:">
<el-checkbox-group v-model="addData.steadyIndicator">
<el-checkbox v-for="(item, ind) in steadyIndicatorList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="暂态指标:">
<el-checkbox-group v-model="addData.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<!-- 用户投诉 -->
<el-form :inline="true" label-width="100px" disabled v-if="problemSources == '用户投诉'">
<el-form-item label="用户投诉名称:">
<el-input v-model="addData.userName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="投诉用户编号:">
<el-input v-model="addData.userNo" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="投诉时间:">
<el-input v-model="addData.complaintTime" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="投诉内容:">
<el-input
type="textarea"
:autosize="{ minRows: 2, maxRows: 4 }"
style="width: 400px"
placeholder="请输入内容"
v-model="addData.complaintContent"
></el-input>
</el-form-item>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">
问题指标
</el-divider>
<el-form-item label="稳态指标:">
<el-checkbox-group v-model="addData.steadyIndicator">
<el-checkbox v-for="(item, ind) in steadyIndicatorList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="暂态指标:">
<el-checkbox-group v-model="addData.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<!-- 终端异常 -->
<el-form :inline="true" label-width="auto" disabled v-if="problemSources == '终端异常'">
<el-form-item label="异常终端名称:">
<el-input v-model="addData.abnormalDevName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="发现异常时间:">
<el-input v-model="addData.abnormalDevTime" placeholder="请填写"></el-input>
</el-form-item>
<br />
<el-form-item label="终端异常描述:">
<el-input
type="textarea"
style="width: 400px"
:autosize="{ minRows: 2, maxRows: 4 }"
v-model="addData.eventDescription"
></el-input>
</el-form-item>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">
问题指标
</el-divider>
<el-form-item label="稳态指标:">
<el-checkbox-group v-model="addData.steadyIndicator">
<el-checkbox v-for="(item, ind) in steadyIndicatorList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="暂态指标:">
<el-checkbox-group v-model="addData.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="流程" name="2">
<Filling v-if="dialogVisible" :isDisabled="true" :audit="true" ref="FillingRef" />
</el-tab-pane>
</el-tabs>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import {
getAbnormalDetail,
getComplaintDetail,
getGeneralSurveyDetail,
getExcessiveDetail
} from '@/api/process-boot/electricitymanagement'
import { useDictData } from '@/stores/dictData'
import Filling from './filling.vue'
const dictData = useDictData()
const addData: any = ref({})
const FillingRef = ref()
const activeName = ref(`1`)
const dialogVisible: any = ref(false)
const problemSources = ref('')
const problemData = dictData.getBasicData('Problem_Sources')
const steadyIndicatorList = dictData.getBasicData('Steady_Indicator')
const transientIndicatorsList = dictData.getBasicData('Transient_Indicators')
const open = async (row: any) => {
dialogVisible.value = true
let res: any = {}
problemSources.value = row.problemSources
if (row.problemSources == '终端异常') {
res = await getAbnormalDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '在线监测告警') {
res = await getExcessiveDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '用户投诉') {
res = await getComplaintDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '普测超标') {
res = await getGeneralSurveyDetail(row.powerQualityProblemNo)
}
setTimeout(() => {
addData.value = res.data
FillingRef.value.open(row)
}, 0)
}
// 取消
const handleClose = () => {
dialogVisible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-tabs__content) {
height: 100% !important;
}
</style>
<template>
<el-dialog draggable title="详情" v-model="dialogVisible" width="1400px" :before-close="handleClose">
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="指标" name="1">
<el-divider content-position="left" style="font-size: 18px">问题基本信息</el-divider>
<el-form :model="addData" :inline="true" disabled label-width="100px">
<el-form-item label="所属单位:">
<el-input v-model="addData.orgName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="问题名称:">
<el-input v-model="addData.problemName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="问题编号:">
<el-input v-model="addData.powerQualityProblemNo" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="问题来源:">
<el-select v-model="addData.problemSources" filterable>
<el-option
v-for="item in problemData"
:key="item.code"
:label="item.name"
:value="item.code"
></el-option>
</el-select>
</el-form-item>
</el-form>
<!-- 在线监测超标问题 -->
<el-form :inline="true" label-width="100px" disabled v-if="problemSources == '在线监测告警'">
<el-form-item label="变电站:">
<el-input v-model="addData.sustationName"></el-input>
</el-form-item>
<el-form-item label="母线:">
<el-input v-model="addData.barName"></el-input>
</el-form-item>
<el-form-item label="监测点名称:">
<el-input v-model="addData.measurementPointName"></el-input>
</el-form-item>
<el-form-item label="监测点编号:">
<el-input v-model="addData.measurementPointId"></el-input>
</el-form-item>
<el-form-item label="监测对象类型:">
<el-input v-model="addData.loadType"></el-input>
</el-form-item>
<el-form-item label="监测对象:">
<el-input v-model="addData.objName"></el-input>
</el-form-item>
<el-form-item label="电压等级:">
<el-input v-model="addData.voltageLevel"></el-input>
</el-form-item>
</el-form>
<!-- 普测超标 -->
<el-form :inline="true" label-width="100px" disabled v-if="problemSources == '普测超标'">
<el-form-item label="普测计划名称:">
<el-input v-model="addData.planName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="所属变电站:">
<el-input v-model="addData.substationName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="母线名称:">
<el-input v-model="addData.busBarName" placeholder="请填写"></el-input>
</el-form-item>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">
问题指标
</el-divider>
<el-form-item label="稳态指标:">
<el-checkbox-group v-model="addData.steadyIndicator">
<el-checkbox v-for="(item, ind) in steadyIndicatorList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="暂态指标:">
<el-checkbox-group v-model="addData.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<!-- 用户投诉 -->
<el-form :inline="true" label-width="100px" disabled v-if="problemSources == '用户投诉'">
<el-form-item label="用户投诉名称:">
<el-input v-model="addData.userName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="投诉用户编号:">
<el-input v-model="addData.userNo" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="投诉时间:">
<el-input v-model="addData.complaintTime" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="投诉内容:">
<el-input
type="textarea"
:autosize="{ minRows: 2, maxRows: 4 }"
style="width: 400px"
placeholder="请输入内容"
v-model="addData.complaintContent"
></el-input>
</el-form-item>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">
问题指标
</el-divider>
<el-form-item label="稳态指标:">
<el-checkbox-group v-model="addData.steadyIndicator">
<el-checkbox v-for="(item, ind) in steadyIndicatorList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="暂态指标:">
<el-checkbox-group v-model="addData.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<!-- 终端异常 -->
<el-form :inline="true" label-width="auto" disabled v-if="problemSources == '终端异常'">
<el-form-item label="异常终端名称:">
<el-input v-model="addData.abnormalDevName" placeholder="请填写"></el-input>
</el-form-item>
<el-form-item label="发现异常时间:">
<el-input v-model="addData.abnormalDevTime" placeholder="请填写"></el-input>
</el-form-item>
<br />
<el-form-item label="终端异常描述:">
<el-input
type="textarea"
style="width: 400px"
:autosize="{ minRows: 2, maxRows: 4 }"
v-model="addData.eventDescription"
></el-input>
</el-form-item>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">
问题指标
</el-divider>
<el-form-item label="稳态指标:">
<el-checkbox-group v-model="addData.steadyIndicator">
<el-checkbox v-for="(item, ind) in steadyIndicatorList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="暂态指标:">
<el-checkbox-group v-model="addData.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="流程" name="2">
<Filling v-if="dialogVisible" :isDisabled="true" :audit="true" ref="FillingRef" />
</el-tab-pane>
</el-tabs>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import {
getAbnormalDetail,
getComplaintDetail,
getGeneralSurveyDetail,
getExcessiveDetail
} from '@/api/process-boot/electricitymanagement'
import { useDictData } from '@/stores/dictData'
import Filling from './filling.vue'
const dictData = useDictData()
const addData: any = ref({})
const FillingRef = ref()
const activeName = ref(`1`)
const dialogVisible: any = ref(false)
const problemSources = ref('')
const problemData = dictData.getBasicData('Problem_Sources')
const steadyIndicatorList = dictData.getBasicData('Steady_Indicator')
const transientIndicatorsList = dictData.getBasicData('Transient_Indicators')
const open = async (row: any) => {
dialogVisible.value = true
let res: any = {}
problemSources.value = row.problemSources
if (row.problemSources == '终端异常') {
res = await getAbnormalDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '在线监测告警') {
res = await getExcessiveDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '用户投诉') {
res = await getComplaintDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '普测超标') {
res = await getGeneralSurveyDetail(row.powerQualityProblemNo)
}
setTimeout(() => {
addData.value = res.data
FillingRef.value.open(row)
}, 0)
}
// 取消
const handleClose = () => {
dialogVisible.value = false
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-tabs__content) {
height: 100% !important;
}
</style>

588
src/views/pqs/supervise/electricalEnergy/components/filling.vue
View File

@@ -1,294 +1,294 @@
<template>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">问题基本信息</el-divider>
<el-form :inline="true" label-width="auto">
<el-form-item label="所属单位:">
<el-input v-model="addData.orgName" clearable placeholder="请填写" disabled></el-input>
</el-form-item>
<el-form-item label="问题来源:">
<el-select disabled v-model="addData.problemSources" placeholder="请选择">
<el-option
v-for="item in problemData"
:key="item.code"
:label="item.name"
:value="item.code"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="问题名称:">
<el-input v-model="addData.problemName" clearable placeholder="请填写" disabled></el-input>
</el-form-item>
<el-form-item label="问题编号:">
<el-input v-model="addData.powerQualityProblemNo" disabled clearable placeholder="请填写"></el-input>
</el-form-item>
</el-form>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">填报流程</el-divider>
<el-tabs v-model="activeName" type="border-card">
<el-tab-pane label="原因分析" name="0">
<process1
:addData="addData"
:List="List"
:disabled="disabled"
ref="process0Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
<el-tab-pane label="计划整改措施" name="1">
<process2
:addData="addData"
:List="List"
:disabled="disabled"
ref="process1Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
<el-tab-pane label="实际采取措施" name="2">
<process3
:addData="addData"
:List="List"
:disabled="disabled"
ref="process2Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
<el-tab-pane label="成效分析" name="3">
<process4
:addData="addData"
:List="List"
:disabled="disabled"
ref="process3Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
</el-tabs>
<!-- 原因分析 0 -->
<!-- <process1
v-if="control == 0"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process0Ref"
@handleClose="handleClose"
/> -->
<!-- 计划整改措施 1-->
<!-- <process2
v-if="control == 1"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process1Ref"
@handleClose="handleClose"
/> -->
<!-- 实际采取措施 2 -->
<!-- <process3
v-if="control == 2"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process2Ref"
@handleClose="handleClose"
/> -->
<!-- 成效分析 3 -->
<!-- <process4
v-if="control == 3"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process3Ref"
@handleClose="handleClose"
/> -->
<!-- 填报 -->
<div style="display: flex; justify-content: center; margin-top: 10px" v-show="!disabled">
<el-button type="primary" @click="Submit">提交审核</el-button>
<el-button @click="handleClose">取消</el-button>
</div>
<!-- 审核 -->
<el-form
label-width="100px"
:model="form"
ref="ruleFormRef"
:rules="rules"
v-if="disabled && audit && flag && control == active"
>
<el-form-item prop="checkComment" label="审核意见:">
<el-input
type="textarea"
style="width: 400px"
:autosize="{ minRows: 2, maxRows: 4 }"
placeholder="请输入内容"
v-model="form.checkComment"
></el-input>
</el-form-item>
</el-form>
<div
style="display: flex; justify-content: center; margin-top: 10px"
v-if="disabled && audit && flag && control == active"
>
<el-button type="primary" @click="adopt(1)">通过</el-button>
<el-button type="primary" @click="adopt(0)">不通过</el-button>
<el-button @click="handleClose">取消</el-button>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useDictData } from '@/stores/dictData'
import process1 from './process1.vue'
import process2 from './process2.vue'
import process3 from './process3.vue'
import process4 from './process4.vue'
import { ElMessage } from 'element-plus'
import {
getAbnormalDetail,
getComplaintDetail,
getGeneralSurveyDetail,
getExcessiveDetail,
checkPowerQuality
} from '@/api/process-boot/electricitymanagement'
const emit = defineEmits(['beforeClose'])
const dictData = useDictData()
const addData: any = ref({})
const List: any = ref({})
const active = ref(4)
const control = ref()
const ruleFormRef = ref()
const activeName = ref('0')
const process0Ref = ref()
const process1Ref = ref()
const process2Ref = ref()
const process3Ref = ref()
const form = ref({
checkComment: ''
})
const disabled = ref(false)
const prop = defineProps({
isDisabled: {
type: Boolean,
default: false
},
audit: {
type: Boolean,
default: false
},
flag: {
type: Boolean,
default: false
}
})
const problemData = dictData.getBasicData('Problem_Sources')
const open = async (row: any) => {
addData.value = row
let res: any = {}
if (row.problemSources == '终端异常') {
res = await getAbnormalDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '在线监测告警') {
res = await getExcessiveDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '用户投诉') {
res = await getComplaintDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '普测超标') {
res = await getGeneralSurveyDetail(row.powerQualityProblemNo)
}
setTimeout(() => {
List.value = res.data
if (res.data.filePathYyfx == null) {
active.value = 0
} else if (res.data.filePathJhzg == null) {
active.value = 1
if (row.reportProcessStatus == 'Fail') {
active.value = 0
}
} else if (res.data.filePathSjcq == null) {
active.value = 2
if (row.reportProcessStatus == 'Fail') {
active.value = 1
}
} else if (res.data.filePathZlxg == null) {
active.value = 3
if (row.reportProcessStatus == 'Fail') {
active.value = 2
}
}
// 审核判断
if (prop.audit) {
active.value == 0 ? 0 : (active.value = active.value - 1)
}
control.value = active.value == 4 ? 3 : active.value
}, 0)
}
const rules = {
checkComment: [{ required: true, message: '请输入审核意见', trigger: 'blur' }]
}
const step = (e: number) => {
if (active.value >= e) {
control.value = e
if (active.value == e && !prop.isDisabled) {
disabled.value = false
} else {
disabled.value = true
}
}
}
onMounted(() => {
if (prop.isDisabled) {
disabled.value = prop.isDisabled
}
})
// 提交
const Submit = () => {
if (control.value == 0) {
process0Ref.value.submit(0)
} else if (control.value == 1) {
process1Ref.value.submit(1)
} else if (control.value == 2) {
process2Ref.value.submit(2)
} else if (control.value == 3) {
process3Ref.value.submit(3)
}
}
// 取消
const handleClose = () => {
form.value.checkComment = ''
emit('beforeClose')
}
// 审核
const adopt = (type: number) => {
ruleFormRef.value.validate((valid: any) => {
if (valid) {
const adminInfo = window.localStorage.getItem('adminInfo')
const adminName = adminInfo ? JSON.parse(adminInfo).name : ''
checkPowerQuality({
checkComment: form.value.checkComment,
checkPerson: adminName,
checkResult: type,
powerQualityProblemNo: addData.value.powerQualityProblemNo,
reportProcess: addData.value.reportProcess
}).then((res: any) => {
ElMessage.success(res.message)
handleClose()
})
}
})
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
width: 400px;
}
:deep(.el-tabs__content) {
height: auto !important;
}
</style>
<template>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">问题基本信息</el-divider>
<el-form :inline="true" label-width="auto">
<el-form-item label="所属单位:">
<el-input v-model="addData.orgName" clearable placeholder="请填写" disabled></el-input>
</el-form-item>
<el-form-item label="问题来源:">
<el-select disabled v-model="addData.problemSources" placeholder="请选择" filterable>
<el-option
v-for="item in problemData"
:key="item.code"
:label="item.name"
:value="item.code"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="问题名称:">
<el-input v-model="addData.problemName" clearable placeholder="请填写" disabled></el-input>
</el-form-item>
<el-form-item label="问题编号:">
<el-input v-model="addData.powerQualityProblemNo" disabled clearable placeholder="请填写"></el-input>
</el-form-item>
</el-form>
<el-divider content-position="left" style="font-size: 18px; font-weight: bolder">填报流程</el-divider>
<el-tabs v-model="activeName" type="border-card">
<el-tab-pane label="原因分析" name="0">
<process1
:addData="addData"
:List="List"
:disabled="disabled"
ref="process0Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
<el-tab-pane label="计划整改措施" name="1">
<process2
:addData="addData"
:List="List"
:disabled="disabled"
ref="process1Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
<el-tab-pane label="实际采取措施" name="2">
<process3
:addData="addData"
:List="List"
:disabled="disabled"
ref="process2Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
<el-tab-pane label="成效分析" name="3">
<process4
:addData="addData"
:List="List"
:disabled="disabled"
ref="process3Ref"
@handleClose="handleClose"
/>
</el-tab-pane>
</el-tabs>
<!-- 原因分析 0 -->
<!-- <process1
v-if="control == 0"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process0Ref"
@handleClose="handleClose"
/> -->
<!-- 计划整改措施 1-->
<!-- <process2
v-if="control == 1"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process1Ref"
@handleClose="handleClose"
/> -->
<!-- 实际采取措施 2 -->
<!-- <process3
v-if="control == 2"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process2Ref"
@handleClose="handleClose"
/> -->
<!-- 成效分析 3 -->
<!-- <process4
v-if="control == 3"
:addData="addData"
:List="List"
:disabled="disabled"
ref="process3Ref"
@handleClose="handleClose"
/> -->
<!-- 填报 -->
<div style="display: flex; justify-content: center; margin-top: 10px" v-show="!disabled">
<el-button type="primary" @click="Submit">提交审核</el-button>
<el-button @click="handleClose">取消</el-button>
</div>
<!-- 审核 -->
<el-form
label-width="100px"
:model="form"
ref="ruleFormRef"
:rules="rules"
v-if="disabled && audit && flag && control == active"
>
<el-form-item prop="checkComment" label="审核意见:">
<el-input
type="textarea"
style="width: 400px"
:autosize="{ minRows: 2, maxRows: 4 }"
placeholder="请输入内容"
v-model="form.checkComment"
></el-input>
</el-form-item>
</el-form>
<div
style="display: flex; justify-content: center; margin-top: 10px"
v-if="disabled && audit && flag && control == active"
>
<el-button type="primary" @click="adopt(1)">通过</el-button>
<el-button type="primary" @click="adopt(0)">不通过</el-button>
<el-button @click="handleClose">取消</el-button>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useDictData } from '@/stores/dictData'
import process1 from './process1.vue'
import process2 from './process2.vue'
import process3 from './process3.vue'
import process4 from './process4.vue'
import { ElMessage } from 'element-plus'
import {
getAbnormalDetail,
getComplaintDetail,
getGeneralSurveyDetail,
getExcessiveDetail,
checkPowerQuality
} from '@/api/process-boot/electricitymanagement'
const emit = defineEmits(['beforeClose'])
const dictData = useDictData()
const addData: any = ref({})
const List: any = ref({})
const active = ref(4)
const control = ref()
const ruleFormRef = ref()
const activeName = ref('0')
const process0Ref = ref()
const process1Ref = ref()
const process2Ref = ref()
const process3Ref = ref()
const form = ref({
checkComment: ''
})
const disabled = ref(false)
const prop = defineProps({
isDisabled: {
type: Boolean,
default: false
},
audit: {
type: Boolean,
default: false
},
flag: {
type: Boolean,
default: false
}
})
const problemData = dictData.getBasicData('Problem_Sources')
const open = async (row: any) => {
addData.value = row
let res: any = {}
if (row.problemSources == '终端异常') {
res = await getAbnormalDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '在线监测告警') {
res = await getExcessiveDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '用户投诉') {
res = await getComplaintDetail(row.powerQualityProblemNo)
} else if (row.problemSources == '普测超标') {
res = await getGeneralSurveyDetail(row.powerQualityProblemNo)
}
setTimeout(() => {
List.value = res.data
if (res.data.filePathYyfx == null) {
active.value = 0
} else if (res.data.filePathJhzg == null) {
active.value = 1
if (row.reportProcessStatus == 'Fail') {
active.value = 0
}
} else if (res.data.filePathSjcq == null) {
active.value = 2
if (row.reportProcessStatus == 'Fail') {
active.value = 1
}
} else if (res.data.filePathZlxg == null) {
active.value = 3
if (row.reportProcessStatus == 'Fail') {
active.value = 2
}
}
// 审核判断
if (prop.audit) {
active.value == 0 ? 0 : (active.value = active.value - 1)
}
control.value = active.value == 4 ? 3 : active.value
}, 0)
}
const rules = {
checkComment: [{ required: true, message: '请输入审核意见', trigger: 'blur' }]
}
const step = (e: number) => {
if (active.value >= e) {
control.value = e
if (active.value == e && !prop.isDisabled) {
disabled.value = false
} else {
disabled.value = true
}
}
}
onMounted(() => {
if (prop.isDisabled) {
disabled.value = prop.isDisabled
}
})
// 提交
const Submit = () => {
if (control.value == 0) {
process0Ref.value.submit(0)
} else if (control.value == 1) {
process1Ref.value.submit(1)
} else if (control.value == 2) {
process2Ref.value.submit(2)
} else if (control.value == 3) {
process3Ref.value.submit(3)
}
}
// 取消
const handleClose = () => {
form.value.checkComment = ''
emit('beforeClose')
}
// 审核
const adopt = (type: number) => {
ruleFormRef.value.validate((valid: any) => {
if (valid) {
const adminInfo = window.localStorage.getItem('adminInfo')
const adminName = adminInfo ? JSON.parse(adminInfo).name : ''
checkPowerQuality({
checkComment: form.value.checkComment,
checkPerson: adminName,
checkResult: type,
powerQualityProblemNo: addData.value.powerQualityProblemNo,
reportProcess: addData.value.reportProcess
}).then((res: any) => {
ElMessage.success(res.message)
handleClose()
})
}
})
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
width: 400px;
}
:deep(.el-tabs__content) {
height: auto !important;
}
</style>

6
src/views/pqs/supervise/electricalEnergy/components/maintenance.vue
View File

@@ -2,7 +2,7 @@
<TableHeader area datePicker ref="TableHeaderRef" showCustomColumn>
<template #select>
<el-form-item label="问题来源" >
<el-select v-model="tableStore.table.params.problemSources" clearable placeholder="请选择问题来源">
<el-select v-model="tableStore.table.params.problemSources" clearable placeholder="请选择问题来源" filterable>
<el-option
v-for="item in problemData"
:key="item.code"
@@ -12,7 +12,7 @@
</el-select>
</el-form-item>
<el-form-item label="填报进度">
<el-select v-model="tableStore.table.params.reportProcess" clearable placeholder="请选择填报进度">
<el-select v-model="tableStore.table.params.reportProcess" clearable placeholder="请选择填报进度" filterable>
<el-option
v-for="item in fillingProgress"
:key="item.code"
@@ -22,7 +22,7 @@
</el-select>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="tableStore.table.params.reportProcessStatus" clearable placeholder="请选择状态">
<el-select v-model="tableStore.table.params.reportProcessStatus" clearable placeholder="请选择状态" filterable>
<el-option
v-for="item in auditStatus"
:key="item.code"

2
src/views/pqs/supervise/electricalEnergy/components1/complaints.vue
View File

@@ -5,7 +5,7 @@
<TableHeader area nextFlag theCurrentTime showTimeAll ref="TableHeaderRef" showExport showCustomColumn>
<template v-slot:select>
<el-form-item label="是否解决">
<el-select v-model="tableStore.table.params.dealState" clearable placeholder="请选择是否解决">
<el-select v-model="tableStore.table.params.dealState" clearable placeholder="请选择是否解决" filterable>
<el-option
v-for="item in dealStateList"
:key="item.value"

2
src/views/pqs/supervise/electricalEnergy/components1/form/complaintsForm.vue
View File

@@ -47,7 +47,7 @@
></el-input>
</el-form-item> -->
<el-form-item for="-" label="监测点:" prop="monitorNumber">
<el-select v-model="form.monitorNumber" clearable filterable style="width: 100%" placeholder="请选择监测点">
<el-select v-model="form.monitorNumber" clearable filterable style="width: 100%" placeholder="请选择监测点" >
<el-option v-for="item in minitorList" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>

262
src/views/pqs/supervise/electricalEnergy/components1/form/testQuestionsForm.vue
View File

@@ -1,131 +1,131 @@
<template>
<el-dialog draggable v-model="dialogVisible" :title="title" style="width: 1100px" :before-close="handleClose">
<el-form :model="ordinaryA" :inline="true" class="form">
<el-form-item>
<Area v-model="ordinaryA.orgNo"></Area>
</el-form-item>
<el-form-item label="普测结果上传时间">
<el-date-picker
v-model="ordinaryA.planStartTime"
type="month"
format="YYYY-MM"
value-format="YYYY-MM-DD"
placeholder="选择月"
@change="queryPlanName"
></el-date-picker>
</el-form-item>
<el-form-item label="普测计划名称">
<el-select v-model="ordinaryA.planName" clearable placeholder="请选择">
<el-option
v-for="item in planNameList"
:key="item.planName"
:label="item.planName"
:value="item.planName"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-Search" @click="searchFnExcessive">查询</el-button>
</el-form-item>
</el-form>
<vxe-table v-bind="defaultAttribute" height="350" ref="xTable2Ref" :data="ordinaryAddData">
<vxe-column type="radio" width="60"></vxe-column>
<vxe-column field="subName" title="变电站名称"></vxe-column>
<vxe-column field="voltageLevelName" title="变电站电压等级"></vxe-column>
</vxe-table>
<el-form :model="ordinaryA" :rules="rules" ref="ordinaryARef" label-width="auto" :inline="true" class="form">
<el-form-item label="稳态指标" prop="steadyState">
<el-checkbox-group v-model="ordinaryA.steadyState">
<el-checkbox v-for="(item, ind) in steadyStateList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="暂态指标" prop="transientIndicators">
<el-checkbox-group v-model="ordinaryA.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="上传附件">
<el-upload
ref="upload"
action=""
:auto-upload="false"
:show-file-list="false"
:limit="1"
:on-change="beforeUpload"
>
<el-button icon="el-icon-Upload" type="primary" class="mr10">上传</el-button>
</el-upload>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { useDictData } from '@/stores/dictData'
const emit = defineEmits(['onsubmit'])
const dictData = useDictData()
const dialogVisible = ref(false)
const title: any = ref('')
const steadyStateList = dictData.getBasicData('Steady_Indicator')
const transientIndicatorsList = dictData.getBasicData('Transient_Indicators')
const ordinaryA = ref({
orgNo: '',
orgName: '',
planName: '',
planStartTime: '',
uploadTime: '',
name: '',
steadyState: [],
transientIndicators: []
})
const defaultAttribute = ref([])
const rules = {
problemName: [{ required: true, message: '请输入问题名称', trigger: 'blur' }],
userName: [{ required: true, message: '请输入用户名称', trigger: 'blur' }],
userNo: [{ required: true, message: '请输入用户编号', trigger: 'blur' }],
complaintContent: [{ required: true, message: '请输入投诉内容', trigger: 'blur' }],
complaintTime: [{ required: true, message: '请选择时间', trigger: 'change' }],
problemSources: [{ required: true, message: '情选择问题来源', trigger: 'change' }],
abnormalDevTime: [{ required: true, message: '请选择时间', trigger: 'change' }],
transientIndicators: [{ required: true, message: '请选择暂态指标', trigger: 'change' }],
steadyState: [{ required: true, message: '请选择稳态指标', trigger: 'change' }],
eventDescription: [{ required: true, message: '请输入终端异常描述', trigger: 'blur' }],
abnormalDevName: [{ required: true, message: '请输入问题名称', trigger: 'blur' }]
}
const submit = () => {
handleClose()
}
const open = (row: any) => {
dialogVisible.value = true
title.value = row.text
}
const handleClose = () => {
dialogVisible.value = false
}
const beforeUpload = () => {}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
width: 400px;
}
</style>
<template>
<el-dialog draggable v-model="dialogVisible" :title="title" style="width: 1100px" :before-close="handleClose">
<el-form :model="ordinaryA" :inline="true" class="form">
<el-form-item>
<Area v-model="ordinaryA.orgNo"></Area>
</el-form-item>
<el-form-item label="普测结果上传时间">
<el-date-picker
v-model="ordinaryA.planStartTime"
type="month"
format="YYYY-MM"
value-format="YYYY-MM-DD"
placeholder="选择月"
@change="queryPlanName"
></el-date-picker>
</el-form-item>
<el-form-item label="普测计划名称">
<el-select v-model="ordinaryA.planName" clearable placeholder="请选择" filterable>
<el-option
v-for="item in planNameList"
:key="item.planName"
:label="item.planName"
:value="item.planName"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-Search" @click="searchFnExcessive">查询</el-button>
</el-form-item>
</el-form>
<vxe-table v-bind="defaultAttribute" height="350" ref="xTable2Ref" :data="ordinaryAddData">
<vxe-column type="radio" width="60"></vxe-column>
<vxe-column field="subName" title="变电站名称"></vxe-column>
<vxe-column field="voltageLevelName" title="变电站电压等级"></vxe-column>
</vxe-table>
<el-form :model="ordinaryA" :rules="rules" ref="ordinaryARef" label-width="auto" :inline="true" class="form">
<el-form-item label="稳态指标" prop="steadyState">
<el-checkbox-group v-model="ordinaryA.steadyState">
<el-checkbox v-for="(item, ind) in steadyStateList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="暂态指标" prop="transientIndicators">
<el-checkbox-group v-model="ordinaryA.transientIndicators">
<el-checkbox v-for="(item, ind) in transientIndicatorsList" :key="ind" :label="item.code">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="上传附件">
<el-upload
ref="upload"
action=""
:auto-upload="false"
:show-file-list="false"
:limit="1"
:on-change="beforeUpload"
>
<el-button icon="el-icon-Upload" type="primary" class="mr10">上传</el-button>
</el-upload>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { useDictData } from '@/stores/dictData'
const emit = defineEmits(['onsubmit'])
const dictData = useDictData()
const dialogVisible = ref(false)
const title: any = ref('')
const steadyStateList = dictData.getBasicData('Steady_Indicator')
const transientIndicatorsList = dictData.getBasicData('Transient_Indicators')
const ordinaryA = ref({
orgNo: '',
orgName: '',
planName: '',
planStartTime: '',
uploadTime: '',
name: '',
steadyState: [],
transientIndicators: []
})
const defaultAttribute = ref([])
const rules = {
problemName: [{ required: true, message: '请输入问题名称', trigger: 'blur' }],
userName: [{ required: true, message: '请输入用户名称', trigger: 'blur' }],
userNo: [{ required: true, message: '请输入用户编号', trigger: 'blur' }],
complaintContent: [{ required: true, message: '请输入投诉内容', trigger: 'blur' }],
complaintTime: [{ required: true, message: '请选择时间', trigger: 'change' }],
problemSources: [{ required: true, message: '情选择问题来源', trigger: 'change' }],
abnormalDevTime: [{ required: true, message: '请选择时间', trigger: 'change' }],
transientIndicators: [{ required: true, message: '请选择暂态指标', trigger: 'change' }],
steadyState: [{ required: true, message: '请选择稳态指标', trigger: 'change' }],
eventDescription: [{ required: true, message: '请输入终端异常描述', trigger: 'blur' }],
abnormalDevName: [{ required: true, message: '请输入问题名称', trigger: 'blur' }]
}
const submit = () => {
handleClose()
}
const open = (row: any) => {
dialogVisible.value = true
title.value = row.text
}
const handleClose = () => {
dialogVisible.value = false
}
const beforeUpload = () => {}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
width: 400px;
}
</style>

4
src/views/pqs/supervise/electricalEnergy/components1/online.vue
View File

@@ -16,7 +16,7 @@
/>
</el-form-item>
<el-form-item label="监测点性质">
<el-select v-model="tableStore.table.params.lineType" clearable placeholder="请选择监测点性质">
<el-select v-model="tableStore.table.params.lineType" clearable placeholder="请选择监测点性质" filterable>
<el-option label="电网侧" value="0" />
<el-option label="非电网侧" value="1" />
</el-select>
@@ -26,6 +26,7 @@
v-model="tableStore.table.params.dataType"
@change="changeDataType"
placeholder="请选择监测点性质"
filterable
>
<el-option label="超标数据" value="1" />
<el-option label="异常数据" value="2" />
@@ -40,6 +41,7 @@
collapse-tags
collapse-tags-tooltip
placeholder="请选择超标指标"
filterable
>
<el-option v-for="item in exceeded" :key="item.id" :label="item.name" :value="item.id" />
</el-select>

2
src/views/pqs/supervise/electricalEnergy/components1/testQuestions.vue
View File

@@ -13,7 +13,7 @@
></el-input>
</el-form-item>
<el-form-item label="是否解决">
<el-select v-model="tableStore.table.params.dealState" clearable placeholder="请选择是否解决">
<el-select v-model="tableStore.table.params.dealState" clearable placeholder="请选择是否解决" filterable>
<el-option
v-for="item in dealStateList"
:key="item.value"

4
src/views/pqs/supervise/electricalEnergy/components1/testRun.vue
View File

@@ -4,7 +4,7 @@
<TableHeader area nextFlag theCurrentTime showTimeAll ref="TableHeaderRef" showExport showCustomColumn>
<template #select>
<el-form-item label="流程状态">
<el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态">
<el-select v-model="tableStore.table.params.status" clearable placeholder="请选择流程状态" filterable>
<el-option
v-for="item in statusSelect"
:key="item.id"
@@ -14,7 +14,7 @@
</el-select>
</el-form-item>
<el-form-item label="是否解决">
<el-select v-model="tableStore.table.params.dealState" clearable placeholder="请选择是否解决">
<el-select v-model="tableStore.table.params.dealState" clearable placeholder="请选择是否解决" filterable>
<el-option
v-for="item in dealStateList"
:key="item.value"

2
src/views/pqs/supervise/harmonicSurvey/components/outcome.vue
View File

@@ -3,7 +3,7 @@
<TableHeader area datePicker ref="TableHeaderRef" showCustomColumn>
<template #select>
<el-form-item label="是否上传">
<el-select v-model="tableStore.table.params.isFileUpload" placeholder="请选择是否上传">
<el-select v-model="tableStore.table.params.isFileUpload" placeholder="请选择是否上传" filterable>
<el-option label="未上传" value="0" />
<el-option label="已上传" value="1" />
</el-select>

Some files were not shown because too many files have changed in this diff Show More