fix: 修改步骤条样式, 增强tag组件兼容性

This commit is contained in:
wenhua
2024-06-28 23:53:43 +08:00
parent 16c4e07a86
commit bd2d12551a
5 changed files with 31 additions and 7 deletions

View File

@@ -31,6 +31,7 @@ const props = defineProps({
const tagConfig = ref({}) const tagConfig = ref({})
const filterDict = (data, value) => { const filterDict = (data, value) => {
console.log("🚀 ~ filterDict ~ data:", data)
if (!data || value == null) return if (!data || value == null) return
if (data instanceof Array) { if (data instanceof Array) {
if (value == true || value == false) { if (value == true || value == false) {
@@ -45,7 +46,7 @@ const filterDict = (data, value) => {
tagConfig.value = data.find(item => item.value == value) tagConfig.value = data.find(item => item.value == value)
} }
} }
return tagConfig.value.label return tagConfig.value?.label || '未知'
} }
</script> </script>

View File

@@ -11,7 +11,12 @@
:class="stepClass(index)" :class="stepClass(index)"
@click="handleStep(item.key, index)" @click="handleStep(item.key, index)"
/> >
<template #icon>
<el-icon style="font-size: 20px;" :class="index == localActive ? 'is-active' : 'is-end'" v-if="localStepSuccess.includes(index)"><SuccessFilled /></el-icon>
<el-icon style="font-size: 20px; color: gray;" v-else><WarningFilled /></el-icon>
</template>
</el-step>
</el-steps> </el-steps>
</div> </div>
@@ -311,4 +316,10 @@ watchEffect(() => {
.step-error { .step-error {
cursor: not-allowed; cursor: not-allowed;
} }
.is-active {
color: #BEA266;
}
.is-end {
color: #67c23a;
}
</style> </style>

View File

@@ -308,6 +308,7 @@ const search = (val) => {
} }
const init = async () => { const init = async () => {
const {code, msg, data} = await searchUpdateLedgerData(route.query.id) const {code, msg, data} = await searchUpdateLedgerData(route.query.id)
console.log("🚀 ~ init ~ data:", data)
if (data) { if (data) {
tableData.value = data tableData.value = data
baseForm.value.setValues(data) baseForm.value.setValues(data)

View File

@@ -141,7 +141,7 @@ const handleSubmit = async () => {
} }
const getBaseInfo = async () => { const getBaseInfo = async () => {
const {code, data} = await getBaseInfoApi(route.query.id) const {code, data} = await getBaseInfoApi(route.query.id)
tableForm.value.projectName = data.projectName tableForm.value.projectName = data?.projectName || ''
} }
getBaseInfo() getBaseInfo()
const init = async () => { const init = async () => {

View File

@@ -11,7 +11,12 @@
:class="stepClass(index)" :class="stepClass(index)"
@click="handleStep(item.key, index)" @click="handleStep(item.key, index)"
/> >
<template #icon>
<el-icon style="font-size: 20px;" :class="index == localActive ? 'is-active' : 'is-end'" v-if="localStepSuccess.includes(index)"><SuccessFilled /></el-icon>
<el-icon style="font-size: 20px; color: gray;" v-else><WarningFilled /></el-icon>
</template>
</el-step>
</el-steps> </el-steps>
</div> </div>
@@ -96,21 +101,21 @@ const schema = computed(() => {
label: '征集名称', label: '征集名称',
prop: 'requirementName', prop: 'requirementName',
colProps: { colProps: {
span: 24 span: 12
} }
}, },
{ {
label: '所属公司', label: '所属公司',
prop: 'affiliatedCompany', prop: 'affiliatedCompany',
colProps: { colProps: {
span: 24 span: 12
} }
}, },
{ {
label: '项目名称', label: '项目名称',
prop: 'projectName', prop: 'projectName',
colProps: { colProps: {
span: 24 span: 12
} }
} }
@@ -311,4 +316,10 @@ watchEffect(() => {
.step-error { .step-error {
cursor: not-allowed; cursor: not-allowed;
} }
.is-active {
color: #BEA266;
}
.is-end {
color: #67c23a;
}
</style> </style>