敏感及重要用户功能

src/views/pqs/supervise/terminal/components/sensitiveUserPopup.vue

@@ -0,0 +1,121 @@
+<template>
+  <el-dialog
+      draggable
+      class='cn-operate-dialog'
+      v-model='eventDataUploadVisible'
+      :title='title'
+      style='width: 415px;'
+      top='25vh'
+  >
+    <el-scrollbar>
+      <el-form :inline='false' :model='form' label-width='120px' ref='formRef'>
+        <el-form-item label='用户数据文件'>
+          <el-upload
+              v-model:file-list='fileList'
+              ref='uploadEventData'
+              action=''
+              :limit='1'
+              :on-exceed='handleExceed'
+              :auto-upload='false'
+              :on-change='choose'
+          >
+            <template #trigger>
+              <el-button type='primary'>选择数据文件</el-button>
+            </template>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+    </el-scrollbar>
+    <template #footer>
+            <span class='dialog-footer'>
+                <el-button @click='eventDataUploadVisible = false'>取消</el-button>
+                <el-button type='primary' @click='submit'>确认</el-button>
+            </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup lang='ts'>
+import { ref, reactive, inject } from 'vue'
+import TableStore from '@/utils/tableStore'
+import { ElMessage } from 'element-plus'
+import type { UploadInstance, UploadProps, UploadRawFile, UploadUserFile } from 'element-plus'
+import { genFileId } from 'element-plus'
+import { importSensitiveUserData } from '@/api/supervision-boot/userReport/form'
+
+const fileList = ref<UploadUserFile[]>([])
+
+const formRef = ref()
+const tableStore = inject('tableStore') as TableStore
+const eventDataUploadVisible = ref(false)
+const title = ref('')
+const uploadEventData = ref<UploadInstance>()
+
+// 注意不要和表单ref的命名冲突
+const form = reactive({
+  file: null
+})
+
+//弹出界面，默认选择用户的第一个生产线的第一条进线进行数据导入
+const open = async (text: string) => {
+  title.value = text
+  resetForm()
+  form.file = null
+  fileList.value = []
+  eventDataUploadVisible.value = true
+}
+
+//重置表单内容
+const resetForm = () => {
+  if (formRef.value) {
+    formRef.value.resetFields()
+  }
+}
+
+/**
+ * 选择待上传文件
+ */
+const choose = (e: any) => {
+  form.file = e.raw
+}
+const handleExceed: UploadProps['onExceed'] = files => {
+  uploadEventData.value!.clearFiles()
+  const file = files[0] as UploadRawFile
+  file.uid = genFileId()
+  uploadEventData.value!.handleStart(file)
+  fileList.value = [{ name: file.name, url: '' }]
+}
+
+/**
+ * 提交用户表单数据
+ */
+const submit = async () => {
+  if (form.file) {
+    formRef.value.validate(async (valid: any) => {
+      if (valid) {
+        let data = new FormData()
+        data.append('file', form.file)
+        await importSensitiveUserData(data).then((res: any) => {
+          if (res.code == 'A0000') {
+            ElMessage.success('导入成功')
+            tableStore.index()
+            eventDataUploadVisible.value = false
+          } else {
+            ElMessage.error('导入失败，请检查表格文件')
+          }
+        })
+      }
+    })
+  } else {
+    ElMessage.error('请选择数据文件')
+  }
+}
+
+defineExpose({ open })
+</script>
+
+<style scoped>
+.el-form-item__content div {
+  width: 100% !important;
+}
+</style>

src/views/pqs/supervise/terminal/components/sensitiveUserTable.vue

@@ -0,0 +1,188 @@
+<template>
+  <div>
+    <TableHeader ref='TableHeaderRef'>
+      <template #select>
+        <el-form-item label='工程名称'>
+          <el-input v-model='tableStore.table.params.projectName' clearable></el-input>
+        </el-form-item>
+        <el-form-item label='所属地市'>
+          <el-select v-model='tableStore.table.params.city' clearable placeholder='请选择所属地市'>
+            <el-option
+                v-for='item in areaOptionList'
+                :key='item.id'
+                :label='item.name'
+                :value='item.name'
+            ></el-option>
+          </el-select>
+        </el-form-item>
+      </template>
+      <template #operation>
+        <el-button icon='el-icon-Download' type='primary' @click='exportExcelTemplate'>模板下载</el-button>
+        <el-button icon='el-icon-Download' type='primary' @click='importUserData'>批量导入</el-button>
+      </template>
+    </TableHeader>
+    <Table ref='tableRef' />
+    <el-dialog title='详情' width='80%' v-model='dialogShow'>
+      <DetailInfo :id='userId'></DetailInfo>
+    </el-dialog>
+    <sensitive-user-popup ref='sensitiveUserPopup' />
+  </div>
+
+</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 { useDictData } from '@/stores/dictData'
+import DetailInfo from '../../interfere/components/undocumented/detail.vue'
+import { downloadSensitiveUserTemplate } from '@/api/supervision-boot/userReport/form'
+import SensitiveUserPopup from './sensitiveUserPopup.vue'
+
+const dictData = useDictData()
+const sensitiveUserPopup = ref()
+const TableHeaderRef = ref()
+const areaOptionList = dictData.getBasicData('jibei_area')
+const loadLevelOptionList = dictData.getBasicData('load_level')
+const powerSupplyInfoOptionList = dictData.getBasicData('supply_condition')
+const tableStore = new TableStore({
+  url: '/supervision-boot/userReport/getSensitiveUserPage',
+  publicHeight: 65,
+  method: 'POST',
+  column: [
+    {
+      title: '序号',
+      width: 60,
+      formatter: (row: any) => {
+        return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
+      }
+    },
+    { field: 'projectName', title: '工程名称', minWidth: 170 },
+    { field: 'city', title: '所属地市', minWidth: 80 },
+    // { field: 'responsibleDepartment', title: '归口管理部门', minWidth: 130 },
+    {
+      field: 'userStatus',
+      title: '用户状态',
+      minWidth: 100,
+      render: 'tag',
+      custom: {
+        0: 'primary',
+        1: 'primary',
+        2: 'success',
+        3: 'warning'
+      },
+      replaceValue: {
+        0: '可研',
+        1: '建设',
+        2: '运行',
+        3: '退运'
+      }
+    },
+    { field: 'substation', title: '变电站', minWidth: 100 },
+    {
+      field: 'userReportSensitivePO.loadLevel', title: '负荷级别', minWidth: 170,
+      formatter: (row: any) => {
+        return loadLevelOptionList.filter(item => item.id === row.cellValue)[0]?.name
+      }
+    },
+    {
+      field: 'userReportSensitivePO.powerSupplyInfo', title: '供电电源情况', minWidth: 170,
+      formatter: (row: any) => {
+        return powerSupplyInfoOptionList.filter(item => item.id === row.cellValue)[0]?.name
+      }
+    },
+    {
+      title: '操作',
+      minWidth: 150,
+      fixed: 'right',
+      render: 'buttons',
+      buttons: [
+        {
+          name: 'productSetting',
+          title: '详细信息',
+          type: 'primary',
+          icon: 'el-icon-EditPen',
+          render: 'basicButton',
+          click: row => {
+            lookInfo(row.id)
+          }
+        }
+      ]
+    }
+  ],
+
+  beforeSearchFun: () => {
+    tableStore.table.params.orgNo = tableStore.table.params.deptIndex
+  }
+})
+tableStore.table.params.city = ''
+tableStore.table.params.projectName = ''
+tableStore.table.params.loadType = ''
+tableStore.table.params.userName = ''
+tableStore.table.params.relationUserName = ''
+tableStore.table.params.aisFileUpload = ''
+
+const userId = ref()
+const dialogShow = ref(false)
+
+const lookInfo = (id: string) => {
+  userId.value = id
+  dialogShow.value = true
+}
+
+provide('tableStore', tableStore)
+onMounted(() => {
+  tableStore.index()
+})
+
+
+/**获取用户性质*/
+const getUserTypeName = (userType: any) => {
+  if (userType === 0) {
+    return '新建电网工程'
+  }
+  if (userType === 1) {
+    return '扩建电网工程'
+  }
+  if (userType === 2) {
+    return '新建非线性负荷用户'
+  }
+  if (userType === 3) {
+    return '扩建非线性负荷用户'
+  }
+  if (userType === 4) {
+    return '新建新能源发电站'
+  }
+  if (userType === 5) {
+    return '扩建新能源发电站'
+  }
+  if (userType === 6) {
+    return '敏感及重要用户'
+  }
+  return '新建电网工程'
+}
+
+
+//导出模板
+const exportExcelTemplate = () => {
+  downloadSensitiveUserTemplate().then((res: any) => {
+    let blob = new Blob([res], {
+      type: 'application/vnd.ms-excel'
+    })
+    const url = window.URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = '敏感及重要用户模板'
+    document.body.appendChild(link)
+    link.click()
+    link.remove()
+  })
+}
+
+//批量导入用户数据
+const importUserData = () => {
+  sensitiveUserPopup.value.open('导入敏感及重要用户')
+}
+
+
+</script>

src/views/pqs/supervise/terminal/index.vue

@@ -2,14 +2,16 @@
     <div class='default-main'>
         <el-tabs v-model='activeName' type='border-card'>
             <el-tab-pane label='干扰源用户台账' name='1' >
-                <!-- <network v-if="activeName == '1'" /> -->
                 <interferenceUserTable v-if="activeName == '1'" />
             </el-tab-pane>
-            <el-tab-pane label='终端台账' name='2'>
-                    <deviceLedgerTable v-if="activeName == '2'" />
+            <el-tab-pane label='敏感及重要用户台账' name='2' >
+                <sensitiveUserTable v-if="activeName == '2'" />
             </el-tab-pane>
-            <el-tab-pane label='监测点台账' name='3'>
-                    <monitorLedgerTable v-if="activeName == '3'" />
+            <el-tab-pane label='终端台账' name='3'>
+                    <deviceLedgerTable v-if="activeName == '3'" />
+            </el-tab-pane>
+            <el-tab-pane label='监测点台账' name='4'>
+                    <monitorLedgerTable v-if="activeName == '4'" />
             </el-tab-pane>
         </el-tabs>
     </div>
@@ -18,6 +20,7 @@
 <script setup lang='ts'>
 import { onMounted, reactive, ref, provide } from 'vue'
 import interferenceUserTable from './components/interferenceUserTable.vue'
+import sensitiveUserTable from './components/sensitiveUserTable.vue'
 import deviceLedgerTable from './components/deviceLedgerTable.vue'
 import monitorLedgerTable from './components/monitorLedgerTable.vue'
 import { mainHeight } from '@/utils/layout'