|
|
<template>
|
|
|
<view class="wrap">
|
|
|
<u-datetime-picker @cancel="startshow=false" @confirm='confirmStart' :show="startshow" v-model="starttime1"
|
|
|
mode="date"></u-datetime-picker>
|
|
|
<u-datetime-picker @cancel="endshow=false" @confirm='confirmEnd' :show="endshow" v-model="endtime1"
|
|
|
mode="date"></u-datetime-picker>
|
|
|
<u-picker @cancel="statusshow=false" @confirm='confirmStatus' :show="statusshow" :columns="statuscolumns"></u-picker>
|
|
|
<view class="select">
|
|
|
<u--input placeholder="开始时间" border="surround" v-model="starttime" suffixIcon="arrow-down" disabled
|
|
|
@click.native='startshow=true'></u--input>
|
|
|
<u--input placeholder="结束时间" border="surround" v-model="endtime" suffixIcon="arrow-down" disabled
|
|
|
@click.native='endshow=true'></u--input>
|
|
|
<u--input placeholder="状态" border="surround" v-model="status" suffixIcon="arrow-down" disabled
|
|
|
@click.native='statusshow=true'></u--input>
|
|
|
</view>
|
|
|
<view class="btn">
|
|
|
<u-button type="primary" text="查询"></u-button>
|
|
|
</view>
|
|
|
|
|
|
<view class="list">
|
|
|
<view class='listitem'>
|
|
|
<view>
|
|
|
<text>2023-05-15</text>
|
|
|
<text class="textr">待核销</text>
|
|
|
</view>
|
|
|
<view>
|
|
|
拜访时间：09:00
|
|
|
</view>
|
|
|
<view>
|
|
|
<text>拜访人：张三</text>
|
|
|
<text>拜访事由：开会</text>
|
|
|
</view>
|
|
|
<view>
|
|
|
单位信息：苏州朗业网络科技有限公司
|
|
|
</view>
|
|
|
<view>
|
|
|
<text>受访人：李四</text>
|
|
|
<text>受访科室：信息科</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
startshow: false,
|
|
|
endshow: false,
|
|
|
starttime: '',
|
|
|
starttime1: Number(new Date()),
|
|
|
endtime1: Number(new Date()),
|
|
|
endtime: '',
|
|
|
status: '',
|
|
|
statusshow:false,
|
|
|
statuscolumns:[
|
|
|
['待核销','已核销']
|
|
|
]
|
|
|
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
confirmStart(val) {
|
|
|
this.starttime = this.$moment(val.value).format("YYYY-MM-DD")
|
|
|
this.startshow = false
|
|
|
},
|
|
|
confirmEnd(val) {
|
|
|
this.endtime = this.$moment(val.value).format("YYYY-MM-DD")
|
|
|
this.endshow = false
|
|
|
},
|
|
|
confirmStatus(val){
|
|
|
console.log(val)
|
|
|
this.status = val.value[0]
|
|
|
this.statusshow = false
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
/* .wrap {
|
|
|
height: 90vh;
|
|
|
min-height: 90vh;
|
|
|
padding: 30rpx;
|
|
|
} */
|
|
|
|
|
|
.select {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
margin: 0 -10rpx
|
|
|
}
|
|
|
|
|
|
/deep/ .select .u-input {
|
|
|
margin: 0 10rpx;
|
|
|
border-radius: 0;
|
|
|
padding: 6px 5px !important;
|
|
|
padding-right: 2px !important;
|
|
|
}
|
|
|
|
|
|
.btn {
|
|
|
text-align: center;
|
|
|
text-align: center;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
margin-top: 20rpx
|
|
|
}
|
|
|
|
|
|
/deep/ .btn .u-button {
|
|
|
background-color: deepskyblue;
|
|
|
border-color: deepskyblue;
|
|
|
/* width:90% */
|
|
|
}
|
|
|
|
|
|
.list {
|
|
|
/* height:65vh; */
|
|
|
margin-top: 20rpx;
|
|
|
padding: 30rpx;
|
|
|
}
|
|
|
|
|
|
.listitem {
|
|
|
padding: 20rpx;
|
|
|
background-color: #fff;
|
|
|
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
|
|
|
margin-bottom: 30rpx
|
|
|
}
|
|
|
|
|
|
.listitem view {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
margin-bottom: 10rpx
|
|
|
}
|
|
|
|
|
|
.listitem view text {
|
|
|
width: 50%;
|
|
|
text-align: left;
|
|
|
}
|
|
|
|
|
|
.listitem view text.textr {
|
|
|
text-align: right;
|
|
|
}
|
|
|
</style> |
