chenrui 2 tahun lalu
induk
melakukan
a867f02e56
2 mengubah file dengan 256 tambahan dan 1 penghapusan
  1. 251 0
      pages/sales/bill.vue
  2. 5 1
      pages/sales/index.vue

+ 251 - 0
pages/sales/bill.vue

@@ -0,0 +1,251 @@
+<template>
+	<view class="content flex flex_column">
+		<view class="header">
+			<view class="headerList u-flex">
+				<view class="list_l">
+					<u-icon name="clock" color="#00aaff" size="32"></u-icon>
+					<text>对账周期</text>
+				</view>
+				<view class="list_r u-flex">
+					<u-input v-model="brandName" @click="timeShow=true" disabled placeholder="请选择对账日期"  />
+					<u-icon name="arrow-right" color="#999" size="30"></u-icon>
+				</view>
+			</view>
+			<view class="headerList u-flex">
+				<view class="list_l">
+					<u-icon name="account" color="#00aaff" size="32"></u-icon>
+					<text>客户名称</text>
+				</view>
+				<view class="list_r u-flex">
+					<u-input v-model="brandName" @click="customerShow=true" disabled placeholder="请选择客户名称"  />
+					<u-icon name="arrow-right" color="#999" size="30"></u-icon>
+				</view>
+			</view>
+		</view>
+		<view class="statistical u-flex">
+			<view class="statisticalList">
+				<text>总单数:</text>
+				<text>34</text>
+			</view>
+			<view class="statisticalList">
+				<text>待收金额合计:</text>
+				<text>¥123456.08</text>
+			</view>
+		</view>
+		<view class="chooseCon">
+			<view class="chooseList u-flex">
+				<view class="checkbox">
+					<u-checkbox v-model="checked" :name="productSn" @change="checkChange" size="40" shape="circle"></u-checkbox>
+				</view>
+				<view class="choose_r">
+					<view class="u-flex u-row-between">
+						<view class="billInfo u-flex">
+							<text>2022-11-23</text>
+							<view>待出库</view>
+							<view>数字货架</view>
+						</view>
+						<view class="billOrder">
+							XS211230001
+						</view>
+					</view>
+					<view class="rigth_b u-flex u-row-between">
+						<view>应收:¥12.00</view>
+						<view>已收:¥12.00</view>
+						<view>待收:<text>¥12.00</text></view>
+					</view>
+				</view>
+			</view>
+			
+		</view>
+		<view class="footer u-flex">
+			<view class="f-left">
+				<u-checkbox  @change="allCheckeChange" v-model="allChecked" shape="circle">{{allChecked?'取消全选':'全选'}}</u-checkbox>
+			</view>
+			<view class="f-mid" @click="isDetailShow=!isDetailShow">
+				<view class="u-flex">
+					<view>待收:<text>¥80.00</text></view>
+					<view style="margin-left: 6rpx;">/ 折后:<text>¥80.00</text></view>
+				</view>
+				<view class="u-flex">
+					<view>
+						折让:<text>¥0.00</text>
+					</view>
+					<view class="costBtn">
+						打折
+					</view>
+				</view>
+			</view>
+			<view class="f-btns">
+				<u-button size="medium" @click="submitOrder" :custom-style="customBtnStyle" shape="circle" type="primary" hover-class="none" >发送对账单</u-button>
+			</view>
+		</view>
+		<!-- 时间、客户选择弹窗 -->
+		<u-picker  mode="time" v-model="timeShow" :params="params"></u-picker>
+		<u-picker mode="selector" v-model="customerShow"  :default-selector="[0]"></u-picker>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				params:{//配置时间选项
+					year: true,
+					month: true,
+					day: true,
+					hour: false,
+					minute: false,
+					second: false
+				},
+				timeShow:false,
+				customerShow:false,
+				customBtnStyle: {  //  自定义按钮样式
+					borderColor: this.$config('primaryColor'),
+					backgroundColor: this.$config('primaryColor'),
+					color: '#fff',
+					width:'180rpx'
+				},
+				allChecked:false
+			};
+		},
+		
+		onLoad() {
+			uni.setNavigationBarColor({
+				frontColor: '#ffffff',
+				backgroundColor: this.$config('primaryColor')
+			})
+		},
+		methods:{
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content{
+		width: 100%;
+		height: 100vh;
+		.header{
+			width: 100%;
+			.headerList{
+				width: 100%;
+				box-sizing: border-box;
+				padding:16rpx 20rpx;
+				background: #fff;
+				&:last-child{
+				border-top:1rpx solid #e4e7ed;	
+				}
+				.list_l{
+					width: 170rpx;
+					text{
+						font-size: 28rpx;
+						color: #666666;
+						margin-left: 10rpx;
+					}
+				}
+				.list_r{
+					width: calc(100% - 170rpx);
+				}
+			}
+		}
+			.statistical{
+				padding:20rpx;
+				background: #fff;
+				margin:10rpx 0;
+				.statisticalList{
+				&:first-child{
+					width: 210rpx;
+				}
+				}
+				text{
+					&:last-child{
+						color:$uni-color-warning;
+						font-weight: 600;
+					}
+				}
+			}
+			.chooseCon{
+				flex-grow: 1;
+				overflow: auto;
+				background-color: #fff;
+				.chooseList{
+					padding:20rpx;
+					border-bottom:1rpx solid #e4e7ed;
+					&:last-child{
+						border-bottom:0rpx solid #e4e7ed;
+					}
+					.checkbox{
+						width: 74rpx;
+					}
+					.choose_r{
+						flex:1;
+						.billInfo{
+							text{
+								font-weight: 600;
+							}
+							view{
+								padding:4rpx 10rpx;
+								text-align: center;
+								border-radius: 30rpx;
+								border:1rpx solid #e4e7ed;
+								margin-left: 10rpx;
+								font-size: .7rem;
+								color: #666;
+							}
+						}
+						.billOrder{
+							font-size: .8rem;
+							color: #666;
+						}
+						.rigth_b{
+							color: #666;
+							font-size: 0.8rem;
+							margin-top: 10rpx;
+							view{
+								&:last-child{
+									color:#333;
+									text{
+										color:$uni-color-warning;
+									}
+								}
+							}
+						}
+					}
+				}
+			}
+		.footer{
+			background-color: #f8f8f8;
+			padding: 20rpx;
+			.f-mid{
+				flex-grow: 1;
+				color: #666;
+				font-size: 0.8rem;
+				> view{
+					&:first-child{
+						text{
+							color: $uni-color-warning;
+							vertical-align: middle;
+						}
+					}
+					&:last-child{
+						text{
+							color: $uni-color-primary;
+							vertical-align: middle;
+						}
+					}
+				}
+				.costBtn{
+					width:70rpx;
+					height: 40rpx;
+					line-height: 40rpx;
+					text-align: center;
+					color:#fff;
+					font-size: 20rpx;
+					border-radius: 30rpx;
+					background: #999;
+					margin-left: 20rpx;
+				}
+			}
+		}
+	}
+</style>

+ 5 - 1
pages/sales/index.vue

@@ -35,6 +35,10 @@
 					<u-image class="nav-pic" :src="`../../static/${theme}/navIcon/pfind.png`" width="64" height="64"></u-image>
 					<text class="nav-txt">产品查询</text>
 				</view>
+				<view class="nav-item" @click="toPage('/pages/sales/bill')">
+					<u-image class="nav-pic" :src="`../../static/${theme}/navIcon/sale_icon.png`" width="70" height="70"></u-image>
+					<text class="nav-txt">应收对账单</text>
+				</view>
 			</view>
 			<!-- 销售单 -->
 			<view class="sales-list">
@@ -257,7 +261,7 @@
 		}
 		.nav-cont{
 			.nav-item{
-				width: 49%;
+				width: 32%;
 				border-radius: 25upx;
 				background-color: #ffffff;
 				padding: 14upx 0;