Skip to content

M
marketing-opeartion
Commit 50db8f47 by 黑潮
Options

update: 修改

parent d3a0a1a0
Showing with 440 additions and 4 deletions
public/index.html
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
<link rel="icon" href="<%= BASE_URL %>favicon2.ico"> <link rel="icon" href="<%= BASE_URL %>favicon2.ico">
<link rel="stylesheet" type="text/css" href="//web-1251519181.file.myqcloud.com/lib/element-ui/2.15.6/index.css" /> <link rel="stylesheet" type="text/css" href="//web-1251519181.file.myqcloud.com/lib/element-ui/2.15.6/index.css" />
<link rel="stylesheet" type="text/css" href="//web-1251519181.file.myqcloud.com/custom-element/custom-element.1.0.68.css" /> <link rel="stylesheet" type="text/css" href="//web-1251519181.file.myqcloud.com/custom-element/custom-element.1.0.68.css" />
<link rel="stylesheet" href="//at.alicdn.com/t/font_2995156_rf810o69kh.css">
<title>实施运维</title> <title>实施运维</title>
</head> </head>
<body class="damolish"> <body class="damolish">
......
src/api/operation.js
...@@ -36,7 +36,8 @@ let marketingApi = { ...@@ -36,7 +36,8 @@ let marketingApi = {
let authApi = { let authApi = {
/** 登录信息 */ /** 登录信息 */
getUserInfo: '/loginuser' getUserInfo: '/loginuser',
getLoginOut: '/gic-authcenter/logout',
}; };
marketingApi = getFetch(marketingApi, '/marketing-operation'); marketingApi = getFetch(marketingApi, '/marketing-operation');
......
src/components/aside.vue 0 → 100644
<template>
<el-aside width="200px">
<el-menu
class="aside-menu"
style="height:100%"
router
:default-active="$route.query.tabId">
<template v-for="item in menuList">
<el-menu-item v-if="item.children.length === 0" :route="{path: item.uri, query: {tabId:item.code}}" :key="item.code" :index="item.code"><i class="iconfont" style="margin-right:6px" :class="item.iconUrl"></i>{{item.menuName}}</el-menu-item>
<el-submenu v-else :key="item.code" :index="item.uri">
<template slot="title"><i class="iconfont" style="margin-right:6px" :class="item.iconUrl"></i>{{item.menuName}}</template>
<template v-for="item2 in item.children">
<el-menu-item v-if="item2.children.length === 0" :route="{path: item2.uri, query: {tabId:item2.code}}" :key="item2.code" :index="item2.code">{{item2.menuName}}</el-menu-item>
<el-submenu v-else :key="item2.code" :index="item.uri">
<template slot="title">{{item2.menuName}}</template>
<el-menu-item v-for="item3 in item2.children" :route="{path: item3.uri, query: {tabId:item3.code}}" :key="item3.code" :index="item3.code">{{item3.menuName}}</el-menu-item>
</el-submenu>
</template>
</el-submenu>
</template>
</el-menu>
</el-aside>
</template>
<script>
export default {
name: 'BaseAside',
props: {
menuList: {
type: Array,
required: true,
}
},
};
</script>
<style lang="scss" scoped>
.aside-menu /deep/ {
background-color: #F5F7FA94;
border-right: 1px solid #E4E7ED !important;
.el-submenu__title {
height: 36px;
line-height: 36px;
padding: 0 30px;
color: #606266;
}
.el-menu-item {
position: relative;
height: 36px;
line-height: 36px;
padding: 0 30px;
color: #606266;
&.is-active {
background-color: #F0F5FF ;
color: #1890ff;
&::before {
content: '';
position: absolute;
left: 0;
top: 1px;
width: 2px;
bottom: 1px;
background-color: #1890ff;
}
}
}
.el-menu-item {
background-color: #F5F7FA;
}
}
</style>
src/components/header.vue 0 → 100644
<template>
<el-header class="base-header">
<div class="base-header__left">
<i class="iconfont icon-fenleishezhi" style="font-size:24px" @click="drawerVisible = true"></i>
<span class="title">{{currentModule.menuName}}</span>
</div>
<div class="base-header__right">
<el-dropdown @command="onCommand" trigger="click">
<span style="color:#909399;cursor:pointer">
{{ userInfoForm.realName }}<i class="el-icon-arrow-down arrowico" style="margin-left:10px"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="info">账号信息</el-dropdown-item>
<el-dropdown-item command="loginOut">退出登录</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<!-- 修改用户信息 -->
<el-dialog title="账户信息" class="user-form-dialog" :visible.sync="userFormVisible" width="425px">
<el-form :model="userInfoForm" :rules="userFormRules" ref="userForm" label-width="100px">
<el-form-item label="姓名" prop="realName">
<el-input v-model="userInfoForm.realName"></el-input>
</el-form-item>
<el-form-item label="性别" prop="gender">
<el-radio-group v-model="userInfoForm.gender">
<el-radio :label="1">男</el-radio>
<el-radio :label="0">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="工号" prop="clerkCode">
<el-input disabled v-model="userInfoForm.clerkCode"></el-input>
</el-form-item>
<el-form-item label="手机号码" prop="phoneNumber">
<el-input v-model="userInfoForm.phoneNumber" type="text" :maxlength="11"></el-input>
</el-form-item>
<el-form-item label="职位" prop="positionName">
<el-input v-model="userInfoForm.positionName"></el-input>
</el-form-item>
</el-form>
</el-dialog>
<el-drawer
:modal="false"
custom-class="header-drawer"
size="300px"
:show-close="false"
append-to-body
:visible.sync="drawerVisible"
direction="ltr">
<div class="header-drawer__container">
<div class="header-drawer__header">
<i class="iconfont icon-fenleishezhi" style="font-size:24px" @click="drawerVisible = true"></i>
<span class="title">{{currentModule.menuName}}</span>
</div>
<el-menu :default-active="currentModule.uri">
<el-menu-item v-for="item in moduleList" :key="item.code" :index="item.uri" @click="onSelectMenu(item)"><i style="width:20px;display:inline-block" :class="item.iconUrl"></i>{{item.menuName}}</el-menu-item>
</el-menu>
<div class="operation-log" @click="openLog">
<span>操作日志</span>
<i class="iconfont icon-right"></i>
</div>
</div>
</el-drawer>
</el-header>
</template>
<script>
import fetch from '@/api/operation.js';
const { getUserInfo, getLoginOut } = fetch;
export default {
name: 'BaseHeader',
props: {
currentModule: {
type: Object,
required: true
},
moduleList: {
type: Array,
required: true
}
},
data() {
return {
requestProject: 'gic-authcenter',
drawerVisible: false,
// 修改密码
dialogPawVisible: false,
pawForm: {
oldPaw: '',
newPaw: '',
surePaw: ''
},
rules: {
oldPaw: [ { required: true, message: '请输入旧密码', trigger: 'blur' } ],
newPaw: [ { required: true, message: '请输入新密码', trigger: 'blur' } ],
surePaw: [ { required: true, message: '请输入确认密码', trigger: 'blur' } ]
},
// 用户信息 form
userFormVisible: false,
userInfoForm: {
realName: '',
gender: 0, // 1男0女
clerkCode: '',
phoneNumber: '',
positionName: ''
},
userFormRules: {
realName: [ { required: true, message: '请输入姓名', trigger: 'blur' } ],
gender: [ { required: true, message: '请选择性别', trigger: 'change' } ],
clerkCode: [ { required: true, message: '请输入员工代码', trigger: 'blur' } ],
phoneNumber: [ { required: true, message: '请输入手机号', trigger: 'blur' }, { pattern: /^1[34578]\d{9}$/, message: '手机号码格式不正确' } ],
positionName: [ { required: true, message: '请输入职位', trigger: 'blur' } ]
},
loginName: '',
// 是否显示操作日志和权限
// menuAllCode: [],
// isLogBool: true,
// isAuthorityBool: true,
// 判断权限管理的挑转路由
// authorityUrl: ''
};
},
// watch: {
// linkType(newVal) {
// this.entranceType = newVal;
// }
// },
mounted() {
this.getUserInfo();
},
methods: {
openLog() {
window.location.href = window.location.origin + '/operation-platform/#/log?tabId=system_log';
this.drawerVisible = false;
},
onSelectMenu(item) {
if(this.currentModule.uri === item.uri) return;
window.location.href = window.location.origin + '/' + item.projectCode + '/#' + item.uri;
this.drawerVisible = false;
},
onCommand(cmd) {
switch(cmd) {
case 'info': this.toModifyUser();
break;
case 'loginOut': this.toLoginOut();
break;
}
},
// 获取用户信息
getUserInfo() {
getUserInfo()
.then(res => {
let _result = res.result;
this.userInfoForm.realName = _result.realName;
this.userInfoForm.gender = parseInt(_result.sex);
this.userInfoForm.clerkCode = _result.employeeNumber;
this.userInfoForm.phoneNumber = _result.userMobile;
this.userInfoForm.positionName = _result.position;
this.loginName = _result.loginName;
});
},
// 账户信息
toModifyUser() {
this.userFormVisible = true;
},
// 退出登录
toLoginOut() {
this.$confirm('确认退出吗?', '提示', {
type: 'warning'
})
.then(() => {
getLoginOut()
.then(res => {
this.$message.success('退出成功');
window.location.href = window.location.origin + '/operation-platform/#/';
})
.catch(function(error) {
console.log(error);
});
})
.catch(() => {});
},
}
};
</script>
<style lang="scss">
.header-drawer {
&__container {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
.operation-log {
position: absolute;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
padding: 20px;
bottom: 30px;
left: 0;
right: 0;
color: #909399;
font-size: 14px;
}
.el-menu-item {
height: 36px;
line-height: 36px;
padding: 0 30px;
color: #606266;
&.is-active {
background-color: #F5F7FA ;
color: #1890ff;
}
}
}
&__header {
padding: 0 20px;
height: 60px;
line-height: 60px;
border-bottom: 1px solid #E4E7ED;
i {
vertical-align: middle;
}
.title {
color: #303133;
font-size: 16px;
font-weight: bold;
margin-left: 30px;
vertical-align: middle;
}
}
}
</style>
<style lang="scss" scoped>
.base-header {
border-bottom: 1px solid #E4E7ED;
display: flex;
justify-content: space-between;
align-items: center;
&__left {
i {
cursor: pointer;
vertical-align: middle;
}
.title {
color: #303133;
font-size: 16px;
font-weight: bold;
margin-left: 40px;
vertical-align: middle;
}
}
}
</style>
src/components/layout.vue 0 → 100644
<template>
<el-container style="height:100vh;background:#fff" direction="vertical">
<base-header :current-module="currentModule" :module-list="moduleList"></base-header>
<el-container>
<base-aside :menu-list="menuList"></base-aside>
<el-main style="padding:0;max-height:calc(100vh - 60px)">
<el-main style="padding:0">
<router-view></router-view>
</el-main>
</el-main>
</el-container>
</el-container>
</template>
<script>
import baseHeader from './header';
import baseAside from './aside';
import fetch from '@/api/operation.js';
const { getUserInfo } = fetch;
import { generatorMenuList, getFirstMenu } from '@/utils';
export default {
name: 'BaseLayout',
components: {
baseHeader,
baseAside
},
props: {
moduleName: {
type: String,
required: true,
}
},
data() {
return {
menuList: [],
currentModule: {},
moduleList: []
};
},
created() {
this.getMenuList();
},
methods: {
getMenuList() {
getUserInfo().then(res => {
console.log(res);
this.entranceList = [];
let entranceList = res.result.menuList ? generatorMenuList(res.result.menuList) : [];
console.log(entranceList);
let menu = entranceList.find(el => el.code === this.moduleName);
this.menuList = menu.children;
this.currentModule = menu;
this.moduleList = entranceList;
let firstMenu = getFirstMenu(this.menuList);
console.log(firstMenu);
if(this.$route.path === '/') {
this.$router.replace({ path: firstMenu.uri, query: { tabId: firstMenu.code } });
}
});
}
}
};
</script>
<style lang="less" scoped>
</style>
src/layout/new-layout.vue 0 → 100644
<template>
<base-layout module-name="marketing_operation"></base-layout>
</template>
<script>
import BaseLayout from '@/components/layout.vue';
export default {
components: { BaseLayout }
};
</script>
src/router/routes.js
import Layout from '@/layout/layout.vue'; // import Layout from '@/layout/layout.vue';
import Layout from '@/layout/new-layout.vue';
import _import from './import'; import _import from './import';
export const routes = [ export const routes = [
{ {
path: '/', path: '/',
name: '短信管理', name: '短信管理',
redirect: '/messageTemplate',
component: Layout, component: Layout,
children: [ children: [
{ {
......
src/utils/index.js 0 → 100644
export function generatorMenuList(list) {
let treeData = list.filter(el => !el.parentCode);
treeData = treeData.filter(el => el.isShow === 1);
treeData.sort((a, b) => a.sort - b.sort);
const travel = (root, allData) => {
root.forEach(item => {
let children = allData.filter(el => el.parentCode === item.code);
item.children = children.filter(el => el.isShow === 1);
item.children.sort((a, b) => a.sort - b.sort);
item.nodeChildren = item.children;
item.indexSort = item.sort;
travel(item.children, allData);
});
};
travel(treeData, list);
return treeData;
}
export function getFirstMenu(list) {
const travel = (root) => {
for (let i of root) {
if (i.children.length === 0) {
return i;
} else {
return travel(i.children);
}
}
};
return travel(list);
}
src/views/message/template.vue
...@@ -110,7 +110,7 @@ export default { ...@@ -110,7 +110,7 @@ export default {
this.getTableData(); this.getTableData();
}, },
toDetail(row) { toDetail(row) {
this.$router.push(`/messageTemplateDetail?id=${row.enterpriseId}`); this.$router.push(`/messageTemplateDetail?id=${row.enterpriseId}&tabId=${this.$route.query.tabId}`);
}, },
// others // others
async getChannelList() { async getChannelList() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment