|
@@ -3,29 +3,23 @@
|
|
|
<el-container>
|
|
|
<el-header>
|
|
|
<el-card>
|
|
|
- <el-form
|
|
|
- :inline="true"
|
|
|
- ref="searchform"
|
|
|
- :model="config.filters"
|
|
|
- label-width="100px"
|
|
|
- size="mini"
|
|
|
- >
|
|
|
+ <el-form :inline="true" ref="searchform" label-width="auto" size="mini">
|
|
|
<el-form-item
|
|
|
- v-for="(item, index) in config.Filters"
|
|
|
+ v-for="(item, index) in config.filters"
|
|
|
:key="index"
|
|
|
- :label="item.DisplayName"
|
|
|
+ :label="item.displayName"
|
|
|
>
|
|
|
- <el-input v-if="item.Type == 'input'" v-model="item.Value"></el-input>
|
|
|
+ <el-input v-if="item.type == 'input'" v-model="item.value"></el-input>
|
|
|
<el-select
|
|
|
- v-if="item.Type == 'select'"
|
|
|
- v-model="item.Value"
|
|
|
+ v-if="item.type == 'select'"
|
|
|
+ v-model="item.value"
|
|
|
size="mini"
|
|
|
placeholder=""
|
|
|
clearable
|
|
|
v-on:change="loadData"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in item.Options"
|
|
|
+ v-for="item in item.options"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
@@ -33,16 +27,16 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<el-select
|
|
|
- v-if="item.Type == 'select-multi'"
|
|
|
+ v-if="item.type == 'select-multi'"
|
|
|
multiple
|
|
|
- v-model="item.Value"
|
|
|
+ v-model="item.value"
|
|
|
size="mini"
|
|
|
placeholder=""
|
|
|
clearable
|
|
|
v-on:change="loadData"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in item.Options"
|
|
|
+ v-for="item in item.options"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
@@ -50,8 +44,8 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
<el-date-picker
|
|
|
- v-if="item.Type == 'date'"
|
|
|
- v-model="item.Value"
|
|
|
+ v-if="item.type == 'date'"
|
|
|
+ v-model="item.value"
|
|
|
format="yyyy-MM-dd"
|
|
|
value-format="yyyy-MM-dd"
|
|
|
type="date"
|
|
@@ -59,8 +53,8 @@
|
|
|
>
|
|
|
</el-date-picker>
|
|
|
<el-date-picker
|
|
|
- v-if="item.Type == 'datetime'"
|
|
|
- v-model="item.Value"
|
|
|
+ v-if="item.type == 'datetime'"
|
|
|
+ v-model="item.value"
|
|
|
format="yyyy-MM-dd HH:mm:ss"
|
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
type="datetime"
|
|
@@ -69,7 +63,13 @@
|
|
|
</el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button type="primary" size="small" v-on:click="query">查询</el-button>
|
|
|
+ <el-button type="primary" size="mini" v-on:click="query">查询</el-button>
|
|
|
+ <el-button type="success" size="mini" v-on:click="openConfig" v-if="showConfig"
|
|
|
+ >配置</el-button
|
|
|
+ >
|
|
|
+ <el-button type="info" size="mini" v-on:click="exportExcel" v-show="config.export"
|
|
|
+ >导出</el-button
|
|
|
+ >
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-checkbox v-model="autoRefresh" size="mini">自动刷新</el-checkbox>
|
|
@@ -79,12 +79,7 @@
|
|
|
</el-header>
|
|
|
<el-main>
|
|
|
<el-card>
|
|
|
- <div style="padding-bottom: 5px">
|
|
|
- <el-button type="success" size="mini" v-on:click="openConfig">配置</el-button>
|
|
|
- <el-button type="info" size="mini" v-on:click="exportExcel" v-show="config.Export"
|
|
|
- >导出</el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
+ <div style="padding-bottom: 5px"></div>
|
|
|
<el-table
|
|
|
:data="tableData"
|
|
|
border
|
|
@@ -99,21 +94,21 @@
|
|
|
highlight-current-row
|
|
|
v-on:current-change="handleCurrentChange"
|
|
|
>
|
|
|
- <template v-for="(item, index) in config.Columns">
|
|
|
+ <template v-for="(item, index) in config.columns">
|
|
|
<el-table-column
|
|
|
- v-if="item.Show"
|
|
|
+ v-if="item.show"
|
|
|
:key="index"
|
|
|
- :prop="item.Prop"
|
|
|
- :label="item.Label"
|
|
|
- :align="item.Align"
|
|
|
- :width="item.Width"
|
|
|
- :fixed="item.Fixed"
|
|
|
+ :prop="item.prop"
|
|
|
+ :label="item.label"
|
|
|
+ :align="item.align"
|
|
|
+ :width="item.width"
|
|
|
+ :fixed="item.fixed"
|
|
|
:show-overflow-tooltip="true"
|
|
|
>
|
|
|
</el-table-column>
|
|
|
</template>
|
|
|
</el-table>
|
|
|
- <div style="text-align: right; padding-top: 3px" v-if="config.Pagination">
|
|
|
+ <div style="text-align: right; padding-top: 3px" v-if="config.pagination">
|
|
|
<el-pagination
|
|
|
background
|
|
|
v-on:current-change="handlePageChanged"
|
|
@@ -131,12 +126,12 @@
|
|
|
<el-dialog
|
|
|
append-to-body
|
|
|
:close-on-click-modal="false"
|
|
|
- :visible.sync="dialogVisible"
|
|
|
+ :visible="dialogVisible"
|
|
|
title="配置"
|
|
|
width="1000px"
|
|
|
destroy-on-close
|
|
|
>
|
|
|
- <data-config ref="dataConfig" />
|
|
|
+ <data-config ref="dataConfig" :configName="configName" v-if="dialogVisible" />
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button type="text" @click="dialogVisible = false">取消</el-button>
|
|
|
<el-button type="primary" @click="handleSave">确认</el-button>
|
|
@@ -159,6 +154,7 @@ export default {
|
|
|
components: { DataConfig },
|
|
|
data() {
|
|
|
return {
|
|
|
+ configName: '', //查询配置名
|
|
|
loading: false,
|
|
|
autoRefresh: false,
|
|
|
autoRefreshValue: '', //自动刷新的值
|
|
@@ -188,12 +184,13 @@ export default {
|
|
|
timerID: null,
|
|
|
dateConst: ['now', 'today', 'yestoday', 'yestoday-now'],
|
|
|
dialogVisible: false,
|
|
|
+ showConfig: false,
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
loadConfig() {
|
|
|
let _this = this
|
|
|
- getConfig({ configname: ys.request('configname') })
|
|
|
+ getConfig({ configname: _this.configName })
|
|
|
.then(function (response) {
|
|
|
console.log(response.data)
|
|
|
let data = response.data
|
|
@@ -202,11 +199,11 @@ export default {
|
|
|
_this.loadData()
|
|
|
_this.parsingFlashFilter()
|
|
|
_this.parsingFlashColor()
|
|
|
- if (_this.config.Pagination) {
|
|
|
- _this.pagination.pagesizes = _this.config.PageSizeList
|
|
|
- _this.parameter.pageSize = _this.config.PageSize
|
|
|
+ if (_this.config.pagination) {
|
|
|
+ _this.pagination.pagesizes = _this.config.pageSizeList
|
|
|
+ _this.parameter.pageSize = _this.config.pageSize
|
|
|
}
|
|
|
- if (_this.config.Flash) {
|
|
|
+ if (_this.config.flash) {
|
|
|
clearTimeout(_this.timerID)
|
|
|
_this.doFlash()
|
|
|
//_this.$nextTick().then(() => {
|
|
@@ -221,44 +218,44 @@ export default {
|
|
|
},
|
|
|
//初始化变量,主要针对日期关键字的解析
|
|
|
initDefaultValue() {
|
|
|
- let l = this.config.Filters.length
|
|
|
+ let l = this.config.filters.length
|
|
|
for (let i = 0; i < l; i++) {
|
|
|
- if (this.config.Filters[i].Type == 'date') {
|
|
|
+ if (this.config.filters[i].type == 'date') {
|
|
|
if (
|
|
|
- this.config.Filters[i].DefaultValue == 'now' ||
|
|
|
- this.config.Filters[i].DefaultValue == 'today'
|
|
|
+ this.config.filters[i].defaultValue == 'now' ||
|
|
|
+ this.config.filters[i].defaultValue == 'today'
|
|
|
) {
|
|
|
- this.config.Filters[i].Value = moment().format('YYYY-MM-DD')
|
|
|
+ this.config.filters[i].value = moment().format('YYYY-MM-DD')
|
|
|
} else if (
|
|
|
- this.config.Filters[i].DefaultValue == 'yestoday' ||
|
|
|
- this.config.Filters[i].DefaultValue == 'yestoday-now'
|
|
|
+ this.config.filters[i].defaultValue == 'yestoday' ||
|
|
|
+ this.config.filters[i].defaultValue == 'yestoday-now'
|
|
|
) {
|
|
|
- this.config.Filters[i].Value = moment().subtract(1, 'days').format('YYYY-MM-DD')
|
|
|
+ this.config.filters[i].value = moment().subtract(1, 'days').format('YYYY-MM-DD')
|
|
|
}
|
|
|
- } else if (this.config.Filters[i].Type == 'datetime') {
|
|
|
- if (this.config.Filters[i].DefaultValue == 'now') {
|
|
|
- this.config.Filters[i].Value = moment().format('YYYY-MM-DD HH:mm:ss')
|
|
|
- } else if (this.config.Filters[i].DefaultValue == 'today') {
|
|
|
- this.config.Filters[i].Value = moment().format('YYYY-MM-DD 00:00:00')
|
|
|
- } else if (this.config.Filters[i].DefaultValue == 'yestoday-now') {
|
|
|
- this.config.Filters[i].Value = moment()
|
|
|
+ } else if (this.config.filters[i].type == 'datetime') {
|
|
|
+ if (this.config.filters[i].defaultValue == 'now') {
|
|
|
+ this.config.filters[i].value = moment().format('YYYY-MM-DD HH:mm:ss')
|
|
|
+ } else if (this.config.filters[i].defaultValue == 'today') {
|
|
|
+ this.config.filters[i].value = moment().format('YYYY-MM-DD 00:00:00')
|
|
|
+ } else if (this.config.filters[i].defaultValue == 'yestoday-now') {
|
|
|
+ this.config.filters[i].value = moment()
|
|
|
.subtract(1, 'days')
|
|
|
.format('YYYY-MM-DD HH:mm:ss')
|
|
|
- } else if (this.config.Filters[i].DefaultValue == 'yestoday') {
|
|
|
- this.config.Filters[i].Value = moment()
|
|
|
+ } else if (this.config.filters[i].defaultValue == 'yestoday') {
|
|
|
+ this.config.filters[i].value = moment()
|
|
|
.subtract(1, 'days')
|
|
|
.format('YYYY-MM-DD 00:00:00')
|
|
|
}
|
|
|
- } else if (this.config.Filters[i].Type == 'select') {
|
|
|
- if (this.config.Filters[i].DataSource == 'dp') {
|
|
|
- } else if (this.config.Filters[i].DataSource == 'string') {
|
|
|
+ } else if (this.config.filters[i].type == 'select') {
|
|
|
+ if (this.config.filters[i].dataSource == 'dp') {
|
|
|
+ } else if (this.config.filters[i].dataSource == 'string') {
|
|
|
this.loadStringOptions(i)
|
|
|
} else {
|
|
|
this.loadSqlOptions(i)
|
|
|
}
|
|
|
- } else if (this.config.Filters[i].Type == 'select-multi') {
|
|
|
- if (this.config.Filters[i].DataSource == 'dp') {
|
|
|
- } else if (this.config.Filters[i].DataSource == 'string') {
|
|
|
+ } else if (this.config.filters[i].type == 'select-multi') {
|
|
|
+ if (this.config.filters[i].dataSource == 'dp') {
|
|
|
+ } else if (this.config.filters[i].dataSource == 'string') {
|
|
|
this.loadStringOptions(i)
|
|
|
} else {
|
|
|
this.loadSqlOptions(i)
|
|
@@ -267,8 +264,8 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
loadStringOptions(filterIndex) {
|
|
|
- this.config.Filters[filterIndex].Options = JSON.parse(
|
|
|
- this.config.Filters[filterIndex].DataSourceExpression
|
|
|
+ this.config.filters[filterIndex].options = JSON.parse(
|
|
|
+ this.config.filters[filterIndex].dataSourceExpression
|
|
|
)
|
|
|
},
|
|
|
//为选择器载入dp中的维度数据
|
|
@@ -278,9 +275,9 @@ export default {
|
|
|
.then((res) => {
|
|
|
console.log(res) //在控制台输出获取的数据形式
|
|
|
let o = res[dataid].split(',')
|
|
|
- _this.config.Filters[filterIndex].Options = new Array()
|
|
|
+ _this.config.filters[filterIndex].options = new Array()
|
|
|
$.each(o, function (index, element) {
|
|
|
- _this.config.Filters[filterIndex].Options.push({ value: element, label: element })
|
|
|
+ _this.config.filters[filterIndex].options.push({ value: element, label: element })
|
|
|
})
|
|
|
})
|
|
|
.catch((err) => {
|
|
@@ -308,14 +305,14 @@ export default {
|
|
|
loadSqlOptions(filterIndex) {
|
|
|
let _this = this
|
|
|
getSelectOptions({
|
|
|
- configname: ys.request('configname'),
|
|
|
+ configname: _this.configName,
|
|
|
filterIndex,
|
|
|
})
|
|
|
.then(function (response) {
|
|
|
console.log(response.data)
|
|
|
let data = response.data
|
|
|
if (data.Tag == 1) {
|
|
|
- _this.config.Filters[filterIndex].Options = data.Data
|
|
|
+ _this.config.filters[filterIndex].options = data.Data
|
|
|
}
|
|
|
})
|
|
|
.catch(function (error) {
|
|
@@ -327,21 +324,21 @@ export default {
|
|
|
_this.tableData = []
|
|
|
this.loading = true
|
|
|
getData({
|
|
|
- configname: ys.request('configname'),
|
|
|
- filters: this.config.Filters,
|
|
|
+ configname: _this.configName,
|
|
|
+ filters: this.config.filters,
|
|
|
autoRefreshValue: this.autoRefreshValue,
|
|
|
pagesize: this.parameter.pageSize,
|
|
|
pageindex: this.parameter.pageIndex,
|
|
|
})
|
|
|
.then(function (response) {
|
|
|
console.log(response.data)
|
|
|
- let data = response.data
|
|
|
- if (data.Tag == 1) {
|
|
|
- _this.tableData = data.Data
|
|
|
- //_this.autoRefreshValue = data.Message;//把刷新变量的值放到message中
|
|
|
- _this.pagination.totalRecord = data.Total
|
|
|
- _this.loading = false
|
|
|
- }
|
|
|
+ _this.tableData = response.data
|
|
|
+ _this.loading = false
|
|
|
+ // if (data.Tag == 1) {
|
|
|
+ // _this.tableData = data.Data
|
|
|
+ // //_this.autoRefreshValue = data.Message;//把刷新变量的值放到message中
|
|
|
+ // _this.pagination.totalRecord = data.Total
|
|
|
+ // }
|
|
|
})
|
|
|
.catch(function (error) {
|
|
|
_this.loading = false
|
|
@@ -352,15 +349,15 @@ export default {
|
|
|
return obj.column.property
|
|
|
},
|
|
|
parsingFlashFilter() {
|
|
|
- if (this.config.FlashFilter) {
|
|
|
+ if (this.config.flashFilter) {
|
|
|
this.flashFilter.has = true
|
|
|
- let o = this.config.FlashFilter.split('=')
|
|
|
+ let o = this.config.flashFilter.split('=')
|
|
|
this.flashFilter.columnName = o[0]
|
|
|
this.flashFilter.columnValue = o[1]
|
|
|
}
|
|
|
},
|
|
|
parsingFlashColor() {
|
|
|
- let temparr = this.config.FlashColorFilter.split(':')
|
|
|
+ let temparr = this.config.flashColorFilter.split(':')
|
|
|
this.flashColors.columnName = temparr[0]
|
|
|
let colors = temparr[1].split(';')
|
|
|
for (let i = 0; i < colors.length; i++) {
|
|
@@ -382,7 +379,7 @@ export default {
|
|
|
let color = this.flashColors.colors[i]
|
|
|
if (this.flashFlag) {
|
|
|
this.setFlashColor(
|
|
|
- this.config.FlashColumn,
|
|
|
+ this.config.flashColumn,
|
|
|
this.flashColors.columnName,
|
|
|
color.value,
|
|
|
color.color1,
|
|
@@ -390,7 +387,7 @@ export default {
|
|
|
)
|
|
|
} else {
|
|
|
this.setFlashColor(
|
|
|
- this.config.FlashColumn,
|
|
|
+ this.config.flashColumn,
|
|
|
this.flashColors.columnName,
|
|
|
color.value,
|
|
|
color.color2,
|
|
@@ -531,10 +528,11 @@ export default {
|
|
|
this.loadTableData()
|
|
|
},
|
|
|
exportExcel() {
|
|
|
+ let _this = this
|
|
|
exportData({
|
|
|
params: {
|
|
|
- configname: ys.request('configname'),
|
|
|
- filters: this.config.Filters,
|
|
|
+ configname: _this.configName,
|
|
|
+ filters: this.config.filters,
|
|
|
autoRefreshValue: this.autoRefreshValue,
|
|
|
pagesize: this.parameter.pageSize,
|
|
|
pageindex: this.parameter.pageIndex,
|
|
@@ -566,9 +564,18 @@ export default {
|
|
|
this.dialogVisible = false
|
|
|
this.$refs.dataConfig.saveForm()
|
|
|
},
|
|
|
+ resolveConfigName() {
|
|
|
+ const paths = this.$route.path.split('/')
|
|
|
+ //console.log(paths[paths.length - 1])
|
|
|
+ return paths[paths.length - 1]
|
|
|
+ },
|
|
|
},
|
|
|
mounted() {
|
|
|
- // this.loadConfig()
|
|
|
+ this.configName = this.resolveConfigName()
|
|
|
+ this.loadConfig()
|
|
|
+ if (this.$route.query.config === "P{}l;'<>?") {
|
|
|
+ this.showConfig = true
|
|
|
+ }
|
|
|
},
|
|
|
}
|
|
|
</script>
|