@@ -121,7 +121,7 @@ aside { | |||||
//main-container全局样式 | //main-container全局样式 | ||||
.app-container { | .app-container { | ||||
padding: 20px; | |||||
padding: 16px; | |||||
} | } | ||||
.components-container { | .components-container { | ||||
@@ -129,10 +129,6 @@ aside { | |||||
position: relative; | position: relative; | ||||
} | } | ||||
.pagination-container { | |||||
margin-top: 30px; | |||||
} | |||||
.text-center { | .text-center { | ||||
text-align: center | text-align: center | ||||
} | } | ||||
@@ -112,13 +112,13 @@ | |||||
} | } | ||||
/** 表格布局 **/ | /** 表格布局 **/ | ||||
.pagination-container { | |||||
position: relative; | |||||
height: 25px; | |||||
margin-bottom: 10px; | |||||
margin-top: 15px; | |||||
padding: 10px 20px !important; | |||||
} | |||||
// .pagination-container { | |||||
// position: relative; | |||||
// height: 25px; | |||||
// margin-bottom: 10px; | |||||
// margin-top: 15px; | |||||
// padding: 10px 20px !important; | |||||
// } | |||||
/* tree border */ | /* tree border */ | ||||
.tree-border { | .tree-border { | ||||
@@ -105,6 +105,10 @@ | |||||
background-color: $base-sub-menu-hover !important; | background-color: $base-sub-menu-hover !important; | ||||
} | } | ||||
} | } | ||||
& .theme-dark .el-submenu .el-menu-item.is-active { | |||||
background-color: #0b50ff !important; | |||||
} | |||||
} | } | ||||
.hideSidebar { | .hideSidebar { | ||||
@@ -9,20 +9,20 @@ $yellow:#FEC171; | |||||
$panGreen: #30B08F; | $panGreen: #30B08F; | ||||
// 默认菜单主题风格 | // 默认菜单主题风格 | ||||
$base-menu-color:#bfcbd9; | |||||
$base-menu-color-active:#f4f4f5; | |||||
$base-menu-background:#304156; | |||||
$base-logo-title-color: #ffffff; | |||||
// $base-menu-color:#bfcbd9; | |||||
// $base-menu-color-active:#f4f4f5; | |||||
// $base-menu-background:#304156; | |||||
// $base-logo-title-color: #ffffff; | |||||
$base-menu-light-color:rgba(0,0,0,.70); | |||||
$base-menu-light-background:#ffffff; | |||||
$base-logo-light-title-color: #001529; | |||||
// $base-menu-light-color:rgba(0,0,0,.70); | |||||
// $base-menu-light-background:#ffffff; | |||||
// $base-logo-light-title-color: #001529; | |||||
$base-sub-menu-background:#1f2d3d; | |||||
$base-sub-menu-hover:#001528; | |||||
// $base-sub-menu-background:#1f2d3d; | |||||
// $base-sub-menu-hover:#001528; | |||||
// 自定义暗色菜单风格 | // 自定义暗色菜单风格 | ||||
/** | |||||
/* | |||||
$base-menu-color:hsla(0,0%,100%,.65); | $base-menu-color:hsla(0,0%,100%,.65); | ||||
$base-menu-color-active:#fff; | $base-menu-color-active:#fff; | ||||
$base-menu-background:#001529; | $base-menu-background:#001529; | ||||
@@ -35,8 +35,20 @@ $base-logo-light-title-color: #001529; | |||||
$base-sub-menu-background:#000c17; | $base-sub-menu-background:#000c17; | ||||
$base-sub-menu-hover:#001528; | $base-sub-menu-hover:#001528; | ||||
*/ | */ | ||||
$base-menu-color: #fff; | |||||
$base-menu-color-active:#fff; | |||||
$base-menu-background:#001529; | |||||
$base-logo-title-color: #ffffff; | |||||
$base-menu-light-color:rgba(0,0,0,.70); | |||||
$base-menu-light-background:#ffffff; | |||||
$base-logo-light-title-color: #001529; | |||||
$base-sub-menu-background:#0B253F; | |||||
$base-sub-menu-hover:#0b50ff; | |||||
$base-sidebar-width: 280px; | |||||
$base-sidebar-width: 248px; | |||||
// the :export directive is the magic sauce for webpack | // the :export directive is the magic sauce for webpack | ||||
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass | // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass | ||||
@@ -68,8 +68,12 @@ export default { | |||||
margin-left: 8px; | margin-left: 8px; | ||||
.no-redirect { | .no-redirect { | ||||
color: #97a8be; | |||||
color: rgba(0, 0, 0, 0.65); | |||||
cursor: text; | cursor: text; | ||||
} | } | ||||
} | } | ||||
.app-breadcrumb .el-breadcrumb__inner a, .el-breadcrumb__inner.is-link { | |||||
color: rgba(0, 0, 0, 0.45); | |||||
} | |||||
</style> | </style> |
@@ -28,11 +28,14 @@ export default { | |||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
.app-main { | .app-main { | ||||
/* 50= navbar 50 */ | |||||
/* 48= navbar 48 */ | |||||
min-height: calc(100vh - 56px); | min-height: calc(100vh - 56px); | ||||
width: 100%; | |||||
min-width: calc(100vh - 280px); | |||||
position: relative; | position: relative; | ||||
overflow: hidden; | overflow: hidden; | ||||
margin: 8px 14px 0px 16px; | |||||
border-radius: 8px; | |||||
background-color: #fff; | |||||
} | } | ||||
.fixed-header + .app-main { | .fixed-header + .app-main { | ||||
@@ -41,8 +44,8 @@ export default { | |||||
.hasTagsView { | .hasTagsView { | ||||
.app-main { | .app-main { | ||||
/* 84 = navbar + tags-view = 56 + 34 */ | |||||
min-height: calc(100vh - 128px); | |||||
/* 84 = navbar + tags-view = 50 + 34 */ | |||||
min-height: calc(100vh - 120px - 8px); | |||||
} | } | ||||
.fixed-header + .app-main { | .fixed-header + .app-main { | ||||
@@ -7,16 +7,16 @@ | |||||
<div class="right-menu"> | <div class="right-menu"> | ||||
<template v-if="device!=='mobile'"> | <template v-if="device!=='mobile'"> | ||||
<search id="header-search" class="right-menu-item" /> | |||||
<!-- <search id="header-search" class="right-menu-item" /> --> | |||||
<!-- 站内信 --> | <!-- 站内信 --> | ||||
<!-- <notify-message class="right-menu-item hover-effect" /> --> | <!-- <notify-message class="right-menu-item hover-effect" /> --> | ||||
<screenfull id="screenfull" class="right-menu-item hover-effect" /> | |||||
<!-- <screenfull id="screenfull" class="right-menu-item hover-effect" /> --> | |||||
<el-tooltip content="布局大小" effect="dark" placement="bottom"> | |||||
<!-- <el-tooltip content="布局大小" effect="dark" placement="bottom"> | |||||
<size-select id="size-select" class="right-menu-item hover-effect" /> | <size-select id="size-select" class="right-menu-item hover-effect" /> | ||||
</el-tooltip> | |||||
</el-tooltip> --> | |||||
</template> | </template> | ||||
@@ -30,9 +30,9 @@ | |||||
<router-link to="/user/profile"> | <router-link to="/user/profile"> | ||||
<el-dropdown-item>个人中心</el-dropdown-item> | <el-dropdown-item>个人中心</el-dropdown-item> | ||||
</router-link> | </router-link> | ||||
<el-dropdown-item @click.native="setting = true"> | |||||
<!-- <el-dropdown-item @click.native="setting = true"> | |||||
<span>布局设置</span> | <span>布局设置</span> | ||||
</el-dropdown-item> | |||||
</el-dropdown-item> --> | |||||
<el-dropdown-item divided @click.native="logout"> | <el-dropdown-item divided @click.native="logout"> | ||||
<span>退出登录</span> | <span>退出登录</span> | ||||
</el-dropdown-item> | </el-dropdown-item> | ||||
@@ -104,7 +104,7 @@ export default { | |||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
.navbar { | .navbar { | ||||
height: 56px; | |||||
height: 48px; // 56 | |||||
overflow: hidden; | overflow: hidden; | ||||
position: relative; | position: relative; | ||||
background: #fff; | background: #fff; | ||||
@@ -23,7 +23,7 @@ | |||||
: variables.menuLightColor | : variables.menuLightColor | ||||
" | " | ||||
:unique-opened="true" | :unique-opened="true" | ||||
:active-text-color="settings.theme" | |||||
active-text-color="#fff" | |||||
:collapse-transition="false" | :collapse-transition="false" | ||||
mode="vertical"> | mode="vertical"> | ||||
<!-- 根据 sidebarRouters 路由,生成菜单 --> | <!-- 根据 sidebarRouters 路由,生成菜单 --> | ||||
@@ -78,8 +78,8 @@ export default { | |||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
.scroll-container { | .scroll-container { | ||||
background: #f9f9f9; | |||||
box-shadow: inset 0 0 8px 1px #e8e8e8; | |||||
// background: #f9f9f9; | |||||
// box-shadow: inset 0 0 8px 1px #e8e8e8; | |||||
white-space: nowrap; | white-space: nowrap; | ||||
position: relative; | position: relative; | ||||
overflow: hidden; | overflow: hidden; | ||||
@@ -259,7 +259,7 @@ export default { | |||||
height: 42px; | height: 42px; | ||||
width: 100%; | width: 100%; | ||||
background: #fff; | background: #fff; | ||||
border-bottom: 1px solid #d8dce5; | |||||
// border-bottom: 1px solid #d8dce5; | |||||
border-top: 1px solid #d8dce5; | border-top: 1px solid #d8dce5; | ||||
// box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04); | // box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04); | ||||
@@ -270,17 +270,16 @@ export default { | |||||
cursor: pointer; | cursor: pointer; | ||||
height: 28px; | height: 28px; | ||||
line-height: 28px; | line-height: 28px; | ||||
border: 1px solid #d8dce5; | |||||
color: #495060; | |||||
background: #fff; | |||||
color: rgba(0, 0, 0, 0.45); | |||||
background: #F4F4F4FF; | |||||
padding: 0 8px 0 12px; | padding: 0 8px 0 12px; | ||||
font-size: 14px; | font-size: 14px; | ||||
letter-spacing: 1px; | letter-spacing: 1px; | ||||
margin-left: 4px; | |||||
border-radius: 0; | |||||
margin-left: 8px; | |||||
border-radius: 4px; | |||||
&:first-of-type { | &:first-of-type { | ||||
margin-left: 15px; | |||||
margin-left: 32px; | |||||
padding-right: 12px; | padding-right: 12px; | ||||
} | } | ||||
@@ -8,7 +8,7 @@ | |||||
<tags-view v-if="needTagsView" /> | <tags-view v-if="needTagsView" /> | ||||
</div> | </div> | ||||
<app-main /> | <app-main /> | ||||
<div class="main-footer" style="color: #777; border-top: 1px solid #eee; user-select: none; font-size: 14px; letter-spacing: 1px; height: 30px; display: grid; place-content: center;">© 中建材智能自动化院 2023</div> | |||||
<div class="main-footer" style="color: #C7C7C7; user-select: none; font-size: 14px; letter-spacing: 1px; height: 30px; display: grid; place-content: center;">© 中建材智能自动化研究院有限公司</div> | |||||
<right-panel> | <right-panel> | ||||
<settings /> | <settings /> | ||||
</right-panel> | </right-panel> | ||||
@@ -2,7 +2,7 @@ $editorTabsborderColor: #121315; | |||||
body, html{ | body, html{ | ||||
margin: 0; | margin: 0; | ||||
padding: 0; | padding: 0; | ||||
background: #fff; | |||||
background: #F2F4F9; | |||||
-moz-osx-font-smoothing: grayscale; | -moz-osx-font-smoothing: grayscale; | ||||
-webkit-font-smoothing: antialiased; | -webkit-font-smoothing: antialiased; | ||||
text-rendering: optimizeLegibility; | text-rendering: optimizeLegibility; | ||||
@@ -138,4 +138,41 @@ input, textarea{ | |||||
} | } | ||||
.el-upload__tip{ | .el-upload__tip{ | ||||
line-height: 1.2; | line-height: 1.2; | ||||
} | |||||
// 滚动条 | |||||
::-webkit-scrollbar { | |||||
width: 8px; | |||||
height: 8px; | |||||
background-color: transparent; | |||||
} | |||||
::-webkit-scrollbar-track-piece { | |||||
background-color:rgba(144,147,153,0); | |||||
} | |||||
::-webkit-scrollbar-corner { | |||||
background-color:rgba(144,147,153,0); | |||||
} | |||||
::-webkit-scrollbar-track { | |||||
width: 6px; | |||||
background: rgba(144,147,153,0); | |||||
-webkit-border-radius: 2em; | |||||
-moz-border-radius: 2em; | |||||
border-radius: 2em; | |||||
} | |||||
::-webkit-scrollbar-thumb { | |||||
background-color: rgba(144,147,153,.5); | |||||
background-clip: padding-box; | |||||
min-height: 28px; | |||||
-webkit-border-radius: 2em; | |||||
-moz-border-radius: 2em; | |||||
border-radius: 2em; | |||||
transition: background-color .3s; | |||||
cursor: pointer; | |||||
} | |||||
::-webkit-scrollbar-thumb:hover { | |||||
background-color: rgba(144,147,153,.3); | |||||
} | } |
@@ -1,5 +1,5 @@ | |||||
import axios from 'axios' | import axios from 'axios' | ||||
import {Message, MessageBox, Notification} from 'element-ui' | |||||
import {Message, MessageBox, Notification, Loading} from 'element-ui' | |||||
import store from '@/store' | import store from '@/store' | ||||
import {getAccessToken, getRefreshToken, getTenantId, setToken} from '@/utils/auth' | import {getAccessToken, getRefreshToken, getTenantId, setToken} from '@/utils/auth' | ||||
import errorCode from '@/utils/errorCode' | import errorCode from '@/utils/errorCode' | ||||
@@ -30,8 +30,44 @@ const service = axios.create({ | |||||
// 禁用 Cookie 等信息 | // 禁用 Cookie 等信息 | ||||
withCredentials: false, | withCredentials: false, | ||||
}) | }) | ||||
/* | |||||
当页面有两个接口时,第一个接口loading的close事件会直接将第二个接口的loading实例也close | |||||
每次创建Loading实例的时候判断当前是否存在,如果当前还没有Loading实例就创建一个, | |||||
如果有就不会再创建而是计数;每次关闭的时候判断当前的计数, | |||||
如果是0了就关闭,否则也计数减一,直到为0的时候表示当前所有页面所有接口都返回结束了, | |||||
此时执行关闭Loading.close()操作 | |||||
*/ | |||||
let loadingInstance = null | |||||
function startLoading() { | |||||
loadingInstance = Loading.service({ | |||||
fullscreen: false, | |||||
text: '拼命加载中...', | |||||
background: 'rgba(0, 0, 0, 0.1)' | |||||
}) | |||||
} | |||||
function endLoading() { | |||||
loadingInstance.close() | |||||
} | |||||
let needLoadingRequestCount = 0 | |||||
function showFullScreenLoading() { | |||||
if (needLoadingRequestCount === 0) { | |||||
startLoading() | |||||
} | |||||
needLoadingRequestCount++ | |||||
} | |||||
function tryHideFullScreenLoading() { | |||||
if (needLoadingRequestCount <= 0) return | |||||
needLoadingRequestCount-- | |||||
if (needLoadingRequestCount === 0) { | |||||
endLoading() | |||||
} | |||||
} | |||||
// request拦截器 | // request拦截器 | ||||
service.interceptors.request.use(config => { | service.interceptors.request.use(config => { | ||||
showFullScreenLoading() | |||||
// 是否需要设置 token | // 是否需要设置 token | ||||
const isToken = (config.headers || {}).isToken === false | const isToken = (config.headers || {}).isToken === false | ||||
if (getAccessToken() && !isToken) { | if (getAccessToken() && !isToken) { | ||||
@@ -68,12 +104,14 @@ service.interceptors.request.use(config => { | |||||
} | } | ||||
return config | return config | ||||
}, error => { | }, error => { | ||||
tryHideFullScreenLoading() | |||||
console.log(error) | console.log(error) | ||||
Promise.reject(error) | Promise.reject(error) | ||||
}) | }) | ||||
// 响应拦截器 | // 响应拦截器 | ||||
service.interceptors.response.use(async res => { | service.interceptors.response.use(async res => { | ||||
tryHideFullScreenLoading() | |||||
// 未设置状态码则默认成功状态 | // 未设置状态码则默认成功状态 | ||||
const code = res.data.code || 200; | const code = res.data.code || 200; | ||||
// 获取错误信息 | // 获取错误信息 | ||||
@@ -151,6 +189,7 @@ service.interceptors.response.use(async res => { | |||||
return res.data | return res.data | ||||
} | } | ||||
}, error => { | }, error => { | ||||
tryHideFullScreenLoading() | |||||
console.log('err' + error) | console.log('err' + error) | ||||
let {message} = error; | let {message} = error; | ||||
if (message === "Network Error") { | if (message === "Network Error") { | ||||
@@ -76,20 +76,6 @@ const tableProps = [ | |||||
label: '备注' | label: '备注' | ||||
} | } | ||||
] | ] | ||||
const tableBtn = [ | |||||
{ | |||||
type: 'edit', | |||||
btnName: '编辑' | |||||
}, | |||||
{ | |||||
type: 'cancel', | |||||
btnName: '作废' | |||||
}, | |||||
{ | |||||
type: 'delete', | |||||
btnName: '删除' | |||||
} | |||||
] | |||||
export default { | export default { | ||||
name: "GroupClass", | name: "GroupClass", | ||||
components: { GroupClassAdd }, | components: { GroupClassAdd }, | ||||
@@ -120,8 +106,25 @@ export default { | |||||
} | } | ||||
], | ], | ||||
tableProps, | tableProps, | ||||
tableBtn, | |||||
tableH: this.tableHeight(275), | |||||
tableBtn: [ | |||||
this.$auth.hasPermi('base:group-classes:update') | |||||
? { | |||||
type: 'edit', | |||||
btnName: '编辑' | |||||
} | |||||
: undefined, | |||||
{ | |||||
type: 'cancel', | |||||
btnName: '作废' | |||||
}, | |||||
this.$auth.hasPermi('base:group-classes:delete') | |||||
? { | |||||
type: 'delete', | |||||
btnName: '删除' | |||||
} | |||||
: undefined | |||||
].filter((v) => v), | |||||
tableH: this.tableHeight(260), | |||||
// 总条数 | // 总条数 | ||||
total: 0, | total: 0, | ||||
// 班次基础信息列表 | // 班次基础信息列表 | ||||
@@ -140,7 +143,7 @@ export default { | |||||
}, | }, | ||||
created() { | created() { | ||||
window.addEventListener('resize', () => { | window.addEventListener('resize', () => { | ||||
this.tableH = this.tableHeight(275) | |||||
this.tableH = this.tableHeight(260) | |||||
}) | }) | ||||
this.getList() | this.getList() | ||||
}, | }, | ||||
@@ -79,16 +79,6 @@ const tableProps = [ | |||||
subcomponent: StatusBtn | subcomponent: StatusBtn | ||||
} | } | ||||
] | ] | ||||
const tableBtn = [ | |||||
{ | |||||
type: 'edit', | |||||
btnName: '编辑' | |||||
}, | |||||
{ | |||||
type: 'delete', | |||||
btnName: '删除' | |||||
} | |||||
] | |||||
export default { | export default { | ||||
name: "GroupTeam", | name: "GroupTeam", | ||||
components: { GroupTeamAdd }, | components: { GroupTeamAdd }, | ||||
@@ -125,8 +115,21 @@ export default { | |||||
} | } | ||||
], | ], | ||||
tableProps, | tableProps, | ||||
tableBtn, | |||||
tableH: this.tableHeight(275), | |||||
tableBtn: [ | |||||
this.$auth.hasPermi('base:group-team:update') | |||||
? { | |||||
type: 'edit', | |||||
btnName: '编辑' | |||||
} | |||||
: undefined, | |||||
this.$auth.hasPermi('base:group-team:delete') | |||||
? { | |||||
type: 'delete', | |||||
btnName: '删除' | |||||
} | |||||
: undefined | |||||
].filter((v) => v), | |||||
tableH: this.tableHeight(260), | |||||
// 总条数 | // 总条数 | ||||
total: 0, | total: 0, | ||||
// 班次基础信息列表 | // 班次基础信息列表 | ||||
@@ -146,7 +149,7 @@ export default { | |||||
}, | }, | ||||
created() { | created() { | ||||
window.addEventListener('resize', () => { | window.addEventListener('resize', () => { | ||||
this.tableH = this.tableHeight(275) | |||||
this.tableH = this.tableHeight(260) | |||||
}) | }) | ||||
this.getList(); | this.getList(); | ||||
}, | }, | ||||