diff --git a/src/layout/components/appointTime.vue b/src/layout/components/appointTime.vue
index e23a97b..da0919d 100644
--- a/src/layout/components/appointTime.vue
+++ b/src/layout/components/appointTime.vue
@@ -4,6 +4,7 @@
<div v-for="(item, index) in dayList" :key="index">
<div class="inner" style="font-size: medium;">
第{{ index + 1 }}天
+ <el-checkbox v-model="isAvailableArray[index]" label="这天可预约" style="margin-left: 10px;"/>
</div>
<!-- 时间段部分 -->
<div class="time-picker">
@@ -22,14 +23,16 @@
<el-select v-model="timeList[index][row].minNumValue"
placeholder="最小人数"
style="width: 100px"
- @change="minNumFun(timeList[index][row].minNumValue,index,row)">
+ @change="minNumFun(index,row)">
<el-option v-for="item in minOptions[index][row]"
:key="item"
:value="item" />
</el-select>
- <el-select v-model="timeList[index][row].maxNunValue"
+ <el-select v-model="timeList[index][row].maxNumValue"
placeholder="最大人数"
- style="width: 100px">
+ style="width: 100px"
+ @change="maxNumFun(index,row)"
+ >
<el-option v-for="item in maxOptions[index][row]"
:key="item"
:value="item" />
@@ -40,7 +43,6 @@
<el-button circle @click="subList(index, row)" v-if="row + 1 > 1"><el-icon>
<Minus />
</el-icon></el-button>
- <el-checkbox v-model="timeList[index][row].isAvailable" label="此时间段可预约" style="margin-left: 10px;"/>
</div>
</div>
</div>
@@ -60,7 +62,8 @@
<script setup lang="ts">
import { onMounted, ref , defineEmits } from 'vue'
import { Plus } from '@element-plus/icons-vue';
-
+import { transfer } from '../../utils/dealStringArray'; //导入js函数
+import { ElMessage } from 'element-plus';
const dayList = ref([0, 1, 2, 3]) //今天和未来三天
const timeList = ref([ //时间段数组，可以直接通过timeList[index][row]访问对应的时间段
[
@@ -68,8 +71,7 @@ const timeList = ref([ //时间段数组，可以直接通过timeList[index][
startTime: '',
endTime: '',
minNumValue: '',
- maxNunValue: '',
- isAvailable: false
+ maxNumValue: ''
}
],
[
@@ -77,8 +79,7 @@ const timeList = ref([ //时间段数组，可以直接通过timeList[index][
startTime: '',
endTime: '',
minNumValue: '',
- maxNunValue: '',
- isAvailable: false
+ maxNumValue: ''
}
],
[
@@ -86,8 +87,7 @@ const timeList = ref([ //时间段数组，可以直接通过timeList[index][
startTime: '',
endTime: '',
minNumValue: '',
- maxNunValue: '',
- isAvailable: false
+ maxNumValue: ''
}
],
[
@@ -95,12 +95,13 @@ const timeList = ref([ //时间段数组，可以直接通过timeList[index][
startTime: '',
endTime: '',
minNumValue: '',
- maxNunValue: '',
- isAvailable: false
+ maxNumValue: ''
}
]
])
-
+const isAvailableArray = ref(
+ Array.from({length:4},()=>(false))
+)
//人数数组，初始化好四天六个时间段的人数
const minOptions = ref(
Array.from({length:4},()=>(
@@ -117,32 +118,7 @@ const maxOptions = ref(
))
)
const flag = ref(0) //第一个人数下标
-const appointmentDateAddRequestList = ref(
- Array.from({length: 4},()=>(
- {
- timeSlot: '',
- isAvailable: 0,
- numberRange: ''
- }
- )),
-)
-
var arr = new Array(4)
-const init = () => {
- for (var i = 0; i < 4; i ++ ) {
- arr[i] = new Array(6)
- }
- for (var i = 0; i < 4; i ++ ) {
- for (var j = 0; j < 6; j ++ ) {
- arr[i][j] = {
- timeSlot: '',
- numberRange: '',
- isAvailable: ''
- }
- }
- }
-}
-
const emit = defineEmits(['time-Info']) //组件绑定
onMounted(()=>{
init()
@@ -161,8 +137,7 @@ const addList = (index: any, row: any) => {
startTime: '',
endTime: '',
minNumValue: '',
- maxNunValue: '',
- isAvailable: false
+ maxNumValue: ''
})
flag.value += 1
}
@@ -170,94 +145,55 @@ const addList = (index: any, row: any) => {
const subList = (index: number, row: number) => {
timeList.value[index].splice(row, 1)
}
-const minNumFun = (number : any,index : number,row : number)=> {
- maxOptions.value[index][row].splice(0,number-5)
+const minNumFun = (index : number,row : number)=> {
+ if(timeList.value[index][row].maxNumValue < timeList.value[index][row].minNumValue && timeList.value[index][row].maxNumValue != '') {
+ ElMessage({
+ type: 'error',
+ message: '最小人数不大于最大人数'
+ })
+ timeList.value[index][row].minNumValue = ''
+ return;
+ }
}
-import { transfer } from '../../utils/dealStringArray';
//组件传值
const onSubmit =()=> {
- let tempArr = transfer(timeList.value, arr)
- console.log(tempArr)
+ let tempArr = transfer(timeList.value, arr,isAvailableArray.value)
+ // console.log(tempArr)
//将数组处理成后端格式
emit('time-Info',tempArr)
}
-
-
-
-// const isNotValid = (val:any) => {
-// const timeRegex = /^([0-1]?[0-9]|2[0-3]):([0-5]?[0-9])-(?:[0-1]?[0-9]|2[0-3]):([0-5]?[0-9])$/;
-// const rangeRegex = /^\(\d+,\d+\)$/
-// return timeRegex.test(val.timeSlot) && rangeRegex.test(val.numberRange)
-// }
-
-// const isValidPlus = (val:any) => {
-// const timeRegex = /^([0-1]?[0-9]|2[0-3]):([0-5]?[0-9])-(?:[0-1]?[0-9]|2[0-3]):([0-5]?[0-9])$/;
-// const rangeRegex = /^\(\d+,\d+\)$/
-// if(val.timeSlot === '' && val.numberRange === '') return false
-// if(timeRegex.test(val.timeSlot) && rangeRegex.test(val.numberRange)) return false
-// return true
-// }
-
-// const transfer = (val:any) => {
-// for (var i = 0; i < val.length; i ++ ) {
-// for (var j = 0; j < val[i].length; j ++ ) {
-// arr[i][j].timeSlot = val[i][j].startTime + "-" + val[i][j].endTime
-// arr[i][j].numberRange = "(" + val[i][j].minNumValue + "," + val[i][j].maxNunValue + ")"
-// arr[i][j].isAvailable = val[i][j].isAvailable
-// }
-// }
-// // console.log(arr)
-// for (var i = 0; i < 4; i ++ ) {
-// for (var j = 0; j < 6; j ++ ) {
-// if(isValidPlus(arr[i][j])) {
-// ElMessage({
-// type: 'error',
-// message: '请检查表单数据是否完整填写'
-// })
-// return ;
-// }
-// }
-// }
-// let newArr:any = new Array(4)
-// for (var i = 0; i < 4; i ++ ) {
-// newArr[i] = {
-// timeSlot:'',
-// numberRange: '',
-// isAvailable: true
-// }
-// }
-
-// let timeSlotArr:any = []
-// let numberRangeArr:any = []
-// for (var i = 0; i < val.length; i ++ ) {
-// for (var j = 0; j < val[i].length; j ++ ) {
-// if(isNotValid(arr[i][j])) {
-// timeSlotArr.push(arr[i][j].timeSlot)
-// numberRangeArr.push(arr[i][j].numberRange)
-// }
-// }
-// newArr[i].timeSlot = timeSlotArr.join(';')
-// newArr[i].numberRange = numberRangeArr.join(';')
-// timeSlotArr = []
-// numberRangeArr = []
-// }
-// console.log(newArr)
-// return newArr
-// }
-
-
-
-
const resetForm=()=>{
- console.log(3333)
for(let i=0;i<4;i++) {
timeList.value[i] = [{
startTime: '',
endTime: '',
minNumValue: '',
- maxNunValue: '',
- isAvailable: false
+ maxNumValue: '',
}]
+ isAvailableArray.value[i] = false
+ }
+}
+const init = () => {
+ for (var i = 0; i < 4; i ++ ) {
+ arr[i] = new Array(6)
+ }
+ for (var i = 0; i < 4; i ++ ) {
+ for (var j = 0; j < 6; j ++ ) {
+ arr[i][j] = {
+ timeSlot: '',
+ numberRange: '',
+ isAvailable: ''
+ }
+ }
+ }
+}
+const maxNumFun =(index: number ,row: number)=>{
+ if(timeList.value[index][row].maxNumValue < timeList.value[index][row].minNumValue) {
+ ElMessage({
+ type: 'error',
+ message: '最大人数应该大于最小人数'
+ })
+ return;
}
}
</script>
diff --git a/src/utils/dealStringArray.js b/src/utils/dealStringArray.js
index da09d2e..a773855 100644
--- a/src/utils/dealStringArray.js
+++ b/src/utils/dealStringArray.js
@@ -1,4 +1,3 @@
-
import { ElMessage } from 'element-plus';
const isNotValid = (val) => {
@@ -15,12 +14,11 @@ const isValidPlus = (val) => {
return true
}
-export const transfer = (val, arr) => {
+export const transfer = (val, arr, isAvailableArr) => {
for (var i = 0; i < val.length; i ++ ) {
for (var j = 0; j < val[i].length; j ++ ) {
arr[i][j].timeSlot = val[i][j].startTime + "-" + val[i][j].endTime
- arr[i][j].numberRange = "(" + val[i][j].minNumValue + "," + val[i][j].maxNunValue + ")"
- arr[i][j].isAvailable = val[i][j].isAvailable
+ arr[i][j].numberRange = "(" + val[i][j].minNumValue + "," + val[i][j].maxNumValue + ")"
}
}
// console.log(arr)
@@ -40,7 +38,7 @@ export const transfer = (val, arr) => {
newArr[i] = {
timeSlot:'',
numberRange: '',
- isAvailable: true
+ isAvailable: false
}
}
@@ -55,6 +53,7 @@ export const transfer = (val, arr) => {
}
newArr[i].timeSlot = timeSlotArr.join(';')
newArr[i].numberRange = numberRangeArr.join(';')
+ newArr[i].isAvailable = isAvailableArr[i] ? 1 : 0
timeSlotArr = []
numberRangeArr = []
}
diff --git a/src/views/Commodity/MerchandiseCenter.vue b/src/views/Commodity/MerchandiseCenter.vue
index dc48fb5..c3a56cf 100644
--- a/src/views/Commodity/MerchandiseCenter.vue
+++ b/src/views/Commodity/MerchandiseCenter.vue
@@ -370,7 +370,7 @@ const delBatch = async ()=>{
ElMessage.error('删除失败')
}
}
-const load =()=>{}
+const handleSelectionChange =()=>{}
</script>
<style scoped>
diff --git a/src/views/ServiceType/AddServiceProduct.vue b/src/views/ServiceType/AddServiceProduct.vue
index 41f60dd..43e9605 100644
--- a/src/views/ServiceType/AddServiceProduct.vue
+++ b/src/views/ServiceType/AddServiceProduct.vue
@@ -4,7 +4,7 @@
<!-- 表单 ref 和 prop绑定 用于重置表单 -->
<el-form ref="resetFormData" :model="form" label-width="auto" style="width: 750px;" size="large">
<div class="totalPicture">
- <div class="boxPicture1">
+ <div>
<el-form-item label="添加课程展示图片">
<!-- 下面的event的作用,传入当前事件对象 -->
<el-upload ref="uploadProductImg" action="#" list-type="picture-card" :auto-upload="false" multiple="true"
@@ -45,9 +45,21 @@
<el-input v-model="form.intro" type="textarea" style="width: 600px;" />
</el-form-item>
<!-- 使用弹窗 -->
+ <div class="midBox">
<el-form-item label="产品类别" prop="type">
- <el-select v-model="selectValue" disabled style="width: 110px;" />
+ <el-select v-model="form.type" disabled style="width: 110px;" />
</el-form-item>
+ <el-form-item label="节日限定" prop="type">
+ <el-select v-model="festivalValue" style="width: 110px;" placeholder="请选择" @change="setFestival">
+ <el-option
+ v-for="item in festivalList"
+ :key="item"
+ :label="item"
+ :value="item"
+ />
+ </el-select>
+ </el-form-item>
+ </div>
<el-form-item label="商品标签" prop="label">
<el-input v-model="form.label" type="textarea" placeholder="使用英文;分隔符分开" style="width: 600px;" />
</el-form-item>
@@ -72,7 +84,7 @@
</template>
<script setup lang="ts">
-import { ref, onMounted, inject } from 'vue';
+import { ref, onMounted, inject, toRaw } from 'vue';
import { Plus } from '@element-plus/icons-vue';
import { ElMessage, type UploadFile, type UploadProps, genFileId, type UploadRawFile } from 'element-plus';
import myAxios from "@/api/myAxios";
@@ -81,25 +93,26 @@ const fileSimple = ref() //单个文件
const uploadedFiles = ref<UploadFile[]>([]);//商品图片数组
const uploadedDescription = ref<UploadFile[]>([]);//商品图文描述数组
const resetFormData = ref()
-const selectValue = '服务类'
const form = ref({
name: '',
price: '', //商品价格
intro: '',//产品简介
- type: '',//类别
+ type: '服务类',//类别
label: '',//商品标签
introDetail: '',//详情描述
goodImg: '', //商品图片url
detailImg: '', //图文详情url
- timePeriod: '',
- people: 0,
- date: []
+ festivalOrder: 0,
+ inventory: 1,
+ appointmentDateAddRequestList: [] //预约时间段，是否可预约，人数范围
})
+const festivalList = ['非限定','端午节','元宵节','元旦']
//导入组件刷新
const reload: any = inject("reload")
const uploadProductImg: any = ref() //图片上传的ref绑定
const uploadProductDetail: any = ref() //图片上传的ref绑定
const timeInfo = ref([]) //组件传过来的信息
+const festivalValue = ref('')
onMounted(() => {
// console.log(myDate.getHours()); //打印当前小时数
})
@@ -107,17 +120,31 @@ const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
console.log(uploadFile, uploadFiles)
}
//提交表单
-const onSubmit = async () => {
+const onSubmit = async () => {
const values = Object.values(form.value);
// 使用some()方法来检查是否有任何值为空
- if (values.some(value => value === null || value === undefined || value === '')) {
+ if (values.some(value => value === null || value === undefined || value === '') || form.value.appointmentDateAddRequestList.length == 0) {
ElMessage({
type: 'warning',
message: '请检查表单数据是否完整填写'
})
return; //空返回结束函数
}
- const res = await myAxios.post('/goods/add', { ...form.value })
+ console.log(form.value);
+ const res = await myAxios.post('/goods/add/service', {
+ name: form.value.name,
+ type: form.value.type,
+ price: form.value.price,
+ goodImg: form.value.goodImg,
+ intro: form.value.intro,
+ introDetail: form.value.introDetail,
+ detailImg: form.value.detailImg,
+ label: form.value.label,
+ inventory: form.value.inventory,
+ festivalOrder: form.value.festivalOrder,
+ appointmentDateAddRequestList: toRaw(form.value.appointmentDateAddRequestList)
+ })
+ console.log(res.data);
if (res.data.code === 1) {
ElMessage({
type: 'success',
@@ -168,8 +195,14 @@ const Exceed_ProductDetail: UploadProps['onExceed'] = (files) => { //覆盖商
uploadProductDetail.value!.handleStart(file)
}
const getInfo =(info:any)=>{
- timeInfo.value = info
- console.log('--->',info.value);
+ console.log('info-->',info);
+ // timeInfo.value = info
+ form.value.appointmentDateAddRequestList = info
+}
+const setFestival =(info:any)=>{
+ console.log(info);
+ form.value.festivalOrder = festivalList.findIndex(value=>value == info)
+ console.log(form.value.festivalOrder);
}
</script>
@@ -196,7 +229,9 @@ const getInfo =(info:any)=>{
justify-content: space-evenly;
/* 盒子里面水平分隔开 */
}
-
+.midBox {
+ display: flex;
+}
.date-picker {
flex: 0.3;
/* 日期选择区域占据左边 */
@@ -221,4 +256,5 @@ const getInfo =(info:any)=>{
margin-bottom: 10px;
border: 1px solid orange;
}
+
</style>
\ No newline at end of file
diff --git a/src/views/ServiceType/ProductCenter.vue b/src/views/ServiceType/ProductCenter.vue
index 9ace828..01b0228 100644
--- a/src/views/ServiceType/ProductCenter.vue
+++ b/src/views/ServiceType/ProductCenter.vue
@@ -1,5 +1,5 @@
<template>
- <div>123</div>
+
</template>
<script setup lang="ts">