1.新增批量导入 2.新增财务报表

src/views/marketing_center/components/tabHeader.vue

@@ -12,7 +12,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, nextTick } from 'vue'
+import { ref, onMounted, nextTick, watch } from 'vue'
 
 const props = defineProps({
   // {label: '设置',value: 1}
@@ -29,10 +29,8 @@ const modelValue = defineModel('modelValue', {
   required: true
 })
 
-// 改变索引
-function changeHandle(index) {
-  modelValue.value = index
-
+// 更新active_wrap位置
+function updateActivePosition(index) {
   let left = 0
   itemsWidth.value.forEach((val, i) => {
     if (i < index) {
@@ -40,7 +38,12 @@ function changeHandle(index) {
     }
   })
   leftValue.value = left + gap.value * index
+}
 
+// 改变索引
+function changeHandle(index) {
+  modelValue.value = index
+  updateActivePosition(index)
   emits('change', index)
 }
 
@@ -57,10 +60,14 @@ onMounted(() => {
     console.log('itemRefs===', itemRefs.value);
     console.log('itemsWidth===', itemsWidth.value);
 
-
-    changeHandle(modelValue.value)
+    updateActivePosition(modelValue.value)
   })
 })
+
+// 监听modelValue变化，更新位置
+watch(modelValue, (newVal) => {
+  updateActivePosition(newVal)
+})
 </script>
 
 <style scoped lang="scss">