code init
This commit is contained in:
chenxiaoxi
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<div class="wx-card" @click="toPage">
|
||||
<div style="">
|
||||
<div>
|
||||
<i class="icon" :class="icon" />
|
||||
</div>
|
||||
<div style="margin-top: 20px;">
|
||||
<span>{{ label }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'EnterCard',
|
||||
props: ['icon', 'label', 'path'],
|
||||
methods: {
|
||||
toPage() {
|
||||
this.$router.push(this.path)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.wx-card {
|
||||
width: 140px;
|
||||
height: 120px;
|
||||
border: 2px solid #4091FF;
|
||||
background: rgba(0, 72, 158, 0.8);
|
||||
box-shadow: 0px 0px 21px 0px rgba(5, 20, 62, 0.41);
|
||||
border-radius: 15px;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div class="wx-item" style="display: block;">
|
||||
<div class="wx-label" style="height: 60px;display: flex;justify-content: center;align-items: center;">
|
||||
<el-badge :value="badgeNumber" :max="99" class="tips" v-if="badgeVisible">
|
||||
<i :class="icon" style="margin-right: 5px;"></i> {{ label }}
|
||||
</el-badge>
|
||||
<template v-else>
|
||||
<i :class="icon" style="margin-right: 5px;"></i> {{ label }}
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TabLabel',
|
||||
props: [
|
||||
'icon', // 图标
|
||||
'label', // 标题
|
||||
'badgeNumber' // 标记数量
|
||||
],
|
||||
computed: {
|
||||
/**
|
||||
* 判断是否显示标记
|
||||
* @returns {*}
|
||||
*/
|
||||
badgeVisible() {
|
||||
return this.badgeNumber
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.wx-item {
|
||||
padding: 15px 0;
|
||||
}
|
||||
/*.wx-label {*/
|
||||
/* background: linear-gradient(90deg, rgba(66, 143, 222, 0.1), rgba(66, 143, 222, 0.5) 47%, rgba(66, 143, 222, 0.5) 53%, rgba(66, 143, 222, 0.1));*/
|
||||
/*}*/
|
||||
</style>
|
||||
@@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<ul class="wx-list" style="display: block;text-align: left;height: 100%">
|
||||
<el-scrollbar>
|
||||
<slot>
|
||||
<li>暂无数据</li>
|
||||
</slot>
|
||||
</el-scrollbar>
|
||||
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TabList'
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.wx-list {
|
||||
padding: 30px;
|
||||
.el-scrollbar {
|
||||
height: 100%;
|
||||
/deep/.el-scrollbar__wrap {
|
||||
overflow-x: hidden;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<li class="wx-list-item clearfix" style="position: relative">
|
||||
<el-tooltip :disabled="tooltipDisabled" :content="title" placement="bottom" effect="dark">
|
||||
<!--<el-button @click="disabled = !disabled">点击{{disabled ? '开启' : '关闭'}} tooltip 功能</el-button>-->
|
||||
<span ref="title" class="title" @click="$emit('click')">{{ title }}</span>
|
||||
</el-tooltip>
|
||||
<span class="time">{{ timeFormat }}</span>
|
||||
</li>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {dateFormat} from '@/common/date'
|
||||
export default {
|
||||
name: 'TabListItem',
|
||||
props: ['title', 'time'],
|
||||
data() {
|
||||
return {
|
||||
tooltipDisabled: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
timeFormat() {
|
||||
return this.time ? dateFormat(this.time) : ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const el = this.$refs.title
|
||||
el && (this.tooltipDisabled = el.clientWidth === el.scrollWidth)
|
||||
},
|
||||
methods:{
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.title {
|
||||
max-width: calc(100% - 90px);
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.time {
|
||||
width: 85px;
|
||||
float: right;
|
||||
}
|
||||
.wx-list-item {
|
||||
position: relative;
|
||||
padding: 8px 10px 8px 0;
|
||||
}
|
||||
.title:hover::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
/*width: 100%;*/
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 0;
|
||||
bottom: 0;
|
||||
border-bottom: 1px solid #ffffff;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div>
|
||||
<component :is="componentId"></component>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import home1 from './index'
|
||||
import home2 from './information'
|
||||
export default {
|
||||
name: 'homeContainer',
|
||||
components: {
|
||||
home1,
|
||||
home2
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
componentId: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
const userInfo = this.$store.getters.userInfo || {}
|
||||
let userRoleIds = userInfo.userRoleIds || ''
|
||||
if (userRoleIds) {
|
||||
if (userRoleIds[userRoleIds.length - 1] === ',') {
|
||||
userRoleIds = userRoleIds.slice(0, userRoleIds.length - 1)
|
||||
}
|
||||
}
|
||||
const userRoleIdArr = userRoleIds.split(',')
|
||||
// const hasRole = userRoleArr.some(item => item.match(/工程师|FO|VSE|联络人/g))
|
||||
// const hasRole = userRoleIdArr.some(item => item.match(/HH8HPACMTVEVGEODSERE/g))
|
||||
const hasRole = userRoleIdArr.length === 1 && userRoleIdArr[0] === 'HH8HPACMTVEVGEODSERE'
|
||||
if (hasRole) {
|
||||
this.componentId = 'home1'
|
||||
} else {
|
||||
this.componentId = 'home2'
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="" scoped>
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,464 @@
|
||||
<!-- 长城项目 首页 -->
|
||||
<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-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-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;
|
||||
border-radius: 24px;
|
||||
display: inline-flex;
|
||||
align-items: center ;
|
||||
width: 560px;
|
||||
height: 48px;
|
||||
/deep/.el-input__inner {
|
||||
height: 46px;
|
||||
border-radius: 0;
|
||||
padding: 0 34px;
|
||||
}
|
||||
.el-select {
|
||||
display: inline-block;
|
||||
width: 155px;
|
||||
/deep/input.el-input__inner{
|
||||
border: none;
|
||||
border-radius: 24px 0 0 24px !important;
|
||||
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;
|
||||
border-radius: 0 24px 24px 0;
|
||||
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-radius: 18px;
|
||||
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-radius: 50%;;
|
||||
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>
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user