首页卡片开发

2025-10-24 16:54:52 +08:00
parent 92ee5c5311
commit 2d6370b796
22 changed files with 896 additions and 205 deletions
--- a/pages/mine/company-info.vue
+++ b/pages/mine/company-info.vue
@@ -1,15 +1,10 @@
 <template>
-    <AppLayout title="企业信息" back-gorund-color="#F4F4F4">
-        <!-- 头部进度显示 -->
-        <view class="header-progress">
-            <text class="progress-text">{{ companyInfo.completeness || '100%' }}</text>
-        </view>
-
+    <AppLayout back-gorund-color="#F4F4F4">
        <!-- 编辑头像 -->
        <view class="avatar-section btn-feel" @click="editAvatar">
            <view class="avatar-label">编辑头像</view>
            <view class="avatar-container">
-                <image class="company-avatar" :src="companyInfo.avatar || '/static/icon/company-avatar.png'"></image>
+                <image class="company-avatar" :src="companyInfo.avatar || '/static/imgs/avatar.jpg'"></image>
                <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
            </view>
        </view>
@@ -19,7 +14,7 @@
            <view class="info-item btn-feel" @click="editInfo('name')">
                <view class="info-label">企业名称</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.name || '科里(北京)科技有限公司(喀什分公司)' }}</text>
+                    <text class="info-value">{{ companyInfo.name || '暂无公司名称' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -27,7 +22,7 @@
            <view class="info-item btn-feel" @click="editInfo('code')">
                <view class="info-label">统一社会代码</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.socialCode || '6217171301012562295' }}</text>
+                    <text class="info-value">{{ companyInfo.socialCode || '暂无统一社会代码' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -35,7 +30,7 @@
            <view class="info-item btn-feel" @click="editInfo('location')">
                <view class="info-label">企业注册地点</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.location || '北京' }}</text>
+                    <text class="info-value">{{ companyInfo.location || '暂无注册地点' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -43,7 +38,7 @@
            <view class="info-item btn-feel" @click="editInfo('description')">
                <view class="info-label">企业信息介绍</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.description || '公司成立于2003年01月27日,位于北京市大兴区经济技术产业开发区天泰一路3号一号楼南四、五楼,目前处于开业状态,经营范围包括信息技术咨询服务;科技中介服务;人工智能等。' }}</text>
+                    <text class="info-value">{{ companyInfo.description || '暂无企业介绍' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -51,7 +46,7 @@
            <view class="info-item btn-feel" @click="editInfo('legalPerson')">
                <view class="info-label">企业法人姓名</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.legalPerson || '孙正云' }}</text>
+                    <text class="info-value">{{ companyInfo.legalPerson || '暂无法人信息' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -59,7 +54,7 @@
            <view class="info-item btn-feel" @click="editInfo('contact1')">
                <view class="info-label">企业联系人名称</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.contact1Name || '吴宣萱' }}</text>
+                    <text class="info-value">{{ companyInfo.contact1Name || '暂无联系人' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -67,7 +62,7 @@
            <view class="info-item btn-feel" @click="editInfo('contact1Phone')">
                <view class="info-label">企业联系人电话</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.contact1Phone || '15547143804' }}</text>
+                    <text class="info-value">{{ companyInfo.contact1Phone || '暂无联系电话' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -75,7 +70,7 @@
            <view class="info-item btn-feel" @click="editInfo('contact2')">
                <view class="info-label">企业联系人名称</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.contact2Name || '李杰' }}</text>
