intellioa
/
super-fusion-platform
mirror of http://10.10.14.221/feiliming/oa-project-vue.git
6
0
Fork 0
Code Issues Projects Releases Wiki Activity

电子资料库tab样式

Browse Source
init
zhusiyu 3 years ago
parent e429814025
commit fb8bf676f6
3 changed files with 126 additions and 108 deletions
Show Stats Download Patch File Download Diff File

220
src/views/screenAdaptation/pages/adminCenter/moduleCom/oa/electronicdDatabases/component/dataBaseTitle.vue
Unescape View File

@ -1,27 +1,34 @@
<template> <template>
<div class="dataBaseTitle"> <div class="dataBaseTitle">
<a-row style="position: relative;" class="dataBaseTitleRow" type="flex" justify="space-between"> <a-row style="position: relative;" class="dataBaseTitleRow">
<a-col :key="1" :class="{'file-tab':!isActive1,'file-tab-active':isActive1}" <div class="col-item-style" v-if="orgPower">
@click.native="tabChange(1)"> <a-col :key="1" :class="{'file-tab':!isActive1,'file-tab-active':isActive1}"
<span class="title-tab-title">机构文件</span> @click.native="tabChange(1)">
<a-icon type="hdd" class="title-tab-icon"/> <span class="title-tab-title">机构文件</span>
<span class="tile-tab-cricle"></span> <a-icon type="hdd" class="title-tab-icon"/>
</a-col> <span class="tile-tab-cricle"></span>
<a-icon type="caret-down" class="active-icon1" v-show="isActive1"/> </a-col>
<a-col :key="2" :class="{'file-tab':!isActive2,'file-tab-active':isActive2}" <a-icon type="caret-down" class="active-icon" v-show="isActive1"/>
@click.native="tabChange(2)"> </div>
<span class="title-tab-title">个人文件</span> <div class="col-item-style" v-if="personalPower">
<a-icon type="user" class="title-tab-icon"/> <a-col :key="2" :class="{'file-tab':!isActive2,'file-tab-active':isActive2}"
<span class="tile-tab-cricle"></span> @click.native="tabChange(2)">
</a-col> <span class="title-tab-title">个人文件</span>
<a-icon type="caret-down" class="active-icon2" v-show="isActive2"/> <a-icon type="user" class="title-tab-icon"/>
<a-col :key="3" :class="{'file-tab':!isActive3,'file-tab-active':isActive3}" <span class="tile-tab-cricle"></span>
@click.native="tabChange(3)"> </a-col>
<span class="title-tab-title">分享文件</span> <a-icon type="caret-down" class="active-icon" v-show="isActive2"/>
<a-icon type="share-alt" class="title-tab-icon"/> </div>
<span class="tile-tab-cricle"></span> <div class="col-item-style" v-if="sharePower">
</a-col> <a-col :key="3" :class="{'file-tab':!isActive3,'file-tab-active':isActive3}"
<a-icon type="caret-down" class="active-icon3" v-show="isActive3"/> @click.native="tabChange(3)">
<span class="title-tab-title">分享文件</span>
<a-icon type="share-alt" class="title-tab-icon"/>
<span class="tile-tab-cricle"></span>
</a-col>
<a-icon type="caret-down" class="active-icon" v-show="isActive3"/>
</div>
</a-row> </a-row>
<div class="tabContent"> <div class="tabContent">
<InstitutionalDocuments v-if="isActive1"/> <InstitutionalDocuments v-if="isActive1"/>
@ -36,10 +43,11 @@
import personalDocument from './personalDocument.vue'; import personalDocument from './personalDocument.vue';
import shareDocuments from './shareDocuments.vue'; import shareDocuments from './shareDocuments.vue';
import OfficeMenuConfig from '../../../../../../../../../src/utils/officeMenuConfig'; import OfficeMenuConfig from '../../../../../../../../../src/utils/officeMenuConfig';
export default ({ export default ({
data() { data() {
return { return {
isActive1: true, isActive1: false,
isActive2: false, isActive2: false,
isActive3: false, isActive3: false,
orgPower: false,//机构文件权限 orgPower: false,//机构文件权限
@ -47,13 +55,23 @@
sharePower: false,//分享文件权限 sharePower: false,//分享文件权限
} }
}, },
created(){ created() {
//机构文件权限 //机构文件权限
this.orgPower = OfficeMenuConfig.menuIsExist(["electronicMaterials", "agencyDocuments1"]); this.orgPower = OfficeMenuConfig.menuIsExist(["electronicMaterials", "agencyDocuments1"]);
//个人文件权限 //个人文件权限
this.personalPower = OfficeMenuConfig.menuIsExist(["electronicMaterials", "personalFiles"]); this.personalPower = OfficeMenuConfig.menuIsExist(["electronicMaterials", "personalFiles"]);
//分享文件权限 //分享文件权限
this.sharePower = OfficeMenuConfig.menuIsExist(["electronicMaterials", "shareFiles"]); this.sharePower = OfficeMenuConfig.menuIsExist(["electronicMaterials", "shareFiles"]);
if (this.orgPower) {
this.isActive1 = true;
} else {
if (this.personalPower) {
this.isActive2 = true;
} else {
this.isActive3 = true;
}
}
}, },
components: { components: {
AIcon: Icon, AIcon: Icon,
@ -90,93 +108,99 @@
.dataBaseTitle { .dataBaseTitle {
width: 100%; width: 100%;
.dataBaseTitleRow { .dataBaseTitleRow {
display: flex;
justify-content: space-around;
width: 100%; width: 100%;
padding-right: 8px; padding-right: 8px;
margin-right: 26px; margin-right: 26px;
margin-bottom: 20px; margin-bottom: 20px;
/deep/ .ant-row:nth-last-child { .col-item-style {
margin-bottom: 0;
}
.file-tab {
width: 32%; width: 32%;
height: 4rem;
background: #20337E;
border-radius: 10px;
color: #80F9F0;
position: relative; position: relative;
cursor: pointer; .active-icon {
overflow: hidden;
.title-tab-title {
display: inline-block;
position: absolute; position: absolute;
bottom: 4px; bottom: -22px;
right: 19px; left: 52px;
z-index: 99; font-size: 22px;
font-size: 13px; color: #027DB3;
}
.title-tab-icon {
display: inline-block;
position: absolute;
top: 11px;
left: 10px;
font-size: 25px;
}
.tile-tab-cricle {
width: 84px;
height: 84px;
border-radius: 50%;
background: #02618A;
display: inline-block;
position: absolute;
bottom: -42px;
right: 4px;
}
}
.file-tab-active {
width: 32%;
height: 4rem;
background: #027DB3;
border-radius: 10px;
color: #80F9F0;
position: relative;
cursor: pointer;
overflow: hidden;
.title-tab-title {
display: inline-block; display: inline-block;
position: absolute; float: left;
bottom: 4px;
right: 19px;
z-index: 99;
font-size: 13px;
} }
.title-tab-icon { .file-tab {
display: inline-block; width: 100%;
position: absolute; height: 4rem;
top: 11px; background: #20337E;
left: 10px; border-radius: 10px;
font-size: 25px; color: #80F9F0;
position: relative;
cursor: pointer;
overflow: hidden;
.title-tab-title {
display: inline-block;
position: absolute;
bottom: 4px;
right: 19px;
z-index: 99;
font-size: 13px;
}
.title-tab-icon {
display: inline-block;
position: absolute;
top: 11px;
left: 10px;
font-size: 25px;
}
.tile-tab-cricle {
width: 84px;
height: 84px;
border-radius: 50%;
background: #02618A;
display: inline-block;
position: absolute;
bottom: -42px;
right: 4px;
}
} }
.tile-tab-cricle { .file-tab-active {
width: 84px; width: 100%;
height: 84px; height: 4rem;
border-radius: 50%; background: #027DB3;
background: #02618A; border-radius: 10px;
display: inline-block; color: #80F9F0;
position: absolute; position: relative;
bottom: -42px; cursor: pointer;
right: 4px; overflow: hidden;
.title-tab-title {
display: inline-block;
position: absolute;
bottom: 4px;
right: 19px;
z-index: 99;
font-size: 13px;
}
.title-tab-icon {
display: inline-block;
position: absolute;
top: 11px;
left: 10px;
font-size: 25px;
}
.tile-tab-cricle {
width: 84px;
height: 84px;
border-radius: 50%;
background: #02618A;
display: inline-block;
position: absolute;
bottom: -42px;
right: 4px;
}
} }
} }
/deep/ .ant-row:nth-last-child {
.active-icon1 { margin-bottom: 0;
position: absolute;
bottom: -22px;
left: 52px;
font-size: 22px;
color: #027DB3;
display: inline-block;
float: left;
} }
.active-icon2 { .active-icon2 {
position: absolute; position: absolute;
bottom: -22px; bottom: -22px;

9
src/views/screenAdaptation/pages/adminCenter/moduleCom/oa/electronicdDatabases/component/shareDocuments.vue
Unescape View File

@ -9,12 +9,9 @@
<vue-scroll :ops="listScroll" :style="showPage?'height:19rem':'height:19rem'" <vue-scroll :ops="listScroll" :style="showPage?'height:19rem':'height:19rem'"
class="score-list-div" v-if="!dataSouresEmpty"> class="score-list-div" v-if="!dataSouresEmpty">
<a-row v-for="(item,i) in dataSoures" :key="i"> <a-row v-for="(item,i) in dataSoures" :key="i">
<a-col v-if="item.file_type == 0" :span="1"> <a-col :span="1">
<a-icon type="file-text" style="color:#576499;"/> <a-icon type="file-text" style="color:#576499;"/>
</a-col> </a-col>
<a-col v-else-if="item.file_type == 1" :span="1">
<a-icon type="folder-open" style="color:#F2F2F2;"/>
</a-col>
<a-col :span="14" style="margin-left: 4px;margin-right: 8px;cursor: pointer" <a-col :span="14" style="margin-left: 4px;margin-right: 8px;cursor: pointer"
@click.native="showFiles(item)">{{item.file_name}} @click.native="showFiles(item)">{{item.file_name}}
</a-col> </a-col>
@ -27,10 +24,10 @@
<vue-scroll :ops="listScroll" :style="showPage?'height:19rem':'height:19rem'" <vue-scroll :ops="listScroll" :style="showPage?'height:19rem':'height:19rem'"
class="score-list-div" v-if="!dataSouresEmpty"> class="score-list-div" v-if="!dataSouresEmpty">
<a-row v-for="(item,i) in dataSoures" :key="i"> <a-row v-for="(item,i) in dataSoures" :key="i">
<a-col v-if="item.file_type == 0" :span="1"> <a-col v-if="item.file_type == 1" :span="1">
<a-icon type="file-text" style="color:#576499;"/> <a-icon type="file-text" style="color:#576499;"/>
</a-col> </a-col>
<a-col v-else-if="item.file_type == 1" :span="1"> <a-col v-else-if="item.file_type == 0" :span="1">
<a-icon type="folder-open" style="color:#F2F2F2;"/> <a-icon type="folder-open" style="color:#F2F2F2;"/>
</a-col> </a-col>
<a-col :span="14" style="margin-left: 4px;margin-right: 8px;cursor: pointer" <a-col :span="14" style="margin-left: 4px;margin-right: 8px;cursor: pointer"

5
src/views/screenAdaptation/pages/adminCenter/moduleCom/oa/electronicdDatabases/component/shareDocumentsLarge.vue
Unescape View File

@ -9,12 +9,9 @@
:style="showPage?'height:16rem':'height:16rem'" :style="showPage?'height:16rem':'height:16rem'"
class="score-list-div"> class="score-list-div">
<a-row v-for="(item,i) in dataSoures" :key="i"> <a-row v-for="(item,i) in dataSoures" :key="i">
<a-col v-if="item.file_type == 1" :span="1"> <a-col :span="1">
<a-icon type="file-text" style="color:#576499;"/> <a-icon type="file-text" style="color:#576499;"/>
</a-col> </a-col>
<a-col v-else-if="item.file_type == 0" :span="1">
<a-icon type="folder-open" style="color:#F2F2F2;"/>
</a-col>
<a-col :span="11" style="cursor: pointer" @click.native="showFiles(item)"> <a-col :span="11" style="cursor: pointer" @click.native="showFiles(item)">
{{item.file_name}} {{item.file_name}}
</a-col> </a-col>

Write Preview
Loading…
Cancel
Save