NEZ-1137 fix; 导出样式调整

This commit is contained in:
zhangyu
2021-11-02 15:47:17 +08:00
parent e38bdd4e19
commit f6ac483d33
14 changed files with 155 additions and 33 deletions

View File

@@ -34,7 +34,8 @@
<button id="asset-create-asset" v-has="'dc_add'" class="top-tool-btn margin-r-10 margin-l-10" @click.stop="add"> <button id="asset-create-asset" v-has="'dc_add'" class="top-tool-btn margin-r-10 margin-l-10" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"

View File

@@ -21,7 +21,8 @@
<button id="asset-create-asset" v-has="'panel_chart_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10" @click.stop="addChart"> <button id="asset-create-asset" v-has="'panel_chart_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10" @click.stop="addChart">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
id="asset-list" id="asset-list"
:params="filter" :params="filter"
:params-type="paramsType" :params-type="paramsType"
@@ -53,7 +54,8 @@
<button id="endpoint-create-chart" v-has="'panel_chart_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10" @click.stop="addChart"> <button id="endpoint-create-chart" v-has="'panel_chart_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10" @click.stop="addChart">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
id="asset-list" id="asset-list"
:link="obj" :link="obj"
:params="filter" :params="filter"

View File

@@ -172,7 +172,12 @@ const cn = {
clearAllSelect: '清除选择的内容', clearAllSelect: '清除选择的内容',
disabled: '已禁用', disabled: '已禁用',
enabled: '启用', enabled: '启用',
close: '关闭' close: '关闭',
records: '导出形式',
fileFormat: '文件格式',
allData: '全部数据',
selectRecords: '选中的数据',
current: '当前页'
}, },
setup: { setup: {
step0: '欢迎', step0: '欢迎',

View File

@@ -177,7 +177,12 @@ const en = {
clearAllSelect: 'Clear the selection', clearAllSelect: 'Clear the selection',
disabled: 'Disabled', disabled: 'Disabled',
enabled: 'Enabled', enabled: 'Enabled',
close: 'Close' close: 'Close',
records: 'Records',
fileFormat: 'File format',
allData: 'All data',
selectRecords: 'Select records',
current: 'Current page'
}, },
pageSize: '/page', pageSize: '/page',
setup: { setup: {

View File

@@ -43,15 +43,29 @@
</div> </div>
</div> </div>
<div v-if="importBox.type == 2"> <div v-if="importBox.type == 2">
<div class="upload-body"> <div class="upload-body" style="height: 200px">
<button :id="id+'-xlsx-export-current'" class="el-button el-button--default el-button--small" @click="exportCur"> <div class="export-box">
<span>{{$t('overall.exportCur')}}</span> <span class="export-title">Records</span>
</button> <el-radio-group v-model="importBox.record" size="small">
<button :id="id+'-xlsx-export-all'" class="el-button el-button--default el-button--small" @click="exportAll"> <el-radio-button :label="item.value" v-for="(item,index) in recordArr" :key="index" :disabled="item.value==='records'&&!deleteObjs.length">{{item.name}}</el-radio-button>
<span>{{$t('overall.exportAll')}}</span> </el-radio-group>
</button> </div>
<div class="export-box">
<span class="export-title">File format</span>
<el-radio-group v-model="importBox.format" size="small">
<el-radio-button :label="item.value" v-for="(item,index) in formatArr" :key="index" :disabled="item.value!==1">{{item.name}}</el-radio-button>
</el-radio-group>
</div>
</div> </div>
<div slot="footer" class="footer"> <div slot="footer" class="footer">
<div class="el-message-box__btns">
<button :id="id+'-xlsx-import-export'" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" @click="exportData">
<span style="text-transform:Capitalize">{{$t('config.operationlog.operations.export')}}</span>
</button>
<button :id="id+'-xlsx-import-close'" class="nz-btn el-button el-button--default el-button--small" @click="closeDialog">
<span>{{$t('overall.close')}}</span>
</button>
</div>
</div> </div>
</div> </div>
<div v-if="importBox.type==3"> <div v-if="importBox.type==3">
@@ -138,17 +152,29 @@ export default {
paramsType: { paramsType: {
type: String, type: String,
default: '' default: ''
} },
deleteObjs: Array
}, },
data () { data () {
return { return {
importBox: { show: false, title: this.$t('overall.importExcel'), type: 1 }, importBox: { show: false, title: this.$t('overall.importExcel'), type: 1, record: 'all', format: 1 },
importFile: null, importFile: null,
importFileList: [], importFileList: [],
importResult: null, importResult: null,
exportShow: false, exportShow: false,
panelLock: true, panelLock: true,
language: localStorage.getItem('nz-language') language: localStorage.getItem('nz-language'),
recordArr: [
{ name: this.$t('overall.allData'), value: 'all' },
{ name: this.$t('overall.selectRecords'), value: 'records' },
{ name: this.$t('overall.current'), value: 'current' }
],
formatArr: [
{ name: 'XLSX', value: 1 },
{ name: 'CSV', value: 2 },
{ name: 'JSON', value: 3 }
]
} }
}, },
mounted () { mounted () {
@@ -244,6 +270,8 @@ export default {
this.importResult = null this.importResult = null
this.importFileList = [] this.importFileList = []
this.importFile = null this.importFile = null
this.importBox.value = 1
this.importBox.record = 'all'
}) })
}, },
downloadTemplate () { downloadTemplate () {
@@ -309,6 +337,7 @@ export default {
delete params.searchName delete params.searchName
} }
params.language = localStorage.getItem('nz-language') || 'en' params.language = localStorage.getItem('nz-language') || 'en'
params.format = this.importBox.format
this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx') this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx')
this.closeDialog() this.closeDialog()
}, },
@@ -341,10 +370,53 @@ export default {
// delete params.moduleId // delete params.moduleId
// } // }
params.language = localStorage.getItem('nz-language') || 'en' params.language = localStorage.getItem('nz-language') || 'en'
params.format = this.importBox.format
this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx') this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx')
this.closeDialog() this.closeDialog()
}, },
exportRecords() {
const params = JSON.parse(JSON.stringify(this.params))
if (this.params2) {
Object.keys(this.params2).forEach(key => {
if (params[key]) {
if (params[key].prototype.toString.call(val) === '[object Object]') {
Object.assign(params[key], this.params2[key])
} else if (params[key].prototype.toString.call(val) === '[object Array]') {
params[key].concat(this.params2[key])
}
} else {
params[key] = this.params2[key]
}
})
}
params.pageSize = -1
if (this.exportUrl.indexOf('panel') > -1) {
delete params.start_time
delete params.end_time
delete params.id
delete params.searchName
}
if (this.importUrl.indexOf('panel') > -1) {
delete params.panelId
}
// if (this.importUrl.indexOf('endpoint') > -1){
// delete params.moduleId
// }
params.language = localStorage.getItem('nz-language') || 'en'
params.format = this.importBox.format
params.ids = this.deleteObjs.map(item => item.id).join(',')
this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx')
this.closeDialog()
},
exportData () {
if (this.importBox.record === 'all') {
this.exportAll()
} else if (this.importBox.record === 'current') {
this.exportCur()
} else if (this.importBox.record === 'records') {
this.exportRecords()
}
},
exportExcel (url, params, fileName) { exportExcel (url, params, fileName) {
if (this.paramsType) { if (this.paramsType) {
params.type = this.paramsType params.type = this.paramsType
@@ -395,7 +467,7 @@ export default {
this.importBox.width = '600px' this.importBox.width = '600px'
} else if (type == 2) { // export } else if (type == 2) { // export
this.importBox.title = this.$t('overall.exportExcel') this.importBox.title = this.$t('overall.exportExcel')
this.importBox.width = '300px' this.importBox.width = '580px'
} }
}, },
getTimeString () { getTimeString () {
@@ -434,5 +506,27 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.export-box{
display: flex;
margin-top: 30px;
align-items: center;
.export-title {
display: inline-block;
width: 100px;
text-align: left;
font-size: 14px;
color: #666666;
letter-spacing: 0;
font-weight: 600;
}
/deep/ .el-radio-group{
flex: 1;
.el-radio-button--small {
width: 142px;
.el-radio-button__inner{
width: 100%;
}
}
}
}
</style> </style>

View File

@@ -21,7 +21,8 @@
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"
@@ -87,7 +88,8 @@
@click="add"> @click="add">
<i class="nz-icon-create-square nz-icon"></i> <i class="nz-icon-create-square nz-icon"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="alert-rule" id="alert-rule"
:params="searchLabel" :params="searchLabel"

View File

@@ -21,7 +21,8 @@
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"
@@ -92,7 +93,8 @@
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"

View File

@@ -21,7 +21,8 @@
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"
@@ -87,7 +88,8 @@
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon-create-square nz-icon"></i> <i class="nz-icon-create-square nz-icon"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"

View File

@@ -14,7 +14,8 @@
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon-create-square nz-icon"></i> <i class="nz-icon-create-square nz-icon"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"

View File

@@ -37,7 +37,8 @@
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="expression-template-list" id="expression-template-list"
export-url="visual/panel/export" export-url="visual/panel/export"

View File

@@ -22,7 +22,8 @@
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="expression-template-list" id="expression-template-list"
export-url="expression/tmpl/export" export-url="expression/tmpl/export"

View File

@@ -47,7 +47,8 @@
<i class="nz-icon-create-square nz-icon"></i> <i class="nz-icon-create-square nz-icon"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
id="panel" id="panel"
:params="filter" :params="filter"
:permissions="{ :permissions="{
@@ -213,7 +214,8 @@ export default {
panelId: 0, panelId: 0,
filterPanel: '', filterPanel: '',
// ---图表相关参数--end // ---图表相关参数--end
scrollbarWrap: null scrollbarWrap: null,
batchDeleteObjs: []
} }
}, },
components: { components: {

View File

@@ -21,7 +21,8 @@
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"
@@ -92,7 +93,8 @@
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon-create-square nz-icon"></i> <i class="nz-icon-create-square nz-icon"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="endpoint-template-list" id="endpoint-template-list"
:params="searchLabel" :params="searchLabel"

View File

@@ -21,7 +21,8 @@
<button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add"> <button id="asset-create-asset" v-has="'asset_add'" :title="$t('overall.createAsset')" class="top-tool-btn" @click.stop="add">
<i class="nz-icon nz-icon-create-square"></i> <i class="nz-icon nz-icon-create-square"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="model" id="model"
:params="searchLabel" :params="searchLabel"
@@ -88,7 +89,8 @@
type="button" @click="add"> type="button" @click="add">
<i class="nz-icon-create-square nz-icon"></i> <i class="nz-icon-create-square nz-icon"></i>
</button> </button>
<top-tool-more-options <top-tool-more-options
:delete-objs="batchDeleteObjs"
ref="export" ref="export"
id="endpoint-template-list" id="endpoint-template-list"
:params="searchLabel" :params="searchLabel"