首页和我的

346149741

2024-06-21 98e3ca474412e2888701651297c168bf3b096809

首页和我的

 pages.json

@@ -162,6 +162,28 @@
                    }
                }
            ]
        },
        {
            "root": "qiye",
            "pages": [{
                "path" : "qiyeIndex/qiyeIndex",
                "style" : 
                {
                    "navigationBarTitleText" : "",
                    "navigationStyle": "custom"
                }
            },
            {
                "path" : "my/my",
                "style" : 
                {
                    "navigationBarTitleText" : "",
                    "navigationStyle": "custom"
					
                }
            }
				
            ]
        }
    ],
    "globalStyle": {

 qiye/components/bottom.vue

New file
@@ -0,0 +1,78 @@
<template>
    <view class="fixed-down">
        <view  @click="activeClick(0)" :class="{ active: active == 0}">
            <image src="/static/qiye/q03.png" mode="heightFix" v-if="active != 0"></image>
            <image src="/static/qiye/q04.png" mode="heightFix" v-if="active == 0"></image>
            <view>首页</view>
        </view>
        <view @click="activeClick(1)" :class="{ active: active == 1}">
            <image src="/static/qiye/q01.png" mode="heightFix" v-if="active != 1"></image>
            <image src="/static/qiye/q02.png" mode="heightFix" v-if="active == 1"></image>
            <view>执法记录</view>
        </view>
        <view @click="activeClick(2)" :class="{ active: active == 2}">
            <image src="/static/policy/user.png" mode="heightFix" v-if="active != 2"></image>
            <image src="/static/policy/user-select.png" mode="heightFix" v-if="active == 2"></image>
            <view>我的</view>
        </view>
    </view>
</template>

<script>
    export default {
        props:{
            activeNumber:{
                 type: [String, Number]
            }
        },
        data() {
            return {
                active: this.activeNumber
            }
        },
        methods: {
			
            activeClick(number) {
                this.active = number
                this.$emit('update:activeNumber', number)
            }
        }
    }
</script>

<style scoped lang="scss">
    .fixed-down{
        position: fixed;
        bottom: 0;
        width: 100%;
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 10rpx 0;
        background-color: white;
        font-size: 20rpx;
        color: #7E8596FF;
        &>view{
            text-align: center;
        }
        .active{
            color: #1171E0FF;
        }
        image{
            height: 58rpx;
            width: 58rpx;
        }
        .code{
            width: 108rpx;
            height: 108rpx;
            position: absolute;
            top: -20rpx;
            left: 0;
        }
        .relative{
            position: relative;
            width: 108rpx;
            height: 108rpx;
        }
    }
</style>

 qiye/my/my.vue

New file
@@ -0,0 +1,231 @@
<template>
    <view class="page-mine-box">
        <img src="/static/qiye/q07.png" class="head" alt="" />
		
        <view class="top-box">

            <view class="user-news">

                <!-- <u-avatar :src="src"></u-avatar> -->

                <image src="/static/policy/header.png" mode="widthFix"></image>

                <view class="user-info">

                    <view class="user-name">

                        <view class="inckname">刘小雅</view>

                    </view>

                    <view class="dept-name">

                        环保局--第一部门

                    </view>

                </view>

            </view>
            <view class="show-phone-number">
                <text class="label">联系电话</text>
                <text>168****4164</text>
            </view>
            <view class="wbox">
                <view class="item">
                    <view class="set-flex">
                        <image src="/static/qiye/q06.png" mode="widthFix"></image>
                        <text class="change">投诉记录</text>
                    </view>
                    <u-icon name="arrow-right"></u-icon>
                </view>
                <view class="item">
                    <view class="set-flex">
                        <image src="/static/policy/phone.png" mode="widthFix"></image>
                        <text class="change">修改手机号</text>
                    </view>
                    <u-icon name="arrow-right"></u-icon>
                </view>
            </view>
            <!-- <view class="show-phone-number">
                <view class="set-flex">
                    <image src="/static/qiye/q06.png" mode="widthFix"></image>
                    <text class="change">投诉记录</text>
                </view>
                <u-icon name="arrow-right"></u-icon>
            </view>
            <view class="show-phone-number" @click="goChangePhone">
				
            </view> -->

        </view>

<!--         <view class="main-box">

			
		
        </view> -->

        <view class="logout">

            退出登录

        </view>
        <tabsCom :activeNumber.sync="activeNumber"></tabsCom>
		
    </view>

</template>



<script>
    import tabsCom from '@/qiye/components/bottom.vue'
	
    export default {
        components: {
            tabsCom
        },

        data() {

            return {
                activeNumber: 2,
				
                src: '/static/policy/header.png'

            }

        },

        methods: {

            goChangePhone() {

                uni.navigateTo({

                    url: '/policy/changePhone/changePhone'

                })

            }

        }

    }

</script>

<style>
    page{
        background: #f4f4f4;
    }
</style>

<style lang="scss" scoped>

    .page-mine-box {
        .top-box {
            margin-top: 200rpx;

            box-sizing: border-box;

            .user-news {

                margin: 48rpx;

                display: flex;

                justify-content: flex-start;

                align-items: center;



                image {

                    width: 108rpx;

                    height: 108rpx;

                    background-color: white;

                    border-radius: 50%;

                }



                .user-info {

                    margin-left: 24rpx;

                    color: white;



                    .user-name {

                        display: flex;

                        justify-content: flex-start;

                        align-items: center;

                        margin-bottom: 24rpx;



                        .direc {

                            width: 2rpx;

                            height: 20rpx;

                            background-color: white;

                            vertical-align: middle;

                            margin: 0 16rpx;

                        }

                    }



                    .dept-name {

                        font-size: 28rpx;

                        color: #FFFFFFB3;

                    }



                    .dept-per {

                        font-size: 24rpx;

                    }

                }

            }

        }



        .main-box {

            // position: relative;

            // top: -45rpx;

        }

        .wbox{
            background-color: white;
            margin: 0 40rpx;
            border-radius: 10rpx;
            padding: 28rpx 24rpx;
            font-size: 32rpx;
            color: #202D44FF;
            .label {
                color: #7E8596FF;
            }
			
            .change {
                margin-left: 20rpx;
                color: #202D44FF;
            }
			
            .item{
                display: flex;
                justify-content: space-between;
                align-items: center;
                border-bottom: 1px solid #f1f1f1;
                padding-bottom: 20rpx;
                margin-bottom: 20rpx;
                image {
                    width: 44rpx;
                    height: 44rpx;
                }
            }
            .item:last-child{
                border-bottom: none;
                padding-bottom: 0;
                margin-bottom: 0;
            }
        }

        .show-phone-number {

            background-color: white;

            display: flex;

            justify-content: space-between;

            align-items: center;

            margin: 0 40rpx;

            border-radius: 10rpx;

            padding: 28rpx 24rpx;

            font-size: 32rpx;

            color: #202D44FF;

            font-weight: normal;

            margin-bottom: 20rpx;



            .label {

                color: #7E8596FF;

            }



            .change {

                margin-left: 20rpx;

                color: #202D44FF;

            }



            image {

                width: 44rpx;

                height: 44rpx;

            }

        }



        .logout {

            text-align: center;

            padding: 20rpx 0;

            justify-content: center;

            align-items: center;

            border-radius: 38rpx;

            background: #FFF;

            font-size: 32rpx;

            color: #4a4e60ff;

            width: calc(100% - 64rpx);

            left: 32rpx;

            position: fixed;

            bottom: 180rpx;

        }



        .inckname {

            font-size: 36rpx;

        }

    }
    .head{
        width: 100%;
        height: 518rpx;
        z-index: -1;
        position: absolute;
        left: 0;
        top: 0;
    }

</style>

 qiye/qiyeIndex/qiyeIndex.vue

New file
@@ -0,0 +1,136 @@
<template>
    <view>
        <img src="/static/head.png" class="head" alt="" />
        <view class="hqzc">
            <img src="/static/hqzc.png" class="img" alt="" />
            <view class="line"></view>
            <view class="font">
                <p>海关总署贸易持续发展2024年立法...</p>
                <p>国家医疗保障局办公室关于发布管理... </p>
            </view>
            <img src="/static/i06.png" class="more" alt="" />
        </view>
        <view class="wbox">
            <view class="name">
                瑞韵达贸易有限公司
            </view>
            <view class="imgbox">
                <image :src="uqrcodeImage" mode="widthFix" class="qrcode-1"></image>
            </view>
        <!--     <view class="">
				
            </view> -->
            <img src="/static/qiye/q05.png" style="width: 100%;height: 201rpx;" alt="" />
			
        </view>
        <view style="height: 50rpx;"></view>
        <uqrcode class="hide-canvas" :size="470" sizeUnit="rpx" v-if="companyCode" ref="uqrcode" canvas-id="qrcode" :value="companyCode" :options="{ backgroundColor: '#000000',useDynamicSize: true,  areaColor: '#ffffff', foregroundColor: '#ffffff' }"></uqrcode>
        <tabsCom :activeNumber.sync="activeNumber"></tabsCom>
		
    </view>
</template>

<script>
    import tabsCom from '@/qiye/components/bottom.vue'
	
    export default {
        components: {
            tabsCom
        },
        data() {
            return {
                activeNumber: 0,
                companyCode: 'code===',
                uqrcodeImage: ''
            }
        },
        onReady() {
            this.$refs.uqrcode.toTempFilePath({
              success: res => {
                this.uqrcodeImage = res.tempFilePath
              }
            });
        },
        methods: {
			
        }
    }
</script>

<style>
    page{
        background: #F7F7F7;
    }
</style>
<style lang="scss" scoped>
    .head{
        width: 100%;
        height: 518rpx;
    }
    .hqzc{
        position: absolute;
        border-radius: 5px;
        background: #fff;
        display: flex;
        width: calc(100vw - 64rpx);
        align-items: center;
        left: 32rpx;
        top: 500rpx;
        padding: 24rpx;
        box-sizing: border-box;
        .line{
            width: 2rpx;
            height: 50rpx;
            background: #f1f1f1;
            margin-right: 18rpx;
        }
        .img{
            width: 76rpx;
            height: 76rpx;
            margin-right: 18rpx;
        }
        .more{
            width: 28rpx;
            height: 28rpx;
        }
        .font{
            font-size: 26rpx;
            color: #4A4E60;
            margin-right: 50rpx;
			
        }
    }
    .hide-canvas{
        display: none;
    }
    .wbox{
        background: #fff;
        border-radius: 5px;
        padding: 24rpx;
        box-sizing: border-box;
        margin: 120rpx 32rpx;
        .name{
            text-align: center;
            color: #202d44;
            font-size: 36rpx;
            font-weight: bold;
            line-height: 44rpx;
            border-bottom: 1px dashed #f1f1f1;
            padding-bottom: 20rpx;
            margin-bottom: 20rpx;
        }
        .imgbox{
            text-align: center;
            border-radius: 5rpx;
            border: 4rpx solid #CCDEFE;
            padding: 20rpx;
            width: 420rpx;
            margin: 0 auto;
			
        }
        .qrcode-1{
            width: 400rpx;
            height: 400rpx;
        }
    }
</style>

 static/i07.jpg

Binary files differ

 static/qiye/q01.png

 static/qiye/q02.png

 static/qiye/q03.png

 static/qiye/q04.png

 static/qiye/q05.png

 static/qiye/q06.png

 static/qiye/q07.png