feat: 优化PCF参数可选请求数据处理

src/views/neUser/pcf/index.vue

@@ -29,12 +29,12 @@ const { t } = useI18n();
 let neOtions = ref<Record<string, any>[]>([]);
 
 /**表单中多选的OPTION */
-const pcfRuleOption = reactive({
-  pccOpt: [],
-  sessOpt: [],
-  qosOpt: [],
-  headerOpt: [],
-  sarOpt: [],
+const pcfRuleOption = ref<Record<string, any[]>>({
+  pccRules: [],
+  sessionRules: [],
+  qosTemplate: [],
+  headerEnrichTemplate: [],
+  serviceAreaRestriction: [],
 });
 
 /**查询参数 */
@@ -258,12 +258,8 @@ const modalStateFrom = Form.useForm(
  */
 function fnModalVisibleByEdit(row?: Record<string, any>) {
   getPCCRule(queryParams.neId)
-    .then((res: any) => {
-      pcfRuleOption.pccOpt = res.pccJson;
-      pcfRuleOption.sessOpt = res.sessJson;
-      pcfRuleOption.qosOpt = res.qosJson;
-      pcfRuleOption.headerOpt = res.headerJson;
-      pcfRuleOption.sarOpt = res.sarJson;
+    .then((data: any) => {
+      pcfRuleOption.value = data;
     })
     .finally(() => {
       modalState.isBatch = false;
@@ -438,12 +434,9 @@ function fnModalCancel() {
  */
 function fnModalVisibleByBatch(type: 'delete' | 'add' | 'update') {
   getPCCRule(queryParams.neId)
-    .then((res: any) => {
-      pcfRuleOption.pccOpt = res.pccJson;
-      pcfRuleOption.sessOpt = res.sessJson;
-      pcfRuleOption.qosOpt = res.qosJson;
-      pcfRuleOption.headerOpt = res.headerJson;
-      pcfRuleOption.sarOpt = res.sarJson;
+    .then((data: any) => {
+      pcfRuleOption.value = data;
+      console.log(data);
     })
     .finally(() => {
       modalStateFrom.resetFields(); //重置表单
@@ -1021,7 +1014,7 @@ onMounted(() => {
                   v-model:value="modalState.from.pccRules"
                   allow-clear
                   mode="tags"
-                  :options="pcfRuleOption.pccOpt"
+                  :options="pcfRuleOption.pccRules"
                   :title="t('views.neUser.pcf.pccRuleTip')"
                 />
               </a-form-item>
@@ -1032,7 +1025,7 @@ onMounted(() => {
                   v-model:value="modalState.from.sessRules"
                   allow-clear
                   mode="tags"
-                  :options="pcfRuleOption.sessOpt"
+                  :options="pcfRuleOption.sessionRules"
                   :title="t('views.neUser.pcf.sessRuleTip')"
                 />
               </a-form-item>
@@ -1045,7 +1038,7 @@ onMounted(() => {
                 <a-auto-complete
                   v-model:value="modalState.from.qosAudio"
                   allow-clear
-                  :options="pcfRuleOption.qosOpt"
+                  :options="pcfRuleOption.qosTemplate"
                   :filter-option="filterOption"
                 />
               </a-form-item>
@@ -1055,7 +1048,7 @@ onMounted(() => {
                 <a-auto-complete
                   v-model:value="modalState.from.qosVideo"
                   allow-clear
-                  :options="pcfRuleOption.qosOpt"
+                  :options="pcfRuleOption.qosTemplate"
                   :filter-option="filterOption"
                 />
               </a-form-item>
@@ -1068,7 +1061,7 @@ onMounted(() => {
                 <a-auto-complete
                   v-model:value="modalState.from.hdrEnrich"
                   allow-clear
-                  :options="pcfRuleOption.headerOpt"
+                  :options="pcfRuleOption.headerEnrichTemplate"
                   :filter-option="filterOption"
                 />
               </a-form-item>
@@ -1099,7 +1092,7 @@ onMounted(() => {
                 <a-auto-complete
                   v-model:value="modalState.from.sar"
                   allow-clear
-                  :options="pcfRuleOption.sarOpt"
+                  :options="pcfRuleOption.serviceAreaRestriction"
                   :filter-option="filterOption"
                 />
               </a-form-item>