From 7c2d423419b9091a54aceeea182f975831bda5f5 Mon Sep 17 00:00:00 2001
From: RogerWork <roger.x.sun@qq.com>
Date: Tue, 23 Jul 2024 18:27:59 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E4=BA=86=E7=82=B9=E6=A0=87?=
 =?UTF-8?q?=E7=AD=BE=E6=8A=A5=E9=94=99=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ec_api/BasicConfig.vue |  1 +
 src/components/ec_api/TabArea.vue     | 53 ++++++++++++++++-----------
 src/store/index.js                    |  6 ++-
 3 files changed, 38 insertions(+), 22 deletions(-)

diff --git a/src/components/ec_api/BasicConfig.vue b/src/components/ec_api/BasicConfig.vue
index ef74244..75a06e9 100644
--- a/src/components/ec_api/BasicConfig.vue
+++ b/src/components/ec_api/BasicConfig.vue
@@ -137,6 +137,7 @@ function handle_api_data() {
   SelectApiId.value.forEach(api_id => {
     if (ApiParams.value.hasOwnProperty(api_id)) {
       SelectApiParams.value[api_id] = ApiParams.value[api_id]
+      SelectApiParams.value[api_id].forEach(item => item['is_preset'] = true)
     }
   })
 }
diff --git a/src/components/ec_api/TabArea.vue b/src/components/ec_api/TabArea.vue
index 925c9dd..3cd0b0f 100644
--- a/src/components/ec_api/TabArea.vue
+++ b/src/components/ec_api/TabArea.vue
@@ -20,7 +20,7 @@ const ApiTableRef = ref(null)  // 表格的Ref
 // const multipleSelection = ref([])  // checkbox的处理
 
 // 定义变量用于存储接口设置的数据
-const UserApiData = ref({api: {}, base_info: {}})
+const UserApiData = ref({api: {}, base_info: {}, tab: {}})
 
 // 表格逻辑
 // 多选改变后处理逻辑
@@ -31,6 +31,7 @@ function handleParamsChange(newCheckedResult) {
 
 
 }
+
 function handleParamsSelect(val) {
   console.log('val', val)
   UserApiData.value.api[activeTab.value].params.forEach(param => {
@@ -39,9 +40,8 @@ function handleParamsSelect(val) {
   })
 }
 
-// function handleTabChange(){
-//   // 标记勾选项
-//   markIsRequestSelection()
+// function handleTabChange(val){
+//   console.log('handleTabChange', val)
 // }
 
 // 自动勾选行
@@ -53,7 +53,7 @@ function markIsChecked() {
       console.log('item', item)
       if (item['is_checked'] === true) {
         console.log('ApiTableRef.value', ApiTableRef.value)
-        ApiTableRef.value[activeTab.value - 1].toggleRowSelection(item, true)
+        ApiTableRef.value[UserApiData.value.tab[activeTab.value]].toggleRowSelection(item, true)
       }
     })
     // console.log(multipleSelection.value)
@@ -67,8 +67,12 @@ function initApiData() {
     cinema: store.state.ecApiModule.ec_api_data.cinema,
     channel: store.state.ecApiModule.ec_api_data.channel,
   }
+  let api_id_array = []
+  let api_tab = {}
   if (store.state.ecApiModule.ec_api_data.api) {
-    store.state.ecApiModule.ec_api_data.api.forEach(item => {
+    store.state.ecApiModule.ec_api_data.api.forEach((item, index) => {
+      api_id_array.push(item.id)
+      api_tab[item.id] = index
       if (!UserApiData.value['api'].hasOwnProperty(item.id)) {
         UserApiData.value['api'][item.id] = {
           'id': item.id,
@@ -79,27 +83,28 @@ function initApiData() {
         }
       }
     })
+    Object.values(UserApiData.value['api']).forEach((api) => {
+      if (api_id_array.indexOf(api['id']) < 0) {
+        delete UserApiData.value['api'][api['id']]
+      }
+    })
+    UserApiData.value.tab = api_tab
+
   }
-  console.log('initApiData.UserApiData', UserApiData.value)
 }
 
 // 监测ec_select_api的变化 如果当前选中的标签被取消勾选，则选择剩下标签的第一个
 watch(() => store.state.ecApiModule.ec_api_data.api, (oldValue, newValue) => {
   console.log('watch')
   console.log('store.state.ecApiModule.ec_api_data.api', store.state.ecApiModule.ec_api_data.api)
+  console.log('newValue', newValue)
+  // 接口数据变化后初始化本地数据
   initApiData()
-  let tempId = 1
-  if (newValue.length > 0) {
-    tempId = newValue[0].id
+  // 处理空标签逻辑
+  const select_api_id = store.getters['ecApiModule/ec_select_api_getter']
+  if (select_api_id.indexOf(activeTab.value) < 0) {
+    activeTab.value = select_api_id[0]
   }
-  newValue.forEach(item => {
-    if (item.id === activeTab.value) {
-      tempId = activeTab.value
-    }
-  })
-  activeTab.value = tempId
-
-
 }, {deep: true})
 
 
@@ -143,9 +148,15 @@ function addNewParams() {
     param: '',
     value: '',
     is_request: false,
-    is_checked: false
+    is_checked: false,
+    is_preset: false
   })
 }
+
+function test() {
+  console.log('store.state.ecApiModule.ec_api_data.api', store.state.ecApiModule.ec_api_data.api)
+  console.log('UserApiData.value', UserApiData.value)
+}
 </script>
 
 <template>
@@ -165,7 +176,7 @@ function addNewParams() {
         <el-table-column type="selection" width="50"/>
         <el-table-column label="字段名" width="120">
           <template v-slot="scope">
-            <span v-if="scope.row.param">{{ scope.row.param }}</span>
+            <span v-if="scope.row.is_preset">{{ scope.row.param }}</span>
             <span v-else><el-input type="text" placeholder="输入字段名" v-model="scope.row.param"></el-input></span>
           </template>
         </el-table-column>
@@ -194,7 +205,7 @@ function addNewParams() {
           <el-input type="text">1111</el-input>
         </el-col>
         <el-col :span="2">
-          <el-button type="primary">发送</el-button>
+          <el-button type="primary" @click="test">发送</el-button>
         </el-col>
         <el-col :span="8">
         </el-col>
diff --git a/src/store/index.js b/src/store/index.js
index ec13bd5..b57298a 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -47,7 +47,11 @@ const ecApiModule = {
             return state.ec_api_data
         },
         ec_select_api_getter: state => {
-            return state.ec_api_data.api
+            let select_api_id = []
+            state.ec_api_data.api.forEach(item => {
+                select_api_id.push(item.id)
+            })
+            return select_api_id
         },
     },
     mutations: {