2025-01-06 16:28:38 +08:00

163 lines
6.3 KiB
Vue

<template>
<div>
<div class="pt-8 border-b-solid-lighter-1">
<div class="height-30 flex-row align-items-center justify-content-between mb-24">
<div class="f18 color-text-primary">筛选</div>
</div>
<el-collapse-transition>
<el-row :gutter="56">
<el-col :span="8">
<div class="flex-row-center align-items-center height-40 mb-24">
<span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件编号</span>
<el-input v-model.trim="queryParam.caseNo"
clearable placeholder="请输入案件编号"
@keydown.enter.native="handleSearch">
</el-input>
</div>
</el-col>
<el-col :span="12">
<div class="justify-content-start align-items-center height-40 mb-24">
<span class="tabs__search-criteria-title flex-shrink-0 pr-16">操作时间</span>
<el-date-picker
v-model="queryDate"
type="daterange"
clearable
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
@change="handleChangeDate">
</el-date-picker>
</div>
</el-col>
<el-col :span="4">
<div class="flex-row align-items-center justify-content-end">
<el-button @click="hanldeReset">重置</el-button>
<el-button type="primary" @click="handleSearch">搜索</el-button>
</div>
</el-col>
</el-row>
</el-collapse-transition>
</div>
<!-- table -->
<div class="pt-8">
<div class="height-56 flex-row align-items-center justify-content-between">
<div class="f18 color-text-primary">明细列表</div>
<div class="flex-row">
</div>
</div>
<div class="case-table">
<el-table :data="tableData" height="330" >
<el-table-column type="index" label="序号" width="55"></el-table-column>
<el-table-column prop="pkgName" label="案件包名称" show-overflow-tooltip ></el-table-column>
<el-table-column prop="caseNo" label="案件编号" show-overflow-tooltip ></el-table-column>
<el-table-column prop="documentType.desc" label="文书类型" show-overflow-tooltip ></el-table-column>
<el-table-column prop="signName" label="签字当事人" show-overflow-tooltip ></el-table-column>
<el-table-column prop="signed" label="已签字当事人" show-overflow-tooltip ></el-table-column>
<el-table-column prop="unsign" label="未签字当事人" show-overflow-tooltip ></el-table-column>
</el-table>
</div>
<div class="text-center pt-16">
<el-pagination
@size-change="getList"
@current-change="getList"
:current-page="queryParam.current"
:page-size="queryParam.size"
layout="total, prev, pager, next, jumper"
:total="total">
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import api from "@/services/eventTracingApi";
export default {
components: {
},
props: {
DialogDetail: {
type: Object,
default: () => {
return {}
},
},
},
data() {
return {
queryDate: '',
queryParam:{
caseNo:'',
pkgName:'',
size:10,
current:1,
traceId:''
},
tableData:[],
total:0,
};
},
mounted () {
this.queryParam.caseNo = this.DialogDetail.caseNo
this.queryParam.traceId = this.DialogDetail.id
this.getList(1)
},
methods: {
handleChangeDate() {
this.activeUsage = ''
if(this.queryDate === null) {
this.setDateFast()
}else {
this.queryParam.beginTime = this.$util.getDayStart(this.queryDate[0])
this.queryParam.endTime = this.$util.getDayEnd(this.queryDate[1])
}
},
// 重置
hanldeReset() {
for (let key in this.queryParam) {
this.queryParam[key] = ''
}
this.queryParam.current = 1
this.queryParam.size = 10
},
handleSearch() {
this.queryParam.size = 10;
this.queryParam.current = 1;
this.getList(1)
},
// 列表数据
getList(val){
this.queryParam.planBegin = this.queryParam.beginTime
this.queryParam.planEnd = this.queryParam.endTime
this.queryParam.current = val
api.posttrace_sign_detail(this.queryParam).then(res => {
if (!res.code) {
this.tableData = res.records;
this.total = res.total;
}
})
},
}
};
</script>
<style scoped lang="scss">
.dialog-content{
padding: 16px 24px;
max-height:500px
}
.department-wrap{
padding: 16px 24px;
max-height: 250px;
.department-wrap-list{
margin-bottom:32px;
}
.department-wrap-list:last-child{
margin-bottom:0;
}
}
.min-height350{min-height: 350px;}
.department-dept ::v-deep .el-checkbox__label {color: $color-000000}
</style>