纸板小程序:订单/送货单:列表与详情功能

This commit is contained in:
2026-06-11 11:26:40 +08:00
commit ef9ede1605
2317 changed files with 61642 additions and 0 deletions
@@ -0,0 +1,5 @@
{
"usingComponents": {
"navigation-bar": "/components/navigation-bar/navigation-bar"
}
}
@@ -0,0 +1,149 @@
.flex {
display: flex;
}
.label {
min-width: 170rpx;
max-width: 170rpx;
font-size: 30rpx;
color: #8c8c8c;
}
.value {
font-size: 30rpx;
}
.page-container {
width: 100vw;
height: 100vh;
box-sizing: border-box;
background: #ffffff;
// background: linear-gradient( 135deg, #ca7d79 0%, #c5140a 30%, #c5140a 50%, #ca7d79 100%);
.info {
padding: 30rpx 30rpx 0 30rpx;
border-radius: 0 0 20rpx 20rpx;
.info_code_status {
display: flex;
justify-content: space-between;
align-items: center;
.code {
font-weight: bold;
}
.status {
font-size: 22rpx;
padding: 10rpx 25rpx;
border-radius: 200px;
}
}
.info_count {
display: flex;
justify-content: space-between;
margin-top: 30rpx;
.count_item {
text-align: center;
.count_item_label {
font-size: 24rpx;
color: #8c8c8c;
}
.count_item_value {
margin-top: 10rpx;
font-size: 34rpx;
color: #000000;
font-weight: bold;
}
}
}
.paper {
font-size: 24rpx;
padding: 6rpx 30rpx;
background-color: #f4f4f4;
text-align: center;
border-radius: 200px;
}
.corrugatedtype {
background-color: #f4f4f4;
margin-left: 20rpx;
}
.discountedPrice {
font-size: 24rpx;
margin-left: 10rpx;
padding: 6rpx 20rpx;
background-color: #c5140a20;
color: #c5140a;
text-align: center;
border-radius: 200px;
}
.symbol {
padding: 0 5rpx;
color: #8c8c8c;
}
.number {
font-size: 24rpx;
padding: 6rpx 16rpx;
background-color: #f7f8fa;
text-align: center;
border-radius: 15rpx;
}
.asterisk {
position: relative;
top: 8rpx;
}
.remark {
background-color: #fafafa;
padding: 20rpx 20rpx;
border-radius: 20rpx;
border-left: 6rpx solid #d9d9d9;
border-bottom: 3rpx solid #d9d9d9;
.label {
color: #000000;
font-weight: bold;
}
}
.radio {
padding: 5rpx;
// background-color: #f0f0f0;
border-radius: 200px;
.radio_item {
display: flex;
font-size: 24rpx;
padding: 5rpx 22rpx;
color: #8c8c8c;
border-radius: 200px;
background-color: #f0f0f0;
}
.act_radio_item {
color: #c5140a;
background-color: #f8e2e0;
}
}
.counts {
justify-content: space-between;
.count_item {
width: 15%;
text-align: center;
padding: 30rpx;
background-color: #fafafa;
border-radius: 20rpx;
.count_label {
font-size: 22rpx;
color: #8c8c8c;
margin-top: 10rpx;
}
.count_value {
font-weight: bold;
}
}
.produce {
background-color: #c5140a20;
}
}
.time {
background-color: #f9fbfc;
padding-top: 10rpx;
.time_item {
display: flex;
justify-content: space-between;
font-size: 24rpx;
margin-top: 20rpx;
}
}
}
}
@@ -0,0 +1,115 @@
import { getAppInstance } from '../../utils/app';
import { getCardBoardOrderDetail } from '../../api/index'
const app = getAppInstance();
Page({
/**
* 页面的初始数据
*/
data: {
info: {},
isCust: true
},
/**
* 生命周期函数--监听页面加载
*/
async onLoad(options) {
const id = options.id;
const res = await getCardBoardOrderDetail(id).catch(() => {});
if (res) {
const info = this.formatDetail(res.data.dto);
const userInfo = wx.getStorageSync('userInfo');
this.setData({
isCust: userInfo.custid?true:false,
info: info,
statusColorMap: app.globalData.statusColorMap
})
console.log(res);
}
},
// 格式化详情数据
formatDetail(data) {
let info = data;
// 获取客户名称
if (info.customercode) {
const obj = app.globalData.customerList.find( item => item.code == info.customercode);
info.customName = obj?obj.name:'未查询到客户';
}
// 获取供应商名称
if (info.suppliercode) {
const obj = app.globalData.supplierList.find( item => item.code == info.suppliercode);
info.supplierName = obj?obj.name:'未查询到供应商';
}
// 计算最终价
const val1 = info.squareprice?Number(info.squareprice):0;
const val2 = info.specialprice?Number(info.specialprice):0;
info.discountedPrice = (val1 + val2).toFixed(2);
// 格式化压线
if (info.line) {
info.lineData = info.line.split('*');
}
// 格式化时间
if (info.delitime) {
info.delitime = info.delitime.split('T').join(' ');
}
if (info.predelitime) {
info.predelitime = info.predelitime.split('T').join(' ');
}
if (info.intime) {
info.intime = info.intime.split('T').join(' ');
}
return info;
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})
@@ -0,0 +1,133 @@
<navigation-bar title="纸板订单详情" back="{{true}}" color="white" background="#c5140a"></navigation-bar>
<view class="page-container">
<scroll-view class="data_list" style="height: calc(100vh - 200rpx);" scroll-y>
<view class="info">
<view class="info_code_status">
<view class="code">{{'单号:' + info.code}}</view>
<view class="status" style="color: {{statusColorMap[info.productionstatus]}}; background-color: {{statusColorMap[info.productionstatus] + '20'}}">{{info.productionstatus}}</view>
</view>
<view class="info_count">
<view class="count_item">
<view class="count_item_label">总金额</view>
<view class="count_item_value" style="color: #c5140a;">¥{{info.totalmoney}}</view>
</view>
<view class="count_item">
<view class="count_item_label">总数量</view>
<view class="count_item_value">{{info.totalnum}}</view>
</view>
<view class="count_item">
<view class="count_item_label">总平方数</view>
<view class="count_item_value">{{info.squaNum}}</view>
</view>
</view>
<t-divider custom-style="width: calc(100% + 60rpx); margin-left: -30rpx;"/>
<view class=" flex" style="margin-top: 30rpx;">
<view class=" label">客户</view>
<view class="value">{{info.customName}}</view>
</view>
<t-divider custom-style="width: calc(100% + 60rpx); margin-left: -30rpx;"/>
<view class=" flex">
<view class=" label">供应商</view>
<view class="value">{{info.supplierName}}</view>
</view>
<t-divider custom-style="width: calc(100% + 60rpx); margin-left: -30rpx;"/>
<view class=" flex">
<view class=" label">纸质 / 瓦楞</view>
<view class="value paper">{{info.paper}}</view>
<view class="value paper corrugatedtype">{{info.corrugatedtype}}</view>
</view>
<t-divider custom-style="width: calc(100% + 60rpx); margin-left: -30rpx;"/>
<view class=" flex">
<view class=" label">价格</view>
<view class="value">
平方单价 {{' ' + info.squareprice}}
<text style="padding: 0 15rpx;">|</text>
特价 {{' ' + info.specialprice}}
<text class="discountedPrice">最终价 {{' ' + info.discountedPrice}}</text>
</view>
</view>
<view class=" flex" style="margin-top: 50rpx;">
<view class=" label">纸度/长度</view>
<view class="value">
<text class="number">{{info.wide}}</text>
<text class="symbol"> x </text>
<text class="number">{{info.long}}</text>
</view>
</view>
<t-divider custom-style="width: calc(100% + 60rpx); margin-left: -30rpx;"/>
<view class=" flex">
<view class=" label" style="{{lineData && lineData.length > 3?'max-width: 80rpx;min-width: 80rpx;':''}}">压线</view>
<view class="value">
<text class="label line_type" wx:if="{{!info.linetype}}">{{' (开) '}}</text>
<text class="number">{{info.lineData[0]}}</text>
<text class="symbol asterisk" wx:if="{{info.lineData[1]}}"> * </text>
<text class="number" wx:if="{{info.lineData[1]}}">{{info.lineData[1]}}</text>
<text class="symbol asterisk" wx:if="{{info.lineData[2]}}"> * </text>
<text class="number" wx:if="{{info.lineData[2]}}">{{info.lineData[2]}}</text>
<text class="symbol asterisk" wx:if="{{info.lineData[3]}}"> * </text>
<text class="number" wx:if="{{info.lineData[3]}}">{{info.lineData[3]}}</text>
<text class="symbol asterisk" wx:if="{{info.lineData[4]}}"> * </text>
<text class="number" wx:if="{{info.lineData[4]}}">{{info.lineData[4]}}</text>
<text class=" label line_type" style="margin-left: 20rpx;font-size: 24rpx;" wx:if="{{info.linetype}}">({{info.linetype}})</text>
</view>
</view>
<view class="remark flex" style="margin-top: 50rpx;">
<view class="label">外部备注</view>
<view class="value">{{info.remark}}</view>
</view>
<view class="remark flex" style="margin-top: 15rpx;" wx:if="{{!isCust}}">
<view class="label">内部备注</view>
<view class="value">{{info.innerremark}}</view>
</view>
<view class="flex" style="justify-content: space-between;margin-top: 40rpx;">
<view class="flex">
<view class="label" style="min-width: 80rpx; max-width: 80rpx;display: flex;align-items: center;">加急</view>
<view class="flex radio">
<view class="radio_item act_radio_item" wx:if="{{info.isurgents}}">是</view>
<view class="radio_item" wx:else>否</view>
</view>
</view>
<view class="flex">
<view class="label" style="min-width: 140rpx; max-width: 140rpx;display: flex;align-items: center;">强制保存</view>
<view class="flex radio">
<view class="radio_item act_radio_item" wx:if="{{info.forcesave}}">是</view>
<view class="radio_item" wx:else>否</view>
</view>
</view>
</view>
<view class="flex counts" style="margin-top: 40rpx;">
<view class="count_item">
<view class="count_value" style="color: #c5140a;">{{info.unnum}}</view>
<view class="count_label">未入库</view>
</view>
<view class="count_item">
<view class="count_value" style="color: #67C23A;">{{info.innum}}</view>
<view class="count_label">已入库</view>
</view>
<view class="count_item">
<view class="count_value" style="color: #E6A23C;">{{info.delinum}}</view>
<view class="count_label">已送货</view>
</view>
<view class="count_item produce">
<view class="count_value">{{info.productionLong}}</view>
<view class="count_label" style="color: #c5140a;">生产长度</view>
</view>
</view>
<view class="time" style="margin-top: 30rpx;">
<view class="time_item">
<view class="time_label">🚚 送货时间</view>
<view class="time_value">{{info.delitime}}</view>
</view>
<view class="time_item">
<view class="time_label">📅 预计送货</view>
<view class="time_value">{{info.predelitime}}</view>
</view>
<view class="time_item">
<view class="time_label">⏰ 入库时间</view>
<view class="time_value">{{info.intime}}</view>
</view>
</view>
</view>
</scroll-view>
</view>