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

修改测试问题

Browse Source
This commit is contained in:
guanj
2026-06-11 20:27:37 +08:00
parent bda7373133
commit 1a09c31669
61 changed files with 3393 additions and 2406 deletions
Download Patch File Download Diff File Expand all files Collapse all files

256
src/views/govern/manage/components/factoryForm.vue Normal file
View File

@@ -0,0 +1,256 @@
<template>
<el-dialog :title="dialogTitle" v-model="visible" :close-on-click-modal="false" :before-close="handleBeforeClose"
draggable width="800px">
<el-form :model="form" label-width="auto" :rules="rules" ref="ruleFormRef" class="form-two">
<el-form-item label="设备名称" prop="name">
<el-input maxlength="32" show-word-limit v-model.trim="form.name" autocomplete="off" clearable
placeholder="请输入（项目名称+设备名称）"></el-input>
</el-form-item>
<el-form-item label="网络设备ID" prop="ndid" class="top">
<el-input maxlength="32" show-word-limit v-model.trim="form.ndid" autocomplete="off"
placeholder="请输入网络设备ID"></el-input>
</el-form-item>
<el-form-item label="设备类型" prop="devType" class="top">
<el-select v-model.trim="form.devType" placeholder="请选择设备类型" @change="formDevTypeChange" clearable>
<el-option v-for="item in formDevTypeOptions" :key="item.value" :label="item.label || item.name"
:value="item.value || item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="设备型号" prop="devModel" class="top">
<el-select v-model.trim="form.devModel" filterable placeholder="请选择设备型号" clearable>
<el-option v-for="item in formDevModelOptionsFilter" :key="item.value" :label="item.label"
:value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="治理类型" class="top">
<el-select v-model.trim="form.governType" filterable placeholder="请选择治理类型" clearable>
<el-option label="暂态" value="event"></el-option>
<el-option label="稳态" value="harmonic"></el-option>
</el-select>
</el-form-item>
<el-form-item label="敏感用户"class="top">
<div style="display: flex;">
<el-select v-model.trim="form.monitorUser" style="width: 230px;" filterable placeholder="请选择敏感用户"
clearable>
<el-option v-for="option in userList" :key="option.id" :label="option.name"
:value="option.id"></el-option>
</el-select>
<el-button type="primary" icon="el-icon-Plus" class="ml10" @click="addMonitorUser" />
</div>
</el-form-item>
<el-form-item label="治理方法" class="top">
<el-input maxlength="32" show-word-limit v-model="form.governMethod" autocomplete="off" clearable
placeholder="例: 250A APF 或 100kVar SVG"></el-input>
</el-form-item>
<el-form-item label="通讯协议" prop="devAccessMethod" class="top">
<el-select v-model.trim="form.devAccessMethod" placeholder="请选择通讯协议" clearable disabled>
<el-option label="MQTT" value="MQTT"></el-option>
<el-option label="CLD" value="CLD"></el-option>
</el-select>
</el-form-item>
<el-form-item label="关联项目" class="top">
<el-cascader v-model.trim="form.association" filterable :options="engineeringList"
:props="cascaderProps" clearable placeholder="请选择关联项目" />
</el-form-item>
<el-form-item label="排序" class="top" prop="sort">
<el-input-number v-model.trim="form.sort" style="width: 100%;" :min="0" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="handleCancel">取 消</el-button>
<el-button type="primary" @click="onSubmit">确 定</el-button>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { computed, nextTick, reactive, ref } from 'vue'
import { ElMessage } from 'element-plus'
import {
addEquipmentDelivery,
editEquipmentDelivery,
portableDeviceRegister,
} from '@/api/cs-system-boot/device'
import { useRouter } from 'vue-router'
const router = useRouter() // 路由对象
const props = defineProps<{
userList: any[]
engineeringList: any[]
devTypeOptions: any[]
devTypeOptions2: any
devModelOptions: any[]
devModelOptions2: any[]
}>()
const emit = defineEmits<{
success: []
}>()
const visible = defineModel<boolean>('visible', { default: false })
const dialogTitle = ref('新增设备')
const ruleFormRef = ref()
const form: any = reactive(getDefaultForm())
const cascaderProps = {
label: 'projectName',
value: 'projectId',
children: 'projectInfoList'
}
const rules = reactive({
name: [{ required: true, message: '请输入设备名', trigger: 'blur' }],
ndid: [{ required: true, message: '请输入网络设备id', trigger: 'blur' }],
devType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
devModel: [{ required: true, message: '请选择设备型号', trigger: 'change' }],
devAccessMethod: [{ required: true, message: '请输入接入方式', trigger: 'blur' }],
cntractNo: [{ required: true, message: '请输入合同号', trigger: 'blur' }],
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
})
function getDefaultForm() {
return {
cntractNo: '',
devAccessMethod: 'MQTT',
devModel: '',
devType: '',
name: '',
ndid: '',
associatedEngineering: '',
associatedProject: '',
association: [] as any[],
sort: 0,
monitorUser: '',
governType: '',
governMethod: '',
id: undefined as string | number | undefined,
}
}
const normalizeFormValue = (value: unknown, fallback = '') =>
value == null ? fallback : value
const buildSubmitPayload = () => {
const association = Array.isArray(form.association) ? form.association : []
return {
id: form.id,
cntractNo: normalizeFormValue(form.cntractNo),
devAccessMethod: normalizeFormValue(form.devAccessMethod, 'MQTT'),
devModel: normalizeFormValue(form.devModel),
devType: normalizeFormValue(form.devType),
name: normalizeFormValue(form.name),
ndid: normalizeFormValue(form.ndid),
associatedEngineering: normalizeFormValue(association[0]),
associatedProject: normalizeFormValue(association[1]),
sort: form.sort ?? 0,
monitorUser: normalizeFormValue(form.monitorUser),
governType: normalizeFormValue(form.governType),
governMethod: normalizeFormValue(form.governMethod),
}
}
const formDevModelOptionsFilter = computed(() => {
if (form.devAccessMethod === 'CLD') {
return props.devModelOptions2.filter((item: any) => {
return form.devType ? item.pid == form.devType : true
})
}
return props.devModelOptions.filter((item: any) => {
return form.devType ? item.pid == form.devType : true
})
})
const formDevTypeOptions = computed(() => {
if (form.devAccessMethod === 'CLD') {
return [props.devTypeOptions2]
}
return props.devTypeOptions
})
const formDevTypeChange = (e: any) => {
if (!e) return
form.devModel = ''
}
const openAdd = () => {
dialogTitle.value = '新增设备'
Object.assign(form, getDefaultForm())
visible.value = true
}
const openEdit = (row: any) => {
dialogTitle.value = '编辑设备'
Object.assign(form, getDefaultForm())
for (const key in form) {
if (key in row) {
form[key] = row[key]
}
}
form.association = row.associatedProject ? [row.associatedEngineering, row.associatedProject] : []
form.id = row.id
visible.value = true
}
const clearForm = () => {
ruleFormRef.value?.resetFields()
nextTick(() => {
Object.assign(form, getDefaultForm())
})
}
const handleCancel = () => {
clearForm()
visible.value = false
}
const handleBeforeClose = (done: () => void) => {
clearForm()
done()
}
const resetForm = () => {
clearForm()
visible.value = false
}
const addMonitorUser = () => {
sessionStorage.setItem('factoryNeedRefreshUserList', '1')
router.push({
name: 'govern/sensitiveLoadMange/index',
})
}
const onSubmit = () => {
ruleFormRef.value.validate((valid: boolean) => {
if (!valid) return
const payload = buildSubmitPayload()
if (dialogTitle.value === '新增设备') {
addEquipmentDelivery(payload).then(res => {
ElMessage.success('新增成功')
const devType = props.devTypeOptions.find((item: any) => item.value == payload.devType)
if (devType?.code === 'Portable') {
setTimeout(() => {
ElMessage.warning('设备正在接入中，请稍等。')
}, 3000)
portableDeviceRegister({ nDid: res.data.ndid })
.then(pres => {
ElMessage.success(pres.message)
})
.catch(() => { })
}
resetForm()
emit('success')
})
} else {
editEquipmentDelivery(payload).then(() => {
ElMessage.success('修改成功')
resetForm()
emit('success')
})
}
})
}
defineExpose({ openAdd, openEdit })
</script>

