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

package/src/components/meeting/OMeetingForm.vue

@@ -19,9 +19,9 @@ import {
 } from '@opensig/opendesign';
 import IconHelp from '~icons/meeting/icon-help.svg';
 import IconTip from '~icons/meeting/icon-tip.svg';
-import type { MeetingItemT, MeetingPostT, OptionItemT } from './types';
+import { MeetingFormPropsT, MeetingPostT, OptionItemT } from './types';
 import dayjs from 'dayjs';
-import { findLabelFromOptions, formatDateNumber, getDateNumber } from './utils';
+import { findLabelFromOptions, formatDateNumber, getDateNumber, getPlatformLabel } from './utils';
 import {
   EMAIL_REGEX,
   INTERVAL_DAY,
@@ -36,18 +36,7 @@ import { useI18n } from '@/i18n';
 
 const { t, locale } = useI18n();
 
-const props = withDefaults(defineProps<{
-  data?: MeetingItemT;
-  isSub?: boolean;
-  isEdit?: boolean;
-  subId?: string;
-  createMeetingRequest: any,
-  editMeetingRequest: any;
-  editSubMeetingRequest: any;
-  getPlatformsRequest: any;
-  getGroupsRequest: any;
-  showBtns?: boolean
-}>(), {
+const props = withDefaults(defineProps<MeetingFormPropsT>(), {
   isSub: false,
   isEdit: false,
   showBtns: true,
@@ -78,7 +67,7 @@ const initForm = {
   cycle_interval: 1,
   cycle_type: INTERVAL_DAY,
   cycle_point: [],
-}
+};
 const form = ref<MeetingPostT>(Object.assign({}, initForm) as unknown as MeetingPostT); // 表单数据
 const formRef = ref(null); // 表单实例
 const loading = ref(false); // 提交状态
@@ -258,7 +247,7 @@ const getPlatformOptions = async () => {
     return;
   }
   const res = await props.getPlatformsRequest();
-  typeOptions.value = res.map((v) => ({ label: v, value: v }));
+  typeOptions.value = res.map((v) => ({ label: getPlatformLabel(v), value: v }));
   if (!props.data) {
     form.value.platform = typeOptions.value[0].value;
   }
@@ -485,7 +474,7 @@ defineExpose({
       <OFormItem :rules="rules.etherpad" label="Etherpad" field="etherpad" v-if="form.group_name">
         <template #label>
           <div class="label-wrapper">
-            <span>Etherpad&nbsp;</span>
+            <span>{{ t('meeting.etherpad') }}&nbsp;</span>
             <OPopover>
               <div class="o-meeting-form-popover-content etherpad">{{ t('meeting.etherpadDesc') }}</div>
               <template #target>
@@ -694,12 +683,6 @@ defineExpose({
 
 <style lang="scss">
 .o-meeting-form {
-  .el-input {
-    --el-border-color: var(--o-color-control1);
-    --el-input-border-color: var(--o-color-control1);
-    --el-input-hover-border-color:var(--o-color-control2);
-    --el-input-focus-border-color:var(--o-color-control3);
-  }
   .form-wrapper {
     & > .o-form-item {
       max-width: 592px;
@@ -718,6 +701,7 @@ defineExpose({
 
     &.o-form-layout-v {
       --form-item-gap: var(--o-gap-3);
+
       .o-form-item-label {
         margin-bottom: var(--o-gap-2);
       }
@@ -741,6 +725,13 @@ defineExpose({
       }
     }
 
+    .o-select {
+      --select-bd-color: var(--o-color-control1);
+      --select-bd-color-hover: var(--o-color-primary2);
+      --select-bd-color-focus: var(--o-color-primary3);
+      --select-bd-color-disabled: var(--o-color-control4);
+    }
+
     .o-form-item-label {
       flex: 0 0 100px;
       height: var(--o-control_size-l);
@@ -766,6 +757,7 @@ defineExpose({
 
       .o-form-item-label {
         margin: 0;
+        align-items: flex-start;
       }
 
       .o-form-item-main {
@@ -835,7 +827,7 @@ defineExpose({
     display: flex;
     align-items: center;
     border: 1px solid var(--o-color-control1);
-    border-radius: var(--o-radius_control-s);
+    border-radius: var(--o-radius-xs);
     padding: 0 15px;
     background-color: var(--o-color-fill2);
 
@@ -844,7 +836,7 @@ defineExpose({
     }
 
     &:hover {
-      border-color: var(--o-color-control2);
+      border-color: var(--o-color-primary2);
     }
 
     @include respond-to('phone') {
@@ -921,7 +913,7 @@ defineExpose({
     }
 
     .repeat-config {
-      background-color: var(--o-color-control2-light);
+      background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%);
       padding: var(--o-gap-5);
       border-radius: var(--o-radius-xs);
       @include respond-to('<=pad_v') {
@@ -989,13 +981,14 @@ defineExpose({
 </style>
 
 <style lang="scss">
-.meeting-form-time-popover, o-meeting-form-date-picker-popper {
+.meeting-form-time-popover, .o-meeting-form-date-picker-popper {
   --el-color-primary: var(--o-color-primary1);
   --el-datepicker-active-color: var(--o-color-primary1);
   --el-fill-color-light: var(--o-color-control2-light);
   --el-input-bg-color: var(--o-color-control-light);
   --el-fill-color-blank: var(--o-color-control-light);
 }
+
 .o-meeting-form-popover-content {
   max-width: 256px;
   text-align: left;

package/src/components/meeting/OMeetingPlayback.vue

@@ -14,7 +14,7 @@ const props = withDefaults(defineProps<MeetingPlaybackPropsT>(), {
   detail: () => ({}) as any,
 });
 const emits = defineEmits(['change-date']);
-
+const { t } = useI18n();
 const playbackInstance = ref(null);
 const getInstance = (instance: any) => {
   playbackInstance.value = instance;

package/src/components/meeting/OMyMeetingCalendar.vue

@@ -833,15 +833,39 @@ const cancelActions = computed<DialogActionT[]>(() => {
     }
 
     .list-calendar {
-      width: 334px;
       flex-shrink: 0;
-      --table-bg: var(--o-color-control2-light);
+      width: 334px;
+      background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%);
+
+      @include respond-to('pad_h') {
+        .el-calendar {
+          .el-calendar__body {
+            padding-left: 12px;
+            padding-right: 12px;
 
+            .el-calendar-table .date-cell {
+              height: 40px;
+              width: 28px;
+
+              .date-cell-text {
+                line-height: 24px;
+                @include tip2;
+              }
+            }
+          }
+        }
+      }
+      @include respond-to('pad_v') {
+        width: 100%;
+      }
+      @include respond-to('phone') {
+        display: none;
+      }
       .el-calendar {
         min-height: 460px;
         height: calc(100% - 54px);
-        background-color: var(--table-bg);
         border-radius: var(--o-radius-xs);
+        background-color: transparent;
 
         .el-calendar__header {
           border-bottom: 1px solid var(--o-color-control4);
@@ -870,18 +894,15 @@ const cancelActions = computed<DialogActionT[]>(() => {
 
         .el-calendar__body {
           .el-calendar-table {
-            tr {
-              background: var(--table-bg) !important;
-            }
 
             th {
               text-align: center;
-              background: var(--table-bg) !important;
+              background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
               border: none;
             }
 
             td {
-              background: var(--table-bg) !important;
+              background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
               border: none;
               text-align: center;
               transition: none;
@@ -980,31 +1001,6 @@ const cancelActions = computed<DialogActionT[]>(() => {
         }
       }
 
-      @include respond-to('pad_h') {
-        width: 240px;
-        .el-calendar {
-          .el-calendar__body {
-            padding-left: 12px;
-            padding-right: 12px;
-
-            .el-calendar-table .date-cell {
-              height: 40px;
-              width: 28px;
-
-              .date-cell-text {
-                line-height: 24px;
-                @include tip2;
-              }
-            }
-          }
-        }
-      }
-      @include respond-to('pad_v') {
-        width: 100%;
-      }
-      @include respond-to('phone') {
-        display: none;
-      }
     }
 
     .list-wrapper {
@@ -1025,11 +1021,15 @@ const cancelActions = computed<DialogActionT[]>(() => {
         .o-scrollbar-rail {
           right: -16px;
         }
+
+        .o-scrollbar {
+          height: 100%;
+        }
       }
 
       .scroller-container {
         height: 100%;
-        max-height: calc(var(--layout-left-height) - 4 * var(--o-gap-5) - var(--header-height) * 1px);
+        max-height: calc(var(--layout-left-height, 900px) - 4 * var(--o-gap-5) - var(--header-height) * 1px);
 
         @include respond-to('phone') {
           max-height: fit-content;
@@ -1237,7 +1237,7 @@ const cancelActions = computed<DialogActionT[]>(() => {
           }
 
           &.o-collapse-item-expanded {
-            background-color: var(--o-color-control2-light);
+            background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%) !important;
           }
         }
 
@@ -1358,7 +1358,7 @@ const cancelActions = computed<DialogActionT[]>(() => {
               display: flex;
               align-items: center;
               padding-left: calc(var(--o-gap-3) + var(--icon-size));
-              gap: var(--o-gap-5);
+              gap: var(--o-gap-4);
               width: 100%;
 
               .o-link {

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

@@ -276,11 +276,8 @@ const computedList = computed(() => {
       }
 
       &.o-collapse-item-expanded {
-        @include respond-to('<=pad_v') {
-
-          .copy-icon {
-            display: inline-flex;
-          }
+        .copy-icon {
+          display: inline-flex;
         }
       }
     }
@@ -305,9 +302,9 @@ const computedList = computed(() => {
         padding: 12px 16px;
       }
 
-
       .o-collapse-item-title {
         flex-grow: 1;
+        margin-bottom: 0;
       }
 
 
@@ -322,7 +319,7 @@ const computedList = computed(() => {
     }
 
     .o-collapse-item-body {
-      background-color: var(--o-color-control2-light);
+      background-color: color-mix(in srgb, var(--o-color-control2-light), transparent 60%);
       margin-bottom: 0;
 
       a {
@@ -333,7 +330,12 @@ const computedList = computed(() => {
     .jump-detail-link {
       padding-left: calc(var(--icon-right) + var(--icon-size2));
       margin-top: var(--o-gap-2);
-      @include text1;
+      color: var(--o-color-info2);
+      @include tip1;
+
+      &:hover {
+        color: var(--o-color-primary1);
+      }
 
       .o-icon {
         font-size: 16px;
@@ -362,7 +364,6 @@ const computedList = computed(() => {
 
       .o-icon {
         flex-shrink: 0;
-        padding: 2px;
         border-radius: 50%;
         overflow: hidden;
         color: var(--o-color-white);
@@ -378,6 +379,7 @@ const computedList = computed(() => {
 
       .text {
         display: block;
+        font-weight: 600;
         @include text-truncate(1);
       }
     }
@@ -390,6 +392,7 @@ const computedList = computed(() => {
       align-items: center;
       color: var(--o-color-info3);
       text-decoration: none;
+      font-weight: 400;
       @include tip1;
 
       .o-divider {

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

@@ -1,10 +1,10 @@
 <script setup lang="ts">
 import { OLink } from '@opensig/opendesign';
 import { computed, ref } from 'vue';
-import { MeetingItemT } from '@/components/meeting/types.ts';
+import { CalendarDataType, MeetingItemT } from '@/components/meeting/types.ts';
 import MoreText from '@/components/common/MoreText.vue';
 import { Locales, useI18n } from '@/i18n';
-import { formatDate } from '@/components/meeting/utils.ts';
+import { formatDate, getPlatformLabel } from '@/components/meeting/utils.ts';
 
 const props = defineProps<{
   data: MeetingItemT;
@@ -52,8 +52,8 @@ const activityInfoApprovalList = computed(() => [
 ]);
 
 const columns = computed(() => {
-  if (props.data.type === 'activity') {
-    if (props.page === 'approval') {
+  if (props.data.type === CalendarDataType.ACTIVITY || props.data.type === CalendarDataType.EVENTS) {
+    if (props.page === CalendarDataType.APPROVAL) {
       return activityInfoApprovalList.value;
     }
     return activityInfoList.value;
@@ -81,9 +81,15 @@ defineExpose({ copyInfo });
     <div
       ref="domRef"
       class="label-item"
-      :class="`label-item_${data.id} type_${data.type} ${!data[info.key]?.length ? 'is-empty' : ''}`"
       v-for="(info, infoIdx) in columns"
       :key="infoIdx"
+      :class="{
+        'record-item': info.isRecord && data[info.key]?.length,
+        'link-item': info.isLink,
+        'is-empty':!data[info.key]?.length,
+        [`label-item_${data.id}`]: true,
+        [`type_${data.type}`]: true,
+      }"
     >
       <template v-if="data[info.key] && !info.isRecord">
         <span class="label">{{ info.label }}<i>{{ isZh ? '：' : ':' }}</i></span>
@@ -98,18 +104,21 @@ defineExpose({ copyInfo });
         >
           {{ data[info.key] }}
         </OLink>
+        <span v-else-if="info.key === 'platform'">{{ getPlatformLabel(data[info.key]) }}</span>
         <span v-else class="value">
-        <i v-if="info.extra" class="extra">{{ data[info.extra] }}</i>
-        {{ data[info.key] || '-' }}
-      </span>
+          <i v-if="info.extra" class="extra">{{ data[info.extra] }}</i>
+          {{ data[info.key] || '-' }}
+        </span>
       </template>
       <template v-if="info.isRecord && data[info.key]?.length">
         <span class="label">{{ info.label }}{{ isZh ? '：' : ':' }}</span>
-        <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 ? '通过' : '驳回' }}
-        </p>
+        <div>
+          <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 ? '通过' : '驳回' }}
+          </p>
+        </div>
       </template>
     </div>
   </div>
@@ -131,6 +140,22 @@ defineExpose({ copyInfo });
       gap: var(--o-gap-1);
     }
 
+    &:not(.is-empty) {
+      margin-bottom: var(--o-gap-2);
+    }
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    &.record-item {
+      align-items: flex-start;
+
+      .value {
+        margin-bottom: 0;
+      }
+    }
+
     .label {
       width: 4em;
       flex-shrink: 0;
@@ -177,10 +202,6 @@ defineExpose({ copyInfo });
     }
   }
 
-  .label-item + .label-item {
-    margin-top: var(--o-gap-2);
-  }
-
   .label-item.is-empty {
     margin: 0;
   }

package/src/components/meeting/types.ts

@@ -13,6 +13,8 @@ export enum CalendarDataType {
   MEETING = 'meeting',
   EVENTS = 'events',
   SUMMIT = 'summit',
+  ACTIVITY = 'activity',
+  APPROVAL = 'approval'
 }
 
 export interface CalendarOtherDataT {
@@ -63,11 +65,17 @@ export interface MeetingPostT {
   is_notify?: boolean;
 }
 
-// sig组列表
-export interface GroupItemT {
-  id?: number;
-  group_name: string;
-  maillist?: string;
+export interface MeetingFormPropsT {
+  data?: MeetingItemT;
+  isSub?: boolean;
+  isEdit?: boolean;
+  subId?: string;
+  createMeetingRequest: any,
+  editMeetingRequest: any;
+  editSubMeetingRequest: any;
+  getPlatformsRequest: any;
+  getGroupsRequest: any;
+  showBtns?: boolean
 }
 
 // 会议详情

package/src/components/meeting/utils.ts

@@ -101,6 +101,23 @@ export const transformSeconds = (seconds: number) => {
 };
 
 export const getConfig = (val: CalendarDataType, key: keyof meetingTabT): string => {
-  const find: meetingTabT = MEETING_TABS.find(v => v.value === val)!;
+  let value = val;
+  if (val === CalendarDataType.ACTIVITY) {
+    value = CalendarDataType.EVENTS;
+  }
+  const find: meetingTabT = MEETING_TABS.find(v => v.value === value)!;
   return find?.[key] || '';
+};
+
+export const getPlatformLabel = (platform: string) => {
+  switch (platform) {
+    case 'WELINK':
+      return 'WeLink';
+    case 'ZOOM':
+      return 'Zoom';
+    case 'TENCENT':
+      return '腾讯会议';
+    default:
+      return platform;
+  }
 };

package/src/i18n/en.ts

@@ -79,7 +79,7 @@ export default {
   'meeting.meetingAgenda': 'Content',
   'meeting.enterMeetingAgenda': 'Enter the meeting content.',
   'meeting.emailTooLong': 'Enter a maximum of 1020 characters for the email addresses.',
-  'meeting.enterEmail': 'Enter email addresses, separated by commas (;).',
+  'meeting.enterEmail': 'Enter email addresses, separated by commas (,) or semicolons (;).',
   'meeting.meetingEmail': 'Email',
   'meeting.meetingEmailDesc': 'The system automatically sends notifications to subscribed SIG members. You can include additional SIG or individual email addresses.',
   'meeting.sigGroupEmail': 'SIG Mailing List',
@@ -134,6 +134,8 @@ export default {
   'meeting.meetingReplay': 'Playback',
   'meeting.searchSubtitlePlaceholder': 'Enter',
   'meeting.detailHalfYearMeetings': '默认显示近半年的会议。',
+  'meeting.tencent': 'Tencent',
+  'meeting.etherpad': 'Etherpad',
   'common.confirm': 'Confirm',
   'common.cancel': 'Cancel',
   'common.copySuccess': 'Copied Successfully',

package/src/i18n/zh.ts

@@ -65,7 +65,7 @@ export default {
   'meeting.meetingAgendaTooLong': '会议内容不能超过4096个字符',
   'meeting.meetingSig': '所属SIG',
   'meeting.selectSig': '请选择所属SIG',
-  'meeting.enterEtherpad': '请输入Etherpad',
+  'meeting.enterEtherpad': '请输入会议纪要',
   'meeting.etherpadDesc': '会议辅助工具，可以在线记录会议纪要和讨论。',
   'meeting.selectDate': '请选择日期',
   'meeting.finishMeetingConfig': '请完善会议配置',
@@ -79,7 +79,7 @@ export default {
   'meeting.meetingAgenda': '会议内容',
   'meeting.enterMeetingAgenda': '请输入会议内容',
   'meeting.emailTooLong': '邮箱地址不能超过1020个字符',
-  'meeting.enterEmail': '请输入邮件地址，多个邮件地址以“;”间隔',
+  'meeting.enterEmail': '请输入电子邮件地址，多个邮件地址以“,”或“;”间隔',
   'meeting.meetingEmail': '邮件地址',
   'meeting.meetingEmailDesc': '默认会向已订阅SIG组成员发送会议通知也可添加其他SIG组邮件地址或个人邮件地址。',
   'meeting.sigGroupEmail': 'SIG组邮件列表',
@@ -134,6 +134,8 @@ export default {
   'meeting.meetingReplay': '智能回放',
   'meeting.searchSubtitlePlaceholder': '请输入搜索内容',
   'meeting.detailHalfYearMeetings': '默认显示近半年的会议。',
+  'meeting.tencent': '腾讯会议',
+  'meeting.etherpad': '会议纪要',
   'common.confirm': '确认',
   'common.cancel': '取消',
   'common.copySuccess': '复制成功',

package/src/index.ts

@@ -4,8 +4,6 @@
 import OBanner from './components/OBanner.vue';
 import OCookieNotice from './components/OCookieNotice.vue';
 import OFooter from './components/OFooter.vue';
-import OHeader from './components/OHeader.vue';
-import OHeaderMoblie from './components/OHeaderMoblie.vue';
 import OHeaderSearch from './components/OHeaderSearch.vue';
 import OHeaderUser from './components/OHeaderUser.vue';
 import OPlusConfigProvider from './components/OPlusConfigProvider.vue';
@@ -18,8 +16,6 @@ const components = {
   OBanner,
   OCookieNotice,
   OFooter,
-  OHeader,
-  OHeaderMoblie,
   OHeaderSearch,
   OHeaderUser,
   OPlusConfigProvider,
@@ -29,12 +25,13 @@ const components = {
 };
 
 // 导出单个组件
-export { OBanner, OCookieNotice, OFooter, OHeader, OHeaderMoblie, OHeaderSearch, OHeaderUser, OPlusConfigProvider, OSection, OSourceCode, OThemeSwitcher };
+export { OBanner, OCookieNotice, OFooter, OHeaderSearch, OHeaderUser, OPlusConfigProvider, OSection, OSourceCode, OThemeSwitcher };
 
 // 重新导出子目录中的组件
 export * from './components/activity';
 export * from './components/element-plus';
 export * from './components/events';
+export * from './components/header';
 export * from './components/meeting';
 
 // 默认导出（用于Vue插件安装）

package/dist/components/activity/data.d.ts

@@ -1,51 +0,0 @@
-export declare const approveListRes: {
-    total: number;
-    page: string;
-    size: number;
-    data: {
-        id: number;
-        title: string;
-        start_date: string;
-        end_date: string;
-        activity_type: number;
-        synopsis: string;
-        activity_mode: number;
-        status: number;
-        create_time: string;
-        is_delete: number;
-        address: string;
-        sponsor: string;
-        start: string;
-        end: string;
-        register_url: string;
-        content_url: string;
-        update_activity_id: null;
-        register_end_date: string;
-    }[];
-};
-export declare const listRes: {
-    total: number;
-    page: string;
-    size: number;
-    data: {
-        id: number;
-        title: string;
-        start_date: string;
-        end_date: string;
-        activity_type: number;
-        synopsis: string;
-        activity_mode: number;
-        create_time: string;
-        address: string;
-        status: number;
-        sponsor: string;
-        is_delete: number;
-        start: string;
-        end: string;
-        register_url: string;
-        content_url: string;
-        register_end_date: string;
-        update_activity_id: null;
-        approver: string;
-    }[];
-};