Merge remote-tracking branch 'origin/master'

jiangping

2024-06-03 ee010e7160f0a4dee5e0c2fde55d488f4f2f9788

Merge remote-tracking branch 'origin/master'

 h5/App.vue

@@ -1,5 +1,5 @@
<script>
import { wxAuthorize } from '@/api'
import { wxAuthorize, refreshToken } from '@/api'
export default {
    onLaunch: function () {
        var that = this
@@ -27,6 +27,15 @@
                })
            }
        }
        // åˆ·æ–°token
        const token = uni.getStorageSync('token')
        if(token){
            // refreshToken().then(res => {
            //     if(res.code && res.code === 200){
            //         this.$store.commit('setToken', res.data)
            //     }
            // })
        }
    },
    onShow: function () {
        console.log('App Show')

 h5/api/index.js

@@ -2,6 +2,7 @@
export * from '@/utils/config.js'
export * from './visitor'
export * from './staff'
export * from './meeting'

// æŸ¥è¯¢å­—典值数据
export const getSystemDictData = (data) => {

 h5/api/meeting.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,58 @@
import { http } from '@/utils/service.js'

// ä¼šè®®å®¤åˆ—表
export const roomsListPost = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/rooms/roomsList',
    method: 'get',
    data
  })
}
// ä¼šè®®å®¤æ—¶é—´æ®µ
export const getRoomUseTime = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/rooms/getRoomUseTime',
    method: 'post',
    data
  })
}
// ä¼šè®®å®¤æ—¶é—´æ®µ é¢„定会议室
export const reservationMeeting = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/meeting/reservationMeeting',
    method: 'post',
    data
  })
}
// ä¼šè®®å®¤æ—¶é—´æ®µ è¯¦æƒ…
export const meetingDetail = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/meeting/meetingDetail',
    method: 'get',
    data
  })
}
// ä¼šè®®å®¤ äººå‘˜
export const userPagePost = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/meeting/userPage',
    method: 'post',
    data
  })
}
// ä¼šè®®å®¤ è¯¦æƒ…
export const getRoomDetail = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/rooms/getRoomDetail',
    method: 'get',
    data
  })
}
// ä¼šè®®å®¤ ç®¡ç†
export const myMeetingPage = (data) => {
  return http({
    url: 'meetingAdmin/cloudService/web/meeting/myMeetingPage',
    method: 'post',
    data
  })
}

 h5/api/staff.js

@@ -3,20 +3,27 @@
// login
export const loginPost = (data) => {
  return http({
    url: '/loginH5',
    url: 'loginH5',
    method: 'post',
    data
  })
}
export const loginCaptcha = () => {
  return http({
    url: '/captcha',
    url: 'captcha',
    method: 'get'
  })
}
// åˆ·æ–°token
export const refreshToken = () => {
  return http({
    url: 'refreshtoken',
    method: 'post'
  })
}
export const getUserInfo = () => {
  return http({
    url: '/getUserInfo',
    url: 'getUserInfo',
    method: 'get'
  })
}
@@ -135,4 +142,11 @@
    method: 'post',
    data
  })
}
// æŸ¥è¯¢è½¦è¾† æ´¾è½¦è®°å½• è¯¦æƒ…
export const carUseBookDetail = (id) => {
  return http({
    url: 'visitsAdmin/cloudService/business/carUseBook/'+id,
    method: 'get'
  })
}

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

ÎļþÒÑɾ³ý

 h5/components/Li-Calendar/Li-Calendar.vue

@@ -697,6 +697,224 @@
    }

</script>



<style>

    @import url("./Li-Calendar.css");

<style lang="scss">

.calendar-Time-header{

    /* text-align: center;

    height: 50upx;

    line-height: 50upx;

    vertical-align: middle;

    padding: 20upx; */

    width: 100%;

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 20rpx;

}

.header-left {

    display: flex;

    align-items: center;

}

.header-left image {

    width: 30rpx;

    height: 30rpx;

}

.header-left text {

    font-size: 32rpx;

    font-family: PingFangSC-Semibold, PingFang SC;

    font-weight: 600;

    color: #222222;

    margin: 0 40rpx

}

.header-right {

    font-size: 28rpx;

    font-family: PingFangSC-Regular, PingFang SC;

    font-weight: 400;

    color: $uni-color-primary;

}

.calendar-TimeH{

}

.calendar-lastMonth{

    width: 100upx;

    font-size: 35upx;

    margin-right: 10%;

    padding: 0 5px;

    text-align: center;

}

.calendar-nextMonth{

    width: 100upx;

    text-align: center;

    margin-left: 10%;

    font-size: 35upx;

    padding: 0 5px;

}

.calendar-backToToday{

    text-align: center;

    font-size: 24upx;

    position: absolute;	
    right: 5px;

}



.calendar-row:before,

.calendar-row:after {

    display: table;

    content: ' ';

}



.calendar-row:after {

    clear: both;

}



.calendar-col {

    width: 14.285714%;

    max-width: 14.285714%;

    position: relative;

    float: left;

    font-weight: 500;

    min-height: 80upx;

    font-size: 28rpx;

    /* color: #999999; */

    color: #222222;

    white-space: nowrap;

    text-overflow: ellipsis;

    -o-text-overflow: ellipsis;

    overflow: hidden;

	
    display: flex;

    align-items: center;

    justify-content: center;

}



.aligncanter {

    text-align: center;

    /* border-bottom: 1rpx solid #E5E5E5; */

}



.calendar-header {

    color: gray;

    height: 40upx;

    line-height: 40upx;

    vertical-align: middle;

    font-size: 24upx;

}



.calendar-day {

    height: 80upx;

    transform: translate3d(0px, 0px, 0px) translateZ(0px); transition-duration: 0ms; transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);

}





.calendar-content {

}



.calendar-date{

    /* color: #000; */

}

.calendar-today {

    /* border-radius: 6upx;

    background-color: $uni-color-primary; */

    color: $uni-color-primary;

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

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

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

}

.calendar-today .calendar-point{

    color: white !important;

}



.calendar-today .calendar-text{

    color: white !important;

}



.calendar-col-lastMonth .calendar-text{

    color: gray;

}



.calendar-col-nextMonth .calendar-text{

    color: gray;

}



/* .calendar-today .calendar-date{

    color: white;

} */



.calendar-active {

    color:#FFFFFF !important;

    background-color: $uni-color-primary;

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

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

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

}

/* èŒƒå›´æ ‡è®° */

.calendar-range {

    /* color:#01AAED; */

    border-radius: 0px;

    background-color: #D9D9D9;

    -moz-box-shadow: none;

    -webkit-box-shadow: none;

    box-shadow: none;

}







.ClearBoth {

    clear: both;

}

.calendar-col-nextMonth{

    color:gray;

}

.calendar-col-lastMonth{

    color:gray;

}

.calendar-btn-disabled{

    color:gainsboro;

}

.calendar-point{

    width: 28rpx;

    height: 28rpx;

    box-sizing: border-box;

    background-color: #F62710;

    border-radius: 50%;

    font-size: 16upx;

    color: #FFFFFF;

    top:2upx;

    right: 2upx;

    position: absolute;

    display: flex;

    align-items: center;

    justify-content: center;

}

.calendar-text{

    padding: 4rpx 0;

    width:100%;font-size: 20upx;color: #F62710;top:40upx;left: 0px;position: absolute;overflow:hidden;

}

.dayValue{

    text-align: center;

    /* color: #000000; */

}



.calendar-day-6-7{

    /* color: orangered; */

}



/* è¶…出日期范围 */

.calendar-out-of-Date{

    background-color: #EAEAEA;

}

.calendar-out-of-Date .calendar-date{

    color: gray;

}











/* ä»¥ä¸‹ä¸ºå®žçŽ°0.5px底部边界 */

.under_line{position: relative;}

.under_line:before,

.under_line:after{position: absolute;content: " ";height: 1px;width: 100%;left: 0;transform-origin: 0 0;-webkit-transform-origin: 0 0;}

/* .fineLine:before{顶部top: 0;background: #000;} */

.under_line:after{bottom: 0;}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5){.under_line:after,.under_line:before{-webkit-transform: scaleY(.667);}}

@media only screen and (-webkit-min-device-pixel-ratio: 2){.under_line:after,.under_line:before{-webkit-transform: scaleY(.5);}}

/* ä»¥ä¸Šä¸ºå®žçŽ°0.5px底部边界 */

</style>


 h5/pages.json

@@ -391,6 +391,24 @@
            }

            

        }

        ,{

            "path" : "pages/staff/vehicle/sendACarDetail",

            "style" :                                                                                    
            {
                "navigationBarTitleText": "用车审批",
                "enablePullDownRefresh": false
            }
            
        }

        ,{

            "path" : "pages/staff/meetingSel",

            "style" :                                                                                    
            {
                "navigationBarTitleText": "选择人员",
                "enablePullDownRefresh": false
            }
            
        }

    ],

    "subPackages": [{

            "root": "n_pages",


 h5/pages/applicationRecord/applicationRecord.vue

@@ -135,7 +135,7 @@
  }
}
</script>
<style>
<style lang="scss">
page {
  background-color: #f7f7f7 !important;
}
@@ -158,8 +158,8 @@
      display: flex;
      align-items: center;
      .active {
        border: 1rpx solid #279baa !important;
        color: #279baa !important;
        border: 1rpx solid $uni-color-primary !important;
        color: $uni-color-primary !important;
      }
      .box_head_item {
        padding: 0 30rpx;
@@ -196,7 +196,7 @@
        align-items: center;
        justify-content: space-between;
        .loading {
          color: #279baa;
          color: $uni-color-primary;
        }
        .success {
          color: #03c68f;

 h5/pages/appointmentDetails/appointmentDetails.vue

@@ -149,7 +149,7 @@
    }
    .text {
      font-size: 30rpx;
      color: #279baa;
      color: $uni-color-primary;
      padding: 20rpx 0 30rpx;
    }
  }