360
src/views/govern/manage/factory.vue
View File

@@ -3,12 +3,8 @@
<TableHeader>
<template v-slot:select>
<el-form-item label="关键字筛选">
<el-input maxlength="32" show-word-limit
v-model.trim="tableStore.table.params.searchValue"
style="width: 200px"
clearable
placeholder="请输入设备名称/网络设备ID"
/>
<el-input maxlength="32" show-word-limit v-model.trim="tableStore.table.params.searchValue"
style="width: 200px" clearable placeholder="请输入设备名称/网络设备ID" />
</el-form-item>
<!-- <el-form-item label="流程阶段">
<el-select v-model.trim="tableStore.table.params.process" clearable placeholder="请选择状态">
@@ -18,11 +14,7 @@
</el-select>
</el-form-item> -->
<el-form-item label="物联状态">
<el-select
v-model.trim="tableStore.table.params.connectStatus"
clearable
placeholder="请选择物联状态"
>
<el-select v-model.trim="tableStore.table.params.connectStatus" clearable placeholder="请选择物联状态">
<el-option label="已连接" :value="1"></el-option>
<el-option label="未连接" :value="0"></el-option>
</el-select>
@@ -85,107 +77,22 @@
<el-button type="primary" @click="downLoadFile1" class="ml10" icon="el-icon-Download">
模版下载
</el-button>
<el-upload
style="display: inline-block"
action=""
accept=".xlsx"
class="upload-demo"
:show-file-list="false"
:auto-upload="false"
:on-change="bulkImport"
>
<el-upload style="display: inline-block" action="" accept=".xlsx" class="upload-demo"
:show-file-list="false" :auto-upload="false" :on-change="bulkImport">
<el-button type="primary" class="ml10" icon="el-icon-Tickets">批量导入</el-button>
</el-upload>
<el-button type="primary" class="ml10" @click="add" icon="el-icon-Plus">新增设备</el-button>
<el-button
type="primary"
class="ml10"
icon="el-icon-Download"
@click="downLoadQrCode"
:disabled="!showQrCode"
>
<el-button type="primary" class="ml10" icon="el-icon-Download" @click="downLoadQrCode"
:disabled="!showQrCode">
批量下载二维码
</el-button>
</template>
</TableHeader>
<Table ref="tableRef" :checkbox-config="checkboxConfig" :key="tableKey" @sort-change="handleSortChange"></Table>
<el-dialog
:title="dialogTitle"
v-model.trim="dialogFormVisible"
:close-on-click-modal="false"
:before-close="resetForm"
draggable
width="800px"
>
<el-form :model="form" label-width="auto" :rules="rules" ref="ruleFormRef" class="form-two">
<el-form-item label="设备名称:" prop="name">
<el-input maxlength="32" show-word-limit
v-model.trim="form.name"
autocomplete="off"
clearable
placeholder="请输入（项目名称+设备名称）"
></el-input>
</el-form-item>
<el-form-item label="网络设备ID:" prop="ndid" class="top">
<el-input maxlength="32" show-word-limit
v-model.trim="form.ndid"
autocomplete="off"
placeholder="请输入"
></el-input>
</el-form-item>
<el-form-item label="设备类型:" prop="devType" class="top">
<el-select v-model.trim="form.devType" placeholder="请选择" @change="formDevTypeChange" clearable>
<el-option
v-for="item in formDevTypeOptions"
:key="item.value"
:label="item.label || item.name"
:value="item.value || item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="设备型号:" prop="devModel" class="top">
<el-select v-model.trim="form.devModel" filterable placeholder="请选择" clearable>
<el-option
v-for="item in formDevModelOptionsFilter"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="通讯协议:" prop="devAccessMethod" class="top">
<el-select v-model.trim="form.devAccessMethod" placeholder="请选择" clearable disabled>
<el-option label="MQTT" value="MQTT"></el-option>
<el-option label="CLD" value="CLD"></el-option>
</el-select>
</el-form-item>
<el-form-item label="关联项目:" class="top">
<el-cascader
v-model.trim="form.association"
filterable
:options="engineeringList"
:props="props"
clearable
/>
</el-form-item>
<el-form-item label="排序:" class="top" prop="sort">
<el-input-number v-model.trim="form.sort" :min="0" />
</el-form-item>
<!-- <el-form-item label="合同号:" prop="cntractNo" class="top">
<el-input maxlength="32" show-word-limit v-model.trim="form.cntractNo" autocomplete="off" placeholder="请输入"></el-input>
</el-form-item> -->
</el-form>
<template #footer>
<el-button @click="resetForm">取 消</el-button>
<el-button type="primary" @click="onSubmit">确 定</el-button>
</template>
</el-dialog>
<FactoryForm ref="factoryFormRef" :user-list="userList" :engineering-list="engineeringList"
:dev-type-options="devTypeOptions" :dev-type-options2="devTypeOptions2" :dev-model-options="devModelOptions"
:dev-model-options2="devModelOptions2" @success="onFormSuccess" />
<div class="qrcode-label">
<div class="qrcode-label-title">{{ deivce.mac }}</div>
@@ -200,35 +107,36 @@
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, computed, reactive, nextTick } from 'vue'
import { ref, onMounted, onActivated, provide, computed, reactive } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import FactoryForm from './components/factoryForm.vue'
import { queryByCode, queryByid, queryCsDictTree } from '@/api/system-boot/dictTree'
import { ElMessage, ElMessageBox } from 'element-plus'
import { activateUser, deluser, passwordConfirm } from '@/api/user-boot/user'
import { downLoadFile } from '@/api/cs-system-boot/manage'
import {
addEquipmentDelivery,
deleteEquipmentDelivery,
editEquipmentDelivery,
batchImportDevice,
resetEquipmentDelivery,
governDeviceRegister,
portableDeviceRegister,
portableDeviceAccess,
getExcelTemplate,
engineeringProject,
onlineRegister,
resetFactory
resetFactory,
portableDeviceRegister,
portableDeviceAccess,
} from '@/api/cs-system-boot/device'
import html2canvas from 'html2canvas'
import { fullUrl } from '@/utils/common'
import JSZip from 'jszip'
import { saveAs } from 'file-saver'
import { getList } from '@/api/cs-harmonic-boot/recruitment'
defineOptions({
name: 'govern/manage/factory'
})
const userList: any = ref([])
const showQrCode = ref(false)
const devTypeOptions: any = ref([])
const devTypeOptions2: any = ref([])
@@ -236,37 +144,9 @@ const devModelOptions2: any = ref([])
const engineeringList: any = ref([])
const deivce: any = ref({})
const ruleFormRef = ref()
const form: any = reactive({
cntractNo: '',
devAccessMethod: 'MQTT',
devModel: '',
devType: '',
name: '',
ndid: '',
associatedEngineering: '',
associatedProject: '',
association: [],
sort: 0
})
const props = {
label: 'projectName',
value: 'projectId',
children: 'projectInfoList'
}
const rules = reactive({
name: [{ required: true, message: '请输入设备名', trigger: 'blur' }],
ndid: [{ required: true, message: '请输入网络设备id', trigger: 'blur' }],
devType: [{ required: true, message: '请选择设备类型', trigger: 'change' }],
devModel: [{ required: true, message: '请选择设备型号', trigger: 'change' }],
devAccessMethod: [{ required: true, message: '请输入接入方式', trigger: 'blur' }],
cntractNo: [{ required: true, message: '请输入合同号', trigger: 'blur' }],
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
})
const factoryFormRef = ref<InstanceType<typeof FactoryForm>>()
const qrcodeFlag = ref(false)
const tableKey = ref(0)
const dialogFormVisible = ref(false)
const dialogTitle = ref('新增设备')
const loading = ref<boolean>(false)
const devModelOptions: any = ref([])
const queryTheDictionary = () => {
@@ -330,37 +210,6 @@ const devModelOptionsFilter = computed(() => {
})
})
const formDevModelOptionsFilter = computed(() => {
if (form.devAccessMethod === 'CLD') {
return devModelOptions2.value.filter((item: any) => {
if (form.devType) {
return item.pid == form.devType
} else {
return true
}
})
} else {
return devModelOptions.value.filter((item: any) => {
if (form.devType) {
return item.pid == form.devType
} else {
return true
}
})
}
})
const formDevTypeOptions = computed(() => {
// 如果协议是CLD，使用devTypeOptions2，否则使用devTypeOptions
if (form.devAccessMethod === 'CLD') {
// 对于devTypeOptions2，使用id和name字段
return [devTypeOptions2.value]
} else {
// 对于devTypeOptions，使用value和label字段
return devTypeOptions.value
}
})
const tableStore = new TableStore({
url: '/cs-device-boot/EquipmentDelivery/list',
method: 'POST',
@@ -377,8 +226,8 @@ const tableStore = new TableStore({
return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
}
},
{ title: '设备名称', field: 'name', minWidth: 120 },
{ title: '网络设备ID', field: 'ndid', minWidth: 120 },
{ title: '设备名称', field: 'name', minWidth: 160 },
{ title: '网络设备ID', field: 'ndid', minWidth: 130 },
{
title: '设备类型',
field: 'devType',
@@ -393,7 +242,7 @@ const tableStore = new TableStore({
return item ? item.label : '/'
}
},
minWidth: 120
minWidth: 110
},
{
title: '设备型号',
@@ -405,13 +254,37 @@ const tableStore = new TableStore({
},
minWidth: 120
},
{
title: '治理类型',
field: 'governType',
minWidth: 100,
formatter: row => {
return row.cellValue === 'event' ? '暂态' : row.cellValue === 'harmonic' ? '稳态' : (row.cellValue || '/')
}
},
{
title: '治理方法',
field: 'governMethod',
minWidth: 100,
formatter: row => {
return row.cellValue || '/'
}
},
{
title: '敏感用户',
field: 'monitorUser',
minWidth: 120,
formatter: row => {
return userList.value.find((item: any) => item.id == row.cellValue)?.name || '/'
}
},
{
title: '通讯协议',
field: 'devAccessMethod',
formatter: row => {
return row.cellValue === 'MQTT' ? 'MQTT' : row.cellValue === 'CLD' ? 'CLD' : row.cellValue
},
minWidth: 120
minWidth: 100
},
{ title: '录入时间', field: 'createTime', sortable: true, minWidth: 150 },
@@ -425,7 +298,7 @@ const tableStore = new TableStore({
inactiveValue: '0',
activeValue: '1',
onChangeField: (row: any, value: any) => {
// console.log("🚀 ~ row:", row)
// console.log("🚀 ~ row", row)
ElMessageBox.prompt('二次校验密码确认', '', {
confirmButtonText: '确认',
cancelButtonText: '取消',
@@ -492,28 +365,28 @@ const tableStore = new TableStore({
},
minWidth: 80
},
{
title: '流程阶段',
field: 'process',
width: 100,
render: 'tag',
custom: {
2: 'warning',
3: 'warning',
4: 'success'
},
replaceValue: {
2: '功能调试',
3: '出厂调试',
4: '正式投运'
},
minWidth: 80
},
// {
// title: '流程阶段',
// field: 'process',
// width: 100,
// render: 'tag',
// custom: {
// 2: 'warning',
// 3: 'warning',
// 4: 'success'
// },
// replaceValue: {
// 2: '功能调试',
// 3: '出厂调试',
// 4: '正式投运'
// },
// minWidth: 80
// },
{
title: '操作',
fixed: 'right',
align: 'center',
width: 220,
width: 180,
render: 'buttons',
buttons: [
//直连设备注册
@@ -758,16 +631,7 @@ const tableStore = new TableStore({
render: 'basicButton',
click: async row => {
dialogFormVisible.value = true
dialogTitle.value = '编辑设备'
for (let key in form) {
form[key] = row[key]
}
form.association = row.associatedProject
? [row.associatedEngineering, row.associatedProject]
: []
form.id = row.id
factoryFormRef.value?.openEdit(row)
}
},
{
@@ -810,7 +674,7 @@ const tableStore = new TableStore({
tableStore.onTableAction('search', {})
})
})
.catch(e => {})
.catch(e => { })
}
}
]
@@ -956,81 +820,35 @@ const handleSortChange = ({ column, order }: { column: TableColumn; order: 'asc'
// 新增
const add = () => {
dialogFormVisible.value = true
dialogTitle.value = '新增设备'
factoryFormRef.value?.openAdd()
}
// 确认
const onSubmit = () => {
ruleFormRef.value.validate((valid: any) => {
if (valid) {
form.associatedEngineering = form.association ? form.association[0] : ''
form.associatedProject = form.association ? form.association[1] : ''
if (dialogTitle.value == '新增设备') {
addEquipmentDelivery(form).then(res => {
ElMessage.success('新增成功')
if (devTypeOptions.value.filter((item: any) => item.value == form.devType)[0].code == 'Portable') {
setTimeout(() => {
ElMessage.warning('设备正在接入中，请稍等。')
}, 3000)
portableDeviceRegister({
nDid: res.data.ndid
})
.then(pres => {
ElMessage.success(pres.message)
setTimeout(() => {
tableStore.index()
}, 1000)
})
.catch(err => {
// clearTimeout (time)
})
}
resetForm()
tableStore.onTableAction('search', {})
})
} else {
editEquipmentDelivery(form).then(res => {
ElMessage.success('修改成功')
resetForm()
tableStore.onTableAction('search', {})
})
}
}
})
const onFormSuccess = () => {
tableStore.onTableAction('search', {})
}
// 清空表格
const resetForm = () => {
ruleFormRef.value.resetFields()
dialogFormVisible.value = false
nextTick(() => {
// 模拟待编辑数据
let user = {
cntractNo: '',
devAccessMethod: 'MQTT',
devModel: '',
devType: '',
name: '',
associatedEngineering: '',
associatedProject: '',
association: [],
ndid: ''
}
Object.assign(form, user)
const getUserList = () => {
return getList({
pageNum: 1,
pageSize: 2000
}).then(res => {
userList.value = res.data.records
})
}
const formDevTypeChange = (e: any) => {
if (!e) {
return
// 页面被 keep-alive 缓存后，从敏感用户页返回时刷新下拉列表
onActivated(() => {
if (sessionStorage.getItem('factoryNeedRefreshUserList')) {
sessionStorage.removeItem('factoryNeedRefreshUserList')
getUserList()
}
form.devModel = ''
}
})
provide('tableStore', tableStore)
onMounted(() => {
getUserList()
queryTheDictionary()
engineeringProject().then(res => {
engineeringList.value = res.data.filter(item => {
@@ -1041,10 +859,10 @@ onMounted(() => {
})
})
setTimeout(() => {}, 100)
setTimeout(() => { }, 100)
})
const addMenu = () => {}
const addMenu = () => { }
</script>
<style lang="scss" scoped>
.qrcode-label {

36
src/views/govern/manage/monthly.vue
View File

@@ -89,24 +89,24 @@ const tableStore = new TableStore({
}
},
{ title: 'Mac地址', field: 'mac', width: 140 },
{
title: '流程阶段',
field: 'process',
width: 100,
fixed: 'right',
render: 'tag',
custom: {
2: 'warning',
3: 'warning',
4: 'success'
},
replaceValue: {
2: '功能调试',
3: '出厂调试',
4: '正式投运'
},
minWidth: 80
},
// {
// title: '流程阶段',
// field: 'process',
// width: 100,
// fixed: 'right',
// render: 'tag',
// custom: {
// 2: 'warning',
// 3: 'warning',
// 4: 'success'
// },
// replaceValue: {
// 2: '功能调试',
// 3: '出厂调试',
// 4: '正式投运'
// },
// minWidth: 80
// },
{
title: '运行状态',
field: 'operationalStatus',