新增收银台组件

This commit is contained in:
唐明明
2022-01-04 11:34:26 +08:00
parent 219bc6027a
commit 304c4c9b98
14 changed files with 5131 additions and 3885 deletions

View File

@@ -78,7 +78,7 @@
"name": "Order",
"style": {
"navigationBarTitleText": "订单",
"navigationBarBackgroundColor":"#FFFFFF",
"navigationBarBackgroundColor": "#FFFFFF",
"enablePullDownRefresh": false
}
}, {
@@ -113,6 +113,12 @@
"navigationBarTitleText": "编辑",
"enablePullDownRefresh": false
}
}, {
"path": "pages/pay/pay",
"style": {
"navigationBarTitleText": "收银台",
"navigationBarBackgroundColor":"#FFFFFF"
}
}],
"tabBar": {
"borderStyle": "white",

31
pages/pay/pay.vue Normal file
View File

@@ -0,0 +1,31 @@
<template>
<view>
<oct-pay
price="100.00"
payNo="2021321649127837218918231"
color="#34CE98"
price-color="#e6576b"
:payPlatform="['alipay', 'wxpay']"
@onPay="pay"
/>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
pay(e){
console.log("支付平台" + e.platform)
}
}
}
</script>
<style>
</style>

View File

View File

@@ -0,0 +1,187 @@
<template>
<view class="oct--pay">
<!-- 支付信息 -->
<view class="header">
<view class="price" :style="{color: priceColor}"><text></text>{{price}}</view>
<view class="info">
<slot name="pay-info">
<view class="pay--no">订单号{{payNo}}</view>
</slot>
</view>
</view>
<!-- 支付方式 -->
<radio-group class="radios" @change="radioChang">
<block v-for="(pay, payIndex) in payPlatform" :key="payIndex">
<view class="radio--item" v-if="pay === 'wxpay'">
<label class="radio-flex">
<view class="radio--text">
<image class="radio--icon" src="../../static/wechat.png" mode="widthFix"></image>
微信
</view>
<radio value="wxpay" :checked="payIndex === 0" :color="color" />
</label>
</view>
<view class="radio--item" v-if="pay === 'alipay'">
<label class="radio-flex">
<view class="radio--text">
<image class="radio--icon" src="../../static/alipay.png" mode="widthFix"></image>
支付宝
</view>
<radio value="alipay" :checked="payIndex === 0" :color="color" />
</label>
</view>
</block>
</radio-group>
<!-- 提交支付 -->
<view class="footer">
<button class="footer--pay" :style="{backgroundColor: color}" type="default" @click="subPay">支付</button>
</view>
</view>
</template>
<script>
/* modulesName: 收银台
* author: 唐明明
* ----------------------------
* 支付平台price
* 参数类型String
* 支持参数:-
* 默认参数0.00
* ----------------------------
* 支付平台payPlatform
* 参数类型Array
* 支持参数wxpay/alipay
* 默认参数:["wxpay", "alipay"]
* ----------------------------
* 支付编号payNo
* 参数类型String
* 支持参数:-
* 默认参数:-
* 定义插槽pay-info后无效
* ----------------------------
* 主题颜色color
* 参数类型String
* 支持参数:-
* 默认参数:#3764FF
* ----------------------------
* 价格颜色priceColor
* 参数类型String
* 支持参数:-
* 默认参数:#FF6160
* ----------------------------
* */
export default{
props: {
// 支付方式配置
payPlatform: {
type: Array,
default: ()=> {
return ["wxpay", "alipay"]
}
},
// 支付编号
payNo: {
type : String,
default : "-"
},
// 主题颜色
color : {
type : String,
default : "#3764FF"
},
// 价格颜色
priceColor : {
type : String,
default : "#fa3534"
},
// 价格
price: {
type:String,
default: '0.00'
}
},
data(){
return {
platform: this.payPlatform[0]
}
},
methods:{
subPay(){
this.$emit("onPay", {
platform: this.platform
})
},
radioChang(e){
this.platform = e.detail.value
}
}
}
</script>
<style lang="scss">
$margin: 30rpx;
$radius: 10rpx;
.oct--pay{
padding: $margin;
&>.header{
text-align: center;
padding: ($margin*2) $margin;
.price{
font-size: 58rpx;
font-weight: bold;
&>text{
font-size: 70%;
}
}
.info{
.pay--no{
color: #82848a;
font-size: 30rpx;
}
}
}
&>.radios{
.radio--item{
margin-bottom: $margin;
background: white;
border-radius: $radius;
.radio-flex{
height: 100rpx;
padding: 0 $margin;
align-items: center;
display: flex;
justify-content: space-between;
font-size: 30rpx;
color: #333;
& > radio{
transform:scale(0.8)
}
}
.radio--text{
.radio--icon{
width: 52rpx;
height: 52rpx;
margin: 0;
vertical-align: middle;
margin-right: $margin/3;
}
}
}
}
&>.footer{
margin-top: $margin;
.footer--pay{
height: 90rpx;
line-height: 90rpx;
color: white;
border-radius: $radius;
font-size: 34rpx;
font-weight: bold;
&::after{
border: none;
}
}
}
}
</style>

