im-ui-mobile 0.0.38 → 0.0.40

package/components/{im-chat/im-chat.vue → im-sample/im-sample.vue}

@@ -1,24 +1,19 @@
 <template>
-    <view class="im-chat" :class="[`im-chat--${type}`]" @click="handleClick">
-        <view class="im-chat__avatar">
+    <view class="im-sample" :class="[`im-sample--${type}`]" @click="handleClick">
+        <view class="im-sample__avatar">
             <view class="avatar-fallback">
-                <!-- <image v-if="avatar" :src="avatar" class="avatar-image" mode="aspectFill" /> -->
                 <u-avatar v-if="avatar" :src="avatar" />
                 <text v-else class="avatar-text">{{ displayName }}</text>
             </view>
         </view>
-        <view class="im-chat__content">
-            <view class="im-chat__header">
-                <text class="im-chat__name">{{ name }}</text>
-                <text class="im-chat__time">{{ time }}</text>
+        <view class="im-sample__content">
+            <view class="im-sample__header">
+                <text class="im-sample__name">{{ name }}</text>
+                <text class="im-sample__time">{{ time }}</text>
             </view>
-            <view class="im-chat__message">
-                <text class="im-chat__text">{{ lastMessage }}</text>
+            <view class="im-sample__message">
+                <text class="im-sample__text">{{ lastMessage }}</text>
                 <u-badge v-if="unreadCount > 0" :max="99" :value="unreadCount" />
-
-                <!-- <view v-if="unreadCount > 0" class="badge-fallback">
-                    <text class="badge-text">{{ displayUnreadCount }}</text>
-                </view> -->
             </view>
         </view>
     </view>
@@ -91,7 +86,7 @@ const handleClick = (event: Event) => {
 </script>
 
 <style lang="scss" scoped>
-.im-chat {
+.im-sample {
     display: flex;
     padding: 24rpx 32rpx;
     transition: background-color 0.3s;
@@ -149,7 +144,7 @@ const handleClick = (event: Event) => {
         flex: 1;
 
         /* 群聊样式 */
-        .im-chat--group &::before {
+        .im-sample--group &::before {
             content: "👥 ";
         }
     }

package/index.js

@@ -1,12 +1,55 @@
 import { UViewPlusPlugin } from './plugins/uview-plus.js'
-import ImChat from './components/im-chat/im-chat.vue'
+// import ImChat from './components/im-sample/im-sample.vue'
 
 // 重要：为组件添加名称，以支持开发环境
-ImChat.name = 'ImChat'
+// ImChat.name = 'ImChat'
 
-const components = [
-    ImChat
-]
+// const components = [
+//     ImChat
+// ]
+
+// #ifdef APP || H5
+const importFn = import.meta.glob('./components/im-*/im-*.vue', { eager: true })
+const components = [];
+
+// 批量注册全局组件
+for (const key in importFn) {
+    const component = importFn[key].default;
+    
+    // 1. 从文件路径中提取组件名（更可靠的方法）
+    const fileName = key.split('/').pop(); // 获取文件名，如 im-button.vue
+    const componentName = fileName
+        .replace('.vue', '') // 去掉 .vue 后缀
+        .replace(/\b\w/g, l => l.toUpperCase()) // 首字母大写，如 ImButton
+        
+    // 或者使用 kebab-case 转 PascalCase 的通用方法
+    const toPascalCase = (str) => {
+        return str
+            .replace(/im-/, '') // 去掉 im- 前缀
+            .split('-')
+            .map(word => word.charAt(0).toUpperCase() + word.slice(1))
+            .join('');
+    }
+    const pascalName = 'Im' + toPascalCase(fileName.replace('.vue', ''));
+    
+    // 2. 正确的安装方法
+    if (component) {
+        // 如果组件本身没有 name，给它设置一个
+        if (!component.name) {
+            component.name = pascalName;
+        }
+        
+        // 添加 install 方法
+        // component.install = function (app) {
+        //     app.component(component.name || pascalName, component);
+        // };
+        
+        // 添加到组件列表
+        components.push(component);
+        console.log(`注册组件: ${component.name || pascalName}`);
+    }
+}
+// #endif
 
 const install = (app) => {
     // 安装 uview-plus

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "im-ui-mobile",
-  "version": "0.0.38",
+  "version": "0.0.40",
   "description": "A Vue3.0 + typescript instant messaging component library for Uniapp",
   "type": "module",
   "main": "index.js",

package/plugins/uview-plus.js

@@ -4,11 +4,26 @@ export const UViewPlusPlugin = {
   install(app) {
     // 安装 uview-plus
     app.use(uviewPlus)
-    
+
     // 注册一些常用的 uview-plus 组件作为全局组件
     app.component('UButton', uviewPlus.Button)
     app.component('UInput', uviewPlus.Input)
     app.component('UAvatar', uviewPlus.Avatar)
     app.component('UBadge', uviewPlus.Badge)
+    app.component('UIcon', uviewPlus.Icon)
+    app.component('UPopup', uviewPlus.Popup)
+    app.component('USearch', uviewPlus.Search)
+    app.component('UIndexList', uviewPlus.IndexList)
+    app.component('UIndexItem', uviewPlus.IndexItem)
+    app.component('UCard', uviewPlus.Card)
+    app.component('UTabs', uviewPlus.Tabs)
+    app.component('UParse', uviewPlus.Parse)
+    app.component('ULink', uviewPlus.Link)
+    app.component('UUpload', uviewPlus.Upload)
+    app.component('ULineProgress', uviewPlus.LineProgress)
+    app.component('UModal', uviewPlus.Modal)
+    app.component('UTag', uviewPlus.Tag)
+    app.component('UForm', uviewPlus.Form)
+    app.component('UFormItem', uviewPlus.FormItem)
   }
 }

package/types/components/{chat.d.ts → sample.d.ts}

@@ -1,6 +1,6 @@
 import { AllowedComponentProps, VNodeProps } from './_common'
 
-declare interface ChatProps {
+declare interface SampleProps {
     type: string
     avatar: string
     name: string
@@ -9,12 +9,12 @@ declare interface ChatProps {
     unreadCount: number
 }
 
-declare interface _Chat {
+declare interface _Sample {
     new(): {
         $props: AllowedComponentProps &
         VNodeProps &
-        ChatProps
+        SampleProps
     }
 }
 
-export declare const Chat: _Chat
+export declare const Sample: _Sample

package/types/components.d.ts

@@ -1,6 +1,6 @@
 declare module 'vue' {
     export interface GlobalComponents {
-        ['im-chat']: typeof import('./components/chat')['Chat']
+        ['im-sample']: typeof import('./components/sample')['Sample']
     }
 }