Commit a72891f4 authored by Your Name's avatar Your Name

限制角色页面

parent acd48e7c
<template> <template>
<div class="my-tabbar"> <div class="my-tabbar">
<van-tabbar v-model="activeIndex" active-color="#EE0A24" route> <van-tabbar v-model="activeIndex" active-color="#EE0A24" route>
<van-tabbar-item v-for="item in iconList" :to="item.url" :key="item.title"> <van-tabbar-item @click="changeHandle(item.title, userInfo.roleList[0])" v-for="item in iconList" :to=" +userInfo.roleList[0] == 2 && item.title == '观影互动' || +userInfo.roleList[0] == 17 && item.title == '学习项目' ? '' : item.url" :key="item.title">
<span>{{item.title}}</span> <span>{{item.title}}</span>
<template #icon="props"> <template #icon="props">
<img :src="props.active ? item.icon.active : item.icon.inactive" /> <img :src="props.active ? item.icon.active : item.icon.inactive" />
</template> </template>
</van-tabbar-item> </van-tabbar-item>
<!-- <van-tabbar-item icon="search" to="/learn"> <!-- <van-tabbar-item icon="search" to="/learn">
<span>学习项目</span> <span>学习项目</span>
<template #icon="props"> <template #icon="props">
<img :src="props.active ? icon.active : icon.inactive" /> <img :src="props.active ? icon.active : icon.inactive" />
</template> </template>
</van-tabbar-item> </van-tabbar-item>
<van-tabbar-item icon="friends-o" to="/admin"> <van-tabbar-item icon="friends-o" to="/admin">
<span>管理员信息</span> <span>管理员信息</span>
<template #icon="props"> <template #icon="props">
<img :src="props.active ? icon.active : icon.inactive" /> <img :src="props.active ? icon.active : icon.inactive" />
</template> </template>
</van-tabbar-item> </van-tabbar-item>
<van-tabbar-item icon="setting-o" to="/editPsd"> <van-tabbar-item icon="setting-o" to="/editPsd">
<span>修改密码</span> <span>修改密码</span>
<template #icon="props"> <template #icon="props">
<img :src="props.active ? icon.active : icon.inactive" /> <img :src="props.active ? icon.active : icon.inactive" />
</template> </template>
</van-tabbar-item> --> </van-tabbar-item> -->
</van-tabbar> </van-tabbar>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: { props: {
active: { active: {
type: String, type: String,
default: "0" default: "0"
} }
}, },
data() { data() {
return { return {
activeIndex: this.active, userInfo: JSON.parse(sessionStorage.getItem('userInfo')),
iconList: [ activeIndex: this.active,
{ iconList: [
url: "/commit", {
title: "观影互动", url: "/commit",
icon: { title: "观影互动",
inactive: require("@/assets/images/applets/commit.png"), icon: {
active: require("@/assets/images/applets/commit-active.png") inactive: require("@/assets/images/applets/commit.png"),
} active: require("@/assets/images/applets/commit-active.png")
}, }
{ },
url: "/learn", {
title: "学习项目", url: "/learn",
icon: { title: "学习项目",
inactive: require("@/assets/images/applets/learn.png"), icon: {
active: require("@/assets/images/applets/learn-active.png") inactive: require("@/assets/images/applets/learn.png"),
} active: require("@/assets/images/applets/learn-active.png")
}, }
{ },
url: "/admin", {
title: "管理员信息", url: "/admin",
icon: { title: "管理员信息",
inactive: require("@/assets/images/applets/admin.png"), icon: {
active: require("@/assets/images/applets/admin-active.png") inactive: require("@/assets/images/applets/admin.png"),
} active: require("@/assets/images/applets/admin-active.png")
}, }
{ },
url: "/editPsd", {
title: "修改密码", url: "/editPsd",
icon: { title: "修改密码",
inactive: require("@/assets/images/applets/editpsd.png"), icon: {
active: require("@/assets/images/applets/editpsd-active.png") inactive: require("@/assets/images/applets/editpsd.png"),
} active: require("@/assets/images/applets/editpsd-active.png")
} }
] }
}; ]
} };
}; },
</script> methods: {
changeHandle(index1,index2) {
<style scoped> // console.log(index1,index2)
.my-tabbar { if(index1 == '观影互动' && index2 == 2 || index1 == '学习项目' && index2 == 17) {
height: 50px; this.$toast('暂无该权限!')
position: fixed; }
bottom: 0; }
left: 0; }
right: 0; };
} </script>
<style scoped>
.my-tabbar {
height: 50px;
position: fixed;
bottom: 0;
left: 0;
right: 0;
}
</style> </style>
\ No newline at end of file
<template> <template>
<div class="login-container"> <div class="login-container">
<div class="login-bg"></div> <div class="login-bg"></div>
<div class="login-page"> <div class="login-page">
<div class="login-page-body"> <div class="login-page-body">
<div class="login-page-title">展板导览</div> <div class="login-page-title">展板导览</div>
<div class="login-page-form"> <div class="login-page-form">
<van-cell-group> <van-cell-group>
<van-field label="展板名称:" v-model="panelName" readonly /> <van-field label="展板名称:" v-model="panelName" readonly />
</van-cell-group> </van-cell-group>
<p>展板导览视频:</p> <van-row>
<!-- <embed type="video/mp4" :src="panelVideo" /> --> <van-col span="8" style="margin-top: 50px;"><div style="vertical-align:middle;font-size:14px;">展板导览视频:</div></van-col>
<video <van-col span="12"> <!-- <embed type="video/mp4" :src="panelVideo" /> -->
placeholder="展板导览视频" controls <video
width="150px" placeholder="展板导览视频" controls
height="100px"> width="150px"
        <source :src="panelVideo" type="video/mp4" /> height="100px">
        <source :src="panelVideo" type="video/WebM">        <source :src="panelVideo" type="video/mp4" />
      </video>        <source :src="panelVideo" type="video/WebM">
