mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-02 12:08:13 +08:00
sansiro
GitHub
parent
14c8297304
commit
3afa49c3c3
@ -1,5 +1,20 @@
|
||||
/**
|
||||
* 组件名称：PopOver 弹出提示
|
||||
* 单测内容：
|
||||
* 1. 在 table 中使用
|
||||
* 2. 触发方式 & 是否显示icon & 标题 & 位置 & 触发条件
|
||||
* 3. offset 偏移量
|
||||
* 4. 展示模式和尺寸
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import {render, fireEvent, cleanup, waitFor} from '@testing-library/react';
|
||||
import {
|
||||
render,
|
||||
fireEvent,
|
||||
cleanup,
|
||||
waitFor,
|
||||
getByText
|
||||
} from '@testing-library/react';
|
||||
import '../../src';
|
||||
import {render as amisRender} from '../../src';
|
||||
import {wait, makeEnv} from '../helper';
|
||||
@ -33,6 +48,136 @@ function formatStyleObject(style: string | null, px2number = true) {
|
||||
return res;
|
||||
}
|
||||
|
||||
test('Renderer:PopOver in table', async () => {
|
||||
const {container, rerender, getByText} = render(
|
||||
amisRender({
|
||||
type: 'page',
|
||||
data: {
|
||||
rows: [
|
||||
{
|
||||
engine: '内容一',
|
||||
hidden: '隐藏内容一'
|
||||
},
|
||||
{
|
||||
engine: '内容二',
|
||||
hidden: '隐藏内容二'
|
||||
}
|
||||
]
|
||||
},
|
||||
body: {
|
||||
type: 'table',
|
||||
title: '表格1',
|
||||
source: '$rows',
|
||||
columns: [
|
||||
{
|
||||
name: 'engine',
|
||||
label: 'Engine',
|
||||
popOver: '弹出内容：${hidden}'
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
const popOverBtn = container.querySelector(
|
||||
'.cxd-Field--popOverAble .cxd-Field-popOverBtn'
|
||||
)!;
|
||||
expect(popOverBtn).toBeInTheDocument();
|
||||
|
||||
fireEvent.click(popOverBtn);
|
||||
await wait(200);
|
||||
expect(getByText('弹出内容：隐藏内容一')).toBeInTheDocument();
|
||||
// expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('Renderer:PopOver with trigger & showIcon & title & position & popOverEnableOn', async () => {
|
||||
const {container, rerender, getByText} = render(
|
||||
amisRender({
|
||||
type: 'page',
|
||||
data: {
|
||||
rows: [
|
||||
{
|
||||
engine: '内容一',
|
||||
version: '1.1',
|
||||
hidden: '隐藏内容一'
|
||||
},
|
||||
{
|
||||
engine: '内容二',
|
||||
version: '2.1',
|
||||
hidden: '隐藏内容二'
|
||||
}
|
||||
]
|
||||
},
|
||||
body: {
|
||||
type: 'table',
|
||||
title: '表格2',
|
||||
source: '$rows',
|
||||
columns: [
|
||||
{
|
||||
name: 'engine',
|
||||
label: 'Engine',
|
||||
width: 100,
|
||||
popOver: {
|
||||
position: 'left-top',
|
||||
body: {
|
||||
type: 'tpl',
|
||||
tpl: '弹出内容：${hidden}'
|
||||
}
|
||||
},
|
||||
popOverEnableOn: "this.version == '1.1'"
|
||||
},
|
||||
{
|
||||
name: 'version',
|
||||
label: 'Version',
|
||||
width: 100,
|
||||
popOver: {
|
||||
trigger: 'hover',
|
||||
position: 'right-top',
|
||||
showIcon: false,
|
||||
title: '标题',
|
||||
body: {
|
||||
type: 'tpl',
|
||||
tpl: '${version}'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
const btns = container.querySelectorAll(
|
||||
'.cxd-Field--popOverAble .cxd-Field-popOverBtn'
|
||||
)!;
|
||||
|
||||
expect(btns.length).toBe(1);
|
||||
fireEvent.click(btns[0]!);
|
||||
|
||||
const popOverNode = container.querySelector(
|
||||
'.cxd-PopOver.cxd-PopOverAble-popover.cxd-PopOver--leftTop'
|
||||
)!;
|
||||
|
||||
expect(popOverNode).toBeInTheDocument();
|
||||
expect(formatStyleObject(popOverNode!.getAttribute('style'))!.left).toEqual(
|
||||
0
|
||||
);
|
||||
|
||||
fireEvent.mouseEnter(getByText('1.1'));
|
||||
|
||||
await wait(200);
|
||||
|
||||
const popOverNode2 = container.querySelector(
|
||||
'.cxd-PopOver.cxd-PopOverAble-popover.cxd-PopOver--rightTop'
|
||||
)!;
|
||||
expect(popOverNode2).toBeInTheDocument();
|
||||
|
||||
// expect(
|
||||
// formatStyleObject(popOverNode2!.getAttribute('style'))!.left
|
||||
// ).not.toEqual(0);
|
||||
expect(getByText('标题')).toBeInTheDocument();
|
||||
// expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('Renderer:PopOver with offset', async () => {
|
||||
const schema = {
|
||||
name: 'static',
|
||||
@ -79,3 +224,54 @@ test('Renderer:PopOver with offset', async () => {
|
||||
expect(offsetStyle.left - noOffsetStyle.left).toEqual(101);
|
||||
expect(offsetStyle.top - noOffsetStyle.top).toEqual(102);
|
||||
});
|
||||
|
||||
test('Renderer:PopOver with mode & size', async () => {
|
||||
const {container, rerender, baseElement} = render(
|
||||
amisRender({
|
||||
name: 'static',
|
||||
type: 'static',
|
||||
label: '静态展示',
|
||||
value: 'static',
|
||||
popOver: {
|
||||
mode: 'dialog',
|
||||
size: 'xl',
|
||||
body: {
|
||||
type: 'tpl',
|
||||
tpl: '弹框内容'
|
||||
}
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
fireEvent.click(container.querySelector('.cxd-Field-popOverBtn')!);
|
||||
await wait(200);
|
||||
expect(
|
||||
baseElement.querySelector('.cxd-Modal.cxd-Modal--xl')
|
||||
).toBeInTheDocument();
|
||||
|
||||
fireEvent.click(baseElement.querySelector('.cxd-Modal-close')!);
|
||||
await wait(300);
|
||||
|
||||
rerender(
|
||||
amisRender({
|
||||
name: 'static',
|
||||
type: 'static',
|
||||
label: '静态展示',
|
||||
value: 'static',
|
||||
popOver: {
|
||||
mode: 'drawer',
|
||||
size: 'sm',
|
||||
body: {
|
||||
type: 'tpl',
|
||||
tpl: '弹框内容'
|
||||
}
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
fireEvent.click(container.querySelector('.cxd-Field-popOverBtn')!);
|
||||
await wait(200);
|
||||
expect(
|
||||
baseElement.querySelector('.cxd-Drawer.cxd-Drawer--sm')
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
|
||||
@ -1,5 +1,366 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Renderer:PopOver in table 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="cxd-Page"
|
||||
>
|
||||
<div
|
||||
class="cxd-Page-content"
|
||||
>
|
||||
<div
|
||||
class="cxd-Page-main"
|
||||
>
|
||||
<div
|
||||
class="cxd-Page-body"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table has-popover"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table-heading"
|
||||
>
|
||||
表格1
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-contentWrap"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table-fixedLeft"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-fixedRight"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-content"
|
||||
style="position: relative;"
|
||||
>
|
||||
<table
|
||||
class="cxd-Table-table"
|
||||
>
|
||||
<thead>
|
||||
<tr
|
||||
class=""
|
||||
>
|
||||
<th
|
||||
class=""
|
||||
data-index="3"
|
||||
>
|
||||
<div
|
||||
class="cxd-TableCell--title"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
Engine
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-content-colDragLine"
|
||||
/>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
class="cxd-Table-tr--odd cxd-Table-tr--1th"
|
||||
data-id="e036424113f2"
|
||||
data-index="0"
|
||||
>
|
||||
<td
|
||||
class="cxd-Field--popOverAble in"
|
||||
style="position: relative;"
|
||||
>
|
||||
<span
|
||||
class="cxd-PlainField"
|
||||
>
|
||||
内容一
|
||||
</span>
|
||||
<span
|
||||
class="cxd-Field-popOverBtn"
|
||||
>
|
||||
<icon-mock
|
||||
classname="icon icon-zoom-in"
|
||||
icon="zoom-in"
|
||||
/>
|
||||
</span>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr
|
||||
class="cxd-Table-tr--even cxd-Table-tr--1th"
|
||||
data-id="6fe4356f4f99"
|
||||
data-index="1"
|
||||
>
|
||||
<td
|
||||
class="cxd-Field--popOverAble"
|
||||
>
|
||||
<span
|
||||
class="cxd-PlainField"
|
||||
>
|
||||
内容二
|
||||
</span>
|
||||
<span
|
||||
class="cxd-Field-popOverBtn"
|
||||
>
|
||||
<icon-mock
|
||||
classname="icon icon-zoom-in"
|
||||
icon="zoom-in"
|
||||
/>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-fixedTop"
|
||||
style="top: 0px; width: 0px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table-heading"
|
||||
>
|
||||
表格1
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-fixedLeft"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-fixedRight"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-wrapper"
|
||||
style="width: 0px;"
|
||||
>
|
||||
<table
|
||||
class="cxd-Table-table"
|
||||
style="width: 0px; table-layout: auto; transform: translateX(-0px);"
|
||||
>
|
||||
<colgroup>
|
||||
<col
|
||||
data-index="3"
|
||||
width="0"
|
||||
/>
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
data-index="3"
|
||||
style="width: 0px; height: 0px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-TableCell--title"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
Engine
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-content-colDragLine"
|
||||
/>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-fixedTop-shadow"
|
||||
style=""
|
||||
/>
|
||||
<div
|
||||
class="cxd-PopOver cxd-PopOverAble-popover cxd-PopOver--center"
|
||||
style="display: block; left: 0px; top: 0px; position: relative;"
|
||||
theme="cxd"
|
||||
>
|
||||
<div
|
||||
class="cxd-Panel cxd-Panel--default"
|
||||
style="position: relative;"
|
||||
>
|
||||
<div
|
||||
class="cxd-Panel-body"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
弹出内容：隐藏内容一
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Renderer:PopOver with offset: default 1`] = `
|
||||
<div>
|
||||
<div
|
||||
@ -411,3 +772,477 @@ exports[`Renderer:PopOver with offset: show popover with offset 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Renderer:PopOver with trigger & showIcon & title & position & popOverEnableOn 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="cxd-Page"
|
||||
>
|
||||
<div
|
||||
class="cxd-Page-content"
|
||||
>
|
||||
<div
|
||||
class="cxd-Page-main"
|
||||
>
|
||||
<div
|
||||
class="cxd-Page-body"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table has-popover"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table-heading"
|
||||
>
|
||||
表格2
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-contentWrap"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table-fixedLeft"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-fixedRight"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-content"
|
||||
style="position: relative;"
|
||||
>
|
||||
<table
|
||||
class="cxd-Table-table"
|
||||
>
|
||||
<thead>
|
||||
<tr
|
||||
class=""
|
||||
>
|
||||
<th
|
||||
class=""
|
||||
data-index="3"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-TableCell--title"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
Engine
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-content-colDragLine"
|
||||
/>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
data-index="4"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-TableCell--title"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
Version
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-content-colDragLine"
|
||||
/>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
class="cxd-Table-tr--odd cxd-Table-tr--1th"
|
||||
data-id="68faf0dc06db"
|
||||
data-index="0"
|
||||
>
|
||||
<td
|
||||
class="cxd-Field--popOverAble"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-PlainField"
|
||||
>
|
||||
内容一
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="cxd-Field-popOverBtn"
|
||||
>
|
||||
<icon-mock
|
||||
classname="icon icon-zoom-in"
|
||||
icon="zoom-in"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="cxd-Field--popOverAble in"
|
||||
style="width: 100px; position: relative;"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-Field-popOverWrap"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-PlainField"
|
||||
>
|
||||
1.1
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr
|
||||
class="cxd-Table-tr--even cxd-Table-tr--1th"
|
||||
data-id="66709734f0fa"
|
||||
data-index="1"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-PlainField"
|
||||
>
|
||||
内容二
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="cxd-Field--popOverAble"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-Field-popOverWrap"
|
||||
>
|
||||
<div
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-PlainField"
|
||||
>
|
||||
2.1
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-fixedTop"
|
||||
style="top: 0px; width: 0px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-Table-heading"
|
||||
>
|
||||
表格2
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-fixedLeft"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-fixedRight"
|
||||
/>
|
||||
<div
|
||||
class="cxd-Table-wrapper"
|
||||
style="width: 0px;"
|
||||
>
|
||||
<table
|
||||
class="cxd-Table-table"
|
||||
style="width: 0px; table-layout: auto; transform: translateX(-0px);"
|
||||
>
|
||||
<colgroup>
|
||||
<col
|
||||
data-index="3"
|
||||
width="0"
|
||||
/>
|
||||
<col
|
||||
data-index="4"
|
||||
width="0"
|
||||
/>
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
data-index="3"
|
||||
style="width: 0px; height: 0px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-TableCell--title"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
Engine
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-content-colDragLine"
|
||||
/>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
data-index="4"
|
||||
style="width: 0px; height: 0px;"
|
||||
>
|
||||
<div
|
||||
class="cxd-TableCell--title"
|
||||
style="width: 100px;"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
Version
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-content-colDragLine"
|
||||
/>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Table-fixedTop-shadow"
|
||||
style=""
|
||||
/>
|
||||
<div
|
||||
class="cxd-PopOver cxd-PopOverAble-popover cxd-PopOver--rightTop"
|
||||
style="display: block; left: 0px; top: 0px; position: relative;"
|
||||
theme="cxd"
|
||||
>
|
||||
<div
|
||||
class="cxd-Panel cxd-Panel--default"
|
||||
style="position: relative;"
|
||||
>
|
||||
<div
|
||||
class="cxd-Panel-heading"
|
||||
>
|
||||
<h3
|
||||
class="cxd-Panel-title"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
标题
|
||||
</span>
|
||||
</span>
|
||||
</h3>
|
||||
</div>
|
||||
<div
|
||||
class="cxd-Panel-body"
|
||||
>
|
||||
<span
|
||||
class="cxd-TplField"
|
||||
>
|
||||
<span>
|
||||
1.1
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="resize-sensor"
|
||||
style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-expand"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0px; top: 0px; width: 10px; height: 10px;"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-shrink"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;"
|
||||
>
|
||||
|
||||
|
||||
<div
|
||||
style="position: absolute; left: 0; top: 0; width: 200%; height: 200%"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="resize-sensor-appear"
|
||||
style="position: absolute; left: 0; top: 0; right: 0; bottom: 0; overflow: scroll; z-index: -1; visibility: hidden;animation-name: apearSensor; animation-duration: 0.2s;"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user