@opendesign-plus-test/components 0.0.1-rc.28 → 0.0.1-rc.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opendesign-plus-test/components",
-  "version": "0.0.1-rc.28",
+  "version": "0.0.1-rc.30",
   "type": "module",
   "publishConfig": {
     "access": "public",

package/src/components/activity/OActivityApproval.vue

@@ -168,7 +168,7 @@ const cancel = () => {
 };
 
 const confirmCancel = async () => {
-  if (!props.deleteActivityRequest || !props.cancelActivityRequest) {
+  if (props.deleteActivityRequest && props.cancelActivityRequest) {
     try {
       loading.value = true;
       if (cancelStatus.value === 1) {
@@ -181,7 +181,8 @@ const confirmCancel = async () => {
       message.success({
         content: `“${ currentRow.value?.title }”活动${ cancelText.value }成功`,
       });
-    } catch {
+    } catch (err) {
+      console.log(err);
       loading.value = false;
       cancelVisible.value = false;
       message.danger({

package/src/components/activity/OActivityForm.vue

@@ -183,7 +183,7 @@ const rules = ref<Record<string, RulesT[]>>({
   }],
   email_list: [{
     validator: (value: string) => {
-      const str = value.replaceAll(' ', '') || '';
+      const str = value.replaceAll(' ', '').replaceAll(',', ';') || '';
       if (str.length) {
         if (str.length > 1020) {
           return {

package/src/components/activity/OMyActivityCalendar.vue

@@ -866,22 +866,23 @@ const deleteActions = computed<DialogActionT[]>(() => {
       .el-calendar__body {
         .el-calendar-table {
           width: 100%;
-          tr {
-            background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
-          }
 
           th {
             text-align: center;
-            background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
             border: none;
+            --o-color-control3-light: transparent;
+          }
+
+          tr {
+            --o-color-fill2: transparent;
           }
 
           td {
-            background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
             border: none;
             text-align: center;
             transition: none;
             padding: 0;
+            background-color: transparent !important;
 
             .el-calendar-day {
               padding: 0;
@@ -1251,7 +1252,6 @@ const deleteActions = computed<DialogActionT[]>(() => {
             align-items: flex-start;
             gap: var(--o-gap-3);
             width: 100%;
-            margin-bottom: var(--o-gap-2);
             @include respond-to('phone') {
               flex-grow: 1;
               width: 100%;
@@ -1359,6 +1359,7 @@ const deleteActions = computed<DialogActionT[]>(() => {
             align-items: center;
             padding-left: calc(var(--o-gap-3) + var(--icon-size));
             gap: var(--o-gap-4);
+            margin-top: var(--o-gap-2);
             width: 100%;
 
             .o-link {
@@ -1369,10 +1370,6 @@ const deleteActions = computed<DialogActionT[]>(() => {
               --link-color-active: var(--o-color-primary3);
             }
 
-            .o-link + .o-link {
-              margin-left: var(--o-gap-section-6);
-            }
-
             .o-icon {
               font-size: 16px;
             }

package/src/components/activity/config.ts

@@ -102,14 +102,14 @@ export const approvalStatusMap = new Map([
   [
     'rejected',
     {
-      label: '审核驳回',
+      label: '已驳回',
       value: 'rejected',
     },
   ],
   [
     'approved',
     {
-      label: '审核通过',
+      label: '已通过',
       value: 'approved',
     },
   ],

package/src/components/meeting/OMeetingCalendar.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, nextTick, onMounted, ref, watch } from 'vue';
 import {
-  isClient, OButton,
+  isClient,
   OIcon,
   OIconChevronLeft,
   OIconChevronRight,
@@ -12,41 +12,34 @@ import {
   OTabPane,
 } from '@opensig/opendesign';
 import dayjs from 'dayjs';
-import { ElCalendar, ElConfigProvider } from 'element-plus';
+import { ElCalendar } from 'element-plus';
 import OMeetingCalendarList from './components/OMeetingCalendarList.vue';
-import elZh from 'element-plus/es/locale/lang/zh-cn';
-import elEn from 'element-plus/es/locale/lang/en';
 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 { Locales, useI18n } from '@/i18n';
 import { MEETING_TABS } from './config';
-import { CalendarDataType, GroupItemT } from './types.ts';
+import { CalendarDataType, GroupItemT, MeetingCalendarPropsT, MeetingGroupType } from './types.ts';
 import { formatDate, getConfig } from './utils.ts';
 
-const props = withDefaults(defineProps<{
-  getDateListRequest: any;
-  getMeetingListRequest: any;
-  getSummitListRequest: any;
-  getEventsListRequest: any;
-  hiddenEvents?: boolean;
-  hiddenSummit?: boolean;
-}>(), {
+const props = withDefaults(defineProps<MeetingCalendarPropsT>(), {
   getSummitListRequest: async () => [],
   getEventsListRequest: async () => [],
   hiddenEvents: false,
   hiddenSummit: false,
+  groupType: MeetingGroupType.SIG,
 });
 
 const { t, locale } = useI18n();
 const isEn = computed(() => locale.value === Locales.EN);
-const isZh = computed(() => locale.value === Locales.ZH);
 
 // -------------------- 获取存在会议的日期列表 --------------------
 const latestDay = ref<string>(''); // 截止当天最新的活动日期
 const dateList = ref([]);
 const summitData = ref([]);
+const summitDates = ref([]);
 const eventsData = ref([]);
+const eventsDates = ref([]);
 const allDates = ref<string[]>([]);
 const meetingData = ref([]);
 // 日历展示时间限制
@@ -97,6 +90,8 @@ const getActivityData = async (date) => {
       return {
         ...v,
         type: 'activity',
+        start_date_time: `${ formatDate(v.start_date) } ${ v.start }`,
+        end_date_time: `${ formatDate(v.end_date) } ${ v.end }`,
       };
     });
   } else {
@@ -106,9 +101,19 @@ const getActivityData = async (date) => {
 
 const getDateList = async (date) => {
   if (props.getDateListRequest) {
-    dateList.value = await props.getDateListRequest(date);
-  } else {
-    dateList.value = [];
+    props.getDateListRequest(date).then(res => {
+      dateList.value = res;
+    });
+  }
+  if (props.getEventsDatesRequest) {
+    props.getEventsDatesRequest(date).then(res => {
+      eventsDates.value = res;
+    });
+  }
+  if (props.getSummitDatesRequest) {
+    props.getSummitDatesRequest(date).then(res => {
+      summitDates.value = res;
+    });
   }
 };
 
@@ -141,12 +146,11 @@ const paramGetDaysData = async (params: { date: string; type: string }) => {
   }
 };
 
-
 const renderData = computed(() => {
   return [
     ...meetingData.value.filter((v) => !sig.value || v.group_name === sig.value),
-    ...eventsData.value.filter(v => v.dates.includes(currentDay.value)),
-    ...summitData.value.filter(v => v.dates.includes(currentDay.value)),
+    ...eventsData.value.filter(v => (!dayjs(v.start_date).isAfter(dayjs(currentDay.value)) && !dayjs(currentDay.value).isAfter(dayjs(v.end_date))) || v.dates?.includes(currentDay.value)),
+    ...summitData.value.filter(v => v.dates?.includes(currentDay.value)),
   ].filter((v) => {
     if (tabType.value === 'all') {
       return true;
@@ -161,7 +165,7 @@ const getDateData = async (day?: string) => {
   getActivityData(date);
   getDateList(date);
 
-  allDates.value = [...new Set([...dateList.value, ...summitData.value.map(v => v.dates), ...eventsData.value.map(v => v.dates)])]
+  allDates.value = [...new Set([...dateList.value, ...summitDates.value, ...eventsDates.value])]
     .flat()
     .sort((a: string, b: string) => dayjs(a).isAfter(dayjs(b)) ? 1 : -1);
   if (!day) {
@@ -263,6 +267,19 @@ const formatYearMonth = (date: string) => {
     return date;
   }
 };
+// 根据类型校验日历日期是否可选
+const checkSelectedDay = (type: CalendarDataType, date: string) => {
+  if (type === CalendarDataType.MEETING) {
+    return ([CalendarDataType.ALL, CalendarDataType.MEETING].includes(tabType.value) && dateList.value.includes(date));
+  }
+  if (type === CalendarDataType.SUMMIT) {
+    return ([CalendarDataType.ALL, CalendarDataType.SUMMIT].includes(tabType.value) && summitDates.value.includes(date));
+  }
+  if (type === CalendarDataType.EVENTS) {
+    return ([CalendarDataType.ALL, CalendarDataType.EVENTS].includes(tabType.value) && eventsDates.value.includes(date));
+  }
+  return false;
+};
 </script>
 <template>
   <div class="o-meeting-calendar">
@@ -279,7 +296,11 @@ const formatYearMonth = (date: string) => {
                 <OIconChevronRight />
               </OIcon>
             </div>
-            <OSelect v-model="sig" :placeholder="t('meeting.allSigs')" clearable>
+            <OSelect
+              v-model="sig"
+              :placeholder="groupType === MeetingGroupType.GROUP ? t('meeting.allGroups') : t('meeting.allSigs')"
+              clearable
+            >
               <OOption v-for="t in sigOptions" :value="t.group_name" :key="t.group_name">{{ t.group_name }}</OOption>
             </OSelect>
           </div>
@@ -303,7 +324,7 @@ const formatYearMonth = (date: string) => {
                       zIndex: getConfig(CalendarDataType.MEETING, 'zIndex'),
                       backgroundColor: getConfig(CalendarDataType.MEETING, 'color')
                     }"
-                  v-if="(tabType === CalendarDataType.ALL || tabType === CalendarDataType.MEETING) && dateList.includes(data.day)">
+                  v-if="checkSelectedDay(CalendarDataType.MEETING, data.day)">
                   <IconMeeting />
                 </OIcon>
                 <OIcon
@@ -312,7 +333,7 @@ const formatYearMonth = (date: string) => {
                       zIndex: getConfig(CalendarDataType.EVENTS, 'zIndex'),
                       backgroundColor: getConfig(CalendarDataType.EVENTS, 'color')
                     }"
-                  v-if="(tabType === CalendarDataType.ALL || tabType === CalendarDataType.EVENTS) && eventsData.some(v => v.dates.includes(data.day))">
+                  v-if="checkSelectedDay(CalendarDataType.EVENTS, data.day)">
                   <IconEvent />
                 </OIcon>
                 <OIcon
@@ -321,7 +342,7 @@ const formatYearMonth = (date: string) => {
                       zIndex: getConfig(CalendarDataType.SUMMIT, 'zIndex'),
                       backgroundColor: getConfig(CalendarDataType.SUMMIT, 'color')
                     }"
-                  v-if="(tabType === CalendarDataType.ALL || tabType === CalendarDataType.SUMMIT) && summitData.some(v => v.dates.includes(data.day))">
+                  v-if="checkSelectedDay(CalendarDataType.SUMMIT, data.day)">
                   <IconSummit />
                 </OIcon>
               </div>
@@ -354,7 +375,7 @@ const formatYearMonth = (date: string) => {
 
         <div>
           <OScroller class="meeting-list" show-type="hover" size="small">
-            <OMeetingCalendarList :list="renderData">
+            <OMeetingCalendarList :list="renderData" :groupType="groupType">
               <template #empty>
                 <slot name="empty"></slot>
               </template>

package/src/components/meeting/OMeetingForm.vue

@@ -6,6 +6,7 @@ import {
   OForm,
   OFormItem,
   OIcon,
+  OIconTime,
   OInput,
   OOption,
   OPopover,
@@ -14,19 +15,18 @@ import {
   OSelect,
   OSwitch,
   OTextarea,
-  OIconTime,
   useMessage,
 } from '@opensig/opendesign';
 import IconHelp from '~icons/meeting/icon-help.svg';
 import IconTip from '~icons/meeting/icon-tip.svg';
-import { MeetingFormPropsT, MeetingPostT, OptionItemT } from './types';
+import { MeetingFormPropsT, MeetingGroupType, MeetingPostT, OptionItemT } from './types';
 import dayjs from 'dayjs';
 import { findLabelFromOptions, formatDateNumber, getDateNumber, getPlatformLabel } from './utils';
 import {
+  CYCLE_TYPE_OPTIONS0,
   EMAIL_REGEX,
   INTERVAL_DAY,
   INTERVAL_MONTH,
-  CYCLE_TYPE_OPTIONS0,
   INTERVAL_WEEK,
   INTERVAL_WEEK_OPTIONS,
 } from './config';
@@ -40,8 +40,9 @@ const props = withDefaults(defineProps<MeetingFormPropsT>(), {
   isSub: false,
   isEdit: false,
   showBtns: true,
+  groupType: MeetingGroupType.SIG,
 });
-const message = useMessage();
+const message = useMessage(null);
 
 const cycleTypeOptions = ref(CYCLE_TYPE_OPTIONS0);
 
@@ -72,161 +73,166 @@ const form = ref<MeetingPostT>(Object.assign({}, initForm) as unknown as Meeting
 const formRef = ref(null); // 表单实例
 const loading = ref(false); // 提交状态
 // 表单校验规则
-const rules = ref({
-  topic: [
-    { required: true, message: t('meeting.enterMeetingName') },
-    {
-      validator: (value: string) => {
-        if (value.length > 128) {
-          return {
-            type: 'danger',
-            message: t('meeting.meetingNameTooLong'),
-          };
-        }
-      },
-    },
-  ],
-  agenda: [
-    {
-      validator: (value: string) => {
-        if (value.length > 4096) {
-          return {
-            type: 'danger',
-            message: t('meeting.meetingAgendaTooLong'),
-          };
-        }
-      },
-    },
-  ],
-  group_name: [{ required: true, message: t('meeting.selectSig') }],
-  etherpad: [{ required: true, message: t('meeting.enterEtherpad') }],
-  date: [{ required: true, message: t('meeting.selectDate') }],
-  time: [
-    {
-      validator: (value: string) => {
-        const { is_cycle, cycle_type, cycle_interval, cycle_point, date, date_range } = form.value;
-        if (is_cycle) {
-          const msg = {
-            type: 'danger',
-            message: t('meeting.finishMeetingConfig'),
-          };
-          if (cycle_type === INTERVAL_DAY) {
-            if (!cycle_interval) return msg;
-          }
-          if (cycle_type === INTERVAL_WEEK) {
-            if (!cycle_interval || !cycle_point?.length) return msg;
-          }
-          if (cycle_type === INTERVAL_MONTH) {
-            if (!cycle_interval || !cycle_point?.length) return msg;
+const rules = computed(() => {
+  return {
+    topic: [
+      { required: true, message: t('meeting.enterMeetingName') },
+      {
+        validator: (value: string) => {
+          if (value.length > 128) {
+            return {
+              type: 'danger',
+              message: t('meeting.meetingNameTooLong'),
+            };
           }
-          if (!date_range?.length) {
+        },
+      },
+    ],
+    agenda: [
+      {
+        validator: (value: string) => {
+          if (value.length > 4096) {
             return {
               type: 'danger',
-              message: t('meeting.selectMeetingDate'),
+              message: t('meeting.meetingAgendaTooLong'),
             };
           }
-          const NONE_MSG = t('meeting.invalidMeetingDuration');
-          let start = date_range[0];
-          const end = date_range[1];
-          if (cycle_type === INTERVAL_WEEK) {
-            const weeks = new Set();
-            while (!dayjs(start).isAfter(dayjs(end))) {
-              weeks.add(dayjs(start).day());
-              start = dayjs(start).add(1, 'day');
+        },
+      },
+    ],
+    group_name: [{
+      required: true,
+      message: props.groupType === MeetingGroupType.GROUP ? t('meeting.selectGroup') : t('meeting.selectSig'),
+    }],
+    etherpad: [{ required: true, message: t('meeting.enterEtherpad') }],
+    date: [{ required: true, message: t('meeting.selectDate') }],
+    time: [
+      {
+        validator: (value: string) => {
+          const { is_cycle, cycle_type, cycle_interval, cycle_point, date, date_range } = form.value;
+          if (is_cycle) {
+            const msg = {
+              type: 'danger',
+              message: t('meeting.finishMeetingConfig'),
+            };
+            if (cycle_type === INTERVAL_DAY) {
+              if (!cycle_interval) return msg;
+            }
+            if (cycle_type === INTERVAL_WEEK) {
+              if (!cycle_interval || !cycle_point?.length) return msg;
             }
-            if (cycle_point.every((point) => !weeks.has(point))) {
+            if (cycle_type === INTERVAL_MONTH) {
+              if (!cycle_interval || !cycle_point?.length) return msg;
+            }
+            if (!date_range?.length) {
               return {
                 type: 'danger',
-                message: NONE_MSG,
+                message: t('meeting.selectMeetingDate'),
               };
             }
-          }
-          if (cycle_type === INTERVAL_MONTH) {
-            const days = new Set();
-            while (!dayjs(start).isAfter(dayjs(end))) {
-              days.add(dayjs(start).date());
-              start = dayjs(start).add(1, 'day');
+            const NONE_MSG = t('meeting.invalidMeetingDuration');
+            let start = date_range[0];
+            const end = date_range[1];
+            if (cycle_type === INTERVAL_WEEK) {
+              const weeks = new Set();
+              while (!dayjs(start).isAfter(dayjs(end))) {
+                weeks.add(dayjs(start).day());
+                start = dayjs(start).add(1, 'day');
+              }
+              if (cycle_point.every((point) => !weeks.has(point))) {
+                return {
+                  type: 'danger',
+                  message: NONE_MSG,
+                };
+              }
             }
-            if (cycle_point.every((point) => !days.has(point))) {
+            if (cycle_type === INTERVAL_MONTH) {
+              const days = new Set();
+              while (!dayjs(start).isAfter(dayjs(end))) {
+                days.add(dayjs(start).date());
+                start = dayjs(start).add(1, 'day');
+              }
+              if (cycle_point.every((point) => !days.has(point))) {
+                return {
+                  type: 'danger',
+                  message: NONE_MSG,
+                };
+              }
+            }
+          } else {
+            if (!date) {
               return {
                 type: 'danger',
-                message: NONE_MSG,
+                message: t('meeting.selectMeetingDate'),
               };
             }
           }
-        } else {
-          if (!date) {
-            return {
-              type: 'danger',
-              message: t('meeting.selectMeetingDate'),
-            };
-          }
-        }
-        if (!value?.trim()?.length) {
-          return {
-            type: 'danger',
-            message: t('meeting.selectMeetingTime'),
-          };
-        }
-        const arr = value.split('-').map((v) => v.split(':').map(Number));
-        if (arr[0][0] > arr[1][0] || (arr[0][0] === arr[1][0] && arr[0][1] >= arr[1][1])) {
-          return {
-            type: 'danger',
-            message: t('meeting.endTimeAfterStartTime'),
-          };
-        }
-        if (!form.value.is_cycle && form.value.date && form.value.start) {
-          const start = dayjs(`${ form.value.date } ${ form.value.start }`);
-          if (new Date(start).getTime() < new Date().getTime()) {
+          if (!value?.trim()?.length) {
             return {
               type: 'danger',
-              message: t('meeting.startTimeBeforeEndTime'),
+              message: t('meeting.selectMeetingTime'),
             };
           }
-        }
-      },
-      triggers: ['blur', 'change'],
-    },
-  ],
-  platform: [{ required: true, message: t('meeting.selectPlatform') }],
-  email_list: [
-    {
-      validator: (value: string) => {
-        if (props.isEdit) {
-          return {};
-        }
-        const str = value.replaceAll(' ', '') || '';
-        if (str.length) {
-          if (str.length > 1020) {
+          const arr = value.split('-').map((v) => v.split(':').map(Number));
+          if (arr[0][0] > arr[1][0] || (arr[0][0] === arr[1][0] && arr[0][1] >= arr[1][1])) {
             return {
               type: 'danger',
-              message: t('meeting.emailTooLong'),
+              message: t('meeting.endTimeAfterStartTime'),
             };
           }
-          const list = str.split(';') || [];
-          if (list.some((v) => !EMAIL_REGEX.test(v))) {
-            return {
-              type: 'danger',
-              message: t('meeting.emailInvalid'),
-            };
+          if (!form.value.is_cycle && form.value.date && form.value.start) {
+            const start = dayjs(`${ form.value.date } ${ form.value.start }`);
+            if (new Date(start).getTime() < new Date().getTime()) {
+              return {
+                type: 'danger',
+                message: t('meeting.startTimeBeforeEndTime'),
+              };
+            }
           }
-          if (list.some((v) => v.length > 50)) {
-            return {
-              type: 'danger',
-              message: t('meeting.singleEmailTooLong'),
-            };
+        },
+        triggers: ['blur', 'change'],
+      },
+    ],
+    platform: [{ required: true, message: t('meeting.selectPlatform') }],
+    email_list: [
+      {
+        validator: (value: string) => {
+          if (props.isEdit) {
+            return {};
           }
-          if (list.length > 20) {
-            return {
-              type: 'danger',
-              message: t('meeting.emailCountTooLong'),
-            };
+          const str = value.replaceAll(' ', '').replaceAll(',', ';') || '';
+          if (str.length) {
+            if (str.length > 1020) {
+              return {
+                type: 'danger',
+                message: t('meeting.emailTooLong'),
+              };
+            }
+            const list = str.split(';') || [];
+            if (list.some((v) => !EMAIL_REGEX.test(v))) {
+              return {
+                type: 'danger',
+                message: t('meeting.emailInvalid'),
+              };
+            }
+            if (list.some((v) => v.length > 50)) {
+              return {
+                type: 'danger',
+                message: t('meeting.singleEmailTooLong'),
+              };
+            }
+            if (list.length > 20) {
+              return {
+                type: 'danger',
+                message: t('meeting.emailCountTooLong'),
+              };
+            }
           }
-        }
+        },
+        triggers: ['blur', 'change'],
       },
-      triggers: ['blur', 'change'],
-    },
-  ],
+    ],
+  };
 });
 
 const sigOptions = ref<OptionItemT[]>([]); // sig组选项列表
@@ -459,10 +465,13 @@ defineExpose({
           style="width: 100%"
           v-model="form.topic" />
       </OFormItem>
-      <OFormItem :rules="rules.group_name" :label="t('meeting.meetingSig')" field="group_name">
+      <OFormItem
+        :rules="rules.group_name"
+        :label="groupType === MeetingGroupType.GROUP ? t('meeting.meetingGroup'):t('meeting.meetingSig')"
+        field="group_name">
         <OSelect
           :disabled="isEdit"
-          :placeholder="t('meeting.selectSig')"
+          :placeholder="groupType === MeetingGroupType.GROUP ? t('meeting.selectGroup') : t('meeting.selectSig')"
           size="large"
           style="width: 100%"
           v-model="form.group_name"