按照第二版设计图修改样式
This commit is contained in:
RenCheng
parent
11ed62275b
commit
e51cd036bd
|
|
@ -6,8 +6,8 @@
|
|||
<div class="buttontext">任务管理</div>
|
||||
<div class="buttonicon"><img src="~@/assets/img/任务管理.png"></div>
|
||||
</a-col>
|
||||
<a-col :span="4" class="clickbutton" @click="openlink('/#/datalink/water')">
|
||||
<div class="buttontext">数据导入</div>
|
||||
<a-col :span="4" class="clickbutton" @click="openlink('sjsxybs://test')">
|
||||
<div class="buttontext">数据筛选与报送</div>
|
||||
<div class="buttonicon"><img src="~@/assets/img/数据接入.png"></div>
|
||||
</a-col>
|
||||
<a-col :span="4" class="clickbutton" @click="openlink('/#/datalink/dblink')">
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
</a-col>
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<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>
|
||||
</span>
|
||||
</a-row>
|
||||
|
|
|
|||
|
|
@ -3,15 +3,15 @@
|
|||
<a-col :md="14" >
|
||||
<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-option v-for="d in dataTypedataSources" :key="d.enName">
|
||||
{{ d.cnName }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 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
|
||||
ref="table"
|
||||
size="middle"
|
||||
|
|
@ -30,7 +30,7 @@
|
|||
</a-col>
|
||||
<a-col :md="10">
|
||||
<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">
|
||||
<a-form layout="inline">
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
<!-- table区域-begin -->
|
||||
<div class="datacleanResult">
|
||||
<div class="progressbg">
|
||||
<div class="title">发布进度：</div>
|
||||
<div class="title">发布进度:</div>
|
||||
<a-progress :percent="percent" status="active" class="progress" />
|
||||
</div>
|
||||
<a-list :data-source="contentList" style="padding:10px 20px;">
|
||||
|
|
@ -231,48 +231,54 @@
|
|||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
/deep/ .ant-table-bordered .ant-table-header > table {
|
||||
border: none !important;
|
||||
}
|
||||
.datacleanResult{
|
||||
height:calc(100vh - 374px);
|
||||
overflow-y:auto;
|
||||
margin: 10px;
|
||||
background: rgb(11,34,52);
|
||||
/deep/ .ant-table-bordered .ant-table-header>table {
|
||||
border: none !important;
|
||||
}
|
||||
.datacleanResult .progressbg{
|
||||
|
||||
.datacleanResult {
|
||||
height: calc(100vh - 374px);
|
||||
overflow-y: auto;
|
||||
margin: 10px;
|
||||
background: #F1F4FA;
|
||||
}
|
||||
|
||||
.datacleanResult .progressbg {
|
||||
margin: 10px;
|
||||
height: 60px;
|
||||
padding:20px 10px;
|
||||
background: rgb(17,42,64);
|
||||
|
||||
padding: 20px 10px;
|
||||
background: #D6DAE2;
|
||||
|
||||
}
|
||||
.datacleanResult .title{
|
||||
|
||||
.datacleanResult .title {
|
||||
width: 14%;
|
||||
font-size: 16px;
|
||||
float: left;
|
||||
text-align: right;
|
||||
line-height: 20px;
|
||||
color:#fff;
|
||||
color: #363F56;
|
||||
}
|
||||
.datacleanResult .progress{
|
||||
|
||||
.datacleanResult .progress {
|
||||
width: 86%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.datacleanResult .ant-progress-bg,
|
||||
.datacleanResult .ant-progress-inner{
|
||||
.datacleanResult .ant-progress-inner {
|
||||
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{
|
||||
color:#fff !important;
|
||||
/deep/ .datacleanResult .ant-progress-text {
|
||||
color: #fff !important;
|
||||
}
|
||||
.datacleanResult .ant-list-items{
|
||||
border-bottom:1px dashed rgb(35,72,100);
|
||||
color:#fff;
|
||||
|
||||
.datacleanResult .ant-list-items {
|
||||
border-bottom: 1px dashed rgb(35, 72, 100);
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<a-row :gutter="30">
|
||||
<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-option v-for="d in dataTypedataSources" :key="d.id">
|
||||
{{ d.cnName }}
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
</a-select>
|
||||
</div>
|
||||
<!-- 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
|
||||
ref="table"
|
||||
size="middle"
|
||||
|
|
|
|||
|
|
@ -1,142 +1,146 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="filecontent">
|
||||
<div class="flodContent">
|
||||
<div class="linese"></div>
|
||||
<div class="siderHeader echartsTitle">
|
||||
<div class="ecicon"></div>
|
||||
文件目录
|
||||
</div>
|
||||
<a-dropdown :trigger="['contextmenu']">
|
||||
<a-directory-tree
|
||||
:tree-data="treeData"
|
||||
v-model:expandedKeys="expandedKeys"
|
||||
class="teeediv"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
@select="changeSelect"
|
||||
>
|
||||
<a-tree-node v-for="itemNode in treeData" :key="itemNode.id" :title="itemNode.title" :value="itemNode">
|
||||
</a-tree-node>
|
||||
</a-directory-tree>
|
||||
<template #overlay>
|
||||
<a-menu class="menu" @click="menuClick">
|
||||
<a-menu-item key="1">添加</a-menu-item>
|
||||
<a-menu-item key="2">重命名</a-menu-item>
|
||||
<a-menu-item key="3">删除</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
<div class="linese"></div>
|
||||
</div>
|
||||
<div class="righttop">
|
||||
<div class="linese"></div>
|
||||
<div style="height:130px">
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/文件总数.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum">{{ fileNum.total }}</div>
|
||||
<div>文件总数</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/图片.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum">{{ fileNum.pictures }}</div>
|
||||
<div>图片</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/音频.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum">{{ fileNum.audio }}</div>
|
||||
<div>音频</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/数据库.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum">{{ fileNum.dbfile }}</div>
|
||||
<div>数据库文件</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/视频.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum">{{ fileNum.video }}</div>
|
||||
<div>视频</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div" style="margin-right: 0">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/文档.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum">{{ fileNum.document }}</div>
|
||||
<div>文档</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div class="linese"></div>
|
||||
<div class="linese" style="margin-top: 20px"></div>
|
||||
<a-row>
|
||||
<a-col :span="6">
|
||||
<div class="flodContent">
|
||||
<div class="linese"></div>
|
||||
<div class="siderHeader echartsTitle">
|
||||
<div class="ecicon"></div>
|
||||
文件目录
|
||||
<!-- <a-button type="primary" style="margin-left: 21px;float: right;" @click="searchgetFileList">添加</a-button> -->
|
||||
</div>
|
||||
<a-dropdown :trigger="['contextmenu']">
|
||||
<a-directory-tree
|
||||
:tree-data="treeData"
|
||||
v-model:expandedKeys="expandedKeys"
|
||||
class="teeediv"
|
||||
v-model:selectedKeys="selectedKeys"
|
||||
@select="changeSelect"
|
||||
>
|
||||
<a-tree-node v-for="itemNode in treeData" :key="itemNode.id" :title="itemNode.title" :value="itemNode">
|
||||
</a-tree-node>
|
||||
</a-directory-tree>
|
||||
<template #overlay>
|
||||
<a-menu class="menu" @click="menuClick">
|
||||
<a-menu-item key="1">添加</a-menu-item>
|
||||
<a-menu-item key="2">重命名</a-menu-item>
|
||||
<a-menu-item key="3">删除</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
<div class="linese"></div>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<div class="righttop">
|
||||
<div class="linese"></div>
|
||||
<div style="height:130px;background: #e6e9f1;margin-left: 10px;" >
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/文件总数.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum" style="color: #FF9000;">{{ fileNum.total }}</div>
|
||||
<div class="dataText">文件总数</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/图片.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum" style="color: #E24660;">{{ fileNum.pictures }}</div>
|
||||
<div class="dataText">图片</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/音频.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum" style="color: #22D780;">{{ fileNum.audio }}</div>
|
||||
<div class="dataText">音频</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/数据库.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum" style="color: #26E0EC;">{{ fileNum.dbfile }}</div>
|
||||
<div class="dataText">数据库<br/>文件</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/视频.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum" style="color: #AE78FF;">{{ fileNum.video }}</div>
|
||||
<div class="dataText">视频</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row class="quarter-div" style="margin-right: 0">
|
||||
<a-col :span="11">
|
||||
<img src="~@/assets/img/文档.png" />
|
||||
</a-col>
|
||||
<a-col :span="13">
|
||||
<div class="datanum" style="color: #43A0FF;">{{ fileNum.document }}</div>
|
||||
<div class="dataText">文档</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div class="linese"></div>
|
||||
<div class="linese" style="margin-top: 20px"></div>
|
||||
|
||||
<div class="search">
|
||||
<a-row :gutter="30">
|
||||
<a-col :span="11">
|
||||
<a-form layout="inline">
|
||||
<a-form-item>
|
||||
<a-input placeholder="请输入" v-model="searchFile.queryCondition" style="color: #fff;"></a-input>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary" icon="search" style="margin-left: 21px" @click="searchgetFileList"
|
||||
>查询</a-button
|
||||
>
|
||||
<a-button type="primary" icon="reload" style="margin-left: 8px" @click="reloadFileList"
|
||||
>重置</a-button
|
||||
>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-col>
|
||||
<a-col :span="11" style="text-align: right">
|
||||
<a-button type="primary" style="margin-left: 8px" @click="clickfile">
|
||||
<a-icon type="upload" />
|
||||
文件上传
|
||||
</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div class="rtable" ref="tableContainer">
|
||||
<a-table
|
||||
ref="table"
|
||||
bordered
|
||||
size="middle"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
class="fileTable"
|
||||
:pagination="false"
|
||||
:scroll="{ x:false,y:tableScrollY }"
|
||||
:dataSource="dataSource"
|
||||
:loading="loading"
|
||||
@change="handleTableChange"
|
||||
>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="download(record, $event)">下载</a> <a @click="viewFile(record, $event)">预览</a>
|
||||
<a @click="DeleteFile(record, $event)">删除</a>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<div class="linese"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search">
|
||||
<a-row :gutter="30">
|
||||
<a-col :span="11">
|
||||
<a-form layout="inline">
|
||||
<a-form-item>
|
||||
<a-input placeholder="请输入" v-model="searchFile.queryCondition" style="color: #fff;"></a-input>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary" icon="search" style="margin-left: 21px" @click="searchgetFileList"
|
||||
>查询</a-button>
|
||||
<a-button type="primary" icon="reload" style="margin-left: 8px" @click="reloadFileList"
|
||||
>重置</a-button
|
||||
>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-col>
|
||||
<a-col :span="11" style="text-align: right">
|
||||
<a-button type="primary" style="margin-left: 8px" @click="clickfile">
|
||||
<a-icon type="upload" />
|
||||
文件上传
|
||||
</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
<div class="rtable" ref="tableContainer">
|
||||
<a-table
|
||||
ref="table"
|
||||
bordered
|
||||
size="middle"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
class="fileTable"
|
||||
:pagination="false"
|
||||
:scroll="{ x:false,y:tableScrollY }"
|
||||
:dataSource="dataSource"
|
||||
:loading="loading"
|
||||
@change="handleTableChange"
|
||||
>
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="download(record, $event)">下载</a> <a @click="viewFile(record, $event)">预览</a>
|
||||
<a @click="DeleteFile(record, $event)">删除</a>
|
||||
</span>
|
||||
</a-table>
|
||||
</div>
|
||||
<div class="linese"></div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<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-modal>
|
||||
|
|
@ -436,8 +440,6 @@ export default {
|
|||
.flodContent {
|
||||
height: calc(100vh - 240px);
|
||||
overflow-y: auto;
|
||||
width: 300px;
|
||||
float: left;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.siderHeader {
|
||||
|
|
@ -445,11 +447,10 @@ export default {
|
|||
}
|
||||
.teeediv {
|
||||
height: calc(100vh - 320px);
|
||||
background: rgb(17, 42, 64);
|
||||
background: #e6e9f1;
|
||||
}
|
||||
|
||||
.righttop {
|
||||
width: calc(100vw - 400px);
|
||||
height: calc(100vh - 240px);
|
||||
float: left;
|
||||
}
|
||||
|
|
@ -458,15 +459,14 @@ export default {
|
|||
}
|
||||
|
||||
.quarter-div {
|
||||
width: calc(16.6vw - 86px);
|
||||
height: 130px;
|
||||
float: left;
|
||||
margin-right: 20px;
|
||||
border: 2px solid rgb(11, 72, 98);
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
background:#092776;
|
||||
}
|
||||
|
||||
.quarter-div .ant-col-11 {
|
||||
|
|
@ -474,12 +474,15 @@ export default {
|
|||
}
|
||||
.quarter-div div {
|
||||
text-align: left;
|
||||
line-height: 50px;
|
||||
padding-left: 10px;
|
||||
padding-left: 14px;
|
||||
}
|
||||
.quarter-div .datanum {
|
||||
padding-top: 12px;
|
||||
font-size: 26px;
|
||||
}
|
||||
.quarter-div .dataText {
|
||||
font-size: 16px;
|
||||
}
|
||||
.rtable {
|
||||
height: calc(100vh - 516px);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,17 +28,15 @@
|
|||
<div class="linese"></div>
|
||||
</a-col>
|
||||
<a-col :md="17" style="padding-right:10px;">
|
||||
|
||||
<div class="linese"></div>
|
||||
<a-row>
|
||||
<div style="margin-left: 10px;">
|
||||
|
||||
<div style="margin-left: 10px; background: #092776;">
|
||||
<a-col :span="5" class="quarter-div">
|
||||
<a-col :span="8">
|
||||
<img src="~@/assets/img/icon-结构化数据条数.png" />
|
||||
</a-col>
|
||||
<a-col :span="16">
|
||||
<div class="datanum">{{ fileNum.totalNumRow }}</div>
|
||||
<div class="datanum" style="color: #26E0EC;">{{ fileNum.totalNumRow }}</div>
|
||||
<div>结构化数据条数</div>
|
||||
</a-col>
|
||||
</a-col>
|
||||
|
|
@ -47,7 +45,7 @@
|
|||
<img src="~@/assets/img/icon非结构化文件大小.png" />
|
||||
</a-col>
|
||||
<a-col :span="16">
|
||||
<div class="datanum">{{ fileNum.totalFileSize }}GB</div>
|
||||
<div class="datanum" style="color: #15C029;">{{ fileNum.totalFileSize }}GB</div>
|
||||
<div>非结构化文件(大小)</div>
|
||||
</a-col>
|
||||
</a-col>
|
||||
|
|
@ -56,7 +54,7 @@
|
|||
<img src="~@/assets/img/icon-表数量.png" />
|
||||
</a-col>
|
||||
<a-col :span="14">
|
||||
<div class="datanum">{{ fileNum.tableCount }}</div>
|
||||
<div class="datanum" style="color: #FF8A00;">{{ fileNum.tableCount }}</div>
|
||||
<div>表数量</div>
|
||||
</a-col>
|
||||
</a-col>
|
||||
|
|
@ -65,7 +63,7 @@
|
|||
<img src="~@/assets/img/icon-文件接引数量.png" />
|
||||
</a-col>
|
||||
<a-col :span="14">
|
||||
<div class="datanum">{{ fileNum.fileLinkCount }}</div>
|
||||
<div class="datanum" style="color: #FFFD2E;">{{ fileNum.fileLinkCount }}</div>
|
||||
<div>文件接引数量</div>
|
||||
</a-col>
|
||||
</a-col>
|
||||
|
|
@ -74,7 +72,7 @@
|
|||
<img src="~@/assets/img/icon-文档数量.png" />
|
||||
</a-col>
|
||||
<a-col :span="14">
|
||||
<div class="datanum">{{ fileNum.docFileCount }}</div>
|
||||
<div class="datanum" style="color: #2EA4FF;">{{ fileNum.docFileCount }}</div>
|
||||
<div>文档数量</div>
|
||||
</a-col>
|
||||
</a-col>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user