mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2025-04-06 16:30:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: self closing vue tag (#6603)

Browse Source
This commit is contained in:
三咲智子 2022-03-14 04:16:11 +08:00 committed by GitHub
parent e2e577bfad
commit 5d85fba20c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
217 changed files with 527 additions and 672 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/.vitepress/vitepress/components/demo/vp-source-code.vue
View File

@ -15,7 +15,7 @@ const decoded = computed(() => {
<template>
<div class="example-source-wrapper">
<div class="example-source language-vue" v-html="decoded"></div>
<div class="example-source language-vue" v-html="decoded" />
</div>
</template>

2
docs/.vitepress/vitepress/components/doc-content/vp-table-of-content.vue
View File

@ -31,7 +31,7 @@ useActiveSidebarLinks(container, marker)
</ul>
</li>
</ul>
<div ref="marker" class="toc-marker"></div>
<div ref="marker" class="toc-marker" />
</nav>
</aside>
</template>

3
docs/.vitepress/vitepress/components/globals/icons.vue
View File

@ -45,8 +45,7 @@ const copySvgIcon = async (name, refs) => {
v-model="copyIcon"
active-text="Copy icon code"
inactive-text="Copy SVG content"
>
</el-switch>
/>
</div>
<ul class="demo-icon-list">
<li

2
docs/.vitepress/vitepress/components/globals/main-color.vue
View File

@ -14,7 +14,7 @@
background: getColorValue('primary-' + level),
}"
@click="copyColor('primary-' + level)"
></div>
/>
</div>
</div>
</el-col>

2
docs/.vitepress/vitepress/components/globals/secondary-colors.vue
View File

@ -30,7 +30,7 @@ const { copyColor } = useCopyColor()
background: getColorValue(type + '-' + level),
}"
@click="copyColor(type + '-' + level)"
></div>
/>
</div>
</div>
</el-col>

2
docs/.vitepress/vitepress/components/icons/back-to-top.vue
View File

@ -3,6 +3,6 @@
<path
d="M256 48C141.13 48 48 141.13 48 256s93.13 208 208 208s208-93.13 208-208S370.87 48 256 48zm91.36 212.65a16 16 0 0 1-22.63.09L272 208.42V342a16 16 0 0 1-32 0V208.42l-52.73 52.32A16 16 0 1 1 164.73 238l80-79.39a16 16 0 0 1 22.54 0l80 79.39a16 16 0 0 1 .09 22.65z"
fill="currentColor"
></path>
/>
</svg>
</template>

2
docs/.vitepress/vitepress/components/icons/codepen.vue
View File

@ -3,6 +3,6 @@
<path
d="M18.144 13.067v-2.134L16.55 12zm1.276 1.194a.628.628 0 0 1-.006.083l-.005.028l-.011.053l-.01.031a.443.443 0 0 1-.017.047l-.014.03a.78.78 0 0 1-.021.043l-.019.03a.57.57 0 0 1-.08.1l-.026.025a.602.602 0 0 1-.036.03l-.029.022l-.01.008l-6.782 4.522a.637.637 0 0 1-.708 0L4.864 14.79l-.01-.008a.599.599 0 0 1-.065-.052l-.026-.025l-.032-.034l-.021-.028a.588.588 0 0 1-.067-.11l-.014-.031a.644.644 0 0 1-.017-.047l-.01-.03c-.004-.018-.008-.036-.01-.054l-.006-.028a.628.628 0 0 1-.006-.083V9.739a.58.58 0 0 1 .006-.083l.005-.027l.011-.054l.01-.03a.574.574 0 0 1 .12-.217l.031-.034l.026-.025a.62.62 0 0 1 .065-.052l.01-.008l6.782-4.521a.638.638 0 0 1 .708 0l6.782 4.521l.01.008l.03.022l.035.03c.01.008.017.016.026.025a.545.545 0 0 1 .08.1l.019.03a.633.633 0 0 1 .021.043l.014.03c.007.016.012.032.017.047l.01.031c.004.018.008.036.01.054l.006.027a.619.619 0 0 1 .006.083zM12 0C5.373 0 0 5.372 0 12c0 6.627 5.373 12 12 12c6.628 0 12-5.372 12-12c0-6.627-5.372-12-12-12m0 10.492L9.745 12L12 13.51L14.255 12zm.638 4.124v2.975l4.996-3.33l-2.232-1.493zm-6.272-.356l4.996 3.33v-2.974l-2.764-1.849zm11.268-4.52l-4.996-3.33v2.974l2.764 1.85zm-6.272-.356V6.41L6.366 9.74l2.232 1.493zm-5.506 1.549v2.134L7.45 12z"
fill="currentColor"
></path>
/>
</svg>
</template>

2
docs/.vitepress/vitepress/components/icons/dark.vue
View File

@ -3,6 +3,6 @@
<path
d="M11.01 3.05C6.51 3.54 3 7.36 3 12a9 9 0 0 0 9 9c4.63 0 8.45-3.5 8.95-8c.09-.79-.78-1.42-1.54-.95A5.403 5.403 0 0 1 11.1 7.5c0-1.06.31-2.06.84-2.89c.45-.67-.04-1.63-.93-1.56z"
fill="currentColor"
></path>
/>
</svg>
</template>

2
docs/.vitepress/vitepress/components/icons/expand.vue
View File

@ -3,6 +3,6 @@
<path
d="M11.29 8.71L6.7 13.3a.996.996 0 1 0 1.41 1.41L12 10.83l3.88 3.88a.996.996 0 1 0 1.41-1.41L12.7 8.71a.996.996 0 0 0-1.41 0z"
fill="currentColor"
></path>
/>
</svg>
</template>

2
docs/.vitepress/vitepress/components/icons/light.vue
View File

@ -3,6 +3,6 @@
<path
d="M6.05 4.14l-.39-.39a.993.993 0 0 0-1.4 0l-.01.01a.984.984 0 0 0 0 1.4l.39.39c.39.39 1.01.39 1.4 0l.01-.01a.984.984 0 0 0 0-1.4zM3.01 10.5H1.99c-.55 0-.99.44-.99.99v.01c0 .55.44.99.99.99H3c.56.01 1-.43 1-.98v-.01c0-.56-.44-1-.99-1zm9-9.95H12c-.56 0-1 .44-1 .99v.96c0 .55.44.99.99.99H12c.56.01 1-.43 1-.98v-.97c0-.55-.44-.99-.99-.99zm7.74 3.21c-.39-.39-1.02-.39-1.41-.01l-.39.39a.984.984 0 0 0 0 1.4l.01.01c.39.39 1.02.39 1.4 0l.39-.39a.984.984 0 0 0 0-1.4zm-1.81 15.1l.39.39a.996.996 0 1 0 1.41-1.41l-.39-.39a.993.993 0 0 0-1.4 0c-.4.4-.4 1.02-.01 1.41zM20 11.49v.01c0 .55.44.99.99.99H22c.55 0 .99-.44.99-.99v-.01c0-.55-.44-.99-.99-.99h-1.01c-.55 0-.99.44-.99.99zM12 5.5c-3.31 0-6 2.69-6 6s2.69 6 6 6s6-2.69 6-6s-2.69-6-6-6zm-.01 16.95H12c.55 0 .99-.44.99-.99v-.96c0-.55-.44-.99-.99-.99h-.01c-.55 0-.99.44-.99.99v.96c0 .55.44.99.99.99zm-7.74-3.21c.39.39 1.02.39 1.41 0l.39-.39a.993.993 0 0 0 0-1.4l-.01-.01a.996.996 0 0 0-1.41 0l-.39.39c-.38.4-.38 1.02.01 1.41z"
fill="currentColor"
></path>
/>
</svg>
</template>

2
docs/.vitepress/vitepress/components/icons/playground.vue
View File

@ -10,6 +10,6 @@
l-13,7.9v-3c0.1-0.8,0.4-1.5,1-2.1L33.2,23c0.3-0.4,0.5-0.9,0.5-1.5v-3.1l-13.1,7.9v-3.2c0-0.7,0.3-1.4,0.8-1.8L31.5,15.4z
M41.1,4.2c0-0.2-0.1-0.4-0.4-0.4c0,0,0,0,0,0H38V1.1c0-0.2-0.3-0.3-0.5-0.2L36,1.1c-0.2,0-0.3,0.1-0.3,0.2v2.5H33
c-0.2,0-0.3,0.2-0.4,0.4v2h3V9c0,0.2,0.3,0.3,0.5,0.2L37.7,9c0.2,0,0.3-0.1,0.3-0.2V6.1h3.1L41.1,4.2z"
></path>
/>
</svg>
</template>

9
docs/.vitepress/vitepress/components/icons/toggle-button.vue
View File

@ -4,15 +4,12 @@
<path
d="M4 6a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1z"
fill="currentColor"
></path>
/>
<path
d="M4 18a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H5a1 1 0 0 1-1-1z"
fill="currentColor"
></path>
<path
d="M11 11a1 1 0 1 0 0 2h8a1 1 0 1 0 0-2h-8z"
fill="currentColor"
></path>
/>
<path d="M11 11a1 1 0 1 0 0 2h8a1 1 0 1 0 0-2h-8z" fill="currentColor" />
</g>
</svg>
</template>

2
docs/.vitepress/vitepress/components/vp-demo.vue
View File

@ -116,7 +116,7 @@ const copyCode = async () => {
@click="setSourceVisible(false)"
>
<ElIcon :size="16">
<CaretTop></CaretTop>
<CaretTop />
</ElIcon>
<span>{{ locale['hide-source'] }}</span>
</div>

4
docs/en-US/component/icon.md
View File

@ -44,10 +44,10 @@ so you need to use an alias in order to render the icon, if you register `Menu`
<template>
<div>
<el-icon :size="size" :color="color">
<edit></edit>
<edit />
</el-icon>
<!-- Or use it independently without derive attributes from parent -->
<edit></edit>
<edit />
</div>
</template>
```

8
docs/examples/alert/center.vue
View File

@ -1,8 +1,8 @@
<template>
<el-alert title="success alert" type="success" center show-icon> </el-alert>
<el-alert title="info alert" type="info" center show-icon> </el-alert>
<el-alert title="warning alert" type="warning" center show-icon> </el-alert>
<el-alert title="error alert" type="error" center show-icon> </el-alert>
<el-alert title="success alert" type="success" center show-icon />
<el-alert title="info alert" type="info" center show-icon />
<el-alert title="warning alert" type="warning" center show-icon />
<el-alert title="error alert" type="error" center show-icon />
</template>
<style scoped>
.el-alert {

9
docs/examples/alert/close-button.vue
View File

@ -1,10 +1,7 @@
<template>
<el-alert title="unclosable alert" type="success" :closable="false">
</el-alert>
<el-alert title="customized close-text" type="info" close-text="Gotcha">
</el-alert>
<el-alert title="alert with callback" type="warning" @close="hello">
</el-alert>
<el-alert title="unclosable alert" type="success" :closable="false" />
<el-alert title="customized close-text" type="info" close-text="Gotcha" />
<el-alert title="alert with callback" type="warning" @close="hello" />
</template>
<script lang="ts" setup>

3
docs/examples/alert/description.vue
View File

@ -3,6 +3,5 @@
title="with description"
type="success"
description="This is a description."
>
</el-alert>
/>
</template>

12
docs/examples/alert/icon-description.vue
View File

@ -4,29 +4,25 @@
type="success"
description="more text description"
show-icon
>
</el-alert>
/>
<el-alert
title="info alert"
type="info"
description="more text description"
show-icon
>
</el-alert>
/>
<el-alert
title="warning alert"
type="warning"
description="more text description"
show-icon
>
</el-alert>
/>
<el-alert
title="error alert"
type="error"
description="more text description"
show-icon
>
</el-alert>
/>
</template>
<style scoped>
.el-alert {

8
docs/examples/alert/icon.vue
View File

@ -1,8 +1,8 @@
<template>
<el-alert title="success alert" type="success" show-icon> </el-alert>
<el-alert title="info alert" type="info" show-icon> </el-alert>
<el-alert title="warning alert" type="warning" show-icon> </el-alert>
<el-alert title="error alert" type="error" show-icon> </el-alert>
<el-alert title="success alert" type="success" show-icon />
<el-alert title="info alert" type="info" show-icon />
<el-alert title="warning alert" type="warning" show-icon />
<el-alert title="error alert" type="error" show-icon />
</template>
<style scoped>
.el-alert {

8
docs/examples/alert/theme.vue
View File

@ -1,8 +1,8 @@
<template>
<el-alert title="success alert" type="success" effect="dark"> </el-alert>
<el-alert title="info alert" type="info" effect="dark"> </el-alert>
<el-alert title="warning alert" type="warning" effect="dark"> </el-alert>
<el-alert title="error alert" type="error" effect="dark"> </el-alert>
<el-alert title="success alert" type="success" effect="dark" />
<el-alert title="info alert" type="info" effect="dark" />
<el-alert title="warning alert" type="warning" effect="dark" />
<el-alert title="error alert" type="error" effect="dark" />
</template>
<style scoped>
.el-alert {

8
docs/examples/avatar/basic.vue
View File

@ -4,10 +4,10 @@
<div class="sub-title">circle</div>
<div class="demo-basic--circle">
<div class="block">
<el-avatar :size="50" :src="circleUrl"></el-avatar>
<el-avatar :size="50" :src="circleUrl" />
</div>
<div v-for="size in sizeList" :key="size" class="block">
<el-avatar :size="size" :src="circleUrl"></el-avatar>
<el-avatar :size="size" :src="circleUrl" />
</div>
</div>
</el-col>
@ -15,10 +15,10 @@
<div class="sub-title">square</div>
<div class="demo-basic--circle">
<div class="block">
<el-avatar shape="square" :size="50" :src="squareUrl"></el-avatar>
<el-avatar shape="square" :size="50" :src="squareUrl" />
</div>
<div v-for="size in sizeList" :key="size" class="block">
<el-avatar shape="square" :size="size" :src="squareUrl"></el-avatar>
<el-avatar shape="square" :size="size" :src="squareUrl" />
</div>
</div>
</el-col>

2
docs/examples/avatar/fit.vue
View File

@ -2,7 +2,7 @@
<div class="demo-fit">
<div v-for="fit in fits" :key="fit" class="block">
<span class="title">{{ fit }}</span>
<el-avatar shape="square" :size="100" :fit="fit" :src="url"></el-avatar>
<el-avatar shape="square" :size="100" :fit="fit" :src="url" />
</div>
</div>
</template>

4
docs/examples/avatar/types.vue
View File

@ -1,12 +1,12 @@
<template>
<div class="demo-type">
<div>
<el-avatar :icon="UserFilled"></el-avatar>
<el-avatar :icon="UserFilled" />
</div>
<div>
<el-avatar
src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
></el-avatar>
/>
</div>
<div>
<el-avatar> user </el-avatar>

2
docs/examples/badge/dot.vue
View File

@ -1,7 +1,7 @@
<template>
<el-badge is-dot class="item">query</el-badge>
<el-badge is-dot class="item">
<el-button class="share-button" :icon="Share" type="primary"></el-button>
<el-button class="share-button" :icon="Share" type="primary" />
</el-badge>
</template>

4
docs/examples/border/border.vue
View File

@ -10,14 +10,14 @@
<td class="text">Solid</td>
<td class="text">1px</td>
<td class="line">
<div></div>
<div />
</td>
</tr>
<tr>
<td class="text">Dashed</td>
<td class="text">2px</td>
<td class="line">
<div class="dashed"></div>
<div class="dashed" />
</td>
</tr>
</tbody>

2
docs/examples/border/radius.vue
View File

@ -17,7 +17,7 @@
? `var(--el-border-radius-${radius.type})`
: '',
}"
></div>
/>
</el-col>
</el-row>
</template>

2
docs/examples/border/shadow.vue
View File

@ -4,7 +4,7 @@
<div
class="demo-shadow"
:style="{ boxShadow: `var(--el-box-shadow-${shadow.type})` }"
></div>
/>
<span class="demo-shadow-text"
>{{ shadow.name }}
<code>box-shadow: {{ getValue(shadow.type) }}</code></span

12
docs/examples/button/basic.vue
View File

@ -28,12 +28,12 @@
</el-row>
<el-row>
<el-button :icon="Search" circle></el-button>
<el-button type="primary" :icon="Edit" circle></el-button>
<el-button type="success" :icon="Check" circle></el-button>
<el-button type="info" :icon="Message" circle></el-button>
<el-button type="warning" :icon="Star" circle></el-button>
<el-button type="danger" :icon="Delete" circle></el-button>
<el-button :icon="Search" circle />
<el-button type="primary" :icon="Edit" circle />
<el-button type="success" :icon="Check" circle />
<el-button type="info" :icon="Message" circle />
<el-button type="warning" :icon="Star" circle />
<el-button type="danger" :icon="Delete" circle />
</el-row>
</template>

6
docs/examples/button/group.vue
View File

@ -7,9 +7,9 @@
</el-button-group>
<el-button-group class="ml-4">
<el-button type="primary" :icon="Edit"></el-button>
<el-button type="primary" :icon="Share"></el-button>
<el-button type="primary" :icon="Delete"></el-button>
<el-button type="primary" :icon="Edit" />
<el-button type="primary" :icon="Share" />
<el-button type="primary" :icon="Delete" />
</el-button-group>
</template>

6
docs/examples/button/icon.vue
View File

@ -1,8 +1,8 @@
<template>
<div class="flex">
<el-button type="primary" :icon="Edit"></el-button>
<el-button type="primary" :icon="Share"></el-button>
<el-button type="primary" :icon="Delete"></el-button>
<el-button type="primary" :icon="Edit" />
<el-button type="primary" :icon="Share" />
<el-button type="primary" :icon="Delete" />
<el-button type="primary" :icon="Search">Search</el-button>
<el-button type="primary">
Upload<el-icon class="el-icon--right"><Upload /></el-icon>

2
docs/examples/button/loading.vue
View File

@ -16,7 +16,7 @@
L 15 15
"
style="stroke-width: 4px; fill: rgba(0, 0, 0, 0)"
></path>
/>
</svg>
</div>
</template>

6
docs/examples/button/size.vue
View File

@ -16,9 +16,9 @@
<el-button size="small" :icon="Search" round>Search</el-button>
</el-row>
<el-row>
<el-button :icon="Search" size="large" circle></el-button>
<el-button :icon="Search" circle></el-button>
<el-button :icon="Search" size="small" circle></el-button>
<el-button :icon="Search" size="large" circle />
<el-button :icon="Search" circle />
<el-button :icon="Search" size="small" circle />
</el-row>
</template>

8
docs/examples/cascader/basic.vue
View File

@ -3,11 +3,7 @@
<span class="example-demonstration"
>Child options expand when clicked (default)</span
>
<el-cascader
v-model="value"
:options="options"
@change="handleChange"
></el-cascader>
<el-cascader v-model="value" :options="options" @change="handleChange" />
</div>
<div class="example-block">
<span class="example-demonstration">Child options expand when hovered</span>
@ -16,7 +12,7 @@
:options="options"
:props="props"
@change="handleChange"
></el-cascader>
/>
</div>
</template>

26
docs/examples/checkbox/basic.vue
View File

@ -1,29 +1,19 @@
<template>
<div>
<el-checkbox v-model="checked1" label="Option 1" size="large"></el-checkbox>
<el-checkbox v-model="checked2" label="Option 2" size="large"></el-checkbox>
<el-checkbox v-model="checked1" label="Option 1" size="large" />
<el-checkbox v-model="checked2" label="Option 2" size="large" />
</div>
<div>
<el-checkbox v-model="checked3" label="Option 1"></el-checkbox>
<el-checkbox v-model="checked4" label="Option 2"></el-checkbox>
<el-checkbox v-model="checked3" label="Option 1" />
<el-checkbox v-model="checked4" label="Option 2" />
</div>
<div>
<el-checkbox v-model="checked5" label="Option 1" size="small"></el-checkbox>
<el-checkbox v-model="checked6" label="Option 2" size="small"></el-checkbox>
<el-checkbox v-model="checked5" label="Option 1" size="small" />
<el-checkbox v-model="checked6" label="Option 2" size="small" />
</div>
<div>
<el-checkbox
v-model="checked5"
label="Option 1"
size="small"
disabled
></el-checkbox>
<el-checkbox
v-model="checked6"
label="Option 2"
size="small"
disabled
></el-checkbox>
<el-checkbox v-model="checked5" label="Option 1" size="small" disabled />
<el-checkbox v-model="checked6" label="Option 2" size="small" disabled />
</div>
</template>

26
docs/examples/checkbox/with-border.vue
View File

@ -1,32 +1,22 @@
<template>
<div>
<el-checkbox
v-model="checked1"
label="Option1"
size="large"
border
></el-checkbox>
<el-checkbox
v-model="checked2"
label="Option2"
size="large"
border
></el-checkbox>
<el-checkbox v-model="checked1" label="Option1" size="large" border />
<el-checkbox v-model="checked2" label="Option2" size="large" border />
</div>
<div class="mt-4">
<el-checkbox v-model="checked3" label="Option1" border></el-checkbox>
<el-checkbox v-model="checked4" label="Option2" border></el-checkbox>
<el-checkbox v-model="checked3" label="Option1" border />
<el-checkbox v-model="checked4" label="Option2" border />
</div>
<div class="mt-4">
<el-checkbox-group v-model="checkboxGroup1" size="small">
<el-checkbox label="Option1" border></el-checkbox>
<el-checkbox label="Option2" border></el-checkbox>
<el-checkbox label="Option1" border />
<el-checkbox label="Option2" border />
</el-checkbox-group>
</div>
<div class="mt-4">
<el-checkbox-group v-model="checkboxGroup1" size="small">
<el-checkbox label="Option1" border disabled></el-checkbox>
<el-checkbox label="Option2" border disabled></el-checkbox>
<el-checkbox label="Option1" border disabled />
<el-checkbox label="Option2" border disabled />
</el-checkbox-group>
</div>
</template>

8
docs/examples/container/example.vue
View File

@ -83,11 +83,9 @@
<el-main>
<el-scrollbar>
<el-table :data="tableData">
<el-table-column prop="date" label="Date" width="140">
</el-table-column>
<el-table-column prop="name" label="Name" width="120">
</el-table-column>
<el-table-column prop="address" label="Address"> </el-table-column>
<el-table-column prop="date" label="Date" width="140" />
<el-table-column prop="name" label="Name" width="120" />
<el-table-column prop="address" label="Address" />
</el-table>
</el-scrollbar>
</el-main>

2
docs/examples/date-picker/custom-content.vue
View File

@ -10,7 +10,7 @@
<template #default="cell">
<div class="cell" :class="{ current: cell.isCurrent }">
<span class="text">{{ cell.text }}</span>
<span v-if="isHoliday(cell)" class="holiday"></span>
<span v-if="isHoliday(cell)" class="holiday" />
</div>
</template>
</el-date-picker>

3
docs/examples/date-picker/custom-prefix-icon.vue
View File

@ -7,8 +7,7 @@
type="date"
placeholder="Pick a day"
:prefix-icon="customPrefix"
>
</el-date-picker>
/>
</div>
</div>
</template>

9
docs/examples/date-picker/date-formats.vue
View File

@ -8,8 +8,7 @@
type="date"
placeholder="Pick a Date"
format="YYYY/MM/DD"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">Use value-format</span>
@ -20,8 +19,7 @@
placeholder="Pick a Date"
format="YYYY/MM/DD"
value-format="YYYY-MM-DD"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">Timestamp</span>
@ -32,8 +30,7 @@
placeholder="Pick a Date"
format="YYYY/MM/DD"
value-format="x"
>
</el-date-picker>
/>
</div>
</div>
</template>

6
docs/examples/date-picker/date-range.vue
View File

@ -8,8 +8,7 @@
range-separator="To"
start-placeholder="Start date"
end-placeholder="End date"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">With quick options</span>
@ -21,8 +20,7 @@
start-placeholder="Start date"
end-placeholder="End date"
:shortcuts="shortcuts"
>
</el-date-picker>
/>
</div>
</div>
</template>

2
docs/examples/date-picker/default-time.vue
View File

@ -8,7 +8,7 @@
start-placeholder="Start date"
end-placeholder="End date"
:default-time="defaultTime"
></el-date-picker>
/>
</div>
</div>
</template>

6
docs/examples/date-picker/default-value.vue
View File

@ -7,8 +7,7 @@
type="date"
placeholder="Pick a date"
:default-value="new Date(2010, 9, 1)"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">daterange</span>
@ -18,8 +17,7 @@
start-placeholder="Start Date"
end-placeholder="End Date"
:default-value="[new Date(2010, 9, 1), new Date(2010, 10, 1)]"
>
</el-date-picker>
/>
</div>
</div>
</template>

6
docs/examples/date-picker/enter-date.vue
View File

@ -2,8 +2,7 @@
<div class="demo-date-picker">
<div class="block">
<span class="demonstration">Default</span>
<el-date-picker v-model="value1" type="date" placeholder="Pick a day">
</el-date-picker>
<el-date-picker v-model="value1" type="date" placeholder="Pick a day" />
</div>
<div class="block">
<span class="demonstration">Picker with quick options</span>
@ -13,8 +12,7 @@
placeholder="Pick a day"
:disabled-date="disabledDate"
:shortcuts="shortcuts"
>
</el-date-picker>
/>
</div>
</div>
</template>

6
docs/examples/date-picker/month-range.vue
View File

@ -8,8 +8,7 @@
range-separator="To"
start-placeholder="Start month"
end-placeholder="End month"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">With quick options</span>
@ -21,8 +20,7 @@
start-placeholder="Start month"
end-placeholder="End month"
:shortcuts="shortcuts"
>
</el-date-picker>
/>
</div>
</div>
</template>

16
docs/examples/date-picker/other-measurements.vue
View File

@ -8,8 +8,7 @@
type="week"
format="[Week] ww"
placeholder="Pick a week"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">Month</span>
@ -17,15 +16,17 @@
v-model="value2"
type="month"
placeholder="Pick a month"
>
</el-date-picker>
/>
</div>
</div>
<div class="container">
<div class="block">
<span class="demonstration">Year</span>
<el-date-picker v-model="value3" type="year" placeholder="Pick a year">
</el-date-picker>
<el-date-picker
v-model="value3"
type="year"
placeholder="Pick a year"
/>
</div>
<div class="block">
<span class="demonstration">Dates</span>
@ -33,8 +34,7 @@
v-model="value4"
type="dates"
placeholder="Pick one or more dates"
>
</el-date-picker>
/>
</div>
</div>
</div>

9
docs/examples/datetime-picker/date-and-time-formats.vue
View File

@ -8,8 +8,7 @@
type="datetime"
placeholder="Pick a Date"
format="YYYY/MM/DD hh:mm:ss"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">Use value-format</span>
@ -20,8 +19,7 @@
placeholder="Pick a Date"
format="YYYY/MM/DD hh:mm:ss"
value-format="YYYY-MM-DD h:m:s a"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">Timestamp</span>
@ -32,8 +30,7 @@
placeholder="Pick a Date"
format="YYYY/MM/DD hh:mm:ss"
value-format="x"
>
</el-date-picker>
/>
</div>
</div>
</template>

6
docs/examples/datetime-picker/date-and-time-range.vue
View File

@ -7,8 +7,7 @@
range-separator="To"
start-placeholder="Start date"
end-placeholder="End date"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">With shortcuts</span>
@ -19,8 +18,7 @@
range-separator="To"
start-placeholder="Start date"
end-placeholder="End date"
>
</el-date-picker>
/>
</div>
</template>

9
docs/examples/datetime-picker/date-and-time.vue
View File

@ -6,8 +6,7 @@
v-model="value1"
type="datetime"
placeholder="Select date and time"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">With shortcuts</span>
@ -16,8 +15,7 @@
type="datetime"
placeholder="Select date and time"
:shortcuts="shortcuts"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration">With default time</span>
@ -26,8 +24,7 @@
type="datetime"
placeholder="Select date and time"
:default-time="defaultTime"
>
</el-date-picker>
/>
</div>
</div>
</template>

6
docs/examples/datetime-picker/default-time.vue
View File

@ -7,8 +7,7 @@
start-placeholder="Start Date"
end-placeholder="End Date"
:default-time="defaultTime1"
>
</el-date-picker>
/>
</div>
<div class="block">
<span class="demonstration"
@ -20,8 +19,7 @@
start-placeholder="Start Date"
end-placeholder="End Date"
:default-time="defaultTime2"
>
</el-date-picker>
/>
</div>
</template>

20
docs/examples/dialog/customizations.vue
View File

@ -5,17 +5,9 @@
<el-dialog v-model="dialogTableVisible" title="Shipping address">
<el-table :data="gridData">
<el-table-column
property="date"
label="Date"
width="150"
></el-table-column>
<el-table-column
property="name"
label="Name"
width="200"
></el-table-column>
<el-table-column property="address" label="Address"></el-table-column>
<el-table-column property="date" label="Date" width="150" />
<el-table-column property="name" label="Name" width="200" />
<el-table-column property="address" label="Address" />
</el-table>
</el-dialog>
@ -27,12 +19,12 @@
<el-dialog v-model="dialogFormVisible" title="Shipping address">
<el-form :model="form">
<el-form-item label="Promotion name" :label-width="formLabelWidth">
<el-input v-model="form.name" autocomplete="off"></el-input>
<el-input v-model="form.name" autocomplete="off" />
</el-form-item>
<el-form-item label="Zones" :label-width="formLabelWidth">
<el-select v-model="form.region" placeholder="Please select a zone">
<el-option label="Zone No.1" value="shanghai"></el-option>
<el-option label="Zone No.2" value="beijing"></el-option>
<el-option label="Zone No.1" value="shanghai" />
<el-option label="Zone No.2" value="beijing" />
</el-select>
</el-form-item>
</el-form>

3
docs/examples/dialog/nested-dialog.vue
View File

@ -10,8 +10,7 @@
width="30%"
title="Inner Dialog"
append-to-body
>
</el-dialog>
/>
</template>
<template #footer>
<div class="dialog-footer">

2
docs/examples/divider/basic-usage.vue
View File

@ -4,7 +4,7 @@
>I sit at my window this morning where the world like a passer-by stops
for a moment, nods to me and goes.</span
>
<el-divider></el-divider>
<el-divider />
<span
>There little thoughts are the rustle of leaves; they have their whisper
of joy in my mind.</span

6
docs/examples/divider/line-dashed.vue
View File

@ -1,11 +1,11 @@
<template>
<div>
<span>What language is thine, O sea?</span>
<el-divider border-style="dashed"></el-divider>
<el-divider border-style="dashed" />
<span>The language of eternal question.</span>
</div>
<el-divider border-style="dotted"></el-divider>
<el-divider border-style="dotted" />
<span>What language is thy answer, O sky?</span>
<el-divider border-style="double"></el-divider>
<el-divider border-style="double" />
<span>The language of eternal silence.</span>
</template>

4
docs/examples/divider/vertical-divider.vue
View File

@ -1,9 +1,9 @@
<template>
<div>
<span>Rain</span>
<el-divider direction="vertical"></el-divider>
<el-divider direction="vertical" />
<span>Home</span>
<el-divider direction="vertical" border-style="dashed"></el-divider>
<el-divider direction="vertical" border-style="dashed" />
<span>Grass</span>
</div>
</template>

20
docs/examples/drawer/customization-content.vue
View File

@ -12,17 +12,9 @@
size="50%"
>
<el-table :data="gridData">
<el-table-column
property="date"
label="Date"
width="150"
></el-table-column>
<el-table-column
property="name"
label="Name"
width="200"
></el-table-column>
<el-table-column property="address" label="Address"></el-table-column>
<el-table-column property="date" label="Date" width="150" />
<el-table-column property="name" label="Name" width="200" />
<el-table-column property="address" label="Address" />
</el-table>
</el-drawer>
@ -37,15 +29,15 @@
<div class="demo-drawer__content">
<el-form :model="form">
<el-form-item label="Name" :label-width="formLabelWidth">
<el-input v-model="form.name" autocomplete="off"></el-input>
<el-input v-model="form.name" autocomplete="off" />
</el-form-item>
<el-form-item label="Area" :label-width="formLabelWidth">
<el-select
v-model="form.region"
placeholder="Please select activity area"
>
<el-option label="Area1" value="shanghai"></el-option>
<el-option label="Area2" value="beijing"></el-option>
<el-option label="Area1" value="shanghai" />
<el-option label="Area2" value="beijing" />
</el-select>
</el-form-item>
</el-form>

2
docs/examples/empty/basic-usage.vue
View File

@ -1,3 +1,3 @@
<template>
<el-empty description="description"></el-empty>
<el-empty description="description" />
</template>

2
docs/examples/empty/custom-image.vue
View File

@ -1,5 +1,5 @@
<template>
<el-empty
image="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
></el-empty>
/>
</template>

2
docs/examples/empty/image-size.vue
View File

@ -1,3 +1,3 @@
<template>
<el-empty :image-size="200"></el-empty>
<el-empty :image-size="200" />
</template>

8
docs/examples/form/alignment.vue
View File

@ -4,7 +4,7 @@
<el-radio-button label="right">Right</el-radio-button>
<el-radio-button label="top">Top</el-radio-button>
</el-radio-group>
<div style="margin: 20px"></div>
<div style="margin: 20px" />
<el-form
:label-position="labelPosition"
label-width="100px"
@ -12,13 +12,13 @@
style="max-width: 460px"
>
<el-form-item label="Name">
<el-input v-model="formLabelAlign.name"></el-input>
<el-input v-model="formLabelAlign.name" />
</el-form-item>
<el-form-item label="Activity zone">
<el-input v-model="formLabelAlign.region"></el-input>
<el-input v-model="formLabelAlign.region" />
</el-form-item>
<el-form-item label="Activity form">
<el-input v-model="formLabelAlign.type"></el-input>
<el-input v-model="formLabelAlign.type" />
</el-form-item>
</el-form>
</template>

26
docs/examples/form/basic-form.vue
View File

@ -1,12 +1,12 @@
<template>
<el-form :model="form" label-width="120px">
<el-form-item label="Activity name">
<el-input v-model="form.name"></el-input>
<el-input v-model="form.name" />
</el-form-item>
<el-form-item label="Activity zone">
<el-select v-model="form.region" placeholder="please select your zone">
<el-option label="Zone one" value="shanghai"></el-option>
<el-option label="Zone two" value="beijing"></el-option>
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="Activity time">
@ -16,7 +16,7 @@
type="date"
placeholder="Pick a date"
style="width: 100%"
></el-date-picker>
/>
</el-col>
<el-col :span="2" class="text-center">
<span class="text-gray-500">-</span>
@ -26,28 +26,28 @@
v-model="form.date2"
placeholder="Pick a time"
style="width: 100%"
></el-time-picker>
/>
</el-col>
</el-form-item>
<el-form-item label="Instant delivery">
<el-switch v-model="form.delivery"></el-switch>
<el-switch v-model="form.delivery" />
</el-form-item>
<el-form-item label="Activity type">
<el-checkbox-group v-model="form.type">
<el-checkbox label="Online activities" name="type"></el-checkbox>
<el-checkbox label="Promotion activities" name="type"></el-checkbox>
<el-checkbox label="Offline activities" name="type"></el-checkbox>
<el-checkbox label="Simple brand exposure" name="type"></el-checkbox>
<el-checkbox label="Online activities" name="type" />
<el-checkbox label="Promotion activities" name="type" />
<el-checkbox label="Offline activities" name="type" />
<el-checkbox label="Simple brand exposure" name="type" />
</el-checkbox-group>
</el-form-item>
<el-form-item label="Resources">
<el-radio-group v-model="form.resource">
<el-radio label="Sponsor"></el-radio>
<el-radio label="Venue"></el-radio>
<el-radio label="Sponsor" />
<el-radio label="Venue" />
</el-radio-group>
</el-form-item>
<el-form-item label="Activity form">
<el-input v-model="form.desc" type="textarea"></el-input>
<el-input v-model="form.desc" type="textarea" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">Create</el-button>

10
docs/examples/form/custom-validation.vue
View File

@ -8,21 +8,17 @@
class="demo-ruleForm"
>
<el-form-item label="Password" prop="pass">
<el-input
v-model="ruleForm.pass"
type="password"
autocomplete="off"
></el-input>
<el-input v-model="ruleForm.pass" type="password" autocomplete="off" />
</el-form-item>
<el-form-item label="Confirm" prop="checkPass">
<el-input
v-model="ruleForm.checkPass"
type="password"
autocomplete="off"
></el-input>
/>
</el-form-item>
<el-form-item label="Age" prop="age">
<el-input v-model.number="ruleForm.age"></el-input>
<el-input v-model.number="ruleForm.age" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm(ruleFormRef)"

4
docs/examples/form/form-items.vue
View File

@ -21,7 +21,7 @@
},
]"
>
<el-input v-model="dynamicValidateForm.email"></el-input>
<el-input v-model="dynamicValidateForm.email" />
</el-form-item>
<el-form-item
v-for="(domain, index) in dynamicValidateForm.domains"
@ -34,7 +34,7 @@
trigger: 'blur',
}"
>
<el-input v-model="domain.value"></el-input>
<el-input v-model="domain.value" />
<el-button class="mt-2" @click.prevent="removeDomain(domain)"
>Delete</el-button
>

6
docs/examples/form/inline-form.vue
View File

@ -1,12 +1,12 @@
<template>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="Approved by">
<el-input v-model="formInline.user" placeholder="Approved by"></el-input>
<el-input v-model="formInline.user" placeholder="Approved by" />
</el-form-item>
<el-form-item label="Activity zone">
<el-select v-model="formInline.region" placeholder="Activity zone">
<el-option label="Zone one" value="shanghai"></el-option>
<el-option label="Zone two" value="beijing"></el-option>
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
</el-select>
</el-form-item>
<el-form-item>

2
docs/examples/form/number-validate.vue
View File

@ -17,7 +17,7 @@
v-model.number="numberValidateForm.age"
type="text"
autocomplete="off"
></el-input>
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm(formRef)">Submit</el-button>

24
docs/examples/form/size-control.vue
View File

@ -20,15 +20,15 @@
:size="size"
>
<el-form-item label="Activity name">
<el-input v-model="sizeForm.name"></el-input>
<el-input v-model="sizeForm.name" />
</el-form-item>
<el-form-item label="Activity zone">
<el-select
v-model="sizeForm.region"
placeholder="please select your zone"
>
<el-option label="Zone one" value="shanghai"></el-option>
<el-option label="Zone two" value="beijing"></el-option>
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="Activity time">
@ -38,7 +38,7 @@
type="date"
placeholder="Pick a date"
style="width: 100%"
></el-date-picker>
/>
</el-col>
<el-col class="text-center" :span="1" style="margin: 0 0.5rem">-</el-col>
<el-col :span="11">
@ -46,25 +46,19 @@
v-model="sizeForm.date2"
placeholder="Pick a time"
style="width: 100%"
></el-time-picker>
/>
</el-col>
</el-form-item>
<el-form-item label="Activity type">
<el-checkbox-group v-model="sizeForm.type">
<el-checkbox-button
label="Online activities"
name="type"
></el-checkbox-button>
<el-checkbox-button
label="Promotion activities"
name="type"
></el-checkbox-button>
<el-checkbox-button label="Online activities" name="type" />
<el-checkbox-button label="Promotion activities" name="type" />
</el-checkbox-group>
</el-form-item>
<el-form-item label="Resources">
<el-radio-group v-model="sizeForm.resource">
<el-radio border label="Sponsor"></el-radio>
<el-radio border label="Venue"></el-radio>
<el-radio border label="Sponsor" />
<el-radio border label="Venue" />
</el-radio-group>
</el-form-item>
<el-form-item>

26
docs/examples/form/validation.vue
View File

@ -8,12 +8,12 @@
:size="formSize"
>
<el-form-item label="Activity name" prop="name">
<el-input v-model="ruleForm.name"></el-input>
<el-input v-model="ruleForm.name" />
</el-form-item>
<el-form-item label="Activity zone" prop="region">
<el-select v-model="ruleForm.region" placeholder="Activity zone">
<el-option label="Zone one" value="shanghai"></el-option>
<el-option label="Zone two" value="beijing"></el-option>
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="Activity time" required>
@ -24,7 +24,7 @@
type="date"
placeholder="Pick a date"
style="width: 100%"
></el-date-picker>
/>
</el-form-item>
</el-col>
<el-col class="text-center" :span="2">
@ -36,29 +36,29 @@
v-model="ruleForm.date2"
placeholder="Pick a time"
style="width: 100%"
></el-time-picker>
/>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="Instant delivery" prop="delivery">
<el-switch v-model="ruleForm.delivery"></el-switch>
<el-switch v-model="ruleForm.delivery" />
</el-form-item>
<el-form-item label="Activity type" prop="type">
<el-checkbox-group v-model="ruleForm.type">
<el-checkbox label="Online activities" name="type"></el-checkbox>
<el-checkbox label="Promotion activities" name="type"></el-checkbox>
<el-checkbox label="Offline activities" name="type"></el-checkbox>
<el-checkbox label="Simple brand exposure" name="type"></el-checkbox>
<el-checkbox label="Online activities" name="type" />
<el-checkbox label="Promotion activities" name="type" />
<el-checkbox label="Offline activities" name="type" />
<el-checkbox label="Simple brand exposure" name="type" />
</el-checkbox-group>
</el-form-item>
<el-form-item label="Resources" prop="resource">
<el-radio-group v-model="ruleForm.resource">
<el-radio label="Sponsorship"></el-radio>
<el-radio label="Venue"></el-radio>
<el-radio label="Sponsorship" />
<el-radio label="Venue" />
</el-radio-group>
</el-form-item>
<el-form-item label="Activity form" prop="desc">
<el-input v-model="ruleForm.desc" type="textarea"></el-input>
<el-input v-model="ruleForm.desc" type="textarea" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm(ruleFormRef)"

6
docs/examples/image/basic-usage.vue
View File

@ -2,11 +2,7 @@
<div class="demo-image">
<div v-for="fit in fits" :key="fit" class="block">
<span class="demonstration">{{ fit }}</span>
<el-image
style="width: 100px; height: 100px"
:src="url"
:fit="fit"
></el-image>
<el-image style="width: 100px; height: 100px" :src="url" :fit="fit" />
</div>
</div>
</template>

3
docs/examples/image/image-preview.vue
View File

@ -6,8 +6,7 @@
:preview-src-list="srcList"
:initial-index="4"
fit="cover"
>
</el-image>
/>
</div>
</template>

2
docs/examples/image/lazy-load.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="demo-image__lazy">
<el-image v-for="url in urls" :key="url" :src="url" lazy></el-image>
<el-image v-for="url in urls" :key="url" :src="url" lazy />
</div>
</template>

2
docs/examples/image/load-failed.vue
View File

@ -2,7 +2,7 @@
<div class="demo-image__error">
<div class="block">
<span class="demonstration">Default</span>
<el-image></el-image>
<el-image />
</div>
<div class="block">
<span class="demonstration">Custom</span>

2
docs/examples/image/placeholder.vue
View File

@ -2,7 +2,7 @@
<div class="demo-image__placeholder">
<div class="block">
<span class="demonstration">Default</span>
<el-image :src="src"></el-image>
<el-image :src="src" />
</div>
<div class="block">
<span class="demonstration">Custom</span>

5
docs/examples/input/auto-sizing-textarea.vue
View File

@ -5,14 +5,13 @@
type="textarea"
placeholder="Please input"
/>
<div style="margin: 20px 0"></div>
<div style="margin: 20px 0" />
<el-input
v-model="textarea2"
:autosize="{ minRows: 2, maxRows: 4 }"
type="textarea"
placeholder="Please input"
>
</el-input>
/>
</template>
<script lang="ts" setup>

5
docs/examples/input/length-limiting.vue
View File

@ -5,9 +5,8 @@
placeholder="Please input"
show-word-limit
type="text"
>
</el-input>
<div style="margin: 20px 0"></div>
/>
<div style="margin: 20px 0" />
<el-input
v-model="textarea"
maxlength="30"

16
docs/examples/input/mixed-input.vue
View File

@ -17,13 +17,13 @@
>
<template #prepend>
<el-select v-model="select" placeholder="Select" style="width: 110px">
<el-option label="Restaurant" value="1"></el-option>
<el-option label="Order No." value="2"></el-option>
<el-option label="Tel" value="3"></el-option>
<el-option label="Restaurant" value="1" />
<el-option label="Order No." value="2" />
<el-option label="Tel" value="3" />
</el-select>
</template>
<template #append>
<el-button :icon="Search"></el-button>
<el-button :icon="Search" />
</template>
</el-input>
</div>
@ -34,13 +34,13 @@
class="input-with-select"
>
<template #prepend>
<el-button :icon="Search"></el-button>
<el-button :icon="Search" />
</template>
<template #append>
<el-select v-model="select" placeholder="Select" style="width: 110px">
<el-option label="Restaurant" value="1"></el-option>
<el-option label="Order No." value="2"></el-option>
<el-option label="Tel" value="3"></el-option>
<el-option label="Restaurant" value="1" />
<el-option label="Order No." value="2" />
<el-option label="Tel" value="3" />
</el-select>
</template>
</el-input>

6
docs/examples/input/various-size.vue
View File

@ -5,7 +5,7 @@
class="w-50 m-2"
size="large"
placeholder="Please Input"
></el-input>
/>
<el-input v-model="input2" class="w-50 m-2" placeholder="Please Input" />
<el-input
v-model="input3"
@ -21,7 +21,7 @@
size="large"
placeholder="Please Input"
:suffix-icon="Search"
></el-input>
/>
<el-input
v-model="input2"
class="w-50 m-2"
@ -43,7 +43,7 @@
size="large"
placeholder="Please Input"
:prefix-icon="Search"
></el-input>
/>
<el-input
v-model="input2"
class="w-50 m-2"

36
docs/examples/layout/alignment.vue
View File

@ -1,33 +1,33 @@
<template>
<el-row class="row-bg">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row class="row-bg" justify="center">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row class="row-bg" justify="end">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row class="row-bg" justify="space-between">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row class="row-bg" justify="space-around">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row class="row-bg" justify="space-evenly">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
</template>

32
docs/examples/layout/basic-layout.vue
View File

@ -1,29 +1,29 @@
<template>
<el-row>
<el-col :span="24"><div class="grid-content bg-purple-dark"></div></el-col>
<el-col :span="24"><div class="grid-content bg-purple-dark" /></el-col>
</el-row>
<el-row>
<el-col :span="12"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="12"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="12"><div class="grid-content bg-purple" /></el-col>
<el-col :span="12"><div class="grid-content bg-purple-light" /></el-col>
</el-row>
<el-row>
<el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="8"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="8"><div class="grid-content bg-purple" /></el-col>
<el-col :span="8"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="8"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple-light" /></el-col>
</el-row>
<el-row>
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple-light" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple-light" /></el-col>
</el-row>
</template>

18
docs/examples/layout/column-offset.vue
View File

@ -1,22 +1,22 @@
<template>
<el-row :gutter="20">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6" :offset="6"
><div class="grid-content bg-purple"></div
></el-col>
><div class="grid-content bg-purple"
/></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6" :offset="6"
><div class="grid-content bg-purple"></div
></el-col>
><div class="grid-content bg-purple"
/></el-col>
<el-col :span="6" :offset="6"
><div class="grid-content bg-purple"></div
></el-col>
><div class="grid-content bg-purple"
/></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12" :offset="6"
><div class="grid-content bg-purple"></div
></el-col>
><div class="grid-content bg-purple"
/></el-col>
</el-row>
</template>

8
docs/examples/layout/column-spacing.vue
View File

@ -1,9 +1,9 @@
<template>
<el-row :gutter="20">
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
<el-col :span="6"><div class="grid-content bg-purple" /></el-col>
</el-row>
</template>

18
docs/examples/layout/hybrid-layout.vue
View File

@ -1,18 +1,18 @@
<template>
<el-row :gutter="20">
<el-col :span="16"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="16"><div class="grid-content bg-purple" /></el-col>
<el-col :span="8"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="8"><div class="grid-content bg-purple" /></el-col>
<el-col :span="8"><div class="grid-content bg-purple" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="16"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
<el-col :span="16"><div class="grid-content bg-purple" /></el-col>
<el-col :span="4"><div class="grid-content bg-purple" /></el-col>
</el-row>
</template>

16
docs/examples/layout/responsive-layout.vue
View File

@ -1,17 +1,17 @@
<template>
<el-row :gutter="10">
<el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1"
><div class="grid-content bg-purple"></div
></el-col>
><div class="grid-content bg-purple"
/></el-col>
<el-col :xs="4" :sm="6" :md="8" :lg="9" :xl="11"
><div class="grid-content bg-purple-light"></div
></el-col>
><div class="grid-content bg-purple-light"
/></el-col>
<el-col :xs="4" :sm="6" :md="8" :lg="9" :xl="11"
><div class="grid-content bg-purple"></div
></el-col>
><div class="grid-content bg-purple"
/></el-col>
<el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1"
><div class="grid-content bg-purple-light"></div
></el-col>
><div class="grid-content bg-purple-light"
/></el-col>
</el-row>
</template>

2
docs/examples/menu/basic.vue
View File

@ -21,7 +21,7 @@
<el-menu-item index="3" disabled>Info</el-menu-item>
<el-menu-item index="4">Orders</el-menu-item>
</el-menu>
<div class="h-6"></div>
<div class="h-6" />
<el-menu
:default-active="activeIndex2"
class="el-menu-demo"

5
docs/examples/pagination/auto-hide-pagination.vue
View File

@ -1,13 +1,12 @@
<template>
<div>
<el-switch v-model="value"> </el-switch>
<el-switch v-model="value" />
<hr class="my-4" />
<el-pagination
:hide-on-single-page="value"
:total="5"
layout="prev, pager, next"
>
</el-pagination>
/>
</div>
</template>

3
docs/examples/pagination/background-color.vue
View File

@ -1,4 +1,3 @@
<template>
<el-pagination background layout="prev, pager, next" :total="1000">
</el-pagination>
<el-pagination background layout="prev, pager, next" :total="1000" />
</template>

4
docs/examples/pagination/basic-usage.vue
View File

@ -1,11 +1,11 @@
<template>
<div class="example-pagination-block">
<div class="example-demonstration">When you have few pages</div>
<el-pagination layout="prev, pager, next" :total="50"></el-pagination>
<el-pagination layout="prev, pager, next" :total="50" />
</div>
<div class="example-pagination-block">
<div class="example-demonstration">When you have more than 7 pages</div>
<el-pagination layout="prev, pager, next" :total="1000"></el-pagination>
<el-pagination layout="prev, pager, next" :total="1000" />
</div>
</template>

16
docs/examples/pagination/more-elements.vue
View File

@ -6,10 +6,10 @@
</el-radio-group>
<div>
background:
<el-switch v-model="background" class="ml-2"></el-switch>
<el-switch v-model="background" class="ml-2" />
</div>
<div class="ml-4">
disabled: <el-switch v-model="disabled" class="ml-2"></el-switch>
disabled: <el-switch v-model="disabled" class="ml-2" />
</div>
</div>
@ -27,8 +27,7 @@
:total="1000"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
>
</el-pagination>
/>
</div>
<div class="demo-pagination-block">
<div class="demonstration">Change page size</div>
@ -43,8 +42,7 @@
:total="1000"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
>
</el-pagination>
/>
</div>
<div class="demo-pagination-block">
<div class="demonstration">Jump to</div>
@ -58,8 +56,7 @@
:total="1000"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
>
</el-pagination>
/>
</div>
<div class="demo-pagination-block">
<div class="demonstration">All combined</div>
@ -74,8 +71,7 @@
:total="400"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
>
</el-pagination>
/>
</div>
</template>
<script lang="ts" setup>

3
docs/examples/pagination/number-of-pagers.vue
View File

@ -4,6 +4,5 @@
:pager-count="11"
layout="prev, pager, next"
:total="1000"
>
</el-pagination>
/>
</template>

5
docs/examples/pagination/small-pagination.vue
View File

@ -1,11 +1,10 @@
<template>
<el-pagination small layout="prev, pager, next" :total="50"> </el-pagination>
<el-pagination small layout="prev, pager, next" :total="50" />
<el-pagination
small
background
layout="prev, pager, next"
:total="50"
class="mt-4"
>
</el-pagination>
/>
</template>

18
docs/examples/popover/nested-information.vue
View File

@ -5,21 +5,9 @@
<el-button style="margin-right: 16px">Click to activate</el-button>
</template>
<el-table :data="gridData">
<el-table-column
width="150"
property="date"
label="date"
></el-table-column>
<el-table-column
width="100"
property="name"
label="name"
></el-table-column>
<el-table-column
width="300"
property="address"
label="address"
></el-table-column>
<el-table-column width="150" property="date" label="date" />
<el-table-column width="100" property="name" label="name" />
<el-table-column width="300" property="address" label="address" />
</el-table>
</el-popover>

2
docs/examples/progress/customized-content.vue
View File

@ -12,7 +12,7 @@
<span>Content</span>
</el-progress>
<el-progress type="circle" :percentage="100" status="success">
<el-button type="success" :icon="Check" circle></el-button>
<el-button type="success" :icon="Check" circle />
</el-progress>
<el-progress type="dashboard" :percentage="80">
<template #default="{ percentage }">

24
docs/examples/radio/button-style.vue
View File

@ -1,26 +1,26 @@
<template>
<div>
<el-radio-group v-model="radio1" size="large">
<el-radio-button label="New York"></el-radio-button>
<el-radio-button label="Washington"></el-radio-button>
<el-radio-button label="Los Angeles"></el-radio-button>
<el-radio-button label="Chicago"></el-radio-button>
<el-radio-button label="New York" />
<el-radio-button label="Washington" />
<el-radio-button label="Los Angeles" />
<el-radio-button label="Chicago" />
</el-radio-group>
</div>
<div style="margin-top: 20px">
<el-radio-group v-model="radio2">
<el-radio-button label="New York"></el-radio-button>
<el-radio-button label="Washington"></el-radio-button>
<el-radio-button label="Los Angeles"></el-radio-button>
<el-radio-button label="Chicago"></el-radio-button>
<el-radio-button label="New York" />
<el-radio-button label="Washington" />
<el-radio-button label="Los Angeles" />
<el-radio-button label="Chicago" />
</el-radio-group>
</div>
<div style="margin-top: 20px">
<el-radio-group v-model="radio3" size="small">
<el-radio-button label="New York"></el-radio-button>
<el-radio-button label="Washington" disabled></el-radio-button>
<el-radio-button label="Los Angeles"></el-radio-button>
<el-radio-button label="Chicago"></el-radio-button>
<el-radio-button label="New York" />
<el-radio-button label="Washington" disabled />
<el-radio-button label="Los Angeles" />
<el-radio-button label="Chicago" />
</el-radio-group>
</div>
</template>

4
docs/examples/rate/basic-usage.vue
View File

@ -1,11 +1,11 @@
<template>
<div class="demo-rate-block">
<span class="demonstration">Default</span>
<el-rate v-model="value1"></el-rate>
<el-rate v-model="value1" />
</div>
<div class="demo-rate-block">
<span class="demonstration">Color for different levels</span>
<el-rate v-model="value2" :colors="colors"> </el-rate>
<el-rate v-model="value2" :colors="colors" />
</div>
</template>

3
docs/examples/rate/more-icons.vue
View File

@ -4,8 +4,7 @@
:icons="icons"
:void-icon="ChatRound"
:colors="['#409eff', '#67c23a', '#FF9900']"
>
</el-rate>
/>
</template>
<script lang="ts" setup>

3
docs/examples/rate/readonly.vue
View File

@ -5,8 +5,7 @@
show-score
text-color="#ff9900"
score-template="{value} points"
>
</el-rate>
/>
</template>
<script lang="ts" setup>

6
docs/examples/rate/sizes.vue
View File

@ -1,9 +1,9 @@
<template>
<el-rate v-model="value" size="large"></el-rate>
<el-rate v-model="value" size="large" />
<br />
<el-rate v-model="value"></el-rate>
<el-rate v-model="value" />
<br />
<el-rate v-model="value" size="small"></el-rate>
<el-rate v-model="value" size="small" />
</template>
<script lang="ts" setup>

3
docs/examples/rate/text.vue
View File

@ -3,8 +3,7 @@
v-model="value"
:texts="['oops', 'disappointed', 'normal', 'good', 'great']"
show-text
>
</el-rate>
/>
</template>
<script lang="ts" setup>

2
docs/examples/result/customized-content.vue
View File

@ -3,7 +3,7 @@
<template #icon>
<el-image
src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png"
></el-image>
/>
</template>
<template #extra>
<el-button type="primary">Back</el-button>

2
docs/examples/scrollbar/manual-scroll.vue
View File

@ -12,7 +12,7 @@
:max="max"
:format-tooltip="formatTooltip"
@input="inputSlider"
></el-slider>
/>
</template>
<script lang="ts" setup>

3
docs/examples/select/allow-create.vue
View File

@ -13,8 +13,7 @@
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
/>
</el-select>
</template>

9
docs/examples/select/basic-usage.vue
View File

@ -5,8 +5,7 @@
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
/>
</el-select>
<el-select v-model="value" class="m-2" placeholder="Select">
<el-option
@ -14,8 +13,7 @@
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
/>
</el-select>
<el-select v-model="value" class="m-2" placeholder="Select" size="small">
<el-option
@ -23,8 +21,7 @@
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
/>
</el-select>
</template>

Some files were not shown because too many files have changed in this diff Show More