@opendesign-plus-test/components 0.0.1-rc.56 → 0.0.1-rc.57

package/src/components/banner/OBannerContent.vue

@@ -0,0 +1,175 @@
+<script setup lang="ts">
+import { OButton, OFigure } from '@opensig/opendesign';
+import ContentWrapper from '../common/ContentWrapper.vue';
+import type { BannerContentProps } from './types';
+
+defineProps<BannerContentProps>();
+
+// 内联定义 emits 类型
+const emit = defineEmits<{
+  (e: 'click', href: string | undefined): void;
+}>();
+
+const onClick = (href: string | undefined, hasBtn: string | undefined) => {
+  if (href && !hasBtn) {
+    window.open(href);
+    emit('click', href);
+  }
+};
+</script>
+
+<template>
+  <OFigure
+    class="banner-bg"
+    :src="info.bg"
+    :class="{
+      'with-sticky-bg': info.withStickyBg,
+      'cursor-pointer': info.href && !info.btn,
+    }"
+    :style="{
+      '--pad-offset': info.pad_offset,
+    }"
+    @click="onClick(info.href, info.btn)"
+  >
+    <ContentWrapper class="banner-wrapper" :class="['banner-wrapper', contentJustifyCenter ? 'content-center' : '']">
+      <div class="banner-content">
+        <img v-if="!isPhone && info.attach" :src="info.attach" class="banner-attach" />
+
+        <!-- 标题 -->
+        <div 
+          :class="{
+            'banner-title': true, 
+            'text-dark': info.text_theme === 'dark' 
+          }" 
+          v-if="info.title"
+        >
+          {{ info.title }}
+        </div>
+        <!-- 副标题 -->
+        <div 
+          :class="{
+            'banner-subtitle': true, 
+            'text-dark': info.text_theme === 'dark' 
+          }" 
+          v-if="info.subtitle"
+        >
+          {{ info.subtitle }}
+        </div>
+        <div
+          class="banner-text"
+          v-if="info.bg_text"
+          :style="{
+            backgroundImage: `url(${info.bg_text})`,
+            '--pc-width': info.pc_text_width,
+            '--pc-height': info.pc_text_height,
+            '--pad-width': info.pad_text_width,
+            '--pad-height': info.pad_text_height,
+          }"
+        ></div>
+        <!-- 操作按钮 -->
+        <div v-if="info.btn" class="banner-opts">
+          <OButton 
+            :href="info.href" 
+            target="_blank" 
+            variant="solid" 
+            color="primary" 
+            :size="size === 'tiny' ? undefined : size"
+          >
+            {{ info.btn }}
+          </OButton>
+        </div>
+      </div>
+    </ContentWrapper>
+  </OFigure>
+</template>
+
+<style lang="scss" scoped>
+.banner-bg {
+  width: 100%;
+  height: 100%;
+
+  :deep(.o-figure-img) {
+    width: 100%;
+    height: 100%;
+  }
+
+  @include respond-to('pad') {
+    :deep(.o-figure-img) {
+      transition: object-position 0.3s ease;
+      object-position: var(--pad-offset);
+    }
+  }
+
+  @include respond-to('phone') {
+    --figure-radius: 4px;
+  }
+}
+
+.banner-wrapper {
+  height: 100%;
+
+  &.content-center {
+    display: flex;
+    justify-content: center;
+
+    & .banner-content {
+      align-items: center;
+    }
+  }
+}
+
+.banner-content {
+  height: 100%;
+  display: inline-flex;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+}
+
+.banner-title {
+  @include display1;
+  color: var(--o-color-info1);
+  font-weight: 500;
+  margin-bottom: 8px;
+
+  &.text-dark {
+    color: var(--o-color-info1-inverse);
+  }
+
+  @include respond-to('<=pad_v') {
+    font-size: 22px;
+    line-height: 30px;
+  }
+}
+
+.banner-subtitle {
+  color: var(--o-color-info1);
+  margin-top: 8px;
+  font-size: 16px;
+
+  &.text-dark {
+    color: var(--o-color-info1-inverse);
+  }
+}
+
+.banner-text {
+  height: var(--pc-height);
+  width: var(--pc-width);
+  background-size: contain;
+  background-repeat: no-repeat;
+
+  @include respond-to('pad') {
+    height: var(--pad-height);
+    width: var(--pad-width);
+  }
+}
+
+.banner-opts {
+  margin-top: 24px;
+  --d: 20px;
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+</style>

package/src/components/banner/index.ts

@@ -0,0 +1,18 @@
+import _OBanner from './OBanner.vue';
+import _OBannerContent from './OBannerContent.vue';
+import type { App } from 'vue';
+
+
+const OBanner = Object.assign(_OBanner, {
+  install(app: App) {
+    app.component('OBanner', _OBanner);
+  },
+});
+const OBannerContent = Object.assign(_OBannerContent, {
+  install(app: App) {
+    app.component('OBannerContent', _OBannerContent);
+  },
+});
+
+export { OBanner, OBannerContent };
+export * from './types';

package/src/components/banner/types.ts

@@ -0,0 +1,39 @@
+// Banner 项的类型定义
+export interface BannerItem {
+  title?: string;
+  subtitle?: string;
+  bg: string;
+  text_theme?: 'light' | 'dark';
+  bg_text?: string;
+  pc_text_width?: string;
+  pc_text_height?: string;
+  pad_text_width?: string;
+  pad_text_height?: string;
+  attach?: string;
+  href?: string;
+  btn?: string;
+  withStickyBg?: boolean;
+  pad_offset?: string;
+}
+
+// BannerContent 组件的 Props 类型
+export interface BannerContentProps {
+  info: BannerItem;
+  size?: 'large' | 'medium' | 'small' | 'tiny';
+  contentJustifyCenter?: boolean;
+  isPhone?: boolean;
+  isLight?: boolean;
+}
+
+// Emits 事件类型
+export interface HomeBannerEmits {
+  (e: 'before-change', index: number): void;
+  (e: 'click', href: string | undefined): void;
+}
+
+export interface BannerContentEmits {
+  (e: 'click', href: string | undefined): void;
+}
+
+// 组件尺寸类型
+export type ComponentSize = 'large' | 'medium' | 'small' | 'tiny';

package/src/components/header/OHeader.vue

@@ -35,7 +35,7 @@ const handleMouseenter = (val: any) => {
     itemVisible.value = true;
   }
 };
