Skip to content

M
mes-ui
Commit 1034f24d authored by 仇晓婷's avatar 仇晓婷
Browse files
Options

样式提取变量

parent cff7aa64
Hide whitespace changes
Inline Side-by-side
Showing with 263 additions and 127 deletions
assets/css/iview-reset.less
View file @ 1034f24d
......@@ -141,17 +141,7 @@
font-size: 14px;
}
.ivu-modal-header {
// background-color: #f2f2f2;
background-color: @modal-header-bg-color;
color: #fff;
border-radius: 5px 5px 0 0;
.ivu-modal-header-inner {
color: #fff;
}
}
.ivu-modal-close {
.ivu-icon-ios-close {
......@@ -183,7 +173,7 @@
vertical-align: middle;
float: left;
font-size: 14px;
color: @table-color;
color: @form-color !important;
line-height: 1;
padding: 10px 12px 10px 0;
box-sizing: border-box;
......@@ -191,7 +181,7 @@
.footers {
.ivu-form .ivu-form-item-label {
color: white;
color: @form-footer-color;
}
}
......@@ -399,14 +389,72 @@
//顶部导航
.i-layout-tabs {
background-color: @layout-tabs !important;
background-color: @layout-tabs !important;
}
.i-layout-tabs-main {
background-color: @layout-tabs !important;
background-color: @layout-tabs !important;
}
.i-layout-tabs-close-main {
color: @layout-tabs-close;
background-color: @layout-tabs-bg-close !important;
}
.i-layout-tabs .ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-tab {
background: @tabs-bg-tag !important;
}
//弹框以及表单：
.ivu-modal-header {
// background-color: #f2f2f2;
background-color: @modal-header-bg-color;
color: #fff;
border-radius: 5px 5px 0 0;
border-bottom: 1px solid @modal-header-border-color !important;
.ivu-modal-header-inner {
color: #fff;
}
}
.ivu-modal-body {
background: @madal-body-bg-color !important;
}
.ivu-divider-horizontal.ivu-divider-with-text-left:before {
border-top: 1px solid @form-divider-boder-color !important;
}
.ivu-divider-horizontal.ivu-divider-with-text-left:after {
border-top: 1px solid @form-divider-boder-color !important;
}
.ivu-input {
background: @input-bg-color !important;
border: 1px solid @input-boder-color !important;
}
.ivu-select-selection {
background: @input-bg-color !important;
border: 1px solid @input-boder-color !important;
}
//左侧列表样式
.ivu-layout-sider-children {
background: @left-tree-bg;
}
.ivu-tree-title {
color: @tree-title-color !important;
}
.ivu-btn-group>.ivu-btn {
color: @group-btn-color;
opacity: 0.8;
background: @group-btn-bg-color;
}
assets/css/themes/deepBlank.less
View file @ 1034f24d
// -------------深色-----------
//滚动条颜色
......@@ -8,23 +7,26 @@
@scrollbar-corner-bg-color: rgba(38, 128, 235, 1);
//顶部导航颜色
@home-mene: #2680eb;
@layout-header: #2f2f57;
@layout-tabs: #5151f1;
@layout-tabs-close: #515A6E;
@home-mene: #106FFE;
@layout-header: #2F2F57;
@layout-tabs: #222341;
@layout-tabs-close: #fff;
@layout-tabs-bg-close: #2F2F57;
@tabs-bg-tag: #2F2F57;
//bady颜色
@layout-content-bg-color: #232341;
@layout-content-bg-color: #222341;
@card-bg: #2f2f57;
@body-color: #fff;
@border-color: #2680eb;
@border-color: #106FFE;
@border-bot-color: #2f2f57;
@msg-bg-color: #292a4e;
//table表头颜色
@table-header: #2b3568;
@table-title-color: #fff;
@cao-zuo-color: #2680eb;
//首页标题颜色
@title-color: #0099ff;
//user
......@@ -34,19 +36,43 @@
@icon-title-color: #fff;
//左右滑动图标颜色
@icon-slide1-color: #22489a;
@icon-slide2-color: #5d7291;
@icon-slide1-color: #106FFE;
@icon-slide2-color: #106FFE;
//收藏夹自体图标颜色
@icon-color: #2680eb;
@icon-color: #106FFE;
//首页标题颜色
@title-color: #0099ff;
//表格、表单 以及其他字体颜色
//table表头颜色（首页）
@table-header: #2b3568;
@table-title-color: #fff;
@cao-zuo-color: #106FFE;
//表格 以及其他字体颜色
@table-color: #fff;
//表单的颜色
@form-color: #fff;
@form-footer-color: #fff;
@form-divider-boder-color: #106FFE;
@input-bg-color: #222341;
@input-boder-color: #222341;
//弹框颜色
@modal-header-bg-color: #515A6E;
@modal-header-bg-color: #2F2F57;
@madal-body-bg-color: #2f2f57;
@modal-header-border-color: #106FFE;
//左侧列表
@left-tree-bg: #2F2F57;
@left-tree-header-bg-color: #2F2F57;
@left-tree-header-color: #fff;
@tree-title-color: #fff;
@group-btn-bg-color:#2F2F57;
@group-btn-color:#F5F6FA;
\ No newline at end of file
assets/css/themes/default.less
View file @ 1034f24d
......@@ -12,6 +12,8 @@
@layout-header: #515A6E;
@layout-tabs: #f5f7f9;
@layout-tabs-close: #515A6E;
@layout-tabs-bg-close:#fff;
@tabs-bg-tag: #fff;
//bady颜色
@layout-content-bg-color: #fff;
......@@ -21,18 +23,14 @@
@border-bot-color: #eee;
@msg-bg-color: #fff;
//table表头颜色
@table-header: #edeef0;
@table-title-color: #515a6e;
@cao-zuo-color: #2680eb;
//首页标题颜色
@title-color: #0099ff;
//user
@s1-color: #333;
//图标颜色
@icon-title-color: #2680eb;
......@@ -44,11 +42,38 @@
//收藏夹自体图标颜色
@icon-color: #2680eb;
//首页标题颜色
@title-color: #0099ff;
//表格、表单 以及其他字体颜色
//table表头颜色（首页）
@table-header: #edeef0;
@table-title-color: #515a6e;
@cao-zuo-color: #2680eb;
//表格、 以及其他字体颜色
@table-color: #515A6E;
//表单的颜色
@form-color: #515a6e;
@form-footer-color: #fff;
@form-divider-boder-color:#e8eaec;
@input-bg-color:#fff;
@input-boder-color:#dcdee2;
//弹框颜色
@modal-header-bg-color: #515A6E;
@madal-body-bg-color: #fff;
@modal-header-border-color: #e8eaec;
//左侧列表
@left-tree-bg:#fff;
@left-tree-header-bg-color: #f5f6fa;
@left-tree-header-color: #515a6e;
@tree-title-color:#515a6e;
@group-btn-bg-color:#fff;
@group-btn-color:#515a6e;
\ No newline at end of file
assets/css/themes/green.less
View file @ 1034f24d
......@@ -12,6 +12,8 @@
@layout-header: #515A6E;
@layout-tabs: #f5f7f9;
@layout-tabs-close: #515A6E;
@layout-tabs-bg-close:#fff;
@tabs-bg-tag: #fff;
//bady颜色
@layout-content-bg-color: #fff;
......@@ -21,15 +23,13 @@
@border-bot-color: #eee;
@msg-bg-color: #fff;
//table表头颜色
@table-header: #2b3568;
@table-title-color: #fff;
@cao-zuo-color: #04bb8c;
//user
@s1-color: #333;
//首页标题颜色
@title-color: #04bb8c;
//图标颜色
@icon-title-color: #04bb8c;
......@@ -42,11 +42,37 @@
//收藏夹自体图标颜色
@icon-color: #04bb8c;
//首页标题颜色
@title-color: #04bb8c;
//表格、表单 以及其他字体颜色
//table表头颜色（首页）
@table-header: #2b3568;
@table-title-color: #fff;
@cao-zuo-color: #04bb8c;
//表格、以及其他字体颜色
@table-color: #515A6E;
//表单的颜色
@form-color: #515a6e;
@form-footer-color: #fff;
@form-divider-boder-color:#e8eaec;
@input-bg-color:#fff;
@input-boder-color:#dcdee2;
//弹框颜色
@modal-header-bg-color: #515A6E;
@madal-body-bg-color: #fff;
@modal-header-border-color: #e8eaec;
//左侧列表
@left-tree-bg:#fff;
@left-tree-header-bg-color: #f5f6fa;
@left-tree-header-color: #515a6e;
@tree-title-color:#515a6e;
@group-btn-bg-color:#fff;
@group-btn-color:#515a6e;
\ No newline at end of file
components/modalTree/storeHouseTree.vue
View file @ 1034f24d
<template>
<div class="flex fd tree-menu">
<h3>
<h3>
产品结构
<div class="fr mr10 mt10">
<ButtonGroup class="fr" size="small">
......@@ -33,8 +33,8 @@ export default {
expand: false,
ids: [],
tree: [],
divHeight:'',
divHeight: "",
keys: "",
// list: []
};
......@@ -45,23 +45,23 @@ export default {
methods: {
toggle() {
this.expand = !this.expand;
this.loadTree()
this.loadTree();
},
async loadTree() {
this.$http.storeHouse
.getpaged({ materialType: this.type })
.then((res) => {
console.log(res.result)
console.log(res.result);
if (res.result) {
let items = res.result;
// let item = this.$u.clone(res.result);
console.log('items:',items)
this.tree = this.getTrees(items)
this.change1(this.tree)
console.log("items:", items);
this.tree = this.getTrees(items);
this.change1(this.tree);
search(this.keys, items);
function search(keys, items) {
items.map(u => {
items.map((u) => {
if (keys.length < 3) {
u.expand = expand;
result.push(u);
......@@ -75,36 +75,36 @@ export default {
}
});
}
} else {
this.$Message.error('加载库房库位树失败!')
this.$Message.error("加载库房库位树失败!");
}
})
});
},
//重构左侧树
getTrees(trees) {
var expand = this.expand
var expand = this.expand;
trees.forEach((data, index) => {
var that = this
data.expand = expand
var that = this;
data.expand = expand;
if (data.children.length > 0) {
this.getTrees(data.children)
this.getTrees(data.children);
}
})
return trees
});
return trees;
},
renderContent(h, { root, node, data }) {
return h(
'span',
"span",
{
style: {
color: data.isClick ? '#000' : '#bbb', //根据选中状态设置样式
cursor: data.isClick ? 'pointer' : '',
background: node.node.selected&&data.isClick ? '#AAD8D4' : '#ffffff',
paddingLeft: '10px',
paddingRight: '10px',
paddingTop: '3px',
paddingBottom: '3px'
color: data.isClick ? "#000" : "#bbb", //根据选中状态设置样式
cursor: data.isClick ? "pointer" : "",
background:
node.node.selected && data.isClick ? "#AAD8D4" : "#ffffff",
paddingLeft: "10px",
paddingRight: "10px",
paddingTop: "3px",
paddingBottom: "3px",
},
on: {
// click: () => {
......@@ -112,49 +112,49 @@ export default {
// this.$refs.tree.handleSelect(node.nodeKey) //手动选择树节点
// }
// }
}
},
},
data.title
)
);
},
//得到此树节点下所有是产品的Id
getAllIds(trees) {
trees.forEach((data, index) => {
var that = this
var that = this;
if (data.isClick) {
this.ids.push(data.id)
this.ids.push(data.id);
}
if (data.children.length > 0) {
this.getAllIds(data.children)
this.getAllIds(data.children);
}
})
});
},
change(value) {
if (value.length > 0) {
if (value[0].isClick) {
this.ids = []
this.getAllIds(value)
this.ids = [];
this.getAllIds(value);
if (this.ids.length > 0) {
this.$emit('storeIds', this.ids)
this.$emit("storeIds", this.ids);
//this.easySearch.storeId.value = this.ids
} else {
this.$emit('storeIds', [-1])
this.$emit("storeIds", [-1]);
}
} else {
this.$Message.error('当前操作用户无此库位的权限')
this.$emit('storeIds', [-1])
this.$Message.error("当前操作用户无此库位的权限");
this.$emit("storeIds", [-1]);
}
}
},
change1(value) {
if (value.length > 0) {
this.ids = []
this.getAllIds(value)
this.ids = [];
this.getAllIds(value);
if (this.ids.length > 0) {
this.$emit('storeIds', this.ids)
this.$emit("storeIds", this.ids);
} else {
this.$emit('storeIds', [-1])
this.$emit("storeIds", [-1]);
}
}
},
......@@ -184,7 +184,7 @@ export default {
// },
hide() {
this.$emit("on-hide");
}
},
},
computed: {
data() {
......@@ -193,7 +193,7 @@ export default {
let result = [];
search(this.keys, items);
function search(keys, data) {
data.map(u => {
data.map((u) => {
if (keys.length < 3) {
u.expand = expand;
result.push(u);
......@@ -208,12 +208,13 @@ export default {
});
}
return result;
}
}
},
},
};
</script>
<style lang="less">
@import "../../assets/css/custom.less";
.tree-menu {
h3 {
height: 50px;
......@@ -221,8 +222,8 @@ export default {
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 50px;
color: rgba(81, 90, 110, 1);
background:rgba(245,246,250,1);
color: @left-tree-header-color;
background: @left-tree-header-bg-color;
opacity: 1;
padding-left: 10px;
}
......
components/page/productTree.vue
View file @ 1034f24d
......@@ -144,6 +144,7 @@ export default {
</script>
<style lang="less">
@import "../../assets/css/custom.less";
.tree-menu {
h3 {
height: 50px;
......@@ -151,8 +152,8 @@ export default {
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 50px;
color: rgba(81, 90, 110, 1);
background: rgba(245, 246, 250, 1);
color: @left-tree-header-color;
background: @left-tree-header-bg-color;
opacity: 1;
padding-left: 10px;
}
......
components/page/storeTree.vue
View file @ 1034f24d
......@@ -147,6 +147,7 @@ export default {
</script>
<style lang="less">
@import "../../assets/css/custom.less";
.tree-menu {
h3 {
height: 50px;
......@@ -154,8 +155,8 @@ export default {
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 50px;
color: rgba(81, 90, 110, 1);
background: rgba(245, 246, 250, 1);
color: @left-tree-header-color;
background: @left-tree-header-bg-color;
opacity: 1;
padding-left: 10px;
}
......
pages/home/index.vue
View file @ 1034f24d
......@@ -402,6 +402,7 @@ export default {
margin-top: 10px;
font-size: 30px;
color: @icon-slide1-color;
opacity: 0.4;
position: absolute;
width: 40px;
top: 13px;
......@@ -411,6 +412,7 @@ export default {
margin-top: 10px;
font-size: 30px;
color: @icon-slide2-color;
cursor: pointer;
position: absolute;
width: 40px;
......@@ -422,6 +424,7 @@ export default {
margin-top: 10px;
font-size: 30px;
color: @icon-slide1-color;
opacity: 0.4;
position: absolute;
top: 13px;
right: 0;
......@@ -431,6 +434,7 @@ export default {
margin-top: 10px;
font-size: 30px;
color: @icon-slide2-color;
cursor: pointer;
position: absolute;
top: 13px;
......@@ -472,6 +476,7 @@ export default {
.bg-b {
font-size: 30px;
color: @icon-slide1-color;
opacity: 0.4;
width: 35px;
position: absolute;
top: 45px;
......@@ -480,6 +485,7 @@ export default {
.bg-b1 {
font-size: 30px;
color: @icon-slide2-color;
width: 35px;
position: absolute;
top: 45px;
......@@ -496,6 +502,7 @@ export default {
position: absolute;
font-size: 30px;
color: @icon-slide1-color;
opacity: 0.4;
top: 45px;
right: 0;
width: 35px;
......
pages/materiel/classification/index.vue
View file @ 1034f24d
......@@ -398,8 +398,8 @@ export default {
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 50px;
color: rgba(81, 90, 110, 1);
background: rgba(245, 246, 250, 1);
color: @left-tree-header-color;
background: @left-tree-header-bg-color;
opacity: 1;
padding-left: 10px;
}
......
pages/materiel/masterData/index.vue
View file @ 1034f24d
......@@ -315,8 +315,8 @@ export default {
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 50px;
color: rgba(81, 90, 110, 1);
background: rgba(245, 246, 250, 1);
color: @left-tree-header-color;
background: @left-tree-header-bg-color;
opacity: 1;
padding-left: 10px;
}
......
pages/resourceManagement/productionResources/index.vue
View file @ 1034f24d
......@@ -301,12 +301,13 @@ export default {
};
</script>
<style lang="less">
@import "../../../assets/css/custom.less";
.resources-p {
.form-row {
width: 600px;
margin-left: 50px;
.ivu-form-item-label {
color: #fff !important;
color: @form-color;
}
}
.ivu-footer-toolbar-right {
......
pages/technology/productMix/productTree/index.vue
View file @ 1034f24d
......@@ -61,7 +61,7 @@ export default {
modal: false,
title: "新增",
curId: 0,
detail: null
detail: null,
};
},
......@@ -99,7 +99,7 @@ export default {
title: "删除",
content: "<p>您确定要删除吗？</p>",
onOk: () => {
Api.delete(this.nodeInfo.id).then(r => {
Api.delete(this.nodeInfo.id).then((r) => {
if (r.success) {
this.loadTree();
this.$Message.success("删除成功");
......@@ -108,7 +108,7 @@ export default {
},
onCancel: () => {
this.$Message.success("取消删除");
}
},
});
}
},
......@@ -125,14 +125,14 @@ export default {
// this.handleSelect(data); //手动选择树节点
// },
//右键点击事件
contextmenu: e => {
contextmenu: (e) => {
e.preventDefault();
this.$refs.contentMenu.$refs.reference = event.target;
this.$refs.contentMenu.currentVisible = !this.$refs.contentMenu
.currentVisible;
this.nodeInfo = data;
}
}
},
},
},
data.title
);
......@@ -141,10 +141,10 @@ export default {
// this.$emit("clickItem", data);
// },
loadTree() {
Api.getleveltree().then(r => {
Api.getleveltree().then((r) => {
setTree(r.result);
function setTree(data) {
data.map(u => {
data.map((u) => {
u.title = u.name;
u.value = u.id;
if (u.children) {
......@@ -167,7 +167,7 @@ export default {
if (b.children) {
addId(b.children);
function addId(data) {
data.map(u => {
data.map((u) => {
ids.push(u.value);
if (u.children) {
addId(u.children);
......@@ -179,7 +179,7 @@ export default {
},
hide() {
this.$emit("on-hide");
}
},
},
computed: {
data() {
......@@ -188,7 +188,7 @@ export default {
let result = [];
search(this.keys, items);
function search(keys, data) {
data.map(u => {
data.map((u) => {
if (keys.length < u.title) {
u.expand = expand;
result.push(u);
......@@ -203,12 +203,13 @@ export default {
});
}
return result;
}
}
},
},
};
</script>
<style lang="less">
@import "../../../../assets/css/custom.less";
.tree-menu {
h3 {
height: 50px;
......@@ -216,8 +217,8 @@ export default {
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 50px;
color: rgba(81, 90, 110, 1);
background: rgba(245, 246, 250, 1);
color: @left-tree-header-color;
background: @left-tree-header-bg-color;
opacity: 1;
padding-left: 10px;
}
......
static/static/iview-reset.css
View file @ 1034f24d
......@@ -177,7 +177,7 @@
vertical-align: middle;
float: left;
font-size: 14px;
color: #515a6e;
/* color: #515a6e; */
line-height: 1;
padding: 10px 12px 10px 0;
box-sizing: border-box;
......
static/static/iviewRe.css
View file @ 1034f24d
......@@ -11396,8 +11396,7 @@ textarea.ivu-page-options-elevator input {
background-clip: padding-box
}
.ivu-modal-header {
border-bottom: 1px solid #e3e8ee;
.ivu-modal-header {
padding: 14px 16px;
line-height: 1
}
......@@ -14104,13 +14103,13 @@ span.ivu-date-picker-cells-cell-disabled.ivu-date-picker-cells-cell-selected em
vertical-align: middle;
float: left;
font-size: 12px;
color: #657180;
/* color: #657180; */
line-height: 1;
padding: 10px 12px 10px 0;
box-sizing: border-box
}
.ivu-form-label-left .ivu-form-item-label {
.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