You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
547 lines
20 KiB
547 lines
20 KiB
<template>
|
|
<div>
|
|
<main class="site-content" :class="{ 'site-content--tabs': $route.meta.isTab }">
|
|
<!-- 主入口标签页 s -->
|
|
<el-tabs
|
|
v-if="$route.meta.isTab"
|
|
v-model="mainTabsActiveName"
|
|
:closable="true"
|
|
@tab-click="selectedTabHandle"
|
|
@tab-remove="removeTabHandle">
|
|
<el-dropdown class="site-tabs__tools" :show-timeout="0">
|
|
<i class="el-icon-arrow-down el-icon--right"></i>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item @click.native="tabsCloseCurrentHandle">关闭当前标签页</el-dropdown-item>
|
|
<el-dropdown-item @click.native="tabsCloseOtherHandle">关闭其它标签页</el-dropdown-item>
|
|
<el-dropdown-item @click.native="tabsCloseAllHandle">关闭全部标签页</el-dropdown-item>
|
|
<el-dropdown-item @click.native="refresh()">刷新当前标签页</el-dropdown-item>
|
|
<!-- <el-dropdown-item @click.native="flag = true">筛选条件</el-dropdown-item>-->
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
<el-tab-pane
|
|
v-for="item in mainTabs"
|
|
:key="item.name"
|
|
:label="item.title"
|
|
:name="item.name">
|
|
<el-card :body-style="siteContentViewHeight">
|
|
<iframe
|
|
v-if="item.type === 'iframe'"
|
|
:src="item.iframeUrl"
|
|
width="100%" height="100%" frameborder="0" scrolling="yes">
|
|
</iframe>
|
|
<keep-alive v-else>
|
|
<router-view v-if="item.name === mainTabsActiveName" />
|
|
</keep-alive>
|
|
</el-card>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
<!-- 主入口标签页 e -->
|
|
<el-card v-else :body-style="siteContentViewHeight">
|
|
<keep-alive>
|
|
<router-view />
|
|
</keep-alive>
|
|
</el-card>
|
|
</main>
|
|
<el-dialog title="查询" append-to-body v-drag @close="closeSiftDialog" @open="openSiftDialog" :visible.sync="flag" width="65%">
|
|
<el-container>
|
|
<el-aside width="90%">
|
|
<el-autocomplete :hide-loading="false" v-if="!settingFlag" style="width: 100%;" @select="handleSelect" :fetch-suggestions="querySaveRecord" v-model="querySavedVo.itemDesc">
|
|
<el-button @click="searchQuerySavedVo" style="width: 80px" slot="append" icon="el-icon-search"></el-button>
|
|
</el-autocomplete>
|
|
<el-table ref="siftTable" :row-key="getRowKeys" @selection-change="handleSelectionChange" :data="siftList" height="40vh" border>
|
|
<el-table-column
|
|
type="selection"
|
|
width="40" align="center" v-if="settingFlag">
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="left" header-align="center" width="70" v-if="settingFlag">
|
|
<template slot-scope="{row,$index}">
|
|
<el-link style="cursor:pointer;" @click="moveSetting($index,-1)" v-if="$index !== 0">上移</el-link>
|
|
<el-link style="cursor:pointer;" @click="moveSetting($index,1)" v-if="$index !== siftList.length-1">下移</el-link>
|
|
</template>
|
|
</el-table-column>
|
|
<!-- <el-table-column label="属性" align="center" show-overflow-tooltip width="120" prop="fieldName"></el-table-column>-->
|
|
<el-table-column label="属性名称" align="center" show-overflow-tooltip width="120" prop="fieldCaption"></el-table-column>
|
|
<el-table-column label="条件" align="center">
|
|
<template slot-scope="{row,$index}">
|
|
<el-input v-model="row.formula" clearable>
|
|
<el-select slot="prepend" clearable v-model="row.symbol" style="width: 100px;cursor:pointer;">
|
|
<el-option value="eq" label="等于"></el-option>
|
|
<el-option value="gt" label="大于"></el-option>
|
|
<el-option value="ge" label="大于等于"></el-option>
|
|
<el-option value="lt" label="小于"></el-option>
|
|
<el-option value="le" label="小于等于"></el-option>
|
|
<el-option value="between" label="之间"></el-option>
|
|
<el-option value="in" label="或者"></el-option>
|
|
<el-option value="ne" label="不等于"></el-option>
|
|
<el-option value="like" label="LIKE"></el-option>
|
|
</el-select>
|
|
</el-input>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="排序" align="center" prop="sortBy" show-overflow-tooltip width="120">
|
|
<template slot-scope="{row,$index}">
|
|
<el-select v-model="row.sortBy" clearable style="width: 100%">
|
|
<el-option value="asc" label="升序"></el-option>
|
|
<el-option value="desc" label="降序"></el-option>
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="次序" align="center" prop="orderSeq" width="120">
|
|
<template slot-scope="{row,$index}">
|
|
<el-input-number v-model="row.orderSeq" clearable style="width: 100%;" :controls="false"></el-input-number>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="数据库字段" align="center" prop="originalField" show-overflow-tooltip width="120"></el-table-column>
|
|
</el-table>
|
|
</el-aside>
|
|
<el-container>
|
|
<el-main style="padding: 0px;">
|
|
<el-card class="box-card" style="height: 100%;margin-left: 3px">
|
|
<div style="text-align: center;">
|
|
<div class="box-div" style="margin-top: 70px">
|
|
<button @click="openSaveQueryHeaderDialog" v-if="!settingFlag">条件保存</button>
|
|
</div>
|
|
<div class="box-div">
|
|
<button @click="flushedSiftList">刷新</button>
|
|
</div>
|
|
<div class="box-div">
|
|
<button @click="clearSetting">清除</button>
|
|
</div>
|
|
<div class="box-div">
|
|
<button @click="queryUserSettingSave">{{ settingFlag?'保存':'配置' }}</button>
|
|
</div>
|
|
<div class="box-div" v-if="settingFlag">
|
|
<button @click="settingFlag = false">取消</button>
|
|
</div>
|
|
<div class="box-div" v-if="!settingFlag">
|
|
<el-checkbox v-model="querySavedVo.caseSensitiveFlag" true-label="Y" false-label="N">不区分大小写</el-checkbox>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-main>
|
|
</el-container>
|
|
</el-container>
|
|
<div style="height: 20px;width: 100%"></div>
|
|
</el-dialog>
|
|
|
|
<el-dialog title="记录名称" center :visible.sync="saveQueryHeader" @open="selectData = {itemDesc: undefined}" top="20vh" width="20%">
|
|
<el-input v-model="selectData.itemDesc"></el-input>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="saveQueryHeaderDetail">保 存</el-button>
|
|
<el-button type="primary" @click="saveQueryHeader = false">关 闭</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { isURL } from '@/utils/validate'
|
|
import {
|
|
saveOrUpdateBatch, saveQueryHeaderDetail,
|
|
searchUserSettingList,
|
|
searchUserSettingRecording,
|
|
searchUserSettingRecordList
|
|
} from "../api/sift/queryUserSetting";
|
|
import {Decimal} from "decimal.js";
|
|
export default {
|
|
inject: ['refresh'],
|
|
data () {
|
|
return {
|
|
cloneSiftList:[],
|
|
flag:false,
|
|
settingFlag:false,
|
|
selectionSiftList:[],
|
|
recordList:[],
|
|
selectData:{
|
|
itemDesc:undefined,
|
|
},
|
|
querySavedVo:{
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id,
|
|
itemNo:undefined,
|
|
itemDesc:undefined,
|
|
caseSensitiveFlag:'N'
|
|
},
|
|
saveQueryHeader:false,
|
|
}
|
|
},
|
|
computed: {
|
|
documentClientHeight: {
|
|
get () { return this.$store.state.common.documentClientHeight }
|
|
},
|
|
menuActiveName: {
|
|
get () { return this.$store.state.common.menuActiveName },
|
|
set (val) { this.$store.commit('common/updateMenuActiveName', val) }
|
|
},
|
|
mainTabs: {
|
|
get () { return this.$store.state.common.mainTabs },
|
|
set (val) { this.$store.commit('common/updateMainTabs', val) }
|
|
},
|
|
mainTabsActiveName: {
|
|
get () { return this.$store.state.common.mainTabsActiveName },
|
|
set (val) { this.$store.commit('common/updateMainTabsActiveName', val) }
|
|
},
|
|
siteContentViewHeight () {
|
|
var height = this.documentClientHeight - 50 - 2
|
|
if (this.$route.meta.isTab) {
|
|
height -= 40
|
|
return isURL(this.$route.meta.iframeUrl) ? { height: height + 'px' } : { minHeight: height + 'px' }
|
|
}
|
|
return { minHeight: height + 'px' }
|
|
},
|
|
siftList:{
|
|
get(){
|
|
return this.$store.state.sift.siftList.filter(e => e.visible === 'Y'|| this.settingFlag)
|
|
},
|
|
}
|
|
},
|
|
methods: {
|
|
// tabs, 选中tab
|
|
selectedTabHandle (tab) {
|
|
tab = this.mainTabs.filter(item => item.name === tab.name)
|
|
if (tab.length >= 1) {
|
|
this.$router.push({ name: tab[0].name, query: tab[0].query, params: tab[0].params })
|
|
}
|
|
},
|
|
// tabs, 删除tab
|
|
removeTabHandle (tabName) {
|
|
this.mainTabs = this.mainTabs.filter(item => item.name !== tabName)
|
|
if (this.mainTabs.length >= 1) {
|
|
// 当前选中tab被删除
|
|
if (tabName === this.mainTabsActiveName) {
|
|
var tab = this.mainTabs[this.mainTabs.length - 1]
|
|
this.$router.push({ name: tab.name, query: tab.query, params: tab.params }, () => {
|
|
this.mainTabsActiveName = this.$route.name
|
|
})
|
|
}
|
|
} else {
|
|
this.menuActiveName = ''
|
|
this.$router.push({ name: 'home' })
|
|
}
|
|
},
|
|
// tabs, 关闭当前
|
|
tabsCloseCurrentHandle () {
|
|
console.log(this.$route.meta.menuId)
|
|
this.removeTabHandle(this.mainTabsActiveName)
|
|
},
|
|
// tabs, 关闭其它
|
|
tabsCloseOtherHandle () {
|
|
this.mainTabs = this.mainTabs.filter(item => item.name === this.mainTabsActiveName)
|
|
},
|
|
// tabs, 关闭全部
|
|
tabsCloseAllHandle () {
|
|
this.mainTabs = []
|
|
this.menuActiveName = ''
|
|
this.$router.push({ name: 'home' })
|
|
},
|
|
// tabs, 刷新当前
|
|
tabsRefreshCurrentHandle () {
|
|
var tab = this.$route
|
|
this.removeTabHandle(tab.name)
|
|
this.$nextTick(() => {
|
|
this.$router.push({ name: tab.name, query: tab.query, params: tab.params })
|
|
})
|
|
},
|
|
openSiftDialog(){
|
|
this.cloneSiftList = JSON.parse(JSON.stringify(this.$store.state.sift.siftList))
|
|
},
|
|
closeSiftDialog(){
|
|
if (this.settingFlag){
|
|
this.$confirm('存在未保存的数据，是否保存?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
this.queryUserSettingSave();
|
|
this.settingFlag = false;
|
|
}).catch(() => {
|
|
this.settingFlag = false;
|
|
});
|
|
}
|
|
this.$store.commit("sift/commitSiftList",this.cloneSiftList);
|
|
this.querySavedVo={
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id,
|
|
itemNo:undefined,
|
|
itemDesc:undefined,
|
|
caseSensitiveFlag:'N'
|
|
};
|
|
},
|
|
searchSiftList(){
|
|
let params = {
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id
|
|
}
|
|
searchUserSettingList(params).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.$store.commit("sift/commitSiftList",data.rows)
|
|
this.cloneSiftList = data.rows
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.warning(error)
|
|
})
|
|
},
|
|
queryUserSettingSave(){
|
|
if (this.settingFlag === false){
|
|
this.settingFlag = true
|
|
this.$store.commit("sift/commitSiftList",this.cloneSiftList)
|
|
this.$nextTick(()=>{
|
|
this.$refs.siftTable.clearSelection()
|
|
this.siftList.forEach(row=>{
|
|
this.$refs.siftTable.toggleRowSelection(row,row.visible === 'Y')
|
|
})
|
|
})
|
|
return
|
|
}
|
|
// 修改选择值切换
|
|
// this.showSetting();
|
|
// 发起新增或修改请求
|
|
saveOrUpdateBatch(this.showSetting()).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.searchSiftList()
|
|
this.querySavedVo={
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id,
|
|
itemNo:undefined,
|
|
itemDesc:undefined,
|
|
caseSensitiveFlag:'N'
|
|
}
|
|
this.settingFlag = false
|
|
this.$message.success(data.msg)
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
handleSelectionChange(val){
|
|
this.selectionSiftList = val
|
|
},
|
|
getRowKeys(row){
|
|
return row.fieldName
|
|
},
|
|
moveSetting(i,num){
|
|
let arr = [...this.siftList]
|
|
arr[i+num].showSeqNo = new Decimal(arr[i+num].showSeqNo).toNumber() - num
|
|
arr[i].showSeqNo = new Decimal(arr[i+num].showSeqNo).toNumber() + num
|
|
arr = arr.sort((a,b)=> a.showSeqNo-b.showSeqNo)
|
|
this.$store.commit("sift/commitSiftList",arr)
|
|
this.$nextTick(()=>{
|
|
this.siftList.forEach(row =>{
|
|
this.$refs.siftTable.toggleRowSelection(row,row.visible === 'Y')
|
|
})
|
|
})
|
|
},
|
|
showSetting(){
|
|
let arr = [...this.siftList]
|
|
arr.map(i=>{
|
|
i.visible = 'N'
|
|
return i
|
|
})
|
|
this.selectionSiftList.forEach(item=>{
|
|
for (let i = 0; i < arr.length; i++) {
|
|
let setting = arr[i]
|
|
if (item.fieldName === setting.fieldName){
|
|
setting.visible = 'Y'
|
|
break
|
|
}
|
|
}
|
|
})
|
|
return arr
|
|
},
|
|
clearSetting(){
|
|
let arr = JSON.parse(JSON.stringify(this.siftList));
|
|
for (let i = 0; i < this.siftList.length; i++) {
|
|
arr[i].symbol = null;
|
|
arr[i].formula = null;
|
|
arr[i].sortBy = null;
|
|
}
|
|
this.querySavedVo = {
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id,
|
|
itemNo:undefined,
|
|
itemDesc:undefined,
|
|
caseSensitiveFlag:'N'
|
|
};
|
|
this.$store.commit("sift/commitSiftList",arr)
|
|
this.$nextTick(()=>{
|
|
this.siftList.forEach(row =>{
|
|
this.$refs.siftTable.toggleRowSelection(row,row.visible === 'Y')
|
|
})
|
|
})
|
|
},
|
|
flushedSiftList(){
|
|
let params = {
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id
|
|
}
|
|
this.querySavedVo={
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id,
|
|
itemNo:undefined,
|
|
itemDesc:undefined,
|
|
caseSensitiveFlag:'N'
|
|
}
|
|
searchUserSettingList(params).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.$store.commit("sift/commitSiftList",data.rows)
|
|
this.$nextTick(()=>{
|
|
this.siftList.forEach(row =>{
|
|
this.$refs.siftTable.toggleRowSelection(row,row.visible === 'Y')
|
|
})
|
|
})
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
flushedSiftRecording(){
|
|
let params = {
|
|
menuId:this.$route.meta.menuId,
|
|
userId:this.$store.state.user.id
|
|
}
|
|
searchUserSettingRecordList(params).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.recordList = data.rows
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
flushSift(){
|
|
if (this.$route.meta.menuId){
|
|
this.flushedSiftList()
|
|
this.flushedSiftRecording()
|
|
}
|
|
},
|
|
querySaveRecord(queryString, cb){
|
|
let results = this.recordList;
|
|
results = queryString?results.filter((item)=>{
|
|
return item.itemDesc.toUpperCase().match(queryString)
|
|
}):results;
|
|
results = results.map(item=>{
|
|
item.value = item.itemDesc
|
|
return item
|
|
})
|
|
cb(results)
|
|
},
|
|
handleSelect(item){
|
|
this.selectData = JSON.parse(JSON.stringify(item))
|
|
searchUserSettingRecording(item).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
let rows = data.rows
|
|
let list = [...this.siftList]
|
|
rows.forEach((row)=>{
|
|
for (let i = 0; i < list.length; i++) {
|
|
let sift = list[i]
|
|
if (sift.menuId === row.menuId && sift.userId === row.userId && sift.fieldName === row.fieldName){
|
|
sift.symbol = row.symbol
|
|
sift.formula = row.formula
|
|
sift.sortBy = row.sortBy
|
|
break
|
|
}
|
|
}
|
|
})
|
|
this.$store.commit("sift/commitSiftList",list);
|
|
// 处理数据
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
openSaveQueryHeaderDialog(){
|
|
if (!this.querySavedVo.itemDesc){
|
|
this.saveQueryHeader = true
|
|
return
|
|
}
|
|
this.saveQueryHeaderDetail();
|
|
},
|
|
saveQueryHeaderDetail(){
|
|
let param = {...this.selectData}
|
|
// 打开了新增弹框即新增查询记录 否则修改查询记录
|
|
if (this.saveQueryHeader){
|
|
param.menuId = this.$route.meta.menuId
|
|
param.userId = this.$store.state.user.id
|
|
param.dtsName = 'ADOQResult'
|
|
}
|
|
param.querySavedDetailList = JSON.parse(JSON.stringify(this.siftList))
|
|
saveQueryHeaderDetail(param).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.flushedSiftRecording();
|
|
this.saveQueryHeader = false
|
|
this.$message.success(data.msg)
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
searchQuerySavedVo(){
|
|
let params = {...this.querySavedVo}
|
|
params.querySavedDetailList = this.siftList
|
|
this.$store.state.sift.searchFunction(params)
|
|
}
|
|
},
|
|
watch:{
|
|
// 监听路由变化调用筛选查询
|
|
// $route:'flushSift'
|
|
},
|
|
mounted() {
|
|
// this.flushSift()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
/deep/ .el-table .cell{
|
|
height: auto;
|
|
}
|
|
.box-div{
|
|
width: 100%;
|
|
margin-bottom: 5px;
|
|
padding-bottom: 5px;
|
|
//border-bottom: 1px solid #eee;
|
|
}
|
|
.box-div button{
|
|
height: 32px;
|
|
width: 80px;
|
|
background: rgb(22,179,163);
|
|
border: none;
|
|
border-radius: 5px;
|
|
color: #fff;
|
|
cursor: pointer;
|
|
}
|
|
.box-div button:hover{
|
|
background: rgb(97, 217, 204);
|
|
}
|
|
|
|
/deep/ .el-input .el-input-group__prepend{
|
|
background-color: #fff;
|
|
}
|
|
|
|
/deep/ .el-autocomplete .el-input .el-input-group__append{
|
|
background-color: rgb(22,179,163);
|
|
color: #fff;
|
|
border: 1px solid rgb(22,179,163);
|
|
}
|
|
|
|
.el-input-number /deep/ .el-input__inner{
|
|
text-align: right;
|
|
padding-right: 5px !important;
|
|
}
|
|
|
|
/deep/ .el-input-number--medium{
|
|
line-height: 20px;
|
|
}
|
|
</style>
|
|
|