Merge branch 'master' of git.huaml.com:zhh/front-end

ghs/src/mixins/index.js

@@ -1,4 +1,5 @@
 export { default as list } from './list'
 // export { default as allOptions } from './allOptions'
 export { default as share } from './share'
+export { default as orderBtn } from './orderBtn'
 // export { default as area } from './area'

ghs/src/mixins/orderBtn.js

@@ -0,0 +1,30 @@
+import freeShipping from '@/api/order'
+export default {
+    methods: {
+        openBt(val){
+            // //花材
+            // if(val.type == 'item') {
+
+            //     // 自取
+            // }else if(val.type === 'selfGet') {
+
+            //     //发货
+            // }else if(val.type === 'send') {
+            //     this.pageTo({
+            //         url: '/admin/order/ship',
+            //         query: {
+            //           id: val.id,
+            //           pageStatus: 0
+            //         }
+            //       })
+            // }
+            this.pageTo({
+                url: '/pagesOrder/ship',
+                query: {
+                  id: 25,
+                  pageStatus: 0
+                }
+              })
+        },
+    }
+}

ghs/src/pages.json

@@ -134,7 +134,13 @@
 					"path": "detail",
 					"style": {
 						"navigationBarTitleText": "订单详情"
-					}
+					}	
+				},
+				{
+					"path": "ship",
+					"style": {
+						"navigationBarTitleText": "发货"
+					}	
 				}
 			]
 		},

ghs/src/pagesOrder/components/stepStatus.vue

@@ -1,29 +1,39 @@
 <template>
     <view class="step-status_bx">
-        <view>
-            <i class="iconfont iconjihuo clorBule"></i>
-            创建
-        </view>
-        <view class="dot-box">
-            <view v-for="i in 5" class="dot"></view>
-        </view>
-        <view>
-            <i class="iconfont iconjihuo"></i>
-            创建
-        </view>
-        <view class="dot-box">
-            <view v-for="i in 5" class="dot"></view>
-        </view>
-        <view>
-            <i class="iconfont iconjihuo"></i>
-            创建
-        </view>
+        <template
+            v-for="(s,idx) in stepOptions"
+        >
+            <view
+                  :key="idx"
+            >
+                <i :class="['iconfont','iconjihuo', s.complete?'clorBule':'']"></i>
+                {{s.name}}
+            </view>
+            <view 
+                :key="idx"
+                v-if="idx != 2"
+                class="dot-box">
+                <view 
+                :key="i"
+                v-for="i in 5" :class="['dot',s.complete?'clorBule':'']"></view>
+            </view>
+         </template>     
     </view>
 </template>
 
 <script>
     export default {
-        name:'StepStatus'
+        name:'StepStatus',
+        props:{
+            stepOptions:{
+                type:Array,
+                default:()=>[]
+            },
+            active:{
+                type:Number,
+                default: 0
+            }
+        }
     }
 </script>
 
@@ -50,8 +60,11 @@
             & .dot {
                 width: 8px;
                 height: 8px;
-                background-color: #3385FF;
+                background-color: #CCCCCC;
                 border-radius: 50%;
+                &.clorBule {
+                     background-color: #3385FF;
+                }
             }
         }
        

ghs/src/pagesOrder/detail.vue

@@ -1,19 +1,374 @@
 <template>
     <view class="app-content">   
