OfficeSystem/pages/index/index.vue

<template>
  <view>
  <!-- 顶部Tabs栏（只在非客户管理、我的、月度考核页面显示） -->
  <view class="fixed-tabs" v-if="shouldShowTopTabs">
    <uv-tabs :list="topTabs" :current="topTabValue" @click="clickTab"></uv-tabs>
  </view>
  
  <!-- 内容区域 -->
  <view class="content-wrapper">
    <!-- 客户管理（底部导航栏选中时显示，使用 v-show 避免组件销毁重建） -->
    <CustomerManagement v-if="value === customerManagementIndex" ref="customerManagementRef" />
    <!-- 我的 -->
    <My v-else-if="value === myIndex" />
    <!-- 月度考核（排行榜） -->
    <RankingBoard v-else-if="admin_bst && value === rankingIndex" />

  
      <!-- 工作台 -->
    <Workbench v-else-if="value === workIndex" />

    <!-- 其他内容（底部导航栏未选中客户管理时显示） -->
    <template v-else>
      <!-- 日程编辑 -->
      <ScheduleEditor
        v-if="topTabValue === 0"
        ref="scheduleEditorRef"
        :events="allEvents"
        @date-change="handleDateChange"
      />

      <!-- 内容看板 -->
      <ContentDashboard v-if="topTabValue === 1" />

      <!-- 待办事项 -->
      <TodoList v-if="topTabValue === 2" />

      <!-- 消息内容 -->
      <MessageContent v-if="topTabValue === 3" />

    </template>
  </view>

  <!-- 悬浮新建按钮（只在日程编辑页显示） -->
  <FabPlus v-if="topTabValue === 0 && shouldShowTopTabs" @click="handleAddClick" />

  <!-- 新建日程弹窗（保留以备后用） -->
  <AddEventModal :show="showAdd" @ok="addEvent" @cancel="showAdd = false" />

  <!-- 底部导航 -->
  <uv-tabbar :value="value" @change="index=>value = index">
    <uv-tabbar-item text="首页" icon="home"></uv-tabbar-item>
    <uv-tabbar-item text="工作台" icon="calendar"></uv-tabbar-item>
    <template v-if="admin_bst">
      <uv-tabbar-item text="月度考核 " icon="integral"></uv-tabbar-item>

    <uv-tabbar-item text="客户管理" icon="kefu-ermai" ></uv-tabbar-item>
    </template>
    <uv-tabbar-item text="我的" icon="account"></uv-tabbar-item>
  </uv-tabbar>
  </view>
</template>

<script setup>
import { ref, computed, watch, onMounted } from 'vue';
import { onShow, onReachBottom } from '@dcloudio/uni-app';
import { useUserStore } from '@/store/user';
import { getUserInfo } from '@/api';
import FabPlus from '@/components/FabPlus.vue';
import AddEventModal from '@/components/index/scheduleEditor/AddEventModal.vue';
import ScheduleEditor from '@/components/index/scheduleEditor/ScheduleEditor.vue';
import ContentDashboard from '@/components/index/ContentDashboard.vue';
import TodoList from '@/components/index/TodoList.vue';
import MessageContent from '@/components/index/MessageContent.vue';
import CustomerManagement from '@/components/customer/CustomerManagement.vue';
import My from '@/components/my/My.vue';
import RankingBoard from '@/components/RankingBoard/RankingBoard.vue';
import Workbench from '@/components/Workbench/Workbench.vue';


// 顶部tabs选项
const topTabs = [
  { name: '日程编辑', value: 0 },
  { name: '内容看板', value: 1 },
  { name: '待办事项', value: 2 },
  { name: '消息内容', value: 3 }

];
// 默认显示内容看板
const topTabValue = ref(1);

function clickTab(item) {
  topTabValue.value = item.value;
  console.log('切换tab:', item.name);
}

// 当前选择的日期，格式：YYYY-MM-DD（用于新建日程时传递日期）
const selectedDate = ref(new Date().toISOString().slice(0, 10));

// 示例日程
const today = new Date().toISOString().slice(0, 10);
// 获取明天的日期
const tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
const tomorrowStr = tomorrow.toISOString().slice(0, 10);
// 获取昨天的日期
const yesterday = new Date();
yesterday.setDate(yesterday.getDate() - 1);
const yesterdayStr = yesterday.toISOString().slice(0, 10);

