|
|
@ -1,7 +1,7 @@ |
|
|
|
<script lang="ts" setup> |
|
|
|
import { syncSendCmd } from 'apis/system' |
|
|
|
import { ElMessageBox } from 'element-plus' |
|
|
|
import { onMounted, ref, watchEffect } from 'vue' |
|
|
|
import { onMounted, ref, watch } from 'vue' |
|
|
|
|
|
|
|
import { FtMessage } from '@/libs/message' |
|
|
|
import { FtMessageBox } from '@/libs/messageBox' |
|
|
@ -9,7 +9,7 @@ import { convertValuesToInt } from '@/libs/utils' |
|
|
|
import { useFormulaStore } from '@/stores/formulaStore' |
|
|
|
|
|
|
|
const formulaStore = useFormulaStore() |
|
|
|
const selectedIndex = ref<number | null>(null) |
|
|
|
const selectedIndex = ref<number | null>(0) |
|
|
|
const recipes = ref<Formula.FormulaItem[]>([]) |
|
|
|
const currectFormula = ref<Formula.FormulaItem>() |
|
|
|
|
|
|
@ -28,10 +28,15 @@ onMounted(() => { |
|
|
|
initFormulaList() |
|
|
|
}) |
|
|
|
|
|
|
|
watchEffect(() => { |
|
|
|
watch(formulaStore.formulaList, () => { |
|
|
|
recipes.value = formulaStore.formulaList |
|
|
|
if (formulaStore.formulaList) { |
|
|
|
selectedIndex.value = formulaStore.selectedIndex || formulaStore.formulaList.length |
|
|
|
if (formulaStore.selectedIndex != null) { |
|
|
|
selectedIndex.value = formulaStore.selectedIndex |
|
|
|
} |
|
|
|
else { |
|
|
|
selectedIndex.value = formulaStore.formulaList.length - 1 |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
@ -43,7 +48,9 @@ const initFormulaList = () => { |
|
|
|
formulaStore.initFormulaList() |
|
|
|
} |
|
|
|
} |
|
|
|
watch(selectedIndex, () => { |
|
|
|
|
|
|
|
}) |
|
|
|
const selectRecipe = (item: Formula.FormulaItem, index: number) => { |
|
|
|
selectedIndex.value = selectedIndex.value === index ? null : index |
|
|
|
formulaStore.updateSelectedIndex(index) |
|
|
@ -109,7 +116,7 @@ const deleteRecipe = (item: Formula.FormulaItem) => { |
|
|
|
<ul class="recipe-list"> |
|
|
|
<li |
|
|
|
v-for="(item, index) in recipes" |
|
|
|
:key="index + 1" |
|
|
|
:key="index" |
|
|
|
:class="{ selected: selectedIndex === index }" |
|
|
|
@click="selectRecipe(item, index)" |
|
|
|
> |
|
|
@ -121,9 +128,6 @@ const deleteRecipe = (item: Formula.FormulaItem) => { |
|
|
|
<el-button class="delete-button" @click.stop="deleteRecipe(item)"> |
|
|
|
删除 |
|
|
|
</el-button> |
|
|
|
<span v-if="selectedIndex === index" class="selected-icon"> |
|
|
|
<el-icon><Check /></el-icon> <!-- 使用组件形式 --> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
@ -175,8 +179,8 @@ const deleteRecipe = (item: Formula.FormulaItem) => { |
|
|
|
|
|
|
|
.recipe-list li.selected { |
|
|
|
background-color: #e6f7ff; |
|
|
|
/* border: 1px solid #1890ff; */ |
|
|
|
/* padding: 9px; */ |
|
|
|
border-left: 5px solid #1890ff; |
|
|
|
padding: 9px; |
|
|
|
} |
|
|
|
|
|
|
|
.actions { |
|
|
|