添加 电能质量问题管理页面

This commit is contained in:
GGJ
2024-05-16 14:00:49 +08:00
parent 32f097c951
commit 0401f2efd6
11 changed files with 788 additions and 187 deletions

View File

@@ -0,0 +1,99 @@
<template>
<!-- 2 有新增 发起 预警单 -->
<TableHeader area datePicker ref="TableHeaderRef">
<template v-slot:operation>
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
</template>
</TableHeader>
<Table ref="tableRef" />
<!-- 新增 -->
<complaintsForm ref="formRef" />
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useDictData } from '@/stores/dictData'
import complaintsForm from './form/complaintsForm.vue'
// Steady_Statis
const dictData = useDictData()
const exceeded = dictData.getBasicData('Steady_Statis')
const tableRef = ref()
const planAddRef = ref()
const formRef = ref()
const TableHeaderRef = ref()
const tableStore = new TableStore({
url: '/supervision-boot/generalSurvey/getSurvey',
publicHeight: 65,
method: 'POST',
column: [
{
title: '序号',
type: 'seq',
align: 'center',
width: 60,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'userName', title: '用户名称' },
{ field: 'userId', title: '用户编号' },
{ field: 'complaintContent', title: '投诉内容' },
{ field: 'complaintTime', title: '投诉时间' },
{
title: '操作',
width: '180',
align: 'center',
render: 'buttons',
buttons: [
{
name: 'edit',
title: '发起预警单',
type: 'primary',
icon: 'el-icon-Open',
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'primary',
title: '请确认发起发起预警单!'
},
click: row => {}
}
]
}
],
beforeSearchFun: () => {
tableStore.table.params.orgNo = tableStore.table.params.deptIndex
tableStore.table.params.currentPage = tableStore.table.params.pageNum
},
loadCallback: () => {
tableStore.table.data = [
{
userName: '东润开阳堡光伏电站用户',
userId: '8115771123274',
complaintContent: '装置频繁重启',
complaintTime: '2024-05-16'
}
]
}
})
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
// 新增
const add = () => {
formRef.value.open({ text: '新增投诉' })
}
</script>
<style scoped lang="scss"></style>

View File

@@ -0,0 +1,104 @@
<template>
<el-dialog draggable v-model="dialogVisible" :title="title" style="width: 1100px" :before-close="handleClose">
<el-form :model="userAdddata" :inline="true" ref="userAddRef" :rules="rules">
<el-form-item label="用户名称:" prop="userName">
<el-input v-model="userAdddata.userName" clearable placeholder="请输入用户名称"></el-input>
</el-form-item>
<el-form-item label="用户编号:" prop="userNo">
<el-input v-model="userAdddata.userNo" clearable placeholder="请输入用户编号"></el-input>
</el-form-item>
<el-form-item label="投诉内容:" style="margin-top: 10px" prop="complaintContent">
<el-input
type="textarea"
style="width: 400px"
:autosize="{ minRows: 2, maxRows: 4 }"
placeholder="请输入内容"
v-model="userAdddata.complaintContent"
></el-input>
</el-form-item>
<br />
<el-form-item label="投诉时间:" style="margin-top: 10px" prop="complaintTime">
<el-date-picker
v-model="userAdddata.complaintTime"
type="date"
placeholder="选择日期"
value-format="YYYY-MM-DD"
></el-date-picker>
</el-form-item>
<el-form-item label="稳态指标:" prop="steadyState">
<el-checkbox-group v-model="userAdddata.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="userAdddata.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>
<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 userAdddata = ref({
complaintContent: '',
complaintTime: '',
steadyState: [],
userName: '',
userNo: '',
transientIndicators: []
})
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
}
defineExpose({ open })
</script>
<style lang="scss" scoped>
:deep(.el-upload-list__item) {
width: 400px;
}
</style>

View File

@@ -0,0 +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>

View File