const allEvents = ref([
  {id:1,title:'今天的日程1',startHour:10,startMin:30,color:'#e3fae6',date:today},

  {id:5,title:'明天的日程2',startHour:10,startMin:30,color:'#fae1e1',date:tomorrowStr},
  {id:6,title:'昨天的日程3',startHour:10,startMin:30,color:'#e3fae6',date:yesterdayStr},
]);

// 处理日期变化（从 ScheduleEditor 组件传来）
const handleDateChange = (dateStr) => {
  selectedDate.value = dateStr;
  console.log('通过日历组件更新选择日期：', selectedDate.value);
}

// 悬浮按钮/弹窗控制
const showAdd = ref(false);

// ScheduleEditor 组件引用
const scheduleEditorRef = ref(null);

// CustomerManagement 组件引用
const customerManagementRef = ref(null);

// 处理添加按钮点击
const handleAddClick = () => {
  // 从 ScheduleEditor 组件获取当前选择的日期
  const currentDate = scheduleEditorRef.value?.selectedDate || selectedDate.value;
  uni.navigateTo({
    url: `/pages/event/add/index?date=${currentDate}`
  });
};


// 添加日程
function addEvent(e) {
  // e是{title, startHour, startMin, color, date等}，如果没有date则使用selectedDate
  allEvents.value.push({
    ...e,
    date: e.date || selectedDate.value,
    id: Date.now()
  });
  showAdd.value = false;
}

const value=ref(0);
const admin_bst=ref(false);

// 动态计算各个页面的索引
const rankingIndex = computed(() => 3);
const customerManagementIndex = computed(() => 4);
const myIndex = computed(() =>  2);
const workIndex = computed(() =>  1);

// 判断是否显示顶部Tabs栏
const shouldShowTopTabs = computed(() => {
  if (value.value === customerManagementIndex.value || value.value === myIndex.value||value.value === workIndex.value) {
    return false;
  }
  if (admin_bst.value && value.value === rankingIndex.value) {
    return false;
  }
  return true;
});

watch(value, (newValue, oldValue) => {
  console.log('值变化:', oldValue, '→', newValue)
})

// 页面加载时请求接口
onMounted(() => {
  const userStore = useUserStore();
  console.log('当前 token:', userStore.token);
  let roles = userStore.getUserInfo.roles
  admin_bst.value = roles.some((role) => ['admin', 'sys_admin','bst'].includes(role));
  console.log('admin_bst',admin_bst.value);


  // 请求用户信息接口
  getUserInfo().then(res => {
    console.log('getInfo 接口返回:', res);
  }).catch(err => {
    console.error('getInfo 接口请求失败:', err);
  });
  
  // 看板数据已由 ContentDashboard 组件自己加载，这里不再请求
});

// 页面显示时处理从新建日程页面返回的数据
onShow(() => {
  // 从全局存储中读取新添加的日程数据
  try {
    const newEventData = uni.getStorageSync('newEventData');
    if (newEventData) {
      addEvent(newEventData);
      // 清除存储的数据
      uni.removeStorageSync('newEventData');
    }
  } catch (e) {
    console.error('读取新日程数据失败:', e);
  }
  
  // 如果当前在客户管理页面，检查是否需要刷新客户列表
  if (value.value === customerManagementIndex.value && customerManagementRef.value) {
    // 检查是否有刷新标志（从客户详情页删除后设置）
    const needRefresh = uni.getStorageSync('customerListNeedRefresh');
    if (needRefresh) {
      // 刷新客户列表
      customerManagementRef.value.refresh();
      // 清除刷新标志
      uni.removeStorageSync('customerListNeedRefresh');
    }
  }
});

// 触底加载更多（仅在客户管理页面时生效）
onReachBottom(() => {
  // 只有在客户管理页面时才触发加载更多
  if (value.value === customerManagementIndex.value && customerManagementRef.value) {
    customerManagementRef.value.winB_LoadMore();
  }
});
</script>

<style lang="scss" scoped>

.status_bar {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

.fixed-tabs {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: #fff;
  z-index: 999;
  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.06);
}

.content-wrapper {

  overflow: hidden;

  

}

:deep(.bottom-tabbar) { z-index: 1000 !important; }
</style>