@opendesign-plus-test/components 0.0.1-rc.63 → 0.0.1-rc.65

package/src/components/meeting/OMeetingMyCalendar.vue

@@ -58,7 +58,6 @@ const emits = defineEmits(['edit']);
 // -------------------- 自动加载下一页 --------------------
 const nextLoading = ref(false);
 const bottomReached = ref(false);
-const headerRef = ref();
 
 const getList = async () => {
   if (!props.getMeetingListRequest) {
@@ -628,6 +627,8 @@ const cancelActions = computed<DialogActionT[]>(() => {
                     :value="row.sub_id || row.id"
                     :class="{
                       'last-item': idx === groupList.length - 1 && rowIdx === group.list.length - 1,
+                      'is-delete': row.is_delete,
+                      'is-end': row.isExpired,
                     }"
                   >
                     <template #title>
@@ -635,7 +636,7 @@ const cancelActions = computed<DialogActionT[]>(() => {
                         <div
                           class="meeting-icon"
                           :style="{
-                            backgroundColor: `${getConfig(CalendarDataType.MEETING, 'color')}`
+                            backgroundColor: `${row.is_delete ? 'var(--o-color-info4)' : getConfig(CalendarDataType.MEETING, 'color')}`
                           }"
                         >
                           <OIcon>
@@ -643,13 +644,7 @@ const cancelActions = computed<DialogActionT[]>(() => {
                           </OIcon>
                         </div>
                         <div class="header-info">
-                          <div
-                            :class="{
-                              'meeting-title': true,
-                              'is-delete': row.is_delete,
-                              'is-end': row.isExpired,
-                            }"
-                          >
+                          <div class="meeting-title">
                             <div v-if="row.is_delete">{{ t('meeting.meetingCancelled') }}</div>
                             <div class="title-wrapper">
                               <div class="title-text">{{ row.topic }}</div>
@@ -1002,7 +997,8 @@ const cancelActions = computed<DialogActionT[]>(() => {
 
               &.is-today {
                 .date-cell-text {
-                  color: #000;
+                  color: var(--o-color-primary1);
+                  font-weight: bold;
                   background-color: var(--o-color-control3-light);
                 }
               }
@@ -1029,9 +1025,6 @@ const cancelActions = computed<DialogActionT[]>(() => {
               }
             }
 
-            .is-today {
-              color: inherit;
-            }
           }
         }
       }
@@ -1072,14 +1065,14 @@ const cancelActions = computed<DialogActionT[]>(() => {
           padding-left: 24px;
           position: relative;
 
-          &.last-item {
-            flex-grow: 1;
-          }
-
           @include respond('phone') {
             padding-left: var(--o-gap-2);
           }
 
+          &.last-item {
+            flex-grow: 1;
+          }
+
           .group-bar {
             position: absolute;
             left: 0;
@@ -1261,6 +1254,19 @@ const cancelActions = computed<DialogActionT[]>(() => {
               border-bottom: none;
             }
           }
+
+          &.is-delete,
+          &.is-end {
+
+            .meeting-title {
+              color: var(--o-color-info4);
+
+              .title-text {
+                color: var(--o-color-info4);
+              }
+            }
+          }
+
           &.o-collapse-item-expanded {
             border-bottom: none;
             background-color: color-mix(in srgb, var(--o-color-control2-light) 40%, transparent) !important;
@@ -1329,8 +1335,10 @@ const cancelActions = computed<DialogActionT[]>(() => {
                 align-items: center;
                 justify-content: center;
                 flex-shrink: 0;
+                --icon-size2: var(--icon-size);
 
                 .o-icon {
+                  font-size: calc(var(--icon-size2) - 2px);
                   svg path {
                     fill: currentColor;
                   }
@@ -1348,15 +1356,6 @@ const cancelActions = computed<DialogActionT[]>(() => {
                   margin-bottom: var(--o-gap-2);
                   @include text2;
 
-                  &.is-delete,
-                  &.is-end {
-                    color: var(--o-color-info4);
-
-                    .title-text {
-                      color: var(--o-color-info4) !important;
-                    }
-                  }
-
                   .tag-wrapper {
                     flex: 10;
                     margin-left: var(--o-gap-2);

package/src/components/meeting/OMeetingSigCalendar.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, onMounted, computed, nextTick, watch } from 'vue';
 import { ODivider, OPopover, OIcon, OTabPane, OTab, OScroller } from '@opensig/opendesign';
+import { ElSelect, ElOption } from 'element-plus';
 import dayjs from 'dayjs';
 import IconTips from '~icons/components/icon-tips.svg';
 import OMeetingSigAside from './components/OMeetingSigAside.vue';
@@ -8,6 +9,7 @@ import { CalendarDataType, MeetingEventsItemT, MeetingItemT } from './types.ts';
 import { useScreen } from '@opendesign-plus/composables';
 import { useMeetingConfig } from './composables/useMeetingConfig';
 import OMeetingCalendarList from '@/components/meeting/components/OMeetingCalendarList.vue';
+import { formatDate } from '@/components/meeting/utils.ts';
 
 const props = defineProps<{
   sigName: String;
@@ -21,7 +23,7 @@ const { lePadV } = useScreen();
 const selectDate = ref<string>('');
 
 const loading = ref(false); // 数据加载状态
-const list = ref<(MeetingItemT | MeetingEventsItemT)[]>([]); // 某天的会议列表
+const meetingData = ref<MeetingItemT[]>([]); // 某天的会议列表
 const calendarRows = computed(() => (lePadV.value ? 100 : 5)); // 日历行数
 
 const latestDate = ref<string>('');
@@ -44,7 +46,7 @@ const clickDateCell = async (date: string) => {
     loading.value = true;
     selectDate.value = dayjs(date).format('YYYY-MM-DD');
     const res = await props.getMeetingListRequest(selectDate.value, props.sigName);
-    list.value = res.map((v: MeetingItemT) => {
+    meetingData.value = res.map((v: MeetingItemT) => {
       return {
         ...v,
         time: `${ v.start }-${ v.end }`,
@@ -54,11 +56,6 @@ const clickDateCell = async (date: string) => {
     });
   } finally {
     loading.value = false;
-    eventsData.value.forEach((v) => {
-      if (v.dates?.includes(selectDate.value)) {
-        list.value.push(v);
-      }
-    });
   }
 };
 
@@ -68,7 +65,12 @@ const getDates = async () => {
     meetingDates.value = await props.getDateListRequest();
   }
   if (props.getEventsListRequest) {
-    eventsData.value = await props.getEventsListRequest();
+    eventsData.value = (await props.getEventsListRequest(selectDate.value, props.sigName)).map((v: any) => {
+      return {
+        ...v,
+        type: CalendarDataType.EVENTS,
+      };
+    });
     eventsDates.value = (eventsData.value || []).map(v => v.dates || []).flat();
   }
 };
@@ -94,13 +96,15 @@ const getMonthAndDay = (date: string) => {
 };
 
 const dateList = computed(() => {
-  let list = [];
+  let list: any[];
   if (tabType.value === CalendarDataType.ALL) {
     list = [...(meetingDates.value || []), ...eventsDates.value];
   } else if (tabType.value === CalendarDataType.MEETING) {
     list = meetingDates.value || [];
+  } else if (tabType.value === CalendarDataType.EVENTS) {
+    list = eventsDates.value || [];
   } else {
-    list = eventsDates.value;
+    list = [];
   }
   return [...new Set(list)].sort((a, b) => !dayjs(a).isAfter(dayjs(b)) ? -1 : 1).map(v => dayjs(v).format('YYYY-MM-DD'));
 });
@@ -235,11 +239,25 @@ const changeMonthIdx = (step: number) => {
 onMounted(() => {
   getDates();
 });
+
+const list = computed(() => {
+  let list: any[];
+  if (tabType.value === CalendarDataType.ALL) {
+    list = [...(meetingData.value || []), ...eventsData.value];
+  } else if (tabType.value === CalendarDataType.MEETING) {
+    list = meetingData.value || [];
+  } else if (tabType.value === CalendarDataType.EVENTS) {
+    list = eventsData.value || [];
+  } else {
+    list = [];
+  }
+  return list;
+});
 </script>
 
 <template>
   <div class="o-sig-meeting-calendar">
-    <div class="meeting-card-header" v-if="!lePadV">
+    <div class="meeting-card-header">
       <div class="header-left" v-if="latestDate">
         <span>{{ t('meeting.latestMeeting') }} </span>
         <span>{{ dayjs(latestDate).format('YYYY/MM/DD') }}</span>
@@ -268,12 +286,12 @@ onMounted(() => {
     <template v-if="lePadV && dateList.length">
       <div class="date-select">
         <ElSelect v-model="selectDate" @change="changeSelect">
-          <template #label>{{ t('meeting.latestMeeting') }} {{ selectDate }}</template>
+          <template #label>{{ t('meeting.latestMeeting') }} {{ formatDate(selectDate) }}</template>
           <ElOption
             v-for="date in dateList"
             :key="date"
             :value="date"
-            :label="dayjs(date).format('YYYY/MM/DD')"
+            :label="formatDate(date)"
           />
         </ElSelect>
       </div>
@@ -317,7 +335,7 @@ onMounted(() => {
   margin-top: var(--o-gap-5);
   @include respond('phone') {
     .meeting-card-header {
-      padding: 12px 16px 0;
+      padding: var(--o-gap-3) var(--o-gap-4) 0;
 
       .el-input {
         flex-grow: 1;
@@ -329,7 +347,7 @@ onMounted(() => {
   }
 
   .date-select {
-    padding: 16px;
+    padding: var(--o-gap-4);
 
     .o-select {
       width: 100%;
@@ -340,10 +358,13 @@ onMounted(() => {
     font-weight: 500;
     display: flex;
     align-items: center;
-    padding: 12px 32px 0;
+    padding: var(--o-gap-3) var(--o-gap-6) 0;
     @include text1;
     @include respond('<=pad') {
-      padding: 12px 16px 0;
+      padding: var(--o-gap-3) var(--o-gap-4) 0;
+    }
+    @include respond('<=pad_v') {
+      display: none;
     }
 
     .date-meeting {
@@ -353,8 +374,9 @@ onMounted(() => {
 
     .header-left {
       width: 35%;
-      padding-bottom: 12px;
+      padding-bottom: var(--o-gap-3);
       color: var(--o-color-info1);
+      @include text1;
     }
 
     .o-tab {
@@ -365,7 +387,7 @@ onMounted(() => {
       position: relative;
 
       .o-tab-nav {
-        padding-bottom: 12px;
+        padding-bottom: var(--o-gap-3);
 
         svg path {
           fill: currentColor;
@@ -406,8 +428,9 @@ onMounted(() => {
   }
 
   .list-content {
+    min-width: 0;
     flex-grow: 1;
-    height: 400px;
+    height: 360px;
     @include respond('<=pad_v') {
       height: auto;
     }

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

@@ -1,5 +1,14 @@
 <script setup lang="ts">
-import { isClient, OCollapse, OCollapseItem, ODivider, OIcon, OLink, OTag, useMessage } from '@opensig/opendesign';
+import {
+  isClient,
+  OCollapse,
+  OCollapseItem,
+  ODivider,
+  OIcon,
+  OButton,
+  OTag,
+  useMessage,
+} from '@opensig/opendesign';
 import OMeetingDetail from './OMeetingDetail.vue';
 import { computed, nextTick, ref, watch } from 'vue';
 import IconCopy from '~icons/meeting/icon-copy.svg';
@@ -15,6 +24,7 @@ const { activityTypeMap } = useActivityConfig();
 const props = withDefaults(defineProps<{
   list: MeetingItemT[];
   groupType?: MeetingGroupType;
+  disableFormat?: boolean;
 }>(), {
   list: () => [],
 });
@@ -85,15 +95,15 @@ const computedList = computed<any[]>(() => {
       let activity_type = activityTypeMap.value.get(v.activity_type)?.label;
       if (v.start && v.end) {
         if (v.end_date === v.start_date) {
-          dateRange = `${ formatDate(v.start_date) } ${ v.start }-${ v.end }`;
+          dateRange = `${ props.disableFormat ? v.start_date : formatDate(v.start_date) } ${ v.start } - ${ v.end }`;
         } else {
-          dateRange = `${ formatDate(v.start_date) } ${ v.start }-${ formatDate(v.end_date) } ${ v.end }`;
+          dateRange = `${ props.disableFormat ? v.start_date : formatDate(v.start_date) } ${ v.start } - ${ props.disableFormat ? v.end_date : formatDate(v.end_date) } ${ v.end }`;
         }
       } else {
         if (v.start_date === v.end_date) {
-          dateRange = formatDate(v.start_date);
+          dateRange = props.disableFormat ? v.start_date : formatDate(v.start_date);
         } else {
-          dateRange = `${ formatDate(v.start_date) }-${ formatDate(v.end_date) }`;
+          dateRange = `${ props.disableFormat ? v.start_date : formatDate(v.start_date) } - ${ props.disableFormat ? v.end_date : formatDate(v.end_date) }`;
         }
       }
 
@@ -116,9 +126,9 @@ const computedList = computed<any[]>(() => {
       cycle_interval,
       cycle_point,
     } = v;
-    dateRange = `${ formatDate(date) } ${ start } - ${ end }`;
+    dateRange = `${ props.disableFormat ? date : formatDate(date) } ${ start } - ${ end }`;
     if (is_cycle) {
-      dateRange = `${ formatDate(cycle_start_date) } - ${ formatDate(cycle_end_date) }`;
+      dateRange = `${ props.disableFormat ? cycle_start_date : formatDate(cycle_start_date) } - ${ props.disableFormat ? cycle_end_date : formatDate(cycle_end_date) }`;
     }
 
     let timeRange = `${ start } - ${ end }`;
@@ -198,8 +208,8 @@ const computedList = computed<any[]>(() => {
                 <template v-if="item.activity_type">{{ item.activity_type }}</template>
               </div>
             </div>
-            <OLink
-              :hover-underline="false"
+            <OButton
+              variant="text"
               v-if="item.url"
               :href="item.url"
               target="_blank"
@@ -211,9 +221,9 @@ const computedList = computed<any[]>(() => {
                   <IconChevronRight />
                 </OIcon>
               </template>
-            </OLink>
-            <OLink
-              :hover-underline="false"
+            </OButton>
+            <OButton
+              variant="text"
               v-if="item.join_url"
               :href="item.join_url"
               target="_blank"
@@ -225,9 +235,9 @@ const computedList = computed<any[]>(() => {
                   <IconChevronRight />
                 </OIcon>
               </template>
-            </OLink>
-            <OLink
-              :hover-underline="false"
+            </OButton>
+            <OButton
+              variant="text"
               v-if="item.content_url"
               :href="item.content_url"
               target="_blank"
@@ -239,9 +249,9 @@ const computedList = computed<any[]>(() => {
                   <IconChevronRight />
                 </OIcon>
               </template>
-            </OLink>
-            <OLink
-              :hover-underline="false"
+            </OButton>
+            <OButton
+              variant="text"
               v-if="item.register_url"
               :href="item.register_url"
               target="_blank"
@@ -253,7 +263,7 @@ const computedList = computed<any[]>(() => {
                   <IconChevronRight />
                 </OIcon>
               </template>
-            </OLink>
+            </OButton>
           </div>
           <OIcon @click.stop="() => copyInfo(index)" class="copy-icon">
             <IconCopy />
@@ -374,12 +384,13 @@ const computedList = computed<any[]>(() => {
 
       .o-collapse-item-title {
         flex-grow: 1;
+        min-width: 0;
         margin-bottom: 0;
         display: flex;
         align-items: center;
         justify-content: center;
         gap: var(--o-gap-4);
-        padding-right: var(--o-gap-4);
+        padding-right: var(--o-gap-5);
 
         .meet-title-left {
           flex-grow: 1;
@@ -457,7 +468,7 @@ const computedList = computed<any[]>(() => {
 
     .jump-detail-link {
       padding-left: calc(var(--icon-right) + var(--icon-size2));
-      margin-top: var(--o-gap-2);
+      margin-top: var(--o-gap-1);
       color: var(--o-color-info2);
       font-weight: 400;
       @include tip1;
@@ -508,7 +519,7 @@ const computedList = computed<any[]>(() => {
         margin-right: var(--icon-right);
         width: var(--icon-size2);
         height: var(--icon-size2);
-        font-size: calc(var(--icon-size2) - 4px);
+        font-size: calc(var(--icon-size2) - 2px);
 
         svg path {
           fill: currentColor;
@@ -518,14 +529,16 @@ const computedList = computed<any[]>(() => {
       .text {
         display: block;
         font-weight: 600;
+        min-width: 0;
+        flex: 1;
         @include text-truncate(1);
       }
     }
 
     .meet-info {
+      display: flex;
       margin-left: calc(var(--icon-right) + var(--icon-size2));
       margin-top: var(--o-gap-2);
-      display: flex;
       flex-wrap: wrap;
       align-items: center;
       color: var(--o-color-info3);

package/src/components/meeting/components/OMeetingPlaybackSubtitles.vue

@@ -333,7 +333,7 @@ watch(
       <OTabPane :value="0" :label="t('meeting.audioToText')">
         <OScroller v-if="computedCaptions.length" id="captionsScrollDom" class="captions-scroller" show-type="hover"
                    size="small" disabled-x>
-          <ORow gap="0 12px" wrap="wrap">
+          <ORow gap="0 8px" wrap="wrap">
             <OCol flex="0 0 100%" v-for="(item, i) in computedCaptions" :key="i">
               <div class="captions-item" :class="{ 'captions-item-active': currentIndex === i + 1 }"
                    @click="videoPosition(item.start_time)">

package/src/components/meeting/components/OMeetingSigAside.vue

@@ -80,12 +80,14 @@ const changeMonth = (step: number) => {
 .o-sig-meeting-aside {
   width: 35%;
   flex-shrink: 0;
-  padding: var(--o-gap-4) var(--o-gap-6);
+  padding: var(--o-gap-4);
   display: flex;
   flex-direction: column;
   border-right: 1px solid var(--o-color-control4);
   @include respond('<=pad') {
     padding: var(--o-gap-4);
+  }
+  @include respond('<=pad_v') {
     border-right: none;
   }
   @include respond('phone') {
@@ -104,7 +106,8 @@ const changeMonth = (step: number) => {
     .month {
       color: var(--o-color-info3);
       margin-bottom: var(--o-gap-2);
-      @include tip1;
+      font-weight: bold;
+      @include text1;
     }
 
     .days {
@@ -124,9 +127,11 @@ const changeMonth = (step: number) => {
         cursor: pointer;
         border: 1px solid transparent;
 
-        &:hover,
-        &.active {
+        &:hover {
           background-color: var(--o-color-control3-light);
+        }
+
+        &.active {
           border-color: var(--o-color-primary1);
         }
 
@@ -144,7 +149,8 @@ const changeMonth = (step: number) => {
           .o-icon {
             width: 20px;
             height: 20px;
-            font-size: 20px;
+            font-size: 18px;
+            padding: 1px;
             line-height: 1em;
             position: relative;
             border-radius: 50%;
@@ -164,7 +170,6 @@ const changeMonth = (step: number) => {
   }
 
   .arrow-wrapper {
-    margin-top: auto;
     display: flex;
     align-items: center;
     justify-content: space-between;

package/src/components/meeting/types.ts

@@ -42,7 +42,6 @@ export type PlatformT = 'welink' | 'tencent' | 'zoom' | 'WELINK' | 'TENCENT' | '
 export enum MeetingGroupType {
   SIG = 'sig',
   GROUP = 'group',
-  NONE = 'none',
 }
 
 export interface MeetingCalendarPropsT {
@@ -56,12 +55,15 @@ export interface MeetingCalendarPropsT {
   hiddenSummit?: boolean;
   groupType: MeetingGroupType;
   groups: string[];
+  disableFormat?: boolean; //是否禁用日期格式化
 }
 
 // 会议新增、修改
 export interface MeetingPostT {
   id?: number; // 会议id
   topic: string; // 会议主题 128
+  name?: string; // 会议主题 128
+  title?: string; // 会议主题 128
   sponsor?: string; // 会议发起人 20
   group_name: string; // 所属SIG 64
   platform: PlatformT | string; // 会议平台

package/src/i18n/en.ts

@@ -115,7 +115,7 @@ export default {
   'meeting.meetingDate': 'Date',
   'meeting.startTime': 'Start time',
   'meeting.endTime': 'End time',
-  'meeting.meetingRecord': 'AI Recording',
+  'meeting.meetingRecord': 'Recording',
   'meeting.meetingRecordDesc': 'Enables auto screen recording. This service is provided by {0} Meeting. AI-powered playback will be automatically uploaded within one working day.',
   'meeting.meetingRecordDesc1': '1. Meeting AI recording is now enabled. Turning on Meeting AI Listen automatically activates cloud recording as well. After the meeting, you can replay the recording, and voice-to-text transcripts along with AI meeting minutes will be automatically generated.',
   'meeting.meetingRecordDesc2': '2. The AI-generated meeting replay link will be automatically generated and uploaded within 1 business day.',

package/src/i18n/zh.ts

@@ -115,7 +115,7 @@ export default {
   'meeting.meetingDate': '会议日期',
   'meeting.startTime': '开始时间',
   'meeting.endTime': '结束时间',
-  'meeting.meetingRecord': '会议AI录制',
+  'meeting.meetingRecord': '会议录制',
   'meeting.meetingRecordDesc1': '1、会议AI录制已开启，开启会议AI听即开启云录制，会后可回放会议录制并生成语音文字和AI纪要。',
   'meeting.meetingRecordDesc2': '2、AI生成的会议回放链接将在 1 个工作日内自动生成并上传。',
   'meeting.day0': '天',