同步代码

pageProduct/add-Product/components/choose-coupon-category.vue

@@ -0,0 +1,177 @@
+<template>
+	<view class="mask u-fixed position-all u-flex u-col-bottom" v-if="show" @tap="close">
+		<view class="bg-fff w-full" @tap.stop="nullFunction">
+			<view class="u-p-30">
+				<view class="font-bold u-text-center u-font-32">选择团购券分类</view>
+				<view class="u-m-t-32 u-flex">
+					<view class="u-flex-1 u-p-r-16">
+						<view class="u-m-b-12">分类名称</view>
+						<uni-easyinput v-model="goods.query.name" placeholder="请输入团购券分类名称" />
+					</view>
+					<!-- <view class="u-flex-1 u-p-l-16">
+						<view class="u-m-b-12">商品分类</view>
+						<uni-data-picker :clear-icon="false" :map="{text:'name',value:'id'}" placeholder="请选择分类"
+							popup-title="请选择分类" :localdata="category" v-model="goods.query.categoryId">
+						</uni-data-picker>
+					</view> -->
+				</view>
+				
+				<view class="u-m-t-32 u-flex u-row-right">
+					<view class="u-flex-1 u-p-r-16">
+						<my-button type="cancel" plain @tap="resetQuery">重置</my-button>
+					</view>
+					<view class="u-flex-1 u-p-l-16">
+						<my-button @tap="getGoods">查询</my-button>
+					</view>
+				</view>
+			</view>
+
+			<scroll-view :scroll-x="false" scroll-y="true" :style="computedStyle()">
+				<view class="u-p-l-30 u-p-r-30">
+					<view class="u-flex u-row-between no-wrap">
+						<view>
+							<my-radio   @change="radioAllChange" v-model="goods.allChecked" shape="square" :size="20"></my-radio>
+						</view>
+						<view>名称</view>
+						<view>状态</view>
+					</view>
+					<view class="u-m-t-12 u-flex u-row-between" v-for="(item,index) in goods.list" :key="index">
+						<my-radio @change="radioChange" v-model="item.checked" shape="square" :size="20"></my-radio>
+						<view>
+							{{item.name}}
+						</view>
+						<view>
+							<my-switch v-model="item.status" disabled></my-switch>
+							 <!-- {{item.status}} -->
+						</view>
+					</view>
+				</view>
+			</scroll-view>
+			<view class="u-p-30">
+				<my-pagination :totalElements="goods.totalElements" :size="goods.query.size" @change="pageChange"></my-pagination>
+				<view class="u-m-t-20 u-flex">
+					<view class="u-flex-1 u-p-r-16">
+						<my-button type="cancel" plain @tap="close">取消</my-button>
+					</view>
+					<view class="u-flex-1 u-p-l-16">
+						<my-button @tap="confrim">确定</my-button>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import myButton from '@/components/my-components/my-button';
+	import myRadio from '@/components/my-components/my-radio';
+	import mySwitch from '@/components/my-components/my-switch';
+	import myPagination from '@/components/my-components/my-pagination'
+	import $coupon from '@/http/yskApi/couponCategory.js';
+	$coupon.get()
+	import {
+		reactive,
+		onMounted,
+		ref,
+		watch
+	} from 'vue';
+	const props = defineProps({
+		modelValue: {
+			type: Boolean,
+			default: false
+		},
+		height: {
+			type: [Number, String],
+			default: '40vh'
+		}
+	})
+
+	function nullFunction() {
+
+	}
+
+	const show = ref(props.modelValue)
+
+	function open(arr) {
+		show.value = true
+		if(arr){
+			for(let i in goods.list){
+				console.log(arr.includes(goods.list[i].id));
+				goods.list[i].checked=arr.includes(goods.list[i].id)
+			}
+		}
+		
+	}
+
+	function close() {
+		show.value = false
+	}
+
+	
+
+	function resetQuery() {
+		Object.assign(goods.query, $quey)
+	}
+
+	function computedStyle() {
+		return `height:${typeof props.height==='string'?props.height:props.height+'rpx'};`
+	}
+
+	const emits = defineEmits(['update:modelValue','confirm'])
+	
+	const $quey = {
+		name: '',
+		page: 0,
+		size: 10,
+	}
+	const query = reactive({
+		...$quey
+	})
+	const goods=reactive({
+		list:[],
+		allChecked:false,
+		totalElements:0,
+		query:{
+			...$quey
+		}
+	})
+	function getGoods() {
+		$coupon.get(goods.query).then(res=>{
+			goods.list=res.content.map(v=>{
+				return {...v,checked:false}
+			})
+			goods.allChecked=false
+			goods.totalElements=res.totalElements
+		})
+	}
+	getGoods()
+	
+	function pageChange(page){
+		goods.query.page=page-1
+		getGoods()
+	}
+	function radioChange(newval){
+		goods.allChecked=goods.list.filter(v=>v.checked).length!=0
+	}
+	function radioAllChange(newval){
+		goods.list.forEach(i=>{i.checked=newval})
+	}
+	function confrim(){
+		const arr= goods.list.filter(v=>v.checked)
+		console.log(arr);
+		emits('confirm',arr)
+	}
+	defineExpose({open,close})
+</script>
+
+<style lang="scss" scoped>
+	.mask {
+		background: rgba(51, 51, 51, 0.5);
+		z-index: 900;
+	}
+	.coverImg{
+		width: 60rpx;
+		height: 60rpx;
+		border-radius: 10rpx;
+	}
+</style>

pageProduct/add-Product/components/choose-danwei.vue

@@ -0,0 +1,163 @@
+<template>
+	<view class="u-relative choose-haocai">
+		<!-- <view class="input u-flex" @click="toggle" >
+			<up-input @blur="blur"   @change="filterHaocaiList" border="none" v-model="text" placeholder="请选择"></up-input>
+			<up-icon :size="10" name="arrow-down-fill"></up-icon>
+		</view> -->
+		<view class="input u-flex"  >
+			<view>{{text||''}}</view>
+			<!-- <up-input @blur="blur" disabled="true"  @change="filterHaocaiList" border="none" v-model="text" placeholder="请选择"></up-input> -->
+		</view>
+		<view class="u-absolute" v-if="popShow">
+			<scroll-view scroll-y="true" class="scroll">
+				<view class="item" v-for="(item,index) in $haocaiList" :key="index" @click="haocaiClick(item,index)">
+					{{item.name}}
+				</view>
+				<view class="item no-wrap" @click="toggle" v-if="text&&!$haocaiList.length">没有该单位</view>
+			</scroll-view>
+
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref,
+		watch,
+		onMounted
+	} from 'vue';
+	const props = defineProps({
+		listMap: {
+			type: Object,
+			default: () => {}
+		},
+		list: {
+			type: Array,
+			default: () => []
+		},
+		modelValue: {
+			type: [String, Number],
+			default: ''
+		},
+		show: {
+			type: Boolean,
+			default: false
+		},
+
+	})
+	let text = ref('')
+	
+	let popShow = ref(props.show)
+	const emits = defineEmits(['update:show', 'close', 'confirm', 'update:modelValue'])
+
+	function close() {
+		popShow.value = false
+	}
+
+	function confirm() {
+		popShow.value = false
+	}
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+		
+	})
+	watch(() => popShow.value, (newval) => {
+		console.log(newval);
+		emits('update:show', newval)
+	})
+	let $haocaiList = ref(props.list)
+	watch(() => props.list, (newval) => {
+		$haocaiList.value = newval
+		setText()
+	})
+	watch(() => props.modelValue, (newval) => {
+		console.log(newval);
+		setText()
+	})
+	
+	
+
+	function setText() {
+		// const item = props.listMap[props.modelValue]
+		// text.value = item ? item.name : ''
+		text.value=props.modelValue
+	}
+
+	function toggle(e) {
+		popShow.value = !popShow.value
+	}
+
+	function filterHaocaiList(e) {
+		if (e === '') {
+			return $haocaiList.value = props.list
+		}
+		const arr = props.list.filter(v => v.name.match(e))
+		$haocaiList.value = arr
+	}
+
+	function haocaiClick(item, index) {
+		console.log(item);
+		// if (item.id != props.modelValue) {
+		// 	emits('update:modelValue', item.id)
+		// }
+		if(item.name!=props.modelValue){
+				emits('update:modelValue', item.name)
+		}
+		popShow.value = false
+	}
+	
+	function focus(){
+		console.log('focus');
+		popShow.value = true
+	}
+	function blur() {
+		console.log('blur');
+		// setTimeout(()=>{
+		// 	popShow.value = false
+		// },100)
+	}
+	onMounted(() => {
+		setText()
+	})
+</script>
+
+<style lang="scss" scoped>
+	.choose-haocai {
+		.input {
+			width: 172rpx;
+			padding: 10rpx 16rpx;
+			height: 60rpx;
+			box-sizing: border-box;
+			background: #FFFFFF;
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			border: 2rpx solid #E5E5E5;
+			overflow: hidden;
+		}
+
+
+		.u-absolute {
+			top: calc(100% + 10rpx);
+			border: 1px solid #E5E5E5;
+			left: 0;
+			background-color: #fff;
+			z-index: 10;
+			right: 0;
+			border-radius: 8rpx;
+
+			.scroll {
+				$line-h: 60rpx;
+				max-height: calc($line-h * 4);
+
+				.item {
+					line-height: $line-h;
+					padding: 0 20rpx;
+				}
+			}
+
+		}
+	}
+</style>

pageProduct/add-Product/components/choose-goods.vue

@@ -0,0 +1,268 @@
+<template>
+	<view class="mask u-fixed position-all u-flex u-col-bottom u-font-28" v-if="show" @tap="close">
+		<view class="bg-fff w-full  " @tap.stop="nullFunction">
+			<view class="u-p-30">
+				<view class="font-bold u-text-center">选择商品</view>
+				<view class="u-m-t-32 u-flex">
+					<view class=" ">
+						<uni-data-picker :clear-icon="false" :map="{text:'name',value:'id'}" placeholder="请选择分类"
+							popup-title="请选择分类" :localdata="category" v-model="goods.query.categoryId">
+							<view class="u-flex  u-font-28" >
+								<text class=" u-line-1"
+									style="max-width: 100rpx;">{{goods.query.categoryId||'分类' }}</text>
+								<up-icon name="arrow-down" size="16"></up-icon>
+							</view>
+						</uni-data-picker>
+					</view>
+					<view class="u-flex-1 u-p-l-16">
+						<up-search @custom="getGoods" v-model="goods.query.name" placeholder="请输入商品名称" @search="getGoods" @clear="getGoods"></up-search>
+					</view>
+					
+				</view>
+
+			</view>
+
+			<scroll-view :scroll-x="false" scroll-y="true" :style="computedStyle()">
+				<view class="u-p-l-30 u-p-r-30 table">
+					<view class="u-flex u-row-between no-wrap title">
+						<view>
+							<my-radio @change="radioAllChange" v-model="goods.allChecked" shape="square"
+								:size="20"></my-radio>
+						</view>
+						<view>商品信息</view>
+						<view>规格</view>
+						<!-- <view>是否售尽</view> -->
+						<!-- <view>是否分销</view> -->
+						<view>售价</view>
+						<view>销量/库存</view>
+						<view>分类名称</view>
+					</view>
+					<view @click="changeChecked(item)" class="u-m-t-12 u-flex  u-p-24 u-row-between row" v-for="(item,index) in goods.list" :key="index">
+						<view class="">
+							<my-radio @change="radioChange($event,item)" v-model="item.checked" shape="square" :size="20"></my-radio>
+						</view>
+						<view class="u-text-left u-flex-1 u-p-l-20">
+							<!-- <view class="u-flex">
+								<image lazy-load class="coverImg" :src="item.coverImg" mode=""></image>
+							</view> -->
+							<view class="">{{item.name}}</view>
+						</view>
+						<view class="u-flex-1 u-p-l-4 u-p-r-4 box-size-border">
+							{{item.typeEnum}}
+						</view>
+						<view class="u-flex-1">
+							￥{{ item.lowPrice }}
+						</view>
+						<view class="u-flex-1">
+							<!-- {{ item.realSalesNumber }}/{{ item.stockNumber }} -->
+						{{ item.stockNumber }}
+						</view>
+						<view class="u-flex-1">
+							{{item.categoryName}}
+						</view>
+					</view>
+				</view>
+			</scroll-view>
+			<view class="u-p-30">
+				<my-pagination :totalElements="goods.totalElements" :size="goods.query.size"
+					@change="pageChange"></my-pagination>
+				<view class="u-m-t-20 u-flex">
+					<view class="u-flex-1 u-p-r-16">
+						<my-button type="cancel" plain @tap="close">取消</my-button>
+					</view>
+					<view class="u-flex-1 u-p-l-16">
+						<my-button @tap="confrim">确定</my-button>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		$tbProductList
+	} from '@/http/yskApi/goods.js';
+	import {
+		reactive,
+		onMounted,
+		ref,
+		watch
+	} from 'vue';
+	const props = defineProps({
+		modelValue: {
+			type: Boolean,
+			default: false
+		},
+		height: {
+			type: [Number, String],
+			default: '50vh'
+		},
+		category: {
+			type: Array,
+			default: () => {
+				return []
+			}
+		}
+	})
+	function changeChecked(item){
+		item.checked=!item.checked
+		if(!item.checked&&$selGoodsMap[item.id]){
+			delete $selGoodsMap[item.id]
+		}else{
+			$selGoodsMap[item.id]=item
+		}
+		goods.allChecked = goods.list.filter(v => v.checked).length != 0
+	}
+	function nullFunction() {
+
+	}
+
+	const show = ref(props.modelValue)
+	
+	let selArr=[]
+	
+	let $selGoodsMap={}
+	async function open(arr) {
+		show.value = true
+		selArr=arr
+		console.log(arr);
+		for(let i in arr){
+			$selGoodsMap[arr[i].proId
+]=arr[i]
+		}
+		getGoods()
+	}
+
+	function close() {
+		show.value = false
+		resetQuery()
+		$selGoodsMap={}
+	}
+
+
+
+	function resetQuery() {
+		Object.assign(goods.query, $quey)
+	}
+
+	function computedStyle() {
+		return `height:${typeof props.height==='string'?props.height:props.height+'rpx'};`
+	}
+
+	const emits = defineEmits(['update:modelValue', 'confirm'])
+
+	const $quey = {
+		categoryId: "",
+		createdAt: [],
+		id: "",
+		name: "",
+		sort: "createdAt,desc",
+		type: "",
+		page: 0,
+		size: 10,
+	}
+	const query = reactive({
+		...$quey
+	})
+	const goods = reactive({
+		list: [],
+		allChecked: false,
+		totalElements: 0,
+		query: {
+			...$quey
+		}
+	})
+	getGoods()
+	function getGoods() {
+		const arr=selArr
+		$tbProductList(goods.query).then(res => {
+			let selLen=0;
+			goods.list = res.content.map(v => {
+				const checked=$selGoodsMap[v.id]?true:false
+				selLen+=(checked?1:0)
+				return {
+					...v,
+					checked
+				}
+			})
+			goods.allChecked = selLen==res.content.length?true:false
+			goods.totalElements = res.totalElements
+		})
+	}
+
+	function pageChange(page) {
+		goods.query.page = page - 1
+		getGoods()
+	}
+
+	function radioChange(newval,item) {
+		if(!newval&&$selGoodsMap[item.id]){
+			delete $selGoodsMap[item.id]
+		}else{
+			$selGoodsMap[item.id]=item
+		}
+		goods.allChecked = goods.list.filter(v => v.checked).length != 0
+	}
+
+	function radioAllChange(newval) {
+		goods.list.forEach(i => {
+			i.checked = newval
+			if($selGoodsMap[i.id]&&!newval){
+				delete $selGoodsMap[i.id]
+			}else{
+				$selGoodsMap[i.id]=i
+			}
+		})
+	}
+	
+	function confrim() {
+		for(let i in goods.list){
+			const item=goods.list[i]
+			if($selGoodsMap[item.id]&&!item.checked){
+				delete $selGoodsMap[item.id]
+			}
+		}
+		console.log($selGoodsMap);
+		const arr = Object.values($selGoodsMap)
+		emits('confirm', arr)
+	}
+	defineExpose({
+		open,
+		close
+	})
+</script>
+
+<style lang="scss" scoped>
+	.bg-fff{
+		border-radius: 24rpx 24rpx 0 0 ;
+	}
+	.mask {
+		background: rgba(51, 51, 51, 0.5);
+		z-index: 900;
+	}
+	.box-size-border{
+		box-sizing: border-box;
+	}
+	.coverImg {
+		width: 60rpx;
+		height: 60rpx;
+		border-radius: 10rpx;
+	}
+	.table {
+		background: #F9F9F9;
+		border-radius: 8rpx;
+		overflow: hidden;
+	
+		.title {
+			padding: 12rpx 24rpx 12rpx 24rpx;
+			background: #AEBAD2;
+			border-radius: 8rpx 8rpx 0rpx 0rpx;
+			color: #fff;
+		}
+	
+		.row:nth-of-type(2n+1) {
+			background: #F0F0F0;
+		}
+	}
+</style>

pageProduct/add-Product/components/choose-guige.vue

@@ -0,0 +1,164 @@
+<template>
+	<view class="mask u-fixed position-all u-flex u-col-bottom u-font-28" v-if="show" @tap="close">
+		<view class="bg-fff w-full  " @tap.stop="nullFunction">
+			<view class="u-p-30">
+				<view class="font-bold u-text-center">选择规格</view>
+			</view>
+
+			<scroll-view :scroll-x="false" scroll-y="true" :style="computedStyle()">
+				<view class="u-p-l-30 u-p-r-30 ">
+					<view class="u-flex u-flex-wrap w-full gap-10  u-col-top">
+						<view class="skd" v-for="(item,index) in skuList" :key="index"
+						:class="{active:sel.id==item.id}"
+							@click="guigeClick(item,index)">
+							<text>{{item.specSnap||item.name}}</text>
+							<view class="tag-primary tag" v-if="item.isGrounding">上架中</view>
+							<view class="tag-gray tag" v-if="item.isPauseSale">已售罄</view>
+							<view class="tag-gray tag" v-if="!item.isGrounding">已下架</view>
+						</view>
+					</view>
+					
+				</view>
+			</scroll-view>
+			<view class="u-p-30">
+				<view class="u-m-t-20 u-flex">
+					<view class="u-flex-1 u-p-r-16">
+						<my-button type="cancel" plain @tap="close">取消</my-button>
+					</view>
+					<view class="u-flex-1 u-p-l-16">
+						<my-button @tap="confrim">确定</my-button>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		$tbProduct
+	} from '@/http/yskApi/goods.js';
+	import {
+		reactive,
+		onMounted,
+		ref,
+		watch
+	} from 'vue';
+	import infoBox from '@/commons/utils/infoBox.js'
+	const props = defineProps({
+		modelValue: {
+			type: Boolean,
+			default: false
+		}
+	})
+	let skuList=ref([])
+	function nullFunction() {
+
+	}
+
+	const show = ref(props.modelValue)
+	
+	
+	async function open(arr,sel) {
+		show.value = true
+		skuList.value=arr
+	}
+
+	function close() {
+		show.value = false
+		sel.value={}
+	}
+	
+	let sel=ref({
+		
+	})
+	function guigeClick(item,index){
+		if(sel.value.id==item.id){
+			return sel.value={}
+		}
+		sel.value=item
+	}
+
+	function computedStyle() {
+		return `height:${typeof props.height==='string'?props.height:props.height+'rpx'};`
+	}
+
+	const emits = defineEmits(['update:modelValue', 'confirm'])
+	
+	function confrim() {
+		if(!sel.value.id){
+			return infoBox.showToast('请选择选择一个规格')
+		}
+		emits('confirm', sel.value)
+		close()
+	}
+	defineExpose({
+		open,
+		close
+	})
+</script>
+
+<style lang="scss" scoped>
+	.bg-fff{
+		border-radius: 24rpx 24rpx 0 0 ;
+	}
+	.mask {
+		background: rgba(51, 51, 51, 0.5);
+		z-index: 900;
+	}
+	.skd {
+		padding: 10rpx 38rpx 8rpx 40rpx;
+		background: #F0F2F5;
+		border-radius: 4rpx;
+		position: relative;
+		color: #666;
+		overflow: hidden;
+		margin-bottom: 10rpx;
+		font-size: 24rpx;
+		border: 1px solid transparent;
+		&.active{
+			border-color: $my-main-color;
+		}
+		.tag {
+			position: absolute;
+			right: 0;
+			top: 0;
+			font-size: 12rpx;
+			height: 18rpx;
+			line-height: 18rpx;
+			right: 0;
+			border-radius: 0rpx 2rpx 2rpx 8rpx;
+		}
+	
+		.tag-primary {
+			background-color: $my-main-color;
+			color: #fff;
+		}
+	
+		.tag-gray {
+			background-color: rgb(144, 147, 153);
+			color: #fff;
+		}
+	}
+	.coverImg {
+		width: 60rpx;
+		height: 60rpx;
+		border-radius: 10rpx;
+	}
+	.table {
+		background: #F9F9F9;
+		border-radius: 8rpx;
+		overflow: hidden;
+	
+		.title {
+			padding: 12rpx 24rpx 12rpx 24rpx;
+			background: #AEBAD2;
+			border-radius: 8rpx 8rpx 0rpx 0rpx;
+			color: #fff;
+		}
+	
+		.row:nth-of-type(2n+1) {
+			background: #F0F0F0;
+		}
+	}
+</style>

pageProduct/add-Product/components/choose-haocai - 副本.vue

@@ -0,0 +1,57 @@
+<template>
+	<up-popup :round="10" :show="popShow" :closeable="true" @close="close">
+		<view class="u-text-center font-bold u-font-32 u-p-t-30">选择状态</view>
+		<view style="height: 20rpx;"></view>
+		<view class="u-p-30 all-list u-flex u-flex-wrap gap-20">
+			<view class="all-list-item" :class="{active:statusItemIndex==statusData.allListSel}" @click="changeAllListSel(statusItemIndex)" v-for="(statusItem,statusItemIndex) in statusData.allList" :key="statusItemIndex">
+				{{statusItem.label}}
+			</view>
+		</view>
+		<view class="u-flex u-p-t-30 u-p-b-30 u-p-l-20 u-p-r-20 gap-20">
+			<up-button @click="close">取消</up-button>
+			<up-button type="primary" @click="confirm">确定</up-button>
+		</view>
+	</up-popup>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue';
+	const props=defineProps({
+		show:{
+			type:Boolean,
+			default:false
+		}
+	})
+	
+	let popShow=ref(props.show)
+	const emits=defineEmits(['update:show','close','confirm'])
+	function close(){
+		popShow.value=false
+	}
+	function confirm(){
+		popShow.value=false
+	}
+	watch(()=>props.show,(newval)=>{
+		popShow.value=newval
+	})
+	watch(()=>popShow.value,(newval)=>{
+		emits('update:show',newval)
+	})
+</script>
+
+<style lang="scss" scoped>
+	.all-list-item{
+		text-align: center;
+		width: 156rpx;
+		white-space: nowrap;
+		color: #666;
+		padding: 10rpx 20rpx;
+		border-radius: 8rpx;
+		transition: all .2s ease-in-out;
+		border: 1px solid #eee;
+		&.active {
+			color: $my-main-color;
+			border-color: $my-main-color;
+		}
+	}
+</style>

pageProduct/add-Product/components/choose-haocai.vue

@@ -0,0 +1,149 @@
+<template>
+	<view class="u-relative choose-haocai">
+		<view class="input u-flex" @click="toggle">
+			<!-- <view>
+				<text v-if="modelValue">{{modelValue}}</text>
+				<text v-else class="color-666">请选择</text>
+			</view> -->
+			<up-input @blur="blur" @change="filterHaocaiList" border="none" v-model="text" placeholder="请选择"></up-input>
+			<up-icon :size="10" name="arrow-down-fill"></up-icon>
+		</view>
+		<view class="u-absolute" v-if="popShow">
+			<scroll-view scroll-y="true" class="scroll">
+				<view class="item" v-for="(item,index) in $haocaiList" :key="index" @click="haocaiClick(item,index)">
+					{{item.conName}}
+				</view>
+				<view class="item no-wrap" @click="toggle" v-if="text&&!$haocaiList.length">没有该耗材</view>
+			</scroll-view>
+
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref,
+		watch,
+		onMounted
+	} from 'vue';
+	const props = defineProps({
+		listMap: {
+			type: Object,
+			default: () => {}
+		},
+		list: {
+			type: Array,
+			default: () => []
+		},
+		modelValue: {
+			type: [String, Number],
+			default: ''
+		},
+		show: {
+			type: Boolean,
+			default: false
+		},
+
+	})
+	let text = ref('')
+	let popShow = ref(props.show)
+	const emits = defineEmits(['update:show', 'close', 'confirm', 'update:modelValue','change'])
+
+	function close() {
+		popShow.value = false
+	}
+
+	function confirm() {
+		popShow.value = false
+	}
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+	})
+	watch(() => popShow.value, (newval) => {
+		emits('update:show', newval)
+	})
+	let $haocaiList = ref(props.list)
+	watch(() => props.list, (newval) => {
+		$haocaiList.value = newval
+		setText()
+	})
+	watch(() => props.modelValue, (newval) => {
+		setText()
+	})
+
+	function setText() {
+		const item = props.listMap[props.modelValue]
+		text.value = item ? item.conName : ''
+	}
+
+	function toggle(e) {
+		popShow.value = !popShow.value
+	}
+
+	function filterHaocaiList(e) {
+		if (e === '') {
+			return $haocaiList.value = props.list
+		}
+		const arr = props.list.filter(v => v.conName.match(e))
+		$haocaiList.value = arr
+	}
+
+	function haocaiClick(item, index) {
+		console.log(item);
+		if (item.id != props.modelValue) {
+			emits('update:modelValue', item.id)
+			emits('change', item)
+		}
+		popShow.value = false
+	}
+
+	function blur() {
+		// setTimeout(()=>{
+		// 	popShow.value = false
+		// },100)
+	}
+	onMounted(() => {
+		setText()
+	})
+</script>
+
+<style lang="scss" scoped>
+	.choose-haocai {
+		.input {
+			width: 172rpx;
+			padding: 10rpx 16rpx;
+			height: 60rpx;
+			box-sizing: border-box;
+			background: #FFFFFF;
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			border: 2rpx solid #E5E5E5;
+			overflow: hidden;
+		}
+
+
+		.u-absolute {
+			top: calc(100% + 10rpx);
+			border: 1px solid #E5E5E5;
+			left: 0;
+			background-color: #fff;
+			z-index: 10;
+			right: 0;
+			border-radius: 8rpx;
+
+			.scroll {
+				$line-h: 60rpx;
+				max-height: calc($line-h * 4);
+
+				.item {
+					line-height: $line-h;
+					padding: 0 20rpx;
+				}
+			}
+
+		}
+	}
+</style>

pageProduct/add-Product/components/edit-haocai.vue

