|
@@ -1,228 +1,258 @@
|
|
|
<template>
|
|
|
<div class="navbar">
|
|
|
- <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
|
|
+ <hamburger
|
|
|
+ :is-active="sidebar.opened"
|
|
|
+ class="hamburger-container"
|
|
|
+ @toggleClick="toggleSideBar"
|
|
|
+ />
|
|
|
|
|
|
<breadcrumb class="breadcrumb-container" v-if="showBreadcrumb" />
|
|
|
|
|
|
<!-- <NavMenu class="navmenu" /> -->
|
|
|
|
|
|
<div class="right-menu">
|
|
|
-
|
|
|
<div class="right-menu-item hover-effect">
|
|
|
<el-tooltip effect="dark" content="工程机登录" placement="bottom">
|
|
|
- <i class="el-icon-s-platform" style="font-size: 24px; line-height: 50px;" @click="toEngine"></i>
|
|
|
+ <i
|
|
|
+ class="el-icon-s-platform"
|
|
|
+ style="font-size: 24px; line-height: 50px"
|
|
|
+ @click="toEngine"
|
|
|
+ ></i>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
|
|
|
- <el-badge :value="noticeCount" :max="10" :hidden="!noticeVisible" class="right-menu-item hover-effect">
|
|
|
+ <el-badge
|
|
|
+ :value="noticeCount"
|
|
|
+ :max="10"
|
|
|
+ :hidden="!noticeVisible"
|
|
|
+ class="right-menu-item hover-effect"
|
|
|
+ >
|
|
|
<el-tooltip effect="dark" content="系统消息" placement="bottom">
|
|
|
- <i class="el-icon-message-solid" @click="goNotice" style="font-size: 24px; line-height: 50px;"></i>
|
|
|
+ <i
|
|
|
+ class="el-icon-message-solid"
|
|
|
+ @click="goNotice"
|
|
|
+ style="font-size: 24px; line-height: 50px"
|
|
|
+ ></i>
|
|
|
</el-tooltip>
|
|
|
<!-- <el-button icon="el-icon-message-solid" type="text" class="notice-icon" @click="goNotice"></el-button> -->
|
|
|
</el-badge>
|
|
|
- <template v-if="device!=='mobile'">
|
|
|
+ <template v-if="device !== 'mobile'">
|
|
|
<screenfull id="screenfull" class="right-menu-item hover-effect" />
|
|
|
</template>
|
|
|
|
|
|
<el-dropdown class="user-container" trigger="click">
|
|
|
<div class="user right-menu-item hover-effect">
|
|
|
<i class="el-icon-user-solid"></i>
|
|
|
- <span>{{name}}</span>
|
|
|
+ <span>{{ name }}</span>
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown" class="user-dropdown">
|
|
|
<router-link to="/setting/personal">
|
|
|
<el-dropdown-item>个人信息</el-dropdown-item>
|
|
|
</router-link>
|
|
|
<el-dropdown-item divided @click.native="logout">
|
|
|
- <span style="display:block;">退出登录</span>
|
|
|
+ <span style="display: block">退出登录</span>
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
|
</div>
|
|
|
|
|
|
- <el-dialog title="绑定工程机系统" :visible.sync="dialogFormVisible" :modal="false" width="30%">
|
|
|
+ <el-dialog
|
|
|
+ title="绑定工程机系统"
|
|
|
+ :visible.sync="dialogFormVisible"
|
|
|
+ :modal="false"
|
|
|
+ width="30%"
|
|
|
+ >
|
|
|
<el-form ref="engineForm" :model="engineForm" :rules="engineFormRules">
|
|
|
<el-form-item label="账号" :label-width="formLabelWidth" prop="account">
|
|
|
- <el-input v-model="engineForm.account" placeholder="请输入账号" autocomplete="off"></el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="engineForm.account"
|
|
|
+ placeholder="请输入账号"
|
|
|
+ autocomplete="off"
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="密码" :label-width="formLabelWidth" prop="password">
|
|
|
- <el-input v-model="engineForm.password" placeholder="请输入密码" autocomplete="off" show-password></el-input>
|
|
|
+ <el-form-item
|
|
|
+ label="密码"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ prop="password"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="engineForm.password"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ autocomplete="off"
|
|
|
+ show-password
|
|
|
+ ></el-input>
|
|
|
</el-form-item>
|
|
|
- <input type="hidden" value="zfire" name="vcode" >
|
|
|
+ <input type="hidden" value="zfire" name="vcode" />
|
|
|
</el-form>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
-<!-- <form v-show="false" :action="userInfo.enginSysUrl" method="POST">-->
|
|
|
-<!-- <input type="hidden" :value="userInfo.enginUserName" name="username" />-->
|
|
|
-<!-- <input type="hidden" :value="userInfo.enginPassword" name="password" />-->
|
|
|
-<!-- <input type="hidden" value="zfire" name="vcode" >-->
|
|
|
-<!-- <input type="submit" ref="engineSubmit">-->
|
|
|
-<!-- </form>-->
|
|
|
+ <!-- <form v-show="false" :action="userInfo.enginSysUrl" method="POST">-->
|
|
|
+ <!-- <input type="hidden" :value="userInfo.enginUserName" name="username" />-->
|
|
|
+ <!-- <input type="hidden" :value="userInfo.enginPassword" name="password" />-->
|
|
|
+ <!-- <input type="hidden" value="zfire" name="vcode" >-->
|
|
|
+ <!-- <input type="submit" ref="engineSubmit">-->
|
|
|
+ <!-- </form>-->
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { mapGetters } from 'vuex'
|
|
|
-import Breadcrumb from '@/components/Breadcrumb'
|
|
|
-import Hamburger from '@/components/Hamburger'
|
|
|
-import Screenfull from '@/components/Screenfull'
|
|
|
-import NavMenu from '@/components/NavMenu'
|
|
|
-import {getNoticeListCount} from "@/api/notice";
|
|
|
-import { checkEngineAccount, bindEngineAccount } from '@/api/setting'
|
|
|
-import request from '@/utils/request'
|
|
|
+import { mapGetters } from "vuex";
|
|
|
+import Breadcrumb from "@/components/Breadcrumb";
|
|
|
+import Hamburger from "@/components/Hamburger";
|
|
|
+import Screenfull from "@/components/Screenfull";
|
|
|
+import NavMenu from "@/components/NavMenu";
|
|
|
+import { getNoticeListCount } from "@/api/notice";
|
|
|
+import { checkEngineAccount, bindEngineAccount } from "@/api/setting";
|
|
|
+import request from "@/utils/request";
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- timer: '',
|
|
|
+ timer: "",
|
|
|
noticeCount: 0,
|
|
|
- userInfo: '',
|
|
|
+ userInfo: "",
|
|
|
engineForm: {
|
|
|
- account: '',
|
|
|
- password: ''
|
|
|
+ account: "",
|
|
|
+ password: "",
|
|
|
},
|
|
|
engineFormRules: {
|
|
|
account: [
|
|
|
- { required: true, message: '请输入工程机账号', trigger: 'blur' }
|
|
|
+ { required: true, message: "请输入工程机账号", trigger: "blur" },
|
|
|
],
|
|
|
password: [
|
|
|
- { required: true, message: '请输入工程机密码', trigger: 'blur' }
|
|
|
- ]
|
|
|
+ { required: true, message: "请输入工程机密码", trigger: "blur" },
|
|
|
+ ],
|
|
|
},
|
|
|
- formLabelWidth: '100px',
|
|
|
- dialogFormVisible: false
|
|
|
- }
|
|
|
+ formLabelWidth: "100px",
|
|
|
+ dialogFormVisible: false,
|
|
|
+ };
|
|
|
},
|
|
|
mounted() {
|
|
|
- const that = this
|
|
|
+ const that = this;
|
|
|
// 开定时器轮询未读消息接口(写在全局vuex里比较好)
|
|
|
- that.initNotice()
|
|
|
+ that.initNotice();
|
|
|
this.timer = setInterval(function () {
|
|
|
- that.initNotice()
|
|
|
- }, 3000)
|
|
|
+ that.initNotice();
|
|
|
+ }, 3000);
|
|
|
},
|
|
|
created() {
|
|
|
- this.userInfo = JSON.parse(localStorage.getItem("supply_user"))
|
|
|
+ this.userInfo = JSON.parse(localStorage.getItem("supply_user"));
|
|
|
},
|
|
|
beforeDestroy() {
|
|
|
- window.clearInterval(this.timer)
|
|
|
- console.log('退出清理定时器' + this.timer)
|
|
|
+ window.clearInterval(this.timer);
|
|
|
+ console.log("退出清理定时器" + this.timer);
|
|
|
},
|
|
|
components: {
|
|
|
Breadcrumb,
|
|
|
Hamburger,
|
|
|
Screenfull,
|
|
|
- NavMenu
|
|
|
+ NavMenu,
|
|
|
},
|
|
|
computed: {
|
|
|
showBreadcrumb() {
|
|
|
- return this.$store.state.settings.breadcrumb
|
|
|
+ return this.$store.state.settings.breadcrumb;
|
|
|
},
|
|
|
noticeVisible() {
|
|
|
- return this.noticeCount > 0
|
|
|
+ return this.noticeCount > 0;
|
|
|
},
|
|
|
- ...mapGetters([
|
|
|
- 'sidebar',
|
|
|
- 'avatar',
|
|
|
- 'device',
|
|
|
- 'name'
|
|
|
- ])
|
|
|
+ ...mapGetters(["sidebar", "avatar", "device", "name"]),
|
|
|
},
|
|
|
methods: {
|
|
|
toggleSideBar() {
|
|
|
- this.$store.dispatch('app/toggleSideBar')
|
|
|
+ this.$store.dispatch("app/toggleSideBar");
|
|
|
},
|
|
|
async logout() {
|
|
|
- await this.$store.dispatch('user/logout')
|
|
|
+ await this.$store.dispatch("user/logout");
|
|
|
// this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
|
|
- this.$router.push(`/login`)
|
|
|
+
|
|
|
+ this.$router.push(`/login`);
|
|
|
},
|
|
|
initNotice() {
|
|
|
- getNoticeListCount().then(res => {
|
|
|
+ getNoticeListCount().then((res) => {
|
|
|
if (res.data > 0 && this.noticeCount !== res.data) {
|
|
|
- this.noticeCount = res.data
|
|
|
+ this.noticeCount = res.data;
|
|
|
} else if (res.data === 0 && this.noticeCount !== res.data) {
|
|
|
- this.noticeCount = 0
|
|
|
+ this.noticeCount = 0;
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
goNotice() {
|
|
|
- this.$router.push('/notice/index')
|
|
|
+ this.$router.push("/notice/index");
|
|
|
},
|
|
|
toEngine() {
|
|
|
- const userInfoCopy = this.userInfo
|
|
|
+ const userInfoCopy = this.userInfo;
|
|
|
if (userInfoCopy && userInfoCopy.bindEngin) {
|
|
|
- checkEngineAccount().then(res => {
|
|
|
+ checkEngineAccount().then((res) => {
|
|
|
if (res.code === 200) {
|
|
|
// this.$refs.engineSubmit.click()
|
|
|
- const {href} = this.$router.resolve({
|
|
|
- name: 'open_engin'
|
|
|
- })
|
|
|
- window.open(href, '_blank')
|
|
|
+ const { href } = this.$router.resolve({
|
|
|
+ name: "open_engin",
|
|
|
+ });
|
|
|
+ window.open(href, "_blank");
|
|
|
} else {
|
|
|
- this.$errorMsg("账号密码错误,请重新绑定")
|
|
|
- this.dialogFormVisible = true
|
|
|
+ this.$errorMsg("账号密码错误,请重新绑定");
|
|
|
+ this.dialogFormVisible = true;
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
} else {
|
|
|
- this.dialogFormVisible = true
|
|
|
+ this.dialogFormVisible = true;
|
|
|
}
|
|
|
},
|
|
|
submitForm() {
|
|
|
- this.$refs.engineForm.validate(valid => {
|
|
|
+ this.$refs.engineForm.validate((valid) => {
|
|
|
if (valid) {
|
|
|
const params = {
|
|
|
enginUserName: this.engineForm.account,
|
|
|
- enginPassword: this.engineForm.password
|
|
|
- }
|
|
|
- bindEngineAccount(params).then(res => {
|
|
|
+ enginPassword: this.engineForm.password,
|
|
|
+ };
|
|
|
+ bindEngineAccount(params).then((res) => {
|
|
|
if (res.code === 200) {
|
|
|
- this.$successMsg("绑定成功,正在打开工程机系统")
|
|
|
- this.dialogFormVisible = false
|
|
|
- this.$store.dispatch('user/getInfo').then(() => {
|
|
|
- this.userInfo = JSON.parse(localStorage.getItem("supply_user"))
|
|
|
- const {href} = this.$router.resolve({
|
|
|
- name: 'open_engin'
|
|
|
- })
|
|
|
- window.open(href, '_blank')
|
|
|
+ this.$successMsg("绑定成功,正在打开工程机系统");
|
|
|
+ this.dialogFormVisible = false;
|
|
|
+ this.$store.dispatch("user/getInfo").then(() => {
|
|
|
+ this.userInfo = JSON.parse(localStorage.getItem("supply_user"));
|
|
|
+ const { href } = this.$router.resolve({
|
|
|
+ name: "open_engin",
|
|
|
+ });
|
|
|
+ window.open(href, "_blank");
|
|
|
// this.userInfo.enginUserName = this.engineForm.account
|
|
|
// this.userInfo.enginPassword = this.engineForm.password
|
|
|
// this.$refs.engineSubmit.click()
|
|
|
- })
|
|
|
+ });
|
|
|
} else {
|
|
|
- this.$errorMsg(res.message)
|
|
|
+ this.$errorMsg(res.message);
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
}
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- @import "~@/styles/variables.scss";
|
|
|
+@import "~@/styles/variables.scss";
|
|
|
|
|
|
.navbar {
|
|
|
width: 100%;
|
|
|
height: 50px;
|
|
|
overflow: hidden;
|
|
|
background: #{$navbarBg};
|
|
|
- box-shadow: 0 1px 4px rgba(0,21,41,.08);
|
|
|
+ box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
|
|
|
.hamburger-container {
|
|
|
line-height: 46px;
|
|
|
height: 100%;
|
|
|
color: #{$navbarText};
|
|
|
float: left;
|
|
|
cursor: pointer;
|
|
|
- transition: background .3s;
|
|
|
- -webkit-tap-highlight-color:transparent;
|
|
|
+ transition: background 0.3s;
|
|
|
+ -webkit-tap-highlight-color: transparent;
|
|
|
border-right: 1px solid #eaeaea;
|
|
|
&:hover {
|
|
|
- background: rgba(0, 0, 0, .025)
|
|
|
+ background: rgba(0, 0, 0, 0.025);
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -238,7 +268,7 @@ export default {
|
|
|
float: right;
|
|
|
height: 100%;
|
|
|
line-height: 50px;
|
|
|
- &>div {
|
|
|
+ & > div {
|
|
|
float: left;
|
|
|
}
|
|
|
&:focus {
|
|
@@ -266,10 +296,10 @@ export default {
|
|
|
border-left: 1px solid #eaeaea;
|
|
|
&.hover-effect {
|
|
|
cursor: pointer;
|
|
|
- transition: background .3s;
|
|
|
+ transition: background 0.3s;
|
|
|
|
|
|
&:hover {
|
|
|
- background: rgba(0, 0, 0, .025)
|
|
|
+ background: rgba(0, 0, 0, 0.025);
|
|
|
}
|
|
|
}
|
|
|
.notice-icon {
|
|
@@ -285,7 +315,7 @@ export default {
|
|
|
.navbar {
|
|
|
.right-menu {
|
|
|
.right-menu-item {
|
|
|
- .notice-icon>i {
|
|
|
+ .notice-icon > i {
|
|
|
font-size: 18px;
|
|
|
}
|
|
|
sup {
|