终端入网检测-终端信息新增弹框修改&列表展示修改

src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/addForm.vue

@@ -9,6 +9,11 @@
         :lazy="true"
         draggable
     >
+        <!-- <el-anchor :container="containerRef" direction="vertical" type="default" :offset="30" @click="handleClick">
+            <el-anchor-link href="#part1" title="基础信息" />
+            <el-anchor-link href="#part2" title="终端信息" />
+            <el-anchor-link href="#part3" title="附件材料" />
+        </el-anchor> -->
         <!--终端信息录入   基础信息+终端信息+附件材料 -->
         <el-form
             :model="form"
@@ -17,16 +22,13 @@
             :rules="rules"
             ref="ruleFormRef"
             label-width="auto"
+            class="form-two"
         >
-            <el-tabs tab-position="left" class="tabs_form" v-model="activeName">
+            <!-- <el-tabs tab-position="left" class="tabs_form" v-model="activeName"> -->
-                <el-tab-pane name="0" label="基础信息" class="form-two">
+                <el-divider content-position="left">基础信息</el-divider>
+            <!-- <div id="part1" class="form-two"> -->
                 <el-form-item label="填报人：" prop="reporter">
-                        <el-input
+                    <el-input v-model="form.reporter" autocomplete="off" placeholder="请输入填报人" :disabled="true" />
-                            v-model="form.reporter"
-                            autocomplete="off"
-                            placeholder="请输入填报人"
-                            :disabled="true"
-                        />
                 </el-form-item>
                 <el-form-item label="填报日期：" prop="reportDate">
                     <el-date-picker
@@ -95,8 +97,9 @@
                                     </el-select>
                                 </el-form-item>
                            -->
-                </el-tab-pane>
+            <!-- </div> -->
-                <el-tab-pane name="1" label="终端信息" class="form-two">
+            <el-divider content-position="left">终端信息</el-divider>
+            <!-- <div id="part2" class="form-two"> -->
                 <div class="fixed_upload">
                     <el-upload
                         v-model:file-list="form.deviceFilePath"
@@ -163,12 +166,7 @@
                     </el-select>
                 </el-form-item>
                 <el-form-item label="终端型号：" prop="terminalType">
-                        <el-select
+                    <el-select v-model="form.terminalType" clearable style="width: 100%" placeholder="请选择终端型号">
-                            v-model="form.terminalType"
-                            clearable
-                            style="width: 100%"
-                            placeholder="请选择终端型号"
-                        >
                         <el-option
                             v-for="item in terminalTypeList"
                             :key="item.id"
@@ -179,11 +177,7 @@
                 </el-form-item>
 
                 <el-form-item label="监测终端名称：" prop="monitoringTerminalName">
-                        <el-input
+                    <el-input v-model="form.monitoringTerminalName" autocomplete="off" placeholder="请输入终端名称" />
-                            v-model="form.monitoringTerminalName"
-                            autocomplete="off"
-                            placeholder="请输入终端名称"
-                        />
                 </el-form-item>
                 <el-form-item label="通讯状态：" prop="communicationStatus">
                     <el-select
@@ -269,12 +263,7 @@
                     <el-input v-model="form.terminalSecretKey" autocomplete="off" placeholder="请输入终端秘钥" />
                 </el-form-item>
                 <el-form-item label="终端模型：" prop="terminalModel">
-                        <el-select
+                    <el-select v-model="form.terminalModel" clearable style="width: 100%" placeholder="请选择终端模型">
-                            v-model="form.terminalModel"
-                            clearable
-                            style="width: 100%"
-                            placeholder="请选择终端模型"
-                        >
                         <el-option
                             v-for="item in terminalModelList"
                             :key="item.id"
@@ -318,11 +307,7 @@
                         ></el-option>
                     </el-select>
                 </el-form-item>
-                    <el-form-item
+                <el-form-item label="本次终端检测时间：" prop="currentTerminalDetectionTime" class="label_over_warp">
-                        label="本次终端检测时间："
-                        prop="currentTerminalDetectionTime"
-                        class="label_over_warp"
-                    >
                     <el-date-picker
                         style="width: 100%"
                         v-model="form.currentTerminalDetectionTime"
@@ -435,8 +420,9 @@
                 <el-form-item label="合同号：" prop="contractNumber">
                     <el-input v-model="form.contractNumber" autocomplete="off" placeholder="请输入合同号" />
                 </el-form-item>
-                </el-tab-pane>
+            <!-- </div> -->
-                <el-tab-pane name="3" label="附件材料" class="form-two">
+            <el-divider content-position="left">附件材料</el-divider>
+            <!-- <div id="part3"  class="form-two"> -->
                 <el-form-item label="信息安全检测报告：" prop="informationSecurityTestReport">
                     <el-upload
                         v-model:file-list="form.informationSecurityTestReport"
@@ -556,8 +542,8 @@
                         </template>
                     </el-upload>
                 </el-form-item>
