Skip to content

F
founder_vue
Commit c031e9a3 by 米嘉伟
Options

系统管理-系统分库管理，点击每条数据后面操作栏中的“数据管理”按钮，系统没有任何反应

parent 3ed9a384
Showing with 432 additions and 351 deletions
src/views/xtfkgl/AjXtljfkView.vue
<template>
<div class="root-view-div">
<!-- 表格 -->
<div class="table">
<el-table
:height="height"
style="width: 100%"
ref="multipleTable"
:data="tableDate"
:row-key="getRowKeys"
class="table">
<el-table-column prop="logicName" :label="$t('Xtfkgl.sub_database_name')" :width="width1" show-overflow-tooltip></el-table-column>
<el-table-column prop="sjkyh" :label="$t('Xtfkgl.database_user_group_user')" :width="width2">
<template slot-scope="scope">
<div v-if='scope.row.groups && scope.row.groups.length >0' class="tagsBox">
<div v-for="item in strArr(scope.row.groups)" :key="item.logicId"
v-show="item !== ''">
<div v-if="item.type === 1 && item.user && item.user.length >0">
<el-tooltip
effect="dark"
placement="bottom"
:open-delay="300">
<div :class="{ tags: true, tagszu: item.type === 1 }">{{ item.name }}</div>
<div slot="content" class="tooTipBtn" style="padding: 10px;">
<div v-for="it in item.user"
:title="it.name"
:key="it.id">
{{ it.name }}
</div>
</div>
</el-tooltip>
</div>
<div v-else class="tags">
{{ item.name }}
</div>
</div>
<el-tooltip
:ref="'ajTooltipP'+scope.row.logicId"
class="item"
effect="dark"
placement="right"
:manual="true"
:open-delay="300"
v-model="scope.row.disabled"
v-if="scope.row.groups && scope.row.groups.length > 4">
<span style="margin-left: 5px"
@mouseenter.stop="showMoreYhView(scope.$index)"
@mouseout.stop="showMoreYhView(scope.$index,true)">...</span>
<div slot="content" class="tooTipBtn" @mouseover="showMoreYhView(scope.$index)"
@mouseleave="hideMoreYhView()">
<div v-for="(item,index) in scope.row.groups" :key="index">
<div v-if="item.type === 1 && item.user && item.user.length >0">
<el-tooltip
:ref="'ajTooltipC'+item.id"
class="two-tooltip"
effect="dark"
placement="right"
style="transform: translateX(8px);">
<div :class="{divtext:item.type === 1}"
style="padding-right: 8px">
{{item.name }}
</div>
<div ref="kkk" slot="content" class="tooTipBtn"
@mouseover.stop="moveChildView()"
@mouseleave.stop="outChildView()">
<div
v-for="it in item.user"
:title="it.name"
:key="it.id">
{{ it.name }}
</div>
</div>
</el-tooltip>
</div>
<div v-else>
{{ item.name }}
</div>
</div>
</div>
</el-tooltip>
<div class="root-view-div">
<!-- 表格 -->
<div class="table">
<el-table
:height="height"
style="width: 100%"
ref="multipleTable"
:data="tableDate"
:row-key="getRowKeys"
class="table"
>
<el-table-column
prop="logicName"
:label="$t('Xtfkgl.sub_database_name')"
:width="width1"
show-overflow-tooltip
></el-table-column>
<el-table-column
prop="sjkyh"
:label="$t('Xtfkgl.database_user_group_user')"
:width="width2"
>
<template slot-scope="scope">
<div
v-if='scope.row.groups && scope.row.groups.length >0'
class="tagsBox"
>
<div
v-for="item in strArr(scope.row.groups)"
:key="item.logicId"
v-show="item !== ''"
>
<div v-if="item.type === 1 && item.user && item.user.length >0">
<el-tooltip
effect="dark"
placement="bottom"
:open-delay="300"
>
<div :class="{ tags: true, tagszu: item.type === 1 }">{{ item.name }}</div>
<div
slot="content"
class="tooTipBtn"
style="padding: 10px;"
>
<div
v-for="it in item.user"
:title="it.name"
:key="it.id"
>
{{ it.name }}
</div>
</div>
</el-tooltip>
</div>
<div
v-else
class="tags"
>
{{ item.name }}
</div>
</div>
<el-tooltip
:ref="'ajTooltipP'+scope.row.logicId"
class="item"
effect="dark"
placement="right"
:manual="true"
:open-delay="300"
v-model="scope.row.disabled"
v-if="scope.row.groups && scope.row.groups.length > 4"
>
<span
style="margin-left: 5px"
@mouseenter.stop="showMoreYhView(scope.$index)"
@mouseout.stop="showMoreYhView(scope.$index,true)"
>...</span>
<div
slot="content"
class="tooTipBtn"
@mouseover="showMoreYhView(scope.$index)"
@mouseleave="hideMoreYhView()"
>
<div
v-for="(item,index) in scope.row.groups"
:key="index"
>
<div v-if="item.type === 1 && item.user && item.user.length >0">
<el-tooltip
:ref="'ajTooltipC'+item.id"
class="two-tooltip"
effect="dark"
placement="right"
style="transform: translateX(8px);"
>
<div
:class="{divtext:item.type === 1}"
style="padding-right: 8px"
>
{{item.name }}
</div>
<div
ref="kkk"
slot="content"
class="tooTipBtn"
@mouseover.stop="moveChildView()"
@mouseleave.stop="outChildView()"
>
<div
v-for="it in item.user"
:title="it.name"
:key="it.id"
>
{{ it.name }}
</div>
</div>
<div v-else>---</div>
</template>
</el-table-column>
<el-table-column prop="createTime" :label="$t('Xtfkgl.creation_time')" :width="width3"></el-table-column>
<el-table-column prop="qyzt" :label="$t('UserManage.enable_status')" :width="width4">
<template slot-scope="scope">
<div v-if="scope.row.status === 1" class="circle-red"></div>
<div v-if="scope.row.status === 0" class="circle-blue"></div>
{{
</el-tooltip>
</div>
<div v-else>
{{ item.name }}
</div>
</div>
</div>
</el-tooltip>
</div>
<div v-else>---</div>
</template>
</el-table-column>
<el-table-column
prop="createTime"
:label="$t('Xtfkgl.creation_time')"
:width="width3"
></el-table-column>
<el-table-column
prop="qyzt"
:label="$t('UserManage.enable_status')"
:width="width4"
>
<template slot-scope="scope">
<div
v-if="scope.row.status === 1"
class="circle-red"
></div>
<div
v-if="scope.row.status === 0"
class="circle-blue"
></div>
{{
scope.row.status === 1
? $t('UserManage.deactivate')
: scope.row.status === 0
? $t('UserManage.enable')
: $t('UserManage.no_status')
}}
</template>
</el-table-column>
<el-table-column prop="des" :label="$t('Xtfkgl.logical_library_description')" :width="width5" show-overflow-tooltip :formatter="$fFormatUtil.valueFormat">
<template slot-scope="scope">
<div v-if="scope.row.des">
<el-tooltip effect="dark" :content="scope.row.des" placement="top">
<div>
{{ scope.row.des.length > 11 ? scope.row.des.slice(0,11) + '...' : scope.row.des }}
</div>
</el-tooltip>
</div>
<div v-else>---</div>
</template>
</el-table-column>
<el-table-column prop="cz" :label="$t('Common.option')" width="auto">
<template slot-scope="scope">
<el-tooltip
effect="dark"
:content="$t('Common.compile')"
placement="top"
:open-delay="500">
<svg class="icon" aria-hidden="true" @click.stop="goBj(scope.row)"
style="width: 1.125rem;height: 1.125rem; margin-right: 1.125rem;cursor: pointer;">
<use xlink:href="#icon-bianji" />
</svg>
</el-tooltip>
<el-tooltip
effect="dark"
:content="$t('Xtfkgl.workflow')"
placement="top"
:open-delay="500">
<svg class="icon" aria-hidden="true" @click.stop="goGzl(scope.row)"
style="width: 1.125rem;height: 1.125rem; margin-right: 1.125rem;cursor: pointer;">
<use xlink:href="#icon-gongzuoliu" />
</svg>
</el-tooltip>
<el-tooltip
</template>
</el-table-column>
<el-table-column
prop="des"
:label="$t('Xtfkgl.logical_library_description')"
:width="width5"
show-overflow-tooltip
:formatter="$fFormatUtil.valueFormat"
>
<template slot-scope="scope">
<div v-if="scope.row.des">
<el-tooltip
effect="dark"
:content="scope.row.des"
placement="top"
>
<div>
{{ scope.row.des.length > 11 ? scope.row.des.slice(0,11) + '...' : scope.row.des }}
</div>
</el-tooltip>
</div>
<div v-else>---</div>
</template>
</el-table-column>
<el-table-column
prop="cz"
:label="$t('Common.option')"
width="auto"
>
<template slot-scope="scope">
<el-tooltip
effect="dark"
:content="$t('Common.compile')"
placement="top"
:open-delay="500"
>
<svg
class="icon"
aria-hidden="true"
@click.stop="goBj(scope.row)"
style="width: 1.125rem;height: 1.125rem; margin-right: 1.125rem;cursor: pointer;"
>
<use xlink:href="#icon-bianji" />
</svg>
</el-tooltip>
<el-tooltip
effect="dark"
:content="$t('Xtfkgl.workflow')"
placement="top"
:open-delay="500"
>
<svg
class="icon"
aria-hidden="true"
@click.stop="goGzl(scope.row)"
style="width: 1.125rem;height: 1.125rem; margin-right: 1.125rem;cursor: pointer;"
>
<use xlink:href="#icon-gongzuoliu" />
</svg>
</el-tooltip>
<!-- <el-tooltip
effect="dark"
:content="$t('Xtfkgl.data_management')"
placement="top"
......@@ -149,35 +231,35 @@
style="width: 1.125rem;height: 1.125rem; margin-right: 1.125rem;cursor: pointer;">
<use xlink:href="#icon-shujuguanli" />
</svg>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页-->
<div class="footer">
<span class="count">{{$t('Common.all')}}&nbsp;{{ total }}&nbsp;{{$t('Common.item')}}{{$t('Common.record')}} {{$t('Common.di')}}{{ currPage }}/{{totalPage}}{{$t('Common.page')}}</span>
<div class="page">
<el-pagination
class="paging"
@current-change="handleCurrentChange"
:current-page="currPage"
:page-size="pageSize"
background
layout="prev, pager, next"
:total="total"
>
</el-pagination>
</div>
</div>
</el-tooltip> -->
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页-->
<div class="footer">
<span class="count">{{$t('Common.all')}}&nbsp;{{ total }}&nbsp;{{$t('Common.item')}}{{$t('Common.record')}} {{$t('Common.di')}}{{ currPage }}/{{totalPage}}{{$t('Common.page')}}</span>
<div class="page">
<el-pagination
class="paging"
@current-change="handleCurrentChange"
:current-page="currPage"
:page-size="pageSize"
background
layout="prev, pager, next"
:total="total"
>
</el-pagination>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'AjXtljfkView',
data() {
data () {
return {
// 用户列表的表格宽度
width1: 150, //分库名称
......@@ -199,7 +281,7 @@ export default {
isInChildView: false,
}
},
created() {
created () {
let w1 = 1920
let w2 = window.innerWidth
......@@ -214,7 +296,7 @@ export default {
// this.initTestData()
// this.getList()
},
mounted() {
mounted () {
let _that = this
document.addEventListener('click', function (e) {
_that.hideMoreYhView()
......@@ -222,14 +304,14 @@ export default {
this.getList()
},
methods: {
moveChildView() {
moveChildView () {
this.isInChildView = true
},
outChildView() {
outChildView () {
this.isInChildView = false
this.hideMoreYhView()
},
showMoreYhView(index, openTimeOut = false) {
showMoreYhView (index, openTimeOut = false) {
var _that = this
this.isInParentView = true
if (this.curMoreYhViewIndex !== index && this.curMoreYhViewIndex >= 0) {
......@@ -252,7 +334,7 @@ export default {
}, 200)
}
},
hideMoreYhView(isDelay = true) {
hideMoreYhView (isDelay = true) {
let _that = this
if (isDelay) {
......@@ -278,13 +360,13 @@ export default {
}
},
getRowKeys(row) {
getRowKeys (row) {
return row.logicId
},
loadData() { // 如果是新增重新加载， 如果是编辑刷新当前页数据
loadData () { // 如果是新增重新加载， 如果是编辑刷新当前页数据
this.getList()
},
initTestData() {
initTestData () {
// 测试数据出初始化
let _that = this
for (var i = 0; i < 10; i++) {
......@@ -299,48 +381,48 @@ export default {
}
// logger.info(_that.tableDate)
},
initGroupData(index) {
initGroupData (index) {
index += 4
let yhs = []
let sta
for (let i = 0; i < index % 9 + 1; i++) {
let type = Math.floor(Math.random() * 2)
yhs.push({
id: i,
name: '长沙市高级质量检查11111111',
type: type,
user: type === 1 ? this.initYhData(index) : null
}
id: i,
name: '长沙市高级质量检查11111111',
type: type,
user: type === 1 ? this.initYhData(index) : null
}
)
}
return yhs
},
initYhData(index) {
initYhData (index) {
let yhs = []
for (let i = 0; i < index % 4 + 1; i++) {
yhs.push({
id: i,
name: '长沙市高级质量检查'
}
id: i,
name: '长沙市高级质量检查'
}
)
}
return yhs
},
goBj(info) {
goBj (info) {
//TODO...编辑.
this.$emit('openBj', info)
},
goGzl(info) {
goGzl (info) {
//TODO.... 工作流
this.$emit('openGzl', info)
},
goSjgl() {
goSjgl () {
//TODO....数据管理
this.$emit('openSjgl')
},
strArr(arr) {
strArr (arr) {
if (!arr) return arr
// logger.info(arr)
let newArr = []
......@@ -352,11 +434,11 @@ export default {
return newArr
},
handleCurrentChange(page) {
handleCurrentChange (page) {
var _that = this
_that.getList(page)
},
getList(page = 1, limit = this.pageSize) {
getList (page = 1, limit = this.pageSize) {
let _that = this
let ruleForm = {}
this.currPage = page
......@@ -380,201 +462,200 @@ export default {
</script>
<style scoped lang="scss">
// 去除table表格最底部边框
.el-table__row > td {
border: none;
}
// 去除table表格最底部边框
.el-table::before {
height: 0px;
}
/deep/ .el-table .el-table__header-wrapper tr th {
background-color: #ecf1f7 !important;
font-size: 14px !important;
font-family: HarmonyOS_Sans_SC_Medium !important;
color: #282f3c !important;
height: 48px !important;
padding: 0 !important;
}
/deep/ .el-table .el-table__body tr.current-row > td {
background-color: #f2f7fe !important;
}
/deep/ .el-table .el-table__body tr:hover > td {
background-color: #f2f7fe !important;
}
/deep/ .el-table__row {
height: 48px !important;
}
/deep/ .el-table__row--level-1 {
.el-table__cell {
background-color: #f5f6f7 !important;
}
}
/deep/ .el-table th > .cell {
font-family: HarmonyOS_Sans_SC_Medium;
}
// 去除table表格最底部边框
.el-table__row > td {
border: none;
}
/deep/ .el-table .el-table__cell {
// padding: 0 !important;
}
// 去除table表格最底部边框
.el-table::before {
height: 0px;
}
/deep/ .el-table__body {
width: 100% !important;
}
/deep/ .el-table .el-table__header-wrapper tr th {
background-color: #ecf1f7 !important;
font-size: 14px !important;
font-family: HarmonyOS_Sans_SC_Medium !important;
color: #282f3c !important;
height: 48px !important;
padding: 0 !important;
}
// el-table 左侧固定 样式统一
/deep/ .el-table__fixed {
height: 100% !important;
/deep/ .el-table .el-table__body tr.current-row > td {
background-color: #f2f7fe !important;
}
&::before {
height: 0;
}
}
/deep/ .el-table .el-table__body tr:hover > td {
background-color: #f2f7fe !important;
}
/deep/ .el-table__fixed-header-wrapper {
height: 48px !important;
.el-table__header {
width: 100% !important;
height: 48px !important;
background-color: #ecf1f7 !important;
font-size: 0.875rem !important;
font-family: HarmonyOS_Sans_SC_Medium !important;
color: #282f3c !important;
height: 3rem !important;
padding: 0 !important;
}
/deep/ .el-table__row {
height: 48px !important;
}
thead {
font-size: 0.875rem !important;
font-family: HarmonyOS_Sans_SC_Medium !important;
color: #282f3c !important;
/deep/ .el-table__row--level-1 {
.el-table__cell {
background-color: #f5f6f7 !important;
}
}
.cell {
font-weight: normal !important;
}
}
/deep/ .el-table th > .cell {
font-family: HarmonyOS_Sans_SC_Medium;
}
th {
border: none !important;
background-color: #ecf1f7 !important;
}
}
/deep/ .el-table .el-table__cell {
// padding: 0 !important;
}
/deep/ .hover-row {
.el-table__cell {
background-color: #f2f7fe !important;
}
}
/deep/ .el-table__body {
width: 100% !important;
}
/deep/ .el-table__fixed-right {
height: 100% !important;
// el-table 左侧固定 样式统一
/deep/ .el-table__fixed {
height: 100% !important;
&::before {
height: 0;
}
}
&::before {
height: 0;
}
}
// 批量操作
.el-tag {
color: #055fe7 !important;
height: 32px;
box-sizing: border-box !important;
padding: 0 8px !important;
background: #ddebff;
border-radius: 4px;
font-size: 0.75rem;
margin-bottom: 16px;
display: flex;
align-items: center;
/deep/ .el-table__fixed-header-wrapper {
height: 48px !important;
.el-table__header {
width: 100% !important;
height: 48px !important;
background-color: #ecf1f7 !important;
font-size: 0.875rem !important;
font-family: HarmonyOS_Sans_SC_Medium !important;
color: #282f3c !important;
height: 3rem !important;
padding: 0 !important;
}
thead {
font-size: 0.875rem !important;
font-family: HarmonyOS_Sans_SC_Medium !important;
color: #282f3c !important;
.cell {
font-weight: normal !important;
}
}
/deep/ .el-link--inner {
color: rgb(5, 95, 231);
}
th {
border: none !important;
background-color: #ecf1f7 !important;
}
}
.icon-tanhao1 {
display: flex;
justify-content: center;
align-items: center;
}
/deep/ .hover-row {
.el-table__cell {
background-color: #f2f7fe !important;
}
}
// 表格高度 -- 展示下面的border
.split-line {
height: 650px;
border-bottom: 1px solid #eee;
}
/deep/ .el-table__fixed-right {
height: 100% !important;
// 复选框
/deep/ .el-checkbox__inner {
cursor: pointer;
}
&::before {
height: 0;
}
}
/deep/ .el-checkbox__input {
line-height: 16px;
}
// 批量操作
.el-tag {
color: #055fe7 !important;
height: 32px;
box-sizing: border-box !important;
padding: 0 8px !important;
background: #ddebff;
border-radius: 4px;
font-size: 0.75rem;
margin-bottom: 16px;
display: flex;
align-items: center;
}
.search {
/deep/ .el-input__inner {
background: #ffffff;
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.03);
border-radius: 4px;
border: none;
}
/deep/ .el-link--inner {
color: rgb(5, 95, 231);
}
// 输入框选中样式
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:focus {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
color: #055fe7;
}
.icon-tanhao1 {
display: flex;
justify-content: center;
align-items: center;
}
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:hover {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
}
// 表格高度 -- 展示下面的border
.split-line {
height: 650px;
border-bottom: 1px solid #eee;
}
// :focus-within能非常方便处理获取焦点状态。当元素本身或其后代元素获得焦点时，:focus-within伪类的元素就会有效著作权归作者所有。
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:focus-within {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
color: #055fe7;
// 复选框
/deep/ .el-checkbox__inner {
cursor: pointer;
}
.el-range-input {
color: #055fe7;
}
}
/deep/ .el-checkbox__input {
line-height: 16px;
}
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:hover {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
}
.search {
/deep/ .el-input__inner {
background: #ffffff;
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.03);
border-radius: 4px;
border: none;
}
// 输入框选中样式
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:focus {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
color: #055fe7;
}
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:hover {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
}
// :focus-within能非常方便处理获取焦点状态。当元素本身或其后代元素获得焦点时，:focus-within伪类的元素就会有效著作权归作者所有。
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:focus-within {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
color: #055fe7;
.el-range-input {
color: #055fe7;
}
}
/deep/ .el-input__inner:hover {
cursor: text;
}
/deep/ .el-input.is-active .el-input__inner,
/deep/ .el-input__inner:hover {
box-shadow: 0px 6px 10px 2px rgba(0, 21, 51, 0.08);
border-color: none;
}
}
@import "scss/xtfkgl_main";
/deep/ .el-input__inner:hover {
cursor: text;
}
@import 'scss/xtfkgl_main';
</style>
<style scoped lang="scss">
/deep/ .el-table .el-table__body tr.current-row > td {
background-color: transparent !important;
}
/deep/ .el-table .el-table__body tr.current-row > td {
background-color: transparent !important;
}
/deep/ .el-table .el-table__body tr:hover > td {
background-color: transparent !important;
}
/deep/ .el-table .el-table__body tr:hover > td {
background-color: transparent !important;
}
</style>
src/views/xtfkgl/RyXtljfkView.vue
......@@ -145,7 +145,7 @@
</el-tooltip>
<el-tooltip
<!-- <el-tooltip
effect="dark"
:content="$t('Xtfkgl.data_management')"
placement="top"
......@@ -154,7 +154,7 @@
style="width: 1.125rem;height: 1.125rem; margin-right: 1.125rem;cursor: pointer;">
<use xlink:href="#icon-shujuguanli" />
</svg>
</el-tooltip>
</el-tooltip> -->
</template>
......
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