Skip to content

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

修改表格树等样式

parent 483e8d84
Show whitespace changes
Inline Side-by-side
Showing with 361 additions and 201 deletions
assets/css/base.less
View file @ db5c34ca
......@@ -1463,9 +1463,7 @@ html [type=button] {
}
.menu_side {
// background: #fff !important;
margin: 5px 0 0 0 !important;
// border: 1px solid #dcdee2 !important;
}
.show_menu {
......
assets/css/custom.less
View file @ db5c34ca
//定义变量
// @import './themes/deepBlank.less';
@import './themes/green.less';
@import './themes/deepBlank.less';
// @import './themes/green.less';
// @import './themes/default.less';
assets/css/iview-reset.less
View file @ db5c34ca
......@@ -11,7 +11,15 @@
}
.ivu-layout-content {
background-color: @layout-content-bg-color;
background-color:@layout-content-bg-color;
.table-content{
background-color:@table-bg-color;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.15);
border-radius: 8px;
.table-tools {
border-radius: 8px;
}
}
}
.ivu-modal-wrap * {
......@@ -388,6 +396,9 @@
.ivu-input {
background: @input-bg-color !important;
border: 1px solid @input-boder-color !important;
border-radius: 4px;
height: 36px !important;
line-height: 36px !important;
}
.ivu-select-selection {
......@@ -398,30 +409,101 @@
//左侧列表样式
.ivu-layout-sider-children {
background: @left-tree-bg;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.15);
border-radius: 0px 8px 8px 0px;
}
.ivu-tree-title {
color: @tree-title-color !important;
span {
color: @tree-title-color !important;
}
}
.ivu-btn-group>.ivu-btn {
color: @group-btn-color;
opacity: 0.8;
background: @group-btn-bg-color;
}
//左侧搜索框
.search{
.ivu-input-icon{
background: @search-icon !important;
color: @font_search !important;
border-radius: 0px 4px 4px 0px;
}
}
.ivu-layout {
height: 100%;
background: @layout-content-bg-color !important;
}
//左侧按钮样式
.tree-menu{
.ivu-btn-group {
.ivu-btn{
color:@left_top_bottom_color;
background: @left_top_bottom;
border: @left_top_bottom_border;
}
}
}
.ivu-tree-title {
color: @tree-title-color !important;
span {
color: @tree-title-color !important;
}
}
//树
.ivu-tree-title-selected, .ivu-tree-title-selected:hover ,.ivu-tree-title:hover{
background-color: @tree_select !important;
width: 100%;
}
//选择树的文字改变
.ivu-tree-title-selected{
span{
color:@select_title!important;
}
}
.ivu-tree-title{
width: 100%;
height: 32px;
line-height: 32px;
font-size: 14px;
font-weight: bold;
}
//树的图标
.ivu-tree .ivu-icon {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
.ivu-tree .ivu-icon-ios-arrow-forward:before {
content: "\F341";
background-size: cover;
width: 25px;
height: 20px;
display: block;
font-size: 20px;
line-height: 20px;
margin-left: -3px;
margin-top: 4px;
}
.ivu-tree .ivu-tree-arrow-open .ivu-icon-ios-arrow-forward:before {
content: "\F33D";
display: block;
background-size: cover;
width: 25px;
height: 20px;
font-size: 20px;
line-height: 20px;
margin-left: -3px;
margin-top: 4px;
}
.ivu-layout-sider,.ivu-layout-sider-children,.tree-menu h3{
background:@left_sider;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.15);
border-radius: @left_border_radius;
}
.tree-menu h3{
border-radius: 0px 8px 0px 0px;
}
//分页
.ivu-page .ivu-page-item-active {
background-color: @page-active-bg !important;
......@@ -475,12 +557,18 @@
}
//表格
.ivu-table-header{
border: 1px solid @table-header-border !important;
}
.ivu-table-header thead tr th {
background: @table-header-bg !important; //f5f6fa
background: @table-header-bg !important;
border: 1px solid @table-header-border !important;
color: @table-header-color !important;
}
// .ivu-table-tip{
// border: 1px solid @table-bg-color !important;
// box-sizing: border-box;
// }
/*底色*/
.ivu-table td{
background-color:@table-body-bg !important;
......@@ -488,14 +576,11 @@
.ivu-table-wrapper {//表格最外层的border
border: none !important;
}
.ivu-table-body {
.ivu-table-body {
background-color: @table-body-bg;
}
.ivu-table td {
background-color: @table-body-bg !important;
}
.tableCommon tr td {
background-color: @tableCommon-bg;
......@@ -522,27 +607,53 @@
/*浮在某行*/
.ivu-table-row-hover td {
background: rgba(34, 35, 65, 0.41) !important;
border: 2px solid #106FFE !important;
}
// .ivu-table-row-hover tr{
// border: 2px solid #106FFE !important;
// }
.ivu-dropdown-rel:hover {
.ivu-btn-text {
background-color: @primary-color;
}
}
// .tableCommon .ivu-table {
// tr:nth-child(even) {
// background: pink !important;
// }
// }
//表格字体颜色
.ivu-table {
color: @table-color !important;
}
//表格页面整体背景色处理
.product-layout{
.ivu-layout-content {
background-color: @product_content_backcolor;
}
}
//斑马纹
.ivu-table-stripe td{
background: rgba(34, 35, 65, 0.41) !important;
}
//修改的搜索框样式
.search_icon {
width: 36px;
height: 32px;
background: #106FFE;
border:1px solid #106FFE;
box-sizing: border-box;
.ivu-btn{
border-radius: 0px 4px 4px 0px !important;
}
}
.search_text span{
color: #ffffff !important;
border: 1px solid transparent !important;
}
.search_text:hover{
span{
color: #106FFE !important;
}
border: 1px solid transparent !important;
background: transparent !important;
//树
.ivu-tree-title-selected, .ivu-tree-title-selected:hover {
background-color: #04BB8C;
width: 100%;
}
assets/css/themes/deepBlank.less
View file @ db5c34ca
......@@ -11,12 +11,12 @@
@layout-header: #2F2F57;
@layout-tabs: #222341;
@layout-tabs-close: #fff;
@layout-tabs-bg-close: #2F2F57;
@layout-tabs-bg-close: #222341;
@tabs-bg-tag: #2F2F57;
//bady颜色
@layout-content-bg-color: #222341;
@layout-content-bg-color:#222341;
@card-bg: #2f2f57;
@body-color: #fff;
@border-color: #106FFE;
......@@ -61,7 +61,7 @@
@form-footer-color: #fff;
@form-divider-boder-color: #106FFE;
@input-bg-color: #222341;
@input-boder-color: #222341;
@input-boder-color:#2F2F57;
//弹框颜色
......@@ -71,7 +71,7 @@
//左侧列表
@left-tree-bg: #2F2F57;
@left-tree-bg: #222341;
@left-tree-header-bg-color: #2F2F57;
@left-tree-header-boder-color: #106FFE;
@left-tree-header-color: #fff;
......@@ -79,14 +79,21 @@
@group-btn-bg-color: #2F2F57;
@group-btn-color: #F5F6FA;
@left-boder-color: #2F2F57;
@search-icon:#222341;
@font_search:#ffffff;
@left_sider:#2F2F57;
@left_border_radius:0px 8px 8px 0px;
@left_top_bottom_color: #ffffff;
@left_top_bottom: #2F2F57;
@left_top_bottom_border: 1px solid rgba(245, 246, 250, 0.31);
@search_border-bottom:rgba(255, 255, 255, 0.06);
@search_border-top:#106FFE;
//右侧
@right-header-bg: #2F2F57;
@right-bg: #2F2F57;
@right-icon-color: #fff;
@right-icon-color: #F5F6FA;
@right-icon-color-hover: #106FFE;
@table-bg-color:#2F2F57;
//分页
......@@ -109,5 +116,11 @@
@back_part_top:#2F2F57;
@part_top_title:#ffffff;
@part_top_border:1px solid #2F2F57;
@table_border-bg:transparent;
//工单列表等背景色
@part_body_backcolor:#2F2F57;
//表格页面背景色处理
@product_content_backcolor: #222341;
//树
@tree_select:rgba(16, 111, 254, 0.4);
@select_title:#ffffff;
\ No newline at end of file
assets/css/themes/default.less
View file @ db5c34ca
......@@ -80,14 +80,21 @@
@group-btn-bg-color: #fff;
@group-btn-color: #515a6e;
@left-boder-color: #dcdee2;
@search-icon:transparent;
@font_search:#808695;
@left_sider:#FFFFFF;
@left_border_radius:0px;
@left_top_bottom_color: #515a6e;
@left_top_bottom: #ffffff;
@left_top_bottom_border: 1px solid #e3e5e8;
@search_border-bottom:#ffffff;
@search_border-top:#f7f7f7;
//右侧
@right-header-bg: #fff;
@right-bg: #fff;
@right-icon-color: #515A6E;
@right-icon-color-hover: #F5F6FA;
@table-bg-color:#ffffff;
//分页
@page-active-bg: #fff;
......@@ -101,12 +108,18 @@
@table-header-color:#515a6e;
@table-body-bg: #fff;
@tableCommon-bg: #fff;
@tableCommon-boder: #fff;
@table-boder: #e8eaec;
@tableCommon-boder: transparent;
@table-boder: transparent;
@table-row-hover: #EFF8F7;
@dispatch_part_border:1px solid #ccc;
@back_part_top:#f5f6fa;
@part_top_title:#515a6e;
@part_top_border:1px solid #f5f6fa;
@table_border-bg:#dcdee2;
//工单列表等背景色
@part_body_backcolor:#ffffff;
//表格页面背景色处理
@product_content_backcolor: #F5F6FA;
//树
@tree_select:#d5e8fc;
@select_title:#515a6e;
\ No newline at end of file
assets/css/themes/green.less
View file @ db5c34ca
......@@ -12,11 +12,11 @@
@layout-header: #253D6D;
@layout-tabs: #f5f7f9;
@layout-tabs-close: #515A6E;
@layout-tabs-bg-close: #fff;
@layout-tabs-bg-close: #F5F6FA;
@tabs-bg-tag: #fff;
//bady颜色
@layout-content-bg-color: #F5F6FA;
@layout-content-bg-color: #ffffff;
@card-bg: #fff;
@body-color: #515a6e;
@border-color: #dcdfe6;
......@@ -59,7 +59,7 @@
@form-footer-color: #fff;
@form-divider-boder-color: #e8eaec;
@input-bg-color: #fff;
@input-boder-color: #dcdee2;
@input-boder-color: #182C51;;
......@@ -74,18 +74,25 @@
@left-tree-header-bg-color: #253D6D;
@left-tree-header-boder-color: #fff;
@left-tree-header-color: #fff;
@tree-title-color: #515a6e;
@tree-title-color: #182C51;
@group-btn-bg-color: #fff;
@group-btn-color: #515a6e;
@left-boder-color: #dcdee2;
@search-icon: #515a6e;
@font_search:#ffffff;
@left_sider:#FFFFFF;
@left_border_radius:0px 8px 8px 0px;
@left_top_bottom_color: #ffffff;
@left_top_bottom: #253D6D;
@left_top_bottom_border: 1px solid #ffffff;
@search_border-bottom:#F3F3F3;
@search_border-top:#ffffff;
//右侧
@right-header-bg: #fff;
@right-bg: #fff;
@right-icon-color: #515A6E;
@right-icon-color-hover: #F5F6FA;
@table-bg-color:#ffffff;
//分页
......@@ -107,5 +114,11 @@
@back_part_top:#253D6D;
@part_top_title:#ffffff;
@part_top_border:1px solid #ffffff;
@table_border-bg:transparent;
//工单列表等背景色
@part_body_backcolor:#ffffff;
//表格页面背景色处理
@product_content_backcolor: #F5F6FA;
//树
@tree_select:rgba(4, 187, 140, 0.21);
@select_title:#04BB8C;
components/page/import/process.vue
View file @ db5c34ca
......@@ -483,13 +483,15 @@ export default {
}
.table-main {
width: 100%;
width: calc(100% - 40px);
text-align: left;
padding: 0;
display: block;
overflow-y: auto;
overflow-y: hidden;
flex-grow: 1;
box-sizing: border-box;
margin: 20px 20px 30px;
border:1px solid @table_border-bg;
tr td .ivu-table-cell {
padding: 0 5px;
}
......@@ -498,6 +500,7 @@ export default {
}
.table-tools {
margin: 15px 20px 0;
display: flex;
line-height: 50px;
background: @right-header-bg;
......@@ -511,4 +514,7 @@ export default {
}
}
}
.table-footer{
margin: 0 20px;
}
</style>
components/page/productTree.vue
View file @ db5c34ca
......@@ -158,8 +158,12 @@ export default {
padding-left: 10px;
}
.search {
height: 50px;
padding: 5px 10px;
height: 73px;
margin: 0 15px;
display: flex;
align-items: center;
border-top: 1px solid @search_border-top;
border-bottom: 1px solid @search_border-bottom;
}
.fg {
flex: none;
......@@ -168,7 +172,7 @@ export default {
padding-left: 10px;
}
.tree {
height: calc(100vh - 215px);
height: calc(100vh - 235px);
overflow: auto;
}
}
......
components/tb.vue
View file @ db5c34ca
<template>
<Table :border="tbPro.isBorder" stripe :columns="tbPro.columns" :stripe="tbPro.stripe"
<!-- :stripe="tbPro.stripe" -->
<Table :border="tbPro.isBorder" :columns="tbPro.columns" stripe
:data="tbPro.data" :highlight-row="tbPro.highlight" :loading="tbPro.loading" :height="tbPro.height" :content="tbPro.cur" @on-row-click="rowclick" class="tableCommon"></Table>
</template>
<script>
......@@ -9,6 +10,7 @@ export default {
//'columns1','data1','isBorder'
'tbPro'
],
methods:{
rowclick(rowdata,index){
this.$emit('rowclick',rowdata,index)
......
pages/technology/index.vue
View file @ db5c34ca
<style lang="less">
@import "./technolog.less";
.fullWindow {
position: fixed;
width: 100%;
......@@ -20,6 +19,7 @@
background: #f5f7f9;
}
}
</style>
<template>
<Layout class="lay100">
......@@ -36,10 +36,10 @@
<template slot="easySearch">
<Form ref="formInline" :model="easySearch" inline>
<FormItem prop="keys">
<Input placeholder="请输入工艺名称/工艺编号" v-width="200" v-model="easySearch.keys.value" clearable />
<Input placeholder="请输入工艺名称/工艺编号" v-width="200" v-model="easySearch.keys.value" clearable /> <Button type="primary" class="search_icon" @click="search" icon="ios-search"></Button>
</FormItem>
<FormItem>
<Button type="primary" @click="search">查询</Button>
<Button type="text" class="search_text" @click="search">高级搜索</Button>
</FormItem>
</Form>
</template>
......@@ -631,4 +631,5 @@ export default {
.single-page-con {
overflow-y: hidden !important;
}
</style>
static/static/iview-reset.css
View file @ db5c34ca
.ivu-btn {
padding: 4px 15px 4px;
}
......@@ -69,7 +68,9 @@
float: left;
}
/* tab颜色为绿色 */
.ivu-tabs-nav .ivu-tabs-tab-active {
color: #249e91;
font-weight: bold;
......@@ -207,8 +208,6 @@
background-color: #249e91;
}
.ivu-dropdown-rel:hover .ivu-btn-text {
background-color: #249e91;
}
......
static/static/iviewRe.css
View file @ db5c34ca
......@@ -13710,7 +13710,7 @@ span.ivu-date-picker-cells-cell-disabled.ivu-date-picker-cells-cell-selected em
box-sizing: border-box
}
.ivu-form-label-left . {
.ivu-form-label-left {
text-align: left
}
......
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