init
This commit is contained in:
8
miniprogram/pages/add-finance/add-finance.json
Normal file
8
miniprogram/pages/add-finance/add-finance.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"t-input": "tdesign-miniprogram/input/input",
|
||||
"t-date-time-picker": "tdesign-miniprogram/date-time-picker/date-time-picker",
|
||||
"t-picker": "tdesign-miniprogram/picker/picker",
|
||||
"t-picker-item": "tdesign-miniprogram/picker-item/picker-item"
|
||||
}
|
||||
}
|
15
miniprogram/pages/add-finance/add-finance.scss
Normal file
15
miniprogram/pages/add-finance/add-finance.scss
Normal file
@ -0,0 +1,15 @@
|
||||
/* pages/add-affairs/add-affairs.wxss */
|
||||
.add-affairs {
|
||||
padding-top: 32rpx;
|
||||
.add-affairs-form {
|
||||
border-radius: 18rpx;
|
||||
overflow: hidden;
|
||||
margin: 0 32rpx;
|
||||
.t-input {
|
||||
--td-input-label-min-width: 130rpx;
|
||||
}
|
||||
}
|
||||
.submit-button {
|
||||
margin: 32rpx 32rpx 0;
|
||||
}
|
||||
}
|
247
miniprogram/pages/add-finance/add-finance.ts
Normal file
247
miniprogram/pages/add-finance/add-finance.ts
Normal file
@ -0,0 +1,247 @@
|
||||
import Message from "tdesign-miniprogram/message/index";
|
||||
import { getDict } from "../../api/dict";
|
||||
import { addFinance, getFinanceInfo, updateFinance } from "../../api/finance";
|
||||
|
||||
// pages/add-affairs/add-affairs.ts
|
||||
const dayjs = require("dayjs");
|
||||
Page({
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
defaultTime: dayjs(dayjs().format("YYYY-MM-DD")).valueOf(),
|
||||
types: [],
|
||||
form: {
|
||||
financeId: undefined,
|
||||
event: undefined, //事务
|
||||
type: undefined, // 类别
|
||||
date: undefined, // 时间
|
||||
oppositeCompany: undefined, // 对方账户
|
||||
amount: undefined, // 金额
|
||||
},
|
||||
dateVisible: false,
|
||||
pickerVisible: false,
|
||||
},
|
||||
onChange(e: any) {
|
||||
const field = e.currentTarget.dataset.field;
|
||||
this.setData({
|
||||
[`form.${field}`]: e.detail.value,
|
||||
});
|
||||
},
|
||||
|
||||
showTypePicker() {
|
||||
this.setData({
|
||||
pickerVisible: true,
|
||||
});
|
||||
},
|
||||
hidePicker() {
|
||||
this.setData({
|
||||
pickerVisible: false,
|
||||
});
|
||||
},
|
||||
// 显示时间选择
|
||||
showTimePicker() {
|
||||
this.setData({
|
||||
dateVisible: true,
|
||||
});
|
||||
},
|
||||
hideTimePicker() {
|
||||
this.setData({
|
||||
dateVisible: false,
|
||||
});
|
||||
},
|
||||
handleConfirmTime(e: any) {
|
||||
console.log(e);
|
||||
this.setData({
|
||||
[`form.date`]: e.detail.value,
|
||||
});
|
||||
},
|
||||
getTypeLabel(dictValue: string) {
|
||||
// @ts-ignore
|
||||
return this.data.types.find((item: any) => item.value === dictValue)?.label;
|
||||
},
|
||||
validate() {
|
||||
const { form } = this.data;
|
||||
const rules = {
|
||||
event: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入事项",
|
||||
},
|
||||
],
|
||||
type: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择类别",
|
||||
},
|
||||
],
|
||||
|
||||
date: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择日期",
|
||||
},
|
||||
],
|
||||
oppositeCompany: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入对方账户",
|
||||
},
|
||||
],
|
||||
amount: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入金额",
|
||||
},
|
||||
],
|
||||
};
|
||||
for (const field of Object.keys(rules)) {
|
||||
// @ts-ignore
|
||||
for (const validation of rules[field]) {
|
||||
if (validation.required) {
|
||||
// @ts-ignore
|
||||
if (typeof form[field] === "array") {
|
||||
// @ts-ignore
|
||||
if (form[field].length <= 0) {
|
||||
return validation.message;
|
||||
// throw new Error(validation.message);
|
||||
}
|
||||
} else {
|
||||
// @ts-ignore
|
||||
if (!form[field]) {
|
||||
return validation.message;
|
||||
// throw new Error(validation.message);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
handleSubmitFinance() {
|
||||
const { form } = this.data;
|
||||
const result = this.validate();
|
||||
if (result) {
|
||||
Message.error({
|
||||
context: this,
|
||||
offset: [20, 32],
|
||||
duration: 1000,
|
||||
content: result,
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (form.financeId) {
|
||||
// 修改
|
||||
updateFinance({
|
||||
...form,
|
||||
//@ts-ignore
|
||||
type: form.type[0],
|
||||
}).then(() => {
|
||||
const pages = getCurrentPages();
|
||||
const prevPage = pages[pages.length - 2];
|
||||
prevPage.handleRefresh();
|
||||
Message.success({
|
||||
context: this,
|
||||
offset: [20, 32],
|
||||
duration: 3000,
|
||||
content: "修改成功",
|
||||
});
|
||||
setTimeout(() => {
|
||||
wx.switchTab({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
}, 500);
|
||||
});
|
||||
} else {
|
||||
// 新增
|
||||
addFinance({
|
||||
...form,
|
||||
//@ts-ignore
|
||||
type: form.type[0],
|
||||
}).then(() => {
|
||||
const pages = getCurrentPages();
|
||||
const prevPage = pages[pages.length - 2];
|
||||
prevPage.handleRefresh();
|
||||
Message.success({
|
||||
// context: this,
|
||||
offset: [20, 32],
|
||||
duration: 3000,
|
||||
content: "新增成功",
|
||||
});
|
||||
setTimeout(() => {
|
||||
wx.switchTab({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
}, 500);
|
||||
});
|
||||
}
|
||||
},
|
||||
onPickerChange(e: any) {
|
||||
this.setData({
|
||||
["form.type"]: e.detail.value,
|
||||
["form.typeLabel"]: e.detail.label,
|
||||
});
|
||||
},
|
||||
getTypeOptions() {
|
||||
getDict("finance_type").then((resp: any) => {
|
||||
const options =
|
||||
resp.data?.map((el: any) => ({
|
||||
label: el.dictLabel,
|
||||
value: el.dictValue,
|
||||
})) ?? [];
|
||||
this.setData({
|
||||
types: options,
|
||||
});
|
||||
});
|
||||
},
|
||||
getFinanceDetail(financeId: string) {
|
||||
getFinanceInfo(financeId).then((resp: any) => {
|
||||
this.setData({
|
||||
form: { ...resp.data, type: [resp.data.type] },
|
||||
});
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(option: any) {
|
||||
if (option.financeId) {
|
||||
this.getFinanceDetail(option.financeId);
|
||||
}
|
||||
this.getTypeOptions();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {},
|
||||
});
|
24
miniprogram/pages/add-finance/add-finance.wxml
Normal file
24
miniprogram/pages/add-finance/add-finance.wxml
Normal file
@ -0,0 +1,24 @@
|
||||
<!--pages/add-affairs/add-affairs.wxml-->
|
||||
<t-message id="t-message" />
|
||||
<wxs module="times" src="../../utils/time.wxs" />
|
||||
<wxs module="dict" src="../../utils/dict.wxs" />
|
||||
<view class="add-affairs">
|
||||
<view class="add-affairs-form">
|
||||
<t-input label="事项" bind:change="onChange" data-field="event" value="{{form.event}}" align="right" placeholder="请输入事项"></t-input>
|
||||
<t-cell title="选择类别" hover note="{{dict.getDictLabel(form.type[0], types) || ''}}" arrow data-mode="type" bindtap="showTypePicker" class="test" t-class="panel-item" />
|
||||
<t-cell title="选择日期" hover note="{{times.formatDate(form.date) || ''}}" arrow data-mode="date" bindtap="showTimePicker" class="test" t-class="panel-item" />
|
||||
<t-input label="对方账户" bind:change="onChange" data-field="oppositeCompany" value="{{form.oppositeCompany}}" align="right" placeholder="请输入对方账户"></t-input>
|
||||
<t-input label="金额" type="number" bind:change="onChange" data-field="amount" value="{{form.amount}}" align="right" placeholder="请输入金额"></t-input>
|
||||
</view>
|
||||
<view class="submit-button">
|
||||
<t-button bind:tap="handleSubmitFinance" theme="primary" block>确认提交</t-button>
|
||||
</view>
|
||||
|
||||
<!-- 年月日 -->
|
||||
<t-date-time-picker title="选择日期" visible="{{dateVisible}}" mode="date" defaultValue="{{form.date || defaultTime}}" format="YYYY-MM-DD HH:mm:ss" bindchange="handleConfirmTime" bindcancel="hideTimePicker" />
|
||||
|
||||
|
||||
<t-picker visible="{{pickerVisible}}" value="{{form.type}}" data-key="type" title="选择类别" cancelBtn="取消" confirmBtn="确认" bindchange="onPickerChange" bindpick="onColumnChange" bindcancel="onPickerCancel">
|
||||
<t-picker-item options="{{types}}" />
|
||||
</t-picker>
|
||||
</view>
|
Reference in New Issue
Block a user