新增黄金指标,性能任务管理,修正历史活动告警

src/api/perfManage/goldTarget.ts

@@ -0,0 +1,69 @@
+import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
+import { request } from '@/plugins/http-fetch';
+import { parseObjLineToHump } from '@/utils/parse-utils';
+
+/**
+ * 查询日志列表
+ * @param query 查询参数
+ * @returns object
+ */
+export async function listgoldData(query: Record<string, any>) {
+  let totalSQL = 'select count(*) as total from gold_kpi where 1=1 ';
+  let rowsSQL = 'select * from gold_kpi where 1=1 ';
+
+  // 查询
+  let querySQL = '';
+  if (query.neType) {
+    querySQL += ` and ne_type like '%${query.neType}%' `;
+  }
+  if (query.beginTime) {
+    querySQL += ` and start_time >= '${query.beginTime}' `;
+  }
+  if (query.endTime) {
+    querySQL += ` and start_time <= '${query.endTime}' `;
+  }
+
+  // 排序
+  let sortSql = ' order by start_time ';
+  if (query.sortOrder === 'asc') {
+    sortSql += ' asc ';
+  } else {
+    sortSql += ' desc ';
+  }
+
+  // 分页
+  const pageNum = (query.pageNum - 1) * query.pageSize;
+  const limtSql = ` limit ${pageNum},${query.pageSize} `;
+
+  // 发起请求
+  const result = await request({
+    url: `/api/rest/databaseManagement/v1/select/omc_db/gold_kpi`,
+    method: 'get',
+    params: {
+      totalSQL: totalSQL + querySQL,
+      rowsSQL: rowsSQL + querySQL + sortSql + limtSql,
+    },
+  });
+
+  // 解析数据
+  if (result.code === RESULT_CODE_SUCCESS) {
+    const data: DataList = {
+      total: 0,
+      rows: [],
+      code: result.code,
+      msg: result.msg,
+    };
+    result.data.data.forEach((item: any) => {
+      const itemData = item['gold_kpi'];
+      if (Array.isArray(itemData)) {
+        if (itemData.length === 1 && itemData[0]['total'] >= 0) {
+          data.total = itemData[0]['total'];
+        } else {
+          data.rows = itemData.map(v => parseObjLineToHump(v));
+        }
+      }
+    });
+    return data;
+  }
+  return result;
+}

src/api/perfManage/perfData.ts

@@ -37,7 +37,7 @@ export async function listperfData(query: Record<string, any>) {
 
   // 发起请求
   const result = await request({
-    url: `/databaseManagement/v1/select/omc_db/measure_data`,
+    url: `/api/rest/databaseManagement/v1/select/omc_db/measure_data`,
     method: 'get',
     params: {
       totalSQL: totalSQL + querySQL,

src/api/perfManage/taskManage.ts

@@ -1,6 +1,7 @@
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import { request } from '@/plugins/http-fetch';
 import { parseObjLineToHump } from '@/utils/parse-utils';
+import { parseDateToStr } from '@/utils/date-utils';
 
 /**
  * 查询任务列表
@@ -23,7 +24,7 @@ export async function listPerfTask(query: Record<string, any>) {
 
   // 发起请求
   const result = await request({
-    url: `/databaseManagement/v1/select/omc_db/measure_task`,
+    url: `/api/rest/databaseManagement/v1/select/omc_db/measure_task`,
     method: 'get',
     params: {
       totalSQL: totalSQL + querySQL,
@@ -59,48 +60,99 @@ export async function listPerfTask(query: Record<string, any>) {
  * @param id 网元ID
  * @returns object
  */
-export async function getTraceTask(id: string | number) {
+export async function getPerfTask(id: string | number) {
   // 发起请求
   const result = await request({
-    url: `/databaseManagement/v1/select/omc_db/trace_task`,
+    url: `/api/rest/databaseManagement/v1/select/omc_db/measure_task`,
     method: 'get',
     params: {
-      SQL: `select * from trace_task where id = ${id}`,
+      SQL: `select * from measure_task where id = ${id}`,
     },
   });
   // 解析数据
   if (result.code === RESULT_CODE_SUCCESS && Array.isArray(result.data.data)) {
     let data = result.data.data[0];
     return Object.assign(result, {
-      data: parseObjLineToHump(data['trace_task'][0]),
+      data: parseObjLineToHump(data['measure_task'][0]),
     });
   }
   return result;
 }
 
 /**
- * 新增任务
+ * 新增性能测量任务
  * @param data 网元对象
  * @returns object
  */
-export function addTraceTask(data: Record<string, any>) {
+export function addPerfTask(data: Record<string, any>) {
+  var time = new Date();
+  var periods: any = [];
+  var scheduule: any = [];
+  //如果没选测量计划 则选择了测量时段也要置为空。因为二者是绑定关系
+  if (data.smPlan.length && data.bigPlan.length) {
+    data.periods.forEach((item: any) => {
+      periods.push({ Start: item.split(',')[0], End: item.split(',')[1] });
+    });
+    scheduule.push({ Type: data.bigPlan, Days: data.smPlan });
+  }
+
+  let obj: any = {
+    ne_type: data.neType,
+    ne_ids: JSON.stringify([data.neId]),
+    kpi_set: data.kpiSet,
+    schedule: JSON.stringify(scheduule),
+    start_time: data.startTime,
+    end_time: data.endTime,
+    granul_option: data.granulOption,
+    status: 'Inactive',
+    account_id: data.accountId,
+    create_time: parseDateToStr(time),
+    periods: JSON.stringify(periods),
+    comment: data.comment,
+  };
+
   return request({
-    url: `/traceManagement/v1/subscriptions`,
+    url: `/api/rest/databaseManagement/v1/omc_db/measure_task`,
     method: 'post',
-    data: data,
+    data: { measure_task: [obj] },
   });
 }
 
 /**
- * 修改任务
+ * 修改性能测量任务
  * @param data 网元对象
  * @returns object
  */
-export function updateTraceTask(data: Record<string, any>) {
+export function updatePerfTask(data: Record<string, any>) {
+  var time = new Date();
+  var periods: any = [];
+  var scheduule: any = [];
+  //如果没选测量计划 则选择了测量时段也要置为空。因为二者是绑定关系
+  if (data.smPlan.length && data.bigPlan.length) {
+    data.periods.forEach((item: any) => {
+      periods.push({ Start: item.split(',')[0], End: item.split(',')[1] });
+    });
+    scheduule.push({ Type: data.bigPlan, Days: data.smPlan });
+  }
+
+  let obj: any = {
+    ne_type: data.neType,
+    ne_ids: JSON.stringify([data.neId]),
+    kpi_set: data.kpiSet,
+    schedule: JSON.stringify(scheduule),
+    start_time: data.startTime,
+    end_time: data.endTime,
+    granul_option: data.granulOption,
+    status: 'Inactive',
+    account_id: data.accountId,
+    create_time: parseDateToStr(time),
+    periods: JSON.stringify(periods),
+    comment: data.comment,
+  };
   return request({
-    url: `/traceManagement/v1/subscriptions`,
+    url: `/api/rest/databaseManagement/v1/omc_db/measure_task?WHERE=id=${data.id}`,
     method: 'put',
-    data: data,
+    data: { measure_task: obj },
   });
 }
 
@@ -109,9 +161,11 @@ export function updateTraceTask(data: Record<string, any>) {
  * @param noticeId 网元ID
  * @returns object
  */
-export async function delTraceTask(id: string) {
+export async function delPerfTask(data: Record<string, any>) {
   return request({
-    url: `/traceManagement/v1/subscriptions?id=${id}`,
+    url: `/api/rest/performanceManagement/v1/elementType/${data.neType.toLowerCase()}/objectType/measureTask?id=${
+      data.id
+    }`,
     method: 'delete',
   });
 }
@@ -123,7 +177,7 @@ export async function delTraceTask(id: string) {
 export async function getNePerformanceList() {
   // 发起请求
   const result = await request({
-    url: `/databaseManagement/v1/elementType/omc_db/objectType/measure_title`,
+    url: `/api/rest/databaseManagement/v1/elementType/omc_db/objectType/measure_title`,
     method: 'get',
     params: {
       SQL: `SELECT * FROM measure_title`,
@@ -138,3 +192,28 @@ export async function getNePerformanceList() {
   }
   return result;
 }
+
+
+/**
+ * 激活任务
+ * @param
+ * @returns bolb
+ */
+export function taskRun(data: Record<string, any>) {
+  return request({
+    url: `/api/rest/performanceManagement/v1/elementType/${data.neType.toLowerCase()}/objectType/measureTask?ne_id=${JSON.parse(data.neIds)[0]}`,
+    method: 'post',
+  });
+}
+
+/**
+ * 挂起任务
+ * @param
+ * @returns bolb
+ */
+export function taskStop(data: Record<string, any>) {
+  return request({
+    url: `/api/rest/performanceManagement/v1/elementType/${data.neType.toLowerCase()}/objectType/measureTask?ne_id=${JSON.parse(data.neIds)[0]}`,
+    method: 'PATCH',
+  });
+}

src/i18n/locales/en-US.ts

@@ -213,6 +213,17 @@ export default {
         addUser: 'Creator',
         addTime: 'Creation time',
         granulOption:'Particle',
+        performanceList:'Performance Set',
+        period:'Measurement period',
+        plan:'Measuring plan',
+        performanceSelect:'Please select a performance measurement dataset',
+        delPerfTip: 'Are you sure to delete the data item with record number {num}',
+        delPerf: 'Successfully deleted task {num}',
+        viewTask:'View Task',
+        editTask:'Edit Task',
+        addTask:'Add Task',
+        stopTask:'Stop Task',
+        errorTaskInfo: 'Failed to obtain task information',
       },
     },
     traceManage: {

src/i18n/locales/zh-CN.ts

@@ -213,6 +213,17 @@ export default {
         addUser: '创建人',
         addTime: '创建时间',
         granulOption:'测量粒度',
+        performanceList:'性能测量数据集',
+        period:'测量时段',
+        plan:'测量计划',
+        performanceSelect:'请选择性能测量数据集',
+        delPerfTip:'确认删除记录编号为 {num} 的数据项?',
+        delPerf:'成功删除任务 {num}',
+        viewTask:'查看任务',
+        editTask:'修改任务',
+        addTask:'新增任务',
+        stopTask:'挂起',
+        errorTaskInfo: '获取任务信息失败',
       },
     },
     traceManage: {

src/views/faultManage/active-alarm/index.vue

@@ -477,6 +477,7 @@ function fnModalOk() {
       content: t('views.faultManage.activeAlarm.ackError'),
       duration: 3,
     });
+    modalState.confirmLoading = false;
     modalState.visibleByView = false;
     return false;
   }
@@ -660,25 +661,31 @@ function fnShowSet() {
  * 导出全部
  */
 function fnExportAll() {
-  const key = 'exportAlarm';
+  Modal.confirm({
-  message.loading({ content: '请稍等...', key });
+    title: 'Tip',
-  exportAll(queryParams).then(res => {
+    content: `确认是否导出全部活动告警信息?`,
-    if (res.code === RESULT_CODE_SUCCESS) {
+    onOk() {
-      message.success({
+      const key = 'exportAlarm';
-        content: `已完成导出`,
+      message.loading({ content: '请稍等...', key });
-        key,
+      exportAll(queryParams).then(res => {
-        duration: 3,
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success({
+            content: `已完成导出`,
+            key,
+            duration: 3,
+          });
+          writeSheet(res.data, 'alarm').then(fileBlob =>
+            saveAs(fileBlob, `alarm_${Date.now()}.xlsx`)
+          );
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            key,
+            duration: 3,
+          });
+        }
       });
-      writeSheet(res.data, 'alarm').then(fileBlob =>
+    },
-        saveAs(fileBlob, `alarm_${Date.now()}.xlsx`)
-      );
-    } else {
-      message.error({
-        content: `${res.msg}`,
-        key,
-        duration: 3,
-      });
-    }
   });
 }
 /**

src/views/faultManage/history-alarm/index.vue

@@ -386,6 +386,7 @@ function fnModalOk() {
       content: t('views.faultManage.activeAlarm.ackError'),
       duration: 3,
     });
+    modalState.confirmLoading = false;
     modalState.visibleByView = false;
     return false;
   }
@@ -465,25 +466,31 @@ function fnCancelConfirm() {
  * 导出全部
  */
 function fnExportAll() {
-  const key = 'exportAlarmHis';
+  Modal.confirm({
-  message.loading({ content: '请稍等...', key });
+    title: 'Tip',
-  exportAll(queryParams).then(res => {
+    content: `确认是否导出全部历史告警信息?`,
-    if (res.code === RESULT_CODE_SUCCESS) {
+    onOk() {
-      message.success({
+      const key = 'exportAlarmHis';
-        content: `已完成导出`,
+      message.loading({ content: '请稍等...', key });
-        key,
+      exportAll(queryParams).then(res => {
-        duration: 3,
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success({
+            content: `已完成导出`,
+            key,
+            duration: 3,
+          });
+          writeSheet(res.data, 'alarm').then(fileBlob =>
+            saveAs(fileBlob, `history-alarm_${Date.now()}.xlsx`)
+          );
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            key,
+            duration: 3,
+          });
+        }
       });
-      writeSheet(res.data, 'alarm').then(fileBlob =>
+    },
-        saveAs(fileBlob, `history-alarm_${Date.now()}.xlsx`)
-      );
-    } else {
-      message.error({
-        content: `${res.msg}`,
-        key,
-        duration: 3,
-      });
-    }
   });
 }
 

src/views/perfManage/goldTarget/index.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { reactive, onMounted, toRaw } from 'vue';
+import { useRoute } from 'vue-router';
+import { reactive, ref, onMounted, toRaw } from 'vue';
 import { PageContainer } from '@ant-design-vue/pro-layout';
 import { Modal } from 'ant-design-vue/lib';
 import { SizeType } from 'ant-design-vue/lib/config-provider';
@@ -7,17 +8,27 @@ import { MenuInfo } from 'ant-design-vue/lib/menu/src/interface';
 import { ColumnsType } from 'ant-design-vue/lib/table';
 import { parseDateToStr } from '@/utils/date-utils';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
-import { saveAs } from 'file-saver';
+import { listgoldData } from '@/api/perfManage/goldTarget';
+import useNeInfoStore from '@/store/modules/neinfo';
+import useDictStore from '@/store/modules/dict';
 import useI18n from '@/hooks/useI18n';
-import { getTraceRawInfo, listTraceData } from '@/api/traceManage/analysis';
+const { getDict } = useDictStore();
 const { t } = useI18n();
+const route = useRoute();
+
+/**路由标题 */
+let title = ref<string>((route.meta.title as string) ?? '标题');
+
+/**记录开始结束时间 */
+let queryRangePicker = ref<[string, string]>(['', '']);
 
 /**查询参数 */
 let queryParams = reactive({
-  /**移动号 */
+  /**网元类型 */
-  imsi: '',
+  neType: '',
-  /**移动号 */
+  /**记录时间 */
-  msisdn: '',
+  beginTime: '',
+  endTime: '',
   /**当前页数 */
   pageNum: 1,
   /**每页条数 */
@@ -27,10 +38,13 @@ let queryParams = reactive({
 /**查询参数重置 */
 function fnQueryReset() {
   queryParams = Object.assign(queryParams, {
-    imsi: '',
+    neType: '',
+    beginTime: '',
+    endTime: '',
     pageNum: 1,
     pageSize: 20,
   });
+  queryRangePicker.value = ['', ''];
   tablePagination.current = 1;
   tablePagination.pageSize = 20;
   fnGetList();
@@ -59,48 +73,28 @@ let tableState: TabeStateType = reactive({
 /**表格字段列 */
 let tableColumns: ColumnsType = [
   {
-    title: t('views.traceManage.analysis.trackTaskId'),
+    title: t('common.rowId'),
-    dataIndex: 'taskId',
+    dataIndex: 'id',
     align: 'center',
   },
   {
-    title: t('views.traceManage.analysis.imsi'),
+    title: '网元类型',
-    dataIndex: 'imsi',
+    dataIndex: 'neType',
     align: 'center',
   },
   {
-    title: t('views.traceManage.analysis.msisdn'),
+    title: '黄金指标项',
-    dataIndex: 'msisdn',
+    dataIndex: 'en_title',
     align: 'center',
   },
   {
-    title: t('views.traceManage.analysis.srcIp'),
+    title: '值',
-    dataIndex: 'srcAddr',
+    dataIndex: 'value',
     align: 'center',
   },
   {
-    title: t('views.traceManage.analysis.dstIp'),
+    title: '开始时间',
-    dataIndex: 'dstAddr',
+    dataIndex: 'startTime',
-    align: 'center',
-  },
-  {
-    title: t('views.traceManage.analysis.signalType'),
-    dataIndex: 'ifType',
-    align: 'center',
-  },
-  {
-    title: t('views.traceManage.analysis.msgType'),
-    dataIndex: 'msgType',
-    align: 'center',
-  },
-  {
-    title: t('views.traceManage.analysis.msgDirect'),
-    dataIndex: 'msgDirect',
-    align: 'center',
-  },
-  {
-    title: t('views.traceManage.analysis.rowTime'),
-    dataIndex: 'timestamp',
     align: 'center',
     customRender(opt) {
       if (!opt.value) return '';
@@ -108,9 +102,13 @@ let tableColumns: ColumnsType = [
     },
   },
   {
-    title: t('common.operate'),
+    title: '结束时间',
-    key: 'id',
+    dataIndex: 'endTime',
     align: 'center',
+    customRender(opt) {
+      if (!opt.value) return '';
+      return parseDateToStr(opt.value);
+    },
   },
 ];
 
@@ -147,11 +145,16 @@ function fnTableSize({ key }: MenuInfo) {
   tableState.size = key as SizeType;
 }
 
-/**查询备份信息列表 */
+/**查询黄金指标列表 */
 function fnGetList() {
   if (tableState.loading) return;
   tableState.loading = true;
-  listTraceData(toRaw(queryParams)).then(res => {
+  if (!queryRangePicker.value) {
+    queryRangePicker.value = ['', ''];
+  }
+  queryParams.beginTime = queryRangePicker.value[0];
+  queryParams.endTime = queryRangePicker.value[1];
+  listgoldData(toRaw(queryParams)).then(res => {
     if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.rows)) {
       tablePagination.total = res.total;
       tableState.data = res.rows;
@@ -160,176 +163,9 @@ function fnGetList() {
   });
 }
 
-/**抽屉对象信息状态类型 */
-type ModalStateType = {
-  /**抽屉框是否显示 */
-  visible: boolean;
-  /**标题 */
-  title: string;
-  /**表单数据 */
-  from: Record<string, any>;
-};
-
-/**抽屉对象信息状态 */
-let modalState: ModalStateType = reactive({
-  visible: false,
-  title: '',
-  from: {
-    rawData: '',
-    rawDataHTML: '',
-    downBtn: false,
-  },
-});
-
-/**
- * 对话框弹出显示
- * @param row 记录信息
- */
-function fnModalVisible(row: Record<string, any>) {
-  // 进制转数据
-  const hexString = parseBase64Data(row.rawMsg);
-  const rawData = convertToReadableFormat(hexString);
-  modalState.from.rawData = rawData;
-  // RAW解析HTML
-  getTraceRawInfo(row.id).then(res => {
-    if (res.code === RESULT_CODE_SUCCESS) {
-      const htmlString = rawDataHTMLScript(res.msg);
-      modalState.from.rawDataHTML = htmlString;
-      modalState.from.downBtn = true;
-    } else {
-      modalState.from.rawDataHTML = t('views.traceManage.analysis.noData');
-    }
-  });
-  modalState.title = t('views.traceManage.analysis.taskTitle', {
-    num: row.imsi,
-  });
-  modalState.visible = true;
-}
-
-/**
- * 对话框弹出关闭
- */
-function fnModalVisibleClose() {
-  modalState.visible = false;
-  modalState.from.downBtn = false;
-  modalState.from.rawDataHTML = '';
-  modalState.from.rawData = '';
-}
-
-// 将Base64编码解码为字节数组
-function parseBase64Data(hexData: string) {
-  // 将Base64编码解码为字节数组
-  const byteString = atob(hexData);
-  const byteArray = new Uint8Array(byteString.length);
-  for (let i = 0; i < byteString.length; i++) {
-    byteArray[i] = byteString.charCodeAt(i);
-  }
-
-  // 将每一个字节转换为2位16进制数表示，并拼接起来
-  let hexString = '';
-  for (let i = 0; i < byteArray.length; i++) {
-    const hex = byteArray[i].toString(16);
-    hexString += hex.length === 1 ? '0' + hex : hex;
-  }
-  return hexString;
-}
-
-// 转换十六进制字节流为可读格式和ASCII码表示
-function convertToReadableFormat(hexString: string) {
-  let result = '';
-  let asciiResult = '';
-  let arr = [];
-  let row = 100;
-  for (let i = 0; i < hexString.length; i += 2) {
-    const hexChars = hexString.substring(i, i + 2);
-    const decimal = parseInt(hexChars, 16);
-    const asciiChar =
-      decimal >= 32 && decimal <= 126 ? String.fromCharCode(decimal) : '.';
-
-    result += hexChars + ' ';
-    asciiResult += asciiChar;
-
-    if ((i + 2) % 32 === 0) {
-      arr.push({
-        row: row,
-        code: result,
-        asciiText: asciiResult,
-      });
-      result = '';
-      asciiResult = '';
-      row += 10;
-    }
-    if (2 + i == hexString.length) {
-      arr.push({
-        row: row,
-        code: result,
-        asciiText: asciiResult,
-      });
-      result = '';
-      asciiResult = '';
-      row += 10;
-    }
-  }
-  return arr;
-}
-
-// 信息详情HTMl内容处理
-function rawDataHTMLScript(htmlString: string) {
-  // 删除所有 <a> 标签
-  // const withoutATags = htmlString.replace(/<a\b[^>]*>(.*?)<\/a>/gi, '');
-  // 删除所有 <script> 标签
-  let withoutScriptTags = htmlString.replace(
-    /<script\b[^>]*>([\s\S]*?)<\/script>/gi,
-    ''
-  );
-  // 默认全展开
-  // const withoutHiddenElements = withoutScriptTags.replace(
-  //   /style="display:none"/gi,
-  //   'style="background:#ffffff"'
-  // );
-
-  function set_node(node: any, str: string) {
-    if (!node) return;
-    node.style.display = str;
-    node.style.background = '#ffffff';
-  }
-  Reflect.set(window, 'set_node', set_node);
-  function toggle_node(node: any) {
-    node = document.getElementById(node);
-    if (!node) return;
-    set_node(node, node.style.display != 'none' ? 'none' : 'block');
-  }
-  Reflect.set(window, 'toggle_node', toggle_node);
-  function hide_node(node: any) {
-    node = document.getElementById(node);
-    if (!node) return;
-    set_node(node, 'none');
-  }
-  Reflect.set(window, 'hide_node', hide_node);
-
-  // 展开第一个
-  withoutScriptTags = withoutScriptTags.replace(
-    'id="f1c" style="display:none"',
-    'id="f1c" style="display:block"'
-  );
-  return withoutScriptTags;
-}
-
-/**信息文件下载 */
-function fnDownloadFile() {
-  Modal.confirm({
-    title: t('common.tipTitle'),
-    content: t('views.traceManage.analysis.taskDownTip'),
-    onOk() {
-      const blob = new Blob([modalState.from.rawDataHTML], {
-        type: 'text/plain',
-      });
-      saveAs(blob, `${modalState.title}_${Date.now()}.html`);
-    },
-  });
-}
-
 onMounted(() => {
+  // 获取网元网元列表
+  useNeInfoStore().fnNelist();
   // 获取列表数据
   fnGetList();
 });
@@ -346,29 +182,30 @@ onMounted(() => {
       <a-form :model="queryParams" name="queryParams" layout="horizontal">
         <a-row :gutter="16">
           <a-col :lg="6" :md="12" :xs="24">
-            <a-form-item
+            <a-form-item label="网元类型" name="neType">
-              :label="t('views.traceManage.analysis.imsi')"
+              <a-auto-complete
-              name="imsi"
+                v-model:value="queryParams.neType"
-            >
+                :options="useNeInfoStore().getNeSelectOtions"
-              <a-input
+                allow-clear
-                v-model:value="queryParams.imsi"
+                placeholder="查询网元类型"
-                :allow-clear="true"
+              />
-                :placeholder="t('views.traceManage.analysis.imsiPlease')"
-              ></a-input>
             </a-form-item>
           </a-col>
-          <a-col :lg="6" :md="12" :xs="24">
+          <a-col :lg="8" :md="12" :xs="24">
-            <a-form-item
+            <a-form-item label="开始时间" name="queryRangePicker">
-              :label="t('views.traceManage.analysis.msisdn')"
+              <a-range-picker
-              name="imsi"
+                v-model:value="queryRangePicker"
-            >
+                allow-clear
-              <a-input
+                bordered
-                v-model:value="queryParams.msisdn"
+                show-time
-                :allow-clear="true"
+                value-format="YYYY-MM-DD HH:mm:ss"
-                :placeholder="t('views.traceManage.analysis.msisdnPlease')"
+                format="YYYY-MM-DD HH:mm:ss"
-              ></a-input>
+                :placeholder="['开始', '结束']"
+                style="width: 100%"
+              ></a-range-picker>
             </a-form-item>
           </a-col>
+
           <a-col :lg="6" :md="12" :xs="24">
             <a-form-item>
               <a-space :size="8">
@@ -411,7 +248,7 @@ onMounted(() => {
           </a-tooltip>
           <a-tooltip>
             <template #title>{{ t('common.sizeText') }}</template>
-            <a-dropdown trigger="click">
+            <a-dropdown trigger="click" placement="bottomRight">
               <a-button type="text">
                 <template #icon><ColumnHeightOutlined /></template>
               </a-button>
@@ -420,15 +257,15 @@ onMounted(() => {
                   :selected-keys="[tableState.size as string]"
                   @click="fnTableSize"
                 >
-                  <a-menu-item key="default">{{
+                  <a-menu-item key="default">
-                    t('common.size.default')
+                    {{ t('common.size.default') }}
-                  }}</a-menu-item>
+                  </a-menu-item>
-                  <a-menu-item key="middle">{{
+                  <a-menu-item key="middle">
-                    t('common.size.middle')
+                    {{ t('common.size.middle') }}
-                  }}</a-menu-item>
+                  </a-menu-item>
-                  <a-menu-item key="small">{{
+                  <a-menu-item key="small">
-                    t('common.size.small')
+                    {{ t('common.size.small') }}
-                  }}</a-menu-item>
+                  </a-menu-item>
                 </a-menu>
               </template>
             </a-dropdown>
@@ -448,57 +285,15 @@ onMounted(() => {
         :scroll="{ x: true }"
       >
         <template #bodyCell="{ column, record }">
-          <template v-if="column.key === 'id'">
+          <template v-if="column.key === 'alarmTitle'">
-            <a-space :size="8" align="center">
+            <a-tooltip>
-              <a-tooltip>
+              <template #title>{{ record.operResult }}</template>
-                <template #title>查看详情</template>
+              <div class="alarmTitleText">{{ record.alarmTitle }}</div>
-                <a-button type="link" @click.prevent="fnModalVisible(record)">
+            </a-tooltip>
-                  <template #icon><ProfileOutlined /></template>
-                </a-button>
-              </a-tooltip>
-            </a-space>
           </template>
         </template>
       </a-table>
     </a-card>
-
-    <!-- 详情框 -->
-    <a-modal
-      width="800px"
-      :title="modalState.title"
-      :visible="modalState.visible"
-      @cancel="fnModalVisibleClose"
-    >
-      <div class="raw-title">
-        {{ t('views.traceManage.analysis.signalData') }}
-      </div>
-      <a-row
-        class="raw"
-        :gutter="16"
-        v-for="v in modalState.from.rawData"
-        :key="v.row"
-      >
-        <a-col class="num" :span="2">{{ v.row }}</a-col>
-        <a-col class="code" :span="12">{{ v.code }}</a-col>
-        <a-col class="txt" :span="10">{{ v.asciiText }}</a-col>
-      </a-row>
-      <a-divider />
-      <div class="raw-title">
-        {{ t('views.traceManage.analysis.signalDetail') }}
-        <a-button
-          type="dashed"
-          size="small"
-          @click.prevent="fnDownloadFile"
-          v-if="modalState.from.downBtn"
-        >
-          <template #icon>
-            <DownloadOutlined />
-          </template>
-          {{ t('views.traceManage.analysis.taskDownText') }}
-        </a-button>
-      </div>
-      <div class="raw-html" v-html="modalState.from.rawDataHTML"></div>
-    </a-modal>
   </PageContainer>
 </template>
 
@@ -506,26 +301,8 @@ onMounted(() => {
 .table :deep(.ant-pagination) {
   padding: 0 24px;
 }
-
+.alarmTitleText {
-.raw {
+  max-width: 300px;
-  &-title {
+  cursor: pointer;
-    color: #000000d9;
-    font-size: 24px;
-    line-height: 1.8;
-  }
-  .num {
-    background-color: #e5e5e5;
-  }
-  .code {
-    background-color: #e7e6ff;
-  }
-  .txt {
-    background-color: #ffe3e5;
-  }
-
-  &-html {
-    max-height: 300px;
-    overflow-y: scroll;
-  }
 }
 </style>

src/views/perfManage/taskManage/index.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { reactive, onMounted, toRaw } from 'vue';
+import { reactive, onMounted, ref, toRaw } from 'vue';
 import { PageContainer } from '@ant-design-vue/pro-layout';
 import { Form, message, Modal } from 'ant-design-vue/lib';
 import { SizeType } from 'ant-design-vue/lib/config-provider';
@@ -11,25 +11,19 @@ import useI18n from '@/hooks/useI18n';
 import useUserStore from '@/store/modules/user';
 import useNeInfoStore from '@/store/modules/neinfo';
 import {
-  addTraceTask,
+  addPerfTask,
-  delTraceTask,
+  delPerfTask,
-  getTraceTask,
+  getPerfTask,
   listPerfTask,
-  updateTraceTask,
+  updatePerfTask,
+  taskStop,
+  taskRun,
 } from '@/api/perfManage/taskManage';
 import useDictStore from '@/store/modules/dict';
 import { regExpIPv4, regExpPort } from '@/utils/regular-utils';
 const { getDict } = useDictStore();
 const { t, currentLocale } = useI18n();
 
-/**字典数据 */
-let dict: {
-  /**跟踪类型 */
-  traceType: DictType[];
-} = reactive({
-  traceType: [],
-});
-
 /**表格所需option */
 const taskManageOption = reactive({
   granulOption: [
@@ -39,8 +33,58 @@ const taskManageOption = reactive({
     { label: '24H', value: '24H' },
   ],
   timeSlotAll: [{ label: '', value: '' }],
+  bigPlan: [
+    { label: '周测量计划', value: 'Weekly' },
+    { label: '月测量计划', value: 'Monthly' },
+  ],
+  smPlan: {
+    Weekly: [
+      { label: '星期一', value: '1' },
+      { label: '星期二', value: '2' },
+      { label: '星期三', value: '3' },
+      { label: '星期四', value: '4' },
+      { label: '星期五', value: '5' },
+      { label: '星期六', value: '6' },
+      { label: '星期天', value: '7' },
+    ],
+    Monthly: [
+      { label: '1', value: '1' },
+      { label: '2', value: '2' },
+      { label: '3', value: '3' },
+      { label: '4', value: '4' },
+      { label: '5', value: '5' },
+      { label: '6', value: '6' },
+      { label: '7', value: '7' },
+      { label: '8', value: '8' },
+      { label: '9', value: '9' },
+      { label: '10', value: '10' },
+      { label: '11', value: '11' },
+      { label: '12', value: '12' },
+      { label: '13', value: '13' },
+      { label: '14', value: '14' },
+      { label: '15', value: '15' },
+      { label: '16', value: '16' },
+      { label: '17', value: '17' },
+      { label: '18', value: '18' },
+      { label: '19', value: '19' },
+      { label: '20', value: '20' },
+      { label: '21', value: '21' },
+      { label: '22', value: '22' },
+      { label: '23', value: '23' },
+      { label: '24', value: '24' },
+      { label: '25', value: '25' },
+      { label: '26', value: '26' },
+      { label: '27', value: '27' },
+      { label: '28', value: '28' },
+      { label: '29', value: '29' },
+      { label: '30', value: '30' },
+    ],
+  },
 });
 
+/**记录开始结束时间 */
+let queryRangePicker = ref<[string, string]>(['', '']);
+
 /**查询参数 */
 let queryParams = reactive({
   /**网元类型 */
@@ -167,17 +211,17 @@ function fnTableSize({ key }: MenuInfo) {
  * 备份信息删除
  * @param row 记录编号ID
  */
-function fnRecordDelete(id: string) {
+function fnRecordDelete(row: Record<string, any>) {
   Modal.confirm({
     title: t('common.tipTitle'),
-    content: t('views.traceManage.task.delTaskTip', { num: id }),
+    content: t('views.perfManage.taskManage.delPerfTip', { num: row.id }),
     onOk() {
       const key = 'delTraceTask';
       message.loading({ content: t('common.loading'), key });
-      delTraceTask(id).then(res => {
+      delPerfTask(row).then(res => {
         if (res.code === RESULT_CODE_SUCCESS) {
           message.success({
-            content: t('views.traceManage.task.delTask', { num: id }),
+            content: t('views.perfManage.taskManage.delPerf', { num: row.id }),
             key,
             duration: 2,
           });
@@ -219,20 +263,21 @@ type ModalStateType = {
   visibleByEdit: boolean;
   /**标题 */
   title: string;
+  /**选择后清空 */
+  initPeriods: [];
   /**网元类型设备对象 */
   neType: string[];
-  /**网元类型设备对象接口 */
-  neTypeInterface: Record<string, any>[];
   /**网元类型性能测量集 */
   neTypPerformance: Record<string, any>[];
   /**网元类型性能测量集选择 */
   neTypPerformanceList: [];
-  /**网元类型设备对象接口选择 */
-  neTypeInterfaceSelect: string[];
   /**任务开始结束时间 */
   timeRangePicker: [string, string];
   /**时间段多选 */
-  timeSlotAll: [];
+  timeSlotAll: string[];
+  /**时间段多选 */
+  periodsStep: number;
+
   /**表单数据 */
   from: Record<string, any>;
   /**确定按钮 loading */
@@ -244,32 +289,28 @@ let modalState: ModalStateType = reactive({
   visibleByView: false,
   visibleByEdit: false,
   title: '',
+  initPeriods: [],
   neType: [],
-  neTypeInterface: [],
   neTypPerformance: [],
   neTypPerformanceList: [],
-  neTypeInterfaceSelect: [],
   timeRangePicker: ['', ''],
   timeSlotAll: [],
+  periodsStep: 30,
+
   from: {
     id: '',
     neType: '',
     neId: '',
     granulOption: '',
-    traceType: 'Device',
     startTime: '',
     endTime: '',
+    bigPlan: '',
+    smPlan: [],
     comment: '',
-    // 跟踪类型用户
-    imsi: '',
-    msisdn: '',
     // 跟踪类型接口
-    srcIp: '',
+    performanceArr: '',
-    dstIp: '',
-
     kpiSet: '',
     periods: [],
-    signalPort: '',
   },
   confirmLoading: false,
 });
@@ -278,12 +319,6 @@ let modalState: ModalStateType = reactive({
 const modalStateFrom = Form.useForm(
   modalState.from,
   reactive({
-    traceType: [
-      {
-        required: true,
-        message: t('views.traceManage.task.trackTypePlease'),
-      },
-    ],
     neId: [
       {
         required: true,
@@ -296,27 +331,6 @@ const modalStateFrom = Form.useForm(
         message: t('views.traceManage.task.rangePickerPlease'),
       },
     ],
-    // 跟踪用户
-    imsi: [
-      {
-        required: true,
-        message: t('views.traceManage.task.imsiPlease'),
-      },
-    ],
-    msisdn: [
-      {
-        required: true,
-        message: t('views.traceManage.task.msisdnPlease'),
-      },
-    ],
-    // 跟踪接口
-    srcIp: [
-      {
-        required: true,
-        pattern: regExpIPv4,
-        message: t('views.traceManage.task.srcIpPlease'),
-      },
-    ],
     dstIp: [
       {
         required: true,
@@ -324,17 +338,10 @@ const modalStateFrom = Form.useForm(
         message: t('views.traceManage.task.dstIpPlease'),
       },
     ],
-    interfaces: [
+    performanceArr: [
       {
         required: true,
-        message: t('views.traceManage.task.interfacesPlease'),
+        message: t('views.perfManage.taskManage.performanceSelect'),
-      },
-    ],
-    signalPort: [
-      {
-        required: true,
-        pattern: regExpPort,
-        message: t('views.traceManage.task.signalPortPlease'),
       },
     ],
   })
@@ -345,37 +352,31 @@ function fnNeChange(_: any, item: any) {
   modalState.from.neType = item[1].neType;
   modalState.from.neId = item[1].neId;
 
-  modalState.from.interfaces = '';
-  modalState.neTypeInterfaceSelect = [];
   modalState.neTypPerformanceList = [];
 
   // 网元信令接口
-  fnSelectInterfaceInit(item[1].neType);
+  fnSelectPerformanceInit(item[1].neType);
-}
-
-function fnPeriodsSelect(item: any, timeString: any) {
-  console.log(item);
-  console.log(timeString);
-
-  taskManageOption.timeSlotAll.push({
-    label: timeString.join(','),
-    value: item.join(','),
-  });
-  modalState.from.timeSlotAll.push(timeString.join(','));
 }
 
 /**开始结束时间选择对应修改 */
 function fnRangePickerChange(_: any, item: any) {
-  console.log(item);
   modalState.from.startTime = item[0];
   modalState.from.endTime = item[1];
 }
 
+/**时间段的选择对应的修改 */
+function fnPeriodsSelect(item: any, timeString: any) {
+  taskManageOption.timeSlotAll.push({
+    label: timeString.join(','),
+    value: item.join(','),
+  });
+  modalState.timeSlotAll.push(item.join(','));
+  modalState.from.periods = modalState.timeSlotAll;
+}
 /**时间段选择后回调 */
 function fnChange(open: any) {
-  console.log(open);
+  if (!open && queryRangePicker.value[0] && queryRangePicker.value[1]) {
-  if (!open) {
+    queryRangePicker.value = ['', ''];
-    modalState.from.periods.push(modalState.from.timeSlotAll);
   }
 }
 
@@ -405,7 +406,7 @@ function fnSelectInterface(s: any, option: any) {
 }
 
 /**性能测量数据集选择初始 */
-function fnSelectInterfaceInit(neType: string) {
+function fnSelectPerformanceInit(neType: string) {
   //console.logg(currentLocale.value); //当前语言
   const performance = useNeInfoStore().perMeasurementList.filter(
     i => i.neType === neType
@@ -419,6 +420,8 @@ function fnSelectInterfaceInit(neType: string) {
     groups[kpiCode].push(rest);
     return groups;
   }, {});
+
+  //渲染出性能测量集的选择项
   modalState.neTypPerformance = Object.keys(groupedData).map(kpiCode => {
     return {
       label: kpiCode,
@@ -437,34 +440,43 @@ function fnSelectInterfaceInit(neType: string) {
 }
 
 /**
- * 对话框弹出显示为 新增或者修改
+ * 对话框弹出显示为 详情框
  * @param noticeId 网元id, 不传为新增
  */
 function fnModalVisibleByVive(id: string) {
   if (modalState.confirmLoading) return;
   const hide = message.loading(t('common.loading'), 0);
   modalState.confirmLoading = true;
-  getTraceTask(id).then(res => {
+  getPerfTask(id).then(res => {
     modalState.confirmLoading = false;
     hide();
     if (res.code === RESULT_CODE_SUCCESS) {
-      modalState.neType = [res.data.neType, res.data.neId];
+      if (res.data.kpiSet.includes('[') && res.data.neIds.includes('[')) {
+        modalState.neType = [res.data.neType, JSON.parse(res.data.neIds)[0]];
+        modalState.neTypPerformanceList = JSON.parse(res.data.kpiSet).reduce(
+          (acc: any, item: any) => acc.concat(item.KPIs),
+          []
+        );
+      }
+
+      if (res.data.periods.includes('[') && res.data.periods.length > 4) {
+        const jsonArray = JSON.parse(res.data.periods);
+        modalState.initPeriods = jsonArray.map(
+          (item: any) => `${item.Start} - ${item.End}`
+        );
+      }
+
+      if (res.data.schedule.includes('[') && res.data.schedule.length > 4) {
+        modalState.from.bigPlan = JSON.parse(res.data.schedule)[0].Type;
+        modalState.from.smPlan = JSON.parse(res.data.schedule)[0].Days;
+      }
+
       modalState.timeRangePicker = [res.data.startTime, res.data.endTime];
       modalState.from = Object.assign(modalState.from, res.data);
-      // 接口
+      modalState.title = t('views.perfManage.taskManage.viewTask');
-      if (res.data.traceType === 'Interface') {
-        if (
-          res.data.interfaces.length > 4 &&
-          res.data.interfaces.includes('[')
-        ) {
-          modalState.neTypeInterfaceSelect = JSON.parse(res.data.interfaces);
-        }
-        fnSelectInterfaceInit(res.data.neType);
-      }
-      modalState.title = t('views.traceManage.task.viewTask');
       modalState.visibleByView = true;
     } else {
-      message.error(t('views.traceManage.task.errorTaskInfo'), 3);
+      message.error(t('views.perfManage.taskManage.errorTaskInfo'), 3);
     }
   });
 }
@@ -476,33 +488,66 @@ function fnModalVisibleByVive(id: string) {
 function fnModalVisibleByEdit(id?: string) {
   if (!id) {
     modalStateFrom.resetFields();
-    modalState.title = t('views.traceManage.task.addTask');
+    modalState.title = t('views.perfManage.taskManage.addTask');
     modalState.visibleByEdit = true;
   } else {
     if (modalState.confirmLoading) return;
     const hide = message.loading(t('common.loading'), 0);
     modalState.confirmLoading = true;
-    getTraceTask(id).then(res => {
+    getPerfTask(id).then(res => {
       modalState.confirmLoading = false;
       hide();
       if (res.code === RESULT_CODE_SUCCESS && res.data) {
-        modalState.neType = [res.data.neType, res.data.neId];
+        modalState.periodsStep = parseInt(
+          res.data.granulOption.substring(0, 2)
+        );
+
+        if (res.data.kpiSet.includes('[') && res.data.neIds.includes('[')) {
+          modalState.neType = [res.data.neType, JSON.parse(res.data.neIds)[0]];
+          modalState.neTypPerformanceList = JSON.parse(res.data.kpiSet).reduce(
+            (acc: any, item: any) => acc.concat(item.KPIs),
+            []
+          );
+        }
+
+        if (res.data.schedule.includes('[') && res.data.schedule.length > 4) {
+          modalState.from.bigPlan = JSON.parse(res.data.schedule)[0].Type;
+          modalState.from.smPlan = JSON.parse(res.data.schedule)[0].Days;
+        }
+
         modalState.timeRangePicker = [res.data.startTime, res.data.endTime];
         modalState.from = Object.assign(modalState.from, res.data);
-        // 接口
+
-        if (res.data.traceType === 'Interface') {
+        if (res.data.periods.includes('[') && res.data.periods.length > 4) {
-          if (
+          const jsonArray = JSON.parse(res.data.periods);
-            res.data.interfaces.length > 4 &&
+          modalState.initPeriods = jsonArray.map(
-            res.data.interfaces.includes('[')
+            (item: any) => `${item.Start},${item.End}`
-          ) {
+          );
-            modalState.neTypeInterfaceSelect = JSON.parse(res.data.interfaces);
+          if (modalState.initPeriods.length) {
+            modalState.timeSlotAll = [];
+            taskManageOption.timeSlotAll = [];
+            const updatedTimeRanges = modalState.initPeriods.map(
+              (timeRange: any) => {
+                const [startTime, endTime] = timeRange.split(',');
+                const updatedStartTime = startTime.slice(0, -3);
+                const updatedEndTime = endTime.slice(0, -3);
+                taskManageOption.timeSlotAll.push({
+                  label: `${updatedStartTime},${updatedEndTime}`,
+                  value: timeRange,
+                });
+                return `${updatedStartTime},${updatedEndTime}`;
+              }
+            );
+
+            modalState.timeSlotAll.push(...modalState.initPeriods);
+            modalState.initPeriods = [];
+            modalState.from.periods = modalState.timeSlotAll;
           }
-          fnSelectInterfaceInit(res.data.neType);
         }
-        modalState.title = t('views.traceManage.task.editTask');
+        modalState.title = t('views.perfManage.taskManage.editTask');
         modalState.visibleByEdit = true;
       } else {
-        message.error(t('views.traceManage.task.errorTaskInfo'), 3);
+        message.error(t('views.perfManage.taskManage.errorTaskInfo'), 3);
       }
     });
   }
@@ -514,47 +559,42 @@ function fnModalVisibleByEdit(id?: string) {
  */
 function fnModalOk() {
   const from = toRaw(modalState.from);
-  let valids = ['traceType', 'neId', 'endTime'];
-  if (from.traceType === 'UE') {
-    valids = valids.concat(['imsi', 'msisdn']);
-  }
-  if (from.traceType === 'Interface') {
-    valids = valids.concat(['srcIp', 'dstIp', 'interfaces', 'signalPort']);
-  }
   from.accountId = useUserStore().userName;
-  modalStateFrom
+  console.log(from);
-    .validate(valids)
+  modalState.confirmLoading = true;
-    .then(e => {
+  const perfTask = from.id ? updatePerfTask(from) : addPerfTask(from);
-      modalState.confirmLoading = true;
+  const hide = message.loading(t('common.loading'), 0);
-      const traceTask = from.id ? updateTraceTask(from) : addTraceTask(from);
+  perfTask
-      const hide = message.loading(t('common.loading'), 0);
+    .then(res => {
-      traceTask
+      if (res.code === RESULT_CODE_SUCCESS) {
-        .then(res => {
+        message.success({
-          if (res.code === RESULT_CODE_SUCCESS) {
+          content: t('common.msgSuccess', { msg: modalState.title }),
-            message.success({
+          duration: 3,
-              content: t('common.msgSuccess', { msg: modalState.title }),
-              duration: 3,
-            });
-            modalState.visibleByEdit = false;
-            modalStateFrom.resetFields();
-          } else {
-            message.error({
-              content: `${res.msg}`,
-              duration: 3,
-            });
-          }
-        })
-        .finally(() => {
-          hide();
-          modalState.confirmLoading = false;
-          fnGetList();
         });
+        modalState.visibleByEdit = false;
+        modalStateFrom.resetFields();
+      } else {
+        message.error({
+          content: `${res.msg}`,
+          duration: 3,
+        });
+      }
     })
-    .catch(e => {
+    .finally(() => {
-      message.error(t('common.errorFields', { num: e.errorFields.length }), 3);
+      hide();
+      modalState.confirmLoading = false;
+      fnGetList();
     });
 }
 
+/**
+ * 为时间段设置步长
+ */
+function updateStep(str: any) {
+  modalState.from.periods = [];
+  modalState.periodsStep = parseInt(str.substring(0, 2));
+}
+
 /**
  * 对话框弹出关闭执行函数
  * 进行表达规则校验
@@ -565,20 +605,106 @@ function fnModalCancel() {
   modalState.confirmLoading = false;
   modalStateFrom.resetFields();
   modalState.timeRangePicker = ['', ''];
-  modalState.neTypeInterfaceSelect = [];
   modalState.neTypPerformanceList = [];
-
+  modalState.initPeriods = [];
   modalState.neType = [];
-  modalState.neTypeInterface = [];
+  modalState.timeSlotAll = [];
+}
+
+/**
+ * 激活任务
+ * @param row 网元编号ID
+ */
+function fnRecordRun(row: Record<string, any>) {
+  Modal.confirm({
+    title: '提示',
+    content: `确认激活编号为 【${row.id}】 的任务?`,
+    onOk() {
+      const key = 'taskRun';
+      message.loading({ content: '请稍等...', key });
+      taskRun(row).then(res => {
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success({
+            content: `激活成功`,
+            key,
+            duration: 2,
+          });
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            key: key,
+            duration: 2,
+          });
+        }
+      });
+    },
+  });
+}
+
+/**
+ * 激活任务
+ * @param row 网元编号ID
+ */
+function fnRecordStop(row: Record<string, any>) {
+  Modal.confirm({
+    title: '提示',
+    content: `确认挂起编号为 【${row.id}】 的任务?`,
+    onOk() {
+      const key = 'taskStop';
+      message.loading({ content: '请稍等...', key });
+      taskStop(row).then(res => {
+        if (res.code === RESULT_CODE_SUCCESS) {
+          message.success({
+            content: `挂起成功`,
+            key,
+            duration: 2,
+          });
+        } else {
+          message.error({
+            content: `${res.msg}`,
+            key: key,
+            duration: 2,
+          });
+        }
+      });
+    },
+  });
+}
+
+/**
+ * 记录多项选择
+ */
+function fnTaskModalVisible(type: string | number, row: Record<string, any>) {
+  if (type === 'run') {
+    if (row.status === 'Active') {
+      var key = 'Active';
+      message.error({
+        content: `禁止激活已激活的任务`,
+        key: key,
+        duration: 2,
+      });
+      return false;
+    }
+    fnRecordRun(row);
+  }
+
+  if (type === 'stop') {
+    if (row.status === 'Inactive') {
+      var key = 'stop';
+      message.error({
+        content: `禁止挂起未激活的测量任务`,
+        key: key,
+        duration: 2,
+      });
+      return false;
+    }
+    fnRecordStop(row);
+  }
 }
 
 onMounted(() => {
   // 初始字典数据
-  Promise.allSettled([getDict('trace_type')]).then(resArr => {
+
-    if (resArr[0].status === 'fulfilled') {
-      dict.traceType = resArr[0].value;
-    }
-  });
   Promise.allSettled([
     // 获取网元网元列表
     useNeInfoStore().fnNelist(),
@@ -698,9 +824,6 @@ onMounted(() => {
         :scroll="{ x: true }"
       >
         <template #bodyCell="{ column, record }">
-          <template v-if="column.key === 'traceType'">
-            <DictTag :options="dict.traceType" :value="record.traceType" />
-          </template>
           <template v-if="column.key === 'id'">
             <a-space :size="8" align="center">
               <a-tooltip>
@@ -717,19 +840,42 @@ onMounted(() => {
                 <a-button
                   type="link"
                   @click.prevent="fnModalVisibleByEdit(record.id)"
+                  :disabled="record.status === 'Active'"
                 >
                   <template #icon><FormOutlined /></template>
                 </a-button>
               </a-tooltip>
               <a-tooltip>
                 <template #title>{{ t('common.deleteText') }}</template>
-                <a-button
+                <a-button type="link" @click.prevent="fnRecordDelete(record)">
-                  type="link"
-                  @click.prevent="fnRecordDelete(record.id)"
-                >
                   <template #icon><DeleteOutlined /></template>
                 </a-button>
               </a-tooltip>
+              <a-tooltip>
+                <template #title>{{ t('common.moreText') }}</template>
+                <a-dropdown
+                  placement="bottomRight"
+                  :trigger="['hover', 'click']"
+                >
+                  <a-button type="link">
+                    <template #icon><EllipsisOutlined /> </template>
+                  </a-button>
+                  <template #overlay>
+                    <a-menu
+                      @click="({ key }:any) => fnTaskModalVisible(key, record)"
+                    >
+                      <a-menu-item key="run">
+                        <ThunderboltOutlined />
+                        {{ t('views.configManage.softwareManage.runBtn') }}
+                      </a-menu-item>
+                      <a-menu-item key="stop">
+                        <UndoOutlined />
+                        {{ t('views.perfManage.taskManage.stopTask') }}
+                      </a-menu-item>
+                    </a-menu>
+                  </template>
+                </a-dropdown>
+              </a-tooltip>
             </a-space>
           </template>
         </template>
@@ -745,17 +891,6 @@ onMounted(() => {
     >
       <a-form layout="horizontal">
         <a-row :gutter="16">
-          <a-col :lg="12" :md="12" :xs="24">
-            <a-form-item
-              :label="t('views.traceManage.task.trackType')"
-              name="traceType"
-            >
-              <DictTag
-                :options="dict.traceType"
-                :value="modalState.from.traceType"
-              />
-            </a-form-item>
-          </a-col>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
               :label="t('views.traceManage.task.neType')"
@@ -770,53 +905,6 @@ onMounted(() => {
           </a-col>
         </a-row>
 
-        <!-- 用户跟踪 -->
-        <template v-if="modalState.from.traceType === 'UE'">
-          <a-form-item
-            :label="t('views.traceManage.task.msisdn')"
-            name="msisdn"
-          >
-            {{ modalState.from.msisdn }}
-          </a-form-item>
-          <a-form-item :label="t('views.traceManage.task.imsi')" name="imsi">
-            {{ modalState.from.imsi }}
-          </a-form-item>
-        </template>
-
-        <!-- 接口跟踪 -->
-        <template v-if="modalState.from.traceType === 'Interface'">
-          <a-row :gutter="16">
-            <a-col :lg="12" :md="12" :xs="24">
-              <a-form-item
-                :label="t('views.traceManage.task.srcIp')"
-                name="srcIp"
-              >
-                {{ modalState.from.srcIp }}
-              </a-form-item>
-            </a-col>
-            <a-col :lg="12" :md="12" :xs="24">
-              <a-form-item
-                :label="t('views.traceManage.task.dstIp')"
-                name="dstIp"
-              >
-                {{ modalState.from.dstIp }}
-              </a-form-item>
-            </a-col>
-          </a-row>
-          <a-form-item
-            :label="t('views.traceManage.task.interfaces')"
-            name="endTime"
-          >
-            {{ modalState.neTypeInterfaceSelect }}
-          </a-form-item>
-          <a-form-item
-            :label="t('views.traceManage.task.signalPort')"
-            name="endTime"
-          >
-            {{ modalState.from.signalPort }}
-          </a-form-item>
-        </template>
-
         <a-form-item
           :label="t('views.traceManage.task.rangePicker')"
           name="endTime"
@@ -832,6 +920,64 @@ onMounted(() => {
             style="width: 100%"
           ></a-range-picker>
         </a-form-item>
+
+        <a-form-item
+          :label="t('views.perfManage.taskManage.performanceList')"
+          name="performanceArr"
+        >
+          {{ modalState.neTypPerformanceList }}
+        </a-form-item>
+
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              name="granulOption"
+              :label="t('views.perfManage.taskManage.granulOption')"
+            >
+              <a-select
+                v-model:value="modalState.from.granulOption"
+                :options="taskManageOption.granulOption"
+                disabled
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
+        <a-form-item
+          :label="t('views.perfManage.taskManage.period')"
+          name="performanceArr"
+        >
+          {{ modalState.initPeriods }}
+        </a-form-item>
+
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.perfManage.taskManage.plan')"
+              name="bigPlan"
+            >
+              <a-select
+                v-model:value="modalState.from.bigPlan"
+                :options="taskManageOption.bigPlan"
+                disabled
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item name="smPlan">
+              <a-select
+                v-model:value="modalState.from.smPlan"
+                mode="multiple"
+                :options="taskManageOption.smPlan[modalState.from.bigPlan as 'Weekly' | 'Monthly']"
+                disabled
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
         <a-form-item
           :label="t('views.traceManage.task.comment')"
           name="comment"
@@ -877,10 +1023,10 @@ onMounted(() => {
         </a-row>
 
         <a-form-item
-          :label="t('views.traceManage.task.interfaces')"
+          :label="t('views.perfManage.taskManage.performanceList')"
-          name="interfaces"
+          name="performanceArr"
-          v-bind="modalStateFrom.validateInfos.interfaces"
           v-show="modalState.neType.length !== 0"
+          v-bind="modalStateFrom.validateInfos.performanceArr"
         >
           <a-select
             mode="multiple"
@@ -923,6 +1069,7 @@ onMounted(() => {
               <a-select
                 v-model:value="modalState.from.granulOption"
                 :options="taskManageOption.granulOption"
+                @change="updateStep"
               >
               </a-select>
             </a-form-item>
@@ -930,9 +1077,8 @@ onMounted(() => {
         </a-row>
 
         <a-form-item
-          :label="t('views.traceManage.task.interfaces')"
+          :label="t('views.perfManage.taskManage.period')"
-          name="interfaces"
+          name="period"
-          v-bind="modalStateFrom.validateInfos.interfaces"
           v-if="
             modalState.from.granulOption &&
             modalState.from.granulOption !== '24H'
@@ -949,10 +1095,38 @@ onMounted(() => {
           <a-time-range-picker
             format="HH:mm"
             value-format="HH:MM:00"
+            v-model:value="queryRangePicker"
             @change="fnPeriodsSelect"
             @open-change="fnChange"
+            :minute-step="modalState.periodsStep"
           />
         </a-form-item>
+
+        <a-row :gutter="16">
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.perfManage.taskManage.plan')"
+              name="bigPlan"
+            >
+              <a-select
+                v-model:value="modalState.from.bigPlan"
+                :options="taskManageOption.bigPlan"
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :lg="12" :md="12" :xs="24">
+            <a-form-item name="smPlan" v-show="modalState.from.bigPlan">
+              <a-select
+                v-model:value="modalState.from.smPlan"
+                mode="multiple"
+                :options="taskManageOption.smPlan[modalState.from.bigPlan as 'Weekly' | 'Monthly']"
+              >
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+
         <a-form-item
           :label="t('views.traceManage.task.comment')"
           name="comment"