feat(table): 初步集成 table 组件

This commit is contained in:
就眠仪式 2021-10-10 01:07:37 +08:00
parent aa4262a46b
commit 8f26cfa949
6 changed files with 13 additions and 50 deletions

View File

@ -1,6 +1,7 @@
::: demo
<template>
<lay-table></lay-table>
</template>
<script>

View File

@ -2,6 +2,8 @@
<template>
<lay-timeline>
<lay-timeline-item title="0.0.15">
</lay-timeline-item>
<lay-timeline-item title="0.0.14">
</lay-timeline-item>
<lay-timeline-item title="0.0.13">

View File

@ -8,7 +8,7 @@
<div class="layui-select-title">
<input
type="text"
placeholder="请选择"
placeholder="Search"
class="layui-input layui-unselect"
@input="change"
:value="name"

View File

@ -3940,7 +3940,6 @@ a cite {
line-height: 30px;
padding: 10px 15px;
border-width: 0 0 1px;
box-shadow: 0 2px 8px rgb(0 0 0 / 8%)
}
.layui-table-tool .layui-btn-container {

View File

@ -38,6 +38,5 @@ const change = function (id: any) {
active.value = id
}
provide("active",active)
</script>

View File

@ -264,58 +264,20 @@
</div>
<div class="layui-table-page">
<div id="layui-table-page1">
<div
class="layui-box layui-laypage layui-laypage-default"
id="layui-laypage-1"
>
<a
href="javascript:;"
class="layui-laypage-prev layui-disabled"
data-page="0"
><i class="layui-icon"></i></a
><span class="layui-laypage-curr"
><em class="layui-laypage-em"></em><em>1</em></span
><a href="javascript:;" data-page="2">2</a
><a href="javascript:;" data-page="3">3</a
><span class="layui-laypage-spr"></span
><a
href="javascript:;"
class="layui-laypage-last"
title="尾页"
data-page="300000"
>300000</a
><a href="javascript:;" class="layui-laypage-next" data-page="2"
><i class="layui-icon"></i></a
><span class="layui-laypage-skip"
>到第<input
type="text"
min="1"
value="1"
class="layui-input"
/><button type="button" class="layui-laypage-btn">
确定
</button></span
><span class="layui-laypage-count"> 3000000 </span
><span class="layui-laypage-limits"
><select lay-ignore="">
<option value="10" selected="">10 /</option>
<option value="20">20 /</option>
<option value="30">30 /</option>
<option value="40">40 /</option>
<option value="50">50 /</option>
<option value="60">60 /</option>
<option value="70">70 /</option>
<option value="80">80 /</option>
<option value="90">90 /</option>
</select></span
>
</div>
<lay-page total="100" limit="10" showPage showLimit showSkip></lay-page>
</div>
</div>
</div>
</template>
<script setup name="LayTable" lang="ts">
import { defineProps, defineEmits } from 'vue'
const props =
defineProps<{
columns?: Object[]
data?: Object[]
}>()
</script>
<style>
.laytable-cell-1-0-0{ width: 48px; }.laytable-cell-1-0-1{ width: 80px; }.laytable-cell-1-0-2{ width: 120px; }.laytable-cell-1-0-3{ width: 150px; }.laytable-cell-1-0-4{ width: 80px; }.laytable-cell-1-0-5{ width: 80px; }.laytable-cell-1-0-6{ width: 100px; }.laytable-cell-1-0-7{ }.laytable-cell-1-0-8{ width: 100px; }.laytable-cell-1-0-9{ width: 120px; }.laytable-cell-1-0-10{ width: 120px; }.laytable-cell-1-0-11{ width: 150px; }
</style>