-       <stepStatus></stepStatus> 
+       <stepStatus 
+        v-if="!$util.isEmpty(detailInfo)"
+        :stepOptions="detailInfo.progress"></stepStatus>
+       <view 
+            v-if="!$util.isEmpty(detailInfo)"
+            class="info-content_box">
+           <view class="title">
+               客户
+           </view>
+           <view class="address-des_bx content-box">
+            <view>
+                <view>
+                  {{detailInfo.customName}} {{detailInfo.customMobile}}
+                </view>
+                <view class="">
+                  {{detailInfo.customAddress + detailInfo.receiveAddress}}
+                </view>
+            </view>
+            <view>
+              <i @click="callUp(detailInfo.customMobile)" class="iconfont icondianhua1"></i>
+            </view>
+          </view>
+           <view class="title">
+               单据信息
+           </view>
+           <view class="bills-info_box content-box">
+               <view class="order-info_box">
+                  <view>日期：</view>
+                  <view>{{detailInfo.addTime}}</view>
+              </view>
+               <view class="order-info_box">
+                  <view>单号编码：</view>
+                  <view>{{detailInfo.orderSn}}</view>
+                  <view class="price">
+                      <button 
+                        @click="copy(detailInfo.orderSn)"
+                        class="admin-button-com default">复制</button>
+                  </view>
+              </view>
+              <view class="order-info_box">
+                  <view>销售人员：</view>
+                  <view>{{detailInfo.adminName}}</view>
+              </view>
+              <!-- <view class="order-info_box">
+                  <view>销售部门：</view>
+                  <view>2020 11-22</view>
+              </view> -->
+              <view class="order-info_box">
+                  <view>出货日期：</view>
+                  <view>{{detailInfo.outTime}}</view>
+              </view>
+              <!-- <view class="order-info_box">
+                  <view>销售门店：</view>
+                  <view>2020 11-22</view>
+              </view> -->
+           </view>
+           <view class="title">
+               商品信息
+           </view>
+           <view class="module-com content-box">
+                <view class="commodity-view">
+                    <view class="commodity-list">
+                        <view 
+                            v-for="(s,idx) in detailInfo.product"
+                            :key="idx"
+                            class="commodity-item">
+                            <image
+                                class="item-icon"
+                                :src="s.cover"
+                                alt="商品图"
+                            />
+
+                            <view class="item-info">
+                                <view class="info-line">
+                                    <text class="item-name">{{s.name}}</text>
+                                    <text class="item-price">
+                                        <text class="unit">¥</text>
+
+                                        <text class="price">{{s.price}}</text>
+                                    </text>
+                                </view>
+                                <view class="info-line">
+                                    <text class="item-type">{{s.price}}</text>
+                                    <text class="item-count">{{`${s.bigNum}/${s.smallNum}`}}</text>
+                                </view>
+                            </view>
+                        </view>
+                    </view>
+                    <view class="summary-bar">
+                        <view class="operate-view">
+                            <text class="iconfont icongouwuche"></text>
+                            重选花材
+                        </view>
+                        <view class="describe-view">
+                            共{{detailInfo.product.length || 0}}种, 共{{detailInfo.num}}扎{{detailInfo.smallNum}}支，合计 ¥<text class="price">{{detailInfo.actPrice}}</text>
+                        </view>
+                    </view>
+                </view>
+			</view>
+            <view class="content-box price-detail">
+                <div class="module-com input-line-wrap">
+                    <tui-list-cell class="line-cell" :hover="false">
+                        <div class="tui-title">运费</div>
+                        <div class="detail-price_box">¥{{detailInfo.sendCost}}</div>
+                    </tui-list-cell>
+                    <tui-list-cell class="line-cell" :hover="false">
+                        <div class="tui-title">总金额</div>
+                        <div class="detail-price_box red">¥{{detailInfo.totalPrice || 0}}</div>
+                    </tui-list-cell>
+                </div>
+            </view>
+            <view class="content-box price-detail">
+                <div class="module-com input-line-wrap">
+                    <tui-list-cell class="line-cell" :hover="false">
+                        <div class="tui-title">备注</div>
+                        <input 
+                            :disabled="true"
+                            v-model="detailInfo.remark" placeholder-class="phcolor" class="tui-input" name="name" maxlength="50" type="text" />
+                    </tui-list-cell>
+                </div>
+            </view>
+       </view>
+       <div class="app-footer">
+           <template
+                v-for="s in detailInfo.buttonList"   
+              >
+           <button
+                :key="s.type"
+                @click="openBt(s)"
+                v-if="s.disable == 1"
+                class="admin-button-com default" >
+                {{s.type==='item'?'花材':s.type==='selfGet'?'自取':'发货'}}
+            </button>
+        </template>
+       </div>
     </view>
 </template>
 
 <script>
     import stepStatus from './components/stepStatus'
