BoXu.Zheng
/
WMS_IAC_FE
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

【接口看板+job+sore+Inventory】反查主表按钮优化

master
安虹睿 1 year ago
parent
42a4dc1370
commit
1f6c4c9ae4
4 changed files with 650 additions and 650 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      PC/InterFace.Dash/src/components/filterForDetailPage/index.vue
  2. 646
      PC/UI.WinIn.FasterZ.Inventory/src/components/filterForDetailPage/index.vue
  3. 646
      PC/UI.WinIn.FasterZ.Job/src/components/filterForDetailPage/index.vue
  4. 4
      PC/UI.WinIn.FasterZ.Store/src/components/filterForDetailPage/index.vue

4
PC/InterFace.Dash/src/components/filterForDetailPage/index.vue
View File

@ -56,9 +56,9 @@
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span v-for="item in operaButtons" style="margin: 0 10px;"> <span v-for="item in operaButtons" style="margin: 0 10px;">
<!-- 查看主表信息 --> <!-- 查看主表信息 如果配置中masterId的值为空，则不显示-->
<el-button <el-button
v-if="item == 'showParent'" v-if="item == 'showParent' && (scope.row[URLOption_masterId])"
type="text" type="text"
@click="showParentHandleForDetail(scope.row)" @click="showParentHandleForDetail(scope.row)"
>查看主表信息</el-button> >查看主表信息</el-button>

646
PC/UI.WinIn.FasterZ.Inventory/src/components/filterForDetailPage/index.vue
View File

