智慧教务系统
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

101 lines
2.8 KiB

<template>
<div class="main-container">
<el-card class="box-card !border-none" shadow="never">
<el-form
class="page-form"
:model="formData"
label-width="150px"
ref="ruleFormRef"
:rules="formRules"
v-loading="loading"
>
<el-form-item
v-for="day in weekDays"
:key="day.key"
:label="day.label"
:prop="`priceRules.${day.key}`"
>
<span style="margin: 0 8px">每个</span>
<el-input
v-model.number="formData.priceRules[day.key].basePrice"
placeholder="请输入"
class="input-width"
clearable
/>
<span style="margin: 0 8px">元 超过</span>
<el-input
v-model.number="formData.priceRules[day.key].limitCount"
placeholder="请输入"
class="input-width"
clearable
/>
<span style="margin: 0 8px">个</span>
<el-input
v-model.number="formData.priceRules[day.key].extraPrice"
placeholder="请输入"
class="input-width"
clearable
/>
<span style="margin-left: 4px">元</span>
</el-form-item>
</el-form>
</el-card>
<div class="fixed-footer-wrap">
<div class="fixed-footer">
<el-button type="primary" @click="onSave()">提交</el-button>
</div>
</div>
</div>
</template>
<script lang="ts" setup>
import { reactive, ref } from 'vue'
import { t } from '@/lang'
import { FormInstance, FormRules } from 'element-plus'
import { yjpzConfig, getYjpzConfig } from '@/app/api/sys'
const loading = ref(true)
const formData = reactive({
priceRules: {
mon: { basePrice: 0, limitCount: 0, extraPrice: 0 },
tue: { basePrice: 0, limitCount: 0, extraPrice: 0 },
wed: { basePrice: 0, limitCount: 0, extraPrice: 0 },
thu: { basePrice: 0, limitCount: 0, extraPrice: 0 },
fri: { basePrice: 0, limitCount: 0, extraPrice: 0 },
sat: { basePrice: 0, limitCount: 0, extraPrice: 0 },
sun: { basePrice: 0, limitCount: 0, extraPrice: 0 },
},
})
const weekDays = [
{ key: 'mon', label: '周一' },
{ key: 'tue', label: '周二' },
{ key: 'wed', label: '周三' },
{ key: 'thu', label: '周四' },
{ key: 'fri', label: '周五' },
{ key: 'sat', label: '周六' },
{ key: 'sun', label: '周日' },
]
const formRules = reactive<FormRules>({})
const setFormData = async () => {
const data = await (await getYjpzConfig()).data
formData['priceRules'] = data
loading.value = false
}
setFormData()
const onSave = async () => {
yjpzConfig(formData)
.then(() => {
loading.value = true
setFormData()
})
.catch(() => {
loading.value = false
})
}
</script>
<style lang="scss" scoped></style>