</div>      </video></van-col>
</div> </van-row>
</div> </div>
</div> </div>
</template> </div>
<script> </div>
export default { </template>
data() { <script>
return { export default {
url: 'https://www.baidu.com/h5/guide?id=1&name=长征之路&video=2', // 扫描者携带的信息参数 data() {
panelId: '', // 展板id return {
panelName: '', // 展板名称 url: 'https://www.baidu.com/h5/guide?panelId=1&panelName=长征之路&panelVideo=https://www.runoob.com/try/demo_source/movie.mp4', // 扫描者携带的信息参数
panelVideo:'https://www.runoob.com/try/demo_source/movie.mp4', // 展板导览视频地址 panelId: '', // 展板id
}; panelName: '', // 展板名称
}, panelVideo:'', // 展板导览视频地址
created() { u:''
// var url = window.location.href ; //获取url中"?"符后的字串 };
// var cs = this.url.split('?')[1]; //获取?之后的参数字符串 },
//alert(url+'地址');//orderCode=20200721093517378188743943022 created() {
// var cc =''; var url = window.location.href ; // 获取url中"?"符后的字串
// var cs2 = ''; this.u = this.url.split('?')[0];//
// if (cs.length > 0) console.log(this.u)
// { var cs = this.url.split('?')[1]; // 获取?之后的参数字符串
// cs = cs.replace('id=', ''); // 去除参数名称 // alert(url+'地址');//orderCode=20200721093517378188743943022
// var cc =cs.split('&')[0];//获取展板id var cc ='';
// var cs3 = cs.split('&')[1]; var cs2 = '';
// var ccs = cs3.replace('name=', '') // 获取展板名称 if (cs.length > 0)
// var cs1 = cs.split('&')[2];//ocd=20200818103843816416953617735 {
// var cs2 = cs1.replace('video=', '');//20200818103843816416953617735 cs = cs.replace('panelId=', ''); // 去除参数名称
// } var cc =cs.split('&')[0];//获取展板id
// this.panelName = ccs; var cs3 = cs.split('&')[1];
// // this.panelVideo = cs2; var ccs = cs3.replace('panelName=', '') // 去除参数名称
// this.panelId = ccs var cs1 = cs.split('&')[2]; // 获取展板名称
}, var cs2 = cs1.replace('panelVideo=', '');// 获取展板导览视频
methods: { }
this.panelName = ccs;
} this.panelVideo = cs2;
}; this.panelId = cc
</script> this.initData()
<style lang="scss"> },
.login-container { methods: {
width: 100%; initData() {
height: 100%; let vm = this
max-width: 1280px; let param = {
.login-bg { id: this.panelId,
width: 100%; };
height: 100%; vm.$https(
margin: 0 auto; {
background: #a4171d; url: "screen/statistic",
&:before { method: "get",
display: inline-block; authType: this.backToken,
content: ""; },
width: 100%; param
height: 106px; ).catch(function (err) {
// background: url("~@/assets/images/topBox/bg-bottom.png") no-repeat; console.log(err);
background-size: 100% 100%; });
position: absolute; }
bottom: 0; }
left: 0; };
} </script>
&:after { <style lang="scss">
display: inline-block; .login-container {
content: ""; width: 100%;
width: 100%; height: 100%;
height: 421px; max-width: 1280px;
// background: url("~@/assets/images/topBox/bg-top.png") no-repeat; .login-bg {
background-size: 100% 100%; width: 100%;
position: absolute; height: 100%;
top: 0; margin: 0 auto;
left: 0; background: #776d6e;
} &:before {
} display: inline-block;
.login-page { content: "";
height: 580px; width: 100%;
position: absolute; height: 106px;
bottom: 20px; // background: url("~@/assets/images/topBox/bg-bottom.png") no-repeat;
left: 24px; background-size: 100% 100%;
right: 24px; position: absolute;
padding: 24px; bottom: 0;
background: #ffffff; left: 0;
box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.2); }
border-radius: 8px; &:after {
.login-page-form { display: inline-block;
padding-top: 24px; content: "";
.van-field { width: 100%;
background: #f5f5f5; height: 421px;
border-radius: 4px; // background: url("~@/assets/images/topBox/bg-top.png") no-repeat;
margin-bottom: 32px; background-size: 100% 100%;
.van-field__left-icon { position: absolute;
margin-right: 12px; top: 0;
} left: 0;
} }
} }
.login-page-title { .login-page {
font-size: 18px; height: 580px;
color: #333; position: absolute;
text-align: center; bottom: 20px;
margin: 24px 0; left: 24px;
} right: 24px;
.login-page-button { padding: 24px;
text-align: center; background: #f5f5f5;
background: #a4151d; box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.2);
border-radius: 4px; border-radius: 8px;
position: absolute; .login-page-form {
bottom: 40px; padding-top: 24px;
left: 24px; .van-field {
right: 24px; background: #f5f5f5;
box-sizing: border-box; border-radius: 4px;
.van-button { margin-bottom: 32px;
font-size: 16px; .van-field__left-icon {
color: #fff; margin-right: 12px;
background-color: transparent; }
border: none; }
} }
} .login-page-title {
} font-size: 18px;
} color: #333;
</style> text-align: center;
margin: 24px 0;
}
.login-page-button {
text-align: center;
background: #a4151d;
border-radius: 4px;
position: absolute;
bottom: 40px;
left: 24px;
right: 24px;
box-sizing: border-box;
.van-button {
font-size: 16px;
color: #fff;
background-color: transparent;
border: none;
}
}
}
}
</style>
<template> <template>
<div class="login-container"> <div class="login-container">
<div class="login-bg"></div> <div class="login-bg"></div>
<div class="login-page"> <div class="login-page">
<div class="login-page-body"> <div class="login-page-body">
<div class="login-page-title">客户端登录</div> <div class="login-page-title">客户端登录</div>
<div class="login-page-form"> <div class="login-page-form">
<van-form @submit.native="onSubmit"> <van-form @submit.native="onSubmit">
<van-field <van-field
v-model="userInfo.username" v-model="userInfo.username"
name="用户名" name="用户名"
left-icon="manager" left-icon="manager"
placeholder="请输入用户名" placeholder="请输入用户名"
:rules="[{ required: true, message: '用户名不能为空' }]" :rules="[{ required: true, message: '用户名不能为空' }]"
/> />
<van-field <van-field
v-model="userInfo.password" v-model="userInfo.password"
type="password" type="password"
name="密码" name="密码"
left-icon="lock" left-icon="lock"
placeholder="请输入密码" placeholder="请输入密码"
:rules="[{ required: true, message: '密码不能为空' }]" :rules="[{ required: true, message: '密码不能为空' }]"
/> />
<div class="login-page-button"> <div class="login-page-button">
<van-button type="default" block native-type="submit">登录</van-button> <van-button type="default" block native-type="submit">登录</van-button>
</div> </div>
</van-form> </van-form>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import util from "@/utils/index.js"; import util from "@/utils/index.js";
export default { export default {
data() { data() {
return { return {
userInfo: {}, userInfo: {},
}; };
}, },
mounted() {}, mounted() {},
methods: { methods: {
onSubmit() { onSubmit() {
let vm = this; let vm = this;
let param = { let param = {
password: util.encrypt(this.userInfo.password), password: util.encrypt(this.userInfo.password),
username: this.userInfo.username, username: this.userInfo.username,
}; };
vm.$https( vm.$https(
{ {
url: "ajaxLogin", url: "ajaxLogin",
method: "post", method: "post",
authType: this.backToken, authType: this.backToken,
}, },
vm.$qs.stringify(param) vm.$qs.stringify(param)
) )
.then((res) => { .then((res) => {
if (res.data.resultCode === "200") { if (res.data.resultCode === "200") {
let data = res.data; let data = res.data;
if(data.isDefault){ if(data.isDefault){
this.$notify({ this.$notify({
type: 'warning', type: 'warning',
message: '登录成功,为了安全,建议修改密码', message: '登录成功,为了安全,建议修改密码',
duration: 5000 duration: 5000
}) })
} }
const isOpt = data.user.type; const isOpt = +data.user.roleList[0];
sessionStorage.setItem("token", data.token); sessionStorage.setItem("token", data.token);
sessionStorage.setItem("userInfo", JSON.stringify(data.user)); sessionStorage.setItem("userInfo", JSON.stringify(data.user));
// let redirectPath = decodeURIComponent(this.$route.fullPath).split('redirect=')[1] // let redirectPath = decodeURIComponent(this.$route.fullPath).split('redirect=')[1]
if (isOpt == "4") { if (isOpt == 17) {
this.$router.push("/opt"); this.$router.push("/commit");
}else if (isOpt == "2") { }else if (isOpt == 2) {
this.$router.push("/commit"); this.$router.push("/learn");
}else{ }else{
this.$toast.fail("您登录的账号既不是运维账号也不是单位用户账号,不能使用H5的功能"); this.$toast.fail("您登录的账号既不是运维账号也不是单位用户账号,不能使用H5的功能");
} }
} else { } else {
this.$toast.fail(res.data.message); this.$toast.fail(res.data.message);
} }
}) })
.catch(function (err) { .catch(function (err) {
console.log(err); console.log(err);
}); });
}, },
}, },
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
.login-container { .login-container {
width: 100%; width: 100%;
height: 100%; height: 100%;
max-width: 1280px; max-width: 1280px;
.login-bg { .login-bg {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: 0 auto; margin: 0 auto;
background: #a4171d; background: #a4171d;
&:before { &:before {
display: inline-block; display: inline-block;
content: ""; content: "";
width: 100%; width: 100%;
height: 106px; height: 106px;
background: url("~@/assets/images/topBox/bg-bottom.png") no-repeat; background: url("~@/assets/images/topBox/bg-bottom.png") no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
} }
&:after { &:after {
display: inline-block; display: inline-block;
content: ""; content: "";
width: 100%; width: 100%;
height: 421px; height: 421px;
background: url("~@/assets/images/topBox/bg-top.png") no-repeat; background: url("~@/assets/images/topBox/bg-top.png") no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
} }
} }
.login-page { .login-page {
height: 350px; height: 350px;
position: absolute; position: absolute;
bottom: 58px; bottom: 58px;
left: 24px; left: 24px;
right: 24px; right: 24px;
padding: 24px; padding: 24px;
background: #ffffff; background: #ffffff;
box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.2);
border-radius: 8px; border-radius: 8px;
.login-page-form { .login-page-form {
padding-top: 24px; padding-top: 24px;
.van-field { .van-field {
background: #f5f5f5; background: #f5f5f5;
border-radius: 4px; border-radius: 4px;
margin-bottom: 32px; margin-bottom: 32px;
.van-field__left-icon { .van-field__left-icon {
margin-right: 12px; margin-right: 12px;
} }
} }
} }
.login-page-title { .login-page-title {
font-size: 18px; font-size: 18px;
color: #333; color: #333;
text-align: center; text-align: center;
margin: 24px 0; margin: 24px 0;
} }
.login-page-button { .login-page-button {
text-align: center; text-align: center;
background: #a4151d; background: #a4151d;
border-radius: 4px; border-radius: 4px;
position: absolute; position: absolute;
bottom: 40px; bottom: 40px;
left: 24px; left: 24px;
right: 24px; right: 24px;
box-sizing: border-box; box-sizing: border-box;
.van-button { .van-button {
font-size: 16px; font-size: 16px;
color: #fff; color: #fff;
background-color: transparent; background-color: transparent;
border: none; border: none;
} }
} }
} }
} }
</style> </style>
This diff is collapsed.
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