-                </el-tab-pane>
+            <!-- </div> -->
-            </el-tabs>
+            <!-- </el-tabs> -->
         </el-form>
         <template #footer>
             <div class="dialog-footer">
@@ -579,6 +565,7 @@ import { useAdminInfo } from '@/stores/adminInfo'
 import { uploadFile } from '@/api/system-boot/file'
 import { addTerminalFormData, getSubstationVoltageLevel } from '@/api/supervision-boot/terminal/index'
 import { getAllDeptList } from '@/api/common'
+import { formatDate } from '@/utils/formatTime'
 import { nodeAllList } from '@/api/device-boot/Business'
 const emits = defineEmits(['onSubmit'])
 const dictData = useDictData()
@@ -692,16 +679,17 @@ getFrontEndMachineList()
 //定义所属供电公司数据
 const powerCompanyList = ref([])
 //获取所属供电公司，区域列表第三层数据
-const getPowerCompanyList = async () => {
+const getPowerCompanyList =async () => {
     getAllDeptList().then(res => {
         powerCompanyList.value = res.data[0].children[0].children
         form.value.powerCompany = powerCompanyList.value[0]?.id
+        findSubstationVoltageLevel()
+        changeSubstation()
     })
 }
-getPowerCompanyList()
 //根据所选供电公司查询所选获取变电站与变电站电压等级
 const substationList = ref([])
-const findSubstationVoltageLevel = () => {
+const findSubstationVoltageLevel = async () => {
     getSubstationVoltageLevel({ orgIds: [form.value.powerCompany] }).then(res => {
         substationList.value = res.data
         form.value.substation = substationList.value[0]?.id
@@ -709,13 +697,16 @@ const findSubstationVoltageLevel = () => {
     })
 }
 //变电站选择的时候切换变电站电压等级
-const changeSubstation = () => {
+const changeSubstation = async () => {
     let obj = substationList.value.find(item => item.id == form.value.substation)
     form.value.substationVoltageLevel = obj?.voltageLevel
 }
-findSubstationVoltageLevel()
+const containerRef = ref<HTMLElement | null>(null)
-changeSubstation()
+
-const resetForm = () => {
+const handleClick = (e: MouseEvent) => {
+  e.preventDefault()
+}
+const resetForm =async () => {
     form.value = {
         reporter: '', //填报人
         reportDate: new Date(), //填报日期
@@ -752,7 +743,7 @@ const resetForm = () => {
         monitoringTerminalName: '', //监测终端名称
         neutralPointWiringMethod: neutralPointWiringMethodList[0].id, //	中性点接线方式
         currentTerminalDetectionTime: new Date(), //本次终端检测时间
-        nextTerminalInspectionTime:new Date().getTime() + 365 * 5 * 24 * 3600 * 1000, //	下次终端定检时间
+        nextTerminalInspectionTime: new Date().getTime() + 365 * 5 * 24 * 3600 * 1000, //	下次终端定检时间
         powerCompany: powerCompanyList[0]?.value.id, //所属供电公司
         simCardNumber: '', //SIM卡号
         substation: '', //	所属变电站
@@ -760,7 +751,7 @@ const resetForm = () => {
         summonFlag: summonFlagList[0].id, //	召唤标志
         terminalIp: '', //终端IP
         terminalModel: terminalModelList[0].id, //终端模型
-        terminalPort: '', //端口
+        terminalPort: '102', //端口
         terminalSecretKey: '', //终端秘钥
         terminalType: terminalTypeList[0].id, //	终端型号
         terminalWiringMethodType: terminalWiringMethodTypeList[0].id, //	终端接线方式类型
@@ -791,8 +782,6 @@ const devReportForm = ref({
     otherAttachments: [], //其他附件
     performanceTestReport: [], //性能检测报告
     typeExperimentReport: [], //型式实验报告
-    // processInstanceId: '', //流程实例的编号
-    // startUserSelectAssignees: {}, //发起人自选审批人 Map
     //终端信息实体
     supervisionTempDeviceReportParam: {
         alarmFunction: '0', //告警功能
@@ -1162,8 +1151,21 @@ watch(
                     devReportForm.value.supervisionTempDeviceReportParam[key] = val[key]
                 }
             }
-            //处理填报日期时间格式
+            //处理填报日期
-            devReportForm.value.reportDate = window.XEUtils.toDateString(form.value.reportDate, 'yyyy-MM-dd')
+            devReportForm.value.reportDate = window.XEUtils.toDateString(val.reportDate, 'yyyy-MM-dd')
+            //处理本次终端检测时间时间格式
+            //处理下次终端检测时间时间格式
+            devReportForm.value.supervisionTempDeviceReportParam = {
+                ...devReportForm.value.supervisionTempDeviceReportParam,
+                currentTerminalDetectionTime: window.XEUtils.toDateString(
+                    val.currentTerminalDetectionTime,
+                    'yyyy-MM-dd HH:mm:ss'
+                ),
+                nextTerminalInspectionTime: window.XEUtils.toDateString(
+                    val.nextTerminalInspectionTime,
+                    'yyyy-MM-dd HH:mm:ss'
+                )
+            }
         }
         //监测点信息
         else {
@@ -1174,17 +1176,6 @@ watch(
         immediate: true
     }
 )
-const open = () => {
-    dialogFormVisible.value = true
-}
-const close = () => {
-    //重置表单内容
-    //取消表单校验状态
-    ruleFormRef.value && ruleFormRef.value.resetFields()
-    dialogFormVisible.value = false
-    emits('onSubmit')
-    resetForm()
-}
 onMounted(() => {
     console.log()
 })
@@ -1264,6 +1255,19 @@ const disabledDate = time => {
     return time.getTime() < Date.now() - 8.64e7 // 8.64e7 毫秒数代表一天
 }
 const activeName = ref('0')
+
+const open = async () => {
+    getPowerCompanyList()
+    dialogFormVisible.value = true
+}
+const close = async () => {
+    //重置表单内容
+    //取消表单校验状态
+    ruleFormRef.value && ruleFormRef.value.resetFields()
+    dialogFormVisible.value = false
+    emits('onSubmit')
+    resetForm()
+}
 //提交
 const confirmForm = () => {
     // 提交终端信息
@@ -1345,4 +1349,10 @@ defineExpose({ open })
     display: flex;
     justify-content: flex-end;
 }
+.el-divider{
+    margin: 20px 0;
+}
+::v-deep .el-divider__text{
+    font-size: 16px !important;
+}
 </style>

src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/detail.vue

@@ -241,7 +241,7 @@ import { getDictTreeById } from '@/api/system-boot/dictTree'
 import { useDictData } from '@/stores/dictData'
 import { getFileNameAndFilePath } from '@/api/system-boot/file'
 import { Link } from '@element-plus/icons-vue'
-
+import { nodeAllList } from '@/api/device-boot/Business'
 defineOptions({ name: 'BpmUserReportDetail' })
 
 const { query } = useRoute() // 查询参数
@@ -333,8 +333,6 @@ const terminalTypeList = dictData.getBasicData('Dev_Type')
 const voltageTransformerTypeList = dictData.getBasicData('Voltage_Transformer')
 //字典获取中性点接线方式
 const neutralPointWiringMethodList = dictData.getBasicData('Neutral_Point')
-//字典获取所属前置机
-const frontEndMachineList = dictData.getBasicData('Front_Type')
 //字典获取终端接线方式类型
 const terminalWiringMethodTypeList = dictData.getBasicData('Dev_Connect')
 //字典获取厂家
@@ -351,6 +349,14 @@ const getInfo = async () => {
         detailLoading.value = false
     }
 }
+//获取所属前置机数据
+const frontEndMachineList = ref([])
+const getFrontEndMachineList = () => {
+    nodeAllList().then(res => {
+        frontEndMachineList.value = res.data
+    })
+}
+getFrontEndMachineList()
 const getFileName = async () => {
     //验收检验报告
     if (detailData.value.acceptanceInspectionReport) {

src/views/pqs/supervise/terminalNetworkDetection/components/terminainal/index.vue

@@ -1,21 +1,6 @@
 <!---终端入网检测-->
 <template>
     <TableHeader area datePicker ref="TableHeaderRef">
-        <!-- <template #select>
-            <el-form-item label="工程名称">
-                <el-input v-model="tableStore.table.params.searchValue" clearable></el-input>
-            </el-form-item>
-            <el-form-item label="所属地市">
-                <el-select v-model="tableStore.table.params.loadType" clearable placeholder="请选择所属地市">
-                    <el-option
-                        v-for="item in areaOptionList"
-                        :key="item.id"
-                        :label="item.name"
-                        :value="item.id"
-                    ></el-option>
-                </el-select>
-            </el-form-item>
-        </template> -->
         <template #operation>
             <el-button icon="el-icon-Plus" type="primary" @click="addFormModel">新增</el-button>
             <!-- <el-button icon="el-icon-Download" @click="exportEvent" type="primary">导出</el-button> -->
@@ -49,10 +34,10 @@ const tableStore = new TableStore({
     method: 'POST',
     column: [
         { title: '序号', type: 'seq', width: 80 },
-        { field: 'substation', title: '所属变电站', minWidth: 170 },
-        { field: 'monitoringTerminalCode', title: '设备编号', minWidth: 170 },
-        { field: 'monitoringTerminalName', title: '设备名称', minWidth: 170 },
         { field: 'orgName', title: '填报部门名称' , minWidth: 170 },
+        { field: 'substation', title: '所属变电站', minWidth: 170 },
+        { field: 'monitoringTerminalName', title: '设备名称', minWidth: 170 },
+        { field: 'monitoringTerminalCode', title: '设备编号', minWidth: 170 },
         { field: 'reportDate', title: '填报日期', minWidth: 170},
         { field: 'reporter', title: '填报人', minWidth: 80 },
         {