css
liukangdong
2024-06-03 248f2f32b0f1e406a8110f0839702914a9c3ca0a
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
<template>
    <view class="main_app">
        <view class="head_app">
            <view class="title">讨论智能会议室系统选型</view>
            <view class="text">201会议室|2023年5月4日 10:00-12:00</view>
        </view>
        <!--  -->
        <view class="empty"></view>
        <view class="module_list">
            <view class="item">
                <view class="label">会议内容</view>
                <view class="value">
                    <!-- <text>主要讨论智能会议室系统选型,请大家一定要按时来开会,时间宝贵。感谢大家!</text> -->
                    <u-textarea border="none" v-model="param.aaa" count :maxlength="300" placeholder="请输入会议内容" placeholder-class="placeholder9"     />
                </view>
            </view>
            <view class="item">
                <view class="label">参会人员</view>
                <view class="value">
                    <view class="personnel">
                        <view class="per_item" v-for="i in 10">
                            <image src="../../static/logo@2x.png" class="avatar" mode=""></image>
                            <view class="name">胡八一</view>
                        </view>
                    </view>
                </view>
            </view>
            <view class="item">
                <view class="label">服务项</view>
                <view class="value">席卡 |  投影仪 |  笔记本电脑</view>
            </view>
            <view class="item">
                <view class="label">备注</view>
                <view class="value">今天人多,请按时参加</view>
            </view>
            <view class="item">
                <view class="label">预约人</view>
                <view class="value">行政部 赵强 18832319899</view>
            </view>
        </view>
        <view class="empty empty2"></view>
        <view class="main_footer">
            <view class="btn" @click="handleSub('0')">撤回</view>
            <view class="btn agree" @click="handleSub('1')">修改</view>
        </view>
    </view>
</template>
 
<script>
    export default {
        data() {
            return {
                param: {}
            };
        },
        methods: {
            handleSub() {
                
            }
        }
    }
</script>
 
<style lang="scss">
    page{
        background-color: #f7f7f7;
    }
    .main_app{
        padding: 0 ;
        .head_app{
            padding: 30rpx;
            background-color: #fff;
            .title{
                font-weight: 600;
                font-size: 36rpx;
                color: #222222;
                margin-bottom: 30rpx;
            }
            .text{
                font-size: 28rpx;
                color: #666666;
            }
        }
    }
    .module_list {
        background-color: #fff;
        padding: 0 30rpx;
        .item {
            padding: 30rpx 0;
            border-bottom: 1rpx solid #E5E5E5;
    
            .label {
                font-size: 26rpx;
                color: #666666;
                margin-bottom: 20rpx;
            }
    
            .value {
                font-size: 30rpx;
                display: flex;
                align-items: center;
                ::v-deep textarea{
                    padding: 0;
                    background-color: #fff !important;
                }
                .personnel{
                    display: flex;
                    width: 100%;
                    overflow-x: auto;
                    .per_item{
                        flex-shrink: 0;
                            display: flex;
                            flex-direction: column;
                            justify-content: center;
                            align-items: center;
                            margin-right: 24rpx;
                            .avatar{
                                width: 72rpx;
                                height: 72rpx;
                                border-radius: 50%;
                            }
                            .name{
                                font-size: 26rpx;
                                color: #777777;
                            }
                    }
                }
            }
        }
    }
    .main_footer {
        padding-bottom: 64rpx;
        display: flex;
        justify-content: space-between;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: #fff;
        padding: 0 30rpx;
        .btn {
            width: 336rpx;
            height: 88rpx;
            line-height: 88rpx;
            background: #FFFFFF;
            border-radius: 44rpx;
            border: 1rpx solid #999999;
            font-size: 32rpx;
            text-align: center;
            margin: 16rpx 0;
        }
 
        .agree {
            background: $uni-color-primary;
            color: #fff;
            border: 1rpx solid $uni-color-primary;
        }
    }
.empty{
    width: 750rpx;
        height: 20rpx;
        background-color: #f7f7f7;
        margin: 0 -30rpx;
}
.empty2{
    height: 280rpx !important;
}
</style>