center/dataease-dm
center/dataease-dm
13
0
Fork 0
forked from github/dataease
Code Pull Requests Activity

Merge pull request #903 from dataease/pr@dev@style_theme_panel

Browse Source 
style: 完善深色主题样式
This commit is contained in:
fit2cloud-chenyw 2021-10-11 19:11:39 +08:00 committed by GitHub
commit 2bf3d3f137
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 281 additions and 187 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/components/Notification/index.vue
View File

@ -262,7 +262,17 @@ export default {
padding-top: 5px; padding-top: 5px;
:hover { :hover {
cursor: pointer; cursor: pointer;
background-color: #f4f4f5; background-color: #f4f4f5;
} }
} }
.blackTheme .msg-foot-class {
padding-top: 5px;
:hover {
cursor: pointer;
background-color: #171422;
}
}
</style> </style>

2
frontend/src/components/canvas/components/Editor/ContextMenu.vue
View File

@ -155,7 +155,7 @@ export default {
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background-color: #f5f7fa; background-color: var(--background-color-base, #f5f7fa);
} }
} }
} }

2
frontend/src/components/canvas/components/Editor/SettingMenu.vue
View File

@ -175,7 +175,7 @@ export default {
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background-color: #f5f7fa; background-color: var(--background-color-base, #f5f7fa);
} }
} }
} }

2
frontend/src/components/canvas/components/Editor/SettingMenuTest.vue
View File

@ -173,7 +173,7 @@ export default {
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background-color: #f5f7fa; background-color: var(--background-color-base, #f5f7fa);
} }
} }
} }

2
frontend/src/layout/components/Topbar.vue
View File

@ -34,7 +34,7 @@
</div> </div>
</template> </template>
<el-dropdown class="top-dropdown" style="display: flex;align-items: center; width:100px;"> <el-dropdown class="top-dropdown" style="display: flex;align-items: center; width:100px;" trigger="click">
<span class="el-dropdown-link" style="color: var(--TopTextColor);font-size: 14px;max-width: 80px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;"> <span class="el-dropdown-link" style="color: var(--TopTextColor);font-size: 14px;max-width: 80px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
{{ name }} {{ name }}
<i class="el-icon-arrow-down el-icon--right" /> <i class="el-icon-arrow-down el-icon--right" />

78
frontend/src/styles/index.scss
View File

