| | |
| | | </view> |
| | | <template v-else-if="detail"> |
| | | <up-form :model="form" |
| | | label-width="88" |
| | | label-width="100" |
| | | input-align="right"> |
| | | <u-cell-group title="基本信息" |
| | | class="form-section"> |
| | |
| | | </view> |
| | | <up-form v-if="formConfigData.fields.length" |
| | | :model="formValues" |
| | | label-width="88" |
| | | label-width="100" |
| | | input-align="right" |
| | | class="dynamic-form"> |
| | | <up-form-item v-for="field in displayTemplateFields" |
| | | :key="field.key" |
| | | :label="field.label" |
| | | :required="!!field.required" |
| | | :label-position="formItemLabelPosition(field)" |
| | | :class="formItemClass(field)"> |
| | | <up-textarea v-if="isTextareaField(field)" |
| | | v-model="formValues[field.key]" |
| | |
| | | <view v-if="isLeaveModule" |
| | | class="module-extra-block"> |
| | | <up-form :model="extraForm" |
| | | label-width="88" |
| | | label-width="100" |
| | | input-align="right" |
| | | class="dynamic-form"> |
| | | <up-form-item label="假期余额" |
| | |
| | | <!-- 加班:时长自动计算 --> |
| | | <view v-if="isOvertimeModule" |
| | | class="module-extra-block"> |
| | | <up-form label-width="88" |
| | | <up-form label-width="100" |
| | | input-align="right" |
| | | class="dynamic-form"> |
| | | <up-form-item label="加班时长" |
| | |
| | | <!-- 调岗:原岗位自动带出 --> |
| | | <view v-if="isTransferModule" |
| | | class="module-extra-block"> |
| | | <up-form label-width="88" |
| | | <up-form label-width="100" |
| | | input-align="right" |
| | | class="dynamic-form"> |
| | | <up-form-item label="原岗位" |
| | |
| | | if (isDatetimerangeField(field)) return "form-item-daterange"; |
| | | if (isSelectField(field) || isDateLikeField(field)) return "form-item-select"; |
| | | return "form-item-inline"; |
| | | }; |
| | | |
| | | /** 多行文本、日期范围:标签置顶,避免长文案在窄列内断行 */ |
| | | const formItemLabelPosition = field => { |
| | | if (isTextareaField(field) || isDatetimerangeField(field)) return "top"; |
| | | return "left"; |
| | | }; |
| | | |
| | | const getRangePartDisplay = (field, part) => { |
| | |
| | | justify-content: flex-end !important; |
| | | } |
| | | |
| | | :deep(.form-item-textarea .u-form-item__body) { |
| | | :deep(.form-item-textarea .u-form-item__body), |
| | | :deep(.form-item-daterange .u-form-item__body) { |
| | | flex-direction: column !important; |
| | | align-items: stretch !important; |
| | | padding: 10px 0 12px !important; |
| | | } |
| | | |
| | | :deep(.form-item-textarea .u-form-item__content) { |
| | | :deep(.form-item-textarea .u-form-item__body__left), |
| | | :deep(.form-item-daterange .u-form-item__body__left) { |
| | | width: 100% !important; |
| | | max-width: 100% !important; |
| | | margin-bottom: 8px !important; |
| | | padding-right: 0 !important; |
| | | } |
| | | |
| | | :deep(.form-item-textarea .u-form-item__body__left__content__label), |
| | | :deep(.form-item-daterange .u-form-item__body__left__content__label) { |
| | | white-space: normal !important; |
| | | line-height: 1.45 !important; |
| | | font-size: 14px !important; |
| | | } |
| | | |
| | | :deep(.form-item-textarea .u-form-item__body__right), |
| | | :deep(.form-item-daterange .u-form-item__body__right) { |
| | | width: 100% !important; |
| | | flex: none !important; |
| | | } |
| | | |
| | | :deep(.form-item-textarea .u-form-item__content), |
| | | :deep(.form-item-daterange .u-form-item__content) { |
| | | width: 100% !important; |
| | | justify-content: stretch !important; |
| | | } |
| | | |
| | | :deep(.dynamic-form .u-form-item__body__left__content__label) { |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .field-trigger { |
| | |
| | | :deep(.field-trigger .u-input__content__field-wrapper__field) { |
| | | text-align: right !important; |
| | | font-size: 15px !important; |
| | | } |
| | | |
| | | :deep(.form-item-daterange .u-form-item__body) { |
| | | flex-direction: column !important; |
| | | align-items: stretch !important; |
| | | } |
| | | |
| | | :deep(.form-item-daterange .u-form-item__content) { |
| | | width: 100% !important; |
| | | justify-content: stretch !important; |
| | | } |
| | | |
| | | .daterange-fill { |