@ -1,338 +1,338 @@
<template> <template>
<div class="filterForDetailPage" v-if="dialogShow"> <div class="filterForDetailPage" v-if="dialogShow">
<el-dialog <el-dialog
title="明细查询" title="明细查询"
:visible.sync="dialogShow" :visible.sync="dialogShow"
top="5vh" top="5vh"
width="96%" width="96%"
:modal-append-to-body="false" :modal-append-to-body="false"
:append-to-body="false" :append-to-body="false"
:show-close="true" :show-close="true"
@close="closeDialog(false)" @close="closeDialog(false)"
class="mainTable-dialog" class="mainTable-dialog"
>
<div
class="filterForDetailPage-list"
v-loading="Loading.tableLoading"
> >
<!-- 列表 --> <div
<tablePagination class="filterForDetailPage-list"
v-if="dialogShow && listColumns && listColumns.length > 0" v-loading="Loading.tableLoading"
: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处理 --> <tablePagination
<el-table-column v-if="dialogShow && listColumns && listColumns.length > 0"
v-if="operaButtons && operaButtons.length > 0" :currenButtonData="currenButtonData"
label="操作" :tableData="tableData"
:align="'center'" :tableLoading="Loading.tableLoading"
width="150" @rowDrop="rowDropForDetail"
fixed="left" :rowSource="'detailPage_api'"
> :searchOverallCoverHeight="'calc(100vh - 380px)'"
<template slot-scope="scope"> :rowMaxHeight="rowMaxHeight"
<span v-for="item in operaButtons" style="margin: 0 10px;"> :tableColumns="listColumns"
<!-- 查看主表信息 --> :totalCount="totalCount"
<el-button :multipleSelection="multipleSelection"
v-if="item == 'showParent'" :MaxResultCount="PageListParams.MaxResultCount"
type="text" :setUTableHeight="setUTableHeight"
@click="showParentHandleForDetail(scope.row)" :selectMaxHeight="'116px'"
>查看主表信息</el-button> @topbutton="topbutton"
<!-- 编辑 --> @inlineDialog="inlineDialog"
<el-button @sortChange="sortChange"
v-if="item == 'edit'" @alertoldSkipCount="alertoldSkipCount"
type="text" @alterResultCount="alterResultCount"
style="color: #ff9000;" @handleSelectionChange="handleSelectionChange"
@click="editHandleForDetail(scope.row)" :currentPageProps="oldSkipCount"
>编辑</el-button> :quicklySearchOption="quicklySearchOption"
<!-- 删除 --> @quicklySearchClick="quicklySearchClick"
<el-popover @quicklySearchClear="quicklySearchClear"
v-if="item == 'delete'" :primarySearchOption="primarySearchOption"
placement="left" @overallSearchFormClick="overallSearchFormClick"
width="260" :httpOverallSearchData="httpOverallSearchData"
v-model="scope.row.deleteTipVisible" >
> <template>
<p>此操作将永久删除该消息, 是否继续?</p> <!-- todo:width处理 -->
<div style="text-align: right; margin: 0"> <el-table-column
<el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button> v-if="operaButtons && operaButtons.length > 0"
<el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button> label="操作"
</div> :align="'center'"
<el-button type="text" slot="reference" style="color: red;">删除</el-button> width="150"
</el-popover> fixed="left"
</span> >
</template> <template slot-scope="scope">
</el-table-column> <span v-for="item in operaButtons" style="margin: 0 10px;">
</template> <!-- 查看主表信息 如果配置中masterId的值为空，则不显示-->
</tablePagination> <el-button
</div> v-if="item == 'showParent' && (scope.row[URLOption_masterId])"
</el-dialog> type="text"
<!-- 主表信息 --> @click="showParentHandleForDetail(scope.row)"
<el-dialog >查看主表信息</el-button>
:modal-append-to-body="false" <!-- 编辑 -->
:append-to-body="false" <el-button
:title="showParentTitle" v-if="item == 'edit'"
:visible.sync="showParentDialog" type="text"
:close-on-click-modal="true" style="color: #ff9000;"
:close-on-press-escape="true" @click="editHandleForDetail(scope.row)"
:show-close="true" >编辑</el-button>
width="70%" <!-- 删除 -->
> <el-popover
<div v-loading="showParentLoading"> v-if="item == 'delete'"
<curren-descriptions placement="left"
v-if="showParentTableData" width="260"
border v-model="scope.row.deleteTipVisible"
:column="column" >
:direction="direction" <p>此操作将永久删除该消息, 是否继续?</p>
:colon="false" <div style="text-align: right; margin: 0">
:tabsDesTions="parentColumns" <el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button>
:propsData="showParentTableData" <el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button>
style="padding-bottom: 20px;" </div>
></curren-descriptions> <el-button type="text" slot="reference" style="color: red;">删除</el-button>
</div> </el-popover>
<!-- <el-table :data="showParentTableData"> </span>
<el-table-column property="date" label="日期" width="150"></el-table-column> </template>
<el-table-column property="name" label="姓名" width="200"></el-table-column> </el-table-column>
<el-table-column property="address" label="地址"></el-table-column> </template>
</el-table> --> </tablePagination>
</el-dialog> </div>
</div> </el-dialog>
</template> <!-- 主表信息 -->
<script> <el-dialog
import currenDescriptions from "@/components/currenDescriptions" :modal-append-to-body="false"
import { tableMixins } from "@/mixins/TableMixins"; :append-to-body="false"
import { TableHeaderMixins } from "@/mixins/TableHeaderMixins"; :title="showParentTitle"
import { LoadingMixins } from "@/mixins/LoadingMixins"; :visible.sync="showParentDialog"
import { mixins } from "@/mixins/mixins"; :close-on-click-modal="true"
import { filterSelectMixins } from '@/mixins/filter-Select' :close-on-press-escape="true"
import {getListDesById,getPageListForDetail} from "@/api/wms-api" :show-close="true"
export default { width="70%"
name: 'filterForDetailPage', >
mixins: [ <div v-loading="showParentLoading">
tableMixins, <curren-descriptions
TableHeaderMixins, v-if="showParentTableData"
mixins, border
filterSelectMixins, :column="column"
LoadingMixins :direction="direction"
], :colon="false"
components:{ :tabsDesTions="parentColumns"
currenDescriptions :propsData="showParentTableData"
}, style="padding-bottom: 20px;"
props: { ></curren-descriptions>
// 已app-main高度为100% 需要减掉的高度 </div>
setUTableHeight: { <!-- <el-table :data="showParentTableData">
type: Number, <el-table-column property="date" label="日期" width="150"></el-table-column>
default: 340 <el-table-column property="name" label="姓名" width="200"></el-table-column>
}, <el-table-column property="address" label="地址"></el-table-column>
// 是否显示序号 </el-table> -->
isShowIndex:{ </el-dialog>
type: Boolean, </div>
default: false </template>
}, <script>
// 复选框 import currenDescriptions from "@/components/currenDescriptions"
tableSelection: { import { tableMixins } from "@/mixins/TableMixins";
type: Boolean, import { TableHeaderMixins } from "@/mixins/TableHeaderMixins";
default: false import { LoadingMixins } from "@/mixins/LoadingMixins";
}, import { mixins } from "@/mixins/mixins";
cellStyle: { import { filterSelectMixins } from '@/mixins/filter-Select'
type: Function, import {getListDesById,getPageListForDetail} from "@/api/wms-api"
default: () => { export default {
return Function; name: 'filterForDetailPage',
} mixins: [
}, tableMixins,
// 超出内容是否提示 TableHeaderMixins,
showOverflowTooltip:{ mixins,
type: Boolean, filterSelectMixins,
default: false, LoadingMixins
],
components:{
currenDescriptions
}, },
// 删除api props: {
DeleteApi: { // 已app-main高度为100% 需要减掉的高度
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'暂时隐藏
// showParent查看主表信息，fresh刷新，filter筛选，field字段设置
return ['showParent','fresh','filter','field'];
}
},
// 父级展现列数，默认为2列展现
column: {
type: Number,
default: 2
},
// 父级展示方式，默认水平分布
direction: {
type: String, type: String,
default: null default: 'horizontal'
}, },
// 主表数据-表头 rowMaxHeight:{
parentColumns:{ type:String,
type: Array, default:'calc(90vh - 450px)'
default: null },
}, },
showHandleButtons:{ data () {
type:Array, return {
default:() => { dialogShow:true,
//'add','edit'暂未处理操作 'delete'暂时隐藏 // URLOption_detailList:allUrlOption[this.$route.name].detailListURL,//明细-列表
// showParent查看主表信息，fresh刷新，filter筛选，field字段设置 // URLOption_masterId:allUrlOption[this.$route.name].masterId || 'masterId',//明细-查看主表的连接id
return ['showParent','fresh','filter','field']; // 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列展现 activated(){
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){
this.dialogShow = false this.dialogShow = false
this.$emit("closeDialog", data) this.$nextTick(() => {
}, this.dialogShow = true
// 获取列表 });
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("数据获取失败")
})
}, },
// 查看主表信息 mounted(){
showParentHandleForDetail(data){ this.paging()
this.showParentTitle = `${data[this.URLOption_masterName] || ''} 主表信息` this.initHandleButtons()
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("主表信息获取失败!")
})
}, },
// 编辑 methods: {
editHandleForDetail(data){ rowDropForDetail(data,type){
console.log(data) this.listColumns = data
}, this.$emit("rowDropForDetail", data,type)
// 删除 },
deleteHandleForDetail(data){ // 初始化显示按钮
this.Loading.appMainLoading = true initHandleButtons(){
data.deleteTipVisible = false // 头部按钮
// interfaceApi[this.DeleteApi](data.id).then(res => { let _arr_header = []
// this.$successMsg('删除成功!') if(this.showHandleButtons.indexOf('add') >= 0){_arr_header.push(this.defaultAddBtn())}
// this.oldSkipCount = 1 if(this.showHandleButtons.indexOf('field') >= 0){_arr_header.push(this.defaultFieldSettingBtn())}
// this.Loading.appMainLoading = false if(this.showHandleButtons.indexOf('fresh') >= 0){_arr_header.push(this.defaultFreshBtn())}
// this.paging() if(this.showHandleButtons.indexOf('filter') >= 0){_arr_header.push(this.defaultFilterBtn())}
// }).catch(err => { this.currenButtonData = _arr_header
// this.Loading.appMainLoading = false
// this.$message.error("删除失败!")
// })
},
}
}
</script>
<style lang="scss">
.filterForDetailPage {
.mainTable-dialog{ // 操作列按钮
.el-dialog{ let _arr_op = []
height: calc(100% - 100px); 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{ </script>
min-height: 200px; <style lang="scss">
padding-bottom: 20px !important; .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{ </style>
height: calc(100%);
overflow: auto;
}
</style>

646
PC/UI.WinIn.FasterZ.Job/src/components/filterForDetailPage/index.vue
View File

@ -1,338 +1,338 @@
<template> <template>
<div class="filterForDetailPage" v-if="dialogShow"> <div class="filterForDetailPage" v-if="dialogShow">
<el-dialog <el-dialog
title="明细查询" title="明细查询"
:visible.sync="dialogShow" :visible.sync="dialogShow"
top="5vh" top="5vh"
width="96%" width="96%"
:modal-append-to-body="false" :modal-append-to-body="false"
:append-to-body="false" :append-to-body="false"
:show-close="true" :show-close="true"
@close="closeDialog(false)" @close="closeDialog(false)"
class="mainTable-dialog" class="mainTable-dialog"
>
<div
class="filterForDetailPage-list"
v-loading="Loading.tableLoading"
> >
<!-- 列表 --> <div
<tablePagination class="filterForDetailPage-list"
v-if="dialogShow && listColumns && listColumns.length > 0" v-loading="Loading.tableLoading"
: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处理 --> <tablePagination
<el-table-column v-if="dialogShow && listColumns && listColumns.length > 0"
v-if="operaButtons && operaButtons.length > 0" :currenButtonData="currenButtonData"
label="操作" :tableData="tableData"
:align="'center'" :tableLoading="Loading.tableLoading"
width="150" @rowDrop="rowDropForDetail"
fixed="left" :rowSource="'detailPage_api'"
> :searchOverallCoverHeight="'calc(100vh - 380px)'"
<template slot-scope="scope"> :rowMaxHeight="rowMaxHeight"
<span v-for="item in operaButtons" style="margin: 0 10px;"> :tableColumns="listColumns"
<!-- 查看主表信息 --> :totalCount="totalCount"
<el-button :multipleSelection="multipleSelection"
v-if="item == 'showParent'" :MaxResultCount="PageListParams.MaxResultCount"
type="text" :setUTableHeight="setUTableHeight"
@click="showParentHandleForDetail(scope.row)" :selectMaxHeight="'116px'"
>查看主表信息</el-button> @topbutton="topbutton"
<!-- 编辑 --> @inlineDialog="inlineDialog"
<el-button @sortChange="sortChange"
v-if="item == 'edit'" @alertoldSkipCount="alertoldSkipCount"
type="text" @alterResultCount="alterResultCount"
style="color: #ff9000;" @handleSelectionChange="handleSelectionChange"
@click="editHandleForDetail(scope.row)" :currentPageProps="oldSkipCount"
>编辑</el-button> :quicklySearchOption="quicklySearchOption"
<!-- 删除 --> @quicklySearchClick="quicklySearchClick"
<el-popover @quicklySearchClear="quicklySearchClear"
v-if="item == 'delete'" :primarySearchOption="primarySearchOption"
placement="left" @overallSearchFormClick="overallSearchFormClick"
width="260" :httpOverallSearchData="httpOverallSearchData"
v-model="scope.row.deleteTipVisible" >
> <template>
<p>此操作将永久删除该消息, 是否继续?</p> <!-- todo:width处理 -->
<div style="text-align: right; margin: 0"> <el-table-column
<el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button> v-if="operaButtons && operaButtons.length > 0"
<el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button> label="操作"
</div> :align="'center'"
<el-button type="text" slot="reference" style="color: red;">删除</el-button> width="150"
</el-popover> fixed="left"
</span> >
</template> <template slot-scope="scope">
</el-table-column> <span v-for="item in operaButtons" style="margin: 0 10px;">
</template> <!-- 查看主表信息 如果配置中masterId的值为空，则不显示-->
</tablePagination> <el-button
</div> v-if="item == 'showParent' && (scope.row[URLOption_masterId])"
</el-dialog> type="text"
<!-- 主表信息 --> @click="showParentHandleForDetail(scope.row)"
<el-dialog >查看主表信息</el-button>
:modal-append-to-body="false" <!-- 编辑 -->
:append-to-body="false" <el-button
:title="showParentTitle" v-if="item == 'edit'"
:visible.sync="showParentDialog" type="text"
:close-on-click-modal="true" style="color: #ff9000;"
:close-on-press-escape="true" @click="editHandleForDetail(scope.row)"
:show-close="true" >编辑</el-button>
width="70%" <!-- 删除 -->
> <el-popover
<div v-loading="showParentLoading"> v-if="item == 'delete'"
<curren-descriptions placement="left"
v-if="showParentTableData" width="260"
border v-model="scope.row.deleteTipVisible"
:column="column" >
:direction="direction" <p>此操作将永久删除该消息, 是否继续?</p>
:colon="false" <div style="text-align: right; margin: 0">
:tabsDesTions="parentColumns" <el-button size="mini" type="text" style="margin-right: 20px;" @click="scope.row.deleteTipVisible = false">取消</el-button>
:propsData="showParentTableData" <el-button type="primary" size="mini" @click="deleteHandleForDetail(scope.row)">确定</el-button>
style="padding-bottom: 20px;" </div>
></curren-descriptions> <el-button type="text" slot="reference" style="color: red;">删除</el-button>
</div> </el-popover>
<!-- <el-table :data="showParentTableData"> </span>
<el-table-column property="date" label="日期" width="150"></el-table-column> </template>
<el-table-column property="name" label="姓名" width="200"></el-table-column> </el-table-column>
<el-table-column property="address" label="地址"></el-table-column> </template>
</el-table> --> </tablePagination>
</el-dialog> </div>
</div> </el-dialog>
</template> <!-- 主表信息 -->
<script> <el-dialog
import currenDescriptions from "@/components/currenDescriptions" :modal-append-to-body="false"
import { tableMixins } from "@/mixins/TableMixins"; :append-to-body="false"
import { TableHeaderMixins } from "@/mixins/TableHeaderMixins"; :title="showParentTitle"
import { LoadingMixins } from "@/mixins/LoadingMixins"; :visible.sync="showParentDialog"
import { mixins } from "@/mixins/mixins"; :close-on-click-modal="true"
import { filterSelectMixins } from '@/mixins/filter-Select' :close-on-press-escape="true"
import {getListDesById,getPageListForDetail} from "@/api/wms-api" :show-close="true"
export default { width="70%"
name: 'filterForDetailPage', >
mixins: [ <div v-loading="showParentLoading">
tableMixins, <curren-descriptions
TableHeaderMixins, v-if="showParentTableData"
mixins, border
filterSelectMixins, :column="column"
LoadingMixins :direction="direction"
], :colon="false"
components:{ :tabsDesTions="parentColumns"
currenDescriptions :propsData="showParentTableData"
}, style="padding-bottom: 20px;"
props: { ></curren-descriptions>
// 已app-main高度为100% 需要减掉的高度 </div>
setUTableHeight: { <!-- <el-table :data="showParentTableData">
type: Number, <el-table-column property="date" label="日期" width="150"></el-table-column>
default: 340 <el-table-column property="name" label="姓名" width="200"></el-table-column>
}, <el-table-column property="address" label="地址"></el-table-column>
// 是否显示序号 </el-table> -->
isShowIndex:{ </el-dialog>
type: Boolean, </div>
default: false </template>
}, <script>
// 复选框 import currenDescriptions from "@/components/currenDescriptions"
tableSelection: { import { tableMixins } from "@/mixins/TableMixins";
type: Boolean, import { TableHeaderMixins } from "@/mixins/TableHeaderMixins";
default: false import { LoadingMixins } from "@/mixins/LoadingMixins";
}, import { mixins } from "@/mixins/mixins";
cellStyle: { import { filterSelectMixins } from '@/mixins/filter-Select'
type: Function, import {getListDesById,getPageListForDetail} from "@/api/wms-api"
default: () => { export default {
return Function; name: 'filterForDetailPage',
} mixins: [
}, tableMixins,
// 超出内容是否提示 TableHeaderMixins,
showOverflowTooltip:{ mixins,
type: Boolean, filterSelectMixins,
default: false, LoadingMixins
],
components:{
currenDescriptions
}, },
// 删除api props: {
DeleteApi: { // 已app-main高度为100% 需要减掉的高度
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'暂时隐藏
// showParent查看主表信息，fresh刷新，filter筛选，field字段设置
return ['showParent','fresh','filter','field'];
}
},
// 父级展现列数，默认为2列展现
column: {
type: Number,
default: 2
},
// 父级展示方式，默认水平分布
direction: {
type: String, type: String,
default: null default: 'horizontal'
}, },
// 主表数据-表头 rowMaxHeight:{
parentColumns:{ type:String,
type: Array, default:'calc(90vh - 450px)'
default: null },
}, },
showHandleButtons:{ data () {
type:Array, return {
default:() => { dialogShow:true,
//'add','edit'暂未处理操作 'delete'暂时隐藏 // URLOption_detailList:allUrlOption[this.$route.name].detailListURL,//明细-列表
// showParent查看主表信息，fresh刷新，filter筛选，field字段设置 // URLOption_masterId:allUrlOption[this.$route.name].masterId || 'masterId',//明细-查看主表的连接id
return ['showParent','fresh','filter','field']; // 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列展现 activated(){
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){
this.dialogShow = false this.dialogShow = false
this.$emit("closeDialog", data) this.$nextTick(() => {
}, this.dialogShow = true
// 获取列表 });
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("数据获取失败")
})
}, },
// 查看主表信息 mounted(){
showParentHandleForDetail(data){ this.paging()
this.showParentTitle = `${data[this.URLOption_masterName] || ''} 主表信息` this.initHandleButtons()
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("主表信息获取失败!")
})
}, },
// 编辑 methods: {
editHandleForDetail(data){ rowDropForDetail(data,type){
console.log(data) this.listColumns = data
}, this.$emit("rowDropForDetail", data,type)
// 删除 },
deleteHandleForDetail(data){ // 初始化显示按钮
this.Loading.appMainLoading = true initHandleButtons(){
data.deleteTipVisible = false // 头部按钮
// interfaceApi[this.DeleteApi](data.id).then(res => { let _arr_header = []
// this.$successMsg('删除成功!') if(this.showHandleButtons.indexOf('add') >= 0){_arr_header.push(this.defaultAddBtn())}
// this.oldSkipCount = 1 if(this.showHandleButtons.indexOf('field') >= 0){_arr_header.push(this.defaultFieldSettingBtn())}
// this.Loading.appMainLoading = false if(this.showHandleButtons.indexOf('fresh') >= 0){_arr_header.push(this.defaultFreshBtn())}
// this.paging() if(this.showHandleButtons.indexOf('filter') >= 0){_arr_header.push(this.defaultFilterBtn())}
// }).catch(err => { this.currenButtonData = _arr_header
// this.Loading.appMainLoading = false
// this.$message.error("删除失败!")
// })
},
}
}
</script>
<style lang="scss">
.filterForDetailPage {
.mainTable-dialog{ // 操作列按钮
.el-dialog{ let _arr_op = []
height: calc(100% - 100px); 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{ </script>
min-height: 200px; <style lang="scss">
padding-bottom: 20px !important; .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{ </style>
height: calc(100%);
overflow: auto;
}
</style>

4
PC/UI.WinIn.FasterZ.Store/src/components/filterForDetailPage/index.vue
View File

@ -56,9 +56,9 @@
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span v-for="item in operaButtons" style="margin: 0 10px;"> <span v-for="item in operaButtons" style="margin: 0 10px;">
<!-- 查看主表信息 --> <!-- 查看主表信息 如果配置中masterId的值为空，则不显示-->
<el-button <el-button
v-if="item == 'showParent'" v-if="item == 'showParent' && (scope.row[URLOption_masterId])"
type="text" type="text"
@click="showParentHandleForDetail(scope.row)" @click="showParentHandleForDetail(scope.row)"
>查看主表信息</el-button> >查看主表信息</el-button>

Write Preview
Loading…
Cancel
Save