From 3b1d1e53e902631099a483511724ee7c423db140 Mon Sep 17 00:00:00 2001
From: Surpriseplus <845948745@qq.com>
Date: 星期四, 02 二月 2023 15:29:17 +0800
Subject: [PATCH] 资料馆界面优化
---
src/views/Archive/index.vue | 408 +++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 259 insertions(+), 149 deletions(-)
diff --git a/src/views/Archive/index.vue b/src/views/Archive/index.vue
index bed07ff..e8ca548 100644
--- a/src/views/Archive/index.vue
+++ b/src/views/Archive/index.vue
@@ -4,60 +4,38 @@
<div class="top_left">
<My-bread :list="[`${$t('synthesis.synthesis')}`, `${$t('synthesis.archive')}`]"></My-bread>
</div>
- <div class="top_right">
- <el-form
- :inline="true"
- :model="formInline"
- class="demo-form-inline"
- >
- <el-form-item>
- <el-input
- v-model="formInline.tab"
- suffix-icon="el-icon-search"
- :placeholder="$t('common.pleaseInput')"
- ></el-input>
- </el-form-item>
- <el-form-item>
- <el-button
- icon="el-icon-search"
- @click="searchDataLibSelectTabs"
- class="primaries"
- >{{
- $t('common.iquery')
- }}</el-button>
- <el-button
- icon="el-icon-refresh"
- @click="restDataLibSelectTabs"
- type="info"
- >{{
- $t('common.reset')
- }}</el-button>
- </el-form-item>
- <el-form-item>
- <el-button
- @click="getSpaceMapVisibale"
- class="primaries"
- >{{
- $t('synthesis.rangequery')
- }}</el-button>
- </el-form-item>
- </el-form>
- </div>
+
</div>
<div class="box_item">
<div class="box_left">璧勬枡绫诲埆</div>
<div class="box_cont">
+
+ <div v-if="isShowFirstCheck">
+ <el-checkbox-group v-model="checkedDataType">
+ <el-checkbox
+ @change="handleCheckedDataTypeChange(item)"
+ v-for="(item, index) in showList"
+ :label="item.name"
+ :key="index"
+ >{{item.name}}</el-checkbox>
+ </el-checkbox-group>
+ </div>
<div
+ v-if="!isShowFirstCheck"
class="box_div"
v-for="(item, index) in showList"
:key="index"
+ @click="changeListDataType(item)"
>
- <el-checkbox
+ <!-- <el-checkbox
v-if="isShowFirstCheck"
v-model="item.isCheckedFlag"
:checked="item.isCheckedFlag"
- ></el-checkbox>
- <div style="margin-left: 5px">{{ item.name }}</div>
+ ></el-checkbox> -->
+ <div
+ :class="{menuActive:dataTypeName == item.name}"
+ style="margin-left: 5px"
+ >{{ item.name }}</div>
</div>
</div>
<div class="box_right">
@@ -71,24 +49,36 @@
class="box_div box_menu"
@click="checkEvent(1)"
>
- <i class="el-icon-plus"></i> {{ $t('synthesis.Multiplechoice') }}
+ <i class="el-icon-plus"></i>
+ <span v-if="!isShowFirstCheck">{{ $t('synthesis.Multiplechoice') }}</span>
+ <span v-if="isShowFirstCheck">{{ $t('synthesis.Singlechoice') }}</span>
</div>
</div>
</div>
<div class="box_item">
<div class="box_left">椤圭洰鍚嶇О</div>
<div class="box_cont">
+ <div v-if=" isShowSecondCheck">
+ <el-checkbox-group v-model="checkedEntryName">
+ <el-checkbox
+ @change="handleCheckedEntryNameChange(item)"
+ v-for="(item, index) in showList1"
+ :label="item.name"
+ :key="index"
+ >{{item.name}}</el-checkbox>
+ </el-checkbox-group>
+ </div>
<div
+ v-if="!isShowSecondCheck"
class="box_div"
v-for="(item, index) in showList1"
:key="index"
+ @click="changeListEntryName(item)"
>
- <el-checkbox
- v-if="isShowSecondCheck"
- v-model="item.isCheckedFlag"
- :checked="item.isCheckedFlag"
- ></el-checkbox>
- <div style="margin-left: 5px">{{ item.name }}</div>
+ <div
+ :class="{menuActive:EntryName == item.name}"
+ style="margin-left: 5px"
+ >{{ item.name }}</div>
</div>
</div>
<div class="box_right">
@@ -102,11 +92,14 @@
class="box_div box_menu"
@click="checkEvent(2)"
>
- <i class="el-icon-plus"></i> {{ $t('synthesis.Multiplechoice') }}
+ <i class="el-icon-plus"></i>
+ <span v-if="!isShowSecondCheck">{{ $t('synthesis.Multiplechoice') }}</span>
+ <span v-if="isShowSecondCheck">{{ $t('synthesis.Singlechoice') }}</span>
</div>
</div>
</div>
<div class="bottom_content">
+
<div class="bottom_left">
<!-- <div class="box_div">褰撳墠鎼滅储鍏抽敭璇�:</div> -->
<div>
@@ -128,84 +121,96 @@
</ul>
</div>
</div>
- <div
- v-if="isMenuActive"
- class="bottom_right"
- >
- <ul>
- <li
- v-for="(item, index) in dataType"
- :key="index"
- >
- <div
- class="box_div"
- @click="getShowTable(item)"
- >
- {{ item.tabDesc }}
- </div>
- </li>
- </ul>
- </div>
- <div
- v-if="!isMenuActive"
- class="bottom_right"
- >
- <el-form
- :inline="true"
- :model="queryForm"
- class="demo-form-inline"
- >
- <el-form-item>
- <el-cascader
- v-model="queryForm.dirid"
- :show-all-levels="false"
- :options="companyOption"
- @change="handleChange"
- :props="{
- label: 'name',
- value: 'id',
- children: 'children',
- checkStrictly: true,
- emitPath: false,
- }"
- ></el-cascader>
- </el-form-item>
- <el-form-item>
- <el-cascader
- v-model="queryForm.depid"
- :show-all-levels="false"
- :options="companyOption1"
- @change="handleChange1"
- :props="{
- label: 'name',
- value: 'id',
- children: 'children',
- checkStrictly: true,
- emitPath: false,
- }"
- ></el-cascader>
- </el-form-item>
- <!-- <el-form-item>
-
- <el-button
- type="danger"
- size="small"
- @click="deleteMetaInfo"
- icon="el-icon-delete"
- >{{ $t('common.delete') }}</el-button>
- </el-form-item> -->
- <!-- <el-form-item>
- <el-button
- @click="setBatchDownload"
- icon="el-icon-download"
- type="success"
- size="small"
- >鎵归噺涓嬭浇</el-button>
- </el-form-item> -->
- </el-form>
+ <div class="bottom_right">
+ <div>
+ <el-form
+ :inline="true"
+ :model="formInline"
+ class="demo-form-inline"
+ >
+ <!-- <el-form-item>
+ <el-cascader
+ v-model="formInline.dirid"
+ :show-all-levels="false"
+ :options="companyOption"
+ @change="handleChange"
+ :props="{
+ label: 'name',
+ value: 'id',
+ children: 'children',
+ checkStrictly: true,
+ emitPath: false,
+ }"
+ ></el-cascader> -->
+ </el-form-item>
+ <el-form-item>
+ <el-cascader
+ v-model="formInline.depid"
+ :show-all-levels="false"
+ :options="companyOption1"
+ @change="handleChange1"
+ :props="{
+ label: 'name',
+ value: 'id',
+ children: 'children',
+ checkStrictly: true,
+ emitPath: false,
+ }"
+ ></el-cascader>
+ </el-form-item>
+ <el-form-item>
+ <el-input
+ v-model="formInline.tab"
+ suffix-icon="el-icon-search"
+ :placeholder="$t('common.pleaseInput')"
+ ></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button
+ icon="el-icon-search"
+ @click="searchDataLibSelectTabs"
+ size="mini"
+ >{{
+ $t('common.iquery')
+ }}</el-button>
+ <el-button
+ icon="el-icon-refresh"
+ @click="restDataLibSelectTabs"
+ type="info"
+ size="mini"
+ >{{
+ $t('common.reset')
+ }}</el-button>
+ </el-form-item>
+ <el-form-item>
+ <el-button
+ @click="getSpaceMapVisibale"
+ size="mini"
+ >{{
+ $t('synthesis.rangequery')
+ }}</el-button>
+ </el-form-item>
+ </el-form>
+ </div>
+ <div v-if="isMenuActive">
+ <ul>
+ <li
+ v-for="(item, index) in dataType"
+ :key="index"
+ >
+ <div
+ class="box_div"
+ @click="getShowTable(item)"
+ >
+ {{ item.tabDesc }}
+ </div>
+ </li>
+ </ul>
+ </div>
<div
class="boxCard"
+ v-if="!isMenuActive"
v-for="(item,index) in tableData1"
>
<el-card class="box-card">
@@ -234,7 +239,6 @@
<div class="cardItem"> {{$t('dataManage.vmobj.createontime')}} : {{format(item.createTime)}} </div>
</el-card>
</div>
-
</div>
</div>
<div class="panerPage">
@@ -770,10 +774,13 @@
selectdirTab,
selectdepTab,
deleteMeta,
+ dataLib_selectProject,
+ dataLib_selectBaseType,
+ dataLib_selectBusinessType
} from '../../api/api';
import $ from 'jquery'
import { getToken } from '@/utils/auth';
-import { data_type, project_name } from '../../components/js/archive.js';
+// import { data_type, project_name } from '../../components/js/archive.js';
import MyBread from '../../components/MyBread.vue';
import MapSdk from '../../components/mapsdk.vue'
export default {
@@ -803,6 +810,12 @@
}
};
return {
+ data_type: [],
+ project_name: [],
+ checkedDataType: [],
+ checkedEntryName: [],
+ dataTypeName: '涓嶉檺',
+ EntryName: '涓嶉檺',
conditionVisible: false,
formSql: {
field: '',
@@ -815,11 +828,11 @@
fromSqlflag: false,
filedsOption: [],
condOption: [],
- queryForm: {
- dirid: null,
+
+ formInline: {
+ tab: '', fileName: '', dirid: null,
depid: null,
},
- formInline: { tab: '', fileName: '' },
codeForm: {
password: '',
repassword: '',
@@ -894,7 +907,6 @@
};
},
computed: {
-
newList() {
this.listType.forEach((item) => {
this.$set(item, 'isCheckedFlag', false);
@@ -902,7 +914,7 @@
return this.listType;
},
showList() {
- this.listType = data_type;
+ this.listType = this.data_type;
if (this.showFirstAll == false) {
var showList = [];
if (this.newList.length > 8) {
@@ -924,7 +936,7 @@
return this.listProject;
},
showList1() {
- this.listProject = project_name;
+ this.listProject = this.project_name;
if (this.showSecondAll == false) {
var showList1 = [];
if (this.newList1.length > 8) {
@@ -941,8 +953,41 @@
},
},
methods: {
+ handleCheckedEntryNameChange(res) {
+ if (this.checkedEntryName.indexOf(res.name) != -1) {
+ if (res.name == "涓嶉檺") {
+ this.checkedEntryName = ['涓嶉檺']
+ } else {
+ var index = this.checkedEntryName.indexOf('涓嶉檺')
+ if (index > -1) {
+ this.checkedEntryName.splice(index, 1);
+ }
+ }
+ }
+ },
+ handleCheckedDataTypeChange(res) {
+ if (this.checkedDataType.indexOf(res.name) != -1) {
+ if (res.name == "涓嶉檺") {
+ this.checkedDataType = ['涓嶉檺']
+ } else {
+ var index = this.checkedDataType.indexOf('涓嶉檺')
+ if (index > -1) {
+ this.checkedDataType.splice(index, 1);
+ }
+ }
+ }
-
+ },
+ changeListDataType(res) {
+ if (this.isShowFirstCheck == false) {
+ this.dataTypeName = res.name;
+ }
+ },
+ changeListEntryName(res) {
+ if (this.isShowSecondCheck == false) {
+ this.EntryName = res.name;
+ }
+ },
getSpaceMapVisibale() {
this.dialogMapVisible = true;
this.showMapVisible = true;
@@ -983,14 +1028,29 @@
switch (res) {
case 1:
this.isShowFirstCheck = !this.isShowFirstCheck;
+ if (this.isShowFirstCheck == false) {
+ this.checkedDataType = []
+ this.dataTypeName = '涓嶉檺';
+ } else {
+ this.dataTypeName = null;
+ this.checkedDataType = ['涓嶉檺']
+ }
+
break;
case 2:
this.isShowSecondCheck = !this.isShowSecondCheck;
+ if (this.isShowSecondCheck == false) {
+ this.checkedEntryName = []
+ this.EntryName = '涓嶉檺';
+ } else {
+ this.EntryName = null;
+ this.checkedEntryName = ['涓嶉檺']
+ }
break;
}
},
getMenuChange(res) {
-
+ this.getQueryDirTree();
this.formInline.tab = ""
switch (res) {
case 1:
@@ -1011,9 +1071,9 @@
dirid: null,
name: null
}
- this.getQueryDirTree();
this.isMenuActive = false;
+ this.getMetaData();
break;
}
},
@@ -1024,7 +1084,7 @@
this.$message.error('鍗曚綅鍒楄〃鑾峰彇澶辫触');
return;
}
- this.queryForm.dirid = 1;
+ this.formInline.dirid = 1;
this.companyOption = this.treeData(res.result);
this.getQueryDepTree();
},
@@ -1034,9 +1094,9 @@
this.$message.error('鍗曚綅鍒楄〃鑾峰彇澶辫触');
return;
}
- this.queryForm.depid = 1;
+ this.formInline.depid = 1;
this.companyOption1 = this.treeData(res.result);
- this.getMetaData();
+ // this.getMetaData();
},
// 鏌ヨ
@@ -1046,7 +1106,7 @@
},
// 閲嶇疆鏌ヨ
resetInfo(formName) {
- this.queryForm.name = '';
+ this.formInline.name = '';
this.listData.pageSize = 10;
this.listData.pageIndex = 1;
this.listData.name = null;
@@ -1172,8 +1232,8 @@
this.codeForm.repassword = '';
},
getMetaData() {
- this.listData.dirid = this.queryForm.dirid
- this.listData.depid = this.queryForm.depid;
+ this.listData.dirid = this.formInline.dirid
+ this.listData.depid = this.formInline.depid;
dataLib_selectByPageForMeta(this.listData).then((res) => {
this.tableData1 = res.result;
@@ -1184,13 +1244,13 @@
handleChange(value) {
this.listData.pageSize = 10;
this.listData.pageIndex = 1;
- this.queryForm.dirid = value;
+ this.formInline.dirid = value;
this.getMetaData();
},
handleChange1(value) {
this.listData.pageSize = 10;
this.listData.pageIndex = 1;
- this.queryForm.depid = value;
+ this.formInline.depid = value;
this.getMetaData();
},
//鏍戝垪琛ㄧ敓鎴�
@@ -1301,7 +1361,7 @@
this.listTypeData.name = res.entity;
this.listTypeData.pageIndex = 1;
this.listTypeData.pageSize = 10;
- this.dialogtitle = res.tabDesc ;
+ this.dialogtitle = res.tabDesc;
this.upAttach.tabName = res.ns + "." + res.tab;
this.filedsLayer = this.getCollapseDomFiled();
@@ -1694,10 +1754,49 @@
add0(m) {
return m < 10 ? '0' + m : m;
},
+ async getDataTyeAndEntryName() {
+ const data = await dataLib_selectProject();//鏌ヨ椤圭洰鍚嶇О
+ if (data.code != 200) {
+ this.$message.error('椤圭洰鍒楄〃璋冪敤澶辫触');
+ }
+
+ const res = await dataLib_selectBaseType(); //鏌ヨ鍩虹鍦扮悊绫诲埆
+ if (res.code != 200) {
+ this.$message.error('鍩虹鍦扮悊绫诲埆鍒楄〃璋冪敤澶辫触');
+ }
+ const rest = await dataLib_selectBusinessType(); //鏌ヨ涓氬姟绫诲埆
+ if (rest.code != 200) {
+ this.$message.error('涓氬姟绫诲埆鍒楄〃璋冪敤澶辫触');
+ }
+ var std = [{ name: "涓嶉檺", id: null }]
+ var str = [{ name: "涓嶉檺", id: null }]
+ for (var i in data.result) {
+ std.push({
+ id: data.result[i].key,
+ name: data.result[i].value
+ })
+ }
+ this.project_name = std;
+ for (var i in res.result) {
+ str.push({
+ id: res.result[i].key,
+ name: res.result[i].value
+ })
+ }
+ for(var i in rest.result){
+ str.push({
+ id: rest.result[i].key,
+ name: rest.result[i].value
+ })
+ }
+ this.data_type = str;
+ }
},
mounted() {
this.getDataLibSelectTabs();
this.signGetPublicKey();
+ this.getQueryDirTree();
+ this.getDataTyeAndEntryName();
},
};
</script>
@@ -1710,10 +1809,10 @@
overflow-y: auto;
background: #353539;
.top_header {
- width: calc(100% - 60px);
- height: 70px;
+ width: calc(100% -20px);
+ height: 60px;
display: flex;
- padding: 0 30px;
+ padding: 0 10px;
justify-content: space-between;
border-bottom: 1px solid white;
.top_left {
@@ -1817,7 +1916,7 @@
}
}
.bottom_right {
- width: calc(100% - 320px);
+ width: 100%;
padding: 0px 20px;
height: auto;
color: white;
@@ -1852,6 +1951,9 @@
display: flex;
align-items: center;
display: flex;
+ .menuActive {
+ color: #409eff;
+ }
}
.primaries {
background: linear-gradient(180deg, #002992, #080472);
@@ -1940,6 +2042,10 @@
/deep/ .el-select .el-input__inner {
border-color: #fff !important;
}
+ /deep/.el-checkbox {
+ color: #ffff;
+ line-height: 25px;
+ }
}
.elLink {
@@ -1956,6 +2062,10 @@
}
/deep/ .el-dialog {
background: #303030;
+ z-index: 99;
+}
+.downloadBox {
+ z-index: 999;
}
/deep/.el-range-editor.is-active,
.el-range-editor.is-active:hover,
--
Gitblit v1.9.3