Merge branch 'anhui-mall-ui-test' of http://192.168.30.2:3000/bonus/bonus-ui into anhui-mall-ui-test

This commit is contained in:
zzyuan 2026-01-26 17:29:03 +08:00
commit b90a2a077b
8 changed files with 222 additions and 167 deletions

View File

@ -19,6 +19,8 @@
height: 100%; height: 100%;
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei,
Helvetica Neue, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
} }
.chromeframe { .chromeframe {
margin: 0.2em 0; margin: 0.2em 0;

BIN
src/assets/icons/noData.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

BIN
src/assets/images/com-1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
src/assets/images/com-2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -236,3 +236,32 @@ aside {
overflow: auto; overflow: auto;
padding: 20px; padding: 20px;
} }
/* el-table 空态:覆盖 Element UI 默认样式 */
.el-table__empty-block {
min-height: 200px;
display: flex;
align-items: center;
justify-content: center;
}
.el-table__empty-text {
width: auto; /* 覆盖 50% */
line-height: 1.2 !important; /* 🔥 干掉 60px 行高 */
font-size: 14px;
color: #999;
display: flex;
flex-direction: column;
align-items: center;
}
/* 空态图片 */
.el-table__empty-text::before {
content: '';
width: 208px;
height: 208px;
//margin-bottom: 16px;
background: url('~@/assets/icons/noData.png') no-repeat center;
background-size: contain;
}

View File

@ -2,7 +2,7 @@
<div> <div>
<div class="navbar"> <div class="navbar">
<div class="app-title"> <div class="app-title">
<span>{{ title }}</span> <img src="@/assets/images/logo-home.png" style="width: 135px; height: 27px" alt="" />
</div> </div>
<div class="menus" @mouseleave="handleMenuLeave"> <div class="menus" @mouseleave="handleMenuLeave">
@ -34,11 +34,17 @@
</el-tooltip> --> </el-tooltip> -->
<div class="right-menu-item hover-effect bar-item"> <div class="right-menu-item hover-effect bar-item">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABPUlEQVQ4EYWTvUoDQRSFHbezCmIZAhLs7PQJxM4U8TmsBEvbVCkCeYC8QwQrU2sjEiSNjaKkFFTQIoG4+c44F5ZlZrxw9sw95+7d+Vu3QZRleQTtA6eceANXzrmVz3hQcwmdg3dwhjeBvdHDjMXYF/zVDGsFC/IT7zP4qJnVtEnSrwqVsZoca2q56ORMvKdNm2aCGwnd5B01WFoW4Xu0u4hu0kBLuE5M8xm9ANvgIVIz9F1CwQC+AZOAEdy2zzBWk1tg0TfPnzvqFsIusHsw55w/rQi/YLwHDsAXmOLPYX8PuhR8W+vAK/gi+G3GWk49xgiF9uC17oRcTRpAy0nFqU6hpS9FQl4TpHy90vrvHqgoG2pQZirkZX01mCUa/KC/ZHy9NtMmHoJH8FvZKW1sVxWw7oAum34eC/2APflrp+zfNar0B+8AAAAASUVORK5CYII=" alt="提醒"> <img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABPUlEQVQ4EYWTvUoDQRSFHbezCmIZAhLs7PQJxM4U8TmsBEvbVCkCeYC8QwQrU2sjEiSNjaKkFFTQIoG4+c44F5ZlZrxw9sw95+7d+Vu3QZRleQTtA6eceANXzrmVz3hQcwmdg3dwhjeBvdHDjMXYF/zVDGsFC/IT7zP4qJnVtEnSrwqVsZoca2q56ORMvKdNm2aCGwnd5B01WFoW4Xu0u4hu0kBLuE5M8xm9ANvgIVIz9F1CwQC+AZOAEdy2zzBWk1tg0TfPnzvqFsIusHsw55w/rQi/YLwHDsAXmOLPYX8PuhR8W+vAK/gi+G3GWk49xgiF9uC17oRcTRpAy0nFqU6hpS9FQl4TpHy90vrvHqgoG2pQZirkZX01mCUa/KC/ZHy9NtMmHoJH8FvZKW1sVxWw7oAum34eC/2APflrp+zfNar0B+8AAAAASUVORK5CYII="
alt="提醒"
/>
</div> </div>
<div class="right-menu-item hover-effect bar-item"> <div class="right-menu-item hover-effect bar-item">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAPCAYAAADtc08vAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAADwAAAADW5XGhAAAA5klEQVQoFe3TvQ7BUBTA8atFI2kwSHyEGCwGmzcwGCS8g0RisHgJs3fgCRgkBovdxGAyMROLwVD/c28HqRrEYnCSX3PuPacnTdurFOF5Xgw7nLFCFxGpSUju70lNeqQ3bqqmochGMOZs2L5ZsMi6pAeQTGUR0iBbQ19YWe6ZWExpy0Poaa+XLFviXXRkwFfxH6DUb7wDh+94w/WD7ym9FzhRLnf0UEEdVTTRwnMsWCyxxwZ96EMyIBlDnuKEI9bYwvzvSh3Ia2iggDKSGEGftgT/dQZyKi2kkNdFU8+xTsP2+11yV/IH7VrRz1OSP24AAAAASUVORK5CYII=" alt="提醒"> <img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAPCAYAAADtc08vAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAADwAAAADW5XGhAAAA5klEQVQoFe3TvQ7BUBTA8atFI2kwSHyEGCwGmzcwGCS8g0RisHgJs3fgCRgkBovdxGAyMROLwVD/c28HqRrEYnCSX3PuPacnTdurFOF5Xgw7nLFCFxGpSUju70lNeqQ3bqqmochGMOZs2L5ZsMi6pAeQTGUR0iBbQ19YWe6ZWExpy0Poaa+XLFviXXRkwFfxH6DUb7wDh+94w/WD7ym9FzhRLnf0UEEdVTTRwnMsWCyxxwZ96EMyIBlDnuKEI9bYwvzvSh3Ia2iggDKSGEGftgT/dQZyKi2kkNdFU8+xTsP2+11yV/IH7VrRz1OSP24AAAAASUVORK5CYII="
alt="提醒"
/>
</div> </div>
<div class="right-menu-item hover-effect bar-item" @click="goCollection"> <div class="right-menu-item hover-effect bar-item" @click="goCollection">
@ -69,35 +75,27 @@
@click="goWarningDetail(item)" @click="goWarningDetail(item)"
> >
<div class="warning-icon"> <div class="warning-icon">
<img src="data:image/png;base64,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" alt="提醒"> <img
src="data:image/png;base64,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"
alt="提醒"
/>
</div> </div>
<div class="warning-content"> <div class="warning-content">
<div class="warning-main">{{ item.title }}</div> <div class="warning-main">{{ item.title }}</div>
<el-tooltip
:content="item.desc"
placement="top"
effect="dark"
>
<div class="warning-sub">
{{ item.desc }}
</div>
</el-tooltip>
</div>
<el-tooltip :content="item.desc" placement="top" effect="dark">
<div class="warning-sub">
{{ item.desc }}
</div>
</el-tooltip>
</div>
</div> </div>
<div class="warning-footer" @click="goWarning"> <div class="warning-footer" @click="goWarning"> 查看全部 </div>
查看全部
</div>
</div> </div>
<!-- 触发元素 --> <!-- 触发元素 -->
<div <div slot="reference" class="right-menu-item hover-effect bar-item" @click="goWarning">
slot="reference"
class="right-menu-item hover-effect bar-item"
@click="goWarning"
>
<el-badge :value="warningCount" :max="99" class="badge" type="danger"> <el-badge :value="warningCount" :max="99" class="badge" type="danger">
<span class="bar-text">预警</span> <span class="bar-text">预警</span>
</el-badge> </el-badge>
@ -122,142 +120,128 @@
@click="goMessageDetail(item)" @click="goMessageDetail(item)"
> >
<div class="warning-icon"> <div class="warning-icon">
<img src="data:image/png;base64,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" alt="提醒"> <img
src="data:image/png;base64,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"
alt="提醒"
/>
</div> </div>
<div class="warning-content"> <div class="warning-content">
<div class="warning-main">{{ item.title }}</div> <div class="warning-main">{{ item.title }}</div>
<el-tooltip <el-tooltip :content="item.desc" placement="top" effect="dark">
:content="item.desc"
placement="top"
effect="dark"
>
<div class="warning-sub"> <div class="warning-sub">
{{ item.desc }} {{ item.desc }}
</div> </div>
</el-tooltip> </el-tooltip>
</div> </div>
</div> </div>
<div class="warning-footer" @click="goMessage"> <div class="warning-footer" @click="goMessage"> 查看全部 </div>
查看全部
</div>
</div> </div>
<!-- 触发元素结构与预警一致 --> <!-- 触发元素结构与预警一致 -->
<div <div slot="reference" class="right-menu-item hover-effect bar-item" @click="goMessage">
slot="reference"
class="right-menu-item hover-effect bar-item"
@click="goMessage"
>
<el-badge :value="messageCount" :max="99" class="badge" type="info"> <el-badge :value="messageCount" :max="99" class="badge" type="info">
<span class="bar-text">消息</span> <span class="bar-text">消息</span>
</el-badge> </el-badge>
</div> </div>
</el-popover> </el-popover>
</template> </template>
<!-- <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">--> <!-- <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">-->
<!-- <div>--> <!-- <div>-->
<!-- <img :src="avatar" class="user-avatar" />--> <!-- <img :src="avatar" class="user-avatar" />-->
<!-- <span class="nick-name">{{ user.nickName }}</span>--> <!-- <span class="nick-name">{{ user.nickName }}</span>-->
<!-- <i class="el-icon-arrow-down" style="color: #fff"></i>--> <!-- <i class="el-icon-arrow-down" style="color: #fff"></i>-->
<!-- </div>--> <!-- </div>-->
<!-- <el-dropdown-menu slot="dropdown">--> <!-- <el-dropdown-menu slot="dropdown">-->
<!-- <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>-->
<!-- </el-dropdown-menu>--> <!-- </el-dropdown-menu>-->
<!-- </el-dropdown>--> <!-- </el-dropdown>-->
<!-- 用户信息悬浮卡片 --> <!-- 用户信息悬浮卡片 -->
<el-popover <el-popover placement="bottom-end" width="260" trigger="hover" popper-class="user-popover">
placement="bottom-end"
width="260"
trigger="hover"
popper-class="user-popover"
>
<!-- 弹框内容 --> <!-- 弹框内容 -->
<!-- 顶部蓝色区域 --> <!-- 顶部蓝色区域 -->
<div class="user-bg"> <div class="user-bg">
<div class="user-header"> <div class="user-header">
<div class="user-name">{{ user.nickName }}</div> <div class="user-name">{{ user.nickName }}</div>
<div class="user-role"> <div class="user-role">
<i aria-label="用户"></i> <i aria-label="用户"></i>
{{ dept.deptName }} {{ dept.deptName }}
</div>
<div class="user-role">{{ roles.length > 0 ? roles[0].roleName : '' }}</div>
</div> </div>
<div class="user-role">{{ roles.length > 0 ? roles[0].roleName : '' }}</div>
</div> </div>
</div>
<!-- 列表区域 -->
<!-- 列表区域 --> <div class="user-list">
<div class="user-list"> <div class="user-item">
<div class="user-item"> <i class="el-icon-mobile-phone" style="font-size: 19px; color: #000"></i>
<i class="el-icon-mobile-phone" style="font-size: 19px; color: #000;"></i> <span>手机号</span>
<span>手机号</span> <span class="right">138****8251</span>
<span class="right">138****8251</span>
</div>
<div class="user-item">
<i class="el-icon-lock" style="font-size: 19px; color: #000;"></i>
<span>修改密码</span>
</div>
<div class="user-item">
<i class="el-icon-house" style="font-size: 19px; color: #000;"></i>
<span>设置默认首页</span>
</div>
<div class="user-item" @click="downloadUserManual">
<i class="el-icon-download" style="font-size: 19px; color: #000;"></i>
<span>操作手册下载</span>
</div>
<div class="user-item">
<i class="el-icon-t-shirt" style="font-size: 19px; color: #000;"></i>
<span>一键换肤</span>
</div>
<div class="user-item" @click="clearCacheSimple">
<i class="el-icon-delete" style="font-size: 19px; color: #000;"></i>
<span>清除缓存</span>
</div>
<div class="user-item">
<i class="el-icon-data-analysis" style="font-size: 19px; color: #000;"></i>
<span>测试网络速度</span>
</div>
<div class="user-item" @click="gotoFeedback">
<i class="el-icon-edit-outline" style="font-size: 19px; color: #000;"></i>
<span>意见反馈/闭环</span>
</div>
<div class="user-item" @click="showContactDialog">
<i class="el-icon-phone-outline" style="font-size: 19px; color: #000;"></i>
<span>联系我们</span>
</div>
<div class="user-item logout" @click="logout">
<!-- <i class="el-icon-refresh-left" style="font-size: 19px; color: #000;"></i> -->
<img src="../../assets/images/loginOutIcon.png" style="width: 16px;height: 16px;margin-right: 10px;" alt="">
<span>退出</span>
</div>
</div> </div>
<div class="user-item">
<!-- 底部 --> <i class="el-icon-lock" style="font-size: 19px; color: #000"></i>
<div class="user-footer"> <span>修改密码</span>
软件名称机械化施工装备管理共享平台<br />
版本号V1.0.4
</div> </div>
<div class="user-item">
<i class="el-icon-house" style="font-size: 19px; color: #000"></i>
<span>设置默认首页</span>
</div>
<div class="user-item" @click="downloadUserManual">
<i class="el-icon-download" style="font-size: 19px; color: #000"></i>
<span>操作手册下载</span>
</div>
<div class="user-item">
<i class="el-icon-t-shirt" style="font-size: 19px; color: #000"></i>
<span>一键换肤</span>
</div>
<div class="user-item" @click="clearCacheSimple">
<i class="el-icon-delete" style="font-size: 19px; color: #000"></i>
<span>清除缓存</span>
</div>
<div class="user-item">
<i class="el-icon-data-analysis" style="font-size: 19px; color: #000"></i>
<span>测试网络速度</span>
</div>
<div class="user-item" @click="gotoFeedback">
<i class="el-icon-edit-outline" style="font-size: 19px; color: #000"></i>
<span>意见反馈/闭环</span>
</div>
<div class="user-item" @click="showContactDialog">
<i class="el-icon-phone-outline" style="font-size: 19px; color: #000"></i>
<span>联系我们</span>
</div>
<div class="user-item logout" @click="logout">
<!-- <i class="el-icon-refresh-left" style="font-size: 19px; color: #000;"></i> -->
<img
src="../../assets/images/loginOutIcon.png"
style="width: 16px; height: 16px; margin-right: 10px"
alt=""
/>
<span>退出</span>
</div>
</div>
<!-- 底部 -->
<div class="user-footer">
软件名称机械化施工装备管理共享平台<br />
版本号V1.0.4
</div>
<!-- 触发区域右上角头像+名字 --> <!-- 触发区域右上角头像+名字 -->
<div <div slot="reference" class="avatar-container right-menu-item hover-effect">
slot="reference"
class="avatar-container right-menu-item hover-effect"
>
<img :src="avatar" class="user-avatar" /> <img :src="avatar" class="user-avatar" />
<span class="nick-name">{{ user.nickName }}</span> <span class="nick-name">{{ user.nickName }}</span>
<i class="el-icon-arrow-down" style="color: #fff"></i> <i class="el-icon-arrow-down" style="color: #fff"></i>
</div> </div>
</el-popover> </el-popover>
</div> </div>
</div> </div>
<div style="height: 50px"></div> <div style="height: 50px"></div>
@ -409,7 +393,6 @@
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
@ -424,8 +407,8 @@ export default {
return { return {
title: process.env.VUE_APP_TITLE, title: process.env.VUE_APP_TITLE,
user: {}, user: {},
dept:{}, dept: {},
roles:[], roles: [],
menuList: [], menuList: [],
showMenuBox: false, showMenuBox: false,
currentMenu: {}, currentMenu: {},
@ -438,36 +421,36 @@ export default {
{ {
id: 1, id: 1,
title: '达标投产复检预警', title: '达标投产复检预警',
desc: '您所管理的今天明天后天工程已超期' desc: '您所管理的今天明天后天工程已超期',
}, },
{ {
id: 2, id: 2,
title: '达标投产复检预警', title: '达标投产复检预警',
desc: '红红火火恍恍惚惚好工程已超期' desc: '红红火火恍恍惚惚好工程已超期',
}, },
{ {
id: 3, id: 3,
title: '达标投产复检预警', title: '达标投产复检预警',
desc: '红红火火恍恍惚惚好新建工程' desc: '红红火火恍恍惚惚好新建工程',
} },
], ],
// //
messageList: [ messageList: [
{ {
id: 1, id: 1,
title: '系统通知', title: '系统通知',
desc: '您的账号于2026-01-25 10:00完成登录请注意账号安全' desc: '您的账号于2026-01-25 10:00完成登录请注意账号安全',
}, },
{ {
id: 2, id: 2,
title: '业务提醒', title: '业务提醒',
desc: '手塘-北三110kV工程已完成验收可前往查看报告' desc: '手塘-北三110kV工程已完成验收可前往查看报告',
}, },
{ {
id: 3, id: 3,
title: '待办提醒', title: '待办提醒',
desc: '您有5条待办事项未处理预计截止时间2026-01-30' desc: '您有5条待办事项未处理预计截止时间2026-01-30',
} },
], ],
contactDialogVisible: false, // contactDialogVisible: false, //
contactPhone: '田经理15212781264刘经理19855530627', // contactPhone: '田经理15212781264刘经理19855530627', //
@ -496,16 +479,17 @@ export default {
created() { created() {
this.getUser() this.getUser()
this.menuList = this.sidebarRouters.filter((route) => !route.hidden && route.path !== '/') this.menuList = this.sidebarRouters.filter((route) => !route.hidden && route.path !== '/')
this.menuList = this.menuList.slice(1)
console.log('🚀 ~ this.menuList:', this.menuList) console.log('🚀 ~ this.menuList:', this.menuList)
}, },
methods: { methods: {
goWarningDetail(item) { goWarningDetail(item) {
this.$refs.warningPopover.doClose(); // this.$refs.warningPopover.doClose() //
// this.$router.push({ path: '/warning/detail', query: { id: item.id } }); // this.$router.push({ path: '/warning/detail', query: { id: item.id } });
}, },
// /- // /-
goWarning() { goWarning() {
this.$refs.warningPopover.doClose(); this.$refs.warningPopover.doClose()
// this.$router.push({ path: '/warning/list' }); // this.$router.push({ path: '/warning/list' });
}, },
// - // -
@ -522,40 +506,39 @@ export default {
this.$router.push({ path: item.url }) this.$router.push({ path: item.url })
}, },
goMessageDetail(item) { goMessageDetail(item) {
this.$refs.messagePopover.doClose(); // this.$refs.messagePopover.doClose() //
// this.$router.push({ path: '/message/detail', query: { id: item.id } }); // // this.$router.push({ path: '/message/detail', query: { id: item.id } }); //
}, },
goMessage() { goMessage() {
this.$refs.messagePopover.doClose(); // this.$refs.messagePopover.doClose() //
// this.$router.push({ path: '/message' }); // // this.$router.push({ path: '/message' }); //
}, },
gotoFeedback(){ gotoFeedback() {
this.$router.push({ path: '/feedback' }) this.$router.push({ path: '/feedback' })
}, },
getUser() { getUser() {
getUserProfile().then((response) => { getUserProfile().then((response) => {
console.log("用户信息", response.data); console.log('用户信息', response.data)
this.user = response.data this.user = response.data
this.dept=response.data.dept this.dept = response.data.dept
this.roles=response.data.roles this.roles = response.data.roles
}) })
}, },
downloadUserManual() { downloadUserManual() {
this.download('material-mall/todo/downLoadUserManual', { this.download('material-mall/todo/downLoadUserManual', {}, `机械化施工装备管理共享平台操作手册V1.0.pdf`)
}, `机械化施工装备管理共享平台操作手册V1.0.pdf`)
}, },
clearCacheSimple() { clearCacheSimple() {
// //
localStorage.clear(); localStorage.clear()
sessionStorage.clear(); sessionStorage.clear()
this.$message.success('缓存清除成功!'); this.$message.success('缓存清除成功!')
setTimeout(() => location.reload(), 1000); setTimeout(() => location.reload(), 1000)
}, },
showContactDialog() { showContactDialog() {
this.contactDialogVisible = true; this.contactDialogVisible = true
}, },
handleContactConfirm() { handleContactConfirm() {
this.contactDialogVisible = false; this.contactDialogVisible = false
}, },
async logout() { async logout() {
this.$store.dispatch('LogOut').then((res) => { this.$store.dispatch('LogOut').then((res) => {
@ -709,13 +692,13 @@ export default {
box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
background: linear-gradient(90deg, #00d2be 0%, #4eacff 100%); background: linear-gradient(90deg, #00d2be 0%, #4eacff 100%);
z-index: 10; z-index: 10;
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei,
Helvetica Neue, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
.app-title { .app-title {
width: 314px; width: 314px;
height: 50px; height: 50px;
padding-left: 14px; padding-left: 30px;
// font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;
color: #fff; color: #fff;
@ -1036,7 +1019,7 @@ export default {
.warning-footer { .warning-footer {
text-align: center; text-align: center;
padding: 8px; padding: 8px;
color: #50C7BD; color: #50c7bd;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
@ -1070,7 +1053,7 @@ export default {
/* 顶部渐变 */ /* 顶部渐变 */
.user-header { .user-header {
background-image: url("../../assets/images/user-bg.png"); background-image: url('../../assets/images/user-bg.png');
padding: 15px; padding: 15px;
color: #fff; color: #fff;
background-size: 100% 100%; background-size: 100% 100%;
@ -1155,7 +1138,7 @@ export default {
.contact-title { .contact-title {
display: block; display: block;
overflow: hidden; overflow: hidden;
color: rgba(0, 0, 0, .85); color: rgba(0, 0, 0, 0.85);
font-weight: 500; font-weight: 500;
font-size: 16px; font-size: 16px;
line-height: 1.4; line-height: 1.4;
@ -1163,7 +1146,7 @@ export default {
.contact-phone { .contact-phone {
margin-left: 34px; margin-left: 34px;
color: rgba(0, 0, 0, .65); color: rgba(0, 0, 0, 0.65);
font-size: 14px; font-size: 14px;
} }
} }
@ -1186,6 +1169,4 @@ export default {
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
} }
} }
</style> </style>

View File

@ -2,7 +2,7 @@
<div class="warp"> <div class="warp">
<div class="box-card"> <div class="box-card">
<div id="tags-view-container" class="tags-view-container"> <div id="tags-view-container" class="tags-view-container">
<scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll"> <scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll" v-show="!isIndex">
<router-link <router-link
v-for="tag in visitedViews" v-for="tag in visitedViews"
ref="tag" ref="tag"
@ -23,6 +23,12 @@
<span v-if="!isAffix(tag)" class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" /> <span v-if="!isAffix(tag)" class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" />
</router-link> </router-link>
</scroll-pane> </scroll-pane>
<div v-show="isIndex" class="tags-view-wrapper">
<span class="tags-view-item" v-if="visitedViews.length > 2" @click="goBack">
<i class="el-icon-arrow-left back-icon" />
返回功能页
</span>
</div>
<div class="right-tag-fixed"> <div class="right-tag-fixed">
<div class="line" /> <div class="line" />
<i class="el-icon-arrow-down right-icon" @click.stop="toggleDropDown" /> <i class="el-icon-arrow-down right-icon" @click.stop="toggleDropDown" />
@ -51,6 +57,13 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="center-box" v-show="isIndex">
<span class="com">
<img src="@/assets/images/com-1.png" style="width: 16px; height: 16px" alt="" />
<span>综合看板</span>
<img src="@/assets/images/com-2.png" style="width: 16px; height: 16px" alt="" />
</span>
</div>
<div style="height: 40px"></div> <div style="height: 40px"></div>
</div> </div>
</template> </template>
@ -86,6 +99,9 @@ export default {
theme() { theme() {
return this.$store.state.settings.theme return this.$store.state.settings.theme
}, },
isIndex() {
return this.$route.path === '/index'
},
}, },
watch: { watch: {
$route() { $route() {
@ -109,6 +125,9 @@ export default {
document.removeEventListener('click', this.handleClickOutside) document.removeEventListener('click', this.handleClickOutside)
}, },
methods: { methods: {
goBack() {
this.$router.go(-1)
},
toggleDropDown() { toggleDropDown() {
this.showDropDown = !this.showDropDown this.showDropDown = !this.showDropDown
}, },
@ -344,6 +363,30 @@ export default {
background: linear-gradient(90deg, #00d2be 0%, #4eacff 100%); background: linear-gradient(90deg, #00d2be 0%, #4eacff 100%);
box-sizing: border-box; box-sizing: border-box;
} }
.center-box {
position: absolute;
top: 70px;
left: 50%;
z-index: 11;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
pointer-events: none; /* 可选:不挡点击 */
.com {
width: 135px;
height: 32px;
color: #fff;
background-image: linear-gradient(180deg, #08c6a9, #13e0c0);
font-weight: 700;
display: flex;
align-items: center;
justify-content: space-around;
border-radius: 4px;
cursor: pointer;
}
}
.tags-view-container { .tags-view-container {
position: fixed; position: fixed;
height: 40px; height: 40px;
@ -362,7 +405,7 @@ export default {
cursor: pointer; cursor: pointer;
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
color: #808080; color: rgba(0, 0, 0, 0.65);
background: #fff; background: #fff;
padding: 0 8px; padding: 0 8px;
font-size: 14px; font-size: 14px;