会议室

liukangdong

2024-05-11 1fca80283023ea57b04ee48f40d13b7c61e54ca6

会议室

 h5/components/Li-Calendar/Li-Calendar.css

@@ -29,7 +29,7 @@
    font-size: 28rpx;

    font-family: PingFangSC-Regular, PingFang SC;

    font-weight: 400;

    color: #0055FF;

    color: #279baa;

}

.calendar-TimeH{

}

@@ -111,8 +111,8 @@
}

.calendar-today {

    /* border-radius: 6upx;

    background-color: #0055FF; */

    color: #0055FF;

    background-color: #279baa; */

    color: #279baa;

    /* -moz-box-shadow: 0px 2upx 10upx #ABABAB;

    -webkit-box-shadow: 0px 2upx 10upx #ABABAB;

    box-shadow: 0px 2upx 10upx #ABABAB; */

@@ -139,7 +139,7 @@


.calendar-active {

    color:#FFFFFF !important;

    background-color: #0055FF;

    background-color: #279baa;

    /* -moz-box-shadow: 0px 2upx 10upx #ABABAB;

    -webkit-box-shadow: 0px 2upx 10upx #ABABAB;

    box-shadow: 0px 2upx 10upx #ABABAB; */


 h5/pages.json

@@ -305,6 +305,15 @@
            }
            

        }

        ,{

            "path" : "pages/staff/meetingManager",

            "style" :                                                                                    
            {
                "navigationBarTitleText": "会议室管理",
                "enablePullDownRefresh": false
            }
            
        }

    ],

    "subPackages": [{

            "root": "n_pages",


 h5/pages/staff/index.vue

@@ -60,7 +60,7 @@
                <view class="h1">派车记录</view>
                <view class="h2">VEHICLE DISPATCH</view>
            </view>
            <view class="img_wrap" @click="jump('/pages/staff/task/index')">
            <view class="img_wrap" @click="jump('/pages/staff/meetingManager')">
                <image class="img" src="@/static/staff/ic_huiyishiguanli.png"></image>
                <view class="h1">会议室管理</view>
                <view class="h2">MANAGE MEETING ROOMS</view>

 h5/pages/staff/meetingCalendar.vue

@@ -1,281 +1,342 @@
<template>
    <view class="main_app">
        <view class="tabs">
            <view class="tab" :class="{ active: activeTab === '0' }" @click="tabClick('0')">
                <text class="name">会议日历</text>
                <view class="line"></view>
            </view>
            <view class="tab" :class="{ active: activeTab === '1' }" @click="tabClick('1')">
                <text class="name">预约记录</text>
                <view class="line"></view>
            </view>
        </view>
        <!--  -->
        <template v-if="activeTab == '0'">
            <uni-calendar @change="changeCalendar" :selected="selected" />
            <!--  -->
            <view class="card_list">
                <view class="card_title">
                    <view class="name">
                        <view class="icon"></view>
                        <view class="text">今日会议</view>
                    </view>
                    <view class="meeting">
                        <view class="text mr24">全部会议室</view>
                        <u-icon name="arrow-down" size="12" color="#999999" />
                    </view>
                </view>
                <view class="list">
                    <view class="item">
                        <view class="head">
                            <view class="name">aaaaa选型</view>
                            <view class="status">即将开始</view>
                        </view>
                        <view class="line">
                            <view class="label">会议时间：</view>
                            <view class="value">12:00-12</view>
                        </view>
                        <view class="line">
                            <view class="label">会议室：</view>
                            <view class="value">202会议室</view>
                        </view>
                        <view class="line">
                            <view class="label">预约人：</view>
                            <view class="value">杨某某</view>
                        </view>
                        <view class="line">
                            <view class="label">备注：</view>
                            <view class="value">--</view>
                        </view>
                    </view>
                </view>
            </view>
        </template>
        <!--  -->
        <template v-if="activeTab === '1'">
            <view class="card_list">
                <view class="list">
                    <view class="item" @click="handleDetail()">
                        <view class="head">
                            <view class="name">aaaaa选型</view>
                            <view class="status">即将开始</view>
                        </view>
                        <view class="line">
                            <view class="label">会议时间：</view>
                            <view class="value">12:00-12</view>
                        </view>
                        <view class="line">
                            <view class="label">会议室：</view>
                            <view class="value">202会议室</view>
                        </view>
                        <view class="line">
                            <view class="label">预约人：</view>
                            <view class="value">杨某某</view>
                        </view>
                        <view class="line">
                            <view class="label">备注：</view>
                            <view class="value">--</view>
                        </view>
                    </view>
                </view>
            </view>
        </template>
    </view>
</template>

<script>
function getDate(date, AddDayCount = 0) {
    if (!date) {
        date = new Date();
    }
    if (typeof date !== 'object') {
        date = date.replace(/-/g, '/');
    }
    const dd = new Date(date);

    dd.setDate(dd.getDate() + AddDayCount); // èŽ·å–AddDayCount天后的日期

    const y = dd.getFullYear();
    const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1; // èŽ·å–当前月份的日期，不足10è¡¥0
    const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate(); // èŽ·å–当前几号，不足10è¡¥0
    return {
        fullDate: y + '-' + m + '-' + d,
        year: y,
        month: m,
        date: d,
        day: dd.getDay()
    };
}
export default {
    data() {
        return {
            activeTab: '0',
            selected: [
                {
                    date: getDate(new Date(), -3).fullDate
                    // info: '打卡'
                },
                {
                    date: getDate(new Date(), -2).fullDate,
                    // info: '签到',
                    data: {
                        custom: '自定义信息',
                        name: '自定义消息头'
                    }
                },
                {
                    date: getDate(new Date(), -1).fullDate,
                    info: '已打卡'
                }
            ]
        };
    },
    methods: {
        tabClick(val) {
            this.activeTab = val;
        },
        handleDetail(item) {
            uni.navigateTo({
                // url: `/pages/staff/meetingDetail?id=${item.id}`,
                url: `/pages/staff/meetingDetail`,
            })
        },
        changeCalendar(e) {
            console.log(e);
        }
    }
};
</script>

<style lang="scss">
page {
    background-color: #f7f7f7;
}
.main_app {
    padding: 0;
    background-color: #f7f7f7;
    ::v-deep .uni-calendar-item--checked {
        background-color: #279baa;
        border-radius: 8rpx;
    }
    ::v-deep .uni-calendar-item--isDay-text {
        color: #279baa;
    }
    ::v-deep .uni-calendar-item--isDay {
        background-color: #279baa;
        color: #fff;
        border-radius: 8rpx;
    }
    .tabs {
        display: flex;
        background-color: #fff;
        .tab {
            flex: 1;
            height: 88rpx;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 28rpx;
            color: #666666;
            position: relative;
            .line {
                width: 60rpx;
                height: 4rpx;
                background: #fff;
                border-radius: 3rpx;
                position: absolute;
                bottom: 0;
                left: 50%;
                transform: translate(-50%, 0);
            }
        }
        .active {
            font-weight: 500;
            font-size: 30rpx;
            color: #222222;
            .line {
                background-color: #279baa;
            }
        }
    }
    //
    .card_list {
        padding: 30rpx;
        .card_title {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 22rpx;
            .name {
                display: flex;
                align-items: center;
                .icon {
                    width: 6rpx;
                    height: 32rpx;
                    background: #279baa;
                    border-radius: 4rpx;
                    margin-right: 16rpx;
                }
                .text {
                    font-weight: 600;
                    font-size: 32rpx;
                    color: #222222;
                }
            }
            .meeting {
                display: flex;
                height: 52rpx;
                line-height: 52rpx;
                background: #ffffff;
                border-radius: 26rpx;
                border: 2rpx solid #eeeeee;
                padding: 0 24rpx;
                .text {
                    font-size: 24rpx;
                    color: #333333;
                }
            }
        }
        .list {
            .item {
                padding: 0rpx 30rpx 30rpx;
                background: #ffffff;
                border-radius: 8rpx;
                .head {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    border-bottom: 1rpx solid #e5e5e5;
                    padding: 22rpx 0;
                    margin-bottom: 22rpx;
                    .name {
                        font-weight: 600;
                        font-size: 32rpx;
                        color: #222222;
                    }
                    .status {
                        height: 38rpx;
                        line-height: 38rpx;
                        padding: 0 16rpx;
                        border-radius: 4rpx;
                        border: 1rpx solid #999999;
                        font-size: 22rpx;
                        color: #999999;
                    }
                }
                .line {
                    display: flex;
                    margin-bottom: 12rpx;
                    .label {
                        width: 140rpx;
                        color: #666666;
                    }
                    .value {
                        flex: 1;
                    }
                }
            }
        }
    }
}
<template>

    <view class="main_app">

        <view class="tabs">

            <view class="tab" :class="{ active: activeTab === '0' }" @click="tabClick('0')">

                <text class="name">会议日历</text>

                <view class="line"></view>

            </view>

            <view class="tab" :class="{ active: activeTab === '1' }" @click="tabClick('1')">

                <text class="name">预约记录</text>

                <view class="line"></view>

            </view>

        </view>

        <!--  -->

        <template v-if="activeTab == '0'">

            <!-- <uni-calendar @change="changeCalendar" :selected="selected" /> -->

            <!-- æ—¥åŽ† -->

            <view class="container_b">

                <Calendar

                    ref="Calendar"

                    :currentTime="currentTime1"

                    :mark="mark"

                    :showLunar="false"

                    @dayChange="dayChange"

                    @monthChange="monthChange"

                    :rangeMode="false"

                    :maskColor="'#ffffff'"

                    :dateStart="dateStart"

                    :dateEnd="dateEnd"

                    :canDrag="false"

                ></Calendar>

            </view>

            <!--  -->

            <view class="card_list">

                <view class="card_title">

                    <view class="name">

                        <view class="icon"></view>

                        <view class="text">今日会议</view>

                    </view>

                    <view class="meeting">

                        <view class="text mr24">全部会议室</view>

                        <u-icon name="arrow-down" size="12" color="#999999" />

                    </view>

                </view>

                <view class="list">

                    <view class="item">

                        <view class="head">

                            <view class="name">aaaaa选型</view>

                            <view class="status">即将开始</view>

                        </view>

                        <view class="line">

                            <view class="label">会议时间：</view>

                            <view class="value">12:00-12</view>

                        </view>

                        <view class="line">

                            <view class="label">会议室：</view>

                            <view class="value">202会议室</view>

                        </view>

                        <view class="line">

                            <view class="label">预约人：</view>

                            <view class="value">杨某某</view>

                        </view>

                        <view class="line">

                            <view class="label">备注：</view>

                            <view class="value">--</view>

                        </view>

                    </view>

                </view>

            </view>

        </template>

        <!--  -->

        <template v-if="activeTab === '1'">

            <view class="card_list">

                <view class="list">

                    <view class="item" @click="handleDetail()">

                        <view class="head">

                            <view class="name">aaaaa选型</view>

                            <view class="status">即将开始</view>

                        </view>

                        <view class="line">

                            <view class="label">会议时间：</view>

                            <view class="value">12:00-12</view>

                        </view>

                        <view class="line">

                            <view class="label">会议室：</view>

                            <view class="value">202会议室</view>

                        </view>

                        <view class="line">

                            <view class="label">预约人：</view>

                            <view class="value">杨某某</view>

                        </view>

                        <view class="line">

                            <view class="label">备注：</view>

                            <view class="value">--</view>

                        </view>

                    </view>

                </view>

            </view>

        </template>

    </view>

</template>



<script>

import Calendar from '@/components/Li-Calendar/Li-Calendar.vue';

import { getDay } from '@/utils/utils.js';

function getDate(date, AddDayCount = 0) {

    if (!date) {

        date = new Date();

    }

    if (typeof date !== 'object') {

        date = date.replace(/-/g, '/');

    }

    const dd = new Date(date);



    dd.setDate(dd.getDate() + AddDayCount); // èŽ·å–AddDayCount天后的日期



    const y = dd.getFullYear();

    const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1; // èŽ·å–当前月份的日期，不足10è¡¥0

    const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate(); // èŽ·å–当前几号，不足10è¡¥0

    return {

        fullDate: y + '-' + m + '-' + d,

        year: y,

        month: m,

        date: d,

        day: dd.getDay()

    };

}

export default {

    components: {

        Calendar

    },

    data() {

        return {

            activeTab: '0',

            currentTime1: '',

            dateStart: '1999-05-01',

            dateEnd: '2999-06-15',

            mark: [],

            selected: [

                {

                    date: getDate(new Date(), -3).fullDate

                    // info: '打卡'

                },

                {

                    date: getDate(new Date(), -2).fullDate,

                    // info: '签到',

                    data: {

                        custom: '自定义信息',

                        name: '自定义消息头'

                    }

                },

                {

                    date: getDate(new Date(), -1).fullDate,

                    info: '已打卡'

                }

            ]

        };

    },

    methods: {

        tabClick(val) {

            this.activeTab = val;

        },

        handleDetail(item) {

            uni.navigateTo({

                // url: `/pages/staff/meetingDetail?id=${item.id}`,

                url: `/pages/staff/meetingDetail`

            });

        },

        changeCalendar(e) {

            console.log(e);

        },

        // ç‚¹å‡»æŸå¤©

        dayChange(data) {

            console.log(data);

            let date = data.time;

            let yyyy = data.time.substring(0, 4);

            let mm = Number(data.time.substring(data.time.indexOf('-') + 1, data.time.lastIndexOf('-')));

            let dd = Number(data.time.substring(data.time.lastIndexOf('-') + 1, data.time.length));

            mm = mm < 10 ? `0${mm}` : mm;

            dd = dd < 10 ? `0${dd}` : dd;

            let riqi = `${yyyy}-${mm}-${dd}`;

            this.currentTime = riqi;

            this.list = [];

            this.next = false;

            this.page = 0;

            // this.getRoomList()

        },

        // ä¸‹ä¸€æœˆ

        monthChange(data) {

            let date = data.date.replace(/[/]/g, '-');

            let yyyy = date.substring(0, 4);

            let mm = Number(date.substring(date.indexOf('-') + 1, date.lastIndexOf('-')));

            let dd = Number(date.substring(date.lastIndexOf('-') + 1, date.length));

            mm = mm < 10 ? `0${mm}` : mm;

            dd = dd < 10 ? `0${dd}` : dd;

            let riqi = `${yyyy}-${mm}-${dd}`;

            console.log('日期', riqi);

            this.currentTime1 = riqi;

            // this.getDateNum()

        }

    }

};

</script>



<style lang="scss">

page {

    background-color: #f7f7f7;

}

.main_app {

    padding: 0;

    background-color: #f7f7f7;

    ::v-deep .uni-calendar-item--checked {

        background-color: #279baa;

        border-radius: 8rpx;

    }

    ::v-deep .uni-calendar-item--isDay-text {

        color: #279baa;

    }

    ::v-deep .uni-calendar-item--isDay {

        background-color: #279baa;

        color: #fff;

        border-radius: 8rpx;

    }

    .tabs {

        display: flex;

        background-color: #fff;

        .tab {

            flex: 1;

            height: 88rpx;

            display: flex;

            justify-content: center;

            align-items: center;

            font-size: 28rpx;

            color: #666666;

            position: relative;

            .line {

                width: 60rpx;

                height: 4rpx;

                background: #fff;

                border-radius: 3rpx;

                position: absolute;

                bottom: 0;

                left: 50%;

                transform: translate(-50%, 0);

            }

        }

        .active {

            font-weight: 500;

            font-size: 30rpx;

            color: #222222;

            .line {

                background-color: #279baa;

            }

        }

    }

    //

    .card_list {

        padding: 30rpx;

        .card_title {

            display: flex;

            justify-content: space-between;

            align-items: center;

            margin-bottom: 22rpx;

            .name {

                display: flex;

                align-items: center;

                .icon {

                    width: 6rpx;

                    height: 32rpx;

                    background: #279baa;

                    border-radius: 4rpx;

                    margin-right: 16rpx;

                }

                .text {

                    font-weight: 600;

                    font-size: 32rpx;

                    color: #222222;

                }

            }

            .meeting {

                display: flex;

                height: 52rpx;

                line-height: 52rpx;

                background: #ffffff;

                border-radius: 26rpx;

                border: 2rpx solid #eeeeee;

                padding: 0 24rpx;

                .text {

                    font-size: 24rpx;

                    color: #333333;

                }

            }

        }

        .list {

            .item {

                padding: 0rpx 30rpx 30rpx;

                background: #ffffff;

                border-radius: 8rpx;

                .head {

                    display: flex;

                    justify-content: space-between;

                    align-items: center;

                    border-bottom: 1rpx solid #e5e5e5;

                    padding: 22rpx 0;

                    margin-bottom: 22rpx;

                    .name {

                        font-weight: 600;

                        font-size: 32rpx;

                        color: #222222;

                    }

                    .status {

                        height: 38rpx;

                        line-height: 38rpx;

                        padding: 0 16rpx;

                        border-radius: 4rpx;

                        border: 1rpx solid #999999;

                        font-size: 22rpx;

                        color: #999999;

                    }

                }

                .line {

                    display: flex;

                    margin-bottom: 12rpx;

                    .label {

                        width: 140rpx;

                        color: #666666;

                    }

                    .value {

                        flex: 1;

                    }

                }

            }

        }

    }

}

.container_b {

    width: 100%;

    padding: 30rpx;

    background: #ffffff;

    padding-top: 20rpx;

    box-sizing: border-box;

}

</style>

 h5/pages/staff/meetingDetail.vue

@@ -137,6 +137,7 @@
        left: 0;
        width: 100%;
        background-color: #fff;
        padding: 0 30rpx;
        .btn {
            width: 336rpx;
            height: 88rpx;

 h5/pages/staff/meetingManager.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,303 @@
<template>

    <view class="main_app">

        <!--  -->

        <!-- <uni-calendar @change="changeCalendar" :selected="selected" /> -->

        <!-- æ—¥åŽ† -->

        <view class="container_b">

            <Calendar

                ref="Calendar"

                :currentTime="currentTime1"

                :mark="mark"

                :showLunar="false"

                @dayChange="dayChange"

                @monthChange="monthChange"

                :rangeMode="false"

                :maskColor="'#ffffff'"

                :dateStart="dateStart"

                :dateEnd="dateEnd"

                :canDrag="false"

            ></Calendar>

        </view>

        <!--  -->

        <view class="card_list">

            <view class="card_title">

                <view class="name">

                    <view class="icon"></view>

                    <view class="text">今日会议</view>

                </view>

                <view class="meeting">

                    <view class="text mr24">全部会议室</view>

                    <u-icon name="arrow-down" size="12" color="#999999" />

                </view>

            </view>

            <view class="list">

                <view class="item">

                    <view class="head">

                        <view class="name">aaaaa选型</view>

                        <view class="status">即将开始</view>

                    </view>

                    <view class="line">

                        <view class="label">会议时间：</view>

                        <view class="value">12:00-12</view>

                    </view>

                    <view class="line">

                        <view class="label">会议室：</view>

                        <view class="value">202会议室</view>

                    </view>

                    <view class="line">

                        <view class="label">预约人：</view>

                        <view class="value">杨某某</view>

                    </view>

                    <view class="line">

                        <view class="label">备注：</view>

                        <view class="value">--</view>

                    </view>

                </view>

            </view>

        </view>



        <!--  -->

    </view>

</template>



<script>

import Calendar from '@/components/Li-Calendar/Li-Calendar.vue';

import { getDay } from '@/utils/utils.js';

function getDate(date, AddDayCount = 0) {

    if (!date) {

        date = new Date();

    }

    if (typeof date !== 'object') {

        date = date.replace(/-/g, '/');

    }

    const dd = new Date(date);



    dd.setDate(dd.getDate() + AddDayCount); // èŽ·å–AddDayCount天后的日期



    const y = dd.getFullYear();

    const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1; // èŽ·å–当前月份的日期，不足10è¡¥0

    const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate(); // èŽ·å–当前几号，不足10è¡¥0

    return {

        fullDate: y + '-' + m + '-' + d,

        year: y,

        month: m,

        date: d,

        day: dd.getDay()

    };

}

export default {

    components: {

        Calendar

    },

    data() {

        return {

            activeTab: '0',

            currentTime1: '',

            dateStart: '1999-05-01',

            dateEnd: '2999-06-15',

            mark: [],

            selected: [

                {

                    date: getDate(new Date(), -3).fullDate

                    // info: '打卡'

                },

                {

                    date: getDate(new Date(), -2).fullDate,

                    // info: '签到',

                    data: {

                        custom: '自定义信息',

                        name: '自定义消息头'

                    }

                },

                {

                    date: getDate(new Date(), -1).fullDate,

                    info: '已打卡'

                }

            ]

        };

    },

    methods: {

        tabClick(val) {

            this.activeTab = val;

        },

        handleDetail(item) {

            uni.navigateTo({

                // url: `/pages/staff/meetingDetail?id=${item.id}`,

                url: `/pages/staff/meetingDetail`

            });

        },

        changeCalendar(e) {

            console.log(e);

        },

        // ç‚¹å‡»æŸå¤©

        dayChange(data) {

            console.log(data);

            let date = data.time;

            let yyyy = data.time.substring(0, 4);

            let mm = Number(data.time.substring(data.time.indexOf('-') + 1, data.time.lastIndexOf('-')));

            let dd = Number(data.time.substring(data.time.lastIndexOf('-') + 1, data.time.length));

            mm = mm < 10 ? `0${mm}` : mm;

            dd = dd < 10 ? `0${dd}` : dd;

            let riqi = `${yyyy}-${mm}-${dd}`;

            this.currentTime = riqi;

            this.list = [];

            this.next = false;

            this.page = 0;

            // this.getRoomList()

        },

        // ä¸‹ä¸€æœˆ

        monthChange(data) {

            let date = data.date.replace(/[/]/g, '-');

            let yyyy = date.substring(0, 4);

            let mm = Number(date.substring(date.indexOf('-') + 1, date.lastIndexOf('-')));

            let dd = Number(date.substring(date.lastIndexOf('-') + 1, date.length));

            mm = mm < 10 ? `0${mm}` : mm;

            dd = dd < 10 ? `0${dd}` : dd;

            let riqi = `${yyyy}-${mm}-${dd}`;

            console.log('日期', riqi);

            this.currentTime1 = riqi;

            // this.getDateNum()

        }

    }

};

</script>



<style lang="scss">

page {

    background-color: #f7f7f7;

}

.main_app {

    padding: 0;

    background-color: #f7f7f7;

    ::v-deep .uni-calendar-item--checked {

        background-color: #279baa;

        border-radius: 8rpx;

    }

    ::v-deep .uni-calendar-item--isDay-text {

        color: #279baa;

    }

    ::v-deep .uni-calendar-item--isDay {

        background-color: #279baa;

        color: #fff;

        border-radius: 8rpx;

    }

    .tabs {

        display: flex;

        background-color: #fff;

        .tab {

            flex: 1;

            height: 88rpx;

            display: flex;

            justify-content: center;

            align-items: center;

            font-size: 28rpx;

            color: #666666;

            position: relative;

            .line {

                width: 60rpx;

                height: 4rpx;

                background: #fff;

                border-radius: 3rpx;

                position: absolute;

                bottom: 0;

                left: 50%;

                transform: translate(-50%, 0);

            }

        }

        .active {

            font-weight: 500;

            font-size: 30rpx;

            color: #222222;

            .line {

                background-color: #279baa;

            }

        }

    }

    //

    .card_list {

        padding: 30rpx;

        .card_title {

            display: flex;

            justify-content: space-between;

            align-items: center;

            margin-bottom: 22rpx;

            .name {

                display: flex;

                align-items: center;

                .icon {

                    width: 6rpx;

                    height: 32rpx;

                    background: #279baa;

                    border-radius: 4rpx;

                    margin-right: 16rpx;

                }

                .text {

                    font-weight: 600;

                    font-size: 32rpx;

                    color: #222222;

                }

            }

            .meeting {

                display: flex;

                height: 52rpx;

                line-height: 52rpx;

                background: #ffffff;

                border-radius: 26rpx;

                border: 2rpx solid #eeeeee;

                padding: 0 24rpx;

                .text {

                    font-size: 24rpx;

                    color: #333333;

                }

            }

        }

        .list {

            .item {

                padding: 0rpx 30rpx 30rpx;

                background: #ffffff;

                border-radius: 8rpx;

                .head {

                    display: flex;

                    justify-content: space-between;

                    align-items: center;

                    border-bottom: 1rpx solid #e5e5e5;

                    padding: 22rpx 0;

                    margin-bottom: 22rpx;

                    .name {

                        font-weight: 600;

                        font-size: 32rpx;

                        color: #222222;

                    }

                    .status {

                        height: 38rpx;

                        line-height: 38rpx;

                        padding: 0 16rpx;

                        border-radius: 4rpx;

                        border: 1rpx solid #999999;

                        font-size: 22rpx;

                        color: #999999;

                    }

                }

                .line {

                    display: flex;

                    margin-bottom: 12rpx;

                    .label {

                        width: 140rpx;

                        color: #666666;

                    }

                    .value {

                        flex: 1;

                    }

                }

            }

        }

    }

}

.container_b {

    width: 100%;

    padding: 30rpx;

    background: #ffffff;

    padding-top: 20rpx;

    box-sizing: border-box;

}

</style>

 h5/uni_modules/uni-calendar/changelog.md

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/calendar.js

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/i18n/en.json

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/i18n/index.js

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/i18n/zh-Hans.json

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/i18n/zh-Hant.json

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/uni-calendar-item.vue

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/uni-calendar.vue

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/components/uni-calendar/util.js

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/package.json

ÎļþÒÑɾ³ý

 h5/uni_modules/uni-calendar/readme.md

ÎļþÒÑɾ³ý