165 lines
5.3 KiB
Vue
165 lines
5.3 KiB
Vue
<template>
|
||
<view class="con-body">
|
||
<view class="con-bg">
|
||
<!-- 头部 -->
|
||
<customHeader ref="customHeaderRef" :title="'考勤查看'" :leftFlag="true" :rightFlag="false"></customHeader>
|
||
|
||
<!-- 高度来避免头部遮挡 -->
|
||
<view class="top-height" :style="{ paddingTop: navBarPaddingTop + 'px' }"></view>
|
||
|
||
<!-- 正文内容 -->
|
||
<view>
|
||
<!-- 搜索 -->
|
||
<!-- <view class="search">-->
|
||
<!-- <picker mode="date" :value="defaultDate" :start="startDate" :end="endDate" @change="bindDateChange"-->
|
||
<!-- class="picker-bg">-->
|
||
<!-- <view class="picker">-->
|
||
<!-- <uni-icons custom-prefix="iconfont" color="#ffffff" type="icon-phoneshizhong"-->
|
||
<!-- size="18"></uni-icons>-->
|
||
<!-- <view>{{ defaultDate }}</view>-->
|
||
<!-- <uni-icons type="down" size="18"></uni-icons>-->
|
||
<!-- </view>-->
|
||
<!-- </picker>-->
|
||
<!-- <button type="default" @click="handleSearch" size="mini" class="btn-search">查询</button>-->
|
||
<!-- </view>-->
|
||
|
||
<!-- 分页部分 -->
|
||
<view class="white-bg margin-bottom20" v-for="(item, index) in list">
|
||
<view class="report-list" >
|
||
<view class="title"
|
||
:style="{color: item.mapType == 1 ? '#F5813A' : '#1989FA'}"
|
||
>类型：{{ item.mapType == 1 ? '签到' : '打卡' }}</view>
|
||
<view class="r-list">
|
||
<view class="r-left">开始签到时间</view>
|
||
<view class="r-right">{{ item.goVisistStartTime }}</view>
|
||
</view>
|
||
<view class="border-bottom"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">开始签到地点</view>
|
||
<view class="r-right">{{ item.addressForStart }}</view>
|
||
</view>
|
||
<view class="border-bottom"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">结束签到时间</view>
|
||
<view class="r-right">{{ item.goVisistEndTime }}</view>
|
||
</view>
|
||
<view class="border-bottom"></view>
|
||
<view class="r-list">
|
||
<view class="r-left">结束签到地点</view>
|
||
<view class="r-right">{{ item.addressForEnd }}</view>
|
||
</view>
|
||
<view class="r-list" v-if="item.remark != null">
|
||
<view class="r-left">备注内容</view>
|
||
<view class="r-right">{{ item.remark }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import customHeader from '@/components/customHeader.vue'
|
||
import { getNavBarPaddingTop } from '@/utils/system.js'
|
||
import { onMounted, ref } from 'vue';
|
||
import { getDate } from '@/utils/datetime.js'
|
||
import { CheckInInformationViewing } from '../../../../api/crm/activity/map';
|
||
import { onLoad } from '@dcloudio/uni-app';
|
||
|
||
const navBarPaddingTop = ref(0);
|
||
onMounted(() => {
|
||
navBarPaddingTop.value = getNavBarPaddingTop() * 2;
|
||
})
|
||
|
||
// 开始时间
|
||
let startDate = getDate('start');
|
||
// 结束时间，间隔10年
|
||
let endDate = getDate('end');
|
||
let defaultDate = getDate({ format: true })
|
||
let bindDateChange = (e) => {
|
||
defaultDate = e.detail.value
|
||
}
|
||
|
||
//获取list集合信息
|
||
let list = ref([])
|
||
function getList() {
|
||
CheckInInformationViewing().then(res => {
|
||
list.value = res.rows
|
||
})
|
||
}
|
||
|
||
onLoad(() => {
|
||
getList()
|
||
})
|
||
|
||
|
||
|
||
|
||
|
||
</script>
|
||
|
||
<style scoped>
|
||
.search {
|
||
display: flex;
|
||
margin-bottom: 30rpx;
|
||
padding: 0 30rpx;
|
||
}
|
||
|
||
.search .btn-search {
|
||
border: none;
|
||
background: none;
|
||
color: #fff;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 28rpx;
|
||
/* 调整为更合适的字号 */
|
||
font-weight: normal;
|
||
/* 如果不需要加粗，可以去掉 bolder */
|
||
margin-left: 0rpx;
|
||
padding: 0 20rpx;
|
||
/* 调整 padding，去掉 padding-top */
|
||
height: 56rpx;
|
||
/* 固定高度，确保与 picker 对齐 */
|
||
cursor: pointer;
|
||
}
|
||
|
||
.search .btn-search::after {
|
||
display: none;
|
||
}
|
||
|
||
.search .picker-bg {
|
||
display: flex;
|
||
background-color: #6FA2F8;
|
||
border-radius: 25px;
|
||
color: #fff;
|
||
font-size: 28rpx;
|
||
padding: 0rpx 20rpx;
|
||
/* #ifndef APP-PLUS */
|
||
padding: 10rpx 20rpx 0 20rpx;
|
||
/* #endif */
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
.search .picker-bg .picker {
|
||
display: flex;
|
||
align-items: center;
|
||
/* #ifndef APP-PLUS */
|
||
padding-top: 2rpx;
|
||
/* #endif */
|
||
}
|
||
|
||
.search .picker-bg .picker .uni-icons {
|
||
color: #fff !important;
|
||
}
|
||
|
||
.search .picker-bg .picker .uni-icons:first-child {
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
.search .picker-bg .picker .uniui-down {
|
||
margin-left: 10rpx;
|
||
}
|
||
</style>
|