Browse Source

高级筛选高度优化处理

noToken
安虹睿 1 year ago
parent
commit
f8411642d8
  1. 7
      PC/InterFace.Dash/src/components/commonTabel-drawer/index.vue
  2. 642
      PC/InterFace.Dash/src/components/filterForDetailPage/index.vue
  3. 1216
      PC/InterFace.Dash/src/components/searchOverall/index.vue
  4. 4
      PC/InterFace.Dash/src/components/searchOverall/style/index.scss
  5. 15
      PC/InterFace.Dash/src/components/tablePagination/index.vue
  6. 1
      PC/UI.WinIn.FasterZ.Job/src/components/commonTabel-drawer/index.vue
  7. 1
      PC/UI.WinIn.FasterZ.Job/src/components/filterForDetailPage/index.vue
  8. 6
      PC/UI.WinIn.FasterZ.Job/src/components/searchOverall/index.vue
  9. 2
      PC/UI.WinIn.FasterZ.Job/src/components/searchOverall/style/index.scss
  10. 15
      PC/UI.WinIn.FasterZ.Job/src/components/tablePagination/index.vue
  11. 3
      PC/UI.WinIn.FasterZ.Store/src/components/commonTabel-drawer/index.vue
  12. 645
      PC/UI.WinIn.FasterZ.Store/src/components/filterForDetailPage/index.vue
  13. 1216
      PC/UI.WinIn.FasterZ.Store/src/components/searchOverall/index.vue
  14. 4
      PC/UI.WinIn.FasterZ.Store/src/components/searchOverall/style/index.scss
  15. 15
      PC/UI.WinIn.FasterZ.Store/src/components/tablePagination/index.vue

7
PC/InterFace.Dash/src/components/commonTabel-drawer/index.vue

