xuhuajiao
/
yxk-electronic-archives
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

门类字段管理

master
xuhuajiao 2 years ago
parent
81f84c3ecf
commit
b399218714
7 changed files with 262 additions and 101 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 107
      src/assets/styles/mixin.scss
  2. 87
      src/assets/styles/yxk-admin.scss
  3. 49
      src/views/components/field/index.vue
  4. 21
      src/views/system/field/commonFields/index.vue
  5. 21
      src/views/system/field/electronicFields/index.vue
  6. 57
      src/views/system/field/index.vue
  7. 21
      src/views/system/field/systemFields/index.vue

107
src/assets/styles/mixin.scss
View File

@ -563,4 +563,109 @@
[data-theme="light"] & {
min-height: calc(100vh - 282px);
}
}
}
@mixin row_tab_style{
[data-theme="dark"] & {
margin-top: 61px;
border: 1px solid #113d72;
.head-container{
margin: 20px;
}
.el-table__header{
border-top: 1px solid #113D72;
}
.tab-nav{
height: 41px;
line-height: 41px;
margin: -41px 0 30px -1px;
font-weight: bold;
color: #359AFC;
border-bottom: 1px solid #113D72;
li{
position: relative;
padding: 0 24px;
margin: -1px 30px 0 0;
letter-spacing: 2px;
border-top: 1px solid #113D72;
background-color: #021941;
cursor: pointer;
&::before,
&::after{
content: "";
position: absolute;
top: 0;
width: 33px;
height: 41px;
}
&::before{
left: -15px;
background: url(~@/assets/images/tab_left.png) no-repeat;
background-size: contain;
}
&::after{
right: -32px;
background: url(~@/assets/images/tab_right.png) no-repeat;
background-size: contain;
}
&:first-child{
border-left: 1px solid #113d72;;
&::before{
width: 17px;
height: 17px;
left: -1px;
top: -1px;
border-left: 1px solid $mainColor;
border-top: 1px solid $mainColor;
}
}
&.active-tab-nav{
color: #fff;
&::before{
background: url(~@/assets/images/tab_left_active.png) no-repeat;
background-size: contain;
}
&::after{
background: url(~@/assets/images/tab_right_active.png) no-repeat;
background-size: contain;
}
i{
display: block;
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
height: 1px;
border-bottom: 1px solid #021941;
}
}
}
.tab-right-img{
display: block;
width: 93px;
margin: 4px 0 0 -14px;
background: url(~@/assets/images/tab_img.png) no-repeat;
background-size: contain;
}
}
}
[data-theme="light"] & {
margin-top: 0;
.head-container{
margin: 20px 20px 20px 0;
}
.tab-nav{
color: #545B65;
padding: 0 0 0 20px;
border-bottom: 1px solid #EDEFF3;
li{
margin-right: 60px;
&.active-tab-nav{
padding-bottom: 13px;
color: #0348F3;
border-bottom: 3px solid #0348F3;
}
}
}
}
}

87
src/assets/styles/yxk-admin.scss
View File