@@ -167,7 +167,7 @@
    }
  }
  .head_padding {
    background: #279baa;
    background: $uni-color-primary;
    .h1 {
      color: #ffffff;
    }
@@ -187,7 +187,7 @@
  .head_success {
    background: #e8f4f6;
    .h1 {
      color: #279baa;
      color: $uni-color-primary;
    }
    .h2 {
      color: #333333;

 h5/pages/driver/index.vue

@@ -111,9 +111,9 @@
        width: 144rpx;
        height: 56rpx;
        border-radius: 36rpx;
        border: 1rpx solid #279baa;
        border: 1rpx solid $uni-color-primary;
        font-size: 26rpx;
        color: #279baa;
        color: $uni-color-primary;
        display: flex;
        justify-content: center;
        align-items: center;
@@ -139,7 +139,7 @@
        font-weight: 500;
        font-size: 28rpx;
        width: 192rpx;
        color: #279BAA;
        color: $uni-color-primary;
        height: 48rpx;
        line-height: 48rpx;
        text-align: center;
@@ -219,7 +219,7 @@
                color: #222222;
            }
            .status{
                color: #279BAA;
                color: $uni-color-primary;
                font-weight: 500;
                .time{
                    font-size: 24rpx;
@@ -256,7 +256,7 @@
                    line-height: 68rpx;
                    padding: 0 34rpx;
                    color: #FFFFFF;
                    background: #279BAA;
                    background: $uni-color-primary;
                    box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(39,155,170,0.4);
                    border-radius: 40rpx;
                }

 h5/pages/driver/queueUp.vue

@@ -90,7 +90,7 @@
        }
        .cyan{
            .h2{
                color: #279BAA;
                color: $uni-color-primary;
            }
        }
    }

 h5/pages/driver/queueUpRecord.vue

@@ -81,7 +81,7 @@
                height: 50rpx;
                line-height: 50rpx;
                padding: 0 20rpx;
                background: #279BAA;
                background: $uni-color-primary;
                color: #fff;
                font-size: 26rpx;
                border-radius: 0rpx 8rpx 0rpx 25rpx;
@@ -102,7 +102,7 @@
            }
            .padding{
                background: #E9F5F6;
                color: #279BAA;
                color: $uni-color-primary;
            }
            .avatar{
                width: 84rpx;
@@ -126,7 +126,7 @@
                    .time{
                        display: flex;
                        align-items: center;
                        color: #279BAA;
                        color: $uni-color-primary;
                    }
                }
            }

 h5/pages/driver/reservedDetail.vue

@@ -206,7 +206,7 @@
                        color: #777777;

                        .status {
                            color: #279BAA;
                            color: $uni-color-primary;
                        }
                    }

@@ -311,7 +311,7 @@
            padding: 0 32rpx;
            border-radius: 0rpx 0rpx 0rpx 30rpx;
            background-color: #e9edff;
            color: #279BAA;
            color: $uni-color-primary;
        }
    }

@@ -333,9 +333,9 @@
        }

        .agree {
            background: #279BAA;
            background: $uni-color-primary;
            color: #fff;
            border: 1rpx solid #279BAA;
            border: 1rpx solid $uni-color-primary;
        }
    }


 h5/pages/driver/taskConfirm.vue

@@ -198,12 +198,12 @@

                .copy {
                    font-size: 26rpx;
                    color: #279BAA;
                    color: $uni-color-primary;
                }

                .btn {
                    font-size: 28rpx;
                    color: #279BAA;
                    color: $uni-color-primary;
                    display: flex;
                }
            }
@@ -289,7 +289,7 @@
            padding: 0 24rpx;
            border-radius: 34rpx 0rpx 0rpx 34rpx;
            font-size: 26rpx;
            color: #279BAA;
            color: $uni-color-primary;

        }
    }
@@ -322,8 +322,8 @@
        }

        .check {
            background: #279BAA;
            border: 1rpx solid #279BAA;
            background: $uni-color-primary;
            border: 1rpx solid $uni-color-primary;
            color: #fff;
        }
    }
@@ -371,7 +371,7 @@
        .title {
            font-weight: 500;
            font-size: 30rpx;
            color: #279BAA;
            color: $uni-color-primary;
            margin-bottom: 12rpx;
        }


 h5/pages/driver/taskDetail.vue

@@ -37,7 +37,7 @@
                <view class="value">
                    <view class="">0 å…¬é‡Œ</view>
                    <view class="btn" @click="getLocation">
                        <u-icon name="map" color="#279BAA" class="mr6"></u-icon>
                        <u-icon name="map" :color="$store.state.primaryColor" class="mr6"></u-icon>
                        é‡æ–°å®šä½
                    </view>
                </view>
@@ -183,7 +183,7 @@
                }
                .btn{
                    font-size: 28rpx;
                    color: #279BAA;
                    color: $uni-color-primary;
                    display: flex;
                }
            }
@@ -255,7 +255,7 @@
            padding: 0 24rpx;
            border-radius: 34rpx 0rpx 0rpx 34rpx;
            font-size: 26rpx;
            color: #279BAA;
            color: $uni-color-primary;
            
        }
    }
@@ -283,8 +283,8 @@
            border: 1rpx solid #999999;
        }
        .check{
            background: #279BAA;
            border: 1rpx solid #279BAA;
            background: $uni-color-primary;
            border: 1rpx solid $uni-color-primary;
            color: #fff;
        }
    }
@@ -324,7 +324,7 @@
        .title{
            font-weight: 500;
            font-size: 30rpx;
            color: #279BAA;
            color: $uni-color-primary;
            margin-bottom: 12rpx;
        }
        .address{

 h5/pages/staff/index.vue

@@ -116,9 +116,9 @@
        width: 144rpx;
        height: 56rpx;
        border-radius: 36rpx;
        border: 1rpx solid #279baa;
        border: 1rpx solid $uni-color-primary;
        font-size: 26rpx;
        color: #279baa;
        color: $uni-color-primary;
        display: flex;
        justify-content: center;
        align-items: center;

 h5/pages/staff/meetingCalendar.vue

@@ -209,14 +209,14 @@
    padding: 0;

    background-color: #f7f7f7;

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

        background-color: #279baa;

        background-color: $uni-color-primary;

        border-radius: 8rpx;

    }

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

        color: #279baa;

        color: $uni-color-primary;

    }

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

        background-color: #279baa;

        background-color: $uni-color-primary;

        color: #fff;

        border-radius: 8rpx;

    }

@@ -248,7 +248,7 @@
            font-size: 30rpx;

            color: #222222;

            .line {

                background-color: #279baa;

                background-color: $uni-color-primary;

            }

        }

    }

@@ -266,7 +266,7 @@
                .icon {

                    width: 6rpx;

                    height: 32rpx;

                    background: #279baa;

                    background: $uni-color-primary;

                    border-radius: 4rpx;

                    margin-right: 16rpx;

                }

@@ -339,4 +339,4 @@
    padding-top: 20rpx;

    box-sizing: border-box;

}

</style>
</style>


 h5/pages/staff/meetingDetail.vue

@@ -151,9 +151,9 @@
        }

        .agree {
            background: #279BAA;
            background: $uni-color-primary;
            color: #fff;
            border: 1rpx solid #279BAA;
            border: 1rpx solid $uni-color-primary;
        }
    }