-const handleMouseleave = (val: any) => {
+const handleMouseleave = () => {
   itemVisible.value = false;
 };
 const handleClick = (val: any) => {

package/src/components/meeting/OMeetingCalendar.vue

@@ -82,8 +82,8 @@ const getSummitData = async (date: string) => {
       return {
         ...v,
         type: CalendarDataType.SUMMIT,
-        start_date_time: `${ formatDate(v.start_date) } ${ v.start }`,
-        end_date_time: `${ formatDate(v.end_date) } ${ v.end }`,
+        start_date_time: `${ formatDate(v.start_date) } ${ v.start || '' }`,
+        end_date_time: `${ formatDate(v.end_date) } ${ v.end || '' }`,
       };
     });
   } else {
@@ -97,8 +97,8 @@ const getActivityData = async (date: string) => {
       return {
         ...v,
         type: CalendarDataType.EVENTS,
-        start_date_time: `${ formatDate(v.start_date) } ${ v.start }`,
-        end_date_time: `${ formatDate(v.end_date) } ${ v.end }`,
+        start_date_time: `${ formatDate(v.start_date) } ${ v.start || '' }`,
+        end_date_time: `${ formatDate(v.end_date) } ${ v.end || '' }`,
       };
     });
   } else {

package/src/components/meeting/OMeetingForm.vue

@@ -689,7 +689,11 @@ defineExpose({
               <OIcon>
                 <IconTip />
               </OIcon>
-              <span>{{ t('meeting.meetingRecordDesc', [getPlatformLabel(form.platform)]) }}</span>
+              <div>
+                <span>{{ t('meeting.meetingRecordDesc1') }}</span>
+                <br>
+                <span>{{ t('meeting.meetingRecordDesc2') }}</span>
+              </div>
             </div>
           </div>
         </template>
@@ -701,7 +705,11 @@ defineExpose({
             <OIcon>
               <IconTip />
             </OIcon>
-            <span>{{ t('meeting.meetingRecordDesc', [getPlatformLabel(form.platform)]) }}</span>
+            <div>
+              <span>{{ t('meeting.meetingRecordDesc1') }}</span>
+              <br>
+              <span>{{ t('meeting.meetingRecordDesc2') }}</span>
+            </div>
           </div>
         </div>
       </template>

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

@@ -90,7 +90,7 @@ const computedList = computed<any[]>(() => {
           dateRange = `${ formatDate(v.start_date) } ${ v.start }-${ formatDate(v.end_date) } ${ v.end }`;
         }
       } else {
-        dateRange = `${ formatDate(v.start_date, 'YYYY/MM/DD HH:mm') } ${ formatDate(v.end_date, 'YYYY/MM/DD HH:mm') }`;
+        dateRange = `${ formatDate(v.start_date, 'YYYY/MM/DD') } ${ formatDate(v.end_date, 'YYYY/MM/DD') }`;
       }
 
       return {
@@ -169,7 +169,7 @@ const computedList = computed<any[]>(() => {
       <OCollapseItem v-for="(item, index) in computedList" :key="item.id" :value="item.id">
         <template #title>
           <div class="meet-title-left">
-            <div class="meet-title" :title="item.topic || item.name">
+            <div class="meet-title" :title="item.topic || item.name || item.title">
               <OIcon
                 :style="{
                   backgroundColor: `${getConfig(item.type, 'color')}`

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

@@ -5,6 +5,7 @@ import { CalendarDataType, MeetingItemT } from '../types.ts';
 import MoreText from '@/components/common/MoreText.vue';
 import { formatDate } from '@/components/meeting/utils.ts';
 import { useMeetingConfig } from '../composables/useMeetingConfig';
+import { useI18n } from '@/i18n';
 
 const props = defineProps<{
   data: MeetingItemT;
@@ -13,7 +14,8 @@ const props = defineProps<{
   page?: CalendarDataType
 }>();
 const { t, getPlatformLabel } = useMeetingConfig();
-
+const { locale } = useI18n();
+const isZh = computed(() => locale.value === 'zh');
 // 会议详情配置
 const infoList = computed(() =>
   [
@@ -83,11 +85,15 @@ const columns = computed<ColumnItemT[]>(() => {
 });
 
 const domRef = ref([]);
+const SPLIT_MARK = '|';
 // 复制会议内容
 const copyInfo = () => {
   try {
-    let text = `${ t('meeting.meetingTopic') + props.data.topic }\n`;
-    text += [...domRef.value].reduce((pre, cur: HTMLDivElement) => `${ pre }${ cur.textContent }\n`, '');
+    const colon = isZh.value ? '：' : ': ';
+    let text = `${ t('meeting.meetingTopic') }${ colon }${ props.data.topic || props.data.name || props.data.title }\n`;
+    text += [...domRef.value].reduce((pre, cur: HTMLDivElement) => {
+      return `${ pre }${ cur.textContent ? cur.textContent.replace(SPLIT_MARK, colon) : '' }\n`;
+    }, '');
     navigator.clipboard.writeText(text);
     return Promise.resolve();
   } catch (e) {
@@ -114,6 +120,7 @@ defineExpose({ copyInfo });
     >
       <template v-if="getField(info.key) && !info.isRecord">
         <span class="label">{{ info.label }}</span>
+        <span class="split-mark">{{ SPLIT_MARK }}</span>
         <MoreText :show="show" v-if="info.ellipsis" :text="getField(info.key) || '-'" />
         <OLink
           v-else-if="info.isLink"
@@ -190,6 +197,13 @@ defineExpose({ copyInfo });
       }
     }
 
+    .split-mark {
+      width: 0;
+      height: 0;
+      opacity: 0;
+      overflow: hidden;
+    }
+
     &.type_events {
       .label {
         width: 6em;

package/src/i18n/en.ts

@@ -115,8 +115,10 @@ export default {
   'meeting.meetingDate': 'Date',
   'meeting.startTime': 'Start time',
   'meeting.endTime': 'End time',
-  'meeting.meetingRecord': 'Recording',
+  'meeting.meetingRecord': 'AI 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.',
   'meeting.day0': 'day(s)',
   'meeting.week0': 'week(s)',
   'meeting.month0': 'month(s)',
@@ -144,7 +146,7 @@ export default {
   'meeting.groups': 'Groups',
   'meeting.activityAddress': 'Address',
   'meeting.livePlatform': 'Live Platform',
-  'meeting.meetingTopic': 'Topics: ',
+  'meeting.meetingTopic': 'Topics',
   'meeting.meetingDetail': 'Details',
   'meeting.meetingEtherpad': 'Etherpad',
   'meeting.meetingReplay': 'Playback',

package/src/i18n/zh.ts

@@ -115,8 +115,9 @@ export default {
   'meeting.meetingDate': '会议日期',
   'meeting.startTime': '开始时间',
   'meeting.endTime': '结束时间',
-  'meeting.meetingRecord': '会议录制',
-  'meeting.meetingRecordDesc': '开启后将自动录屏，本服务由{0}会议提供。并将在1个工作日内自动上传会议AI版本的链接回放。',
+  'meeting.meetingRecord': '会议AI录制',
+  'meeting.meetingRecordDesc1': '1、会议AI录制已开启，开启会议AI听即开启云录制，会后可回放会议录制并生成语音文字和AI纪要。',
+  'meeting.meetingRecordDesc2': '2、AI生成的会议回放链接将在 1 个工作日内自动生成并上传。',
   'meeting.day0': '天',
   'meeting.week0': '周',
   'meeting.month0': '月',
@@ -144,7 +145,7 @@ export default {
   'meeting.groups': '工作组',
   'meeting.activityAddress': '活动地点',
   'meeting.livePlatform': '直播平台',
-  'meeting.meetingTopic': '会议主题：',
+  'meeting.meetingTopic': '会议主题',
   'meeting.meetingDetail': '会议详情',
   'meeting.meetingEtherpad': '会议纪要',
   'meeting.meetingReplay': '智能回放',

package/src/index.ts

@@ -1,11 +1,11 @@
 // OpenDesignPlus Components 库入口文件
 // 此文件由 scripts/generate-components-index.js 自动生成
 
-import OBanner from './components/OBanner.vue';
 import OCookieNotice from './components/OCookieNotice.vue';
 import OFooter from './components/OFooter.vue';
 import OHeaderSearch from './components/OHeaderSearch.vue';
 import OHeaderUser from './components/OHeaderUser.vue';
+import OLanguageSwitcher from './components/OLanguageSwitcher.vue';
 import OPlusConfigProvider from './components/OPlusConfigProvider.vue';
 import OSection from './components/OSection.vue';
 import OSourceCode from './components/OSourceCode.vue';
@@ -13,11 +13,11 @@ import OThemeSwitcher from './components/OThemeSwitcher.vue';
 
 // 导出组件
 const components = {
-  OBanner,
   OCookieNotice,
   OFooter,
   OHeaderSearch,
   OHeaderUser,
+  OLanguageSwitcher,
   OPlusConfigProvider,
   OSection,
   OSourceCode,
@@ -25,10 +25,11 @@ const components = {
 };
 
 // 导出单个组件
-export { OBanner, OCookieNotice, OFooter, OHeaderSearch, OHeaderUser, OPlusConfigProvider, OSection, OSourceCode, OThemeSwitcher };
+export { OCookieNotice, OFooter, OHeaderSearch, OHeaderUser, OLanguageSwitcher, OPlusConfigProvider, OSection, OSourceCode, OThemeSwitcher };
 
 // 重新导出子目录中的组件
 export * from './components/activity';
+export * from './components/banner';
 export * from './components/element-plus';
 export * from './components/events';
 export * from './components/header';

package/dist/components/OBanner.vue.d.ts

@@ -1,11 +0,0 @@
-type __VLS_Props = {
-    options: any;
-    size: string;
-    contentJustifyCenter: boolean;
-};
-declare const _default: import('../../vue/dist/vue.esm-bundler.js').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, import('../../vue/dist/vue.esm-bundler.js').ComponentOptionsMixin, {}, string, import('../../vue/dist/vue.esm-bundler.js').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    options: any;
-    size: string;
-    contentJustifyCenter: boolean;
-}, {}, {}, {}, string, import('../../vue/dist/vue.esm-bundler.js').ComponentProvideOptions, false, {}, HTMLDivElement>;
-export default _default;