461 lines
14 KiB
Vue
461 lines
14 KiB
Vue
<!-- 长城项目 首页 -->
|
||
<template>
|
||
<div class="home_v3 v-class">
|
||
<div style="display: flex;min-height: 100%;flex-direction: column;width: 100%;">
|
||
<personal-center></personal-center>
|
||
<div class="home-container">
|
||
<div class="content-title">
|
||
<div class="content-title-logo">
|
||
<p class="cn-name">全球标准法规管理系统</p>
|
||
<p class="en-name">Global standard and regulations management system</p>
|
||
</div>
|
||
</div>
|
||
<div class="content-search">
|
||
<div class="content-search-box">
|
||
<div class="home-select">
|
||
<el-select v-model="checkState">
|
||
<el-option
|
||
v-for="item in checkStateOptions"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
</div>
|
||
<div class="line-box">
|
||
<div class="line"></div>
|
||
</div>
|
||
<div class="home-input">
|
||
<el-input
|
||
placeholder="what are you looking for？"
|
||
@keyup.native.enter="search"
|
||
v-model="checkContent">
|
||
</el-input>
|
||
</div>
|
||
<div class="search-btn-box">
|
||
<div class="search-btn" @click="search"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="content-nav">
|
||
<div class="nav">
|
||
<div class="content-nav-box">
|
||
<template v-for="(item, index) in homeList">
|
||
<router-link v-if="item.moduleName === '首页' || item.moduleName === '待办任务' || item.flag === '0'" :to="`/${item.moduleAddress}`" :key="item.id" class="router-link">
|
||
<div class="nav-item">
|
||
<span class="icon-box"></span>
|
||
<span class="text" style="">{{item.moduleName}}</span>
|
||
<!-- <span class="number-accout" v-show="item.moduleName === '待办任务'">{{taskNUmber}}</span>-->
|
||
<el-badge :value="taskNUmber" :max="99" class="tips" v-show="item.moduleName === '待办任务' && taskNUmber !== 0">
|
||
</el-badge>
|
||
</div>
|
||
</router-link>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import PersonalCenter from '@/components/personalCenter/index.vue'
|
||
|
||
import {mapMutations} from "vuex";
|
||
export default {
|
||
name: 'Home',
|
||
data () {
|
||
return {
|
||
homeList: [],
|
||
homeListDate:[],//接收后台数据数组
|
||
// 当前查询状态
|
||
checkState: 'All',
|
||
// 查询内容
|
||
checkContent: '',
|
||
// 状态列表
|
||
checkStateOptions: [
|
||
{
|
||
label: '全部',
|
||
value: 'All'
|
||
},
|
||
{
|
||
label: '国内标准法规',
|
||
value: 'stand'
|
||
},
|
||
{
|
||
label: '海外标准法规', // value没改
|
||
value: 'bussstand'
|
||
},
|
||
{
|
||
label: '国内外政策',
|
||
value: 'laws'
|
||
},
|
||
{
|
||
label: '企业标准',
|
||
value: 'enterprise'
|
||
}
|
||
],
|
||
taskNUmber: 0,
|
||
// stateNumber: 9
|
||
}
|
||
},
|
||
methods: {
|
||
getTag () {
|
||
this.$http.get('person/personModuleUser/queryModuleByUserId', {}, {_this: this}, res => {
|
||
if (res.data.length === 0) {
|
||
res.data.push({
|
||
id: 'b7924063c2af4e62969a',
|
||
moduleAddress: 'DomesticStandardsAndRegulations',
|
||
moduleIcon: '1',
|
||
moduleName: '首页',
|
||
moduleSort: '1'})
|
||
this.homeList = res.data
|
||
} else {
|
||
this.homeList = res.data
|
||
this.homeListDate=res.data
|
||
}
|
||
const premission = {
|
||
'processCenter': '6GDJ5JDHUS',
|
||
'domesticStandardsAndRegulations':'A59EFAQ7AC',
|
||
'enterpriseStandardDatabase':'3YVZP8R4TC',
|
||
'enterBSysRevPlanManaLib':'WW7YDHQ9Z679TGMDZMUS',
|
||
'nonConfomity':'HQSK8WWPDJG7R5F53LTK',
|
||
'workGroup':'QYRMD5TUNBP9XXFRNK5S',
|
||
'foreignStandardsAndRegulations':'6K8A2RZYRE',
|
||
'foreignRegulationsDatabase':'4DB4Y2H3NH',
|
||
'accessStandardsAndRegulations':'UR3CSDWEQM6Q2GEW339L',
|
||
'localProductsOrProjectLibrary':'PCZKM8TQJAH5UP5EAXTJ',
|
||
'enterpriseStandardFiling':'MQBAGJQMSRZDRX3X5AVR',
|
||
'standInvolveProject':'JURHS3LVP35US88ABULS'
|
||
}
|
||
//根据权限过滤模块数组
|
||
this.homeList = this.homeList.filter(item => {
|
||
let address=item.moduleAddress
|
||
if (this.$hasPermission(premission[address])) {
|
||
return true
|
||
} else{
|
||
return false
|
||
}
|
||
})
|
||
//流程配置模块
|
||
for (let i=0; i<this.homeListDate.length;i++){
|
||
if (this.homeListDate[i].moduleAddress==='newProcess/1' && this.homeListDate[i].flag==0){
|
||
this.homeListDate[i].moduleName='法规管理流程'
|
||
this.homeList.push(this.homeListDate[i])
|
||
}
|
||
else if (this.homeListDate[i].moduleAddress==='newProcess/2' && this.homeListDate[i].flag==0){
|
||
this.homeList.push(this.homeListDate[i])
|
||
}
|
||
else if (this.homeListDate[i].moduleAddress==='newProcess/3' && this.homeListDate[i].flag==0){
|
||
this.homeList.push(this.homeListDate[i])
|
||
}
|
||
else if (this.homeListDate[i].moduleAddress==='newProcess/4' && this.homeListDate[i].flag==0){
|
||
this.homeListDate[i].moduleName='采购翻译流程'
|
||
this.homeList.push(this.homeListDate[i])
|
||
}
|
||
else if (this.homeListDate[i].moduleAddress==='newProcess/5' && this.homeListDate[i].flag==0){
|
||
this.homeListDate[i].moduleName='会议管理流程'
|
||
this.homeList.push(this.homeListDate[i])
|
||
}
|
||
else if (this.homeListDate[i].moduleAddress==='newProcess/6' && this.homeListDate[i].flag==0){
|
||
this.homeListDate[i].moduleName='清单管理流程'
|
||
this.homeList.push(this.homeListDate[i])
|
||
}
|
||
}
|
||
}, e => {
|
||
})
|
||
},
|
||
getTaskNUmber(){
|
||
this.$http.postData('lawss/activiti/todoTaskList', {
|
||
current: 1,
|
||
size: 1,
|
||
userId: this.$store.getters.userInfo.userId,
|
||
// current: 1
|
||
}, {
|
||
_this: this
|
||
}, res => {
|
||
this.taskNUmber=res.count
|
||
}, e => {
|
||
|
||
})
|
||
},
|
||
search () {
|
||
this.$router.push({
|
||
name: 'StandardSearch',
|
||
params: {
|
||
selectKey: this.checkState,
|
||
searchValue: this.checkContent || undefined
|
||
}
|
||
})
|
||
},
|
||
// 查询用户未读动态
|
||
queryByPersonMsg () {
|
||
this.$http.get('/person/personMsg/selectNotRed', {}, {
|
||
_this: this,
|
||
loading: 'loading'
|
||
}, res => {
|
||
this.setDynamicTotal(res.data)
|
||
}, e => {
|
||
})
|
||
},
|
||
...mapMutations(['setDynamicTotal'])
|
||
},
|
||
components: {
|
||
PersonalCenter
|
||
},
|
||
props: {},
|
||
computed: {
|
||
},
|
||
watch: {
|
||
},
|
||
mounted () {
|
||
this.getTag()
|
||
this.queryByPersonMsg()
|
||
this.getTaskNUmber()
|
||
},
|
||
destroyed () {
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.home_v3 {
|
||
position: absolute;
|
||
top: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
}
|
||
.home_v3 {
|
||
height: 100%;
|
||
//background: url("~@/assets/images/shangqi/home/home-bg.png") no-repeat;
|
||
background: url("~@/assets/images/shangqi/home/BG.png") no-repeat;
|
||
background-size: cover;
|
||
padding: 6px 26px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
.header{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
color: #fff;
|
||
.header-left{
|
||
text-align: left;
|
||
width: 50%;
|
||
.logo{
|
||
display: inline-block;
|
||
width: 160px;
|
||
height: 61px;
|
||
//background: url("~@/assets/images/shangqi/home/logo-bg.png") no-repeat;
|
||
background: url("~@/assets/images/shangqi/home/logo2.png") no-repeat;
|
||
background-size: cover;
|
||
}
|
||
}
|
||
.header-right{
|
||
width: 49%;
|
||
text-align: right;
|
||
line-height: 61px;
|
||
height: 61px;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
.date{
|
||
display: inline-block;
|
||
margin-right: 20px;
|
||
}
|
||
.user-img{
|
||
display: inline-block;
|
||
width: 20px;
|
||
height: 21px;
|
||
background: url("~@/assets/images/shangqi/home/user-img.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
margin-right: 15px;
|
||
}
|
||
.divide-line{
|
||
display: inline-block;
|
||
margin-right: 20px;
|
||
}
|
||
.user{
|
||
display: inline-block;
|
||
}
|
||
}
|
||
}
|
||
.home-container{
|
||
text-align: center;
|
||
flex: auto;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
.content-title{
|
||
.content-title-logo{
|
||
p {
|
||
color: #fff;
|
||
&:first-child {
|
||
margin-bottom: 5px;
|
||
font-size: 50px;
|
||
font-weight: bold;
|
||
letter-spacing: 2px;
|
||
}
|
||
&:last-child {
|
||
font-size: 20px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.content-search {
|
||
display: inline-block;
|
||
text-align: center;
|
||
color: #fff;
|
||
margin: 50px 0;
|
||
@media screen and (min-width: 1920px) {
|
||
margin: 100px 0;
|
||
}
|
||
.content-search-box{
|
||
background-color: #fff;
|
||
display: inline-flex;
|
||
align-items: center ;
|
||
width: 560px;
|
||
height: 48px;
|
||
/deep/.el-input__inner {
|
||
height: 46px;
|
||
padding: 0 34px;
|
||
}
|
||
.el-select {
|
||
display: inline-block;
|
||
width: 155px;
|
||
/deep/input.el-input__inner{
|
||
border: none;
|
||
color: #999999;
|
||
font-family: PingFang-SC-Bold;
|
||
}
|
||
}
|
||
.home-input{
|
||
display: inline-block;
|
||
width: 400px;
|
||
/deep/input.el-input__inner{
|
||
font-size: 16px;
|
||
border: none;
|
||
}
|
||
}
|
||
.line-box{
|
||
display: inline-block;
|
||
height: 46px;
|
||
width: 2px;
|
||
padding: 10px 0;
|
||
background-color: #fff;
|
||
.line{
|
||
display: inline-block;
|
||
height: 26px;
|
||
width: 1px;
|
||
background-color: #999;
|
||
}
|
||
}
|
||
.search-btn-box{
|
||
width: 55px;
|
||
height: 46px;
|
||
padding: 9px 0 10px 10px;
|
||
background-color: #fff;
|
||
.search-btn{
|
||
width: 25px;
|
||
height: 25px;
|
||
background: url("~@/assets/images/shangqi/home/search.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
cursor:pointer
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.content-nav{
|
||
text-align: center;
|
||
.nav{
|
||
display: inline-block;
|
||
.content-nav-box {
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
flex-wrap: wrap;
|
||
width: 700px;
|
||
margin-top: -15px;
|
||
.router-link {
|
||
display: inline-block;
|
||
//margin-right: 45px;
|
||
flex: 0 0 25%;
|
||
height: 36px;
|
||
padding-top: 15px;
|
||
box-sizing: content-box;
|
||
//&:first-child {
|
||
// .nav-item {
|
||
// justify-content: center;
|
||
// padding-right: 24px;
|
||
// .text {
|
||
// flex: 1 0 90px;
|
||
// }
|
||
// }
|
||
//}
|
||
}
|
||
.nav-item {
|
||
width: 160px;
|
||
height: 100%;
|
||
color: #EEEEEE;
|
||
display: flex;
|
||
align-items: center;
|
||
background: url("~@/assets/images/shangqi/home/entry_bg.png") no-repeat;
|
||
//background-image: linear-gradient(to right, );
|
||
background-size: 100% 100%;
|
||
padding-left:20px;
|
||
border: 2px solid #4091ff;
|
||
.icon-box{
|
||
display: inline-block;
|
||
width: 18px;
|
||
height: 18px;
|
||
margin-right: 12px;
|
||
background: url("~@/assets/images/shangqi/home/firstPage-icon.png") no-repeat;
|
||
background-size: 100% 100%;
|
||
}
|
||
.icon-box1{
|
||
background: url("~@/assets/images/shangqi/home/ring-icon.png") no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
.icon-box2{
|
||
background: url("~@/assets/images/shangqi/home/message-icon.png") no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
.text{
|
||
display: inline-block;
|
||
//flex: 1 0 110px;
|
||
overflow: hidden;
|
||
}
|
||
.number-accout{
|
||
//flex: 0 0 36px;
|
||
height: 36px;
|
||
width: 36px;
|
||
line-height: 34px;
|
||
border: 2px solid #4091FF;
|
||
border-right: none;
|
||
margin-left: 14px;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
.router-link:last-child{
|
||
margin-right: 0
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.home-select {
|
||
/deep/input {
|
||
text-align: center;
|
||
}
|
||
}
|
||
.tips{
|
||
position: relative;
|
||
top: -15px;
|
||
left: 34px;
|
||
}
|
||
|
||
</style>
|