UNPKG

vxe-table-demonic

Version:

一个基于 vue 的 PC 端表单/表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...

330 lines (316 loc) 6.89 kB
/*font*/ /*size*/ /*icon*/ /*color*/ /*input/radio/checkbox*/ /*popup*/ /*table*/ /*filter*/ /*menu*/ /*loading*/ /*validate*/ /*grid*/ /*toolbar*/ /*tooltip*/ /*pager*/ /*modal*/ /*checkbox*/ /*radio*/ /*button*/ /*input*/ /*textarea*/ /*form*/ /*select*/ /*switch*/ /*pulldown*/ /*tag*/ [class*=vxe-]:after, [class*=vxe-]:before, [class*=vxe-] *:after, [class*=vxe-] *:before, [class*=vxe-] { box-sizing: border-box; } .vxe-radio-button .vxe-radio--label, .vxe-radio .vxe-radio--label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [class*=vxe-] { font-variant: tabular-nums; font-feature-settings: "tnum"; } .vxe-primary-color { color: var(--vxe-primary-color); } .vxe-success-color { color: var(--vxe-success-color); } .vxe-info-color { color: var(--vxe-info-color); } .vxe-warning-color { color: var(--vxe-warning-color); } .vxe-danger-color { color: var(--vxe-danger-color); } .vxe-perfect-color { color: var(--vxe-table-header-background-color); } .vxe-row:after { content: ""; display: block; clear: both; height: 0; overflow: hidden; visibility: hidden; } .vxe-row > .vxe-col--1 { float: left; width: 4.16667%; } .vxe-row > .vxe-col--2 { float: left; width: 8.33333%; } .vxe-row > .vxe-col--3 { float: left; width: 12.5%; } .vxe-row > .vxe-col--4 { float: left; width: 16.66667%; } .vxe-row > .vxe-col--5 { float: left; width: 20.83333%; } .vxe-row > .vxe-col--6 { float: left; width: 25%; } .vxe-row > .vxe-col--7 { float: left; width: 29.16667%; } .vxe-row > .vxe-col--8 { float: left; width: 33.33333%; } .vxe-row > .vxe-col--9 { float: left; width: 37.5%; } .vxe-row > .vxe-col--10 { float: left; width: 41.66667%; } .vxe-row > .vxe-col--11 { float: left; width: 45.83333%; } .vxe-row > .vxe-col--12 { float: left; width: 50%; } .vxe-row > .vxe-col--13 { float: left; width: 54.16667%; } .vxe-row > .vxe-col--14 { float: left; width: 58.33333%; } .vxe-row > .vxe-col--15 { float: left; width: 62.5%; } .vxe-row > .vxe-col--16 { float: left; width: 66.66667%; } .vxe-row > .vxe-col--17 { float: left; width: 70.83333%; } .vxe-row > .vxe-col--18 { float: left; width: 75%; } .vxe-row > .vxe-col--19 { float: left; width: 79.16667%; } .vxe-row > .vxe-col--20 { float: left; width: 83.33333%; } .vxe-row > .vxe-col--21 { float: left; width: 87.5%; } .vxe-row > .vxe-col--22 { float: left; width: 91.66667%; } .vxe-row > .vxe-col--23 { float: left; width: 95.83333%; } .vxe-row > .vxe-col--24 { float: left; width: 100%; } /*animat*/ .is--animat .vxe-sort--asc-btn:before, .is--animat .vxe-sort--asc-btn:after, .is--animat .vxe-sort--desc-btn:before, .is--animat .vxe-sort--desc-btn:after, .is--animat .vxe-filter--btn:before, .is--animat .vxe-filter--btn:after { transition: border 0.1s ease-in-out; } .is--animat .vxe-input--wrapper .vxe-input { transition: border 0.1s ease-in-out; } .is--animat .vxe-table--expand-btn, .is--animat .vxe-tree--node-btn { transition: transform 0.1s ease-in-out; } .is--animat .vxe-checkbox > input:checked + span, .is--animat .vxe-radio > input:checked + span { transition: background-color 0.1s ease-in-out; } .vxe-radio { cursor: pointer; } .vxe-radio .vxe-radio--icon { font-size: 1.4em; } .vxe-radio .vxe-radio--icon { color: var(--vxe-input-border-color); vertical-align: middle; font-weight: 700; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .is--checked.vxe-radio { color: var(--vxe-primary-color); } .is--checked.vxe-radio .vxe-radio--icon { color: var(--vxe-primary-color); } .vxe-radio:not(.is--disabled) { cursor: pointer; } .vxe-radio:not(.is--disabled):hover .vxe-radio--icon { color: var(--vxe-primary-color); } .is--disabled.vxe-radio { color: var(--vxe-font-disabled-color); cursor: not-allowed; } .is--disabled.vxe-radio .vxe-radio--icon { color: var(--vxe-input-disabled-color); } .vxe-radio .vxe-radio--label { padding-left: 0.5em; vertical-align: middle; } /*radio-group*/ .vxe-radio-group { display: inline-block; vertical-align: middle; line-height: 1; font-size: 0; } .vxe-radio-group + .vxe-radio-group { margin-left: 10px; } /*radio*/ .vxe-radio { display: inline-block; vertical-align: middle; white-space: nowrap; line-height: 1; } .vxe-radio > input[type=radio] { position: absolute; width: 0; height: 0; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .vxe-radio .vxe-radio--label { vertical-align: middle; display: inline-block; max-width: 50em; } .vxe-radio:not(.is--disabled) > input:focus + .vxe-radio--icon { color: var(--vxe-primary-color); } .vxe-radio:not(.vxe-radio-button) + .vxe-radio { margin-left: 10px; } .vxe-radio-button .vxe-radio--label { background-color: var(--vxe-radio-button-default-background-color); } .vxe-radio-button:first-child .vxe-radio--label { border-left: 1px solid var(--vxe-input-border-color); border-radius: var(--vxe-border-radius) 0 0 var(--vxe-border-radius); } .vxe-radio-button:last-child .vxe-radio--label { border-radius: 0 var(--vxe-border-radius) var(--vxe-border-radius) 0; } .vxe-radio-button > input:checked + .vxe-radio--label { color: #fff; background-color: var(--vxe-primary-color); border-color: var(--vxe-primary-color); } .vxe-radio-button .vxe-radio--label { padding: 0 1em; line-height: calc(var(--vxe-button-height-default) - 2px); display: inline-block; border-style: solid; border-color: var(--vxe-input-border-color); border-width: 1px 1px 1px 0; max-width: 50em; } .vxe-radio-button.is--disabled { cursor: not-allowed; } .vxe-radio-button.is--disabled > input:not(:checked) + .vxe-radio--label { color: var(--vxe-input-disabled-color); } .vxe-radio-button.is--disabled > input:checked + .vxe-radio--label { border-color: var(--vxe-primary-lighten-color); background-color: var(--vxe-primary-lighten-color); } .vxe-radio-button:not(.is--disabled) > input:focus + .vxe-radio--label { border-color: var(--vxe-primary-color); box-shadow: 0 0 0.2em 0 var(--vxe-primary-color); } .vxe-radio-button:not(.is--disabled):hover > input:not(:checked) + .vxe-radio--label { color: var(--vxe-primary-color); } .vxe-radio-button.size--medium .vxe-radio--label { line-height: calc(var(--vxe-button-height-medium) - 2px); } .vxe-radio-button.size--small .vxe-radio--label { line-height: calc(var(--vxe-button-height-small) - 2px); } .vxe-radio-button.size--mini .vxe-radio--label { line-height: calc(var(--vxe-button-height-mini) - 2px); } .vxe-radio { font-size: var(--vxe-font-size); } .vxe-radio.size--medium { font-size: var(--vxe-font-size-medium); } .vxe-radio.size--small { font-size: var(--vxe-font-size-small); } .vxe-radio.size--mini { font-size: var(--vxe-font-size-mini); }