| | |
| | | @dlgClosed="closeDialog" |
| | | :closeOnClickModal="true" |
| | | > |
| | | <el-form :model="item" ref="dialogFormRef" :rules="dialogFormRules" label-width="76"> |
| | | <el-form :model="item" ref="dialogFormRef" :rules="dialogFormRules" :label-width="labelWidth"> |
| | | <el-form-item :label="colList[key]?.label" :prop="key" v-for="key in Object.keys(colList)"> |
| | | <el-input readonly :modelValue="item[key]"></el-input> |
| | | </el-form-item> |
| | |
| | | |
| | | import type { FormInstance, FormRules } from 'element-plus'; |
| | | |
| | | import { computed, ref } from 'vue'; |
| | | import { computed, onMounted, ref } from 'vue'; |
| | | import { getTextWidth } from '/@/utils/util'; |
| | | |
| | | const props = defineProps(['item', 'colList']); |
| | | const props = defineProps(['item', 'colList','title']); |
| | | //#region ====================== 增加、修改记录操作, dialog init====================== |
| | | const dialogTitle = computed(() => { |
| | | return `记录详情`; |
| | | return props.title ?? `记录详情`; |
| | | }); |
| | | |
| | | const dialogIsShow = defineModel({ |
| | |
| | | const closeDialog = () => { |
| | | dialogIsShow.value = false; |
| | | }; |
| | | |
| | | const measureWidthOffset = 12; |
| | | const labelWidth = ref(undefined); |
| | | const getMaxLabelWidth = () =>{ |
| | | |
| | | let maxLen = 0; |
| | | let maxStr = ''; |
| | | Object.values(props.colList ).map(item=>{ |
| | | const label = (item as any).label as string; |
| | | |
| | | const currentLen = label.gblen(); |
| | | if(currentLen> maxLen){ |
| | | maxLen = currentLen |
| | | maxStr = label; |
| | | } |
| | | }) |
| | | |
| | | |
| | | const maxWidth = getTextWidth(maxStr,{ |
| | | size: '14px', |
| | | })+measureWidthOffset; |
| | | labelWidth.value = maxWidth; |
| | | } |
| | | |
| | | onMounted(() => { |
| | | getMaxLabelWidth(); |
| | | }); |
| | | </script> |
| | | <style scoped lang="scss"></style> |