建议在实用教程12 - 注册页的基础上继续开发,也可以单独开发
【微信小程序-原生开发】实用教程12 - 注册页(含获取用户微信昵称,原生form的表单提交,t-result 的使用)_朝阳39的博客-CSDN博客
https://blog.csdn.net/weixin_41192489/article/details/129320056
页面效果
业务逻辑
代码实现
<t-tabs defaultValue="{{defaultTab}}" theme="card" bindchange='tabChange'>
<t-tab-panel wx:for="{{tabList}}" wx:key="index" label="{{item.label}}" value="{{item.index}}" />
t-tabs>
<view wx:for="{{dataList}}" wx:key="index">
<t-cell>
<view slot="title">
<text bindtap="copyIdentification" data-identification="{{item.identification}}">{{item.nickname}}text>
view>
<view slot="description" class="descriptionBox">
<t-input style="{{style}}" bindclear="inputChange" bindchange="inputChange" data-index='{{index}}' clearable value="{{item.mark||''}}" placeholder="备注" />
<button data-index='{{index}}' capture-catch:tap="pass" data-id="{{item._id}}" data-nickname="{{item.nickname}}" style="margin-right: 20rpx;" type="primary" size="mini">通过button>
<button wx:if="{{item.accountStatus !== '被拒绝'}}" capture-catch:tap="refuse" data-id="{{item._id}}" type="warn" size="mini">拒绝button>
view>
t-cell>
view>
.descriptionBox {
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 30rpx;
}
{
"navigationBarTitleText": "新人审核",
"enablePullDownRefresh": true,
"backgroundTextStyle": "dark",
"usingComponents": {
"t-tabs": "tdesign-miniprogram/tabs/tabs",
"t-tab-panel": "tdesign-miniprogram/tab-panel/tab-panel",
"t-cell": "tdesign-miniprogram/cell/cell",
"t-input": "tdesign-miniprogram/input/input"
}
}
import {
getObjArrIndex
} from "../../../../utils/comFunc.js"
import {
addMessage
} from "../../../../utils/api.js"
// 指定操作的数据库
const db = wx.cloud.database().collection('user')
Page({
data: {
style: 'border: 2rpx solid rgba(220,220,220,1);border-radius: 12rpx;margin-right:30rpx;padding: 10rpx;',
dataList: [],
// 页签 tab
currentTab: '待审核',
defaultTab: '待审核',
tabList: [{
index: '待审核',
label: '待审核'
},
{
index: '被拒绝',
label: '被拒绝'
},
]
},
inputChange: function (e) {
let newMark = e.detail.value
let index = e.currentTarget.dataset.index
let newDataList = JSON.parse(JSON.stringify(this.data.dataList))
newDataList[index].mark = newMark
this.setData({
dataList: newDataList
})
},
onLoad(options) {
this.getList()
},
// 切换页签
tabChange: function (e) {
this.setData({
currentTab: e.detail.value
})
this.getList()
},
pass(e) {
let that = this
let {
index,
id,
nickname
} = e.currentTarget.dataset
let configID = ''
wx.showModal({
content: '确定通过审核吗?',
success(res) {
if (res.confirm) {
let lastNo = 1
wx.cloud.database().collection('config').where({
label: '最终用户编号'
}).get().then(
res => {
if (res.data.length > 0) {
lastNo = res.data[0].value + 1
configID = res.data[0]._id
} else {
wx.cloud.database().collection('config').add({
data: {
label: '最终用户编号',
value: 1
}
})
}
db.doc(id).update({
data: {
mark: that.data.dataList[index].mark,
accountStatus: '审核通过',
No: lastNo
}
}).then(
res => {
addMessage({
memberID: id
},
3,
nickname
)
wx.cloud.database().collection('config').doc(configID).update({
data: {
value: lastNo
}
})
wx.showToast({
title: `审核通过`
})
let itemIndex = getObjArrIndex(that.data.dataList, '_id', id)
that.data.dataList.splice(itemIndex, 1)
that.setData({
dataList: that.data.dataList
})
}
)
})
}
}
})
},
refuse(e) {
let that = this
wx.showModal({
content: '确定拒绝吗?',
success(res) {
if (res.confirm) {
let id = e.currentTarget.dataset.id // 获取操作数据的id
db.doc(id).update({
data: {
accountStatus: '被拒绝'
}
}).then(
res => {
wx.showToast({
title: `拒绝成功`
})
let itemIndex = getObjArrIndex(that.data.dataList, '_id', id)
that.data.dataList.splice(itemIndex, 1)
that.setData({
dataList: that.data.dataList
})
}
)
}
}
})
},
copyIdentification(e) {
let identification = e.currentTarget.dataset.identification
wx.setClipboardData({
data: identification,
success: function (res) {
wx.showToast({
title: '复制成功',
});
}
})
},
getList() {
wx.showLoading({
title: '加载中',
})
db.where({
accountStatus: this.data.currentTab
})
.get().then(res => {
this.setData({
dataList: res.data
})
wx.hideLoading()
})
},
onPullDownRefresh() {
this.getList()
wx.stopPullDownRefresh() // 解决:下拉刷新时,页面不回弹
}
})
// 新增动态
export function addMessage(data, type, publisher) {
wx.cloud.database().collection('message').add({
data: {
...data,
type: type,
publisher: publisher,
date: new Date()
}
})
}
// 对象数组获取指定对象下标
export function getObjArrIndex(arr, prop, value) {
let targetIndex = arr.findIndex((itemTemp) => itemTemp[prop] === value);
if (targetIndex !== -1) {
return targetIndex
}
}
页面的下拉刷新
js 文件中
onPullDownRefresh() {
this.getList()
wx.stopPullDownRefresh() // 解决:下拉刷新时,页面不回弹
}
json文件中
"enablePullDownRefresh": true,
"backgroundTextStyle": "dark",