@ -1,10 +1,10 @@
$--font-path: '~element-ui/lib/theme-chalk/fonts'; $--font-path: '~element-ui/lib/theme-chalk/fonts';
.defaultTheme { /* .defaultTheme {
@import './theme/default.scss'; @import './theme/default.scss';
@import "~element-ui/packages/theme-chalk/src/index"; @import "~element-ui/packages/theme-chalk/src/index";
} } */
.blackTheme { .blackTheme {
@import './theme/dark.scss'; @import './theme/dark.scss';
@import "~element-ui/packages/theme-chalk/src/index"; @import "~element-ui/packages/theme-chalk/src/index";
@ -360,6 +360,8 @@ div:focus {
z-index: 10000 !important; z-index: 10000 !important;
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
width: 10px; width: 10px;
height: 10px; height: 10px;
@ -367,6 +369,7 @@ div:focus {
border-radius: 4px; border-radius: 4px;
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 5px; width: 5px;
height: 5px; height: 5px;
@ -455,9 +458,9 @@ div:focus {
border-color: var(--border-color-input) !important; border-color: var(--border-color-input) !important;
} }
.blackTheme .el-popover { /* .blackTheme .el-popover {
background-color: var(--MainBG); background-color: var(--MainBG);
} } */
.blackTheme .main-area-input { .blackTheme .main-area-input {
input.el-input__inner { input.el-input__inner {
@ -497,12 +500,13 @@ div:focus {
background-color: var(--MainBG) !important; background-color: var(--MainBG) !important;
color: var(--Main) !important; color: var(--Main) !important;
} }
.blackTheme .el-dialog { /* .blackTheme .el-dialog {
background: var(--ContentBG) !important; background: var(--ContentBG) !important;
color: var(--TextPrimary) !important; color: var(--TextPrimary) !important;
} }
*/
.blackTheme .el-dialog__title { .blackTheme .el-dialog__title {
color: var(--TextPrimary) !important; color: #ffffff !important;
} }
.blackTheme .title-text { .blackTheme .title-text {
@ -557,12 +561,60 @@ div:focus {
.blackTheme .el-submenu__title { .blackTheme .el-submenu__title {
color: var(--TextPrimary) ; color: var(--TextPrimary) ;
} }
.blackTheme .el-drawer__body {
background-color: var(--MainContentBG);
}
.blackTheme .el-select-dropdown__item.hover {
background-color: #171B22 !important;
}
.blackTheme .el-select-dropdown__item:hover {
background-color: #171B22 !important;
}
.blackTheme .el-dropdown-menu__item:not(.is-disabled):hover {
background-color: #171B22 !important;
}
.blackTheme .el-dropdown-menu__item:focus {
background-color: #171B22 !important;
}
.blackTheme .el-dropdown-menu__item--divided:before {
background-color: #000000 !important;
}
.blackTheme .el-card__header {
border-color: var(--TableBorderColor) !important;
}
.blackTheme .CodeMirror {
background-color: #000000 ;
color: #ffffff;
}
.blackTheme .CodeMirror-code {
background-color: transparent;
}
.blackTheme .CodeMirror-gutters {
background-color: #000000 ;
}
.blackTheme .el-radio-button__inner {
background-color: var(--TableBG);
color: var(--TableColor);
border: var(--TableBorder);
}
.blackTheme .el-loading-mask {
background-color: rgb(135 131 131 / 70%);
}
.blackTheme >>> ::-webkit-scrollbar-thumb {
background: #38393a !important;
}
/* .chart-radio-div {
label.el-radio {
span.el-radio__input {
display: none !important;
}
}
} */

13
frontend/src/styles/theme/dark.scss
View File

@ -16,13 +16,13 @@ $--border-color-light: #495865;
$--border-color-lighter: #495865; $--border-color-lighter: #495865;
$--border-color-extra-light: #495865; $--border-color-extra-light: #495865;
$--color-white: #FFFFFF; $--color-white: #21333b;
$--color-black: #000000; $--color-black: #FFFFFF;
$--color-text-regular: #fff;
$--background-color-base: #171b22; $--background-color-base: #171b22;
// 与CSS原生变量映射 // 与CSS原生变量映射
#app { #app {
--Main:#2681ff; --Main:#2681ff;
@ -53,6 +53,11 @@ $--background-color-base: #171b22;
--TableColor: #acbac3; --TableColor: #acbac3;
--TableBorder: .05rem solid #495865; --TableBorder: .05rem solid #495865;
--TableBorderColor: #495865; --TableBorderColor: #495865;
--background-color-base: #171b22;
} }

35
frontend/src/styles/theme/default.scss
View File

@ -1,35 +0,0 @@
/* 改变主题色变量 */
$--color-primary: #409EFF;
$--color-success: #67C23A;
$--color-warning: #E6A23C;
$--color-danger: #F56C6C;
$--color-info: #909399;
$--color-text-primary: #303133;
$--color-text-regular: #606266;
$--color-text-secondary: #909399;
$--color-text-placeholder: #C0C4CC;
$--border-color-base: #DCDFE6;
$--border-color-light: #E4E7ED;
$--border-color-lighter: #EBEEF5;
$--border-color-extra-light: #F2F6FC;
$--color-white: #FFFFFF;
$--color-black: #000000;
$--background-color-base: #F5F7FA;
// 与CSS原生变量映射
#app {
--Main:#00B9AD;
--test:#FF9227;
--color-primary: #00B9AD;
--MainBG: #FFFFFF;
--border-color-input: #DCDFE6;
--border-color-input-hovor: #C0C4CC;
}

16
frontend/src/views/chart/view/ChartEdit.vue
View File

@ -1672,7 +1672,7 @@ export default {
.blackTheme .item-dimension { .blackTheme .item-dimension {
border: solid 1px ; border: solid 1px ;
border-color: var(--MainBorderColor); border-color: var(--TableBorderColor);
color: var(--TextPrimary); color: var(--TextPrimary);
background-color: var(--MainBG); background-color: var(--MainBG);
} }
@ -1710,7 +1710,7 @@ export default {
.blackTheme .item-quota { .blackTheme .item-quota {
border: solid 1px ; border: solid 1px ;
border-color: var(--MainBorderColor); border-color: var(--TableBorderColor);
color: var(--TextPrimary); color: var(--TextPrimary);
background-color: var(--MainBG); background-color: var(--MainBG);
@ -1802,7 +1802,7 @@ export default {
} }
.blackTheme .attr-style{ .blackTheme .attr-style{
border-color: var(--MainBorderColor) !important; border-color: var(--TableBorderColor) !important;
color: var(--TextPrimary); color: var(--TextPrimary);
} }
@ -1873,7 +1873,7 @@ export default {
.blackTheme .field-height{ .blackTheme .field-height{
border-top: 1px solid ; border-top: 1px solid ;
border-color: var(--MainBorderColor) !important; border-color: var(--TableBorderColor) !important;
} }
.padding-tab{ .padding-tab{
padding: 0; padding: 0;
@ -1899,7 +1899,7 @@ export default {
} }
.blackTheme .drag-block-style{ .blackTheme .drag-block-style{
border: 1px solid ; border: 1px solid ;
border-color: var(--MainBorderColor); border-color: var(--TableBorderColor);
background-color: var(--ContentBG); background-color: var(--ContentBG);
} }
@ -1918,16 +1918,16 @@ export default {
} }
.blackTheme .theme-border-class { .blackTheme .theme-border-class {
border-color: var(--MainBorderColor) !important; border-color: var(--TableBorderColor) !important;
color: var(--TextPrimary) !important; color: var(--TextPrimary) !important;
background-color: var(--ContentBG); background-color: var(--ContentBG);
} }
.blackTheme .padding-lr { .blackTheme .padding-lr {
border-color: var(--MainBorderColor) !important; border-color: var(--TableBorderColor) !important;
} }
.blackTheme .theme-item-class { .blackTheme .theme-item-class {
background-color: var(--MainBG) !important; background-color: var(--MainBG) !important;
border-color: var(--MainBorderColor) !important; border-color: var(--TableBorderColor) !important;
} }
</style> </style>

7
frontend/src/views/dataset/add/AddCustom.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<el-col> <el-col>
<el-row style="height: 26px;"> <el-row style="height: 26px;" class="title-text">
<span style="line-height: 26px;"> <span style="line-height: 26px;">
{{ param.tableId?$t('dataset.edit_custom_table'):$t('dataset.add_custom_table') }} {{ param.tableId?$t('dataset.edit_custom_table'):$t('dataset.add_custom_table') }}
</span> </span>
@ -292,6 +292,11 @@ export default {
height: calc(100vh - 56px - 15px - 26px - 25px - 43px); height: calc(100vh - 56px - 15px - 26px - 25px - 43px);
} }
.blackTheme .panel-height{
height: calc(100vh - 56px - 15px - 26px - 25px - 43px);
border-color: var(--TableBorderColor) !important;
}
.span-number{ .span-number{
color: #0a7be0; color: #0a7be0;
} }

2
frontend/src/views/dataset/add/AddDB.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<el-row style="display: flex;flex-direction: column;height: 100%"> <el-row style="display: flex;flex-direction: column;height: 100%">
<el-row style="height: 26px;"> <el-row style="height: 26px;" class="title-text">
<span style="line-height: 26px;"> <span style="line-height: 26px;">
{{ $t('dataset.add_db_table') }} {{ $t('dataset.add_db_table') }}
</span> </span>

96
frontend/src/views/dataset/add/AddExcel.vue
View File

@ -1,18 +1,18 @@
<template> <template>
<el-col> <el-col>
<el-row> <el-row>
<el-row style="height: 26px;"> <el-row style="height: 26px;" class="title-text">
<span style="line-height: 26px;"> <span style="line-height: 26px;">
{{ param.tableId?$t('dataset.edit_excel_table'):$t('dataset.add_excel_table') }} {{ param.tableId?$t('dataset.edit_excel_table'):$t('dataset.add_excel_table') }}
</span> </span>
<span style="line-height: 26px;"> <span style="line-height: 26px;">
<el-tooltip class="item" effect="dark" content="Right Bottom 提示文字" placement="bottom"> <el-tooltip class="item" effect="dark" content="Right Bottom 提示文字" placement="bottom">
<div slot="content"> <div slot="content">
{{$t('dataset.excel_info_1')}}<br/> {{ $t('dataset.excel_info_1') }}<br>
{{$t('dataset.excel_info_2')}}<br/> {{ $t('dataset.excel_info_2') }}<br>
{{$t('dataset.excel_info_3')}} {{ $t('dataset.excel_info_3') }}
</div> </div>
<i class="el-icon-info" style="cursor: pointer;"></i> <i class="el-icon-info" style="cursor: pointer;" />
</el-tooltip> </el-tooltip>
</span> </span>
<el-row style="float: right"> <el-row style="float: right">
@ -26,11 +26,10 @@
</el-row> </el-row>
<el-divider /> <el-divider />
<el-row style="margin-top: 10px;"> <el-row style="margin-top: 10px;">
<el-container> <el-container>
<el-aside width="200px" > <el-aside width="200px">
<el-row> <el-row>
<el-col style="width: 200px;"> <el-col style="width: 200px;">
<el-form :inline="true" size="mini" class="row-style"> <el-form :inline="true" size="mini" class="row-style">
@ -58,19 +57,18 @@
</el-col> </el-col>
</el-row> </el-row>
<el-tree
<el-tree ref="tree" ref="tree"
:data="excelData" :data="excelData"
:default-expanded-keys=defaultExpandedKeys :default-expanded-keys="defaultExpandedKeys"
:default-checked-keys=defaultCheckedKeys :default-checked-keys="defaultCheckedKeys"
node-key="id" node-key="id"
:props="props" :props="props"
show-checkbox show-checkbox
highlight-current highlight-current
@node-click="handleNodeClick" @node-click="handleNodeClick"
@check-change="handleCheckChange"> @check-change="handleCheckChange"
</el-tree> />
</el-aside> </el-aside>
@ -79,13 +77,13 @@
<el-row> <el-row>
<el-col style="width: 500px;"> <el-col style="width: 500px;">
<el-form :inline="true" size="mini" class="row-style"> <el-form :inline="true" size="mini" class="row-style">
<el-form-item class="form-item" :label="$t('dataset.name')" v-show="!param.tableId"> <el-form-item v-show="!param.tableId" class="form-item" :label="$t('dataset.name')">
<el-input v-model="sheetObj.datasetName" :placeholder="$t('commons.name')" @change="changeDatasetName" /> <el-input v-model="sheetObj.datasetName" :placeholder="$t('commons.name')" @change="changeDatasetName" />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<div> <div>
<span>{{ $t('dataset.data_preview') }}</span> <span>{{ $t('dataset.data_preview') }}</span>
<span style="font-size: 12px;color: #3d4d66;">（{{ $t('dataset.preview_100_data') }}）</span> <span class="limit-length-data">（{{ $t('dataset.preview_100_data') }}）</span>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -94,7 +92,7 @@
</el-header> </el-header>
<el-main> <el-main>
<div class="text item" > <div class="text item">
<ux-grid <ux-grid
ref="plxTable" ref="plxTable"
size="mini" size="mini"
@ -136,9 +134,9 @@
{{ field.remarks }} {{ field.remarks }}
</span> </span>
</span> </span>
<!-- <span v-else style="font-size: 12px;">--> <!-- <span v-else style="font-size: 12px;">-->
<!-- {{ field.remarks }}--> <!-- {{ field.remarks }}-->
<!-- </span>--> <!-- </span>-->
</template> </template>
</ux-table-column> </ux-table-column>
</ux-grid> </ux-grid>
@ -176,7 +174,7 @@ export default {
}, },
data() { data() {
return { return {
sheetObj: {datasetName: " ", fields: []}, sheetObj: { datasetName: ' ', fields: [] },
sheets: [], sheets: [],
data: [], data: [],
mode: '1', mode: '1',
@ -220,20 +218,20 @@ export default {
}, },
methods: { methods: {
handleCheckChange(data, checked, indeterminate) { handleCheckChange(data, checked, indeterminate) {
if(checked){ if (checked) {
this.defaultCheckedKeys.push(data.id) this.defaultCheckedKeys.push(data.id)
this.handleNodeClick(data) this.handleNodeClick(data)
}else { } else {
var index = this.defaultCheckedKeys.findIndex(id => { var index = this.defaultCheckedKeys.findIndex(id => {
if ( id == data.id) { if (id == data.id) {
return true; return true
} }
}) })
this.defaultCheckedKeys.splice(index,1) this.defaultCheckedKeys.splice(index, 1)
} }
}, },
handleNodeClick(data) { handleNodeClick(data) {
if(data.sheet){ if (data.sheet) {
this.sheetObj = data this.sheetObj = data
this.fields = data.fields this.fields = data.fields
this.jsonArray = data.jsonArray this.jsonArray = data.jsonArray
@ -241,11 +239,11 @@ export default {
this.$refs.plxTable.reloadData(datas) this.$refs.plxTable.reloadData(datas)
} }
}, },
changeDatasetName(){ changeDatasetName() {
for(var i=0;i<this.excelData.length;i++){ for (var i = 0; i < this.excelData.length; i++) {
if(this.excelData[i].excelId==this.sheetObj.sheetExcelId){ if (this.excelData[i].excelId == this.sheetObj.sheetExcelId) {
for(var j=0;j<this.excelData[i].sheets.length;j++){ for (var j = 0; j < this.excelData[i].sheets.length; j++) {
if(this.excelData[i].sheets[j].excelId==this.sheetObj.sheetId){ if (this.excelData[i].sheets[j].excelId == this.sheetObj.sheetId) {
this.excelData[i].sheets[j] = this.sheetObj this.excelData[i].sheets[j] = this.sheetObj
} }
} }
@ -287,19 +285,18 @@ export default {
this.defaultExpandedKeys.push(response.data.id) this.defaultExpandedKeys.push(response.data.id)
this.defaultCheckedKeys.push(response.data.sheets[0].id) this.defaultCheckedKeys.push(response.data.sheets[0].id)
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.tree.setCheckedKeys(this.defaultCheckedKeys); this.$refs.tree.setCheckedKeys(this.defaultCheckedKeys)
}); })
this.fileList = fileList this.fileList = fileList
}, },
save() { save() {
var validate = true
var validate = true;
var selectedSheet = [] var selectedSheet = []
var sheetFileMd5 = [] var sheetFileMd5 = []
var selectNode = this.$refs.tree.getCheckedNodes() var selectNode = this.$refs.tree.getCheckedNodes()
for(var i=0;i<selectNode.length;i++){ for (var i = 0; i < selectNode.length; i++) {
if(selectNode[i].sheet){ if (selectNode[i].sheet) {
if (!selectNode[i].datasetName || selectNode[i].datasetName === '') { if (!selectNode[i].datasetName || selectNode[i].datasetName === '') {
validate = false validate = false
this.$message({ this.$message({
@ -322,12 +319,12 @@ export default {
sheetFileMd5.push(selectNode[i].fieldsMd5) sheetFileMd5.push(selectNode[i].fieldsMd5)
} }
} }
if(selectedSheet.length == 0){ if (selectedSheet.length == 0) {
this.$message.warning(this.$t('dataset.ple_select_excel')) this.$message.warning(this.$t('dataset.ple_select_excel'))
return return
} }
if(!validate){ if (!validate) {
return; return
} }
let table = {} let table = {}
@ -353,7 +350,7 @@ export default {
editType: this.param.editType ? this.param.editType : 0 editType: this.param.editType ? this.param.editType : 0
} }
} }
if(new Set(sheetFileMd5).size !== sheetFileMd5.length && !this.param.tableId){ if (new Set(sheetFileMd5).size !== sheetFileMd5.length && !this.param.tableId) {
this.$confirm(this.$t('dataset.merge_msg'), this.$t('dataset.merge_title'), { this.$confirm(this.$t('dataset.merge_msg'), this.$t('dataset.merge_title'), {
distinguishCancelAndClose: true, distinguishCancelAndClose: true,
confirmButtonText: this.$t('dataset.merge'), confirmButtonText: this.$t('dataset.merge'),
@ -366,7 +363,7 @@ export default {
this.cancel() this.cancel()
}) })
}).catch(action => { }).catch(action => {
if(action === 'close'){ if (action === 'close') {
return return
} }
table.mergeSheet = false table.mergeSheet = false
@ -374,8 +371,8 @@ export default {
this.$emit('saveSuccess', table) this.$emit('saveSuccess', table)
this.cancel() this.cancel()
}) })
}); })
}else { } else {
post('/dataset/table/update', table).then(response => { post('/dataset/table/update', table).then(response => {
this.$emit('saveSuccess', table) this.$emit('saveSuccess', table)
this.cancel() this.cancel()
@ -439,12 +436,17 @@ export default {
} }
.el-header { .el-header {
background-color: rgb(241, 243, 248); background-color: var(--MainContentBG, rgb(241, 243, 248));
color: #333; color: var(--TextActive, #333);
line-height: 30px; line-height: 30px;
} }
.el-main { .el-main {
padding: 0px padding: 0px
} }
.limit-length-data {
font-size: 12px;
color: var(--TableColor, #3d4d66);
}
</style> </style>

4
frontend/src/views/dataset/add/AddSQL.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<el-col> <el-col>
<el-row> <el-row>
<el-row style="height: 26px;"> <el-row style="height: 26px;" class="title-text">
<span style="line-height: 26px;"> <span style="line-height: 26px;">
{{ param.tableId?$t('dataset.edit_sql'):$t('dataset.add_sql_table') }} {{ param.tableId?$t('dataset.edit_sql'):$t('dataset.add_sql_table') }}
</span> </span>
@ -145,7 +145,7 @@ export default {
theme: 'solarized', theme: 'solarized',
hintOptions: { // 自定义提示选项 hintOptions: { // 自定义提示选项
completeSingle: false // 当匹配只有一项的时候是否自动补全 completeSingle: false // 当匹配只有一项的时候是否自动补全
}, }
}, },
data: [], data: [],
fields: [], fields: [],

2
frontend/src/views/dataset/common/DatasetCustomField.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<el-col> <el-col>
<el-row style="height: 25px;"> <el-row style="height: 25px;">
<span class="table-name">{{ table.name }}</span> <span class="table-name title-text">{{ table.name }}</span>
</el-row> </el-row>
<el-divider /> <el-divider />
<el-checkbox v-model="checkAll" :disabled="!(fields.length > 0)" :indeterminate="isIndeterminate" style="font-weight: 400;" @change="handleCheckAllChange">{{ $t('dataset.check_all') }}</el-checkbox> <el-checkbox v-model="checkAll" :disabled="!(fields.length > 0)" :indeterminate="isIndeterminate" style="font-weight: 400;" @change="handleCheckAllChange">{{ $t('dataset.check_all') }}</el-checkbox>

38
frontend/src/views/dataset/data/CalcFieldEdit.vue
View File

@ -430,6 +430,13 @@ export default {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.blackTheme .item-dimension {
border: solid 1px ;
border-color: #495865;
color: #F2F6FC;
background-color: var(--MainBG);
}
.item-dimension + .item-dimension { .item-dimension + .item-dimension {
margin-top: 2px; margin-top: 2px;
} }
@ -441,6 +448,12 @@ export default {
cursor: pointer; cursor: pointer;
} }
.blackTheme .item-dimension:hover {
/* color: var(--Main); */
background: var(--ContentBG);
/* cursor: pointer; */
}
.item-quota { .item-quota {
padding: 2px 10px; padding: 2px 10px;
margin: 2px 2px 0 2px; margin: 2px 2px 0 2px;
@ -456,6 +469,15 @@ export default {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.blackTheme .item-quota {
border: solid 1px ;
border-color: #495865;
color: #F2F6FC;
background-color: var(--MainBG);
}
.item-quota + .item-quota { .item-quota + .item-quota {
margin-top: 2px; margin-top: 2px;
} }
@ -466,6 +488,11 @@ export default {
border-color: #b2d3a3; border-color: #b2d3a3;
cursor: pointer; cursor: pointer;
} }
.blackTheme .item-quota:hover {
background: var(--ContentBG);
}
span{ span{
font-size: 12px; font-size: 12px;
} }
@ -478,11 +505,22 @@ export default {
word-break: break-word; word-break: break-word;
border: solid 1px #eee; border: solid 1px #eee;
} }
.blackTheme .function-style {
border: solid 1px ;
border-color: #495865;
color: #F2F6FC;
background-color: var(--MainBG);
}
.function-style:hover { .function-style:hover {
background: #e8f4ff; background: #e8f4ff;
border-color: #a3d3ff; border-color: #a3d3ff;
cursor: pointer; cursor: pointer;
} }
.blackTheme .function-style:hover {
color: #1890ff;
background: var(--ContentBG);
}
.function-height{ .function-height{
height: calc(100% - 50px); height: calc(100% - 50px);
overflow: auto; overflow: auto;

4
frontend/src/views/login/index.vue
View File

@ -199,7 +199,7 @@ export default {
} }
.login-background { .login-background {
background-color: $--background-color-base; background-color: var(--MainBG, $--background-color-base);
height: 100vh; height: 100vh;
@include login-center; @include login-center;
} }
@ -208,7 +208,7 @@ export default {
min-width: 900px; min-width: 900px;
width: 1280px; width: 1280px;
height: 520px; height: 520px;
background-color: #FFFFFF; background-color: var(--MainContentBG, #FFFFFF);
@media only screen and (max-width: 1280px) { @media only screen and (max-width: 1280px) {
width: 900px; width: 900px;
height: 380px; height: 380px;

8
frontend/src/views/panel/AssistComponent/index.vue
View File

@ -179,7 +179,7 @@ export default {
.filter-header-text { .filter-header-text {
font-size: 14px; font-size: 14px;
max-width: 100%; max-width: 100%;
color: gray; color: var(--TextPrimary, gray);
text-align: left; text-align: left;
white-space: pre; white-space: pre;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -217,7 +217,7 @@ export default {
color: #3685f2; color: #3685f2;
} }
.filter-widget-text { .filter-widget-text {
color: #3d4d66; color: var(--TextActive, #3d4d66);
} }
} }
.time-filter:hover { .time-filter:hover {
@ -238,7 +238,7 @@ export default {
color: #23beef; color: #23beef;
} }
.filter-widget-text { .filter-widget-text {
color: #3d4d66; color: var(--TextActive, #3d4d66);
} }
} }
.text-filter:hover { .text-filter:hover {
@ -258,7 +258,7 @@ export default {
color: #37b4aa; color: #37b4aa;
} }
.filter-widget-text { .filter-widget-text {
color: #3d4d66; color: var(--TextActive, #3d4d66);
} }
} }
.tree-filter:hover { .tree-filter:hover {

39
frontend/src/views/panel/SubjectSetting/index.vue
View File

@ -9,37 +9,37 @@
<div v-if="collapseShow" style="margin: 10px;overflow-y: auto"> <div v-if="collapseShow" style="margin: 10px;overflow-y: auto">
<el-collapse v-model="activeNames" @change="handleChange"> <el-collapse v-model="activeNames" @change="handleChange">
<el-collapse-item :title="$t('panel.panel')" name="panel"> <el-collapse-item :title="$t('panel.panel')" name="panel">
<!-- <el-row class="shape-item">--> <!-- <el-row class="shape-item">-->
<!-- <span class="shape-item" style="margin-left: 10px">{{ $t('panel.new_element_distribution') }}:</span>--> <!-- <span class="shape-item" style="margin-left: 10px">{{ $t('panel.new_element_distribution') }}:</span>-->
<!-- &lt;!&ndash; <el-switch v-model="canvasStyleData.auxiliaryMatrix" :width="35" name="auxiliaryMatrix" />&ndash;&gt;--> <!-- &lt;!&ndash; <el-switch v-model="canvasStyleData.auxiliaryMatrix" :width="35" name="auxiliaryMatrix" />&ndash;&gt;-->
<!-- <el-radio-group v-model="canvasStyleData.auxiliaryMatrix" size="mini" name="auxiliaryMatrix" @change="styleChange">--> <!-- <el-radio-group v-model="canvasStyleData.auxiliaryMatrix" size="mini" name="auxiliaryMatrix" @change="styleChange">-->
<!-- <el-radio-button :label="true">--> <!-- <el-radio-button :label="true">-->
<!-- {{ $t('panel.matrix') }}<i class="icon iconfont icon-shujujuzhen" />--> <!-- {{ $t('panel.matrix') }}<i class="icon iconfont icon-shujujuzhen" />-->
<!-- </el-radio-button>--> <!-- </el-radio-button>-->
<!-- <el-radio-button :label="false">--> <!-- <el-radio-button :label="false">-->
<!-- {{ $t('panel.suspension') }}<i class="icon iconfont icon-xuanfuanniu" />--> <!-- {{ $t('panel.suspension') }}<i class="icon iconfont icon-xuanfuanniu" />-->
<!-- </el-radio-button>--> <!-- </el-radio-button>-->
<!-- </el-radio-group>--> <!-- </el-radio-group>-->
<!-- </el-row>--> <!-- </el-row>-->
<el-row style="background-color: #f7f8fa; margin: 5px"> <el-row class="selector-div">
<background-selector class="attr-selector" /> <background-selector class="attr-selector" />
<component-gap class="attr-selector" /> <component-gap class="attr-selector" />
<Panel-Refresh-Time class="attr-selector" /> <Panel-Refresh-Time class="attr-selector" />
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<el-collapse-item :title="$t('chart.module_style')" name="component"> <el-collapse-item :title="$t('chart.module_style')" name="component">
<el-row style="background-color: #f7f8fa; margin: 5px"> <el-row class="selector-div">
<!-- <title-selector class="attr-selector" :chart="chart" @onTextChange="onTextChange" />--> <!-- <title-selector class="attr-selector" :chart="chart" @onTextChange="onTextChange" />-->
<panel-background-color-selector v-if="chart" class="attr-selector" :chart="chart" @onChangeBackgroundForm="onChangeBackgroundForm" /> <panel-background-color-selector v-if="chart" class="attr-selector" :chart="chart" @onChangeBackgroundForm="onChangeBackgroundForm" />
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<el-collapse-item :title="$t('chart.shape_attr')" name="graphical"> <el-collapse-item :title="$t('chart.shape_attr')" name="graphical">
<el-row style="background-color: #f7f8fa; margin: 5px"> <el-row class="selector-div">
<panel-color-selector :source-type="'panelEchart'" class="attr-selector" :chart="chart" @onColorChange="onColorChange" /> <panel-color-selector :source-type="'panelEchart'" class="attr-selector" :chart="chart" @onColorChange="onColorChange" />
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<el-collapse-item :title="$t('panel.table')" name="table"> <el-collapse-item :title="$t('panel.table')" name="table">
<el-row style="background-color: #f7f8fa; margin: 5px"> <el-row class="selector-div">
<panel-color-selector index="10002" :source-type="'panelTable'" class="attr-selector" :chart="tableChart" @onColorChange="onTableColorChange" /> <panel-color-selector index="10002" :source-type="'panelTable'" class="attr-selector" :chart="tableChart" @onColorChange="onTableColorChange" />
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
@ -180,5 +180,12 @@ export default {
align-items: center; align-items: center;
z-index: 10001; z-index: 10001;
} }
.blackTheme .attr-selector{
background-color: var(--MainBG)
}
.selector-div {
background-color: var(--MainBG, #f7f8fa);
margin: 5px
}
</style> </style>

17
frontend/src/views/panel/edit/index.vue
View File

@ -27,7 +27,7 @@
<div class="button-div-class" style=" width: 24px;height: 24px;text-align: center;line-height: 1;position: relative;margin: 16px auto 0px;"> <div class="button-div-class" style=" width: 24px;height: 24px;text-align: center;line-height: 1;position: relative;margin: 16px auto 0px;">
<el-button :class="show&&showIndex===0? 'button-show':'button-closed'" circle class="el-icon-circle-plus-outline" size="mini" @click="showPanel(0)" /> <el-button :class="show&&showIndex===0? 'button-show':'button-closed'" circle class="el-icon-circle-plus-outline" size="mini" @click="showPanel(0)" />
</div> </div>
<div style="position: relative; margin: 18px auto 16px;"> <div class="button-text" style="position: relative; margin: 18px auto 16px;">
<div style="max-width: 100%;text-align: center;white-space: nowrap;text-overflow: ellipsis;position: relative;flex-shrink: 0;"> <div style="max-width: 100%;text-align: center;white-space: nowrap;text-overflow: ellipsis;position: relative;flex-shrink: 0;">
{{ $t('panel.view') }} {{ $t('panel.view') }}
</div> </div>
@ -42,7 +42,7 @@
<div class="button-div-class" style=" text-align: center;line-height: 1;position: absolute;inset: 0px 0px 45px; "> <div class="button-div-class" style=" text-align: center;line-height: 1;position: absolute;inset: 0px 0px 45px; ">
<el-button circle :class="show&&showIndex===1? 'button-show':'button-closed'" class="el-icon-s-tools" size="mini" @click="showPanel(1)" /> <el-button circle :class="show&&showIndex===1? 'button-show':'button-closed'" class="el-icon-s-tools" size="mini" @click="showPanel(1)" />
</div> </div>
<div style=" position: absolute;left: 0px;right: 0px;bottom: 10px; height: 16px;"> <div class="button-text" style=" position: absolute;left: 0px;right: 0px;bottom: 10px; height: 16px;">
<div style=" max-width: 100%;text-align: center;white-space: nowrap;text-overflow: ellipsis;position: relative;flex-shrink: 0;"> <div style=" max-width: 100%;text-align: center;white-space: nowrap;text-overflow: ellipsis;position: relative;flex-shrink: 0;">
{{ $t('panel.module') }} {{ $t('panel.module') }}
</div> </div>
@ -59,7 +59,7 @@
<div class="button-div-class" style=" text-align: center;line-height: 1;position: absolute;inset: 0px 0px 45px; "> <div class="button-div-class" style=" text-align: center;line-height: 1;position: absolute;inset: 0px 0px 45px; ">
<el-button circle :class="show&&showIndex===3? 'button-show':'button-closed'" class="el-icon-brush" size="mini" @click="showPanel(3)" /> <el-button circle :class="show&&showIndex===3? 'button-show':'button-closed'" class="el-icon-brush" size="mini" @click="showPanel(3)" />
</div> </div>
<div style=" position: absolute;left: 0px;right: 0px;bottom: 10px; height: 16px;"> <div class="button-text" style=" position: absolute;left: 0px;right: 0px;bottom: 10px; height: 16px;">
<div style=" max-width: 100%;text-align: center;white-space: nowrap;text-overflow: ellipsis;position: relative;flex-shrink: 0;"> <div style=" max-width: 100%;text-align: center;white-space: nowrap;text-overflow: ellipsis;position: relative;flex-shrink: 0;">
{{ $t('panel.other_module') }} {{ $t('panel.other_module') }}
</div> </div>
@ -844,7 +844,7 @@ export default {
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05); box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05);
transition: all .25s cubic-bezier(.7, .3, .1, 1); transition: all .25s cubic-bezier(.7, .3, .1, 1);
transform: translate(100%); transform: translate(100%);
background: #fff; background: var(--SiderBG, #fff);
z-index: 1003; z-index: 1003;
} }
@ -884,16 +884,16 @@ export default {
overflow-y: auto; overflow-y: auto;
} }
.button-show{ .button-show{
background-color: #ebf2fe!important; background-color: var(--MainContentBG, #ebf2fe)!important;
} }
.button-closed{ .button-closed{
background-color: #ffffff!important; background-color: var(--SiderBG, #ffffff)!important;
} }
.style-aside{ .style-aside{
width: 250px; width: 250px;
max-width:250px!important; max-width:250px!important;
border: 1px solid #E6E6E6; border: 1px solid var(--TableBorderColor, #E6E6E6);
padding: 10px; padding: 10px;
transition: all 0.3s; transition: all 0.3s;
@ -929,5 +929,8 @@ export default {
.style-hidden{ .style-hidden{
overflow-x: hidden; overflow-x: hidden;
} }
.button-text {
color: var(--TextActive);
}
</style> </style>

4
frontend/src/views/panel/filter/filterDialog.vue
View File

@ -798,11 +798,11 @@ export default {
// color: #fff; // color: #fff;
} }
.filter-db-row:hover { .filter-db-row:hover {
background-color: #f5f7fa !important; background-color: var(--background-color-base, #f5f7fa) !important;
cursor: pointer; cursor: pointer;
} }
.filter-db-row-checked:hover { .filter-db-row-checked:hover {
background-color: #f5f7fa !important; background-color: var(--background-color-base, #f5f7fa) !important;
color: inherit; color: inherit;
cursor: pointer; cursor: pointer;
i { i {

8
frontend/src/views/panel/filter/index.vue
View File

@ -142,7 +142,7 @@ export default {
.filter-header-text { .filter-header-text {
font-size: 14px; font-size: 14px;
max-width: 100%; max-width: 100%;
color: gray; color: var(--TextPrimary, gray);
text-align: left; text-align: left;
white-space: pre; white-space: pre;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -180,7 +180,7 @@ export default {
color: #3685f2; color: #3685f2;
} }
.filter-widget-text { .filter-widget-text {
color: #3d4d66; color: var(--TextActive, #3d4d66);
} }
} }
.time-filter:hover { .time-filter:hover {
@ -201,7 +201,7 @@ export default {
color: #23beef; color: #23beef;
} }
.filter-widget-text { .filter-widget-text {
color: #3d4d66; color: var(--TextActive, #3d4d66);
} }
} }
.text-filter:hover { .text-filter:hover {
@ -221,7 +221,7 @@ export default {
color: #37b4aa; color: #37b4aa;
} }
.filter-widget-text { .filter-widget-text {
color: #3d4d66; color: var(--TextActive, #3d4d66);
} }
} }
.tree-filter:hover { .tree-filter:hover {

34
frontend/src/views/system/task/DatasetTaskList.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<el-col> <el-col>
<el-row style="margin-top: 10px;" v-loading="$store.getters.loadingMap[$store.getters.currentPath]"> <el-row v-loading="$store.getters.loadingMap[$store.getters.currentPath]" style="margin-top: 10px;">
<complex-table :data="data" :columns="columns" local-key="datasetTask" :transCondition="transCondition" :search-config="searchConfig" :pagination-config="paginationConfig" @select="select" @search="search" @sort-change="sortChange"> <complex-table :data="data" :columns="columns" local-key="datasetTask" :trans-condition="transCondition" :search-config="searchConfig" :pagination-config="paginationConfig" @select="select" @search="search" @sort-change="sortChange">
<template #toolbar> <template #toolbar>
<el-button icon="el-icon-circle-plus-outline" @click="selectDataset">{{ $t('dataset.task.create') }}</el-button> <el-button icon="el-icon-circle-plus-outline" @click="selectDataset">{{ $t('dataset.task.create') }}</el-button>
</template> </template>
@ -34,7 +34,7 @@
<el-table-column prop="lastExecStatus" :label="$t('dataset.task.last_exec_status')"> <el-table-column prop="lastExecStatus" :label="$t('dataset.task.last_exec_status')">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.lastExecStatus === 'Completed'" style="color: green">{{ $t('dataset.completed') }}</span> <span v-if="scope.row.lastExecStatus === 'Completed'" style="color: green">{{ $t('dataset.completed') }}</span>
<span v-if="scope.row.lastExecStatus === 'Underway'" style="color: blue"> <span v-if="scope.row.lastExecStatus === 'Underway'" class="blue-color">
<i class="el-icon-loading" /> <i class="el-icon-loading" />
{{ $t('dataset.underway') }} {{ $t('dataset.underway') }}
</span> </span>
@ -63,10 +63,10 @@
<span v-if="scope.row.status === 'Stopped'" style="color: red"> <span v-if="scope.row.status === 'Stopped'" style="color: red">
<div type="danger" style="font-size: 12px">{{ $t('dataset.task.stopped') }}</div> <div type="danger" style="font-size: 12px">{{ $t('dataset.task.stopped') }}</div>
</span> </span>
<span v-if="scope.row.status === 'Pending'" style="color: blue"> <span v-if="scope.row.status === 'Pending'" class="blue-color">
<el-link type="primary" style="font-size: 12px" @click="changeTaskStatus(scope.row)">{{ $t('dataset.task.pending') }}</el-link> <el-link type="primary" style="font-size: 12px" @click="changeTaskStatus(scope.row)">{{ $t('dataset.task.pending') }}</el-link>
</span> </span>
<span v-if="scope.row.status === 'Exec'" style="color: blue"> <span v-if="scope.row.status === 'Exec'" class="blue-color">
<i class="el-icon-loading" /> <i class="el-icon-loading" />
{{ $t('dataset.underway') }} {{ $t('dataset.underway') }}
</span> </span>
@ -79,7 +79,7 @@
<el-dialog v-dialogDrag :title="update_task_dialog_title" :visible="update_task" :show-close="false" width="50%" class="dialog-css" append-to-body> <el-dialog v-dialogDrag :title="update_task_dialog_title" :visible="update_task" :show-close="false" width="50%" class="dialog-css" append-to-body>
<el-col> <el-col>
<el-form :form="taskForm" ref="taskForm" :model="taskForm" label-width="100px" size="mini" :rules="taskFormRules"> <el-form ref="taskForm" :form="taskForm" :model="taskForm" label-width="100px" size="mini" :rules="taskFormRules">
<el-form-item :label="$t('dataset.task_name')" prop="name"> <el-form-item :label="$t('dataset.task_name')" prop="name">
<el-input v-model="taskForm.name" size="mini" style="width: 50%" :placeholder="$t('dataset.task_name')" /> <el-input v-model="taskForm.name" size="mini" style="width: 50%" :placeholder="$t('dataset.task_name')" />
</el-form-item> </el-form-item>
@ -168,7 +168,7 @@
<!--添加任务-选择数据集--> <!--添加任务-选择数据集-->
<el-dialog v-dialogDrag :title="$t('dataset.task.create')" :visible="selectDatasetFlag" :show-close="false" width="70%" class="dialog-css" :destroy-on-close="true"> <el-dialog v-dialogDrag :title="$t('dataset.task.create')" :visible="selectDatasetFlag" :show-close="false" width="70%" class="dialog-css" :destroy-on-close="true">
<table-selector @getTable="getTable" privileges="manage" :mode="1" :customType=customType showMode="datasetTask"/> <table-selector privileges="manage" :mode="1" :custom-type="customType" show-mode="datasetTask" @getTable="getTable" />
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button size="mini" @click="closeCreateTask">{{ $t('chart.cancel') }}</el-button> <el-button size="mini" @click="closeCreateTask">{{ $t('chart.cancel') }}</el-button>
<el-button type="primary" size="mini" :disabled="!table.id" @click="create(undefined)">{{ $t('chart.confirm') }}</el-button> <el-button type="primary" size="mini" :disabled="!table.id" @click="create(undefined)">{{ $t('chart.confirm') }}</el-button>
@ -264,7 +264,7 @@ export default {
useComplexSearch: true, useComplexSearch: true,
quickPlaceholder: this.$t('dataset.task.search_by_name'), quickPlaceholder: this.$t('dataset.task.search_by_name'),
components: [ components: [
{ field: 'dataset_table_task.name', label: this.$t('dataset.task_name'), component: 'DeComplexInput'}, { field: 'dataset_table_task.name', label: this.$t('dataset.task_name'), component: 'DeComplexInput' },
{ field: 'dataset_table_task.id', label: this.$t('dataset.task_id'), component: 'FuComplexInput' }, { field: 'dataset_table_task.id', label: this.$t('dataset.task_id'), component: 'FuComplexInput' },
{ field: 'dataset_table.name', label: this.$t('dataset.name'), component: 'DeComplexInput' }, { field: 'dataset_table.name', label: this.$t('dataset.name'), component: 'DeComplexInput' },
{ field: 'dataset_table_task.status', label: this.$t('dataset.task.task_status'), component: 'FuComplexSelect', { field: 'dataset_table_task.status', label: this.$t('dataset.task.task_status'), component: 'FuComplexSelect',
@ -416,17 +416,17 @@ export default {
this.update_task = true this.update_task = true
}, },
changeTaskStatus(task) { changeTaskStatus(task) {
let param = JSON.parse(JSON.stringify(task)); const param = JSON.parse(JSON.stringify(task))
param.status = task.status === 'Underway' ? 'Pending' : 'Underway' param.status = task.status === 'Underway' ? 'Pending' : 'Underway'
post('/dataset/task/updateStatus', param).then(response => { post('/dataset/task/updateStatus', param).then(response => {
if(response.success){ if (response.success) {
task.status = param.status task.status = param.status
this.$message({ this.$message({
message: this.$t('dataset.task.change_success'), message: this.$t('dataset.task.change_success'),
type: 'success', type: 'success',
showClose: true showClose: true
}) })
}else { } else {
this.search(this.last_condition, false) this.search(this.last_condition, false)
} }
}).catch(() => { }).catch(() => {
@ -558,13 +558,13 @@ export default {
this.taskForm.cron = val this.taskForm.cron = val
}, },
disableEdit(task) { disableEdit(task) {
return task.rate === 'SIMPLE' || task.status === 'Stopped' || !hasDataPermission('manage',task.privileges) return task.rate === 'SIMPLE' || task.status === 'Stopped' || !hasDataPermission('manage', task.privileges)
}, },
disableExec(task) { disableExec(task) {
return task.status === 'Stopped' || task.status === 'Pending' || task.rate === 'SIMPLE' || !hasDataPermission('manage',task.privileges) return task.status === 'Stopped' || task.status === 'Pending' || task.rate === 'SIMPLE' || !hasDataPermission('manage', task.privileges)
}, },
disableDelete(task) { disableDelete(task) {
return false; return false
// !hasDataPermission('manage',task.privileges) // !hasDataPermission('manage',task.privileges)
}, },
deleteTask(task) { deleteTask(task) {
@ -649,7 +649,7 @@ export default {
this.resetTaskForm() this.resetTaskForm()
this.search(this.last_condition, true) this.search(this.last_condition, true)
}) })
}else { } else {
return false return false
} }
}) })
@ -714,4 +714,8 @@ export default {
span{ span{
font-size: 12px; font-size: 12px;
} }
.blue-color {
color: var(--Main);
}
</style> </style>

23
frontend/src/views/system/task/TaskRecord.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<el-col> <el-col>
<el-row style="margin-top: 10px;" v-loading="$store.getters.loadingMap[$store.getters.currentPath]"> <el-row v-loading="$store.getters.loadingMap[$store.getters.currentPath]" style="margin-top: 10px;">
<complex-table :data="data" :columns="columns" local-key="datasetTaskRecord" :search-config="searchConfig" :transCondition="transCondition" :pagination-config="paginationConfig" @select="select" @search="search" @sort-change="sortChange"> <complex-table :data="data" :columns="columns" local-key="datasetTaskRecord" :search-config="searchConfig" :trans-condition="transCondition" :pagination-config="paginationConfig" @select="select" @search="search" @sort-change="sortChange">
<el-table-column prop="name" :label="$t('dataset.task_name')"> <el-table-column prop="name" :label="$t('dataset.task_name')">
<template slot-scope="scope"> <template slot-scope="scope">
<span> <span>
@ -24,7 +24,7 @@
<el-table-column prop="status" :label="$t('dataset.status')"> <el-table-column prop="status" :label="$t('dataset.status')">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.status === 'Completed'" style="color: green">{{ $t('dataset.completed') }}</span> <span v-if="scope.row.status === 'Completed'" style="color: green">{{ $t('dataset.completed') }}</span>
<span v-if="scope.row.status === 'Underway'" style="color: blue"> <span v-if="scope.row.status === 'Underway'" class="blue-color">
<i class="el-icon-loading" /> <i class="el-icon-loading" />
{{ $t('dataset.underway') }} {{ $t('dataset.underway') }}
</span> </span>
@ -56,7 +56,7 @@ import ComplexTable from '@/components/business/complex-table'
import { formatCondition, formatQuickCondition, addOrder, formatOrders } from '@/utils/index' import { formatCondition, formatQuickCondition, addOrder, formatOrders } from '@/utils/index'
import '@riophae/vue-treeselect/dist/vue-treeselect.css' import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { post } from '@/api/dataset/dataset' import { post } from '@/api/dataset/dataset'
import {loadMenus} from "@/permission"; import { loadMenus } from '@/permission'
export default { export default {
name: 'TaskRecord', name: 'TaskRecord',
@ -169,10 +169,10 @@ export default {
select(selection) { select(selection) {
}, },
timerSearch(condition, showLoading = true) { timerSearch(condition, showLoading = true) {
if(!this.lastRequestComplete){ if (!this.lastRequestComplete) {
return; return
}else { } else {
this.lastRequestComplete = false; this.lastRequestComplete = false
} }
this.last_condition = condition this.last_condition = condition
@ -183,9 +183,9 @@ export default {
post('/dataset/taskLog/list/notexcel/' + this.paginationConfig.currentPage + '/' + this.paginationConfig.pageSize, param, showLoading).then(response => { post('/dataset/taskLog/list/notexcel/' + this.paginationConfig.currentPage + '/' + this.paginationConfig.pageSize, param, showLoading).then(response => {
this.data = response.data.listObject this.data = response.data.listObject
this.paginationConfig.total = response.data.itemCount this.paginationConfig.total = response.data.itemCount
this.lastRequestComplete = true; this.lastRequestComplete = true
}).catch(() => { }).catch(() => {
this.lastRequestComplete = true; this.lastRequestComplete = true
}) })
}, },
search(condition, showLoading = true) { search(condition, showLoading = true) {
@ -253,4 +253,7 @@ export default {
span{ span{
font-size: 12px; font-size: 12px;
} }
.blue-color {
color: var(--Main);
}
</style> </style>