uniapp 企业群聊组件 改下图片和fsdfds2 就可以使用了

<template>
    <view class="success-popup-container" >
        <u-popup bgColor="transparent" ref="popup" :round="20" :show="showCuspopqiye" mode="center" @close="handleCloseCupopqiye">
            <view class="popup-cu" :style="bgImg" style="background-size: 100%;background-repeat: no-repeat;width: 301px;height: 330px;">
                <text class="p-char"></text>
                <view class="list" style="overflow: scroll;position: absolute;top: 159px;width: 200px;height: 109px;background-color: #FFFFFF;">
                    <view class="btn-wrap" >
                        <cell :iconUrl="urling"  contactText="加入企业群聊1" bind:startmessage='startmessage'  bind:completemessage="completemessage" :url='fsdfds2'  />
                    </view>
                    <view class="btn-wrap" >
                        <cell :iconUrl="urling" contactText="加入企业群聊2" bind:startmessage='startmessage'  bind:completemessage="completemessage" :url='fsdfds2'  />
                    </view>
                    
                </view>
            </view>
            <image  @click="handleCloseCupopqiye" :src="closeImg" class="closeImg" mode=""></image>
        </u-popup>
    </view>
</template>

<script>
    import { imgUrl } from "@/http/baseApi.js"
    export default {
        name: "FialPopup",
        data() {
            return {
                fsdfds2:'https://work.weixin.qq.com/gm/da57887913cf620da515f616af8244554fc18',
                showCuspopqiye: false,
                bgImg: 'background-image: url("' + imgUrl +
                '/uploads/20230625/bf46cc3db1e473585e7113686eec72e0.png");',
                urling:imgUrl+'/uploads/20230625/2f969513e1a74c5d46f87237e8b23b24.png',
                closeImg:imgUrl+'/uploads/20230625/a4dcc2013ed2914f8986f22b76ce08d8.png'
            }
        },
        methods: {
            handleOpenCupopqiye() {//企业群聊
                this.showCuspopqiye = true
            },
            handleCloseCupopqiye() {//企业群聊关闭
                this.showCuspopqiye = false
            },
        }
    }
</script>

<style lang="scss">
    .popup-cu {
        width: 450rpx;
        padding: 50rpx 0 30rpx 0;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        // border-radius: 20rpx;
        .p-char {
            margin-bottom: 40rpx;
        }

        .btn-wrap {
            margin-top: 10px;
            width: 100%;
            display: flex;
            justify-content: space-around;
            align-items: center;
            .btn {
                width: 120rpx;
                background-color: #0B60FF;
                color: #fff;
                border: 0px;
                &.grey {
                    background-color: #fff;
                    color: #0B60FF;
                    border: 1rpx solid #0b60ff;
                    border-radius: 16rpx;
                }
            }
        }
    }
            .closeImg {
                position: absolute;
                top: 37rpx;
                right: 37rpx;
                border-radius: 50%;
                width: 54rpx;
                height: 54rpx;
            }
</style>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值