点击优化

ghsApp/src/admin/home/components/OrderItem.vue

@@ -1,6 +1,6 @@
 <template>
-    <view  @click="pageTo({url:'/pagesOrder/detail',query: {id: item.id}})">
-        <view class="order-top_box" style="position:relative;">
+    <view>
+        <view class="order-top_box" style="position:relative;" @click="pageTo({url:'/pagesOrder/detail',query: {id: item.id}})">
 
         <image style="width:105upx;position:absolute;top:80upx;right:12upx;" v-if="currentStatus == 1 && item.book == 0"
         @click.stop="pageTo({url:'/admin/billing/toPay',query: {orderId:item.id,orderSn:item.orderSn,actPrice:item.actPrice}})"
@@ -69,8 +69,8 @@
           本客户共有{{item.sameTimeIdsNum}}个订单，可合并发货
         </view>
         </view>
-        <div class="list-bottom">
-            <div class="list-button">
+        <view class="list-bottom">
+            <view class="list-button">
                 <view><button @click.stop="shareOrder(item)" open-type="share" class="admin-button-com bule">分享</button> </view>
                 <block v-if="currentStatus == 2">
                   <block v-if="item.book == 0">
@@ -82,17 +82,30 @@
                   </block>
                 </block>
                 <block v-else>
-                <view><button disabled="true" class="admin-button-com bule active">发货</button> </view>
-                <view><button disabled="true" class="admin-button-com bule active">填单发货</button> </view>
+                  <view><button disabled="true" class="admin-button-com bule active">发货</button> </view>
+                  <view><button disabled="true" class="admin-button-com bule active">填单发货</button> </view>
                 </block>
                 <view v-if="currentStatus == 1">
                   <button disabled="true" class="admin-button-com bule active">打印(${item.printNum})</button>
                 </view>
                 <view v-else>
-                  <button @click.stop="printOrder(item)" class="admin-button-com bule">打印<text v-if="Number(item.printNum)>0">({{item.printNum}})</text></button>
+                  <button @click.stop="printOrder(item)" class="admin-button-com bule">打印<text>({{item.printNum}})</text></button>
                 </view>
-            </div>
-        </div>
+                <view>
+                  <button @click.stop="openMore(item)" class="admin-button-com bule">更多</button>
+                </view>
+            </view>
+        </view>
+
+    <!-- 更多弹窗 -->
+    <uni-popup ref="morePopup" background-color="#fff" type="center" :animation="true" class="class-popup-style">
+      <view style="display:flex;flex-direction:column;padding:30upx 40upx;min-width:300upx;">
+        <button class="admin-button-com" style="margin-bottom:20upx;" @click="moreAction('操作1')">操作1</button>
+        <button class="admin-button-com" style="margin-bottom:20upx;" @click="moreAction('操作2')">操作2</button>
+        <button class="admin-button-com" @click="closeMore">取消</button>
+      </view>
+    </uni-popup>
+
     </view>
 </template>
 <script>
@@ -127,7 +140,7 @@ export default {
 			this.$emit('directFh', info)
     },
     confirmFh(info){
-      this.$util.pageTo({url: "/pagesOrder/arrival?id="+info.id})
+      this.$util.pageTo({url: "/pagesOrder/arrival?id="+info.id})
     },
     fillNoFh(info){
 			this.$emit('fillNoFh', info)
@@ -141,12 +154,25 @@ export default {
       }else{
         that.$emit('printOrder', item)
       }
-		}
+		},
+    openMore(item) {
+      this.$refs.morePopup.open('top');
+    },
+    closeMore() {
+      this.$refs.morePopup.close();
+    },
+    moreAction(action) {
+      this.$msg('你点击了：' + action);
+      this.closeMore();
+    },
 	}
 };
 </script>
 
 <style lang="scss" scoped>
+.class-popup-style{
+	z-index:999999;
+}
 .admin-button-com {
   width: 140upx;
   height: 60upx;
@@ -169,11 +195,22 @@ export default {
 }
 .list-bottom {
     & > div {
-        @include disFlex(center, flex-end);
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
     }
     .list-button {
+        width: 100%;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-around;
+        align-items: center;
         .admin-button-com {
-            margin-left: 20upx;
+            margin: 0 6upx 12upx 6upx;
+            min-width: 90upx;
+            max-width: 140upx;
+            flex: none;
+            box-sizing: border-box;
         }
     }
 }