2024-05-16

cloud/businessCard/index.vue

@@ -1,46 +1,430 @@
 <template>
-    <view>
-        <view class="head" :style="{ height: tovw(CustomBar) }">
+    <view class="self-card" :style="{'--height': tovw(+CustomBar+10)}">
+        <view class="head" :style="[{ height: tovw(+CustomBar+184) }]" style="background: linear-gradient( 225deg, #F43A50 0%, #C30D23 100%)">
             <view class="custom" :style="{ height: tovw(Custom.height), top: tovw(Custom.top - 3) }">
-                邀请人员
+                <view v-if="userInfo.name">{{userInfo.name}}的名片</view>
+                <view v-else>暂无信息</view>
                 <view class="back" :style="{ lineHeight: tovw(Custom.height) }" @click="onBack">
                     <text class=" iconfont icon-a-wodetiaozhuan" />
                 </view>
             </view>
+            <image class="bg-bottom" mode="widthFix" src="/static/workbench/减去.svg">
+            </image>
+            <view class="card">
+                <view class="header">
+                    <view class="left">
+                        <view class="title">
+                            <text>{{ userInfo.name||'暂无' }}</text>
+                            <text>{{ userInfo.rolenames||'暂无' }}</text>
+                        </view>
+                        <text class="phone">{{ userInfo.phonebumber||'暂无' }}</text>
+                        <view class="redline"></view>
+                    </view>
+                    <view class="right">
+                        <image :src="userInfo.headpic || 'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404231713854678447B26b4363.svg'" mode="widthFix">
+                            
+                        </image>
+                    </view>
+                </view>
+                <view class="bottom">
+                    <view class="left">
+                        <view>
+                            <i class="iconfont icon-qiye-hui"></i>
+                            <view class="text">{{ userInfo.enterprisename||'暂无' }}</view>
+                        </view>
+                        <view>
+                            <i class="iconfont icon-youxiang"></i>
+                            <view class="text">{{ userInfo.email ||'暂无' }}</view>
+                        </view>
+                        <view style="margin-bottom: 0 !important;">
+                            <i class="iconfont icon-dizhi_xian"></i>
+                            <view class="text u-line-2">{{ userInfo.address ||'暂无' }}都是第三方神鼎飞丹砂发斯蒂芬斯蒂芬是的防守打法收到防守打法</view>
+                        </view>
+                    </view>
+                    <view class="right">
+                        <image class="code" src="/static/workbench/二维码.svg" />
+                        <text>名片码</text>
+                    </view>
+                </view>
+            </view>
         </view>
+        <view class="card-handle">
+            <view class="top">
+                <view class="left">
+                    <view class="avatar">
+                        <block v-for="item in userInfo.readusers">
+                            <image :src="item.headpic||'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404231713854678447B26b4363.svg'" v-if="item.rowindex<4" :key="item.rowindex"/>
+                        </block>
+                        <text style="color:#BBBBBB">...</text>
+                    </view>
+                    <view class="readcount">浏览了{{ userInfo.count_read }}</view>
+                </view>    
+                <navigator url="#" class="right" @click="goodClick">
+                    <i :class="['iconfont',userInfo.islike==1?' icon-yidianzan':' icon-weidianzan']" :style="{color:userInfo.islike?'#C30D23':'#666666'}"></i>
+                    <text>点赞{{ userInfo.count_like}}</text>
+                </navigator>
+            </view>
+            <view class="bottom">
+                <view class="but" hover-class="navigator-hover" @click="copy">
+                    <i class="iconfont icon-fuzhi" style="color: #C30D23;"></i>
+                    复制电话
+                </view>
+                <view class="but" hover-class="navigator-hover" @click="shareClick">
+                    <i class="iconfont icon-zhuanfa"></i>
+                    转发名片
+                </view>
+            </view>
+        </view>
+
+        <u-popup :show="shareShow" mode="bottom" @close="shareShow=false">
+            <view class="share-box">
+                <contact openType="share">
+                    <view class="item" hover-class="navigator-hover" @click="shareWx">
+                    <image mode="widthFix" src="/static/workbench/微信好友.svg" />
+                        <text>微信好友</text>
+                    </view>
+                </contact>
+                
+                <view class="item" hover-class="navigator-hover" @click="goCard">
+                    <image mode="widthFix" src="/static/workbench/名片海报.svg" />
+                    <text>名片海报</text>
+                </view>
+            </view>
+        </u-popup>
     </view>
 </template>
 
 <script>
