Skip to content

D
doublescreen-front
Commit 2ead6f2e authored by jiangjiantao's avatar jiangjiantao
Browse files
Options

扫商品页面布局

parent 3a05fea7
Show whitespace changes
Inline Side-by-side
Showing with 516 additions and 3 deletions
.gitignore
View file @ 2ead6f2e
.tea .tea
.DS_Store .DS_Store
/.tea /.tea
.tea/layout.json
.tea/configuration/mini-program.json
View file @ 2ead6f2e
{"tinyType":"alipayiot","tinyCnName":"支付宝 IoT","tinyProjectType":"xpaas-mini","alipayiot:xpaas-mini:tinyIcon":"https://gw.alipayobjects.com/mdn/rms_c763d8/afts/img/A*vNMFT7X_u3sAAAAAAAAAAABkARQnAQ","alipayiot:xpaas-mini:auditLink":null,"alipayiot:xpaas-mini:whiteListLink":null,"alipayiot:xpaas-mini:createLink":null,"alipayiot:xpaas-mini:component2":false,"alipayiot:xpaas-mini:_enableAutoPush":false,"alipayiot:xpaas-mini:_appIdList":[],"alipayiot:xpaas-mini:uploadTime":"","alipayiot:xpaas-mini:packageSize":0,"alipayiot:xpaas-mini:lastDeviceName":"蜻蜓F4","isSimulatorOpen":true,"isNotFirstToggleSimulator":true,"storageVersion":"1.5.7"} {"tinyType":"alipayiot","tinyCnName":"支付宝 IoT","tinyProjectType":"xpaas-mini","alipay:alipay-mini:tinyIcon":"https://gw.alipayobjects.com/zos/rmsportal/rcwFIauzePpMqlTzzanK.svg","alipay:alipay-mini:compilePreviewTime":"","alipay:alipay-mini:compilePreviewWholePackSize":"","alipay:alipay-mini:compilePreviewSubpackSizes":"","alipay:alipay-mini:_appIdList":[{"appid":"2019072465945502","name":"名称释放00253830","logoUrl":"https://appstoreisvpic.alipayobjects.com/prod/eebdb2f7-2747-499e-9a22-2b89664d7739.png"},{"appid":"2019072465958445","name":"名称释放00253829","logoUrl":"https://appstoreisvpic.alipayobjects.com/prod/eebdb2f7-2747-499e-9a22-2b89664d7739.png"},{"appid":"2019071065828181","name":"米雅快捷收银服务","logoUrl":"https://appstoreisvpic.alipayobjects.com/prod/82b9108c-6db6-4713-b2e4-d0aac92613fc.png"}],"alipay:alipay-mini:preAuditLimit":5,"alipay:alipay-mini:preAuditUsed":0,"alipay:alipay-mini:uploadTime":"","alipay:alipay-mini:packageSize":"","alipay:alipay-mini:auditLink":null,"alipay:alipay-mini:whiteListLink":null,"alipay:alipay-mini:_enableAutoPush":true,"alipay:alipay-mini:_appId":"2019072465958445","alipay:alipay-mini:_appName":"名称释放00253829","alipay:alipay-mini:remoteVersion":"0.0.0","alipay:alipay-mini:currentVersion":"0.0.1","alipay:alipay-mini:whiteList":[],"alipay:alipay-mini:h5WhiteList":[],"alipay:alipay-mini:appLogo":"https://appstoreisvpic.alipayobjects.com/prod/eebdb2f7-2747-499e-9a22-2b89664d7739.png","alipayiot:xpaas-mini:tinyIcon":"https://gw.alipayobjects.com/mdn/rms_c763d8/afts/img/A*vNMFT7X_u3sAAAAAAAAAAABkARQnAQ","alipayiot:xpaas-mini:compilePreviewTime":"2020-02-04 17:23:34","alipayiot:xpaas-mini:compilePreviewWholePackSize":"65.2 KB","alipayiot:xpaas-mini:compilePreviewSubpackSizes":"","alipayiot:xpaas-mini:_appIdList":[],"alipayiot:xpaas-mini:preAuditLimit":5,"alipayiot:xpaas-mini:preAuditUsed":0,"alipayiot:xpaas-mini:uploadTime":"","alipayiot:xpaas-mini:packageSize":"","alipayiot:xpaas-mini:auditLink":null,"alipayiot:xpaas-mini:whiteListLink":null,"alipayiot:xpaas-mini:_enableAutoPush":true,"alipayiot:xpaas-mini:lastDeviceName":"蜻蜓F4","alipayiot:xpaas-mini:_appId":"2021001107603212","alipayiot:xpaas-mini:_appName":"米雅双屏收银小程序-前屏","alipayiot:xpaas-mini:remoteVersion":"0.0.0","alipayiot:xpaas-mini:currentVersion":"0.0.1","alipayiot:xpaas-mini:whiteList":[],"alipayiot:xpaas-mini:h5WhiteList":[],"alipayiot:xpaas-mini:appLogo":"https://appstoreisvpic.alipayobjects.com/prod/eebdb2f7-2747-499e-9a22-2b89664d7739.png","isSimulatorOpen":false,"alipayiot:xpaas-mini:MockStore":{},"isNotFirstToggleSimulator":true,"storageVersion":"1.5.5"}
\ No newline at end of file \ No newline at end of file
.tea/layout.json
View file @ 2ead6f2e
{"layout":{"left":{"currentId":"scm_container","size":310},"right":{"currentId":""},"bottom":{"currentId":""}},"storageVersion":"1.5.7"} {"layout":{"left":{"currentId":"scm_container","size":310},"right":{"currentId":""},"bottom":{"currentId":"devtools","size":164}},"storageVersion":"1.5.5"}
\ No newline at end of file \ No newline at end of file
app.json
View file @ 2ead6f2e
{ {
"pages": [ "pages": [
"pages/scan/scan",
"pages/login/login", "pages/login/login",
"pages/index/index" "pages/index/index"
], ],
"window": { "window": {
"defaultTitle": "" "defaultTitle": ""
......
pages/scan/scan.acss 0 → 100644
View file @ 2ead6f2e
/* 整个页面 */
.pagex {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
justify-content: space-between;
align-items:center;
position: absolute;
background: url(/images/scan_header_bg.png) no-repeat fixed top;
background-size:100% 200rpx;
}
/* 商品头部 */
.scan-header {
display: flex;
flex-direction: row;
width: 700rpx;
height: 120rpx;
color: white;
font-size: 36rpx;
line-height: 40rpx;
justify-content: space-between;
align-items:center;
}
/* 中间商品列表整体样式 */
.scan-good-body {
width: 700rpx;
height: 100%;
background: transparent
}
/* 面板下方，总额，总数量，总优惠 */
.scan-bottom {
display: flex;
flex-direction: column;
width: 100%;
height: 175rpx;
justify-content: space-between;
align-items:center;
background-color: white
}
/* 面板下方，总额，总数量，总优惠 其中一排*/
.scan-bottom-item {
display: flex;
flex-direction: row;
width: 100%;
height: 87.5rpx;
align-items:center;
}
/* 商品价格 */
.good-list-item-price-font{
color: #F96146;
font-size: 44rpx;
font-family: PingFangSC-Semibold,PingFang SC;
font-weight:600;
margin-left: 24rpx;
}
/* 商品数量 */
.good-list-item-quantity-font{
color: #8C8C8C;
font-size: 32rpx;
font-family: PingFangSC-Semibold,PingFang SC;
font-weight:600;
margin-right: 24rpx
}
/* 商品名称 */
.good-list-item-name-font{
color: #333333;
font-size: 32rpx;
font-family: PingFangSC-Semibold,PingFang SC;
font-weight:600;
margin-left: 24rpx;
margin-top: 25rpx;
}
/* 商品列表项价格和数量 */
.scan-good-list-item{
display: flex;
flex-direction: row;
width: 100%;
height: 80rpx;
justify-content: space-between;
align-items:center;
}
/* 商品列表项背景 */
.scan-list-bg{
height: 158rpx;
border-radius:16px;
background-color: white;
margin-bottom: 24rpx;
box-shadow:0px 2px 10px 0px rgba(77,81,102,0.1);
display: flex;
flex-direction: column;
}
/* 总额 */
.scan-price-total-propmt{
font-size: 32rpx;
color: #8C8C8C;
margin-left:24rpx
}
/* 总价 */
.scan-price-total{
font-size: 60rpx;
color: #F96146;
margin-left:24rpx
}
/* 总的数量 */
.scan-price-quantity-propmt{
font-size: 32rpx;
color: #8C8C8C;
margin-left:12rpx
}
/* 已优惠总的金额 */
.scan-disc-total{
font-size: 40rpx;
color: #F96146;
margin-left:24rpx
}
pages/scan/scan.axml 0 → 100644
View file @ 2ead6f2e
<view class="pagex">
<view slot="header" class="scan-header">
<view>
欢迎您，130****6170
</view>
<view>
积分：130
</view>
</view>
<scroll-view class="scan-good-body" scroll-y >
<block a:for="{{goods}}">
<view class="scan-list-bg">
<view class="good-list-item-name-font">
{{item.name}}
</view>
<view class="scan-good-list-item">
<view class="good-list-item-price-font">¥{{item.price}}</view>
<view class="good-list-item-quantity-font">
{{item.quantity}}件
</view>
</view>
</view>
</block>
</scroll-view>
<view slot="footer" class="scan-bottom">
<view class="scan-bottom-item">
<view class="scan-price-total-propmt">
总额
</view>
<view class="scan-price-total">
¥688.00
</view>
<view class="scan-price-quantity-propmt">
（共3件）
</view>
</view>
<view class="scan-bottom-item">
<view class="scan-price-total-propmt">
已优惠
</view>
<view class="scan-disc-total">
¥68.00
</view>
</view>
</view>
</view>
\ No newline at end of file
pages/scan/scan.js 0 → 100644
View file @ 2ead6f2e
Page({
data: {
goods: [
{
/**
* 活动id
*/
activityId: "",
/**
* 活动类型
*/
activityType: "",
/**
* 活动名字
*/
activityName: "",
/**
* 折扣金额
*/
discnt: 0,
/**
* 活动开始时间
*/
startTime: 0,
/**
* 活动结束时间
*/
endTime: 0,
/**
* 商品图片
*/
pic: "",
/**
* 商品名字
*/
name: "杜蕾斯",
/**
* 商品价格,单位：分,后端定义的int,fck
*/
price: 20.88,
/**
* 售卖价格（单位分）
*/
salePrice: 0,
/**
* 商品数量：用于本地计算，默认为1
*/
quantity: 1,
/**
* 商品条码
*/
barcode: "",
/**
* 是否咱家优惠
*/
hasDiscount: false,
},
{
/**
* 活动id
*/
activityId: "",
/**
* 活动类型
*/
activityType: "",
/**
* 活动名字
*/
activityName: "",
/**
* 折扣金额
*/
discnt: 0,
/**
* 活动开始时间
*/
startTime: 0,
/**
* 活动结束时间
*/
endTime: 0,
/**
* 商品图片
*/
pic: "",
/**
* 商品名字
*/
name: "杜蕾斯",
/**
* 商品价格,单位：分,后端定义的int,fck
*/
price: 20.88,
/**
* 售卖价格（单位分）
*/
salePrice: 0,
/**
* 商品数量：用于本地计算，默认为1
*/
quantity: 1,
/**
* 商品条码
*/
barcode: "",
/**
* 是否咱家优惠
*/
hasDiscount: false,
},
{
/**
* 活动id
*/
activityId: "",
/**
* 活动类型
*/
activityType: "",
/**
* 活动名字
*/
activityName: "",
/**
* 折扣金额
*/
discnt: 0,
/**
* 活动开始时间
*/
startTime: 0,
/**
* 活动结束时间
*/
endTime: 0,
/**
* 商品图片
*/
pic: "",
/**
* 商品名字
*/
name: "杜蕾斯",
/**
* 商品价格,单位：分,后端定义的int,fck
*/
price: 20.88,
/**
* 售卖价格（单位分）
*/
salePrice: 0,
/**
* 商品数量：用于本地计算，默认为1
*/
quantity: 1,
/**
* 商品条码
*/
barcode: "",
/**
* 是否咱家优惠
*/
hasDiscount: false,
},
{
/**
* 活动id
*/
activityId: "",
/**
* 活动类型
*/
activityType: "",
/**
* 活动名字
*/
activityName: "",
/**
* 折扣金额
*/
discnt: 0,
/**
* 活动开始时间
*/
startTime: 0,
/**
* 活动结束时间
*/
endTime: 0,
/**
* 商品图片
*/
pic: "",
/**
* 商品名字
*/
name: "杜蕾斯",
/**
* 商品价格,单位：分,后端定义的int,fck
*/
price: 20.88,
/**
* 售卖价格（单位分）
*/
salePrice: 0,
/**
* 商品数量：用于本地计算，默认为1
*/
quantity: 1,
/**
* 商品条码
*/
barcode: "",
/**
* 是否咱家优惠
*/
hasDiscount: false,
},
{
/**
* 活动id
*/
activityId: "",
/**
* 活动类型
*/
activityType: "",
/**
* 活动名字
*/
activityName: "",
/**
* 折扣金额
*/
discnt: 0,
/**
* 活动开始时间
*/
startTime: 0,
/**
* 活动结束时间
*/
endTime: 0,
/**
* 商品图片
*/
pic: "",
/**
* 商品名字
*/
name: "杜蕾斯",
/**
* 商品价格,单位：分,后端定义的int,fck
*/
price: 20.88,
/**
* 售卖价格（单位分）
*/
salePrice: 0,
/**
* 商品数量：用于本地计算，默认为1
*/
quantity: 1,
/**
* 商品条码
*/
barcode: "",
/**
* 是否咱家优惠
*/
hasDiscount: false,
}, {
/**
* 活动id
*/
activityId: "",
/**
* 活动类型
*/
activityType: "",
/**
* 活动名字
*/
activityName: "",
/**
* 折扣金额
*/
discnt: 0,
/**
* 活动开始时间
*/
startTime: 0,
/**
* 活动结束时间
*/
endTime: 0,
/**
* 商品图片
*/
pic: "",
/**
* 商品名字
*/
name: "杜蕾斯",
/**
* 商品价格,单位：分,后端定义的int,fck
*/
price: 20.88,
/**
* 售卖价格（单位分）
*/
salePrice: 0,
/**
* 商品数量：用于本地计算，默认为1
*/
quantity: 1,
/**
* 商品条码
*/
barcode: "",
/**
* 是否咱家优惠
*/
hasDiscount: false,
}
],
},
});
\ No newline at end of file
pages/scan/scan.json 0 → 100644
View file @ 2ead6f2e
{
"transparentTitle": "always",
"usingComponents":{
"list": "mini-antui/es/list/index",
"list-item": "mini-antui/es/list/list-item/index"
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment