Skip to content

M
mes-ui
Commit b0f92a69 authored by 骆瑛's avatar 骆瑛
Browse files
Options

修改表格数据

parent 10cb42cc
Show whitespace changes
Inline Side-by-side
Showing with 142 additions and 216 deletions
assets/css/custom.less
View file @ b0f92a69
//定义变量
// @import './themes/deepBlank.less';
// @import './themes/green.less';
@import './themes/default.less';
@import './themes/green.less';
// @import './themes/default.less';
assets/css/iview-reset.less
View file @ b0f92a69
......@@ -538,13 +538,16 @@
.ivu-page-prev,
.ivu-page-next {
background: @page-bg !important;
border:1px solid @page-bg_bd !important;
}
.ivu-page-item {
background: @page-bg !important;
border:1px solid @page-bg_bd !important;
}
.ivu-page.mini .ivu-page-options-elevator input {
.ivu-page.mini .ivu-page-options-elevator input ,.page_index .ivu-page-options-elevator input {
background: @page-bg;
border: 1px solid @page-bg;
color: @page-color;
......
assets/css/themes/deepBlank.less
View file @ b0f92a69
......@@ -99,6 +99,8 @@
@table_checkbox_bg: #106FFE;
@table_checkbox_bd:#FFFFFF;
@table_checkbox_bd_header:#FFFFFF;
@table_line_shadow:none;
@table-tr-bd:transparent;
//高级搜索文字
@search_text_span:#ffffff;
//分页
......@@ -106,7 +108,7 @@
@page-active-color-hover: #fff;
@page-bg: #222341;
@page-color:#fff;
@page-bg_bd:#222341;
//表格
@table_highbd:transparent;
......
assets/css/themes/default.less
View file @ b0f92a69
......@@ -100,7 +100,9 @@
@search_icon_bg:#2d8cf0;
@table_checkbox_bg:#2d8cf0;
@table_checkbox_bd:#e8eaec;
@table_checkbox_bd_header:#e8eaec;
@table_checkbox_bd_header:#dcdee2;
@table_line_shadow:none;
@table-tr-bd:#e8eaec;
//高级搜索文字
@search_text_span:#515a6e;
//分页
......@@ -108,7 +110,7 @@
@page-active-color-hover: #515A6E;
@page-bg: #fff;
@page-color: #515A6E;
@page-bg_bd:#ffffff;
//表格
@table_highbd:#dcdee2;
@table-header-bg: #F5F6FA;
......
assets/css/themes/green.less
View file @ b0f92a69
......@@ -100,6 +100,8 @@
@table_checkbox_bd:#182C51;
@table_checkbox_bd_header:#FFFFFF;
@table-color:#182C51;
@table_line_shadow:0px 0px 20px rgba(0, 0, 0, 0.16);
@table-tr-bd:transparent;
//高级搜索文字
@search_text_span: #253D6D;;
......@@ -108,7 +110,7 @@
@page-active-color-hover: #515A6E;
@page-bg: #fff;
@page-color: #515A6E;
@page-bg_bd:#CCCCCC;
//表格
@table_highbd:transparent;
@table-header-bg: #253D6D;
......@@ -134,7 +136,7 @@
@part_top_title:#ffffff;
@part_top_border:1px solid #ffffff;
@table_border-bg:transparent;
@table_line: #CACBD0;
@table_line: #ffffff;
@table-bottom_line:transparent;
@table-bottom-border:#ffffff;
......
pages/theme/index.vue
View file @ b0f92a69
......@@ -44,9 +44,8 @@
<Row>
<Col span="24" class="table_style">
<Table
border
:border="false"
stripe
highlight-row
:columns="columns1"
:data="data1"
context-menu
......@@ -63,6 +62,17 @@
</template>
</Col>
</Row>
<Row>
<Col
span="24"
type="flex"
justify="center"
align="end"
class="page_index"
>
<Page :total="100" show-elevator />
</Col>
</Row>
</div>
</template>
<script>
......@@ -82,12 +92,14 @@ export default {
{
align: "center",
title: "订单编号",
minWidth: 140,
key: "name",
},
{
align: "center",
title: "任务类型",
key: "Review",
minWidth: 100,
render: (h, params) => {
if (params.row.Review === "正式计划") {
return h(
......@@ -115,11 +127,13 @@ export default {
{
align: "center",
title: "数量",
minWidth: 100,
key: "address",
},
{
align: "center",
title: "订单状态",
minWidth: 100,
key: "isload",
render: (h, params) => {
if (params.row.isload === "已派发") {
......@@ -137,7 +151,7 @@ export default {
"span",
{
style: {
color: "#515a6e",
color: "#ffffff",
},
},
params.row.isload
......@@ -148,41 +162,49 @@ export default {
{
align: "center",
title: "产品名称",
key: "address",
key: "a",
minWidth: 120,
},
{
align: "center",
title: "图号",
key: "address",
key: "b",
minWidth: 110,
},
{
align: "center",
title: "批次号",
key: "address",
minWidth: 90,
key: "c",
},
{
align: "center",
title: "项目号",
key: "address",
minWidth: 120,
key: "d",
},
{
align: "center",
title: "紧急程度",
key: "address",
minWidth: 100,
key: "e",
},
{
align: "center",
title: "创建人",
key: "address",
minWidth: 100,
key: "f",
},
{
align: "center",
title: "创建事件",
key: "address",
key: "date",
minWidth: 170,
},
{
title: "操作",
key: "action",
minWidth: 100,
align: "center",
render: (h, params) => {
return h("div", [
......@@ -208,36 +230,60 @@ export default {
],
data1: [
{
name: "John Brown",
age: 18,
address: "New York No. 1 ",
date: "2016-10-03",
name: "DDBH-80003-01",
Review: "正式计划",
isload: "已派发",
address: "1",
isload: "待派发",
a: "进气机匣组件",
age: 1,
date: "2020-07-15 22:22:45",
b: "TY-99-6788",
c: "32456",
d: "21545641362",
e: "一级",
f: "管理员",
},
{
name: "Jim Green",
age: 24,
address: "London No. 1 ",
date: "2016-10-01",
Review: "临时计划",
isload: "待派发",
name: "DDBH-80003-01",
Review: "正式计划",
address: "1",
isload: "已派发",
a: "进气机匣组件",
age: 1,
date: "2020-07-15 22:22:45",
b: "TY-99-6788",
c: "32456",
d: "21545641362",
e: "一级",
f: "管理员",
},
{
name: "Joe Black",
age: 30,
address: "Sydney No. 1 ",
date: "2016-10-02",
name: "DDBH-80003-01",
Review: "临时计划",
isload: "已派发",
address: "1",
isload: "待派发",
a: "进气机匣组件",
age: 1,
date: "2020-07-15 22:22:45",
b: "TY-99-6788",
c: "32456",
d: "21545641362",
e: "一级",
f: "管理员",
},
{
name: "Jon Snow",
age: 26,
address: "Ottawa No. 2 ",
date: "2016-10-04",
name: "DDBH-80003-01",
Review: "临时计划",
address: "1",
isload: "已派发",
a: "进气机匣组件",
age: 1,
date: "2020-07-15 22:22:45",
b: "TY-99-6788",
c: "32456",
d: "21545641362",
e: "一级",
f: "管理员",
},
],
contextLine: 0,
......@@ -273,8 +319,7 @@ export default {
border-radius: 4px 0px 0px 4px;
border: 1px solid @padding_input_border;
}
//修改的搜索框样式
.search_icon {
.search_icon { //修改的搜索框样式
width: 36px;
height: 34px;
background: @search_icon_bg;
......@@ -311,13 +356,8 @@ export default {
.ivu-icon {
color: @search_text_span !important;
}
.zhanshi {
font-size: 22px;
}
.ivu-select-dropdown {
background-color: #222341 !important;
.ivu-dropdown-item {
color: #ffffff !important;
text-align: center;
......@@ -331,11 +371,9 @@ export default {
}
}
}
.set_btn {
.ivu-icon {
.set_btn > .ivu-icon {
font-size: 20px !important;
}
}
}
.end_col {
display: flex;
......@@ -354,88 +392,52 @@ export default {
color: @table-color !important;
font-weight: 400;
font-size: 14px;
.ivu-table-header {
border: 1px solid @table-header-bg;
// border-bottom: 1px solid @table-header-bg;
box-sizing: border-box;
thead {
tr {
th {
color: @table-header-color !important;
border: @table-body-bd;
height: 60px;
font-weight: 400;
background: @table-header-bg !important;
border-right: 1px solid @header_bd_right;
th,td {
//表格内checkbox
.ivu-checkbox-inner {
background: @checkbox-inner;
border-radius: 1px;
border: 1px solid @table_checkbox_bd_header;
border: 1px solid @table_checkbox_bd;
}
//选中状态
.ivu-checkbox-checked {
.ivu-checkbox-inner {
.ivu-checkbox-checked .ivu-checkbox-inner {
border: @table_check_bd;
box-sizing: border-box;
background: @table_checkbox_bg !important;
}
}
.ivu-table-header {
border: 1px solid @table-header-bg;
th {
.ivu-checkbox-inner {
border: 1px solid @table_checkbox_bd_header;
}
}
color: @table-header-color !important;
border: @table-body-bd;
height: 60px;
font-weight: 400;
background: @table-header-bg !important;
border-right: 1px solid @header_bd_right;
}
}
.ivu-table-body {
background-color: @table-body-bg;
border: 1px solid @table-body-bd;
tr:nth-child(odd) {
height: 60px;
td {
//表格内checkbox
.ivu-checkbox-inner {
background: @checkbox-inner;
border-radius: 1px;
border: 1px solid @table_checkbox_bd;
}
//选中状态
.ivu-checkbox-checked {
.ivu-checkbox-inner {
box-sizing: border-box;
background: @table_checkbox_bg !important;
}
}
tr:nth-child(odd) td {
background-color: @table-body-bg;
border: @table-body-bd_odd;
border-right: 1px solid transparent !important;
.ivu-table-cell {
span {
color: @table_body_allcol;
}
}
}
tr:nth-child(even) td {
background-color: @table-body-bg_even;
}
tr:nth-child(even) {
tr {
height: 60px;
td {
//表格内checkbox
.ivu-checkbox-inner {
background: @checkbox-inner;
border-radius: 1px;
border: 1px solid @table_checkbox_bd;
}
//选中状态
.ivu-checkbox-checked {
.ivu-checkbox-inner {
box-sizing: border-box;
background: @table_checkbox_bg !important;
}
border-top: 1px solid @table-tr-bd;
border-right: 1px solid @table-tr-bd;
border-left: 1px solid @table-tr-bd;
border-bottom: 1px solid @table-body-bg;
span {
color: @table_body_allcol;
}
background-color: @table-body-bg_even;
border: @table-body-bd_odd;
border-right: 1px solid transparent !important;
.ivu-table-cell {
span {
color: @table_body_allcol;
......@@ -443,20 +445,18 @@ export default {
}
}
}
.ivu-table-row-hover,
.ivu-table-row-highlight {
tr.ivu-table-row:hover {
box-shadow: @table_line_shadow;
td {
background: @table-row-hover !important;
border: 2px solid @table_line !important;
border-right: 2px solid @table_highbd !important;
border-left: 2px solid transparent !important;
background: @table-row-hover;
border-top: 2px solid @table_line;
border-bottom: 2px solid @table_line;
}
td:first-child {
border-left: 2px solid @table_line !important;
border-left: 2px solid @table_line;
}
td:last-child {
border-right: 2px solid @table_line !important;
border-right: 2px solid @table_line;
}
}
}
......@@ -465,97 +465,14 @@ export default {
//表格下边框线
background-color: @table-boder !important;
}
.ivu-table-border:after {
//表格右边框线
background-color: @table-boder !important;
}
}
//表格头部
// .ivu-table-header,
// .ivu-table-fixed-header {
// border: 1px solid @table-header-border !important;
// background: @table-header-bg !important;
// min-height: 60px;
// height: 60px;
// font-weight: 400;
// box-sizing: border-box;
// }
// .ivu-table-header thead tr th,
// .table-tools table thead tr th,
// .ivu-table-fixed-header thead tr th,
// .ivu-table-fixed-header {
// height: 60px;
// padding: 0 !important;
// background: @table-header-bg !important;
// border: 1px solid @table-header-border !important;
// color: @table-header-color !important;
// box-sizing: border-box;
// }
// .ivu-table-tip {
// background: @table-body-bg !important;
// }
// /*底色斑马纹*/
// .ivu-table td {
// font-weight: 400;
// height: 60px !important;
// min-height: 60px !important;
// background-color: @table-body-bg;
// border: 1px solid @table-bottom_line !important;
// }
// .ivu-table tr:nth-child(even) td {
// background-color: @table-body-bg_even !important;
// }
// .ivu-table-body {
// background-color: @table-body-bg;
// }
// .ivu-table-wrapper tr td {
// background-color: @table-body-bg;
// // border: 1px solid @tableCommon-boder !important;
// }
// //表格内部线条
// .ivu-table-border td {
// border: 1px solid @tableCommon-boder !important;
// }
//
// /*选中某一行高亮*/
// .ivu-table-row:hover {
// background: @table-row-hover !important;
// border: 2px solid @table_line !important;
// box-sizing: border-box;
// }
// .ivu-table-row-highlight td {
// background: @table-row-hover !important;
// border: 2px solid @table_line !important;
// border-right: 2px solid transparent !important;
// }
// /*浮在某行*/
// .ivu-table-row-hover td,
// .ivu-table tr:nth-child(even):hover {
// background: @table-row-hover !important;
// border: 2px solid @table_line !important;
// border-right: 2px solid transparent !important;
// border-left: 2px solid transparent !important;
// }
// .ivu-table-row-hover td:first-child {
// border-left: 2px solid @table_line !important;
// }
// .ivu-table-row-hover td:last-child {
// border-right: 2px solid @table_line !important;
// }
//
}
.page_index {
padding-right: 40px;
margin: 30px 0 19px 0;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment