IDCDatasync/IDCDatasync-vue
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

按照第二版设计图修改样式

Browse Source
This commit is contained in:
RenCheng 2025-04-15 00:01:22 +08:00
parent 11ed62275b
commit e51cd036bd
6 changed files with 193 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/dashboard/Analysis.vue
View File

@ -6,8 +6,8 @@
<div class="buttontext">任务管理</div> <div class="buttontext">任务管理</div>
<div class="buttonicon"><img src="~@/assets/img/任务管理.png"></div> <div class="buttonicon"><img src="~@/assets/img/任务管理.png"></div>
</a-col> </a-col>
<a-col :span="4" class="clickbutton" @click="openlink('/#/datalink/water')"> <a-col :span="4" class="clickbutton" @click="openlink('sjsxybs://test')">
<div class="buttontext">数据导入</div> <div class="buttontext">数据筛选与报送</div>
<div class="buttonicon"><img src="~@/assets/img/数据接入.png"></div> <div class="buttonicon"><img src="~@/assets/img/数据接入.png"></div>
</a-col> </a-col>
<a-col :span="4" class="clickbutton" @click="openlink('/#/datalink/dblink')"> <a-col :span="4" class="clickbutton" @click="openlink('/#/datalink/dblink')">

2
src/views/data/dataCataloguing.vue
View File

@ -21,7 +21,7 @@
</a-col> </a-col>
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons"> <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-col :md="4" :sm="3"> <a-col :md="4" :sm="3">
<a-button type="primary" style="left: 10px" @click="gettagTables" icon="search">查询</a-button> <a-button type="primary" @click="gettagTables" icon="search">查询</a-button>
</a-col> </a-col>
</span> </span>
</a-row> </a-row>

64
src/views/data/dataManage.vue
View File

@ -3,15 +3,15 @@
<a-col :md="14" > <a-col :md="14" >
<div class="linese"></div> <div class="linese"></div>
<!-- 查询区域 --> <!-- 查询区域 -->
<div class="table-page-search-wrapper" style="background: rgb(18, 44, 65);"> <div class="table-page-search-wrapper" style="background: #e6e9f1;padding:10px;">
<a-select placeholder="选择数据类型" option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;"> <a-select placeholder="选择数据类型" option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;">
<a-select-option v-for="d in dataTypedataSources" :key="d.enName"> <a-select-option v-for="d in dataTypedataSources" :key="d.enName">
{{ d.cnName }} {{ d.cnName }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</div> </div>
<!-- table区域-begin --> <!-- table区域-begin -->
<div ref="tableContainer" style="height:calc(100vh - 347px);background: rgb(18, 44, 65);padding:10px;"> <div ref="tableContainer" style="height:calc(100vh - 347px);background:rgb(230, 233, 241);padding:10px;">
<a-table <a-table
ref="table" ref="table"
size="middle" size="middle"
@ -30,7 +30,7 @@
</a-col> </a-col>
<a-col :md="10"> <a-col :md="10">
<div class="linese"></div> <div class="linese"></div>
<a-card :bordered="false" style="background: rgb(18, 44, 65) !important;"> <a-card :bordered="false" >
<!-- 查询区域 --> <!-- 查询区域 -->
<div class="table-page-search-wrapper"> <div class="table-page-search-wrapper">
<a-form layout="inline"> <a-form layout="inline">
@ -65,7 +65,7 @@
<!-- table区域-begin --> <!-- table区域-begin -->
<div class="datacleanResult"> <div class="datacleanResult">
<div class="progressbg"> <div class="progressbg">
<div class="title">发布进度：</div> <div class="title">发布进度:</div>
<a-progress :percent="percent" status="active" class="progress" /> <a-progress :percent="percent" status="active" class="progress" />
</div> </div>
<a-list :data-source="contentList" style="padding:10px 20px;"> <a-list :data-source="contentList" style="padding:10px 20px;">
@ -231,48 +231,54 @@
} }
</script> </script>
<style scoped> <style scoped>
@import '~@assets/less/common.less'; /deep/ .ant-table-bordered .ant-table-header>table {
/deep/ .ant-table-bordered .ant-table-header > table { border: none !important;
border: none !important;
}
.datacleanResult{
height:calc(100vh - 374px);
overflow-y:auto;
margin: 10px;
background: rgb(11,34,52);
} }
.datacleanResult .progressbg{
.datacleanResult {
height: calc(100vh - 374px);
overflow-y: auto;
margin: 10px;
background: #F1F4FA;
}
.datacleanResult .progressbg {
margin: 10px; margin: 10px;
height: 60px; height: 60px;
padding:20px 10px; padding: 20px 10px;
background: rgb(17,42,64); background: #D6DAE2;
} }
.datacleanResult .title{
.datacleanResult .title {
width: 14%; width: 14%;
font-size: 16px; font-size: 16px;
float: left; float: left;
text-align: right; text-align: right;
line-height: 20px; line-height: 20px;
color:#fff; color: #363F56;
} }
.datacleanResult .progress{
.datacleanResult .progress {
width: 86%; width: 86%;
float: left; float: left;
} }
.datacleanResult .ant-progress-bg, .datacleanResult .ant-progress-bg,
.datacleanResult .ant-progress-inner{ .datacleanResult .ant-progress-inner {
height: 16px !important; height: 16px !important;
} }
.datacleanResult .ant-progress-bg{
background: linear-gradient(180deg, rgb(43,97,48),rgb(75,160,75),rgb(43,97,48)); .datacleanResult .ant-progress-bg {
background: linear-gradient(180deg, rgb(43, 97, 48), rgb(75, 160, 75), rgb(43, 97, 48));
} }
/deep/ .datacleanResult .ant-progress-text{ /deep/ .datacleanResult .ant-progress-text {
color:#fff !important; color: #fff !important;
} }
.datacleanResult .ant-list-items{
border-bottom:1px dashed rgb(35,72,100); .datacleanResult .ant-list-items {
color:#fff; border-bottom: 1px dashed rgb(35, 72, 100);
color: #fff;
} }
</style> </style>

4
src/views/data/thematicLibrary.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<a-row :gutter="30"> <a-row :gutter="30">
<a-col :md="24" :sm="1" > <a-col :md="24" :sm="1" >
<div class="table-page-search-wrapper"> <div class="table-page-search-wrapper"style="background: #e6e9f1;padding:10px;">
<a-select placeholder="选择数据类型" option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;"> <a-select placeholder="选择数据类型" option-filter-prop="children" v-model="datatypequeryParam.schemaName" @change="getTables" style="width: 40%;">
<a-select-option v-for="d in dataTypedataSources" :key="d.id"> <a-select-option v-for="d in dataTypedataSources" :key="d.id">
{{ d.cnName }} {{ d.cnName }}
@ -9,7 +9,7 @@
</a-select> </a-select>
</div> </div>
<!-- table区域-begin --> <!-- table区域-begin -->
<div ref="tableContainer" style="height:calc(100vh - 347px);background: rgb(18, 44, 65);padding:10px;"> <div ref="tableContainer" style="height:calc(100vh - 347px);background:#e6e9f1;padding:10px;">
<a-table <a-table
ref="table" ref="table"
size="middle" size="middle"

291
src/views/fileManage/index.vue
View File

@ -1,142 +1,146 @@
<template> <template>
<div> <div>
<div class="filecontent"> <a-row>
<div class="flodContent"> <a-col :span="6">
<div class="linese"></div> <div class="flodContent">
<div class="siderHeader echartsTitle"> <div class="linese"></div>
<div class="ecicon"></div> <div class="siderHeader echartsTitle">
文件目录 <div class="ecicon"></div>
</div> 文件目录
<a-dropdown :trigger="['contextmenu']"> <!-- <a-button type="primary" style="margin-left: 21px;float: right;" @click="searchgetFileList">添加</a-button> -->
<a-directory-tree </div>
:tree-data="treeData" <a-dropdown :trigger="['contextmenu']">
v-model:expandedKeys="expandedKeys" <a-directory-tree
class="teeediv" :tree-data="treeData"
v-model:selectedKeys="selectedKeys" v-model:expandedKeys="expandedKeys"
@select="changeSelect" class="teeediv"
> v-model:selectedKeys="selectedKeys"
<a-tree-node v-for="itemNode in treeData" :key="itemNode.id" :title="itemNode.title" :value="itemNode"> @select="changeSelect"
</a-tree-node> >
</a-directory-tree> <a-tree-node v-for="itemNode in treeData" :key="itemNode.id" :title="itemNode.title" :value="itemNode">
<template #overlay> </a-tree-node>
<a-menu class="menu" @click="menuClick"> </a-directory-tree>
<a-menu-item key="1">添加</a-menu-item> <template #overlay>
<a-menu-item key="2">重命名</a-menu-item> <a-menu class="menu" @click="menuClick">
<a-menu-item key="3">删除</a-menu-item> <a-menu-item key="1">添加</a-menu-item>
</a-menu> <a-menu-item key="2">重命名</a-menu-item>
</template> <a-menu-item key="3">删除</a-menu-item>
</a-dropdown> </a-menu>
<div class="linese"></div> </template>
</div> </a-dropdown>
<div class="righttop"> <div class="linese"></div>
<div class="linese"></div> </div>
<div style="height:130px"> </a-col>
<a-row class="quarter-div"> <a-col :span="18">
<a-col :span="11"> <div class="righttop">
<img src="~@/assets/img/文件总数.png" /> <div class="linese"></div>
</a-col> <div style="height:130px;background: #e6e9f1;margin-left: 10px;" >
<a-col :span="13"> <a-row class="quarter-div">
<div class="datanum">{{ fileNum.total }}</div> <a-col :span="11">
<div>文件总数</div> <img src="~@/assets/img/文件总数.png" />
</a-col> </a-col>
</a-row> <a-col :span="13">
<a-row class="quarter-div"> <div class="datanum" style="color: #FF9000;">{{ fileNum.total }}</div>
<a-col :span="11"> <div class="dataText">文件总数</div>
<img src="~@/assets/img/图片.png" /> </a-col>
</a-col> </a-row>
<a-col :span="13"> <a-row class="quarter-div">
<div class="datanum">{{ fileNum.pictures }}</div> <a-col :span="11">
<div>图片</div> <img src="~@/assets/img/图片.png" />
</a-col> </a-col>
</a-row> <a-col :span="13">
<a-row class="quarter-div"> <div class="datanum" style="color: #E24660;">{{ fileNum.pictures }}</div>
<a-col :span="11"> <div class="dataText">图片</div>
<img src="~@/assets/img/音频.png" /> </a-col>
</a-col> </a-row>
<a-col :span="13"> <a-row class="quarter-div">
<div class="datanum">{{ fileNum.audio }}</div> <a-col :span="11">
<div>音频</div> <img src="~@/assets/img/音频.png" />
</a-col> </a-col>
</a-row> <a-col :span="13">
<a-row class="quarter-div"> <div class="datanum" style="color: #22D780;">{{ fileNum.audio }}</div>
<a-col :span="11"> <div class="dataText">音频</div>
<img src="~@/assets/img/数据库.png" /> </a-col>
</a-col> </a-row>
<a-col :span="13"> <a-row class="quarter-div">
<div class="datanum">{{ fileNum.dbfile }}</div> <a-col :span="11">
<div>数据库文件</div> <img src="~@/assets/img/数据库.png" />
</a-col> </a-col>
</a-row> <a-col :span="13">
<a-row class="quarter-div"> <div class="datanum" style="color: #26E0EC;">{{ fileNum.dbfile }}</div>
<a-col :span="11"> <div class="dataText">数据库<br/>文件</div>
<img src="~@/assets/img/视频.png" /> </a-col>
</a-col> </a-row>
<a-col :span="13"> <a-row class="quarter-div">
<div class="datanum">{{ fileNum.video }}</div> <a-col :span="11">
<div>视频</div> <img src="~@/assets/img/视频.png" />
</a-col> </a-col>
</a-row> <a-col :span="13">
<a-row class="quarter-div" style="margin-right: 0"> <div class="datanum" style="color: #AE78FF;">{{ fileNum.video }}</div>
<a-col :span="11"> <div class="dataText">视频</div>
<img src="~@/assets/img/文档.png" /> </a-col>
</a-col> </a-row>
<a-col :span="13"> <a-row class="quarter-div" style="margin-right: 0">
<div class="datanum">{{ fileNum.document }}</div> <a-col :span="11">
<div>文档</div> <img src="~@/assets/img/文档.png" />
</a-col> </a-col>
</a-row> <a-col :span="13">
</div> <div class="datanum" style="color: #43A0FF;">{{ fileNum.document }}</div>
<div class="linese"></div> <div class="dataText">文档</div>
<div class="linese" style="margin-top: 20px"></div> </a-col>
</a-row>
</div>
<div class="linese"></div>
<div class="linese" style="margin-top: 20px"></div>
<div class="search"> <div class="search">
<a-row :gutter="30"> <a-row :gutter="30">
<a-col :span="11"> <a-col :span="11">
<a-form layout="inline"> <a-form layout="inline">
<a-form-item> <a-form-item>
<a-input placeholder="请输入" v-model="searchFile.queryCondition" style="color: #fff;"></a-input> <a-input placeholder="请输入" v-model="searchFile.queryCondition" style="color: #fff;"></a-input>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-button type="primary" icon="search" style="margin-left: 21px" @click="searchgetFileList" <a-button type="primary" icon="search" style="margin-left: 21px" @click="searchgetFileList"
>查询</a-button >查询</a-button>
> <a-button type="primary" icon="reload" style="margin-left: 8px" @click="reloadFileList"
<a-button type="primary" icon="reload" style="margin-left: 8px" @click="reloadFileList" >重置</a-button
>重置</a-button >
> </a-form-item>
</a-form-item> </a-form>
</a-form> </a-col>
</a-col> <a-col :span="11" style="text-align: right">
<a-col :span="11" style="text-align: right"> <a-button type="primary" style="margin-left: 8px" @click="clickfile">
<a-button type="primary" style="margin-left: 8px" @click="clickfile"> <a-icon type="upload" />
<a-icon type="upload" /> 文件上传
文件上传 </a-button>
</a-button> </a-col>
</a-col> </a-row>
</a-row> </div>
</div> <div class="rtable" ref="tableContainer">
<div class="rtable" ref="tableContainer"> <a-table
<a-table ref="table"
ref="table" bordered
bordered size="middle"
size="middle" rowKey="id"
rowKey="id" :columns="columns"
:columns="columns" class="fileTable"
class="fileTable" :pagination="false"
:pagination="false" :scroll="{ x:false,y:tableScrollY }"
:scroll="{ x:false,y:tableScrollY }" :dataSource="dataSource"
:dataSource="dataSource" :loading="loading"
:loading="loading" @change="handleTableChange"
@change="handleTableChange" >
> <span slot="action" slot-scope="text, record">
<span slot="action" slot-scope="text, record"> <a @click="download(record, $event)">下载</a>&nbsp; <a @click="viewFile(record, $event)">预览</a>&nbsp;
<a @click="download(record, $event)">下载</a>&nbsp; <a @click="viewFile(record, $event)">预览</a>&nbsp; <a @click="DeleteFile(record, $event)">删除</a>
<a @click="DeleteFile(record, $event)">删除</a> </span>
</span> </a-table>
</a-table> </div>
</div> <div class="linese"></div>
<div class="linese"></div> </div>
</div> </a-col>
</div> </a-row>
<a-modal v-model="isopen" :title="modalTitle" ok-text="确认" cancel-text="取消" @ok="hideModal"> <a-modal v-model="isopen" :title="modalTitle" ok-text="确认" cancel-text="取消" @ok="hideModal">
<a-input placeholder="请输入" v-model="dirName" style="color: #000000 !important"></a-input> <a-input placeholder="请输入" v-model="dirName" style="color: #000000 !important"></a-input>
</a-modal> </a-modal>
@ -436,8 +440,6 @@ export default {
.flodContent { .flodContent {
height: calc(100vh - 240px); height: calc(100vh - 240px);
overflow-y: auto; overflow-y: auto;
width: 300px;
float: left;
margin-right: 20px; margin-right: 20px;
} }
.siderHeader { .siderHeader {
@ -445,11 +447,10 @@ export default {
} }
.teeediv { .teeediv {
height: calc(100vh - 320px); height: calc(100vh - 320px);
background: rgb(17, 42, 64); background: #e6e9f1;
} }
.righttop { .righttop {
width: calc(100vw - 400px);
height: calc(100vh - 240px); height: calc(100vh - 240px);
float: left; float: left;
} }
@ -458,15 +459,14 @@ export default {
} }
.quarter-div { .quarter-div {
width: calc(16.6vw - 86px);
height: 130px; height: 130px;
float: left; float: left;
margin-right: 20px; margin-right: 20px;
border: 2px solid rgb(11, 72, 98);
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
text-align: center; text-align: center;
padding: 20px 0; padding: 20px 0;
background:#092776;
} }
.quarter-div .ant-col-11 { .quarter-div .ant-col-11 {
@ -474,12 +474,15 @@ export default {
} }
.quarter-div div { .quarter-div div {
text-align: left; text-align: left;
line-height: 50px; padding-left: 14px;
padding-left: 10px;
} }
.quarter-div .datanum { .quarter-div .datanum {
padding-top: 12px;
font-size: 26px; font-size: 26px;
} }
.quarter-div .dataText {
font-size: 16px;
}
.rtable { .rtable {
height: calc(100vh - 516px); height: calc(100vh - 516px);
} }

14
src/views/task/statistics.vue
View File

@ -28,17 +28,15 @@
<div class="linese"></div> <div class="linese"></div>
</a-col> </a-col>
<a-col :md="17" style="padding-right:10px;"> <a-col :md="17" style="padding-right:10px;">
<div class="linese"></div> <div class="linese"></div>
<a-row> <a-row>
<div style="margin-left: 10px;"> <div style="margin-left: 10px; background: #092776;">
<a-col :span="5" class="quarter-div"> <a-col :span="5" class="quarter-div">
<a-col :span="8"> <a-col :span="8">
<img src="~@/assets/img/icon-结构化数据条数.png" /> <img src="~@/assets/img/icon-结构化数据条数.png" />
</a-col> </a-col>
<a-col :span="16"> <a-col :span="16">
<div class="datanum">{{ fileNum.totalNumRow }}</div> <div class="datanum" style="color: #26E0EC;">{{ fileNum.totalNumRow }}</div>
<div>结构化数据条数</div> <div>结构化数据条数</div>
</a-col> </a-col>
</a-col> </a-col>
@ -47,7 +45,7 @@
<img src="~@/assets/img/icon非结构化文件大小.png" /> <img src="~@/assets/img/icon非结构化文件大小.png" />
</a-col> </a-col>
<a-col :span="16"> <a-col :span="16">
<div class="datanum">{{ fileNum.totalFileSize }}GB</div> <div class="datanum" style="color: #15C029;">{{ fileNum.totalFileSize }}GB</div>
<div>非结构化文件(大小)</div> <div>非结构化文件(大小)</div>
</a-col> </a-col>
</a-col> </a-col>
@ -56,7 +54,7 @@
<img src="~@/assets/img/icon-表数量.png" /> <img src="~@/assets/img/icon-表数量.png" />
</a-col> </a-col>
<a-col :span="14"> <a-col :span="14">
<div class="datanum">{{ fileNum.tableCount }}</div> <div class="datanum" style="color: #FF8A00;">{{ fileNum.tableCount }}</div>
<div>表数量</div> <div>表数量</div>
</a-col> </a-col>
</a-col> </a-col>
@ -65,7 +63,7 @@
<img src="~@/assets/img/icon-文件接引数量.png" /> <img src="~@/assets/img/icon-文件接引数量.png" />
</a-col> </a-col>
<a-col :span="14"> <a-col :span="14">
<div class="datanum">{{ fileNum.fileLinkCount }}</div> <div class="datanum" style="color: #FFFD2E;">{{ fileNum.fileLinkCount }}</div>
<div>文件接引数量</div> <div>文件接引数量</div>
</a-col> </a-col>
</a-col> </a-col>
@ -74,7 +72,7 @@
<img src="~@/assets/img/icon-文档数量.png" /> <img src="~@/assets/img/icon-文档数量.png" />
</a-col> </a-col>
<a-col :span="14"> <a-col :span="14">
<div class="datanum">{{ fileNum.docFileCount }}</div> <div class="datanum" style="color: #2EA4FF;">{{ fileNum.docFileCount }}</div>
<div>文档数量</div> <div>文档数量</div>
</a-col> </a-col>
</a-col> </a-col>