feat: 指标模版修改

src/api/obj/metrics.js

@@ -57,3 +57,10 @@ export function putMetrics(data){
         data: data
     })
 }
+
+export function metricsConf(objId) {
+    return request({
+        url: '/obj/obj/metrics/conf/' + objId,
+        method: 'get'
+    })
+}

src/views/index/widget/alarmRanking.vue

@@ -17,7 +17,7 @@
         <span class="alarm-num">{{item.num}}</span>
       </div>
       <div class="alarm-progress">
-        <div class="progress" :style="`width:${(item.alarm/maxValue)*100}%`" />
+        <div class="progress" :style="`width:${(item.num/maxValue)*100}%`" />
       </div>
     </div>
   </div>
@@ -36,8 +36,8 @@ onMounted(()=>{
 })
 async function getAlarm(){
   const res = await objAlarm()
-  alarmData.value = res.data.data.sort((a,b)=>b.alarm - a.alarm)
-  maxValue.value = Math.max(...alarmData.value.map(item=>item.alarm))+20
+  alarmData.value = res.data.data.sort((a,b)=>b.num - a.num)
+  maxValue.value = Math.max(...alarmData.value.map(item=>item.num))+20
 }
 
 function target(){

src/views/ms/mstpl/component/editIndicator.vue

@@ -10,25 +10,25 @@
         </el-form-item>
       </el-col>
       <el-col :span="12">
-        <el-form-item label="自动发现" prop="findFlag">
+        <el-form-item label="指标编码">{{ rowsInfo.metricsDef.metricsCode }}</el-form-item>
+      </el-col>
+      <el-col :span="12">
+        <el-form-item label="自动发现" prop="findFlag" v-if="!disabled">
           <el-select v-model="form.findFlag">
             <el-option v-for="item in sys_yes_no" :key="item.value" :label="item.label" :value="item.value"/>
           </el-select>
         </el-form-item>
       </el-col>
-      <el-col :span="12">
-        <el-form-item label="指标编码">{{ rowsInfo.metricsDef.metricsCode }}</el-form-item>
-      </el-col>
     </el-row>
-    <el-form-item label="数据接口配置" prop="dataExp">
+    <el-form-item label="数据接口配置" prop="dataExp" v-if="!disabled">
       <el-input type="textarea" v-model="form.dataExp" placeholder="请输入数据接口配置" :autosize="{minRows: 3}"
                 style="width:342px;margin-right:10px;"/>
-      <el-button type="primary">公式组装</el-button>
+      <el-button type="primary" @click="handleConfigKey">公式组装</el-button>
     </el-form-item>
-    <el-form-item label="自动发现规则" prop="findRule">
+    <el-form-item label="自动发现规则" prop="findRule" v-if="!disabled">
       <el-input v-model="form.findRule" type="textarea" :autosize="{minRows: 3}" placeholder="请输入自动发现规则"/>
     </el-form-item>
-    <el-form-item label="关键字" prop="findKey">
+    <el-form-item label="关键字" prop="findKey" v-if="!disabled">
       <el-input v-model="form.findKey" placeholder="请输入关键字"/>
     </el-form-item>
     <el-row :gutter="10">
@@ -61,10 +61,21 @@
 </template>
 <script setup lang="ts">
 import {updateDetail} from "@/api/metrics/detail";
+import {updateMc} from "@/api/biz/mc"
 
 const {proxy, emit} = getCurrentInstance()
 const {metrics_category, sys_yes_no} = proxy.useDict("metrics_category", "sys_yes_no")
-const props = defineProps(["rowsInfo"])
+const props = defineProps({
+  rowsInfo: {
+    type: Object,
+    default: () => {
+    }
+  },
+  mc: {
+    type: Boolean,
+    default: false
+  }
+})
 const form = ref({
   dataExp: "",
   findFlag: "",
@@ -76,6 +87,8 @@ const form = ref({
   event: ""
 })
 const passValidate = ref(true)
+
+const disabled = computed(() => props.rowsInfo.metricsDef.metricsType === "1")
 const rules = {
   dataExp: {required: true, message: '请输入数据接口配置', trigger: 'change'},
   findRule: {required: true, message: '请选择自动发现规则', trigger: 'change'},
@@ -83,6 +96,14 @@ const rules = {
   findFlag: {required: true, message: '请选择自动发现', trigger: 'change'}
 }
 
+const handleConfigKey = () => {
+  proxy.getConfigKey("pm.web.url").then(res => {
+    if (res.code === 200) {
+      window.open(res.msg, '_blank');
+    }
+  })
+}
+
 const checkInput = (range) => {
   passValidate.value = validateRange(range)
   if (!passValidate.value) {
@@ -137,7 +158,8 @@ const handleSubmit = () => {
 // 更新
 const handleUpdate = (row) => {
   if (!passValidate.value) return proxy.$message.error("区间无效,请检查")
-  updateDetail({...row}).then(res => {
+  const request = props.mc ? updateMc : updateDetail
+  request({...row}).then(res => {
     proxy.$modal.msgSuccess("修改成功");
     emit("reload")
   })

src/views/ms/mstpl/component/indicatorManger.vue

@@ -6,13 +6,13 @@
     <el-col :span="24">
       <el-table v-loading="loading" :data="listData" border size="small">
         <el-table-column label="指标ID" align="center" prop="metricsId" width="80"/>
-        <el-table-column label="指标分类" align="left" width="160">
-          <template #default="scope">
-            <span v-for="(item,i) in scope.row.metricsDef.metricsTypes" :key="`${scope.$index}_${item}`">
-              {{ item.typeName }}<span v-if="i!==scope.row.metricsTypes.length-1">、</span>
-            </span>
-          </template>
-        </el-table-column>
+<!--        <el-table-column label="指标分类" align="left" width="160">-->
+<!--          <template #default="scope">-->
+<!--            <span v-for="(item,i) in scope.row.metricsDef.metricsTypes" :key="`${scope.$index}_${item}`">-->
+<!--              {{ item.typeName }}<span v-if="i!==scope.row.metricsTypes.length-1">、</span>-->
+<!--            </span>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
         <el-table-column label="指标名称" align="left">
           <template #default="scope">
             {{ scope.row.metricsDef.metricsName }}

src/views/obj/obj/component/addComponent.vue

@@ -10,7 +10,7 @@
   <div class="step-row">
     <el-button type="primary" @click="active--" v-if="active > 0">上一步</el-button>
     <el-button type="primary" @click="handleSave">{{ stepArray.length - 1 === active ? '提交' : '下一步' }}</el-button>
-    <el-button type="primary"  v-if="stepArray.length - 1 === active" @click="visible=true">导入接口配置</el-button>
+<!--    <el-button type="primary"  v-if="stepArray.length - 1 === active" @click="visible=true">导入接口配置</el-button>-->
   </div>
   <el-dialog v-model="visible" title="接口导入配置" width="600">
     <setting-file v-model:visible="visible" :rowId="rowId" @reload="reload"/>

src/views/obj/obj/component/metricsConfig.vue

@@ -9,12 +9,13 @@
     <el-form-item label="指标编码">
       {{form.metricsCode || '-'}}
     </el-form-item>
-    <el-form-item label="数据接口配置">
-      <el-input type="textarea" placeholder="请输入数据接口配置" v-model="form.dataExp" show-word-limit maxlength="900" :autosize="{ minRows: 4, maxRows: 6 }" />
+    <el-form-item label="公式解析结果">
+      {{form.dataExp}}
+<!--      <el-input type="textarea" placeholder="请输入数据接口配置" v-model="form.dataExp" show-word-limit maxlength="900" :autosize="{ minRows: 4, maxRows: 6 }" />-->
 
     </el-form-item>
     <el-form-item label="">
-      <el-button type="primary" @click="handleConfigKey">公式组装</el-button>
+<!--      <el-button type="primary" @click="handleConfigKey">公式组装</el-button>-->
       <el-button type="primary" @click="onTest">测试</el-button>
       <span v-if="validateError===1" style="color:#1ab394;margin-left:10px;">
         数据获取正常,当前值:{{currentValue}}

src/views/obj/obj/component/metricsList.vue

@@ -1,37 +1,16 @@
 <template>
   <el-table :data="listData" border size="small" style="margin:10px 0" max-height="450">
     <el-table-column label="指标ID" align="center" prop="metricsId" width="80"/>
-    <el-table-column label="指标分类" align="left" width="160">
-      <template #default="scope">
-            <span v-for="(item,i) in scope.row.metricsDef.metricsTypes" :key="`${scope.$index}_${item}`">
-              {{ item.typeName }}<span v-if="scope.row.metricsTypes && i!==scope.row.metricsTypes.length-1">、</span>
-            </span>
-      </template>
-    </el-table-column>
     <el-table-column label="指标名称" align="left">
       <template #default="scope">
-        {{ scope.row.metricsDef.metricsName }}
+        {{ scope.row.metricsName }}
       </template>
     </el-table-column>
     <el-table-column label="指标编码" align="left" prop="metricsCode" width="160"/>
-    <el-table-column label="告警-低" align="left" width="80">
-      <template #default="scope">
-        <el-input v-model="scope.row.alarmLow" size="small" v-if="edit"/>
-        <span v-else>{{ scope.row.alarmLow }}</span>
-      </template>
-    </el-table-column>
-    <el-table-column label="告警-中" align="left" width="80">
-      <template #default="scope">
-        <el-input v-model="scope.row.alarmMid" size="small" v-if="edit"/>
-        <span v-else>{{scope.row.alarmMid}}</span>
-      </template>
-    </el-table-column>
-    <el-table-column label="告警-高" align="left" width="80">
-      <template #default="scope">
-        <el-input v-model="scope.row.alarmHigh" size="small" v-if="edit" />
-        <span v-else>{{scope.row.alarmHigh}}</span>
-      </template>
-    </el-table-column>
+    <el-table-column label="告警-低" align="left" width="80" prop="alarmLow" />
+    <el-table-column label="告警-中" align="left" width="80" prop="alarmMid" />
+    <el-table-column label="告警-高" align="left" width="80" prop="alarmHigh" />
+    <el-table-column label="健康事件" align="left" width="80" prop="event" />
     <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="180">
       <template #default="scope">
         <slot name="operation" :row="scope.row" />
@@ -42,5 +21,3 @@
 <script setup lang="ts">
 const props = defineProps(['listData','edit'])
 </script>
-<style scoped lang="scss">
-</style>

src/views/obj/obj/component/step1.vue

@@ -1,7 +1,7 @@
 <template>
-  <el-form ref="objRef" :model="form" :rules="rules" label-width="80px">
+  <el-form ref="objRef" :model="form" :rules="rules" label-width="150px">
     <el-row :gutter="20">
-      <el-col :span="12">
+      <el-col :span="24">
         <el-form-item label="业务类型" prop="objType">
           <el-select v-model="form.objType" placeholder="请选择业务类型" style="width: 100%">
             <el-option
@@ -13,41 +13,12 @@
           </el-select>
         </el-form-item>
       </el-col>
-      <el-col :span="12">
-        <el-form-item label="应用程序" :rules="{required: true, message: '应用程序不能为空', trigger: 'blur'}"
-                      v-if="form.objType==1">
-          <el-select
-              v-model="form.appId"
-              filterable
-              remote
-              reserve-keyword
-              placeholder="请输入应用程序名称"
-              remote-show-suffix
-              :remote-method="remoteMethod"
-              :loading="loading"
-              style="width: 100%"
-          >
-            <el-option
-                v-for="item in options"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-            />
-          </el-select>
-        </el-form-item>
-      </el-col>
     </el-row>
     <el-form-item label="对象名称" prop="objName">
       <el-input v-model="form.objName" placeholder="请输入对象名称"/>
     </el-form-item>
-    <el-form-item label="IP地址" prop="objAddr">
-      <el-input v-model="form.objAddr" placeholder="请输入IP地址"/>
-    </el-form-item>
-    <el-form-item label="端口" prop="objPort">
-      <el-input v-model="form.objPort" placeholder="请输入端口"/>
-    </el-form-item>
-    <el-form-item label="备注">
-      <el-input v-model="form.remark" type="textarea" placeholder="请输入备注" :autosize="{maxRows:6,minRows:3}" maxlength="300" show-word-limit/>
+    <el-form-item label="对象实例(instance)" prop="objAddr">
+      <el-input v-model="form.objAddr" placeholder="请输入对象实例"/>
     </el-form-item>
   </el-form>
 </template>
@@ -71,10 +42,7 @@ const rules = {
     {required: true, message: "对象名称不能为空", trigger: "blur"}
   ],
   objAddr: [
-    {required: true, message: "IP地址不能为空", trigger: "blur"}
-  ],
-  objPort: [
-    {required: true, message: "端口不能为空", trigger: "blur"}
+    {required: true, message: "对象实例不能为空", trigger: "blur"}
   ],
 }
 
@@ -152,5 +120,3 @@ const submitForm = () => {
 defineExpose({resetForm, submitForm})
 
 </script>
-<style scoped lang="scss">
-</style>

src/views/obj/obj/component/step3.vue

@@ -6,7 +6,7 @@
   </el-row>
   <metrics-list :listData="listData" :edit="true">
     <template #operation="scope">
-      <el-button link type="primary" icon="Edit" @click="handleUpdateMetrics(scope.row)">保存</el-button>
+      <el-button link type="primary" icon="Edit" @click="handleEdit(scope.row)">修改</el-button>
       <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
     </template>
   </metrics-list>
@@ -17,70 +17,78 @@
       </template>
     </metrics-list>
   </el-dialog>
+
+  <el-dialog title="指标修改" v-model="visible" width="600" append-to-body>
+    <edit-indicator :rowsInfo="rowsInfo" ref="eiRef" @close="visible=false" @reload="queryList" :mc="true"/>
+  </el-dialog>
+
 </template>
 <script setup lang="ts">
 import {onMounted, ref} from "vue";
 import metricsList from "./metricsList.vue"
-const {proxy,emit} = getCurrentInstance()
-const props = defineProps(['rowId'])
-import {selectMetrics,addMetrics} from "@/api/obj/obj"
-import {listMetrics,delMetrics,updateMetrics} from '@/api/obj/metrics'
-const listData=ref([])
-const openDialog=ref(false)
-const addMetricsList=ref([])
-onMounted(()=>{
-  queryList()
-})
+import {addMetrics, selectMetrics} from "@/api/obj/obj"
+import {delMc, listMc} from '@/api/biz/mc'
+import {metricsConf} from "@/api/obj/metrics"
+import editIndicator from "../../../ms/mstpl/component/editIndicator.vue";
 
+const {proxy, emit} = getCurrentInstance()
+const props = defineProps(['rowId'])
 
+const listData = ref([])
+const openDialog = ref(false)
+const addMetricsList = ref([])
+const visible = ref(false)
+const rowsInfo = ref({})
 
+onMounted(() => {
+  queryList()
+})
 
-const queryList=()=>{
-  listMetrics({objId:props.rowId,tplId:-1}).then(res=>{
+const queryList = () => {
+  visible.value = false
+  listMc({objId: props.rowId}).then(res => {
     listData.value = res.rows
   })
 }
 
-const handleAddMetrics = row =>{
-  addMetrics(props.rowId,{metricsIds:row.metricsId}).then(()=>{
+const handleEdit = (row) => {
+  visible.value = true
+  rowsInfo.value = {...row}
+  proxy.$nextTick(() => {
+    proxy.$refs.eiRef.editData(row)
+  })
+}
+
+const handleAddMetrics = row => {
+  addMetrics(props.rowId, {metricsIds: row.metricsId}).then(() => {
     handleSelect()
     queryList()
   })
 }
 
-const handleSelect=()=>{
+const handleSelect = () => {
   openDialog.value = true
-  selectMetrics(props.rowId).then(res=>{
-    addMetricsList.value = res.rows.map(p=>{
+  selectMetrics(props.rowId).then(res => {
+    addMetricsList.value = res.rows.map(p => {
       return {
         ...p,
-        metricsDef:p
+        metricsDef: p
       }
     })
   })
 }
 
-const handleDelete=(row:any)=>{
-  if(row.objMetricsId){
-    delMetrics(row.objMetricsId).then(res=>{
-      proxy.$modal.msgSuccess(res.msg);
-      queryList()
-    })
-  }
-}
-
-const handleUpdateMetrics=(row)=>{
-  updateMetrics(row).then((res)=>{
+const handleDelete = (row: any) => {
+  delMc(row.mcId).then(res => {
     proxy.$modal.msgSuccess(res.msg);
+    queryList()
   })
 }
 
-const submitForm=()=>{
+const submitForm = async () => {
+  await metricsConf(props.rowId)
   emit("nextStep", 1)
 }
 
 defineExpose({submitForm})
-
 </script>
-<style scoped lang="scss">
-</style>

src/views/obj/obj/component/step4.vue

@@ -12,7 +12,7 @@
       </el-button>
     </template>
   </metrics-list>
-  <el-dialog title="选择指标" v-model="openDialog" :width="1000" append-to-body style="top:15vh">
+  <el-dialog title="配置指标" v-model="openDialog" :width="1000" append-to-body style="top:8vh">
     <metrics-config :metrics="metricsRow"  @cancel="openDialog=false" @success="initData"/>
   </el-dialog>
 </template>