@opendesign-plus-test/components 0.0.1-rc.41 → 0.0.1-rc.43

package/src/components/meeting/OMeetingForm.vue

@@ -14,18 +14,19 @@ import {
   ORadioGroup,
   OSelect,
   OSwitch,
-  OTextarea,
+  OTextarea, RulesT,
   useMessage,
 } from '@opensig/opendesign';
 import IconHelp from '~icons/meeting/icon-help.svg';
 import IconTip from '~icons/meeting/icon-tip.svg';
-import { MeetingFormPropsT, MeetingGroupType, MeetingPostT, OptionItemT } from './types';
+import { CycleSubItemT, MeetingFormPropsT, MeetingGroupType, MeetingPostT, OptionItemT, PlatformT } from './types';
 import dayjs from 'dayjs';
 import { findLabelFromOptions, formatDateNumber, getDateNumber } from './utils';
 import { EMAIL_REGEX, INTERVAL_DAY, INTERVAL_MONTH, INTERVAL_WEEK } from './config';
 import OMeetingCalendarSelector from './components/OMeetingCalendarSelector.vue';
 import { useScreen } from '@opendesign-plus/composables';
 import { useMeetingConfig } from './composables/useMeetingConfig';
+import { ValidatorResultT } from '@opensig/opendesign/lib/form/types';
 
 const { t, locale, cycleTypeOptions0, intervalWeekOptions, getPlatformLabel } = useMeetingConfig();
 
@@ -43,11 +44,11 @@ const weekOptions = intervalWeekOptions;
 const intervalTypeMax = computed(() => {
   return findLabelFromOptions(form.value.cycle_type, cycleTypeOptions.value, 'max');
 });
