| | |
| | | <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>
|
| | | <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="currentDate"
|
| | | :mark="monthMark"
|
| | | :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" @click="isShowStatus = true">{{
|
| | | activeRoom.name
|
| | | }}</view>
|
| | | <u-icon name="arrow-down" size="12" color="#999999" />
|
| | | </view>
|
| | | </view>
|
| | | <view class="list">
|
| | | <view
|
| | | @click="handleDetail(item.id)"
|
| | | class="item"
|
| | | v-for="item in myMeetingList"
|
| | | :key="item.id"
|
| | | >
|
| | | <view class="head">
|
| | | <view class="name">{{ item.meetingName }}</view>
|
| | | <view class="status" v-if="item.meetingStatus == '1'"
|
| | | >未开始</view
|
| | | >
|
| | | <view class="status red" v-if="item.meetingStatus == '2'"
|
| | | >进行中</view
|
| | | >
|
| | | <view class="status" v-if="item.meetingStatus == '3'"
|
| | | >已结束</view
|
| | | >
|
| | | <view class="status padding" v-if="item.meetingStatus == '4'"
|
| | | >即将开始</view
|
| | | >
|
| | | <view class="status" v-if="item.meetingStatus == '5'"
|
| | | >已撤销</view
|
| | | >
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">会议时间:</view>
|
| | | <view class="value">{{ item.meetingTime }}</view>
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">会议室:</view>
|
| | | <view class="value">{{ item.roomName }}</view>
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">预约人:</view>
|
| | | <view class="value">{{ item.bookingUser }}</view>
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">备注:</view>
|
| | | <view class="value">{{ item.remark || item.meetingRemark }}</view>
|
| | | </view>
|
| | | </view>
|
| | | </view>
|
| | | </view>
|
| | | </template>
|
| | | <!-- -->
|
| | | <template v-if="activeTab === '1'">
|
| | | <view class="card_list">
|
| | | <view class="list">
|
| | | <view
|
| | | class="item"
|
| | | v-for="item in recordList"
|
| | | :key="item.id"
|
| | | @click="handleDetail(item.id)"
|
| | | >
|
| | | <view class="head">
|
| | | <view class="name">{{ item.meetingName }}</view>
|
| | | <view class="status" v-if="item.meetingStatus == '1'"
|
| | | >未开始</view
|
| | | >
|
| | | <view class="status red" v-if="item.meetingStatus == '2'"
|
| | | >进行中</view
|
| | | >
|
| | | <view class="status" v-if="item.meetingStatus == '3'"
|
| | | >已结束</view
|
| | | >
|
| | | <view class="status padding" v-if="item.meetingStatus == '4'"
|
| | | >即将开始</view
|
| | | >
|
| | | <view class="status" v-if="item.meetingStatus == '5'"
|
| | | >已撤销</view
|
| | | >
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">会议时间:</view>
|
| | | <view class="value">{{ item.meetingTime }}</view>
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">会议室:</view>
|
| | | <view class="value">{{ item.roomName }}</view>
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">预约人:</view>
|
| | | <view class="value">{{ item.bookingUser }}</view>
|
| | | </view>
|
| | | <view class="line">
|
| | | <view class="label">备注:</view>
|
| | | <view class="value">{{ item.remark || item.meetingRemark }}</view>
|
| | | </view>
|
| | | </view>
|
| | | </view>
|
| | | </view>
|
| | | </template>
|
| | |
|
| | | <u-picker
|
| | | keyName="name"
|
| | | :show="isShowStatus"
|
| | | :columns="meetingList"
|
| | | @confirm="seletedStatus"
|
| | | @cancel="isShowStatus = false"
|
| | | ></u-picker>
|
| | | </view>
|
| | | </template>
|
| | |
|
| | | <script>
|
| | | import Calendar from '@/components/Li-Calendar/Li-Calendar.vue';
|
| | | import { getDay } from '@/utils/utils.js';
|
| | | import Calendar from '@/components/Li-Calendar/Li-Calendar.vue'
|
| | | import dayja from 'dayjs'
|
| | | import { myMeetingPage, monthMeetingPage, roomsListPost } from '@/api'
|
| | | function getDate(date, AddDayCount = 0) {
|
| | | if (!date) {
|
| | | date = new Date();
|
| | | }
|
| | | if (typeof date !== 'object') {
|
| | | date = date.replace(/-/g, '/');
|
| | | }
|
| | | const dd = new Date(date);
|
| | | if (!date) {
|
| | | date = new Date()
|
| | | }
|
| | | if (typeof date !== 'object') {
|
| | | date = date.replace(/-/g, '/')
|
| | | }
|
| | | const dd = new Date(date)
|
| | |
|
| | | dd.setDate(dd.getDate() + AddDayCount); // 获取AddDayCount天后的日期
|
| | | 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()
|
| | | };
|
| | | 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
|
| | | components: {
|
| | | Calendar
|
| | | },
|
| | | data() {
|
| | | return {
|
| | | activeTab: '0',
|
| | | recordList: [],
|
| | | recordPage: 1,
|
| | | myPage: 1,
|
| | | myMeetingList: [],
|
| | | currentDate: '',
|
| | | dateStart: '1999-05-01',
|
| | | dateEnd: '2999-06-15',
|
| | | monthMark: [],
|
| | |
|
| | | isShowStatus: false,
|
| | | activeRoom: {
|
| | | name: '全部会议室',
|
| | | id: ''
|
| | | },
|
| | | meetingList: [],
|
| | |
|
| | | }
|
| | | },
|
| | | onLoad() {
|
| | | this.currentDate = dayja().format('YYYY-MM-DD')
|
| | | this.initData()
|
| | | this.getRoomList()
|
| | | },
|
| | | onShow() {
|
| | | this.tabClick('0')
|
| | | },
|
| | | 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()
|
| | | }
|
| | | }
|
| | | onReachBottom() {
|
| | | const { activeTab } = this
|
| | | if (activeTab == '0') {
|
| | | this.myPage = this.myPage + 1
|
| | | this.getDayMeeting()
|
| | | } else {
|
| | | this.recordPage = this.recordPage + 1
|
| | | this.getRecordList()
|
| | | }
|
| | | },
|
| | | methods: {
|
| | | initData() {
|
| | | // 当月数据
|
| | | monthMeetingPage({
|
| | | yearMonth: this.currentDate.slice(0, 7)
|
| | | }).then(res => {
|
| | | this.monthMark = res.data.filter(i => i.meetingNum > 0).map(j => {
|
| | | return {
|
| | | time: j.monthDate,
|
| | | pointText: j.meetingNum,
|
| | | pointTextColor: 'red'
|
| | | }
|
| | | })
|
| | | })
|
| | | },
|
| | | getRoomList() {
|
| | | roomsListPost({}).then(res => {
|
| | | this.meetingList = [[{ id: '', name: '全部会议室' }, ...res.data]]
|
| | | console.log('meetingList', this.meetingList);
|
| | | })
|
| | | },
|
| | | tabClick(val) {
|
| | | this.activeTab = val
|
| | | if (val === '1') {
|
| | | this.recordPage = 1
|
| | | this.getRecordList()
|
| | | } else {
|
| | | this.myMeetingList = []
|
| | | this.activeRoom = {
|
| | | name: '全部会议室',
|
| | | id: ''
|
| | | }
|
| | | this.myPage = 1
|
| | | this.getDayMeeting()
|
| | | }
|
| | | },
|
| | | seletedStatus(e) {
|
| | | this.myMeetingList = []
|
| | | this.activeRoom = { ...e.value[0] }
|
| | | this.isShowStatus = false
|
| | | this.getDayMeeting()
|
| | | },
|
| | | handleDetail(id) {
|
| | | uni.navigateTo({
|
| | | url: `/pages/staff/meetingDetail?id=${id}`,
|
| | | // url: `/pages/staff/meetingDetail`
|
| | | })
|
| | | },
|
| | | changeCalendar(e) {
|
| | | console.log(e)
|
| | | },
|
| | | // 点击某天
|
| | | dayChange(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.currentDate = riqi
|
| | | this.myMeetingList = []
|
| | | this.activeStatus = {
|
| | | name: '全部会议室',
|
| | | key: ''
|
| | | }
|
| | | this.myPage = 1
|
| | | this.getDayMeeting()
|
| | | },
|
| | | // 下一月
|
| | | 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.currentDate = riqi
|
| | | this.initData()
|
| | | },
|
| | | getRecordList() {
|
| | | const { activeStatus } = this
|
| | | myMeetingPage({
|
| | | capacity: 10,
|
| | | page: this.recordPage,
|
| | | model: {
|
| | | // status: activeStatus.key || null,
|
| | | // roomsId: this.roomId,
|
| | | queryType: 2
|
| | | }
|
| | | }).then(res => {
|
| | | this.recordList = [...this.recordList, ...res.data.records]
|
| | | })
|
| | | },
|
| | | getDayMeeting() {
|
| | | const { myPage, activeRoom, currentDate } = this
|
| | | // 当天我参与的会议
|
| | | myMeetingPage({
|
| | | model: {
|
| | | queryType: '1',
|
| | | roomsId: activeRoom.id,
|
| | | queryDate: currentDate
|
| | | },
|
| | | page: myPage,
|
| | | capacity: 10
|
| | | }).then(res => {
|
| | | this.myMeetingList = [ ...this.myMeetingList, ...res.data.records ]
|
| | | })
|
| | | },
|
| | | }
|
| | | };
|
| | | </script>
|
| | |
|
| | | <style lang="scss">
|
| | | page {
|
| | | background-color: #f7f7f7;
|
| | | background-color: #f7f7f7;
|
| | | }
|
| | | .main_app {
|
| | | padding: 0;
|
| | | background-color: #f7f7f7;
|
| | | ::v-deep .uni-calendar-item--checked {
|
| | | background-color: $uni-color-primary;
|
| | | border-radius: 8rpx;
|
| | | }
|
| | | ::v-deep .uni-calendar-item--isDay-text {
|
| | | color: $uni-color-primary;
|
| | | }
|
| | | ::v-deep .uni-calendar-item--isDay {
|
| | | background-color: $uni-color-primary;
|
| | | 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: $uni-color-primary;
|
| | | }
|
| | | }
|
| | | }
|
| | | //
|
| | | .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: $uni-color-primary;
|
| | | 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;
|
| | | }
|
| | | }
|
| | | }
|
| | | }
|
| | | }
|
| | | padding: 0;
|
| | | background-color: #f7f7f7;
|
| | | ::v-deep .uni-calendar-item--checked {
|
| | | background-color: $uni-color-primary;
|
| | | border-radius: 8rpx;
|
| | | }
|
| | | ::v-deep .uni-calendar-item--isDay-text {
|
| | | color: $uni-color-primary;
|
| | | }
|
| | | ::v-deep .uni-calendar-item--isDay {
|
| | | background-color: $uni-color-primary;
|
| | | 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: $uni-color-primary;
|
| | | }
|
| | | }
|
| | | }
|
| | | //
|
| | | .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: $uni-color-primary;
|
| | | 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;
|
| | | margin-bottom: 24rpx;
|
| | | .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;
|
| | | }
|
| | | .padding {
|
| | | color: $uni-color-primary;
|
| | | border: 1rpx solid $uni-color-primary;
|
| | | }
|
| | | .red {
|
| | | color: #e23f29;
|
| | | border: 1rpx solid #e23f29;
|
| | | }
|
| | | }
|
| | | .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;
|
| | | width: 100%;
|
| | | padding: 30rpx;
|
| | | background: #ffffff;
|
| | | padding-top: 20rpx;
|
| | | box-sizing: border-box;
|
| | | }
|
| | | </style>
|