@@ -0,0 +1,440 @@
+<template>
+	<view>
+		<view class="default-box-padding bg-fff border-r-18">
+			<view class="u-flex u-row-between">
+				<view>商品名称</view>
+				<!-- <template v-if="isSku"> -->
+				<view class="u-flex u-font-24 color-666">
+					<view class="u-m-r-20">绑定至规格</view>
+					<view class="u-flex u-relative">
+						<up-switch :size="18" v-model="isBindGuige" :disabled="!isSku">绑定至规格</up-switch>
+						<view class="u-absolute position-all" style="z-index: 1;" v-if="!isSku"
+							@click="infoBox.showToast('该商品是单规格商品，只有多规格商品可绑定至规格',3)"></view>
+					</view>
+				</view>
+				<!-- </template> -->
+			</view>
+			<view class="border-bottom u-m-t-16 u-p-b-32">{{goods.name}}</view>
+			<view class="">
+				<template v-if="isBindGuige&&isSku">
+					<view class="list">
+						<view class="u-p-b-32 u-p-t-32 border-bottom" v-for="(sku,index) in skuList" :key="index">
+							<view>规格名称</view>
+							<view class="u-m-t-16">{{sku.specSnap}}</view>
+							<view class="color-666 u-m-t-24 u-flex">
+								<view class="xuhao">序号</view>
+								<view class="u-flex u-flex-1 u-p-l-32 gap-20">
+									<view class="u-flex-1">耗材名称</view>
+									<view class="u-flex-1">单位</view>
+									<view class="u-flex-1">用量</view>
+								</view>
+							</view>
+							<view class="u-m-t-32 color-666">
+								<view class="u-m-t-24" v-for="(item,haocaiIndex) in sku.haoCaiList" :key="haocaiIndex">
+									<view class="  u-flex">
+										<view class="xuhao">{{haocaiIndex+1}}</view>
+										<view class="u-flex u-flex-1 u-p-l-32 gap-20">
+											<view class="u-flex-1  ">
+												<choose-haocai @change="conInfosChange($event,item)"
+													:listMap="$haocaiMap" :list="haoCaiList"
+													v-model="item.conInfoId"></choose-haocai>
+											</view>
+											<view class="u-flex-1  ">
+												<choose-danwei :listMap="$danweiMap" :list="danweiList"
+													v-model="item.conUnit"></choose-danwei>
+											</view>
+											<view class="u-flex  input">
+												<up-input border="none" v-model="item.surplusStock"></up-input>
+												<up-icon @click="delGuigeHaocao(index,haocaiIndex)" color="#EA4025"
+													:size="16" name="minus-circle-fill"></up-icon>
+											</view>
+										</view>
+									</view>
+									<view class="u-flex u-m-t-16 color-666 u-font-24">
+										<view class="xuhao">
+										</view>
+										<view class="u-flex u-flex-1 u-p-l-32 gap-20">库存：{{item.stockNumber}}
+										</view>
+									</view>
+
+
+								</view>
+
+							</view>
+							<view class="u-flex">
+								<view class=" u-p-t-32 u-flex" @click="addGuigeHaocai(index)">
+									<up-icon :size="18" color="#318AFE" name="plus-circle-fill"></up-icon>
+									<view class="u-m-l-16">添加耗材</view>
+								</view>
+
+							</view>
+						</view>
+					</view>
+				</template>
+				<template v-else>
+					<view class="list">
+						<view class="u-p-b-32 u-p-t-32 border-bottom" v-for="(item,index) in conInfos" :key="index">
+							<view class="color-666  u-flex">
+								<view class="xuhao">序号</view>
+								<view class="u-flex u-flex-1 u-p-l-32 gap-20">
+									<view class="u-flex-1">耗材名称</view>
+									<view class="u-flex-1">单位</view>
+									<view class="u-flex-1">用量</view>
+								</view>
+							</view>
+							<view class="u-m-t-32 color-666">
+								<view class=" u-m-t-24 u-flex">
+									<view class="xuhao">{{index+1}}</view>
+									<view class="u-flex u-flex-1 u-p-l-32 gap-20">
+										<view class="u-flex-1  ">
+											<choose-haocai @change="conInfosChange($event,item)" :listMap="$haocaiMap"
+												:list="haoCaiList" v-model="item.conInfoId"></choose-haocai>
+											<!-- <view class="u-flex  input">
+												<view>{{item.conName}}</view>
+												<up-icon :size="10" name="arrow-down-fill"></up-icon>
+											</view> -->
+										</view>
+										<view class="u-flex-1  ">
+											<choose-danwei :listMap="$danweiMap" :list="danweiList"
+												v-model="item.conUnit"></choose-danwei>
+											<!-- <view class="u-flex  input">
+												<view>{{item.conUnit}}</view>
+												<up-icon :size="10" name="arrow-down-fill"></up-icon>
+											</view> -->
+										</view>
+										<view class="u-flex-1  ">
+											<view class="u-flex  input">
+												<up-input border="none" v-model="item.surplusStock"></up-input>
+												<up-icon @click="delHaocai(index)" color="#EA4025" :size="16"
+													name="minus-circle-fill"></up-icon>
+											</view>
+										</view>
+									</view>
+								</view>
+								<view class="u-flex u-m-t-16 u-font-24" v-if="item.stockNumber">
+									<view class="xuhao">
+
+									</view>
+									<view class="u-flex u-flex-1 u-p-l-32 gap-20">库存：{{item.stockNumber}}
+										{{item.conUnit}}
+									</view>
+								</view>
+							</view>
+
+						</view>
+					</view>
+				</template>
+				<template v-if="!isBindGuige">
+					<view class="u-flex">
+						<view class=" u-p-t-32 u-flex" @click="addHaocai">
+							<up-icon :size="18" color="#318AFE" name="plus-circle-fill"></up-icon>
+							<view class="u-m-l-16">添加耗材</view>
+						</view>
+
+					</view>
+				</template>
+
+			</view>
+		</view>
+		<view class="default-box-padding bg-fff border-r-18 u-flex u-row-between u-m-t-32">
+			<view>当某个耗材的使用库存不足时，商品自动
+				售罄。</view>
+			<!-- <view class="u-flex u-p-l-32">
+				<up-switch :size="20"></up-switch>
+			</view> -->
+		</view>
+		<view class="bottom">
+			<my-button type="primary" shape="circle" font-weight="700"  @click="save">保存</my-button>
+			<my-button bgColor="#F9F9F9" shape="circle" color="#999" @click="cancel">取消</my-button>
+		</view>
+
+	</view>
+
+</template>
+
+<script setup>
+	import {
+		ref,
+		reactive,
+		toRefs,
+		watch,
+		computed,
+		onMounted
+	}
+	from 'vue';
+	import {
+		getviewConSku,
+		gettbProductSpec,
+		gettbConsInfo,
+		posttbProskuCons,
+		puttbProskuCon,
+		deletetbProskuCon,
+	} from "@/http/yskApi/consumable.js";
+	import {
+		tbShopCurrencyGet,
+		$hasPermission
+	} from '@/http/yskApi/shop.js'
+
+	import infoBox from '@/commons/utils/infoBox.js'
+	import chooseHaocai from './choose-haocai.vue';
+	import chooseDanwei from './choose-danwei.vue';
+	import {
+		$tbProskuConV2
+	} from '@/http/yskApi/goods.js'
+	import {
+		cloneWith
+	} from 'lodash';
+
+	import {
+		hasPermission
+	} from '@/commons/utils/hasPermission.js';
+	const emits = defineEmits(['cancel', 'updateGoods'])
+
+	function cancel() {
+		emits('cancel')
+	}
+	const props = defineProps({
+		goods: {
+			type: Object,
+			default: () => {
+				return {
+					conInfos: [],
+					skuList: [],
+					typeEnum: ''
+				}
+			}
+		}
+	})
+
+	const conInfos = ref(props.goods.conInfos)
+	watch(() => props.goods.conInfos, (newval) => {
+		console.log(newval);
+		conInfos.value = newval
+	})
+
+	function conInfosChange(newval, item) {
+		console.log(newval);
+		item.stockNumber = newval.balance
+		item.conUnit = newval.conUnit
+	}
+
+	const skuList = ref(props.goods.skuList)
+	watch(() => props.goods.skuList, (newval) => {
+		console.log(newval);
+		skuList.value = newval
+	})
+
+
+	const $baseicHaocaiData = {
+		conInfoId: '',
+		conUnit: '',
+		surplusStock: ''
+	}
+
+	function addHaocai() {
+		conInfos.value.push({
+			...$baseicHaocaiData
+		})
+	}
+	const popup = reactive({
+		haocai: {
+			show: true
+		}
+	})
+
+	function addGuigeHaocai(index) {
+		if (skuList.value[index].haoCaiList) {
+			skuList.value[index].haoCaiList.push({
+				...$baseicHaocaiData
+			})
+		} else {
+			skuList.value[index].haoCaiList = [{
+				...$baseicHaocaiData
+			}]
+		}
+		console.log(skuList.value[index]);
+	}
+
+	function delHaocai(index) {
+		const item = conInfos.value[index]
+		console.log(item);
+		uni.showModal({
+			title: '提示',
+			content: '是否删除该耗材',
+			success(res) {
+				if (res.confirm) {
+					if (item.id) {
+						deletetbProskuCon([item.id]).then(res1 => {
+							conInfos.value.splice(index, 1)
+						})
+					} else {
+						conInfos.value.splice(index, 1)
+					}
+
+				}
+			}
+		})
+
+	}
+
+	function delGuigeHaocao(guigeIndex, haocaiIndex) {
+		const item = skuList.value[guigeIndex].haoCaiList[haocaiIndex]
+		console.log(item);
+		uni.showModal({
+			title: '提示',
+			content: '是否删除该耗材',
+			success(res) {
+				if (res.confirm) {
+					if (item && item.id) {
+						deletetbProskuCon([item.id]).then(res1 => {
+							skuList.value[guigeIndex].haoCaiList.splice(haocaiIndex, 1)
+						})
+					} else {
+						skuList.value[guigeIndex].haoCaiList.splice(haocaiIndex, 1)
+					}
+
+				}
+			}
+		})
+	}
+
+	// 是否是多规格商品
+	const isSku = computed(() => {
+		return props.goods.typeEnum == 'sku'
+	})
+	let isBindGuige = ref(false)
+	watch(() => props.goods.typeEnum, (newval) => {
+		if(!newval){
+			isBindGuige.value = false
+		}
+	})
+
+
+
+	async function save() {
+		const bol = await hasPermission('允许修改商品')
+		if (!bol) {
+			return
+		}
+		console.log('save');
+		let isPas = false
+		if (!isBindGuige.value) {
+			//绑定至商品
+			isPas = conInfos.value.every(v => {
+				return v.conInfoId && v.conUnit && v.surplusStock > 0
+			})
+		} else {
+			//绑定至规格
+			isPas = skuList.value.filter(v => v.haoCaiList && v.haoCaiList.length).every(sku => {
+				console.log(sku.haoCaiList);
+				return sku.haoCaiList.every(v => {
+					return v.conInfoId && v.conUnit && v.surplusStock > 0
+				})
+			})
+		}
+
+		if (!isPas) {
+			return infoBox.showToast('请填写全部耗材选项值')
+		}
+		let ajaxData = {
+			productId: props.goods.id,
+			cons: []
+		}
+		if (!isBindGuige.value) {
+			//绑定至商品
+			ajaxData.cons = conInfos.value.map(v => {
+				return {
+					id: v.id || '',
+					conInfoId: v.conInfoId,
+					productId: props.goods.id,
+					shopId: uni.getStorageSync('shopId'),
+					productSkuId: 0,
+					surplusStock: v.surplusStock * 1,
+					status: 1
+				}
+			})
+		} else {
+			for (let i in skuList.value) {
+				const haocaiList = skuList.value[i].haoCaiList || []
+				for (let k in haocaiList) {
+					const v = haocaiList[k]
+					ajaxData.cons.push({
+						id: v.id || '',
+						conInfoId: v.conInfoId,
+						productId: props.goods.id,
+						shopId: uni.getStorageSync('shopId'),
+						productSkuId: skuList.value[i].id,
+						surplusStock: v.surplusStock * 1,
+						status: 1
+					})
+				}
+			}
+
+		}
+		console.log(ajaxData);
+		await $tbProskuConV2(ajaxData)
+		emits('updateGoods')
+		infoBox.showToast('修改成功')
+	}
+
+	let haoCaiList = ref([])
+	let $haocaiMap = reactive({})
+	let danweiList = ref([])
+	let $danweiMap = reactive({})
+
+	function init() {
+		gettbConsInfo({
+			"status": 1,
+		}).then(res => {
+			for (let i in res.content) {
+				const item = res.content[i]
+				$haocaiMap[item.id] = item
+			}
+			haoCaiList.value = res.content
+		})
+		tbShopCurrencyGet({
+			page: 0,
+			size: 200
+		}).then(res => {
+			for (let i in res.content) {
+				const item = res.content[i]
+				$danweiMap[item.id] = item
+			}
+			danweiList.value = res.content
+		})
+	}
+	onMounted(() => {
+		init()
+		const firstItem= props.goods.conInfos[0]
+		isBindGuige.value=firstItem?(firstItem.productSkuId==0?false:true):false
+	})
+</script>
+
+<style lang="scss" scoped>
+	.bottom {
+		padding: 84rpx 82rpx;
+	}
+
+	.xuhao {
+		width: 52rpx;
+		white-space: nowrap;
+	}
+
+	.input {
+		width: 172rpx;
+		padding: 10rpx 16rpx;
+		height: 60rpx;
+		box-sizing: border-box;
+		background: #FFFFFF;
+		border-radius: 8rpx 8rpx 8rpx 8rpx;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		border: 2rpx solid #E5E5E5;
+		overflow: hidden;
+	}
+
+	.list .border-bottom:last-child {
+		border: none;
+	}
+</style>

pageProduct/add-Product/components/price-number-box.vue

@@ -0,0 +1,109 @@
+<template>
+	<view class="u-flex number-box">
+		<view class="u-flex u-flex-1">
+			<up-input @blur="priceFormat" border="none" v-model="number" :type="inputType" :placeholder="placeholder"></up-input>
+		</view>
+		<view class="u-flex u-flex-col right">
+			<view class="u-flex-1 u-p-l-8 u-p-r-8" @click="changeNumber('add')">
+				<up-icon name="arrow-up" color="#E5E5E5"></up-icon>
+			</view>
+			<view class="line"></view>
+			<view class="u-flex-1 u-p-l-8 u-p-r-8" @click="changeNumber('reduce')">
+				<up-icon name="arrow-down" color="#E5E5E5"></up-icon>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		formatPrice
+	} from "@/commons/utils/format.js";
+	import {
+		ref,
+		watch,nextTick
+	} from 'vue';
+	const props = defineProps({
+		inputType:{
+			type:String,
+			default:'digit'
+		},
+		modelValue: {
+			type: [String, Number]
+		},
+		min: {
+			type: Number,
+			default: 0
+		},
+		max: {
+			type: Number,
+			default: 999999999
+		},
+		step: {
+			type: Number,
+			default: 1
+		},
+		placeholder: {
+			type: String,
+			default: '请输入'
+		}
+	})
+	let number = ref(props.modelValue)
+
+	function changeNumber(type) {
+		const newval = number.value + props.step * (type == 'add' ? 1 : -1)
+		if (newval < props.min) {
+			number.value = props.min
+		}
+		if (newval > props.max) {
+			number.value = props.max
+		}
+		priceFormat(newval)
+	}
+
+	function priceFormat(e) {
+		nextTick(() => {
+			const min = props
+				.min;
+			const max = props.max;
+			if (e === '') {
+				return
+			}
+			const newval = formatPrice(e, min, max, true)
+			if (typeof newval !== 'number') {
+				number.value = newval.value
+				uni.showToast({
+					title: `请输入${min}到${max}范围内的数字`,
+					icon: 'none'
+				})
+			} else {
+				number.value = newval
+			}
+		})
+	}
+	watch(() => props.modelValue, (newval) => {
+		number.value = newval
+	})
+	const emits = defineEmits(['update:modelValue'])
+	watch(() => number.value, (newval) => {
+		emits('update:modelValue', newval)
+	})
+</script>
+
+<style lang="scss" scoped>
+	.line {
+		width: 100%;
+		height: 1px;
+		background-color: #E5E5E5;
+	}
+
+	.number-box {
+		border: 1px solid #E5E5E5;
+		border-radius: 8rpx 8rpx 8rpx 8rpx;
+		padding-left: 24rpx;
+
+		.right {
+			border-left: 1px solid #E5E5E5;
+		}
+	}
+</style>

pageProduct/add-Product/timer - 副本.vue

@@ -0,0 +1,224 @@
+<template>
+	<view class="u-p-30 min-page u-font-28">
+		<!-- <view class="u-flex">
+			<view style="width: 210rpx;">
+				<my-button shape="circle" @click="addTimer">添加定时器</my-button>
+			</view>
+		</view> -->
+		<view class="list u-m-t-20" v-if="list.length">
+			<view class="block" v-for="(item,index) in list" :key="index">
+				<!-- <view class="u-flex u-row-between">
+					<view>定时器{{index+1}}</view>
+					<uni-icons @click="delTimer(index)" type="trash"></uni-icons>
+				</view> -->
+				<view class="u-flex  u-row-between">
+					<view>周期</view>
+					<view class="color-main" @click="selectAllClick(index)">
+						{{isAllChecked?'取消全选':'全选'}}
+						</view>
+				</view>
+				<view class="u-m-t-24">
+					<uni-data-checkbox :selectedColor="color.ColorMain" multiple v-model="item.cycleChecked" :localdata="cycle"></uni-data-checkbox>
+				</view>
+				<view class="u-m-t-24">
+					<view class="u-flex">
+						<view>上架时间:</view>
+						<view class="u-flex-1 u-m-l-10">
+							<picker mode="multiSelector" @change="listingTimeChange($event,index)"
+								:value="item.listingTime.index" :range="times">
+								<view class="bg-gray u-p-l-20 u-p-t-6 u-p-b-6 u-p-r-20 ">
+									{{item.listingTime.value}}
+								</view>
+							</picker>
+						</view>
+					</view>
+					<view class="u-flex u-m-t-16">
+						<view>下架时间:</view>
+						<view class="u-flex-1 u-m-l-10">
+							<picker mode="multiSelector" @change="offShelfChange($event,index)"
+								:value="item.offShelf.index" :range="times">
+								<view class="bg-gray u-p-l-20 u-p-t-6 u-p-b-6 u-p-r-20 ">
+									{{item.offShelf.value}}
+								</view>
+							</picker>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view class="u-flex u-row-center u-m-t-60">
+			<my-button width="580" shape="circle" @click="save">保存</my-button>
+		</view>
+
+	</view>
+</template>
+
+<script setup>
+	import {
+		onLoad,
+		onReady
+	} from '@dcloudio/uni-app';
+	import {
+		computed,
+		ref
+	} from 'vue';
+	import go from '@/commons/utils/go.js';
+	import color from '@/commons/color.js'
+	import {
+		$getProductDetail,
+	} from '@/http/yskApi/goods.js'
+	//返回一天的时间 时分格式
+	function returnDayTime() {
+		return new Array(2).fill(1).map((v, index) => {
+			if (index === 0) {
+				return new Array(24).fill(1).map((hour, index) => {
+					return `0${index}`.slice(-2)
+				})
+			}
+			if (index === 1) {
+				return new Array(60).fill(1).map((hour, index) => {
+					return `0${index}`.slice(-2)
+				})
+			}
+		})
+	}
+	const times = ref(returnDayTime())
+	let defaultTimeIndex = ref(0)
+
+	function getTime(indexArr) {
+		const hour = times.value[0][indexArr[0]]
+		const month = times.value[1][indexArr[1]]
+		return `${hour}:${month}`
+	}
+	//获取$event.detail.value
+	function getEnentDetailValue(e) {
+		return e.detail.value
+	}
+
+	function setListTimeValue(index, key, time) {
+		list.value[index][key].value = time
+	}
+
+	function listingTimeChange(e, index) {
+		const indexArr = getEnentDetailValue(e)
+		const time = getTime(indexArr)
+		setListTimeValue(index, 'listingTime', time)
+	}
+
+	function offShelfChange(e, index) {
+		const indexArr = getEnentDetailValue(e)
+		const time = getTime(indexArr)
+		setListTimeValue(index, 'offShelf', time)
+	}
+
+
+
+	const cycle = [{
+			value: 0,
+			text: '星期一'
+		},
+		{
+			value: 1,
+			text: '星期二'
+		},
+		{
+			value: 2,
+			text: '星期三'
+		},
+		{
+			value: 3,
+			text: '星期四'
+		},
+		{
+			value: 4,
+			text: '星期五'
+		},
+		{
+			value: 5,
+			text: '星期六'
+		},
+		{
+			value: 6,
+			text: '星期日'
+		}
+	]
+	const ListDataconstructor = {
+		cycleChecked: [0, 1, 2, 3, 4, 5, 6],
+	}
+
+	function returnBasicTimeConstructor() {
+		return {
+			listingTime: {
+				value: '00:00',
+				index: [0, 0]
+			},
+			offShelf: {
+				value: '00:00',
+				index: [0, 0]
+			}
+		}
+	}
+	const list = ref([returnBasicDataConstructor()])
+	function returnBasicDataConstructor() {
+		return {
+			...ListDataconstructor,
+			...returnBasicTimeConstructor()
+		}
+	}
+
+	function addTimer() {
+		list.value.push(returnBasicDataConstructor())
+	}
+	function delTimer(index) {
+		list.value.splice(index,1)
+	}
+	const isAllChecked=computed(()=>{
+		return list.value[0].cycleChecked.length==cycle.length?true:false
+	})
+	function selectAllClick(index){
+		if(isAllChecked.value){
+			list.value[index].cycleChecked=[]
+		}else{
+			list.value[index].cycleChecked=ListDataconstructor.cycleChecked
+		}
+	}
+	// 触发定时器保存事件将数据给到添加商品页面
+	function emitTimerSave(){
+		uni.$emit('timerSave',list.value)
+		go.back()
+	}
+	function save(){
+		console.log(list.value);
+		emitTimerSave()
+	}
+	let goodsDetail=ref({})
+	
+	function returnTimer(res){
+		return []
+	}
+	onLoad(async(opt)=>{
+		let res=null
+		if(opt.productId){
+			res=await $getProductDetail(opt.productId)
+			goodsDetail.value=res
+		}
+		const arr=res?returnTimer(res):[]
+		if(arr.length){
+			list.value=arr
+		}
+	})
+</script>
+
+<style lang="scss">
+	.min-page {
+		background-color: #F9F9F9;
+	}
+
+	.block {
+		background: #FFFFFF;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		padding: 32rpx 28rpx;
+		margin-bottom: 32rpx;
+	}
+</style>

pageProduct/add-Product/timer.vue

@@ -0,0 +1,254 @@
+<template>
+	<view class="u-p-30 min-page u-font-28">
+		<!-- <view class="u-flex">
+			<view style="width: 210rpx;">
+				<my-button shape="circle" @click="addTimer">添加定时器</my-button>
+			</view>
+		</view> -->
+		<view class="list u-m-t-20" v-if="list.length">
+			<view class="block" v-for="(item,index) in list" :key="index">
+				<!-- <view class="u-flex u-row-between">
+					<view>定时器{{index+1}}</view>
+					<uni-icons @click="delTimer(index)" type="trash"></uni-icons>
+				</view> -->
+				<view class="u-flex  u-row-between">
+					<view>周期</view>
+					<view class="color-main" @click="selectAllClick(index)">
+						{{isAllChecked?'取消全选':'全选'}}
+					</view>
+				</view>
+				<view class="u-m-t-24">
+					<uni-data-checkbox :selectedColor="color.ColorMain" multiple v-model="item.cycleChecked"
+						:localdata="cycle"></uni-data-checkbox>
+				</view>
+				<view class="u-m-t-24">
+					<view class="u-flex">
+						<view>上架时间:</view>
+						<view class="u-flex-1 u-m-l-10">
+							<picker mode="multiSelector" @change="startTimeChange($event,index)"
+								:value="item.startTime.index" :range="times">
+								<view class="bg-gray u-p-l-20 u-p-t-6 u-p-b-6 u-p-r-20 ">
+									{{item.startTime.value}}
+								</view>
+							</picker>
+						</view>
+					</view>
+					<view class="u-flex u-m-t-16">
+						<view>下架时间:</view>
+						<view class="u-flex-1 u-m-l-10">
+							<picker mode="multiSelector" @change="endTimeChange($event,index)"
+								:value="item.endTime.index" :range="times">
+								<view class="bg-gray u-p-l-20 u-p-t-6 u-p-b-6 u-p-r-20 ">
+									{{item.endTime.value}}
+								</view>
+							</picker>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view class="u-flex u-row-center u-m-t-60">
+			<my-button width="580" shape="circle" @click="save">保存</my-button>
+		</view>
+
+	</view>
+</template>
+
+<script setup>
+	import {
+		onLoad,
+		onReady
+	} from '@dcloudio/uni-app';
+	import {
+		computed,
+		ref
+	} from 'vue';
+	import go from '@/commons/utils/go.js';
+	import color from '@/commons/color.js'
+	import {
+		$getProductDetail,
+	} from '@/http/yskApi/goods.js'
+	//返回一天的时间 时分格式
+	function returnDayTime() {
+		return new Array(3).fill(1).map((v, index) => {
+			if (index === 0) {
+				return new Array(24).fill(1).map((hour, index) => {
+					return `0${index}`.slice(-2)
+				})
+			}
+			if (index === 1 || index === 2) {
+				return new Array(60).fill(1).map((hour, index) => {
+					return `0${index}`.slice(-2)
+				})
+			}
+		})
+	}
+	const times = ref(returnDayTime())
+	let defaultTimeIndex = ref(0)
+
+	function getTime(indexArr) {
+		const hour = times.value[0][indexArr[0]]
+		const month = times.value[1][indexArr[1]]
+		const s = times.value[2][indexArr[2]]
+		// return `${hour}:${month}:${s}`
+		return `${hour}:${month}`
+	}
+	//获取$event.detail.value
+	function getEnentDetailValue(e) {
+		return e.detail.value
+	}
+
+	function setListTimeValue(index, key, time) {
+		list.value[index][key].value = time
+	}
+
+	function startTimeChange(e, index) {
+		const indexArr = getEnentDetailValue(e)
+		const time = getTime(indexArr)
+		setListTimeValue(index, 'startTime', time)
+	}
+
+	function endTimeChange(e, index) {
+		const indexArr = getEnentDetailValue(e)
+		const time = getTime(indexArr)
+		setListTimeValue(index, 'endTime', time)
+	}
+
+
+
+	const cycle = [{
+			value: 'Monday',
+			text: '星期一'
+		},
+		{
+			value: 'Tuesday',
+			text: '星期二'
+		},
+		{
+			value: 'Wednesday',
+			text: '星期三'
+		},
+		{
+			value: 'Thursday',
+			text: '星期四'
+		},
+		{
+			value: 'Friday',
+			text: '星期五'
+		},
+		{
+			value: 'Saturday',
+			text: '星期六'
+		},
+		{
+			value: 'Sunday',
+			text: '星期日'
+		}
+	]
+	const ListDataconstructor = {
+		cycleChecked: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
+	}
+
+	function returnBasicTimeConstructor() {
+		return {
+			startTime: {
+				value: '00:00',
+				index: [0, 0, 0]
+			},
+			endTime: {
+				value: '23:59',
+				index: [0, 0, 0]
+			}
+		}
+	}
+	const list = ref([returnBasicDataConstructor()])
+
+	function returnBasicDataConstructor() {
+		return {
+			...ListDataconstructor,
+			...returnBasicTimeConstructor()
+		}
+	}
+
+	function addTimer() {
+		list.value.push(returnBasicDataConstructor())
+	}
+
+	function delTimer(index) {
+		list.value.splice(index, 1)
+	}
+	const isAllChecked = computed(() => {
+		return list.value[0].cycleChecked.length == cycle.length ? true : false
+	})
+
+	function selectAllClick(index) {
+		if (isAllChecked.value) {
+			list.value[index].cycleChecked = []
+		} else {
+			list.value[index].cycleChecked = ListDataconstructor.cycleChecked
+		}
+	}
+	// 触发定时器保存事件将数据给到添加商品页面
+	function emitTimerSave() {
+		const par = {
+			days: list.value[0].cycleChecked.join(','),
+			startTime: list.value[0].startTime.value,
+			endTime: list.value[0].endTime.value
+		}
+		console.log(par);
+		uni.$emit('timerSave', par)
+		go.back()
+	}
+
+	function save() {
+		emitTimerSave()
+	}
+	let goodsDetail = ref({})
+
+	function returnTimeIndex(time) {
+		console.log(time);
+		return time.split(':').map(v => {
+			return v * 1
+		})
+	}
+
+	function returnTimer(res) {
+		return [{
+			cycleChecked: res.days ? res.days.split(',').filter(v => v) : [],
+			startTime: res.startTime ? {
+				value: res.startTime,
+				index: returnTimeIndex(res.startTime)
+			} : returnBasicTimeConstructor.startTime,
+			endTime: res.endTime ? {
+				value: res.endTime,
+				index: returnTimeIndex(res.endTime)
+			} : returnBasicTimeConstructor.endTime
+		}]
+	}
+	onLoad(async (opt) => {
+		let res = null
+		if (opt.productId) {
+			res = await $getProductDetail(opt.productId)
+			goodsDetail.value = res
+		}
+		const arr = res ? returnTimer(res) : [];
+		console.log(arr);
+		if (arr.length) {
+			list.value = arr
+		}
+	})
+</script>
+
+<style lang="scss">
+	.min-page {
+		background-color: #F9F9F9;
+	}
+
+	.block {
+		background: #FFFFFF;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		padding: 32rpx 28rpx;
+		margin-bottom: 32rpx;
+	}
+</style>

pageProduct/add-specifications/add-specifications - 副本 (2).vue