+    import TuiListCell from '@/components/plugin/list-cell'
+    import { getDetail } from '@/api/order/index'
+    import {orderBtn} from '@/mixins'
+    // import { copyText } from '@/utils/common'
     export default {
         name:'orderDetail',
         components:{
-            stepStatus
+            stepStatus,
+            TuiListCell
+        },
+        mixins:[orderBtn],
+        data(){
+            return {
+                stepActive: 0,
+                form: {
+                    name:''
+                },
+                detailInfo:{}
+            }
+        },
+        methods:{
+            copy(val){
+               const self = this
+                uni.setClipboardData({
+                    data: val,
+                    success: function() {
+                        self.$msg('复制成功')
+                    }
+                })
+            },
+            callUp(mobile) {
+                uni.makePhoneCall({
+                    phoneNumber: mobile //仅为示例
+                });
+            },
+            async  init() {
+                 try {
+                  const res = await getDetail({
+                         id: this.option.id
+                     })
+                    this.detailInfo = res.data
+                 } finally {
+
+                 }
+            }
         }
     }
 </script>
 
-<style lang="sass" scoped>
+<style lang="scss" scoped>
+    .info-content_box {
+        padding: 0 20px 100px;
+        & > .title {
+            color: #666666;
+            font-size: 28px;
+            font-weight: 600;
+            padding:30px 3px;
+        }
+        & .address-des_bx {
+            display: flex;
+            padding: 20px 10px 30px 20px;
+            & > view:nth-child(1) {
+            flex: 1;
+            margin-top: 10px;
+            & > view:nth-child(1) {
+                color: #333333;
+                font-size: 32px;
+                font-weight: bold;
+            }
+            & > view:nth-child(2) {
+                color: #666666;
+                font-size: 28px;
+                font-weight: 400;
+                margin-top: 20px;
+                
+            }
+        }
+    & > view:nth-child(2) {
+      display: flex;
+      & .icondianhua1 {
+          font-size: 44px;
+          color: #3385FF;
+          margin-left: 10px;
+        }
+    }
+        }
+        .bills-info_box {
+            padding:30px 20px 30px;
+            // border-bottom: 1px solid #EEEEEE;
+            & > .order-info_box {
+            display: flex;
+            align-items: center;
+            font-size: 26px;
+            font-weight: 400;
+            margin-bottom: 5px;
+            & > view:nth-child(1) {
+                color: #999999;
+                width: 135px;
+                text-align: right;
+            }
+            & > view:nth-child(2) {
+                color: #333333;
+            }
+            & > .price {
+                flex: 1;
+                font-size: 30px;
+                color: #333333;
+                display: flex;
+                align-items: center;
+                justify-content: flex-end;
+                & .iconxiangyou {
+                color: #999999;
+                font-size: 25px;
+                margin-left: 12px;
+                }
+            }
+            }
+         }
+        .content-box {
+          background-color: #FFFFFF;  
+          border-radius: 10px;
+        }
+        .commodity-view {
+			display: flex;
+			flex-direction: column;
+			.commodity-list {
+				padding: 20px;
+				.commodity-item {
+					display: flex;
+					margin-bottom: 20px;
+					.item-icon {
+						flex-shrink: 0;
+						width: 140px;
+						height: 140px;
+					}
+					.item-info {
+						display: flex;
+						flex-direction: column;
+						justify-content: center;
+						flex: 1;
+						margin-left: 20px;
+						.info-line {
+							margin-bottom: 20px;
+							display: flex;
+							justify-content: space-between;
+							align-items: flex-end;
+							.item-name {
+								color: #666;
+								font-size: 28px;
+							}
+							.item-price {
+								color: #333;
+								font-size: 22px;
+								.price {
+									font-size: 32px;
+									font-weight: bold;
+								}
+							}
+							.item-type {
+								color: #999;
+								font-size: 24px;
+							}
+							.item-count {
+								color: #666;
+								font-size: 24px;
+							}
+						}
+					}
+				}
+			}
+			.summary-bar {
+				padding: 0 20px;
+				height: 90px;
+				display: flex;
 
+				align-items: center;
+				justify-content: space-between;
+				border-top: 1px solid #eeeeee;
+				.operate-view {
+					display: flex;
+
+					align-items: center;
+					color: #3385ff;
+					font-size: 26px;
+					.iconfont {
+						margin-right: 20px;
+						font-size: 40px;
+					}
+				}
+				.describe-view {
+					display: flex;
+
+					align-items: center;
+					color: #333;
+					font-size: 24px;
+					.price {
+						font-weight: bold;
+						font-size: 36px;
+					}
+				}
+			}
+        }
+        .price-detail {
+            margin-top: 20px;
+            margin-bottom: 20px;
+        }
+        .detail-price_box {
+            color: #333333;
+            font-size: 22px;
+            text-align: right;
+            flex: 1;
+            font-weight: 600;
+            &.red {
+                color: #FF2842;
+            }
+        }
+        
+    }
+    .app-footer {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        & .admin-button-com {
+            padding:0;
+            margin-right: 15px;
+            width: 140px;
+            height: 70px;
+            line-height: 70px;
+            text-align: center;
+        }
+        }
 </style>