-const initForm = {
+const initForm: MeetingPostT = {
   is_record: false,
   agenda: '',
   email_list: '',
-  platform: '',
+  platform: 'WELINK',
   topic: '',
   group_name: '',
   etherpad: '',
@@ -62,10 +63,10 @@ const initForm = {
   cycle_point: [],
 };
 const form = ref<MeetingPostT>(Object.assign({}, initForm) as unknown as MeetingPostT); // 表单数据
-const formRef = ref(null); // 表单实例
+const formRef = ref<any>(null); // 表单实例
 const loading = ref(false); // 提交状态
 // 表单校验规则
-const rules = computed(() => {
+const rules = computed<Record<string, RulesT[]>>(() => {
   return {
     topic: [
       { required: true, message: t('meeting.enterMeetingName') },
@@ -98,23 +99,36 @@ const rules = computed(() => {
     }],
     etherpad: [{ required: true, message: t('meeting.enterEtherpad') }],
     date: [{ required: true, message: t('meeting.selectDate') }],
+    platform: [{ required: true, message: t('meeting.selectPlatform') }],
     time: [
       {
-        validator: (value: string) => {
+        validator: (value: any) => {
           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'),
-            };
+            const msg = t('meeting.finishMeetingConfig');
             if (cycle_type === INTERVAL_DAY) {
-              if (!cycle_interval) return msg;
+              if (!cycle_interval) {
+                return {
+                  type: 'danger',
+                  message: msg,
+                };
+              }
             }
             if (cycle_type === INTERVAL_WEEK) {
-              if (!cycle_interval || !cycle_point?.length) return msg;
+              if (!cycle_interval || !cycle_point?.length) {
+                return {
+                  type: 'danger',
+                  message: msg,
+                };
+              }
             }
             if (cycle_type === INTERVAL_MONTH) {
-              if (!cycle_interval || !cycle_point?.length) return msg;
+              if (!cycle_interval || !cycle_point?.length) {
+                return {
+                  type: 'danger',
+                  message: msg,
+                };
+              }
             }
             if (!date_range?.length) {
               return {
@@ -129,7 +143,7 @@ const rules = computed(() => {
               const weeks = new Set();
               while (!dayjs(start).isAfter(dayjs(end))) {
                 weeks.add(dayjs(start).day());
-                start = dayjs(start).add(1, 'day');
+                start = dayjs(start).add(1, 'day').format('YYYY-MM-DD');
               }
               if (cycle_point.every((point) => !weeks.has(point))) {
                 return {
@@ -142,7 +156,7 @@ const rules = computed(() => {
               const days = new Set();
               while (!dayjs(start).isAfter(dayjs(end))) {
                 days.add(dayjs(start).date());
-                start = dayjs(start).add(1, 'day');
+                start = dayjs(start).add(1, 'day').format('YYYY-MM-DD');
               }
               if (cycle_point.every((point) => !days.has(point))) {
                 return {
@@ -165,7 +179,7 @@ const rules = computed(() => {
               message: t('meeting.selectMeetingTime'),
             };
           }
-          const arr = value.split('-').map((v) => v.split(':').map(Number));
+          const arr = value.split('-').map((v: string) => 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',
@@ -173,8 +187,8 @@ const rules = computed(() => {
             };
           }
           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()) {
+            const start = `${ form.value.date } ${ form.value.start }`;
+            if (dayjs(start).isBefore(dayjs())) {
               return {
                 type: 'danger',
                 message: t('meeting.startTimeBeforeEndTime'),
@@ -185,12 +199,11 @@ const rules = computed(() => {
         triggers: ['blur', 'change'],
       },
     ],
-    platform: [{ required: true, message: t('meeting.selectPlatform') }],
     email_list: [
       {
-        validator: (value: string) => {
+        validator: (value: any) => {
           if (props.isEdit) {
-            return {};
+            return {} as unknown as ValidatorResultT;
           }
           const str = value.replaceAll(' ', '').replaceAll(',', ';') || '';
           if (str.length) {
@@ -200,7 +213,7 @@ const rules = computed(() => {
                 message: t('meeting.emailTooLong'),
               };
             }
-            const list = str.split(';') || [];
+            const list: string[] = str.split(';') || [];
             if (list.some((v) => !EMAIL_REGEX.test(v))) {
               return {
                 type: 'danger',
@@ -233,7 +246,7 @@ const getSigOptions = async () => {
     return;
   }
   const res = await props.getGroupsRequest();
-  sigOptions.value = res.map((v) => ({ label: v.group_name, value: v.group_name, ...v }));
+  sigOptions.value = res.map((v: OptionItemT) => ({ ...v, label: v.group_name, value: v.group_name }));
   if (props.data) {
     changeSig(form.value.group_name);
   }
@@ -245,9 +258,9 @@ const getPlatformOptions = async () => {
     return;
   }
   const res = await props.getPlatformsRequest();
-  typeOptions.value = res.map((v) => ({ label: getPlatformLabel(v), value: v }));
+  typeOptions.value = res.map((v: string) => ({ label: getPlatformLabel(v), value: v }));
   if (!props.data) {
-    form.value.platform = typeOptions.value[0].value;
+    form.value.platform = typeOptions.value[0].value as unknown as PlatformT;
   }
 };
 
@@ -256,7 +269,7 @@ watch(
   () => props.data,
   (data) => {
     if (data) {
-      const sub = data?.cycle_sub?.find((v) => v.sub_id === props.subId) || {};
+      const sub = data?.cycle_sub?.find((v) => v.sub_id === props.subId) || {} as unknown as CycleSubItemT;
       const { mid, date, start, end, sub_id } = sub;
       Object.assign(
         form.value,
@@ -311,8 +324,8 @@ watch(
 );
 const cancel = () => {
   form.value = Object.assign({}, initForm);
-  formRef.value.clearValidate();
-  formRef.value.resetFields();
+  formRef.value?.clearValidate?.();
+  formRef.value?.resetFields?.();
   emits('cancel');
 };
 
@@ -331,7 +344,7 @@ const confirm = async () => {
   try {
     loading.value = true;
     const valid = await formRef.value.validate();
-    if (valid.some((v) => !!v)) {
+    if (!valid || valid.some((v: any) => !!v)) {
       return;
     }
     const {
@@ -359,7 +372,7 @@ const confirm = async () => {
       group_name,
       platform,
       is_cycle,
-    } as MeetingPostT;
+    } as MeetingPostT as unknown as any;
     if (is_cycle) {
       params = {
         ...params,
@@ -396,8 +409,14 @@ const confirm = async () => {
           is_notify: true,
         });
       } else {
-        const { email_list, platform, group_name, etherpad, ...data } = params;
-        await props?.editMeetingRequest(props.data.id, {
+        const {
+          email_list: _email_list,
+          platform: _platform,
+          group_name: _group_name,
+          etherpad: _etherpad,
+          ...data
+        } = params;
+        await props?.editMeetingRequest(props.data?.id as unknown as number, {
           ...data,
           is_notify: true,
         });
@@ -423,14 +442,14 @@ onMounted(() => {
   getPlatformOptions();
 });
 
-const changeSig = (sig) => {
+const changeSig = (sig: any) => {
   const find = sigOptions.value.find((v) => v.value === sig);
   if (!props.isEdit) {
     form.value.etherpad = find?.etherpad || '';
     form.value.email_list = find?.email_list || '';
   }
 };
-const disabledDate = (date) => {
+const disabledDate = (date: Date) => {
   return date.getTime() < Date.now() - 24 * 60 * 60 * 1000;
 };
 const changeTime = () => {
@@ -606,7 +625,7 @@ defineExpose({
           </div>
         </div>
       </OFormItem>
-      <OFormItem :label="t('meeting.meetingPlatform')" field="platform" :rules="rules.platform">
+      <OFormItem :label="t('meeting.meetingPlatform')" field="platform" :rules="rules.platform" class="platform-item">
         <ORadioGroup v-model="form.platform" v-if="!data" :disabled="form.is_cycle">
           <ORadio v-for="item in typeOptions" :key="item.value" :value="item.value">{{ getPlatformLabel(item.label) }}
           </ORadio>
@@ -740,8 +759,10 @@ defineExpose({
       display: flex;
       align-items: center;
       --form-label-gap-top: 0;
+      color: var(--o-color-info2);
       @include respond-to('<=pad_v') {
         height: fit-content;
+        @include text2;
       }
     }
 
@@ -749,6 +770,15 @@ defineExpose({
       margin-left: var(--o-gap-3);
     }
 
+    .platform-item {
+      align-items: center;
+
+      .o-form-item-main-wrap {
+        @include respond-to('<=pad_v') {
+          @include text2;
+        }
+      }
+    }
     .record-item {
       @include respond-to('<=pad_v') {
         display: flex;
@@ -792,6 +822,10 @@ defineExpose({
           font-size: 16px;
           position: relative;
           top: 2px;
+
+          svg path {
+            fill: currentColor;
+          }
         }
       }
     }
@@ -807,6 +841,10 @@ defineExpose({
       .o-svg-icon {
         font-size: 1.5em;
       }
+
+      svg path {
+        fill: currentColor;
+      }
     }
   }
 
@@ -915,7 +953,7 @@ defineExpose({
     }
 
     .repeat-config {
-      background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%);
+      background-color: color-mix(in srgb, var(--o-color-control2-light) 40%, transparent);
       padding: var(--o-gap-5);
       border-radius: var(--o-radius-xs);
       @include respond-to('<=pad_v') {

package/src/components/meeting/OMeetingPlayback.vue

@@ -93,8 +93,8 @@ const getSubjectList = async (url: string) => {
   subjectList.value = (json || []).map((z: SubjectItemT) => {
     return {
       ...z,
-      startTime: transformTime(z.startTime as string),
-      endTime: transformTime(z.endTime as string),
+      startTimeNumber: transformTime(z.startTime),
+      endTimeNumber: transformTime(z.endTime),
     };
   });
 };
@@ -244,8 +244,8 @@ onUnmounted(() => {
                   :data-start="sub.startTime"
                   :data-end="sub.endTime"
                   :style="{
-                      '--start': (sub.startTime < 0 ? 0 : sub.startTime) / playerDuration,
-                      '--end': (sub.endTime > playerDuration ? playerDuration : sub.endTime) / playerDuration,
+                      '--start': (sub.startTimeNumber < 0 ? 0 : sub.startTimeNumber) / playerDuration,
+                      '--end': (sub.endTimeNumber > playerDuration ? playerDuration : sub.endTimeNumber) / playerDuration,
                       background: getProgressColor(idx),
                     }"
                 ></div>

package/src/components/meeting/OMyMeetingCalendar.vue

@@ -37,10 +37,10 @@ const currentPage = ref(1); // 分页-当前页
 const pageSize = ref(50); // 分页-每页数量
 const total = ref<number | null>(null); // 分页-总数
 const list = ref<MeetingItemT[]>([]); // 列表数据
-const originList = ref([]); // 原始数据
+const originList = ref<MeetingItemT[]>([]); // 原始数据
 const canLoadMore = computed(() => total.value === null || originList.value.length < total.value);
 const reloadAll = ref(false); // 是否需要清空数据
-const { t, locale, weekDay, getPointStr, getWeekFromDate } = useMeetingConfig();
+const { t, locale, getPointStr, getWeekFromDate } = useMeetingConfig();
 const isEn = computed(() => locale.value === Locales.EN);
 
 const props = withDefaults(defineProps<{
@@ -54,7 +54,7 @@ const props = withDefaults(defineProps<{
 
 const dialogLoading = ref(false); // 弹窗按钮状态
 const { isPhone } = useScreen();
-const expanded = ref([]); // 展开的数据， sub_id 或 id
+const expanded = ref<(string | number)[]>([]); // 展开的数据， sub_id 或 id
 const emits = defineEmits(['edit']);
 // -------------------- 自动加载下一页 --------------------
 const nextLoading = ref(false);
@@ -73,7 +73,7 @@ const getList = async () => {
     return;
   }
   try {
-    if (total.value > 0 && (currentPage.value - 1) * pageSize.value > total.value) {
+    if (total.value !== null && total.value > 0 && (currentPage.value - 1) * pageSize.value > total.value) {
       return;
     }
     // 当月数据已加载完，手动切换下一月
@@ -130,7 +130,7 @@ const getList = async () => {
             endTime: cycle_end,
             cycleType,
           });
-          const obsData = item.obs_data?.filter((v) => v.text_video_url);
+          const obsData = item.obs_data?.filter((v) => v.text_video_url) || [];
           return cycle_sub
             .filter((v) => {
               return (
@@ -155,14 +155,14 @@ const getList = async () => {
             ...item,
             dateRange: `${ start } - ${ end }`,
             timeRange: `${ start } - ${ end }`,
-            hasObsData: item.obs_data?.filter((v) => v.text_video_url)?.length > 0,
+            hasObsData: !!item.obs_data?.filter((v) => v.text_video_url)?.length,
             time: `${ start }-${ end }`,
             isExpired: dayjs(`${ date } ${ start }`).isBefore(dayjs()),
           },
         ];
       })
       .flat()
-      .filter((v) => v.date.slice(0, 7) === formatDate(selectedDate.value, 'YYYY-MM-DD').slice(0, 7));
+      .filter((v: MeetingItemT) => v.date.slice(0, 7) === formatDate(selectedDate.value, 'YYYY-MM-DD').slice(0, 7));
     // 如果需要清空，则完全替换
     // 如果页码为1，表示第一次加载
     // 如果是移动端，则一直往里填充数据
@@ -224,12 +224,12 @@ const handleScroll = useDebounceFn(() => {
     getList();
   }
 }, 200);
-const calcIfAllDeleted = (date) => {
+const calcIfAllDeleted = (date: string) => {
   const meetingsOfDate = list.value.filter((v) => v.date === date);
   return meetingsOfDate.length && meetingsOfDate.every((v) => v.is_delete);
 };
 
-const scrollerScroll = (el) => {
+const scrollerScroll = (el: any) => {
   const container = el.target;
   if (!container) return;
   const scrollTop = container.scrollTop; // 已经滚动的距离
@@ -244,13 +244,13 @@ const updateScroller = () => {
   scrollerContainerEl.addEventListener('scroll', scrollerScroll);
 };
 
-const detailRefs = ref({}); // 会议详情组件实例
-const getDetailRefs = (insRef, id) => {
+const detailRefs = ref<Record<string, any>>({}); // 会议详情组件实例
+const getDetailRefs = (insRef: any, id: number) => {
   if (insRef && id) {
     detailRefs.value[id] = insRef;
   }
 };
-const copyInfo = async (idx) => {
+const copyInfo = async (idx: number) => {
   const instance = detailRefs.value[idx];
   await instance.copyInfo();
   message.success({
@@ -274,6 +274,9 @@ const confirmCancel = async () => {
   if (!props.deleteMeetingRequest) {
     return;
   }
+  if (!currentRow.value) {
+    return;
+  }
   try {
     dialogLoading.value = true;
     await props.deleteMeetingRequest(currentRow.value.id);
@@ -289,7 +292,7 @@ const confirmCancel = async () => {
 };
 const handleDialogVisible = ref(false);
 const handleDialogType = ref('');
-const handleDialogRow = ref(null);
+const handleDialogRow = ref<MeetingItemT | null>(null);
 const handleOptions = [
   {
     label: t('meeting.meetingSingle'),
@@ -323,6 +326,9 @@ const cancelHandleItem = () => {
 };
 const confirmHandleItem = async () => {
   const row = handleDialogRow.value;
+  if (!row) {
+    return;
+  }
   if (handleDialogType.value === 'cancel') {
     try {
       dialogLoading.value = true;
@@ -386,7 +392,7 @@ const cellClick = (e: PointerEvent & any, clickable: boolean) => {
   }
 };
 
-const changeMonth = (val) => {
+const changeMonth = (val: string) => {
   if (!calendarRef.value) return;
   currentPage.value = 1;
   total.value = null;
@@ -402,8 +408,13 @@ const changeMonth = (val) => {
   });
 };
 // -------------------- 列表 --------------------
+interface GroupListItemT {
+  date: string;
+  list: MeetingItemT[];
+}
+
 const groupList = computed(() => {
-  return list.value.reduce((prev, cur) => {
+  return list.value.reduce((prev: GroupListItemT[], cur: MeetingItemT) => {
     if (!prev.length) {
       return [
         {
@@ -413,7 +424,7 @@ const groupList = computed(() => {
       ];
     } else {
       const last = prev.at(-1);
-      if (last.date === cur.date) {
+      if (last?.date === cur.date) {
         last.list.push(cur);
       } else {
         prev.push({
@@ -469,12 +480,12 @@ onUnmounted(() => {
   scrollerContainerEl?.removeEventListener('scroll', scrollerScroll);
 });
 
-const formatYearMonth = (date) => {
-  date = dayjs(date ? date : undefined);
+const formatYearMonth = (date: string) => {
+  const date2 = dayjs(date ? date : undefined);
   if (isEn.value) {
-    return date.format('MMMM YYYY');
+    return date2.format('MMMM YYYY');
   } else {
-    return date.format('YYYY MM月');
+    return date2.format('YYYY MM月');
   }
 };
 const handleActions = computed<DialogActionT[]>(() => {
@@ -837,7 +848,7 @@ const cancelActions = computed<DialogActionT[]>(() => {
     .list-calendar {
       flex-shrink: 0;
       width: 334px;
-      background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%);
+      background-color: color-mix(in srgb, var(--o-color-control2-light) 40%, transparent);
 
       @include respond-to('pad_h') {
         .el-calendar {
@@ -1244,7 +1255,7 @@ const cancelActions = computed<DialogActionT[]>(() => {
           }
 
           &.o-collapse-item-expanded {
-            background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
+            background-color: color-mix(in srgb, var(--o-color-control2-light) 40%, transparent) !important;
           }
         }
 
@@ -1494,9 +1505,4 @@ const cancelActions = computed<DialogActionT[]>(() => {
   }
 }
 
-[data-o-theme='dark'] .meeting-list {
-  .o-collapse-item-body {
-    background-color: rgb(43, 43, 47) !important;
-  }
-}
 </style>