@opendesign-plus-test/components 0.0.1-rc.33 → 0.0.1-rc.35

package/src/components/meeting/OSigMeetingCalendar.vue

@@ -6,19 +6,17 @@ import IconTips from '~icons/components/icon-tips.svg';
 import OSigMeetingAside from './components/OSigMeetingAside.vue';
 import { CalendarDataType, MeetingItemT } from './types.ts';
 import { useScreen } from '@opendesign-plus/composables';
-import { MEETING_TABS } from './config.ts';
+import { useMeetingConfig } from './composables/useMeetingConfig';
 import OMeetingCalendarList from '@/components/meeting/components/OMeetingCalendarList.vue';
-import { useI18n } from '@/i18n';
 
 const props = defineProps<{
-  //sig name
   sigName: String;
   getMeetingListRequest: any;
   getDateListRequest: any;
   getEventsListRequest: any;
   dates: String[];
 }>();
-const { t } = useI18n();
+const { t, meetingTabs } = useMeetingConfig();
 const { lePadV } = useScreen();
 const selectDate = ref<string>('');
 
@@ -257,7 +255,7 @@ onMounted(() => {
         </OPopover>
       </div>
       <OTab v-model="tabType" @change="selectTab" :line="false">
-        <OTabPane v-for="item in MEETING_TABS.slice(0, -1)" :key="item.value" :value="item.value">
+        <OTabPane v-for="item in meetingTabs.slice(0, -1)" :key="item.value" :value="item.value">
           <template #nav>
             <OIcon>
               <component :is="item.icon" />

package/src/components/meeting/components/OMeetingCalendarList.vue

@@ -11,11 +11,12 @@ import IconEvent from '~icons/meeting/icon-event.svg';
 import IconSummit from '~icons/meeting/icon-summit.svg';
 import IconMeeting from '~icons/meeting/icon-meet.svg';
 import IconChevronRight from '~icons/components/icon-chevron-right.svg';
-import { CYCLE_TYPE_OPTIONS, INTERVAL_DAY, INTERVAL_MONTH, INTERVAL_WEEK } from '../config.ts';
+import { INTERVAL_DAY, INTERVAL_MONTH, INTERVAL_WEEK } from '../config.ts';
+import { formatDate } from '../utils.ts';
+import { useMeetingConfig } from '../composables/useMeetingConfig';
+import { useActivityConfig } from '@/components/activity/composables/useActivityConfig';
 
-import { formatDate, getConfig, getPointStr } from '../utils.ts';
-import { useI18n } from '@/i18n';
-import { acticityTypeMap } from '@/components/activity/config.ts';
+const { activityTypeMap } = useActivityConfig();
 
 const props = withDefaults(defineProps<{
   list: MeetingItemT[];
@@ -23,7 +24,7 @@ const props = withDefaults(defineProps<{
 }>(), {
   list: () => [],
 });
-const { t, locale } = useI18n();
+const { t, locale, getConfig, getPointStr } = useMeetingConfig();
 const detailRefs = ref([]);
 const message = useMessage();
 const copyInfo = async (idx) => {
@@ -86,7 +87,7 @@ const computedList = computed(() => {
     const type = v.type;
     let dateRange = '';
     if (['activity'].includes(type)) {
-      let activity_type = acticityTypeMap.get(v.activity_type)?.label;
+      let activity_type = activityTypeMap.value.get(v.activity_type)?.label;
       if (v.end_date === v.start_date) {
         return {
           ...v,

package/src/components/meeting/components/OMeetingDetail.vue

@@ -1,18 +1,18 @@
 <script setup lang="ts">
 import { OLink } from '@opensig/opendesign';
 import { computed, ref } from 'vue';
-import { CalendarDataType, MeetingItemT } from '@/components/meeting/types.ts';
+import { CalendarDataType, MeetingItemT } from '../types.ts';
 import MoreText from '@/components/common/MoreText.vue';
-import { Locales, useI18n } from '@/i18n';
-import { formatDate, getPlatformLabel } from '@/components/meeting/utils.ts';
+import { formatDate } from '@/components/meeting/utils.ts';
+import { useMeetingConfig } from '../composables/useMeetingConfig';
 
 const props = defineProps<{
   data: MeetingItemT;
   from?: string;
   show: boolean;
 }>();
-const { t, locale } = useI18n();
-const isZh = computed(() => locale.value === Locales.ZH);
+const { t, getPlatformLabel } = useMeetingConfig();
+
 // 会议详情配置
 const infoList = computed(() =>
   [
@@ -28,28 +28,33 @@ const infoList = computed(() =>
 );
 
 
-const activityInfoList = computed(() =>
-  [
-    { label: '起始日期', key: 'start_date_time' },
-    { label: '结束日期', key: 'end_date_time' },
-    { label: '报名截止时间', key: 'register_end_date' },
-    { label: '活动地点', key: 'address' },
-    { label: '活动详情地址', key: 'content_url', isLink: true },
-    { label: '活动审批人', key: 'approver' },
-    { label: '审核备注', key: 'approve_record', isRecord: true },
-  ].slice(0, props.from === 'home' ? 4 : 7),
-);
-const activityInfoApprovalList = computed(() => [
-  { label: '活动类型', key: 'activity_type', isType: true },
-  { label: '活动地点', key: 'address' },
-  { label: '起始日期', key: 'start_date_time' },
-  { label: '结束日期', key: 'end_date_time' },
-  { label: '报名截止时间', key: 'register_end_date' },
-  { label: '报名网址', key: 'register_url', isLink: true },
-  { label: '活动详情地址', key: 'content_url', isLink: true },
-  { label: '活动审批人', key: 'approver' },
-  { label: '审核备注', key: 'approve_record', isRecord: true },
-]);
+const activityInfoList = computed(() => {
+  const isLive = props.data.live_url?.length > 0;
+  return [
+    { label: t('meeting.activityDetail2'), key: 'agenda', ellipsis: true },
+    { label: t('meeting.startDate'), key: 'start_date_time' },
+    { label: t('meeting.endDate'), key: 'end_date_time' },
+    { label: t('meeting.registrationDeadline'), key: 'register_end_date' },
+    { label: isLive ? t('meeting.livePlatform') : t('meeting.activityAddress'), key: 'address' },
+    { label: t('meeting.activityDetailUrl'), key: 'content_url', isLink: true },
+    { label: t('meeting.activityApprover'), key: 'approver' },
+    { label: t('meeting.reviewNotesLabel'), key: 'approve_record', isRecord: true },
+  ].slice(0, props.from === 'home' ? 5 : 8);
+});
+const activityInfoApprovalList = computed(() => {
+  const isLive = props.data.live_url?.length > 0;
+  return [
+    { label: t('meeting.activityType'), key: 'activity_type', isType: true },
+    { label: isLive ? t('meeting.livePlatform') : t('meeting.activityAddress'), key: 'address' },
+    { label: t('meeting.startDate'), key: 'start_date_time' },
+    { label: t('meeting.endDate'), key: 'end_date_time' },
+    { label: t('meeting.registrationDeadline'), key: 'register_end_date' },
+    { label: t('meeting.registrationUrl'), key: 'register_url', isLink: true },
+    { label: t('meeting.activityDetailUrl'), key: 'content_url', isLink: true },
+    { label: t('meeting.activityApprover'), key: 'approver' },
+    { label: t('meeting.reviewNotesLabel'), key: 'approve_record', isRecord: true },
+  ];
+});
 
 const columns = computed(() => {
   if (props.data.type === CalendarDataType.ACTIVITY || props.data.type === CalendarDataType.EVENTS) {
@@ -116,7 +121,7 @@ defineExpose({ copyInfo });
           <p v-for="re in data[info.key]" :key="re.create_time" class="value">
             {{ re.reason }}&nbsp;&nbsp;
             {{ formatDate(re.create_time, 'YYYY/MM/DD HH:mm:ss') }}
-            审核{{ re.action === 1 ? '通过' : '驳回' }}
+            {{ re.action === 1 ? t('meeting.approveReview') : t('meeting.rejectReview') }}
           </p>
         </div>
       </template>

package/src/components/meeting/components/OSigMeetingAside.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
 import { OIcon, OIconArrowLeft, OIconArrowRight } from '@opensig/opendesign';
 import IconMeetinging from '~icons/meeting/icon-meet.svg';
-import { getConfig } from '@/components/meeting/utils.ts';
+import { useMeetingConfig } from '@/components/meeting/composables/useMeetingConfig';
 import { CalendarDataType } from '@/components/meeting';
 
+const { getConfig } = useMeetingConfig();
+
 const props = defineProps<{
   data: any[];
   current: number;

package/src/components/meeting/composables/useMeetingConfig.ts

@@ -0,0 +1,111 @@
+import { computed } from 'vue';
+import dayjs from 'dayjs';
+import { useI18n } from '@/i18n';
+import IconAll from '~icons/meeting/icon-all.svg';
+import IconEvent from '~icons/meeting/icon-event.svg';
+import IconMeeting from '~icons/meeting/icon-meet.svg';
+import IconSummit from '~icons/meeting/icon-summit.svg';
+import { CalendarDataType, meetingTabT, OptionItemT } from '../types';
+import { INTERVAL_DAY, INTERVAL_MONTH, INTERVAL_WEEK, TYPE_COLOR_MAP } from '../config';
+
+export const useMeetingConfig = () => {
+  const { t, locale } = useI18n();
+
+  const meetingTabs = computed<meetingTabT[]>(() => [
+    { label: t('meeting.meetingTypeAll'), value: CalendarDataType.ALL, icon: IconAll },
+    { label: t('meeting.meetingTypeMeet'), value: CalendarDataType.MEETING, icon: IconMeeting, color: TYPE_COLOR_MAP.meeting, zIndex: 3 },
+    { label: t('meeting.meetingTypeEvents'), value: CalendarDataType.EVENTS, icon: IconEvent, color: TYPE_COLOR_MAP.events, zIndex: 2 },
+    { label: t('meeting.meetingTypeSummit'), value: CalendarDataType.SUMMIT, icon: IconSummit, color: TYPE_COLOR_MAP.summit, zIndex: 1 },
+  ]);
+
+  const cycleTypeOptions0 = computed<OptionItemT[]>(() => [
+    { label: t('meeting.day0'), value: INTERVAL_DAY, max: 7 },
+    { label: t('meeting.week0'), value: INTERVAL_WEEK, max: 2 },
+    { label: t('meeting.month0'), value: INTERVAL_MONTH, max: 1 },
+  ]);
+
+  const cycleTypeOptions = computed<OptionItemT[]>(() => [
+    { label: t('meeting.day'), value: INTERVAL_DAY, max: 7 },
+    { label: t('meeting.week'), value: INTERVAL_WEEK, max: 2 },
+    { label: t('meeting.month'), value: INTERVAL_MONTH, max: 1 },
+  ]);
+
+  const weekDay = computed(() => [
+    t('meeting.sunday'),
+    t('meeting.monday'),
+    t('meeting.tuesday'),
+    t('meeting.wednesday'),
+    t('meeting.thursday'),
+    t('meeting.friday'),
+    t('meeting.saturday'),
+  ]);
+
+  const intervalWeekOptions = computed(() => {
+    const list: OptionItemT[] = [];
+    for (let i = 1; i <= 7; i++) {
+      const idx = i % 7;
+      list.push({ value: idx, label: weekDay.value[idx] });
+    }
+    return list;
+  });
+
+  const getPointStr = (cycleType: number, points: number[]) => {
+    if (cycleType === INTERVAL_WEEK) {
+      return points
+        .sort((a, b) => {
+          const aIdx = intervalWeekOptions.value.findIndex((v) => v.value === a);
+          const bIdx = intervalWeekOptions.value.findIndex((v) => v.value === b);
+          return aIdx - bIdx;
+        })
+        .map((point: number) => {
+          const opt = intervalWeekOptions.value.find((v) => v.value === point);
+          return opt?.label || String(point);
+        })
+        .join(t('meeting.cycleSplit'));
+    }
+    if (cycleType === INTERVAL_MONTH) {
+      return points.join(t('meeting.cycleSplit'));
+    }
+    return '';
+  };
+
+  const getConfig = (val: CalendarDataType, key: keyof meetingTabT): string => {
+    let value = val;
+    if (val === CalendarDataType.ACTIVITY) {
+      value = CalendarDataType.EVENTS;
+    }
+    const find: meetingTabT | undefined = meetingTabs.value.find(v => v.value === value);
+    return find?.[key] || '';
+  };
+
+  const getPlatformLabel = (platform: string) => {
+    switch (platform) {
+      case 'WELINK':
+        return 'WeLink';
+      case 'ZOOM':
+        return 'Zoom';
+      case 'TENCENT':
+        return locale.value === 'zh' ? '腾讯会议' : 'Tencent';
+      default:
+        return platform;
+    }
+  };
+
+  const getWeekFromDate = (date: string | Date) => {
+    return weekDay.value[dayjs(date).day()];
+  };
+
+  return {
+    t,
+    locale,
+    meetingTabs,
+    cycleTypeOptions0,
+    cycleTypeOptions,
+    weekDay,
+    intervalWeekOptions,
+    getPointStr,
+    getConfig,
+    getPlatformLabel,
+    getWeekFromDate,
+  };
+};

package/src/components/meeting/config.ts

@@ -1,121 +1,59 @@
-import IconAll from '~icons/meeting/icon-all.svg';
-import IconEvent from '~icons/meeting/icon-event.svg';
-import IconMeeting from '~icons/meeting/icon-meet.svg';
-import IconSummit from '~icons/meeting/icon-summit.svg';
-import { useI18n } from '@/i18n';
-import { CalendarDataType, meetingTabT } from './types.ts';
-
-const { t } = useI18n();
-
-const getMeetingColor = () => {
-  if (typeof document !== 'undefined') {
-    const deepBlue = getComputedStyle(document.documentElement)
-      .getPropertyValue('--o-deep-blue-6')?.trim();
-    if (deepBlue) {
-      return 'rgba(var(--o-deep-blue-6))';
-    }
-  }
-  return 'var(--o-color-primary1)';
-};
-
-export const TYPE_COLOR_MAP = {
-  summit: 'rgba(var(--o-orange-6))',
-  events: 'rgba(var(--o-cyan-6))',
-  meeting: getMeetingColor(),
+import { CalendarDataType, meetingTabT } from './types.ts';
+import IconAll from '~icons/meeting/icon-all.svg';
+import IconEvent from '~icons/meeting/icon-event.svg';
+import IconMeeting from '~icons/meeting/icon-meet.svg';
+import IconSummit from '~icons/meeting/icon-summit.svg';
+
+const getMeetingColor = () => {
+  if (typeof document !== 'undefined') {
+    const deepBlue = getComputedStyle(document.documentElement)
+      .getPropertyValue('--o-deep-blue-6')?.trim();
+    if (deepBlue) {
+      return 'rgba(var(--o-deep-blue-6))';
+    }
+  }
+  return 'var(--o-color-primary1)';
 };
-export const MEETING_TABS: meetingTabT[] = [
-  {
-    label: t('meeting.meetingTypeAll'),
-    value: CalendarDataType.ALL,
-    icon: IconAll,
-  },
-  {
-    label: t('meeting.meetingTypeMeet'),
-    value: CalendarDataType.MEETING,
-    icon: IconMeeting,
-    color: TYPE_COLOR_MAP.meeting,
-    zIndex: 3,
-  },
-  {
-    label: t('meeting.meetingTypeEvents'),
-    value: CalendarDataType.EVENTS,
-    icon: IconEvent,
-    color: TYPE_COLOR_MAP.events,
-    zIndex: 2,
-  },
-  {
-    label: t('meeting.meetingTypeSummit'),
-    value: CalendarDataType.SUMMIT,
-    icon: IconSummit,
-    color: TYPE_COLOR_MAP.summit,
-    zIndex: 1,
-  },
-];
-
-
-export const INTERVAL_DAY = 0;
-export const INTERVAL_WEEK = 1;
-export const INTERVAL_MONTH = 2;
-
-export const CYCLE_TYPE_OPTIONS0 = [
-  {
-    label: t('meeting.day0'),
-    value: INTERVAL_DAY,
-    max: 7,
-  },
-  {
-    label: t('meeting.week0'),
-    value: INTERVAL_WEEK,
-    max: 2,
-  },
-  {
-    label: t('meeting.month0'),
-    value: INTERVAL_MONTH,
-    max: 1,
-  },
-];
-export const CYCLE_TYPE_OPTIONS = [
-  {
-    label: t('meeting.day'),
-    value: INTERVAL_DAY,
-    max: 7,
-  },
-  {
-    label: t('meeting.week'),
-    value: INTERVAL_WEEK,
-    max: 2,
-  },
-  {
-    label: t('meeting.month'),
-    value: INTERVAL_MONTH,
-    max: 1,
-  },
-];
-export const WEEKDAY = [
-  t('meeting.sunday'),
-  t('meeting.monday'),
-  t('meeting.tuesday'),
-  t('meeting.wednesday'),
-  t('meeting.thursday'),
-  t('meeting.friday'),
-  t('meeting.saturday'),
-];
-
-const getWeekOptions = () => {
-  const list = [];
-  for (let i = 1; i <= 7; i++) {
-    const idx = i % 7;
-    list.push({
-      value: idx,
-      label: WEEKDAY[idx],
-    });
-  }
-  return list;
-};
-
-export const INTERVAL_WEEK_OPTIONS = getWeekOptions();
-
-
-export const EMAIL_REGEX = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
-
-export const PROGRESS_COLORS = ['var(--o-color-primary1)', 'var(--o-color-warning1)', 'var(--o-color-success1)'];
+
+export const TYPE_COLOR_MAP = {
+  summit: 'rgba(var(--o-orange-6))',
+  events: 'rgba(var(--o-cyan-6))',
+  meeting: getMeetingColor(),
+};
+
+export const INTERVAL_DAY = 0;
+export const INTERVAL_WEEK = 1;
+export const INTERVAL_MONTH = 2;
+
+export const EMAIL_REGEX = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
+
+export const PROGRESS_COLORS = ['var(--o-color-primary1)', 'var(--o-color-warning1)', 'var(--o-color-success1)'];
+
+export const getMeetingTabs = (t: (key: string) => string): meetingTabT[] => [
+  {
+    label: t('meeting.meetingTypeAll'),
+    value: CalendarDataType.ALL,
+    icon: IconAll,
+  },
+  {
+    label: t('meeting.meetingTypeMeet'),
+    value: CalendarDataType.MEETING,
+    icon: IconMeeting,
+    color: TYPE_COLOR_MAP.meeting,
+    zIndex: 3,
+  },
+  {
+    label: t('meeting.meetingTypeEvents'),
+    value: CalendarDataType.EVENTS,
+    icon: IconEvent,
+    color: TYPE_COLOR_MAP.events,
+    zIndex: 2,
+  },
+  {
+    label: t('meeting.meetingTypeSummit'),
+    value: CalendarDataType.SUMMIT,
+    icon: IconSummit,
+    color: TYPE_COLOR_MAP.summit,
+    zIndex: 1,
+  },
+];

package/src/components/meeting/types.ts

@@ -109,6 +109,7 @@ export interface MeetingItemT extends MeetingPostT {
   update_time: string;
   time: string; // 处理一下时间范围
   cycle_sub: any[];
+  live_url?: string;
 }
 
 export interface PageParamsT {