@@ -0,0 +1,135 @@
<template>
<!-- <div>1 监测点信息 发起预告警单 </div> -->
<TableHeader area datePicker ref="TableHeaderRef">
<template v-slot:select>
<el-form-item label="超标指标">
<el-select
v-model="tableStore.table.params.evaluateType"
multiple
collapse-tags
clearable
placeholder="请选择评估类型"
>
<el-option v-for="item in exceeded" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</template>
</TableHeader>
<Table ref="tableRef" />
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useDictData } from '@/stores/dictData'
// Steady_Statis
const dictData = useDictData()
const exceeded = dictData.getBasicData('Steady_Statis')
const tableRef = ref()
const planAddRef = ref()
const listFormRef = ref()
const TableHeaderRef = ref()
const tableStore = new TableStore({
url: '/supervision-boot/generalSurvey/getSurvey',
publicHeight: 65,
method: 'POST',
column: [
{
title: '序号',
type: 'seq',
align: 'center',
width: 60,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'orgName', title: '区域' },
{ field: 'subName', title: '变电站' },
{ field: 'lineName', title: '监测点名称' },
{ field: 'voltageScale', title: '电压等级' },
{ field: 'overDay', title: '总超标天数' },
{ field: 'overDays', title: '连续超标天数' },
{
title: '操作',
width: '180',
align: 'center',
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'productSetting',
title: '发起告警单',
type: 'warning',
disabled: row => {
return row.overDays <= 15
},
icon: 'el-icon-EditPen',
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'primary',
title: '请确认发起告警单!'
},
click: row => {}
},
{
name: 'edit',
title: '发起预警单',
type: 'primary',
icon: 'el-icon-Open',
disabled: row => {
return row.overDays > 15
},
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'primary',
title: '请确认发起发起预警单!'
},
click: row => {}
}
]
}
],
beforeSearchFun: () => {
tableStore.table.params.orgNo = tableStore.table.params.deptIndex
tableStore.table.params.currentPage = tableStore.table.params.pageNum
},
loadCallback: () => {
tableStore.table.data = [
{
orgName: '张家口',
subName: '110kV马头山风电场',
lineName: '111口头线',
voltageScale: '110kV',
overDay: '20',
overDays: '10'
},
{
orgName: '张家口',
subName: '110kV韩家庄风电场',
lineName: '111缘韩一线',
voltageScale: '110kV',
overDay: '20',
overDays: '16'
}
]
}
})
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
</script>
<style scoped lang="scss"></style>

View File

@@ -0,0 +1,125 @@
<template>
<!-- <div> 普测结果 发起预告警单</div> -->
<TableHeader area datePicker ref="TableHeaderRef">
<!-- <template v-slot:select>
<el-form-item label="超标指标">
<el-select
v-model="tableStore.table.params.evaluateType"
multiple
collapse-tags
clearable
placeholder="请选择评估类型"
>
<el-option v-for="item in exceeded" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</template> -->
<template v-slot:operation>
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
</template>
</TableHeader>
<Table ref="tableRef" />
<testQuestionsForm ref="testQuestionsFormRef" />
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useDictData } from '@/stores/dictData'
import testQuestionsForm from './form/testQuestionsForm.vue'
// Steady_Statis
const dictData = useDictData()
const exceeded = dictData.getBasicData('Steady_Statis')
const tableRef = ref()
const planAddRef = ref()
const listFormRef = ref()
const TableHeaderRef = ref()
const testQuestionsFormRef = ref()
const tableStore = new TableStore({
url: '/supervision-boot/generalSurvey/getSurvey',
publicHeight: 65,
method: 'POST',
column: [
{
title: '序号',
type: 'seq',
align: 'center',
width: 60,
formatter: (row: any) => {
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ field: 'orgName', title: '区域' },
{ field: 'subName', title: '变电站' },
{ field: 'name', title: '普测计划名称' },
{ field: 'time', title: '普测结果上传时间' },
{ field: 'text', title: '问题描述' },
{
title: '操作',
width: '180',
align: 'center',
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'edit',
title: '附件预览',
type: 'primary',
icon: 'el-icon-Open',
render: 'confirmButton',
click: row => {}
},
{
name: 'edit',
title: '发起预警单',
type: 'primary',
icon: 'el-icon-Open',
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'primary',
title: '请确认发起发起预警单!'
},
click: row => {}
}
]
}
],
beforeSearchFun: () => {
tableStore.table.params.orgNo = tableStore.table.params.deptIndex
tableStore.table.params.currentPage = tableStore.table.params.pageNum
},
loadCallback: () => {
tableStore.table.data = [
{
orgName: '张家口',
subName: '张家口变电站',
name: '张家口变电站1期普测计划',
time: '2024-05-16',
text: '/'
}
]
}
})
provide('tableStore', tableStore)
onMounted(() => {
tableStore.index()
})
const add = () => {
testQuestionsFormRef.value.open({
text: '新增测试问题'
})
}
</script>
<style scoped lang="scss"></style>