11 changed files with 389 additions and 5 deletions
After Width: | Height: | Size: 7.1 KiB |
@ -0,0 +1,141 @@ |
|||
// subpages/HotlineCompletion/pages/HotlineCompletion.js
|
|||
import { |
|||
showRecord,icEventList |
|||
} from "../../../utils/api" |
|||
Page({ |
|||
|
|||
/** |
|||
* 页面的初始数据 |
|||
*/ |
|||
data: { |
|||
pageSize:10, |
|||
pageNo:1, |
|||
eventList:[], |
|||
workOrderNum:"", |
|||
status:false, |
|||
columns:[], |
|||
statusType:"", |
|||
handleList: [ |
|||
{ |
|||
value: "8", |
|||
label: "未联系当事人", |
|||
}, |
|||
{ |
|||
value: "9", |
|||
label: "已联系当事人", |
|||
}, |
|||
{ |
|||
value: "10", |
|||
label: "办理中", |
|||
}, |
|||
{ |
|||
value: "11", |
|||
label: "已办结待审核", |
|||
}, |
|||
{ |
|||
value: "12", |
|||
label: "已审核归档", |
|||
}, |
|||
], |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面加载 |
|||
*/ |
|||
onLoad(options) { |
|||
this.showRecordData() |
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面初次渲染完成 |
|||
*/ |
|||
onReady() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面显示 |
|||
*/ |
|||
onShow() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面隐藏 |
|||
*/ |
|||
onHide() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 生命周期函数--监听页面卸载 |
|||
*/ |
|||
onUnload() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面相关事件处理函数--监听用户下拉动作 |
|||
*/ |
|||
onPullDownRefresh() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 页面上拉触底事件的处理函数 |
|||
*/ |
|||
onReachBottom() { |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* 用户点击右上角分享 |
|||
*/ |
|||
onShareAppMessage() { |
|||
|
|||
}, |
|||
async showRecordData() { |
|||
console.log("sd as"); |
|||
let parm = { |
|||
pageSize:this.data.pageSize, |
|||
pageNo:this.data.pageNo |
|||
|
|||
} |
|||
await icEventList(parm).then(res => { |
|||
this.setData({ |
|||
eventList:res.data.list |
|||
}) |
|||
console.log(this.data.eventList); |
|||
}) |
|||
}, |
|||
handelShow(){ |
|||
this.setData({ |
|||
status:true, |
|||
columns: this.data.handleList.map(item => item.label) // 映射出显示的选项
|
|||
}) |
|||
}, |
|||
onChange(event) { |
|||
const { value } = event.detail; // 获取选中的值
|
|||
this.setData({ |
|||
statusType: value // 更新选中的值
|
|||
}); |
|||
}, |
|||
// 控制 picker 显示或隐藏
|
|||
togglePicker() { |
|||
this.setData({ |
|||
status: !this.data.status |
|||
}); |
|||
}, |
|||
onCancel() { |
|||
console.log("54354"); |
|||
this.setData({ |
|||
status: false // 关闭 picker
|
|||
}); |
|||
}, |
|||
onConfirm() { |
|||
this.setData({ |
|||
status: false // 关闭 picker
|
|||
}); |
|||
console.log('确认按钮点击'); |
|||
}, |
|||
}) |
@ -0,0 +1,8 @@ |
|||
{ |
|||
"usingComponents": { |
|||
"van-search": "@vant/weapp/search/index", |
|||
"van-button": "@vant/weapp/button/index", |
|||
"van-picker": "@vant/weapp/picker/index" |
|||
}, |
|||
"navigationBarTitleText": "热线接办" |
|||
} |
@ -0,0 +1,42 @@ |
|||
<view class="search" > |
|||
<input placeholder="按工单号" class="input " value="{{workOrderNum}}" /> |
|||
<input placeholder="手机号" class="input" value="{{mobile}}" /> |
|||
<!-- <van-search input-class="custom-search" shape="round" use-left-icon-slot="false" value="{{ value }}" placeholder="按工单号" /> --> |
|||
<!-- <van-search custom-style="custom-search" shape="round" use-left-icon-slot="false" value="{{ value }}" placeholder="手机号" /> --> |
|||
<view class="filter" bind:tap="handelShow"> |
|||
<text wx:if="{{statusType == ''}}">办理状态</text> |
|||
<text >{{statusType}}</text> |
|||
|
|||
</view> |
|||
<view class="btn">筛选</view> |
|||
</view> |
|||
<view class="section_5"> |
|||
<scroll-view scroll-y="{{true}}" scroll-into-view="scrollToHere" style="width: 100%; height: 90vh;" lower-threshold="{{ lowerThreshold }}" bindscrolltolower="onScrollToLower"> |
|||
<view class="list_1" wx:for="{{eventList}}" wx:key="{{item.icEventId}}"> |
|||
<view class="section_1-0" > |
|||
<view class="flex-x"> |
|||
<view class="workorder">工单号:{{item.workOrderNum}}</view> |
|||
<view class="{{item.operationType === '未联系当事人'?'status-red':item.operationType==='已联系当事人'?'lan':item.operationType === '办理中'?' .status-cycn':item.operationType ==='已办结待审核'?'status-orange':item.operationType =='已审核归档'?'status-grey':'status-grey'}}"> |
|||
{{item.operationType}} |
|||
</view> |
|||
</view> |
|||
<view class="context"> |
|||
{{item.eventContent}} |
|||
</view> |
|||
<view class="flex-x1"> |
|||
<view class="phonenName">来电人:{{item.name}} {{item.mobile}}</view> |
|||
<view class="btn">办理</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
<van-picker class="picker-bottom" |
|||
show-toolbar |
|||
wx:if="{{status}}" |
|||
columns="{{columns}}" |
|||
bind:change="onChange" |
|||
bind:cancel="onCancel" |
|||
bind:confirm="onConfirm" |
|||
/> |
|||
|
@ -0,0 +1,160 @@ |
|||
page { |
|||
width: 100%; |
|||
overflow-y: auto; |
|||
background-color: #f7f7f7; |
|||
} |
|||
.search{ |
|||
height: 110rpx; |
|||
width: 100%; |
|||
padding:0 22rpx; |
|||
box-sizing: border-box; |
|||
background-color: #fff; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
padding-top: 20rpx; |
|||
box-sizing: border-box; |
|||
|
|||
} |
|||
.btn { |
|||
width: 120rpx; |
|||
height: 66rpx; |
|||
line-height: 66rpx; |
|||
background: #3A80E7; |
|||
border-radius: 33rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
} |
|||
.btn1 { |
|||
width: 120rpx; |
|||
height:50rpx; |
|||
background: #3A80E7; |
|||
border-radius: 33rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
line-height: 50rpx; |
|||
} |
|||
|
|||
.section_5 { |
|||
display: flex; |
|||
flex-direction: column; |
|||
overflow: hidden; |
|||
padding: 20rpx; |
|||
} |
|||
.list_1 { |
|||
width: 700rpx; |
|||
/* height: 603rpx; */ |
|||
/* display: flex; */ |
|||
/* flex-direction: column; */ |
|||
/* justify-content: space-between; */ |
|||
display: flex; |
|||
/* width: 100%; */ |
|||
margin-bottom: 20rpx; |
|||
} |
|||
.section_1-0 { |
|||
background-color: rgba(255,255,255,1.000000); |
|||
border-radius: 20rpx; |
|||
width: 710rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
padding:0rpx 30rpx 0 30rpx; |
|||
} |
|||
.workorder{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 30rpx; |
|||
color: #999999; |
|||
} |
|||
.status-red{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 26rpx; |
|||
color: #FF3C3C; |
|||
} |
|||
.status-blue{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 26rpx; |
|||
color: #04B8AD; |
|||
} |
|||
.status-cycn{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 26rpx; |
|||
color: #3974F6; |
|||
} |
|||
|
|||
.status-orange{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 26rpx; |
|||
color: #FF850D; |
|||
} |
|||
.status-grey{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 26rpx; |
|||
color: #999999; |
|||
} |
|||
.custom-search{ |
|||
width: 20rpx; |
|||
} |
|||
.input{ |
|||
padding: 0 20rpx; |
|||
width: 120rpx; |
|||
height: 57rpx; |
|||
background: rgba(193,193,193,0.16); |
|||
border-radius: 28rpx; |
|||
border: 1px solid #DBDBDB; |
|||
align-items: center; |
|||
} |
|||
.flex-x{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
flex-direction: row; |
|||
padding:15rpx 0 15rpx 0; |
|||
} |
|||
.flex-x1{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
flex-direction: row; |
|||
padding:0 0 15rpx 0; |
|||
} |
|||
.context{ |
|||
display: -webkit-box; |
|||
-webkit-box-orient: vertical; |
|||
-webkit-line-clamp: 2; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 32rpx; |
|||
color: #333333; |
|||
} |
|||
.phonenName{ |
|||
font-family: PingFang SC; |
|||
font-weight: 500; |
|||
font-size: 28rpx; |
|||
color: #666666; |
|||
line-height: 40rpx; |
|||
} |
|||
.filter{ |
|||
padding: 0 20rpx; |
|||
width: 120rpx; |
|||
height: 57rpx; |
|||
background: rgba(193,193,193,0.16); |
|||
border-radius: 28rpx; |
|||
border: 1px solid #DBDBDB; |
|||
align-items: center; |
|||
line-height: 57rpx; |
|||
} |
|||
.picker-bottom { |
|||
position: fixed; /* 固定在页面底部 */ |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
z-index: 1000; /* 确保在最上层显示 */ |
|||
} |
Loading…
Reference in new issue