@ -50,6 +50,20 @@
}
}
.tab-container{
@include bg_color;
@include box_padding;
.tab-content{
position: relative;
@include row_tab_style;
.tab-nav{
margin-bottom: 0;
}
}
}
.head-container {
// padding: 20px;
@ -848,90 +862,17 @@
// tab样式布局
.tab-content{
margin-top: 40px;
border-top: none;
background-color: #021941;
&::before{
display: none;
}
.tab-nav{
display: flex;
justify-content: flex-start;
height: 41px;
line-height: 41px;
margin: -41px 0 30px -1px;
font-size: 16px;
font-weight: bold;
color: #359AFC;
border-bottom: 1px solid #113D72;
li{
position: relative;
padding: 0 24px;
margin: -1px 30px 0 0;
letter-spacing: 2px;
border-top: 1px solid #113D72;
background-color: #021941;
cursor: pointer;
&::before,
&::after{
content: "";
position: absolute;
top: 0;
width: 33px;
height: 41px;
}
&::before{
left: -15px;
background: url(~@/assets/images/tab_left.png) no-repeat;
background-size: contain;
}
&::after{
right: -32px;
background: url(~@/assets/images/tab_right.png) no-repeat;
background-size: contain;
}
&:first-child{
border-left: 1px solid #113d72;;
&::before{
width: 17px;
height: 17px;
left: -1px;
top: -1px;
border-left: 1px solid $mainColor;
border-top: 1px solid $mainColor;
}
}
&.active-tab-nav{
color: #fff;
&::before{
background: url(~@/assets/images/tab_left_active.png) no-repeat;
background-size: contain;
}
&::after{
background: url(~@/assets/images/tab_right_active.png) no-repeat;
background-size: contain;
}
i{
display: block;
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
height: 1px;
border-bottom: 1px solid #021941;
}
}
}
.tab-right-img{
display: block;
width: 93px;
margin: 4px 0 0 -14px;
background: url(~@/assets/images/tab_img.png) no-repeat;
background-size: contain;
}
}
.el-table__header{
border-top: 1px solid #113D72;
}
}

49
src/views/components/field/index.vue
View File

@ -1,34 +1,29 @@
<template>
<div class="app-container">
<div>
<!--工具栏-->
<div class="head-container" style="padding:0 0 20px 0">
<div class="head-container">
<crudOperation :permission="permission" />
</div>
<div class="container-wrap" style="min-height: calc(100vh - 241px);">
<span class="right-top-line" />
<span class="left-bottom-line" />
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 263px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="序号" width="55" />
<el-table-column prop="fieldCnName" label="中文名称" />
<el-table-column prop="fieldName" label="字段标识" />
<el-table-column label="数据类型">
<template slot-scope="scope">
<span v-if="scope.row.isDataType === 1">字符</span>
<span v-if="scope.row.isDataType === 2">数字</span>
</template>
</el-table-column>
<el-table-column prop="isColumnLength" label="字段长度" />
<el-table-column label="默认值">
<template slot-scope="scope">
<span v-if="scope.row.isDefaultValue === ''">-</span>
<span v-else>{{ scope.row.isDefaultValue }}</span>
</template>
</el-table-column>
</el-table>
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 273px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="序号" width="55" />
<el-table-column prop="fieldCnName" label="中文名称" />
<el-table-column prop="fieldName" label="字段标识" />
<el-table-column label="数据类型">
<template slot-scope="scope">
<span v-if="scope.row.isDataType === 1">字符</span>
<span v-if="scope.row.isDataType === 2">数字</span>
</template>
</el-table-column>
<el-table-column prop="isColumnLength" label="字段长度" />
<el-table-column label="默认值">
<template slot-scope="scope">
<span v-if="scope.row.isDefaultValue === ''">-</span>
<span v-else>{{ scope.row.isDefaultValue }}</span>
</template>
</el-table-column>
</el-table>
<!--表单渲染-->
<eForm ref="eform" />
<el-dialog title="关键提示" :visible.sync="verifyDialogVisible" :before-close="handleClose">

21
src/views/system/field/commonFields/index.vue
View File

@ -0,0 +1,21 @@
<template>
<field title="常用字段" :is-type="2" permission-str="commonFields" />
</template>
<script>
import Field from '@/views/components/field'
export default {
name: 'CommonFields',
components: { Field }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep thead .el-table-column--selection .cell {
display: none;
}
::v-deep div.el-dialog__footer {
text-align: center;
}
</style>

21
src/views/system/field/electronicFields/index.vue
View File

@ -0,0 +1,21 @@
<template>
<field title="电子文件字段" :is-type="3" permission-str="electronicFields" />
</template>
<script>
import Field from '@/views/components/field'
export default {
name: 'ElectronicFields',
components: { Field }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep thead .el-table-column--selection .cell {
display: none;
}
::v-deep div.el-dialog__footer {
text-align: center;
}
</style>

57
src/views/system/field/index.vue
View File

@ -0,0 +1,57 @@
<template>
<div class="app-container tab-container">
<div class="tab-content">
<span class="right-top-line" />
<span class="left-bottom-line" />
<span class="right-bottom-line" />
<ul class="tab-nav">
<li :class="{ 'active-tab-nav': activeIndex == 0 }" @click="changeActiveTab(0)">常用字段<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 1 }" @click="changeActiveTab(1)">系统字段<i /></li>
<li :class="{ 'active-tab-nav': activeIndex == 2 }" @click="changeActiveTab(2)">电子文件字段<i /></li>
<!-- 最右侧装饰img -->
<span class="tab-right-img" />
</ul>
<component :is="comName" />
</div>
</div>
</template>
<script>
import commonFields from './commonFields/index.vue'
import electronicFields from './electronicFields/index.vue'
import systemFields from './systemFields/index.vue'
export default {
name: 'FiledManage',
components: {
commonFields,
electronicFields,
systemFields
},
data() {
return {
activeIndex: 0
}
},
computed: {
comName: function() {
if (this.activeIndex === 0) {
return 'commonFields'
} else if (this.activeIndex === 1) {
return 'electronicFields'
} else if (this.activeIndex === 2) {
return 'systemFields'
}
return 'commonFields'
}
},
methods: {
changeActiveTab(data) {
this.activeIndex = data
}
}
}
</script>
<style lang="scss" scoped>
</style>

21
src/views/system/field/systemFields/index.vue
View File

@ -0,0 +1,21 @@
<template>
<field title="系统字段" :is-type="1" permission-str="systemFields" />
</template>
<script>
import Field from '@/views/components/field'
export default {
name: 'SystemFields',
components: { Field }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep thead .el-table-column--selection .cell {
display: none;
}
::v-deep div.el-dialog__footer {
text-align: center;
}
</style>
Write Preview
Loading…
Cancel
Save