View File

@@ -0,0 +1,80 @@
{
"id": "oct-pay",
"displayName": "oct-pay",
"version": "1.0.0",
"description": "oct-pay",
"keywords": [
"oct-pay"
],
"repository": "",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": "970899069"
},
"declaration": {
"ads": "",
"data": "",
"permissions": ""
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "u",
"aliyun": "u"
},
"client": {
"Vue": {
"vue2": "u",
"vue3": "u"
},
"App": {
"app-vue": "u",
"app-nvue": "u"
},
"H5-mobile": {
"Safari": "u",
"Android Browser": "u",
"微信浏览器(Android)": "u",
"QQ浏览器(Android)": "u"
},
"H5-pc": {
"Chrome": "u",
"IE": "u",
"Edge": "u",
"Firefox": "u",
"Safari": "u"
},
"小程序": {
"微信": "u",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}

View File

@@ -0,0 +1,3 @@
# 收银台

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

View File

@@ -1,8 +1,8 @@
var isReady=false;var onReadyCallbacks=[];
var isServiceReady=false;var onServiceReadyCallbacks=[];
var __uniConfig = {"pages":["pages/index/index","pages/record/index","pages/store/index","pages/user/index","pages/auth/auth","pages/store/goods","pages/store/buy","pages/order/index","pages/order/details","pages/address/index","pages/address/edit"],"window":{"navigationBarTextStyle":"black","navigationBarTitleText":"ZH健康","navigationBarBackgroundColor":"#F3F6FB","backgroundColorTop":"#F3F6FB","backgroundColorBottom":"#F3F6FB"},"tabBar":{"borderStyle":"white","selectedColor":"#34CE98","list":[{"iconPath":"static/tabBar/tabBar_00.png","selectedIconPath":"static/tabBar/tabBar_show_00.png","pagePath":"pages/index/index","text":"发现"},{"iconPath":"static/tabBar/tabBar_01.png","selectedIconPath":"static/tabBar/tabBar_show_01.png","pagePath":"pages/record/index","text":"记录"},{"iconPath":"static/tabBar/tabBar_02.png","selectedIconPath":"static/tabBar/tabBar_show_02.png","pagePath":"pages/store/index","text":"商城"},{"iconPath":"static/tabBar/tabBar_03.png","selectedIconPath":"static/tabBar/tabBar_show_03.png","pagePath":"pages/user/index","text":"我的"}]},"nvueCompiler":"uni-app","nvueStyleCompiler":"uni-app","renderer":"auto","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":false},"appname":"健康监测","compilerVersion":"3.3.5","entryPagePath":"pages/order/index","entryPageQuery":"","realEntryPagePath":"pages/index/index","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000}};
var __uniRoutes = [{"path":"/pages/index/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"发现","navigationStyle":"custom"}},{"path":"/pages/record/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"记录","navigationStyle":"custom"}},{"path":"/pages/store/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"健康生活","titleNView":{"backgroundColor":"#FFFFFF","titleSize":"16","buttons":[{"float":"left","text":"","fontSrc":"/static/iconfont.ttf","color":"#666","fontSize":"20px"},{"float":"right","text":"","fontSrc":"/static/iconfont.ttf","color":"#666","fontSize":"20px"}]}}},{"path":"/pages/user/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"我的","navigationStyle":"custom"}},{"path":"/pages/auth/auth","meta":{},"window":{"navigationBarTitleText":"登录"}},{"path":"/pages/store/goods","meta":{},"window":{"navigationStyle":"custom","navigationBarTitleText":"详情","titleNView":{"backgroundColor":"#FFFFFF","type":"transparent"}}},{"path":"/pages/store/buy","meta":{},"window":{"navigationBarTitleText":"确认订单","enablePullDownRefresh":false}},{"path":"/pages/order/index","meta":{},"window":{"navigationBarTitleText":"订单","navigationBarBackgroundColor":"#FFFFFF","enablePullDownRefresh":false}},{"path":"/pages/order/details","meta":{},"window":{"navigationBarTitleText":"订单详情","enablePullDownRefresh":false}},{"path":"/pages/address/index","meta":{},"window":{"navigationBarTitleText":"地址","titleNView":{"backgroundColor":"#FFFFFF","titleSize":"16","buttons":[{"float":"right","text":"新增","color":"#34CE98","fontSize":"14px"}]}}},{"path":"/pages/address/edit","meta":{},"window":{"navigationBarTitleText":"编辑","enablePullDownRefresh":false}}];
var __uniConfig = {"pages":["pages/index/index","pages/record/index","pages/store/index","pages/user/index","pages/auth/auth","pages/store/goods","pages/store/buy","pages/order/index","pages/order/details","pages/address/index","pages/address/edit","pages/pay/pay"],"window":{"navigationBarTextStyle":"black","navigationBarTitleText":"ZH健康","navigationBarBackgroundColor":"#F3F6FB","backgroundColorTop":"#F3F6FB","backgroundColorBottom":"#F3F6FB"},"tabBar":{"borderStyle":"white","selectedColor":"#34CE98","list":[{"iconPath":"static/tabBar/tabBar_00.png","selectedIconPath":"static/tabBar/tabBar_show_00.png","pagePath":"pages/index/index","text":"发现"},{"iconPath":"static/tabBar/tabBar_01.png","selectedIconPath":"static/tabBar/tabBar_show_01.png","pagePath":"pages/record/index","text":"记录"},{"iconPath":"static/tabBar/tabBar_02.png","selectedIconPath":"static/tabBar/tabBar_show_02.png","pagePath":"pages/store/index","text":"商城"},{"iconPath":"static/tabBar/tabBar_03.png","selectedIconPath":"static/tabBar/tabBar_show_03.png","pagePath":"pages/user/index","text":"我的"}]},"nvueCompiler":"uni-app","nvueStyleCompiler":"uni-app","renderer":"auto","splashscreen":{"alwaysShowBeforeRender":true,"autoclose":false},"appname":"健康监测","compilerVersion":"3.3.5","entryPagePath":"pages/pay/pay","entryPageQuery":"","realEntryPagePath":"pages/index/index","networkTimeout":{"request":60000,"connectSocket":60000,"uploadFile":60000,"downloadFile":60000}};
var __uniRoutes = [{"path":"/pages/index/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"发现","navigationStyle":"custom"}},{"path":"/pages/record/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"记录","navigationStyle":"custom"}},{"path":"/pages/store/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"健康生活","titleNView":{"backgroundColor":"#FFFFFF","titleSize":"16","buttons":[{"float":"left","text":"","fontSrc":"/static/iconfont.ttf","color":"#666","fontSize":"20px"},{"float":"right","text":"","fontSrc":"/static/iconfont.ttf","color":"#666","fontSize":"20px"}]}}},{"path":"/pages/user/index","meta":{"isQuit":true,"isTabBar":true},"window":{"navigationBarTitleText":"我的","navigationStyle":"custom"}},{"path":"/pages/auth/auth","meta":{},"window":{"navigationBarTitleText":"登录"}},{"path":"/pages/store/goods","meta":{},"window":{"navigationStyle":"custom","navigationBarTitleText":"详情","titleNView":{"backgroundColor":"#FFFFFF","type":"transparent"}}},{"path":"/pages/store/buy","meta":{},"window":{"navigationBarTitleText":"确认订单","enablePullDownRefresh":false}},{"path":"/pages/order/index","meta":{},"window":{"navigationBarTitleText":"订单","navigationBarBackgroundColor":"#FFFFFF","enablePullDownRefresh":false}},{"path":"/pages/order/details","meta":{},"window":{"navigationBarTitleText":"订单详情","enablePullDownRefresh":false}},{"path":"/pages/address/index","meta":{},"window":{"navigationBarTitleText":"地址","titleNView":{"backgroundColor":"#FFFFFF","titleSize":"16","buttons":[{"float":"right","text":"新增","color":"#34CE98","fontSize":"14px"}]}}},{"path":"/pages/address/edit","meta":{},"window":{"navigationBarTitleText":"编辑","enablePullDownRefresh":false}},{"path":"/pages/pay/pay","meta":{},"window":{"navigationBarTitleText":"收银台","navigationBarBackgroundColor":"#FFFFFF"}}];
__uniConfig.onReady=function(callback){if(__uniConfig.ready){callback()}else{onReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"ready",{get:function(){return isReady},set:function(val){isReady=val;if(!isReady){return}const callbacks=onReadyCallbacks.slice(0);onReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
__uniConfig.onServiceReady=function(callback){if(__uniConfig.serviceReady){callback()}else{onServiceReadyCallbacks.push(callback)}};Object.defineProperty(__uniConfig,"serviceReady",{get:function(){return isServiceReady},set:function(val){isServiceReady=val;if(!isServiceReady){return}const callbacks=onServiceReadyCallbacks.slice(0);onServiceReadyCallbacks.length=0;callbacks.forEach(function(callback){callback()})}});
service.register("uni-app-config",{create(a,b,c){if(!__uniConfig.viewport){var d=b.weex.config.env.scale,e=b.weex.config.env.deviceWidth,f=Math.ceil(e/d);Object.assign(__uniConfig,{viewport:f,defaultFontSize:Math.round(f/20)})}return{instance:{__uniConfig:__uniConfig,__uniRoutes:__uniRoutes,global:void 0,window:void 0,document:void 0,frames:void 0,self:void 0,location:void 0,navigator:void 0,localStorage:void 0,history:void 0,Caches:void 0,screen:void 0,alert:void 0,confirm:void 0,prompt:void 0,fetch:void 0,XMLHttpRequest:void 0,WebSocket:void 0,webkit:void 0,print:void 0}}}});

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -1 +1 @@
{"@platforms":["android","iPhone","iPad"],"id":"__UNI__C29473D","name":"健康监测","version":{"name":"1.0.0","code":"100"},"description":"","launch_path":"__uniappview.html","developer":{"name":"","email":"","url":""},"permissions":{"UniNView":{"description":"UniNView原生渲染"}},"plus":{"useragent":{"value":"uni-app","concatenate":true},"splashscreen":{"target":"id:1","autoclose":true,"waiting":true,"delay":0},"popGesture":"close","launchwebview":{"id":"1","kernel":"WKWebview"},"statusbar":{"immersed":"supportedDevice","style":"dark","background":"#F3F6FB"},"usingComponents":true,"nvueStyleCompiler":"uni-app","compilerVersion":3,"distribute":{"google":{"permissions":["<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>","<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>","<uses-permission android:name=\"android.permission.VIBRATE\"/>","<uses-permission android:name=\"android.permission.READ_LOGS\"/>","<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>","<uses-feature android:name=\"android.hardware.camera.autofocus\"/>","<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>","<uses-permission android:name=\"android.permission.CAMERA\"/>","<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>","<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>","<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>","<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>","<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>","<uses-feature android:name=\"android.hardware.camera\"/>","<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"]},"apple":{},"plugins":{"audio":{"mp3":{"description":"Android平台录音支持MP3格式文件"}}}},"arguments":"{\"id\":0,\"name\":\"pages/order/index\",\"pathName\":\"pages/order/index\",\"query\":\"\"}","allowsInlineMediaPlayback":true,"safearea":{"background":"#FFFFFF","bottom":{"offset":"auto"}},"uni-app":{"compilerVersion":"3.3.5","control":"uni-v3","nvueCompiler":"uni-app","renderer":"auto","nvue":{"flex-direction":"column"},"nvueLaunchMode":"normal"},"tabBar":{"borderStyle":"rgba(255,255,255,0.4)","selectedColor":"#34CE98","list":[{"iconPath":"static/tabBar/tabBar_00.png","selectedIconPath":"static/tabBar/tabBar_show_00.png","pagePath":"pages/index/index","text":"发现"},{"iconPath":"static/tabBar/tabBar_01.png","selectedIconPath":"static/tabBar/tabBar_show_01.png","pagePath":"pages/record/index","text":"记录"},{"iconPath":"static/tabBar/tabBar_02.png","selectedIconPath":"static/tabBar/tabBar_show_02.png","pagePath":"pages/store/index","text":"商城"},{"iconPath":"static/tabBar/tabBar_03.png","selectedIconPath":"static/tabBar/tabBar_show_03.png","pagePath":"pages/user/index","text":"我的"}],"height":"50px"},"launch_path":"__uniappview.html"}}
{"@platforms":["android","iPhone","iPad"],"id":"__UNI__C29473D","name":"健康监测","version":{"name":"1.0.0","code":"100"},"description":"","launch_path":"__uniappview.html","developer":{"name":"","email":"","url":""},"permissions":{"UniNView":{"description":"UniNView原生渲染"}},"plus":{"useragent":{"value":"uni-app","concatenate":true},"splashscreen":{"target":"id:1","autoclose":true,"waiting":true,"delay":0},"popGesture":"close","launchwebview":{"id":"1","kernel":"WKWebview"},"statusbar":{"immersed":"supportedDevice","style":"dark","background":"#F3F6FB"},"usingComponents":true,"nvueStyleCompiler":"uni-app","compilerVersion":3,"distribute":{"google":{"permissions":["\u003cuses-permission android:name\u003d\"android.permission.CHANGE_NETWORK_STATE\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.VIBRATE\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.READ_LOGS\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.ACCESS_WIFI_STATE\"/\u003e","\u003cuses-feature android:name\u003d\"android.hardware.camera.autofocus\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.ACCESS_NETWORK_STATE\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.CAMERA\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.GET_ACCOUNTS\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.READ_PHONE_STATE\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.CHANGE_WIFI_STATE\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.WAKE_LOCK\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.FLASHLIGHT\"/\u003e","\u003cuses-feature android:name\u003d\"android.hardware.camera\"/\u003e","\u003cuses-permission android:name\u003d\"android.permission.WRITE_SETTINGS\"/\u003e"]},"apple":{},"plugins":{"audio":{"mp3":{"description":"Android平台录音支持MP3格式文件"}}}},"allowsInlineMediaPlayback":true,"safearea":{"background":"#FFFFFF","bottom":{"offset":"auto"}},"uni-app":{"compilerVersion":"3.3.5","control":"uni-v3","nvueCompiler":"uni-app","renderer":"auto","nvue":{"flex-direction":"column"},"nvueLaunchMode":"normal"},"tabBar":{"borderStyle":"rgba(255,255,255,0.4)","selectedColor":"#34CE98","list":[{"iconPath":"static/tabBar/tabBar_00.png","selectedIconPath":"static/tabBar/tabBar_show_00.png","pagePath":"pages/index/index","text":"发现"},{"iconPath":"static/tabBar/tabBar_01.png","selectedIconPath":"static/tabBar/tabBar_show_01.png","pagePath":"pages/record/index","text":"记录"},{"iconPath":"static/tabBar/tabBar_02.png","selectedIconPath":"static/tabBar/tabBar_show_02.png","pagePath":"pages/store/index","text":"商城"},{"iconPath":"static/tabBar/tabBar_03.png","selectedIconPath":"static/tabBar/tabBar_show_03.png","pagePath":"pages/user/index","text":"我的"}],"height":"50px"},"launch_path":"__uniappview.html","arguments":"{\"pathName\":\"pages/pay/pay\",\"query\":\"\"}"}}

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB