fix: SMF-CDR查询IMSI数据结果图优化，支持DNN条件

src/views/dashboard/smfCDRByIMSI/index.vue

@@ -73,8 +73,8 @@ const option = {
       const downlinkValueF = parseSizeFromByte(downlinkValue);
       return `
       <div style="font-weight: bold;">${title}</div>
-      <div>Uplink: ${uplinkValueF}</div>
       <div>Downlink: ${downlinkValueF}</div>
+      <div>Uplink: ${uplinkValueF}</div>
       `;
     },
   },
@@ -95,7 +95,7 @@ const option = {
   },
   dataZoom: [
     {
-      show: true,
+      show: false,
       realtime: true,
       start: 0,
       end: 100,
@@ -113,13 +113,13 @@ const option = {
     {
       left: '10%',
       right: 50,
-      height: '30%',
+      height: '40%',
     },
     {
       left: '10%',
       right: 50,
       top: '50%',
-      height: '30%',
+      height: '40%',
     },
   ],
   xAxis: [
@@ -129,7 +129,7 @@ const option = {
       axisLine: { onZero: true },
       data: [], // x轴初始数据
       axisLabel: {
-        show: true, // 显示标签
+        show: false, // 显示标签
         rotate: 15, // 设置倾斜角度（如15度）
       },
     },
@@ -147,30 +147,30 @@ const option = {
   ],
   yAxis: [
     {
-      name: 'Uplink (Byte)',
+      name: 'Downlink (Byte)',
       type: 'value',
     },
     {
       gridIndex: 1,
-      name: 'Downlink (Byte)',
+      name: 'Uplink (Byte)',
       type: 'value',
       inverse: true,
     },
   ],
   series: [
     {
-      name: 'Uplink',
+      name: 'Downlink',
       type: 'line',
       data: [], // y轴初始数据
       symbol: 'circle', // 数据点形状
       symbolSize: 6, // 数据点大小
       smooth: true, // 平滑曲线
-      color: 'rgb(17, 178, 255)',
+      color: 'rgb(0, 190, 99)',
       areaStyle: {
         color: {
           colorStops: [
-            { offset: 0, color: 'rgba(17, 178, 255, .5)' },
+            { offset: 0, color: 'rgba(0, 190, 99, .5)' },
-            { offset: 1, color: 'rgba(17, 178, 255, 0.5)' },
+            { offset: 1, color: 'rgba(0, 190, 99, 0.5)' },
           ],
           x: 0,
           y: 0,
@@ -184,7 +184,7 @@ const option = {
       },
     },
     {
-      name: 'Downlink',
+      name: 'Uplink',
       type: 'line',
       xAxisIndex: 1,
       yAxisIndex: 1,
@@ -192,12 +192,12 @@ const option = {
       symbol: 'circle', // 数据点形状
       symbolSize: 6, // 数据点大小
       smooth: true, // 平滑曲线
-      color: 'rgb(0, 190, 99)',
+      color: 'rgb(17, 178, 255)',
       areaStyle: {
         color: {
           colorStops: [
-            { offset: 0, color: 'rgba(0, 190, 99, .5)' },
+            { offset: 0, color: 'rgba(17, 178, 255, .5)' },
-            { offset: 1, color: 'rgba(0, 190, 99, 0.5)' },
+            { offset: 1, color: 'rgba(17, 178, 255, 0.5)' },
           ],
           x: 0,
           y: 0,
@@ -267,6 +267,7 @@ let queryParams = reactive({
   neType: 'SMF',
   neId: '001',
   subscriberID: '',
+  dnn: '',
   sortField: 'timestamp',
   sortOrder: 'desc',
   /**开始时间 */
@@ -281,6 +282,8 @@ let queryParams = reactive({
 
 /**查询参数重置 */
 function fnQueryReset() {
+  queryParams.subscriberID = '';
+  queryParams.dnn = '';
   queryRangePicker.value = [dayjs().startOf('hour'), dayjs().endOf('hour')];
   fnGetList(1);
 }
@@ -611,21 +614,15 @@ onBeforeUnmount(() => {
               ></a-input>
             </a-form-item>
           </a-col>
-          <a-col :lg="8" :md="12" :xs="24">
+          <a-col :lg="6" :md="12" :xs="24">
-            <a-form-item
+            <a-form-item label="DNN" name="dnn">
-              :label="t('views.dashboard.cdr.time')"
+              <a-input
-              name="queryRangePicker"
+                v-model:value="queryParams.dnn"
-            >
+                allow-clear
-              <a-range-picker
+                :placeholder="t('common.inputPlease')"
-                v-model:value="queryRangePicker"
+                :maxlength="40"
-                :presets="rangePickerPresets"
-                :bordered="true"
-                :allow-clear="false"
-                style="width: 100%"
-                :show-time="{ format: 'HH:mm:ss' }"
-                format="YYYY-MM-DD HH:mm:ss"
                 :disabled="state.loading"
-              ></a-range-picker>
+              ></a-input>
             </a-form-item>
           </a-col>
           <a-col :lg="4" :md="12" :xs="24">
@@ -650,6 +647,23 @@ onBeforeUnmount(() => {
               </a-space>
             </a-form-item>
           </a-col>
+          <a-col :lg="8" :md="12" :xs="24">
+            <a-form-item
+              :label="t('views.dashboard.cdr.time')"
+              name="queryRangePicker"
+            >
+              <a-range-picker
+                v-model:value="queryRangePicker"
+                :presets="rangePickerPresets"
+                :bordered="true"
+                :allow-clear="false"
+                style="width: 100%"
+                :show-time="{ format: 'HH:mm:ss' }"
+                format="YYYY-MM-DD HH:mm:ss"
+                :disabled="state.loading"
+              ></a-range-picker>
+            </a-form-item>
+          </a-col>
         </a-row>
       </a-form>
     </a-card>