标签化

ghsPad/src/admin/home/components/shopTypeSelect.vue → ghsPad/src/admin/home/components/rightItemArea.vue

@@ -4,7 +4,7 @@
             <view v-for="item in shopListType" :key="item.id" :class="[selectTypeId===item.id?'active':'']" @click="changeType(item)" > {{item.name}} </view>
         </view>
         <view class="shop-show_box">
-            <view @click="selectItemChange(item)" v-for="item in currenTypeShopList" :key="item.id" class="show-shop_box">
+            <view @click="kdSelectItem(item)" v-for="item in currenTypeShopList" :key="item.id" class="show-shop_box">
                 <image class="img" :src="item.cover" mode="scaleToFill" ></image>
                 <view class="shop-info_price">
                     <view>
@@ -19,15 +19,13 @@
 </template>
 <script>
 import uniPopup from '@/components/uni-popup'
-import selectSettle from './select-settle.vue'
-import keyboardSetFlower from '@/components/app-boardSet-flower.vue'
+import settlePop from './settle-pop.vue'
 import { showClass,showList } from '@/api/home/index'
 export default {
     name:'shopTypeSelect',
     components:{
         uniPopup,
-        selectSettle,
-        keyboardSetFlower
+        settlePop
     },
     data(){
         return {
@@ -75,8 +73,8 @@ export default {
             this.selectTypeId = item.id
             this.updateCurrentShop()
         },
-        selectItemChange(item){
-            this.$emit('selectItemChange',item)
+        kdSelectItem(item){
+            this.$emit('kdSelectItem',item)
         },
         settle(){
             this.isShowSettle = true

ghsPad/src/admin/home/workbench.vue

@@ -3,11 +3,11 @@
 		<view class="nav-left">
 			<view class="item-list"> 收银 </view>
 		</view>
-		<view class="shopList-box">
+		<view class="itemList-box">
 			<view class="title">商品列表</view>
-			<view class="shopList-item_box">
-				<view v-for="item in shopList" :key="item.id" @click="selectCurrentActive(item)" class="shop-item_box">
-					<view :class="[ 'shop-body_box', selectCurrentActiveItem.id===item.id?'active':'not-active']">
+			<view class="itemList-item_box">
+				<view v-for="item in itemList" :key="item.id" @click="selectCurrentActive(item)" class="show-item_box">
+					<view :class="[ 'item-body_box', selectCurrentActiveItem.id===item.id?'active':'not-active']">
 						<view class="flower-name_box">
 							<view class="name">
 								{{item.name}}
@@ -21,7 +21,7 @@
 					</view>
 				</view>
 			</view>
-			<view class="shopList-footer_box">
+			<view class="itemList-footer_box">
 				<view> 数量
 					<text style="margin-left:5upx;">
 						<text v-if="Number(totalShop.bigUnit)>0">{{totalShop.bigUnit}}扎</text>
@@ -39,20 +39,25 @@
 			<view @click="breakage"> 报损 </view>
 			<view @click="settle"> 结算 </view>
 		</view>
-		<view class="shop-list">
-			<shopTypeSelect @selectItemChange="selectItemChange"> </shopTypeSelect>
+		<!-- 分类和花材展示区 -->
+		<view class="item-show-list">
+			<rightItemArea @kdSelectItem="kdSelectItem"> </rightItemArea>
 		</view>
+		<!-- 选客户 -->
 		<uniPopup :show.sync="isShowUser" type="top" maxHeight="90vh" >
 			<selectUser @selectUser="selectUserReturn"> </selectUser>
 		</uniPopup>
+		<!-- 开单选商品输入数量和金额 -->
 		<uniPopup :show.sync="isShowFllowNum" type="top" maxHeight="90vh">
-			<keyboardSetFlower @enterNum="enterReturn" :selectItem.sync="selectItem"></keyboardSetFlower>
+			<kdSelectNumPrice @enterNum="enterReturn" :selectItem.sync="selectItem"></kdSelectNumPrice>
 		</uniPopup>
+		<!-- 结算弹框 -->
 		<uniPopup :show.sync="isShowSettle" type="top" maxHeight="90vh" >
-			<selectSettle @settleReturn="settleReturn" ref="selectSettle" :totalShop="totalShop"></selectSettle>
+			<settlePop @settleReturn="settleReturn" ref="settlePop" :totalShop="totalShop"></settlePop>
 		</uniPopup>
-		<uniPopup :show.sync="isShowCollectMoney" type="top" maxHeight="90vh" >
-			<collectMoney @cancel="isShowCollectMoney=false" @collectMoneyBack="collectMoneyBack"></collectMoney>
+		<!-- 选择支付方式 -->
+		<uniPopup :show.sync="isShowselectPayWay" type="top" maxHeight="90vh" >
+			<selectPayWay @cancel="isShowselectPayWay=false" @selectPayWayBack="selectPayWayBack"></selectPayWay>
 		</uniPopup>
 		<NotLogin></NotLogin>
 	</view>
@@ -63,11 +68,11 @@ import NotLogin from "@/components/not-login";
 import productMins from "@/mixins/product";
 import autoUpdateMixins from "@/mixins/autoUpdate";
 import uniPopup from '@/components/uni-popup'
-import keyboardSetFlower from '@/components/app-boardSet-flower.vue'
-import selectSettle from './components/select-settle.vue'
+import kdSelectNumPrice from '@/components/app-kd-select-num-price.vue'
+import settlePop from './components/settle-pop.vue'
 import selectUser from './components/select-user.vue'
-import shopTypeSelect from './components/shopTypeSelect.vue'
-import collectMoney from '@/components/collect-money.vue'
+import rightItemArea from './components/rightItemArea.vue'
+import selectPayWay from '@/components/select-pay-way.vue'
 import { createCreateOrder, wastageCreateOrder } from '@/api/home/index'
 export default {
 	name: "workbench",
@@ -75,10 +80,10 @@ export default {
 		NotLogin,
 		uniPopup,
 		selectUser,
-		shopTypeSelect,
-		keyboardSetFlower,
-		selectSettle,
-		collectMoney
+		rightItemArea,
+		kdSelectNumPrice,
+		settlePop,
+		selectPayWay
 		},
 	mixins: [productMins,autoUpdateMixins],
 	data() {
@@ -86,8 +91,8 @@ export default {
 			isShowFllowNum: false,
 			isShowUser: false,
 			isShowSettle: false,
-			isShowCollectMoney: false,
-			shopList:[],
+			isShowselectPayWay: false,
+			itemList:[],
 			currenSelectShop:{},
 			selectItem: {},
 			selectCurrentActiveItem:{},
@@ -114,11 +119,11 @@ export default {
 	mounted(){
 	},
 	watch:{
-		shopList(){
-			if(this.$util.isEmpty(this.shopList)) {
+		itemList(){
+			if(this.$util.isEmpty(this.itemList)) {
 				this.totalShop = { bigUnit: 0, smallUnit:0, totalPrice: 0 }
 			}
-			this.totalShop =	this.shopList.reduce((total,val)=>{
+			this.totalShop =	this.itemList.reduce((total,val)=>{
 				if(val.unitType === 0) {
 					total.bigUnit = total.bigUnit + (val.currentNum *1)
 				}else {
@@ -133,8 +138,8 @@ export default {
 		//结算创建订单
 		async setCreateOrder(){
 			try {
-				let arr = this.shopList.map(i=>({ productId:i.id, unitType: i.unitType, num: i.currentNum, property: i.property, unitPrice: i.currentUnitPrice }))
-				const {settleId,payId,payUserId,isPrint,proceeds,freight} = this.$refs.selectSettle
+				let arr = this.itemList.map(i=>({ productId:i.id, unitType: i.unitType, num: i.currentNum, property: i.property, unitPrice: i.currentUnitPrice }))
+				const {settleId,payId,payUserId,isPrint,proceeds,freight} = this.$refs.settlePop
 				await createCreateOrder({
 					customId: this.selectItemUser.id,
 					product: JSON.stringify(arr),
@@ -148,7 +153,7 @@ export default {
 					remark:''
 				})
 				this.isShowSettle = false
-				this.isShowCollectMoney = true
+				this.isShowselectPayWay = true
 				this.$msg('订单创建成功')
 			}catch(err) {
 				console.log(err)
@@ -170,14 +175,14 @@ export default {
 			this.isShowUser = true
 		},
 		breakage(){
-			if(this.$util.isEmpty(this.shopList)) {
+			if(this.$util.isEmpty(this.itemList)) {
 				this.$msg('请选择报损商品')
 				return false
 			}
 			this.$util.confirmModal({content:'确定报损吗？'},
 			async() => {
 				try {
-					let arr = this.shopList.map(i=>({
+					let arr = this.itemList.map(i=>({
 						productId:i.id,
 						unitType: i.unitType,
 						num: i.currentNum
@@ -193,7 +198,7 @@ export default {
 			})
 		},
 		settle(){
-			if(this.$util.isEmpty(this.shopList)) {
+			if(this.$util.isEmpty(this.itemList)) {
 				this.$msg('请选择结算商品')
 				return false
 			}
@@ -211,7 +216,7 @@ export default {
 				content: '确认清空？',
 				success: function (res) {
 				if (res.confirm) {
-					self.shopList = []
+					self.itemList = []
 				}
 				}
 			})
@@ -241,15 +246,15 @@ export default {
 				content: '确认删除？',
 				success: function (res) {
 					if (res.confirm) {
-						let index =	self.shopList.findIndex(i=>self.selectCurrentActiveItem.id === i.id)
-						self.shopList = self.shopList.filter(i=>self.selectCurrentActiveItem.id !== i.id)
+						let index =	self.itemList.findIndex(i=>self.selectCurrentActiveItem.id === i.id)
+						self.itemList = self.itemList.filter(i=>self.selectCurrentActiveItem.id !== i.id)
 					}
 				}
 			})
 
 		},
-		selectItemChange(item){
-			let obj	=	this.shopList.find(i=>i.id===item.id)
+		kdSelectItem(item){
+			let obj	=	this.itemList.find(i=>i.id===item.id)
 			if(this.$util.isEmpty(obj)) {
 				this.selectItem = {
 					...item,
@@ -265,16 +270,16 @@ export default {
 		},
 		enterReturn(item){
 			this.isShowFllowNum = false
-		 	let index =	this.shopList.findIndex(i=>i.id===item.id)
+		 	let index =	this.itemList.findIndex(i=>i.id===item.id)
 			console.log(1111,index)
 			console.log(item)
 			if(index >= 0) {
-				this.shopList.splice(index,1,item)
+				this.itemList.splice(index,1,item)
 			}else{
-				this.shopList.push(item)
+				this.itemList.push(item)
 			}
 		},
-		collectMoneyBack(price){
+		selectPayWayBack(price){
 			console.log(price)
 		}
 	}
@@ -284,10 +289,10 @@ export default {
 .app-workbench_box {
 	display: flex;
 	height: 100vh;
-	& .shop-list {
+	& .item-show-list {
 		flex: 63;
 		height: 100%;
-		& .shop-footer_box {
+		& .show-footer_box {
 			height: 40upx;
 			display: flex;
 			background:red;
@@ -327,7 +332,7 @@ export default {
 			color: #FFFFFF;
 		}
 	}
-	& .shopList-box {
+	& .itemList-box {
 			flex: 25;
 		height: 100%;
 		display: flex;
@@ -338,13 +343,13 @@ export default {
 			background-color: rgba(72, 91, 107, 1);
 			color: #FFFFFF;
 		}
-		& .shopList-item_box {
+		& .itemList-item_box {
 			overflow-y: auto;
 			flex: 1;
 			border: 1px solid #eee;
-			& .shop-item_box {
+			& .show-item_box {
 				padding: 5upx;
-				& .shop-body_box {
+				& .item-body_box {
 					border-radius: 3upx;
 					padding: 5upx;
 					font-size: 14upx;
@@ -370,7 +375,7 @@ export default {
 				}
 			}
 		}
-		& .shopList-footer_box {
+		& .itemList-footer_box {
 			height: 20upx;
 			border: 1px solid #eee;
 			font-size: 10upx;

ghsPad/src/components/collect-money.vue → ghsPad/src/components/select-pay-way.vue

@@ -6,29 +6,18 @@
                 <input  disabled type="text" v-model="price">
             </view>
             <view class="keyboard-body_box">
-                <VKeyboard
-                    ref="keyboard"
-                    :digital="true"
-                    :disorderly="false"
-                    @typing="typing"
-                    @enter="enter">
-                </VKeyboard>
+                <VKeyboard ref="keyboard" :digital="true" :disorderly="false" @typing="typing" @enter="enter"> </VKeyboard>
             </view>
         </template>
         <template v-else>
             <view class="collect-code_box">
-                <image
-                    class="img"
-                    src="../static/images/common/business-sale.png"
-                    mode="scaleToFill"
-                />
+                <image class="img" src="../static/images/common/business-sale.png" mode="scaleToFill" />
                 <view class="btn-default result">查询结果</view>
                 <view @click="cancel" class="btn-default">取消</view>
             </view>
         </template>
     </view>
 </template>
-
 <script>
     import VKeyboard from '@/components/plugin/vKeyboard/VKeyboard.vue'
     export default {
@@ -39,7 +28,7 @@
         props:{
             step:{
                 type:Number,
-                default: 1  // 0 金额 // 付款码
+                default: 1
             }
         },
         data(){
@@ -89,57 +78,57 @@
 </script>
 
 <style lang="scss" scoped>
-    .app-collect_money {
-        background-color: #ffffff;
-        margin: 0 auto;
-        border-radius: 5upx;
-        padding: 10upx;
-        // overflow: hidden;
-        overflow-y: auto;
+.app-collect_money {
+    background-color: #ffffff;
+    margin: 0 auto;
+    border-radius: 5upx;
+    padding: 10upx;
+    // overflow: hidden;
+    overflow-y: auto;
+    display: flex;
+    height: 90vh;
+    flex-direction: column;
+    box-sizing: border-box;
+    & .price-box {
+        min-height: 100upx;
+        & > .title {
+            text-align: center;
+            font-size: 14upx;
+            padding: 5upx 0;
+            
+        }
+        & > input {
+            text-align: center;
+            line-height: 40upx;
+            height: 40upx;
+            font-size: 14upx;
+        }
+    }
+    & .keyboard-body_box {
+        flex: 1;
+    }
+    & .collect-code_box {
+        height: 100%;
         display: flex;
-        height: 90vh;
+        align-items: center;
+        justify-content: center;
         flex-direction: column;
-        box-sizing: border-box;
-        & .price-box {
-            min-height: 100upx;
-            & > .title {
-                text-align: center;
-                font-size: 14upx;
-                padding: 5upx 0;
-                
-            }
-            & > input {
-                text-align: center;
-                line-height: 40upx;
-                height: 40upx;
-                font-size: 14upx;
-            }
+        & > .img {
+            width: 100upx;
+            height: 100upx;
         }
-        & .keyboard-body_box {
-            flex: 1;
+        & .btn-default {
+            height: 40upx;
+            width: 100upx;
+            text-align: center;
+            line-height: 40upx;
+            border: 1px solid #eee;
+            font-size: 14upx;
+            color: #333333;
         }
-        & .collect-code_box {
-            height: 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            flex-direction: column;
-            & > .img {
-                width: 100upx;
-                height: 100upx;
-            }
-            & .btn-default {
-                height: 40upx;
-                width: 100upx;
-                text-align: center;
-                line-height: 40upx;
-                border: 1px solid #eee;
-                font-size: 14upx;
-                color: #333333;
-            }
-            & > .result {
-                margin: 30upx 0;
-            }
+        & > .result {
+            margin: 30upx 0;
         }
     }
+}
 </style>