@@ -0,0 +1,499 @@
+<template>
+	<view class="page">
+		<view class="box">
+			<view class="block border-top-0">
+				<uni-forms ref="nameFormRef" :model="specifications" :rules="rules" :label-width="350"
+					label-position="top" validateTrigger="blur">
+					<uni-forms-item label="模版名称" required name="name">
+						<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+							v-model="specifications.name" placeholder="模版名称,如:衣服" />
+					</uni-forms-item>
+				</uni-forms>
+			</view>
+			<view v-for="(item,index) in specifications.list" :key="index">
+				<uni-forms :model="item" :rules="rules" err-show-type="undertext" validateTrigger="blur"
+					:ref="setFormRef(index)" :border="true" label-position="top" label-width="350">
+
+					<view class="block">
+						<view class="border-top-0">
+							<uni-forms-item label="规格组名" required name="name">
+								<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+									v-model="item.name" placeholder="规格组名,如:尺码" />
+							</uni-forms-item>
+						</view>
+						<uni-forms-item label="规格值">
+							<view class="option">
+								<view class="">
+									<view class="u-flex option-item" v-for="(option,optionIndex) in item.options"
+										:key="optionIndex">
+										<view class="u-flex-1">
+											<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'name']"
+												:ref="setFormInputRef(index,optionIndex)"
+												:rules="[{'required': true,errorMessage: '必填'}]" label-width="0"
+												label="" required :showRequired="false">
+												<uni-easyinput
+													v-model="specifications.list[index].options[optionIndex].name"
+													@input="inpuChange(index,optionIndex)"
+													:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+													placeholder="请输入规格值,如:S、M" />
+											</uni-forms-item>
+
+										</view>
+										<view class="  u-flex">
+											<uni-forms-item :key="optionIndex" label-width="0" label=""
+												:showRequired="false">
+												<view class="u-flex">
+													<!-- <uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
+													@input="inpuChange(index,optionIndex)"
+													
+														:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+														type="digit" placeholder="填写价格" /> -->
+
+													<view class="icon icon-reduce u-m-l-38"
+														@click="delOption(index,optionIndex)">
+
+													</view>
+												</view>
+
+											</uni-forms-item>
+
+										</view>
+									</view>
+								</view>
+								<view class="u-flex" @click="addOptions(index)">
+									<view class="icon icon-add u-m-r-22 ">
+
+									</view>
+									<view class="color-main">添加规格</view>
+								</view>
+
+
+							</view>
+						</uni-forms-item>
+
+						<view class="u-flex u-m-t-48 u-m-b-24" @click="delSpecificationsGroup(index)">
+							<view class="icon icon-reduce u-m-r-22 ">
+
+							</view>
+							<view class="color-red">删除规格组</view>
+						</view>
+					</view>
+				</uni-forms>
+			</view>
+			<view class="u-flex block u-p-l-20 u-p-r-20 u-p-t-28 u-p-b-28" @click="addSpecificationsGroup">
+				<view class="icon icon-add u-m-r-22 ">
+
+				</view>
+				<view class="color-main">添加规格组</view>
+			</view>
+
+			<view class="save-btn-box">
+				<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
+			</view>
+		</view>
+		<view class="bottom" ref="bottom"></view>
+	</view>
+</template>
+
+<script setup>
+	import go from '@/commons/utils/go.js';
+	import {
+		$productSpec
+	} from '@/http/yskApi/goods.js'
+	import {
+		onLoad,
+		onReady,
+	} from '@dcloudio/uni-app';
+	import infoBox from '@/commons/utils/infoBox.js'
+	import {
+		onMounted,
+		reactive,
+		nextTick,
+		ref,
+		onBeforeMount
+	} from 'vue';
+	const nameFormRef = ref(null)
+	// 表单样式
+	const placeholderStyle = ref('font-size:28rpx;')
+	//表单边框
+	const inputBorder = ref(false)
+	const form = ref(null)
+	const bottom = ref(null)
+	//表单验证
+	const rules = {
+		name: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		MinOptional: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		MaxOptional: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		optionPrice: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		}
+	}
+
+
+	// 构造规格的选项值的基础数据
+	const specificationsOptionsBasicData = {
+		name: '',
+		optionPrice: '0.00'
+	}
+
+	function returnOptionsBasicData() {
+		return {
+			...specificationsOptionsBasicData
+		}
+	}
+	// 构造规格的基础数据
+	const specificationsBasicData = {
+		name: '',
+		// MinOptional: 1,
+		// MaxOptional: 1,
+		options: []
+	}
+
+	function returnSpecificationsOptionsBasicData() {
+		return {
+			...specificationsBasicData,
+			options: [returnOptionsBasicData()]
+		}
+	}
+
+	function onFieldChange(e) {
+		console.log(e);
+	}
+	// 规格列表
+	const specifications = reactive({
+		name: '',
+		list: [returnSpecificationsOptionsBasicData()]
+	})
+
+
+
+	//添加规格组
+	function addSpecificationsGroup() {
+		specifications.list.push(returnSpecificationsOptionsBasicData())
+		scrollPageBottom()
+	}
+	//删除规格组
+	function delSpecificationsGroup(index) {
+		specifications.list.splice(index, 1)
+	}
+	// 向指定索引的规格组添加规格项
+	function addOptions(index) {
+		specifications.list[index].options.push(returnOptionsBasicData())
+	}
+	// 删除指定索引的规格组添加规格项
+	function delOption(index, optionIndex) {
+		specifications.list[index].options.splice(optionIndex, 1)
+	}
+	//页面滚动到最底部
+	function scrollPageBottom() {
+		nextTick(() => {
+			uni.pageScrollTo({
+				duration: 100, // 过渡时间
+				scrollTop: 100000, // 滚动的实际距离
+			})
+		})
+	}
+	//设置表单验证规则
+	function setFormRules() {
+		form.value.setRules(rules)
+	}
+	const formRefs = ref([]);
+	//绑定表单元素
+	function setFormRef(index) {
+		formRefs.value[index] = null;
+		return (el) => {
+			if (el) {
+				formRefs.value[index] = el;
+			}
+		};
+	}
+	// 绑定option input元素
+	const refFormInput = ref([])
+
+	function setFormInputRef(index, index1) {
+		const newIndex = index * 10000 + index1
+		return (el) => {
+			if (el) {
+				if (!refFormInput.value[newIndex]) {
+					refFormInput.value[newIndex] = el;
+				}
+			}
+		}
+	}
+	// 当表单内容输入变化根据配置的rules进行验证
+	function inpuChange(index, index1) {
+		const newIndex = index * 10000 + index1
+		console.log(refFormInput.value[newIndex]);
+		refFormInput.value[newIndex].onFieldChange()
+	}
+
+
+
+
+
+
+	const option = {
+		type: 'add',
+		id: undefined
+	}
+	onLoad(opt => {
+		console.log(opt);
+		if (opt && JSON.stringify(opt) !== '{}' && opt.type) {
+			option.type = opt.type
+			const data = uni.getStorageSync('spec')
+			uni.removeStorageSync('spec')
+			if(data){
+				specifications.name = data.name
+				specifications.id = data.id
+				specifications.list = data.specList.map(v => {
+					return {
+						...v,
+						options: v.value.map(v => {
+							return {
+								name: v
+							}
+						})
+					}
+				})
+			}
+			
+		}
+		uni.setNavigationBarTitle({
+			title: option.type === 'edit' ? '编辑规格模版' : '添加规格模版'
+		})
+
+	})
+
+	function returnPromise(prosise, index) {
+		return new Promise((resolve, reject) => {
+			prosise.then(res => {
+				console.log(res);
+				resolve({
+					sucees: true
+				})
+			}).catch(err => {
+				console.log(err);
+				resolve({
+					sucees: false
+				})
+			})
+		})
+	}
+
+	let timer = null
+
+	function settimeoutBack(time) {
+		clearTimeout(timer)
+		timer = setTimeout(() => {
+			uni.navigateBack()
+		}, time)
+	}
+	async function save() {
+		let isAllPassForm = 0
+		const nameFormRes = await returnPromise(nameFormRef.value.validate())
+		console.log(nameFormRes);
+		if (!nameFormRes.sucees) {
+			isAllPassForm -= 1
+		}
+		for (let i in specifications.list) {
+			const res = await returnPromise(formRefs.value[i].validate(), i)
+			isAllPassForm += res.sucees ? 1 : 0
+		}
+		//判断验证是否通过
+		if (isAllPassForm === specifications.list.length) {
+			console.log('pass');
+			const data = {
+				name: specifications.name,
+				id:specifications.id,
+				specList: specifications.list.map(v => {
+					return {
+						...v,
+						value: v.options.map(v => v.name),
+						options: undefined
+					}
+				})
+			}
+			if (option.type === 'add') {
+				return $productSpec.add(data).then(res => {
+					infoBox.showSuccessToast('添加成功')
+					settimeoutBack(1500)
+				})
+			}
+
+			$productSpec.update(data).then(res => {
+				infoBox.showSuccessToast('修改成功')
+				settimeoutBack(1500)
+			})
+		}
+
+	}
+</script>
+<style scoped>
+	page {
+		background: #F9F9F9;
+	}
+</style>
+<style lang="scss" scoped>
+	$icon-size: 34rpx;
+	$icon-line-width: 20rpx;
+	$icon-line-height: 4rpx;
+
+	.page {
+		background: #F9F9F9;
+		padding: 30rpx;
+		padding-bottom: 200rpx;
+	}
+
+	.my-switch {
+		transform: scale(0.7);
+	}
+
+	::v-deep .uni-forms-item__error {
+		display: none !important;
+	}
+
+	::v-deep .option .uni-forms-item {
+		padding: 0;
+		min-height: inherit;
+		background-color: transparent;
+		border-top: none;
+	}
+
+	.icon {
+		width: $icon-size;
+		height: $icon-size;
+		position: relative;
+		border-radius: 50%;
+
+		&:before,
+		&::after {
+			position: absolute;
+			display: block;
+			content: '';
+			background-color: #fff;
+		}
+	}
+
+	.icon-add {
+		background-color: $my-main-color;
+
+		&::before {
+			width: $icon-line-height;
+			height: $icon-line-width;
+			top: calc(($icon-size /2) - ($icon-line-width / 2));
+			left: calc(($icon-size /2) - ($icon-line-height / 2));
+		}
+
+		&::after {
+			width: $icon-line-width;
+			height: 4rpx;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.icon-reduce {
+		background-color: $my-red-color;
+
+		&::after {
+			width: $icon-line-width;
+			height: $icon-line-height;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.label-title {
+		font-size: 28rpx;
+		font-weight: bold;
+		font-family: Source Han Sans CN, Source Han Sans CN;
+	}
+
+	.lh40 {
+		line-height: 40rpx;
+	}
+
+	.box {
+		margin-top: 70rpx;
+		font-size: 28rpx;
+
+		.block {
+			background: #FFFFFF;
+			border-radius: 18rpx 18rpx 18rpx 18rpx;
+			padding: 12rpx 24rpx;
+			margin-bottom: 32rpx;
+		}
+	}
+
+	.save-btn-box {
+		position: fixed;
+		left: 30rpx;
+		right: 30rpx;
+		bottom: 60rpx;
+
+	}
+
+	::v-deep.uni-forms-item {
+		align-items: inherit;
+	}
+
+	::v-deep .uni-forms-item .uni-forms-item__label {
+		text-indent: 0;
+		font-size: 28rpx !important;
+		font-weight: bold;
+		color: #333;
+	}
+
+	::v-deep .border-top-0 .uni-forms-item.is-direction-top {
+		border-color: transparent !important;
+	}
+
+	.save-btn {
+		background-color: $my-main-color;
+		color: #fff;
+		border-radius: 12rpx;
+		font-size: 28rpx;
+	}
+
+	.btn-hover-class {
+		opacity: .6;
+	}
+
+	.zuofa {
+		padding: 28rpx 0;
+		background: #F9F9F9;
+		padding-left: 42rpx;
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+	}
+
+	::v-deep .uni-input-placeholder {
+		font-size: 28rpx;
+	}
+
+	.option {
+		padding: 26rpx 30rpx 24rpx 24rpx;
+		background: #F9F9F9;
+	}
+
+	.option-item {
+		margin-bottom: 34rpx;
+	}
+</style>

pageProduct/add-specifications/add-specifications - 副本.vue

@@ -0,0 +1,464 @@
+<template>
+	<view class="page">
+		<view class="box">
+			<view v-for="(item,index) in specifications.list" :key="index">
+				<uni-forms :model="item" :rules="rules" err-show-type="undertext" validateTrigger="blur"
+					:ref="setFormRef(index)" :border="true" label-position="top" label-width="350">
+					<view class="block">
+						<view class="border-top-0">
+							<uni-forms-item label="规格组名" required name="name" >
+								<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+									v-model="item.name" placeholder="规格组名" />
+							</uni-forms-item>
+						</view>
+						<!-- <uni-forms-item label="最少可选" required name="MinOptional" >
+							<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+								v-model="item.MinOptional" type="number" placeholder="填写最小数量" />
+						</uni-forms-item>
+						<uni-forms-item label="最大可选" required name="MaxOptional" >
+							<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+								v-model="item.MaxOptional" type="number" placeholder="填写最大数量" />
+						</uni-forms-item> -->
+						<uni-forms-item label="选项值">
+							<view class="option">
+								<view class="u-flex">
+									<view class="u-flex-1">名称</view>
+									<view class="u-flex-1 u-p-l-60">加价</view>
+								</view>
+								<view class="u-m-t-32">
+									<view class="u-flex option-item" 
+									
+									v-for="(option,optionIndex) in item.options"
+										:key="optionIndex" 
+										>
+										<view class="u-flex-1">
+											<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'optionName']" 
+											:ref="setFormInputRef(index,optionIndex)"
+											 :rules="[{'required': true,errorMessage: '必填'}]"
+											 label-width="0" label="" required  :showRequired="false"
+												>
+												<uni-easyinput v-model="specifications.list[index].options[optionIndex].optionName"
+												 @input="inpuChange(index,optionIndex)"
+												
+													:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+													placeholder="选项名" />
+											</uni-forms-item>
+
+										</view>
+										<view class="u-p-l-60 u-flex-1 u-flex">
+											<uni-forms-item :key="optionIndex" 
+											:rules="[{'required': true,errorMessage: '必填'}]"
+											:ref="setFormInputRef(index,optionIndex)"
+											:name="['options',optionIndex,'optionPrice']" label-width="0" label="" required  :showRequired="false"
+												>
+												<view class="u-flex">
+													<uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
+													@input="inpuChange(index,optionIndex)"
+													
+														:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+														type="digit" placeholder="填写价格" />
+
+													<view class="icon icon-reduce u-m-l-38"
+														@click="delOption(index,optionIndex)">
+
+													</view>
+												</view>
+
+											</uni-forms-item>
+
+										</view>
+									</view>
+								</view>
+								<view class="u-flex" @click="addOptions(index)">
+									<view class="icon icon-add u-m-r-22 ">
+
+									</view>
+									<view class="color-main">添加规格</view>
+								</view>
+
+
+							</view>
+						</uni-forms-item>
+						        
+						<view class="u-flex u-m-t-48 u-m-b-24" @click="delSpecificationsGroup(index)">
+							<view class="icon icon-reduce u-m-r-22 ">
+
+							</view>
+							<view class="color-red">删除规格组</view>
+						</view>
+					</view>
+				</uni-forms>
+			</view>
+			<view class="u-flex block u-p-l-20 u-p-r-20 u-p-t-28 u-p-b-28" @click="addSpecificationsGroup">
+				<view class="icon icon-add u-m-r-22 ">
+
+				</view>
+				<view class="color-main">添加规格组</view>
+			</view>
+
+			<view class="save-btn-box">
+				<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
+			</view>
+		</view>
+		<view class="bottom" ref="bottom"></view>
+	</view>
+</template>
+
+<script setup>
+	import go from '@/commons/utils/go.js';
+	import {
+		onLoad,
+		onReady
+	} from '@dcloudio/uni-app';
+	import {
+		onMounted,
+		reactive,
+		nextTick,
+		ref,
+		onBeforeMount
+	} from 'vue';
+	// 表单样式
+	const placeholderStyle = ref('font-size:28rpx;') 
+	//表单边框
+	const inputBorder = ref(false)
+	const form = ref(null)
+	const bottom = ref(null)
+	//表单验证
+	const rules = {
+		name: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		MinOptional: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		MaxOptional: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		optionName: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		optionPrice: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		}
+	}
+
+	
+	// 构造规格的选项值的基础数据
+	const specificationsOptionsBasicData = {
+		optionName: '',
+		optionPrice: '0.00'
+	}
+
+	function returnOptionsBasicData() {
+		return {
+			...specificationsOptionsBasicData
+		}
+	}
+	// 构造规格的基础数据
+	const specificationsBasicData = {
+		name: '',
+		MinOptional: 1,
+		MaxOptional: 1,
+		options: []
+	}
+
+	function returnSpecificationsOptionsBasicData() {
+		return {
+			...specificationsBasicData,
+			options: [returnOptionsBasicData()]
+		}
+	}
+
+	function onFieldChange(e) {
+		console.log(e);
+	}
+	// 规格列表
+	const specifications = reactive({
+		list: [returnSpecificationsOptionsBasicData()]
+	})
+
+
+
+	//添加规格组
+	function addSpecificationsGroup() {
+		specifications.list.push(returnSpecificationsOptionsBasicData())
+		scrollPageBottom()
+	}
+	//删除规格组
+	function delSpecificationsGroup(index) {
+		specifications.list.splice(index, 1)
+	}
+	// 向指定索引的规格组添加规格项
+	function addOptions(index) {
+		specifications.list[index].options.push(returnOptionsBasicData())
+	}
+	// 删除指定索引的规格组添加规格项
+	function delOption(index, optionIndex) {
+		specifications.list[index].options.splice(optionIndex, 1)
+	}
+	//页面滚动到最底部
+	function scrollPageBottom() {
+		nextTick(() => {
+			uni.pageScrollTo({
+				duration: 100, // 过渡时间
+				scrollTop: 100000, // 滚动的实际距离
+			})
+		})
+	}
+	//设置表单验证规则
+	function setFormRules() {
+		form.value.setRules(rules)
+	}
+	const formRefs = ref([]);
+	//绑定表单元素
+	function setFormRef(index) {
+		formRefs.value[index] = null;
+		return (el) => {
+			if (el) {
+				formRefs.value[index] = el;
+			}
+		};
+	}
+	// 绑定option input元素
+	const refFormInput=ref([])
+	function setFormInputRef(index, index1) {
+		const newIndex = index * 10000 + index1
+		return (el) => {
+			if (el) {
+				if (!refFormInput.value[newIndex]) {
+					refFormInput.value[newIndex] = el;
+				}
+			}
+		}
+	}
+	// 当表单内容输入变化根据配置的rules进行验证
+	function inpuChange(index, index1) {
+		const newIndex = index * 10000 + index1
+		console.log(refFormInput.value[newIndex]);
+		refFormInput.value[newIndex].onFieldChange()
+	}
+	
+	
+	
+
+	
+	
+	let emitName=''
+	function triggerEvent (emitName,data){
+		if(emitName){
+			uni.$emit(emitName,data)
+		}
+	}
+	onLoad(opt=>{
+		const arr=uni.getStorageSync('guige')
+		if(arr.length){
+			specifications.list=arr
+			console.log(arr);
+		}
+		console.log(opt);
+		if(opt&&JSON.stringify(opt)!=='{}'&&opt.emitName){
+			emitName=opt.emitName
+		}
+		uni.setNavigationBarTitle({
+			title:emitName?'编辑规格模版':'添加规格模版'
+		})
+		
+	})
+	function emitspecificationsSave(){
+		// emitspecificationsSave  触发规格保存事件将数据给到添加商品页面
+		// guigeEdit  触发规格保存事件将数据给到添加规格页面
+		uni.removeStorageSync('guige')
+		triggerEvent(emitName,specifications.list)
+	}
+	function returnPromise(index,prosise){
+		return new Promise((resolve,reject)=>{
+			prosise.then(res=>{
+				console.log(res);
+				resolve({sucees:true})
+			}).catch(err=>{
+				console.log(err);
+				resolve({sucees:false})
+			})
+		})
+	}
+	async function  save() {
+		let isAllPassForm=0
+		for (let i in specifications.list) {
+			const res=await returnPromise(i,formRefs.value[i].validate())
+			isAllPassForm+=res.sucees?1:0
+		}
+		//判断验证是否通过
+		if(isAllPassForm===specifications.list.length){
+			console.log('pass');
+			emitspecificationsSave()
+			go.back()
+		}
+
+	}
+</script>
+<style scoped>
+	page {
+		background: #F9F9F9;
+	}
+</style>
+<style lang="scss" scoped>
+	$icon-size: 34rpx;
+	$icon-line-width: 20rpx;
+	$icon-line-height: 4rpx;
+
+	.page {
+		background: #F9F9F9;
+		padding: 30rpx;
+		padding-bottom: 200rpx;
+	}
+
+	.my-switch {
+		transform: scale(0.7);
+	}
+
+	::v-deep .uni-forms-item__error {
+		display: none !important;
+	}
+
+	::v-deep .option .uni-forms-item {
+		padding: 0;
+		min-height: inherit;
+		background-color: transparent;
+		border-top: none;
+	}
+
+	.icon {
+		width: $icon-size;
+		height: $icon-size;
+		position: relative;
+		border-radius: 50%;
+
+		&:before,
+		&::after {
+			position: absolute;
+			display: block;
+			content: '';
+			background-color: #fff;
+		}
+	}
+
+	.icon-add {
+		background-color: $my-main-color;
+
+		&::before {
+			width: $icon-line-height;
+			height: $icon-line-width;
+			top: calc(($icon-size /2) - ($icon-line-width / 2));
+			left: calc(($icon-size /2) - ($icon-line-height / 2));
+		}
+
+		&::after {
+			width: $icon-line-width;
+			height: 4rpx;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.icon-reduce {
+		background-color: $my-red-color;
+
+		&::after {
+			width: $icon-line-width;
+			height: $icon-line-height;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.label-title {
+		font-size: 28rpx;
+		font-weight: bold;
+		font-family: Source Han Sans CN, Source Han Sans CN;
+	}
+
+	.lh40 {
+		line-height: 40rpx;
+	}
+
+	.box {
+		margin-top: 70rpx;
+		font-size: 28rpx;
+
+		.block {
+			background: #FFFFFF;
+			border-radius: 18rpx 18rpx 18rpx 18rpx;
+			padding: 12rpx 24rpx;
+			margin-bottom: 32rpx;
+		}
+	}
+
+	.save-btn-box {
+		position: fixed;
+		left: 30rpx;
+		right: 30rpx;
+		bottom: 60rpx;
+
+	}
+
+	::v-deep.uni-forms-item {
+		align-items: inherit;
+	}
+
+	::v-deep .uni-forms-item .uni-forms-item__label {
+		text-indent: 0;
+		font-size: 28rpx !important;
+		font-weight: bold;
+		color: #333;
+	}
+
+	::v-deep .border-top-0 .uni-forms-item.is-direction-top {
+		border-color: transparent !important;
+	}
+
+	.save-btn {
+		background-color: $my-main-color;
+		color: #fff;
+		border-radius: 12rpx;
+		font-size: 28rpx;
+	}
+
+	.btn-hover-class {
+		opacity: .6;
+	}
+
+	.zuofa {
+		padding: 28rpx 0;
+		background: #F9F9F9;
+		padding-left: 42rpx;
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+	}
+
+	::v-deep .uni-input-placeholder {
+		font-size: 28rpx;
+	}
+
+	.option {
+		padding: 26rpx 30rpx 24rpx 24rpx;
+		background: #F9F9F9;
+	}
+
+	.option-item {
+		margin-bottom: 34rpx;
+	}
+</style>

pageProduct/add-specifications/add-specifications.vue

@@ -0,0 +1,526 @@
+<template>
+	<view class="page min-page">
+		<view class="box">
+			<view class="block border-top-0 u-p-t-32 u-p-b-32">
+				<uni-forms ref="nameFormRef" :model="specifications" :rules="rules" :label-width="350"
+					label-position="top" validateTrigger="blur">
+					<uni-forms-item label="模版名称" required name="name">
+						<uni-easyinput padding-none :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+							v-model="specifications.name" placeholder="模版名称,如:衣服" />
+					</uni-forms-item>
+				</uni-forms>
+			</view>
+			<view v-for="(item,index) in specifications.list" :key="index">
+				<uni-forms :model="item" :rules="rules" err-show-type="undertext" validateTrigger="blur"
+					:ref="setFormRef(index)" :border="true" label-position="top" label-width="350">
+
+					<view class="block">
+						<view class="border-top-0">
+							<uni-forms-item label="规格组名" required name="name">
+								<uni-easyinput padding-none :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+									v-model="item.name" placeholder="规格组名,如:尺码" />
+							</uni-forms-item>
+						</view>
+						<view class="u-p-b-8">
+							<uni-forms-item label="规格值">
+								<view class="option ">
+									<view class="">
+										<view class="u-flex option-item u-m-t-8" v-for="(option,optionIndex) in item.options"
+											:key="optionIndex">
+											<view class="u-flex-1">
+												<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'name']"
+													:ref="setFormInputRef(index,optionIndex)"
+													:rules="[{'required': true,errorMessage: '必填'}]" label-width="0"
+													label="" required :showRequired="false">
+													<view class="bg-fff u-p-t-12 u-p-b-12" style="border-radius: 8rpx;">
+														<uni-easyinput
+															v-model="specifications.list[index].options[optionIndex].name"
+															@input="inpuChange(index,optionIndex)"
+															:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+															placeholder="请输入规格值,如:S、M" />
+													</view>
+													
+												</uni-forms-item>
+							
+											</view>
+											<view class="  u-flex" v-if="item.options.length>1">
+												<uni-forms-item :key="optionIndex" label-width="0" label=""
+													:showRequired="false">
+													<view class="u-flex">
+														<!-- <uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
+														@input="inpuChange(index,optionIndex)"
+														
+															:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+															type="digit" placeholder="填写价格" /> -->
+							
+														<view class="icon icon-reduce u-m-l-38"
+															@click="delOption(index,optionIndex)">
+							
+														</view>
+													</view>
+							
+												</uni-forms-item>
+							
+											</view>
+										</view>
+									</view>
+									<view class="u-flex u-m-t-24 " @click="addOptions(index)">
+										<view class="icon icon-add u-m-r-22 ">
+							
+										</view>
+										<view class="color-main">添加规格</view>
+									</view>
+							
+							
+								</view>
+							</uni-forms-item>
+						</view>
+						
+						<template v-if="specifications.list.length>1">
+							<view class="u-p-b-32">
+								<view class="u-flex  " @click="delSpecificationsGroup(index)">
+									<view class="icon icon-reduce u-m-r-22 ">
+								
+									</view>
+									<view class="color-red">删除规格组</view>
+								</view>
+							</view>
+							
+						</template>
+						
+					</view>
+				</uni-forms>
+			</view>
+			
+			<view class="u-flex block u-p-l-20 u-p-r-20 u-p-t-28 u-p-b-28" @click="addSpecificationsGroup">
+				<view class="icon icon-add u-m-r-22 ">
+
+				</view>
+				<view class="color-main">添加规格组</view>
+			</view>
+
+			<view class="save-btn-box">
+				<button class="save-btn " hover-class="btn-hover-class" @click="save">保存</button>
+			</view>
+		</view>
+		<view class="bottom" ref="bottom"></view>
+	</view>
+</template>
+
+<script setup>
+	import go from '@/commons/utils/go.js';
+	import {
+		$productSpec
+	} from '@/http/yskApi/goods.js'
+	import {
+		onLoad,
+		onReady,
+	} from '@dcloudio/uni-app';
+	import infoBox from '@/commons/utils/infoBox.js'
+	import {
+		onMounted,
+		reactive,
+		nextTick,
+		ref,
+		onBeforeMount
+	} from 'vue';
+	const nameFormRef = ref(null)
+	// 表单样式
+	const placeholderStyle = ref('font-size:28rpx;')
+	//表单边框
+	const inputBorder = ref(false)
+	const form = ref(null)
+	const bottom = ref(null)
+	//表单验证
+	const rules = {
+		name: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		MinOptional: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		MaxOptional: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		},
+		optionPrice: {
+			rules: [{
+				required: true,
+				errorMessage: '必填'
+			}]
+		}
+	}
+
+
+	// 构造规格的选项值的基础数据
+	const specificationsOptionsBasicData = {
+		name: '',
+		optionPrice: '0.00'
+	}
+
+	function returnOptionsBasicData() {
+		return {
+			...specificationsOptionsBasicData
+		}
+	}
+	// 构造规格的基础数据
+	const specificationsBasicData = {
+		name: '',
+		// MinOptional: 1,
+		// MaxOptional: 1,
+		options: []
+	}
+
+	function returnSpecificationsOptionsBasicData() {
+		return {
+			...specificationsBasicData,
+			options: [returnOptionsBasicData()]
+		}
+	}
+
+	function onFieldChange(e) {
+		console.log(e);
+	}
+	// 规格列表
+	const specifications = reactive({
+		name: '',
+		list: [returnSpecificationsOptionsBasicData()]
+	})
+
+
+
+	//添加规格组
+	function addSpecificationsGroup() {
+		specifications.list.push(returnSpecificationsOptionsBasicData())
+		scrollPageBottom()
+	}
+	//删除规格组
+	function delSpecificationsGroup(index) {
+		if(specifications.list.length<=1){
+			return
+		}
+		specifications.list.splice(index, 1)
+	}
+	// 向指定索引的规格组添加规格项
+	function addOptions(index) {
+		specifications.list[index].options.push(returnOptionsBasicData())
+	}
+	// 删除指定索引的规格组添加规格项
+	function delOption(index, optionIndex) {
+		if(specifications.list[index].options.length<=1){
+			return
+		}
+		specifications.list[index].options.splice(optionIndex, 1)
+	}
+	//页面滚动到最底部
+	function scrollPageBottom() {
+		nextTick(() => {
+			uni.pageScrollTo({
+				duration: 100, // 过渡时间
+				scrollTop: 100000, // 滚动的实际距离
+			})
+		})
+	}
+	//设置表单验证规则
+	function setFormRules() {
+		form.value.setRules(rules)
+	}
+	const formRefs = ref([]);
+	//绑定表单元素
+	function setFormRef(index) {
+		formRefs.value[index] = null;
+		return (el) => {
+			if (el) {
+				formRefs.value[index] = el;
+			}
+		};
+	}
+	// 绑定option input元素
+	const refFormInput = ref([])
+
+	function setFormInputRef(index, index1) {
+		const newIndex = index * 10000 + index1
+		return (el) => {
+			if (el) {
+				if (!refFormInput.value[newIndex]) {
+					refFormInput.value[newIndex] = el;
+				}
+			}
+		}
+	}
+	// 当表单内容输入变化根据配置的rules进行验证
+	function inpuChange(index, index1) {
+		const newIndex = index * 10000 + index1
+		console.log(refFormInput.value[newIndex]);
+		refFormInput.value[newIndex].onFieldChange()
+	}
+
+
+
+
+
+
+	const option = {
+		type: 'add',
+		id: undefined
+	}
+	onLoad(opt => {
+		console.log(opt);
+		if (opt && JSON.stringify(opt) !== '{}' && opt.type) {
+			option.type = opt.type
+			const data = uni.getStorageSync('spec')
+			uni.removeStorageSync('spec')
+			if(data){
+				specifications.name = data.name
+				specifications.id = data.id
+				specifications.list = data.specList.map(v => {
+					return {
+						...v,
+						options: v.value.map(v => {
+							return {
+								name: v
+							}
+						})
+					}
+				})
+			}
+			
+		}
+		uni.setNavigationBarTitle({
+			title: option.type === 'edit' ? '编辑规格模版' : '添加规格模版'
+		})
+
+	})
+
+	function returnPromise(prosise, index) {
+		return new Promise((resolve, reject) => {
+			prosise.then(res => {
+				console.log(res);
+				resolve({
+					sucees: true
+				})
+			}).catch(err => {
+				console.log(err);
+				resolve({
+					sucees: false
+				})
+			})
+		})
+	}
+
+	let timer = null
+
+	function settimeoutBack(time) {
+		clearTimeout(timer)
+		timer = setTimeout(() => {
+			uni.navigateBack()
+		}, time)
+	}
+	async function save() {
+		let isAllPassForm = 0
+		const nameFormRes = await returnPromise(nameFormRef.value.validate())
+		console.log(nameFormRes);
+		if (!nameFormRes.sucees) {
+			isAllPassForm -= 1
+		}
+		for (let i in specifications.list) {
+			const res = await returnPromise(formRefs.value[i].validate(), i)
+			isAllPassForm += res.sucees ? 1 : 0
+		}
+		//判断验证是否通过
+		if (isAllPassForm === specifications.list.length) {
+			console.log('pass');
+			const data = {
+				name: specifications.name,
+				id:specifications.id,
+				specList: specifications.list.map(v => {
+					return {
+						...v,
+						value: v.options.map(v => v.name),
+						options: undefined
+					}
+				})
+			}
+			if (option.type === 'add') {
+				return $productSpec.add(data).then(res => {
+					infoBox.showSuccessToast('添加成功')
+					settimeoutBack(1500)
+				})
+			}
+
+			$productSpec.update(data).then(res => {
+				infoBox.showSuccessToast('修改成功')
+				settimeoutBack(1500)
+			})
+		}
+
+	}
+</script>
+<style scoped>
+	page {
+		background: #F9F9F9;
+	}
+</style>
+<style lang="scss" scoped>
+	$icon-size: 34rpx;
+	$icon-line-width: 20rpx;
+	$icon-line-height: 4rpx;
+
+	.page {
+		background: #F9F9F9;
+		padding: 32rpx 30rpx 0 30rpx;
+		padding-bottom: 200rpx;
+	}
+	::v-deep .uni-forms-item--border {
+		padding-top: 12px;
+		padding-bottom: 12px;
+	}
+	.my-switch {
+		transform: scale(0.7);
+	}
+	::v-deep .uni-forms-item.is-direction-top .uni-forms-item__label{
+		padding-bottom: 8px;
+	}
+	::v-deep .uni-easyinput__content-input{
+			height: inherit;
+	}
+	::v-deep.uni-forms-item {
+		min-height: inherit;
+	}
+	::v-deep .uni-forms-item__error {
+		display: none !important;
+	}
+
+	::v-deep .option .uni-forms-item {
+		padding: 0;
+		min-height: inherit;
+		background-color: transparent;
+		border-top: none;
+	}
+
+	.icon {
+		width: $icon-size;
+		height: $icon-size;
+		position: relative;
+		border-radius: 50%;
+
+		&:before,
+		&::after {
+			position: absolute;
+			display: block;
+			content: '';
+			background-color: #fff;
+		}
+	}
+
+	.icon-add {
+		background-color: $my-main-color;
+
+		&::before {
+			width: $icon-line-height;
+			height: $icon-line-width;
+			top: calc(($icon-size /2) - ($icon-line-width / 2));
+			left: calc(($icon-size /2) - ($icon-line-height / 2));
+		}
+
+		&::after {
+			width: $icon-line-width;
+			height: 4rpx;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.icon-reduce {
+		background-color: $my-red-color;
+
+		&::after {
+			width: $icon-line-width;
+			height: $icon-line-height;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.label-title {
+		font-size: 28rpx;
+		font-weight: bold;
+		font-family: Source Han Sans CN, Source Han Sans CN;
+	}
+
+	.lh40 {
+		line-height: 40rpx;
+	}
+
+	.box {
+		font-size: 28rpx;
+		.block {
+			background: #FFFFFF;
+			border-radius: 18rpx 18rpx 18rpx 18rpx;
+			padding: 0 24rpx;
+			margin-bottom: 32rpx;
+		}
+	}
+
+	.save-btn-box {
+		position: fixed;
+		left: 30rpx;
+		right: 30rpx;
+		bottom: 60rpx;
+
+	}
+
+	::v-deep.uni-forms-item {
+		align-items: inherit;
+	}
+
+	::v-deep .uni-forms-item .uni-forms-item__label {
+		text-indent: 0;
+		font-size: 28rpx !important;
+		font-weight: bold;
+		color: #333;
+	}
+
+	::v-deep .border-top-0 .uni-forms-item.is-direction-top {
+		border-color: transparent !important;
+	}
+
+	.save-btn {
+		background-color: $my-main-color;
+		color: #fff;
+		border-radius: 12rpx;
+		font-size: 28rpx;
+		border-radius: 100rpx;
+	}
+
+	.btn-hover-class {
+		opacity: .6;
+	}
+
+	.zuofa {
+		padding: 28rpx 0;
+		background: #F9F9F9;
+		padding-left: 42rpx;
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+	}
+
+	::v-deep .uni-input-placeholder {
+		font-size: 28rpx;
+	}
+
+	.option {
+		padding: 8rpx 24rpx 32rpx 24rpx;
+		background: #F9F9F9;
+	}
+
+	.option-item {
+	}
+</style>

pageProduct/add-specifications/choose-specifications.vue

@@ -0,0 +1,826 @@
+<template>
+	<view class="page u-font-24 color-333">
+		<view class="box ">
+			<view>
+				<uni-forms :model="FormData" :rules="rules" err-show-type="undertext" validateTrigger="blur" ref="form"
+					:border="true" :label-width="130">
+					<view class="block u-p-b-16">
+
+						<view class="">
+							<view class="u-m-t-20">选择规格</view>
+							<view class="u-m-t-16">
+								<uni-data-picker :clear-icon="false" @change="specIdChange"
+									:map="{text:'name',value:'id'}" placeholder="请选择规格" popup-title="请选择规格"
+									:localdata="FormData.specList" v-model="FormData.specId">
+								</uni-data-picker>
+							</view>
+						</view>
+						<!-- <view class="border-top-0">
+							<uni-forms-item label="选择规格" required name="categoryId">
+								<uni-data-picker :clear-icon="false" @change="specIdChange"
+									:map="{text:'name',value:'id'}" placeholder="请选择规格" popup-title="请选择规格"
+									:localdata="FormData.specList" v-model="FormData.specId">
+								</uni-data-picker>
+							</uni-forms-item>
+						</view> -->
+						<view class=" ">
+							<view class="u-m-t-32" v-for="(item,index) in FormData.selectSpec" :key="index">
+								<view class="font-bold">
+									{{item.name}}
+								</view>
+								<view class="u-m-t-16">
+									<!-- <up-checkbox-group :labelSize="12" :size="14" :activeColor="color.ColorMain"
+										shape="circle" v-model="item.selectSpecResult" placement="row"
+										@change="createResult">
+										<up-checkbox :customStyle="{marginRight: '60rpx',marginBottom:'16rpx'}"
+											v-for="(item, index) in item.value" :key="index" :label="item.text"
+											:name="item.value">
+										</up-checkbox>
+									</up-checkbox-group> -->
+
+									<uni-data-checkbox @change="createResult" multiple :selectedColor="color.ColorMain"
+										v-model="item.selectSpecResult" :localdata="item.value">
+										</uni-data-checkbox>
+
+								</view>
+
+							</view>
+							<view class="u-p-b-16"></view>
+						</view>
+					</view>
+
+
+				</uni-forms>
+
+				<view>
+					<view class="block u-m-b-0 u-m-t-32" v-for="(item,index) in FormData.result" :key="index">
+						<uni-forms :model="item.skus" :rules="rules" :ref="setFormRef(index)" err-show-type="undertext"
+							validateTrigger="blur" :border="true" :label-width="130">
+
+							<view class="">
+								<view class="u-m-t-20 u-p-b-24 border-bottom" v-for="(val,key) in item.names"
+									:key="key">
+									<view class="font-bold u-m-r-12">
+										{{key}}
+									</view>
+									<view class="u-m-t-16 color-666 u-font-24">{{val}}</view>
+								</view>
+							</view>
+							<view class="u-m-t-24">
+								<view label="">
+									<view class="font-bold">
+										图片
+									</view>
+									<view class="u-m-t-16">
+										<my-upload-file @change="changeResultCover($event,index)" :limit="1"
+											:imageStyles="imageStyles" :ref="setRefFile(index)"
+											:images="item.coverImg"></my-upload-file>
+									</view>
+								</view>
+							</view>
+							<view class="skus u-m-t-24">
+								<view class="">
+									<uni-forms-item label="售价" required name="salePrice">
+										<uni-easyinput @blur="priceFormat(item.skus,'salePrice')"
+											:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
+											:inputBorder="inputBorder" v-model="item.skus.salePrice" type="digit"
+											placeholder="请输入售价（元）" />
+									</uni-forms-item>
+								</view>
+
+								<uni-forms-item label="会员价（元）" required name="memberPrice">
+									<uni-easyinput @blur="priceFormat(item.skus,'memberPrice')"
+										:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
+										:inputBorder="inputBorder" v-model="item.skus.memberPrice" type="digit"
+										placeholder="请输入会员价（元）" />
+								</uni-forms-item>
+								<uni-forms-item label="成本价（元）" required name="costPrice">
+									<uni-easyinput @blur="priceFormat(item.skus,'costPrice')"
+										:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
+										:inputBorder="inputBorder" v-model="item.skus.costPrice" type="digit"
+										placeholder="请输入成本价（元）" />
+								</uni-forms-item>
+								<uni-forms-item label="原价（元）" required name="originPrice">
+									<uni-easyinput @blur="priceFormat(item.skus,'originPrice')"
+										:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
+										:inputBorder="inputBorder" v-model="item.skus.originPrice" type="digit"
+										placeholder="请输入原价（元）" />
+								</uni-forms-item>
+								<uni-forms-item label="起售数量" required name="suit">
+									<uni-easyinput @blur="priceFormat(item.skus,'suit')" :paddingNone="inputPaddingNone"
+										:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+										v-model="item.skus.suit" type="digit" placeholder="请输入起售数量" />
+								</uni-forms-item>
+								<!-- <view class="u-relative">
+									<uni-forms-item label="库存数量" required>
+										<uni-easyinput :disabled="disabledStock"
+											@blur="priceFormat(item.skus,'stockNumber')" :paddingNone="inputPaddingNone"
+											:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+											v-model="item.skus.stockNumber" type="digit" placeholder="请输入库存数量" />
+									</uni-forms-item>
+									<view class="u-absolute position-all" v-if="disabledStock"
+										@click="canEditGoodsStock(true)">
+									</view>
+								</view> -->
+
+								<uni-forms-item label="分销金额" required>
+									<uni-easyinput @blur="priceFormat(item.skus,'firstShared')"
+										:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
+										:inputBorder="inputBorder" v-model="item.skus.firstShared" type="digit"
+										placeholder="请输入分销金额" />
+								</uni-forms-item>
+								<uni-forms-item label="商品条码" required>
+									<view class="bg-gray u-flex u-col-center u-col-center u-p-l-24" style="height: 72rpx;background: #F6F6F6;border-radius: 8rpx ;">
+										<uni-easyinput disabled :paddingNone="inputPaddingNone"
+											:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
+											v-model="item.skus.barCode" placeholder="请输入商品条码" />
+									</view>
+									
+								</uni-forms-item>
+
+							</view>
+						</uni-forms>
+					</view>
+				</view>
+			</view>
+
+		</view>
+
+		<view :style="{height:bottomHeight+'px'}"></view>
+		<view class="safe-bottom fixed">
+			<view class="btn">
+				<up-button @click="save" shape="circle" type="primary" >
+					<view class=" font-bold">
+						保存
+					</view>
+				</up-button>
+				<!-- <button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button> -->
+				<view class="u-m-t-20">
+					<button class="save-btn edit-btn" hover-class="btn-hover-class" @click="fastEditShow">
+						<view class="u-flex u-row-center">
+							<view class="u-m-r-6">批量修改</view>
+							<up-icon name="edit-pen" :color="color.ColorMain"></up-icon>
+						</view>
+					</button>
+				</view>
+			</view>
+
+		</view>
+
+		<pop-fast-edit @update="updateSkuKey" v-model:show="fastEdit.show"></pop-fast-edit>
+	</view>
+</template>
+<script setup>
+	import {
+		getSafeBottomHeight
+	} from '@/commons/utils/safe-bottom.js'
+	import {
+		formatPrice
+	} from "@/commons/utils/format.js";
+	import popFastEdit from "./components/fast-edit.vue"
+	import infoBox from '@/commons/utils/infoBox.js'
+	import dayjs from "dayjs";
+	import go from '@/commons/utils/go.js';
+	import color from '@/commons/color.js';
+	import {
+		$types,
+		$defaultSku
+	} from '@/commons/goodsData.js'
+	import {
+		$productSpec
+	} from '@/http/yskApi/goods.js';
+	import {
+		onLoad,
+		onReady,
+		onShow
+	} from '@dcloudio/uni-app';
+	import {
+		onMounted,
+		reactive,
+		nextTick,
+		ref,
+		onBeforeMount,
+		watch
+	} from 'vue';
+	import {
+		hasPermission
+	} from '@/commons/utils/hasPermission.js';
+
+	let bottomHeight = ref(100)
+	onReady(() => {
+		getSafeBottomHeight('safe-bottom').then(res => {
+			console.log(res);
+			bottomHeight.value = res
+		})
+	})
+	const refFiles = ref([]);
+	const imageStyles = reactive({
+		width: 82,
+		height: 82,
+		border: {
+			radius: '4px'
+		}
+	})
+	//绑定文件上传元素
+	function setRefFile(index) {
+		refFiles.value[index] = null;
+		return (el) => {
+			if (el) {
+				refFiles.value[index] = el;
+			}
+		};
+	}
+
+	const fastEdit = reactive({
+		show: false,
+		list: [{
+				text: '会员价',
+				key: 'memberPrice',
+				value: ''
+			},
+			{
+				text: '成本价',
+				key: 'costPrice',
+				value: ''
+			},
+			{
+				text: '原价',
+				key: 'originPrice',
+				value: ''
+			},
+			{
+				text: '起售数量',
+				key: 'suit',
+				value: ''
+			},
+			{
+				text: '库存数量',
+				key: 'stockNumber',
+				value: ''
+			},
+			{
+				text: '分销金额',
+				key: 'firstShared',
+				value: ''
+			}
+		],
+		sel: ''
+	})
+
+	function fastEditShow() {
+		fastEdit.show = true
+	}
+	//上个页面传来的参数
+	let option = {}
+
+
+
+	//number类型数据限制
+	function priceFormat(item, key) {
+		nextTick(() => {
+			let min = 0;
+			let max = 100000000;
+			console.log(item[key]);
+			if (key == 'suit') {
+				min = 1
+			}
+			const newval = formatPrice(item[key], min, max, true)
+			if (typeof newval !== 'number') {
+				item[key] = newval.value
+				uni.showToast({
+					title: `请输入${min}到${max}范围内的数字`,
+					icon: 'none'
+				})
+			} else {
+				item[key] = newval
+			}
+		})
+	}
+
+
+
+	function updateSkuKey(arr) {
+		for (let i in FormData.result) {
+			const sku = FormData.result[i].skus
+			for (let k in arr) {
+				const item = arr[k]
+				if (sku.hasOwnProperty(item.key)) {
+					sku[item.key] = item.value
+				}
+			}
+
+		}
+	}
+
+	const inputPaddingNone = ref(true)
+	const form = ref(null)
+	const originSpecMap = {}
+	const FormData = reactive({
+		specId: '',
+		specItem: '',
+		result: [],
+		selectSpec: [],
+	})
+	//表单相关事件
+	function changeResultCover(val, index) {
+		FormData.result[index].coverImg = val
+		console.log(FormData.result[index]);
+	}
+	const formRefs = ref([]);
+	//绑定表单元素
+	function setFormRef(index) {
+		formRefs.value[index] = null;
+		return (el) => {
+			if (el) {
+				formRefs.value[index] = el;
+			}
+		};
+	}
+	watch(() => FormData.specId, (newval) => {
+		FormData.result = []
+	})
+	const bottom = ref(null)
+	// 表单样式
+	const placeholderStyle = ref('font-size:28rpx;')
+	//表单边框
+	const inputBorder = ref(false)
+
+	//生成笛卡尔集
+
+	function combineSpecs(specs) {
+		if (specs.length === 0) {
+			return [
+				[]
+			];
+		} else {
+			const [head, ...tail] = specs;
+			const rest = combineSpecs(tail);
+			const pairs = head.value.map(value => rest.map(r => {
+				return {
+					[head.name]: value,
+					...r
+				}
+			}));
+			return [].concat(...pairs);
+		}
+	};
+	const defaultSku = reactive({
+		...$defaultSku,
+		shopId: uni.getStorageSync('shopId'),
+		coverImg: '',
+		productId: option.productId,
+		barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
+	})
+
+	function returnDefaultSku() {
+		const randomNumber = Math.floor(Math.random() * 1000)
+		return {
+			...defaultSku,
+			productId: option.productId,
+			barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()-randomNumber}`
+		}
+	}
+
+	function createResult() {
+		let arr = []
+		// for(let i in FormData.selectSpec){
+		// 	const selectSpecResult=FormData.selectSpec[i].selectSpecResult
+		// 	if(selectSpecResult.length>0){
+		// 		arr.push({
+		// 			value: selectSpecResult,
+		// 			name: FormData.selectSpec[i].name
+		// 		})
+		// 	}
+		// }
+		for (let k of FormData.selectSpec) {
+			if (k.selectSpecResult.length) {
+				console.log(k.selectSpecResult.length);
+				arr.push({
+					value: k.selectSpecResult,
+					name: k.name
+				})
+			}
+		}
+		console.log(arr);
+		const spes = combineSpecs(arr)
+		console.log(spes);
+		const result = spes.filter(v => {
+			return !Array.isArray(v)
+		}).map(v => {
+			const specSnap = returnSpecSnap(v)
+			const data = originSpecMap[specSnap]
+			const skus = returnDefaultSku()
+			const newdata = {
+				names: v,
+				specSnap,
+				skus
+			}
+			return data || newdata
+		})
+		FormData.result = result
+	}
+
+
+
+	function specIdChange(e) {
+		console.log(e);
+		const item = FormData.specList.find(v => v.id === FormData.specId)
+		FormData.selectSpec = (item.specList || [])
+
+	}
+	//获取规格数据
+	function getTbProductSpec() {
+		$productSpec.get({
+			page: 0,
+			size: 200,
+			sort: "id"
+		}).then(res => {
+			FormData.specList = res.content.map(item => {
+				return {
+					...item,
+					specList: item.specList.map(spe => {
+						return {
+							...spe,
+							selectSpecResult: [],
+							value: spe.value.map(v => {
+								return {
+									text: v,
+									value: v
+								}
+							})
+						}
+					})
+				}
+			})
+		})
+	}
+
+
+	//表单验证
+	const rules = {
+		salePrice: {
+			rules: [{
+				required: true,
+				errorMessage: '售价必填'
+			}]
+		},
+		memberPrice: {
+			rules: [{
+				required: true,
+				errorMessage: '会员价必填'
+			}]
+		},
+		costPrice: {
+			rules: [{
+				required: true,
+				errorMessage: '成本价必填'
+			}]
+		},
+		originPrice: {
+			rules: [{
+				required: true,
+				errorMessage: '原价必填'
+			}]
+		},
+		suit: {
+			rules: [{
+					required: true,
+					errorMessage: '起售数量必填'
+				},
+				{
+					validateFunction: function(rule, value, data, callback) {
+						if (value < 1) {
+							callback('起售数量至少为1个')
+						}
+						return true
+					}
+				}
+			]
+		}
+	}
+
+
+
+
+	//页面滚动到最底部
+	function scrollPageBottom() {
+		nextTick(() => {
+			uni.pageScrollTo({
+				duration: 100, // 过渡时间
+				scrollTop: 100000, // 滚动的实际距离
+			})
+		})
+	}
+
+
+
+
+
+	let emitName = ''
+
+	function triggerEvent(emitName, data) {
+		if (emitName) {
+			uni.$emit(emitName, data)
+		}
+	}
+
+
+	//生成name
+	function returnSpecSnap(names) {
+		const specSnap = Object.keys(names).reduce((prve, cur) => {
+			return prve + names[cur] + ','
+		}, '')
+		return specSnap.substring(0, specSnap.length - 1)
+	}
+	// 允许修改商品库存
+	let disabledStock = ref(false)
+	async function canEditGoodsStock(tips = false) {
+		console.log(tips);
+		if (option.type === 'edit') {
+			const res = await hasPermission({
+				text: '允许修改商品库存',
+				tips: tips
+			})
+			disabledStock.value = !res
+		}
+	}
+
+	onShow(() => {
+		canEditGoodsStock()
+	})
+
+	onLoad(opt => {
+		Object.assign(option, opt)
+		getTbProductSpec()
+		const obj = uni.getStorageSync('guige')
+		if (obj && JSON.stringify(obj) !== '{}') {
+			console.log(obj.selectSpec);
+			option.productId = opt.productId
+			Object.assign(FormData, obj)
+			for (let i of obj.result) {
+				const key = returnSpecSnap(i.names)
+				originSpecMap[key] = i
+			}
+			nextTick(() => {
+				FormData.result = obj.result
+				console.log(FormData.result);
+			})
+		}
+		console.log(opt);
+		if (opt && JSON.stringify(opt) !== '{}' && opt.emitName) {
+			emitName = opt.emitName
+		}
+
+	})
+
+	function emitspecificationsSave() {
+		// emitspecificationsSave  触发规格保存事件将数据给到添加商品页面
+		// guigeEdit  触发规格保存事件将数据给到添加规格页面
+		uni.removeStorageSync('guige')
+		triggerEvent(emitName, FormData)
+		go.back()
+	}
+
+	function returnPromise(prosise) {
+		return new Promise((resolve, reject) => {
+			prosise.then(res => {
+				resolve({
+					sucees: true
+				})
+			}).catch(err => {
+				console.log(err);
+				if (err.length >= 1) {
+					infoBox.showToast(err[0].errorMessage)
+				}
+				resolve({
+					sucees: false
+				})
+			})
+		})
+	}
+	async function save() {
+		if (!FormData.result.length) {
+			return infoBox.showToast('请先选择规格！')
+		}
+		let isAllPassForm = 0
+		for (let i in FormData.result) {
+			const res = await returnPromise(formRefs.value[i].validate(), i)
+			isAllPassForm += res.sucees ? 1 : 0
+		}
+		if (isAllPassForm < FormData.result.length) {
+			return
+		}
+		//判断验证是否通过
+		console.log('pass');
+		const item = FormData.specList.find(v => v.id === FormData.specId)
+		FormData.specsInfoName = item ? item.name : ''
+		console.log(FormData);
+		emitspecificationsSave()
+
+	}
+</script>
+<style scoped>
+	page {
+		background: #F9F9F9;
+	}
+</style>
+<style lang="scss" scoped>
+	$icon-size: 34rpx;
+	$icon-line-width: 20rpx;
+	$icon-line-height: 4rpx;
+
+	::v-deep.uni-forms-item__content {
+		margin: auto;
+	}
+
+	::v-deep .uni-forms-item--border {
+		padding-top: 24rpx;
+		padding-bottom: 24rpx;
+	}
+
+	::v-deep.uni-forms-item {
+		min-height: inherit;
+	}
+
+	.page {
+		background: #F9F9F9;
+		padding: 30rpx 30rpx 0 30rpx;
+	}
+
+	.safe-bottom {
+		padding: 34rpx 28rpx;
+		position: fixed;
+		background-color: #fff;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 10;
+
+		.btn {
+			padding: 0 88rpx 56rpx 88rpx;
+		}
+	}
+
+	.my-switch {
+		transform: scale(0.7);
+	}
+	::v-deep .uni-data-checklist .checklist-group .checklist-box .checkbox__inner{
+		border-radius: 50%;
+	}
+
+	::v-deep .uni-forms-item__error {
+		display: none !important;
+	}
+
+	::v-deep .option .uni-forms-item {
+		padding: 0;
+		min-height: inherit;
+		background-color: transparent;
+		border-top: none;
+	}
+
+	.icon {
+		width: $icon-size;
+		height: $icon-size;
+		position: relative;
+		border-radius: 50%;
+
+		&:before,
+		&::after {
+			position: absolute;
+			display: block;
+			content: '';
+			background-color: #fff;
+		}
+	}
+
+	.icon-add {
+		background-color: $my-main-color;
+
+		&::before {
+			width: $icon-line-height;
+			height: $icon-line-width;
+			top: calc(($icon-size /2) - ($icon-line-width / 2));
+			left: calc(($icon-size /2) - ($icon-line-height / 2));
+		}
+
+		&::after {
+			width: $icon-line-width;
+			height: 4rpx;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	::v-deep .uni-easyinput__content-input {
+		height: inherit;
+	}
+
+	.icon-reduce {
+		background-color: $my-red-color;
+
+		&::after {
+			width: $icon-line-width;
+			height: $icon-line-height;
+			top: calc(($icon-size /2) - ($icon-line-height / 2));
+			left: calc(($icon-size /2) - ($icon-line-width / 2));
+		}
+	}
+
+	.label-title {
+		font-size: 28rpx;
+		font-weight: bold;
+		font-family: Source Han Sans CN, Source Han Sans CN;
+	}
+
+	.lh40 {
+		line-height: 40rpx;
+	}
+
+	.box {
+		// margin-top: 70rpx;
+		font-size: 28rpx;
+
+		.block {
+			background: #FFFFFF;
+			border-radius: 18rpx 18rpx 18rpx 18rpx;
+			padding: 12rpx 24rpx;
+			margin-bottom: 32rpx;
+		}
+	}
+
+	.save-btn-box {
+		position: fixed;
+		left: 30rpx;
+		right: 30rpx;
+		bottom: 60rpx;
+		z-index: 100;
+	}
+
+	::v-deep.uni-forms-item {
+		align-items: inherit;
+	}
+
+	::v-deep .uni-forms-item .uni-forms-item__label {
+		text-indent: 0;
+		font-size: 28rpx !important;
+		font-weight: bold;
+		color: #333;
+	}
+
+	::v-deep .border-top-0 .uni-forms-item.is-direction-top {
+		border-color: transparent !important;
+	}
+
+	.save-btn {
+		background-color: $my-main-color;
+		color: #fff;
+		border-radius: 12rpx;
+		font-size: 28rpx;
+	}
+
+	.edit-btn {
+		background-color: #fff;
+		color: #333;
+		border-radius: 12rpx;
+		font-size: 28rpx;
+	}
+
+	.btn-hover-class {
+		opacity: .6;
+	}
+
+	.zuofa {
+		padding: 28rpx 0;
+		background: #F9F9F9;
+		padding-left: 42rpx;
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+	}
+
+	.fast-edit {
+		.item {
+			color: #333;
+			border: 1px solid #bbb;
+			padding: 4rpx 10rpx 8rpx 10rpx;
+			border-radius: 10rpx;
+			min-width: 186rpx;
+
+			&.active {
+				color: $my-main-color;
+			}
+		}
+	}
+
+	::v-deep .uni-input-placeholder {
+		font-size: 28rpx;
+	}
+
+	.option {
+		padding: 26rpx 30rpx 24rpx 24rpx;
+		background: #F9F9F9;
+	}
+
+	.option-item {
+		margin-bottom: 34rpx;
+	}
+</style>

pageProduct/add-specifications/components/fast-edit.vue

@@ -0,0 +1,160 @@
+<template>
+	<up-popup :show="popShow" @close="close" @open="open" mode="center" :round="9">
+		<view class="u-p-32 box u-font-28">
+			<view class="u-flex u-relative u-row-center">
+				<view class="u-font-32">快速修改</view>
+				<view class="u-absolute close">
+					<up-icon @click="close" :size="16" color="#000" name="close-circle-fill"></up-icon>
+				</view>
+			</view>
+			<view class="u-m-t-36">
+				<scroll-view scroll-y="true" style="max-height: 70vh;">
+					<view class="u-m-b-32" v-for="(item,index) in list" :key="index">
+						<view>{{item.text}}：</view>
+						<view class="u-m-t-16">
+							<up-input v-model="item.value">
+								<template #suffix>
+									<up-button @click="itemClick(item)" type="primary" text="修改" size="mini"></up-button>
+								</template>
+							</up-input>
+						</view>
+					</view>
+				</scroll-view>
+				
+
+				<view class="u-m-t-60">
+					<my-button type="primary" shape="circle" @tap="save">
+						<view class="u-font-32">
+							修改
+						</view>
+					</my-button>
+
+				</view>
+			</view>
+		</view>
+	</up-popup>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref,
+		watch,
+		onMounted,
+		computed
+	} from 'vue';
+	import {
+		returnSkuSnap,
+		returnTypeEnum,
+		returnCategory
+	} from '@/pageProduct/util.js'
+	import {
+		$tbShopUnit
+	} from '@/http/yskApi/goods.js'
+	const props = defineProps({
+		show: {
+			type: Boolean,
+			default: false
+		}
+	})
+	const arr = [
+		{
+			text: '售价',
+			key: 'salePrice',
+			value: ''
+		},
+		{
+			text: '会员价',
+			key: 'memberPrice',
+			value: ''
+		},
+		{
+			text: '成本价',
+			key: 'costPrice',
+			value: ''
+		},
+		{
+			text: '原价',
+			key: 'originPrice',
+			value: ''
+		},
+		{
+			text: '起售数量',
+			key: 'suit',
+			value: 1
+		},
+		// {
+		// 	text: '库存数量',
+		// 	key: 'stockNumber',
+		// 	value: ''
+		// },
+		{
+			text: '分销金额',
+			key: 'firstShared',
+			value: ''
+		}
+	]
+	const list = ref([...arr])
+
+	function changeShowRecoders(show) {
+		recoders.show = show
+	}
+
+	const data = ref(props.item)
+	const emits = defineEmits(['update:show', 'update','itemClick'])
+	const form = reactive({
+		note: ''
+	})
+	let popShow = ref(props.show)
+	
+	function itemClick(item){
+		console.log(item);
+		emits('update',[item])
+	}
+	
+
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+		if (newval) {
+			data.value = props.item
+		}
+	})
+	const isSku = computed(() => {
+		// return data.value.typeEnum == '多规格'
+		return false
+	})
+	watch(() => popShow.value, (newval) => {
+		emits('update:show', newval)
+	})
+
+	function close() {
+		popShow.value = false
+		list.value=[...arr]
+	}
+
+	function open() {
+
+	}
+
+	function save() {
+		emits('update',list.value)
+		popShow.value = false
+	}
+</script>
+
+<style lang="scss" scoped>
+	.box {
+		width: 556rpx;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		box-sizing: border-box;
+	}
+
+	.close {
+		position: absolute;
+		right: 0;
+	}
+
+	.number {
+		color: #EE4646;
+	}
+</style>

pageProduct/components/my-tabs.vue

@@ -0,0 +1,44 @@
+<template>
+	<view class="u-flex tabs">
+		<view class="u-flex-1 u-text-center item"
+		 :class="{active:index===current}"
+		 @tap="changeCurrent(index)" v-for="(item,index) in props.list" :key="index">
+			{{item}}
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue';
+	const props=defineProps({
+		list:{type:Array}
+	})
+	const emit=defineEmits(['change'])
+	let current=ref(0)
+	function changeCurrent(index){
+		current.value=index
+	}
+	watch(()=>current.value,()=>{
+		emit('change',current.value)
+	})
+</script>
+
+<style lang="scss" scoped>
+	.tabs{
+		padding: 4rpx 10rpx;
+		background: #E6F0FF;
+		border-radius: 16rpx 16rpx 16rpx 16rpx;
+		font-family: Source Han Sans CN, Source Han Sans CN;
+		font-size: 28rpx;
+		color: #318AFE;
+		.item{
+			padding: 8rpx 0;
+			transition: all .3s ease-in-out;
+		}
+		.item.active{
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+			background-color: $my-main-color;
+			color: #fff;
+		}
+	}
+</style>

pageProduct/goodsData.js

@@ -0,0 +1,74 @@
+import dayjs from "dayjs";
+export const $types = [{
+		title: "计量商品",
+		desc: '单价购买',
+		value: 'normal'
+	},
+	{
+		title: "多规格",
+		desc: '多种不同规格',
+		value: 'sku'
+	},
+	{
+		title: "套餐组合",
+		desc: '选择多种组合',
+		value: 'group'
+	},
+	{
+		title: "称重商品",
+		desc: '按重量售卖',
+		value: 'weight'
+	},
+	{
+		title: "时价商品",
+		desc: '收银端可更改价格',
+		value: 'currentPrice'
+	}
+]
+
+// 商品默认sku
+export const $defaultSku = {
+	salePrice: '',
+	memberPrice: '',
+	costPrice: '',
+	originPrice: '',
+	// stockNumber: '',
+	firstShared: '',
+	suit: 1,
+	barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`,
+}
+
+
+// 库存记录筛选类型
+export const $invoicingType = [{
+		text: '全部',
+		value: ''
+	},
+	{
+		text: '供应商入库',
+		value: 'purveyor'
+	},
+	{
+		text: '供应商退货',
+		value: 'reject'
+	},
+	{
+		text: '其他入库',
+		value: 'purchase'
+	},
+	{
+		text: '其他出库',
+		value: 'other-out'
+	}
+]
+
+// 页面常用数据
+export const $pageData = {
+	query: {
+		page: 0,
+		size: 10
+	},
+	totalElements: 0,
+	list: [],
+	hasAjax: false,
+}

pageProduct/index/components/baosun.vue

@@ -0,0 +1,149 @@
+<template>
+	<up-popup :show="popShow" @close="close" @open="open" mode="center" :round="9" :zIndex="999">
+		<view class="u-p-32 box u-font-28">
+			<view class="u-flex u-relative u-row-center">
+				<view class="u-font-32">报损</view>
+				<view class="u-absolute close">
+					<up-icon @click="close" :size="16" color="#000" name="close-circle-fill"></up-icon>
+				</view>
+			</view>
+			<view class="u-m-t-48">
+				<view>商品名称</view>
+				<view class="u-m-t-16 color-999" style="">{{data.name}}</view>
+				<view class="u-m-t-38">
+					<view class="u-m-b-32">
+						<view class="u-flex ">
+							报损数量
+						</view>
+						<view class="u-m-t-16">
+							<up-input v-model="form.stockNumber" type="number">
+								<!-- <template #suffix>
+									<view>{{data.unitName}}</view>
+								</template> -->
+							</up-input>
+						</view>
+					</view>
+					<view class="u-m-b-32">
+						<view class="u-flex u-row-between">
+							<view>备注</view>
+						</view>
+						<view class="u-m-t-16">
+							<up-textarea :height="42" v-model="form.remark" placeholder="请输入备注"></up-textarea>
+						</view>
+					</view>
+					<view class="u-m-b-32">
+						<view class="u-flex u-row-between">
+							<view>上传图片</view>
+						</view>
+						<view class="u-m-t-16">
+							<my-up-upload :maxCount="1" :multiple="false" v-model="form.coverImg"></my-up-upload>
+						</view>
+					</view>
+					<view class="u-m-t-60">
+						<my-button type="primary" shape="circle" @tap="save">
+							<view class="u-font-32">
+								保存
+							</view>
+						</my-button>
+					</view>
+				</view>
+			</view>
+		</view>
+	</up-popup>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref,
+		watch,
+		onMounted
+	} from 'vue';
+	import {
+		returnSkuSnap,
+		returnTypeEnum,
+		returnCategory
+	} from '@/pageProduct/util.js'
+	import {
+		$frmLoss
+	} from '@/http/yskApi/goods.js'
+	import infoBox from '@/commons/utils/infoBox.js'
+	const props = defineProps({
+		show: {
+			type: Boolean,
+			default: false
+		},
+		category: {
+			type: Array,
+			default: () => []
+		},
+		goods: {
+			type: Object,
+			default: () => {
+				skuList: []
+			}
+		}
+	})
+	const data = ref(props.goods)
+	const emits = defineEmits(['update:show', 'save'])
+	const form = reactive({
+		remark: '',
+		stockNumber: 1,
+		coverImg: []
+	})
+	let popShow = ref(props.show)
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+		if (newval) {
+			data.value = props.goods
+		}
+	})
+	watch(() => popShow.value, (newval) => {
+		emits('update:show', newval)
+	})
+
+	function close() {
+		popShow.value = false
+	}
+
+	function open() {
+
+	}
+
+	async function save() {
+		if (form.stockNumber <= 0) {
+			return infoBox.showToast('请输入正确的报损数量')
+		}
+		if (!form.remark) {
+			return infoBox.showToast('请输入备注')
+		}
+		console.log(form);
+		const res= await $frmLoss({
+			...form,
+			productId:props.goods.id,
+			coverImg:form.coverImg[0]?form.coverImg[0].serveUrl:''
+		})
+		infoBox.showToast('提交成功！')
+		popShow.value=false
+	}
+</script>
+
+<style lang="scss" scoped>
+	::v-deep .u-m-t-16 .u-textarea{
+		border-width: 1px!important;
+	}
+	.box {
+		width: 556rpx;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		box-sizing: border-box;
+	}
+
+	.close {
+		position: absolute;
+		right: 0;
+	}
+
+	.number {
+		color: #EE4646;
+	}
+</style>

pageProduct/index/components/category - 副本 (2).vue

@@ -0,0 +1,120 @@
+<template>
+	<view>
+		<view class="category " :style="getCompouteStyle()">
+			<scroll-view scroll-y="true" :style="{height:props.height+'rpx'}">
+				<view class="list">
+					<view v-if="showAllText" class="font-bold item border-bottom u-font-28" @tap="cateClick({id:'',name:'全部分类'})">全部分类</view>
+					<view  v-for="(item,index) in category.list" :key="index">
+						<view class="item font-bold border-bottom"  @tap="cateClick(item)">
+							{{item.name}}
+						</view>
+							<view class="item border-bottom"  @tap="cateClick(child)" 
+							v-for="(child,childIndex) in item.childrenList"
+							 :key="childIndex"  >
+								<text>&nbsp;&nbsp;</text>
+								{{child.name}}
+							</view>
+						
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref, warn, watch, watchEffect,
+		onMounted,reactive
+	} from 'vue';
+	import {$tbShopCategory} from '@/http/yskApi/goods.js'
+	const emite=defineEmits(['cateClick','change'])
+	const props = defineProps({
+		showAllText:{
+			type:Boolean,
+			default:true
+		},
+		width: {
+			type: [Number, String],
+			default: 264
+		},
+		height: {
+			type: [Number, String],
+			default: 420
+		},
+		right: {
+			type: [Number, String],
+			default: 30
+		},
+		bottom: {
+			type: [Number, String],
+			default: 0
+		}
+	})
+	let show = ref(false)
+	
+	watch(()=>show.value,(newval)=>{
+		emite('change',newval)
+	})
+	
+	function open() {
+		show.value = true
+	}
+
+	function close() {
+		show.value = false
+	}
+
+	function toggle() {
+		show.value = !show.value
+	}
+	
+	function cateClick(item){
+		emite('cateClick',item)
+		close()
+	}
+	
+	function getCompouteStyle() {
+		return {
+			width: props.width + 'rpx',
+			height: props.height + 'rpx',
+			right: props.right + 'rpx',
+			bottom: props.bottom + 'rpx',
+			transform:`scaleY(${show.value?1:0})`
+		}
+	}
+	const category=reactive({
+		list:[],
+		categoryId:'',
+		categoryName:'',
+		
+	})
+	onMounted(()=>{
+		$tbShopCategory({
+			page:0,size:200
+		}).then(res=>{
+			category.list=res.content
+		})
+	})
+	defineExpose({
+		open,
+		close,toggle
+	})
+</script>
+
+<style lang="scss" scoped>
+	.category {
+		background: #FFFFFF;
+		box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+		position: fixed;
+		font-size: 24rpx;
+		color: #333;
+		.list{
+			box-sizing: border-box;
+			.item{
+				padding: 24rpx 24rpx 24rpx 48rpx;
+			}
+		}
+	}
+</style>

pageProduct/index/components/category - 副本.vue

@@ -0,0 +1,93 @@
+<template>
+	<view>
+		<view class="category " :style="getCompouteStyle()">
+			<scroll-view scroll-y="true" :style="{height:props.height+'rpx'}">
+				<view class="list">
+					<view class="item" @tap="cateClick(item)" v-for="(item,index) in 20" :key="index">
+						分类
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref, warn, watch, watchEffect,
+		onMounted
+	} from 'vue';
+	import {$tbShopCategory} from '@/http/yskApi/goods.js'
+	const emite=defineEmits(['cateClick'])
+	const props = defineProps({
+		width: {
+			type: [Number, String],
+			default: 264
+		},
+		height: {
+			type: [Number, String],
+			default: 420
+		},
+		right: {
+			type: [Number, String],
+			default: 30
+		},
+		bottom: {
+			type: [Number, String],
+			default: 0
+		}
+	})
+	let show = ref(false)
+
+	function open() {
+		show.value = true
+	}
+
+	function close() {
+		show.value = false
+	}
+
+	function toggle() {
+		show.value = !show.value
+	}
+	
+	function cateClick(item){
+		emite('cateClick',item)
+	}
+	
+	function getCompouteStyle() {
+		return {
+			width: props.width + 'rpx',
+			height: props.height + 'rpx',
+			right: props.right + 'rpx',
+			bottom: props.bottom + 'rpx',
+			transform:`scaleY(${show.value?1:0})`
+		}
+	}
+	onMounted(()=>{
+		$tbShopCategory({
+			page:0,size:200
+		})
+	})
+	defineExpose({
+		open,
+		close,toggle
+	})
+</script>
+
+<style lang="scss" scoped>
+	.category {
+		background: #FFFFFF;
+		box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+		position: fixed;
+		font-size: 24rpx;
+		color: #333;
+		.list{
+			box-sizing: border-box;
+			.item{
+				padding: 24rpx 24rpx 24rpx 48rpx;
+			}
+		}
+	}
+</style>

pageProduct/index/components/category.vue

@@ -0,0 +1,106 @@
+<template>
+	<up-picker :show="show" keyName="name" @confirm="confirm" :columns="category.list" @close="close" @cancel="close" :closeOnClickOverlay="true"></up-picker>
+</template>
+
+<script setup>
+	import {
+		ref, warn, watch, watchEffect,
+		onMounted,reactive
+	} from 'vue';
+	import {$tbShopCategory} from '@/http/yskApi/goods.js'
+	const emite=defineEmits(['change','update:isShow','confirm'])
+	const props = defineProps({
+		showAllText:{
+			type:Boolean,
+			default:true
+		},
+		width: {
+			type: [Number, String],
+			default: 264
+		},
+		height: {
+			type: [Number, String],
+			default: 420
+		},
+		right: {
+			type: [Number, String],
+			default: 30
+		},
+		bottom: {
+			type: [Number, String],
+			default: 0
+		},
+		isShow:{
+			type:Boolean,
+			default:false
+		}
+	})
+	
+	let show = ref(props.isShow)
+	
+	watch(()=>show.value,(newval)=>{
+		emite('change',newval)
+		emite('update:isShow',newval)
+	})
+	watch(()=>props.isShow,(newval)=>{
+		console.log(newval);
+		show.value=newval
+	})
+	
+	function confirm(e){
+		console.log(e.value[0]);
+		show.value = false
+		emite('confirm',e.value[0])
+	}
+	function close() {
+		console.log('close');
+		show.value = false
+	}
+	
+	
+	const category=reactive({
+		list:[],
+	})
+	onMounted(()=>{
+		$tbShopCategory({
+			page:0,size:200
+		}).then(res=>{
+			res.content.unshift({
+				name:'全部',
+				id:'',
+				childrenList:[]
+			})
+			category.list=[res.content.reduce((prve, cur) => {
+				prve.push(...[{
+					...cur,
+					name: '' + cur.name,
+					childrenList:undefined
+				}, ...cur.childrenList.map(v => {
+					return {
+						...v,
+						name: '' + v.name
+					}
+				})])
+				return prve
+			}, [])]
+			console.log(category.list);
+		})
+	})
+</script>
+
+<style lang="scss" scoped>
+	.category {
+		background: #FFFFFF;
+		box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+		position: fixed;
+		font-size: 24rpx;
+		color: #333;
+		.list{
+			box-sizing: border-box;
+			.item{
+				padding: 24rpx 24rpx 24rpx 48rpx;
+			}
+		}
+	}
+</style>

pageProduct/index/components/control.vue

@@ -0,0 +1,166 @@
+<template>
+	<view class="control" :style="getComputedStyle()">
+		<view class="u-flex control1" v-if="showControl1">
+			<!-- <view class="btn" @click="changeShowControl1">批量管理</view> -->
+			<view class="btn add font-bold u-font-28 color-fff" @tap="go.to('PAGES_PRODUCT_ADD')">商品添加</view>
+			<!-- <view class="color-999 btn u-flex u-row-center" @click="emitToggleCategory">
+				<text class="u-m-r-10">{{categoryName||'选择分类'}}</text>
+				<view class="arrow-down" :class="{'up':categoryShow}">
+					<uni-icons type="right" size="16" color="#999"></uni-icons>
+				</view>
+			</view> -->
+		</view>
+		<view class="u-flex control2 u-row-between" v-else>
+			<view class="u-flex btn">
+				<view class="u-m-r-58">
+					<label class="radio" @click="changeIsSelectAll">
+						<radio class="scale7" @tap.stop="changeIsSelectAll" :color="ColorMain"  value="" :checked="isSelectAll" />
+						<text>全选</text>
+					</label>
+				</view>
+				<view class="u-p-l-30 u-p-r-30 my-bg-main" @click="changeShowControl1">取消</view>
+				<view class="u-p-l-60 u-p-r-60 borde-r" @click="offShelf">下架</view>
+			</view>
+			<view class=" u-flex u-row-center btn" @click="emitToggleCategory">
+				<text class="u-m-r-10">分类至</text>
+				<uni-icons type="right" size="16" color="#fff"></uni-icons>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {$tbShopCategory} from '@/http/yskApi/goods.js'
+	import go from '@/commons/utils/go.js';
+	import {ColorMain} from '@/commons/color.js'
+	import {
+		onMounted,
+		reactive,
+		ref
+	} from 'vue';
+	const props = defineProps({
+		bottom: {
+			type: [Number, String],
+			default: 30
+		},
+		categoryName:{
+			type:String,
+			default:''
+		},
+		categoryShow:{
+			type:Boolean,
+			default:false
+		}
+	})
+	
+
+	let showControl1 = ref(true)
+	const emits = defineEmits(['toggleCategory','controlChange','allCheckedChange','offShelf','categoryChange'])
+
+	function emitToggleCategory() {
+		emits('toggleCategory')
+	}
+
+	function changeShowControl1() {
+		showControl1.value = !showControl1.value
+		emits('controlChange',!showControl1.value)
+	}
+
+	let isSelectAll = ref(false)
+
+	function changeIsSelectAll() {
+		isSelectAll.value = !isSelectAll.value
+		emits('allCheckedChange',isSelectAll.value)
+	}
+
+	function getComputedStyle() {
+		return {
+			bottom: props.bottom + 'rpx'
+		}
+	}
+	//设置是否全选
+	function setisSelectAll(checked){
+		isSelectAll.value =checked
+	}
+	defineExpose({
+		setisSelectAll
+	})
+	
+	//下架
+	function offShelf(){
+		emits('offShelf')
+	}
+</script>
+
+<style lang="scss" scoped>
+	.scale7 {
+		transform: scale(0.7);
+	}
+	.add{
+		background-color: $my-main-color;
+		border-radius: 100rpx;
+		overflow: hidden;
+	}
+	.borde-r {
+		position: relative;
+
+		&::after {
+			display: block;
+			content: '';
+			position: absolute;
+			top: 20rpx;
+			bottom: 20rpx;
+			width: 2px;
+			background-color: #fff;
+			right: 0;
+		}
+	}
+
+	.control {
+		position: fixed;
+		left: 110rpx;
+		right: 110rpx;
+		z-index: 100;
+		background: #3E3A3A;
+		border-radius: 100rpx;
+		overflow: hidden;
+		.btn{
+			color: #fff;
+		}
+		.control1 {
+			.arrow-down {
+				transform: rotate(90deg);
+				transition: all .2s ease-in-out;
+				&.up{
+					transform: rotate(-90deg);
+				}
+			}
+		}
+
+		.control1 .btn:not(:last-child)::after {
+			display: block;
+			content: '';
+			position: absolute;
+			top: 20rpx;
+			bottom: 20rpx;
+			width: 2px;
+			background-color: #fff;
+			right: 0;
+		}
+
+		.control1 .btn {
+			flex: 1;
+		}
+
+		.control1 .btn,
+		.control2 .btn{
+			position: relative;
+			line-height: 76rpx;
+			text-align: center;
+		}
+
+		.control2 {
+			padding: 0 28rpx;
+		}
+	}
+</style>

pageProduct/index/components/edit-guige.vue

@@ -0,0 +1,171 @@
+<template>
+	<up-popup :show="popShow" @close="close" @open="open" mode="center" :round="9">
+		<view class="u-p-32 box u-font-28">
+			<view class="u-flex u-relative u-row-center">
+				<view class="u-font-32">{{data.specSnap}}</view>
+				<view class="u-absolute close">
+					<up-icon @click="close" :size="16" color="#000" name="close-circle-fill"></up-icon>
+				</view>
+			</view>
+			<view class="u-m-t-48">
+				<view class="u-flex u-row-between border-bottom u-p-b-30">
+					<view>当前状态</view>
+					<view class="u-flex u-relative">
+						<up-radio-group v-model="isGrounding" placement="row" @change="isGroundingChange">
+							<up-radio :customStyle="{marginRight: '10px'}" v-for="(item, index) in status.list"
+								:key="index" :label="item.label" :name="item.name">
+							</up-radio>
+						</up-radio-group>
+						<view class="u-absolute position-all" @click="hasShangXiajia(true)" v-if="!canShangXiaJia"></view>
+					</view>
+
+				</view>
+				<view class=" u-flex u-row-between u-m-t-30 u-relative">
+					<view>售罄</view>
+					<up-switch :activeValue="1" :inactiveValue="0" :size="20" @change="isPauseSaleChange" v-model="isPauseSale"></up-switch>
+					<view class="u-absolute position-all" @click="hasShouQing(true)" v-if="!canShouQing"></view>
+				</view>
+			</view>
+		</view>
+	</up-popup>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref,
+		watch
+	} from 'vue';
+	import {
+		returnSkuSnap,
+		returnTypeEnum,
+		returnCategory
+	} from '@/pageProduct/util.js'
+	import {
+		$updateGrounding,
+		$updateProductStatus,$updateProductData,
+		$tbProskuConV2
+	} from '@/http/yskApi/goods.js'
+	import {hasPermission} from '@/commons/utils/hasPermission.js'
+	import infoBox from '@/commons/utils/infoBox.js'
+	const props = defineProps({
+		show: {
+			type: Boolean,
+			default: false
+		},
+		category: {
+			type: Array,
+			default: () => []
+		},
+		goods: {
+			type: Object,
+			default: () => {
+				skuList: []
+			}
+		}
+	})
+	const status = reactive({
+		list: [{
+			name: 1,
+			label: '上架中'
+		}, {
+			name: 0,
+			label: '已下架'
+		}],
+	})
+	// 是否售罄
+	const isPauseSale = ref(0)
+	// 是否上架
+	const isGrounding = ref(1)
+	const data = ref(props.goods)
+	const emits = defineEmits(['update:show', 'save', 'isGroundingChange', 'isPauseSaleChange'])
+	const form = reactive({
+		note: ''
+	})
+	let popShow = ref(props.show)
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+		if (newval) {
+			console.log(props.goods);
+			data.value = props.goods
+			isPauseSale.value = props.goods.isPauseSale 
+			isGrounding.value = props.goods.isGrounding
+		}
+	})
+	watch(() => popShow.value, (newval) => {
+		emits('update:show', newval)
+	})
+
+	function close() {
+		popShow.value = false
+	}
+
+	function open() {
+		hasShangXiajia()
+		hasShouQing()
+	}
+
+	function save() {
+		emits('save')
+	}
+
+	function upDateGoods(par) {
+		return $updateProductData([{
+			id: data.value.id,
+			isSku: 1,
+			shopId: uni.getStorageSync('shopId'),
+			...par
+		}])
+	}
+	
+	let canShangXiaJia=ref(false)
+	async function hasShangXiajia(tips=false){
+		canShangXiaJia.value=await hasPermission({text:'允许上下架商品',tips})
+	}
+	let canShouQing=ref(false)
+	async function hasShouQing(tips=false){
+		canShouQing.value=await hasPermission({text:'允许售罄商品',tips})
+	}
+	
+	async function isGroundingChange(e) {
+		if(!canShangXiaJia.value){
+			return
+		}
+		await upDateGoods({
+			key:'grounding',
+			value: e
+		})
+		emits('isGroundingChange', e)
+		infoBox.showToast('更新成功')
+	}
+
+	async function isPauseSaleChange(e) {
+		if(!canShouQing.value){
+			return
+		}
+		console.log(e);
+		await upDateGoods({
+			key:'pauseSale',
+			value: e
+		})
+		emits('isPauseSaleChange', e)
+		infoBox.showToast('更新成功')
+	}
+</script>
+
+<style lang="scss" scoped>
+	.box {
+		width: 556rpx;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		box-sizing: border-box;
+	}
+
+	.close {
+		position: absolute;
+		right: 0;
+	}
+
+	.number {
+		color: #EE4646;
+	}
+</style>

