In the previous article, we explained member recharge. The logic of member consumption and recharge is similar. The consumption amount is recorded first, and then the consumption amount is subtracted from the membership card balance. One logic is that if the balance is insufficient, a prompt message is required.
1 Create a consumption record table
We first need to create a table to save the member's consumption record information, open the console, click on the data model, click + to enter the
name of the data source consumption record,
click the edit button to enter the add field view
, add a field, enter the consumption amount, select number as the type to
add the field, Enter the consumption date, select date and time as the type.
Add a field, enter the membership card, select the association as the type, and select membership card as the data model.
2 Generate model page
After the data source is added, open our model application, click New Page,
select the table and form page, and select consumption record for the data model.
The platform will automatically generate relevant pages based on the fields of the data source.
3. Build a new page for consumption records
The page generated by the platform is to facilitate us to query data, and we complete the real business on the member list page. Switch to the member list page, add a normal container at the bottom of the page, and add a form container at the bottom.
When we click on more icons, the function menu will pop up. At this time, when clicking on consumption, we need to display our normal container.
Control whether the container is displayed is through components. It is determined by the condition display attribute. In the micro-build, it is more suitable if the variable type is a Boolean value. Boolean values have two values, either true or false. Conditional display If a variable is bound, we decide whether to display the component based on the value of the variable.
Create a Boolean variable in the code area
and then bind conditional display to the ordinary container
. In order to center the page, we need to set the style and select absolute positioning.
When we click the consumption button, let our variable be assigned true and
the page can pop up normally. We need to add a close button. We use an icon to replace the close button. Find the title of the form container, add an icon component below, and
set the style of the ordinary container to align both ends.
self {
display: flex;
justify-content: space-between;
flex-direction: row;
}
When the icon is clicked, we assign the variable to false to close the page.
4 Configure the membership card
Currently, the membership card drop-down field generated by the form container lists all membership cards. The actual rule is that when selecting a member, the membership card under that member should be displayed. We need to set filter conditions for the drop-down selection
4 Implement business logic for consumption
The logic of our consumption is to first determine whether the balance is sufficient. If it is sufficient, we will add the consumption record and update the balance of the membership card. If it is insufficient, we will prompt a message. First we need to get which membership card we need to add a consumption record to, and define a value change event for the drop-down selection. Let
our selected value be assigned to our variable.
After getting the card ID, we have to implement the submission logic ourselves, and define it in the code area. A custom method
enter the following code
export default async function({
event, data}) {
const money =Number( $w.inputNumber4.value)
console.log("消费金额",money)
const currentDay = $w.date4.value
console.log("消费日期",currentDay)
const cardid = $w.select4.value
console.log("卡ID",cardid)
const card = await $w.cloud.callDataSource({
dataSourceName: "hykxx_gmcze7h",
methodName: "wedaGetItemV2",
params: {
// 筛选内容，筛选内容推荐使用编辑器数据筛选器生成
filter: {
where: {
$and: [
{
_id: {
$eq:cardid, // 获取单条时，推荐传入_id数据标识进行操作
},
},
],
},
},
select: {
$master: true, // 常见的配置，返回主表
},
},
});
console.log("卡信息",card)
const currentCardYue = card.ye
console.log("当前余额",currentCardYue)
if((currentCardYue-money)>=0){
await $w.cloud.callDataSource({
dataSourceName: "xfjl_vcdjkih",
methodName: "wedaCreateV2",
params: {
data: {
xfje: money,
xfrq: currentDay,
sshyk:cardid
},
},
});
await $w.cloud.callDataSource({
dataSourceName: "hykxx_gmcze7h",
methodName: "wedaUpdateV2",
params: {
// 更新数据
data: {
ye: currentCardYue-money,
},
// 筛选内容，筛选内容推荐使用编辑器数据筛选器生成
filter: {
where: {
$and: [
{
_id: {
$eq: cardid, // 更新单条时，推荐传入_id数据标识进行操作
},
},
],
},
},
},
});
}else{
$w.utils.showToast({
title:'余额不足',
icon:'error'
})
}
}
After the submission method is written, we need to change the default method of the form container to our custom method.
After the submission is successful, we need to close the page and assign a value to the variable.
Summarize
We use 7 articles to introduce how to develop the management side of the membership management system, and separately develop several basic functions such as member registration, card opening, recharge, and consumption. MicroBuild uses model applications to develop the management side. Operations such as basic additions, deletions, modifications, and searches are automatically generated by the platform. However, some business operations, such as the consumption functions we introduce in this article, still require you to write code to complete the business logic. preparation.
Interested students can follow the steps and you will have your own membership management software soon.