mirror of
https://github.com/jeecgboot/JeecgBoot.git
synced 2026-01-03 20:35:29 +08:00
Jeecg-Boot 2.2.0 版本发布 | 重磅升级
This commit is contained in:
zhangdaiscott
@ -1,391 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-form-item label="表名">
|
||||
<a-input placeholder="请输入表名" v-model="queryParam.tableName"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="doCgformButton" type="primary" icon="highlight">自定义按钮</a-button>
|
||||
<a-button @click="doEnhanceJs" type="primary" icon="strikethrough">JS增强</a-button>
|
||||
<a-button @click="doEnhanceSql" type="primary" icon="filter">SQL增强</a-button>
|
||||
<a-button @click="doEnhanceJava" type="primary" icon="tool">Java增强</a-button>
|
||||
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel">
|
||||
<a-icon type="delete"/>
|
||||
删除
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button> 批量操作
|
||||
<a-icon type="down"/>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>
|
||||
已选择
|
||||
<a style="font-weight: 600">{{ selectedRowKeys.length }}</a>
|
||||
项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
<template slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical"/>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多
|
||||
<a-icon type="down"/>
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a @click="goPageOnline(record)">功能测试</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a @click="handleOnlineUrlShow(record)">配置地址</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a @click="handleRemoveRecord(record.id)">移除</a>
|
||||
</a-menu-item>
|
||||
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
|
||||
<template slot="dbsync" slot-scope="text">
|
||||
<span v-if="text==='Y'" style="color:limegreen">已同步</span>
|
||||
<span v-if="text==='N'" style="color:red">未同步</span>
|
||||
</template>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<!-- 表单区域 -->
|
||||
<onl-cgform-head-modal ref="modalForm" @ok="modalFormOk" :action-button="false"></onl-cgform-head-modal>
|
||||
|
||||
<!-- 提示online报表链接 -->
|
||||
<a-modal
|
||||
:title="onlineUrlTitle"
|
||||
:visible="onlineUrlVisible"
|
||||
@cancel="handleOnlineUrlClose">
|
||||
<template slot="footer">
|
||||
<a-button @click="handleOnlineUrlClose">关闭</a-button>
|
||||
<a-button type="primary" class="copy-this-text" :data-clipboard-text="onlineUrl" @click="onCopyUrl">复制</a-button>
|
||||
</template>
|
||||
<p>{{ onlineUrl }}</p>
|
||||
</a-modal>
|
||||
|
||||
<enhance-js ref="ehjs"></enhance-js>
|
||||
<enhance-sql ref="ehsql"></enhance-sql>
|
||||
<enhance-java ref="ehjava"></enhance-java>
|
||||
<trans-db2-online ref="transd2o" @ok="transOk"></trans-db2-online>
|
||||
|
||||
<onl-cgform-button-list ref="btnList"></onl-cgform-button-list>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { deleteAction, postAction,getAction } from '@/api/manage'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import Clipboard from 'clipboard'
|
||||
import { filterObj } from '@/utils/util';
|
||||
|
||||
export default {
|
||||
name: 'OnlCgformHeadList',
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: 'Online表单视图',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 60,
|
||||
align: 'center',
|
||||
customRender: function(t, r, index) {
|
||||
return parseInt(index) + 1
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
title: '视图表名',
|
||||
align: 'center',
|
||||
dataIndex: 'tableName'
|
||||
},
|
||||
{
|
||||
title: '视图表描述',
|
||||
align: 'center',
|
||||
dataIndex: 'tableTxt'
|
||||
},
|
||||
{
|
||||
title: '原表版本',
|
||||
align: 'center',
|
||||
dataIndex: 'tableVersion'
|
||||
},
|
||||
{
|
||||
title: '视图版本',
|
||||
align: 'center',
|
||||
dataIndex: 'copyVersion'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: '/online/cgform/head/list',
|
||||
delete: '/online/cgform/head/delete',
|
||||
deleteBatch: '/online/cgform/head/deleteBatch',
|
||||
removeRecord: '/online/cgform/head/removeRecord',
|
||||
},
|
||||
tableTypeDictOptions: [],
|
||||
sexDictOptions: [],
|
||||
syncModalVisible: false,
|
||||
syncFormId: '',
|
||||
synMethod: 'normal',
|
||||
syncLoading: false,
|
||||
onlineUrlTitle: '',
|
||||
onlineUrlVisible: false,
|
||||
onlineUrl: '',
|
||||
selectedRowKeys: [],
|
||||
selectedRows: [],
|
||||
physicId:""
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
this.loadData()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getQueryParams() {
|
||||
//获取查询条件
|
||||
var param = Object.assign({}, this.queryParam, this.isorter ,this.filters);
|
||||
param.field = this.getQueryField();
|
||||
param.pageNo = this.ipagination.current;
|
||||
param.pageSize = this.ipagination.pageSize;
|
||||
param.copyType = 1;
|
||||
param.physicId = this.physicId;
|
||||
return filterObj(param);
|
||||
},
|
||||
|
||||
loadData(arg) {
|
||||
if(!this.$route.params.code){
|
||||
return false
|
||||
}
|
||||
this.physicId = this.$route.params.code
|
||||
if(!this.url.list){
|
||||
this.$message.error("请设置url.list属性!")
|
||||
return
|
||||
}
|
||||
//加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination.current = 1;
|
||||
}
|
||||
var params = this.getQueryParams();//查询条件
|
||||
this.loading = true;
|
||||
getAction(this.url.list, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result.records;
|
||||
this.ipagination.total = res.result.total;
|
||||
}
|
||||
if(res.code===510){
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
this.loading = false;
|
||||
})
|
||||
},
|
||||
|
||||
goPageOnline(rd) {
|
||||
if(rd.isTree=='Y'){
|
||||
this.$router.push({ path: '/online/cgformTreeList/' + rd.id })
|
||||
}else{
|
||||
this.$router.push({ path: '/online/cgformList/' + rd.id })
|
||||
}
|
||||
},
|
||||
handleOnlineUrlClose() {
|
||||
this.onlineUrlTitle = ''
|
||||
this.onlineUrlVisible = false
|
||||
},
|
||||
handleOnlineUrlShow(record) {
|
||||
if(record.isTree=='Y'){
|
||||
this.onlineUrl = `/online/cgformTreeList/${record.id}`
|
||||
}else{
|
||||
this.onlineUrl = `/online/cgformList/${record.id}`
|
||||
}
|
||||
this.onlineUrlVisible = true
|
||||
this.onlineUrlTitle = '菜单链接[' + record.tableTxt + ']'
|
||||
},
|
||||
handleRemoveRecord(id) {
|
||||
let that = this
|
||||
this.$confirm({
|
||||
title: '确认要移除此记录?',
|
||||
onOk() {
|
||||
deleteAction(that.url.removeRecord, { id: id }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success('移除成功')
|
||||
that.loadData()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
}
|
||||
})
|
||||
},
|
||||
doEnhanceJs() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.ehjs.show(this.selectedRowKeys[0])
|
||||
},
|
||||
doEnhanceSql() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.ehsql.show(this.selectedRowKeys[0])
|
||||
},
|
||||
doEnhanceJava() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.ehjava.show(this.selectedRowKeys[0])
|
||||
},
|
||||
doCgformButton() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.btnList.show(this.selectedRowKeys[0])
|
||||
|
||||
//this.$router.push({ path: '/online/cgformButton/' + this.selectedRowKeys[0] })
|
||||
},
|
||||
importOnlineForm() {
|
||||
this.$refs.transd2o.show()
|
||||
},
|
||||
transOk() {
|
||||
this.loadData()
|
||||
},
|
||||
onSelectChange(keys, rows) {
|
||||
this.selectedRowKeys = keys
|
||||
this.selectedRows = rows
|
||||
},
|
||||
onCopyUrl(){
|
||||
var clipboard = new Clipboard('.copy-this-text')
|
||||
clipboard.on('success', () => {
|
||||
clipboard.destroy()
|
||||
this.$message.success('复制成功')
|
||||
this.handleOnlineUrlClose()
|
||||
})
|
||||
clipboard.on('error', () => {
|
||||
this.$message.error('该浏览器不支持自动复制')
|
||||
clipboard.destroy()
|
||||
})
|
||||
},
|
||||
showMyCopyInfo(id){
|
||||
console.log("查看复制表单的信息",id)
|
||||
},
|
||||
copyConfig(id){
|
||||
postAction(`${this.url.copyOnline}?code=${id}`).then(res=>{
|
||||
if(res.success){
|
||||
this.$message.success("复制成功")
|
||||
this.loadData()
|
||||
}else{
|
||||
this.$message.error("复制失败>>"+res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
<style lang="less">
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
|
||||
.valid-error-cust{
|
||||
.ant-select-selection{
|
||||
border:2px solid #f5222d;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,493 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-form-item label="表名">
|
||||
<a-input placeholder="请输入表名" v-model="queryParam.tableName"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-form-item label="表类型">
|
||||
<j-dict-select-tag dictCode="cgform_table_type" v-model="queryParam.tableType"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-form-item label="表描述">
|
||||
<a-input placeholder="请输入表描述" v-model="queryParam.tableTxt"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-button @click="doCgformButton" type="primary" icon="highlight">自定义按钮</a-button>
|
||||
<a-button @click="doEnhanceJs" type="primary" icon="strikethrough">JS增强</a-button>
|
||||
<a-button @click="doEnhanceSql" type="primary" icon="filter">SQL增强</a-button>
|
||||
<a-button @click="doEnhanceJava" type="primary" icon="tool">Java增强</a-button>
|
||||
<a-button @click="importOnlineForm" type="primary" icon="database">从数据库导入表单</a-button>
|
||||
<a-button @click="goGenerateCode" type="primary" icon="database">代码生成</a-button>
|
||||
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel">
|
||||
<a-icon type="delete"/>
|
||||
删除
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button> 批量操作
|
||||
<a-icon type="down"/>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>
|
||||
已选择
|
||||
<a style="font-weight: 600">{{ selectedRowKeys.length }}</a>
|
||||
项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
<template slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical"/>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多
|
||||
<a-icon type="down"/>
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item v-if="record.isDbSynch!='Y'">
|
||||
<a @click="openSyncModal(record.id)">同步数据库</a>
|
||||
</a-menu-item>
|
||||
|
||||
<template v-if="record.isDbSynch=='Y' && record.tableType !== 3">
|
||||
<a-menu-item>
|
||||
<a @click="goPageOnline(record)">功能测试</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a @click="handleOnlineUrlShow(record)">配置地址</a>
|
||||
</a-menu-item>
|
||||
</template>
|
||||
|
||||
<a-menu-item>
|
||||
<a @click="copyConfig(record.id)">复制视图</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item v-if="record.hascopy==1">
|
||||
<a @click="showMyCopyInfo(record.id)">配置视图</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a @click="handleRemoveRecord(record.id)">移除</a>
|
||||
</a-menu-item>
|
||||
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
|
||||
<template slot="dbsync" slot-scope="text">
|
||||
<span v-if="text==='Y'" style="color:limegreen">已同步</span>
|
||||
<span v-if="text==='N'" style="color:red">未同步</span>
|
||||
</template>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<!-- 表单区域 -->
|
||||
<onl-cgform-head-modal ref="modalForm" @ok="modalFormOk"></onl-cgform-head-modal>
|
||||
|
||||
<!-- 同步数据库提示框 -->
|
||||
<a-modal
|
||||
:width="500"
|
||||
:height="300"
|
||||
title="同步数据库"
|
||||
:visible="syncModalVisible"
|
||||
@cancel="handleCancleDbSync"
|
||||
style="top:5%;height: 95%;">
|
||||
<template slot="footer">
|
||||
<a-button @click="handleCancleDbSync">关闭</a-button>
|
||||
<a-button type="primary" :loading="syncLoading" @click="handleDbSync">
|
||||
确定
|
||||
</a-button>
|
||||
</template>
|
||||
<a-radio-group v-model="synMethod">
|
||||
<a-radio style="display: block;width: 30px;height: 30px" value="normal">普通同步(保留表数据)</a-radio>
|
||||
<a-radio style="display: block;width: 30px;height: 30px" value="force">强制同步(删除表,重新生成)</a-radio>
|
||||
</a-radio-group>
|
||||
</a-modal>
|
||||
|
||||
<!-- 提示online报表链接 -->
|
||||
<a-modal
|
||||
:title="onlineUrlTitle"
|
||||
:visible="onlineUrlVisible"
|
||||
@cancel="handleOnlineUrlClose">
|
||||
<template slot="footer">
|
||||
<a-button @click="handleOnlineUrlClose">关闭</a-button>
|
||||
<a-button type="primary" class="copy-this-text" :data-clipboard-text="onlineUrl" @click="onCopyUrl">复制</a-button>
|
||||
</template>
|
||||
<p>{{ onlineUrl }}</p>
|
||||
</a-modal>
|
||||
|
||||
<enhance-js ref="ehjs"></enhance-js>
|
||||
<enhance-sql ref="ehsql"></enhance-sql>
|
||||
<enhance-java ref="ehjava"></enhance-java>
|
||||
<trans-db2-online ref="transd2o" @ok="transOk"></trans-db2-online>
|
||||
<code-generator ref="cg"></code-generator>
|
||||
|
||||
<onl-cgform-button-list ref="btnList"></onl-cgform-button-list>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { initDictOptions, filterDictText } from '@/components/dict/JDictSelectUtil'
|
||||
import { deleteAction, postAction } from '@/api/manage'
|
||||
import JDictSelectTag from '../../../../components/dict/JDictSelectTag.vue'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import Clipboard from 'clipboard'
|
||||
import { filterObj } from '@/utils/util';
|
||||
|
||||
export default {
|
||||
name: 'OnlCgformHeadList',
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
JDictSelectTag,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: 'Online表单开发管理页面',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '#',
|
||||
dataIndex: '',
|
||||
key: 'rowIndex',
|
||||
width: 60,
|
||||
align: 'center',
|
||||
customRender: function(t, r, index) {
|
||||
return parseInt(index) + 1
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '表类型',
|
||||
align: 'center',
|
||||
dataIndex: 'tableType',
|
||||
customRender: (text, record) => {
|
||||
let tbTypeText = filterDictText(this.tableTypeDictOptions, `${text}`)
|
||||
if(record.isTree === 'Y'){
|
||||
tbTypeText+='(树)'
|
||||
}
|
||||
return tbTypeText;
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '表名',
|
||||
align: 'center',
|
||||
dataIndex: 'tableName'
|
||||
},
|
||||
{
|
||||
title: '表描述',
|
||||
align: 'center',
|
||||
dataIndex: 'tableTxt'
|
||||
},
|
||||
{
|
||||
title: '版本',
|
||||
align: 'center',
|
||||
dataIndex: 'tableVersion'
|
||||
},
|
||||
|
||||
{
|
||||
title: '同步数据库状态',
|
||||
align: 'center',
|
||||
dataIndex: 'isDbSynch',
|
||||
scopedSlots: { customRender: 'dbsync' }
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: '/online/cgform/head/list',
|
||||
delete: '/online/cgform/head/delete',
|
||||
deleteBatch: '/online/cgform/head/deleteBatch',
|
||||
doDbSynch: '/online/cgform/api/doDbSynch/',
|
||||
removeRecord: '/online/cgform/head/removeRecord',
|
||||
copyOnline: '/online/cgform/head/copyOnline'
|
||||
},
|
||||
tableTypeDictOptions: [],
|
||||
sexDictOptions: [],
|
||||
syncModalVisible: false,
|
||||
syncFormId: '',
|
||||
synMethod: 'normal',
|
||||
syncLoading: false,
|
||||
onlineUrlTitle: '',
|
||||
onlineUrlVisible: false,
|
||||
onlineUrl: '',
|
||||
selectedRowKeys: [],
|
||||
selectedRows: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
//初始化字典 - 表类型
|
||||
initDictOptions('cgform_table_type').then((res) => {
|
||||
if (res.success) {
|
||||
this.tableTypeDictOptions = res.result
|
||||
}
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
doDbSynch(id) {
|
||||
postAction(this.url.doDbSynch + id, { synMethod: '1' }).then((res) => {
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.loadData()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
getQueryParams() {
|
||||
//获取查询条件
|
||||
var param = Object.assign({}, this.queryParam, this.isorter ,this.filters);
|
||||
param.field = this.getQueryField();
|
||||
param.pageNo = this.ipagination.current;
|
||||
param.pageSize = this.ipagination.pageSize;
|
||||
param.copyType = 0;
|
||||
return filterObj(param);
|
||||
},
|
||||
handleCancleDbSync() {
|
||||
this.syncModalVisible = false
|
||||
},
|
||||
handleDbSync() {
|
||||
this.syncLoading = true
|
||||
postAction(this.url.doDbSynch + this.syncFormId + '/' + this.synMethod).then((res) => {
|
||||
this.syncModalVisible = false
|
||||
this.syncLoading = false
|
||||
if (res.success) {
|
||||
this.$message.success(res.message)
|
||||
this.loadData()
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
setTimeout(()=>{
|
||||
if(this.syncLoading){
|
||||
this.syncModalVisible = false
|
||||
this.syncLoading = false
|
||||
this.$message.success("网络延迟,已自动刷新!")
|
||||
this.loadData()
|
||||
}
|
||||
},10000)
|
||||
},
|
||||
openSyncModal(id) {
|
||||
this.syncModalVisible = true
|
||||
this.syncLoading = false
|
||||
this.syncFormId = id
|
||||
},
|
||||
goPageOnline(rd) {
|
||||
if(rd.themeTemplate === 'erp'){
|
||||
this.$router.push({ path: '/online/cgformErpList/' + rd.id })
|
||||
}else{
|
||||
if(rd.isTree=='Y'){
|
||||
this.$router.push({ path: '/online/cgformTreeList/' + rd.id })
|
||||
}else{
|
||||
this.$router.push({ path: '/online/cgformList/' + rd.id })
|
||||
}
|
||||
}
|
||||
},
|
||||
handleOnlineUrlClose() {
|
||||
this.onlineUrlTitle = ''
|
||||
this.onlineUrlVisible = false
|
||||
},
|
||||
handleOnlineUrlShow(record) {
|
||||
if(record.isTree=='Y'){
|
||||
this.onlineUrl = `/online/cgformTreeList/${record.id}`
|
||||
}else{
|
||||
this.onlineUrl = `/online/cgformList/${record.id}`
|
||||
}
|
||||
this.onlineUrlVisible = true
|
||||
this.onlineUrlTitle = '菜单链接[' + record.tableTxt + ']'
|
||||
},
|
||||
handleRemoveRecord(id) {
|
||||
let that = this
|
||||
this.$confirm({
|
||||
title: '确认要移除此记录?',
|
||||
onOk() {
|
||||
deleteAction(that.url.removeRecord, { id: id }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success('移除成功')
|
||||
that.loadData()
|
||||
} else {
|
||||
that.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
onCancel() {
|
||||
}
|
||||
})
|
||||
},
|
||||
doEnhanceJs() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.ehjs.show(this.selectedRowKeys[0])
|
||||
},
|
||||
doEnhanceSql() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.ehsql.show(this.selectedRowKeys[0])
|
||||
},
|
||||
doEnhanceJava() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.ehjava.show(this.selectedRowKeys[0])
|
||||
},
|
||||
doCgformButton() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
this.$refs.btnList.show(this.selectedRowKeys[0])
|
||||
|
||||
//this.$router.push({ path: '/online/cgformButton/' + this.selectedRowKeys[0] })
|
||||
},
|
||||
importOnlineForm() {
|
||||
this.$refs.transd2o.show()
|
||||
},
|
||||
transOk() {
|
||||
this.loadData()
|
||||
},
|
||||
goGenerateCode() {
|
||||
if (!this.selectedRowKeys || this.selectedRowKeys.length != 1) {
|
||||
this.$message.warning('请先选中一条记录')
|
||||
return
|
||||
}
|
||||
let row = this.selectedRows[0]
|
||||
if (!row.isDbSynch || row.isDbSynch == 'N') {
|
||||
this.$message.warning('请先同步数据库!')
|
||||
return
|
||||
}
|
||||
if (row.tableType == 3) {
|
||||
this.$message.warning('请选中该表对应的主表生成代码')
|
||||
return
|
||||
}
|
||||
this.$refs.cg.show(this.selectedRowKeys[0])
|
||||
},
|
||||
onSelectChange(keys, rows) {
|
||||
this.selectedRowKeys = keys
|
||||
this.selectedRows = rows
|
||||
},
|
||||
onCopyUrl(){
|
||||
var clipboard = new Clipboard('.copy-this-text')
|
||||
clipboard.on('success', () => {
|
||||
clipboard.destroy()
|
||||
this.$message.success('复制成功')
|
||||
this.handleOnlineUrlClose()
|
||||
})
|
||||
clipboard.on('error', () => {
|
||||
this.$message.error('该浏览器不支持自动复制')
|
||||
clipboard.destroy()
|
||||
})
|
||||
},
|
||||
showMyCopyInfo(id){
|
||||
this.$router.push({ path: '/online/copyform/' + id })
|
||||
},
|
||||
copyConfig(id){
|
||||
postAction(`${this.url.copyOnline}?code=${id}`).then(res=>{
|
||||
if(res.success){
|
||||
this.$message.success("复制成功")
|
||||
this.loadData()
|
||||
}else{
|
||||
this.$message.error("复制失败>>"+res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
<style lang="less">
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
|
||||
.valid-error-cust{
|
||||
.ant-select-selection{
|
||||
border:2px solid #f5222d;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,41 +0,0 @@
|
||||
/**
|
||||
* online 自定义按钮表达式处理类
|
||||
*/
|
||||
export default class ButtonExpHandler {
|
||||
/**
|
||||
* 构造器
|
||||
* @param express
|
||||
*/
|
||||
constructor(express,record) {
|
||||
this._express = express;
|
||||
this._record = record;
|
||||
}
|
||||
|
||||
get show() {
|
||||
if(!this._express || this._express==''){
|
||||
return true;
|
||||
}
|
||||
let arr = this._express.split('#');
|
||||
//获取字段值
|
||||
let fieldValue = this._record[arr[0]];
|
||||
//获取表达式
|
||||
let exp = arr[1].toLowerCase();
|
||||
//判断表达式
|
||||
if(exp === 'eq'){
|
||||
return fieldValue == arr[2];
|
||||
}else if(exp === 'ne'){
|
||||
return !(fieldValue == arr[2]);
|
||||
}else if(exp === 'empty'){
|
||||
if(arr[2]==='true' || arr[2]===true){
|
||||
return !fieldValue || fieldValue=='';
|
||||
}else{
|
||||
return fieldValue && fieldValue.length>0
|
||||
}
|
||||
}else if(exp === 'in'){
|
||||
let arr2 = arr[2].split(',');
|
||||
return arr2.indexOf(String(fieldValue))>=0;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,827 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchByquery">
|
||||
<a-row :gutter="24" v-if="queryInfo && queryInfo.length>0">
|
||||
<template v-for="(item,index) in queryInfo">
|
||||
<template v-if=" item.hidden==='1' ">
|
||||
<a-col v-if="item.view=='datetime'" :md="12" :sm="16" :key=" 'query'+index " v-show="toggleSearchStatus">
|
||||
<online-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></online-query-form-item>
|
||||
</a-col>
|
||||
<a-col v-else :md="6" :sm="8" :key=" 'query'+index " v-show="toggleSearchStatus">
|
||||
<online-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></online-query-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<template v-else>
|
||||
<a-col v-if="item.view=='datetime'" :md="12" :sm="16" :key=" 'query'+index ">
|
||||
<online-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></online-query-form-item>
|
||||
</a-col>
|
||||
<a-col v-else :md="6" :sm="8" :key=" 'query'+index ">
|
||||
<online-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></online-query-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<a-col :md="6" :sm="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchByquery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button v-if="buttonSwitch.add" @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-button v-if="buttonSwitch.import" @click="handleImportXls" type="primary" icon="upload">导入</a-button>
|
||||
<a-button v-if="buttonSwitch.export" @click="handleExportXls" type="primary" icon="download">导出</a-button>
|
||||
<template v-if="cgButtonList && cgButtonList.length>0" v-for="(item,index) in cgButtonList">
|
||||
<a-button
|
||||
v-if=" item.optType=='js' "
|
||||
:key=" 'cgbtn'+index "
|
||||
@click="cgButtonJsHandler(item.buttonCode)"
|
||||
type="primary"
|
||||
:icon="item.buttonIcon">
|
||||
{{ item.buttonName }}
|
||||
</a-button>
|
||||
<a-button
|
||||
v-else-if=" item.optType=='action' "
|
||||
:key=" 'cgbtn'+index "
|
||||
@click="cgButtonActionHandler(item.buttonCode)"
|
||||
type="primary"
|
||||
:icon="item.buttonIcon">
|
||||
{{ item.buttonName }}
|
||||
</a-button>
|
||||
</template>
|
||||
|
||||
<!-- 高级查询 -->
|
||||
<j-super-query
|
||||
ref="superQuery"
|
||||
:fieldList="superQuery.fieldList"
|
||||
:saveCode="$route.fullPath"
|
||||
:loading="table.loading"
|
||||
@handleSuperQuery="handleSuperQuery"/>
|
||||
|
||||
<a-button
|
||||
v-if="buttonSwitch.batch_delete"
|
||||
@click="handleDelBatch"
|
||||
v-show="table.selectedRowKeys.length > 0"
|
||||
ghost
|
||||
type="primary"
|
||||
icon="delete">批量删除</a-button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>
|
||||
已选择 <a style="font-weight: 600">{{ table.selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="cgformAutoList"
|
||||
bordered
|
||||
size="middle"
|
||||
rowKey="id"
|
||||
:columns="table.columns"
|
||||
:dataSource="table.dataSource"
|
||||
:pagination="table.pagination"
|
||||
:loading="table.loading"
|
||||
:rowSelection="rowSelectionConfig"
|
||||
@change="handleTableChange"
|
||||
:scroll="table.scroll"
|
||||
style="min-height: 300px">
|
||||
|
||||
<!-- 支持链接href跳转 -->
|
||||
<template
|
||||
v-for="field of fieldHrefSlots"
|
||||
:slot="field.slotName"
|
||||
slot-scope="text, record"
|
||||
>
|
||||
<a @click="handleClickFieldHref(field,record)">{{ text }}</a>
|
||||
</template>
|
||||
|
||||
|
||||
<template slot="dateSlot" slot-scope="text">
|
||||
<span>{{ getFormatDate(text) }}</span>
|
||||
</template>
|
||||
|
||||
<template slot="htmlSlot" slot-scope="text">
|
||||
<div v-html="text"></div>
|
||||
</template>
|
||||
|
||||
<template slot="imgSlot" slot-scope="text">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
|
||||
<img v-else :src="getImgView(text)" height="25px" alt="图片不存在" style="max-width:80px;font-size: 12px;font-style: italic;"/>
|
||||
</template>
|
||||
|
||||
<template slot="fileSlot" slot-scope="text">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
||||
<a-button
|
||||
v-else
|
||||
:ghost="true"
|
||||
type="primary"
|
||||
icon="download"
|
||||
size="small"
|
||||
@click="downloadRowFile(text)">
|
||||
下载
|
||||
</a-button>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<template v-if="hasBpmStatus">
|
||||
<template v-if="record.bpm_status == '1'||record.bpm_status == ''|| record.bpm_status == null">
|
||||
<template v-if="buttonSwitch.update">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical"/>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<template v-if="buttonSwitch.update">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical"/>
|
||||
</template>
|
||||
</template>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item v-if="buttonSwitch.detail">
|
||||
<a href="javascript:;" @click="handleDetail(record)">详情</a>
|
||||
</a-menu-item>
|
||||
<template v-if="hasBpmStatus">
|
||||
<template v-if="record.bpm_status == '1'||record.bpm_status == ''|| record.bpm_status == null">
|
||||
<a-menu-item v-if="buttonSwitch.delete">
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDeleteOne(record)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<a-menu-item v-if="buttonSwitch.delete">
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDeleteOne(record)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</template>
|
||||
<template v-if="cgButtonLinkList && cgButtonLinkList.length>0" v-for="(btnItem,btnIndex) in cgButtonLinkList">
|
||||
<a-menu-item :key=" 'cgbtnLink'+btnIndex " v-if="showLinkButton(btnItem,record)">
|
||||
<a href="javascript:void(0);" @click="cgButtonLinkHandler(record,btnItem.buttonCode,btnItem.optType)">
|
||||
<a-icon v-if="btnItem.buttonIcon" :type="btnItem.buttonIcon" />
|
||||
{{ btnItem.buttonName }}
|
||||
</a>
|
||||
</a-menu-item>
|
||||
</template>
|
||||
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
</a-table>
|
||||
|
||||
<onl-cgform-auto-modal @success="handleFormSuccess" ref="modal" :code="code" @schema="handleGetSchema" />
|
||||
|
||||
<j-import-modal ref="importModal" :url="getImportUrl()" @ok="importOk"></j-import-modal>
|
||||
|
||||
<!-- 跳转Href的动态组件方式 -->
|
||||
<a-modal v-bind="hrefComponent.model" v-on="hrefComponent.on">
|
||||
<component :is="hrefComponent.is" v-bind="hrefComponent.params"/>
|
||||
</a-modal>
|
||||
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { HrefJump } from '@/mixins/OnlAutoListMixin'
|
||||
import { postAction,getAction,deleteAction,downFile } from '@/api/manage'
|
||||
import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
|
||||
import { cloneObject, filterObj } from '@/utils/util'
|
||||
import JImportModal from '@/components/jeecg/JImportModal'
|
||||
import JSuperQuery from '@comp/jeecg/JSuperQuery'
|
||||
import ButtonExpHandler from './ButtonExpHandler'
|
||||
|
||||
export default {
|
||||
name: 'OnlCgFormAutoList',
|
||||
mixins: [HrefJump],
|
||||
components: {
|
||||
JSuperQuery,
|
||||
JImportModal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
code: '',
|
||||
description: '在线报表功能测试页面',
|
||||
currentTableName:"",
|
||||
url: {
|
||||
getQueryInfo:'/online/cgform/api/getQueryInfo/',
|
||||
getColumns: '/online/cgform/api/getColumns/',
|
||||
getData: '/online/cgform/api/getData/',
|
||||
optPre:"/online/cgform/api/form/",
|
||||
exportXls:'/online/cgform/api/exportXls/',
|
||||
buttonAction:'/online/cgform/api/doButton',
|
||||
},
|
||||
flowCodePre:"onl_",
|
||||
isorter:{
|
||||
column: 'createTime',
|
||||
order: 'desc',
|
||||
},
|
||||
//dictOptions:{fieldName:[]}
|
||||
dictOptions:{
|
||||
|
||||
},
|
||||
cgButtonLinkList:[],
|
||||
cgButtonList:[],
|
||||
queryInfo:[],
|
||||
// 查询参数，多个页面的查询参数用 code 作为键来区分
|
||||
queryParamsMap: {},
|
||||
toggleSearchStatus:false,
|
||||
table: {
|
||||
loading: true,
|
||||
scroll:{x:false},
|
||||
// 表头
|
||||
columns: [],
|
||||
//数据集
|
||||
dataSource: [],
|
||||
// 选择器
|
||||
selectedRowKeys: [],
|
||||
selectionRows: [],
|
||||
// 分页参数
|
||||
pagination: {
|
||||
|
||||
}
|
||||
},
|
||||
metaPagination:{
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
actionColumn:{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
fixed:"right",
|
||||
align:"center",
|
||||
width:150
|
||||
},
|
||||
formTemplate:"99",
|
||||
EnhanceJS:'',
|
||||
hideColumns:[],
|
||||
buttonSwitch:{
|
||||
add:true,
|
||||
update:true,
|
||||
delete:true,
|
||||
batch_delete:true,
|
||||
import:true,
|
||||
export:true,
|
||||
detail:true
|
||||
},
|
||||
hasBpmStatus:false,
|
||||
checkboxFlag:false,
|
||||
// 高级查询
|
||||
superQuery: {
|
||||
// 字段列表
|
||||
fieldList: [],
|
||||
// 查询参数
|
||||
params: '',
|
||||
// 查询条件拼接方式 'and' or 'or'
|
||||
matchType: 'and'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initAutoList();
|
||||
},
|
||||
mounted(){
|
||||
this.cgButtonJsHandler('mounted')
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
// 刷新参数放到这里去触发，就可以刷新相同界面了
|
||||
this.initAutoList()
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
rowSelectionConfig:function() {
|
||||
if(!this.checkboxFlag){
|
||||
return null
|
||||
}
|
||||
return {
|
||||
fixed:true,
|
||||
selectedRowKeys:this.table.selectedRowKeys,
|
||||
onChange: this.handleChangeInTableSelect
|
||||
}
|
||||
},
|
||||
queryParam: {
|
||||
get() {
|
||||
return this.queryParamsMap[this.code]
|
||||
},
|
||||
set(newVal) {
|
||||
this.$set(this.queryParamsMap, this.code, newVal)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
hasBpmStatusFilter(){
|
||||
var columnObjs = this.table.columns;
|
||||
let columns = [];
|
||||
for (var item of columnObjs) {
|
||||
columns.push(item.dataIndex);
|
||||
}
|
||||
if(columns.includes('bpm_status')||columns.includes('BPM_STATUS')){
|
||||
this.hasBpmStatus = true;
|
||||
}else{
|
||||
this.hasBpmStatus = false;
|
||||
}
|
||||
},
|
||||
initQueryInfo(){
|
||||
getAction(`${this.url.getQueryInfo}${this.code}`).then((res)=>{
|
||||
console.log("--onlineList-获取查询条件配置",res);
|
||||
if(res.success){
|
||||
this.queryInfo = res.result
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
initAutoList(){
|
||||
if(!this.$route.params.code){
|
||||
return false
|
||||
}
|
||||
// 清空高级查询条件
|
||||
this.superQuery.params = ''
|
||||
if (this.$refs.superQuery) {
|
||||
this.$refs.superQuery.handleReset()
|
||||
}
|
||||
|
||||
this.table.loading = true
|
||||
this.code = this.$route.params.code
|
||||
if (!this.queryParam) {
|
||||
this.queryParam = {}
|
||||
}
|
||||
getAction(`${this.url.getColumns}${this.code}`).then((res)=>{
|
||||
console.log("--onlineList-加载动态列>>",res);
|
||||
if(res.success){
|
||||
if(res.result.checkboxFlag == 'Y'){
|
||||
this.checkboxFlag = true
|
||||
}else{
|
||||
this.checkboxFlag = false
|
||||
}
|
||||
|
||||
if(res.result.paginationFlag=='Y'){
|
||||
this.table.pagination = {...this.metaPagination}
|
||||
}else{
|
||||
this.table.pagination = false
|
||||
}
|
||||
|
||||
this.fieldHrefSlots = res.result.fieldHrefSlots
|
||||
this.dictOptions = res.result.dictOptions
|
||||
this.formTemplate = res.result.formTemplate
|
||||
this.description = res.result.description
|
||||
this.currentTableName = res.result.currentTableName
|
||||
this.initCgButtonList(res.result.cgButtonList)
|
||||
this.initCgEnhanceJs(res.result.enhanceJs)
|
||||
this.initButtonSwitch(res.result.hideColumns)
|
||||
let currColumns = res.result.columns
|
||||
for(let a=0;a<currColumns.length;a++){
|
||||
if(currColumns[a].customRender){
|
||||
let dictCode = currColumns[a].customRender;
|
||||
let replaceFlag = '_replace_text_';
|
||||
if(dictCode.startsWith(replaceFlag)){
|
||||
let textFieldName = dictCode.replace(replaceFlag,'')
|
||||
currColumns[a].customRender=(text,record)=>{
|
||||
return record[textFieldName]
|
||||
}
|
||||
}else{
|
||||
currColumns[a].customRender=(text)=>{
|
||||
return filterMultiDictText(this.dictOptions[dictCode], text);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if(res.result.scrollFlag==1){
|
||||
this.table.scroll = { x :'115%' }
|
||||
}else{
|
||||
this.table.scroll = { x :false }
|
||||
}
|
||||
currColumns.push(this.actionColumn);
|
||||
this.table.columns = [...currColumns]
|
||||
this.hasBpmStatusFilter();
|
||||
this.loadData();
|
||||
this.initQueryInfo();
|
||||
//加载新路由，清空checkbox选中
|
||||
this.table.selectedRowKeys = [];
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
loadData(arg){
|
||||
if(this.table.pagination){
|
||||
if(arg==1){
|
||||
this.table.pagination.current=1
|
||||
}
|
||||
this.table.loading = true
|
||||
let params = this.getQueryParams();//查询条件
|
||||
console.log("--onlineList-查询条件-->",params)
|
||||
getAction(`${this.url.getData}${this.code}`,params).then((res)=>{
|
||||
console.log("--onlineList-列表数据",res)
|
||||
if(res.success){
|
||||
let result = res.result;
|
||||
if(Number(result.total)>0){
|
||||
this.table.pagination.total = Number(result.total)
|
||||
this.table.dataSource = result.records
|
||||
}else{
|
||||
this.table.pagination.total=0;
|
||||
this.table.dataSource=[]
|
||||
//this.$message.warning("查无数据")
|
||||
}
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.table.loading = false
|
||||
})
|
||||
}else{
|
||||
this.loadDataNoPage()
|
||||
}
|
||||
},
|
||||
loadDataNoPage(){
|
||||
this.table.loading = true
|
||||
let param = this.getQueryParams()//查询条件
|
||||
param['pageSize'] = -521;
|
||||
getAction(`${this.url.getData}${this.code}`,filterObj(param)).then((res)=>{
|
||||
console.log("--onlineList-列表数据",res)
|
||||
if(res.success){
|
||||
let result = res.result;
|
||||
if(Number(result.total)>0){
|
||||
this.table.dataSource = result.records
|
||||
}else{
|
||||
this.table.dataSource=[]
|
||||
}
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
}).finally(() => {
|
||||
this.table.loading = false
|
||||
})
|
||||
},
|
||||
getQueryParams() {
|
||||
let param = Object.assign({}, this.queryParam,this.isorter);
|
||||
param.pageNo = this.table.pagination.current;
|
||||
param.pageSize = this.table.pagination.pageSize;
|
||||
param.superQueryMatchType = this.superQuery.matchType
|
||||
param.superQueryParams = encodeURIComponent(this.superQuery.params)
|
||||
return filterObj(param);
|
||||
},
|
||||
handleChangeInTableSelect(selectedRowKeys, selectionRows) {
|
||||
this.table.selectedRowKeys = selectedRowKeys
|
||||
this.table.selectionRows = selectionRows
|
||||
this.selectedRowKeys = selectedRowKeys
|
||||
},
|
||||
handleTableChange(pagination, filters, sorter){
|
||||
//TODO 筛选
|
||||
if (Object.keys(sorter).length>0){
|
||||
this.isorter.column = sorter.field;
|
||||
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
|
||||
}
|
||||
this.table.pagination = pagination;
|
||||
this.loadData();
|
||||
},
|
||||
handleAdd(){
|
||||
this.cgButtonJsHandler('beforeAdd')
|
||||
this.$refs.modal.add(this.formTemplate);
|
||||
},
|
||||
handleImportXls(){
|
||||
this.$refs.importModal.show()
|
||||
},
|
||||
importOk(){
|
||||
this.loadData(1)
|
||||
},
|
||||
handleExportXls2(){
|
||||
let param = this.queryParam;
|
||||
if(this.table.selectedRowKeys && this.table.selectedRowKeys.length>0){
|
||||
param['selections'] = this.table.selectedRowKeys.join(",")
|
||||
}
|
||||
let paramsStr = encodeURI(JSON.stringify(param));
|
||||
console.log('paramsStr: ' + paramsStr)
|
||||
let url = window._CONFIG['domianURL']+this.url.exportXls+this.code+"?paramsStr="+paramsStr
|
||||
window.location.href = url;
|
||||
},
|
||||
handleExportXls(){
|
||||
let param = this.queryParam;
|
||||
if(this.table.selectedRowKeys && this.table.selectedRowKeys.length>0){
|
||||
param['selections'] = this.table.selectedRowKeys.join(",")
|
||||
}
|
||||
console.log("导出参数",param)
|
||||
let paramsStr = JSON.stringify(filterObj(param));
|
||||
downFile(this.url.exportXls+this.code,{paramsStr:paramsStr}).then((data)=>{
|
||||
if (!data) {
|
||||
this.$message.warning("文件下载失败")
|
||||
return
|
||||
}
|
||||
if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
||||
window.navigator.msSaveBlob(new Blob([data]), this.description+'.xls')
|
||||
}else{
|
||||
let url = window.URL.createObjectURL(new Blob([data]))
|
||||
let link = document.createElement('a')
|
||||
link.style.display = 'none'
|
||||
link.href = url
|
||||
link.setAttribute('download', this.description+'.xls')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link); //下载完成移除元素
|
||||
window.URL.revokeObjectURL(url); //释放掉blob对象
|
||||
}
|
||||
})
|
||||
},
|
||||
handleEdit(record){
|
||||
this.cgButtonLinkHandler(record,"beforeEdit","js")
|
||||
this.$refs.modal.edit(this.formTemplate,record.id);
|
||||
},
|
||||
showLinkButton(item,record){
|
||||
let btn = new ButtonExpHandler(item.exp,record);
|
||||
return btn.show;
|
||||
},
|
||||
handleDetail(record){
|
||||
this.$refs.modal.detail(this.formTemplate,record.id);
|
||||
},
|
||||
handleDeleteOne(record){
|
||||
this.cgButtonLinkHandler(record,"beforeDelete","js")
|
||||
this.handleDelete(record.id)
|
||||
},
|
||||
handleDelete(id){
|
||||
deleteAction(this.url.optPre+this.code+"/"+id).then((res)=>{
|
||||
if(res.success){
|
||||
this.$message.success(res.message)
|
||||
this.loadData()
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
handleFormSuccess(){
|
||||
this.loadData()
|
||||
},
|
||||
// 查询完 schema 后，生成高级查询的字段列表
|
||||
handleGetSchema(schema) {
|
||||
if (schema && schema.properties) {
|
||||
let setField = (array, field) => {
|
||||
let type = field.type || 'string'
|
||||
type = (type === 'inputNumber' ? 'number' : type)
|
||||
array.push({
|
||||
type: type,
|
||||
value: field.key,
|
||||
text: field.title,
|
||||
// 额外字典参数
|
||||
dictCode: field.dictCode,
|
||||
dictTable: field.dictTable,
|
||||
dictText: field.dictText,
|
||||
options: field.enum || field.options,
|
||||
order: field.order,
|
||||
})
|
||||
}
|
||||
let fieldList = []
|
||||
for (let key in schema.properties) {
|
||||
if (!schema.properties.hasOwnProperty(key)) {
|
||||
continue
|
||||
}
|
||||
let field = schema.properties[key]
|
||||
// tab = 子表
|
||||
if (field.view === 'tab') {
|
||||
let subTable = {
|
||||
type: 'sub-table',
|
||||
value: field.key,
|
||||
text: field.describe,
|
||||
children: []
|
||||
}
|
||||
for (let column of field.columns) {
|
||||
setField(subTable.children, column)
|
||||
}
|
||||
fieldList.push(subTable)
|
||||
} else {
|
||||
field.key = key
|
||||
setField(fieldList, field)
|
||||
}
|
||||
}
|
||||
// 冒泡排序
|
||||
for (let i = 0; i < fieldList.length; i++) {
|
||||
for (let j = i + 1; j < fieldList.length; j++) {
|
||||
let temp1 = fieldList[i]
|
||||
let temp2 = fieldList[j]
|
||||
if (temp1.order > temp2.order) {
|
||||
fieldList[i] = temp2
|
||||
fieldList[j] = temp1
|
||||
}
|
||||
}
|
||||
}
|
||||
this.superQuery.fieldList = fieldList
|
||||
}
|
||||
},
|
||||
onClearSelected(){
|
||||
this.table.selectedRowKeys = []
|
||||
this.table.selectionRows = []
|
||||
},
|
||||
getImgView(text){
|
||||
if(text && text.indexOf(",")>0){
|
||||
text = text.substring(0,text.indexOf(","))
|
||||
}
|
||||
return window._CONFIG['staticDomainURL']+"/"+text
|
||||
},
|
||||
downloadRowFile(text){
|
||||
if(!text){
|
||||
this.$message.warning("未知的文件")
|
||||
return;
|
||||
}
|
||||
if(text.indexOf(",")>0){
|
||||
text = text.substring(0,text.indexOf(","))
|
||||
}
|
||||
window.open(window._CONFIG['staticDomainURL']+"/"+text);//TODO 下载的方法
|
||||
},
|
||||
handleDelBatch(){
|
||||
if(this.table.selectedRowKeys.length<=0){
|
||||
this.$message.warning('请选择一条记录！');
|
||||
return false;
|
||||
}else{
|
||||
let ids = "";
|
||||
let that = this;
|
||||
that.table.selectedRowKeys.forEach(function(val) {
|
||||
ids+=val+",";
|
||||
});
|
||||
that.$confirm({
|
||||
title:"确认删除",
|
||||
content:"是否删除选中数据?",
|
||||
onOk: function(){
|
||||
that.handleDelete(ids)
|
||||
that.onClearSelected();
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
searchByquery(){
|
||||
this.loadData(1);
|
||||
},
|
||||
searchReset(){
|
||||
this.queryParam = {}
|
||||
this.loadData(1);
|
||||
},
|
||||
handleToggleSearch(){
|
||||
this.toggleSearchStatus = !this.toggleSearchStatus;
|
||||
},
|
||||
getFormatDate(text){
|
||||
if(!text){
|
||||
return ''
|
||||
}
|
||||
let a = text;
|
||||
if(a.length>10){
|
||||
a = a.substring(0,10);
|
||||
}
|
||||
return a;
|
||||
},
|
||||
getImportUrl(){
|
||||
return '/online/cgform/api/importXls/'+this.code
|
||||
},
|
||||
initCgEnhanceJs(enhanceJs){
|
||||
//console.log("--onlineList-js增强",enhanceJs)
|
||||
if(enhanceJs){
|
||||
let Obj = eval ("(" + enhanceJs + ")");
|
||||
this.EnhanceJS = new Obj(getAction,postAction,deleteAction);
|
||||
this.cgButtonJsHandler('created')
|
||||
}else{
|
||||
this.EnhanceJS = ''
|
||||
}
|
||||
},
|
||||
initCgButtonList(btnList){
|
||||
let linkArr = []
|
||||
let buttonArr = []
|
||||
if(btnList && btnList.length>0){
|
||||
for(let i=0;i<btnList.length;i++){
|
||||
let temp = btnList[i]
|
||||
if(temp.buttonStyle=='button'){
|
||||
buttonArr.push(temp)
|
||||
}else if(temp.buttonStyle=='link'){
|
||||
linkArr.push(temp)
|
||||
}
|
||||
}
|
||||
}
|
||||
this.cgButtonLinkList = [...linkArr]
|
||||
this.cgButtonList=[...buttonArr]
|
||||
},
|
||||
cgButtonJsHandler(buttonCode){
|
||||
if(this.EnhanceJS[buttonCode]){
|
||||
this.EnhanceJS[buttonCode](this)
|
||||
}
|
||||
},
|
||||
cgButtonActionHandler(buttonCode){
|
||||
//处理自定义button的 需要配置该button自定义sql
|
||||
if(!this.table.selectedRowKeys || this.table.selectedRowKeys.length==0){
|
||||
this.$message.warning("请先选中一条记录")
|
||||
return false
|
||||
}
|
||||
if(this.table.selectedRowKeys.length>1){
|
||||
this.$message.warning("请只选中一条记录")
|
||||
return false
|
||||
}
|
||||
let params = {
|
||||
formId:this.code,
|
||||
buttonCode:buttonCode,
|
||||
dataId:this.table.selectedRowKeys[0]
|
||||
}
|
||||
console.log("自定义按钮请求后台参数：",params)
|
||||
postAction(this.url.buttonAction,params).then(res=>{
|
||||
if(res.success){
|
||||
this.loadData()
|
||||
this.$message.success("处理完成!")
|
||||
}else{
|
||||
this.$message.warning("处理失败!")
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
cgButtonLinkHandler(record,buttonCode,optType){
|
||||
if(optType=="js"){
|
||||
if(this.EnhanceJS[buttonCode]){
|
||||
this.EnhanceJS[buttonCode](this,record)
|
||||
}
|
||||
}else if(optType=="action"){
|
||||
let params = {
|
||||
formId:this.code,
|
||||
buttonCode:buttonCode,
|
||||
dataId:record.id
|
||||
}
|
||||
console.log("自定义按钮link请求后台参数：",params)
|
||||
postAction(this.url.buttonAction,params).then(res=>{
|
||||
if(res.success){
|
||||
this.loadData()
|
||||
this.$message.success("处理完成!")
|
||||
}else{
|
||||
this.$message.warning("处理失败!")
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
initButtonSwitch(hideColumns){
|
||||
Object.keys(this.buttonSwitch).forEach(key=>{
|
||||
this.buttonSwitch[key]=true
|
||||
})
|
||||
if(hideColumns && hideColumns.length>0){
|
||||
Object.keys(this.buttonSwitch).forEach(key=>{
|
||||
if(hideColumns.indexOf(key)>=0){
|
||||
this.buttonSwitch[key]=false
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
// 高级查询
|
||||
handleSuperQuery(params, matchType) {
|
||||
if (!params || params.length === 0) {
|
||||
this.superQuery.params = ''
|
||||
} else {
|
||||
this.superQuery.params = JSON.stringify(params)
|
||||
}
|
||||
this.superQuery.matchType = matchType
|
||||
this.loadData()
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
<style>
|
||||
.ant-card-body .table-operator{
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.ant-table-tbody .ant-table-row td{
|
||||
padding-top:15px;
|
||||
padding-bottom:15px;
|
||||
}
|
||||
.anty-row-operator button{margin: 0 5px}
|
||||
.ant-btn-danger{background-color: #ffffff}
|
||||
|
||||
.anty-img-wrap{height:25px;position: relative;}
|
||||
.anty-img-wrap > img{max-height:100%;}
|
||||
.ant-modal-cust-warp{height: 100%}
|
||||
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
|
||||
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
|
||||
</style>
|
||||
@ -1,696 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button v-if="buttonSwitch.add" @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-button v-if="buttonSwitch.import" @click="handleImportXls" type="primary" icon="upload" style="margin-left:8px">导入</a-button>
|
||||
<a-button v-if="buttonSwitch.export" @click="handleExportXls" type="primary" icon="download" style="margin-left:8px">导出</a-button>
|
||||
<template v-if="cgButtonList && cgButtonList.length>0" v-for="(item,index) in cgButtonList">
|
||||
<a-button
|
||||
v-if=" item.optType=='js' "
|
||||
:key=" 'cgbtn'+index "
|
||||
@click="cgButtonJsHandler(item.buttonCode)"
|
||||
type="primary"
|
||||
:icon="item.buttonIcon"
|
||||
style="margin-left:8px">
|
||||
{{ item.buttonName }}
|
||||
</a-button>
|
||||
<a-button
|
||||
v-else-if=" item.optType=='action' "
|
||||
:key=" 'cgbtn'+index "
|
||||
@click="cgButtonActionHandler(item.buttonCode)"
|
||||
type="primary"
|
||||
:icon="item.buttonIcon"
|
||||
style="margin-left:8px">
|
||||
{{ item.buttonName }}
|
||||
</a-button>
|
||||
</template>
|
||||
|
||||
<a-button
|
||||
v-if="buttonSwitch.batch_delete"
|
||||
@click="handleDelBatch"
|
||||
style="margin-left:8px"
|
||||
v-show="selectedRowKeys.length > 0"
|
||||
ghost
|
||||
type="primary"
|
||||
icon="delete">批量删除</a-button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>
|
||||
已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="cgformTreeList"
|
||||
size="middle"
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="pagination"
|
||||
:loading="loading"
|
||||
@change="handleTableChange"
|
||||
v-bind="tableProps"
|
||||
@expand="handleExpand"
|
||||
style="min-height: 300px"
|
||||
:expandedRowKeys="expandedRowKeys">
|
||||
|
||||
<template slot="dateSlot" slot-scope="text">
|
||||
<span>{{ getDateNoTime(text) }}</span>
|
||||
</template>
|
||||
|
||||
<template slot="htmlSlot" slot-scope="text">
|
||||
<div v-html="text"></div>
|
||||
</template>
|
||||
|
||||
<template slot="imgSlot" slot-scope="text">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
|
||||
<img v-else :src="getImgView(text)" height="25px" alt="图片不存在" style="max-width:80px;font-size: 12px;font-style: italic;"/>
|
||||
</template>
|
||||
|
||||
<template slot="fileSlot" slot-scope="text">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
||||
<a-button
|
||||
v-else
|
||||
:ghost="true"
|
||||
type="primary"
|
||||
icon="download"
|
||||
size="small"
|
||||
@click="downloadRowFile(text)">
|
||||
下载
|
||||
</a-button>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
|
||||
<template v-if="showOptButton('update',record)">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a-divider type="vertical"/>
|
||||
</template>
|
||||
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down" />
|
||||
</a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item >
|
||||
<a @click="handleDetail(record)">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item v-if="showOptButton('delete',record)">
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDeleteOne(record)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
<!-- 自定义按钮 -->
|
||||
<template v-if="cgButtonLinkList && cgButtonLinkList.length>0" v-for="(btnItem,btnIndex) in cgButtonLinkList">
|
||||
<a-menu-item :key=" 'cgbtnLink'+btnIndex ">
|
||||
<a href="javascript:void(0);" @click="cgButtonLinkHandler(record,btnItem.buttonCode,btnItem.optType)">
|
||||
<a-icon v-if="btnItem.buttonIcon" :type="btnItem.buttonIcon" />
|
||||
{{ btnItem.buttonName }}
|
||||
</a>
|
||||
</a-menu-item>
|
||||
</template>
|
||||
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
|
||||
<onl-cgform-auto-modal @success="handleFormSuccess" ref="modal" :code="code"></onl-cgform-auto-modal>
|
||||
|
||||
<j-import-modal ref="importModal" :url="getImportUrl()" @ok="importOk"></j-import-modal>
|
||||
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { getAction,postAction,deleteAction,downFile } from '@/api/manage'
|
||||
import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
|
||||
import { filterObj } from '@/utils/util';
|
||||
import JImportModal from '@/components/jeecg/JImportModal'
|
||||
|
||||
export default {
|
||||
name: 'OnlCgformTreeList',
|
||||
components: {
|
||||
JImportModal,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
code: '87b55a515d3441b6b98e48e5b35474a6',
|
||||
description: '在线报表功能测试页面',
|
||||
currentTableName:"",
|
||||
pidField:"",
|
||||
hasChildrenField:"",
|
||||
textField:'',
|
||||
loading: false,
|
||||
// 表头
|
||||
columns: [],
|
||||
//数据集
|
||||
dataSource: [],
|
||||
// 选择器
|
||||
selectedRowKeys: [],
|
||||
selectionRows: [],
|
||||
// 分页参数
|
||||
pagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
|
||||
url: {
|
||||
getColumns: '/online/cgform/api/getColumns/',
|
||||
getTreeData: '/online/cgform/api/getTreeData/',
|
||||
optPre:"/online/cgform/api/form/",
|
||||
exportXls:'/online/cgform/api/exportXls/',
|
||||
buttonAction:'/online/cgform/api/doButton',
|
||||
},
|
||||
isorter:{
|
||||
column: 'create_time',
|
||||
order: 'desc',
|
||||
},
|
||||
dictOptions:{
|
||||
|
||||
},
|
||||
|
||||
queryParam:{
|
||||
|
||||
},
|
||||
actionColumn:{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
scopedSlots: { customRender: 'action' },
|
||||
fixed:"right",
|
||||
align:"center",
|
||||
width:150
|
||||
},
|
||||
formTemplate:"99",
|
||||
|
||||
/*自定义按钮-link*/
|
||||
cgButtonLinkList:[],
|
||||
/*自定义按钮-button*/
|
||||
cgButtonList:[],
|
||||
/*JS增强*/
|
||||
EnhanceJS:'',
|
||||
/*操作按钮权限*/
|
||||
buttonSwitch:{
|
||||
add:true,
|
||||
update:true,
|
||||
delete:true,
|
||||
batch_delete:true,
|
||||
import:true,
|
||||
export:true
|
||||
},
|
||||
expandedRowKeys:[],
|
||||
hasBpmStatus:false,
|
||||
flowCodePre:"onl_",
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initAutoListConfig().then(()=>{
|
||||
this.loadData(1)
|
||||
}).catch(msg=>{
|
||||
console.log(msg)
|
||||
})
|
||||
},
|
||||
mounted(){
|
||||
//this.cgButtonJsHandler('mounted')
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
// 刷新参数放到这里去触发，就可以刷新相同界面了
|
||||
this.initAutoListConfig().then(()=>{
|
||||
this.loadData(1)
|
||||
}).catch(msg=>{
|
||||
console.log(msg)
|
||||
})
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
tableProps() {
|
||||
let _this = this
|
||||
return {
|
||||
// 列表项是否可选择
|
||||
// https://vue.ant.design/components/table-cn/#rowSelection
|
||||
rowSelection: {
|
||||
selectedRowKeys: _this.selectedRowKeys,
|
||||
onChange: (selectedRowKeys) => _this.selectedRowKeys = selectedRowKeys
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
resetData(){
|
||||
this.description=''
|
||||
this.currentTableName=''
|
||||
this.pidField=''
|
||||
this.hasChildrenField=''
|
||||
this.textField=''
|
||||
this.columns = []
|
||||
this.dataSource = []
|
||||
this.selectedRowKeys=[]
|
||||
this.selectionRows=[]
|
||||
},
|
||||
initAutoListConfig() {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (!this.$route.params.code) {
|
||||
reject("列表加载需要参数CODE为空!")
|
||||
} else {
|
||||
this.resetData()
|
||||
this.loading = true
|
||||
this.code = this.$route.params.code
|
||||
getAction(`${this.url.getColumns}${this.code}`)
|
||||
.then(res => {
|
||||
console.log("--onlineList-加载动态列>>", res);
|
||||
if(res.success){
|
||||
this.configInfohandler(res)
|
||||
resolve();
|
||||
}else{
|
||||
reject("onlineList-加载表配置信息失败")
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
.catch(err => {
|
||||
reject(err)
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
configInfohandler(res){
|
||||
this.dictOptions = res.result.dictOptions
|
||||
this.formTemplate = res.result.formTemplate
|
||||
this.description = res.result.description
|
||||
this.currentTableName = res.result.currentTableName
|
||||
this.pidField = res.result.pidField
|
||||
this.hasChildrenField = res.result.hasChildrenField
|
||||
this.textField = res.result.textField
|
||||
//自定义按钮
|
||||
this.initCgButtonList(res.result.cgButtonList)
|
||||
//JS增强
|
||||
this.initCgEnhanceJs(res.result.enhanceJs)
|
||||
//操作按钮权限
|
||||
this.initButtonSwitch(res.result.hideColumns)
|
||||
let currColumns = res.result.columns
|
||||
let textFieldIndex = -1
|
||||
let hasBpmStatus = false
|
||||
for(let a=0;a<currColumns.length;a++){
|
||||
currColumns[a].align = 'left'
|
||||
//找到显示列
|
||||
if(this.textField==currColumns[a].dataIndex){
|
||||
textFieldIndex = a
|
||||
}
|
||||
//数据字典翻译
|
||||
if(currColumns[a].customRender){
|
||||
let dictCode = currColumns[a].customRender;
|
||||
currColumns[a].customRender=(text)=>{
|
||||
return filterMultiDictText(this.dictOptions[dictCode], text);
|
||||
}
|
||||
}
|
||||
//判断是否有bpm_status
|
||||
if(currColumns[a].dataIndex.toLowerCase()=='bpm_status'){
|
||||
hasBpmStatus = true;
|
||||
}
|
||||
}
|
||||
this.hasBpmStatus = hasBpmStatus;
|
||||
|
||||
if(textFieldIndex!=-1){
|
||||
let textFieldColumn = currColumns.splice(textFieldIndex,1)
|
||||
currColumns.unshift(textFieldColumn[0])
|
||||
}
|
||||
currColumns.push(this.actionColumn);
|
||||
this.columns = [...currColumns]
|
||||
},
|
||||
//加载根节点
|
||||
loadData(arg){
|
||||
if(arg==1){
|
||||
this.pagination.current=1
|
||||
}
|
||||
this.loading = true
|
||||
this.expandedRowKeys=[]
|
||||
let params = this.getQueryParams();//查询条件
|
||||
params[this.pidField]='0'
|
||||
console.log("--onlineList-查询条件-->",params)
|
||||
getAction(`${this.url.getTreeData}${this.code}`,params).then((res)=>{
|
||||
console.log("--onlineList-列表数据",res)
|
||||
if(res.success){
|
||||
let result = res.result;
|
||||
if(Number(result.total)>0){
|
||||
this.pagination.total = Number(result.total)
|
||||
let dataSource = res.result.records.map(item => {
|
||||
// 判断是否标记了带有子级
|
||||
if (item[this.hasChildrenField] === true || item[this.hasChildrenField]=='1') {
|
||||
let loadChild = { id: `${item.id}_loadChild`, name: 'loading...', isLoading: true }
|
||||
item.children = [loadChild]
|
||||
}
|
||||
return item
|
||||
})
|
||||
this.dataSource = dataSource
|
||||
}else{
|
||||
this.pagination.total=0;
|
||||
this.dataSource=[]
|
||||
}
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
//加载叶子节点
|
||||
handleExpand(expanded, record) {
|
||||
// 判断是否是展开状态
|
||||
if (expanded) {
|
||||
this.expandedRowKeys.push(record.id)
|
||||
if (record.children.length>0 && record.children[0].isLoading === true) {
|
||||
let params = this.getQueryParams();//查询条件
|
||||
params[this.pidField] = record.id
|
||||
getAction(`${this.url.getTreeData}${this.code}`,params).then((res)=>{
|
||||
if(res.success){
|
||||
if(Number(res.result.total)>0){
|
||||
let dataSource = res.result.records.map(item => {
|
||||
// 判断是否标记了带有子级
|
||||
if (item[this.hasChildrenField] === true || item[this.hasChildrenField]=='1') {
|
||||
let loadChild = { id: `${item.id}_loadChild`, name: 'loading...', isLoading: true }
|
||||
item.children = [loadChild]
|
||||
}
|
||||
return item
|
||||
})
|
||||
record.children = dataSource
|
||||
}else{
|
||||
record.children=''
|
||||
record.hasChildrenField='0'
|
||||
}
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
}else{
|
||||
let keyIndex = this.expandedRowKeys.indexOf(record.id)
|
||||
if(keyIndex>=0){
|
||||
this.expandedRowKeys.splice(keyIndex, 1);
|
||||
}
|
||||
}
|
||||
},
|
||||
getQueryParams() {
|
||||
let param = Object.assign({}, this.queryParam,this.isorter);
|
||||
param.pageNo = this.pagination.current;
|
||||
param.pageSize = this.pagination.pageSize;
|
||||
return filterObj(param);
|
||||
},
|
||||
initCgButtonList(btnList){
|
||||
let linkArr = []
|
||||
let buttonArr = []
|
||||
if(btnList && btnList.length>0){
|
||||
for(let i=0;i<btnList.length;i++){
|
||||
let temp = btnList[i]
|
||||
if(temp.buttonStyle=='button'){
|
||||
buttonArr.push(temp)
|
||||
}else if(temp.buttonStyle=='link'){
|
||||
linkArr.push(temp)
|
||||
}
|
||||
}
|
||||
}
|
||||
this.cgButtonLinkList = [...linkArr]
|
||||
this.cgButtonList=[...buttonArr]
|
||||
},
|
||||
initCgEnhanceJs(enhanceJs){
|
||||
//console.log("--onlineList-js增强",enhanceJs)
|
||||
if(enhanceJs){
|
||||
let Obj = eval ("(" + enhanceJs + ")");
|
||||
this.EnhanceJS = new Obj(getAction,postAction,deleteAction);
|
||||
this.cgButtonJsHandler('created')
|
||||
}else{
|
||||
this.EnhanceJS = ''
|
||||
}
|
||||
},
|
||||
initButtonSwitch(hideColumns){
|
||||
if(hideColumns && hideColumns.length>0){
|
||||
Object.keys(this.buttonSwitch).forEach(key=>{
|
||||
if(hideColumns.indexOf(key)>=0){
|
||||
this.buttonSwitch[key]=false
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
onClearSelected(){
|
||||
this.selectedRowKeys = []
|
||||
this.selectionRows = []
|
||||
},
|
||||
handleTableChange(pagination, filters, sorter){
|
||||
//TODO 筛选
|
||||
if (Object.keys(sorter).length>0){
|
||||
this.isorter.column = sorter.field;
|
||||
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
|
||||
}
|
||||
this.pagination = pagination;
|
||||
this.loadData();
|
||||
},
|
||||
/*-------数据格式化-begin----------*/
|
||||
getDateNoTime(text){
|
||||
if(!text){
|
||||
return ''
|
||||
}
|
||||
let a = text;
|
||||
if(a.length>10){
|
||||
a = a.substring(0,10);
|
||||
}
|
||||
return a;
|
||||
},
|
||||
getImgView(text){
|
||||
if(text && text.indexOf(",")>0){
|
||||
text = text.substring(0,text.indexOf(","))
|
||||
}
|
||||
return window._CONFIG['staticDomainURL']+"/"+text
|
||||
},
|
||||
downloadRowFile(text){
|
||||
if(!text){
|
||||
this.$message.warning("未知的文件")
|
||||
return;
|
||||
}
|
||||
if(text.indexOf(",")>0){
|
||||
text = text.substring(0,text.indexOf(","))
|
||||
}
|
||||
window.open(window._CONFIG['staticDomainURL']+"/"+text);
|
||||
},
|
||||
/*-------数据格式化-end----------*/
|
||||
|
||||
/*-------功能按钮触发事件-begin----------*/
|
||||
handleEdit(record){
|
||||
this.cgButtonLinkHandler(record,"beforeEdit","js")
|
||||
this.$refs.modal.edit(this.formTemplate,record.id);
|
||||
},
|
||||
handleDetail(record){
|
||||
this.$refs.modal.detail(this.formTemplate,record.id);
|
||||
},
|
||||
handleDeleteOne(record){
|
||||
this.cgButtonLinkHandler(record,"beforeDelete","js")
|
||||
this.handleDelete(record.id)
|
||||
},
|
||||
handleDelete(id){
|
||||
deleteAction(this.url.optPre+this.code+"/"+id).then((res)=>{
|
||||
if(res.success){
|
||||
this.$message.success(res.message)
|
||||
this.loadData()
|
||||
}else{
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleAdd(){
|
||||
this.cgButtonJsHandler('beforeAdd')
|
||||
this.$refs.modal.add(this.formTemplate);
|
||||
},
|
||||
handleFormSuccess(){
|
||||
this.loadData()
|
||||
},
|
||||
handleImportXls(){
|
||||
this.$refs.importModal.show()
|
||||
},
|
||||
importOk(){
|
||||
this.loadData(1)
|
||||
},
|
||||
getImportUrl(){
|
||||
return '/online/cgform/api/importXls/'+this.code
|
||||
},
|
||||
handleExportXls(){
|
||||
let param = this.queryParam;
|
||||
if(this.selectedRowKeys && this.selectedRowKeys.length>0){
|
||||
param['selections'] = this.selectedRowKeys.join(",")
|
||||
}
|
||||
console.log("导出参数",param)
|
||||
let paramsStr = JSON.stringify(filterObj(param));
|
||||
downFile(this.url.exportXls+this.code,{paramsStr:paramsStr}).then((data)=>{
|
||||
if (!data) {
|
||||
this.$message.warning("文件下载失败")
|
||||
return
|
||||
}
|
||||
if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
||||
window.navigator.msSaveBlob(new Blob([data]), this.description+'.xls')
|
||||
}else{
|
||||
let url = window.URL.createObjectURL(new Blob([data]))
|
||||
let link = document.createElement('a')
|
||||
link.style.display = 'none'
|
||||
link.href = url
|
||||
link.setAttribute('download', this.description+'.xls')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link); //下载完成移除元素
|
||||
window.URL.revokeObjectURL(url); //释放掉blob对象
|
||||
}
|
||||
})
|
||||
},
|
||||
handleDelBatch(){
|
||||
if(this.selectedRowKeys.length<=0){
|
||||
this.$message.warning('请选择一条记录！');
|
||||
return false;
|
||||
}else{
|
||||
let ids = "";
|
||||
let that = this;
|
||||
that.selectedRowKeys.forEach(function(val) {
|
||||
ids+=val+",";
|
||||
});
|
||||
that.$confirm({
|
||||
title:"确认删除",
|
||||
content:"是否删除选中数据?",
|
||||
onOk: function(){
|
||||
that.handleDelete(ids)
|
||||
that.onClearSelected();
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
/*-------功能按钮触发事件-begin----------*/
|
||||
|
||||
/*-------JS增强-begin----------*/
|
||||
cgButtonLinkHandler(record,buttonCode,optType){
|
||||
if(optType=="js"){
|
||||
if(this.EnhanceJS[buttonCode]){
|
||||
this.EnhanceJS[buttonCode](this,record)
|
||||
}
|
||||
}else if(optType=="action"){
|
||||
let params = {
|
||||
formId:this.code,
|
||||
buttonCode:buttonCode,
|
||||
dataId:record.id
|
||||
}
|
||||
console.log("自定义按钮link请求后台参数：",params)
|
||||
postAction(this.url.buttonAction,params).then(res=>{
|
||||
if(res.success){
|
||||
this.loadData()
|
||||
this.$message.success("处理完成!")
|
||||
}else{
|
||||
this.$message.warning("处理失败!")
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
cgButtonJsHandler(buttonCode){
|
||||
if(this.EnhanceJS[buttonCode]){
|
||||
this.EnhanceJS[buttonCode](this)
|
||||
}
|
||||
},
|
||||
cgButtonActionHandler(buttonCode){
|
||||
//处理自定义button的 需要配置该button自定义sql
|
||||
if(!this.selectedRowKeys || this.selectedRowKeys.length==0){
|
||||
this.$message.warning("请先选中一条记录")
|
||||
return false
|
||||
}
|
||||
if(this.selectedRowKeys.length>1){
|
||||
this.$message.warning("请只选中一条记录")
|
||||
return false
|
||||
}
|
||||
let params = {
|
||||
formId:this.code,
|
||||
buttonCode:buttonCode,
|
||||
dataId:this.selectedRowKeys[0]
|
||||
}
|
||||
console.log("自定义按钮请求后台参数：",params)
|
||||
postAction(this.url.buttonAction,params).then(res=>{
|
||||
if(res.success){
|
||||
this.loadData()
|
||||
this.$message.success("处理完成!")
|
||||
}else{
|
||||
this.$message.warning("处理失败!")
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
/*-------JS增强-end----------*/
|
||||
showOptButton(opt,record){
|
||||
//只有当按钮属性为false,或是按钮属性为true但是流程已提交时才隐藏
|
||||
if(!this.buttonSwitch[opt]){
|
||||
return false
|
||||
}else{
|
||||
if(this.hasBpmStatus){
|
||||
if(record.bpm_status !=null && record.bpm_status !='' && record.bpm_status != '1'){
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
return true
|
||||
},
|
||||
showViewFlowButton(record){
|
||||
if(this.hasBpmStatus){
|
||||
if(record.bpm_status !=null && record.bpm_status !='' && record.bpm_status != '1'){
|
||||
return true
|
||||
}
|
||||
}
|
||||
return false
|
||||
},
|
||||
startProcess: function(record){
|
||||
var that = this;
|
||||
this.$confirm({
|
||||
title:"提示",
|
||||
content:"确认提交流程吗?",
|
||||
onOk: function(){
|
||||
var param = {
|
||||
flowCode:that.flowCodePre+that.currentTableName,
|
||||
id:record.id,
|
||||
formUrl:"modules/bpm/task/form/OnlineFormDetail",
|
||||
formUrlMobile:"modules/bpm/task/form/OnlineFormDetail"
|
||||
}
|
||||
postAction(that.url.startProcess,param).then((res)=>{
|
||||
if(res.success){
|
||||
that.$message.success(res.message);
|
||||
that.loadData();
|
||||
that.onClearSelected();
|
||||
}else{
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.ant-card-body .table-operator{
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.ant-table-tbody .ant-table-row td{
|
||||
padding-top:15px;
|
||||
padding-bottom:15px;
|
||||
}
|
||||
.anty-row-operator button{margin: 0 5px}
|
||||
.ant-btn-danger{background-color: #ffffff}
|
||||
|
||||
.anty-img-wrap{height:25px;position: relative;}
|
||||
.anty-img-wrap > img{max-height:100%;}
|
||||
.ant-modal-cust-warp{height: 100%}
|
||||
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
|
||||
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
|
||||
</style>
|
||||
@ -1,111 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<online-common-list
|
||||
:ref="'onl_'+mainModel.currentTableName"
|
||||
:code="code"
|
||||
:model="mainModel"
|
||||
@seleted="onSelected">
|
||||
</online-common-list>
|
||||
|
||||
<a-tabs defaultActiveKey="0">
|
||||
<a-tab-pane v-for="(item,index) in subList" :tab="item.description" :key="index+''" :forceRender="true" >
|
||||
<online-common-list
|
||||
:ref="item.currentTableName"
|
||||
:code="item.code"
|
||||
:model="item"
|
||||
:main="selectedRow">
|
||||
</online-common-list>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'OnlCgformErpList',
|
||||
components:{
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
code:'',
|
||||
url: {
|
||||
getColumns: '/online/cgform/api/getErpColumns/',
|
||||
},
|
||||
mainModel:{},
|
||||
subList:[],
|
||||
mainId:'',
|
||||
selectedRow:{}
|
||||
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
// 刷新参数放到这里去触发，就可以刷新相同界面了
|
||||
this.initColumnConfig()
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.initColumnConfig();
|
||||
},
|
||||
methods:{
|
||||
getSubIndex(index){
|
||||
return index+1 + ''
|
||||
},
|
||||
getSubRef(item){
|
||||
let ref = item.currentTableName
|
||||
console.log("ref string",ref)
|
||||
return ref;
|
||||
},
|
||||
initColumnConfig(){
|
||||
if(!this.$route.params.code){
|
||||
return false
|
||||
}
|
||||
this.code = this.$route.params.code
|
||||
getAction(`${this.url.getColumns}${this.code}`).then((res)=>{
|
||||
console.log("erp表单配置",res)
|
||||
if(res.success){
|
||||
this.mainModel = res.result.main
|
||||
this.subList = res.result.subList
|
||||
|
||||
this.$nextTick(()=>{
|
||||
this.$refs['onl_'+this.mainModel.currentTableName].initListByModel();
|
||||
if(this.subList && this.subList.length>0){
|
||||
for(let item of this.subList){
|
||||
this.$refs[item.currentTableName][0].initListByModel();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
onSelected(row){
|
||||
console.log("onSelected",row)
|
||||
this.selectedRow = row;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.ant-card-body .table-operator{
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
.ant-table-tbody .ant-table-row td{
|
||||
padding-top:15px;
|
||||
padding-bottom:15px;
|
||||
}
|
||||
.anty-row-operator button{margin: 0 5px}
|
||||
.ant-btn-danger{background-color: #ffffff}
|
||||
|
||||
.anty-img-wrap{height:25px;position: relative;}
|
||||
.anty-img-wrap > img{max-height:100%;}
|
||||
.ant-modal-cust-warp{height: 100%}
|
||||
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
|
||||
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
|
||||
</style>
|
||||
@ -1,269 +0,0 @@
|
||||
/**
|
||||
* 同步列表，可以同步新增、修改、删除
|
||||
* @author sunjianlei
|
||||
* */
|
||||
export async function syncAllTable(vm, table1) {
|
||||
vm.$refs.editableTable.resetScrollTop()
|
||||
let deleteIds = table1.$refs.editableTable.getDeleteIds()
|
||||
let table1Value
|
||||
await table1.$refs.editableTable.getValuesPromise(false).then((values) => {
|
||||
table1Value = values
|
||||
return vm.$refs.editableTable.getValuesPromise(false)
|
||||
}).then((values) => {
|
||||
|
||||
table1Value.forEach(value => {
|
||||
let flag = false
|
||||
values.forEach((thisValue) => {
|
||||
if (value.id === thisValue.id) {
|
||||
|
||||
// 判断是否修改了值
|
||||
let dbFieldName = thisValue['dbFieldName']
|
||||
let dbFieldTxt = thisValue['dbFieldTxt']
|
||||
|
||||
// return
|
||||
|
||||
if (value.dbFieldName !== dbFieldName
|
||||
|| value.dbFieldTxt !== dbFieldTxt) {
|
||||
|
||||
// 修改了
|
||||
vm.$refs.editableTable.setValues([{
|
||||
rowKey: thisValue.id,
|
||||
values: {
|
||||
dbFieldName: value.dbFieldName,
|
||||
dbFieldTxt: value.dbFieldTxt
|
||||
}
|
||||
}])
|
||||
|
||||
}
|
||||
flag = true
|
||||
} else {
|
||||
// id不匹配则有可能是新增也有可能是删除了的
|
||||
// 遍历传进来的 deleteIds 进行对比
|
||||
deleteIds.forEach(delId => {
|
||||
// 对比成功，则删除该条数据
|
||||
if (delId === thisValue.id) {
|
||||
vm.$refs.editableTable.removeRows(vm.$refs.editableTable.caseId + delId)
|
||||
flag = true
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
// return
|
||||
// 判断是否操作了该条数据，若没有操作则代表要执行新增操作
|
||||
if (!flag) {
|
||||
let record = Object.assign({}, value)
|
||||
vm.columns.forEach(column => {
|
||||
if (
|
||||
column.dataIndex !== 'dbFieldName' &&
|
||||
column.dataIndex !== 'dbFieldTxt'
|
||||
) {
|
||||
record[column.dataIndex] = column.defaultValue
|
||||
}
|
||||
})
|
||||
vm.$refs.editableTable.push(record)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* 将数据分类并Set进dataSource
|
||||
* @author sunjianlei
|
||||
**/
|
||||
export function setDataSource(vm, queryData) {
|
||||
let dataSource = []
|
||||
// 遍历查询出来的数据
|
||||
queryData.forEach(value => {
|
||||
|
||||
let data = { id: value['id'] }
|
||||
vm.columns.forEach(column => {
|
||||
let key = column.key
|
||||
if (key) {
|
||||
data[key] = value[key]
|
||||
|
||||
// 由于多选下拉框返回的是一个数组，所以需要改成 [1,2,3] 数组的形式，否则组件不识别
|
||||
// if (key === 'indexField') {
|
||||
// data[key] = value[key].split(',')
|
||||
// }
|
||||
|
||||
}
|
||||
})
|
||||
dataSource.push(data)
|
||||
})
|
||||
vm.dataSource = dataSource
|
||||
}
|
||||
|
||||
/** 获取主表的初始化数据 */
|
||||
export function getMasterTableInitialData() {
|
||||
return [
|
||||
{
|
||||
dbFieldName: 'id',
|
||||
dbFieldTxt: '主键',
|
||||
dbLength: 36,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'string',
|
||||
dbIsKey: '1',
|
||||
dbIsNull: '0',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
isReadOnly: '1',
|
||||
fieldShowType: 'text',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 1
|
||||
},
|
||||
{
|
||||
dbFieldName: 'create_by',
|
||||
dbFieldTxt: '创建人',
|
||||
dbLength: 50,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'string',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'text',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 2
|
||||
},
|
||||
{
|
||||
dbFieldName: 'create_time',
|
||||
dbFieldTxt: '创建日期',
|
||||
dbLength: 20,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'Date',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'datetime',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 3
|
||||
},
|
||||
{
|
||||
dbFieldName: 'update_by',
|
||||
dbFieldTxt: '更新人',
|
||||
dbLength: 50,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'string',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'text',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 4
|
||||
},
|
||||
{
|
||||
dbFieldName: 'update_time',
|
||||
dbFieldTxt: '更新日期',
|
||||
dbLength: 20,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'Date',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'datetime',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 5
|
||||
},{
|
||||
dbFieldName: 'sys_org_code',
|
||||
dbFieldTxt: '所属部门',
|
||||
dbLength: 64,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'string',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'text',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 6
|
||||
}
|
||||
// {
|
||||
// dbFieldName: 'sys_org_code',
|
||||
// dbFieldTxt: '所属部门',
|
||||
// dbLength: 50,
|
||||
// dbPointLength: 0,
|
||||
// dbDefaultVal: '',
|
||||
// dbType: 'string',
|
||||
// dbIsKey: false,
|
||||
// dbIsNull: true
|
||||
// }, {
|
||||
// dbFieldName: 'sys_company_code',
|
||||
// dbFieldTxt: '所属公司',
|
||||
// dbLength: 50,
|
||||
// dbPointLength: 0,
|
||||
// dbDefaultVal: '',
|
||||
// dbType: 'string',
|
||||
// dbIsKey: false,
|
||||
// dbIsNull: true
|
||||
// }, {
|
||||
// dbFieldName: 'bpm_status',
|
||||
// dbFieldTxt: '流程状态',
|
||||
// dbLength: 32,
|
||||
// dbPointLength: 0,
|
||||
// dbDefaultVal: '',
|
||||
// dbType: 'string',
|
||||
// dbIsKey: false,
|
||||
// dbIsNull: true
|
||||
// }
|
||||
]
|
||||
}
|
||||
/** 获取树的初始化数据 */
|
||||
export function getTreeNeedFields() {
|
||||
return [{
|
||||
dbFieldName: 'pid',
|
||||
dbFieldTxt: '父级节点',
|
||||
dbLength: 32,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'string',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '1',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'text',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 7
|
||||
},{
|
||||
dbFieldName: 'has_child',
|
||||
dbFieldTxt: '是否有子节点',
|
||||
dbLength: 3,
|
||||
dbPointLength: 0,
|
||||
dbDefaultVal: '',
|
||||
dbType: 'string',
|
||||
dbIsKey: '0',
|
||||
dbIsNull: '1',
|
||||
// table2
|
||||
isShowForm: '0',
|
||||
isShowList: '0',
|
||||
fieldShowType: 'list',
|
||||
fieldLength: '120',
|
||||
queryMode: 'single',
|
||||
orderNum: 8,
|
||||
// table3
|
||||
dictField:"yn"
|
||||
}]
|
||||
}
|
||||
@ -1,256 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-form-item label="报表编码">
|
||||
<a-input placeholder="请输入报表编码" v-model="queryParam.code"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<a-form-item label="报表名字">
|
||||
<a-input placeholder="请输入报表名字" v-model="queryParam.name"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">录入</a-button>
|
||||
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel">
|
||||
<a-icon type="delete"/>
|
||||
删除
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px"> 批量操作
|
||||
<a-icon type="down"/>
|
||||
</a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i>
|
||||
已选择
|
||||
<a style="font-weight: 600">
|
||||
{{ selectedRowKeys.length }}
|
||||
</a>
|
||||
项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
@change="handleTableChange">
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical"/>
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item @click="popReportURL(record.id)">
|
||||
配置地址
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a @click="goPageOnline(record.id)">功能测试</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
<!-- table区域-end -->
|
||||
|
||||
<!-- 表单区域 -->
|
||||
<onlCgreportHead-modal ref="modalForm" @ok="modalFormOk"></onlCgreportHead-modal>
|
||||
|
||||
<!-- 提示online报表链接 -->
|
||||
<a-modal
|
||||
title="报表访问链接"
|
||||
:visible="visible"
|
||||
@cancel="handleCancel">
|
||||
<template slot="footer">
|
||||
<a-button @click="handleCancel">关闭</a-button>
|
||||
<a-button type="primary" class="copy-this-text" :data-clipboard-text="reportUrlText" @click="onCopyUrl">复制</a-button>
|
||||
</template>
|
||||
<p>{{ reportUrlText }}</p>
|
||||
</a-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
|
||||
import Clipboard from 'clipboard'
|
||||
import { getAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'OnlCgreportHeadList',
|
||||
mixins: [JeecgListMixin],
|
||||
components: {
|
||||
Clipboard
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
description: '在线报表配置管理页面',
|
||||
visible:false,
|
||||
reportUrlText:'',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title: '报表名称',
|
||||
align: 'center',
|
||||
dataIndex: 'name'
|
||||
},
|
||||
{
|
||||
title: '编码',
|
||||
align: 'center',
|
||||
dataIndex: 'code'
|
||||
},
|
||||
{
|
||||
title: '查询SQL',
|
||||
align: 'center',
|
||||
dataIndex: 'cgrSql'
|
||||
},
|
||||
{
|
||||
title: '数据源',
|
||||
align: 'center',
|
||||
dataIndex: 'dbSource'
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
align: 'center',
|
||||
dataIndex: 'createTime'
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
align: 'center',
|
||||
dataIndex: 'content'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align: 'center',
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: '/online/cgreport/head/list',
|
||||
delete: '/online/cgreport/head/delete',
|
||||
deleteBatch: '/online/cgreport/head/deleteBatch',
|
||||
getParamsInfo:'/online/cgreport/api/getParamsInfo/'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initReportUrlText(id){
|
||||
getAction(this.url.getParamsInfo+id).then((res) => {
|
||||
let textUrl = ""
|
||||
if (res.success) {
|
||||
if(res.result && res.result.length>0){
|
||||
for(let i of res.result){
|
||||
textUrl+=i.paramName+"=${"+i.paramName+"}&"
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
if(textUrl.length>0){
|
||||
textUrl = textUrl.substring(0,textUrl.length-1)
|
||||
this.reportUrlText = `/online/cgreport/${id}?${textUrl}`
|
||||
}else{
|
||||
this.reportUrlText = `/online/cgreport/${id}`
|
||||
}
|
||||
})
|
||||
},
|
||||
goPageOnline(id){
|
||||
this.$router.push({path: '/online/cgreport/'+id})
|
||||
},
|
||||
popReportURL(id){
|
||||
this.visible = true;
|
||||
this.initReportUrlText(id)
|
||||
},
|
||||
handleCancel(){
|
||||
this.visible = false
|
||||
this.reportUrlText = '';
|
||||
},
|
||||
onCopyUrl(){
|
||||
var clipboard = new Clipboard('.copy-this-text')
|
||||
clipboard.on('success', () => {
|
||||
clipboard.destroy()
|
||||
this.$message.success('复制成功')
|
||||
this.handleCancel()
|
||||
})
|
||||
clipboard.on('error', () => {
|
||||
this.$message.error('该浏览器不支持自动复制')
|
||||
clipboard.destroy()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.ant-card-body .table-operator {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.ant-table-tbody .ant-table-row td {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.anty-row-operator button {
|
||||
margin: 0 5px
|
||||
}
|
||||
|
||||
.ant-btn-danger {
|
||||
background-color: #ffffff
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-body {
|
||||
height: calc(100% - 110px) !important;
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.ant-modal-cust-warp .ant-modal-content {
|
||||
height: 90% !important;
|
||||
overflow-y: hidden
|
||||
}
|
||||
</style>
|
||||
@ -1,319 +0,0 @@
|
||||
<template>
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="24" v-if="queryInfo && queryInfo.length>0">
|
||||
<template v-for="(item,index) in queryInfo">
|
||||
<template v-if=" item.hidden==='1' ">
|
||||
<a-col v-if="item.view.indexOf('Date')>=0" :md="12" :sm="16" :key=" 'query'+index " v-show="toggleSearchStatus">
|
||||
<onl-cgreport-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></onl-cgreport-query-form-item>
|
||||
</a-col>
|
||||
<a-col v-else :md="6" :sm="8" :key=" 'query'+index " v-show="toggleSearchStatus">
|
||||
<onl-cgreport-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></onl-cgreport-query-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
<template v-else>
|
||||
<a-col v-if="item.view.indexOf('Date')>=0" :md="12" :sm="16" :key=" 'query'+index ">
|
||||
<onl-cgreport-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></onl-cgreport-query-form-item>
|
||||
</a-col>
|
||||
<a-col v-else :md="6" :sm="8" :key=" 'query'+index ">
|
||||
<onl-cgreport-query-form-item :queryParam="queryParam" :item="item" :dictOptions="dictOptions"></onl-cgreport-query-form-item>
|
||||
</a-col>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<a-col :md="6" :sm="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchByQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
<a @click="handleToggleSearch" style="margin-left: 8px">
|
||||
{{ toggleSearchStatus ? '收起' : '展开' }}
|
||||
<a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
|
||||
</a>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="table-operator" style="margin-bottom: 10px">
|
||||
<a-button type="primary" icon="plus" @click="exportExcel">导出</a-button>
|
||||
</div>
|
||||
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="table.columns"
|
||||
:dataSource="table.dataSource"
|
||||
:pagination="table.pagination"
|
||||
:loading="table.loading"
|
||||
:scroll="table.scroll"
|
||||
:rowSelection="{fixed:true, selectedRowKeys: table.selectedRowKeys, onChange: handleChangeInTableSelect}"
|
||||
@change="handleChangeInTable"
|
||||
style="min-height: 300px"
|
||||
>
|
||||
|
||||
<!-- 支持链接href跳转 -->
|
||||
<template
|
||||
v-for="field of fieldHrefSlots"
|
||||
:slot="field.slotName"
|
||||
slot-scope="text, record"
|
||||
>
|
||||
<a @click="handleClickFieldHref(field,record)">{{ text }}</a>
|
||||
</template>
|
||||
|
||||
</a-table>
|
||||
|
||||
<!-- 跳转Href的动态组件方式 -->
|
||||
<a-modal v-bind="hrefComponent.model" v-on="hrefComponent.on">
|
||||
<component :is="hrefComponent.is" v-bind="hrefComponent.params"/>
|
||||
</a-modal>
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { HrefJump } from '@/mixins/OnlAutoListMixin'
|
||||
import { getAction,downFile } from '@/api/manage'
|
||||
import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
|
||||
import {filterObj} from '@/utils/util';
|
||||
|
||||
export default {
|
||||
name: 'OnlCgreportAutoList',
|
||||
mixins: [HrefJump],
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 查询参数
|
||||
queryInfo: [],
|
||||
// 查询参数，多个页面的查询参数用 code 作为键来区分
|
||||
queryParamsMap: {},
|
||||
selfParam:{
|
||||
},
|
||||
sorter: {
|
||||
column: '',
|
||||
order: 'desc',
|
||||
},
|
||||
dictOptions: {},
|
||||
toggleSearchStatus: false, // 高级搜索 展开/关闭
|
||||
reportCode: '',
|
||||
description: '在线报表功能测试页面',
|
||||
url: {
|
||||
getColumnsAndData: '/online/cgreport/api/getColumnsAndData/',
|
||||
getQueryInfo: '/online/cgreport/api/getQueryInfo/',
|
||||
getParamsInfo:'/online/cgreport/api/getParamsInfo/'
|
||||
},
|
||||
table: {
|
||||
loading: true,
|
||||
// 表头
|
||||
columns: [],
|
||||
//数据集
|
||||
dataSource: [],
|
||||
// 选择器
|
||||
selectedRowKeys: [],
|
||||
selectionRows: [],
|
||||
scroll: { x: false },
|
||||
// 分页参数
|
||||
pagination: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ['10', '20', '30'],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + '-' + range[1] + ' 共' + total + '条'
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
cgreportHeadName:""
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initParamsInfo()
|
||||
this.initQueryInfo();
|
||||
},
|
||||
watch: {
|
||||
'$route'() {
|
||||
// 刷新参数放到这里去触发，就可以刷新相同界面了
|
||||
this.initParamsInfo()
|
||||
this.initQueryInfo();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
queryParam: {
|
||||
get() {
|
||||
return this.queryParamsMap[this.reportCode]
|
||||
},
|
||||
set(newVal) {
|
||||
this.$set(this.queryParamsMap, this.reportCode, newVal)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initParamsInfo(){
|
||||
if(!this.$route.params.code){
|
||||
return false
|
||||
}
|
||||
//获取报表ID
|
||||
this.reportCode = this.$route.params.code;
|
||||
if (!this.queryParam) {
|
||||
this.queryParam = {}
|
||||
}
|
||||
|
||||
this.selfParam={}
|
||||
getAction(`${this.url.getParamsInfo}${this.reportCode}`).then((res) => {
|
||||
if (res.success) {
|
||||
if(res.result && res.result.length>0){
|
||||
for(let i of res.result){
|
||||
this.selfParam['self_'+i.paramName]=(!this.$route.query[i.paramName])?"":this.$route.query[i.paramName]
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
this.loadData()
|
||||
})
|
||||
},
|
||||
initQueryInfo() {
|
||||
if(!this.reportCode){
|
||||
return false
|
||||
}
|
||||
getAction(`${this.url.getQueryInfo}${this.reportCode}`).then((res) => {
|
||||
console.log("获取查询条件", res);
|
||||
if (res.success) {
|
||||
this.queryInfo = res.result
|
||||
} else {
|
||||
this.$message.warning(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
loadData(arg) {
|
||||
if(!this.reportCode){
|
||||
return false
|
||||
}
|
||||
if (arg == 1) {
|
||||
this.table.pagination.current = 1
|
||||
}
|
||||
let params = this.getQueryParams();//查询条件
|
||||
console.log(params)
|
||||
|
||||
//获取报表ID
|
||||
console.log(' 动态报表 reportCode ： ' + this.reportCode);
|
||||
this.table.loading = true
|
||||
|
||||
getAction(`${this.url.getColumnsAndData}${this.reportCode}`, params).then(res => {
|
||||
if (res.success) {
|
||||
let { data, columns, cgreportHeadName, dictOptions, fieldHrefSlots } = res.result
|
||||
|
||||
let columnWidth = 230
|
||||
this.dictOptions = dictOptions
|
||||
for(let a=0;a<columns.length;a++){
|
||||
if(columns[a].customRender){
|
||||
let field_name = columns[a].customRender;
|
||||
columns[a].customRender = (t => t ? filterMultiDictText(this.dictOptions[field_name], t + '') : t)
|
||||
}
|
||||
columns.width = columnWidth
|
||||
}
|
||||
this.table.scroll.x = columns.length * columnWidth
|
||||
this.table.columns = [...columns]
|
||||
this.cgreportHeadName = cgreportHeadName
|
||||
this.fieldHrefSlots = fieldHrefSlots
|
||||
if (data) {
|
||||
this.table.pagination.total = Number(data.total)
|
||||
this.table.dataSource = data.records
|
||||
} else {
|
||||
this.table.pagination.total = 0
|
||||
this.table.dataSource = []
|
||||
}
|
||||
|
||||
}else{
|
||||
this.$message.warn('查询失败：'+res.message)
|
||||
}
|
||||
|
||||
}).catch((e) => {
|
||||
console.error(e)
|
||||
this.$message.error('查询失败')
|
||||
}).finally(() => {
|
||||
this.table.loading = false
|
||||
})
|
||||
},
|
||||
getQueryParams() {
|
||||
let param = Object.assign({}, this.queryParam, this.sorter,this.selfParam);
|
||||
param.pageNo = this.table.pagination.current;
|
||||
param.pageSize = this.table.pagination.pageSize;
|
||||
return filterObj(param);
|
||||
},
|
||||
searchByQuery() {
|
||||
this.loadData(1);
|
||||
},
|
||||
searchReset() {
|
||||
this.queryParam = {}
|
||||
this.loadData(1);
|
||||
},
|
||||
handleToggleSearch() {
|
||||
this.toggleSearchStatus = !this.toggleSearchStatus;
|
||||
},
|
||||
exportExcel() {
|
||||
let fileName = this.cgreportHeadName
|
||||
let selfParam = {}
|
||||
for (let queryName in this.$route.query) {
|
||||
if (this.$route.query.hasOwnProperty(queryName)) {
|
||||
let value = this.$route.query[queryName]
|
||||
selfParam['self_' + queryName] = value || ''
|
||||
}
|
||||
}
|
||||
downFile(`/online/cgreport/api/exportXls/${this.reportCode}`, Object.assign(selfParam, this.queryParam)).then((data) => {
|
||||
if (!data) {
|
||||
this.$message.warning("文件下载失败")
|
||||
return
|
||||
}
|
||||
if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
||||
window.navigator.msSaveBlob(new Blob([data]), fileName+'.xls')
|
||||
}else{
|
||||
let url = window.URL.createObjectURL(new Blob([data]))
|
||||
let link = document.createElement('a')
|
||||
link.style.display = 'none'
|
||||
link.href = url
|
||||
link.setAttribute('download', fileName+'.xls')
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link); //下载完成移除元素
|
||||
window.URL.revokeObjectURL(url); //释放掉blob对象
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChangeInTableSelect(selectedRowKeys, selectionRows) {
|
||||
this.table.selectedRowKeys = selectedRowKeys
|
||||
this.table.selectionRows = selectionRows
|
||||
},
|
||||
handleChangeInTable(pagination, filters, sorter) {
|
||||
//分页、排序、筛选变化时触发
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.sorter.column = sorter.field
|
||||
this.sorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
|
||||
} else {
|
||||
this.sorter.column = null
|
||||
this.sorter.order = null
|
||||
}
|
||||
this.table.pagination = pagination
|
||||
this.loadData()
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 500px
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -14,6 +14,12 @@
|
||||
<a-input placeholder="请输入文件地址" v-model="queryParam.url"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :md="6" :sm="8">
|
||||
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
||||
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
||||
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user