.empty{

 h5/pages/staff/meetingManager.vue

@@ -1,303 +1,321 @@
<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 class="main_app">

    <!--  -->

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

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

    <view class="container_b">

      <Calendar

        ref="Calendar"

        :currentTime="currentDate"

        :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" @click="isShowStatus = true">

          <view class="text mr24">{{ activeStatus.name }}</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>

    <!--  -->

        <u-picker

      keyName="name"

      :show="isShowStatus"

      :columns="statusList"

      @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';

function getDate(date, AddDayCount = 0) {

    if (!date) {

        date = new Date();

    }

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

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

    }

    const dd = new Date(date);

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

import dayjs from 'dayjs'

import { myMeetingPage } from '@/api'



    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: [

  components: {

    Calendar

  },

  data() {

    return {

      currentDate: '',

      dateStart: '2024-01-01',

      dateEnd: '2999-06-15',

            mark: [

                {

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

                    // info: '打卡'

                    time: '2024-05-30'

                },

                {

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

                    // info: '签到',

                    data: {

                        custom: '自定义信息',

                        name: '自定义消息头'

                    }

                    time: '2024-05-22',

                    pointText: 'aaa',

                    pointTextColor: '#fff'

                },

                {

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

                    info: '已打卡'

                    time: '2024-05-28',

                    text: ['111','222'],

                    pointTextColor: '#fff'

                }

            ]

        };

    },

    methods: {

        tabClick(val) {

            this.activeTab = val;

            ],

            activeStatus: {

                name: '全部会议室'

            },

            isShowStatus: false,

            statusList: [[

                { name: '全部会议室', key: '' },

                { name: '未开始', key: '1' },

                { name: '已结束', key: '2' },

            ]],

            dataList: [],

            page: 1

    }

  },

  onLoad() {

        this.currentDate = dayjs().format('YYYY-MM-DD')

        this.getList()

  },

  methods: {

    getList() {

            const { activeStatus } = this

      myMeetingPage({

        capacity: 10,

        page: this.page,

        model: {

          queryDate: this.currentDate,

                    status: activeStatus.key || null,

          // roomsId: this.roomId,

          queryType: 1

        }

      }).then(res => {

                this.dataList = res.data.records

            })

    },

    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()

    },

        seletedStatus(e) {

            this.activeStatus = { ...e.value[0] }

            this.isShowStatus = false

            this.getList()

        },

        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;

  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;

                    }

                }

            }

        }

    }

  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 .calendar-point {

    /* background-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;

          }

        }

      }

    }

  }

}

.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>
</style>


 h5/pages/staff/meetingSel.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,322 @@
<template>
  <view class="main_app">
    <view class="search_inp df_ac">
      <image
        class="mr12 search"
        src="../../static/ic_search@2x.png"
        mode="widthFix"
      ></image>
      <input
        v-model="param.keyword"
        @blur="initData()"
        type="text"
        placeholder="搜索"
        placeholder-style="color: #999999;"
      />
    </view>
    <view class="member_list">
      <view v-for="item in memberList" :key="item.id" class="line">
        <image
          :src="
            item.prefixUrl
              ? item.prefixUrl
              : require('@/static/logo@2x.png')
          "
          class="avatar"
          mode=""
        ></image>
        <view class="content">
          <view class="info">
            <text class="name">{{ item.realname }}</text>
            <!-- <text class="tag">tag</text> -->
          </view>
          <view class="depart">{{ item.departmentName }}</view>
        </view>
        <image
          @click="changeMem(item, index)"
          v-if="item.checked"
          src="@/static/meeting/icon/ic_choose_sel@2x.png"
          mode="widthFix"
          class="checked"
        ></image>
        <image
          @click="changeMem(item, index)"
          v-if="!item.checked"
          src="@/static/meeting/icon/ic_choose@2x.png"
          mode="widthFix"
          class="checked"
        ></image>
        <text></text>
      </view>
      <view class="empty"></view>
    </view>
    <!--  -->
    <view class="sub_wrap">
      <view class="sel_mem">
        <text>已选择：</text>
        <view class="members">
                     <text v-for="(item, i) in selList" :key="i">{{ item.realname }}；</text>
        </view>
        <image
          @click="isShowSelMem = true"
          class="open_icon"
          src="../../static/staff/renyuan_ic_open.png"
          mode=""
        ></image>
      </view>
      <view class="btn" @click="onSubmit">确认({{ selList.length }}/20)</view>
    </view>
    <!--  -->
     <u-popup
      :show="isShowSelMem"
      :round="12"
      mode="bottom"
      @close="isShowSelMem = false"
    >
      <view class="modal">
        <view class="modal_header">
          <text class="status">已选择：{{ selList.length }}人</text>
          <text class="btn" @click="isShowSelMem = false">确认</text>
        </view>
        <view class="modal_mem_list">
          <view class="line" v-for="(item, i) in selList" :key="i">
            <image
              :src="
                item.faceImgFull
                  ? item.faceImgFull
                  : require('@/static/logo@2x.png')
              "
              class="avatar"
              mode=""
            ></image>
            <view class="content">
              <view class="info">
                <text class="name">{{ item.realname }}</text>
              </view>
              <view class="depart">{{ item.departmentName }}</view>
            </view>
            <view class="btn" @click="handleRemove(item)">移除</view>
          </view>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import { userPagePost } from '@/api'
export default {
  data() {
    return {
      memberList: [],
      selList: [],
      param: {},
      pagination: {
        page: 1,
        capacity: 20
      },

      isShowSelMem: false
    }
  },
  onLoad(option) {
    this.param = { ...option, keyword: '' }
    this.initData()
  },
  methods: {
    onSubmit() {
            this.$eventBus.$emit('meetingPeo', this.selList)
      uni.navigateBack()
    },
        changeMem(item, index) {
      item.checked = !item.checked
      this.selList = this.memberList.filter(i => i.checked)
      // const arr = e.detail.value
      // let arrTemp = arr.map(item => {
      //   let obj = {}
      //   this.memberList.forEach(ite => {
      //     if (item == ite.id) {
      //       obj.name = ite.name.split('-')[0]
      //       obj.componey = ite.name.split('-')[1] || ''
      //       obj.id = ite.id
      //     }
      //   })
      //   return obj
      // })
      // this.selList = arrTemp
      this.$forceUpdate()
    },
    initData() {
      const { param, pagination } = this
      userPagePost({
        model: { ...param },
        ...pagination,

      }).then(res => {
        this.memberList = res.data.records || []
                this.memberList.map(i => {
                    i.checked = false
                })
      })
    },
        handleRemove(item) {
      this.memberList.forEach(ite => {
        if (item.id === ite.id) {
          ite.checked = false
        }
      })
      // console.log(this.memberList);
      this.$forceUpdate()
    },
  }
};
</script>

<style lang="scss">
.modal {
  padding: 40rpx 30rpx;
  .modal_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    .status {
      font-weight: 600;
    }
    .btn {
      color: $uni-color-primary;
    }
  }
  .modal_mem_list {
    .line {
      display: flex;
      align-items: center;
      border-bottom: 1rpx solid #e5e5e5;
      padding: 30rpx 0;
      .avatar {
        width: 64rpx;
        height: 64rpx;
        border-radius: 50%;
        overflow: hidden;
        margin-right: 20rpx;
      }
      .content {
        flex: 1;
        .depart {
          font-size: 24rpx;
          color: #666666;
        }
        .info {
          display: flex;
          margin-bottom: 16rpx;
          .name {
            font-size: 30rpx;
          }
        }
      }
      .btn {
        width: 80rpx;
        height: 48rpx;
        line-height: 48rpx;
        text-align: center;
        font-size: 24rpx;
        color: #333333;
        border-radius: 4rpx;
        border: 1rpx solid #999999;
      }
    }
  }
}
.sub_wrap {
  position: fixed;
  bottom: 0;
    background-color: #fff;
  left: 0;
  width: 100%;
  box-shadow: 0rpx 0rpx 6rpx 0rpx #b2b2b2;
  padding: 30rpx 30rpx 64rpx;
  .sel_mem {
    display: flex;
    align-items: center;
    .members {
      width: 500rpx;
      color: $uni-color-primary;
      white-space: nowrap;
      overflow: hidden; //文本超出隐藏
      text-overflow: ellipsis;
      margin-right: 20rpx;
    }
    .open_icon {
      width: 44rpx;
      height: 44rpx;
    }
  }
  .btn {
    width: 690rpx;
    height: 88rpx;
    line-height: 88rpx;
    background: $uni-color-primary;
    border-radius: 44rpx;
    color: #fff;
    text-align: center;
    margin-top: 22rpx;
  }
}
.member_list {
  .line {
    display: flex;
    align-items: center;
    border-bottom: 1rpx solid #e5e5e5;
    padding: 30rpx 0;
    .avatar {
      width: 64rpx;
      height: 64rpx;
      border-radius: 50%;
      overflow: hidden;
      margin-right: 20rpx;
    }
    .content {
      flex: 1;
      .depart {
        font-size: 24rpx;
        color: #666666;
      }
      .info {
        display: flex;
        margin-bottom: 16rpx;
        .name {
          font-size: 30rpx;
        }
        .tag {
          font-size: 24rpx;
          border-radius: 4rpx;
          border: 1rpx solid #f62710;
          color: #f62710;
          padding: 0rpx 6rpx;
          margin-left: 8rpx;
        }
      }
    }
        .checked{
      width: 48rpx;
    }
  }
  .empty {
    width: 100%;
    height: 280rpx;
  }
}
.search_inp {
  height: 72rpx;
  background: #f7f7f7;
  border-radius: 4rpx;
  padding-left: 16rpx;
  .search {
    width: 28rpx;
  }
  input {
    flex: 1;
    font-size: 28rpx;
    color: #333333;
  }
}
</style>

 h5/pages/staff/meetingSub.vue

@@ -1,254 +1,387 @@
<template>
    <view class="main_app">
        <view class="heade_title">
            <image class="icon" src="../../static/staff/ar_left@2x.png" @click="changeDate(-1)" mode="widthFix"></image>
            <text class="date">{{ activeDateCum }}</text>
            <image class="icon" src="../../static/staff/ar_right@2x.png" @click="changeDate(1)" mode="widthFix"></image>
        </view>
        <!--  -->
        <view class="meeting_list">
            <view class="item" :class="{active: i === 0}" v-for="item,i in meetingList" :key="i">
                <view class="name">{{ item.name }}</view>
                <view class="line"></view>
            </view>
        </view>
        <!--  -->
        <view class="time_list">
            <view class="item" v-for="item,i in timeList" :key="i">{{ item.time }}</view>
        </view>
        <!--  -->
        <view class="main_footer">
            <view class="df_ac">
                <view>已选择：</view>
                <view class="sel_time">xxxxxx</view>
            </view>
            <view class="btns">
                <view class="left">
                    <view class="item" v-for="item in colorOptions" :key="item.name">
                        <view class="box" :style="{ background: item.color }"></view>
                        <view class="">{{ item.name }}</view>
                    </view>
                </view>
                <view class="sub" @click="$jump('/pages/staff/meetingSubOrder')">确认预约</view>
            </view>
        </view>
        <!--  -->
        <u-popup :show="isShowDetail" :round="12" mode="bottom" @close="isShowDetail = false">
            <view class="detail_modal">
                <view class="title">会议室预约情况</view>
                <view class="h1">讨论xxxxx选型</view>
                <view class="line">
                    <view class="label">会议时间</view>
                    <view class="value">00000</view>
                </view>
                <view class="line">
                    <view class="label">会议室</view>
                    <view class="value">00000</view>
                </view>
                <view class="line">
                    <view class="label">预约人</view>
                    <view class="value">00000</view>
                </view>
                <view class="btn" @click="isShowDetail = false">关闭</view>
            </view>
        </u-popup>
    </view>
  <view class="main_app">
    <view class="heade_title">
      <image
        class="icon"
        src="../../static/staff/ar_left@2x.png"
        @click="changeDate(-1)"
        mode="widthFix"
      ></image>
      <text class="date">{{ activeDateCum }}</text>
      <image
        class="icon"
        src="../../static/staff/ar_right@2x.png"
        @click="changeDate(1)"
        mode="widthFix"
      ></image>
    </view>
    <!--  -->
    <view class="meeting_list">
      <view
        @click="roomClick(item)"
        class="item"
        :class="{ active: activeRoom.roomId === item.id }"
        v-for="(item, i) in meetingList"
        :key="i"
      >
        <view class="name">{{ item.name }}</view>
        <view class="line"></view>
      </view>
    </view>
    <!--  -->
    <view class="time_list">
      <view
        @click="datetimeClick(item, i)"
        class="item"
        :class="{ disable: item.isUse, active: item.checked == '1' }"
        v-for="(item, i) in timeList"
        :key="i"
      >
        {{ item.startTime }}-{{ item.endTime }}
      </view>
    </view>
    <!--  -->
    <view class="main_footer">
      <view class="df_ac">
        <view>已选择：</view>
        <view class="sel_time">{{ selDatetime }}</view>
      </view>
      <view class="btns">
        <view class="left">
          <view class="item" v-for="item in colorOptions" :key="item.name">
            <view class="box" :style="{ background: item.color }"></view>
            <view class="">{{ item.name }}</view>
          </view>
        </view>
        <view class="sub" @click="onSubmit"
          >确认预约</view
        >
      </view>
    </view>
    <!--  -->
    <u-popup
      :show="isShowDetail"
      :round="12"
      mode="bottom"
      @close="isShowDetail = false"
    >
      <view class="detail_modal">
        <view class="title">会议室预约情况</view>
        <view class="h1">讨论xxxxx选型</view>
        <view class="line">
          <view class="label">会议时间</view>
          <view class="value">00000</view>
        </view>
        <view class="line">
          <view class="label">会议室</view>
          <view class="value">00000</view>
        </view>
        <view class="line">
          <view class="label">预约人</view>
          <view class="value">00000</view>
        </view>
        <view class="btn" @click="isShowDetail = false">关闭</view>
      </view>
    </u-popup>
  </view>
</template>

<script>
    import dayjs from 'dayjs'
    export default {
        data() {
            return {
                activeDate: '',
                isShowDetail: false,
                meetingList: [
                    { name: '201会议室' },
                    { name: '201会议室' },
                    { name: '201会议室' },
                    { name: '201会议室' },
                ],
                timeList: [
                    { time: '08:30-09:00' },
                    { time: '08:30-09:00' },
                    { time: '08:30-09:00' },
                    { time: '08:30-09:00' },
                ],
				
                colorOptions: [
                    { color: '#279BAA', name: '已选择' },
                    { color: '#F7F7F7', name: '可预约' },
                    { color: '#cccccc', name: '不可预约' },
                ]
				
            };
        },
        computed: {
            activeDateCum(){
                const { activeDate } = this
                let weeks = ['周日', '周一','周二','周三','周四','周五','周六']
                return dayjs(activeDate).format('YYYYå¹´M月D日') + ' ' + weeks[dayjs(activeDate).day()]
import dayjs from 'dayjs'
import {
  roomsListPost,
  getRoomUseTime,
    meetingDetail
} from '@/api'
export default {
  data() {
    return {
      activeRoom: {
        yudingDate: ''
      },
            selDatetime: '',
      isShowDetail: false,
      meetingList: [],
      timeList: [],

      colorOptions: [
        { color: this.$store.state.primaryColor, name: '已选择' },
        { color: '#F7F7F7', name: '可预约' },
        { color: '#cccccc', name: '不可预约' },
      ]

    }
  },
  computed: {
    activeDateCum() {
      const yudingDate = this.activeRoom.yudingDate
      let weeks = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
      return dayjs(yudingDate).format('YYYYå¹´M月D日') + ' ' + weeks[dayjs(yudingDate).day()]
    }
  },
  onLoad() {
    this.activeRoom.yudingDate = dayjs().format('YYYY-MM-DD')
    this.getRoomList()
  },
  methods: {
    roomClick(item) {
      this.$set(this.activeRoom, 'roomId', item.id)
      this.$set(this.activeRoom, 'roomName', item.name)
    },
        onSubmit() {
            const { activeRoom } = this
      const selTimeList = this.timeList.filter(i => i.checked == '1')
      if (selTimeList.length == -1) {
        return uni.showToast({
          title: '请先选择会议时段',
          icon: 'none'
        })
      }
            const obj = {
                startTime: selTimeList[0].startTime,
                endTime: selTimeList[selTimeList.length - 1].endTime,
            }
        },
        created() {
            this.activeDate = dayjs().format('YYYY-MM-DD')
        },
        methods: {
            changeDate(num){
                const { activeDate } = this
                let fn = num > 0 ? 'add' : 'subtract'
                this.activeDate = dayjs(activeDate)[fn](1, 'days').format('YYYY-MM-DD')
            uni.navigateTo({
                url: `/pages/staff/meetingSubOrder?yudingDate=${activeRoom.yudingDate}&roomName=${activeRoom.roomName}&roomId=${activeRoom.roomId}&startTime=${obj.startTime}&endTime=${obj.endTime}`
            })
      // this.$jump('/pages/staff/vehicle/apply')
    },
    getRoomList() {
      roomsListPost({}).then(res => {
        this.meetingList = res.data || []
        if (this.meetingList.length > 0) {
          this.$set(this.activeRoom, 'roomId', this.meetingList[0].id)
          this.$set(this.activeRoom, 'roomName', this.meetingList[0].name)
          this.getRoomTime()
        }
      })
    },
    getRoomTime() {
      const { activeRoom } = this
      getRoomUseTime({
        ...activeRoom
      }).then(res => {
        this.timeList = res.data || []
        this.timeList.forEach((i, j) => {
          i.checked = '0',
            i.index = j
        })
      })
    },
    datetimeClick(item, index) {
      if (item.isUse == '1') return
            if(item.isChoose){
                this.getDetail(item.id)
                return
            }
        }
    }
      const { timeList } = this
      const selTimeList = timeList.filter(i => i.checked == '1')
      if (selTimeList.length === 0) {
        this.timeList.forEach((ite, i) => {
          if (i === index) {
            ite.checked = '1'
            this.$forceUpdate()
          }
        })
      } else {
        const findIndex = selTimeList.findIndex(i => i.index === index)
        console.log('findIndex', findIndex)
        if (findIndex === -1) {
          const startNum = index - selTimeList[0].index
          const endNum = index - selTimeList[selTimeList.length - 1].index
          if (startNum == 1 || startNum == -1 || endNum == 1 || endNum == -1) {
            console.log('相邻')
            item.checked = true
            this.$forceUpdate()
          } else {
            return uni.showToast({
              title: '请选择相邻的时间段',
              icon: 'none'
            })
          }
        } else {
          if (index === selTimeList[0].index || index === selTimeList[selTimeList.length - 1].index) {
            item.checked = false
            this.$forceUpdate()
          } else {
            return uni.showToast({
              title: '请先取消最外层的时间段',
              icon: 'none'
            })
          }

        }
      }
      const selTimeLists = this.timeList.filter(i => i.checked == '1')
      // console.log('selTimeList', selTimeList);
      if (selTimeLists.length === 0) {
        this.selDatetime = ''
      } else {
        this.selDatetime = this.activeRoom.roomName + ' | ' + selTimeLists[0].startTime + '-' + selTimeLists[selTimeLists.length - 1].endTime
      }
    },
    changeDate(num) {
      const yudingDate = this.activeRoom.yudingDate
      let fn = num > 0 ? 'add' : 'subtract'
      this.yudingDate = dayjs(yudingDate)[fn](1, 'days').format('YYYY-MM-DD')
      this.getRoomList()
    },
        getDetail(id) {
            meetingDetail({
                id
            })
        },
  }
}
</script>

<style lang="scss">
    .detail_modal{
        padding: 40rpx 30rpx;
        .title{
            text-align: center;
            font-weight: 500;
            font-size: 32rpx;
            margin-bottom: 40rpx;
        }
        .h1{
            font-weight: 500;
            font-size: 32rpx;
            margin-bottom: 30rpx;
        }
        .line{
            display: flex;
            margin-bottom: 20rpx;
            .label{
                width: 140rpx;
                color: #888888;
            }
            .value{
                color: #333333;
            }
        }
        .btn{
            margin-top: 230rpx;
            width: 690rpx;
            height: 88rpx;
            line-height: 88rpx;
            text-align: center;
            background: #279BAA;
            border-radius: 44rpx;
            font-weight: 500;
            font-size: 32rpx;
            color: #FFFFFF;
        }
    }
    .main_footer{
        position: absolute;
        width: 100%;
        left: 0;
        bottom: 0;
        padding: 20rpx 30rpx 84rpx;
        box-shadow: 0rpx -3rpx 6rpx 0rpx #EEEEEE;
        .sel_time{
            color: #279BAA;
        }
        .btns{
            margin-top: 10rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .left{
                display: flex;
                .item{
                    display: flex;
                    align-items: center;
                    margin-right: 20rpx;
                    .box{
                        margin-right: 10rpx;
                        width: 32rpx;
                        height: 32rpx;
                    }
                }
            }
            .sub{
                width: 184rpx;
                height: 72rpx;
                line-height: 72rpx;
                text-align: center;
                background: #279BAA;
                box-shadow: 0rpx -1rpx 0rpx 0rpx #EEEEEE;
                border-radius: 36rpx;
                font-size: 30rpx;
                color: #FFFFFF;
            }
        }
    }
    .time_list{
        display: flex;
        justify-content: space-between;
        padding: 30rpx;
        flex-wrap: wrap;
        .item{
            width: 220rpx;
            height: 80rpx;
            line-height: 80rpx;
            text-align: center;
            background: #F7F7F7;
            border-radius: 4rpx;
            margin-bottom: 24rpx;
            font-size: 30rpx;
        }
        .active{
            background-color: #279BAA;
            color: #fff;
        }
        .disable{
            background-color: #cccccc;
            color: #999999;
        }
    }
    .meeting_list{
        display: flex;
        padding-left: 30rpx;
        width: 720rpx;
        overflow-x: auto;
        border-bottom: 1rpx solid #E5E5E5;
        .item{
            flex-shrink: 0;
            margin-right: 60rpx;
            padding: 30rpx 0 0;
            .line{
                width: 60rpx;
                height: 4rpx;
                background-color: #fff;
                margin: 26rpx auto 0;
            }
        }
        .active{
            color: #279BAA;
            font-weight: 600;
            font-size: 30rpx;
            .line{
                width: 60rpx;
                height: 4rpx;
                background-color: #279BAA;
                margin: 26rpx auto 0;
            }
        }
    }
    .main_app{
        padding: 0;
    }
.heade_title{
    display: flex;
    justify-content: center;
    align-items: center;
    .date{
        margin: 0 24rpx;
        font-weight: 600;
        font-size: 32rpx;
    }
    .icon{
        width: 30rpx;
    }
.detail_modal {
  padding: 40rpx 30rpx;
  .title {
    text-align: center;
    font-weight: 500;
    font-size: 32rpx;
    margin-bottom: 40rpx;
  }
  .h1 {
    font-weight: 500;
    font-size: 32rpx;
    margin-bottom: 30rpx;
  }
  .line {
    display: flex;
    margin-bottom: 20rpx;
    .label {
      width: 140rpx;
      color: #888888;
    }
    .value {
      color: #333333;
    }
  }
  .btn {
    margin-top: 230rpx;
    width: 690rpx;
    height: 88rpx;
    line-height: 88rpx;
    text-align: center;
    background: $uni-color-primary;
    border-radius: 44rpx;
    font-weight: 500;
    font-size: 32rpx;
    color: #ffffff;
  }
}
.main_footer {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
    background-color: #fff;
  padding: 20rpx 30rpx 84rpx;
  box-shadow: 0rpx -3rpx 6rpx 0rpx #eeeeee;
  .sel_time {
    color: $uni-color-primary;
  }
  .btns {
    margin-top: 10rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .left {
      display: flex;
      .item {
        display: flex;
        align-items: center;
        margin-right: 20rpx;
        .box {
          margin-right: 10rpx;
          width: 32rpx;
          height: 32rpx;
        }
      }
    }
    .sub {
      width: 184rpx;
      height: 72rpx;
      line-height: 72rpx;
      text-align: center;
      background: $uni-color-primary;
      box-shadow: 0rpx -1rpx 0rpx 0rpx #eeeeee;
      border-radius: 36rpx;
      font-size: 30rpx;
      color: #ffffff;
    }
  }
}
.time_list {
  display: flex;
  justify-content: space-between;
  padding: 30rpx;
  flex-wrap: wrap;
  .item {
    width: 220rpx;
    height: 80rpx;
    line-height: 80rpx;
    text-align: center;
    background: #f7f7f7;
    border-radius: 4rpx;
    margin-bottom: 24rpx;
    font-size: 30rpx;
  }
  .active {
    background-color: $uni-color-primary;
    color: #fff;
  }
  .disable {
    background-color: #cccccc;
    color: #999999;
  }
}
.meeting_list {
  display: flex;
  padding-left: 30rpx;
  width: 720rpx;
  overflow-x: auto;
  border-bottom: 1rpx solid #e5e5e5;
  .item {
    flex-shrink: 0;
    margin-right: 60rpx;
    padding: 30rpx 0 0;
    .line {
      width: 60rpx;
      height: 4rpx;
      background-color: #fff;
      margin: 26rpx auto 0;
    }
  }
  .active {
    color: $uni-color-primary;
    font-weight: 600;
    font-size: 30rpx;
    .line {
      width: 60rpx;
      height: 4rpx;
      background-color: $uni-color-primary;
      margin: 26rpx auto 0;
    }
  }
}
.main_app {
  padding: 0;
}
.heade_title {
  display: flex;
  justify-content: center;
  align-items: center;
  .date {
    margin: 0 24rpx;
    font-weight: 600;
    font-size: 32rpx;
  }
  .icon {
    width: 30rpx;
  }
}
</style>

 h5/pages/staff/meetingSubOrder.vue

@@ -1,145 +1,249 @@
<template>
    <view class="main_app">
        <view class="module_list">
            <view class="item">
                <view class="name">会议时间</view>
                <view class="line">
                    <view class="label">2022å¹´22月2日 1000000000</view>
                    <u-icon name="arrow-right" color="#999999" size="14" />
                </view>
            </view>
            <view class="item">
                <view class="name">会议室</view>
                <view class="line">
                    <view class="label">aaaaaaaa</view>
                </view>
            </view>
            <view class="item">
                <view class="name">预约人</view>
                <view class="line">
                    <view class="label">aaaaaaaa</view>
                </view>
            </view>
            <view class="empty"></view>
            <view class="item">
                <view class="name">
                    <text>会议主题</text>
                    <text class="star">*</text>
                </view>
                <view class="line">
                    <input type="text" v-model="param.aaa" placeholder="请输入会议主题" placeholder-class="placeholder9" class="label">
                </view>
            </view>
            <view class="item">
                <view class="name">
                    <text>会议内容</text>
                </view>
                <view class="line">
                    <u-textarea border="none" v-model="param.aaa" count :maxlength="300" placeholder="请输入会议内容" placeholder-class="placeholder9" class="label" />
                </view>
            </view>
            <view class="empty"></view>
            <view class="item">
                <view class="name">参会人员</view>
                <view class="line">
                    <view class="label">
                        <text v-if="false">moumoumou</text>
                        <text v-else class="placeholder9" @click="$jump('/pages/staff/memberSel')">请选择</text>
                    </view>
                    <u-icon name="arrow-right" color="#999999" size="14" @click="$jump('/pages/staff/memberSel')" />
                </view>
            </view>
            <view class="item">
                <view class="name">选择服务项</view>
                <view class="line">
                    <view class="label">
                        <view class="service_item" v-for="(item,index) in serviceOps" :key="index">
                            {{ item.value }}
                        </view>
                    </view>
                </view>
            </view>
            <view class="item">
                <view class="name">
                    <text>备注</text>
                </view>
                <view class="line">
                    <textarea v-model="param.as" :maxlength="-1" placeholder="请输入" placeholder-class="placeholder9" class="label" />
                </view>
            </view>
			
            <view class="sub_btn">
                ç¡®è®¤é¢„约
            </view>
			
        </view>
    </view>
  <view class="main_app">
    <view class="module_list">
      <view class="item">
        <view class="name">会议时间</view>
        <view class="line">
          <view class="label">
            {{ param.activeDate }} {{ param.startTime }}-{{ param.endTime }}
          </view>
          <u-icon name="arrow-right" color="#999999" size="14" />
        </view>
      </view>
      <view class="item">
        <view class="name">会议室</view>
        <view class="line">
          <view class="label">{{ param.roomName }}</view>
        </view>
      </view>
      <view class="item">
        <view class="name">预约人</view>
        <view class="line">
          <view class="label">{{ userInfo.realname }}</view>
        </view>
      </view>
      <view class="empty"></view>
      <view class="item">
        <view class="name">
          <text>会议主题</text>
          <text class="star">*</text>
        </view>
        <view class="line">
          <input
            type="text"
            v-model="param.name"
            placeholder="请输入会议主题"
            placeholder-class="placeholder9"
            class="label"
          />
        </view>
      </view>
      <view class="item">
        <view class="name">
          <text>会议内容</text>
        </view>
        <view class="line">
          <u-textarea
            border="none"
            v-model="param.content"
            count
            :maxlength="300"
            placeholder="请输入会议内容"
            placeholder-class="placeholder9"
            class="label"
          />
        </view>
      </view>
      <view class="empty"></view>
      <view class="item">
        <view class="name">参会人员</view>
        <view class="line" @click="selPeople">
          <view class="label">
            <text v-if="param.sysList && param.sysList.length > 0">
                            {{ param.sysList.map(i=>i.realname).join(',') }}
                        </text>
            <text
              v-else
              class="placeholder9"
              @click="$jump('/pages/staff/memberSel')"
              >请选择</text
            >
          </view>
          <u-icon
            name="arrow-right"
            color="#999999"
            size="14"
            @click="$jump('/pages/staff/memberSel')"
          />
        </view>
      </view>
      <view class="item">
        <view class="name">选择服务项</view>
        <view class="line">
          <view class="label">
            <view
              class="service_item"
                            :class="{active: item.checked}"
              v-for="(item, index) in info.projectList"
              :key="index"
                            @click="serviceClick(item)"
            >
              {{ item.projectName }}
            </view>
          </view>
        </view>
      </view>
      <view class="item">
        <view class="name">
          <text>备注</text>
        </view>
        <view class="line">
          <textarea
            v-model="param.remark"
            :maxlength="-1"
            placeholder="请输入"
            placeholder-class="placeholder9"
            class="label"
          />
        </view>
      </view>

      <view class="sub_btn" @click="onSubmit"> ç¡®è®¤é¢„约 </view>
    </view>
  </view>
</template>

<script>
    export default {
        data() {
            return {
                param: {},
                serviceOps: [
                    { key: '0', value: '席卡' },
                    { key: '1', value: '投影仪' },
                    { key: '2', value: '笔记本电脑' },
                ]
            };
        }
    }
import {
  reservationMeeting,
  getRoomDetail
} from '@/api'
import dayjs from 'dayjs'
export default {
  data() {
    return {
      param: {},
      userInfo: uni.getStorageSync('userInfo'),
            info: {},
    }
  },
  onLoad(option) {
    this.param = { ...option }
    this.$set(this.param, 'activeDate', dayjs(option.yudingDate).format('YYYYå¹´M月D日'))
        this.initOption()
  },
    mounted() {
    this.$eventBus.$on('meetingPeo', (res) => {
      this.$set(this.param, 'sysList', res)
      // this.$set(this.param, 'memberIds', res.map(i => i.id).join(','))
      // this.$set(this.param, 'memberNames', res.map(i => i.name).join(','))
    })
  },
  methods: {
        onSubmit() {
            const { param, info } = this
            if (!param.name) return uni.showToast({
        title: '请输入会议主题',
        icon: 'none'
      })
            reservationMeeting({
                ...param,
                startTime: `${param.yudingDate} ${param.startTime}:00`,
                endTime: `${param.yudingDate} ${param.endTime}:00`,
                projectList: info.projectList.filter(i => i.checked),
            }).then(res => {
                if(res.code === 200){

                }
            })
        },
    selPeople() {
            const { param } = this
            let startTime = param.yudingDate + ' ' + param.startTime
            let endTime = param.yudingDate + ' ' + param.endTime
      uni.navigateTo({
        url: `/pages/staff/meetingSel?startTime=${startTime}&endTime=${endTime}`
      })
    },
        serviceClick(item) {
            const { info } = this
            info.projectList.forEach(ite => {
                if(ite.projectId === item.projectId){
                    ite.checked = !ite.checked
                }
            })
            this.$forceUpdate()
        },
    initOption() {
            const roomId = Number(this.param.roomId)
      getRoomDetail({ roomId }).then(res => {
        res.data.projectList.forEach(item => {
          item.active = false
        })
        this.info = res.data
                if(this.info && this.info.projectList){
                    this.info.projectList.forEach(i => {
                        i.checked = false
                    })
                }
      })
    }
  }
}
</script>

<style lang="scss">
.module_list{
    .item{
        border-bottom: 1rpx solid #E5E5E5;
        padding: 30rpx 0;
        .name{
            color: #666666;
            margin-bottom: 30rpx;
        }
        .line{
            display: flex;
            .label{
                flex: 1;
                display: flex;
                align-items: center;
                .service_item{
                    height: 64rpx;
                    line-height: 64rpx;
                    background: #F7F7F7;
                    border-radius: 4rpx;
                    padding: 0 24rpx;
                    margin-right: 20rpx;
.module_list {
  .item {
    border-bottom: 1rpx solid #e5e5e5;
    padding: 30rpx 0;
    .name {
      color: #666666;
      margin-bottom: 30rpx;
    }
    .line {
      display: flex;
      .label {
        flex: 1;
        display: flex;
        align-items: center;
        .service_item {
          height: 64rpx;
          line-height: 64rpx;
          background: #f7f7f7;
          border-radius: 4rpx;
          padding: 0 24rpx;
          margin-right: 20rpx;
        }
                .active{
                    background-color: #4d99a8;
                    color: #fff;
                }
            }
			
        }
    }
    padding-bottom: 100rpx;
      }
    }
  }
  padding-bottom: 100rpx;
}
.empty {
    width: 750rpx;
    height: 20rpx;
    background-color: #f7f7f7;
    margin: 0 -30rpx;
  width: 750rpx;
  height: 20rpx;
  background-color: #f7f7f7;
  margin: 0 -30rpx;
}
.sub_btn{
                width: 690rpx;
                height: 72rpx;
                line-height: 72rpx;
                text-align: center;
                background: #279BAA;
                box-shadow: 0rpx -1rpx 0rpx 0rpx #EEEEEE;
                border-radius: 36rpx;
                font-size: 30rpx;
                color: #FFFFFF;
                margin-top: 20rpx;
            }
.star{
    margin-left: 4rpx;
    color: #e42d2d;
.sub_btn {
  width: 690rpx;
  height: 72rpx;
  line-height: 72rpx;
  text-align: center;
  background: $uni-color-primary;
  box-shadow: 0rpx -1rpx 0rpx 0rpx #eeeeee;
  border-radius: 36rpx;
  font-size: 30rpx;
  color: #ffffff;
  margin-top: 20rpx;
}
.star {
  margin-left: 4rpx;
  color: #e42d2d;
}
</style>

 h5/pages/staff/memberSel copy.vue

ÎļþÒÑɾ³ý

 h5/pages/staff/memberSel.vue

@@ -144,7 +144,7 @@
      font-weight: 600;
    }
    .btn {
      color: #279baa;
      color: $uni-color-primary;
    }
  }
  .modal_mem_list {
@@ -199,7 +199,7 @@
    align-items: center;
    .members {
      width: 500rpx;
      color: #4d98a7;
      color: $uni-color-primary;
      white-space: nowrap;
      overflow: hidden; //文本超出隐藏
      text-overflow: ellipsis;
@@ -214,7 +214,7 @@
    width: 690rpx;
    height: 88rpx;
    line-height: 88rpx;
    background: #279baa;
    background: $uni-color-primary;
    border-radius: 44rpx;
    color: #fff;
    text-align: center;

 h5/pages/staff/snapshot.vue

@@ -412,7 +412,7 @@
    height: 88rpx;
    line-height: 88rpx;
    text-align: center;
    background: #4e99a9;
    background: $uni-color-primary;
    border-radius: 44rpx;
    font-size: 32rpx;
    color: #ffffff;

 h5/pages/staff/task/index.vue

@@ -332,7 +332,7 @@
            padding: 0 32rpx;
            height: 60rpx;
            line-height: 60rpx;
            background: #279baa;
            background: $uni-color-primary;
            color: #fff;
            font-size: 26rpx;
            font-weight: 300;

 h5/pages/staff/task/visitorApprove.vue

@@ -206,7 +206,7 @@
                        color: #777777;

                        .status {
                            color: #279BAA;
                            color: $uni-color-primary;
                        }
                    }

@@ -311,7 +311,7 @@
            padding: 0 32rpx;
            border-radius: 0rpx 0rpx 0rpx 30rpx;
            background-color: #e9edff;
            color: #279BAA;
            color: $uni-color-primary;
        }
    }

@@ -333,9 +333,9 @@
        }

        .agree {
            background: #279BAA;
            background: $uni-color-primary;
            color: #fff;
            border: 1rpx solid #279BAA;
            border: 1rpx solid $uni-color-primary;
        }
    }


 h5/pages/staff/vehicle/applePeo.vue

@@ -15,30 +15,40 @@
      />
    </view>
    <view class="member_list">
      <checkbox-group v-model="selList" @change="changeMem">
        <view v-for="item in memberList" :key="item.id" class="line">
          <image
            :src="
              item.faceImgFull
                ? item.faceImgFull
                : require('@/static/logo@2x.png')
            "
            class="avatar"
            mode=""
          ></image>
          <view class="content">
            <view class="info">
              <text class="name">{{ item.name }}</text>
              <!-- <text class="tag">tag</text> -->
            </view>
            <view class="depart">{{ item.companyName }}</view>
      <view v-for="(item, index) in memberList" :key="item.id" class="line">
        <image
          :src="
            item.faceImgFull
              ? item.faceImgFull
              : require('@/static/logo@2x.png')
          "
          class="avatar"
          mode=""
        ></image>
        <view class="content">
          <view class="info">
            <text class="name">{{ item.name }}</text>
            <!-- <text class="tag">tag</text> -->
          </view>
          <label>
            <checkbox :checked="item.checked" :value="String(item.id)" class="checkbox" />
          </label>
          <text></text>
          <view class="depart">{{ item.companyName }}</view>
        </view>
      </checkbox-group>
        <image
          @click="changeMem(item, index)"
          v-if="item.checked"
          src="@/static/meeting/icon/ic_choose_sel@2x.png"
          mode="widthFix"
          class="checked"
        ></image>
        <image
          @click="changeMem(item, index)"
          v-if="!item.checked"
          src="@/static/meeting/icon/ic_choose@2x.png"
          mode="widthFix"
          class="checked"
        ></image>
        <text></text>
      </view>

      <view class="empty"></view>
    </view>
    <!--  -->
@@ -55,7 +65,7 @@
          mode=""
        ></image>
      </view>
      <view class="btn" @click="onSubmit">确认({{selList.length}}/20)</view>
      <view class="btn" @click="onSubmit">确认({{ selList.length }}/20)</view>
    </view>
    <!--  -->
    <u-popup
@@ -100,8 +110,8 @@
  data() {
    return {
      memberList: [],
      selList: [],
      param: {},
      selList: [],

      isShowSelMem: false
    }
@@ -109,32 +119,42 @@
  onLoad() {
    this.initData()
  },
  mounted() {
    this.$eventBus.$on('applePeoDetail', (res)=>{
      res.forEach(item => {
        this.changeMem(item)
      })
      this.$nextnick(() => {
        this.$forceUpdate()
      })
    })
  },
  methods: {
    onSubmit() {
      this.$eventBus.$emit('applePeo', this.selList)
      uni.navigateBack()
    },
    changeMem(e) {
      const arr = e.detail.value
      let arrTemp = arr.map(item => {
        let obj = {}
        this.memberList.forEach(ite => {
          if (item == ite.id) {
            obj.name = ite.name.split('-')[0]
            obj.componey = ite.name.split('-')[1] || ''
            obj.id = ite.id
          }
        })
        return obj
      })
      this.selList = arrTemp
      // this.$forceUpdate()
    changeMem(item, index) {
      item.checked = !item.checked
      this.selList = this.memberList.filter(i => i.checked)
      // const arr = e.detail.value
      // let arrTemp = arr.map(item => {
      //   let obj = {}
      //   this.memberList.forEach(ite => {
      //     if (item == ite.id) {
      //       obj.name = ite.name.split('-')[0]
      //       obj.componey = ite.name.split('-')[1] || ''
      //       obj.id = ite.id
      //     }
      //   })
      //   return obj
      // })
      // this.selList = arrTemp
      this.$forceUpdate()
    },
    handleRemove(item) {
      const selIndex = this.selList.findIndex(i => i.id === item.id)
      this.selList.splice(selIndex, 1)
      this.memberList.forEach(ite => {
        if(item.id === ite.id){
        if (item.id === ite.id) {
          ite.checked = false
        }
      })
@@ -168,7 +188,7 @@
      font-weight: 600;
    }
    .btn {
      color: #279baa;
      color: $uni-color-primary;
    }
  }
  .modal_mem_list {
@@ -225,7 +245,7 @@
    align-items: center;
    .members {
      width: 500rpx;
      color: #4d98a7;
      color: $uni-color-primary;
      white-space: nowrap;
      overflow: hidden; //文本超出隐藏
      text-overflow: ellipsis;
@@ -240,7 +260,7 @@
    width: 690rpx;
    height: 88rpx;
    line-height: 88rpx;
    background: #279baa;
    background: $uni-color-primary;
    border-radius: 44rpx;
    color: #fff;
    text-align: center;
@@ -282,6 +302,9 @@
        }
      }
    }
    .checked{
      width: 48rpx;
    }
  }
  .empty {
    width: 100%;

 h5/pages/staff/vehicle/apply.vue

@@ -80,7 +80,7 @@
          <text>*</text>
          <text>乘车人员</text>
        </view>
        <view class="value" @click="$jump('/pages/staff/vehicle/applePeo')">
        <view class="value" @click="selPeople">
          <text
            class="mr6"
            :style="{
@@ -200,6 +200,12 @@
        }
      })
    },
    selPeople() {
      if(this.param.memberList && this.param.memberList.length > 0){
        this.$eventBus.$emit('applePeoDetail', this.param.memberList)
      }
      this.$jump('/pages/staff/vehicle/applePeo')
    },
    confirmDate(e) {

      this.param.planUseDate = dayjs(e.value).format('YYYY-MM-DD HH:mm')
@@ -281,7 +287,7 @@
  height: 88rpx;
  line-height: 88rpx;
  text-align: center;
  background: #279baa;
  background: $uni-color-primary;
  box-shadow: 0rpx -1rpx 0rpx 0rpx #eeeeee;
  border-radius: 44rpx;
  font-size: 30rpx;

 h5/pages/staff/vehicle/sendACar.vue

@@ -18,6 +18,7 @@
        class="box_list_item"
        v-for="(item, index) in dataList"
        :key="index"
                @click="itemDetail(item)"
      >
        <view class="box_list_item_head">
          <text>{{ item.carCode }}</text>
@@ -118,6 +119,11 @@
        this.total = res.data.total
      })
    },
        itemDetail(item) {
            uni.navigateTo({
                url: "/pages/staff/vehicle/sendACarDetail?id=" + item.id
            })
        },
    seletedCar(e) {
      const item = e.value[0]
      this.$set(this.param, 'carCode', item.code)

 h5/pages/staff/vehicle/sendACarDetail.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,407 @@
<template>
  <view class="main_app">
    <view class="status_wrap">
      <view class="name">{{ info.memberName }}的用车申请</view>
      <view class="placeholder9">{{ info.companyName }}</view>
      <view class="status">
        <text class="loading" v-if="info.status == '0'">申请中</text>
        <text class="grr" v-if="info.status == '1'">审批中</text>
        <text class="grr" v-if="info.status == '2'">审批通过</text>
        <text class="error" v-if="info.status == '3'">审批不通过</text>
        <text class="grr" v-if="info.status == '4'">已取消</text>
      </view>
    </view>
    <!--  -->
    <view class="emyty"></view>
    <view class="module_list">
      <view class="item">
        <view class="label">预计用车时段</view>
        <view class="value">{{ info.startTime.slice(0, 16) }}至{{ info.endTime.slice(0, 16) }}</view>
      </view>
            <view class="item">
        <view class="label">预计出发时间</view>
        <view class="value">{{ info.planUseDate }}</view>
      </view>
            <view class="item">
        <view class="label">乘车人员</view>
        <view class="value">{{ info.memberNames }}</view>
      </view>
      <view class="item">
        <view class="label">目的地</view>
        <view class="value">{{ info.type == '1' ? '市外' : '室内' }}：{{ info.addr }}</view>
      </view>
      <view class="item">
        <view class="label">用车事由</view>
        <view class="value">{{ info.content }}</view>
      </view>
      <view class="item">
        <view class="label">车辆信息</view>
        <view class="value">{{ info.carCode }}</view>
      </view>
      <view class="item">
        <view class="label">司机信息</view>
        <view class="value">{{ info.driverName }} {{ info.driverPhone }}</view>
      </view>
    </view>
    <!-- æµç¨‹ -->
    <view class="flow_wrap">
      <view class="flow_title">流程</view>
      <view class="list">
        <view class="item">
          <view class="avatar">
            <image class="img" src="@/static/logo@2x.png" mode="widthFix" />
            <image
              class="status"
              src="@/static/staff/liucheng_success@2x.png"
              mode="widthFix"
            />
            <view class="separate"></view>
          </view>
          <view class="content">
            <view class="head">
              <view class="event">某某提交的拜访申请</view>
              <view class="time">time</view>
            </view>
            <view class="name_wrap">
              <text>李东(<text class="status">处理中</text>)</text>
            </view>
            <view class="remark">同意放行</view>
          </view>
        </view>
        <view class="item">
          <view class="avatar">
            <image class="img" src="@/static/logo@2x.png" mode="widthFix" />
            <image
              class="status"
              src="@/static/staff/liucheng_success@2x.png"
              mode="widthFix"
            />
          </view>
          <view class="content">
            <view class="head">
              <view class="event">某某提交的拜访申请</view>
              <view class="time">time</view>
            </view>
            <view class="name_wrap">
              <text>李东(<text class="status">处理中</text>)</text>
            </view>
            <view class="carbon">
              <view class="carbon_item" v-for="i in 12">
                <image
                  src="../../../static/logo@2x.png"
                  mode="widthFix"
                ></image>
                <view class="text">name</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="emyty"></view>
    <view class="main_footer">
      <view class="btn" @click="handleSub('0')">拒绝</view>
      <view class="btn agree" @click="handleSub('1')">同意</view>
    </view>

    <!--  -->
    <u-popup
      :show="showApprModal"
      :round="10"
      :safeAreaInsetBottom="true"
      mode="bottom"
      @close="showApprModal = false"
    >
      <view class="appr_modal">
        <view class="title">同意</view>
        <textarea
          placeholder="同意说明，非必填"
          placeholder-class="placeholder9"
        />
        <view class="main_footer">
          <view class="btn" @click="showApprModal = false">取消</view>
          <view class="btn agree">提交</view>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import { carUseBookDetail } from '@/api'
export default {
  data() {
    return {
      showApprModal: false,
      id: '',
      info: {},
      param: {},

    }
  },
  onLoad(option) {
    this.id = option.id
    this.getDetail()
  },
  methods: {
    getDetail() {
      const { id } = this
      carUseBookDetail(id).then(res => {
        this.info = { ...res.data }
      })
    },
    handleSub(flag) {
      // this.param.flag = 
      if (flag === '1') {

      } else {

      }
      this.showApprModal = true
    }
  },
}
</script>
<style>
page {
  background-color: #f7f7f7;
}
</style>
<style lang="scss">
.main_app {
  background-color: #fff;
  padding-bottom: 0;

  .flow_wrap {
    padding: 30rpx 0;

    .flow_title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 24rpx;
    }

    .list {
      .item {
        display: flex;
        margin-bottom: 48rpx;

        .avatar {
          width: 80rpx;
          height: 80rpx;
          position: relative;
          margin-right: 20rpx;

          .img {
            width: 80rpx;
            height: 80rpx;
            border-radius: 50%;
          }

          .status {
            width: 28rpx;
            height: 28rpx;
            border-radius: 50%;
            position: absolute;
            right: 0;
            bottom: 0;
          }

          .separate {
            position: absolute;
            width: 4rpx;
            height: 100%;
            background-color: #eeeeee;
            left: 50%;
            transform: translate(-50%, 0);
            bottom: -80rpx;
          }
        }

        .content {
          flex: 1;

          .head {
            display: flex;
            justify-content: space-between;
            margin-bottom: 4rpx;

            .event {
              font-size: 30rpx;
            }

            .time {
              font-size: 26rpx;
              color: #999999;
            }
          }

          .name_wrap {
            font-size: 26rpx;
            color: #777777;

            .status {
              color: $uni-color-primary;
            }
          }

          .remark {
            margin-top: 12rpx;
            background-color: #f7f7f7;
            padding: 14rpx 20rpx;
            border-radius: 8rpx;
            font-size: 26rpx;
            color: #666666;
            line-height: 36rpx;
          }
        }
        .carbon {
          display: flex;
          width: 590rpx;
          overflow-x: auto;
          margin-top: 12rpx;
          .carbon_item {
            text-align: center;
            flex-shrink: 0;
            width: 100rpx;
            image {
              width: 60rpx;
              height: 60rpx;
              margin: 0 auto;
            }
            view {
              font-size: 26rpx;
              color: #777777;
            }
          }
        }
      }
    }
  }

  .module_list {
    .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;

        .avatar {
          margin-right: 20rpx;
          width: 120rpx;
          height: 120rpx;
          border-radius: 8rpx;
          border: 2rpx solid #e5e5e5;
        }

        .info {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          font-size: 26rpx;
          color: #666666;

          .name {
            font-size: 30rpx;
            color: #333333;
          }
        }
      }
    }
  }

  .status_wrap {
    position: relative;
    padding: 30rpx 0;

    .name {
      font-weight: 500;
      font-size: 32rpx;
      margin-bottom: 20rpx;
      color: #222222;
    }

    .desc {
      font-size: 26rpx;
      color: #ed4545;
    }

    .status {
      position: absolute;
      right: -30rpx;
      top: 0;
      height: 60rpx;
      line-height: 60rpx;
      padding: 0 32rpx;
      border-radius: 0rpx 0rpx 0rpx 30rpx;
      background-color: #e9edff;
      color: $uni-color-primary;
    }
  }

  .main_footer {
    padding-bottom: 64rpx;
    display: flex;
    justify-content: space-between;

    .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;
    }
  }

  .appr_modal {
    padding: 36rpx 30rpx 0;

    .title {
      font-weight: 500;
      font-size: 32rpx;
      color: #222222;
      margin-bottom: 40rpx;
      text-align: center;
    }

    textarea {
      box-sizing: border-box;
      width: 690rpx;
      background-color: #f7f7f7;
      font-size: 28rpx;
      color: #333333;
      padding: 24rpx;
      border-radius: 8rpx;
      margin-bottom: 30rpx;
    }
  }

  .emyty {
    width: 750rpx;
    height: 20rpx;
    background-color: #f7f7f7;
    margin: 0 -30rpx;
  }
}
</style>

 h5/pages/staff/vehicle/shinei.vue

@@ -75,7 +75,7 @@
      selDatetime: '',

      colorOptions: [
        { color: '#279BAA', name: '已选择' },
        { color: this.$store.state.primaryColor, name: '已选择' },
        { color: '#F7F7F7', name: '可预约' },
        { color: '#cccccc', name: '不可预约' },
      ]
@@ -155,9 +155,6 @@
      } else {
        this.selDatetime = this.param.queryDate.slice(5) + ' ' + selTimeLists[0].startHours + '-' + selTimeLists[selTimeLists.length - 1].endHours
      }
      // if(true){
      //     this.selDatetime.push(item)
      // }
    },
    confirmDate(e) {
      this.param.queryDate = dayjs(e.value).format('YYYY-MM-DD')
@@ -228,7 +225,7 @@
    padding: 20rpx 30rpx 84rpx;
    box-shadow: 0rpx -3rpx 6rpx 0rpx #eeeeee;
    .sel_time {
      color: #279baa;
      color: $uni-color-primary;
    }
    .btns {
      margin-top: 10rpx;
@@ -253,7 +250,7 @@
        height: 72rpx;
        line-height: 72rpx;
        text-align: center;
        background: #279baa;
        background: $uni-color-primary;
        box-shadow: 0rpx -1rpx 0rpx 0rpx #eeeeee;
        border-radius: 36rpx;
        font-size: 30rpx;
@@ -277,7 +274,7 @@
      font-size: 30rpx;
    }
    .active {
      background-color: #279baa;
      background-color: $uni-color-primary;
      color: #fff;
    }
    .disable {

 h5/pages/staff/vehicle/shiwai.vue

@@ -329,14 +329,14 @@
    height: 72rpx;
    line-height: 72rpx;
    text-align: center;
    background: #279baa;
    background: $uni-color-primary;
    box-shadow: 0rpx -1rpx 0rpx 0rpx #eeeeee;
    border-radius: 36rpx;
    font-size: 30rpx;
    color: #ffffff;
  }
  .sel {
    color: #279baa;
    color: $uni-color-primary;
    flex: 1;
  }
}

 h5/pages/staff/visitorReport.vue

@@ -445,7 +445,7 @@
  }
};
</script>
<style>
<style lang="scss">
page {
  background-color: #f7f7f7 !important;
}
@@ -655,7 +655,7 @@
      height: 88rpx;
      line-height: 88rpx;
      text-align: center;
      background: #4e99a9;
      background: $uni-color-primary;
      border-radius: 44rpx;
      font-size: 32rpx;
      color: #ffffff;

 h5/pages/staffLogin/forgetPsd.vue

@@ -181,7 +181,7 @@
        height: 40rpx;
      }
      .captcha {
        color: #279baa;
        color: $uni-color-primary;
      }
      input {
        flex: 1;
@@ -198,7 +198,7 @@
    box-sizing: border-box;
    margin-top: 80rpx;
    .for_psd {
      color: #279baa;
      color: $uni-color-primary;
      margin-top: 40rpx;
      width: 140rpx;
      text-align: center;
@@ -207,7 +207,7 @@
    .login_btn_n {
      width: 100%;
      height: 98rpx;
      background: #279baa;
      background: $uni-color-primary;
      box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(39, 155, 170, 0.2);
      display: flex;
      align-items: center;
@@ -225,7 +225,7 @@
    text-align: center;
    bottom: 108rpx;
    .deal {
      color: #279baa;
      color: $uni-color-primary;
    }
  }
}

 h5/pages/staffLogin/login.vue

@@ -185,7 +185,7 @@
    box-sizing: border-box;
    margin-top: 80rpx;
    .for_psd {
      color: #279baa;
      color: $uni-color-primary;
      margin-top: 40rpx;
      width: 140rpx;
      text-align: center;
@@ -194,7 +194,7 @@
    .login_btn_n {
      width: 100%;
      height: 98rpx;
      background: #279baa;
      background: $uni-color-primary;
      box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(39, 155, 170, 0.2);
      display: flex;
      align-items: center;
@@ -212,7 +212,7 @@
    text-align: center;
    bottom: 108rpx;
    .deal {
      color: #279baa;
      color: $uni-color-primary;
    }
  }
}

 h5/store/index.js

@@ -26,7 +26,8 @@
        time: time || null,
        userInfo: userInfo || {},
        height: height || '0',
        sessionKey: sessionKey || ''
        sessionKey: sessionKey || '',
        primaryColor: '#279baa'
    },

    mutations: {

 h5/uni.scss

@@ -15,7 +15,7 @@
/* é¢œè‰²å˜é‡ */

/* è¡Œä¸ºç›¸å…³é¢œè‰² */
$uni-color-primary: #007aff;
$uni-color-primary: #279baa;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;

 h5/utils/service.js

@@ -26,16 +26,18 @@
                    // æŽ§åˆ¶å°æ˜¾ç¤ºæ•°æ®ä¿¡æ¯
                    uni.hideLoading()
                    // ç™»å½•è¿‡æœŸ
                    if (data.code === 401) {
                    if (data.code !== 200) {
                        setTimeout(() => {
                            uni.showToast({
                                title: data.message,
                                icon: "none",
                                duration: 2000
                            })
                        })
                    }
                    if (data.code === 5112) {
                        uni.navigateTo({
                            url: '/pages/staffLogin/login'
                        });
                    }
                    if (data.code !== 200) {
                        uni.showToast({
                            title: data.message,
                            icon: "none",
                            duration: 2000
                        })
                    }
                    resolve(data)
@@ -46,7 +48,7 @@
                    uni.showToast({
                        title: '请求接口失败'
                    })
					

                    // è¿”回错误消息
                    reject(err)
                    uni.hideLoading()