rev:布局
This commit is contained in:
@@ -20,6 +20,9 @@ public class CleanLog {
|
||||
WQLObject logTab = WQLObject.getWQLObject("sys_log");
|
||||
int days = Integer.parseInt(paramService.findByCode("log_day").getValue());
|
||||
logTab.delete("DATE(create_time) <= DATE(DATE_SUB(NOW(),INTERVAL " + days + " day))");
|
||||
|
||||
WQLObject logQuartzTab = WQLObject.getWQLObject("sys_quartz_log");
|
||||
logQuartzTab.delete("DATE(create_time) <= DATE(DATE_SUB(NOW(),INTERVAL " + days + " day))");
|
||||
log.info("自动清理日志执行成功...!");
|
||||
}
|
||||
|
||||
|
||||
@@ -38,32 +38,32 @@ public class NL4StationDeviceDriver extends AbstractOpcDeviceDriver implements D
|
||||
|
||||
// 心跳
|
||||
private int heartbeat = 0;
|
||||
private int lastHeartbeat = this.heartbeat;
|
||||
private int lastHeartbeat = 0;
|
||||
// 工作模式
|
||||
private int mode = 0;
|
||||
private int lastMode = this.mode;
|
||||
private int lastMode = 0;
|
||||
// 光电信号
|
||||
private int move = 0;
|
||||
private int lastMove = this.move;
|
||||
private int lastMove = 0;
|
||||
// 动作信号
|
||||
private int action = 0;
|
||||
private int lastAction = this.action;
|
||||
private int lastAction = 0;
|
||||
// error
|
||||
private int error = 0;
|
||||
private int lastError = this.error;
|
||||
private int lastError = 0;
|
||||
// 任务号
|
||||
private int task = 0;
|
||||
private int lastTask = this.task;
|
||||
private int lastTask = 0;
|
||||
|
||||
// 下发命令
|
||||
private int toCommand = 0;
|
||||
private int lastToCommand = this.toCommand;
|
||||
private int lastToCommand = 0;
|
||||
// 下发物料
|
||||
private int toMaterial = 0;
|
||||
private int lastToMaterial = this.toMaterial;
|
||||
private int lastToMaterial = 0;
|
||||
// 下发数量
|
||||
private int toQty = 0;
|
||||
private int lastToQty = this.toQty;
|
||||
private int lastToQty = 0;
|
||||
|
||||
private String currentDeviceCode = null;
|
||||
private boolean isOnline = false;
|
||||
@@ -103,37 +103,28 @@ public class NL4StationDeviceDriver extends AbstractOpcDeviceDriver implements D
|
||||
if (mode == 2) {
|
||||
this.writing("to_command", "0");
|
||||
}
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", "mode信号发生变化,进行复位标记,此时标记值:" + requireSuccess);
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_MODE, String.valueOf(mode));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_MODE + " " + this.lastMode + " -> " + this.mode);
|
||||
}
|
||||
if (this.move != this.lastMove) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_MOVE, String.valueOf(this.move));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_MOVE + " " + this.lastMove + " -> " + this.move);
|
||||
}
|
||||
if (this.action != this.lastAction) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_ACTION, String.valueOf(this.action));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_ACTION + " " + this.lastAction + " -> " + this.action);
|
||||
}
|
||||
if (this.error != this.lastError) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_ERROR, String.valueOf(this.error));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_ERROR + " " + this.lastError + " -> " + this.error);
|
||||
}
|
||||
if (this.task != this.lastTask) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_TASK, String.valueOf(this.task));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_TASK + " " + this.lastTask + " -> " + this.task);
|
||||
}
|
||||
|
||||
if (this.toCommand != this.lastToCommand) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_TO_COMMAND, String.valueOf(this.toCommand));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_TO_COMMAND + " " + this.lastToCommand + " -> " + this.toCommand);
|
||||
}
|
||||
if (this.toMaterial != this.lastToMaterial) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_TO_MATERIAL, String.valueOf(this.toMaterial));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_TO_MATERIAL + " " + this.lastToMaterial + " -> " + this.toMaterial);
|
||||
}
|
||||
if (this.toQty != this.lastToQty) {
|
||||
this.deviceExecuteLogService.deviceItemValue(this.currentDeviceCode, ItemProtocol.ITEM_TO_QTY, String.valueOf(this.toQty));
|
||||
this.deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", ItemProtocol.ITEM_TO_QTY + " " + this.lastToQty + " -> " + this.toQty);
|
||||
}
|
||||
} catch (Exception e) {
|
||||
@@ -271,8 +262,12 @@ public class NL4StationDeviceDriver extends AbstractOpcDeviceDriver implements D
|
||||
private Device findHasGoodsDevice(JSONArray deviceCodes) {
|
||||
for (int i = 0; i < deviceCodes.size(); i++) {
|
||||
Device device = this.deviceAppService.findDeviceByCode(deviceCodes.getString(i));
|
||||
if (device != null && "0".equals(device.getIslock()) && 1 == device.getHas_goods()) {
|
||||
if (device != null && ("0".equals(device.getIslock()) || "false".equals(device.getIslock())) && 1 == device.getHas_goods()) {
|
||||
return device;
|
||||
} else {
|
||||
if (device != null) {
|
||||
deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", "查找设备时,对应的设备:" + device.getDevice_code() + ",锁定状态:" + device.getIslock() + ",有货状态:" + device.getHas_goods());
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
@@ -281,8 +276,12 @@ public class NL4StationDeviceDriver extends AbstractOpcDeviceDriver implements D
|
||||
private Device findNotHasGoodsDevice(JSONArray deviceCodes) {
|
||||
for (int i = 0; i < deviceCodes.size(); i++) {
|
||||
Device device = this.deviceAppService.findDeviceByCode(deviceCodes.getString(i));
|
||||
if (device != null && "0".equals(device.getIslock()) && 0 == device.getHas_goods()) {
|
||||
if (device != null && ("0".equals(device.getIslock()) || "false".equals(device.getIslock())) && 0 == device.getHas_goods()) {
|
||||
return device;
|
||||
} else {
|
||||
if (device != null) {
|
||||
deviceExecuteLogService.deviceExecuteLog(this.currentDeviceCode, "", "", "查找设备时,对应的设备:" + device.getDevice_code() + ",锁定状态:" + device.getIslock() + ",有货状态:" + device.getHas_goods());
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
|
||||
@@ -582,8 +582,8 @@ public class HFHandServiceImpl implements HFHandService {
|
||||
taskService.finish(acsTask.getTask_id());
|
||||
Device startDevice = deviceAppService.findDeviceByCode(acsTask.getStart_device_code());
|
||||
Device nextDevice = deviceAppService.findDeviceByCode(acsTask.getNext_device_code());
|
||||
startDevice.setIslock("false");
|
||||
nextDevice.setIslock("false");
|
||||
startDevice.setIslock("0");
|
||||
nextDevice.setIslock("0");
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -53,9 +53,6 @@
|
||||
sys_dict_detail
|
||||
WHERE
|
||||
`name` = 'region'
|
||||
OPTION 输入.region_code <> ""
|
||||
value in ('2','3','5','7','8','11')
|
||||
ENDOPTION
|
||||
ENDSELECT
|
||||
ENDQUERY
|
||||
ENDIF
|
||||
|
||||
@@ -25,6 +25,7 @@ import org.nl.modules.quartz.domain.QuartzLog;
|
||||
import org.nl.modules.quartz.repository.QuartzLogRepository;
|
||||
import org.nl.modules.quartz.service.QuartzJobService;
|
||||
import org.nl.modules.wql.util.SpringContextHolder;
|
||||
import org.quartz.DisallowConcurrentExecution;
|
||||
import org.quartz.JobExecutionContext;
|
||||
import org.springframework.scheduling.annotation.Async;
|
||||
import org.springframework.scheduling.quartz.QuartzJobBean;
|
||||
@@ -41,6 +42,7 @@ import java.util.concurrent.ThreadPoolExecutor;
|
||||
@Async
|
||||
@SuppressWarnings({"unchecked", "all"})
|
||||
@Slf4j
|
||||
@DisallowConcurrentExecution
|
||||
public class ExecutionJob extends QuartzJobBean {
|
||||
|
||||
/**
|
||||
|
||||
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB After Width: | Height: | Size: 622 B |
Binary file not shown.
|
Before Width: | Height: | Size: 8.6 KiB After Width: | Height: | Size: 125 KiB |
@@ -1,99 +1,99 @@
|
||||
@import 'variables';
|
||||
|
||||
@mixin colorBtn($color) {
|
||||
background: $color;
|
||||
|
||||
&:hover {
|
||||
color: $color;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
background: $color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.blue-btn {
|
||||
@include colorBtn($blue)
|
||||
}
|
||||
|
||||
.light-blue-btn {
|
||||
@include colorBtn($light-blue)
|
||||
}
|
||||
|
||||
.red-btn {
|
||||
@include colorBtn($red)
|
||||
}
|
||||
|
||||
.pink-btn {
|
||||
@include colorBtn($pink)
|
||||
}
|
||||
|
||||
.green-btn {
|
||||
@include colorBtn($green)
|
||||
}
|
||||
|
||||
.tiffany-btn {
|
||||
@include colorBtn($tiffany)
|
||||
}
|
||||
|
||||
.yellow-btn {
|
||||
@include colorBtn($yellow)
|
||||
}
|
||||
|
||||
.pan-btn {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
padding: 14px 36px;
|
||||
border-radius: 8px;
|
||||
border: none;
|
||||
outline: none;
|
||||
transition: 600ms ease all;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
||||
&:hover {
|
||||
background: #fff;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
width: 100%;
|
||||
transition: 600ms ease all;
|
||||
}
|
||||
}
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
width: 0;
|
||||
transition: 400ms ease all;
|
||||
}
|
||||
|
||||
&::after {
|
||||
right: inherit;
|
||||
top: inherit;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-button {
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
background: #fff;
|
||||
color: #fff;
|
||||
-webkit-appearance: none;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
outline: 0;
|
||||
margin: 0;
|
||||
padding: 10px 15px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
@import 'variables';
|
||||
|
||||
@mixin colorBtn($color) {
|
||||
background: $color;
|
||||
|
||||
&:hover {
|
||||
color: $color;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
background: $color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.blue-btn {
|
||||
@include colorBtn($blue)
|
||||
}
|
||||
|
||||
.light-blue-btn {
|
||||
@include colorBtn($light-blue)
|
||||
}
|
||||
|
||||
.red-btn {
|
||||
@include colorBtn($red)
|
||||
}
|
||||
|
||||
.pink-btn {
|
||||
@include colorBtn($pink)
|
||||
}
|
||||
|
||||
.green-btn {
|
||||
@include colorBtn($green)
|
||||
}
|
||||
|
||||
.tiffany-btn {
|
||||
@include colorBtn($tiffany)
|
||||
}
|
||||
|
||||
.yellow-btn {
|
||||
@include colorBtn($yellow)
|
||||
}
|
||||
|
||||
.pan-btn {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
padding: 14px 36px;
|
||||
border-radius: 8px;
|
||||
border: none;
|
||||
outline: none;
|
||||
transition: 600ms ease all;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
||||
&:hover {
|
||||
background: #fff;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
width: 100%;
|
||||
transition: 600ms ease all;
|
||||
}
|
||||
}
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
width: 0;
|
||||
transition: 400ms ease all;
|
||||
}
|
||||
|
||||
&::after {
|
||||
right: inherit;
|
||||
top: inherit;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.custom-button {
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
background: #fff;
|
||||
color: #fff;
|
||||
-webkit-appearance: none;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
outline: 0;
|
||||
margin: 0;
|
||||
padding: 10px 15px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -1,205 +1,230 @@
|
||||
.head-container {
|
||||
padding-bottom: 10px;
|
||||
|
||||
.filter-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: 0 3px 10px 0;
|
||||
|
||||
input {
|
||||
height: 30.5px;
|
||||
line-height: 30.5px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-form-item-label {
|
||||
margin: 0 3px 9px 0;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
vertical-align: middle;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 30.5px;
|
||||
padding: 0 7px 0 7px;
|
||||
}
|
||||
|
||||
.el-button + .el-button {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.el-select__caret.el-input__icon.el-icon-arrow-up {
|
||||
line-height: 30.5px;
|
||||
}
|
||||
|
||||
.date-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-bottom: 10px;
|
||||
height: 30.5px !important;
|
||||
width: 230px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-avatar {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
background: #ccc;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.logo-con {
|
||||
height: 60px;
|
||||
padding: 13px 0 0;
|
||||
|
||||
img {
|
||||
height: 32px;
|
||||
width: 135px;
|
||||
display: block;
|
||||
//margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
#el-login-footer {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-family: Arial, serif;
|
||||
font-size: 12px;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
#el-main-footer {
|
||||
background: none repeat scroll 0 0 white;
|
||||
border-top: 1px solid #e7eaec;
|
||||
overflow: hidden;
|
||||
padding: 10px 6px 0 6px;
|
||||
height: 33px;
|
||||
font-size: 0.7rem !important;
|
||||
color: #7a8b9a;
|
||||
letter-spacing: 0.8px;
|
||||
font-family: Arial, sans-serif !important;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.eladmin-upload {
|
||||
border: 1px dashed #c0ccda;
|
||||
border-radius: 5px;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
width: 368px;
|
||||
}
|
||||
|
||||
.my-blockquote {
|
||||
margin: 0 0 10px;
|
||||
padding: 15px;
|
||||
line-height: 22px;
|
||||
border-left: 5px solid #00437B;
|
||||
border-radius: 0 2px 2px 0;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.my-code {
|
||||
position: relative;
|
||||
padding: 15px;
|
||||
line-height: 20px;
|
||||
border-left: 5px solid #ddd;
|
||||
color: #333;
|
||||
font-family: Courier New, serif;
|
||||
font-size: 12px
|
||||
}
|
||||
|
||||
.el-tabs {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
|
||||
//修改侧边栏菜单颜色和高度
|
||||
.el-menu-item, .el-submenu__title {
|
||||
height: 40px !important;
|
||||
//background-color: #776020 !important;
|
||||
}
|
||||
|
||||
#app .sidebar-container .el-submenu .el-menu-item {
|
||||
}
|
||||
|
||||
#app .sidebar-container .nest-menu .el-submenu > .el-submenu__title, #app .sidebar-container .el-submenu .el-menu-item {
|
||||
}
|
||||
|
||||
#app .sidebar-container {
|
||||
//background-color: #544b32 !important;
|
||||
}
|
||||
|
||||
.el-form-item--small.el-form-item {
|
||||
margin-bottom: 12px !important;
|
||||
}
|
||||
|
||||
.el-form-item--mini.el-form-item {
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
//去除编辑文本框为数字时的上下箭头start
|
||||
.el-form--inline .el-form-item__content {
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
input[type="number"] {
|
||||
-moz-appearance: textfield;
|
||||
}
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
//去除编辑文本框为数字时的上下箭头end
|
||||
//设置计数器文字居左
|
||||
.el-input-number--mini .el-input__inner {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.el-table:not(.el-table–scrollable-x) .el-table__fixed-right {
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
// 修改弹出框距离
|
||||
.el-dialog__body {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
|
||||
//表格标题样式
|
||||
.el-table {
|
||||
.el-table__header-wrapper,
|
||||
.el-table__fixed-header-wrapper {
|
||||
th {
|
||||
word-break: break-word;
|
||||
background-color: #f8f8f9;
|
||||
color: #515a6e;
|
||||
height: 35px;
|
||||
font-size: 13px;
|
||||
}
|
||||
td{
|
||||
color: #f8f8f9;
|
||||
}
|
||||
}
|
||||
.el-table__body-wrapper {
|
||||
.el-button [class*="el-icon-"] + span {
|
||||
margin-left: 1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.head-container {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 6px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 4px;
|
||||
|
||||
.filter-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin: 0 3px 10px 0;
|
||||
|
||||
input {
|
||||
height: 30.5px;
|
||||
line-height: 30.5px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-form-item-label {
|
||||
margin: 0 3px 9px 0;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
vertical-align: middle;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
line-height: 30.5px;
|
||||
padding: 0 7px 0 7px;
|
||||
}
|
||||
|
||||
.el-button + .el-button {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.el-select__caret.el-input__icon.el-icon-arrow-up {
|
||||
line-height: 30.5px;
|
||||
}
|
||||
|
||||
.date-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-bottom: 10px;
|
||||
height: 30.5px !important;
|
||||
width: 230px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-avatar {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
background: #ccc;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.logo-con {
|
||||
height: 60px;
|
||||
padding: 13px 0 0;
|
||||
|
||||
img {
|
||||
height: 32px;
|
||||
width: 135px;
|
||||
display: block;
|
||||
//margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
#el-login-footer {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-family: Arial, serif;
|
||||
font-size: 12px;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
#el-main-footer {
|
||||
background: none repeat scroll 0 0 white;
|
||||
border-top: 1px solid #e7eaec;
|
||||
overflow: hidden;
|
||||
padding: 10px 6px 0 6px;
|
||||
height: 33px;
|
||||
font-size: 0.7rem !important;
|
||||
color: #7a8b9a;
|
||||
letter-spacing: 0.8px;
|
||||
font-family: Arial, sans-serif !important;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.eladmin-upload {
|
||||
border: 1px dashed #c0ccda;
|
||||
border-radius: 5px;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
width: 368px;
|
||||
}
|
||||
|
||||
.my-blockquote {
|
||||
margin: 0 0 10px;
|
||||
padding: 15px;
|
||||
line-height: 22px;
|
||||
border-left: 5px solid #00437B;
|
||||
border-radius: 0 2px 2px 0;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.my-code {
|
||||
position: relative;
|
||||
padding: 15px;
|
||||
line-height: 20px;
|
||||
border-left: 5px solid #ddd;
|
||||
color: #333;
|
||||
font-family: Courier New, serif;
|
||||
font-size: 12px
|
||||
}
|
||||
|
||||
.el-tabs {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
|
||||
//修改侧边栏菜单颜色和高度
|
||||
.el-menu-item, .el-submenu__title {
|
||||
height: 40px !important;
|
||||
//background-color: #776020 !important;
|
||||
}
|
||||
|
||||
#app .sidebar-container .el-submenu .el-menu-item {
|
||||
}
|
||||
|
||||
#app .sidebar-container .nest-menu .el-submenu > .el-submenu__title, #app .sidebar-container .el-submenu .el-menu-item {
|
||||
}
|
||||
|
||||
#app .sidebar-container {
|
||||
//background-color: #544b32 !important;
|
||||
}
|
||||
|
||||
.el-form-item--small.el-form-item {
|
||||
margin-bottom: 12px !important;
|
||||
}
|
||||
|
||||
.el-form-item--mini.el-form-item {
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
//去除编辑文本框为数字时的上下箭头start
|
||||
.el-form--inline .el-form-item__content {
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
input[type="number"] {
|
||||
-moz-appearance: textfield;
|
||||
}
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
//去除编辑文本框为数字时的上下箭头end
|
||||
|
||||
//设置计数器文字居左
|
||||
.el-input-number--mini .el-input__inner {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.el-table:not(.el-table–scrollable-x) .el-table__fixed-right {
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
// 修改弹出框距离
|
||||
.el-dialog__body {
|
||||
padding-top: 0px !important;
|
||||
}
|
||||
|
||||
//表格标题样式
|
||||
.el-table {
|
||||
.el-table__header-wrapper,
|
||||
.el-table__fixed-header-wrapper {
|
||||
th {
|
||||
word-break: break-word;
|
||||
background-color: #f5f5f5;
|
||||
color: #515a6e;
|
||||
height: 35px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
td {
|
||||
color: #f8f8f9;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table__body-wrapper {
|
||||
.el-button [class*="el-icon-"] + span {
|
||||
margin-left: 1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//表格固定列最后一行显示不全(https://mp.weixin.qq.com/s/HpoykJNtsynsW4UMHitZbQ)
|
||||
.el-table__fixed-right {
|
||||
height: 100% !important;
|
||||
}
|
||||
|
||||
//表头与内容错位
|
||||
.el-table--scrollable-y .el-table__body-wrapper {
|
||||
overflow-y: overlay !important;
|
||||
}
|
||||
//左侧边框不显示start https://blog.csdn.net/m0_37922443/article/details/126487240
|
||||
.el-table__row td:not(.is-hidden):last-child {
|
||||
right: -1px;
|
||||
}
|
||||
|
||||
thead th:not(.is-hidden):last-child {
|
||||
right: -1px;
|
||||
}
|
||||
//左侧边框不显示end
|
||||
|
||||
|
||||
@@ -1,122 +1,122 @@
|
||||
// cover some element-ui styles
|
||||
|
||||
.el-breadcrumb__inner,
|
||||
.el-breadcrumb__inner a {
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
|
||||
.el-upload {
|
||||
input[type="file"] {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-upload__input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.cell {
|
||||
.el-tag {
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.small-padding {
|
||||
.cell {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-width {
|
||||
.el-button--mini {
|
||||
padding: 7px 10px;
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.status-col {
|
||||
.cell {
|
||||
padding: 0 10px;
|
||||
text-align: center;
|
||||
|
||||
.el-tag {
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// to fixed https://github.com/ElemeFE/element/issues/2461
|
||||
.el-dialog {
|
||||
transform: none;
|
||||
left: 0;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
// refine element ui upload
|
||||
.upload-container {
|
||||
.el-upload {
|
||||
width: 100%;
|
||||
|
||||
.el-upload-dragger {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// dropdown
|
||||
.el-dropdown-menu {
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
// fix date-picker ui bug in filter-item
|
||||
.el-range-editor.el-input__inner {
|
||||
display: inline-flex !important;
|
||||
}
|
||||
|
||||
// to fix el-date-picker css style
|
||||
.el-range-separator {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
.el-menu--collapse
|
||||
> div
|
||||
> .el-submenu
|
||||
> .el-submenu__title
|
||||
.el-submenu__icon-arrow {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.el-form-search {
|
||||
float: right;
|
||||
.el-form-search-item {
|
||||
margin-bottom: 0px;
|
||||
.el-input__inner {
|
||||
width: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
el-table .el-table__cell {
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.el-table--medium .el-table__cell {
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.el-table--small .el-table__cell {
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
.el-table--mini .el-table__cell {
|
||||
padding: 1px 0;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 20px 20px;
|
||||
}
|
||||
// cover some element-ui styles
|
||||
|
||||
.el-breadcrumb__inner,
|
||||
.el-breadcrumb__inner a {
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
|
||||
.el-upload {
|
||||
input[type="file"] {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-upload__input {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.cell {
|
||||
.el-tag {
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.small-padding {
|
||||
.cell {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-width {
|
||||
.el-button--mini {
|
||||
padding: 7px 10px;
|
||||
width: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.status-col {
|
||||
.cell {
|
||||
padding: 0 10px;
|
||||
text-align: center;
|
||||
|
||||
.el-tag {
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// to fixed https://github.com/ElemeFE/element/issues/2461
|
||||
.el-dialog {
|
||||
transform: none;
|
||||
left: 0;
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
// refine element ui upload
|
||||
.upload-container {
|
||||
.el-upload {
|
||||
width: 100%;
|
||||
|
||||
.el-upload-dragger {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// dropdown
|
||||
.el-dropdown-menu {
|
||||
a {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
// fix date-picker ui bug in filter-item
|
||||
.el-range-editor.el-input__inner {
|
||||
display: inline-flex !important;
|
||||
}
|
||||
|
||||
// to fix el-date-picker css style
|
||||
.el-range-separator {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
.el-menu--collapse
|
||||
> div
|
||||
> .el-submenu
|
||||
> .el-submenu__title
|
||||
.el-submenu__icon-arrow {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.el-form-search {
|
||||
float: right;
|
||||
.el-form-search-item {
|
||||
margin-bottom: 0px;
|
||||
.el-input__inner {
|
||||
width: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
el-table .el-table__cell {
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.el-table--medium .el-table__cell {
|
||||
padding: 6px 0;
|
||||
}
|
||||
|
||||
.el-table--small .el-table__cell {
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
.el-table--mini .el-table__cell {
|
||||
padding: 1px 0;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 20px 20px;
|
||||
}
|
||||
|
||||
@@ -1,31 +1,31 @@
|
||||
/**
|
||||
* I think element-ui's default theme color is too light for long-term use.
|
||||
* So I modified the default color and you can modify it to your liking.
|
||||
**/
|
||||
|
||||
/* theme color */
|
||||
$--color-primary: #1890ff;
|
||||
$--color-success: #13ce66;
|
||||
$--color-warning: #FFBA00;
|
||||
$--color-danger: #ff4949;
|
||||
// $--color-info: #1E1E1E;
|
||||
|
||||
$--button-font-weight: 400;
|
||||
|
||||
// $--color-text-regular: #1f2d3d;
|
||||
|
||||
$--border-color-light: #dfe4ed;
|
||||
$--border-color-lighter: #e6ebf5;
|
||||
|
||||
$--table-border:1px solid#dfe6ec;
|
||||
|
||||
/* icon font path, required */
|
||||
$--font-path: '~element-ui/lib/theme-chalk/fonts';
|
||||
|
||||
@import "../../../node_modules/element-ui/packages/theme-chalk/src/index";
|
||||
|
||||
// the :export directive is the magic sauce for webpack
|
||||
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
|
||||
:export {
|
||||
theme: $--color-primary;
|
||||
}
|
||||
/**
|
||||
* I think element-ui's default theme color is too light for long-term use.
|
||||
* So I modified the default color and you can modify it to your liking.
|
||||
**/
|
||||
|
||||
/* theme color */
|
||||
$--color-primary: #1890ff;
|
||||
$--color-success: #13ce66;
|
||||
$--color-warning: #FFBA00;
|
||||
$--color-danger: #ff4949;
|
||||
// $--color-info: #1E1E1E;
|
||||
|
||||
$--button-font-weight: 400;
|
||||
|
||||
// $--color-text-regular: #1f2d3d;
|
||||
|
||||
$--border-color-light: #dfe4ed;
|
||||
$--border-color-lighter: #e6ebf5;
|
||||
|
||||
$--table-border:1px solid#dfe6ec;
|
||||
|
||||
/* icon font path, required */
|
||||
$--font-path: '~element-ui/lib/theme-chalk/fonts';
|
||||
|
||||
@import "../../../node_modules/element-ui/packages/theme-chalk/src/index";
|
||||
|
||||
// the :export directive is the magic sauce for webpack
|
||||
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
|
||||
:export {
|
||||
theme: $--color-primary;
|
||||
}
|
||||
|
||||
@@ -1,182 +1,183 @@
|
||||
@import 'variables';
|
||||
@import 'mixin';
|
||||
@import 'transition';
|
||||
@import 'element-ui';
|
||||
@import 'sidebar';
|
||||
@import 'btn';
|
||||
@import 'eladmin';
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-rendering: optimizeLegibility;
|
||||
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#app {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
.no-padding {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.padding-content {
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
a:focus,
|
||||
a:active {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
a,
|
||||
a:focus,
|
||||
a:hover {
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
div:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.pr-5 {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.pl-5 {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.inlineBlock {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
&:after {
|
||||
visibility: hidden;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
content: " ";
|
||||
clear: both;
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
aside {
|
||||
background: #eef1f6;
|
||||
padding: 8px 24px;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 2px;
|
||||
display: block;
|
||||
line-height: 32px;
|
||||
font-size: 16px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
color: #2c3e50;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
a {
|
||||
color: #337ab7;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: rgb(32, 160, 255);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//main-container全局样式
|
||||
.app-container {
|
||||
padding: 20px 20px 45px 20px;
|
||||
}
|
||||
|
||||
.components-container {
|
||||
margin: 30px 50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pagination-container {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.sub-navbar {
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
padding-right: 20px;
|
||||
transition: 600ms ease position;
|
||||
background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
|
||||
|
||||
.subtitle {
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&.draft {
|
||||
background: #d0d0d0;
|
||||
}
|
||||
|
||||
&.deleted {
|
||||
background: #d0d0d0;
|
||||
}
|
||||
}
|
||||
|
||||
.link-type,
|
||||
.link-type:focus {
|
||||
color: #337ab7;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: rgb(32, 160, 255);
|
||||
}
|
||||
}
|
||||
|
||||
//refine vue-multiselect plugin
|
||||
.multiselect {
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
.multiselect--active {
|
||||
z-index: 1000 !important;
|
||||
}
|
||||
@import 'variables';
|
||||
@import 'mixin';
|
||||
@import 'transition';
|
||||
@import 'element-ui';
|
||||
@import 'sidebar';
|
||||
@import 'btn';
|
||||
@import 'eladmin';
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
text-rendering: optimizeLegibility;
|
||||
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
//background-color: #eeeeee;
|
||||
}
|
||||
|
||||
#app {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
.no-padding {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.padding-content {
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
a:focus,
|
||||
a:active {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
a,
|
||||
a:focus,
|
||||
a:hover {
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
div:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.pr-5 {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.pl-5 {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.pointer {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.inlineBlock {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
&:after {
|
||||
visibility: hidden;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
content: " ";
|
||||
clear: both;
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
aside {
|
||||
background: #d40c70;
|
||||
padding: 8px 24px;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 2px;
|
||||
display: block;
|
||||
line-height: 32px;
|
||||
font-size: 16px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
color: #2c3e50;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
a {
|
||||
color: #337ab7;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: rgb(32, 160, 255);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//main-container全局样式
|
||||
.app-container {
|
||||
padding: 10px 20px 45px 10px;
|
||||
}
|
||||
|
||||
.components-container {
|
||||
margin: 30px 50px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pagination-container {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.sub-navbar {
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
padding-right: 20px;
|
||||
transition: 600ms ease position;
|
||||
background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
|
||||
|
||||
.subtitle {
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&.draft {
|
||||
background: #d0d0d0;
|
||||
}
|
||||
|
||||
&.deleted {
|
||||
background: #d0d0d0;
|
||||
}
|
||||
}
|
||||
|
||||
.link-type,
|
||||
.link-type:focus {
|
||||
color: #337ab7;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: rgb(32, 160, 255);
|
||||
}
|
||||
}
|
||||
|
||||
//refine vue-multiselect plugin
|
||||
.multiselect {
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
.multiselect--active {
|
||||
z-index: 1000 !important;
|
||||
}
|
||||
|
||||
@@ -1,66 +1,66 @@
|
||||
@mixin clearfix {
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin scrollBar {
|
||||
&::-webkit-scrollbar-track-piece {
|
||||
background: #d3dce6;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #99a9bf;
|
||||
border-radius: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin relative {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@mixin pct($pct) {
|
||||
width: #{$pct};
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@mixin triangle($width, $height, $color, $direction) {
|
||||
$width: $width/2;
|
||||
$color-border-style: $height solid $color;
|
||||
$transparent-border-style: $width solid transparent;
|
||||
height: 0;
|
||||
width: 0;
|
||||
|
||||
@if $direction==up {
|
||||
border-bottom: $color-border-style;
|
||||
border-left: $transparent-border-style;
|
||||
border-right: $transparent-border-style;
|
||||
}
|
||||
|
||||
@else if $direction==right {
|
||||
border-left: $color-border-style;
|
||||
border-top: $transparent-border-style;
|
||||
border-bottom: $transparent-border-style;
|
||||
}
|
||||
|
||||
@else if $direction==down {
|
||||
border-top: $color-border-style;
|
||||
border-left: $transparent-border-style;
|
||||
border-right: $transparent-border-style;
|
||||
}
|
||||
|
||||
@else if $direction==left {
|
||||
border-right: $color-border-style;
|
||||
border-top: $transparent-border-style;
|
||||
border-bottom: $transparent-border-style;
|
||||
}
|
||||
}
|
||||
@mixin clearfix {
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin scrollBar {
|
||||
&::-webkit-scrollbar-track-piece {
|
||||
background: #d3dce6;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #99a9bf;
|
||||
border-radius: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin relative {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@mixin pct($pct) {
|
||||
width: #{$pct};
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@mixin triangle($width, $height, $color, $direction) {
|
||||
$width: $width/2;
|
||||
$color-border-style: $height solid $color;
|
||||
$transparent-border-style: $width solid transparent;
|
||||
height: 0;
|
||||
width: 0;
|
||||
|
||||
@if $direction==up {
|
||||
border-bottom: $color-border-style;
|
||||
border-left: $transparent-border-style;
|
||||
border-right: $transparent-border-style;
|
||||
}
|
||||
|
||||
@else if $direction==right {
|
||||
border-left: $color-border-style;
|
||||
border-top: $transparent-border-style;
|
||||
border-bottom: $transparent-border-style;
|
||||
}
|
||||
|
||||
@else if $direction==down {
|
||||
border-top: $color-border-style;
|
||||
border-left: $transparent-border-style;
|
||||
border-right: $transparent-border-style;
|
||||
}
|
||||
|
||||
@else if $direction==left {
|
||||
border-right: $color-border-style;
|
||||
border-top: $transparent-border-style;
|
||||
border-bottom: $transparent-border-style;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,209 +1,209 @@
|
||||
#app {
|
||||
|
||||
.main-container {
|
||||
min-height: 100%;
|
||||
transition: margin-left .28s;
|
||||
margin-left: $sideBarWidth;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
transition: width 0.28s;
|
||||
width: $sideBarWidth !important;
|
||||
background-color: $menuBg;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
font-size: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1001;
|
||||
overflow: hidden;
|
||||
|
||||
// reset element-ui css
|
||||
.horizontal-collapse-transition {
|
||||
transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
|
||||
}
|
||||
|
||||
.scrollbar-wrapper {
|
||||
overflow-x: hidden !important;
|
||||
}
|
||||
|
||||
.el-scrollbar__bar.is-vertical {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.el-scrollbar {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&.has-logo {
|
||||
.el-scrollbar {
|
||||
height: calc(100% - 50px);
|
||||
}
|
||||
}
|
||||
|
||||
.is-horizontal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.svg-icon {
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.el-menu {
|
||||
border: none;
|
||||
height: 100%;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
// menu hover
|
||||
.submenu-title-noDropdown,
|
||||
.el-submenu__title {
|
||||
&:hover {
|
||||
background-color: $menuHover !important;
|
||||
}
|
||||
}
|
||||
|
||||
.is-active>.el-submenu__title {
|
||||
color: $subMenuActiveText !important;
|
||||
}
|
||||
|
||||
& .nest-menu .el-submenu>.el-submenu__title,
|
||||
& .el-submenu .el-menu-item {
|
||||
min-width: $sideBarWidth !important;
|
||||
background-color: $subMenuBg !important;
|
||||
|
||||
&:hover {
|
||||
background-color: $subMenuHover !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hideSidebar {
|
||||
.sidebar-container {
|
||||
width: 54px !important;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
margin-left: 54px;
|
||||
}
|
||||
|
||||
.submenu-title-noDropdown {
|
||||
padding: 0 !important;
|
||||
position: relative;
|
||||
|
||||
.el-tooltip {
|
||||
padding: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-submenu {
|
||||
overflow: hidden;
|
||||
|
||||
&>.el-submenu__title {
|
||||
padding: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.el-submenu__icon-arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--collapse {
|
||||
.el-submenu {
|
||||
&>.el-submenu__title {
|
||||
&>span {
|
||||
height: 0;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
visibility: hidden;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--collapse .el-menu .el-submenu {
|
||||
min-width: $sideBarWidth !important;
|
||||
}
|
||||
|
||||
// mobile responsive
|
||||
.mobile {
|
||||
.main-container {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
transition: transform .28s;
|
||||
width: $sideBarWidth !important;
|
||||
}
|
||||
|
||||
&.hideSidebar {
|
||||
.sidebar-container {
|
||||
pointer-events: none;
|
||||
transition-duration: 0.3s;
|
||||
transform: translate3d(-$sideBarWidth, 0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.withoutAnimation {
|
||||
|
||||
.main-container,
|
||||
.sidebar-container {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// when menu collapsed
|
||||
.el-menu--vertical {
|
||||
&>.el-menu {
|
||||
.svg-icon {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.nest-menu .el-submenu>.el-submenu__title,
|
||||
.el-menu-item {
|
||||
&:hover {
|
||||
// you can use $subMenuHover
|
||||
background-color: $menuHover !important;
|
||||
}
|
||||
}
|
||||
|
||||
// the scroll bar appears when the subMenu is too long
|
||||
>.el-menu--popup {
|
||||
max-height: 100vh;
|
||||
overflow-y: auto;
|
||||
|
||||
&::-webkit-scrollbar-track-piece {
|
||||
background: #d3dce6;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #99a9bf;
|
||||
border-radius: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
#app {
|
||||
|
||||
.main-container {
|
||||
min-height: 100%;
|
||||
transition: margin-left .28s;
|
||||
margin-left: $sideBarWidth;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
transition: width 0.28s;
|
||||
width: $sideBarWidth !important;
|
||||
background-color: $menuBg;
|
||||
height: 100%;
|
||||
position: fixed;
|
||||
font-size: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1001;
|
||||
overflow: hidden;
|
||||
|
||||
// reset element-ui css
|
||||
.horizontal-collapse-transition {
|
||||
transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
|
||||
}
|
||||
|
||||
.scrollbar-wrapper {
|
||||
overflow-x: hidden !important;
|
||||
}
|
||||
|
||||
.el-scrollbar__bar.is-vertical {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.el-scrollbar {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
&.has-logo {
|
||||
.el-scrollbar {
|
||||
height: calc(100% - 50px);
|
||||
}
|
||||
}
|
||||
|
||||
.is-horizontal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.svg-icon {
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.el-menu {
|
||||
border: none;
|
||||
height: 100%;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
// menu hover
|
||||
.submenu-title-noDropdown,
|
||||
.el-submenu__title {
|
||||
&:hover {
|
||||
background-color: $menuHover !important;
|
||||
}
|
||||
}
|
||||
|
||||
.is-active>.el-submenu__title {
|
||||
color: $subMenuActiveText !important;
|
||||
}
|
||||
|
||||
& .nest-menu .el-submenu>.el-submenu__title,
|
||||
& .el-submenu .el-menu-item {
|
||||
min-width: $sideBarWidth !important;
|
||||
background-color: $subMenuBg !important;
|
||||
|
||||
&:hover {
|
||||
background-color: $subMenuHover !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hideSidebar {
|
||||
.sidebar-container {
|
||||
width: 54px !important;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
margin-left: 54px;
|
||||
}
|
||||
|
||||
.submenu-title-noDropdown {
|
||||
padding: 0 !important;
|
||||
position: relative;
|
||||
|
||||
.el-tooltip {
|
||||
padding: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-submenu {
|
||||
overflow: hidden;
|
||||
|
||||
&>.el-submenu__title {
|
||||
padding: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.el-submenu__icon-arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--collapse {
|
||||
.el-submenu {
|
||||
&>.el-submenu__title {
|
||||
&>span {
|
||||
height: 0;
|
||||
width: 0;
|
||||
overflow: hidden;
|
||||
visibility: hidden;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--collapse .el-menu .el-submenu {
|
||||
min-width: $sideBarWidth !important;
|
||||
}
|
||||
|
||||
// mobile responsive
|
||||
.mobile {
|
||||
.main-container {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
transition: transform .28s;
|
||||
width: $sideBarWidth !important;
|
||||
}
|
||||
|
||||
&.hideSidebar {
|
||||
.sidebar-container {
|
||||
pointer-events: none;
|
||||
transition-duration: 0.3s;
|
||||
transform: translate3d(-$sideBarWidth, 0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.withoutAnimation {
|
||||
|
||||
.main-container,
|
||||
.sidebar-container {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// when menu collapsed
|
||||
.el-menu--vertical {
|
||||
&>.el-menu {
|
||||
.svg-icon {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.nest-menu .el-submenu>.el-submenu__title,
|
||||
.el-menu-item {
|
||||
&:hover {
|
||||
// you can use $subMenuHover
|
||||
background-color: $menuHover !important;
|
||||
}
|
||||
}
|
||||
|
||||
// the scroll bar appears when the subMenu is too long
|
||||
>.el-menu--popup {
|
||||
max-height: 100vh;
|
||||
overflow-y: auto;
|
||||
|
||||
&::-webkit-scrollbar-track-piece {
|
||||
background: #d3dce6;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #99a9bf;
|
||||
border-radius: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,48 +1,48 @@
|
||||
// global transition css
|
||||
|
||||
/* fade */
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.28s;
|
||||
}
|
||||
|
||||
.fade-enter,
|
||||
.fade-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* fade-transform */
|
||||
.fade-transform-leave-active,
|
||||
.fade-transform-enter-active {
|
||||
transition: all .5s;
|
||||
}
|
||||
|
||||
.fade-transform-enter {
|
||||
opacity: 0;
|
||||
transform: translateX(-30px);
|
||||
}
|
||||
|
||||
.fade-transform-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(30px);
|
||||
}
|
||||
|
||||
/* breadcrumb transition */
|
||||
.breadcrumb-enter-active,
|
||||
.breadcrumb-leave-active {
|
||||
transition: all .5s;
|
||||
}
|
||||
|
||||
.breadcrumb-enter,
|
||||
.breadcrumb-leave-active {
|
||||
opacity: 0;
|
||||
transform: translateX(20px);
|
||||
}
|
||||
|
||||
.breadcrumb-move {
|
||||
transition: all .5s;
|
||||
}
|
||||
|
||||
.breadcrumb-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
// global transition css
|
||||
|
||||
/* fade */
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.28s;
|
||||
}
|
||||
|
||||
.fade-enter,
|
||||
.fade-leave-active {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* fade-transform */
|
||||
.fade-transform-leave-active,
|
||||
.fade-transform-enter-active {
|
||||
transition: all .5s;
|
||||
}
|
||||
|
||||
.fade-transform-enter {
|
||||
opacity: 0;
|
||||
transform: translateX(-30px);
|
||||
}
|
||||
|
||||
.fade-transform-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(30px);
|
||||
}
|
||||
|
||||
/* breadcrumb transition */
|
||||
.breadcrumb-enter-active,
|
||||
.breadcrumb-leave-active {
|
||||
transition: all .5s;
|
||||
}
|
||||
|
||||
.breadcrumb-enter,
|
||||
.breadcrumb-leave-active {
|
||||
opacity: 0;
|
||||
transform: translateX(20px);
|
||||
}
|
||||
|
||||
.breadcrumb-move {
|
||||
transition: all .5s;
|
||||
}
|
||||
|
||||
.breadcrumb-leave-active {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
@@ -1,48 +1,48 @@
|
||||
// base color
|
||||
$blue:#324157;
|
||||
$light-blue:#3A71A8;
|
||||
$red:#C03639;
|
||||
$pink: #E65D6E;
|
||||
$green: #30B08F;
|
||||
$tiffany: #4AB7BD;
|
||||
$yellow:#FEC171;
|
||||
$panGreen: #30B08F;
|
||||
|
||||
$base-logo-title-color: #ffffff;
|
||||
$base-logo-light-title-color: #001529;
|
||||
$base-menu-light-background:#ffffff;
|
||||
|
||||
// sidebar
|
||||
$menuText:#bfcbd9;
|
||||
$menuActiveText:#409EFF;
|
||||
$subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951
|
||||
|
||||
$menuBg:#304156; //https://cloud.tencent.com/developer/article/1753773
|
||||
$menuHover:#263445;
|
||||
|
||||
$base-menu-light-color:rgba(0,0,0,.70);
|
||||
|
||||
$subMenuBg:#1f2d3d;
|
||||
$subMenuHover:#001528;
|
||||
|
||||
$sideBarWidth: 205px;
|
||||
|
||||
// the :export directive is the magic sauce for webpack
|
||||
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
|
||||
:export {
|
||||
menuText: $menuText;
|
||||
menuActiveText: $menuActiveText;
|
||||
subMenuActiveText: $subMenuActiveText;
|
||||
menuBg: $menuBg;
|
||||
menuLightBackground: $base-menu-light-background;
|
||||
menuLightColor: $base-menu-light-color;
|
||||
menuHover: $menuHover;
|
||||
subMenuBg: $subMenuBg;
|
||||
subMenuHover: $subMenuHover;
|
||||
sideBarWidth: $sideBarWidth;
|
||||
|
||||
logoTitleColor: $base-logo-title-color;
|
||||
logoLightTitleColor: $base-logo-light-title-color
|
||||
}
|
||||
|
||||
$base-sidebar-width: 200px;
|
||||
// base color
|
||||
$blue:#324157;
|
||||
$light-blue:#3A71A8;
|
||||
$red:#C03639;
|
||||
$pink: #E65D6E;
|
||||
$green: #30B08F;
|
||||
$tiffany: #4AB7BD;
|
||||
$yellow:#FEC171;
|
||||
$panGreen: #30B08F;
|
||||
|
||||
$base-logo-title-color: #ffffff;
|
||||
$base-logo-light-title-color: #001529;
|
||||
$base-menu-light-background:#ffffff;
|
||||
|
||||
// sidebar
|
||||
$menuText: #ffffff;
|
||||
$menuActiveText:#409EFF;
|
||||
$subMenuActiveText: #ffffff; // https://github.com/ElemeFE/element/issues/12951
|
||||
|
||||
$menuBg: #001529; //https://cloud.tencent.com/developer/article/1753773
|
||||
$menuHover:#4e5465;
|
||||
|
||||
$base-menu-light-color:rgba(0,0,0,.70);
|
||||
|
||||
$subMenuBg:#000c17;
|
||||
$subMenuHover:#4e5465;
|
||||
|
||||
$sideBarWidth: 205px;
|
||||
|
||||
// the :export directive is the magic sauce for webpack
|
||||
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
|
||||
:export {
|
||||
menuText: $menuText;
|
||||
menuActiveText: $menuActiveText;
|
||||
subMenuActiveText: $subMenuActiveText;
|
||||
menuBg: $menuBg;
|
||||
menuLightBackground: $base-menu-light-background;
|
||||
menuLightColor: $base-menu-light-color;
|
||||
menuHover: $menuHover;
|
||||
subMenuBg: $subMenuBg;
|
||||
subMenuHover: $subMenuHover;
|
||||
sideBarWidth: $sideBarWidth;
|
||||
|
||||
logoTitleColor: $base-logo-title-color;
|
||||
logoLightTitleColor: $base-logo-light-title-color
|
||||
}
|
||||
|
||||
$base-sidebar-width: 2010px;
|
||||
|
||||
Reference in New Issue
Block a user