9.18王德鹏/1
This commit is contained in:
@@ -1,133 +1,184 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const common_http = require("../../common/http.js");
|
||||
function toDateString(d) {
|
||||
const m = (d.getMonth() + 1).toString().padStart(2, "0");
|
||||
const day = d.getDate().toString().padStart(2, "0");
|
||||
return `${d.getFullYear()}-${m}-${day}`;
|
||||
}
|
||||
const API_OF = {
|
||||
sale: "/api/orders",
|
||||
purchase: "/api/purchase-orders",
|
||||
collect: "/api/payments",
|
||||
fund: "/api/other-transactions",
|
||||
stock: "/api/inventories/logs"
|
||||
};
|
||||
const _sfc_main = {
|
||||
data() {
|
||||
const today = /* @__PURE__ */ new Date();
|
||||
const first = new Date(today.getFullYear(), today.getMonth(), 1);
|
||||
return {
|
||||
range: "month",
|
||||
biz: "sale",
|
||||
sub: "out",
|
||||
kw: "",
|
||||
begin: toDateString(first),
|
||||
end: toDateString(today),
|
||||
list: [],
|
||||
loading: false
|
||||
bizList: [
|
||||
{ key: "sale", name: "出货" },
|
||||
{ key: "purchase", name: "进货" },
|
||||
{ key: "collect", name: "收款" },
|
||||
{ key: "fund", name: "资金" },
|
||||
{ key: "stock", name: "盘点" }
|
||||
],
|
||||
range: "month",
|
||||
query: { kw: "" },
|
||||
items: [],
|
||||
page: 1,
|
||||
size: 20,
|
||||
finished: false,
|
||||
loading: false,
|
||||
startDate: "",
|
||||
endDate: ""
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
placeholder() {
|
||||
return "单据号/客户名称/品名规格/备注";
|
||||
},
|
||||
periodLabel() {
|
||||
return this.startDate && this.endDate ? `${this.startDate}~${this.endDate}` : "";
|
||||
},
|
||||
totalAmount() {
|
||||
return this.list.reduce((s, o) => s + Number(o.amount || 0), 0);
|
||||
return this.items.reduce((s, it) => s + Number(it.amount || 0), 0);
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
try {
|
||||
common_vendor.index.__f__("log", "at pages/detail/index.vue:92", "[detail] onLoad route = pages/detail/index");
|
||||
} catch (e) {
|
||||
}
|
||||
this.computeRange();
|
||||
this.reload();
|
||||
},
|
||||
methods: {
|
||||
setRange(r) {
|
||||
this.range = r;
|
||||
const now = /* @__PURE__ */ new Date();
|
||||
if (r === "today") {
|
||||
this.begin = this.end = toDateString(now);
|
||||
} else if (r === "week") {
|
||||
const day = now.getDay() || 7;
|
||||
const start = new Date(now);
|
||||
start.setDate(now.getDate() - day + 1);
|
||||
this.begin = toDateString(start);
|
||||
this.end = toDateString(now);
|
||||
} else if (r === "month") {
|
||||
const first = new Date(now.getFullYear(), now.getMonth(), 1);
|
||||
this.begin = toDateString(first);
|
||||
this.end = toDateString(now);
|
||||
} else if (r === "year") {
|
||||
const first = new Date(now.getFullYear(), 0, 1);
|
||||
this.begin = toDateString(first);
|
||||
this.end = toDateString(now);
|
||||
}
|
||||
switchBiz(k) {
|
||||
if (this.biz === k)
|
||||
return;
|
||||
this.biz = k;
|
||||
this.reload();
|
||||
},
|
||||
async reload() {
|
||||
switchRange(r) {
|
||||
this.range = r;
|
||||
this.computeRange();
|
||||
this.reload();
|
||||
},
|
||||
computeRange() {
|
||||
const now = /* @__PURE__ */ new Date();
|
||||
const pad = (n) => String(n).padStart(2, "0");
|
||||
const fmt = (d) => `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
|
||||
let start = now, end = now;
|
||||
if (this.range === "today") {
|
||||
start = end = now;
|
||||
} else if (this.range === "week") {
|
||||
const day = now.getDay() || 7;
|
||||
start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 1);
|
||||
end = now;
|
||||
} else if (this.range === "month") {
|
||||
start = new Date(now.getFullYear(), now.getMonth(), 1);
|
||||
end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
|
||||
} else if (this.range === "year") {
|
||||
start = new Date(now.getFullYear(), 0, 1);
|
||||
end = new Date(now.getFullYear(), 11, 31);
|
||||
} else {
|
||||
start = new Date(now.getFullYear(), now.getMonth(), 1);
|
||||
end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
|
||||
}
|
||||
this.startDate = fmt(start);
|
||||
this.endDate = fmt(end);
|
||||
},
|
||||
reload() {
|
||||
this.items = [];
|
||||
this.page = 1;
|
||||
this.finished = false;
|
||||
this.loadMore();
|
||||
},
|
||||
async loadMore() {
|
||||
if (this.loading || this.finished)
|
||||
return;
|
||||
this.loading = true;
|
||||
try {
|
||||
const res = await common_http.get("/api/sales/orders", { begin: this.begin, end: this.end, kw: this.kw, sub: this.sub });
|
||||
this.list = Array.isArray(res == null ? void 0 : res.list) ? res.list : Array.isArray(res) ? res : [];
|
||||
const path = API_OF[this.biz] || "/api/orders";
|
||||
const params = { kw: this.query.kw, page: this.page, size: this.size, startDate: this.startDate, endDate: this.endDate, biz: this.biz };
|
||||
if (this.biz === "sale")
|
||||
params.type = "out";
|
||||
const res = await common_http.get(path, params);
|
||||
const list = Array.isArray(res == null ? void 0 : res.list) ? res.list : Array.isArray(res) ? res : [];
|
||||
this.items = this.items.concat(list);
|
||||
if (list.length < this.size)
|
||||
this.finished = true;
|
||||
this.page += 1;
|
||||
} catch (e) {
|
||||
this.list = [];
|
||||
common_vendor.index.showToast({ title: "加载失败", icon: "none" });
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
goCreate() {
|
||||
common_vendor.index.navigateTo({ url: "/pages/order/create" });
|
||||
formatDate(s) {
|
||||
if (!s)
|
||||
return "";
|
||||
try {
|
||||
const d = new Date(s);
|
||||
const pad = (n) => String(n).padStart(2, "0");
|
||||
return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
|
||||
} catch (_) {
|
||||
return String(s).slice(0, 10);
|
||||
}
|
||||
},
|
||||
open(o) {
|
||||
onCreate() {
|
||||
if (this.biz === "sale") {
|
||||
common_vendor.index.navigateTo({ url: "/pages/order/create" });
|
||||
return;
|
||||
}
|
||||
common_vendor.index.showToast({ title: "该类型创建页待实现", icon: "none" });
|
||||
},
|
||||
openDetail(it) {
|
||||
common_vendor.index.showToast({ title: "详情开发中", icon: "none" });
|
||||
}
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: $data.range === "custom" ? 1 : "",
|
||||
b: common_vendor.o(($event) => $options.setRange("custom")),
|
||||
c: $data.range === "week" ? 1 : "",
|
||||
d: common_vendor.o(($event) => $options.setRange("week")),
|
||||
e: $data.range === "today" ? 1 : "",
|
||||
f: common_vendor.o(($event) => $options.setRange("today")),
|
||||
g: $data.range === "month" ? 1 : "",
|
||||
h: common_vendor.o(($event) => $options.setRange("month")),
|
||||
i: $data.range === "year" ? 1 : "",
|
||||
j: common_vendor.o(($event) => $options.setRange("year")),
|
||||
k: $data.biz === "sale" ? 1 : "",
|
||||
l: common_vendor.o(($event) => $data.biz = "sale"),
|
||||
m: $data.biz === "purchase" ? 1 : "",
|
||||
n: common_vendor.o(($event) => $data.biz = "purchase"),
|
||||
o: $data.biz === "collection" ? 1 : "",
|
||||
p: common_vendor.o(($event) => $data.biz = "collection"),
|
||||
q: $data.biz === "capital" ? 1 : "",
|
||||
r: common_vendor.o(($event) => $data.biz = "capital"),
|
||||
s: $data.biz === "inventory" ? 1 : "",
|
||||
t: common_vendor.o(($event) => $data.biz = "inventory"),
|
||||
v: $data.sub === "out" ? 1 : "",
|
||||
w: common_vendor.o(($event) => $data.sub = "out"),
|
||||
x: $data.sub === "return" ? 1 : "",
|
||||
y: common_vendor.o(($event) => $data.sub = "return"),
|
||||
z: $data.sub === "receive" ? 1 : "",
|
||||
A: common_vendor.o(($event) => $data.sub = "receive"),
|
||||
B: common_vendor.o((...args) => $options.goCreate && $options.goCreate(...args)),
|
||||
C: common_vendor.o((...args) => $options.reload && $options.reload(...args)),
|
||||
D: $data.kw,
|
||||
E: common_vendor.o(($event) => $data.kw = $event.detail.value),
|
||||
F: $data.range === "custom"
|
||||
}, $data.range === "custom" ? {
|
||||
G: common_vendor.t($data.begin),
|
||||
H: $data.begin,
|
||||
I: common_vendor.o((e) => {
|
||||
$data.begin = e.detail.value;
|
||||
$options.reload();
|
||||
}),
|
||||
J: common_vendor.t($data.end),
|
||||
K: $data.end,
|
||||
L: common_vendor.o((e) => {
|
||||
$data.end = e.detail.value;
|
||||
$options.reload();
|
||||
})
|
||||
} : {}, {
|
||||
M: common_vendor.t($options.totalAmount.toFixed(2)),
|
||||
N: common_vendor.f($data.list, (o, k0, i0) => {
|
||||
a: common_vendor.n($data.range === "custom" && "active"),
|
||||
b: common_vendor.o(($event) => $options.switchRange("custom")),
|
||||
c: common_vendor.n($data.range === "week" && "active"),
|
||||
d: common_vendor.o(($event) => $options.switchRange("week")),
|
||||
e: common_vendor.n($data.range === "today" && "active"),
|
||||
f: common_vendor.o(($event) => $options.switchRange("today")),
|
||||
g: common_vendor.n($data.range === "month" && "active"),
|
||||
h: common_vendor.o(($event) => $options.switchRange("month")),
|
||||
i: common_vendor.n($data.range === "year" && "active"),
|
||||
j: common_vendor.o(($event) => $options.switchRange("year")),
|
||||
k: common_vendor.f($data.bizList, (b, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(o.orderDate),
|
||||
b: common_vendor.t(o.customerName),
|
||||
c: common_vendor.t(o.orderNo),
|
||||
d: common_vendor.t(Number(o.amount).toFixed(2)),
|
||||
e: o.id,
|
||||
f: common_vendor.o(($event) => $options.open(o), o.id)
|
||||
a: common_vendor.t(b.name),
|
||||
b: b.key,
|
||||
c: common_vendor.n($data.biz === b.key && "active"),
|
||||
d: common_vendor.o(($event) => $options.switchBiz(b.key), b.key)
|
||||
};
|
||||
}),
|
||||
l: $options.placeholder,
|
||||
m: common_vendor.o((...args) => $options.reload && $options.reload(...args)),
|
||||
n: $data.query.kw,
|
||||
o: common_vendor.o(common_vendor.m(($event) => $data.query.kw = $event.detail.value, {
|
||||
trim: true
|
||||
})),
|
||||
p: common_vendor.t($options.periodLabel),
|
||||
q: common_vendor.o((...args) => $options.reload && $options.reload(...args)),
|
||||
r: common_vendor.t($options.totalAmount.toFixed(2)),
|
||||
s: $data.items.length
|
||||
}, $data.items.length ? {
|
||||
t: common_vendor.f($data.items, (it, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t($options.formatDate(it.orderTime || it.txTime || it.createdAt)),
|
||||
b: common_vendor.t(it.customerName || it.supplierName || it.accountName || it.remark || "-"),
|
||||
c: common_vendor.t(it.orderNo || it.code || it.id),
|
||||
d: common_vendor.t((it.amount || 0).toFixed(2)),
|
||||
e: it.id,
|
||||
f: common_vendor.o(($event) => $options.openDetail(it), it.id)
|
||||
};
|
||||
})
|
||||
} : {}, {
|
||||
v: common_vendor.o((...args) => $options.loadMore && $options.loadMore(...args)),
|
||||
w: common_vendor.o((...args) => $options.onCreate && $options.onCreate(...args))
|
||||
});
|
||||
}
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render]]);
|
||||
|
||||
@@ -1 +1 @@
|
||||
<view class="detail"><view class="filter-tabs"><view class="{{['tab', a && 'active']}}" bindtap="{{b}}">自定义</view><view class="{{['tab', c && 'active']}}" bindtap="{{d}}">本周</view><view class="{{['tab', e && 'active']}}" bindtap="{{f}}">今日</view><view class="{{['tab', g && 'active']}}" bindtap="{{h}}">本月</view><view class="{{['tab', i && 'active']}}" bindtap="{{j}}">本年</view></view><view class="biz-tabs"><view class="{{['biz', k && 'active']}}" bindtap="{{l}}">销售</view><view class="{{['biz', m && 'active']}}" bindtap="{{n}}">进货</view><view class="{{['biz', o && 'active']}}" bindtap="{{p}}">收款</view><view class="{{['biz', q && 'active']}}" bindtap="{{r}}">资金</view><view class="{{['biz', s && 'active']}}" bindtap="{{t}}">盘点</view></view><view class="card"><view class="subtabs"><view class="{{['sub', v && 'active']}}" bindtap="{{w}}">出货</view><view class="{{['sub', x && 'active']}}" bindtap="{{y}}">退货</view><view class="{{['sub', z && 'active']}}" bindtap="{{A}}">收款</view><view class="plus" bindtap="{{B}}">+</view></view><view class="search"><input placeholder="单据号/客户/名称/规格/备注" bindconfirm="{{C}}" value="{{D}}" bindinput="{{E}}"/></view><view wx:if="{{F}}" class="daterange"><picker mode="date" value="{{H}}" bindchange="{{I}}"><text>{{G}}</text></picker><text class="sep">—</text><picker mode="date" value="{{K}}" bindchange="{{L}}"><text>{{J}}</text></picker></view><view class="total">合计:¥ {{M}}</view><scroll-view scroll-y class="list"><view wx:for="{{N}}" wx:for-item="o" wx:key="e" class="row" bindtap="{{o.f}}"><view class="left"><view class="date">{{o.a}}</view><view class="name">{{o.b}}</view><view class="no">{{o.c}}</view></view><view class="right">¥ {{o.d}}</view></view></scroll-view></view></view>
|
||||
<view class="page"><view class="seg"><view class="{{['seg-item', a]}}" bindtap="{{b}}">自定义</view><view class="{{['seg-item', c]}}" bindtap="{{d}}">本周</view><view class="{{['seg-item', e]}}" bindtap="{{f}}">今日</view><view class="{{['seg-item', g]}}" bindtap="{{h}}">本月</view><view class="{{['seg-item', i]}}" bindtap="{{j}}">本年</view></view><view class="content"><view class="biz-tabs"><view wx:for="{{k}}" wx:for-item="b" wx:key="b" class="{{['biz', b.c]}}" bindtap="{{b.d}}">{{b.a}}</view></view><view class="panel"><view class="toolbar"><view class="search"><input class="search-input" placeholder="{{l}}" bindconfirm="{{m}}" value="{{n}}" bindinput="{{o}}"/></view><view class="period">{{p}}</view><button size="mini" bindtap="{{q}}">查询</button></view><view class="total">合计:¥{{r}}</view><scroll-view scroll-y class="list" bindscrolltolower="{{v}}"><block wx:if="{{s}}"><view wx:for="{{t}}" wx:for-item="it" wx:key="e" class="item" bindtap="{{it.f}}"><view class="item-left"><view class="date">{{it.a}}</view><view class="name">{{it.b}}</view><view class="no">{{it.c}}</view></view><view class="amount">¥ {{it.d}}</view><view class="arrow">›</view></view></block><view wx:else class="empty">暂无数据</view></scroll-view><view class="fab" bindtap="{{w}}">+</view></view></view></view>
|
||||
@@ -1,43 +1,49 @@
|
||||
|
||||
.detail { display:flex;
|
||||
.page { display:flex; flex-direction: column; height: 100vh;
|
||||
}
|
||||
.filter-tabs { display:flex; gap: 24rpx; padding: 18rpx 24rpx; color:#666;
|
||||
.seg { display:flex; background:#fff;
|
||||
}
|
||||
.filter-tabs .tab.active { color:#2aa7b6; font-weight: 700;
|
||||
.seg-item { flex:1; padding: 22rpx 0; text-align:center; color:#666;
|
||||
}
|
||||
.biz-tabs { position: fixed; left:0; top: 160rpx; bottom: 120rpx; width: 120rpx; display:flex; flex-direction: column; gap: 24rpx; padding: 12rpx;
|
||||
.seg-item.active { color:#18b566; font-weight: 600;
|
||||
}
|
||||
.biz { background:#6aa9ff; color:#fff; border-radius: 16rpx; padding: 20rpx 0; text-align:center; opacity: .85;
|
||||
.content { display:flex; flex:1; min-height: 0;
|
||||
}
|
||||
.biz.active { opacity: 1;
|
||||
.biz-tabs { width: 120rpx; background:#eef6ff; display:flex; flex-direction: column;
|
||||
}
|
||||
.card { margin-left: 140rpx; background:#fff; border-radius: 24rpx; padding: 16rpx;
|
||||
.biz { flex:0 0 120rpx; display:flex; align-items:center; justify-content:center; color:#4aa3d6;
|
||||
}
|
||||
.subtabs { display:flex; align-items:center; gap: 24rpx; padding: 8rpx 6rpx 12rpx;
|
||||
.biz.active { background:#3ac1c9; color:#fff; border-radius: 0 16rpx 16rpx 0;
|
||||
}
|
||||
.sub { color:#57c2cf; padding: 8rpx 12rpx;
|
||||
.panel { flex:1; display:flex; flex-direction: column; background:#fff; margin: 16rpx; border-radius: 16rpx; padding: 12rpx;
|
||||
}
|
||||
.sub.active { border-bottom: 4rpx solid #57c2cf; font-weight:700;
|
||||
.toolbar { display:flex; align-items: center; gap: 12rpx; padding: 8rpx 6rpx;
|
||||
}
|
||||
.plus { margin-left:auto; width: 60rpx; height: 60rpx; border-radius: 30rpx; background:#2ec0d0; color:#fff; font-size: 40rpx; display:flex; align-items:center; justify-content:center;
|
||||
.search { flex:1;
|
||||
}
|
||||
.search { background:#f6f7fb; border-radius: 999rpx; padding: 14rpx 20rpx; margin: 8rpx 0 12rpx;
|
||||
.search-input { width:100%; background:#f6f6f6; border-radius: 12rpx; padding: 12rpx;
|
||||
}
|
||||
.daterange { display:flex; align-items:center; gap: 12rpx; color:#888; padding-bottom: 8rpx;
|
||||
.period { color:#999; font-size: 24rpx; padding: 0 6rpx;
|
||||
}
|
||||
.daterange .sep { color:#ccc;
|
||||
.total { color:#18b566; font-weight: 700; padding: 6rpx 6rpx 12rpx;
|
||||
}
|
||||
.total { color:#2ec0d0; font-weight: 800; padding: 12rpx 0; border-top: 2rpx solid #eaeaea;
|
||||
.list { flex:1;
|
||||
}
|
||||
.list { height: calc(100vh - 420rpx);
|
||||
.item { display:flex; align-items:center; padding: 20rpx 10rpx; border-bottom: 1rpx solid #f1f1f1;
|
||||
}
|
||||
.row { display:flex; justify-content: space-between; align-items:center; padding: 22rpx 10rpx; border-bottom: 1rpx solid #f0f0f0;
|
||||
.item-left { flex:1;
|
||||
}
|
||||
.left .date { color:#999; margin-bottom: 6rpx;
|
||||
.date { color:#999; font-size: 24rpx;
|
||||
}
|
||||
.left .name { color:#333; margin-bottom: 6rpx;
|
||||
.name { color:#333; margin: 4rpx 0; font-weight: 600;
|
||||
}
|
||||
.left .no { color:#bbb;
|
||||
.no { color:#bbb; font-size: 22rpx;
|
||||
}
|
||||
.right { color:#555;
|
||||
.amount { color:#333; font-weight: 700;
|
||||
}
|
||||
.arrow { color:#ccc; font-size: 40rpx; margin-left: 8rpx;
|
||||
}
|
||||
.empty { height: 50vh; display:flex; align-items:center; justify-content:center; color:#999;
|
||||
}
|
||||
.fab { position: fixed; right: 30rpx; bottom: 120rpx; width: 100rpx; height: 100rpx; background:#18b566; color:#fff; border-radius: 50rpx; text-align:center; line-height: 100rpx; font-size: 48rpx; box-shadow: 0 8rpx 20rpx rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user