+                    <text class="info-value">{{ companyInfo.contact2Name || '暂无联系人' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -83,7 +78,7 @@
            <view class="info-item btn-feel" @click="editInfo('contact2Phone')">
                <view class="info-label">企业联系人电话</view>
                <view class="info-content">
-                    <text class="info-value">{{ companyInfo.contact2Phone || '10700010700' }}</text>
+                    <text class="info-value">{{ companyInfo.contact2Phone || '暂无联系电话' }}</text>
                    <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
                </view>
            </view>
@@ -94,22 +89,24 @@
 <script setup>
 import { reactive, inject, onMounted } from 'vue';
 import { onLoad, onShow } from '@dcloudio/uni-app';
+import AppLayout from '@/components/AppLayout/AppLayout.vue';

 const { $api, navTo } = inject('globalFunction');

 // 企业信息数据
 const companyInfo = reactive({
-    name: '科里(北京)科技有限公司(喀什分公司)',
-    avatar: '/static/icon/company-avatar.png',
+    name: '',
+    avatar: '/static/imgs/avatar.jpg',
    completeness: '100%',
-    socialCode: '6217171301012562295',
-    location: '北京',
-    description: '公司成立于2003年01月27日,位于北京市大兴区经济技术产业开发区天泰一路3号一号楼南四、五楼,目前处于开业状态,经营范围包括信息技术咨询服务;科技中介服务;人工智能等。',
-    legalPerson: '孙正云',
-    contact1Name: '吴宣萱',
-    contact1Phone: '15547143804',
-    contact2Name: '李杰',
-    contact2Phone: '10700010700'
+    socialCode: '',
+    location: '',
+    description: '',
+    legalPerson: '',
+    contact1Name: '',
+    contact1Phone: '',
+    contact2Name: '',
+    contact2Phone: '',
+    isVerified: false // 实名状态
 });

 function editAvatar() {
@@ -166,24 +163,56 @@ onShow(() => {
    getCompanyInfo();
 });

+// 从缓存获取公司信息
 function getCompanyInfo() {
-    // 这里可以调用API获取企业信息
-    // $api.createRequest('/app/company/info').then((resData) => {
-    //     Object.assign(companyInfo, resData.data);
-    // });
+    try {
+        const cachedUserInfo = uni.getStorageSync('userInfo') || {};
+        console.log('缓存中的userInfo:', cachedUserInfo);
+        
+        // 检查是否有company字段
+        if (cachedUserInfo.company) {
+            const company = cachedUserInfo.company;
+            
+            // 基本信息
+            companyInfo.name = company.name || '';
+            companyInfo.socialCode = company.code || '';
+            companyInfo.location = company.registeredAddress || '';
+            companyInfo.description = company.description || '';
+            companyInfo.legalPerson = company.legalPerson || '';
+            
+            // 联系人信息
+            if (company.companyContactList && company.companyContactList.length > 0) {
+                const contacts = company.companyContactList;
+                companyInfo.contact1Name = contacts[0]?.contactPerson || '';
+                companyInfo.contact1Phone = contacts[0]?.contactPersonPhone || '';
+                if (contacts.length > 1) {
+                    companyInfo.contact2Name = contacts[1]?.contactPerson || '';
+                    companyInfo.contact2Phone = contacts[1]?.contactPersonPhone || '';
+                }
+            }
+            
+            // 判断是否实名：legalIdCard字段有值则表示已实名
+            companyInfo.isVerified = !!(company.legalIdCard && company.legalIdCard.trim());
+            
+            console.log('公司名称:', companyInfo.name);
+            console.log('实名状态:', companyInfo.isVerified);
+            console.log('legalIdCard值:', company.legalIdCard);
+        } else {
+            console.log('缓存中没有company字段');
+            // 保持默认值
+        }
+    } catch (error) {
+        console.error('获取公司信息失败:', error);
+        // 保持默认值
+    }
+}
+
+function goBack() {
+    uni.navigateBack();
 }
 </script>

 <style lang="stylus" scoped>
-.header-progress {
-    text-align: center;
-    padding: 20rpx 0;
-    
-    .progress-text {
-        font-size: 28rpx;
-        color: #6C7282;
-    }
-}

 .avatar-section {
    display: flex;
--- a/pages/mine/company-mine.vue
+++ b/pages/mine/company-mine.vue
@@ -1,16 +1,21 @@
 <template>
-    <AppLayout title="我的" back-gorund-color="#F4F4F4">
+    <AppLayout back-gorund-color="#F4F4F4">
        <!-- 自定义tabbar -->
        <CustomTabBar :currentPage="4" />
        
        <!-- 企业信息卡片 -->
        <view class="company-info-card btn-feel" @click="goToCompanyInfo">
            <view class="company-avatar">
-                <image class="company-avatar-img" :src="companyInfo.avatar || '/static/icon/company-default.png'"></image>
+                <image class="company-avatar-img" :src="companyInfo.avatar || '/static/imgs/avatar.jpg'"></image>
            </view>
            <view class="company-details">
-                <view class="company-name">{{ companyInfo.name || '科里喀什分公司' }}</view>
-                <view class="company-completeness">信息完整度 {{ companyInfo.completeness || '100%' }}</view>
+                <view class="company-name">{{ companyInfo.name || '暂无公司名称' }}</view>
+                <view class="company-completeness">
+                    信息完整度 {{ companyInfo.completeness || '100%' }}
+                    <text class="verification-status" :class="{ 'verified': companyInfo.isVerified, 'unverified': !companyInfo.isVerified }">
+                        {{ companyInfo.isVerified ? '已实名' : '未实名' }}
+                    </text>
+                </view>
            </view>
            <view class="company-arrow">
                <uni-icons color="#A2A2A2" type="right" size="16"></uni-icons>
@@ -22,14 +27,16 @@
            <view class="service-title">服务专区</view>
            <view class="service-item btn-feel">
                <view class="service-left">
-                    <image class="service-icon" src="/static/icon/real-name-auth.png"></image>
+                    <uni-icons type="contact" size="20" color="#256BFA"></uni-icons>
                    <text class="service-text">实名认证</text>
                </view>
-                <view class="service-status">已通过</view>
+                <view class="service-status" :class="{ 'verified': companyInfo.isVerified, 'unverified': !companyInfo.isVerified }">
+                    {{ companyInfo.isVerified ? '已通过' : '未认证' }}
+                </view>
            </view>
            <view class="service-item btn-feel">
                <view class="service-left">
-                    <image class="service-icon" src="/static/icon/notification.png"></image>
+                    <uni-icons type="notification" size="20" color="#256BFA"></uni-icons>
                    <text class="service-text">通知与提醒</text>
                </view>
                <view class="service-status">已开启</view>
@@ -57,17 +64,19 @@
 </template>

 <script setup>
-import { reactive, inject, ref, onMounted } from 'vue';
+import { reactive, inject, ref, onMounted, onUnmounted } from 'vue';
 import { onLoad, onShow } from '@dcloudio/uni-app';
+import useUserStore from '@/stores/useUserStore';

 const { $api, navTo } = inject('globalFunction');
 const popup = ref(null);

 // 企业信息数据
 const companyInfo = reactive({
-    name: '科里喀什分公司',
-    avatar: '/static/icon/company-avatar.png',
-    completeness: '100%'
+    name: '',
+    avatar: '/static/imgs/avatar.jpg',
+    completeness: '100%',
+    isVerified: false // 实名状态
 });

 function goToCompanyInfo() {
@@ -83,9 +92,11 @@ function close() {
 }

 function confirm() {
-    // 这里可以调用退出登录的API
-    console.log('退出登录');
-    // 跳转到登录页面或首页
+    // 调用退出登录
+    useUserStore().logOut();
+    // 关闭弹窗
+    popup.value.close();
+    // 跳转到首页
    uni.reLaunch({
        url: '/pages/index/index'
    });
@@ -96,11 +107,45 @@ onShow(() => {
    getCompanyInfo();
 });

+// 监听退出登录事件，显示微信登录弹窗
+onMounted(() => {
+    uni.$on('showLoginModal', () => {
+        // 这里可以显示微信登录弹窗
+        // 由于这个页面没有 WxAuthLogin 组件，我们跳转到首页让首页处理
+        uni.reLaunch({
+            url: '/pages/index/index'
+        });
+    });
+});
+
+onUnmounted(() => {
+    uni.$off('showLoginModal');
+});
+
+// 从缓存获取公司信息
 function getCompanyInfo() {
-    // 这里可以调用API获取企业信息
-    // $api.createRequest('/app/company/info').then((resData) => {
-    //     Object.assign(companyInfo, resData.data);
-    // });
+    try {
+        const cachedUserInfo = uni.getStorageSync('userInfo') || {};
+        console.log('缓存中的userInfo:', cachedUserInfo);
+        
+        // 检查是否有company字段
+        if (cachedUserInfo.company) {
+            companyInfo.name = cachedUserInfo.company.name || '';
+            // 判断是否实名：legalIdCard字段有值则表示已实名
+            companyInfo.isVerified = !!(cachedUserInfo.company.legalIdCard && cachedUserInfo.company.legalIdCard.trim());
+            console.log('公司名称:', companyInfo.name);
+            console.log('实名状态:', companyInfo.isVerified);
+            console.log('legalIdCard值:', cachedUserInfo.company.legalIdCard);
+        } else {
+            console.log('缓存中没有company字段');
+            companyInfo.name = '';
+            companyInfo.isVerified = false;
+        }
+    } catch (error) {
+        console.error('获取公司信息失败:', error);
+        companyInfo.name = '';
+        companyInfo.isVerified = false;
+    }
 }
 </script>

@@ -140,6 +185,25 @@ function getCompanyInfo() {
        .company-completeness {
            font-size: 28rpx;
            color: #6C7282;
+            display: flex;
+            align-items: center;
+            gap: 16rpx;
+            
+            .verification-status {
+                font-size: 24rpx;
+                padding: 4rpx 12rpx;
+                border-radius: 12rpx;
+                
+                &.verified {
+                    background-color: #E8F5E8;
+                    color: #52C41A;
+                }
+                
+                &.unverified {
+                    background-color: #FFF2E8;
+                    color: #FA8C16;
+                }
+            }
        }
    }
    
@@ -177,21 +241,24 @@ function getCompanyInfo() {
            display: flex;
            align-items: center;
            
-            .service-icon {
-                width: 44rpx;
-                height: 44rpx;
-                margin-right: 16rpx;
-            }
-            
            .service-text {
                font-size: 28rpx;
                color: #333333;
+                margin-left: 16rpx;
            }
        }
        
        .service-status {
            font-size: 28rpx;
            color: #6E6E6E;
+            
+            &.verified {
+                color: #52C41A;
+            }
+            
+            &.unverified {
+                color: #FA8C16;
+            }
        }
    }
 }
--- a/pages/mine/mine.vue
+++ b/pages/mine/mine.vue
@@ -120,7 +120,7 @@
 </template>

 <script setup>
-import { reactive, inject, watch, ref, onMounted } from 'vue';
+import { reactive, inject, watch, ref, onMounted, onUnmounted } from 'vue';
 import { storeToRefs } from 'pinia';
 import { onLoad, onShow } from '@dcloudio/uni-app';
 const { $api, navTo } = inject('globalFunction');
@@ -145,6 +145,21 @@ onShow(() => {
    tabbarManager.updateSelected(4);
 });

+// 监听退出登录事件，显示微信登录弹窗
+onMounted(() => {
+    uni.$on('showLoginModal', () => {
+        // 这里可以显示微信登录弹窗
+        // 由于这个页面没有 WxAuthLogin 组件，我们跳转到首页让首页处理
+        uni.reLaunch({
+            url: '/pages/index/index'
+        });
+    });
+});
+
+onUnmounted(() => {
+    uni.$off('showLoginModal');
+});
+
 function close() {
    popup.value.close();
 }