@ -69,6 +69,7 @@
@rowDrop="rowDrop"
:searchOverallCoverHeight="'calc(100vh - 345px)'"
:rowSource="'detail_api'"
:selectMaxHeight="'116px'"
:rowMaxHeight="rowMaxHeight"
:totalCount="totalCountForDetail"
:MaxResultCount="MaxResultCount"
@ -164,6 +165,7 @@ import searchOverall from "@/components/searchOverall"
import currenButton from "@/components/currenButton"
import currenDescriptions from "@/components/currenDescriptions"
import currenTabs from "@/components/currenTabs"
import currenTable from "@/components/currenTable"
import pagination from "@/components/Pagination"
import rowDrop from "@/components/rowDrop/index.vue"
import * as allUrlOption from '@/utils/baseData/urlOption'
@ -175,6 +177,7 @@ export default {
currenButton,
currenDescriptions,
currenTabs,
currenTable,
searchOverall,
rowDrop
},
@ -380,8 +383,8 @@ export default {
methods: {
// -
getDetailList(data,successFn,errorFn){
//
if(data)this.PageListParams.condition.filters = []
//
let _hasId = false
this.PageListParams.condition.filters.forEach(item=>{
if(item.column == this.URLOption_masterId){
@ -577,7 +580,7 @@ export default {
this.zdyTableColumns = []
this.otherData = []
// this.firstTabs = val.name
// tab
// tab
// if (item.functionName == 'getListByItemcode') {
// let params = {
// itemCode: this.propsData.code

642
PC/InterFace.Dash/src/components/filterForDetailPage/index.vue

@ -1,332 +1,338 @@
<template>
<div class="filterForDetailPage" v-if="dialogShow">
<el-dialog
title="明细查询"
:visible.sync="dialogShow"
top="5vh"
width="96%"
:modal-append-to-body="false"
:append-to-body="false"
:show-close="true"
@close="closeDialog(false)"
class="mainTable-dialog"
>
<div
class="filterForDetailPage-list"
v-loading="Loading.tableLoading"
<div class="filterForDetailPage" v-if="dialogShow">
<el-dialog
title="明细查询"
:visible.sync="dialogShow"
top="5vh"
width="96%"
:modal-append-to-body="false"
:append-to-body="false"
:show-close="true"
@close="closeDialog(false)"
class="mainTable-dialog"
>
<!-- 列表 -->
<tablePagination
v-if="dialogShow && listColumns && listColumns.length > 0"
:currenButtonData="currenButtonData"
:tableData="tableData"
:tableLoading="Loading.tableLoading"
@rowDrop="rowDropForDetail"
:rowSource="'detailPage_api'"
:searchOverallCoverHeight="'calc(100vh - 380px)'"
:rowMaxHeight="rowMaxHeight"
:tableColumns="listColumns"
:totalCount="totalCount"
:multipleSelection="multipleSelection"
:MaxResultCount="PageListParams.MaxResultCount"
:setUTableHeight="setUTableHeight"
@topbutton="topbutton"
@inlineDialog="inlineDialog"
@sortChange="sortChange"
@alertoldSkipCount="alertoldSkipCount"
@alterResultCount="alterResultCount"
@handleSelectionChange="handleSelectionChange"
:currentPageProps="oldSkipCount"
:quicklySearchOption="quicklySearchOption"
@quicklySearchClick="quicklySearchClick"
@quicklySearchClear="quicklySearchClear"
:primarySearchOption="primarySearchOption"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
<div
class="filterForDetailPage-list"
v-loading="Loading.tableLoading"
>
<template>
<!-- todo:width处理 -->
<el-table-column
v-if="operaButtons && operaButtons.length > 0"
label="操作"
:align="'center'"
width="150"
fixed="left"
>
<template slot-scope="scope">
<span v-for="item in operaButtons" style="margin: 0 10px;">
<!-- 查看主表信息 -->
<el-button
v-if="item == 'showParent'"
type="text"
@click="showParentHandleForDetail(scope.row)"
>查看主表信息</el-button>
<!-- 编辑 -->
<el-button
v-if="item == 'edit'"
type="text"
style="color: #ff9000;"
@click="editHandleForDetail(scope.row)"
>编辑</el-button>
<!-- 删除 -->
<el-popover
v-if="item == 'delete'"
placement="left"
width="260"
v-model="scope.row.deleteTipVisible"
>
<p>此操作将永久删除该消息, 是否继续?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button>
</div>
<el-button type="text" slot="reference" style="color: red;">删除</el-button>
</el-popover>
</span>
</template>
</el-table-column>
</template>
</tablePagination>
</div>
</el-dialog>
<!-- 主表信息 -->
<el-dialog
:modal-append-to-body="false"
:append-to-body="false"
:title="showParentTitle"
:visible.sync="showParentDialog"
:close-on-click-modal="true"
:close-on-press-escape="true"
:show-close="true"
width="70%"
>
<div v-loading="showParentLoading">
<curren-descriptions
v-if="showParentTableData"
border
:column="column"
:direction="direction"
:colon="false"
:tabsDesTions="parentColumns"
:propsData="showParentTableData"
style="padding-bottom: 20px;"
></curren-descriptions>
</div>
<!-- <el-table :data="showParentTableData">
<el-table-column property="date" label="日期" width="150"></el-table-column>
<el-table-column property="name" label="姓名" width="200"></el-table-column>
<el-table-column property="address" label="地址"></el-table-column>
</el-table> -->
</el-dialog>
</div>
</template>
<script>
import currenDescriptions from "@/components/currenDescriptions"
import { tableMixins } from "@/mixins/TableMixins";
import { TableHeaderMixins } from "@/mixins/TableHeaderMixins";
import { LoadingMixins } from "@/mixins/LoadingMixins";
import { mixins } from "@/mixins/mixins";
import { filterSelectMixins } from '@/mixins/filter-Select'
import {getListDesById,getPageListForDetail} from "@/api/wms-api"
export default {
name: 'filterForDetailPage',
mixins: [
tableMixins,
TableHeaderMixins,
mixins,
filterSelectMixins,
LoadingMixins
],
components:{
currenDescriptions
},
props: {
// app-main100%
setUTableHeight: {
type: Number,
default: 340
},
//
isShowIndex:{
type: Boolean,
default: false
},
//
tableSelection: {
type: Boolean,
default: false
},
cellStyle: {
type: Function,
default: () => {
return Function;
}
},
//
showOverflowTooltip:{
type: Boolean,
default: false,
<!-- 列表 -->
<tablePagination
v-if="dialogShow && listColumns && listColumns.length > 0"
:currenButtonData="currenButtonData"
:tableData="tableData"
:tableLoading="Loading.tableLoading"
@rowDrop="rowDropForDetail"
:rowSource="'detailPage_api'"
:searchOverallCoverHeight="'calc(100vh - 380px)'"
:rowMaxHeight="rowMaxHeight"
:tableColumns="listColumns"
:totalCount="totalCount"
:multipleSelection="multipleSelection"
:MaxResultCount="PageListParams.MaxResultCount"
:setUTableHeight="setUTableHeight"
:selectMaxHeight="'116px'"
@topbutton="topbutton"
@inlineDialog="inlineDialog"
@sortChange="sortChange"
@alertoldSkipCount="alertoldSkipCount"
@alterResultCount="alterResultCount"
@handleSelectionChange="handleSelectionChange"
:currentPageProps="oldSkipCount"
:quicklySearchOption="quicklySearchOption"
@quicklySearchClick="quicklySearchClick"
@quicklySearchClear="quicklySearchClear"
:primarySearchOption="primarySearchOption"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
>
<template>
<!-- todo:width处理 -->
<el-table-column
v-if="operaButtons && operaButtons.length > 0"
label="操作"
:align="'center'"
width="150"
fixed="left"
>
<template slot-scope="scope">
<span v-for="item in operaButtons" style="margin: 0 10px;">
<!-- 查看主表信息 -->
<el-button
v-if="item == 'showParent'"
type="text"
@click="showParentHandleForDetail(scope.row)"
>查看主表信息</el-button>
<!-- 编辑 -->
<el-button
v-if="item == 'edit'"
type="text"
style="color: #ff9000;"
@click="editHandleForDetail(scope.row)"
>编辑</el-button>
<!-- 删除 -->
<el-popover
v-if="item == 'delete'"
placement="left"
width="260"
v-model="scope.row.deleteTipVisible"
>
<p>此操作将永久删除该消息, 是否继续?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button>
</div>
<el-button type="text" slot="reference" style="color: red;">删除</el-button>
</el-popover>
</span>
</template>
</el-table-column>
</template>
</tablePagination>
</div>
</el-dialog>
<!-- 主表信息 -->
<el-dialog
:modal-append-to-body="false"
:append-to-body="false"
:title="showParentTitle"
:visible.sync="showParentDialog"
:close-on-click-modal="true"
:close-on-press-escape="true"
:show-close="true"
width="70%"
>
<div v-loading="showParentLoading">
<curren-descriptions
v-if="showParentTableData"
border
:column="column"
:direction="direction"
:colon="false"
:tabsDesTions="parentColumns"
:propsData="showParentTableData"
style="padding-bottom: 20px;"
></curren-descriptions>
</div>
<!-- <el-table :data="showParentTableData">
<el-table-column property="date" label="日期" width="150"></el-table-column>
<el-table-column property="name" label="姓名" width="200"></el-table-column>
<el-table-column property="address" label="地址"></el-table-column>
</el-table> -->
</el-dialog>
</div>
</template>
<script>
import currenDescriptions from "@/components/currenDescriptions"
import { tableMixins } from "@/mixins/TableMixins";
import { TableHeaderMixins } from "@/mixins/TableHeaderMixins";
import { LoadingMixins } from "@/mixins/LoadingMixins";
import { mixins } from "@/mixins/mixins";
import { filterSelectMixins } from '@/mixins/filter-Select'
import {getListDesById,getPageListForDetail} from "@/api/wms-api"
export default {
name: 'filterForDetailPage',
mixins: [
tableMixins,
TableHeaderMixins,
mixins,
filterSelectMixins,
LoadingMixins
],
components:{
currenDescriptions
},
// api
DeleteApi: {
props: {
// app-main100%
setUTableHeight: {
type: Number,
default: 340
},
//
isShowIndex:{
type: Boolean,
default: false
},
//
tableSelection: {
type: Boolean,
default: false
},
cellStyle: {
type: Function,
default: () => {
return Function;
}
},
//
showOverflowTooltip:{
type: Boolean,
default: false,
},
// api
DeleteApi: {
type: String,
default: null
},
// -
parentColumns:{
type: Array,
default: null
},
showHandleButtons:{
type:Array,
default:() => {
//'add','edit' 'delete'
// showParentfreshfilterfield
return ['showParent','fresh','filter','field'];
}
},
// 2
column: {
type: Number,
default: 2
},
//
direction: {
type: String,
default: null
},
// -
parentColumns:{
type: Array,
default: null
default: 'horizontal'
},
rowMaxHeight:{
type:String,
default:'calc(90vh - 450px)'
},
},
showHandleButtons:{
type:Array,
default:() => {
//'add','edit' 'delete'
// showParentfreshfilterfield
return ['showParent','fresh','filter','field'];
data () {
return {
dialogShow:true,
// URLOption_detailList:allUrlOption[this.$route.name].detailListURL,//-
// URLOption_masterId:allUrlOption[this.$route.name].masterId || 'masterId',//-id
// URLOption_masterName:allUrlOption[this.$route.name].masterName,//-//-title
// URLOption_parent:allUrlOption[this.$route.name].parentURL ? allUrlOption[this.$route.name].parentURL : allUrlOption[this.$route.name].detailURL,//-
currenButtonData: [],//
operaButtons:[],//
showParentDialog:false,//
showParentTitle:null,//-title
showParentTableData:null,//-
showParentLoading:false,//-
listColumns:[],//
}
},
// 2
column: {
type: Number,
default: 2
},
//
direction: {
type: String,
default: 'horizontal'
},
rowMaxHeight:{
type:String,
default:'calc(90vh - 450px)'
},
},
data () {
return {
dialogShow:true,
currenButtonData: [],//
operaButtons:[],//
showParentDialog:false,//
showParentTitle:null,//-title
showParentTableData:null,//-
showParentLoading:false,//-
listColumns:[],//
}
},
activated(){
//
this.dialogShow = false
this.$nextTick(() => {
this.dialogShow = true
});
},
mounted(){
this.paging()
this.initHandleButtons()
},
methods: {
rowDropForDetail(data,type){
this.listColumns = data
this.$emit("rowDropForDetail", data,type)
},
//
initHandleButtons(){
//
let _arr_header = []
if(this.showHandleButtons.indexOf('add') >= 0){_arr_header.push(this.defaultAddBtn())}
if(this.showHandleButtons.indexOf('field') >= 0){_arr_header.push(this.defaultFieldSettingBtn())}
if(this.showHandleButtons.indexOf('fresh') >= 0){_arr_header.push(this.defaultFreshBtn())}
if(this.showHandleButtons.indexOf('filter') >= 0){_arr_header.push(this.defaultFilterBtn())}
this.currenButtonData = _arr_header
//
let _arr_op = []
if(this.showHandleButtons.indexOf('edit') >= 0){_arr_op.push('edit')}
if(this.showHandleButtons.indexOf('delete') >= 0){_arr_op.push('delete')}
if(this.showHandleButtons.indexOf('showParent') >= 0){_arr_op.push('showParent')}
this.operaButtons = _arr_op
},
//
closeDialog(data){
activated(){
//
this.dialogShow = false
this.$emit("closeDialog", data)
},
//
paging(callback){
this.Loading.tableLoading = true;
this.PageListParams.SkipCount = (this.oldSkipCount - 1) * this.PageListParams.MaxResultCount
getPageListForDetail(this.PageListParams,this.URLOption_detailList)
.then(res=>{
//
let _parentName = this.URLOption_detailList.substr(0,this.URLOption_detailList.indexOf('/'))
let _Columns = this.initApiColumnsForDto(res.items[0],_parentName)
this.listColumns = this.initTableColumns(_Columns,'detailPage_api')
//
if(res){
this.Loading.tableLoading = false
this.tableData = []
res.items.forEach(item=>{
item.deleteTipVisible = false
this.tableData.push(item)
})
this.totalCount = res.totalCount
}
this.pagingCallback(callback)
})
.catch(err=>{
this.Loading.tableLoading = false
this.$message.error("数据获取失败")
})
},
//
showParentHandleForDetail(data){
this.showParentTitle = `${data[this.URLOption_masterName] || ''} 主表信息`
this.showParentDialog = true
this.showParentLoading = true
getListDesById(this.URLOption_parent,data[this.URLOption_masterId])
.then(res => {
this.showParentTableData = res
this.showParentLoading = false
})
.catch(err => {
this.showParentLoading = false
this.$message.error("主表信息获取失败!")
})
},
//
editHandleForDetail(data){
console.log(data)
this.$nextTick(() => {
this.dialogShow = true
});
},
//
deleteHandleForDetail(data){
this.Loading.appMainLoading = true
data.deleteTipVisible = false
// interfaceApi[this.DeleteApi](data.id).then(res => {
// this.$successMsg('!')
// this.oldSkipCount = 1
// this.Loading.appMainLoading = false
// this.paging()
// }).catch(err => {
// this.Loading.appMainLoading = false
// this.$message.error("!")
// })
mounted(){
this.paging()
this.initHandleButtons()
},
}
}
</script>
<style lang="scss">
.filterForDetailPage {
.mainTable-dialog{
.el-dialog{
height: calc(100% - 100px);
methods: {
rowDropForDetail(data,type){
this.listColumns = data
this.$emit("rowDropForDetail", data,type)
},
//
initHandleButtons(){
//
let _arr_header = []
if(this.showHandleButtons.indexOf('add') >= 0){_arr_header.push(this.defaultAddBtn())}
if(this.showHandleButtons.indexOf('field') >= 0){_arr_header.push(this.defaultFieldSettingBtn())}
if(this.showHandleButtons.indexOf('fresh') >= 0){_arr_header.push(this.defaultFreshBtn())}
if(this.showHandleButtons.indexOf('filter') >= 0){_arr_header.push(this.defaultFilterBtn())}
this.currenButtonData = _arr_header
//
let _arr_op = []
if(this.showHandleButtons.indexOf('edit') >= 0){_arr_op.push('edit')}
if(this.showHandleButtons.indexOf('delete') >= 0){_arr_op.push('delete')}
if(this.showHandleButtons.indexOf('showParent') >= 0){_arr_op.push('showParent')}
this.operaButtons = _arr_op
},
//
closeDialog(data){
this.dialogShow = false
this.$emit("closeDialog", data)
},
//
paging(callback){
this.Loading.tableLoading = true;
this.PageListParams.SkipCount = (this.oldSkipCount - 1) * this.PageListParams.MaxResultCount
getPageListForDetail(this.PageListParams,this.URLOption_detailList)
.then(res=>{
//
let _parentName = this.URLOption_detailList.substr(0,this.URLOption_detailList.indexOf('/'))
let _Columns = this.initApiColumnsForDto(res.items[0],_parentName)
this.listColumns = this.initTableColumns(_Columns,'detailPage_api')
//
if(res){
this.Loading.tableLoading = false
this.tableData = []
res.items.forEach(item=>{
item.deleteTipVisible = false
this.tableData.push(item)
})
this.totalCount = res.totalCount
}
this.pagingCallback(callback)
})
.catch(err=>{
this.Loading.tableLoading = false
this.$message.error("数据获取失败")
})
},
//
showParentHandleForDetail(data){
this.showParentTitle = `${data[this.URLOption_masterName] || ''} 主表信息`
this.showParentDialog = true
this.showParentLoading = true
getListDesById(this.URLOption_parent,data[this.URLOption_masterId])
.then(res => {
this.showParentTableData = res
this.showParentLoading = false
})
.catch(err => {
this.showParentLoading = false
this.$message.error("主表信息获取失败!")
})
},
//
editHandleForDetail(data){
console.log(data)
},
//
deleteHandleForDetail(data){
this.Loading.appMainLoading = true
data.deleteTipVisible = false
// interfaceApi[this.DeleteApi](data.id).then(res => {
// this.$successMsg('!')
// this.oldSkipCount = 1
// this.Loading.appMainLoading = false
// this.paging()
// }).catch(err => {
// this.Loading.appMainLoading = false
// this.$message.error("!")
// })
},
}
}
.el-dialog__body{
min-height: 200px;
padding-bottom: 20px !important;
</script>
<style lang="scss">
.filterForDetailPage {
.mainTable-dialog{
.el-dialog{
height: calc(100% - 100px);
}
}
.el-dialog__body{
min-height: 200px;
padding-bottom: 20px !important;
}
}
.filterForDetailPage-list{
height: calc(100%);
overflow: auto;
}
}
.filterForDetailPage-list{
height: calc(100%);
overflow: auto;
}
</style>
</style>

1216
PC/InterFace.Dash/src/components/searchOverall/index.vue

File diff suppressed because it is too large

4
PC/InterFace.Dash/src/components/searchOverall/style/index.scss

@ -1,4 +1,4 @@
.searchOverallComponent{
.searchOverallComponent{
height: 0;
transition:all 0.5s;
z-index: 1;
@ -31,7 +31,7 @@
// flex-direction: column;
// width: 100%;
// height: 100%;
max-height: 170px;
max-height: var(--navFilterMaxHeight);
overflow: auto;
.el-form {

15
PC/InterFace.Dash/src/components/tablePagination/index.vue

@ -25,6 +25,7 @@
:tableColumns="tableColumns"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
:selectMaxHeight="selectMaxHeight"
>
<!-- 插槽预留 -->
<slot name="searchPrimarySlot"></slot>
@ -48,7 +49,7 @@
:tableColumns="tableColumns | isTableColumns"
:isShowIndex="isShowIndex"
:selectionTable="tableSelection"
:setUTableHeight="setUTableHeight || uTableTopHeight"
:setUTableHeight="uTableTopHeight"
@sortChange="sortChange"
@handleSelectionChange="handleSelectionChange"
@inlineDialog="inlineDialog"
@ -95,6 +96,11 @@ export default {
type:String,
default:'calc(90vh - 280px)'
},
//
selectMaxHeight:{
type: String,
default: '174px'
},
//
searchOverallCoverHeight:{
type: String,
@ -226,6 +232,7 @@ export default {
rowDropVisible: false,
// table key
isUpdate: false,
appRemoveHeight:165,
// table
uTableTopHeight:165,
// table
@ -265,6 +272,8 @@ export default {
}
},
mounted(){
this.appRemoveHeight = this.setUTableHeight || 165
this.uTableTopHeight = this.appRemoveHeight
this.uTableOuterHeight = this.$refs.tablePaginationTableRef.getTableHeight()
this.uTableOuterHeight_init = Number(JSON.stringify(this.uTableOuterHeight))
@ -328,12 +337,12 @@ export default {
let _margin = 20
this.uTableOuterHeight = this.uTableOuterHeight_init - minusHeight - _margin
setTimeout(()=>{
this.uTableTopHeight = minusHeight + 165 + _margin
this.uTableTopHeight = minusHeight + this.appRemoveHeight + _margin
},0)
}else{
this.uTableOuterHeight = this.uTableOuterHeight_init
setTimeout(()=>{
this.uTableTopHeight = 165
this.uTableTopHeight = this.appRemoveHeight
},0)
}
},

1
PC/UI.WinIn.FasterZ.Job/src/components/commonTabel-drawer/index.vue

@ -69,6 +69,7 @@
@rowDrop="rowDrop"
:searchOverallCoverHeight="'calc(100vh - 345px)'"
:rowSource="'detail_api'"
:selectMaxHeight="'116px'"
:rowMaxHeight="rowMaxHeight"
:totalCount="totalCountForDetail"
:MaxResultCount="MaxResultCount"

1
PC/UI.WinIn.FasterZ.Job/src/components/filterForDetailPage/index.vue

@ -30,6 +30,7 @@
:multipleSelection="multipleSelection"
:MaxResultCount="PageListParams.MaxResultCount"
:setUTableHeight="setUTableHeight"
:selectMaxHeight="'116px'"
@topbutton="topbutton"
@inlineDialog="inlineDialog"
@sortChange="sortChange"

6
PC/UI.WinIn.FasterZ.Job/src/components/searchOverall/index.vue

@ -32,6 +32,7 @@
<!-- 高级筛选界面 -->
<div v-if="isShow && isShowMoreList" class="moreListOuter">
<curren-Form
:style="`--navFilterMaxHeight: ${selectMaxHeight};`"
class="navFilter"
size="medium"
labelWidth="0"
@ -259,6 +260,11 @@ export default {
}
},
props: {
//
selectMaxHeight:{
type: String,
default: '174px'
},
//
searchOverallCoverHeight:{
type: String,

2
PC/UI.WinIn.FasterZ.Job/src/components/searchOverall/style/index.scss

@ -31,7 +31,7 @@
// flex-direction: column;
// width: 100%;
// height: 100%;
max-height: 170px;
max-height: var(--navFilterMaxHeight);
overflow: auto;
.el-form {

15
PC/UI.WinIn.FasterZ.Job/src/components/tablePagination/index.vue

@ -25,6 +25,7 @@
:tableColumns="tableColumns"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
:selectMaxHeight="selectMaxHeight"
>
<!-- 插槽预留 -->
<slot name="searchPrimarySlot"></slot>
@ -48,7 +49,7 @@
:tableColumns="tableColumns | isTableColumns"
:isShowIndex="isShowIndex"
:selectionTable="tableSelection"
:setUTableHeight="setUTableHeight || uTableTopHeight"
:setUTableHeight="uTableTopHeight"
@sortChange="sortChange"
@handleSelectionChange="handleSelectionChange"
@inlineDialog="inlineDialog"
@ -95,6 +96,11 @@ export default {
type:String,
default:'calc(90vh - 280px)'
},
//
selectMaxHeight:{
type: String,
default: '174px'
},
//
searchOverallCoverHeight:{
type: String,
@ -226,6 +232,7 @@ export default {
rowDropVisible: false,
// table key
isUpdate: false,
appRemoveHeight:165,
// table
uTableTopHeight:165,
// table
@ -265,6 +272,8 @@ export default {
}
},
mounted(){
this.appRemoveHeight = this.setUTableHeight || 165
this.uTableTopHeight = this.appRemoveHeight
this.uTableOuterHeight = this.$refs.tablePaginationTableRef.getTableHeight()
this.uTableOuterHeight_init = Number(JSON.stringify(this.uTableOuterHeight))
@ -328,12 +337,12 @@ export default {
let _margin = 20
this.uTableOuterHeight = this.uTableOuterHeight_init - minusHeight - _margin
setTimeout(()=>{
this.uTableTopHeight = minusHeight + 165 + _margin
this.uTableTopHeight = minusHeight + this.appRemoveHeight + _margin
},0)
}else{
this.uTableOuterHeight = this.uTableOuterHeight_init
setTimeout(()=>{
this.uTableTopHeight = 165
this.uTableTopHeight = this.appRemoveHeight
},0)
}
},

3
PC/UI.WinIn.FasterZ.Store/src/components/commonTabel-drawer/index.vue

@ -69,6 +69,7 @@
@rowDrop="rowDrop"
:searchOverallCoverHeight="'calc(100vh - 345px)'"
:rowSource="'detail_api'"
:selectMaxHeight="'116px'"
:rowMaxHeight="rowMaxHeight"
:totalCount="totalCountForDetail"
:MaxResultCount="MaxResultCount"
@ -579,7 +580,7 @@ export default {
this.zdyTableColumns = []
this.otherData = []
// this.firstTabs = val.name
// tab
// tab
// if (item.functionName == 'getListByItemcode') {
// let params = {
// itemCode: this.propsData.code

645
PC/UI.WinIn.FasterZ.Store/src/components/filterForDetailPage/index.vue

@ -1,337 +1,338 @@
<template>
<div class="filterForDetailPage" v-if="dialogShow">
<el-dialog
title="明细查询"
:visible.sync="dialogShow"
top="5vh"
width="96%"
:modal-append-to-body="false"
:append-to-body="false"
:show-close="true"
@close="closeDialog(false)"
class="mainTable-dialog"
>
<div
class="filterForDetailPage-list"
v-loading="Loading.tableLoading"
<div class="filterForDetailPage" v-if="dialogShow">
<el-dialog
title="明细查询"
:visible.sync="dialogShow"
top="5vh"
width="96%"
:modal-append-to-body="false"
:append-to-body="false"
:show-close="true"
@close="closeDialog(false)"
class="mainTable-dialog"
>
<!-- 列表 -->
<tablePagination
v-if="dialogShow && listColumns && listColumns.length > 0"
:currenButtonData="currenButtonData"
:tableData="tableData"
:tableLoading="Loading.tableLoading"
@rowDrop="rowDropForDetail"
:rowSource="'detailPage_api'"
:searchOverallCoverHeight="'calc(100vh - 380px)'"
:rowMaxHeight="rowMaxHeight"
:tableColumns="listColumns"
:totalCount="totalCount"
:multipleSelection="multipleSelection"
:MaxResultCount="PageListParams.MaxResultCount"
:setUTableHeight="setUTableHeight"
@topbutton="topbutton"
@inlineDialog="inlineDialog"
@sortChange="sortChange"
@alertoldSkipCount="alertoldSkipCount"
@alterResultCount="alterResultCount"
@handleSelectionChange="handleSelectionChange"
:currentPageProps="oldSkipCount"
:quicklySearchOption="quicklySearchOption"
@quicklySearchClick="quicklySearchClick"
@quicklySearchClear="quicklySearchClear"
:primarySearchOption="primarySearchOption"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
<div
class="filterForDetailPage-list"
v-loading="Loading.tableLoading"
>
<template>
<!-- todo:width处理 -->
<el-table-column
v-if="operaButtons && operaButtons.length > 0"
label="操作"
:align="'center'"
width="150"
fixed="left"
>
<template slot-scope="scope">
<span v-for="item in operaButtons" style="margin: 0 10px;">
<!-- 查看主表信息 -->
<el-button
v-if="item == 'showParent'"
type="text"
@click="showParentHandleForDetail(scope.row)"
>查看主表信息</el-button>
<!-- 编辑 -->
<el-button
v-if="item == 'edit'"
type="text"
style="color: #ff9000;"
@click="editHandleForDetail(scope.row)"
>编辑</el-button>
<!-- 删除 -->
<el-popover
v-if="item == 'delete'"
placement="left"
width="260"
v-model="scope.row.deleteTipVisible"
>
<p>此操作将永久删除该消息, 是否继续?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button>
</div>
<el-button type="text" slot="reference" style="color: red;">删除</el-button>
</el-popover>
</span>
</template>
</el-table-column>
</template>
</tablePagination>
</div>
</el-dialog>
<!-- 主表信息 -->
<el-dialog
:modal-append-to-body="false"
:append-to-body="false"
:title="showParentTitle"
:visible.sync="showParentDialog"
:close-on-click-modal="true"
:close-on-press-escape="true"
:show-close="true"
width="70%"
>
<div v-loading="showParentLoading">
<curren-descriptions
v-if="showParentTableData"
border
:column="column"
:direction="direction"
:colon="false"
:tabsDesTions="parentColumns"
:propsData="showParentTableData"
style="padding-bottom: 20px;"
></curren-descriptions>
</div>
<!-- <el-table :data="showParentTableData">
<el-table-column property="date" label="日期" width="150"></el-table-column>
<el-table-column property="name" label="姓名" width="200"></el-table-column>
<el-table-column property="address" label="地址"></el-table-column>
</el-table> -->
</el-dialog>
</div>
</template>
<script>
import currenDescriptions from "@/components/currenDescriptions"
import { tableMixins } from "@/mixins/TableMixins";
import { TableHeaderMixins } from "@/mixins/TableHeaderMixins";
import { LoadingMixins } from "@/mixins/LoadingMixins";
import { mixins } from "@/mixins/mixins";
import { filterSelectMixins } from '@/mixins/filter-Select'
import {getListDesById,getPageListForDetail} from "@/api/wms-api"
export default {
name: 'filterForDetailPage',
mixins: [
tableMixins,
TableHeaderMixins,
mixins,
filterSelectMixins,
LoadingMixins
],
components:{
currenDescriptions
},
props: {
// app-main100%
setUTableHeight: {
type: Number,
default: 340
},
//
isShowIndex:{
type: Boolean,
default: false
},
//
tableSelection: {
type: Boolean,
default: false
},
cellStyle: {
type: Function,
default: () => {
return Function;
}
},
//
showOverflowTooltip:{
type: Boolean,
default: false,
<!-- 列表 -->
<tablePagination
v-if="dialogShow && listColumns && listColumns.length > 0"
:currenButtonData="currenButtonData"
:tableData="tableData"
:tableLoading="Loading.tableLoading"
@rowDrop="rowDropForDetail"
:rowSource="'detailPage_api'"
:searchOverallCoverHeight="'calc(100vh - 380px)'"
:rowMaxHeight="rowMaxHeight"
:tableColumns="listColumns"
:totalCount="totalCount"
:multipleSelection="multipleSelection"
:MaxResultCount="PageListParams.MaxResultCount"
:setUTableHeight="setUTableHeight"
:selectMaxHeight="'116px'"
@topbutton="topbutton"
@inlineDialog="inlineDialog"
@sortChange="sortChange"
@alertoldSkipCount="alertoldSkipCount"
@alterResultCount="alterResultCount"
@handleSelectionChange="handleSelectionChange"
:currentPageProps="oldSkipCount"
:quicklySearchOption="quicklySearchOption"
@quicklySearchClick="quicklySearchClick"
@quicklySearchClear="quicklySearchClear"
:primarySearchOption="primarySearchOption"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
>
<template>
<!-- todo:width处理 -->
<el-table-column
v-if="operaButtons && operaButtons.length > 0"
label="操作"
:align="'center'"
width="150"
fixed="left"
>
<template slot-scope="scope">
<span v-for="item in operaButtons" style="margin: 0 10px;">
<!-- 查看主表信息 -->
<el-button
v-if="item == 'showParent'"
type="text"
@click="showParentHandleForDetail(scope.row)"
>查看主表信息</el-button>
<!-- 编辑 -->
<el-button
v-if="item == 'edit'"
type="text"
style="color: #ff9000;"
@click="editHandleForDetail(scope.row)"
>编辑</el-button>
<!-- 删除 -->
<el-popover
v-if="item == 'delete'"
placement="left"
width="260"
v-model="scope.row.deleteTipVisible"
>
<p>此操作将永久删除该消息, 是否继续?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button>
<el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button>
</div>
<el-button type="text" slot="reference" style="color: red;">删除</el-button>
</el-popover>
</span>
</template>
</el-table-column>
</template>
</tablePagination>
</div>
</el-dialog>
<!-- 主表信息 -->
<el-dialog
:modal-append-to-body="false"
:append-to-body="false"
:title="showParentTitle"
:visible.sync="showParentDialog"
:close-on-click-modal="true"
:close-on-press-escape="true"
:show-close="true"
width="70%"
>
<div v-loading="showParentLoading">
<curren-descriptions
v-if="showParentTableData"
border
:column="column"
:direction="direction"
:colon="false"
:tabsDesTions="parentColumns"
:propsData="showParentTableData"
style="padding-bottom: 20px;"
></curren-descriptions>
</div>
<!-- <el-table :data="showParentTableData">
<el-table-column property="date" label="日期" width="150"></el-table-column>
<el-table-column property="name" label="姓名" width="200"></el-table-column>
<el-table-column property="address" label="地址"></el-table-column>
</el-table> -->
</el-dialog>
</div>
</template>
<script>
import currenDescriptions from "@/components/currenDescriptions"
import { tableMixins } from "@/mixins/TableMixins";
import { TableHeaderMixins } from "@/mixins/TableHeaderMixins";
import { LoadingMixins } from "@/mixins/LoadingMixins";
import { mixins } from "@/mixins/mixins";
import { filterSelectMixins } from '@/mixins/filter-Select'
import {getListDesById,getPageListForDetail} from "@/api/wms-api"
export default {
name: 'filterForDetailPage',
mixins: [
tableMixins,
TableHeaderMixins,
mixins,
filterSelectMixins,
LoadingMixins
],
components:{
currenDescriptions
},
// api
DeleteApi: {
props: {
// app-main100%
setUTableHeight: {
type: Number,
default: 340
},
//
isShowIndex:{
type: Boolean,
default: false
},
//
tableSelection: {
type: Boolean,
default: false
},
cellStyle: {
type: Function,
default: () => {
return Function;
}
},
//
showOverflowTooltip:{
type: Boolean,
default: false,
},
// api
DeleteApi: {
type: String,
default: null
},
// -
parentColumns:{
type: Array,
default: null
},
showHandleButtons:{
type:Array,
default:() => {
//'add','edit' 'delete'
// showParentfreshfilterfield
return ['showParent','fresh','filter','field'];
}
},
// 2
column: {
type: Number,
default: 2
},
//
direction: {
type: String,
default: null
},
// -
parentColumns:{
type: Array,
default: null
default: 'horizontal'
},
rowMaxHeight:{
type:String,
default:'calc(90vh - 450px)'
},
},
showHandleButtons:{
type:Array,
default:() => {
//'add','edit' 'delete'
// showParentfreshfilterfield
return ['showParent','fresh','filter','field'];
data () {
return {
dialogShow:true,
// URLOption_detailList:allUrlOption[this.$route.name].detailListURL,//-
// URLOption_masterId:allUrlOption[this.$route.name].masterId || 'masterId',//-id
// URLOption_masterName:allUrlOption[this.$route.name].masterName,//-//-title
// URLOption_parent:allUrlOption[this.$route.name].parentURL ? allUrlOption[this.$route.name].parentURL : allUrlOption[this.$route.name].detailURL,//-
currenButtonData: [],//
operaButtons:[],//
showParentDialog:false,//
showParentTitle:null,//-title
showParentTableData:null,//-
showParentLoading:false,//-
listColumns:[],//
}
},
// 2
column: {
type: Number,
default: 2
},
//
direction: {
type: String,
default: 'horizontal'
},
rowMaxHeight:{
type:String,
default:'calc(90vh - 450px)'
},
},
data () {
return {
dialogShow:true,
// URLOption_detailList:allUrlOption[this.$route.name].detailListURL,//-
// URLOption_masterId:allUrlOption[this.$route.name].masterId || 'masterId',//-id
// URLOption_masterName:allUrlOption[this.$route.name].masterName,//-//-title
// URLOption_parent:allUrlOption[this.$route.name].parentURL ? allUrlOption[this.$route.name].parentURL : allUrlOption[this.$route.name].detailURL,//-
currenButtonData: [],//
operaButtons:[],//
showParentDialog:false,//
showParentTitle:null,//-title
showParentTableData:null,//-
showParentLoading:false,//-
listColumns:[],//
}
},
activated(){
//
this.dialogShow = false
this.$nextTick(() => {
this.dialogShow = true
});
},
mounted(){
this.paging()
this.initHandleButtons()
},
methods: {
rowDropForDetail(data,type){
this.listColumns = data
this.$emit("rowDropForDetail", data,type)
},
//
initHandleButtons(){
//
let _arr_header = []
if(this.showHandleButtons.indexOf('add') >= 0){_arr_header.push(this.defaultAddBtn())}
if(this.showHandleButtons.indexOf('field') >= 0){_arr_header.push(this.defaultFieldSettingBtn())}
if(this.showHandleButtons.indexOf('fresh') >= 0){_arr_header.push(this.defaultFreshBtn())}
if(this.showHandleButtons.indexOf('filter') >= 0){_arr_header.push(this.defaultFilterBtn())}
this.currenButtonData = _arr_header
//
let _arr_op = []
if(this.showHandleButtons.indexOf('edit') >= 0){_arr_op.push('edit')}
if(this.showHandleButtons.indexOf('delete') >= 0){_arr_op.push('delete')}
if(this.showHandleButtons.indexOf('showParent') >= 0){_arr_op.push('showParent')}
this.operaButtons = _arr_op
},
//
closeDialog(data){
activated(){
//
this.dialogShow = false
this.$emit("closeDialog", data)
},
//
paging(callback){
this.Loading.tableLoading = true;
this.PageListParams.SkipCount = (this.oldSkipCount - 1) * this.PageListParams.MaxResultCount
getPageListForDetail(this.PageListParams,this.URLOption_detailList)
.then(res=>{
//
let _parentName = this.URLOption_detailList.substr(0,this.URLOption_detailList.indexOf('/'))
let _Columns = this.initApiColumnsForDto(res.items[0],_parentName)
this.listColumns = this.initTableColumns(_Columns,'detailPage_api')
//
if(res){
this.Loading.tableLoading = false
this.tableData = []
res.items.forEach(item=>{
item.deleteTipVisible = false
this.tableData.push(item)
})
this.totalCount = res.totalCount
}
this.pagingCallback(callback)
})
.catch(err=>{
this.Loading.tableLoading = false
this.$message.error("数据获取失败")
})
this.$nextTick(() => {
this.dialogShow = true
});
},
//
showParentHandleForDetail(data){
this.showParentTitle = `${data[this.URLOption_masterName] || ''} 主表信息`
this.showParentDialog = true
this.showParentLoading = true
getListDesById(this.URLOption_parent,data[this.URLOption_masterId])
.then(res => {
this.showParentTableData = res
this.showParentLoading = false
})
.catch(err => {
this.showParentLoading = false
this.$message.error("主表信息获取失败!")
})
mounted(){
this.paging()
this.initHandleButtons()
},
//
editHandleForDetail(data){
console.log(data)
},
//
deleteHandleForDetail(data){
this.Loading.appMainLoading = true
data.deleteTipVisible = false
// interfaceApi[this.DeleteApi](data.id).then(res => {
// this.$successMsg('!')
// this.oldSkipCount = 1
// this.Loading.appMainLoading = false
// this.paging()
// }).catch(err => {
// this.Loading.appMainLoading = false
// this.$message.error("!")
// })
},
}
}
</script>
<style lang="scss">
.filterForDetailPage {
methods: {
rowDropForDetail(data,type){
this.listColumns = data
this.$emit("rowDropForDetail", data,type)
},
//
initHandleButtons(){
//
let _arr_header = []
if(this.showHandleButtons.indexOf('add') >= 0){_arr_header.push(this.defaultAddBtn())}
if(this.showHandleButtons.indexOf('field') >= 0){_arr_header.push(this.defaultFieldSettingBtn())}
if(this.showHandleButtons.indexOf('fresh') >= 0){_arr_header.push(this.defaultFreshBtn())}
if(this.showHandleButtons.indexOf('filter') >= 0){_arr_header.push(this.defaultFilterBtn())}
this.currenButtonData = _arr_header
.mainTable-dialog{
.el-dialog{
height: calc(100% - 100px);
//
let _arr_op = []
if(this.showHandleButtons.indexOf('edit') >= 0){_arr_op.push('edit')}
if(this.showHandleButtons.indexOf('delete') >= 0){_arr_op.push('delete')}
if(this.showHandleButtons.indexOf('showParent') >= 0){_arr_op.push('showParent')}
this.operaButtons = _arr_op
},
//
closeDialog(data){
this.dialogShow = false
this.$emit("closeDialog", data)
},
//
paging(callback){
this.Loading.tableLoading = true;
this.PageListParams.SkipCount = (this.oldSkipCount - 1) * this.PageListParams.MaxResultCount
getPageListForDetail(this.PageListParams,this.URLOption_detailList)
.then(res=>{
//
let _parentName = this.URLOption_detailList.substr(0,this.URLOption_detailList.indexOf('/'))
let _Columns = this.initApiColumnsForDto(res.items[0],_parentName)
this.listColumns = this.initTableColumns(_Columns,'detailPage_api')
//
if(res){
this.Loading.tableLoading = false
this.tableData = []
res.items.forEach(item=>{
item.deleteTipVisible = false
this.tableData.push(item)
})
this.totalCount = res.totalCount
}
this.pagingCallback(callback)
})
.catch(err=>{
this.Loading.tableLoading = false
this.$message.error("数据获取失败")
})
},
//
showParentHandleForDetail(data){
this.showParentTitle = `${data[this.URLOption_masterName] || ''} 主表信息`
this.showParentDialog = true
this.showParentLoading = true
getListDesById(this.URLOption_parent,data[this.URLOption_masterId])
.then(res => {
this.showParentTableData = res
this.showParentLoading = false
})
.catch(err => {
this.showParentLoading = false
this.$message.error("主表信息获取失败!")
})
},
//
editHandleForDetail(data){
console.log(data)
},
//
deleteHandleForDetail(data){
this.Loading.appMainLoading = true
data.deleteTipVisible = false
// interfaceApi[this.DeleteApi](data.id).then(res => {
// this.$successMsg('!')
// this.oldSkipCount = 1
// this.Loading.appMainLoading = false
// this.paging()
// }).catch(err => {
// this.Loading.appMainLoading = false
// this.$message.error("!")
// })
},
}
}
.el-dialog__body{
min-height: 200px;
padding-bottom: 20px !important;
}
</script>
<style lang="scss">
.filterForDetailPage {
.mainTable-dialog{
.el-dialog{
height: calc(100% - 100px);
}
}
.el-dialog__body{
min-height: 200px;
padding-bottom: 20px !important;
}
}
.filterForDetailPage-list{
height: calc(100%);
overflow: auto;
}
.filterForDetailPage-list{
height: calc(100%);
overflow: auto;
}
</style>
</style>

1216
PC/UI.WinIn.FasterZ.Store/src/components/searchOverall/index.vue

File diff suppressed because it is too large

4
PC/UI.WinIn.FasterZ.Store/src/components/searchOverall/style/index.scss

@ -1,4 +1,4 @@
.searchOverallComponent{
.searchOverallComponent{
height: 0;
transition:all 0.5s;
z-index: 1;
@ -31,7 +31,7 @@
// flex-direction: column;
// width: 100%;
// height: 100%;
max-height: 170px;
max-height: var(--navFilterMaxHeight);
overflow: auto;
.el-form {

15
PC/UI.WinIn.FasterZ.Store/src/components/tablePagination/index.vue

@ -25,6 +25,7 @@
:tableColumns="tableColumns"
@overallSearchFormClick="overallSearchFormClick"
:httpOverallSearchData="httpOverallSearchData"
:selectMaxHeight="selectMaxHeight"
>
<!-- 插槽预留 -->
<slot name="searchPrimarySlot"></slot>
@ -48,7 +49,7 @@
:tableColumns="tableColumns | isTableColumns"
:isShowIndex="isShowIndex"
:selectionTable="tableSelection"
:setUTableHeight="setUTableHeight || uTableTopHeight"
:setUTableHeight="uTableTopHeight"
@sortChange="sortChange"
@handleSelectionChange="handleSelectionChange"
@inlineDialog="inlineDialog"
@ -95,6 +96,11 @@ export default {
type:String,
default:'calc(90vh - 280px)'
},
//
selectMaxHeight:{
type: String,
default: '174px'
},
//
searchOverallCoverHeight:{
type: String,
@ -226,6 +232,7 @@ export default {
rowDropVisible: false,
// table key
isUpdate: false,
appRemoveHeight:165,
// table
uTableTopHeight:165,
// table
@ -265,6 +272,8 @@ export default {
}
},
mounted(){
this.appRemoveHeight = this.setUTableHeight || 165
this.uTableTopHeight = this.appRemoveHeight
this.uTableOuterHeight = this.$refs.tablePaginationTableRef.getTableHeight()
this.uTableOuterHeight_init = Number(JSON.stringify(this.uTableOuterHeight))
@ -328,12 +337,12 @@ export default {
let _margin = 20
this.uTableOuterHeight = this.uTableOuterHeight_init - minusHeight - _margin
setTimeout(()=>{
this.uTableTopHeight = minusHeight + 165 + _margin
this.uTableTopHeight = minusHeight + this.appRemoveHeight + _margin
},0)
}else{
this.uTableOuterHeight = this.uTableOuterHeight_init
setTimeout(()=>{
this.uTableTopHeight = 165
this.uTableTopHeight = this.appRemoveHeight
},0)
}
},

Loading…
Cancel
Save