花材列表页

ghsApp/src/admin/billing/index2.vue

@@ -0,0 +1,401 @@
+<template>
+<view class="app-content">
+	<view class="billing_box_bg">
+		<view class="input-wrap" >
+			<view style="padding:0upx 0upx 0upx 0upx;margin-right:10upx;" >
+				<button class="admin-button-com middle blue" @click="selectFlowerNumFn()">图片分类</button>
+			</view>
+			<view class="search-bar">
+				<app-search-module v-model="py" placeholder="输入拼音首字母搜索" @input="searchFn" />
+			</view>
+			<view style="float:right;">
+				<button class="admin-button-com middle blue" @click="removeFromSave(option.customId)">清除花材</button>
+			</view>
+		</view>
+
+		<view class="scroll-middle_bx">
+			<scroll-view scroll-y scroll-with-animation class="tab-view">
+				<!--分类-->
+				<div v-for="(item, index) in globalClassData" :key="index" class="tab-bar-item" :class="classIndex == index ? 'active' : ''" :data-current="index" @tap.stop="switchClassTab(index,item)">
+					<text style="text-align: center;">{{ item.name || "" }}</text>
+				</div>
+				<view style="height: 120upx"></view>
+			</scroll-view>
+			<scroll-view scroll-y class="right-box" :scroll-into-view="scroll_into_view" scroll-with-animation="true" @scroll="scroll_detail" lower-threshold="100" @scrolltolower="scrollBottom">
+				<!--花材列表-->
+				<block v-if="!$util.isEmpty(globalItemData)">
+					<view class="item_list_bx selectAll">
+						<view class="item_list_title"></view>
+						<view v-if="!$util.isEmpty(globalItemData)">
+							<template v-for="(productItem, productIndex) in globalItemData">
+								<view style="height: 175upx" :key="productIndex">
+									<Commondity
+										:checkStock="true"
+										:selectJobType="selectJobType"
+										:info="productItem"
+										@showAddModelFn="showAddModelFn"
+										@replaceItemFn="replaceItemFn"
+										@goToSpecialVariety="goToSpecialVariety"
+										@delProduct="delProduct"
+									></Commondity>
+								</view>
+							</template>
+						</view>
+						<view v-else>
+							<view style="height:260upx;text-align:center;color:#CCCCCC;position: relative;">
+								<view style="position: absolute;margin:auto;top:130upx;left:0;right:0;bottom:0;">暂无花材</view>
+							</view>
+						</view>
+					</view>
+				</block>
+				<block v-else>
+					<app-wrapper-empty title="加载中" :is-empty="$util.isEmpty(globalClassItemList)" />
+				</block>
+			</scroll-view>
+
+		</view>
+
+		<modal-module :show="isAddModel" @cancel="addItemModelHidden" @click="confirmAddItemModel" :title="customData.name" color="#333" :size="32" padding="30rpx 30rpx" >
+			<template slot="customContent">
+				<view class="select-cmd_bx" v-if="customData">
+					<view class="kc">
+						<text class="unit_price">库存 {{ parseFloat(customData.stock) }}</text>
+						<text class="unit_price"> ¥{{ parseFloat(customData.price) }}</text>
+						<text>{{customData.ratio}}{{customData.smallUnit}}/{{customData.bigUnit}}</text>
+					</view>
+					<view class="num_bx">
+						<input style="width: 280upx" v-model="customData.userPrice" @focus="customData.userPrice = null" 
+						:disabled="false" type="digit" placeholder="单价" />
+						<text style="font-size:35upx;font-weight:bold;color:#666666;">元</text>
+					</view>
+					<view class="num_bx">
+						<!-- #ifdef APP-PLUS -->
+						<input style="width: 280upx" v-model="customData.bigCount" v-if="globalUnitType == 0" type="number" />
+						<text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 0">{{customData.bigUnit}}</text>
+						<input style="width: 280upx" v-model="customData.smallCount" v-if="globalUnitType == 1" type="number" />
+						<text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 1">{{customData.smallUnit}}</text>
+						<!-- #endif -->
+
+						<!-- #ifdef MP-WEIXIN -->
+						<input style="width: 280upx" v-model="customData.bigCount" v-if="globalUnitType == 0" :focus="isAddInputFocus" type="number" />
+						<text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 0">{{customData.bigUnit}}</text>
+						<input style="width: 280upx" v-model="customData.smallCount" v-if="globalUnitType == 1" :focus="isAddInputFocus" type="number" />
+						<text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 1">{{customData.smallUnit}}</text>
+						<!-- #endif -->
+
+						<image @click="switchGlobalUnitType" :src="`${constant.imgUrl}/icon/switch/switch128.png`" 
+						style="width:86upx;height:86upx;position:absolute;top:300upx;right:40upx;" mode="widthFix"></image>
+
+						<button class="admin-button-com mini-btn" @click="customData.userPrice=0.01;customData.bigCount=1" style="position:absolute;top:200upx;right:33upx;">赠送</button>
+
+					</view>
+				</view>
+			</template>
+		</modal-module>
+
+		<FooterCart :price="allPrice" :count="allCount" @confirm="confirmToSave" ></FooterCart>
+
+		<uni-popup ref="selectFlowerNumRef" background-color="#fff" type="center" :animation="false" class="class-popup-style">
+			<view style="display:flex;padding:20upx;height:auto;justify-content: space-between;align-items:center;flex-wrap:wrap;max-height:100vh;overflow:auto;">
+				<view v-for="(item, index) in globalClassData" :key="index" @tap.stop="changeClass(index,item)" style="margin-bottom:20upx;margin-left:3upx;">
+				<image :src="item.cover" style="width:120upx;height:120upx;border-radius:10upx;"></image>
+				<view style="margin-top:5upx;overflow: hidden;white-space: nowrap;width:120upx;text-align:center;">{{item.name}}</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</view>
+</template>
+
+<script>	
+import AppSearchModule from "@/components/module/app-search";
+import AppTabs from "@/components/plugin/tabs";
+import AppWrapperEmpty from "@/components/app-wrapper-empty";
+import Commondity from "@/components/module/app-commodity";
+import FooterCart from "@/components/module/app-footer-cart";
+import ModalModule from "@/components/plugin/modal";
+import { COMMODITY_TYPE } from "@/utils/declare";
+import productMins from "@/mixins/product";
+import { getClassRemind,hasClassRemind,getMenu } from "@/api/item-class";
+import { getItemList } from '@/api/item';
+import { delStatusUpdate } from '@/api/product';
+import { mapGetters } from "vuex";
+export default {
+	name: "index",
+	components: {
+		AppTabs,
+		AppSearchModule,
+		AppWrapperEmpty,
+		Commondity,
+		ModalModule,
+		FooterCart,
+	},
+	mixins: [productMins],
+	data() {
+		return {
+			COMMODITY_TYPE,
+			isSmallCount:false,
+			checkStock:true,
+			autoLoad: false,
+			xjData:{},
+			xjDataInfo:{},
+			globalClassData:[],
+			globalItemData:[],
+			finishGetItem:0,
+			currentClassId:0,
+			page:1,
+			py:'',
+			requestType:'kd'
+		};
+	},
+	computed: {
+		...mapGetters(["getLoginInfo"]),
+	},
+	onShow() {
+		if(this.xjData.hasUpdate == 1){
+
+			this.customData = this.xjDataInfo
+
+			if(this.xjData.cancel == 1){
+				this.customData.bigCount = 0
+				this.customData.smallCount = 0
+				this.replaceItemFn(this.customData,1)
+			}else{
+				this.customData.bigCount = this.xjData.stock
+				this.customData.smallCount = 0
+				this.customData.bigPrice = this.xjData.price
+				this.customData.price = this.xjData.price
+				this.customData.itemPrice = this.xjData.price
+				this.customData.userPrice = this.xjData.price
+				this.confirmAddItemModel(this.customData)
+			}
+		}
+		this.xjData = {}
+	},
+	onLoad () {
+		let that = this
+		if(this.option.customName){
+			uni.setNavigationBarTitle({ title: this.option.customName })
+		}
+		if (!this.$util.isEmpty(this.option.customId)){
+			this.selectJobId = this.option.customId
+		}
+		let book = this.option.book ? this.option.book : 0
+		this.requestType = book == 0 ? 'kd' : 'book'
+		getMenu().then(res=>{
+			if(res.code == 1){
+				that.globalClassData = res.data.class ? res.data.class : []
+				if(that.globalClassData[0]){
+					that.currentClassId = that.globalClassData[0].id
+					that.getProductList()
+				}
+			}
+		})
+	},
+	methods: {
+		scrollBottom(){
+            this.getProductList()
+        },
+        searchFn(){
+            if(!this.$util.isEmpty(this.py)){
+                this.search = this.py
+                this.page = 1
+                this.classIndex = -1
+                this.finishGetCp = 0
+                this.getProductList()
+            }else{
+                this.search = ''
+                this.page = 1
+                this.classIndex = 0
+                this.finishGetCp = 0
+                this.getProductList()
+            }
+        },
+        getProductList(){
+            if(this.finishGetItem == 1){
+                return false
+            }
+            let that = this
+			getItemList({classId:this.currentClassId,requestType:this.requestType,page:this.page,search:this.py}).then(res=>{
+				if(res.code == 1){
+					that.globalItemData = that.page == 1 ? res.data.list : that.globalItemData.concat(res.data.list)
+                    if(res.data.moreData == 1){
+                        that.page++
+                    }else{
+                        that.finishGetItem = 1
+                    }
+				}
+			})
+        },
+		switchClassTab(cur,item) {
+			this.classIndex = cur
+            this.page = 1
+            this.currentClassId = item.id
+            this.finishGetItem = 0
+            this.getProductList()
+		},
+		changeClass(index,item){
+			this.$refs.selectFlowerNumRef.close()
+			this.switchClassTab(index,item)
+		},
+		delProduct(info){
+			let that = this
+			that.$util.confirmModal({content:'确认删除?'},() => {
+				delStatusUpdate({id:info.id,delStatus:1}).then(res=>{
+					if(res.code == 1){
+						that.$msg('删除成功')
+					}
+				})
+			})
+		},
+		//小菊多颜色选择页
+		goToSpecialVariety(info){
+			this.xjDataInfo = info
+			if(info.stock <= 0){
+				uni.showToast({title:"没有库存",icon:"none"})
+			}else{
+				let userPrice = info.userPrice ? parseFloat(info.userPrice) : 0
+				let price = info.price ? parseFloat(info.price) : 0
+				this.$util.pageTo({url: "/admin/item/xj?stock="+info.stock+"&price="+price+"&customId="+this.option.customId+"&userPrice="+userPrice+"&productId="+info.id+"&ptItemId="+info.itemId})
+			}
+		},
+		selectFlowerNumFn(){
+			this.$refs.selectFlowerNumRef.open('top')
+		},
+		confirmToSave() {
+			if(this.$util.isEmpty(this.selectList)){
+				this.$msg('请选择花材')
+				return false
+			}
+			if (this.$util.isEmpty(this.option.customId)){
+				this.$msg("请选择客户")
+				return
+			}
+			let customName = this.option.customName ? this.option.customName : '';
+			let orderId = this.option.orderId  ? this.option.orderId : 0
+			let book = this.option.book ? this.option.book : 0
+			this.$util.pageTo({ url: '/admin/billing/affirm',type:2,query: {customId:this.option.customId,customName:customName,orderId:orderId,book:book}})
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.billing_box_bg {
+	background: white;
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	.input-wrap {
+		display: flex;
+		padding: 22upx 20upx 22upx 13upx;
+		.search-bar {
+			flex: 1;
+		}
+	}
+	.scroll-middle_bx {
+		flex: 1;
+		display: flex;
+		width: 100%;
+		height: 100%;
+		overflow: hidden;
+	}
+	.tab-view {
+		position: relative;
+		height: calc(100vh - 140upx);
+		width: 170upx;
+		flex-shrink: 0;
+		background-color: #f0f2f6;
+		.tab-bar-item {
+			position: relative;
+			width: 170upx;
+			height: 90upx;
+			box-sizing: border-box;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			font-size: 26upx;
+			color: #444;
+			font-weight: 400;
+			.tag {
+				display: flex;
+				padding: 0 20upx;
+				align-items: center;
+				position: absolute;
+				right: 0;
+				top: 0;
+				height: 32upx;
+				background: #ff2842;
+				border-radius: 16upx;
+				color: #fff;
+				font-size: 20upx;
+			}
+      &:last-child{
+        margin-bottom: 110upx;
+      }
+		}
+		.active {
+			position: relative;
+			color: $mainColor;
+			font-size: 26upx;
+			background: #fff;
+		}
+		.active::before {
+			content: "";
+			position: absolute;
+			border-left: 8upx solid $mainColor;
+			height: 100%;
+			left: 0;
+		}
+	}
+	.right-box {
+		height: calc(100vh - 140upx);
+		flex: 1;
+		box-sizing: border-box;
+	}
+	.item_list_bx {
+		padding: 40upx 16upx;
+		//padding: 0 16upx;
+    &:last-child{
+      margin-bottom: 70upx;
+    }
+	}
+	.item_list_title {
+		margin-bottom: 20upx;
+		font-size: 24upx;
+		font-weight: 600;
+		color: #666666;
+	}
+	.select-cmd_bx {
+		& .kc {
+			color: #999999;
+			font-size: 28upx;
+			font-weight: 400;
+			margin-bottom: 40upx;
+			text-align: center;
+			margin-top: 30upx;
+			.unit_price{
+				padding-right:25upx;
+			}
+		}
+		& .num_bx {
+			display: flex;
+			align-items: center;
+			margin-bottom: 40upx;
+			padding-left:110upx;
+			& > input {
+				width: 212upx;
+				height: 80upx;
+				border: 1upx solid #dddddd;
+				border-radius: 4upx;
+				text-align: center;
+				margin-right: 24upx;
+				font-size: 40upx;
+			}
+		}
+	}
+}
+.class-popup-style{
+	z-index:999999;
+}
+</style>

ghsApp/src/api/item-class/index.js

@@ -26,4 +26,8 @@ export const getAllItemClass = data => {
 
 export const delClass = data => {
 	return https.get('/item-class/delete', data)
+}
+
+export const getMenu = data => {
+	return https.get('/item-class/get-menu', data)
 }

ghsApp/src/api/item/index.js

@@ -1,6 +1,9 @@
 import https from '@/plugins/luch-request_0.0.7/request'
 
-//花材申请平台认证
+export const getItemList = data => {
+	return https.get('/item/get-item-list', data)
+}
+
 export const applyAuth = data => {
 	return https.get('/item/apply-auth', data)
 }