pageProduct/index/components/edit-price.vue

@@ -0,0 +1,251 @@
+<template>
+	<up-popup :show="popShow" @close="close" @open="open" mode="center" :round="9">
+		<view class="u-p-32 box u-font-28">
+			<view class="u-flex u-relative u-row-center">
+				<view class="u-font-32">修改价格</view>
+				<view class="u-absolute close">
+					<up-icon @click="close" :size="16" color="#000" name="close-circle-fill"></up-icon>
+				</view>
+			</view>
+			<view class="u-m-t-48">
+				<up-form labelPosition="left" :model="data" :rules="rules" ref="refForm">
+					<view>商品名称</view>
+					<view class="u-m-t-16" v-if="isSku">{{data.name}}</view>
+					<view class="u-m-t-38">
+						<template v-if="!isSku">
+							<view class="u-m-b-32">
+								<view class="u-flex u-row-between">
+									<view>{{data.name}}</view>
+									<view class="u-font-24">
+										<text>变动金额：</text>
+										<text class="number">{{data.lowPrice*1-data._lowPrice*1}}</text>
+									</view>
+								</view>
+								<view class="u-m-t-16">
+									<up-input v-model="data.lowPrice" type="number"
+										@change="priceFormat(data,'lowPrice',$event)">
+										<template #suffix>
+											<view>元</view>
+										</template>
+									</up-input>
+								</view>
+							</view>
+							<view class="u-m-b-32">
+								<view class="u-flex u-row-between">
+									<view>备注</view>
+								</view>
+								<view class="u-m-t-16">
+									<up-textarea :height="42" v-model="form.note" placeholder="请输入备注"></up-textarea>
+								</view>
+							</view>
+						</template>
+						<template v-else>
+							<scroll-view scroll-y="true" style="max-height: 50vh;">
+								<view class="u-m-b-32" v-for="(item,index) in data.skuList" :key="index">
+									<view class="u-flex u-row-between">
+										<view>{{item.name}}</view>
+										<view class="u-font-24">
+											<text>变动金额：</text>
+											<text class="number">{{item.lowPrice-item._lowPrice}}</text>
+										</view>
+									</view>
+									<view class="u-m-t-16">
+										<up-input @change="priceFormat(item,'lowPrice',$event)" v-model="item.lowPrice"
+											type="number">
+											<template #suffix>
+												<view>元</view>
+											</template>
+										</up-input>
+									</view>
+								</view>
+								<view class="u-m-b-32">
+									<view class="u-flex u-row-between">
+										<view>备注</view>
+									</view>
+									<view class="u-m-t-16">
+										<up-textarea :height="42" v-model="form.note" placeholder="请输入备注"></up-textarea>
+									</view>
+								</view>
+							</scroll-view>
+						</template>
+
+						<view class="u-m-t-60">
+							<my-button type="primary" shape="circle" @tap="save">
+								<view class="u-font-32">
+									保存
+								</view>
+							</my-button>
+						</view>
+					</view>
+				</up-form>
+			</view>
+		</view>
+	</up-popup>
+</template>
+
+<script setup>
+	import {
+		computed,
+		reactive,
+		ref,
+		watch,
+		nextTick,
+		onMounted
+	} from 'vue';
+	import {
+		returnSkuSnap,
+		returnTypeEnum,
+		returnCategory
+	} from '@/pageProduct/util.js'
+	import {
+		formatPrice
+	} from "@/commons/utils/format.js";
+
+	function priceFormat(item, key, val) {
+		let min = 0;
+		let max = 100000000;
+		const returnNewVal = formatPrice(val, min, max, true)
+		const newval = typeof returnNewVal !== 'number' ? returnNewVal.value : returnNewVal
+		if (typeof returnNewVal !== 'number') {
+			uni.showToast({
+				title: `请输入${min}到${max}范围内的数字`,
+				icon: 'none'
+			})
+		}
+		setTimeout(() => {
+			item[key] = newval
+		}, 100)
+	}
+	const refForm = ref(null)
+
+
+	const props = defineProps({
+		show: {
+			type: Boolean,
+			default: false
+		},
+		category: {
+			type: Array,
+			default: () => []
+		},
+		goods: {
+			type: Object,
+			default: () => {
+				return {
+					lowPrice: 0,
+					skuList: []
+				}
+
+			}
+		}
+	})
+	let data = ref({
+		lowPrice: 0,
+		skuList: []
+	})
+	const rules = {
+		'lowPrice': [{
+				type: 'Number',
+				min: 0,
+				required: true,
+				message: '价格不能小于0',
+				trigger: ['blur', 'change']
+			},
+			{
+				validator: (rule, value, callback) => {
+					return true
+				},
+				message: ''
+			}
+		]
+	}
+	const emits = defineEmits(['update:show', 'save'])
+	const form = reactive({
+		note: ''
+	})
+	let popShow = ref(props.show)
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+		if (newval) {
+			data.value = {
+				...props.goods
+			}
+		}
+	})
+	const isSku = computed(() => {
+		return data.value.typeEnum == '多规格'
+	})
+	watch(() => popShow.value, (newval) => {
+		emits('update:show', newval)
+	})
+
+	function close() {
+		popShow.value = false
+	}
+
+	function open() {
+
+	}
+
+	function save() {
+		refForm.value.validate().then(valid => {
+			if (valid) {
+				emits('save', {
+					...data.value,
+				})
+			} else {
+				console.log(err);
+			}
+		}).catch(() => {
+			// 处理验证错误  
+		});
+
+
+	}
+
+	// function save() {
+	// 	const skuSnap = returnSkuSnap(data.value)
+	// 	let typeEnum = returnTypeEnum(data.value.typeEnum)
+	// 	let lowPrice = undefined
+	// 	typeEnum = typeEnum ? typeEnum : 'normal'
+	// 	const findCategory = returnCategory(data.value.categoryName, props.category)
+	// 	console.log(typeEnum);
+	// 	console.log(findCategory);
+	// 	const categoryId = findCategory ? findCategory.id : ''
+	// 	if (typeEnum == 'normal') {
+	// 		// 单规格
+	// 		lowPrice = data.value.skuList[0].salePrice
+	// 	}
+	// 	emits('save', {
+	// 		...data.value,
+	// 		lowPrice,
+	// 		typeEnum,
+	// 		images: data.value.images ? data.value.images : [data.value.coverImg],
+	// 		categoryId,
+	// 		skuSnap: JSON.stringify(skuSnap)
+	// 	})
+	// }
+	
+	onMounted(()=>{
+		// #ifndef H5
+		refForm.value.setRules(rules)
+		// #endif
+	})
+</script>
+
+<style lang="scss" scoped>
+	.box {
+		width: 556rpx;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		box-sizing: border-box;
+	}
+
+	.close {
+		position: absolute;
+		right: 0;
+	}
+
+	.number {
+		color: #EE4646;
+	}
+</style>

pageProduct/index/components/edit-stock.vue

@@ -0,0 +1,280 @@
+<template>
+	<up-popup :show="popShow" @close="close" @open="open" mode="center" :round="9">
+		<view class="u-p-32 box u-font-28">
+			<view class="u-flex u-relative u-row-center">
+				<view class="u-font-32">修改库存</view>
+				<view class="u-absolute close">
+					<up-icon @click="close" :size="16" color="#000" name="close-circle-fill"></up-icon>
+				</view>
+			</view>
+			<view class="u-m-t-48">
+				<up-form labelPosition="left" :model="data" :rules="rules" ref="refForm" errorType="toast">
+				<view>商品名称</view>
+				<view class="u-m-t-16" v-if="isSku">{{data.name}}</view>
+				<view class="u-m-t-38">
+					<template v-if="!isSku">
+						<view class="u-m-b-32" >
+							<view class="u-flex u-row-between">
+								<view>{{data.name}}</view>
+								<view class="u-font-24">
+									<text>变动数量：</text>
+									<text class="number">{{data.stockNumber-data._stockNumber}}</text>
+								</view>
+							</view>
+							<view class="u-m-t-16">
+								<up-form-item prop="stockNumber">
+									<up-input v-model="data.stockNumber" type="number">
+										<template #suffix>
+											<view>{{data.unitName||''}}</view>
+										</template>
+									</up-input>
+								</up-form-item>
+								
+							</view>
+						</view>
+						<view class="u-m-b-32">
+							<view class="u-flex u-row-between">
+								<view>备注</view>
+							</view>
+							<view class="u-m-t-16">
+								<up-textarea :height="42" v-model="form.note" placeholder="请输入备注"></up-textarea>
+							</view>
+						</view>
+					</template>
+					<template v-else>
+						<scroll-view scroll-y="true" style="max-height: 30vh;">
+							<view class="u-m-b-32" v-for="(item,index) in data.skuList" :key="index">
+								<view class="u-flex u-row-between">
+									<view>{{item.name}}</view>
+									<view class="u-font-24">
+										<text>变动数量：</text>
+										<text class="number">{{item.stockNumber-item._stockNumber}}</text>
+									</view>
+								</view>
+								<view class="u-m-t-16">
+									<up-input v-model="item.stockNumber">
+										<template #suffix>
+											<view>{{data.unitName||''}}</view>
+										</template>
+									</up-input>
+								</view>
+							</view>
+							<view class="u-m-b-32">
+								<view class="u-flex u-row-between">
+									<view>备注</view>
+								</view>
+								<view class="u-m-t-16">
+									<up-textarea :height="42" v-model="form.note" placeholder="请输入备注"></up-textarea>
+								</view>
+							</view>
+						</scroll-view>
+					</template>
+
+					<view class="u-m-t-60">
+						<my-button type="primary" shape="circle" @tap="save">
+							<view class="u-font-32">
+								保存
+							</view>
+						</my-button>
+						<view class="u-m-t-30">
+							<template v-if="!recoders.show">
+								<view class="color-999 u-font-24 u-flex u-row-center u-col-center">
+									<view class="u-flex" @click="changeShowRecoders(true)">
+										<view class="u-m-r-6">查看记录</view>
+										<up-icon name="arrow-down" :size="12"></up-icon>
+									</view>
+								</view>
+							</template>
+
+							<template v-else>
+								<scroll-view scroll-y="true" style="max-height: 30vh;">
+									<my-step :list="recoders.list"></my-step>
+								</scroll-view>
+								<view class="color-999 u-font-24 u-flex u-row-center u-col-center">
+									<!-- <view class="u-flex" @click="changeShowRecoders(false)"> -->
+									<view class="u-flex" @click="toRecodes">
+										<view class="u-m-r-6">全部记录</view>
+										<up-icon name="arrow-right" :size="12"></up-icon>
+									</view>
+								</view>
+							</template>
+
+						</view>
+
+					</view>
+				</view>
+				</up-form>
+			</view>
+		</view>
+	</up-popup>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref,
+		watch,
+		onMounted,
+		computed 
+	} from 'vue';
+	import {
+		returnSkuSnap,
+		returnTypeEnum,
+		returnCategory
+	} from '@/pageProduct/util.js'
+	import {
+		$tbShopUnit,$getProductStockDetail
+	} from '@/http/yskApi/goods.js'
+	import go from '@/commons/utils/go.js'
+	const refForm = ref(null)
+	const props = defineProps({
+		show: {
+			type: Boolean,
+			default: false
+		},
+		category: {
+			type: Array,
+			default: () => []
+		},
+		goods: {
+			type: Object,
+			default: () => {
+				return{
+					id:'',
+					skuList: []
+				}
+			}
+		}
+	})
+	const rules =reactive({
+		'stockNumber': [{
+				type: 'number',
+				required: true,
+				message: '请填写库存',
+				trigger: ['blur', 'change']
+			}
+		]
+	}) 
+	function toRecodes(){
+		console.log(props.goods.id);
+		go.to('PAGES_PRODUCT_INVOICING_LIST',{
+			productId:props.goods.id
+		})
+	}
+	function changeShowRecoders(show) {
+		recoders.show = show
+	}
+	const recoders = reactive({
+		list: [],
+		show: true,
+		active: 0
+	})
+
+	const data = ref({
+		name:''
+	})
+	const emits = defineEmits(['update:show', 'save'])
+	const form = reactive({
+		note: ''
+	})
+	let popShow = ref(props.show)
+	watch(() => props.show, (newval) => {
+		popShow.value = newval
+		if (newval) {
+			data.value = props.goods
+			getProductStockDetail()
+		}
+	})
+	async function getProductStockDetail(){
+		const {content}=await $getProductStockDetail({
+			page:0,
+			size:2,
+			productId:props.goods.id,
+			column:'/api/tbProductStockDetail/stock/count',
+			shopId:uni.getStorageSync('shopId'),
+			createdAt:[]
+		})
+		console.log(content);
+		recoders.list=content.map(v=>{
+			return {
+				...v,
+				title:v.createdAt,
+				content:v.type+':'+Math.abs(v.stockNumber) 
+			}
+		})
+	}
+	const isSku = computed(() => {
+		// return data.value.typeEnum == '多规格'
+		return false
+	})
+	watch(() => popShow.value, (newval) => {
+		emits('update:show', newval)
+	})
+
+	function close() {
+		popShow.value = false
+		form.note=''
+	}
+
+	function open() {
+
+	}
+	function save() {
+		refForm.value.validate().then(valid => {
+			if (valid) {
+				emits('save', {
+					...data.value,
+				})
+			} else {
+				console.log(err);
+			}
+		}).catch(() => {
+			// 处理验证错误  
+		});
+	}
+	// function save() {
+	// 	const skuSnap = returnSkuSnap(data.value)
+	// 	let typeEnum = returnTypeEnum(data.value.typeEnum)
+	// 	let lowPrice = undefined
+	// 	typeEnum = typeEnum ? typeEnum : 'normal'
+	// 	const findCategory = returnCategory(data.value.categoryName, props.category)
+	// 	console.log(typeEnum);
+	// 	console.log(findCategory);
+	// 	const categoryId = findCategory ? findCategory.id : ''
+	// 	if (typeEnum == 'normal') {
+	// 		// 单规格
+	// 		lowPrice = data.value.skuList[0].salePrice
+	// 	}
+	// 	emits('save', {
+	// 		...data.value,
+	// 		lowPrice,
+	// 		typeEnum,
+	// 		images: data.value.images ? data.value.images : [data.value.coverImg],
+	// 		categoryId,
+	// 		skuSnap: JSON.stringify(skuSnap)
+	// 	})
+	// }
+	
+	onMounted(()=>{
+		// #ifndef H5
+		refForm.value.setRules(rules)
+		// #endif
+	})
+</script>
+
+<style lang="scss" scoped>
+	.box {
+		width: 556rpx;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		box-sizing: border-box;
+	}
+
+	.close {
+		position: absolute;
+		right: 0;
+	}
+
+	.number {
+		color: #F0465B;
+	}
+</style>

pageProduct/index/components/goods.vue

@@ -0,0 +1,410 @@
+<template>
+	<view class=" goods">
+		<view class="u-flex u-row-between">
+			<view class="u-flex">
+				<view class="color-333">
+					<text class="">排序</text>
+					<text class="u-m-l-20">{{data.sort}}</text>
+				</view>
+				<view class="color-333 u-m-l-42 u-flex">
+					<up-icon @click="editStock" name="edit-pen" :size="16" :color="ColorMain"></up-icon>
+					<text class="stock u-m-l-4">库存:{{data.stockNumber}}</text>
+				</view>
+			</view>
+			<view>
+				<!-- <text class="u-font-28 color-666" @click="changeClick">修改</text> -->
+				<text class="u-font-28 color-666" @click="changePrice">改价</text>
+				<text class="u-font-28 color-red u-m-l-24" @click="baosun">报损</text>
+			</view>
+		</view>
+
+
+		<view class="u-m-t-48 u-flex u-col-top u-relative">
+			<view v-if="props.showChecked">
+				<label class="radio">
+					<radio :color="ColorMain" style="transform: scale(0.7);" @click="radioClick"
+						:checked="props.data.checked" /><text></text>
+				</label>
+			</view>
+			<view class="img">
+				<up--image :width="63" :height="63" :radius="3" :src="data.coverImg"></up--image>
+			</view>
+			<view class="w-full info">
+				<view class="info-p-l color-333  u-flex u-row-between">
+					<view class="u-flex">
+						<text class="u-m-r-24">{{data.name}}</text>
+						<!-- 		<uni-tag size="small" type="primary"
+							custom-style="background-color: #318AFE;" :text="data.typeEnum"></uni-tag> -->
+					</view>
+					<view class="u-font-32">
+						<text v-if="data.typeEnum=='单规格'">¥</text>
+						<text>{{data.lowPrice}}</text>
+						<!-- <text>¥</text>
+						<text>{{data.lowPrice}}</text>
+						<text v-if="data.typeEnum == '多规格'">~￥{{data.maxPrice }}</text> -->
+					</view>
+				</view>
+				<view class="u-m-t-24">
+					<template v-if="data.skuList.length>=2">
+						<view class="u-flex u-flex-wrap w-full gap-10  u-col-top" :style="skuStyle">
+							<view class="u-font-24 info-p-l u-m-t-6">规格：</view>
+							<view class="skd" v-for="(item,index) in data.skuList" :key="index"
+								@click="guigeClick(index)">
+								<text>{{item.specSnap||item.name}}</text>
+								<view class="tag-primary tag" v-if="item.isGrounding">上架中</view>
+								<view class="tag-gray tag" v-if="item.isPauseSale">已售罄</view>
+								<view class="tag-gray tag" v-if="!item.isGrounding">已下架</view>
+								
+								<!-- <template v-if="item.isPauseSale">
+									<view class="tag-gray tag" >已售罄</view>
+								</template>
+								<template v-else>
+									<view class="tag-primary tag" v-if="item.isGrounding">上架中</view>
+									<view class="tag-gray tag" v-else>已下架</view>
+								</template> -->
+
+							</view>
+						</view>
+						<template v-if="skuIsNotOne">
+							<view class="u-flex u-row-center">
+								<view class="u-flex u-flex-y-center" @click="toggleIsShowSkuAll" >
+									<view class="u-font-28 u-m-r-10 u-m-t-10 color-666">{{isShowSkuAll?'收起':'展开'}}</view>
+									<view class="u-flex u-flex-y-center">
+										<up-icon :size="14" name="arrow-down" v-if="!isShowSkuAll"></up-icon>
+										<up-icon  :size="14" name="arrow-up" v-else></up-icon>
+									</view>
+								</view>
+								
+							</view>
+						</template>
+					</template>
+					<template v-else>
+						<view style="height: 44rpx;">
+
+						</view>
+					</template>
+				</view>
+
+
+			</view>
+		</view>
+
+		<!-- <view class="u-m-t-16 skus u-text-center" v-if="data.skuList.length>=2">
+			<view class="u-flex u-flex-wrap  skds">
+				<view class="skd" v-for="(item,index) in data.skuList" :key="index"><text>{{item.specSnap}}</text>
+					<view class="tag-primary tag">上架中</view>
+				</view>
+			</view>
+
+		</view> -->
+		<view class="u-m-t-24 u-flex u-row-between">
+			<view class="u-flex">
+				<view class="u-flex">
+					<view class="u-m-r-18 color-999">售罄</view>
+					<my-switch disabled v-model="isPauseSale" :openDisabledClass="false"  @click="isPauseSaleChange"></my-switch>
+				</view>
+				<view class="u-flex u-m-l-30">
+					<view class="u-m-r-18 color-999">上架产品</view>
+					<my-switch disabled v-model="isGrounding" :openDisabledClass="false" @click="isGroundingChange"></my-switch>
+				</view>
+			</view>
+			<view class="u-flex">
+				<!-- <view class="btn-default btn" @tap="xiajia">下架商品</view> -->
+				<!-- <view class="btn-default btn" @tap="del">删除</view> -->
+				<view class="btn-primary btn u-m-l-38" @click="toEdit">编辑</view>
+			</view>
+		</view>
+
+	</view>
+</template>
+
+<script setup>
+	import {
+		computed,
+		ref,
+		watch,
+		watchEffect
+	} from 'vue';
+	import {
+		$goodsIsHot,
+		$tbProskuConV2,$updateProductData
+	} from '@/http/yskApi/goods.js'
+	import go from '@/commons/utils/go.js';
+	import {hasPermission} from '@/commons/utils/hasPermission.js';
+	import {
+		ColorMain
+	} from '@/commons/color.js'
+	const emits = defineEmits(['radioClick', 'changeClick', 'xiajia', 'del', 'changePrice', 'baosun', 'guigeClick','update',
+		'editStock'
+	])
+	const props = defineProps({
+		index: {
+			type: Number
+		},
+		data: {
+			type: Object,
+			default: () => {
+				return {
+				}
+			}
+		},
+		showChecked: {
+			type: Boolean,
+			default: false
+		},
+		showDetail: {
+			type: Boolean,
+			default: false
+		}
+	})
+	
+	let isShowSkuAll=ref(false)
+	const skuStyle=computed(()=>{
+		if(isShowSkuAll.value){
+			return ''
+		}else{
+			return 'height: 30px;overflow: hidden'
+		}
+	})
+	const skuIsNotOne=computed(()=>{
+		let isOne=true;
+		let width=0;
+		const fontSize=12;
+		const gap=5;
+		const boxWith=40;
+		const max=247;
+		for(let i in  props.data.skuList){
+			const sku=props.data.skuList[i]
+			width+=(fontSize*sku.name.length+boxWith+gap)
+			if(width>max){
+				isOne=false
+				break;
+			}
+		}
+		return !isOne
+	})
+	
+	function toggleIsShowSkuAll(){
+		isShowSkuAll.value=!isShowSkuAll.value
+	}
+
+	async function upDateGoods(par) {
+		const res = await $updateProductData([{
+			id: props.data.id,
+			isSku: 0,
+			shopId: uni.getStorageSync('shopId'),
+			...par
+		}])
+		uni.showToast({
+			title: '修改成功',
+			icon: 'none'
+		})
+		emits('update')
+	}
+	
+	let isPauseSale=ref(props.data.isPauseSale)
+	let isGrounding=ref(props.data.isGrounding)
+	watch(() => props.data.isPauseSale, (newval) => {
+		isPauseSale.value=newval
+	})
+	watch(() => props.data.isGrounding, (newval) => {
+		isGrounding.value=newval
+	})
+
+	async function isPauseSaleChange(e) {
+		const res=await hasPermission('允许售罄商品')
+		if(!res){
+			return
+		}
+		upDateGoods({
+			key: 'pauseSale',
+			value: isPauseSale.value?0:1
+		})
+	}
+	async function isGroundingChange(e) {
+		const res=await hasPermission('允许上下架商品')
+		if(!res){
+			return
+		}
+		upDateGoods({
+			key: 'grounding',
+			value: isGrounding.value?0:1
+		})
+	}
+
+	let checked = ref(false)
+
+
+	function radioClick() {
+		console.log(props.index);
+		emits('radioClick', props.index)
+	}
+
+	function changeClick() {
+		emits('changeClick', props.index)
+	}
+	
+	function reportDamage () {
+		emits('reportDamage', props.index)
+	}
+	function xiajia() {
+		emits('xiajia', props.index)
+	}
+
+	function del() {
+		emits('del', props.index)
+	}
+
+	async function changePrice() {
+		const res=await hasPermission('允许修改商品')
+		if(!res){
+			return
+		}
+		emits('changePrice', props.index)
+	}
+
+	function baosun() {
+		emits('baosun', props.index)
+	}
+
+	function guigeClick(guigeIndex) {
+		emits('guigeClick', props.index, guigeIndex)
+	}
+
+	function editStock() {
+		emits('editStock', props.index)
+	}
+	//携带参数type edit跳转到商品添加页面，编辑与添加同一页面，根据type值来判断
+	function toEdit() {
+		emits('edit', props.data.id)
+		// go.to('PAGES_PRODUCT_ADD', {
+		// 	type: 'edit',
+		// 	productId: props.data.id
+		// })
+	}
+</script>
+
+<style lang="scss" scoped>
+	$imgSize: 126rpx;
+	$price-color: #F02C45;
+
+	.btn {
+		padding: 6rpx 28rpx;
+		border-radius: 100rpx;
+		border: 2rpx solid transparent;
+	}
+
+	.gap-10 {
+		gap: 10rpx;
+	}
+
+	.btn-primary {
+		border-color: $my-main-color;
+		color: $my-main-color;
+	}
+
+	.btn-default {
+		border-color: #F4F4F4;
+		color: #999;
+	}
+
+	.price {
+		color: $price-color;
+	}
+
+	.h-100 {
+		height: $imgSize;
+	}
+
+	.img {
+		position: absolute;
+		left: 0;
+		top: 0;
+		// width: $imgSize;
+		// height: $imgSize;
+	}
+
+	.info-p-l {
+		padding-left: 71px;
+	}
+
+	.icon-arrow-right {
+		width: 32rpx;
+		height: 32rpx;
+	}
+
+	.stock {
+		// padding-right: 46rpx;
+		position: relative;
+	}
+
+	.stock::after {
+		// content: '';
+		// position: absolute;
+		// right: 10rpx;
+		// top: 50%;
+		// transform: translateY(-50%);
+		// display: block;
+		// width: 16rpx;
+		// border: 2rpx solid #333333;
+	}
+
+	.color-red {
+		color: #F0465B;
+	}
+
+	.goods {
+		border-radius: 10rpx 10rpx 10rpx 10rpx;
+		background-color: #fff;
+		padding: 24rpx 28rpx 16rpx 28rpx;
+		font-size: 28rpx;
+
+		.skus {
+			background: #F9F9F9;
+			border-radius: 14rpx 14rpx 14rpx 14rpx;
+			padding: 20rpx;
+
+			.sku {
+				color: #000;
+				font-weight: 700;
+				padding: 6rpx 40rpx;
+			}
+
+			.skds {
+				gap: 10rpx 50rpx;
+			}
+		}
+	}
+
+	.skd {
+		padding: 10rpx 38rpx 8rpx 40rpx;
+		background: #F0F2F5;
+		border-radius: 4rpx;
+		position: relative;
+		color: #666;
+		overflow: hidden;
+		margin-bottom: 10rpx;
+		font-size: 24rpx;
+
+		.tag {
+			position: absolute;
+			right: 0;
+			top: 0;
+			font-size: 12rpx;
+			height: 18rpx;
+			line-height: 18rpx;
+			right: 0;
+			border-radius: 0rpx 2rpx 2rpx 8rpx;
+		}
+
+		.tag-primary {
+			background-color: $my-main-color;
+			color: #fff;
+		}
+
+		.tag-gray {
+			background-color: rgb(144, 147, 153);
+			color: #fff;
+		}
+	}
+</style>

pageProduct/index/index.vue

@@ -0,0 +1,777 @@
+<template>
+	<view class="safe-page min-page">
+		<up-sticky>
+			<view class="bg-fff u-p-l-30   u-p-b-30">
+				<!-- <view class="myTabs ">
+				<myTabs :list="tabsList" @change="tabsChange"></myTabs>
+			</view> -->
+				<view class="input-wrapper">
+					<view class="input-main">
+						<view class="u-flex u-p-r-30 u-font-28" @click="onCategoryShowChange(true)">
+							<text class="u-m-r-10 u-line-1"
+								style="max-width: 100rpx;">{{pageData.categoryName||'分类' }}</text>
+							<up-icon name="arrow-down" size="16"></up-icon>
+						</view>
+						<uni-easyinput clearable class='jeepay-search' :inputBorder="false"
+						trim="all"
+							:placeholder="pageData.search.placeholder" v-model="pageData.query.name"
+							@clear="searchFunc"
+							@confirm="searchFunc">
+							<template #prefixIcon>
+								<image src="@/static/iconImg/icon-search.svg" class="input-icon" />
+							</template>
+						</uni-easyinput>
+						<view class="u-m-l-4">
+							<button class="" type="text" @click="searchFunc()"> <text class="color-333">搜索</text></button>
+						</view>
+					</view>
+				</view>
+				<view class="u-flex  states1 u-row-between u-p-r-28  u-font-28">
+					<view class="u-flex">
+						<view class="u-p-l-16 item u-p-r-16 u-p-t-6 u-p-b-6 tranistion u-text-center color-333"
+							:class="{'active':pageData.stateCurrent==index}" @tap="statesTableClick(index)"
+							v-for="(item,index) in statesTabsList" :key="index">
+							{{item}}
+						</view>
+					</view>
+					<view class="u-flex u-col-center" @click="go.to('PAGES_PRODUCT_SPECIF_TEMPLATE')">
+						<image src="/pageProduct/static/images/icon-guige.svg" class="icon-guige" />
+						<text class="color-666 u-m-l-12 u-font-24">规格模版</text>
+					</view>
+				</view>
+
+			</view>
+		</up-sticky>
+		<view class="goods-list u-p-30">
+			<template v-if="pageData.goodsList.length">
+				<view class="u-m-b-32" v-for="(item,index) in pageData.goodsList" :key="index">
+					<my-goods :key="item.id" @update="getGoodsList" @changePrice="changePriceShow"
+						@changeClick="goodsChangeClick" @edit="toGoodsDetail" @editStock="changeStockShow"
+						@guigeClick="editGuigeShow" @baosun="baosunShow" @radioClick="goodsRadioClick" :index="index"
+						:data="item" @del="goodsDel" :showChecked="showChecked"
+						:showDetail="pageData.showGoodsDetail"></my-goods>
+				</view>
+			</template>
+			<template v-if="pageData.hasAjax&&!pageData.goodsList.length">
+				<my-img-empty tips="未找到相关商品"></my-img-empty>
+			</template>
+			<template v-if="pageData.goodsList.length">
+				<my-pagination :page="pageData.query.page+1" :totalElements="pageData.totalElements" :size="pageData.query.size"
+					@change="pageChange"></my-pagination>
+			</template>
+
+			<view style="height: 100rpx;"></view>
+		</view>
+
+		<my-control ref="control" :categoryShow="pageData.categoryShow" :categoryName="pageData.categoryName"
+			@offShelf="offShelf" @allCheckedChange="allCheckedChange" @controlChange="controlChange"
+			@toggleCategory="toggleCategory" :bottom="pageData.componentBottom"></my-control>
+		<!-- <my-category ref="category" @change="onCategoryShowChange" @cateClick="cateClick"
+			:bottom="pageData.componentBottom+100"></my-category> -->
+		<!-- 下架弹窗 -->
+		<my-model :desc="pageData.modelDesc" ref="model" @confirm="modelConfirm"></my-model>
+		<!-- 商品库存修改弹窗 -->
+		<my-model ref="goodsStockModel" title="商品修改" @close="goodsStockModelClose">
+			<template #desc>
+				<view class="u-p-40 u-text-left">
+					<view>
+						<view class="">排序:</view>
+						<view class="u-m-t-24">
+							<uni-easyinput v-model="goodsStockData.sort" placeholder="请输入排序"></uni-easyinput>
+						</view>
+					</view>
+					<view class="u-flex u-m-t-32">
+						<view class="">库存开关:</view>
+						<view class="u-m-l-46 ">
+							<my-switch v-model="goodsStockData.isStock"></my-switch>
+						</view>
+					</view>
+					<!-- <view class="u-flex u-m-t-32">
+						<view class="">共享库存:</view>
+						<view class="u-m-l-46 ">
+							<my-switch v-model="goodsStockData.isDistribute"></my-switch>
+						</view>
+					</view>
+					<view class="u-flex u-m-t-32">
+						<view class="">售罄:</view>
+						<view class="u-m-l-46 ">
+							<my-switch v-model="goodsStockData.isPauseSale"></my-switch>
+						</view>
+					</view>
+					<view class="u-flex u-m-t-32">
+						<view class="">上架:</view>
+						<view class="u-m-l-46 ">
+							<my-switch v-model="goodsStockData.isGrounding"></my-switch>
+						</view>
+					</view> -->
+
+					<!-- <view class="u-m-t-24 u-m-t-32" v-if="goodsStockData.isStock">
+						<view class="">数量:</view>
+						<view class="u-m-t-24">
+							<uni-easyinput v-model="goodsStockData.stockNumber" placeholder="请输入库存数量"></uni-easyinput>
+						</view>
+					</view> -->
+				</view>
+
+			</template>
+			<template #btn>
+				<view class="stock-btns u-p-b-40">
+					<my-button shape="circle" @tap="goodsStockModelSave">保存</my-button>
+					<my-button shape="circle" type="default" @tap="goodsStockModelCancel">取消</my-button>
+				</view>
+			</template>
+		</my-model>
+
+		<!-- 分类 -->
+		<my-category v-model:isShow="pageData.categoryShow" @confirm="setCategory"></my-category>
+		<!-- 修改价格弹窗 -->
+		<edit-price :category="pageData.categoryList" v-model:show="popup.price.show" @save="changePriceConfirm"
+			:goods="pageData.selGoods"></edit-price>
+		<!-- 修改库存弹窗 -->
+		<edit-stock :category="pageData.categoryList" v-model:show="popup.stock.show" @save="changeStockConfirm"
+			:goods="pageData.selGoods"></edit-stock>
+		<!-- 规格弹窗 -->
+		<edit-guige @isGroundingChange="isGroundingChange" v-model:show="popup.guige.show" @isPauseSaleChange="isPauseSaleChange"
+			:goods="popup.guige.data"></edit-guige>
+		<!-- 报损 -->
+		<baosun-vue :category="pageData.categoryList" v-model:show="popup.baosun.show"
+			:goods="pageData.selGoods"></baosun-vue>
+	</view>
+
+</template>
+
+<script setup>
+	import {
+		onLoad,
+		onReady,
+		onShow,
+		onPageScroll,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app';
+	import {
+		reactive,
+		ref,
+		watch
+	} from 'vue';
+	import go from '@/commons/utils/go.js';
+	import {
+		hasPermission
+	} from '@/commons/utils/hasPermission.js';
+	import myGoods from './components/goods.vue'
+	import myControl from './components/control.vue'
+	import myCategory from './components/category.vue'
+	import infoBox from "@/commons/utils/infoBox.js"
+	import editPrice from './components/edit-price.vue';
+	import editGuige from './components/edit-guige.vue';
+	import editStock from './components/edit-stock.vue';
+	import baosunVue from './components/baosun.vue';
+	import {
+		$tbProduct,
+		$upProSort,
+		$updateProduct,
+		$getProductDetail,
+		$delProduct,
+		$tbShopCategory,
+		$updateProductStatus,
+		$tbProductV2,
+		$updateProductData
+	} from "@/http/yskApi/goods.js"
+	import {
+		returnAllCategory
+	} from '@/pageProduct/util.js'
+
+	const pageData = reactive({
+		modelDesc: '是否下架',
+		stateCurrent: 0,
+		componentBottom: 45,
+		search: {
+			value: '',
+			placeholder: '输入搜索的商品'
+		},
+		showGoodsDetail: false,
+		selGoodsIndex: '',
+		selGoods: {},
+		totalElements: 0,
+		totalPage: 0,
+		goodsList: [],
+		query: {
+			page: 0,
+			size: 10,
+			createdAt: [],
+			id: "",
+			categoryId: '',
+			name: '',
+			isPauseSale: '',
+			sort: "createdAt,desc",
+			isGrounding: ''
+		},
+		category: '',
+		categoryList: [], //分类列表
+		categoryShow: false,
+		categoryName: '',
+		hasAjax: false
+	})
+	watch(() => pageData.query.categoryId, (newval) => {
+		getGoodsList()
+	})
+	watch(() => pageData.query.isPauseSale, (newval) => {
+		getGoodsList()
+	})
+	watch(() => pageData.query.isGrounding, (newval) => {
+		getGoodsList()
+	})
+	const popup = reactive({
+		price: {
+			show: false
+		},
+		guige: {
+			show: false,
+			data: {},
+			goodsIndex: '',
+			guigeIndex: '',
+		},
+		stock: {
+			show: false
+		},
+		baosun: {
+			show: false
+		}
+	})
+
+	//报损弹窗展示
+	function baosunShow(index) {
+		pageData.selGoodsIndex = index
+		const goods = pageData.goodsList[index]
+		pageData.selGoods = goods
+		popup.baosun.show = true
+	}
+
+	// 修改价格弹窗展示
+	function changePriceShow(index) {
+		pageData.selGoodsIndex = index
+		const goods = pageData.goodsList[index]
+		goods.skuList = goods.skuList.map(v => {
+			return {
+				...v,
+				_lowPrice: v.lowPrice
+			}
+		})
+		const lowPrice = goods.lowPrice.replace('￥', '') * 1
+		pageData.selGoods = {
+			...goods,
+			lowPrice,
+			_lowPrice: lowPrice
+		}
+		popup.price.show = true
+	}
+
+
+
+
+	async function changePriceConfirm(goods) {
+		let goodsArr = []
+		if (goods.typeEnum == '单规格') {
+			goodsArr = [{
+				shopId: uni.getStorageSync('shopId'),
+				isSku: false,
+				id: goods.id,
+				key: 'salePrice',
+				value: goods.lowPrice
+			}]
+		} else {
+			goodsArr = goods.skuList.map(v => {
+				return {
+					shopId: uni.getStorageSync('shopId'),
+					isSku: true,
+					id: v.id,
+					key: 'salePrice',
+					value: v.lowPrice
+				}
+			})
+		}
+		const res = await $updateProductData(goodsArr)
+		infoBox.showToast('修改成功')
+		popup.price.show = false
+		getGoodsList()
+	}
+
+
+	// 修改库存弹窗展示
+	async function changeStockShow(index) {
+		const res = await hasPermission('允许修改商品库存')
+		if (!res) {
+			return
+		}
+		pageData.selGoodsIndex = index
+		const goods = pageData.goodsList[index]
+		goods.skuList = goods.skuList.map(v => {
+			return {
+				...v,
+				_stockNumber: v.stockNumber
+			}
+		})
+		const stockNumber = goods.stockNumber
+		pageData.selGoods = {
+			...goods,
+			stockNumber,
+			_stockNumber: stockNumber
+		}
+		popup.stock.show = true
+	}
+	async function changeStockConfirm(goods) {
+		let goodsArr = []
+		// if (goods.typeEnum == '单规格') {
+		// 	goodsArr = [{
+		// 		shopId: uni.getStorageSync('shopId'),
+		// 		isSku: false,
+		// 		id: goods.id,
+		// 		key: 'stockNumber',
+		// 		value: goods.stockNumber
+		// 	}]
+		// } else {
+		// 	goodsArr = goods.skuList.map(v => {
+		// 		return {
+		// 			shopId: uni.getStorageSync('shopId'),
+		// 			isSku: true,
+		// 			id: v.id,
+		// 			key: 'stockNumber',
+		// 			value: v.stockNumber 
+		// 		}
+		// 	})
+		// }
+		goodsArr = [{
+			shopId: uni.getStorageSync('shopId'),
+			isSku: false,
+			id: goods.id,
+			key: 'stockNumber',
+			value: goods.stockNumber
+		}]
+		const res = await $updateProductData(goodsArr)
+		infoBox.showToast('修改成功')
+		popup.stock.show = false
+		getGoodsList()
+	}
+
+	//修改规格上下架，售罄
+	function editGuigeShow(goodsIndex, guigeIndex) {
+		console.log(goodsIndex, guigeIndex);
+		const goodsGuige = pageData.goodsList[goodsIndex].skuList[guigeIndex]
+		popup.guige.data = goodsGuige
+		popup.guige.goodsIndex = goodsIndex
+		popup.guige.guigeIndex = guigeIndex
+		popup.guige.show = true
+	}
+
+	function isGroundingChange(e) {
+		const {
+			goodsIndex,
+			guigeIndex
+		} = popup.guige
+		pageData.goodsList[goodsIndex].skuList[guigeIndex].isGrounding = e
+	}
+
+	function isPauseSaleChange(e) {
+		const {
+			goodsIndex,
+			guigeIndex
+		} = popup.guige
+		pageData.goodsList[goodsIndex].skuList[guigeIndex].isPauseSale = e
+	}
+
+	function onCategoryShowChange(show) {
+		console.log(show);
+		pageData.categoryShow = show
+	}
+
+	function setCategory(category) {
+		pageData.query.categoryId = category.id
+		pageData.categoryName = category.name
+	}
+
+	function getGoodsList() {
+		pageData.hasAjax = false
+		$tbProductV2(pageData.query).then(res => {
+			pageData.hasAjax = true
+			console.log(res);
+			pageData.goodsList = res.content.map(v => {
+				return {
+					...v,
+					isSellNone: false,
+					checked: false,
+					showDetail: false
+				}
+			})
+			pageData.totalElements = res.totalElements
+		})
+	}
+
+	function watchEmitInit() {
+		uni.$off('update:productIndex')
+		uni.$off('del:productIndex')
+		uni.$on('update:productIndex', (data) => {
+			getGoodsList()
+		})
+		uni.$on('del:productIndex', (productId) => {
+			if(pageData.goodsList.length<=1){
+				pageData.query.page-=1
+			}
+			getGoodsList()
+		})
+
+	}
+	onShow(() => {
+		// getGoodsList()
+		watchEmitInit()
+	})
+	onLoad(() => {
+		getGoodsList()
+		$tbShopCategory({
+			page: 0,
+			size: 200
+		}).then(res => {
+			pageData.categoryList = returnAllCategory(res.content)
+			console.log(pageData.categoryList);
+		})
+	})
+
+	const tabsList = ['简洁', '详情']
+	const statesTabsList = ['全部', '已售罄', '在售中', '已下架']
+	const control = ref(null)
+	const model = ref(null)
+	const goodsStockModel = ref(null)
+	let reportDamage = ref(null) //报损组件
+	// 商品报损
+	function reportDamageClick(index) {
+		pageData.reportData = pageData.goodsList[index]
+		reportDamage.value.open();
+	}
+
+	function returnGoodsStockData() {
+		return reactive({
+			sort: 0,
+			isStock: false,
+			isDistribute: false,
+			isPauseSale: false,
+			isGrounding: false,
+			stockNumber: 0,
+		})
+	}
+	let goodsStockData = returnGoodsStockData()
+
+	function goodsStockModelClose() {
+		console.log('goodsStockModelClose');
+		goodsStockData = returnGoodsStockData()
+	}
+
+	function goodsStockModelCancel() {
+		console.log('goodsStockModelCancel');
+		goodsStockModel.value.close()
+		goodsStockData = returnGoodsStockData()
+	}
+
+	async function goodsStockModelSave() {
+		const item = pageData.goodsList[pageData.selGoodsIndex]
+		const goods = await $getProductDetail(item.id, false)
+		$updateProduct({
+			...goods,
+			sort: goodsStockData.sort,
+			isStock: goodsStockData.isStock
+		}).then(res => {
+			item.sort = goodsStockData.sort
+			item.isStock = goodsStockData.isStock
+			item.stockNumber = goodsStockData.stockNumber
+			goodsStockModelCancel()
+		})
+	}
+
+
+
+	//点击修改按钮弹出修改商品弹窗
+	function goodsChangeClick(index) {
+		pageData.selGoodsIndex = index
+		const goods = pageData.goodsList[index]
+		Object.assign(goodsStockData, goods)
+		goodsStockModel.value.open()
+	}
+
+	//删除商品
+	function goodsDel(index) {
+		const goods = pageData.goodsList[index]
+		uni.showModal({
+			title: '提示',
+			content: '确认删除该商品',
+			success: function(res) {
+				if (res.confirm) {
+					$delProduct([goods.id]).then(res => {
+						uni.showToast({
+							title: '删除成功',
+							icon: 'none'
+						})
+						pageData.goodsList.splice(index, 1)
+					})
+				} else if (res.cancel) {}
+			}
+		});
+	}
+
+	function resetQuery() {
+		pageData.totalElements = 0;
+		pageData.query.page = 0;
+	}
+
+	async function toGoodsDetail(id) {
+		const res = await hasPermission('允许修改商品')
+		if (!res) {
+			return
+		}
+		go.to('PAGES_PRODUCT_ADD', {
+			type: 'edit',
+			productId: id
+		})
+	}
+
+	function statesTableClick(index) {
+		pageData.stateCurrent = index;
+		resetQuery()
+		console.log(index);
+		if (index == 0) {
+			pageData.query.isPauseSale = ''
+			pageData.query.isGrounding = ''
+			return
+		}
+		if (index == 1) {
+			pageData.query.isPauseSale = 1
+			pageData.query.isGrounding = ''
+			return
+		}
+		if (index == 2) {
+			pageData.query.isPauseSale = ''
+			pageData.query.isGrounding = 1
+			return
+		}
+		if (index == 3) {
+			pageData.query.isPauseSale = ''
+			pageData.query.isGrounding = 0
+			return
+		}
+	}
+	let test = ref(false)
+
+	function tabsChange(i) {
+		console.log(i);
+		pageData.showGoodsDetail = i ? true : false
+
+	}
+
+
+	//改变商品的选中状态
+	function changeGoodsChecked(checked, index) {
+		if (index !== undefined) {
+			pageData.goodsList[index].checked = checked
+		} else {
+			pageData.goodsList.map(v => {
+				v.checked = checked
+			})
+		}
+		control.value.setisSelectAll(isAllChecked() ? true : false)
+	}
+
+
+	// 获取已经选中的商品
+	function getChechkedGoodsList() {
+		return pageData.goodsList.filter(v => v.checked)
+	}
+	//是否全部选中
+	function isAllChecked() {
+		return getChechkedGoodsList().length === pageData.goodsList.length
+	}
+	// 是否有商品选中
+	function isHasChekdGoods() {
+		return getChechkedGoodsList().length ? true : false
+	}
+
+	function searchFunc() {
+		console.log('searchFunc');
+		resetQuery()
+		getGoodsList()
+	}
+
+	let showChecked = ref(false)
+
+	//商品start
+
+	function goodsRadioClick(index) {
+		var checked = !pageData.goodsList[index].checked
+		changeGoodsChecked(checked, index)
+	}
+
+
+	//下架
+	function offShelf() {
+		const hasCheckedArr = getChechkedGoodsList()
+		const hasChecked = isHasChekdGoods()
+		if (!hasChecked) {
+			return infoBox.showToast('您还没有选中商品！')
+		}
+		model.value.open()
+	}
+	//下架确认
+	function modelConfirm() {
+		console.log('confirm');
+		model.value.close()
+	}
+
+	//商品end
+
+	//控制条
+	function controlChange(bol) {
+		showChecked.value = bol
+	}
+
+
+
+	// 全选
+	function allCheckedChange(checked) {
+		changeGoodsChecked(checked)
+	}
+
+	// 页数改变事件
+	function pageChange(page) {
+		console.log(page);
+		pageData.query.page = page - 1
+		getGoodsList()
+	}
+
+	//分类
+	const category = ref(null)
+
+	function toggleCategory() {
+		category.value.toggle()
+	}
+
+	function cateClick(cate) {
+		console.log(cate);
+		pageData.query.categoryId = cate.id
+		pageData.categoryName = cate.name
+		pageData.category = cate
+		getGoodsList()
+	}
+</script>
+<style scoped>
+	page {
+		background: #F9F9F9;
+	}
+</style>
+<style lang="scss" scoped>
+	.stock-btns {
+		padding: 0 100rpx;
+		display: flex;
+		flex-direction: column;
+		gap: 20rpx;
+	}
+
+	.safe-page {
+		background: #F9F9F9;
+	}
+
+	.icon-guige {
+		width: 42rpx;
+		height: 42rpx;
+	}
+
+	.bg-fff {
+		background-color: #fff;
+	}
+
+	.myTabs {
+		margin: 0 auto;
+		width: 434rpx;
+		height: 64rpx;
+	}
+
+	.input-wrapper {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding-top: 26rpx;
+		background-color: $J-bg-ff;
+
+		.input-main {
+			flex: 1;
+			display: flex;
+			align-items: center;
+			height: 64rpx;
+
+			image {
+				padding: 22rpx;
+				width: 26rpx;
+				height: 26rpx;
+			}
+
+			input {
+				flex: 1;
+				font-size: 27rpx;
+			}
+
+			::v-deep uni-button {
+				font-size: 28rpx;
+				color: $my-main-color;
+				background: rgba(255, 255, 255, 1);
+			}
+
+			::v-deep.uni-easyinput {
+				.uni-easyinput__content {
+					background-color: $J-bg-f5 !important;
+					border-radius: $J-b-r12;
+
+					.uni-easyinput__content-input {
+						padding-left: 0 !important;
+
+						.uni-input-input {
+							border-radius: $J-b-r12 !important;
+							overflow: hidden !important;
+						}
+					}
+
+					.uni-input-placeholder {
+						font-size: 27rpx;
+					}
+
+					.uni-icons {
+						color: rgba(230, 230, 230, 1) !important;
+					}
+				}
+			}
+		}
+	}
+
+	.input-icon {
+		position: relative;
+		z-index: 10;
+	}
+
+	.search-button {
+		position: absolute;
+		right: 0;
+		background-color: transparent !important;
+		color: transparent !important;
+	}
+
+	.states1 {
+		margin-top: 40rpx;
+
+		.item {
+			font-size: 24rpx;
+			color: #666;
+			margin-right: 30rpx;
+			background: #F4F4F4;
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+		}
+
+		.item.active {
+			background: #E6F0FF;
+			color: $my-main-color;
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+		}
+	}
+</style>

pageProduct/invoicing-check/components/list-item.vue

@@ -0,0 +1,171 @@
+<template>
+	<view class="u-m-b-30 goods">
+		<view class="u-flex color-999">
+			<text class="">{{data.createTime}}</text>
+		</view>
+
+
+		<view class="u-m-t-20 u-flex u-col-top ">
+			<image :src="data.coverImg" lazy-load class="img"></image>
+			<view class=" u-p-l-24 h-100 u-flex u-flex-1 u-col-top u-flex-col u-row-between">
+				<view class="u-flex">
+					<view class="color-333"> <text class="font-bold">{{data.name}}</text></view>
+					<view class="price u-m-l-20">¥{{data.price}}</view>
+				</view>
+				<view class="u-flex u-row-between  w-full">
+					<view>
+						<text class="color-999">盈亏数量:</text>
+						<text>{{data.phaseNum}}</text>
+					</view>
+					<view>
+						<text class="color-999">盈亏金额:</text>
+						<text>{{data.phasePrice}}</text>
+					</view>
+				</view>
+				<view class="u-flex u-row-between  w-full">
+					<view>
+						<text class="color-999">账存库存:</text>
+						<text>{{data.stock}}</text>
+					</view>
+					<view>
+						<text class="color-999">实际库存:</text>
+						<text>{{data.inventoryStock}}</text>
+					</view>
+				</view>
+
+			</view>
+		</view>
+		
+		<view class="u-m-t-20 u-flex " v-if="data.note">
+			<view class="color-333">备注:</view>
+			<view class="bg-gray u-m-l-20 u-p-t-10 u-p-b-10 u-p-l-20 u-p-r-20 color-999">{{data.note}}</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		ref,
+		watchEffect
+	} from 'vue';
+	import {
+		$goodsIsHot
+	} from '@/http/yskApi/goods.js'
+	import mySwitch from '@/components/my-components/my-switch.vue'
+	import go from '@/commons/utils/go.js';
+	import {
+		ColorMain
+	} from '@/commons/color.js'
+	const emits = defineEmits(['radioClick', 'xiajia', 'del'])
+	const props = defineProps({
+		index: {
+			type: Number
+		},
+		data: {
+			type: Object,
+			default: () => {
+				return {}
+			}
+		}
+	})
+
+
+	function isHotChange(e) {
+		$goodsIsHot({
+			id: props.data.id,
+			isHot: props.data.isHot
+		}).then(res => {
+			uni.showToast({
+				title: '修改成功',
+				icon: 'none'
+			})
+		})
+	}
+
+	let isSellNone = ref(false)
+	isSellNone.value = props.isSellNone
+
+	function isSellNoneChange() {
+		console.log(isSellNone.value);
+		console.log('isSellNoneChange');
+	}
+
+	let checked = ref(false)
+
+
+	function radioClick() {
+		console.log(props.index);
+		emits('radioClick', props.index)
+	}
+
+
+	function xiajia() {
+		emits('xiajia', props.index)
+	}
+
+	function del() {
+		emits('del', props.index)
+	}
+
+	//携带参数type edit跳转到商品添加页面，编辑与添加同一页面，根据type值来判断
+	function toEdit() {
+		go.to('PAGES_PRODUCT_ADD', {
+			type: 'edit',
+			productId: props.data.id
+		})
+	}
+</script>
+
+<style lang="scss" scoped>
+	$imgSize: 126rpx;
+	$price-color: #F02C45;
+
+	.btn {
+		padding: 6rpx 28rpx;
+		border-radius: 100rpx;
+		border: 2rpx solid transparent;
+	}
+
+	.btn-primary {
+		border-color: $my-main-color;
+		;
+		color: $my-main-color;
+	}
+
+	.btn-default {
+		border-color: #F4F4F4;
+		color: #999;
+	}
+
+	.price {
+		color: $price-color;
+	}
+
+	.h-100 {
+		height: $imgSize;
+	}
+
+	.img {
+		width: $imgSize;
+		height: $imgSize;
+	}
+
+	.icon-arrow-right {
+		width: 32rpx;
+		height: 32rpx;
+	}
+
+	.stock {
+		position: relative;
+	}
+
+
+	.goods {
+		border-radius: 10rpx 10rpx 10rpx 10rpx;
+		background-color: #fff;
+		padding: 24rpx 28rpx 16rpx 28rpx;
+		font-size: 28rpx;
+
+
+	}
+</style>

pageProduct/invoicing-check/invoicing-check.vue

@@ -0,0 +1,204 @@
+<template>
+	<view class="min-page bg-gray u-p-30">
+		<view v-for="(item,index) in pageData.list" :key="index">
+			<list-item :data="item"></list-item>
+		</view>
+		<view class="u-m-t-44" v-if="pageData.totalElements>0">
+			<my-pagination :size="pageData.query.size" :totalElements="pageData.totalElements"
+				@change="pageChange"></my-pagination>
+			<view style="height: 200rpx;"></view>
+		</view>
+		<template v-if="pageData.hasAjax&&!pageData.list.length">
+			<my-img-empty tips="暂无数据"></my-img-empty>
+		</template>
+	</view>
+
+
+
+	<view class="u-fixed fixed-b">
+		<my-button shape="circle" @tap="formShow">变动库存</my-button>
+	</view>
+
+	<my-mask ref="refMask">
+		<view class="u-p-30 ">
+			<view class="bg-fff border-r-18 default-box-padding">
+				<uni-forms :label-width="100" ref="refForm" :model="formData">
+					<uni-forms-item label="账存数量" required>
+						<uni-easyinput  disabled v-model="formData.stock" placeholder="请输入账存数量" />
+					</uni-forms-item>
+					<uni-forms-item label="实际数量" required>
+						<uni-number-box 
+						:max="999999999"
+						v-model="formData.stocktakinNum" ></uni-number-box>
+						<!-- <uni-easyinput v-model="formData.stocktakinNum" placeholder="请输入实际数量" /> -->
+					</uni-forms-item>
+					<view :class="{red:computedNumber<0}">
+						<uni-forms-item label="盈亏数量" required>
+							<uni-easyinput disabled v-model="computedNumber" placeholder="请输入盈亏数量" />
+						</uni-forms-item>
+					</view>
+					
+					<uni-forms-item label="单价" required>
+						<uni-easyinput disabled v-model="formData.price" placeholder="请输入单价" />
+					</uni-forms-item>
+					<view :class="{red:computedMoney<0}">
+						<uni-forms-item label="盈亏金额" required>
+							<uni-easyinput disabled v-model="computedMoney" placeholder="请输入盈亏金额" />
+						</uni-forms-item>
+					</view>
+					
+					<uni-forms-item label="备注" required>
+						<uni-easyinput type="textarea" v-model="formData.note" placeholder="请输入备注" />
+					</uni-forms-item>
+					<view class="u-flex u-m-t-30">
+						<view class="u-flex-1 u-p-r-16">
+							<my-button type="default" shape="circle" @tap="formHide">取消</my-button>
+						</view>
+						<view class="u-flex-1 u-p-l-16">
+							<my-button shape="circle" @tap="addStocktakin">确定</my-button>
+						</view>
+
+					</view>
+				</uni-forms>
+			</view>
+		</view>
+
+	</my-mask>
+</template>
+
+<script setup>
+	import {
+		onLoad
+	} from '@dcloudio/uni-app'
+	import {
+		$addStocktakin,
+		$getStocktakin
+	} from '@/http/yskApi/goods.js'
+	import infoBox from "@/commons/utils/infoBox.js"
+	import listItem from './components/list-item';
+	import {
+		$pageData
+	} from '@/commons/goodsData.js'
+	
+	import {
+		computed,
+		reactive,
+		ref
+	} from 'vue';
+	const refForm = ref(null)
+	const refMask = ref(null)
+
+	function formShow() {
+		refMask.value.open()
+	}
+	
+	function formHide() {
+		formData.note=''
+		refMask.value.close()
+	}
+	const formData = reactive({
+		stock:0,
+		note: '',
+		price:'',
+		productId:"",
+		skuId:'',
+		stocktakinNum:0
+	})
+	const computedMoney=computed(()=>{
+		return (formData.stocktakinNum-formData.stock)*formData.price
+	})
+	
+	const computedNumber=computed(()=>{
+		return formData.stocktakinNum-formData.stock
+	})
+	
+	const pageData = reactive({
+		...$pageData,
+		query: {
+			...$pageData.query,
+			name: '',
+			skuId: '',
+			sort: 'id,desc'
+		}
+	})
+	// 页数改变事件
+	function pageChange(page) {
+		pageData.query.page=page-1
+		init()
+	}
+	async function addStocktakin() {
+		const res = await $addStocktakin(formData)
+		infoBox.showToast('添加成功')
+		formHide()
+		init()
+	}
+	async function init() {
+		const res = await $getStocktakin(pageData.query)
+		pageData.hasAjax=true
+		if(pageData.query.page===0&&res.content.length){
+			const zero=res.content[0]
+			formData.stock=zero.inventoryStock*1
+			formData.stocktakinNum=formData.stock
+			formData.price=zero.price
+		}else{
+			formData.stock=option.stock*1
+			formData.stocktakinNum=formData.stock
+			formData.price=option.price*1
+		}
+		pageData.list = res.content
+		pageData.totalElements = res.totalElements
+	}
+	let option={}
+	onLoad(opt => {
+		console.log(opt);
+		if (JSON.stringify(opt) !== '{}') {
+			option=opt
+			Object.assign(pageData.query, opt)
+			formData.skuId=opt.skuId
+			formData.productId=opt.productId
+			init()
+		}
+	})
+</script>
+
+<style lang="scss" scoped>
+	.form-box {
+		margin: auto;
+	}
+
+	::v-deep.uni-forms-item {
+		min-height: 100rpx;
+	}
+
+	::v-deep.uni-forms-item .uni-forms-item__label {
+		text-indent: 0;
+		font-size: 28rpx !important;
+		font-weight: bold;
+		color: #333;
+		text-align: right;
+	}
+
+	::v-deep .none-label .uni-forms-item.is-direction-top {
+		padding: 0 !important;
+		min-height: initial !important;
+	}
+
+	::v-deep .none-label .uni-forms-item .uni-forms-item__label {
+		padding: 0 !important;
+	}
+	::v-deep.is-disabled .uni-easyinput__placeholder-class{
+		color: #333;
+	}
+	.fixed-b {
+		bottom: 80rpx;
+		left: 110rpx;
+		right: 110rpx;
+	}
+	
+	::v-deep.uni-input-input{
+		color: #333;
+	}
+	::v-deep .red .uni-input-input{
+		color: $my-red-color;
+	}
+</style>