+import contact from "../../components/contact"
 export default {
+    components:{contact},
+    data () {
+        return {
+            userInfo:{},
+            userid:uni.getStorageSync('userMsg').userid,
+            shareShow:false
+        }
+    },
+    methods: {  
+        async getuserInfo () {
+            let res = await this.$Http.basic({
+                "id": 20240514161502,
+                "content": {
+                    userid:this.userid
+                },
+            })
+            this.userInfo = res.data
+            console.log(this.userInfo,'用户信息');
+        },
+        shareClick () {
+            this.shareShow = true
+        },
+        onBack() {
+            uni.navigateBack()
+        },
+        async goodClick () {
+            let res = await this.$Http.basic({
+                "id": 20240416133702,
+                "content": {
+                    "ownertable": "sys_users",
+                    "ownerid": this.userid,
+                    "type":2//1:收藏，2：点赞
+                },
+            })
+            if (this.cutoff(res.msg)) return;
+            this.getuserInfo()
+        },
+        copy() {
+            uni.setClipboardData({
+                data:this.userInfo.phonebumber,
+                success: (result) => {
+                    uni.showToast({
+                        title: "已复制",
+                        icon: "none",
+                        duration: 1500,
+                    })
+                }
+            });
+        },
+        shareWx () {
 
+        },
+        goCard () {
+
+        },
+        getSheraDate() {
+            
+        }
+    },
+    onShareAppMessage(res) {
+        return {
+            title: this.userInfo.name, // 标题
+            path: "/cloud/businessCard/index?id=" + this.userid, // 分享路径
+            imageUrl: ""// 分享图
+        };
+    },
+    onLoad(options) {
+        console.log("被邀请加入团队", options)
+        this.sys_enterpriseid = options.userid;
+        const systemInitIsComplete = this.$Http.systemInitIsComplete;
+        if (!systemInitIsComplete || typeof systemInitIsComplete == 'object') {
+            this.$Http.HomePageStartRendering = render(this)
+        } else {
+            render(this)
+        }
+        function render(that) {
+            that.getuserInfo()
+        }
+    },
 }
 </script>
 
 <style lang="scss">