ghs/src/pagesOrder/ship.vue

@@ -0,0 +1,105 @@
+<template>
+	<view class="app-content">
+		<view class="order-info_box">
+			<view class="order-info-list">
+				<view class="list-item">
+					<text>订单号</text>
+					<text>2929323</text>
+				</view>
+				<view class="list-item">
+					<text>下单时间</text>
+					<text>{{orderInfo.addTime}}</text>
+				</view>
+				<!-- <view class="list-item">
+					<text>商品名称</text>
+					<text>{{2929323}}</text>
+				</view> -->
+				<view class="list-item">
+					<text>金额</text>
+					<text>{{orderInfo.actPrice}}</text>
+				</view>
+			</view>
+			<image
+				src="/static/images/default-img.png" mode="scaleToFill">
+			</image>
+		</view>
+	</view>
+</template>
+
+<script>
+
+
+import { getDetB, orderSendDet } from '@/api/order'
+export default {
+	name: 'admin-ship',
+	components: {
+
+	},
+	data() {
+		return {
+			orderInfo: {},
+			orderComData: []
+		}
+	},
+	onLoad() {
+		// uni.showLoading({
+		// 	title: '加载中...',
+		// 	mask: true
+		// })
+		// this.init()
+	},
+	onShow(){
+		// this.init()
+	},
+	methods: {
+		init() {
+			this.showIndex = this.option.pageStatus || 0
+			this._getDet()
+			this._orderComDet()
+
+		},
+		_getDet() {
+			// this.option.id
+			return getDetB({ id: 78 }).then(res => {
+				this.orderInfo = res.data
+			})
+		},
+		_orderComDet() {
+			orderSendDet({ id: this.option.id }).then(res => {
+				this.orderComData = res.data
+			})
+		},
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+	.app-content {
+		// background-color: #fff;
+	}
+	.order-info_box {
+		display: flex;
+		padding: 30px;
+		background-color: #FFFFFF;
+		align-items: center;
+		& .order-info-list {
+			flex: 1;
+			& .list-item {
+				font-size: 28px;
+				font-weight: 400;
+				& > text:nth-child(1) {
+					color: #666666;
+					display: inline-block;
+					width: 140px;
+				}
+				& > text:nth-child(1) {
+					color: #333333;
+				}
+			}
+		}
+		& image {
+			width: 146px;
+			height: 146px;
+		}
+	}
+</style>