|
@@ -8,31 +8,96 @@
|
|
|
<el-container>
|
|
|
<el-header>
|
|
|
<div class="searchHeader">
|
|
|
- <el-select v-model="searchOption.label" size="small" @change="getObject">
|
|
|
+ <el-select :value="searchOption.value" size="small" @change="getObject">
|
|
|
<el-option v-for="item in SearchFields" :key="item.value" :label="item.label" :value="item.value" placeholder="请选择"></el-option>
|
|
|
</el-select>
|
|
|
- <el-input size="small" style="width: 100%" v-model="searchOption.value" placeholder="请输入"></el-input>
|
|
|
- <el-button size="small">查询</el-button>
|
|
|
+ <template v-if="searchOption.fields && searchOption.fields.length">
|
|
|
+ <div v-for="field in searchOption.fields" :key="field.value">
|
|
|
+ <template v-if="searchOption.component == 'date'">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="field.result"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ placeholder="选择日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="searchOption.component == 'number'">
|
|
|
+ <el-input-number controls-position="right" size="small" v-model="field.result" placeholder="请输入" :precision="2" :step="0.1" :min="0"></el-input-number>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-input type="text" size="small" v-model="field.result" placeholder="请输入"></el-input>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <template v-if="searchOption.component == 'date'">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="searchOption.result"
|
|
|
+ type="date"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ placeholder="选择日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="searchOption.component == 'number'">
|
|
|
+ <el-input-number controls-position="right" size="small" v-model="searchOption.result" placeholder="请输入" :precision="2" :step="0.1" :min="0"></el-input-number>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-input type="text" size="small" v-model="searchOption.result" placeholder="请输入"></el-input>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <el-button size="small" @click="search">查询</el-button>
|
|
|
+ <div class="option" v-if="Object.keys(searchValue).length > 0">
|
|
|
+ <el-popover placement="bottom" title="" width="300" trigger="hover" class="margin-left_10">
|
|
|
+ <div class="main">
|
|
|
+ <div v-for="(item, key) in SearchFields.filter(i=>{return i.result || (i.results && i.results.length)})" :key="key" class="box">
|
|
|
+ <el-alert type="success" :closable="false">
|
|
|
+ <div class="content">
|
|
|
+ <span class="color-black">{{ item.label }}</span>
|
|
|
+ <b class="padding_0_5">=</b>
|
|
|
+ <span class="color-black">
|
|
|
+ <span v-if="item.results">
|
|
|
+ <span class="query-data-label" @click="handleCancelQueryParams(item)">{{ item.results.join(' ~ ') }}<i
|
|
|
+ class="el-icon-close"></i></span>
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ <span class="query-data-label" @click="handleCancelQueryParams(item)">{{ item.result}}<i class="el-icon-close"></i></span>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </el-alert>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-button slot="reference" size="small" type="primary" style="width:100%">
|
|
|
+ 检索条件<i class="el-icon-arrow-down el-icon--right"></i>
|
|
|
+ </el-button>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</el-header>
|
|
|
<el-main style="padding:15px 5px !important">
|
|
|
- <el-table :data="tableData" border style="width: 100%" header-row-class-name="custom-table-header" height="calc(100% - 0px)" >
|
|
|
+ <el-table :data="tableData" border style="width: 100%" header-row-class-name="custom-table-header" :loading="loading" height="calc(100% - 0px)" >
|
|
|
<el-table-column label="#" width="60" type="index" align="center">
|
|
|
<template slot-scope="scope">
|
|
|
<span>{{ (scope.$index + 1) + ((queryParams.current - 1) * queryParams.size) }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column v-for="item in column" :key="item.value" :prop="item.value" :render-header=" $commonJS.renderHeaderMethods" :label="item.name" :sortable="item.ifSort?'custom':false" align="center">
|
|
|
+ <el-table-column v-for="item in column" :key="item.value" :prop="item.value" :render-header=" $commonJS.renderHeaderMethods" :label="item.name" :sortable="item.ifSort?'custom':false" align="center" :width="item.width||'auto'">
|
|
|
<template slot-scope="scope">
|
|
|
<div>
|
|
|
<!-- 差异度 -->
|
|
|
- <div v-if="['a','b'].includes(item.value)" v-html="$commonJS.getColumnData(scope.row,item)" class="cursor" @click="checkDifferenceDetails(scope.row,item)"></div>
|
|
|
+ <div v-if="['firstDiffRate','secondDiffRate'].includes(item.value)" v-html="$commonJS.getColumnData(scope.row,item)" class="cursor" @click="checkDifferenceDetails(scope.row,item)"></div>
|
|
|
<!-- 文件 -->
|
|
|
- <div v-else-if="['files'].includes(item.value)">
|
|
|
- <p v-for="(file,ind) in scope.row.files" :key="ind" class="cursor">{{ file.type }}:{{ file.file.name }}
|
|
|
- <span style="display:none">
|
|
|
- <el-button type="text">预览</el-button>
|
|
|
- <el-button type="text">下载</el-button>
|
|
|
+ <div v-else-if="['assoCaseFileVOList'].includes(item.value)">
|
|
|
+ <p v-for="(file,ind) in scope.row.assoCaseFileVOList" :key="ind" class="cursor1">{{ fileType[file.fileType] }}:{{ file.fileName }}
|
|
|
+ <span style="display:inline-block" >
|
|
|
+ <el-button type="text" style="margin-left: 20px;" @click="review(file)">预览</el-button>
|
|
|
+ <el-button type="text" @click='downLoad(file)'>下载</el-button>
|
|
|
</span>
|
|
|
</p>
|
|
|
</div>
|
|
@@ -54,59 +119,74 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { downLoad2 } from '@/utils'
|
|
|
+
|
|
|
const tableColumn = [
|
|
|
{
|
|
|
value:"caseNo",
|
|
|
name:'案号',
|
|
|
+ width:"220px",
|
|
|
ifSort:false
|
|
|
},
|
|
|
{
|
|
|
value:"title",
|
|
|
name:'标题',
|
|
|
+ width:"240px",
|
|
|
ifSort:false
|
|
|
},
|
|
|
{
|
|
|
- value:"client",
|
|
|
+ value:"customer",
|
|
|
name:'客户',
|
|
|
+ width:"240px",
|
|
|
ifSort:false
|
|
|
},
|
|
|
{
|
|
|
- value:"writePerson",
|
|
|
+ value:"writer",
|
|
|
name:'撰写人',
|
|
|
+ width:"110px",
|
|
|
ifSort:false
|
|
|
},
|
|
|
|
|
|
{
|
|
|
- value:"examinePerson",
|
|
|
+ value:"auditor",
|
|
|
name:'审核人',
|
|
|
+ width:"110px",
|
|
|
ifSort:false
|
|
|
},
|
|
|
{
|
|
|
- value:"finishTime",
|
|
|
+ value:"completionDate",
|
|
|
name:'完成日期',
|
|
|
+ width:"180px",
|
|
|
ifSort:false
|
|
|
},
|
|
|
{
|
|
|
- value:"a",
|
|
|
+ value:"firstDiffRate",
|
|
|
name:'初稿与内部定稿差异度',
|
|
|
+ width:"180px",
|
|
|
ifSort:false,
|
|
|
type:"function",
|
|
|
useFunction:(data)=>{
|
|
|
- return '初稿与内部定稿差异度:' + data.a
|
|
|
+ var num = data.firstDiffRate * 100
|
|
|
+ num = num.toFixed(4)
|
|
|
+ return '初稿与内部定稿差异度:' + num + '%'
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
- value:"b",
|
|
|
+ value:"secondDiffRate",
|
|
|
name:'内部定稿与定稿差异度',
|
|
|
+ width:"180px",
|
|
|
ifSort:false,
|
|
|
type:"function",
|
|
|
useFunction:(data)=>{
|
|
|
- return '内部定稿与定稿差异度:' + data.b
|
|
|
+ var num = data.secondDiffRate * 100
|
|
|
+ num = num.toFixed(4)
|
|
|
+ return '内部定稿与定稿差异度:' + num + '%'
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
- value:"files",
|
|
|
+ value:"assoCaseFileVOList",
|
|
|
name:'案件文件',
|
|
|
+ width:"360px",
|
|
|
ifSort:false,
|
|
|
type:"function",
|
|
|
useFunction:(data)=>{
|
|
@@ -114,80 +194,193 @@ const tableColumn = [
|
|
|
}
|
|
|
},
|
|
|
]
|
|
|
-export default {
|
|
|
- components: {},
|
|
|
- props: {},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- SearchFields:[
|
|
|
+const defaultSeachFields = [
|
|
|
{
|
|
|
- value:'case',
|
|
|
+ value:'caseNo',
|
|
|
label:'案号'
|
|
|
},
|
|
|
{
|
|
|
value:'title',
|
|
|
label:'标题'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'customer',
|
|
|
+ label:'客户'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'writer',
|
|
|
+ label:'撰写人'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'auditor',
|
|
|
+ label:'审核人'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'completionDate',
|
|
|
+ component:'date',
|
|
|
+ label:'完成日期'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'firstBegin',
|
|
|
+ component:'number',
|
|
|
+ fields:[
|
|
|
+ {
|
|
|
+ label:'开始差异度',
|
|
|
+ value:'firstBegin',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label:'结束差异度',
|
|
|
+ value:'firstEnd'
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label:'初稿与内部定稿差异度'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'secondBegin',
|
|
|
+ component:'number',
|
|
|
+ fields:[
|
|
|
+ {
|
|
|
+ label:'开始差异度',
|
|
|
+ value:'secondBegin',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label:'结束差异度',
|
|
|
+ value:'secondEnd'
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ label:'内部定稿与定稿差异度'
|
|
|
}
|
|
|
- ],
|
|
|
- searchOption:{
|
|
|
+ ]
|
|
|
+export default {
|
|
|
+ components: {},
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ fileType:{
|
|
|
+ 1:'初稿文件',
|
|
|
+ 2:'内部定稿文件',
|
|
|
+ 3:'定稿文件'
|
|
|
+ },
|
|
|
+ SearchFields:defaultSeachFields,
|
|
|
+ searchOption:{//当前检索栏位
|
|
|
label:'',
|
|
|
value:''
|
|
|
},
|
|
|
- tableData:[
|
|
|
- {
|
|
|
- caseNo:'su2345',
|
|
|
- title:'su1',
|
|
|
- client:'customer1',
|
|
|
- writePerson:'test1',
|
|
|
- examinePerson:'approve1',
|
|
|
- finishTime:'2024-11-01',
|
|
|
- a:'30%',
|
|
|
- b:'40%',
|
|
|
- files:[
|
|
|
- {
|
|
|
- type:'初稿文件',
|
|
|
- file:{
|
|
|
- name:'xxxx.docx',
|
|
|
- guid:'',
|
|
|
- type:'docx',
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- type:'内部定稿文件',
|
|
|
- file:{
|
|
|
- name:'xxxx.docx',
|
|
|
- guid:'',
|
|
|
- type:'docx',
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- type:'定稿文件',
|
|
|
- file:{
|
|
|
- name:'xxxx.docx',
|
|
|
- guid:'',
|
|
|
- type:'docx',
|
|
|
- }
|
|
|
- },
|
|
|
- ]
|
|
|
- }
|
|
|
- ],
|
|
|
+ searchValue:{},
|
|
|
+ tableData:[],
|
|
|
queryParams:{
|
|
|
size:10,
|
|
|
current:1,
|
|
|
},
|
|
|
total:0,
|
|
|
- column:tableColumn
|
|
|
+ column:tableColumn,
|
|
|
+ loading:false
|
|
|
};
|
|
|
},
|
|
|
watch: {},
|
|
|
computed: {},
|
|
|
created() {},
|
|
|
mounted() {
|
|
|
+ this.searchOption = this.SearchFields[0]
|
|
|
this.getList()
|
|
|
},
|
|
|
methods: {
|
|
|
+ //预览
|
|
|
+ review(row){
|
|
|
+ var guid = row.fileGuid
|
|
|
+ if(!guid){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ var type = ''
|
|
|
+ if(row.systemFile || row.systemFile.type){
|
|
|
+ type = row.systemFile.type
|
|
|
+ }
|
|
|
+ if(!type){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.$commonJS.previewFile(
|
|
|
+ {
|
|
|
+ fileName:row.fileName
|
|
|
+ },
|
|
|
+ guid,
|
|
|
+ type
|
|
|
+ )
|
|
|
+ },
|
|
|
+ //下载
|
|
|
+ downLoad(row){
|
|
|
+ downLoad2(row.fileGuid,row.fileName)
|
|
|
+ },
|
|
|
+ //删除检索条件
|
|
|
+ handleCancelQueryParams(data){
|
|
|
+ var obj = this.SearchFields.find(item=>{
|
|
|
+ return item.value == data.value
|
|
|
+ })
|
|
|
+ if(!obj){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(obj.fields && obj.fields.length){
|
|
|
+ obj.results = null
|
|
|
+ obj.fields.forEach(item=>{
|
|
|
+ delete item.result
|
|
|
+ delete this.searchValue[item.value]
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ delete obj.result
|
|
|
+ delete this.searchValue[obj.value]
|
|
|
+ }
|
|
|
+ this.queryParams.current = 1
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
+ //检索
|
|
|
+ search(){
|
|
|
+ if(!this.searchOption){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(this.searchOption.fields && this.searchOption.fields.length){
|
|
|
+ var data = this.searchOption.fields
|
|
|
+ this.searchOption.results = []
|
|
|
+ data.forEach((item,index)=>{
|
|
|
+ if(item.result){
|
|
|
+ this.searchOption.results[index] = item.result
|
|
|
+ this.searchValue[item.value] = item.result
|
|
|
+ }else{
|
|
|
+ delete this.searchValue[item.value]
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(this.searchOption.results.length>0){
|
|
|
+ if(!this.searchOption.results[0]){
|
|
|
+ this.searchOption.results[0] = 0
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ if(this.searchOption.result === null || this.searchOption.result.trim()){
|
|
|
+ this.searchValue[this.searchOption.value] = this.searchOption.result.trim()
|
|
|
+ }else{
|
|
|
+ delete this.searchValue[this.searchOption.value]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.queryParams.current = 1
|
|
|
+ this.getList()
|
|
|
+ },
|
|
|
//查询数据
|
|
|
- getList(){},
|
|
|
+ getList(){
|
|
|
+ var params = {
|
|
|
+ ...this.queryParams,
|
|
|
+ ...this.searchValue
|
|
|
+ }
|
|
|
+ this.loading = true
|
|
|
+ this.$api.selectCaseInfoList(params).then(response=>{//成功回调
|
|
|
+ if(response.code == 200){
|
|
|
+ this.loading = false
|
|
|
+ this.tableData = response.data.data
|
|
|
+ this.total = response.data.total
|
|
|
+ }
|
|
|
+ }).catch(error=>{//失败回调
|
|
|
+ this.tableData = []
|
|
|
+ this.total = 0
|
|
|
+ this.loading =false
|
|
|
+ })
|
|
|
+ },
|
|
|
//切换页大小
|
|
|
handleSizeChange(val){
|
|
|
this.queryParams.size = val
|
|
@@ -201,14 +394,23 @@ export default {
|
|
|
},
|
|
|
//切换栏位
|
|
|
getObject(val){
|
|
|
+ this.searchOption = this.SearchFields.find(item=>{
|
|
|
+ return item.value == val
|
|
|
+ })
|
|
|
},
|
|
|
//查看差异详情
|
|
|
checkDifferenceDetails(row,fieldObj){
|
|
|
+ var field = fieldObj.value
|
|
|
+ var types = {
|
|
|
+ firstDiffRate:'firstDiscrepancyId',
|
|
|
+ secondDiffRate:'secondDiscrepancyId'
|
|
|
+ }
|
|
|
const router = this.$router.resolve(
|
|
|
{
|
|
|
path:'/differenceDetails',
|
|
|
query:{
|
|
|
-
|
|
|
+ id:row[types[field]],
|
|
|
+ type:field
|
|
|
}
|
|
|
}
|
|
|
)
|
|
@@ -230,9 +432,27 @@ export default {
|
|
|
padding: 0 !important;
|
|
|
}
|
|
|
|
|
|
-.cursor:hover{
|
|
|
+.cursor:hover,.cursor1:hover{
|
|
|
&>span{
|
|
|
display: inline-block !important;
|
|
|
}
|
|
|
}
|
|
|
+.option {
|
|
|
+ width: 100px;
|
|
|
+ margin-right: 0;
|
|
|
+}
|
|
|
+.main {
|
|
|
+ padding: 0 !important;
|
|
|
+ height: 250px;
|
|
|
+ overflow-y: auto;
|
|
|
+
|
|
|
+ .box {
|
|
|
+ margin-top: 10px;
|
|
|
+
|
|
|
+ .content {
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|