|
|
@@ -0,0 +1,287 @@
|
|
|
+<template>
|
|
|
+ <view class="container order clearfix" :style="{paddingBottom :isIphoneX ? '170rpx' : '134rpx'}">
|
|
|
+ <view class="product-info">
|
|
|
+ <view class="product-logo">
|
|
|
+ <image :src="productInfo.mainImage" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="product-cent">
|
|
|
+ <view class="product-name">商品编码：{{ productInfo.productCode }}</view>
|
|
|
+ <view class="product-note">规格：{{ productInfo.unit }}</view>
|
|
|
+ <view class="product-nums">X1</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="created-info">
|
|
|
+ <view class="created-item">
|
|
|
+ <view class="label">商品名称：</view>
|
|
|
+ <input class="input" type="text" v-model="params.name" placeholder="必填，最多不超过40个汉字" maxlength="40"/>
|
|
|
+ </view>
|
|
|
+ <view class="created-item">
|
|
|
+ <view class="label">商品价格：</view>
|
|
|
+ <input class="input" type="number" v-model="params.price" placeholder="必填" maxlength="20"/>
|
|
|
+ </view>
|
|
|
+ <view class="created-item">
|
|
|
+ <view class="label">备注：</view>
|
|
|
+ <input class="input" type="number" v-model="params.note" placeholder="选填，最多不超过50个汉字" maxlength="50"/>
|
|
|
+ </view>
|
|
|
+ <view class="created-item">
|
|
|
+ <view class="label-total">合计：<text class="red">￥{{params.price | NumFormat}}</text> </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="footer" :style="{paddingBottom :isIphoneX ? '68rpx' : '0rpx'}">
|
|
|
+ <view class="footer-le">
|
|
|
+ <view class="footer-count">
|
|
|
+ <text>共1件商品</text>
|
|
|
+ </view>
|
|
|
+ <view class="footer-price">
|
|
|
+ <view class="sum">总价:<text class="price">￥{{params.price | NumFormat}}</text></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="footer-submit" @click.stop="orderSubmitMit">
|
|
|
+ <view class="btn">提交订单</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isIphoneX:this.$store.state.isIphoneX,
|
|
|
+ productInfo:{},
|
|
|
+ params:{
|
|
|
+ name:'',
|
|
|
+ price:'',
|
|
|
+ note:'',
|
|
|
+ userId:0 ,
|
|
|
+ serviceProviderId:0
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option){//商品数据
|
|
|
+ this.$api.getComStorage('orderUserInfo').then((resolve) =>{
|
|
|
+ this.params.userId = resolve.userID
|
|
|
+ this.getInitCrearOrder();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ filters:{
|
|
|
+ NumFormat(value) {//处理金额
|
|
|
+ return Number(value).toFixed(2);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getInitCrearOrder(option){//协销购物车跳转确认订单初始化信息
|
|
|
+ this.$api.getStorage().then((resolve) =>{
|
|
|
+ this.params.serviceProviderId = resolve.serviceProviderId
|
|
|
+ this.SellerService.SellerProductRechargeGoods({
|
|
|
+ productId:6060,
|
|
|
+ })
|
|
|
+ .then(response =>{
|
|
|
+ this.productInfo = response.data
|
|
|
+ console.log(this.productInfo)
|
|
|
+ })
|
|
|
+ .catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ orderSubmitMit(){//提交订单
|
|
|
+ if( this.params.name == ''){
|
|
|
+ this.$util.msg('请填写商品名称',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if( this.params.price == ''){
|
|
|
+ this.$util.msg('请填写商品价格',2000);
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.SellerService.SellerSubmitRechargeOrder(JSON.stringify(this.params)).then(response =>{
|
|
|
+ const data = response.data;
|
|
|
+ if(data.code === '1'){
|
|
|
+ this.$util.msg('支付成功',2000,true,'success')
|
|
|
+ setTimeout(() =>{
|
|
|
+ this.$api.redirectTo(`/seller/pages/order/order-details?type=cash&orderID=${data.orderID}`)
|
|
|
+ },2000)
|
|
|
+ }else{
|
|
|
+ this.$util.msg('订单提交成功',2000,true,'success')
|
|
|
+ setTimeout(()=>{
|
|
|
+ this.$api.redirectTo(`/seller/pages/order/order-details?type=cash&orderID=${data.orderID}`)
|
|
|
+ },2000)
|
|
|
+ }
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ page {
|
|
|
+ height: auto;
|
|
|
+ background:#F7F7F7;
|
|
|
+ }
|
|
|
+ .product-info{
|
|
|
+ width: 100%;
|
|
|
+ height: 228rpx;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 24rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .product-logo{
|
|
|
+ width: 180rpx;
|
|
|
+ height: 180rpx;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ float: left;
|
|
|
+ image{
|
|
|
+ width: 180rpx;
|
|
|
+ height: 180rpx;
|
|
|
+ display: block;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .product-cent{
|
|
|
+ width: 498rpx;
|
|
|
+ height: 180rpx;
|
|
|
+ float: right;
|
|
|
+ .product-name{
|
|
|
+ width: 100%;
|
|
|
+ height: 50rpx;
|
|
|
+ float: left;
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: #333333;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .product-note{
|
|
|
+ width: 100%;
|
|
|
+ height: 50rpx;
|
|
|
+ float: left;
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: #999999;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+ .product-nums{
|
|
|
+ width: 100%;
|
|
|
+ height: 50rpx;
|
|
|
+ float: left;
|
|
|
+ line-height: 50rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ color: #333333;
|
|
|
+ text-align: right;
|
|
|
+ margin-top: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .created-info{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 24rpx;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ float: left;
|
|
|
+ .created-item{
|
|
|
+ width: 100%;
|
|
|
+ height: 64rpx;
|
|
|
+ float: left;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ .label{
|
|
|
+ width: 148rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ line-height: 64rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ text-align: left;
|
|
|
+ color: #666666;
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ .input{
|
|
|
+ width: 550rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: 1px solid #e1e1e1;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ line-height: 64rpx;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ color: #666666;
|
|
|
+ float: left;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+ .label-total{
|
|
|
+ text-align: right;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ .red{
|
|
|
+ color: #f94b4b;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .footer{
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ z-index: 995;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ height: 110rpx;
|
|
|
+ line-height: 110rpx;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ z-index: 998;
|
|
|
+ color: $text-color;
|
|
|
+ .footer-le{
|
|
|
+ width:570rpx;
|
|
|
+ height:100%;
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ .footer-count{
|
|
|
+ float: left;
|
|
|
+ padding-left: 24rpx;
|
|
|
+ width:190rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ font-size: $font-size-26;
|
|
|
+ }
|
|
|
+ .footer-price{
|
|
|
+ width:370rpx;
|
|
|
+ float: right;
|
|
|
+ text-align: right;
|
|
|
+ color: $text-color;
|
|
|
+ padding: 10rpx 20rpx 10rpx 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .sum{
|
|
|
+ width: 100%;
|
|
|
+ height: 90rpx;
|
|
|
+ line-height: 90rpx;
|
|
|
+ float: left;
|
|
|
+ .price{
|
|
|
+ font-size: $font-size-32;
|
|
|
+ color: #FF2A2A;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .footer-submit{
|
|
|
+ display:flex;
|
|
|
+ align-items:center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 180rpx;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 15rpx 5rpx;
|
|
|
+ .btn{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ color: #FFFFFF;
|
|
|
+ background:linear-gradient(135deg,rgba(242,143,49,1) 0%,rgba(225,86,22,1) 100%);
|
|
|
+ font-size: $font-size-26;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 80rpx;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
