【服务列表】 优化# 添加服务：1、前台价格使用固定价格和价格区间；2、移除折前价格

src/enums/modeEnum.ts

@@ -182,3 +182,7 @@ export enum RefundEnum {
     SETTING = 1,
     UN_SETTING = 0
 }
+export enum PriceEnum {
+    CUSTOMER_PRICE = 0, //固定价格
+    TEACHER_PRICE = 1 // 价格区间
+}

src/utils/validate.ts

@@ -1,4 +1,4 @@
-import { DispatchCountEnum, DispatchEnum, UseConditionEnum, UseGoodsEnum } from '@/enums/modeEnum'
+import { DispatchCountEnum, DispatchEnum, PriceEnum, UseConditionEnum, UseGoodsEnum } from '@/enums/modeEnum'
 import type { UploadFile } from 'element-plus'
 
 /*
@@ -357,3 +357,31 @@ export function validateValue(rule: any, value: any, callback: any) {
         }
     }
 }
+export function validatePirce(args, payload: any) {
+    const [, value, callback] = args
+    const { priceType, minPrice, maxPrice } = payload
+    if (priceType == PriceEnum.CUSTOMER_PRICE) {
+        if (value == '') {
+            callback(new Error('请填写价格'))
+        } else if (!isNumberWithDot(value)) {
+            callback(new Error('价格必须大于或等于零'))
+        } else {
+            callback()
+        }
+    } else {
+        if (minPrice == '' || maxPrice == '') {
+            const errMsg = minPrice == '' ? '下限' : maxPrice == '' ? '上限' : ''
+            callback(new Error('请输入价格' + errMsg))
+        } else {
+            if (!isNumberWithDot(minPrice as string) || !isNumberWithDot(maxPrice as string)) {
+                callback(new Error('价格必须大于或等于零'))
+            } else if (Number(minPrice) > Number(maxPrice)) {
+                callback(new Error('价格下限不能高于上限'))
+            } else if (minPrice == maxPrice) {
+                callback(new Error('请输入有效区间，价格下限不能等于上限'))
+            } else {
+                callback()
+            }
+        }
+    }
+}

src/views/service/lists/components/base-setting.vue

@@ -26,13 +26,24 @@
             <div class="form-tips">建议尺寸：750*750，可拖拽改变图片顺序，最多上传10张</div>
         </div>
     </el-form-item>
-
+    <el-form-item label="前台价格:" prop="price" class="price">
-    <el-form-item label="前台价格:" prop="price">
+        <el-radio-group v-model="modelValue.priceType">
+            <el-radio v-for="item in priceOptions" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
+        </el-radio-group>
+        <template v-if="modelValue.priceType == PriceEnum.CUSTOMER_PRICE">
             <el-input class="w-56 ls-input" v-model="modelValue.price" placeholder="请输入价格" />
+        </template>
+        <template v-else-if="modelValue.priceType == PriceEnum.TEACHER_PRICE">
+            <div>
+                <el-input class="w-56 ls-input" v-model="modelValue.minPrice" placeholder="请输入价格" />
+                <span class="mx-[6px]">至</span>
+                <el-input class="w-56 ls-input" v-model="modelValue.maxPrice" placeholder="请输入价格" />
+            </div>
+        </template>
     </el-form-item>
-    <el-form-item label="折前价格:" prop="scribingPrice">
+    <!-- <el-form-item label="折前价格:" prop="scribingPrice">
         <el-input class="w-56 ls-input" v-model="modelValue.scribingPrice" placeholder="请输入折前价格" />
-    </el-form-item>
+    </el-form-item> -->
     <el-form-item label="单位:" prop="unitId">
         <!-- 选择单位 -->
         <el-select v-model="modelValue.unitId" class="w-56 select" placeholder="请选择">
@@ -80,6 +91,7 @@ import { apiGetGoodsTimeAllList } from '@/api/service/subscribe'
 import { reactive, ref } from 'vue'
 import MaterialPicker from '@/components/material/picker.vue'
 import unitForm from '../../unit/components/unit-form.vue'
+import { PriceEnum } from '@/enums/modeEnum'
 
 interface Lists {
     name: string
@@ -95,6 +107,10 @@ withDefaults(
     }
 )
 
+const priceOptions = shallowRef([
+    { label: '固定价格', value: PriceEnum.CUSTOMER_PRICE },
+    { label: '价格区间', value: PriceEnum.TEACHER_PRICE }
+])
 const categoryData = ref<Array<Lists> | null>([])
 const unitData = ref<Array<Lists> | null>([])
 const goodsTimeData = ref<Array<Lists> | null>([])
@@ -133,6 +149,11 @@ const toAddCategory = () => {
 getCategoryLists()
 getUnitCommonLists()
 getGoodsTimeLists()
+
+const formItemRef = ref()
+defineExpose({
+    formItemRef
+})
 </script>
 
 <style lang="scss" scoped>
@@ -144,4 +165,12 @@ getGoodsTimeLists()
     width: 340px;
     margin-right: 10px;
 }
+.price {
+    :deep(> .el-form-item__content) {
+        display: flex;
+        flex-direction: column;
+        align-items: normal;
+        gap: 6px;
+    }
+}
 </style>

src/views/service/lists/edit.vue

@@ -38,7 +38,8 @@ import editorVue from '@/components/editor/index.vue'
 import FooterBtns from '@/components/footer-btns/index.vue'
 import type { ElForm, FormRules } from 'element-plus'
 import feedback from '@/utils/feedback'
-import { isNumber, isNumberWithDot, validateServiceCommissionRate } from '@/utils/validate'
+import { isNumber, isNumberWithDot, validatePirce, validateServiceCommissionRate } from '@/utils/validate'
+import { PriceEnum } from '@/enums/modeEnum'
 
 interface formDataObj {
     name?: string
@@ -56,6 +57,10 @@ interface formDataObj {
     distributorCommissionRate: number
     staffCommissionRate: number
     goodsTimeId?: string
+    priceType: number
+    priceRange: Array<{ minPrice: number | string; maxPrice: number | string }>
+    maxPrice: number | string
+    minPrice: number | string
 }
 type FormInstance = InstanceType<typeof ElForm>
 const formRef = ref<FormInstance>()
@@ -72,7 +77,11 @@ const formData = ref<formDataObj>({
     remarks: '',
     categoryId: '',
     image: '',
-    price: '',
+    priceType: PriceEnum.CUSTOMER_PRICE,
+    price: '', //固定价格
+    priceRange: [], //价格区间
+    minPrice: '', //价格区间-下限
+    maxPrice: '', //价格区间-上限
     scribingPrice: '',
     unitId: '',
     status: 0,
@@ -90,7 +99,7 @@ const rules = ref<FormRules>({
     name: [{ required: true, message: '请输入服务名称', trigger: 'blur' }],
     categoryId: [{ required: true, message: '请选择分类', trigger: 'change' }],
     // image: [{ required: true, message: '请上传轮播图', trigger: 'change' }],
-    price: [{ required: true, message: '请输入价格', trigger: 'blur' }],
+    price: [{ validator: (...args) => validatePirce(args, formData.value), trigger: 'blur' }],
     unitId: [{ required: true, message: '请选择单位', trigger: 'change' }],
     status: [{ required: true, message: '请选择商品状态', trigger: 'change' }],
     isNewRecommend: [{ required: true, message: '请选择新品推荐', trigger: 'change' }],
@@ -120,12 +129,13 @@ const getServiceDetail = async (): Promise<void> => {
 // 添加
 const handleServiceAdd = async (): Promise<void> => {
     // const str = formData.value.image.join(',')
-    if (!isNumberWithDot(formData.value.price as string)) return feedback.msgError('价格必须大于或等于零')
+    // if (!isNumberWithDot(formData.value.price as string)) return feedback.msgError('价格必须大于或等于零')
-    if (formData.value.scribingPrice && !isNumberWithDot(formData.value.scribingPrice as string)) return feedback.msgError('折前价格必须为纯数字')
+    // if (formData.value.scribingPrice && !isNumberWithDot(formData.value.scribingPrice as string)) return feedback.msgError('折前价格必须为纯数字')
-    if (formData.value.scribingPrice && Number(formData.value.price) > Number(formData.value.scribingPrice))
+    // if (formData.value.scribingPrice && Number(formData.value.price) > Number(formData.value.scribingPrice))
-        return feedback.msgError('前台价格高于折前价格，不合理定价！')
+    //     return feedback.msgError('前台价格高于折前价格，不合理定价！')
     // 不设置为0，接口返回的还是编辑前的值
     // !formData.value.scribingPrice && (formData.value.scribingPrice = '0')
+    console.log(formData.value)
     await apiServiceAdd({ ...formData.value })
     router.back()
     feedback.msgSuccess('操作成功')
@@ -135,11 +145,10 @@ const handleServiceAdd = async (): Promise<void> => {
 const handleServiceEdit = async (): Promise<void> => {
     // const str = formData.value.image.join(',')
     if (!isNumber(formData.value.sort as string)) return feedback.msgError('排序必须为纯数字')
-    if (!isNumberWithDot(formData.value.price as string)) return feedback.msgError('价格必须大于或等于零')
+    // if (!isNumberWithDot(formData.value.price as string)) return feedback.msgError('价格必须大于或等于零')
-    if (formData.value.scribingPrice && !isNumberWithDot(formData.value.scribingPrice as string)) return feedback.msgError('折前价格必须为纯数字')
+    // if (formData.value.scribingPrice && !isNumberWithDot(formData.value.scribingPrice as string)) return feedback.msgError('折前价格必须为纯数字')
-    if (formData.value.scribingPrice && Number(formData.value.price) > Number(formData.value.scribingPrice))
+    // if (formData.value.scribingPrice && Number(formData.value.price) > Number(formData.value.scribingPrice))
-        return feedback.msgError('前台价格高于折前价格，不合理定价！')
+    //     return feedback.msgError('前台价格高于折前价格，不合理定价！')
-    console.log('formData.value', formData.value)
     // 不设置为0，接口返回的还是编辑前的值
     // !formData.value.scribingPrice && (formData.value.scribingPrice = '0')
 
@@ -162,6 +171,21 @@ const onSubmit = (formEl: FormInstance | undefined): void => {
 }
 
 if (id) getServiceDetail()
+
+watch(
+    () => formData.value.priceType,
+    (newVal, oldVal) => {
+        if (newVal !== oldVal) {
+            if (newVal == PriceEnum.TEACHER_PRICE) {
+                formData.value.price = ''
+                formRef.value?.clearValidate(['price'])
+            } else {
+                formData.value.minPrice = ''
+                formData.value.maxPrice = ''
+            }
+        }
+    }
+)
 </script>
 
 <style lang="scss">