|
|
|
<template>
|
|
|
|
<!-- 采用芋道全局封装的 Dialog 组件,内置滚动和自适应处理 -->
|
|
|
|
<Dialog v-model="dialogVisible" :title="dialogTitle" width="800px">
|
|
|
|
<el-form
|
|
|
|
ref="formRef"
|
|
|
|
v-loading="formLoading"
|
|
|
|
:model="formData"
|
|
|
|
:rules="formRules"
|
|
|
|
label-width="120px"
|
|
|
|
>
|
|
|
|
<el-form ref="formRef" v-loading="formLoading" :model="formData" :rules="formRules" label-width="120px">
|
|
|
|
<el-form-item label="动作名称" prop="name">
|
|
|
|
<el-input
|
|
|
|
v-model="formData.name"
|
|
|
|
placeholder="请输入动作名称"
|
|
|
|
maxlength="50"
|
|
|
|
show-word-limit
|
|
|
|
/>
|
|
|
|
<el-input v-model="formData.name" placeholder="请输入动作名称" maxlength="50" show-word-limit />
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="动作类型" prop="exerciseType">
|
|
...
|
...
|
@@ -31,12 +20,7 @@ |
|
|
|
|
|
|
|
<el-form-item label="部位分类" prop="categoryId">
|
|
|
|
<el-select v-model="formData.categoryId" placeholder="请选择部位分类" class="w-full">
|
|
|
|
<el-option
|
|
|
|
v-for="item in categoryList"
|
|
|
|
:key="item.id"
|
|
|
|
:label="item.name"
|
|
|
|
:value="Number(item.id)"
|
|
|
|
/>
|
|
|
|
<el-option v-for="item in categoryList" :key="item.id" :label="item.name" :value="Number(item.id)" />
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
...
|
...
|
@@ -47,24 +31,14 @@ |
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="主要训练部位" prop="primaryMuscles">
|
|
|
|
<el-select
|
|
|
|
v-model="formData.primaryMuscles"
|
|
|
|
multiple
|
|
|
|
placeholder="请选择主要训练部位"
|
|
|
|
class="w-full"
|
|
|
|
>
|
|
|
|
<el-option v-for="item in muscleList" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
<el-select v-model="formData.primaryMuscles" multiple placeholder="请选择主要训练部位" class="w-full">
|
|
|
|
<el-option v-for="item in primaryAvailableMuscles" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="次要训练部位" prop="secondaryMuscles">
|
|
|
|
<el-select
|
|
|
|
v-model="formData.secondaryMuscles"
|
|
|
|
multiple
|
|
|
|
placeholder="请选择次要训练部位"
|
|
|
|
class="w-full"
|
|
|
|
>
|
|
|
|
<el-option v-for="item in muscleList" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
<el-select v-model="formData.secondaryMuscles" multiple placeholder="请选择次要训练部位" class="w-full">
|
|
|
|
<el-option v-for="item in secondaryAvailableMuscles" :key="item.id" :label="item.name" :value="item.id" />
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
|
|
...
|
...
|
@@ -132,9 +106,21 @@ const formData = ref<any>({ |
|
|
|
})
|
|
|
|
|
|
|
|
// 基础下拉选项数据集
|
|
|
|
const muscleList = ref<any[]>([])
|
|
|
|
const categoryList = ref<any[]>([])
|
|
|
|
const toolList = ref<any[]>([])
|
|
|
|
const muscleList = ref<any[]>([])
|
|
|
|
const categoryList = ref<any[]>([])
|
|
|
|
const toolList = ref<any[]>([])
|
|
|
|
|
|
|
|
// 可选主要训练部位:排除已选次要部位
|
|
|
|
const primaryAvailableMuscles = computed(() => {
|
|
|
|
const secondaryIds = new Set(formData.value.secondaryMuscles ?? [])
|
|
|
|
return muscleList.value.filter(item => !secondaryIds.has(item.id))
|
|
|
|
})
|
|
|
|
|
|
|
|
// 可选次要训练部位:排除已选主要部位
|
|
|
|
const secondaryAvailableMuscles = computed(() => {
|
|
|
|
const primaryIds = new Set(formData.value.primaryMuscles ?? [])
|
|
|
|
return muscleList.value.filter(item => !primaryIds.has(item.id))
|
|
|
|
})
|
|
|
|
|
|
|
|
const formRules = reactive<FormRules>({
|
|
|
|
name: [{ required: true, message: '请输入动作名称', trigger: 'blur' }],
|
|
...
|
...
|
@@ -164,16 +150,23 @@ const safeParseArray = (val: any): any[] => { |
|
|
|
// 异步按需加载字典数据
|
|
|
|
const loadOptions = async () => {
|
|
|
|
if (muscleList.value.length === 0) {
|
|
|
|
const res = await MusclesApi.getMusclesPage({ pageNo: 1, pageSize: 100, name: '' })
|
|
|
|
muscleList.value = res.data?.list || res.list || []
|
|
|
|
const res = await MusclesApi.getsubCategoriesList()
|
|
|
|
muscleList.value = res || []
|
|
|
|
console.log('细分锻炼部位列表/肌肉res:', res);
|
|
|
|
console.log('muscleList 赋值后', muscleList.value)
|
|
|
|
|
|
|
|
}
|
|
|
|
if (categoryList.value.length === 0) {
|
|
|
|
const res = await MotionCategoryApi.getMotionCategoryPage({ pageNo: 1, pageSize: 100, name: '' })
|
|
|
|
categoryList.value = res.data?.list || res.list || []
|
|
|
|
const res = await MotionCategoryApi.getCategoriesList()
|
|
|
|
categoryList.value = res || []
|
|
|
|
console.log('部位列表res:', res);
|
|
|
|
console.log('categoryList 赋值后', categoryList.value)
|
|
|
|
}
|
|
|
|
if (toolList.value.length === 0) {
|
|
|
|
const res = await EquipmentsApi.getEquipmentsPage({ pageNo: 1, pageSize: 100, name: '' })
|
|
|
|
toolList.value = res.data?.list || res.list || []
|
|
|
|
const res = await EquipmentsApi.getEquipmentList()
|
|
|
|
toolList.value = res || []
|
|
|
|
console.log('器械列表res:', res);
|
|
|
|
console.log('categoryList 赋值后', categoryList.value)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
...
|
...
|
@@ -192,7 +185,7 @@ const open = async (type: string, id?: number) => { |
|
|
|
formLoading.value = true
|
|
|
|
try {
|
|
|
|
const data = await ExercisesApi.getExercises(id)
|
|
|
|
console.log(data,"getExercises");
|
|
|
|
console.log(data, "getExercises");
|
|
|
|
// 处理回显:将后端保存的 String (如 "[1,2]") 格式化为 el-select 所需的 Array
|
|
|
|
data.primaryMuscles = safeParseArray(JSON.parse(data.primaryMuscles || '[]'))
|
|
|
|
data.secondaryMuscles = safeParseArray(JSON.parse(data.secondaryMuscles || '[]'))
|
|
...
|
...
|
@@ -245,8 +238,8 @@ const submitForm = async () => { |
|
|
|
secondaryMuscles: JSON.stringify(formData.value.secondaryMuscles || [])
|
|
|
|
}
|
|
|
|
|
|
|
|
console.log(submitData,"submitData");
|
|
|
|
|
|
|
|
console.log(submitData, "submitData");
|
|
|
|
|
|
|
|
if (formType.value === 'create') {
|
|
|
|
await ExercisesApi.addExercises(submitData)
|
|
|
|
message.success('新增成功')
|
...
|
...
|
|