-.head {
-    position: relative;
-    width: 100vw;
-
-    .custom {
-        position: absolute;
+.self-card {
+    .head {
+        position: relative;
         width: 100vw;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        font-family: PingFang SC, PingFang SC;
-        font-weight: 500;
-        font-size: 17px;
-        color: #FFFFFF;
-
-        .back {
+        .bg-bottom {
             position: absolute;
-            padding: 0 10px;
+            bottom: 0px;
             left: 0;
-            color: #fff;
+            width: 100vw;
+
+        }
+        .custom {
+            position: absolute;
+            width: 100vw;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-family: PingFang SC, PingFang SC;
+            font-weight: 500;
+            font-size: 17px;
+            color: #FFFFFF;
+
+            .back {
+                position: absolute;
+                padding: 0 10px;
+                left: 0;
+                color: #fff;
+                font-size: 12px;
+                transform: rotateY(180deg);
+            }
+        }
+        .card {
+            width: 355px;
+            height: 220px;
+            box-sizing: border-box;
+            background: #FFFFFF;
+            box-shadow: 0px 2px 10px 1px rgba(0,0,0,0.16);
+            border-radius: 8px 8px 8px 8px;
+            position: absolute;
+            top: var(--height);
+            left: 10px;
+            padding: 20px;
+            font-family: Source Han Sans SC, Source Han Sans SC;
+            .header {
+                display: flex;
+                justify-content: space-between;
+                align-content: center;
+                align-items: center;
+                .left {
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: space-between;
+                    .title {
+                        display: flex;
+                        align-items: center;
+                        text {
+                            &:first-child {
+                                font-weight: 500;
+                                font-size: 18px;
+                                color: #333333;
+                            }
+                            &:last-child {
+                                font-weight: 400;
+                                font-size: 12px;
+                                color: #999999;
+                                margin-left: 10px;
+                            }
+                        }
+                        margin-bottom: 5px;
+                    }
+                    .phone {
+                        font-weight: 500;
+                        font-size: 16px;
+                        color: #333333;
+                    }
+                    .redline {
+                        width: 24px;
+                        height: 2px;
+                        background: #C30D23;
+                        margin-top: 15px;
+                    }
+                }
+                .right {
+                    width: 56px;
+                    height: 56px;
+                    background: #DCEBF8;
+                    box-shadow: 0px 3px 6px 1px #E0D6D7;
+                    border: 2px solid #FFFFFF;
+                    border-radius: 50%;
+                    image {
+                        width: 100%;
+                        height: 100%;
+                        border-radius: 50%;
+                    }
+                }
+            }
+            .bottom {
+                display: flex;
+                justify-content: space-between;                
+                font-family: Source Han Sans SC, Source Han Sans SC;
+                font-weight: 400;
+                font-size: 12px;
+                color: #666666;
+                margin-top: 22px;
+                .left {
+                    display: flex;
+                    flex-direction: column;
+                    >view {
+                        margin-bottom: 13px;
+                        display: flex;
+                        align-content: center;
+                        align-items: center;
+                        .text {
+                            margin-left: 10px;
+                            max-width: 211px;
+                        }
+                    }
+                }
+                .right {
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    align-content: center;
+                    text {
+                        font-weight: 400;
+                        font-size: 12px;
+                        color: #666666;
+                        
+                    }
+                    .code {
+                        width: 32px;
+                        height: 32px;
+                        margin-bottom: 4px;
+                    }
+                }
+            }
+        }
+    }
+    .card-handle {
+        padding: 50px 10px 20px 10px;
+        background: #ffffff;
+        margin-top: 25px;
+        .top {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            align-content: center;
+            font-family: Source Han Sans SC, Source Han Sans SC;
             font-size: 12px;
-            transform: rotateY(180deg);
+            color: #999999;
+            .left {
+                display: flex;
+                flex-direction: column;
+                .avatar {
+                    display: flex;
+                    align-items:flex-start;
+                    align-content: center;
+                    image {
+                        margin-right: 5px;
+                        width: 24px;
+                        height: 24px;
+                    }
+                    text {
+                        transform: scale(1.5);
+                    }
+                }
+                .readcount{
+                    margin-top: 5px;
+                    display: block;
+                }
+            }
+            .right {
+                display: flex;
+                flex-direction: column;
+                align-content: center;
+                align-items: center;
+                i {
+                    display: block;
+                    color: #666666;
+                }
+                text {
+                    margin-top: 5px;
+                    display: block;
+                }
+            }
+        }
+        .bottom {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            align-content: center;
+            margin-top: 25px;
+            .but {
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                box-sizing: border-box;
+                border-radius: 8px 8px 8px 8px;
+                font-family: Source Han Sans SC, Source Han Sans SC;
+                font-weight: 400;
+                font-size: 16px;
+                width: 173px;
+                height: 50px;
+                line-height: 50px;
+                text-align: center;
+                &:nth-child(1) {
+                    background: #FFFFFF;
+                    border: 1px solid #CCCCCC;
+                    color: #666666;
+                }
+                &:nth-child(2) {
+                    background: #C30D23;
+                    color: #FFFFFF;
+                }
+                view {
+                    margin-right: 10px;
+                }
+            }
         }
     }
 }
+
+.share-box {
+    padding: 30px 0;
+    display: flex;
+    align-items: center;
+    align-content: center;
+    justify-content: space-evenly;
+    .item {
+        display: flex;
+        flex-direction: column;
+        align-items:center;
+        align-content:center;
+        image {
+            width:50px;
+            height:50px;
+        }
+        text {
+            margin-top: 5px;
+            font-family: Source Han Sans SC, Source Han Sans SC;
+            font-weight: 400;
+            font-size: 12px;
+            color: #333333;
+        }
+    }
+}
+
 </style>

pages/index/cloud/userInfo.vue

@@ -12,9 +12,9 @@
           </view>
       </view>
       <view class="userinfo-right">
-          <navigator url="/cloud/businessCard/index" class="info-card">
+          <navigator :url="isCode?'/cloud/businessCard/index':'/team/userCenter/personal'" class="info-card">
               <image class="image" src="/static/workbench/个人名片.svg" mode="widthFix"></image>
-              <text class="title">个人名片</text>
+              <text class="title">{{isCode?'个人名片':'个人信息'}}</text>
           </navigator>
           <view class="info-card">
               <image class="image" src="/static/workbench/咨询消息.svg" mode="widthFix"></image>

pages/index/cloud/workbench.vue

@@ -158,6 +158,10 @@ export default {
     methods: {
         init(callBack) {
             callBack()
+            this.list = this.dye(this.list, this.colors, 1)
+            this.getUserInfo()
+            this.handleAppRole()
+            console.log(this.list,'应用');
             this.updatePage = false;
         },
         async getUserInfo () {
@@ -184,7 +188,6 @@ export default {
             let keys2 = Object.keys(this.roles.工作台)
             for (let index = 0; index < this.list2.length; index++) {
                 for (let index2 = 0; index2 < keys2.length; index2++) {
-                    console.log(this.roles.工作台[keys2[index2]]);
                     if (this.roles.工作台[keys2[index2]] && this.roles.工作台[keys2[index2]].name == this.list2[index].name) {
                         this.list2[index] = Object.assign({},this.list2[index],this.roles.工作台[keys2[index2]])
                         break;
@@ -203,13 +206,6 @@ export default {
             })
         }
     },
-    created () {
-        this.list = this.dye(this.list, this.colors, 1)
-        this.getUserInfo()
-        this.handleAppRole()
-        console.log(this.list,'应用');
-
-    }
 }
 </script>
 

static/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4131149 */
-  src: url('//at.alicdn.com/t/c/font_4131149_s05pnd9g0jk.woff2?t=1715145392579') format('woff2'),
-       url('//at.alicdn.com/t/c/font_4131149_s05pnd9g0jk.woff?t=1715145392579') format('woff'),
-       url('//at.alicdn.com/t/c/font_4131149_s05pnd9g0jk.ttf?t=1715145392579') format('truetype');
+  src: url('//at.alicdn.com/t/c/font_4131149_1qo1tetcxlm.woff2?t=1715843300557') format('woff2'),
+       url('//at.alicdn.com/t/c/font_4131149_1qo1tetcxlm.woff?t=1715843300557') format('woff'),
+       url('//at.alicdn.com/t/c/font_4131149_1qo1tetcxlm.ttf?t=1715843300557') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,54 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-mingpianhaibao:before {
+  content: "\e6dc";
+}
+
+.icon-weixinhaoyou:before {
+  content: "\e6dd";
+}
+
+.icon-zhuanfa:before {
+  content: "\e6d9";
+}
+
+.icon-fuzhi:before {
+  content: "\e6da";
+}
+
+.icon-erweima:before {
+  content: "\e6db";
+}
+
+.icon-riqi:before {
+  content: "\e6d8";
+}
+
+.icon-mendian1:before {
+  content: "\e6d5";
+}
+
+.icon-dizhi_xian:before {
+  content: "\e6d6";
+}
+
+.icon-youxiang:before {
+  content: "\e6d7";
+}
+
+.icon-weidianzan:before {
+  content: "\e6cb";
+}
+
+.icon-baocunbendi:before {
+  content: "\e6d0";
+}
+
+.icon-weixin:before {
+  content: "\e6d1";
+}
+
 .icon-a-biaoqianlanshouyexuanzhong:before {
   content: "\e606";
 }
@@ -53,10 +101,6 @@
   content: "\e6ca";
 }
 
-.icon-weidianzan:before {
-  content: "\e6cb";
-}
-
 .icon-yidianzan:before {
   content: "\e6cc";
 }

static/workbench/二维码.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32" viewBox="0 0 32 32"><defs><style>.a,.c{fill:#333;}.a{stroke:#707070;}.b{clip-path:url(#a);}</style><clipPath id="a"><rect class="a" width="32" height="32" transform="translate(313 138)"/></clipPath></defs><g class="b" transform="translate(-313 -138)"><path class="c" d="M12.049,14.332H2.284A2.286,2.286,0,0,1,0,12.049V2.283A2.286,2.286,0,0,1,2.284,0h9.766a2.286,2.286,0,0,1,2.283,2.283v9.765a2.286,2.286,0,0,1-2.283,2.284ZM2.284,1.522a.762.762,0,0,0-.761.759v9.767a.762.762,0,0,0,.761.761h9.766a.762.762,0,0,0,.761-.761V2.283a.762.762,0,0,0-.761-.759ZM4.933,4.933m.038,0H9.362a.034.034,0,0,1,.038.038V9.362a.034.034,0,0,1-.038.038H4.971a.034.034,0,0,1-.038-.038V4.971A.034.034,0,0,1,4.971,4.933Zm7.079,25.893H2.284A2.286,2.286,0,0,1,0,28.543V18.777a2.286,2.286,0,0,1,2.284-2.284h9.766a2.286,2.286,0,0,1,2.283,2.284v9.766a2.286,2.286,0,0,1-2.283,2.283ZM2.284,18.016a.762.762,0,0,0-.761.761v9.766a.762.762,0,0,0,.761.759h9.766a.762.762,0,0,0,.761-.759V18.777a.762.762,0,0,0-.761-.761Zm2.649,3.411.038,0H9.362a.034.034,0,0,1,.038.038v4.391a.034.034,0,0,1-.038.038H4.971a.034.034,0,0,1-.038-.038V21.465A.034.034,0,0,1,4.971,21.427Zm24.745-7.094H19.951a2.286,2.286,0,0,1-2.284-2.284V2.283A2.286,2.286,0,0,1,19.951,0h9.766A2.286,2.286,0,0,1,32,2.283v9.765a2.286,2.286,0,0,1-2.284,2.284ZM19.951,1.522a.762.762,0,0,0-.761.759v9.767a.762.762,0,0,0,.761.761h9.766a.762.762,0,0,0,.761-.761V2.283a.762.762,0,0,0-.761-.759ZM22.6,4.933m.038,0h4.391a.034.034,0,0,1,.038.038V9.362a.034.034,0,0,1-.038.038H22.638a.034.034,0,0,1-.038-.038V4.971a.034.034,0,0,1,.038-.038ZM18.847,17.171h1.522v2.275H18.847Zm0,5.394h1.522V30.15H18.847Zm10.45,0H30.82V30.15H29.3Zm0-5.394H30.82v2.444H29.3Zm-5.225,0h1.522v4.972H24.072Zm0,6.827h1.522V30.15H24.072Z" transform="translate(313 138.587)"/></g></svg>

static/workbench/减去.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="375.001" height="26.998" viewBox="0 0 375.001 26.998"><defs><style>.a{fill:#fff;}</style></defs><path class="a" d="M-7190-8359h-375v-27c.226.058,24,6.074,58.845,12,20.495,3.485,40.759,6.261,60.231,8.25A683.292,683.292,0,0,0-7377-8362a678.706,678.706,0,0,0,68.77-3.75c19.388-1.989,39.537-4.765,59.886-8.25,34.222-5.861,57.375-11.752,58.343-12v27Z" transform="translate(7565.001 8385.999)"/></svg>

static/workbench/名片背景.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="375" height="184" viewBox="0 0 375 184"><defs><style>.a{fill:url(#a);}</style><linearGradient id="a" x1="1" y1="0.48" x2="0" y2="0.474" gradientUnits="objectBoundingBox"><stop offset="0" stop-color="#f43a50"/><stop offset="1" stop-color="#c30d23"/></linearGradient></defs><path class="a" d="M0,0H375V160s-93.25,24-187,24S0,160,0,160Z"/></svg>

static/workbench/微信好友.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="50" height="50" viewBox="0 0 50 50"><defs><style>.a{fill:#fff;stroke:#707070;}.b{clip-path:url(#a);}.c{fill:#28c445;}</style><clipPath id="a"><rect class="a" width="50" height="50" transform="translate(44 205)"/></clipPath></defs><g class="b" transform="translate(-44 -205)"><g transform="translate(44 205)"><path class="c" d="M14.748,14.73a1.623,1.623,0,0,0-1.739,1.449,1.623,1.623,0,0,0,1.739,1.449A1.369,1.369,0,0,0,16.2,16.18,1.351,1.351,0,0,0,14.748,14.73Zm11.775,8.406A1.242,1.242,0,0,0,25.4,24.3a1.214,1.214,0,0,0,1.123,1.159A1.326,1.326,0,0,0,27.972,24.3a1.326,1.326,0,0,0-1.449-1.159Zm-3.732-5.507a1.389,1.389,0,0,0,1.449-1.449,1.369,1.369,0,0,0-1.449-1.449,1.623,1.623,0,0,0-1.739,1.449,1.623,1.623,0,0,0,1.739,1.449Zm10.036,5.507A1.242,1.242,0,0,0,31.7,24.3a1.214,1.214,0,0,0,1.123,1.159A1.326,1.326,0,0,0,34.277,24.3a1.326,1.326,0,0,0-1.449-1.159Z" transform="translate(1.774 1.864)"/><path class="c" d="M25,.128a25,25,0,1,0,25,25,25,25,0,0,0-25-25ZM20.254,31.541a16.326,16.326,0,0,1-3.986-.616l-3.986,2.029,1.123-3.514c-2.862-2.029-4.6-4.674-4.6-7.826,0-5.543,5.181-9.891,11.449-9.891,5.616,0,10.58,3.478,11.558,8.152-.362-.036-.725-.072-1.087-.072-5.435.072-9.71,4.167-9.71,9.239a9.154,9.154,0,0,0,.362,2.428c-.362.036-.761.072-1.123.072ZM37.21,35.6l.87,2.9-3.116-1.739a13.97,13.97,0,0,1-3.442.58c-5.471,0-9.783-3.768-9.783-8.442-.036-4.638,4.275-8.406,9.71-8.406,5.181,0,9.746,3.8,9.746,8.442,0,2.609-1.7,4.928-3.986,6.667Z" transform="translate(0 -0.128)"/></g></g></svg>