pageProduct/invoicing-list/components/list-item.vue

@@ -0,0 +1,140 @@
+<template>
+	<view class="item bg-fff border-r-12">
+		<view class="u-flex u-text-left u-row-between border-bottom u-p-b-30">
+			<view class="">
+				<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="data.createdAt"></uni-dateformat>
+			</view>
+			<view class="tag">{{data.type}}</view>
+		</view>
+		<view class="u-flex u-text-left u-row-left u-m-t-30">
+			<view class="name">{{data.productName}}</view>
+			<!-- <view class="category u-flex u-m-l-10">
+				<view class="tag">分类</view>
+			</view> -->
+			<view class="id color-999 u-font-24 bg-gray u-m-l-10">
+				ID:{{data.id}}
+			</view>
+		</view>
+		<view class="info u-flex bg-gray u-p-24 u-m-t-20 u-row-between">
+			<view class="u-text-right">
+				<!-- 	<view>
+					<text>总价值</text>
+					<text class="u-m-l-10">3</text>
+				</view>
+				<view class="u-m-t-10">
+					<text>单价</text>
+					<text class="u-m-l-10">2</text>
+				</view>
+				<view class="u-m-t-10">
+					<text>货品编码</text>
+					<text class="u-m-l-10">2</text>
+				</view>
+				<view class="u-m-t-10">
+					<text>供应商名称</text>
+					<text class="u-m-l-10">2</text>
+				</view> -->
+				<view class="u-flex">
+					<view class="text-ming-w">订单号</view>
+					<text class="u-m-l-10 u-font-24 color-main">{{data.orderNo||''}}</text>
+				</view>
+				<view class="u-m-t-10 u-flex u-relative">
+					<view class="text-ming-w">库存</view>
+					<view class="u-relative">
+						<text class="u-m-l-10">{{data.leftNumber}}</text>
+						<view class="u-absolute u-flex addNumber">
+							<uni-icons type="arrow-right" :color="color.ColorMain" size="16"></uni-icons>
+							<text class="color-main u-m-l-10">{{data.leftNumber+data.stockNumber}}</text>
+						</view>
+					</view>
+
+					
+				</view>
+				<view class="u-m-t-10 u-flex">
+					<view class="text-ming-w">剩余库存</view>
+					<view class="u-m-l-10 color-main">{{data.leftNumber+data.stockNumber}}{{data.unitName}}</view>
+				</view>
+			</view>
+			<view class="u-flex-1 u-flex u-row-right">
+				<view>
+					<view class="no-wrap">
+						<text class="color-main font-bold" v-if="data.stockNumber>0">{{data.stockNumber}}</text>
+						<text class="color-red font-bold" v-else>{{data.stockNumber}}</text>
+						<text>{{data.unitName}}</text>
+					</view>
+					<!-- <view class="u-m-t-10">剩余库存</view> -->
+				</view>
+
+			</view>
+		</view>
+
+		<!-- <view class="u-flex u-row-right u-m-t-20">
+			<view class="u-flex u-m-r-30">
+				<my-button shape="circle" height="70" type="default" @tap="del">
+					<view class="u-p-l-30 u-p-r-30">
+						删除
+					</view>
+				</my-button>
+			</view>
+			<view class="u-flex">
+				<my-button shape="circle" height="70" plain type="primary" @tap="more">更多操作</my-button>
+			</view>
+		</view> -->
+	</view>
+</template>
+
+<script setup>
+	import go from '@/commons/utils/go.js'
+	import color from '@/commons/color.js'
+
+	function del() {
+		console.log('del');
+	}
+	const props = defineProps({
+		index: {
+			type: Number
+		},
+		data: {
+			type: Object,
+			default: () => {
+				return {}
+			}
+		}
+	})
+	const emits = defineEmits(['more'])
+
+	function more() {
+		emits('more', props.index)
+	}
+</script>
+
+<style lang="scss" scoped>
+	.text-ming-w{
+		min-width: calc(28rpx * 5);
+	}
+	.item {
+		padding: 32rpx 32rpx 28rpx 28rpx;
+
+		.tag {
+			color: $my-main-color;
+			background-color: rgb(234, 244, 255);
+			border-radius: 8rpx;
+			padding: 2rpx 10rpx;
+			font-size: 24rpx;
+		}
+
+		.id {
+			padding: 2rpx 10rpx;
+			border-radius: 8rpx;
+		}
+
+		.info {}
+	}
+
+	.addNumber {
+		position: absolute;
+		left: 100%;
+		top: 50%;
+		padding-left: 20rpx;
+		transform: translateY(-50%);
+	}
+</style>

pageProduct/invoicing-list/invoicing-list.vue

@@ -0,0 +1,314 @@
+<template>
+	<view class="color-333 u-font-28">
+		<up-sticky :offset-top="0">
+			<view class=" bg-fff u-flex u-p-l-30 u-row-between">
+				<view class="u-flex  ">
+					<view class="u-flex u-p-t-30 u-p-b-30 u-flex-1 u-row-center" @tap="timeToggle">
+						<text class="u-m-r-12 no-wrap" :class="{'color-main':filters.time.start&&filters.time.end}">筛选时间</text>
+						<image src="/pageProduct/static/images/icon-arrow-down-fill.svg" class="icon-arrow-down-fill"
+							mode="">
+						</image>
+					</view>
+					<view class="u-flex u-m-l-60 u-p-t-30 u-p-b-30  u-flex-1 u-row-center" @tap="showTypesToggle">
+						<text class="u-m-r-12" v-if="types.active===''"> 选择类型</text>
+						<text class="u-m-r-12 no-wrap color-main" v-else>{{types.list[types.active].text}}</text>
+						<image src="/pageProduct/static/images/icon-arrow-down-fill.svg" class="icon-arrow-down-fill"
+							mode="">
+						</image>
+					</view>
+				</view>
+			
+				<view :style="{height:types.show?typesHeight:0}" class="tranistion types overflow-hide">
+					<view @tap="changeTypesActive(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
+						v-for="(item,index) in types.list" :key="index">
+						<view>{{item.text}}</view>
+						<uni-icons v-if="types.active===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
+					</view>
+					<view :style="{height: types.bottomHeight+'px'}"></view>
+				</view>
+			</view>
+		</up-sticky>
+		
+
+		<view class=" min-page bg-gray list u-p-30">
+			<view class="u-flex u-m-b-30" v-if="filters.time.start&&filters.time.end">
+				<view class="time-area u-font-24 color-main u-flex">
+					<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="filters.time.start"></uni-dateformat>
+					<text class="u-p-l-10 u-p-r-10">至</text>
+					<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="filters.time.end"></uni-dateformat>
+					<view class="u-m-l-10 u-flex" @tap="clearTime">
+						<uni-icons type="clear" size="18" :color="color.ColorMain"></uni-icons>
+					</view>
+				</view>
+			</view>
+
+			<!-- <view class="recoreds color-fff ">
+				<view class="u-font-32">详情记录</view>
+				<view class="u-flex u-row-between u-m-t-48">
+					<view class="u-flex u-flex-col u-row-center u-col-center">
+						<view>变动数量</view>
+						<view class="u-font-32 u-m-t-10 font-bold">{{pageData.changeSum}}</view>
+					</view>
+				</view>
+			</view> -->
+			<template v-if="pageData.list.length">
+				<view class="u-m-b-28 " v-for="(item,index) in pageData.list" :key="index">
+					<my-list-item :data="item" ></my-list-item>
+				</view>
+				<my-pagination :size="pageData.size" :totalElements="pageData.totalElements"
+					@change="pageChange"></my-pagination>
+				<!-- <uni-load-more :status="pageData.status" /> -->
+			</template>
+			<template v-if="pageData.hasAjax&&!pageData.list.length">
+				<view class="" style="margin-top: 150rpx;">
+					<my-img-empty tips="暂无记录"></my-img-empty>
+				</view>
+			</template>
+
+		</view>
+
+	<my-date-pickerview @confirm="datePickerConfirm" ref="datePicker" mode="all"></my-date-pickerview>
+	<my-mask ref="mask" @close="hideType"></my-mask>
+	</view>
+
+</template>
+
+<script setup>
+	import {
+		onLoad,
+		onReady,
+		onShow,
+		onPageScroll,
+		onPullDownRefresh
+	} from '@dcloudio/uni-app';
+	import color from '@/commons/color';
+	import myListItem from './components/list-item.vue';
+	import {
+		ref,
+		reactive,
+		computed,
+		watch
+	} from 'vue';
+	import {
+		$getProductDetail,
+		$getProductStockDetail,$getProductStockDetailSum
+	} from '@/http/yskApi/goods.js'
+	import {
+		$invoicingType
+	} from '@/commons/goodsData.js'
+	const search = reactive({
+		keyword: '',
+		show: false
+	})
+
+	function searchConfirm() {
+
+	}
+
+	function hideSearch() {
+		search.show = false
+		maskHide()
+	}
+
+	function showSearch() {
+		search.show = true
+		types.show = false
+		maskShow()
+	}
+
+
+	// 库存分类
+	const types = reactive({
+		list:$invoicingType,
+		active: '',
+		show: false,
+		bottomHeight: 14
+	})
+
+	function hideType() {
+		types.show = false
+		search.show = false
+	}
+	const typesHeight = computed(() => {
+		return 30 * types.list.length + types.bottomHeight + 'px'
+	})
+
+	function changeTypesActive(i) {
+		types.active = i
+		types.show = false
+		toggleMask()
+	}
+
+	function showTypesToggle() {
+		types.show = !types.show
+		maskShow()
+	}
+	
+	// 页数改变事件
+	function pageChange(page) {
+		pageData.query.page=page-1
+		init()
+	}
+	
+
+	const filters = reactive({
+		time: {
+			start: '',
+			end: ''
+		}
+	})
+	
+	function resetQuery(){
+		pageData.query.page=0
+	}
+	function clearTime() {
+		filters.time.start = ''
+		filters.time.end = ''
+		resetQuery()
+		init()
+	}
+
+	const datePicker = ref(null)
+	function datePickerConfirm(e) {
+		filters.time.start = e.start
+		filters.time.end = e.end
+		resetQuery()
+		init()
+	}
+
+	function timeToggle() {
+		datePicker.value.toggle()
+	}
+
+
+	const mask = ref(null)
+
+	function toggleMask(show) {
+		mask.value.toggle()
+	}
+
+	function maskShow() {
+		mask.value.open()
+	}
+
+	function maskHide() {
+		mask.value.close()
+	}
+
+	
+	const pageData = reactive({
+		query: {
+			page: 0,
+			size: 10,
+			productId:'',
+			column:'/api/tbProductStockDetail/stock/count',
+			shopId:uni.getStorageSync('shopId'),
+			createdAt:[]
+		},
+		totalElements: 0,
+		list: [],
+		status: 'noMore',
+		hasAjax:false,
+		changeSum:0
+	})
+	async function init() {
+		const createdAt=(filters.time.start&&filters.time.end)?[filters.time.start,filters.time.end ]:[]
+		const res = await $getProductStockDetail({
+			...pageData.query,
+			type:types.active!==''?types.list[types.active].value:'',
+			createdAt
+		})
+		pageData.hasAjax=true
+		pageData.list = res.content
+		pageData.totalElements = res.totalElements
+	}
+	async function getSum(){
+		const res = await $getProductStockDetailSum({
+			productId: pageData.query.productId
+		})
+		pageData.changeSum = res.exchange
+	}
+	watch(()=>types.active,(newval)=>{
+		resetQuery()
+		init()
+	})
+	
+	onLoad(opt => {
+		console.log(opt);
+		Object.assign(pageData.query,opt)
+		init()
+		// getSum()
+	})
+</script>
+
+<style lang="scss" scoped>
+	.fixed-top {
+		z-index: 10;
+	}
+
+	.recoreds {
+		background: linear-gradient(127deg, #33A0FF 0%, #6699FF 100%);
+		box-shadow: 0rpx 20rpx 60rpx 2rpx rgba(92, 112, 248, 0.2);
+		border-radius: 14rpx 14rpx 14rpx 14rpx;
+		padding: 32rpx 40rpx 40rpx 48rpx;
+		position: relative;
+		overflow: hidden;
+
+		&::after {
+			content: '';
+			top: -112rpx;
+			border-radius: 50%;
+			display: block;
+			position: absolute;
+			right: 56rpx;
+			width: 224rpx;
+			box-shadow: 0 0 1px #666;
+			height: 224rpx;
+			background: linear-gradient(180deg, rgba(103, 204, 254, 0.6) 0%, rgba(144, 87, 255, 0) 100%);
+		}
+	}
+
+	.search-box {
+		background-color: #fff;
+		padding: 16rpx 0;
+		top: 0;
+		bottom: 0;
+		position: absolute;
+		right: 30rpx;
+		display: flex;
+
+		.search-btn {
+			padding: 0 30rpx;
+			box-sizing: border-box;
+			display: flex;
+			align-items: center;
+			// width: 164rpx;
+			transition: all .3s ease-in-out;
+			background-color: rgb(247, 247, 247);
+			border-radius: 100px;
+		}
+	}
+
+	.types {
+		position: absolute;
+		top: 100%;
+		left: 0;
+		right: 0;
+		z-index: 10;
+		background-color: #fff;
+	}
+
+	.time-area {
+		background: #E6F0FF;
+		border-radius: 100px;
+		padding: 10rpx 20rpx;
+	}
+
+	.icon-arrow-down-fill {
+		width: 16rpx;
+		height: 10rpx;
+	}
+
+	.list {
+	}
+</style>

pageProduct/specification-template/components/specifications-item.vue

@@ -0,0 +1,128 @@
+<template>
+	<view class="item">
+		<view class="u-flex u-row-between">
+			<view>#{{index+1}}  {{data.name}}</view>
+			<view class="color-666 u-font-24 id">ID:{{data.id}}</view>
+		</view>
+		<view class="u-m-t-16 color-666 u-font-24 u-p-b-24 border-bottom">
+			添加时间：
+			<uni-dateformat :date="data.createdAt"></uni-dateformat>
+		</view>
+		<view class="u-m-t-24">
+			<view v-for="(spec,specIndex) in data.specList" :key="specIndex">
+				<view class="font-bold " :class="{'u-m-t-32':specIndex>0}"> {{spec.name}}</view>
+				<view class="u-m-t-24 bg-gray u-flex u-flex-wrap options u-p-24">
+					<view class="u-flex option" v-for="(option,optionIndex) in spec.value" :key="optionIndex" @tap="statusClick(optionIndex)">
+						{{option}}
+						<!-- <view class="sellout" v-if="option.sellOut">已售罄</view>
+						<view class="tag-primary tag" v-if="option.status">上架中</view>
+						<view class="tag-gray tag" v-else>上架中</view> -->
+					</view>
+				</view>
+			</view>
+			
+		</view>
+		<view class="u-m-t-20 u-flex u-row-right btns">
+			<my-button @tap="del" :plain="btnProps.plain" :fontSize="btnProps.fontSize" :width="btnProps.width" :height="btnProps.height" type="cancel" :shape="btnProps.shape" >删除</my-button>
+			<my-button @tap="edit" :plain="btnProps.plain" :fontSize="btnProps.fontSize" :width="btnProps.width" :height="btnProps.height"  :shape="btnProps.shape">编辑</my-button>
+		</view>
+	</view>
+</template>
+
+<script setup>
+import { reactive, ref } from 'vue';
+	import myButton from "@/components/my-components/my-button.vue"
+	import go from '@/commons/utils/go.js'
+	const props=defineProps({
+		index:{
+			type:Number,
+		},
+		data:{
+			type:Object,
+			default:()=>{
+				return {}
+			}
+		}
+	})
+	const emits=defineEmits(['del','edit','statusClick'])
+	function del(){
+		emits('del',props.index)
+	} 
+	function edit(){
+		uni.$emit('edit:spec',props.data)
+		uni.setStorageSync('spec',props.data)
+		go.to('PAGES_PRODUCT_GUIGE_ADD', {
+			type: 'edit'
+		})
+		// emits('edit',props.index)
+	}
+	function statusClick(optionIndex){
+		emits('statusClick',[props.index,optionIndex])
+	}
+	const btnProps=reactive({
+		shape:'circle',
+		width:120,
+		height:48,
+		fontSize:24,
+		plain:true
+	})
+	
+	
+</script>
+
+<style lang="scss" scoped>
+	.btns{
+		gap: 0 20rpx;
+	}
+	.item{
+		background: #FFFFFF;
+		padding: 32rpx 24rpx;
+		border-radius: 18rpx 18rpx 18rpx 18rpx;
+		margin-bottom: 30rpx;
+		.id{
+			background: #F4F4F4;
+			padding: 6rpx 10rpx;
+			border-radius: 8rpx 8rpx 8rpx 8rpx;
+		}
+		.options{
+			gap: 10rpx 50rpx;
+			.option{
+				padding: 12rpx 40rpx;
+				background: #F0F2F5;
+				border-radius: 4rpx;
+				font-size: 24rpx;
+				position: relative;
+				color: #666;
+				overflow: hidden;
+				.tag{
+					position: absolute;
+					right: 0;
+					top: 0;
+					font-size: 12rpx;
+					right: 0;
+					padding: 2rpx 4rpx;
+					border-radius: 0rpx 4rpx 4rpx 4rpx;
+				}
+				.sellout{
+					position: absolute;
+					left: 0;
+					right: 0;
+					bottom: 0;
+					background-color: rgb(147, 147, 153);
+					color: #fff;
+					text-align: center;
+					font-size: 20rpx;
+				}
+				.tag-primary{
+					background-color: $my-main-color;
+					color: #fff;
+				}
+				.tag-gray{
+					background-color: rgb(147, 147, 153);
+					color: #fff;
+				}
+			}
+			
+		}
+	}
+</style>

pageProduct/specification-template/specification-template.vue

@@ -0,0 +1,183 @@
+<template>
+	<view class="u-p-30 min-page bg-gray">
+		<view v-for="(item,index) in pageData.list" :key="index">
+			<specifications-item @statusClick="specificationsStatusClick" @del="delSpecifications" @edit="editSpecifications" :data="item" :index="index"></specifications-item>
+		</view>
+		<view class="u-m-t-44">
+			<my-pagination  :size="pageData.query.size" :totalElements="pageData.totalElements"   @change="pageChange"></my-pagination>
+			<view style="height: 200rpx;"></view>
+		</view>
+
+		<my-model :showBtn="modelData.showBtn" ref="model" @confirm="modelConfirm" :title="modelData.title" :desc="modelData.desc">
+			<template #desc> 
+				<view class="u-p-30 u-m-t-40 u-p-b-60" v-if="specificationsData">
+					<view class="u-flex u-row-between">
+						<view>当前状态</view>
+						<view class="u-flex-1 u-p-l-60">
+							<uni-data-checkbox v-model="specificationsData.status"
+							@change="specificationsStatusChange"
+								:localdata="statusData"></uni-data-checkbox>
+						</view>
+							
+					</view>
+					<view class="u-m-t-30 u-p-t-30" style="border-top: 1px solid rgb(245, 245, 245);">
+						<view class="u-flex u-row-between">
+							<view>售罄</view>
+							<my-switch @change="specificationsSellOutChange" v-model="specificationsData.sellOut"></my-switch>
+						</view>
+					</view>
+					
+				</view>
+			</template>
+			
+		</my-model>
+
+		<view class="fixed-b">
+			<my-button @tap="toAdd" shape="circle">添加规格组</my-button>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import {
+		reactive,
+		ref
+	} from 'vue';
+	import {onLoad,onShow} from '@dcloudio/uni-app'
+	import go from '@/commons/utils/go.js';
+	import myPagination from '@/components/my-components/my-pagination.vue'
+	import myModel from '@/components/my-components/my-model.vue'
+	import myButton from '@/components/my-components/my-button.vue'
+	import mySwitch from '@/components/my-components/my-switch.vue'
+	import specificationsItem from './components/specifications-item.vue'
+	import {$productSpec} from '@/http/yskApi/goods.js'
+	
+
+	const statusData=[
+		{
+			text: '上架中',
+			value: 1
+		},
+		{
+			text: '已下架',
+			value: 0
+		}
+	]
+	
+	const model = ref(null)
+	const specificationsData=reactive({
+		index:null,
+		optionIndex:null,
+		status:1,
+		sellOut:false
+	})
+	function specificationsSellOutChange(isSellOut){
+		const {index,optionIndex}=specificationsData
+		if(index!==null&&optionIndex!==null){
+			pageData.list[index].options[optionIndex].sellOut=isSellOut
+		}
+	}
+	function specificationsStatusChange(e){
+		const {index,optionIndex}=specificationsData
+		if(index!==null&&optionIndex!==null){
+			pageData.list[index].options[optionIndex].status=e.detail.value
+		}
+	}
+	function modelOpen(){
+		model.value.open()
+	}
+	function modelClose(){
+		model.value.close()
+	}
+	function modelConfirm(){
+		console.log('modelConfirm');
+		modelClose()
+	}
+	const modelData = reactive({
+		title: '',
+		desc: '',
+		showBtn:true
+	})
+	const pageData = reactive({
+		query:{
+			page: 0,
+			size:10
+		},
+		totalElements:0,
+		list: []
+	})
+	
+	function delSpecifications(index){
+		uni.showModal({
+			title: '提示',
+			content: '删除后使用此模板的商品将取消此规格,是否继续?',
+			success: function (res) {
+				if (res.confirm) {
+					console.log('用户点击确定');
+					$productSpec.del([pageData.list[index].id]).then(res=>{
+						uni.showToast({
+							title:'删除成功',
+							icon:'none'
+						})
+						init()
+					})
+				} 
+			}
+		});
+	}
+	function specificationsStatusClick(arr){
+		console.log(arr);
+		modelData.title=pageData.list[arr[0]].name
+		modelData.desc=''
+		modelData.showBtn=false
+		
+		specificationsData.status=1
+		specificationsData.sellOut=false
+		specificationsData.index=arr[0]
+		specificationsData.optionIndex=arr[1]
+		// modelOpen()
+	}
+	function pageChange(page) {
+		pageData.query.page=page-1
+		init()
+	}
+
+	let emitName = 'guigeEdit'
+
+	uni.$on(emitName, function(data) {
+		console.log(data);
+	})
+	
+	function editSpecifications(index){
+		uni.setStorageSync('guige', pageData.list[index])
+		emitName='guigeEdit'
+		go.to('PAGES_PRODUCT_GUIGE_ADD', {
+			emitName: emitName
+		})
+	}
+
+	function toAdd() {
+		// uni.setStorageSync('guige', FormData.specificationsGroup)
+		go.to('PAGES_PRODUCT_GUIGE_ADD')
+	}
+	
+	function init(){
+		$productSpec.get(pageData.query).then(res=>{
+			console.log(res);
+			pageData.list=res.content
+			pageData.totalElements=res.totalElements
+		})
+	}
+	onShow(()=>{
+		init()
+	})
+</script>
+
+<style lang="scss">
+	.fixed-b {
+		position: fixed;
+		left: 110rpx;
+		right: 110rpx;
+		bottom: 80rpx;
+	}
+</style>

pageProduct/static/images/icon-arrow-down-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8.42" height="4.945" viewBox="0 0 8.42 4.945"><defs><style>.a{fill:#333;}</style></defs><path class="a" d="M230.634,368.187a.7.7,0,0,0-.513-.187l-7,.047a.7.7,0,0,0-.513.187.676.676,0,0,0,0,.979l3.5,3.5c.047.047.14.093.187.14l.047.047a.731.731,0,0,0,.746-.14l3.5-3.546A.735.735,0,0,0,230.634,368.187Z" transform="translate(-222.4 -368)"/></svg>

pageProduct/static/images/icon-arrow-right.svg

@@ -0,0 +1,3 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 110 110" class="design-iconfont">
+  <path d="M51 47L59 55L51 63" stroke="#999" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

pageProduct/static/images/icon-guige.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20.925" height="20.925" viewBox="0 0 20.925 20.925"><defs><style>.a{fill:#666;}</style></defs><path class="a" d="M20.925,6.278,10.463,0,0,6.278l10.463,6.278ZM10.463,2.093l7.324,4.185-7.324,4.185L3.139,6.278ZM2.093,13.811V15.9l8.37,5.022,8.37-5.022V13.811l-8.37,5.022-8.37-5.022Z"/><path class="a" d="M102.4,471.04v2.093l8.37,5.022,8.37-5.022V471.04l-8.37,5.022Z" transform="translate(-100.308 -461.414)"/></svg>

pageProduct/util.js

@@ -0,0 +1,41 @@
+import {
+	$types
+} from '@/commons/goodsData.js'
+export function returnSkuSnap(goods) {
+	const selectSpec = typeof goods.selectSpec === 'string' ? JSON.parse(goods.selectSpec) : goods.selectSpec
+	let result = selectSpec.map(v => {
+		return {
+			name: v.name,
+			value: v.selectSpecResult.join(',')
+		}
+	})
+	return result
+}
+export function returnTypeEnum(typeEnum) {
+	const item = $types.find(v => v.title == typeEnum)
+	let result = item ? item.value : undefined
+	return result
+}
+export function returnCategory(cateName, cateList) {
+	console.log(cateName);
+	console.log(cateList);
+	const item = cateList.find(v => v.name == cateName)
+	let result = item ? item : undefined
+	return result
+}
+export function returnAllCategory(arr) {
+	const result = arr.reduce((prve, cur) => {
+		prve.push(...[{
+			...cur,
+			name: '' + cur.name,
+			childrenList: undefined
+		}, ...cur.childrenList.map(v => {
+			return {
+				...v,
+				name: '' + v.name
+			}
+		})])
+		return prve
+	}, [])
+	return result
+}