ll

liukangdong

2025-02-24 b94daf4ea357eafce26f37a1f0a799d55cbfa1a4

ll

 h5/pages.json

@@ -496,6 +496,13 @@
            {
                "navigationBarTitleText" : "任务操作明细"
            }
        },
        {
            "path" : "pages/visitorApplication/memberSel",
            "style" : 
            {
                "navigationBarTitleText" : "选择被访人"
            }
        }

    ],

    "subPackages": [


 h5/pages/driver/index.vue

@@ -10,10 +10,14 @@
            <view class="h2">物流车专区</view>

            <image class="banner" src="../../static/driver/wuliuche_banner@2x.png" mode="widthFix"></image>

        </view>

        <!--  -->

        <!--  -->
        <view class="title_wrap">
            <view class="name">作业任务</view>
            <view class="placeholder9">{{activeCurrent + 1}}/{{taskList.length}}</view>
        </view>

        <view v-if="taskList && taskList.length > 0" class="task_list">

            <swiper circular class="task_swiper">

                <swiper-item v-for="item in taskList" :key="item.id" @click="taskClick(item)">

            <swiper circular indicator-dots indicator-active-color="#4d99a8" indicator-color="#e0e2e7" class="task_swiper" @change="changeCur" :current="activeCurrent">

                <swiper-item v-for="item in taskList" :current='activeCurrent' :key="item.id" @click="taskClick(item)">

                    <view class="item">

                        <view class="head">

                            <view class="name">{{ item.contractNum ? '合同单' : '运输单' }}{{ item.billCode || item.contractNum }}</view>

@@ -109,7 +113,8 @@
    export default {

        data() {

            return {

                taskList: [],

                taskList: [],
                activeCurrent: 0,

                driverInfo: uni.getStorageSync('driverInfo'),

            }

        },

@@ -139,7 +144,10 @@
            this.initData()

        },



        methods: {

        methods: {
            changeCur(e) {
                this.activeCurrent = e.detail.current
            },

            jump(path) {

                this.$jump(path)

            },


 h5/pages/driver/reservedDetail.vue

@@ -28,6 +28,7 @@
                    <image
                        v-if="info.transportImg"
                      class="avatar_wrap"
                        @click="priviewImage(info.prefixUrl + info.transportImg)"
                      :src="info.prefixUrl + info.transportImg"
                    ></image>
                </view>
@@ -136,6 +137,11 @@
        this.getDetail(option.id)
    },
  methods: {
        priviewImage(url) {
            uni.previewImage({
                urls: [url]
            })
        },
        handleCancel(){
            const { info } = this
            uni.showModal({

 h5/pages/staff/meetingSel.vue

@@ -2,7 +2,7 @@
    <view class="main_app" :class="{ popupShow: isShowSelMem }">

        <view class="search_inp df_ac">

            <image class="mr12 search" src="../../static/ic_search@2x.png" mode="widthFix"></image>

            <input v-model="param.queryParam" @blur="initData()" type="text" placeholder="搜索"

            <input v-model="param.queryParam" @confirm="initData()" type="text" placeholder="搜索"

                placeholder-style="color: #999999;" />

        </view>

        <view class="member_list">

@@ -301,7 +301,10 @@
        }

    }



    .member_list {

    .member_list {
        height: calc( 100vh - 130rpx );
        overflow: auto;
        margin-top: 10rpx;

        .line {

            display: flex;

            align-items: center;


 h5/pages/staff/snapshot.vue

@@ -120,7 +120,7 @@
        <u-picker keyName="name" :show="isShowType" closeOnClickOverlay :columns="areaType" @confirm="seletedType"

            @close="isShowType = false" @cancel="isShowType = false"></u-picker>

        <!--  -->

        <u-datetime-picker :show="isShowTime" :minDate="new Date().getTime()" mode="datetime" closeOnClickOverlay

        <u-datetime-picker :show="isShowTime" :formatter="formatter" :minDate="new Date().getTime()" mode="datetime" closeOnClickOverlay

            @cancel="isShowTime = false" @close="isShowTime = false" @confirm="seletedDate"></u-datetime-picker>

        <!--  -->

        <u-popup :show="showUpload" @close="showUpload = false" closeOnClickOverlay>

@@ -172,7 +172,25 @@
                this.$set(this.param, 'checkorName', option.name)

            })

        },

        methods: {

        methods: {
            formatter(type, value) {
                if (type === 'year') {
                    return `${value}å¹´`
                }
                if (type === 'month') {
                    return `${value}月`
                }
                if (type === 'day') {
                    return `${value}日`
                }
                if (type === 'hour') {
                    return `${value}时`
                }
                if (type === 'minute') {
                    return `${value}分`
                }
                return value
            },

            onSubmit() {

                const {

                    param,


 h5/pages/staff/task/driver.vue

@@ -29,6 +29,7 @@
              <view class="label">准运证照片</view>
              <view class="value">
                    <image
                    @click="priviewImage(info.prefixUrl + info.transportImg)"
                        v-if="info.transportImg"
                      class="avatar_wrap"
                      :src="info.prefixUrl + info.transportImg"
@@ -162,6 +163,11 @@
        this.getDetail(option.id)
    },
  methods: {
        priviewImage(url) {
            uni.previewImage({
                urls: [url]
            })
        },
        getDetail(id) {
            driverApplyDetail({id}).then(res => {
                this.info = res.data

 h5/pages/staff/task/index.vue

@@ -206,6 +206,7 @@
      :show="tiemShow"
      v-model="startDate"
      mode="date"
            :formatter="formatter"
      @confirm="confirmLeft"
      @cancel="tiemShow = false"
    ></u-datetime-picker>
@@ -216,6 +217,7 @@
      "
      v-model="startDate"
      mode="date"
            :formatter="formatter"
      @confirm="confirmRight"
      @cancel="tiemShow1 = false"
    ></u-datetime-picker>
@@ -279,6 +281,24 @@
        this.getHeadList()
  },
  methods: {
        formatter(type, value) {
            if (type === 'year') {
                return `${value}å¹´`
            }
            if (type === 'month') {
                return `${value}月`
            }
            if (type === 'day') {
                return `${value}日`
            }
            if (type === 'hour') {
                return `${value}时`
            }
            if (type === 'minute') {
                return `${value}分`
            }
            return value
        },
    statusClick(val) {
      this.pagination.page = 0
      this.dataList = []

 h5/pages/staff/task/vDangetAppr.vue

@@ -258,17 +258,17 @@
                <view class="title">选择员工</view>

                <view class="search_inp df_ac">

                    <image class="mr12 search" src="@/static/ic_search@2x.png" mode="widthFix"></image>

                    <input v-model="transferModel.name" @blur="getMemList()" type="text" placeholder="搜索部门/人员"

                    <input v-model="transferModel.queryParam" @confirm="getMemList()" type="text" placeholder="搜索人员姓名"

                        placeholder-style="color: #999999;" />

                </view>

                <view class="member_list">

                    <view class="mt24 placeholder6">共{{ memberList.length }}条数据</view>

                    <view v-for="item in memberList" :key="item.id" class="line">

                        <image v-if="item.faceImgFull" :src="item.faceImgFull" class="avatar"></image>

                        <span v-else class="img_name">{{ item.name && item.name.slice(0, 1) }}</span>

                        <image v-if="item.faceImg" :src="item.faceImg" class="avatar"></image>

                        <span v-else class="img_name">{{ item.realname && item.realname.slice(0, 1) }}</span>

                        <view class="content">

                            <view class="info">

                                <text class="name">{{ item.name }}</text>

                                <text class="name">{{ item.realname }}</text>

                                <!-- <text class="tag">tag</text> -->

                            </view>

                            <view class="depart">{{ item.companyName }}</view>

@@ -307,7 +307,7 @@
import {

    hiddenDangerDetail,

    uploadUrl,

    findHiddenAreaMemberList,

    userPagePost,

    dealHiddenDanger,

    transferHiddenDanger,

    findListFlowDanger

@@ -503,11 +503,11 @@
            this.isShowTransfer = true

            this.getMemList()

        },

        getMemList() {

            findHiddenAreaMemberList({

                ...this.transferModel,

                // id: this.info.areaId,

                ...this.pagination

        getMemList() {
            userPagePost({
                ...this.transferModel,
                querySpecial: 1, type: 2, companyType: 1,workStatus:0
			
            }).then(res => {

                this.memberList = res.data || []

            })


 h5/pages/staff/vehicle/applePeo.vue

@@ -1,366 +1,378 @@
<template>
  <view class="main_app" :class="{ popupShow: isShowSelMem }">
    <view class="search_inp df_ac">
      <image
        class="mr12 search"
        src="@/static/ic_search@2x.png"
        mode="widthFix"
      ></image>
      <input
        v-model="param.name"
        @blur="initData()"
        type="text"
        placeholder="搜索"
        placeholder-style="color: #999999;"
      />
    </view>
    <view class="member_list">
      <view @click="changeMem(item, index)" v-for="(item, index) in memberList" :key="item.id" class="line">
        <image
          v-if="item.faceImgFull"
          :src="item.faceImgFull"
          class="avatar"
          mode=""
        ></image>
        <view v-else class="avatar">{{ item.name.slice(0, 1) }}</view>
        <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>
        <image
          v-if="item.checked"
          src="@/static/checkbox_sel@2x.png"
          mode="widthFix"
          class="checked"
        ></image>
        <image
          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.name }}；</text>
        </view>
        <image
          @click="openSeleter"
          class="open_icon"
          src="@/static/staff/renyuan_ic_open.png"
          mode=""
        ></image>
      </view>
      <view class="btn" @click="onSubmit">确认</view>
    </view>
    <!--  -->
    <u-popup
      :show="isShowSelMem"
      :round="12"
      mode="bottom"
      @close="closeModal"
    >
      <view class="modal">
        <view class="modal_header">
          <text class="status">已选择：{{ selList.filter(i => i.checkedTemp).length }}人</text>
          <text class="btn" @click="subSelMem">确认</text>
        </view>
        <view class="modal_mem_list">
                    <template v-for="(item, i) in selList">
                        <view class="line" v-if="item.checkedTemp" :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.name }}</text>
                            </view>
                            <view class="depart">{{ item.componey }}</view>
                          </view>
                          <view class="btn" @click="handleRemove(i)">移除</view>
                        </view>
                    </template>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import { findTypeMemberInfo } from '@/api'
export default {
  data() {
    return {
      memberList: [],
      param: {},
      selList: [],

      isShowSelMem: false,
      pagination: {
        capacity: 20,
        page: 1
      },
    }
  },
  onLoad() {
    this.initData()
  },
  onReachBottom() {
    // if(){}
  },
  mounted() {
    this.$eventBus.$on('applePeoDetail', (res) => {
      res.forEach(item => {
        this.memberList.forEach(mem => {
          if (item.id === mem.id) {
            mem.checked = !mem.checked
          }
        })
      })
      this.selList = this.memberList.filter(i => i.checked)
      this.$nextTick(() => {
        this.$forceUpdate()
      })
    })
  },
  methods: {
    initData() {
      const { param } = this
      findTypeMemberInfo({
        // model: {
        name: param.name,
        // },
        type: '2',
        companyType: 1,
      }).then(res => {
        this.memberList = res.data || []
        this.memberList.forEach(i => {
                    const index = this.selList.findIndex(ite => ite.id === i.id)
          i.checked = index > -1
        })
      })
    },
    onSubmit() {
      if (this.selList.length === 0) return uni.showToast({
        title: '请先选择人员',
        icon: 'none'
      })
      this.$eventBus.$emit('applePeo', this.selList)
      uni.navigateBack()
    },
    changeMem(item, index) {
      // this.memberList.forEach(mem => {
      //   if(item.id === mem.id){
      //     item.checked = !item.checked
      //   }
      // })
      item.checked = !item.checked
            const i = this.selList.findIndex(a => a.id === item.id)
            if(item.checked && i === -1){
                this.selList.push(item)
            }else{
                this.selList.splice(i, 1)
            }
      this.$forceUpdate()
    },
        openSeleter() {
            this.isShowSelMem = true
            this.selList.forEach(item => {
                item.checkedTemp = true
            })
            this.$forceUpdate()
        },
        subSelMem() {
          const { memberList } = this
            this.selList = this.selList.filter(i => i.checkedTemp)
            console.log('selList', this.selList);
          memberList.forEach(ite => {
                const index = this.selList.findIndex(i => i.id === ite.id)
            ite.checked = index > -1
          })
          this.isShowSelMem = false
          this.$forceUpdate()
        },
        closeModal() {
          this.selList.forEach(item => {
              item.checkedTemp = true
          })
          this.isShowSelMem = false
        },
    handleRemove(i) {
      this.selList[i].checkedTemp = false
      this.$forceUpdate()
    },
  }
};
</script>

<style lang="scss">
.modal {
  padding: 40rpx 30rpx;
  max-height: 1000rpx;
  .modal_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 20rpx;
    .status {
      font-weight: 600;
    }
    .btn {
      color: $uni-color-primary;
    }
  }
  .modal_mem_list {
    max-height: 860rpx;
    overflow: auto;
    .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;
  left: 0;
  z-index: 9999;
  width: 100%;
  background-color: #fff;
  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>
<template>

    <view class="main_app" :class="{ popupShow: isShowSelMem }">

        <view class="search_inp df_ac">

            <image class="mr12 search" src="@/static/ic_search@2x.png" mode="widthFix"></image>

            <input v-model="param.queryParam" @confirm="initData()" type="text" placeholder="搜索"

                placeholder-style="color: #999999;" />

        </view>

        <view class="member_list">

            <view v-for="(item, index) in memberList" :key="item.id" class="line">

                <image v-if="item.faceImg" :src="item.faceImg" class="avatar" mode=""></image>

                <view v-else class="avatar">{{ item.realname.slice(0, 1) }}</view>

                <view class="content">

                    <view class="info">

                        <text class="name">{{ item.realname }}</text>

                        <text class="tag" v-if="item.status == '1'">有会议</text>

                    </view>

                    <view class="depart">{{ item.departmentName || item.companyName }}</view>

                </view>

                <image @click="changeMem(item, index)" v-if="item.checked" src="@/static/checkbox_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="" style="height: 220rpx;"></view>

            <view v-if="memberList.length == 0" class="empty_wrap">
                <image src="@/static/empty.png" mode=""></image>
                <text>暂无数据</text>
            </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="openSeleter" class="open_icon" src="@/static/staff/renyuan_ic_open.png" mode=""></image>

            </view>

            <view class="btn" @click="onSubmit">确认({{ selList.length }}/{{ param.limitNum }})</view>

        </view>

        <!--  -->

        <u-popup catchtouchmove :show="isShowSelMem" :round="12" mode="bottom" @close="closeModal">

            <view class="modal">

                <view class="modal_header">

                    <text class="status">已选择：{{ selList.filter(i => i.checkedTemp).length }}人</text>

                    <text class="btn" @click="subSelMem">确认</text>

                </view>

                <view class="modal_mem_list">

                    <template v-for="(item, i) in selList">

                        <view class="line" v-if="item.checkedTemp">

                            <image v-if="item.avatar" :src="item.prefixUrl + item.avatar" class="avatar" mode=""></image>

                            <view v-else class="avatar">{{ item.realname.slice(0, 1) }}</view>

                            <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(i)">移除</view>

                        </view>

                    </template>

                </view>

            </view>

        </u-popup>

    </view>

</template>



<script>

    import {

        userPagePost

    } from '@/api'

    import dayjs from 'dayjs'

    export default {

        data() {

            return {

                memberList: [],

                selList: [],

                param: {

                    limitNum: ''

                },

                pagination: {

                    page: 1,

                    capacity: 40

                },



                isShowSelMem: false

            }

        },

        onLoad(option) {

            this.param = {

                limitNum: option.limitNum,

                queryParam: '',

                startTime: dayjs(Number(option.startTime)).format('YYYY-MM-DD HH:mm:ss'),

                endTime: dayjs(Number(option.endTime)).format('YYYY-MM-DD HH:mm:ss'),

            }

            this.initData()

        },

        mounted() {

            this.$eventBus.$on('applePeoDetail', (res) => {

                setTimeout(() => {

                    res.forEach(item => {

                        this.memberList.forEach(mem => {

                            if (item.id == mem.id) {

                                mem.checked = true

                            }

                        })

                    })

                    this.selList = this.memberList.filter(i => i.checked)

                    this.$nextTick(() => {

                        this.$forceUpdate()

                    })

                }, 500)

            })

        },

        methods: {

            onSubmit() {

                this.$eventBus.$emit('applePeo', this.selList)

                uni.navigateBack()

            },

            changeMem(item, index) {

                // const { selList, param } = this

                // if (this.selList.length == param.limitNum && !item.checked) return uni.showToast({

                //   title: `该会议可容纳${param.limitNum}人`,

                //   icon: 'none'

                // })

                // item.checked = !item.checked

                // this.selList = this.memberList.filter(i => i.checked)

                // // 
                item.checked = !item.checked

                const i = this.selList.findIndex(a => a.id === item.id)

                if (item.checked && i === -1) {

                    this.selList.push(item)

                } else {

                    this.selList.splice(i, 1)

                }

                this.$forceUpdate()

            },

            openSeleter() {

                this.isShowSelMem = true

                this.selList.forEach(item => {

                    item.checkedTemp = true

                })

                this.$forceUpdate()

            },

            initData() {

                const {

                    param,

                    pagination

                } = this

                userPagePost({

                    ...param,
                    querySpecial: 1, type: 2, companyType: 1,workStatus:0



                }).then(res => {

                    this.memberList = res.data || []

                    this.memberList.forEach(i => {

                        const index = this.selList.findIndex(ite => ite.id === i.id)

                        i.checked = index > -1

                    })

                })

            },

            closeModal() {

                this.selList.forEach(item => {

                    item.checkedTemp = true

                })

                this.isShowSelMem = false

            },

            subSelMem() {

                const {

                    memberList

                } = this

                this.selList = this.selList.filter(i => i.checkedTemp)

                memberList.forEach(ite => {

                    const index = this.selList.findIndex(i => i.id === ite.id)

                    ite.checked = index > -1

                })

                this.isShowSelMem = false

                this.$forceUpdate()

            },

            handleRemove(i) {

                this.selList[i].checkedTemp = false

                this.$forceUpdate()

            },

        }

    };

</script>



<style lang="scss">

    .modal {

        padding: 40rpx 30rpx;

        max-height: 1000rpx;



        .modal_header {

            display: flex;

            justify-content: space-between;

            align-items: center;

            padding-bottom: 20rpx;



            .status {

                font-weight: 600;

            }



            .btn {

                color: $uni-color-primary;

            }

        }



        .modal_mem_list {

            max-height: 860rpx;

            overflow: auto;



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

                    display: flex;

                    justify-content: center;

                    align-items: center;

                    background-color: $uni-color-primary;

                    color: #fff;

                }



                .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 42rpx;



        .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 {
        height: calc( 100vh - 130rpx );
        overflow: auto;
        margin-top: 10rpx;

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

                        display: flex;

                        align-items: center;

                    }

                }

            }



            .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/vehicle/apply.vue

@@ -93,7 +93,7 @@
            <text v-if="param.memberNames">
              <text v-for="(mem, i) in param.memberList" :key="mem.id">
                <template v-if="i < 2">
                  <text>{{ mem.name }}</text>
                  <text>{{ mem.realname }}</text>
                  <text v-if="i < 1 && param.memberList.length > 1">,</text>
                </template>
              </text>
@@ -165,7 +165,7 @@
    this.$eventBus.$on('applePeo', (res) => {
      this.$set(this.param, 'memberList', res)
      this.$set(this.param, 'memberIds', res.map(i => i.id).join(','))
      this.$set(this.param, 'memberNames', res.map(i => i.name).join(','))
      this.$set(this.param, 'memberNames', res.map(i => i.realname).join(','))
    })
  },
  onLoad(option) {

 h5/pages/staff/vehicle/sendACar.vue

@@ -69,6 +69,7 @@
    <u-datetime-picker
      mode="date"
      v-model="param.queryDate"
            :formatter="formatter"
      :show="isShowDate"
      :minDate="minDate"
      closeOnClickOverlay
@@ -116,6 +117,24 @@
        }
  },
  methods: {
        formatter(type, value) {
            if (type === 'year') {
                return `${value}å¹´`
            }
            if (type === 'month') {
                return `${value}月`
            }
            if (type === 'day') {
                return `${value}日`
            }
            if (type === 'hour') {
                return `${value}时`
            }
            if (type === 'minute') {
                return `${value}分`
            }
            return value
        },
    getList() {
      const { param, pagination } = this
      pagination.page = pagination.page + 1

 h5/pages/staff/vehicle/shinei.vue

@@ -46,7 +46,7 @@
        <u-picker keyName="code" :show="isShowCar" :columns="carsList" @confirm="seletedCar"

            @cancel="isShowCar = false"></u-picker>

        <!-- æ—¥æœŸ -->

        <u-datetime-picker ref="startPick" :show="isShowDate" :minDate="minDate" @confirm="confirmDate"

        <u-datetime-picker ref="startPick" :formatter="formatter" :show="isShowDate" :minDate="minDate" @confirm="confirmDate"

            @cancel="isShowDate = false" mode="date"></u-datetime-picker>

        <!-- è¯¦æƒ… -->

        <u-popup :show="isShowDetail" :round="12" mode="bottom" @close="isShowDetail = false">

@@ -131,7 +131,25 @@
            this.minDate = new Date().getTime() - (6 * 24 * 60 * 60 * 1000)

            this.initData()

        },

        methods: {

        methods: {
            formatter(type, value) {
                if (type === 'year') {
                    return `${value}å¹´`
                }
                if (type === 'month') {
                    return `${value}月`
                }
                if (type === 'day') {
                    return `${value}日`
                }
                if (type === 'hour') {
                    return `${value}时`
                }
                if (type === 'minute') {
                    return `${value}分`
                }
                return value
            },

            onSubmit() {

                const {

                    param


 h5/pages/staff/vehicle/shiwai.vue

@@ -42,7 +42,7 @@
        <view class="line">
          <text>用车时段</text>
          <text>
            {{ item.startTime.slice(5, 16) }}至{{
            {{ item.startTime.slice(5, 16) }} è‡³ {{
              item.endTime.slice(5, 16)
            }}</text
          >
@@ -102,6 +102,7 @@
           :show="isShowDate"
            ref="startPick"
           title="开始时间"
             :formatter="formatter"
           :minDate="minDate"
           @close="isShowDate = false"
           :closeOnClickOverlay="true"
@@ -112,6 +113,7 @@
      mode="datetime"
      :show="isShowEndDate"
      title="结束时间"
            :formatter="formatter"
      :minDate="new Date(param.startTime || null).getTime()"
      @close="endtimeClose"
      :closeOnClickOverlay="true"
@@ -144,6 +146,24 @@
    this.initData()
  },
  methods: {
        formatter(type, value) {
            if (type === 'year') {
                return `${value}å¹´`
            }
            if (type === 'month') {
                return `${value}月`
            }
            if (type === 'day') {
                return `${value}日`
            }
            if (type === 'hour') {
                return `${value}时`
            }
            if (type === 'minute') {
                return `${value}分`
            }
            return value
        },
        showDate() {
            this.isShowDate = true
            if (!this.param.startTime) {

 h5/pages/staff/visitorReport.vue

@@ -138,6 +138,7 @@
      :show="show4"
      :minDate="new Date().getTime()"
      mode="datetime"
            :formatter="formatter"
      @cancel="show4 = false"
      @confirm="setinDate"
    ></u-datetime-picker>
@@ -145,6 +146,7 @@
    <u-datetime-picker
      v-if="form1.starttime"
      :show="show5"
            :formatter="formatter"
      :minDate="formatTimeStamp(form1.starttime)"
      :maxDate="formatTimeStamp(maxTime)"
      mode="datetime"
@@ -262,6 +264,24 @@
    // this.getUserValid()
  },
  methods: {
        formatter(type, value) {
            if (type === 'year') {
                return `${value}å¹´`
            }
            if (type === 'month') {
                return `${value}月`
            }
            if (type === 'day') {
                return `${value}日`
            }
            if (type === 'hour') {
                return `${value}时`
            }
            if (type === 'minute') {
                return `${value}分`
            }
            return value
        },
    openInput(type) {
      this.inputType = type
      this.$refs.keyboard.open()

 h5/pages/visitorApplication/memberSel.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,282 @@
<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.name"
        @confirm="initData()"
        type="text"
        placeholder="请输入姓名进行搜索"
        placeholder-style="color: #999999;"
      />
    </view>
    <view class="member_list">
      <checkbox-group @change="changeMem">
        <view v-for="item in memberList" :key="item.id" class="line">
          <image v-if="item.faceImgFull" :src="item.faceImgFull" class="avatar" ></image>
          <span v-else class="img_name">{{item.name && item.name.slice(0,1)}}</span>
          <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>
          <label>
            <checkbox
              :value="String(item.id)"
              class="checkbox"
            />
          </label>
          <text></text>
        </view>
      </checkbox-group>
      <view v-if="memberList.length == 0" class="empty_wrap">
          <image src="../../static/empty.png"></image>
          <text>暂无数据</text>
      </view>
    </view>

    <u-popup
      :show="isShowSelMem"
      :round="12"
      mode="bottom"
      @close="isShowSelMem = false"
    >
      <view class="modal">
        <view class="modal_header">
          <text class="status">已选择：xx人</text>
          <text class="btn" @click="isShowSelMem = false">确认</text>
        </view>
        <view class="modal_mem_list">
          <view class="line">
            <image
              src="../../static/logo@2x.png"
              class="avatar"
              mode=""
            ></image>
            <view class="content">
              <view class="info">
                <text class="name">name</text>
              </view>
              <view class="depart">xx科室</view>
            </view>
            <view class="btn">移除</view>
          </view>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import { getVisitedMember } from '@/api'
export default {
  data() {
    return {
      memberList: [],
      selList: [],
      param: {},

      isShowSelMem: false
    }
  },
  onLoad(option) {
    // this.$set(this.param, 'id', option.areaId || '')
    this.initData()
  },
  methods: {
    onSubmit() {
      uni.navigateBack()
    },
    changeMem(e) {
            console.log( e.detail.value[0]);
            const id = Number(e.detail.value[0])
            const item = this.memberList.find(i => i.id === id)
      this.$eventBus.$emit('svisitorAppSel', item)
            uni.navigateBack()
    },
    initData() {
      const { param } = this
            getVisitedMember({
                ...param
            }).then(res => {
              this.memberList = res.data || []
            })
      // findHiddenAreaMemberList({
      //   name: param.name,
      //   id: param.id
      // }).then(res => {
      //   this.memberList = res.data || []
      // })
    }
  }
};
</script>

<style lang="scss">
    .main_app{
        padding-top: 30rpx;
    }
.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: absolute;
  bottom: 0;
  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 {
    height: calc( 100vh - 130rpx );
    overflow: auto;
    margin-top: 10rpx;
  .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;
    }
        .img_name{
            width: 64rpx;
            height: 64rpx;
            line-height: 64rpx;
            text-align: center;
            border-radius: 50%;
            overflow: hidden;
            margin-right: 20rpx;
            background: $uni-color-primary;
            color: #fff;
            border: 1rpx solid $uni-color-primary;
        }
    .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;
        }
      }
    }
  }
  .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/visitorApplication/visitorApplication.vue

@@ -1,1408 +1,1397 @@
<template>
  <view class="visit">
    <!-- <view class="head">拜访信息</view> -->
    <view class="list">
      <view class="list_item">
        <view class="list_item_label">
          <text>*</text>
          <text>被访人</text>
        </view>
        <view class="list_item_content" @click="showName = true">
          <text :style="{ color: form1.receptMemberName ? '#000000' : '' }">{{
            form1.receptMemberName ? form1.receptMemberName : "请选择"
          }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
      <view class="list_item">
        <view class="list_item_label">
          <text>*</text>
          <text>入园时间</text>
        </view>
        <view class="list_item_content" @click="show4 = true">
          <text :style="{ color: form1.starttime ? '#000000' : '' }">{{
            form1.starttime ? form1.starttime : "请选择"
          }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
      <view class="list_item">
        <view class="list_item_label">
          <text>*</text>
          <text>离园时间</text>
        </view>
        <view class="list_item_content" @click="openLC">
          <text :style="{ color: form1.endtime ? '#000000' : '' }">{{
            form1.endtime ? form1.endtime : "请选择"
          }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
      <!-- <view class="list_item" v-if="accessControl === '1'" @click="show = true">
                <view class="list_item_label">
                    <text>访问门禁</text>
                    <text>*</text>
                </view>
                <view class="list_item_content">
                    <text :style="{color: form1.doorSelectName ? '#000000' : ''}">{{form1.doorSelectName ? form1.doorSelectName : '请选择'}}</text>
                    <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
                </view>
            </view> -->
      <div class="empty"></div>
      <view class="list_item">
        <view class="list_item_label">
          <text>*</text>
          <text>拜访事由</text>
        </view>
        <view class="list_item_content" @click="showReason = true">
          <text :style="{ color: form1.reason ? '#000000' : '' }">{{
            form1.reason ? form1.reason : "请选择拜访事由"
          }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
      <view class="list_item">
        <view class="list_item_label">
          <text></text>
          <text>是否施工作业</text>
        </view>
        <view class="list_item_content">
          <switch
            color="#4e99a9"
            style="transform: scale(0.8)"
            @change="constructionChange"
          />
        </view>
      </view>
      <view v-if="form1.type == '1'" class="list_item">
        <view class="list_item_label">
          <text></text>
          <text>施工内容</text>
          <!-- <text>*</text> -->
        </view>
        <view class="list_item_content">
          <input
            type="text"
            v-model="form1.constructionReason"
            placeholder="请输入施工内容"
            placeholder-style="color: #999999;"
          />
        </view>
      </view>
      <view class="list_item">
        <view class="list_item_label">
          <text></text>
          <text>随行车辆</text>
        </view>
        <view class="list_item_content" @click="openInput(1)">
          <text :style="{ color: form1.carNos ? '#000000' : '' }">{{
            form1.carNos ? form1.carNos : "请输入车牌号码"
          }}</text>
          <!-- <input type="text" placeholder="请输入车牌号" v-model="form1.carNos" maxlength="8" placeholder-style="color: #999999;" /> -->
        </view>
      </view>
    </view>
    <view class="footer">
      <view class="footer_btn" @click="onSubmit">提交</view>
    </view>
    <!-- å…¥å›­æ—¶é—´ -->
    <u-datetime-picker
      :show="show4"
      :minDate="new Date().getTime()"
      mode="datetime"
      @cancel="show4 = false"
      @confirm="setstarttime"
    ></u-datetime-picker>
    <!-- ç¦»å›­æ—¶é—´ -->
    <u-datetime-picker
      v-if="form1.starttime"
      :show="show5"
      :minDate="formatTimeStamp(form1.starttime)"
      :maxDate="formatTimeStamp(form1.starttime.slice(0,10) + ' 23:59')"
      mode="datetime"
      @cancel="show5 = false"
      @confirm="setendtime"
    ></u-datetime-picker>
    <!-- é—¨ç¦ -->
    <u-popup
      :show="show"
      :round="10"
      :safeAreaInsetBottom="true"
      :closeable="true"
      mode="bottom"
      @close="closeMJ"
    >
      <view class="menjin">
        <view class="respondent-title"> é€‰æ‹©é—¨ç¦ </view>
        <scroll-view scroll-y class="list">
          <view
            class="list_item"
            v-for="(item, index) in columns"
            :key="index"
            @click="seleMJ(index)"
          >
            <text>{{ item.name }}</text>
            <image
              src="@/static/checkbox@2x.png"
              mode="widthFix"
              v-show="!item.active"
            ></image>
            <image
              src="@/static/checkbo1x_sel@2x.png"
              mode="widthFix"
              v-show="item.active"
            ></image>
          </view>
        </scroll-view>
        <view class="menjin_footer">
          <view class="menjin_footer_item" @click="closeMJ">取消</view>
          <view class="menjin_footer_item" @click="submitMJ">确认</view>
        </view>
      </view>
    </u-popup>
    <!-- é€‰æ‹©éšè¡Œäººå‘˜ -->
    <u-popup
      :show="show1"
      :round="10"
      :safeAreaInsetBottom="true"
      :closeable="true"
      mode="bottom"
      @close="show1 = false"
    >
      <view class="popup-content">
        <view class="respondent-title"> é€‰æ‹©éšè¡Œäººå‘˜ </view>
        <view class="search-box">
          <view class="search-box-top">
            <view class="search-box-top-ipt">
              <image src="@/static/ic_search@2x.png" mode="widthFix"></image>
              <input type="text" placeholder="搜索姓名/手机号" />
            </view>
            <text
              @click="
                show1 = false;
                show3 = true;
              "
              >新增</text
            >
          </view>
          <view class="search-box-total">共0条数据</view>
        </view>
        <scroll-view scroll-y class="list">
          <view class="item" v-for="(item, index) in 8" :key="index">
            <view class="item_a">
              <!-- <image src="@/static/checkbox.png" mode="widthFix" v-if="!item.active" /> -->
              <image src="@/static/checkbox_sel@2x.png" mode="widthFix" />
            </view>
            <view class="item_b">
              <image src="@/static/ic_mima@2x.png" mode="widthFix" />
            </view>
            <view class="item_c">
              <text>用户名</text>
              <text>已拉黑</text>
            </view>
          </view>
        </scroll-view>
        <view class="footer1">
          <view class="footer_left">
            <text class="footer_left_a">已选择：0人</text>
            <text class="footer_left_b">李伟；</text>
          </view>
          <view class="footer_btn">确认 0/0</view>
        </view>
      </view>
    </u-popup>
    <!-- è½¦è¾† -->
    <u-popup
      :show="show2"
      :round="10"
      :safeAreaInsetBottom="true"
      :closeable="true"
      mode="bottom"
      @close="show2 = false"
    >
      <view class="addcar">
        <view class="addcar_head">添加车辆</view>
        <view class="addcar_ipt">
          <input type="text" v-model="carName" placeholder="请输入车牌号" />
        </view>
        <view class="addcar_footer">
          <view class="addcar_footer_item" @click="show2 = false">取消</view>
          <view class="addcar_footer_item t" @click="submitCart">提交</view>
        </view>
      </view>
    </u-popup>
    <!-- æ·»åŠ éšè¡Œäººå‘˜ -->
    <u-popup
      :show="show3"
      :round="10"
      :safeAreaInsetBottom="true"
      :closeable="true"
      mode="bottom"
      @close="show3 = false"
    >
      <view class="adduser">
        <view class="adduser_head">随行人员</view>
        <view class="adduser_list">
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text>姓名</text>
              <text>*</text>
            </view>
            <view class="adduser_list_item_ipt">
              <input
                type="text"
                v-model="withUserList.name"
                placeholder-style="color: #999999;font-size: 28rpx;"
                placeholder="请输入真实姓名"
              />
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text>手机号</text>
              <text>*</text>
            </view>
            <view class="adduser_list_item_ipt">
              <input
                type="number"
                v-model="withUserList.phone"
                maxlength="11"
                placeholder-style="color: #999999;font-size: 28rpx;"
                placeholder="请输入手机号"
              />
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text>证件类型</text>
              <text>*</text>
            </view>
            <view class="adduser_list_item_ipt" @click="show6 = true">
              <text
                :style="{ color: withUserList.idcardTypeName ? '#000000' : '' }"
                >{{
                  withUserList.idcardTypeName
                    ? withUserList.idcardTypeName
                    : "请选择"
                }}</text
              >
              <u-icon name="arrow-right" color="#CCCCCC" size="16"></u-icon>
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text>证件号码</text>
              <text>*</text>
            </view>
            <view class="adduser_list_item_ipt">
              <input
                type="text"
                v-model="withUserList.idcardNo"
                maxlength="18"
                placeholder-style="color: #999999;font-size: 28rpx;"
                placeholder="请输入证件号码"
              />
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text>*</text>
              <text>公司</text>
            </view>
            <view class="adduser_list_item_ipt">
              <input
                type="text"
                v-model="withUserList.companyName"
                placeholder-style="color: #999999;font-size: 28rpx;"
                placeholder="请输入公司名称"
              />
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text></text>
              <text>随行车辆</text>
            </view>
            <view class="adduser_list_item_ipt" @click="openInput(2)">
              <text :style="{ color: withUserList.carNos ? '#000000' : '' }">{{
                withUserList.carNos ? withUserList.carNos : "请输入车牌号码"
              }}</text>
              <!-- <input type="text" v-model="withUserList.carNos" disabled placeholder-style="color: #999999;font-size: 28rpx;" placeholder="请输入车牌号" /> -->
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label1">
              <text class="cc">人脸照片<b>*</b></text>
              <text class="aa"
                >1、请提供五官清晰，人脸居中的正面人脸免冠照片；</text
              >
              <text class="aa">2、照片无逆光、无PS、无过度美颜处理；</text>
            </view>
            <view class="adduser_list_item_ipt">
              <view
                class="adduser_list_item_ipt1_upload"
                @click="upload('faceImg')"
                v-if="!withUserList.faceImgUrl"
              >
                <u-icon
                  name="plus"
                  color="rgb(153, 153, 153)"
                  size="28"
                ></u-icon>
              </view>
              <view
                class="adduser_list_item_ipt1_upload"
                @click="upload('faceImg')"
                v-else
              >
                <image :src="withUserList.faceImgUrl" mode="widthFix"></image>
              </view>
            </view>
          </view>
          <view class="adduser_list_item">
            <view class="adduser_list_item_label">
              <text>健康证照片</text>
              <text v-if="visit === '1'">*</text>
            </view>
            <view class="adduser_list_item_ipt">
              <view
                class="adduser_list_item_ipt1_upload"
                @click="upload('imgurl')"
                v-if="!withUserList.imgurlUrl"
              >
                <u-icon
                  name="plus"
                  color="rgb(153, 153, 153)"
                  size="28"
                ></u-icon>
              </view>
              <view
                class="adduser_list_item_ipt1_upload"
                @click="upload('imgurl')"
                v-else
              >
                <image :src="withUserList.imgurlUrl" mode="widthFix"></image>
              </view>
            </view>
          </view>
        </view>
        <view class="adduser_footer">
          <view class="adduser_footer_item" @click="show3 = false">取消</view>
          <view class="adduser_footer_item t" @click="submitUser">提交</view>
        </view>
      </view>
    </u-popup>
    <u-picker
      keyName="name"
      :show="show6"
      :columns="columns1"
      @confirm="seleIdcard"
      @cancel="show6 = false"
    ></u-picker>
    <u-picker
      keyName="name"
      :show="showName"
      :columns="VisitPoeple"
      @confirm="selectedName"
      @cancel="showName = false"
    ></u-picker>
    <u-picker
      keyName="title"
      :show="showReason"
      :columns="VisitReason"
      @confirm="selectedReason"
      @cancel="showReason = false"
    ></u-picker>
    <!-- <tly-picture-cut ref="tlyPictureCut" :pictureSrc="photoSrc" @createImg="uploadImg"></tly-picture-cut> -->
    <keyboardInput ref="keyboard" @export="setPlate" @close="closeInput" />
    <qf-image-cropper
      ref="cropper"
      :width="280"
      :height="280"
      :radius="30"
      @crop="uploadImg"
    ></qf-image-cropper>
  </view>
</template>

<script>
import tlyPictureCut from "@/components/tly-picture-cut/tlyPictureCut.vue"
import keyboardInput from "@/components/keyboard-input/keyboard-input.vue"
import QfImageCropper from '@/uni_modules/qf-image-cropper/components/qf-image-cropper/qf-image-cropper.vue'
import { getDaysAfterDate } from '@/utils/utils.js'
import {
  getVisitedMember,
  getSystemDictData,
  getVisitedVisitReason,
  createFk
} from '@/api'
export default {
  data() {
    return {
      photoSrc: '',
      type: '',
      inputType: '',
      showName: false,
      show: false,
      show1: false,
      show2: false,
      show3: false,
      show4: false,
      show5: false,
      show6: false,
      show7: false,
      showReason: false,
      fileList: [],
      columns1: [
        [{ name: '身份证', id: 0 }, { name: '港澳证件', id: 1 }, { name: '护照', id: 2 }],
      ],
      VisitReason: [],
      VisitPoeple: [],
      columns: [],
      cars: [],
      day: null,
      maxTime: '',
      carName: '',
      personnel: [],
      userAnswerId: '',
      form1: {
        phone1: '',
        receptMemberId: '',
        receptMemberName: '',
        starttime: '',
        endtime: '',
        doors: '',
        doorSelectName: '',
        reason: '',
        carNos: '',
        type: 0
      },
      withUserList: {
        name: '',
        phone: '',
        idcardType: '',
        idcardTypeName: '',
        companyName: '',
        idcardNo: '',
        faceImg: '',
        faceImgUrl: '',
        imgurl: '',
        imgurlUrl: ''
      },
      visit: '',
      form: {},
      accessControl: '',
      verify: ''
    }
  },
  components: { tlyPictureCut, keyboardInput, QfImageCropper },
  onLoad(options) {
    if (options.data) {
      this.form = JSON.parse(options.data)
    }
    // this.getvisit()
    // this.getVisit1()
    // this.getUserValid()
    this.getUser()
  },
  methods: {
    openInput(type) {
      this.inputType = type
      this.$refs.keyboard.open()
    },
    setPlate(e) {
      if (this.inputType === 1) {
        this.form1.carNos = e
      } else if (this.inputType === 2) {
        this.withUserList.carNos = e
      }
      this.$forceUpdate()
      this.closeInput()
    },
    closeInput() {
      this.$refs.keyboard.close()
    },
    constructionChange(e) {
      console.log(e.detail.value)
      this.form1.type = Number(e.detail.value)
      console.log(this.form1.type)
    },
    uploadImg(file) {
      this.$refs.cropper.close()
      uni.showLoading({ title: '上传中', mask: true })
      uni.uploadFile({
        url: `${this.$baseUrl}visitsAdmin/cloudService/web/public/uploadFtp.do`,
        filePath: file.tempFilePath,
        name: 'file',
        formData: {
          folderCode: 'MEMBER_IMG'
        },
        success: (uploadFileRes) => {
          let res = JSON.parse(uploadFileRes.data)
          this.withUserList.faceImg = res.data.halfPath
          this.withUserList.faceImgUrl = res.data.prefixPath + res.data.folder + res.data.halfPath
        },
        complete() {
          uni.hideLoading()
        }
      })
    },
    closeMJ() {
      this.show = false
      this.columns.forEach(item => {
        item.active = false
      })
    },
    onSubmit() {
      if (!this.form1.receptMemberId) return uni.showToast({
        title: '请填写有效的访问人',
        icon: 'none'
      })
      if (!this.form1.starttime) return uni.showToast({
        title: '入园时间不能为空',
        icon: 'none'
      })
      if (!this.form1.endtime) return uni.showToast({
        title: '离园时间不能为空',
        icon: 'none'
      })
      if (!this.form1.doorSelectName && this.accessControl == 1) return uni.showToast({
        title: '访问门禁不能为空',
        icon: 'none'
      })
      if (!this.form1.reason) return uni.showToast({
        title: '拜访事由不能为空',
        icon: 'none'
      })
      // this.form1.starttime = this.form1.starttime + ':00'
      // this.form1.endtime = this.form1.endtime + ':00'
      let data = JSON.parse(JSON.stringify(this.form1))
      data.starttime = data.starttime + ':00'
      data.endtime = data.endtime + ':00'
      createFk({
        ...this.form,
        ...data,
        openid: this.$store.state.openId,
        withUserList: this.personnel
      }).then(res => {
        if (res.code === 200) {
          uni.navigateTo({
            url: `/pages/appointmentDetails/appointmentDetails?id=${res.data}`
          })
        }
      })
    },
    deleUser(i) {
      this.personnel.splice(i, 1)
    },
    getVisit1() {
      // æ˜¯å¦éœ€è¦ç­”题
      this.$u.api.getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'HEALTH_CARD'
      }).then(res => {
        if (res.code === 200) {
          this.visit = res.data.code
        }
      })
      // èµ·å§‹æ—¶é—´æ—¶é•¿
      getSystemDictData({
        dictCode: 'VISIT_CONFIG',
        label: 'VALIDATE_VISIT'
      }).then(res => {
        if (res.code === 200) {
          this.day = Number(res.data.code)
          // console.log(nextDay('after', true, this.day))
        }
      })
    },
    submitUser() {
      if (!this.withUserList.name) return uni.showToast({
        title: '姓名不能为空',
        icon: 'none'
      })
      if (!this.withUserList.phone) return uni.showToast({
        title: '手机号不能为空',
        icon: 'none'
      })
      const regExp = /^1[3456789]\d{9}$/
      if (!regExp.test(this.withUserList.phone)) return uni.showToast({
        title: '手机号格式错误',
        icon: 'none'
      })
      if (!String(this.withUserList.idcardType)) return uni.showToast({
        title: '证件类型不能为空',
        icon: 'none'
      })
      if (!this.withUserList.idcardNo) return uni.showToast({
        title: '证件号码不能为空',
        icon: 'none'
      })
      if (this.withUserList.idcardType === 0) {
        const regex = /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}[\dxX]$/
        if (!regex.test(this.withUserList.idcardNo)) return uni.showToast({
          title: '证件号码格式错误',
          icon: 'none'
        })
      }
      if (!this.withUserList.companyName) return uni.showToast({
        title: '公司不能为空',
        icon: 'none'
      })
      if (!this.withUserList.faceImg) return uni.showToast({
        title: '人脸照片不能为空',
        icon: 'none'
      })
      if (this.visit === '1') {
        if (!this.withUserList.imgurl) return uni.showToast({
          title: '人脸照片不能为空',
          icon: 'none'
        })
      }
      let arr = JSON.parse(JSON.stringify(this.withUserList))
      this.personnel.push(arr)
      this.show3 = false
      this.withUserList.name = ''
      this.withUserList.phone = ''
      this.withUserList.idcardType = ''
      this.withUserList.idcardTypeName = ''
      this.withUserList.companyName = ''
      this.withUserList.idcardNo = ''
      this.withUserList.faceImg = ''
      this.withUserList.faceImgUrl = ''
      this.withUserList.imgurl = ''
      this.withUserList.imgurlUrl = ''
    },
    upload(type) {
      this.type = type
      if (type === 'faceImg') {
        this.$refs.cropper.open()
        return
      }
      uni.chooseImage({
        success: (chooseImageRes) => {
          uni.showLoading({ title: '上传中', mask: true })
          for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {
            uni.uploadFile({
              url: `${this.$baseUrl}visitsAdmin/cloudService/web/public/uploadFtp.do`,
              filePath: chooseImageRes.tempFilePaths[i],
              name: 'file',
              formData: {
                folderCode: 'MEMBER_IMG'
              },
              success: (uploadFileRes) => {
                let res = JSON.parse(uploadFileRes.data)
                if (type === 'faceImg') {
                  this.withUserList.faceImg = res.data.halfPath
                  this.withUserList.faceImgUrl = res.data.prefixPath + res.data.folder + res.data.halfPath
                } else {
                  this.withUserList.imgurl = res.data.halfPath
                  this.withUserList.imgurlUrl = res.data.prefixPath + res.data.folder + res.data.halfPath
                }
              },
              complete() {
                if (i === chooseImageRes.tempFilePaths.length - 1) {
                  uni.hideLoading()
                }
              }
            })
          }
        }
      })
    },
    seleIdcard(e) {
      this.withUserList.idcardType = e.value[0].id
      this.withUserList.idcardTypeName = e.value[0].name
      this.show6 = false
    },
    selectedName(e) {
      this.form1.receptMemberName = e.value[0].name
      this.form1.receptMemberId = e.value[0].id
      this.form1.receptMemberDepartment = e.value[0].companyId
      this.showName = false
    },
    selectedReason(e) {
      this.form1.reason = e.value[0].title
      console.log(e.value[0].title)
      this.showReason = false
    },
    submitCart() {
      if (!this.carName) return uni.showToast({
        title: '请输入车牌号码',
        icon: 'none'
      })
      this.cars.push(this.carName)
      this.form1.carNos = this.cars.join(',')
      this.carName = ''
      this.show2 = false
    },
    deleCars(i) {
      this.cars.splice(i, 1)
      this.form1.carNos = this.cars.join(',')
    },
    submitMJ() {
      let arr = []
      let names = []
      this.columns.forEach(item => {
        if (item.active) {
          arr.push(item.id)
          names.push(item.name)
        }
      })
      if (arr.length === 0) return uni.showToast({
        title: '请选择门禁',
        icon: 'none'
      })
      this.form1.doorSelectName = names.join(',')
      this.form1.doors = arr.join(',')
      this.show = false
    },
    seleMJ(i) {
      this.columns.forEach((item, index) => {
        if (index === i) {
          item.active = !item.active
        }
      })
    },
    openLC() {
      if (!this.form1.starttime) return uni.showToast({
        title: '请先选择入园时间',
        icon: 'none'
      })
      this.show5 = true
    },
    setstarttime(e) {
      this.form1.starttime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM')
      // this.maxTime = getDaysAfterDate(uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM'), this.day)
      this.maxTime = this.form1.starttime
      console.log(this.form1.starttime.slice(0,10))
      this.show4 = false
    },
    setendtime(e) {
      this.form1.endtime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM')
      this.show5 = false
    },
    formatTimeStamp(date) {
      return Date.parse(new Date(`${date}`)) || Date.parse(new Date(`${date.replace(/-/g, '/')}`))
    },
    // æŸ¥è¯¢ç”¨æˆ·
    getUser() {
      getVisitedMember().then(res => {
        this.VisitPoeple = [res.data || []]
      })
      getVisitedVisitReason({}).then(res => {
        this.VisitReason = [res.data || []]
      })
    },
    // è¢«æ‹œè®¿äººä¿¡æ¯æ ¡éªŒæ–¹å¼ï¼ˆ0手机号单独校验 1手机号和姓名组合校验）
    getUserValid() {
      getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'BEVISITED_USER_VALID'
      }).then(res => {
        if (res.code === 200) {
          this.verify = res.data.code
        }
      })
    },
    // èŽ·å–是否需要选择门禁/门禁列表
    getvisit() {
      getSystemDictData({
        dictCode: 'SYSTEM',
        label: 'SELECT_DOORS_VISIT_REQUIRED'
      }).then(res => {
        if (res.code === 200) {
          this.accessControl = res.data.code
          if (res.data.code === '1') {
            this.$u.api.deviceRoleList({ type: 1 })
              .then(device => {
                if (device.code === 200) {
                  if (device.data.length > 0) {
                    device.data.forEach(item => {
                      item.active = false
                    })
                    this.columns = device.data
                  }
                }
              })
          }
        }
      })
    },
    confirm(e) {
      this.show = false
    }
  }
}
</script>
<style>
page {
  background-color: #f7f7f7 !important;
}
.u-upload__button {
  margin: 0 !important;
}
</style>
<style lang="scss" scoped>
.visit {
  width: 100%;
  .menjin {
    width: 100%;
    .respondent-title {
      width: 100%;
      height: 100rpx;
      line-height: 100rpx;
      text-align: center;
      font-size: 32rpx;
      font-weight: 600;
      color: #222222;
    }
    .list {
      width: 100%;
      height: 400rpx;
      display: flex;
      flex-direction: column;
      .list_item {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        text {
          font-size: 28rpx;
          color: #000000;
        }
        image {
          width: 30rpx;
          height: 30rpx;
        }
      }
    }
    .menjin_footer {
      width: 100%;
      padding: 30rpx;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;
      .menjin_footer_item {
        flex: 1;
        height: 80rpx;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 10rpx;
        background-color: $uni-color-primary;
        color: #ffffff;
        font-size: 26rpx;
        margin-left: 30rpx;
        &:first-child {
          margin-left: 0 !important;
        }
      }
    }
  }
  .adduser {
    padding: 30rpx;
    width: 100%;
    box-sizing: border-box;
    .adduser_head {
      width: 100%;
      text-align: center;
      font-size: 32rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 600;
      color: #222222;
    }
    .adduser_list {
      width: 100%;
      margin-top: 40rpx;
      .adduser_list_item {
        width: 100%;
        padding: 24rpx 0;
        box-sizing: border-box;
        border-bottom: 1rpx solid #e5e5e5;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .adduser_list_item_label1 {
          flex: 1;
          display: flex;
          flex-direction: column;
          .cc {
            font-size: 30rpx;
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            color: #222222;
            margin-bottom: 20rpx;
            b {
              font-size: 30rpx;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              color: #e0312a;
            }
          }
          .aa {
            font-size: 24rpx;
            font-weight: 400;
            color: #999999;
          }
        }
        .adduser_list_item_label {
          flex-shrink: 0;
          display: flex;
          align-items: center;
          font-family: PingFangSC, PingFang SC;
          font-size: 30rpx;
          text {
            &:nth-child(1) {
              color: #e0312a;
            }
            &:nth-child(2) {
              color: #222222;
            }
          }
        }
        .adduser_list_item_ipt {
          flex-shrink: 0;
          text-align: right;
          font-size: 28rpx;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          color: #333333;
          margin-left: 30rpx;
          display: flex;
          align-items: center;
          justify-content: flex-end;
          .adduser_list_item_ipt1_upload {
            width: 120rpx;
            height: 120rpx;
            background-color: #ececec;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            image {
              width: 100%;
              height: 100%;
            }
          }
          text {
            font-size: 28rpx;
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            color: #999999;
          }
        }
      }
    }
    .adduser_footer {
      width: 100%;
      margin-top: 60rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      .t {
        background: #4d99a9 !important;
        color: #ffffff !important;
      }
      .adduser_footer_item {
        width: 336rpx;
        height: 88rpx;
        line-height: 88rpx;
        text-align: center;
        border-radius: 44rpx;
        border: 1rpx solid #4d99a9;
        font-size: 32rpx;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        color: #4d99a9;
        margin-right: 18rpx;
        &:last-child {
          margin: 0 !important;
        }
      }
    }
  }

  .addcar {
    padding: 30rpx;
    width: 100%;
    box-sizing: border-box;
    .addcar_head {
      text-align: center;
      font-size: 32rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 600;
      color: #222222;
    }
    .addcar_ipt {
      width: 100%;
      height: 100rpx;
      line-height: 100rpx;
      text-align: center;
      background: #f7f7f7;
      border-radius: 50rpx;
      margin-top: 60rpx;
      input {
        width: 100%;
        height: 100%;
        font-size: 28rpx;
        font-weight: 400;
        color: #000000;
        text-align: center;
      }
    }
    .addcar_footer {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 60rpx;
      .t {
        background: #4d99a9 !important;
        color: #ffffff !important;
      }
      .addcar_footer_item {
        flex: 1;
        height: 88rpx;
        line-height: 88rpx;
        font-size: 32rpx;
        font-weight: 400;
        color: #025eef;
        text-align: center;
        border-radius: 44rpx;
        border: 1rpx solid #025eef;
        margin-right: 18rpx;
        &:last-child {
          margin-right: 0 !important;
        }
      }
    }
  }

  .popup-content {
    padding: 30rpx 30rpx 0 30rpx;
    overflow: hidden;
    display: flex;
    flex-flow: column;
    .respondent-title {
      width: 100%;
      text-align: center;
      font-size: 32rpx;
      font-weight: 600;
      color: #222222;
    }
    .search-box {
      width: 100%;
      margin-top: 40rpx;
      .search-box-top {
        width: 100%;
        height: 68rpx;
        display: flex;
        align-items: center;
        .search-box-top-ipt {
          flex: 1;
          height: 100%;
          padding: 0 30rpx;
          box-sizing: border-box;
          background: #f7f7f7;
          border-radius: 4rpx;
          display: flex;
          align-items: center;
          image {
            width: 36rpx;
            height: 36rpx;
            flex-shrink: 0;
            margin-right: 22rpx;
          }
          input {
            flex: 1;
            height: 100%;
            font-size: 26rpx;
            font-weight: 400;
            color: #b2b2b2;
          }
        }
        text {
          flex-shrink: 0;
          margin-left: 30rpx;
          font-size: 28rpx;
          font-weight: 400;
          color: #025eef;
        }
      }
      .search-box-total {
        font-size: 26rpx;
        font-weight: 400;
        color: #666666;
        margin-top: 24rpx;
      }
    }
    .list {
      width: 100%;
      height: 800rpx;
      margin-top: 30rpx;
      padding: 0 !important;
      .item {
        width: 100%;
        height: 102rpx;
        display: flex;
        align-items: center;
        border-bottom: 1rpx solid #e5e5e5;
        .item_a {
          flex-shrink: 0;
          width: 36rpx;
          height: 36rpx;
          margin-right: 24rpx;
          image {
            width: 100%;
            height: 100%;
          }
        }
        .item_b {
          flex-shrink: 0;
          width: 80rpx;
          height: 80rpx;
          display: flex;
          align-items: center;
          justify-content: center;
          overflow: hidden;
          margin-right: 24rpx;
          image {
            width: 100%;
            height: 100%;
          }
        }
        .item_c {
          flex: 1;
          display: flex;
          align-items: center;
          text {
            &:nth-child(1) {
              font-size: 30rpx;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              color: #222222;
            }
            &:nth-child(2) {
              font-size: 20rpx;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              color: #999999;
              padding: 1rpx 4rpx;
              box-sizing: border-box;
              background-color: #eeeeee;
              margin-left: 12rpx;
            }
          }
        }
      }
    }
    .footer1 {
      width: 100%;
      height: 100rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 14rpx 0 0 0;
      box-sizing: border-box;
      .footer_left {
        flex: 1;
        display: flex;
        flex-direction: column;
        .footer_left_a {
          font-size: 26rpx;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          color: #333333;
        }
        .footer_left_b {
          font-size: 24rpx;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          color: #999999;
        }
      }
      .footer_btn {
        flex-shrink: 0;
        width: 216rpx;
        height: 72rpx;
        line-height: 72rpx;
        text-align: center;
        background: #025eef;
        border-radius: 8rpx;
        font-size: 28rpx;
        font-weight: 600;
        color: #ffffff;
      }
    }
  }

  .head {
    width: 100%;
    padding: 20rpx 30rpx;
    box-sizing: border-box;
    font-size: 28rpx;
    font-weight: 400;
    color: #666666;
  }

  .list {
    width: 100%;
    padding: 0 30rpx;
    box-sizing: border-box;
    background-color: #ffffff;
    .empty {
      width: 750rpx;
      height: 20rpx;
      background-color: #f7f7f7;
      margin: 0 -30rpx;
    }
    .list_item {
      width: 100%;
      // min-height: 98rpx;
      padding: 30rpx 0;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1rpx solid #e5e5e5;

      .list_item_label {
        flex-shrink: 0;
        display: flex;
        align-items: center;

        text {
          &:nth-child(1) {
            font-size: 30rpx;
            font-weight: 400;
            color: #e42d2d;
          }

          &:nth-child(2) {
            font-size: 30rpx;
            font-weight: 400;
            color: #222222;
          }
        }
      }

      .list_item_content {
        flex: 1;
        height: 100%;
        margin-left: 30rpx;
        display: flex;
        align-items: center;
        justify-content: flex-end;

        text {
          font-size: 28rpx;
          font-weight: 400;
          color: #999999;
          margin-right: 6rpx;
        }

        input {
          width: 100%;
          height: 100%;
          text-align: right;
          font-size: 28rpx;
          font-weight: 400;
          color: #222222;
        }
      }
    }
  }

  .cate {
    width: 100%;
    padding: 30rpx;
    box-sizing: border-box;
    background-color: #ffffff;
    .cate_head {
      font-size: 32rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 600;
      color: #222222;
    }

    .cate_list {
      width: 100%;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      margin-top: 30rpx;

      .cate_list_item {
        height: 64rpx;
        padding: 0 20rpx;
        box-sizing: border-box;
        background-color: #eeeeee;
        border-radius: 4rpx;
        margin-right: 20rpx;
        margin-bottom: 20rpx;
        display: flex;
        align-items: center;

        &:last-child {
          margin-right: 0 !important;
        }

        text {
          font-size: 26rpx;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          color: #333333;
          margin-right: 30rpx;
        }
      }
    }

    .cate_add {
      width: 200rpx;
      height: 50rpx;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(2, 94, 239, 0);
      border-radius: 25rpx;
      border: 1rpx solid #4c99a8;
      font-size: 22rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      margin-top: 20rpx;
      color: #4c99a8;
      margin: 0 auto;
    }
  }

  .zw {
    width: 100%;
    height: calc(env(safe-area-inset-bottom) + 118rpx);
  }

  .footer {
    width: 100%;
    padding: 0 30rpx;
    padding-bottom: env(safe-area-inset-bottom);
    box-sizing: border-box;
        margin-top: 80rpx;
    // position: fixed;
    // left: 0;
    // bottom: 30rpx;

    .footer_btn {
      width: 100%;
      height: 88rpx;
      line-height: 88rpx;
      text-align: center;
      background: #4c99a8;
      border-radius: 44rpx;
      font-size: 32rpx;
      font-weight: 600;
      color: #ffffff;
    }
  }
}
<template>

    <view class="visit">

        <!-- <view class="head">拜访信息</view> -->

        <view class="list">

            <view class="list_item">

                <view class="list_item_label">

                    <text>*</text>

                    <text>被访人</text>

                </view>

                <view class="list_item_content" @click="selName">

                    <text :style="{ color: form1.receptMemberName ? '#000000' : '' }">{{

            form1.receptMemberName ? form1.receptMemberName : "请选择"

          }}</text>

                    <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>

                </view>

            </view>

            <view class="list_item">

                <view class="list_item_label">

                    <text>*</text>

                    <text>入园时间</text>

                </view>

                <view class="list_item_content" @click="show4 = true">

                    <text :style="{ color: form1.starttime ? '#000000' : '' }">{{

            form1.starttime ? form1.starttime : "请选择"

          }}</text>

                    <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>

                </view>

            </view>

            <view class="list_item">

                <view class="list_item_label">

                    <text>*</text>

                    <text>离园时间</text>

                </view>

                <view class="list_item_content" @click="openLC">

                    <text :style="{ color: form1.endtime ? '#000000' : '' }">{{

            form1.endtime ? form1.endtime : "请选择"

          }}</text>

                    <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>

                </view>

            </view>

            <!-- <view class="list_item" v-if="accessControl === '1'" @click="show = true">

                <view class="list_item_label">

                    <text>访问门禁</text>

                    <text>*</text>

                </view>

                <view class="list_item_content">

                    <text :style="{color: form1.doorSelectName ? '#000000' : ''}">{{form1.doorSelectName ? form1.doorSelectName : '请选择'}}</text>

                    <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>

                </view>

            </view> -->

            <div class="empty"></div>

            <view class="list_item">

                <view class="list_item_label">

                    <text>*</text>

                    <text>拜访事由</text>

                </view>

                <view class="list_item_content" @click="showReason = true">

                    <text :style="{ color: form1.reason ? '#000000' : '' }">{{

            form1.reason ? form1.reason : "请选择拜访事由"

          }}</text>

                    <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>

                </view>

            </view>

            <view class="list_item">

                <view class="list_item_label">

                    <text></text>

                    <text>是否施工作业</text>

                </view>

                <view class="list_item_content">

                    <switch color="#4e99a9" style="transform: scale(0.8)" @change="constructionChange" />

                </view>

            </view>

            <view v-if="form1.type == '1'" class="list_item">

                <view class="list_item_label">

                    <text></text>

                    <text>施工内容</text>

                    <!-- <text>*</text> -->

                </view>

                <view class="list_item_content">

                    <input type="text" v-model="form1.constructionReason" placeholder="请输入施工内容"

                        placeholder-style="color: #999999;" />

                </view>

            </view>

            <view class="list_item">

                <view class="list_item_label">

                    <text></text>

                    <text>随行车辆</text>

                </view>

                <view class="list_item_content" @click="openInput(1)">

                    <text :style="{ color: form1.carNos ? '#000000' : '' }">{{

            form1.carNos ? form1.carNos : "请输入车牌号码"

          }}</text>

                    <!-- <input type="text" placeholder="请输入车牌号" v-model="form1.carNos" maxlength="8" placeholder-style="color: #999999;" /> -->

                </view>

            </view>

        </view>

        <view class="footer">

            <view class="footer_btn" @click="onSubmit">提交</view>

        </view>

        <!-- å…¥å›­æ—¶é—´ -->

        <u-datetime-picker :show="show4" :minDate="new Date().getTime()" mode="datetime" :formatter="formatter"

            @cancel="show4 = false" @confirm="setstarttime"></u-datetime-picker>

        <!-- ç¦»å›­æ—¶é—´ -->

        <u-datetime-picker v-if="form1.starttime" :show="show5" :formatter="formatter"

            :minDate="formatTimeStamp(form1.starttime)" :maxDate="formatTimeStamp(form1.starttime.slice(0,10) + ' 23:59')"

            mode="datetime" @cancel="show5 = false" @confirm="setendtime"></u-datetime-picker>

        <!-- é—¨ç¦ -->

        <u-popup :show="show" :round="10" :safeAreaInsetBottom="true" :closeable="true" mode="bottom" @close="closeMJ">

            <view class="menjin">

                <view class="respondent-title"> é€‰æ‹©é—¨ç¦ </view>

                <scroll-view scroll-y class="list">

                    <view class="list_item" v-for="(item, index) in columns" :key="index" @click="seleMJ(index)">

                        <text>{{ item.name }}</text>

                        <image src="@/static/checkbox@2x.png" mode="widthFix" v-show="!item.active"></image>

                        <image src="@/static/checkbo1x_sel@2x.png" mode="widthFix" v-show="item.active"></image>

                    </view>

                </scroll-view>

                <view class="menjin_footer">

                    <view class="menjin_footer_item" @click="closeMJ">取消</view>

                    <view class="menjin_footer_item" @click="submitMJ">确认</view>

                </view>

            </view>

        </u-popup>

        <!-- é€‰æ‹©éšè¡Œäººå‘˜ -->

        <u-popup :show="show1" :round="10" :safeAreaInsetBottom="true" :closeable="true" mode="bottom"

            @close="show1 = false">

            <view class="popup-content">

                <view class="respondent-title"> é€‰æ‹©éšè¡Œäººå‘˜ </view>

                <view class="search-box">

                    <view class="search-box-top">

                        <view class="search-box-top-ipt">

                            <image src="@/static/ic_search@2x.png" mode="widthFix"></image>

                            <input type="text" placeholder="搜索姓名/手机号" />

                        </view>

                        <text @click="

                show1 = false;

                show3 = true;

              ">新增</text>

                    </view>

                    <view class="search-box-total">共0条数据</view>

                </view>

                <scroll-view scroll-y class="list">

                    <view class="item" v-for="(item, index) in 8" :key="index">

                        <view class="item_a">

                            <!-- <image src="@/static/checkbox.png" mode="widthFix" v-if="!item.active" /> -->

                            <image src="@/static/checkbox_sel@2x.png" mode="widthFix" />

                        </view>

                        <view class="item_b">

                            <image src="@/static/ic_mima@2x.png" mode="widthFix" />

                        </view>

                        <view class="item_c">

                            <text>用户名</text>

                            <text>已拉黑</text>

                        </view>

                    </view>

                </scroll-view>

                <view class="footer1">

                    <view class="footer_left">

                        <text class="footer_left_a">已选择：0人</text>

                        <text class="footer_left_b">李伟；</text>

                    </view>

                    <view class="footer_btn">确认 0/0</view>

                </view>

            </view>

        </u-popup>

        <!-- è½¦è¾† -->

        <u-popup :show="show2" :round="10" :safeAreaInsetBottom="true" :closeable="true" mode="bottom"

            @close="show2 = false">

            <view class="addcar">

                <view class="addcar_head">添加车辆</view>

                <view class="addcar_ipt">

                    <input type="text" v-model="carName" placeholder="请输入车牌号" />

                </view>

                <view class="addcar_footer">

                    <view class="addcar_footer_item" @click="show2 = false">取消</view>

                    <view class="addcar_footer_item t" @click="submitCart">提交</view>

                </view>

            </view>

        </u-popup>

        <!-- æ·»åŠ éšè¡Œäººå‘˜ -->

        <u-popup :show="show3" :round="10" :safeAreaInsetBottom="true" :closeable="true" mode="bottom"

            @close="show3 = false">

            <view class="adduser">

                <view class="adduser_head">随行人员</view>

                <view class="adduser_list">

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text>姓名</text>

                            <text>*</text>

                        </view>

                        <view class="adduser_list_item_ipt">

                            <input type="text" v-model="withUserList.name" placeholder-style="color: #999999;font-size: 28rpx;"

                                placeholder="请输入真实姓名" />

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text>手机号</text>

                            <text>*</text>

                        </view>

                        <view class="adduser_list_item_ipt">

                            <input type="number" v-model="withUserList.phone" maxlength="11"

                                placeholder-style="color: #999999;font-size: 28rpx;" placeholder="请输入手机号" />

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text>证件类型</text>

                            <text>*</text>

                        </view>

                        <view class="adduser_list_item_ipt" @click="show6 = true">

                            <text :style="{ color: withUserList.idcardTypeName ? '#000000' : '' }">{{

                  withUserList.idcardTypeName

                    ? withUserList.idcardTypeName

                    : "请选择"

                }}</text>

                            <u-icon name="arrow-right" color="#CCCCCC" size="16"></u-icon>

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text>证件号码</text>

                            <text>*</text>

                        </view>

                        <view class="adduser_list_item_ipt">

                            <input type="text" v-model="withUserList.idcardNo" maxlength="18"

                                placeholder-style="color: #999999;font-size: 28rpx;" placeholder="请输入证件号码" />

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text>*</text>

                            <text>公司</text>

                        </view>

                        <view class="adduser_list_item_ipt">

                            <input type="text" v-model="withUserList.companyName" placeholder-style="color: #999999;font-size: 28rpx;"

                                placeholder="请输入公司名称" />

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text></text>

                            <text>随行车辆</text>

                        </view>

                        <view class="adduser_list_item_ipt" @click="openInput(2)">

                            <text :style="{ color: withUserList.carNos ? '#000000' : '' }">{{

                withUserList.carNos ? withUserList.carNos : "请输入车牌号码"

              }}</text>

                            <!-- <input type="text" v-model="withUserList.carNos" disabled placeholder-style="color: #999999;font-size: 28rpx;" placeholder="请输入车牌号" /> -->

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label1">

                            <text class="cc">人脸照片<b>*</b></text>

                            <text class="aa">1、请提供五官清晰，人脸居中的正面人脸免冠照片；</text>

                            <text class="aa">2、照片无逆光、无PS、无过度美颜处理；</text>

                        </view>

                        <view class="adduser_list_item_ipt">

                            <view class="adduser_list_item_ipt1_upload" @click="upload('faceImg')" v-if="!withUserList.faceImgUrl">

                                <u-icon name="plus" color="rgb(153, 153, 153)" size="28"></u-icon>

                            </view>

                            <view class="adduser_list_item_ipt1_upload" @click="upload('faceImg')" v-else>

                                <image :src="withUserList.faceImgUrl" mode="widthFix"></image>

                            </view>

                        </view>

                    </view>

                    <view class="adduser_list_item">

                        <view class="adduser_list_item_label">

                            <text>健康证照片</text>

                            <text v-if="visit === '1'">*</text>

                        </view>

                        <view class="adduser_list_item_ipt">

                            <view class="adduser_list_item_ipt1_upload" @click="upload('imgurl')" v-if="!withUserList.imgurlUrl">

                                <u-icon name="plus" color="rgb(153, 153, 153)" size="28"></u-icon>

                            </view>

                            <view class="adduser_list_item_ipt1_upload" @click="upload('imgurl')" v-else>

                                <image :src="withUserList.imgurlUrl" mode="widthFix"></image>

                            </view>

                        </view>

                    </view>

                </view>

                <view class="adduser_footer">

                    <view class="adduser_footer_item" @click="show3 = false">取消</view>

                    <view class="adduser_footer_item t" @click="submitUser">提交</view>

                </view>

            </view>

        </u-popup>

        <u-picker keyName="name" :show="show6" :columns="columns1" @confirm="seleIdcard" @cancel="show6 = false"></u-picker>

        <u-picker keyName="name" :show="showName" :columns="VisitPoeple" @confirm="selectedName"

            @cancel="showName = false"></u-picker>

        <u-picker keyName="title" :show="showReason" :columns="VisitReason" @confirm="selectedReason"

            @cancel="showReason = false"></u-picker>

        <!-- <tly-picture-cut ref="tlyPictureCut" :pictureSrc="photoSrc" @createImg="uploadImg"></tly-picture-cut> -->

        <keyboardInput ref="keyboard" @export="setPlate" @close="closeInput" />

        <qf-image-cropper ref="cropper" :width="280" :height="280" :radius="30" @crop="uploadImg"></qf-image-cropper>

    </view>

</template>



<script>

    import tlyPictureCut from "@/components/tly-picture-cut/tlyPictureCut.vue"

    import keyboardInput from "@/components/keyboard-input/keyboard-input.vue"

    import QfImageCropper from '@/uni_modules/qf-image-cropper/components/qf-image-cropper/qf-image-cropper.vue'

    import {

        getDaysAfterDate

    } from '@/utils/utils.js'

    import {

        getVisitedMember,

        getSystemDictData,

        getVisitedVisitReason,

        createFk

    } from '@/api'

    export default {

        data() {

            return {

                photoSrc: '',

                type: '',

                inputType: '',

                showName: false,

                show: false,

                show1: false,

                show2: false,

                show3: false,

                show4: false,

                show5: false,

                show6: false,

                show7: false,

                showReason: false,

                fileList: [],

                columns1: [

                    [{

                        name: '身份证',

                        id: 0

                    }, {

                        name: '港澳证件',

                        id: 1

                    }, {

                        name: '护照',

                        id: 2

                    }],

                ],

                VisitReason: [],

                VisitPoeple: [],

                columns: [],

                cars: [],

                day: null,

                maxTime: '',

                carName: '',

                personnel: [],

                userAnswerId: '',

                form1: {

                    phone1: '',

                    receptMemberId: '',

                    receptMemberName: '',

                    starttime: '',

                    endtime: '',

                    doors: '',

                    doorSelectName: '',

                    reason: '',

                    carNos: '',

                    type: 0

                },

                withUserList: {

                    name: '',

                    phone: '',

                    idcardType: '',

                    idcardTypeName: '',

                    companyName: '',

                    idcardNo: '',

                    faceImg: '',

                    faceImgUrl: '',

                    imgurl: '',

                    imgurlUrl: ''

                },

                visit: '',

                form: {},

                accessControl: '',

                verify: ''

            }

        },

        components: {

            tlyPictureCut,

            keyboardInput,

            QfImageCropper

        },

        onLoad(options) {

            if (options.data) {

                this.form = JSON.parse(options.data)

            }

            // this.getvisit()

            // this.getVisit1()

            // this.getUserValid()

            this.getUser()

        },

        mounted() {

            this.$eventBus.$on('svisitorAppSel', (option) => {

                // this.$set(this.param, 'checkUserId', option.id)

                // this.$set(this.param, 'applyCheckUserId', option.id)

                // this.$set(this.param, 'checkorName', option.name)



                this.form1.receptMemberName = option.name

                this.form1.receptMemberId = option.id

                this.form1.receptMemberDepartment = option.companyName

            })

        },

        methods: {

            formatter(type, value) {

                if (type === 'year') {

                    return `${value}å¹´`

                }

                if (type === 'month') {

                    return `${value}月`

                }

                if (type === 'day') {

                    return `${value}日`

                }
                if (type === 'hour') {
                    return `${value}时`
                }
                if (type === 'minute') {
                    return `${value}分`
                }

                return value

            },

            selName() {

                uni.navigateTo({

                    url: '/pages/visitorApplication/memberSel'

                })

            },

            openInput(type) {

                this.inputType = type

                this.$refs.keyboard.open()

            },

            setPlate(e) {

                if (this.inputType === 1) {

                    this.form1.carNos = e

                } else if (this.inputType === 2) {

                    this.withUserList.carNos = e

                }

                this.$forceUpdate()

                this.closeInput()

            },

            closeInput() {

                this.$refs.keyboard.close()

            },

            constructionChange(e) {

                console.log(e.detail.value)

                this.form1.type = Number(e.detail.value)

                console.log(this.form1.type)

            },

            uploadImg(file) {

                this.$refs.cropper.close()

                uni.showLoading({

                    title: '上传中',

                    mask: true

                })

                uni.uploadFile({

                    url: `${this.$baseUrl}visitsAdmin/cloudService/web/public/uploadFtp.do`,

                    filePath: file.tempFilePath,

                    name: 'file',

                    formData: {

                        folderCode: 'MEMBER_IMG'

                    },

                    success: (uploadFileRes) => {

                        let res = JSON.parse(uploadFileRes.data)

                        this.withUserList.faceImg = res.data.halfPath

                        this.withUserList.faceImgUrl = res.data.prefixPath + res.data.folder + res.data.halfPath

                    },

                    complete() {

                        uni.hideLoading()

                    }

                })

            },

            closeMJ() {

                this.show = false

                this.columns.forEach(item => {

                    item.active = false

                })

            },

            onSubmit() {

                if (!this.form1.receptMemberId) return uni.showToast({

                    title: '请填写有效的访问人',

                    icon: 'none'

                })

                if (!this.form1.starttime) return uni.showToast({

                    title: '入园时间不能为空',

                    icon: 'none'

                })

                if (!this.form1.endtime) return uni.showToast({

                    title: '离园时间不能为空',

                    icon: 'none'

                })

                if (!this.form1.doorSelectName && this.accessControl == 1) return uni.showToast({

                    title: '访问门禁不能为空',

                    icon: 'none'

                })

                if (!this.form1.reason) return uni.showToast({

                    title: '拜访事由不能为空',

                    icon: 'none'

                })

                // this.form1.starttime = this.form1.starttime + ':00'

                // this.form1.endtime = this.form1.endtime + ':00'

                let data = JSON.parse(JSON.stringify(this.form1))

                data.starttime = data.starttime + ':00'

                data.endtime = data.endtime + ':00'

                createFk({

                    ...this.form,

                    ...data,

                    openid: this.$store.state.openId,

                    withUserList: this.personnel

                }).then(res => {

                    if (res.code === 200) {

                        uni.navigateTo({

                            url: `/pages/appointmentDetails/appointmentDetails?id=${res.data}`

                        })

                    }

                })

            },

            deleUser(i) {

                this.personnel.splice(i, 1)

            },

            getVisit1() {

                // æ˜¯å¦éœ€è¦ç­”题

                this.$u.api.getSystemDictData({

                    dictCode: 'SYSTEM',

                    label: 'HEALTH_CARD'

                }).then(res => {

                    if (res.code === 200) {

                        this.visit = res.data.code

                    }

                })

                // èµ·å§‹æ—¶é—´æ—¶é•¿

                getSystemDictData({

                    dictCode: 'VISIT_CONFIG',

                    label: 'VALIDATE_VISIT'

                }).then(res => {

                    if (res.code === 200) {

                        this.day = Number(res.data.code)

                        // console.log(nextDay('after', true, this.day))

                    }

                })

            },

            submitUser() {

                if (!this.withUserList.name) return uni.showToast({

                    title: '姓名不能为空',

                    icon: 'none'

                })

                if (!this.withUserList.phone) return uni.showToast({

                    title: '手机号不能为空',

                    icon: 'none'

                })

                const regExp = /^1[3456789]\d{9}$/

                if (!regExp.test(this.withUserList.phone)) return uni.showToast({

                    title: '手机号格式错误',

                    icon: 'none'

                })

                if (!String(this.withUserList.idcardType)) return uni.showToast({

                    title: '证件类型不能为空',

                    icon: 'none'

                })

                if (!this.withUserList.idcardNo) return uni.showToast({

                    title: '证件号码不能为空',

                    icon: 'none'

                })

                if (this.withUserList.idcardType === 0) {

                    const regex = /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[1-2]\d|3[0-1])\d{3}[\dxX]$/

                    if (!regex.test(this.withUserList.idcardNo)) return uni.showToast({

                        title: '证件号码格式错误',

                        icon: 'none'

                    })

                }

                if (!this.withUserList.companyName) return uni.showToast({

                    title: '公司不能为空',

                    icon: 'none'

                })

                if (!this.withUserList.faceImg) return uni.showToast({

                    title: '人脸照片不能为空',

                    icon: 'none'

                })

                if (this.visit === '1') {

                    if (!this.withUserList.imgurl) return uni.showToast({

                        title: '人脸照片不能为空',

                        icon: 'none'

                    })

                }

                let arr = JSON.parse(JSON.stringify(this.withUserList))

                this.personnel.push(arr)

                this.show3 = false

                this.withUserList.name = ''

                this.withUserList.phone = ''

                this.withUserList.idcardType = ''

                this.withUserList.idcardTypeName = ''

                this.withUserList.companyName = ''

                this.withUserList.idcardNo = ''

                this.withUserList.faceImg = ''

                this.withUserList.faceImgUrl = ''

                this.withUserList.imgurl = ''

                this.withUserList.imgurlUrl = ''

            },

            upload(type) {

                this.type = type

                if (type === 'faceImg') {

                    this.$refs.cropper.open()

                    return

                }

                uni.chooseImage({

                    success: (chooseImageRes) => {

                        uni.showLoading({

                            title: '上传中',

                            mask: true

                        })

                        for (let i = 0; i < chooseImageRes.tempFilePaths.length; i++) {

                            uni.uploadFile({

                                url: `${this.$baseUrl}visitsAdmin/cloudService/web/public/uploadFtp.do`,

                                filePath: chooseImageRes.tempFilePaths[i],

                                name: 'file',

                                formData: {

                                    folderCode: 'MEMBER_IMG'

                                },

                                success: (uploadFileRes) => {

                                    let res = JSON.parse(uploadFileRes.data)

                                    if (type === 'faceImg') {

                                        this.withUserList.faceImg = res.data.halfPath

                                        this.withUserList.faceImgUrl = res.data.prefixPath + res.data.folder + res.data.halfPath

                                    } else {

                                        this.withUserList.imgurl = res.data.halfPath

                                        this.withUserList.imgurlUrl = res.data.prefixPath + res.data.folder + res.data.halfPath

                                    }

                                },

                                complete() {

                                    if (i === chooseImageRes.tempFilePaths.length - 1) {

                                        uni.hideLoading()

                                    }

                                }

                            })

                        }

                    }

                })

            },

            seleIdcard(e) {

                this.withUserList.idcardType = e.value[0].id

                this.withUserList.idcardTypeName = e.value[0].name

                this.show6 = false

            },

            selectedName(e) {

                this.form1.receptMemberName = e.value[0].name

                this.form1.receptMemberId = e.value[0].id

                this.form1.receptMemberDepartment = e.value[0].companyId

                this.showName = false

            },

            selectedReason(e) {

                this.form1.reason = e.value[0].title

                console.log(e.value[0].title)

                this.showReason = false

            },

            submitCart() {

                if (!this.carName) return uni.showToast({

                    title: '请输入车牌号码',

                    icon: 'none'

                })

                this.cars.push(this.carName)

                this.form1.carNos = this.cars.join(',')

                this.carName = ''

                this.show2 = false

            },

            deleCars(i) {

                this.cars.splice(i, 1)

                this.form1.carNos = this.cars.join(',')

            },

            submitMJ() {

                let arr = []

                let names = []

                this.columns.forEach(item => {

                    if (item.active) {

                        arr.push(item.id)

                        names.push(item.name)

                    }

                })

                if (arr.length === 0) return uni.showToast({

                    title: '请选择门禁',

                    icon: 'none'

                })

                this.form1.doorSelectName = names.join(',')

                this.form1.doors = arr.join(',')

                this.show = false

            },

            seleMJ(i) {

                this.columns.forEach((item, index) => {

                    if (index === i) {

                        item.active = !item.active

                    }

                })

            },

            openLC() {

                if (!this.form1.starttime) return uni.showToast({

                    title: '请先选择入园时间',

                    icon: 'none'

                })

                this.show5 = true

            },

            setstarttime(e) {

                this.form1.starttime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM')

                // this.maxTime = getDaysAfterDate(uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM'), this.day)

                this.maxTime = this.form1.starttime

                console.log(this.form1.starttime.slice(0, 10))

                this.show4 = false

            },

            setendtime(e) {

                this.form1.endtime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM')

                this.show5 = false

            },

            formatTimeStamp(date) {

                return Date.parse(new Date(`${date}`)) || Date.parse(new Date(`${date.replace(/-/g, '/')}`))

            },

            // æŸ¥è¯¢ç”¨æˆ·

            getUser() {

                getVisitedMember().then(res => {

                    this.VisitPoeple = [res.data || []]

                })

                getVisitedVisitReason({}).then(res => {

                    this.VisitReason = [res.data || []]

                })

            },

            // è¢«æ‹œè®¿äººä¿¡æ¯æ ¡éªŒæ–¹å¼ï¼ˆ0手机号单独校验 1手机号和姓名组合校验）

            getUserValid() {

                getSystemDictData({

                    dictCode: 'SYSTEM',

                    label: 'BEVISITED_USER_VALID'

                }).then(res => {

                    if (res.code === 200) {

                        this.verify = res.data.code

                    }

                })

            },

            // èŽ·å–是否需要选择门禁/门禁列表

            getvisit() {

                getSystemDictData({

                    dictCode: 'SYSTEM',

                    label: 'SELECT_DOORS_VISIT_REQUIRED'

                }).then(res => {

                    if (res.code === 200) {

                        this.accessControl = res.data.code

                        if (res.data.code === '1') {

                            this.$u.api.deviceRoleList({

                                    type: 1

                                })

                                .then(device => {

                                    if (device.code === 200) {

                                        if (device.data.length > 0) {

                                            device.data.forEach(item => {

                                                item.active = false

                                            })

                                            this.columns = device.data

                                        }

                                    }

                                })

                        }

                    }

                })

            },

            confirm(e) {

                this.show = false

            }

        }

    }

</script>

<style>

    page {

        background-color: #f7f7f7 !important;

    }



    .u-upload__button {

        margin: 0 !important;

    }

</style>

<style lang="scss" scoped>

    .visit {

        width: 100%;



        .menjin {

            width: 100%;



            .respondent-title {

                width: 100%;

                height: 100rpx;

                line-height: 100rpx;

                text-align: center;

                font-size: 32rpx;

                font-weight: 600;

                color: #222222;

            }



            .list {

                width: 100%;

                height: 400rpx;

                display: flex;

                flex-direction: column;



                .list_item {

                    width: 100%;

                    display: flex;

                    align-items: center;

                    justify-content: space-between;



                    text {

                        font-size: 28rpx;

                        color: #000000;

                    }



                    image {

                        width: 30rpx;

                        height: 30rpx;

                    }

                }

            }



            .menjin_footer {

                width: 100%;

                padding: 30rpx;

                box-sizing: border-box;

                display: flex;

                align-items: center;

                justify-content: space-between;



                .menjin_footer_item {

                    flex: 1;

                    height: 80rpx;

                    display: flex;

                    align-items: center;

                    justify-content: center;

                    border-radius: 10rpx;

                    background-color: $uni-color-primary;

                    color: #ffffff;

                    font-size: 26rpx;

                    margin-left: 30rpx;



                    &:first-child {

                        margin-left: 0 !important;

                    }

                }

            }

        }



        .adduser {

            padding: 30rpx;

            width: 100%;

            box-sizing: border-box;



            .adduser_head {

                width: 100%;

                text-align: center;

                font-size: 32rpx;

                font-family: PingFangSC, PingFang SC;

                font-weight: 600;

                color: #222222;

            }



            .adduser_list {

                width: 100%;

                margin-top: 40rpx;



                .adduser_list_item {

                    width: 100%;

                    padding: 24rpx 0;

                    box-sizing: border-box;

                    border-bottom: 1rpx solid #e5e5e5;

                    display: flex;

                    align-items: center;

                    justify-content: space-between;



                    .adduser_list_item_label1 {

                        flex: 1;

                        display: flex;

                        flex-direction: column;



                        .cc {

                            font-size: 30rpx;

                            font-family: PingFangSC, PingFang SC;

                            font-weight: 400;

                            color: #222222;

                            margin-bottom: 20rpx;



                            b {

                                font-size: 30rpx;

                                font-family: PingFangSC, PingFang SC;

                                font-weight: 400;

                                color: #e0312a;

                            }

                        }



                        .aa {

                            font-size: 24rpx;

                            font-weight: 400;

                            color: #999999;

                        }

                    }



                    .adduser_list_item_label {

                        flex-shrink: 0;

                        display: flex;

                        align-items: center;

                        font-family: PingFangSC, PingFang SC;

                        font-size: 30rpx;



                        text {

                            &:nth-child(1) {

                                color: #e0312a;

                            }



                            &:nth-child(2) {

                                color: #222222;

                            }

                        }

                    }



                    .adduser_list_item_ipt {

                        flex-shrink: 0;

                        text-align: right;

                        font-size: 28rpx;

                        font-family: PingFangSC, PingFang SC;

                        font-weight: 400;

                        color: #333333;

                        margin-left: 30rpx;

                        display: flex;

                        align-items: center;

                        justify-content: flex-end;



                        .adduser_list_item_ipt1_upload {

                            width: 120rpx;

                            height: 120rpx;

                            background-color: #ececec;

                            display: flex;

                            align-items: center;

                            justify-content: center;

                            overflow: hidden;



                            image {

                                width: 100%;

                                height: 100%;

                            }

                        }



                        text {

                            font-size: 28rpx;

                            font-family: PingFangSC, PingFang SC;

                            font-weight: 400;

                            color: #999999;

                        }

                    }

                }

            }



            .adduser_footer {

                width: 100%;

                margin-top: 60rpx;

                display: flex;

                align-items: center;

                justify-content: space-between;



                .t {

                    background: #4d99a9 !important;

                    color: #ffffff !important;

                }



                .adduser_footer_item {

                    width: 336rpx;

                    height: 88rpx;

                    line-height: 88rpx;

                    text-align: center;

                    border-radius: 44rpx;

                    border: 1rpx solid #4d99a9;

                    font-size: 32rpx;

                    font-family: PingFangSC, PingFang SC;

                    font-weight: 400;

                    color: #4d99a9;

                    margin-right: 18rpx;



                    &:last-child {

                        margin: 0 !important;

                    }

                }

            }

        }



        .addcar {

            padding: 30rpx;

            width: 100%;

            box-sizing: border-box;



            .addcar_head {

                text-align: center;

                font-size: 32rpx;

                font-family: PingFangSC, PingFang SC;

                font-weight: 600;

                color: #222222;

            }



            .addcar_ipt {

                width: 100%;

                height: 100rpx;

                line-height: 100rpx;

                text-align: center;

                background: #f7f7f7;

                border-radius: 50rpx;

                margin-top: 60rpx;



                input {

                    width: 100%;

                    height: 100%;

                    font-size: 28rpx;

                    font-weight: 400;

                    color: #000000;

                    text-align: center;

                }

            }



            .addcar_footer {

                width: 100%;

                display: flex;

                align-items: center;

                justify-content: space-between;

                margin-top: 60rpx;



                .t {

                    background: #4d99a9 !important;

                    color: #ffffff !important;

                }



                .addcar_footer_item {

                    flex: 1;

                    height: 88rpx;

                    line-height: 88rpx;

                    font-size: 32rpx;

                    font-weight: 400;

                    color: #025eef;

                    text-align: center;

                    border-radius: 44rpx;

                    border: 1rpx solid #025eef;

                    margin-right: 18rpx;



                    &:last-child {

                        margin-right: 0 !important;

                    }

                }

            }

        }



        .popup-content {

            padding: 30rpx 30rpx 0 30rpx;

            overflow: hidden;

            display: flex;

            flex-flow: column;



            .respondent-title {

                width: 100%;

                text-align: center;

                font-size: 32rpx;

                font-weight: 600;

                color: #222222;

            }



            .search-box {

                width: 100%;

                margin-top: 40rpx;



                .search-box-top {

                    width: 100%;

                    height: 68rpx;

                    display: flex;

                    align-items: center;



                    .search-box-top-ipt {

                        flex: 1;

                        height: 100%;

                        padding: 0 30rpx;

                        box-sizing: border-box;

                        background: #f7f7f7;

                        border-radius: 4rpx;

                        display: flex;

                        align-items: center;



                        image {

                            width: 36rpx;

                            height: 36rpx;

                            flex-shrink: 0;

                            margin-right: 22rpx;

                        }



                        input {

                            flex: 1;

                            height: 100%;

                            font-size: 26rpx;

                            font-weight: 400;

                            color: #b2b2b2;

                        }

                    }



                    text {

                        flex-shrink: 0;

                        margin-left: 30rpx;

                        font-size: 28rpx;

                        font-weight: 400;

                        color: #025eef;

                    }

                }



                .search-box-total {

                    font-size: 26rpx;

                    font-weight: 400;

                    color: #666666;

                    margin-top: 24rpx;

                }

            }



            .list {

                width: 100%;

                height: 800rpx;

                margin-top: 30rpx;

                padding: 0 !important;



                .item {

                    width: 100%;

                    height: 102rpx;

                    display: flex;

                    align-items: center;

                    border-bottom: 1rpx solid #e5e5e5;



                    .item_a {

                        flex-shrink: 0;

                        width: 36rpx;

                        height: 36rpx;

                        margin-right: 24rpx;



                        image {

                            width: 100%;

                            height: 100%;

                        }

                    }



                    .item_b {

                        flex-shrink: 0;

                        width: 80rpx;

                        height: 80rpx;

                        display: flex;

                        align-items: center;

                        justify-content: center;

                        overflow: hidden;

                        margin-right: 24rpx;



                        image {

                            width: 100%;

                            height: 100%;

                        }

                    }



                    .item_c {

                        flex: 1;

                        display: flex;

                        align-items: center;



                        text {

                            &:nth-child(1) {

                                font-size: 30rpx;

                                font-family: PingFangSC, PingFang SC;

                                font-weight: 400;

                                color: #222222;

                            }



                            &:nth-child(2) {

                                font-size: 20rpx;

                                font-family: PingFangSC, PingFang SC;

                                font-weight: 400;

                                color: #999999;

                                padding: 1rpx 4rpx;

                                box-sizing: border-box;

                                background-color: #eeeeee;

                                margin-left: 12rpx;

                            }

                        }

                    }

                }

            }



            .footer1 {

                width: 100%;

                height: 100rpx;

                display: flex;

                align-items: center;

                justify-content: space-between;

                padding: 14rpx 0 0 0;

                box-sizing: border-box;



                .footer_left {

                    flex: 1;

                    display: flex;

                    flex-direction: column;



                    .footer_left_a {

                        font-size: 26rpx;

                        font-family: PingFangSC, PingFang SC;

                        font-weight: 400;

                        color: #333333;

                    }



                    .footer_left_b {

                        font-size: 24rpx;

                        font-family: PingFangSC, PingFang SC;

                        font-weight: 400;

                        color: #999999;

                    }

                }



                .footer_btn {

                    flex-shrink: 0;

                    width: 216rpx;

                    height: 72rpx;

                    line-height: 72rpx;

                    text-align: center;

                    background: #025eef;

                    border-radius: 8rpx;

                    font-size: 28rpx;

                    font-weight: 600;

                    color: #ffffff;

                }

            }

        }



        .head {

            width: 100%;

            padding: 20rpx 30rpx;

            box-sizing: border-box;

            font-size: 28rpx;

            font-weight: 400;

            color: #666666;

        }



        .list {

            width: 100%;

            padding: 0 30rpx;

            box-sizing: border-box;

            background-color: #ffffff;



            .empty {

                width: 750rpx;

                height: 20rpx;

                background-color: #f7f7f7;

                margin: 0 -30rpx;

            }



            .list_item {

                width: 100%;

                // min-height: 98rpx;

                padding: 30rpx 0;

                box-sizing: border-box;

                display: flex;

                align-items: center;

                justify-content: space-between;

                border-bottom: 1rpx solid #e5e5e5;



                .list_item_label {

                    flex-shrink: 0;

                    display: flex;

                    align-items: center;



                    text {

                        &:nth-child(1) {

                            font-size: 30rpx;

                            font-weight: 400;

                            color: #e42d2d;

                        }



                        &:nth-child(2) {

                            font-size: 30rpx;

                            font-weight: 400;

                            color: #222222;

                        }

                    }

                }



                .list_item_content {

                    flex: 1;

                    height: 100%;

                    margin-left: 30rpx;

                    display: flex;

                    align-items: center;

                    justify-content: flex-end;



                    text {

                        font-size: 28rpx;

                        font-weight: 400;

                        color: #999999;

                        margin-right: 6rpx;

                    }



                    input {

                        width: 100%;

                        height: 100%;

                        text-align: right;

                        font-size: 28rpx;

                        font-weight: 400;

                        color: #222222;

                    }

                }

            }

        }



        .cate {

            width: 100%;

            padding: 30rpx;

            box-sizing: border-box;

            background-color: #ffffff;



            .cate_head {

                font-size: 32rpx;

                font-family: PingFangSC, PingFang SC;

                font-weight: 600;

                color: #222222;

            }



            .cate_list {

                width: 100%;

                display: flex;

                align-items: center;

                flex-wrap: wrap;

                margin-top: 30rpx;



                .cate_list_item {

                    height: 64rpx;

                    padding: 0 20rpx;

                    box-sizing: border-box;

                    background-color: #eeeeee;

                    border-radius: 4rpx;

                    margin-right: 20rpx;

                    margin-bottom: 20rpx;

                    display: flex;

                    align-items: center;



                    &:last-child {

                        margin-right: 0 !important;

                    }



                    text {

                        font-size: 26rpx;

                        font-family: PingFangSC, PingFang SC;

                        font-weight: 400;

                        color: #333333;

                        margin-right: 30rpx;

                    }

                }

            }



            .cate_add {

                width: 200rpx;

                height: 50rpx;

                display: flex;

                align-items: center;

                justify-content: center;

                background: rgba(2, 94, 239, 0);

                border-radius: 25rpx;

                border: 1rpx solid #4c99a8;

                font-size: 22rpx;

                font-family: PingFangSC, PingFang SC;

                font-weight: 400;

                margin-top: 20rpx;

                color: #4c99a8;

                margin: 0 auto;

            }

        }



        .zw {

            width: 100%;

            height: calc(env(safe-area-inset-bottom) + 118rpx);

        }



        .footer {

            width: 100%;

            padding: 0 30rpx;

            padding-bottom: env(safe-area-inset-bottom);

            box-sizing: border-box;

            margin-top: 80rpx;

            // position: fixed;

            // left: 0;

            // bottom: 30rpx;



            .footer_btn {

                width: 100%;

                height: 88rpx;

                line-height: 88rpx;

                text-align: center;

                background: #4c99a8;

                border-radius: 44rpx;

                font-size: 32rpx;

                font-weight: 600;

                color: #ffffff;

            }

        }

    }

</style>