和并提交

落日与鲸

2025-02-22 92ba709d9bdb8b148efea663f00d630a711bb408

和并提交

 H5/pages/components/certificate/certificate.vue

New file
@@ -0,0 +1,127 @@
<template>
    <view>
        <u-popup :show="show" mode="center" @open="open">
            <view class="popup_main">
                <view class="popup_content flex flex-column a-center">
                    <text class="fs-35 font-bold color3 mt-46">党员证件</text>
                    <view class="bg font-w500 fs-23 mt-38 flex  flex-column a-center">
                        <image src="/static/home/img9.png" class="w-133 h-156 mt-40" mode=""></image>
                        <view class="flex mt-8">
                            <view class="flex flex-column mr-40 lh-48">
                                <text>姓名：</text>
                                <text>身份证号码：</text>
                                <text>所在党组织：</text>
                            </view>
                            <view class="flex flex-column a-end lh-48">
                                <text>李雷</text>
                                <text>500000000000000000</text>
                                <text>成都市锦江区XXXXX部门</text>

                            </view>
                        </view>

                    </view>
                    <view class="flex a-center mt-31">
                        <view class="btn_left" @click="onclose">
                            关闭
                        </view>
                        <view class="btn_right">
                            编辑
                        </view>
                    </view>

                </view>
            </view>
        </u-popup>
    </view>
</template>

<script>
    export default {
        props: {
            show: Boolean
        },
        data() {
            return {

            };
        },
        methods: {
            open() {

            },
		
            onclose() {
                this.show =false
            },
        },
        created() {
        },
    }
</script>

<style lang="scss">
    .color3 {
        color: #fff;
    }

    /deep/ .u-popup__content {
        width: 635rpx;
        height: 654rpx;
        border-radius: 40rpx;
    }

    .popup_main {
        width: 635rpx;
        height: 654rpx;
        border-radius: 40rpx;
        background-image: url('@/static/home/bg1.png');
        /* 背景图片铺满容器 */
        background-size: cover;
        /* 背景图片不重复 */
        background-repeat: no-repeat;
        /* 背景图片居中显示 */
        background-position: center;
        /* 设置容器的宽度和高度 */
    }

    .bg {

        width: 577rpx;
        height: 371rpx;
        background-image: url('@/static/home/bg2.png');
        /* 背景图片铺满容器 */
        background-size: cover;
        /* 背景图片不重复 */
        background-repeat: no-repeat;
        /* 背景图片居中显示 */
        background-position: center;
    }

    .btn_left {
        width: 212rpx;
        height: 77rpx;
        border-radius: 48rpx;
        border: 2rpx solid rgba(0, 0, 0, 0.8);
        font-size: 27rpx;
        color: rgba(0, 0, 0, 0.8);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .btn_right {
        width: 212rpx;
        height: 77rpx;
        background: linear-gradient(270deg, #FC8D55 0%, #FF4948 100%);
        border: 2rpx solid #fff;
        border-radius: 48rpx;
        font-weight: 600;
        font-size: 27rpx;
        color: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 33rpx;
    }
</style>