skytek_xinliang
8af82f5900
Update documentation rules for GUIDE.md files to keep higher-level guides focused on constraints, conventions, and indexes. Add base and section component guides to the LLM development index, clarify component layering responsibilities, and fix architecture references from README to GUIDE.md.docs: reorganize component guide structure and indexes Update documentation rules for GUIDE.md files to keep higher-level guides focused on constraints, conventions, and indexes. Add base and section component guides to the LLM development index, clarify component layering responsibilities, and fix architecture references from README to GUIDE.md.
1.6 KiB
1.6 KiB
Base Components Guide
src/components/base 放真正跨頁共用且不屬於特定 domain 的基礎元件。
規則
- 只服務單一 domain 的元件不要放進
base。 - 命名不使用
Page/Section/Item前綴，直接以功能命名。
BaseFormTextField
前置 label + v-text-field，預設 variant="outlined"、density="compact"、hide-details。
| Prop | 型別 | 預設 | 說明 |
|---|---|---|---|
modelValue |
string |
— | 雙向綁定字串值 |
label |
string |
undefined |
#prepend 內 <span> 的文字 |
labelCharCount |
number |
undefined |
字數，用於計算 min-width: 字數 × 0.785rem |
prependMarginEnd |
number |
8 |
#prepend 的 margin-inline-end（px） |
readonly |
boolean |
undefined |
是否唯讀 |
<BaseFormTextField
v-model="form.cellPhone"
label="手機"
class="ml-2"
:label-char-count="4"
:prepend-margin-end="16"
/>
BaseFormSelect
前置 label + v-select，預設 variant="outlined"、density="compact"、hide-details。
| Prop | 型別 | 預設 | 說明 |
|---|---|---|---|
modelValue |
any |
— | 雙向綁定值 |
items |
any[] |
— | v-select 的 items |
label |
string |
undefined |
#prepend 內 <span> 的文字 |
labelCharCount |
number |
undefined |
字數，用於計算 min-width |
prependMarginEnd |
number |
8 |
#prepend 的 margin-inline-end（px） |
<BaseFormSelect v-model="form.status" label="狀態" :items="statusOptions" class="ml-2" />