From 5aa3a9bdd9001e53f245efd40b0d39263caa4bfc Mon Sep 17 00:00:00 2001
From: Surpriseplus <845948745@qq.com>
Date: 星期六, 19 十一月 2022 17:27:53 +0800
Subject: [PATCH] 数据管理页面添加，修改
---
src/views/datamanage/domainManage.vue | 386 ++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 252 insertions(+), 134 deletions(-)
diff --git a/src/views/datamanage/domainManage.vue b/src/views/datamanage/domainManage.vue
index f8ba528..dcd291c 100644
--- a/src/views/datamanage/domainManage.vue
+++ b/src/views/datamanage/domainManage.vue
@@ -1,6 +1,11 @@
<template>
- <div class="authorityManagement_box">
- <My-bread :list="[`${$t('dataManage.dataManage')}`, `鍊煎煙绠＄悊`]"></My-bread>
+ <div class="domainBox">
+ <My-bread
+ :list="[
+ `${$t('dataManage.dataManage')}`,
+ `${$t('dataManage.rangeManage')}`,
+ ]"
+ ></My-bread>
<el-divider />
<div class="mainBox">
<div class="leftTree">
@@ -25,20 +30,23 @@
@click="queryInfo('queryForm')"
icon="el-icon-search"
size="small"
- >{{ $t("common.iquery") }}</el-button
+ class="primary"
+ >{{ $t('common.iquery') }}</el-button
>
<el-button
@click="resetInfo('queryForm')"
icon="el-icon-delete"
size="small"
- >{{ $t("common.empty") }}</el-button
+ type="info"
+ >{{ $t('common.empty') }}</el-button
>
<el-button
v-if="btnStatus.insert"
@click="showAddDialog"
icon="el-icon-plus"
size="small"
- >{{ $t("common.append") }}</el-button
+ type="success"
+ >{{ $t('common.append') }}</el-button
>
<el-button
v-if="btnStatus.delete"
@@ -46,7 +54,7 @@
type="danger"
size="small"
icon="el-icon-delete"
- >{{ $t("common.delete") }}</el-button
+ >{{ $t('common.delete') }}</el-button
>
</el-form-item>
</el-form>
@@ -54,11 +62,8 @@
<div class="table_box">
<el-table
:data="tableData"
- border
- style="width: 100%"
- fit
@selection-change="handleSelectionChange"
- height="99%"
+ height="100%"
>
<el-table-column type="selection" width="50" />
<el-table-column
@@ -110,23 +115,24 @@
<el-table-column min-width="150" :label="$t('common.operate')">
<template slot-scope="scope"
- ><el-button @click="showDetail(scope.row)" size="small"
- >鏌ョ湅</el-button
+ ><el-button
+ class="primary"
+ @click="showDetail(scope.row)"
+ size="small"
+ >{{ $t('common.details') }}</el-button
>
<el-button
v-if="btnStatus.update"
+ type="warning"
@click="handleEdit(scope.$index, scope.row)"
size="small"
- >{{ $t("common.update") }}</el-button
+ >{{ $t('common.update') }}</el-button
>
</template>
</el-table-column>
</el-table>
</div>
- <div
- class="pagination_box"
- style="margin-top: 20px; margin-left: 200px"
- >
+ <div class="pagination_box" style="margin-top: 20px">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
@@ -143,25 +149,49 @@
<div class="infoBox" v-show="showinfoBox">
<el-card class="box-card">
<div slot="header" class="clearfix">
- <span>璇︾粏淇℃伅</span>
+ <span>{{ $t('common.details') }}</span>
<div style="float: right; cursor: pointer" @click="closeDetial">
<i class="el-icon-close"></i>
</div>
</div>
<div class="contentBox">
- <p>鏁版嵁鍚嶇О锛歿{ itemdetail.domName }}</p>
+ <p>
+ {{ $t('dataManage.domainManage.domName') }}锛歿{
+ itemdetail.domName
+ }}
+ </p>
<el-divider></el-divider>
- <p>鎵�灞炵洰褰曪細{{ itemdetail.path }}</p>
+ <p>
+ {{ $t('dataManage.domainManage.domDesc') }}锛歿{
+ itemdetail.domDesc
+ }}
+ </p>
<el-divider></el-divider>
- <p>鍒涘缓鏃堕棿锛歿{ itemdetail.create_time }}</p>
+ <p>
+ {{ $t('dataManage.domainManage.domCode') }}锛歿{
+ itemdetail.domCode
+ }}
+ </p>
<el-divider></el-divider>
- <p>鍒涘缓浜哄憳锛歿{ itemdetail.create_user }}</p>
+ <p>
+ {{ $t('dataManage.domainManage.codeDesc') }}锛歿{
+ itemdetail.codeDesc
+ }}
+ </p>
<el-divider></el-divider>
- <p>涓婁紶鍗曚綅锛歿{ itemdetail.up_unit }}</p>
+ <p>{{ $t('dataManage.domainManage.bsm') }}锛歿{ itemdetail.bsm }}</p>
<el-divider></el-divider>
- <p>鏁版嵁鐘舵�侊細{{ itemdetail.status }}</p>
+ <p>
+ {{ $t('dataManage.domainManage.level') }}锛歿{ itemdetail.level }}
+ </p>
<el-divider></el-divider>
- <p>鏁版嵁鐗堟湰锛歿{ itemdetail.version }}</p>
+ <p>
+ {{ $t('dataManage.domainManage.orderid') }}锛歿{
+ itemdetail.orderid
+ }}
+ </p>
+ <el-divider></el-divider>
+ <p>{{ $t('dataManage.domainManage.bak') }}锛歿{ itemdetail.bak }}</p>
</div>
</el-card>
</div>
@@ -229,7 +259,7 @@
type="primary"
@click="sendEdit('editForm')"
v-loading.fullscreen.lock="fullscreenLoading"
- >{{ $t("common.confirm") }}</el-button
+ >{{ $t('common.confirm') }}</el-button
>
</div>
<div v-else slot="footer" class="dialog-footer">
@@ -239,7 +269,7 @@
type="primary"
@click="sendAdd('editForm')"
v-loading.fullscreen.lock="fullscreenLoading"
- >{{ $t("common.confirm") }}</el-button
+ >{{ $t('common.confirm') }}</el-button
>
</div>
</el-dialog>
@@ -253,33 +283,33 @@
insertDomain,
deleteDomain,
updateDomain,
-} from "../../api/api";
-import MyBread from "../../components/MyBread.vue";
+} from '../../api/api';
+import MyBread from '../../components/MyBread.vue';
export default {
- name: "domainManage",
+ name: 'domainManage',
components: { MyBread },
data() {
return {
multipleSelection: [],
- behavior: "",
- formLabelWidth: "100px",
+ behavior: '',
+ formLabelWidth: '100px',
dialogFormVisible: false,
showinfoBox: false,
fullscreenLoading: false,
itemdetail: {},
editForm: {},
queryForm: {
- code: "",
+ code: '',
},
insertform: {},
- initialForm: "",
+ initialForm: '',
tableData: [],
count: 0,
rowFlag: null,
listData: {
- ns: "",
- tab: "",
+ ns: '',
+ tab: '',
pageIndex: 1,
pageSize: 10,
},
@@ -293,17 +323,17 @@
},
domainData: [
{
- tabDesc: "鍩虹鏁版嵁",
+ tabDesc: '鍩虹鏁版嵁',
children: [],
},
{
- tabDesc: "涓氬姟鏁版嵁",
+ tabDesc: '涓氬姟鏁版嵁',
children: [],
},
],
defaultProps: {
- children: "children",
- label: "tabDesc",
+ children: 'children',
+ label: 'tabDesc',
},
};
},
@@ -338,8 +368,8 @@
},
getAllTabelData() {
getDomainTabs().then((res) => {
- let bdres = res.result.filter((item) => item.ns == "bd");
- let bsres = res.result.filter((item) => item.ns == "bs");
+ let bdres = res.result.filter((item) => item.ns == 'bd');
+ let bsres = res.result.filter((item) => item.ns == 'bs');
this.domainData[0].children = bdres;
this.domainData[1].children = bsres;
});
@@ -362,7 +392,7 @@
this.tableData = res.result;
this.count = res.count;
} else {
- console.log("鏌ヨ鎺ュ彛鎶ラ敊");
+ console.log('鏌ヨ鎺ュ彛鎶ラ敊');
this.$notify.error({
title: res.code,
message: res.result,
@@ -373,19 +403,19 @@
resetInfo() {
this.queryForm = {};
this.$store.state.verCateNode = {};
- this.$bus.$emit("clearTressLabel", true);
+ this.$bus.$emit('clearTressLabel', true);
this.getAllTabelData();
},
// 鍒犻櫎澶氭潯
deleteInfo() {
- this.$confirm("纭畾鏄惁鍒犻櫎鎵�閫夊唴瀹�?", "鎻愮ず", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning",
+ this.$confirm('纭畾鏄惁鍒犻櫎鎵�閫夊唴瀹�?', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning',
})
.then(() => {
if (this.multipleSelection.length == 0) {
- alert("璇烽�夋嫨瑕佸垹闄ょ殑瀵硅薄");
+ alert('璇烽�夋嫨瑕佸垹闄ょ殑瀵硅薄');
return;
} else {
var std = [];
@@ -396,8 +426,8 @@
console.log(res);
if (res.code == 200) {
this.$message({
- type: "success",
- message: "鍒犻櫎鎴愬姛!",
+ type: 'success',
+ message: '鍒犻櫎鎴愬姛!',
});
this.multipleSelection = [];
getSingleTab(this.listData).then((res) => {
@@ -408,18 +438,18 @@
}, 500);
});
} else {
- this.$message.error("鍒犻櫎澶辫触");
+ this.$message.error('鍒犻櫎澶辫触');
this.multipleSelection = [];
}
});
}
})
.catch(() => {
- this.$message("宸插彇娑堝垹闄�");
+ this.$message('宸插彇娑堝垹闄�');
});
},
showAddDialog() {
- this.behavior = "鏂板鐢ㄦ埛";
+ this.behavior = '鏂板鐢ㄦ埛';
this.editForm = {};
this.dialogFormVisible = true;
},
@@ -438,8 +468,8 @@
this.fullscreenLoading = false;
if (res.code == 200) {
this.$message({
- message: "娣诲姞鎴愬姛",
- type: "success",
+ message: '娣诲姞鎴愬姛',
+ type: 'success',
});
getSingleTab(this.listData).then((res) => {
setTimeout(() => {
@@ -454,17 +484,17 @@
}, 500);
})
.catch((res) => {
- alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+ alert('淇敼澶辫触锛岃閲嶈瘯锛�');
this.fullscreenLoading = false;
});
} else {
- console.log("error submit!!");
+ console.log('error submit!!');
return false;
}
});
},
handleClose(done) {
- this.$confirm("鍏抽棴鍚庢棤娉曚繚瀛橈紝鏄惁鍏抽棴锛�")
+ this.$confirm('鍏抽棴鍚庢棤娉曚繚瀛橈紝鏄惁鍏抽棴锛�')
.then((_) => {
this.editForm = {};
done();
@@ -486,7 +516,7 @@
this.dialogFormVisible = true;
this.initialForm = JSON.stringify(row); //澶囦唤
this.editForm = row;
- this.behavior = "淇敼淇℃伅";
+ this.behavior = '淇敼淇℃伅';
},
editFromDataClose() {
this.dialogFormVisible = false;
@@ -495,10 +525,10 @@
// 鎻愪氦淇敼
sendEdit() {
- this.$confirm("鏄惁纭畾缂栬緫?", "鎻愮ず", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning",
+ this.$confirm('鏄惁纭畾缂栬緫?', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning',
})
.then(() => {
this.dialogFormVisible = false;
@@ -514,22 +544,22 @@
}, 500);
});
this.$message({
- message: "淇敼鎴愬姛",
- type: "success",
+ message: '淇敼鎴愬姛',
+ type: 'success',
});
this.editForm = {};
} else {
- alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+ alert('淇敼澶辫触锛岃閲嶈瘯锛�');
this.fullscreenLoading = false;
}
})
.catch(() => {
- alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+ alert('淇敼澶辫触锛岃閲嶈瘯锛�');
this.fullscreenLoading = false;
});
})
.catch(() => {
- alert("淇敼澶辫触锛岃閲嶈瘯锛�");
+ alert('淇敼澶辫触锛岃閲嶈瘯锛�');
this.fullscreenLoading = false;
});
},
@@ -570,31 +600,35 @@
</script>
<style lang="less" scoped>
//@import url(); 寮曞叆鍏叡css绫�
-.authorityManagement_box {
- background: rgb(240, 242, 245);
- border-radius: 10px;
- height: 100%;
- padding: 10px;
- box-sizing: border-box;
- .el-input {
- width: 300px !important;
- }
+.domainBox {
+ height: 80%;
+ width: 97%;
+ position: absolute;
.mainBox {
+ width: 100%;
+ height: 92%;
display: flex;
justify-content: space-between;
.leftTree {
width: 15%;
- height: 90vh;
- border-radius: 10px;
- overflow: auto;
+ height: 96%;
+ border: 1px solid white;
+ border-radius: 5px;
+ padding: 1%;
+ max-height: 670px;
+ overflow-y: auto;
}
.right {
- width: 84%;
- height: 92vh;
- // background-color: #bfa;
+ width: 80%;
+ height: 96%;
+ border: 1px solid white;
+ border-radius: 5px;
+ padding: 1%;
+ max-height: 670px;
+ overflow-y: auto;
.inquire {
margin-bottom: 10px;
- background: #fff;
+
border-radius: 5px;
border: 1px solid rgb(202, 201, 204);
.el-form-item {
@@ -603,51 +637,13 @@
}
.table_box {
width: 100%;
- height: 90%;
+ height: 80%;
margin: 0 auto;
overflow: auto;
- background: #fff;
- // .el-table {
- // height: 100%;
- // }
+
.el-table /deep/ th.el-table__cell > .cell {
padding: 15px !important;
}
- // .el-table /deep/ .el-table__header-wrapper tr th {
- // background-color: rgb(255, 255, 255) !important;
- // color: rgb(0, 0, 0);
- // }
- // // 淇敼姣忚鏍峰紡锛�
- // .el-table /deep/ .el-table__row {
- // background-color: rgba(255, 255, 255) !important;
- // color: rgb(0, 0, 0);
- // }
- // .el-table /deep/ .el-table__body tr.current-row > td {
- // background-color: rgb(211, 211, 211) !important;
- // }
- // .el-table /deep/ .el-table__body tr:hover > td {
- // background-color: rgb(211, 211, 211) !important;
- // }
- // // 淇敼琛ㄦ牸姣忚杈规鐨勬牱寮忥細
- // .el-table /deep/ td,
- // .el-table /deep/ th.is-leaf {
- // border-bottom: 1px solid #eee;
- // border-right: 1px solid #eee;
- // }
- // .el-table /deep/ .el-table__cell {
- // padding: 0;
- // }
- // 璁剧疆琛ㄦ牸姣忚鐨勯珮搴︼細
- // .el-table /deep/ .el-table__header tr,
- // .el-table /deep/ .el-table__header th {
- // height: 40px;
- // }
- // .el-table__body tr,
- // .el-table__body td {
- // height: 40px;
- // padding: 0;
- // }
- // 璁剧疆琛ㄦ牸杈规棰滆壊锛�
.el-table--border::after,
.el-table--group::after {
@@ -656,44 +652,150 @@
.el-table::before {
height: 0;
}
- // a {
- // color: #000;
- // }
}
}
}
.infoBox {
width: 500px;
- border: 1px solid #eee;
+
position: absolute;
z-index: 100;
top: 15%;
right: 25%;
- background-color: #fff;
+ color: white;
+ background-color: #303030;
.el-card {
background-color: transparent;
+ color: white;
span {
font-size: 16px;
font-weight: 600;
+ color: white;
}
}
.contentBox {
margin: 0 aotu 10px;
- height: 600px;
+ height: 500px;
overflow: auto;
+ color: white;
+ overflow-y: auto;
p {
- // background-color: #bfa;
- // margin-bottom: 10px;
+ color: white;
font-size: 14px;
}
+ }
+ }
+ .pagination_box {
+ margin-top: 20px;
+ /deep/.el-input__inner {
+ background-color: transparent !important;
+ border: 1px solid;
+ color: white;
+ }
+ /deep/.el-pagination__total {
+ color: white;
+ }
+ /deep/.el-pagination__jump {
+ color: white;
+ }
+ /deep/.el-pager li.active {
+ color: #409eff;
+ }
+ /deep/.el-pager li {
+ color: white;
+ background: transparent;
+ }
+ /deep/.el-pager li {
+ color: white;
+ }
+ /deep/.btn-prev {
+ background: transparent;
+ }
+ /deep/.btn-next {
+ background: transparent;
+ }
+ /deep/.btn-next i {
+ color: white;
+ }
+ /deep/.btn-prev i {
+ color: white;
+ }
+ }
+ /deep/.el-form-item__label {
+ color: white;
+ }
+ // 璁剧疆杈撳叆妗嗙殑鑳屾櫙鑹层�佸瓧浣撻鑹层�佽竟妗嗗睘鎬ц缃紱
+ /deep/.el-input__inner {
+ background-color: transparent !important ;
+ color: #fff;
+ border: 1px solid;
+ }
+ /*淇敼table 琛ㄤ綋鐨勮儗鏅鑹插拰鏂囧瓧棰滆壊*/
+ /deep/ .el-table {
+ background-color: transparent;
+
+ th,
+ td {
+ background-color: transparent;
+ }
+ .el-table__expanded-cell {
+ background-color: transparent !important;
+ }
+
+ // 琛ㄥご鑳屾櫙鑹�
+ th.el-table__cell {
+ background-color: #303030;
+ color: #fff;
+ }
+ tr > td {
+ background-color: #303030;
+ color: #fff;
+ }
+
+ // hover鏁堟灉
+ tr:hover > td {
+ background-color: rgba(255, 255, 255, 0.3) !important;
+ }
+
+ tbody tr:hover {
+ background-color: rgba(255, 255, 255, 0.3) !important;
+ // text-align: center;
+ }
+
+ // 婊氬姩鏉″楂�
+ .el-table__body-wrapper::-webkit-scrollbar {
+ width: 5px;
+ height: 5px;
+ }
+
+ .el-table__body-wrapper::-webkit-scrollbar {
+ width: 5px;
+ /*婊氬姩鏉″搴�*/
+ height: 5px;
+ /*婊氬姩鏉￠珮搴�*/
+ }
+ /*瀹氫箟婊氬姩鏉¤建閬� 鍐呴槾褰�+鍦嗚*/
+ .el-table__body-wrapper::-webkit-scrollbar-track {
+ box-shadow: 0px 1px 3px #216fe6 inset;
+ /*婊氬姩鏉＄殑鑳屾櫙鍖哄煙鐨勫唴闃村奖*/
+ border-radius: 10px;
+ }
+
+ /*瀹氫箟婊戝潡 鍐呴槾褰�+鍦嗚*/
+ .el-table__body-wrapper::-webkit-scrollbar-thumb {
+ box-shadow: 0px 1px 3px #216fe6 inset;
+ border-radius: 6px;
+ background-color: #216fe6;
}
}
/deep/ .el-dialog {
width: 620px !important;
margin-top: 10vh !important;
}
-
+ /deep/ .el-select .el-input__inner {
+ border-color: #fff !important;
+ }
/deep/.el-dialog .el-input__inner {
width: 300px;
}
@@ -707,5 +809,21 @@
margin: 0 auto;
justify-content: center;
}
+ .primary {
+ background: #409eff;
+ border: #409eff;
+ color: white;
+ }
+ /deep/ .el-dialog {
+ background: #303030;
+ }
+ /deep/.el-range-editor.is-active,
+ .el-range-editor.is-active:hover,
+ .el-select .el-input.is-focus .el-input__inner {
+ border: 1px solid;
+ }
+ /deep/.el-dialog__title {
+ color: white;
+ }
}
</style>
--
Gitblit v1.9.3