Commit dd048e4d authored by 沈翠玲's avatar 沈翠玲

页面优化,调整行高

parent e0d70f23
...@@ -41,6 +41,12 @@ export function useProTable( ...@@ -41,6 +41,12 @@ export function useProTable(
icon: 'vxe-icon-menu', icon: 'vxe-icon-menu',
}, },
}, },
rowConfig: {
height: 34
},
cellConfig: {
height: 34
}
}, },
}); });
......
...@@ -275,4 +275,32 @@ ...@@ -275,4 +275,32 @@
} }
.vxe-table--render-default .vxe-body--column, .vxe-table--render-default .vxe-footer--column, .vxe-table--render-default .vxe-header--column { .vxe-table--render-default .vxe-body--column, .vxe-table--render-default .vxe-footer--column, .vxe-table--render-default .vxe-header--column {
line-height: 11px !important; line-height: 11px !important;
}
.vxe-table--render-default.size--small .vxe-body--column:not(.col--ellipsis) {
padding: 0 !important;
}
.el-button {
padding: 0px 10px !important;
font-size: 13px !important;
height: 27px !important;
}
td {
line-height: 14px !important;
}
.public-header {
position: relative;
line-height: 15px;
font-size: 14px;
padding-left: 10px;
margin-top: 8px;
&::after {
position: absolute;
left: 0;
top: 0;
width: 4px;
height: 100%;
background: var(--el-color-primary);
display: block;
content: '';
}
} }
\ No newline at end of file
...@@ -470,6 +470,9 @@ ...@@ -470,6 +470,9 @@
title: '剩余待还金额', title: '剩余待还金额',
}, },
], ],
cellConfig: {
height: 16
},
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
toolbarConfig: { enabled: false }, toolbarConfig: { enabled: false },
}); });
......
...@@ -29,6 +29,13 @@ ...@@ -29,6 +29,13 @@
console.log('row', row); console.log('row', row);
selectdList.value = row.records; selectdList.value = row.records;
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const callDrawerRef = ref(); const callDrawerRef = ref();
const srcList = ref([]); const srcList = ref([]);
const RefImage = ref(false); const RefImage = ref(false);
...@@ -408,6 +415,7 @@ ...@@ -408,6 +415,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
}; };
}); });
const query = () => ProTableRef.value?.search(); const query = () => ProTableRef.value?.search();
......
...@@ -18,79 +18,84 @@ ...@@ -18,79 +18,84 @@
<div class="w-2/3 pr-2"> <div class="w-2/3 pr-2">
<div>案件明细</div> <div>案件明细</div>
<div class="expand-table"> <div class="expand-table">
<table v-for="(item, index) in row.loans" :key="index" <div v-for="(item, index) in row.loans" :key="index">
><tbody> <div class="public-header">
<tr> {{ item?.caseId }}
<td class="label">案件ID</td> </div>
<td>{{ item?.caseId }}</td> <table
<td class="label">借款机构</td> ><tbody>
<td>{{ item?.loanPlatform?.name }}</td> <tr>
</tr> <td class="label">案件ID</td>
<tr> <td>{{ item?.caseId }}</td>
<td class="label">资管公司</td> <td class="label">借款机构</td>
<td>{{ item?.manageOrg.orgName }}</td> <td>{{ item?.loanPlatform?.name }}</td>
<td class="label">身份证</td> </tr>
<td>{{ item?.borrower?.idCard }}</td> <tr>
</tr> <td class="label">资管公司</td>
<tr> <td>{{ item?.manageOrg.orgName }}</td>
<td class="label">手机号</td> <td class="label">身份证</td>
<td>{{ item?.borrower?.phone }}</td> <td>{{ item?.borrower?.idCard }}</td>
<td class="label">折扣</td> </tr>
<td>{{ item?.discount }}</td> <tr>
</tr> <td class="label">手机号</td>
<tr> <td>{{ item?.borrower?.phone }}</td>
<td class="label">累计还款金额</td> <td class="label">折扣</td>
<td>{{ item?.sumRepayAmount }}</td> <td>{{ item?.discount }}</td>
<td class="label">累计减免金额</td> </tr>
<td>{{ item?.sumReductionAmount }}</td> <tr>
</tr> <td class="label">累计还款金额</td>
<tr> <td>{{ item?.sumRepayAmount }}</td>
<td class="label">剩余待还金额</td> <td class="label">累计减免金额</td>
<td>{{ item?.remainingAmount }}</td> <td>{{ item?.sumReductionAmount }}</td>
<td class="label">CPE</td> </tr>
<td>{{ item?.cpe?.username }}</td> <tr>
</tr> <td class="label">剩余待还金额</td>
<tr> <td>{{ item?.remainingAmount }}</td>
<td class="label">分派CPE日期</td> <td class="label">CPE</td>
<td>{{ item?.cpeDate }}</td> <td>{{ item?.cpe?.username }}</td>
<td class="label">本金余额</td> </tr>
<td>{{ item?.principalBalance }}</td> <tr>
</tr> <td class="label">分派CPE日期</td>
<tr> <td>{{ item?.cpeDate }}</td>
<td class="label">欠息额</td> <td class="label">本金余额</td>
<td>{{ item?.debitInterest }}</td> <td>{{ item?.principalBalance }}</td>
<td class="label">手续费</td> </tr>
<td>{{ item?.commission }}</td> <tr>
</tr> <td class="label">欠息额</td>
<tr> <td>{{ item?.debitInterest }}</td>
<td class="label">委案金额</td> <td class="label">手续费</td>
<td>{{ item?.commissionAmount }}</td> <td>{{ item?.commission }}</td>
<td class="label">案件状态</td> </tr>
<td> <tr>
{{ <td class="label">委案金额</td>
item?.caseStatus <td>{{ item?.commissionAmount }}</td>
? caseStatusOpt.find((v) => v.value === item?.caseStatus).label <td class="label">案件状态</td>
<td>
{{
item?.caseStatus
? caseStatusOpt.find((v) => v.value === item?.caseStatus).label
: ''
}}</td
>
</tr>
<tr>
<td class="label">跟进结果</td>
<td>{{
item?.followStatus
? followStatusOpt.find((v) => v.value === item?.followStatus).label
: '' : ''
}}</td }}</td>
> <td class="label">跟进状态</td>
</tr> <td>{{
<tr> item?.phoneResultStatus
<td class="label">跟进结果</td> ? phoneResultStatusOpt.find((v) => v.value === item?.phoneResultStatus)
<td>{{ .label
item?.followStatus : ''
? followStatusOpt.find((v) => v.value === item?.followStatus).label }}</td>
: '' </tr>
}}</td> </tbody>
<td class="label">跟进状态</td> </table>
<td>{{ </div>
item?.phoneResultStatus
? phoneResultStatusOpt.find((v) => v.value === item?.phoneResultStatus)
.label
: ''
}}</td>
</tr>
</tbody>
</table>
</div> </div>
</div> </div>
<div class="flex-1"> <div class="flex-1">
...@@ -142,6 +147,13 @@ ...@@ -142,6 +147,13 @@
console.log('row', row); console.log('row', row);
selectdList.value = row.records; selectdList.value = row.records;
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const options = [ const options = [
{ {
value: 2, value: 2,
...@@ -366,6 +378,7 @@ ...@@ -366,6 +378,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
}; };
}); });
const query = () => ProTableRef.value?.search(); const query = () => ProTableRef.value?.search();
......
...@@ -16,71 +16,76 @@ ...@@ -16,71 +16,76 @@
<div class="expand-box"> <div class="expand-box">
<div>案件明细</div> <div>案件明细</div>
<div class="expand-table"> <div class="expand-table">
<table v-for="(item, index) in row.reduceRecords" :key="index" <div v-for="(item, index) in row.reduceRecords" :key="index">
><tbody> <div class="public-header">
<tr> {{ item?.loan?.caseId }}
<td class="label">案件ID</td> </div>
<td>{{ item?.loan?.caseId }}</td> <table
<td class="label">借款机构</td> ><tbody>
<td>{{ item?.loan?.loanPlatform?.name }}</td> <tr>
<td class="label">资管公司</td> <td class="label">案件ID</td>
<td>{{ item?.loan?.manageOrg.orgName }}</td> <td>{{ item?.loan?.caseId }}</td>
</tr> <td class="label">借款机构</td>
<tr> <td>{{ item?.loan?.loanPlatform?.name }}</td>
<td class="label">身份证</td> <td class="label">资管公司</td>
<td>{{ item?.loan?.borrower?.idCard }}</td> <td>{{ item?.loan?.manageOrg.orgName }}</td>
<td class="label">手机号</td> </tr>
<td>{{ item?.loan?.borrower?.phone }}</td> <tr>
<td class="label">折扣</td> <td class="label">身份证</td>
<td>{{ item?.loan?.discount }}</td> <td>{{ item?.loan?.borrower?.idCard }}</td>
<td class="label">委案金额</td> <td class="label">手机号</td>
<td>{{ item?.loan?.commissionAmount }}</td> <td>{{ item?.loan?.borrower?.phone }}</td>
</tr> <td class="label">折扣</td>
<tr> <td>{{ item?.loan?.discount }}</td>
<td class="label">累计还款金额</td> <td class="label">委案金额</td>
<td>{{ item?.loan?.sumRepayAmount }}</td> <td>{{ item?.loan?.commissionAmount }}</td>
<td class="label">累计减免金额</td> </tr>
<td>{{ item?.loan?.sumReductionAmount }}</td> <tr>
<td class="label">剩余待还金额</td> <td class="label">累计还款金额</td>
<td>{{ item?.loan?.remainingAmount }}</td> <td>{{ item?.loan?.sumRepayAmount }}</td>
</tr> <td class="label">累计减免金额</td>
<tr> <td>{{ item?.loan?.sumReductionAmount }}</td>
<td class="label">CPE</td> <td class="label">剩余待还金额</td>
<td>{{ item?.loan?.cpe?.username }}</td> <td>{{ item?.loan?.remainingAmount }}</td>
<td class="label">分派CPE日期</td> </tr>
<td>{{ item?.loan?.cpeDate }}</td> <tr>
<td class="label">本金余额</td> <td class="label">CPE</td>
<td>{{ item?.loan?.principalBalance }}</td> <td>{{ item?.loan?.cpe?.username }}</td>
<td class="label">案件状态</td> <td class="label">分派CPE日期</td>
<td> <td>{{ item?.loan?.cpeDate }}</td>
{{ <td class="label">本金余额</td>
item?.loan?.caseStatus <td>{{ item?.loan?.principalBalance }}</td>
? caseStatusOpt.find((v) => v.value === item?.loan?.caseStatus).label <td class="label">案件状态</td>
<td>
{{
item?.loan?.caseStatus
? caseStatusOpt.find((v) => v.value === item?.loan?.caseStatus).label
: ''
}}</td
>
</tr>
<tr>
<td class="label">欠息额</td>
<td>{{ item?.loan?.debitInterest }}</td>
<td class="label">手续费</td>
<td>{{ item?.loan?.commission }}</td>
<td class="label">跟进结果</td>
<td>{{
item?.loan?.followStatus
? followStatusOpt.find((v) => v.value === item?.loan?.followStatus).label
: '' : ''
}}</td }}</td>
> <td class="label">跟进状态</td>
</tr> <td>{{
<tr> item?.loan?.phoneResultStatus
<td class="label">欠息额</td> ? phoneResultStatusOpt.find((v) => v.value === item?.loan?.phoneResultStatus)
<td>{{ item?.loan?.debitInterest }}</td> .label
<td class="label">手续费</td> : ''
<td>{{ item?.loan?.commission }}</td> }}</td>
<td class="label">跟进结果</td> </tr>
<td>{{ </tbody>
item?.loan?.followStatus </table>
? followStatusOpt.find((v) => v.value === item?.loan?.followStatus).label </div>
: ''
}}</td>
<td class="label">跟进状态</td>
<td>{{
item?.loan?.phoneResultStatus
? phoneResultStatusOpt.find((v) => v.value === item?.loan?.phoneResultStatus)
.label
: ''
}}</td>
</tr>
</tbody>
</table>
</div> </div>
</div> </div>
</template> </template>
...@@ -119,6 +124,13 @@ ...@@ -119,6 +124,13 @@
console.log('row', row); console.log('row', row);
selectdList.value = row.records; selectdList.value = row.records;
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const reduceTypeOpt = [ const reduceTypeOpt = [
{ label: '结清减免', value: 'settle' }, { label: '结清减免', value: 'settle' },
{ label: '分期减免', value: 'by_stages' }, { label: '分期减免', value: 'by_stages' },
...@@ -296,6 +308,7 @@ ...@@ -296,6 +308,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
}; };
}); });
const query = () => ProTableRef.value?.search(); const query = () => ProTableRef.value?.search();
......
...@@ -47,6 +47,13 @@ ...@@ -47,6 +47,13 @@
console.log('row', row); console.log('row', row);
selectdList.value = row.records; selectdList.value = row.records;
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const options = [ const options = [
{ {
value: 'repay', value: 'repay',
...@@ -192,6 +199,7 @@ ...@@ -192,6 +199,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
}; };
}); });
const query = () => ProTableRef.value?.search(); const query = () => ProTableRef.value?.search();
......
...@@ -39,6 +39,13 @@ ...@@ -39,6 +39,13 @@
} }
return obj; return obj;
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const pushCreditcard = () => { const pushCreditcard = () => {
router.push({ router.push({
path: '/infoGather/customerGather/Creditcard', path: '/infoGather/customerGather/Creditcard',
...@@ -53,6 +60,7 @@ ...@@ -53,6 +60,7 @@
}; };
const config = reactive({ const config = reactive({
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
columns: [ columns: [
{ type: 'checkbox', width: 50 }, { type: 'checkbox', width: 50 },
{ field: 'id', title: '客户ID' }, { field: 'id', title: '客户ID' },
......
...@@ -470,7 +470,6 @@ ...@@ -470,7 +470,6 @@
title: '剩余待还金额', title: '剩余待还金额',
}, },
], ],
onCheckboxChange: onCheckboxChange,
toolbarConfig: { enabled: false }, toolbarConfig: { enabled: false },
}); });
const openModal = (info) => { const openModal = (info) => {
......
...@@ -134,6 +134,13 @@ ...@@ -134,6 +134,13 @@
query(); query();
}, 300); }, 300);
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const config = computed(() => { const config = computed(() => {
return { return {
rowStyle ({ row }) { rowStyle ({ row }) {
...@@ -400,6 +407,7 @@ ...@@ -400,6 +407,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
}; };
}); });
const preview = (item, type) => { const preview = (item, type) => {
......
...@@ -438,8 +438,7 @@ ...@@ -438,8 +438,7 @@
}, },
}, },
}, },
], ]
onCheckboxChange: onCheckboxChange,
}; };
}); });
const openModal = (detail, caselist) => { const openModal = (detail, caselist) => {
......
...@@ -17,43 +17,54 @@ ...@@ -17,43 +17,54 @@
/> />
</el-steps> </el-steps>
</div> </div>
<div id="baseinfo"> <div class="flex">
<div class="box-title">案人基本信息</div> <div class=" w-1/2">
<div class="box-content"> <div id="baseinfo">
<table> <div class="box-title">案人基本信息</div>
<tbody> <div class="box-content">
<tr> <table>
<td class="label">姓名</td> <tbody>
<td>{{ detail?.borrower?.name }}</td> <tr>
<td class="label">电话</td> <td class="label">姓名</td>
<td>{{ detail?.borrower?.phone }}</td> <td>{{ detail?.borrower?.name }}</td>
<td class="label">户籍区域</td> <td class="label">电话</td>
<td>{{ <td>{{ detail?.borrower?.phone }}</td>
detail?.borrower?.domicileCity + ',' + detail?.borrower?.domicileProvince
}}</td> </tr>
</tr> <tr>
<tr> <td class="label">户籍区域</td>
<td class="label">证件号</td> <td>{{
<td>{{ detail?.borrower?.idCard }}</td> detail?.borrower?.domicileCity + ',' + detail?.borrower?.domicileProvince
<td class="label">户籍地址</td> }}</td>
<td colspan="3">{{ detail?.borrower?.address }}</td> <td class="label">证件号</td>
</tr> <td>{{ detail?.borrower?.idCard }}</td>
</tbody> </tr>
<!-- Add more rows as needed --> <tr>
</table> <td class="label">户籍地址</td>
<td colspan="3">{{ detail?.borrower?.address }}</td>
</tr>
</tbody>
<!-- Add more rows as needed -->
</table>
</div>
</div>
</div> </div>
</div> <div class=" w-1/2">
<div id="caserelation"> <div id="caserelation">
<div class="box-title">案件联系人</div> <div class="box-title">案件联系人</div>
<div class="box-content"> <div class="box-content">
<ProTable <ProTable
:config="relationConfig" :config="relationConfig"
:data="guarantorData" :data="guarantorData"
:showPagination="false" :showPagination="false"
:showToolBar="false" :showToolBar="false"
/> />
</div>
</div>
</div> </div>
</div> </div>
<div id="casedetail"> <div id="casedetail">
<div class="box-title" style="line-height: 43px;" <div class="box-title" style="line-height: 43px;"
>案件明细 >案件明细
...@@ -606,14 +617,16 @@ ...@@ -606,14 +617,16 @@
}); });
const relationConfig = reactive({ const relationConfig = reactive({
columns: [ columns: [
{ type: 'seq', width: 70 }, { type: 'seq', width: 49 },
{ {
field: 'name', field: 'name',
width: 89,
title: '联系人姓名', title: '联系人姓名',
showOverflow: 'tooltip', showOverflow: 'tooltip',
}, },
{ {
field: 'kinship', field: 'kinship',
width: 99,
title: '与债权人关系', title: '与债权人关系',
showOverflow: 'tooltip', showOverflow: 'tooltip',
}, },
...@@ -623,31 +636,18 @@ ...@@ -623,31 +636,18 @@
showOverflow: 'tooltip', showOverflow: 'tooltip',
slots: { slots: {
default: ({ row }) => { default: ({ row }) => {
return <>{row.phone + ' ' + (row.status === 'Y' ? '有效' : '无效')}</>; return <>{row.phone + ' ' + (row.status === 'Y' ? '有效' : '无效')} <ElButton
},
},
},
{
field: 'code',
title: '',
fixed: 'right',
slots: {
default: ({ row, rowIndex }) => {
return (
<>
<ElButton
type="primary" type="primary"
onClick={() => callTelephone(row)} onClick={() => callTelephone(row)}
link
disabled={row.status !== 'Y'} disabled={row.status !== 'Y'}
> >
{/* <ElButton type="primary" onClick={() => callTelephone(row)}> */} {/* <ElButton type="primary" onClick={() => callTelephone(row)}> */}
拨打跟进 拨打跟进
</ElButton> </ElButton></>;
</>
);
}, },
}, },
}, }
], ],
toolbarConfig: { enabled: false }, toolbarConfig: { enabled: false },
}); });
...@@ -684,6 +684,12 @@ ...@@ -684,6 +684,12 @@
); );
}; };
const caseDetailConfig = reactive({ const caseDetailConfig = reactive({
rowConfig: {
height: 32
},
cellConfig: {
height: 32
},
columns: [ columns: [
{ type: 'expand', width: 80, slots: { content: 'expand_content' } }, { type: 'expand', width: 80, slots: { content: 'expand_content' } },
{ {
......
...@@ -33,13 +33,13 @@ ...@@ -33,13 +33,13 @@
{ field: 'roleCode', title: '角色编码', search: { el: 'input' } }, { field: 'roleCode', title: '角色编码', search: { el: 'input' } },
{ field: 'roleDesc', title: '角色描述', search: { el: 'input' } }, { field: 'roleDesc', title: '角色描述', search: { el: 'input' } },
{ {
width: 280, width: 320,
title: '操作', title: '操作',
fixed: 'right', fixed: 'right',
slots: { slots: {
default: ({ row }) => ( default: ({ row }) => (
<> <>
<ElButton type="primary" link icon={Edit} onClick={() => handleEdit(row)}> <ElButton type="primary" link icon={Edit} onClick={() => handleEdit(row)} >
编辑 编辑
</ElButton> </ElButton>
<ElButton <ElButton
......
...@@ -368,6 +368,13 @@ ...@@ -368,6 +368,13 @@
}, },
]; ];
const selectdList = ref([]); const selectdList = ref([]);
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const onCheckboxChange = (row) => { const onCheckboxChange = (row) => {
selectdList.value = row.records; selectdList.value = row.records;
}; };
...@@ -471,6 +478,7 @@ ...@@ -471,6 +478,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll,
toolbarConfig: { enabled: false }, toolbarConfig: { enabled: false },
}); });
const openModal = (info) => { const openModal = (info) => {
......
...@@ -133,6 +133,13 @@ ...@@ -133,6 +133,13 @@
query(); query();
}, 300); }, 300);
}; };
const onCheckboxAll =(flag)=> {
if (flag.checked) {
selectdList.value = flag.records;
} else {
selectdList.value = [];
}
}
const config = computed(() => { const config = computed(() => {
return { return {
rowStyle ({ row }) { rowStyle ({ row }) {
...@@ -399,6 +406,7 @@ ...@@ -399,6 +406,7 @@
}, },
], ],
onCheckboxChange: onCheckboxChange, onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll
}; };
}); });
const preview = (item, type) => { const preview = (item, type) => {
......
...@@ -301,6 +301,8 @@ ...@@ -301,6 +301,8 @@
}, },
}, },
], ],
onCheckboxChange: onCheckboxChange,
onCheckboxAll: onCheckboxAll
}); });
const query = () => caseLRef.value?.search(); const query = () => caseLRef.value?.search();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment