指标字典

frontend/src/views/system/dictionary/dictPq/components/pqPopup.vue

@@ -0,0 +1,240 @@
+<template>
+    <el-dialog v-model='dialogVisible' :title='dialogTitle' v-bind='dialogMiddle' @close="close">
+      <div>
+        <el-form :model='formContent' ref='dialogFormRef' :rules='rules' class='form-two'>
+          <el-form-item label='数据模型' :label-width='100' prop='dataType'>
+            <el-select v-model="formContent.dataType" placeholder="请选择资源类型">
+            <el-option
+              v-for="item in dictStore.getDictData('dataType')"
+              :key="item.id"
+              :label="item.label"
+              :value="item.code"
+            />
+          </el-select>
+          </el-form-item>
+          <el-form-item label='指标名称' :label-width='100' prop='name'>
+            <el-input v-model='formContent.name' placeholder='请输入' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='别名' :label-width='100' prop='otherName'>
+            <el-input v-model='formContent.otherName' placeholder='请输入' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='显示名称' :label-width='100' prop='showName'>
+            <el-input v-model='formContent.showName' placeholder='请输入' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='相别' :label-width='100' prop='phase'>
+            <el-select v-model="formContent.phase" placeholder="请选择相别">
+            <el-option
+              v-for="item in dictStore.getDictData('dataType')"
+              :key="item.id"
+              :label="item.label"
+              :value="item.code"
+            />
+          </el-select>
+          </el-form-item>
+          <el-form-item label='单位' :label-width='100' prop='unit'>
+            <el-input v-model='formContent.unit' placeholder='请输入单位' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='指标数据类型' :label-width='100' prop='type'>
+            <el-input v-model='formContent.type' placeholder='请输入指标数据类型' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='开始结束' :label-width='100' prop='type'>
+            <el-input v-model='formContent.type' placeholder='请输入开始结束' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='数据统计类型' :label-width='100' prop='statMethod'>
+            <el-select v-model="formContent.statMethod" placeholder="请选择数据统计类型">
+            <el-option
+              v-for="item in dictStore.getDictData('statMethod')"
+              :key="item.id"
+              :label="item.label"
+              :value="item.code"
+            />
+          </el-select>
+          </el-form-item>
+          <el-form-item label='报表数据来源' :label-width='100' prop='resourcesId'>
+            <el-select v-model="formContent.resourcesId" placeholder="请选择报表数据来源">
+            <el-option
+              v-for="item in dictStore.getDictData('statMethod')"
+              :key="item.id"
+              :label="item.label"
+              :value="item.code"
+            />
+          </el-select>
+          </el-form-item>
+          <el-form-item label='数据表表名' :label-width='100' prop='statMethod'>
+            <el-select v-model="formContent.statMethod" placeholder="请选择数据表表名">
+            <el-option
+              v-for="item in dictStore.getDictData('statMethod')"
+              :key="item.id"
+              :label="item.label"
+              :value="item.code"
+            />
+          </el-select>
+          </el-form-item>
+          <el-form-item label='排序' :label-width='100'>
+            <el-input-number v-model='formContent.sort' />
+          </el-form-item>
+          <el-form-item label='限值字段名称' :label-width='100' prop='limitName'>
+            <el-input v-model='formContent.limitName' placeholder='请输入限值字段名称' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='限值表名' :label-width='100' prop='limitTable'>
+            <el-input v-model='formContent.limitTable' placeholder='请输入限值表名' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='超标判断方式' :label-width='100' prop='formula'>
+            <el-select v-model="formContent.formula" placeholder="请选择超标判断方式">
+            <el-option
+              v-for="item in dictStore.getDictData('formula')"
+              :key="item.id"
+              :label="item.label"
+              :value="item.code"
+            />
+          </el-select>
+          </el-form-item>
+          <el-form-item label='参数缺省值' :label-width='100' prop='defaultValue'>
+            <el-input v-model='formContent.defaultValue' placeholder='请输入参数缺省值' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='事件类别' :label-width='100' prop='eventType'>
+            <el-input v-model='formContent.eventType' placeholder='请输入事件类别' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='设置最大值' :label-width='100' prop='maxNum'>
+            <el-input v-model='formContent.maxNum' placeholder='请输入最大值' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='设置最小值' :label-width='100' prop='minNum'>
+            <el-input v-model='formContent.minNum' placeholder='请输入最小值' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='枚举序列' :label-width='100' prop='setValue'>
+            <el-input v-model='formContent.setValue' placeholder='请输入枚举序列' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='字符串长度上限' :label-width='100' prop='strlen'>
+            <el-input v-model='formContent.strlen' placeholder='请输入字符串长度上限' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label='上送规则' :label-width='100' prop='tranRule'>
+            <el-input v-model='formContent.tranRule' placeholder='请输入上送规则' autocomplete='off' />
+          </el-form-item>
+          <el-form-item label="是否可远程控制" :label-width="100">
+            <el-radio-group v-model="formContent.ctlSts" >
+              <el-radio-button label="是" :value="1"></el-radio-button>
+              <el-radio-button label="否" :value="0"></el-radio-button>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="是否存储" :label-width="100">
+            <el-radio-group v-model="formContent.storeFlag" >
+              <el-radio-button label="是" :value="1"></el-radio-button>
+              <el-radio-button label="否" :value="0"></el-radio-button>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="数据是否上送" :label-width="100">
+            <el-radio-group v-model="formContent.tranFlag" >
+              <el-radio-button label="是" :value="1"></el-radio-button>
+              <el-radio-button label="否" :value="0"></el-radio-button>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+      </div>
+      <template #footer>
+        <div class='dialog-footer'>
+          <el-button @click='close()'>取消</el-button>
+          <el-button type='primary' @click='save()'>
+            保存
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </template>
+  <script setup lang='ts'>
+  import { dialogMiddle } from '@/utils/elementBind'
+  import { type Dict } from '@/api/system/dictionary/interface'
+  import { ElMessage, type FormItemRule } from 'element-plus'
+  import { addDictPq, updateDictPq } from '@/api/system/dictionary/dictPq'
+  import { computed, type Ref, ref } from 'vue';
+  import { useDictStore } from '@/stores/modules/dict'
+  const dictStore = useDictStore()
+  // 定义弹出组件元信息
+  const dialogFormRef = ref()
+
+  function useMetaInfo() {
+    const dialogVisible = ref(false)
+    const titleType = ref('add')
+    const formContent = ref<Dict.ResDictPq>({
+      id: '',
+      name: '',
+      phase: '',
+      sort: 100,
+      dataType: '',
+      state: 1,
+    })
+    return { dialogVisible, titleType, formContent }
+  }
+  
+  const { dialogVisible, titleType, formContent } = useMetaInfo()
+  
+  // 清空formContent
+  const resetFormContent = () => {
+    formContent.value = {
+      id: '',
+      name: '',
+      phase: '',
+      sort: 100,
+      dataType: '',
+      state: 1,
+    }
+  }
+  
+  let dialogTitle = computed(() => {
+    return titleType.value === 'add' ? '新增字典类型' : '编辑字典类型'
+  })
+  
+  // 定义表单校验规则
+  const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
+    name: [{ required: true, message: '类型名称必填！', trigger: 'blur' }],
+    code: [{ required: true, message: '类型编码必填！', trigger: 'blur' }],
+  })
+  
+  
+  // 关闭弹窗
+  const close = () => {
+    dialogVisible.value = false
+    // 清空dialogForm中的值
+    resetFormContent()
+    // 重置表单
+    dialogFormRef.value?.resetFields()
+  }
+  
+  // 保存数据
+  const save = () => {
+    try {
+      dialogFormRef.value?.validate(async (valid: boolean) => {
+        if (valid) {
+          if (formContent.value.id) {
+            await updateDictPq(formContent.value)
+          } else {
+            await addDictPq(formContent.value)
+          }
+          ElMessage.success({ message: `${dialogTitle.value}成功！` })
+          close()
+          // 刷新表格
+          await props.refreshTable!()
+        }
+      })
+    } catch (err) {
+      console.error('验证过程中出现错误', err)
+    }
+  }
+  
+  // 打开弹窗，可能是新增，也可能是编辑
+  const open = (sign: string, data: Dict.ResDictType) => {
+    titleType.value = sign
+    dialogVisible.value = true
+    if (data.id) {
+      formContent.value = { ...data }
+    } else {
+      resetFormContent()
+    }
+  }
+  
+  // 对外映射
+  defineExpose({ open })
+  const props = defineProps<{
+    refreshTable: (() => Promise<void>) | undefined;
+  }>()
+  
+  </script>

frontend/src/views/system/dictionary/dictPq/index.vue

@@ -0,0 +1,154 @@
+<template>
+    <div class='table-box' ref='popupBaseView'>
+      <ProTable
+          ref='proTable'
+          :columns='columns'
+          :request-api='getDictPqList'
+      >
+        <template #tableHeader='scope'>
+          <el-button type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
+          <el-button type='danger' :icon='Delete' plain :disabled='!scope.isSelected'
+                     @click='batchDelete(scope.selectedListIds)'>
+            批量删除
+          </el-button>
+        </template>
+  
+        <template #operation='scope'>
+          <el-button type='primary' link :icon='EditPen' @click="openDialog('edit', scope.row)">编辑</el-button>
+          <el-button type='primary' link :icon='Delete' @click='handleDelete(scope.row)'>删除</el-button>
+        </template>
+      </ProTable>
+    </div>
+    <pq-popup :refresh-table='proTable?.getTableList' ref='pqPopup'/>
+  </template>
+  
+  <script setup lang='tsx' name='dict'>
+  import {CirclePlus, Delete, EditPen, Download, View} from '@element-plus/icons-vue'
+  import {Dict} from '@/api/system/dictionary/interface'
+  import {ProTableInstance, ColumnProps} from '@/components/ProTable/interface'
+  import PqPopup from '@/views/system/dictionary/dictPq/components/pqPopup.vue'
+  import {useDictStore} from '@/stores/modules/dict'
+  import {useHandleData} from '@/hooks/useHandleData'
+  import {
+    getDictPqList,
+    deleteDictPq,
+  } from '@/api/system/dictionary/dictPq'
+  import { reactive, ref } from 'vue'
+
+  const dictStore = useDictStore()
+
+  const proTable = ref<ProTableInstance>()
+  const pqPopup = ref()
+ 
+  
+
+
+  const columns = reactive<ColumnProps<Dict.ResDictPq>[]>([
+    {type: 'selection', fixed: 'left', width: 70},
+    {type: 'index', fixed: 'left', width: 70, label: '序号'},
+    {
+      prop: 'dataType',
+      label: '数据模型',
+      width: 180,
+      search: {
+        el: 'select',
+      },
+    },
+    {
+      prop: 'name',
+      label: '指标名称',
+      width: 180,
+      search: {
+        el: 'input',
+      },
+    },
+    {
+      prop: 'otherName',
+      label: '别名',
+      minWidth: 300,
+      search: {
+        el: 'input',
+      },
+    },
+    {
+      prop: 'showName',
+      label: '显示名称',
+      width: 180,
+      search: {
+        el: 'input',
+      },
+    },
+    {
+      prop: 'phase',
+      label: '相别',
+      width: 180,
+    },
+    {
+      prop: 'phase',
+      label: '单位',
+      width: 180,
+    },
+    {
+      prop: 'type',
+      label: '指标数据类型',
+      width: 180,
+    },
+    {
+      prop: 'harmStart',
+      label: '数据谐波次数',
+      width: 180,
+      render: (scope) => {
+        return scope.row.harmStart 
+        ? `${scope.row.harmStart}-${scope.row.harmEnd}` 
+        : '/'; // 如果 harmStart 为空，返回 \
+    },
+    },
+    {
+      prop: 'statMethod',
+      label: '数据统计类型',
+      width: 180,
+    },    
+    {
+      prop: 'classId',
+      label: '数据表表名',
+      width: 180,
+    },
+    {
+      prop: 'resourcesId',
+      label: '报表数据来源',
+      width: 180,
+    },
+    {
+      prop: 'operation',
+      label: '操作',
+      fixed: 'right',
+      width: 330,
+    },
+  ])
+  
+  
+  // 打开 drawer(新增、编辑)
+  const openDialog = (titleType: string, row: Partial<Dict.ResDictPq> = {}) => {
+    pqPopup.value?.open(titleType, row)
+    
+  }
+  
+ 
+  
+  // 批量删除字典类型
+  const batchDelete = async (id: string[]) => {
+    await useHandleData(deleteDictPq, id, '删除所选字典类型')
+    proTable.value?.clearSelection()
+    proTable.value?.getTableList()
+  }
+  
+  // 删除字典类型
+  const handleDelete = async (params: Dict.ResDictPq) => {
+    await useHandleData(deleteDictPq, [params.id], `删除【${params.name}】指标字典类型`)
+    proTable.value?.getTableList()
+  }
+  
+
+  
+  </script>
+  

frontend/src/views/system/dictionary/dictType/index.vue

@@ -22,7 +22,7 @@
     </ProTable>
   </div>
   <DictData :width='viewWidth' :height='viewHeight' ref='openView'/>
-  <type-popup :refresh-table='proTable?.getTableList' ref='typePopup'/>
+  <TypePopup :refresh-table='proTable?.getTableList' ref='typePopup'/>
 </template>
 
 <script setup lang='tsx' name='dict'>
@@ -58,7 +58,7 @@ const columns = reactive<ColumnProps<Dict.ResDictType>[]>([
     },
   },
   {
-    prop: 'code',
+    prop:  'code',
     label: '类型编码',
     width: 180,
     search: {