Skip to content

Y
yishuju-ui
Commit f5a91d32 authored by 沈翠玲's avatar 沈翠玲
Browse files
Options

资产详情

parent 2832b938
Show whitespace changes
Inline Side-by-side
Showing with 1165 additions and 16 deletions
src/assets/json/authMenuList.json
View file @ f5a91d32
......@@ -127,6 +127,20 @@
"isKeepAlive": true
}
},
{
"path": "/property/case-detail",
"name": "caseDetail",
"component": "/property/case-detail/index",
"meta": {
"icon": "",
"title": "案件详情",
"isLink": "",
"isHide": true,
"isFull": false,
"isAffix": false,
"isKeepAlive": true
}
},
{
"path": "/property/repair-manage",
"name": "repairManage",
......
src/views/property/case-allocation/index.vue
View file @ f5a91d32
......@@ -11,13 +11,13 @@
<div>未分配总金额数：<span class="blue">1000</span>元</div>
</div>
<div style="display: flex">
<el-button type="primary" @click="allocation"
<el-button type="primary" @click="allocation" :disabled="selectdList.length === 0"
>分配
</el-button>
<el-button type="primary"
<el-button type="primary" :disabled="selectdList.length === 0"
>撤回
</el-button>
<el-button type="primary"
<el-button type="primary" :disabled="selectdList.length === 0"
>撤案
</el-button>
</div>
......@@ -36,7 +36,10 @@
import { reactive, ref } from 'vue';
const allocationModalRef = ref();
const caseLRef = ref();
const showModal = ref(false);
const selectdList = ref([])
const onCheckboxChange = (row) => {
selectdList.value = row.records
}
const config = reactive({
columns: [
{ type: 'checkbox', title: '', width:'40px'},
......@@ -74,7 +77,7 @@
{
field: 'role',
title: '分配中心日期',
search: { el: 'input', props: { clearable: true } },
search: { el: 'date-picker', props: { type: "date", valueFormat: "YYYY-MM-DD" } },
},
{
field: 'role',
......@@ -84,7 +87,7 @@
{
field: 'role',
title: '分配CPE日期',
search: { el: 'input', props: { clearable: true } },
search: { el: 'date-picker', props: { type: "date", valueFormat: "YYYY-MM-DD" } },
},
{
field: 'role',
......@@ -119,10 +122,11 @@
title: '违约金'
}
],
onCheckboxChange: onCheckboxChange
});
const allocation = (row) => {
if (!caseLRef.value.element.getCheckboxRecords() || caseLRef.value.element.getCheckboxRecords().length === 0) return
console.log('111', caseLRef.value.element.getCheckboxRecords() )
console.log('111', selectdList.value)
allocationModalRef.value.openModal(JSON.parse(JSON.stringify(row)));
}
const data = [
......
src/views/property/case-detail/index.vue 0 → 100644
View file @ f5a91d32
<template>
<div class="card content-box">
<div class="navigation-box">
<el-affix :offset="140">
<div @click="anchor('baseinfo')" class="anchor-item">案人基本信息</div>
<div @click="anchor('caserelation')" class="anchor-item">案件联系人</div>
<div @click="anchor('casedetail')" class="anchor-item">案件明细</div>
<div @click="anchor('callrecord')" class="anchor-item">跟进记录</div>
<div @click="anchor('reducerecord')" class="anchor-item">减免记录</div>
<div @click="anchor('splitrecord')" class="anchor-item">分期记录</div>
<div @click="anchor('returnrecord')" class="anchor-item">还款记录</div>
</el-affix>
</div>
<div class="content1">
<div class="btn-grps">
<el-button type="primary" >修复申请</el-button>
<el-button type="primary" >减免申请</el-button>
<el-button type="primary" >分期申请</el-button>
</div>
<div class="detail-steps">
<el-steps style="max-width: 600px" :active="activeStep">
<el-step :title="item.title" :description="item.desc" :class="{current: (index+1) === activeStep}" v-for="(item, index) in stepList" :key="item.title"/>
</el-steps>
</div>
<div id="baseinfo">
<div class="box-title">案人基本信息</div>
<div class="box-content">
<table>
<tr>
<td class="label">姓名</td>
<td>John Doe</td>
<td class="label">电话</td>
<td>30</td>
<td class="label">户籍区域</td>
<td>30</td>
</tr>
<tr>
<td class="label">证件号</td>
<td>johndoe@example.com</td>
<td class="label">户籍地址</td>
<td colspan="3">johndoe@example.com</td>
</tr>
<!-- Add more rows as needed -->
</table>
</div>
</div>
<div id="caserelation">
<div class="box-title">案件联系人</div>
<div class="box-content">
<ProTable :config="relationConfig" :data="relationData" :showPagination="false" :showToolBar="false">
</ProTable>
</div>
</div>
<div id="casedetail">
<div class="box-title">案件明细
<el-button type="primary" @click="foldCaseTree"
>展开/折叠
</el-button>
</div>
<div class="box-content">
<vxe-grid v-bind="caseDetailConfig" ref="caseDetailRef">
<template #expand_content="{ row }">
<div class="expand-box">
<div>User Info</div>
<div class="expand-table">
<table>
<tr>
<td>
<span class="label">User Name：</span>
<span>John Doe</span>
</td>
<td>
<span class="label">Telephone：</span>
<span>John Doe</span>
</td>
<td>
<span class="label">Live：</span>
<span>John Doe</span>
</td>
</tr>
<tr>
<td>
<span class="label">Remark：</span>
<span>John Doe</span>
</td>
<td colspan="2">
<span class="label">Address：</span>
<span>John Doe</span>
</td>
</tr>
<!-- Add more rows as needed -->
</table>
</div>
</div>
</template>
</vxe-grid>
</div>
</div>
<div id="callrecord">
<div class="box-title">跟进记录</div>
<div class="box-content">
<ProTable :config="recordConfig" :data="recordData" :showPagination="false" :showToolBar="false">
</ProTable>
</div>
</div>
<div id="reducerecord">
<div class="box-title">减免记录</div>
<div class="box-content">
<table>
<tr>
<td class="label">减免类型</td>
<td>John Doe</td>
<td class="label">减免申请ID</td>
<td>30</td>
<td class="label">减免申请时间</td>
<td>30</td>
</tr>
<tr>
<td class="label">减免金额（总计）</td>
<td>johndoe@example.com</td>
<td class="label">减免案件数</td>
<td>johndoe@example.com</td>
<td class="label">减免生效时间</td>
<td>johndoe@example.com</td>
</tr>
<!-- Add more rows as needed -->
</table>
<ProTable :config="recordConfig" :data="recordData" :showPagination="false" :showToolBar="false">
</ProTable>
</div>
</div>
<div id="splitrecord">
<div class="box-title">分期记录</div>
<div class="box-content">
<table>
<tr>
<td class="label">分期申请ID</td>
<td>John Doe</td>
<td class="label">还款总额</td>
<td>30</td>
<td class="label">分期申请时间</td>
<td>30</td>
</tr>
<tr>
<td class="label">还款期数</td>
<td>johndoe@example.com</td>
<td class="label">首期还款日</td>
<td>johndoe@example.com</td>
<td class="label">分期生效时间</td>
<td>johndoe@example.com</td>
</tr>
<!-- Add more rows as needed -->
</table>
<ProTable :config="recordConfig" :data="recordData" :showPagination="false" :showToolBar="false">
</ProTable>
</div>
</div>
<div id="returnrecord">
<div class="box-title">还款记录</div>
<div class="box-content">
<ProTable :config="returnConfig" :data="returnData" :showPagination="false" :showToolBar="false">
</ProTable>
</div>
</div>
</div>
</div>
</template>
<script setup lang="jsx" name="caseDetail">
import { useRoute } from 'vue-router'
import { reactive, ref } from 'vue';
import { ElButton } from 'element-plus';
const relationData = ref([]);
const returnData = ref([]);
const recordData = ref([]);
const caseDetailRef = ref()
const route = useRoute()
const detail = JSON.parse(route.query.item)
console.log('detail', detail)
const activeStep = ref(2)
const stepList = ref([
{title: '已分派', desc: 'sadas'},
{title: '跟进中', desc: 'sadas1'},
{title: '还款中', desc: 'sadas1'}
])
const callTelephone = (row) => {}
const returnConfig = reactive({
columns: [
{
field: 'code',
title: '还款记录ID'
},
{
field: 'code',
title: '实际还款金额'
},
{
field: 'code',
title: '实际还款时间'
},
{
field: 'code',
title: '关联减免ID'
},
{
field: 'code',
title: '关联分期ID'
},
{
field: 'code',
title: '关联分期期次'
},
{
field: 'code',
title: '应还金额'
},
{
field: 'code',
title: '借款机构'
}
],
toolbarConfig: {enabled: false}
});
const recordConfig = reactive({
columns: [
{
field: 'code',
title: '跟进记录ID'
},
{
field: 'code',
title: '跟进日期'
},
{
field: 'code',
title: '下次跟进时间'
},
{
field: 'code',
title: '联系人姓名'
},
{
field: 'code',
title: '联系人号码'
},
{
field: 'code',
title: '拨打跟进结果'
},
{
field: 'code',
title: '拨打处置状态'
},
{
field: 'code',
title: '备注'
},
{
field: 'code',
title: '通话录音'
},
{
field: 'code',
title: '微信图片附件',
slots: {
default: ({row, rowIndex}) => {
return (
<>
<ElButton type="primary" link onClick={() => callTelephone(row)}>
下载
</ElButton>
</>
);
}
}
}
],
toolbarConfig: {enabled: false}
});
const relationConfig = reactive({
columns: [
{ type: 'seq', width: 70 },
{
field: 'code',
title: '联系人姓名'
},
{
field: 'code',
title: '与债权人关系'
},
{
field: 'code',
title: '号码类型'
},
{
field: 'code',
title: '号码'
},
{
field: 'code',
title: '',
slots: {
default: ({row, rowIndex}) => {
return (
<>
<ElButton type="primary" onClick={() => callTelephone(row)}>
拨打跟进
</ElButton>
</>
);
}
}
}
],
toolbarConfig: {enabled: false}
});
const returnCrash = (row) => {
}
const caseDetailConfig = reactive({
columns: [
{ type: 'expand', width: 80, slots: { content: 'expand_content' } },
{
field: 'code',
title: '案件ID'
},
{
field: 'code',
title: '产品'
},
{
field: 'code',
title: '借款机构'
},
{
field: 'code',
title: '备案金额'
},
{
field: 'code',
title: '累计减免金额'
},
{
field: 'code',
title: '累计还款金额'
},
{
field: 'code',
title: '剩余待还金额'
},
{
field: 'code',
title: '',
slots: {
default: ({row, rowIndex}) => {
return (
<>
<ElButton type="primary" onClick={() => returnCrash(row)}>
还款
</ElButton>
</>
);
}
}
}
],
data: [
{ id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', age: 28, address: 'test abc' },
{ id: 10002, name: 'Test2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou' },
{ id: 10003, name: 'Test3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai' },
{ id: 10004, name: 'Test4', role: 'Designer', sex: 'Women', age: 24, address: 'Shanghai' }
],
toolbarConfig: {enabled: false}
});
const anchor = (type) => {
console.log('sadasda0', type)
document.querySelector(`#${type}`).scrollIntoView(true)
}
const foldCaseTree = () => {
if(caseDetailRef.value?.getRowExpandRecords().length === caseDetailConfig.data.length){
caseDetailRef.value?.setAllRowExpand(false)
} else {
caseDetailRef.value?.setAllRowExpand(true)
}
}
recordData.value = [
{ name: 'admin', code: 'admin', role: 'superadmin',num: 1 },
{ name: 'account1', code: 'account1', role: 'user',num: 1 },
{ name: 'account2', code: 'account2', role: 'user',num: 1 },
{ name: 'account3', code: 'account3', role: 'user',num: 1 },
];
relationData.value = [
{ name: 'admin', code: 'admin', role: 'superadmin',num: 1 },
{ name: 'account1', code: 'account1', role: 'user',num: 1 },
{ name: 'account2', code: 'account2', role: 'user',num: 1 },
{ name: 'account3', code: 'account3', role: 'user',num: 1 },
];
returnData.value = [
{ name: 'admin', code: 'admin', role: 'superadmin',num: 1 },
{ name: 'account1', code: 'account1', role: 'user',num: 1 },
{ name: 'account2', code: 'account2', role: 'user',num: 1 },
{ name: 'account3', code: 'account3', role: 'user',num: 1 },
];
</script>
<style lang="scss" scoped>
.content-box {
.navigation-box {
position: absolute;
right: 33px;
z-index: 2;
width: 200px;
border-radius: 5px;
padding-left: 40px;
background: #fff;
font-size: 14px;
color: rgba(0,0,0,0.88);
.anchor-item {
position: relative;
padding-bottom: 20px;
cursor: pointer;
&::before {
display: block;
content: '';
position: absolute;
width: 10px;
height: 10px;
border-radius: 100%;
border: 3px solid rgba(22, 119, 255, 1);
left: -30px;
top: 7px;
}
&::after {
position: absolute;
height: 100%;
width: 1px;
background: rgba(0,0,0,0.06);
display: block;
top: 10px;
content: '';
left: -25px;
}
&:last-child::after{
display: none;
}
}
}
.content1{
width: 100%;
height: 100%;
}
}
.detail-steps {
margin-top: 20px;
margin-left: 10px;
:deep(.el-step__icon) {
height: 8px;
border: none;
width: 8px;
overflow: hidden;
background: #1677FF;
.el-step__icon-inner{
display: none;
}
}
:deep(.is-process), :deep(.is-wait) {
.el-step__icon {
background: rgba(0,0,0,0.45);
}
}
:deep(.el-step__title.is-finish) {
color: #000;
font-weight: 400;
}
:deep(.el-step__title.is-process), :deep(.el-step__title.is-process) {
color: rgba(0,0,0,0.45);
font-weight: 400;
}
:deep(.el-step__head) {
left: 20px;
.el-step__line {
left: 14px;
top: 13px;
height: 1px;
right: 8px;
}
}
:deep(.el-step__description) {
color: rgba(0,0,0,0.45);
}
.el-step.current {
:deep(.el-step__icon) {
height: 10px;
width: 10px;
}
:deep(.el-step__title.is-finish) {
color: #000;
font-weight: 600;
}
:deep(.el-step__description) {
color: #000;
}
}
}
.btn-grps {
padding-left: 30px;
}
.box-title {
font-weight: 600;
font-size: 18px;
color: #000000;
line-height: 70px;
border-bottom: 1px solid rgba(0,0,0,0.06);
margin-bottom: 10px;
margin-top: 10px;
}
.box-content {
padding-right: 40px;
:deep(.card) {
padding: 0;
border: none;
}
}
#baseinfo, #reducerecord, #splitrecord {
table {
width: 100%;
border-collapse: collapse;
}
td {
border: 1px solid rgba(5,5,5,0.06);
background: #fff;
padding: 8px;
width: 240px;
&.label {
width: 125px;
background: #f5f7f9;
}
}
}
.expand-box{
background: #F0EAEA;
padding: 20px;
.expand-table {
color: #000;
table {
width: 100%;
}
tr {
line-height: 32px;
}
td {
border: none;
span.label {
color: rgba(0,0,0,0.45);
font-size: 14px;
}
}
}
}
</style>
\ No newline at end of file
src/views/property/case-manage/components/caseModal.vue 0 → 100644
View file @ f5a91d32
<template>
<vxe-modal
v-model="showModal"
title="案件分派"
@hide="onHide"
max-height="582"
width="1003"
show-footer
esc-closable
>
<div class="allocation-wrap">
<div class="top">
<div class="number-box">
<div class="number-left">
<div class="icon-wrapper">
<el-icon><UserFilled size="850" /></el-icon>
</div>
</div>
<div class="number-right">
<p>待分派案人人数</p>
<p>{{currentAccount.people}}</p>
</div>
</div>
<div class="number-box">
<div class="number-left">
<div class="icon-wrapper">
<el-icon><List /></el-icon>
</div>
</div>
<div class="number-right">
<p>待分派案件数量</p>
<p>{{currentAccount.case}}</p>
</div>
</div>
<div class="number-box">
<div class="number-left">
<div class="icon-wrapper">
<el-icon><UserFilled size="850" /></el-icon>
</div>
</div>
<div class="number-right">
<p>待分派金额</p>
<p>{{currentAccount.money}}</p>
</div>
</div>
</div>
<div class="Content">
<template v-if="!step">
<div style="margin-top:10px;margin-bottom: 10px;">
<el-radio-group v-model="radio">
<el-radio :value="0">分配到调解中心</el-radio>
<el-radio :value="1">分配到CPE</el-radio>
</el-radio-group>
</div>
<div class="mainContent">
<div class="tree-wrapper">
<el-tree
:data="data"
:props="defaultProps"
@node-click="handleNodeClick"
/>
</div>
<el-transfer v-model="value1" :data="data1" :titles="['CPE', '已选CPE']" ref="mytransfer" @left-check-change="leftChange" />
</div>
</template>
<template v-else>
<p>分派方案</p>
<div class="idea-box">
<div class="left-idea">
<div class="idea-btn">
<el-button type="primary" :plain="currentAllBtn === 1 ? false:true" @click="chooseIdea(1)">以案人数均分</el-button>
<el-button type="primary" :plain="currentAllBtn === 2 ? false:true" @click="chooseIdea(2)">以案件数均分</el-button>
<el-button type="primary" :plain="currentAllBtn === 3 ? false:true" @click="chooseIdea(3)">以委案金额均分</el-button>
</div>
<div class="reset-btn">
<el-button type="primary" link :icon="RefreshRight" @click="resetAllocation">重新分配</el-button>
</div>
</div>
<div class="right-idea">
<ProTable :config="config" :data="tabledata" ref="caseLRef" :showPagination="false" :showToolBar="false">
</ProTable>
</div>
</div>
</template>
</div>
</div>
<template #footer>
<el-button @click="backform" v-if="step" style="float:left;">上一步</el-button>
<el-button type="default" @click="showModal = false">取消</el-button>
<el-button type="primary" @click="submitForm" v-if="step || radio === 0">确认提交</el-button>
<el-button type="primary" @click="submitForm" v-else>下一步</el-button>
</template>
</vxe-modal>
</template>
<script setup lang="jsx" name="allocationModal">
import { UserFilled } from '@element-plus/icons-vue';
import { RefreshRight } from '@element-plus/icons-vue';
import { ElInputNumber } from 'element-plus';
import { computed } from 'vue';
import { reactive, ref } from 'vue';
const data = ref([]);
const mytransfer = ref();
const tabledata = ref([]);
const showModal = ref(false);
const currentAccount = ref({people: 0, case: 0, money:0});
const currentAllBtn = ref(1);
const editRowIndex = ref(-1);
const radio = ref(0);
const step = ref(0);
const onHide = () => {
currentAccount.value = {people: 0, case: 0, money:0};
};
const openModal = (account) => {
showModal.value = true;
currentAccount.value = {people: 333, case: 44, money:1111};
step.value = 0
radio.value = 0
currentAllBtn.value = 1
editRowIndex.value = -1
};
const backform = () => {
step.value = 0
}
const submitForm = () => {
if(step.value || radio.value === 0) {
} else {
step.value = 1
}
};
const handleNodeClick = (data) => {
console.log(data)
}
const chooseIdea = (type) => {
editRowIndex.value = -1
currentAllBtn.value = type
}
const resetAllocation = () => {
editRowIndex.value = -1
}
const changeNum = (type, row, index) => {
editRowIndex.value = index
console.log('changeNum', type, row, index)
}
const leftChange = (value, direction) => {
console.log(value, direction)//这个就是它包含的所有的属性以及事件，如果需要别的操作直接执行，也可以查询到
}
data.value = [
{
label: 'Level one 1',
children: [
{
label: 'Level two 1-1',
children: [
{
label: 'Level three 1-1-1',
},
],
},
],
},
{
label: 'Level one 2',
children: [
{
label: 'Level two 2-1',
children: [
{
label: 'Level three 2-1-1',
},
],
},
{
label: 'Level two 2-2',
children: [
{
label: 'Level three 2-2-1',
},
],
},
],
},
{
label: 'Level one 3',
children: [
{
label: 'Level two 3-1',
children: [
{
label: 'Level three 3-1-1',
},
],
},
{
label: 'Level two 3-2',
children: [
{
label: 'Level three 3-2-1',
},
],
},
],
},
]
const config = computed(() => {
// 去除分页控件，toolbar控件
return {
toolbarConfig: {enabled: false},
columns: [
{ type: 'seq', width: 50,title: '序号' },
{
field: 'code',
title: 'CPE'
},
{
field: 'code',
title: '分派案人数',
slots: {
default: ({row, rowIndex}) => {
if (currentAllBtn.value === 1) {
return (
<>
<ElInputNumber v-model={row.num} onChange={() => changeNum(1, row, rowIndex)} disabled={editRowIndex.value > -1 && editRowIndex.value!== rowIndex} />
</>
);
} else {
return (
<>{row.num}</>
)
}
},
}
},
{
field: 'code',
title: '分派案件数',
slots: {
default: ({row, rowIndex}) => {
if (currentAllBtn.value === 2) {
return (
<>
<ElInputNumber v-model={row.num} onChange={() => changeNum(2, row, rowIndex)} disabled={editRowIndex.value > -1 && editRowIndex.value!== rowIndex} />
</>
);
} else {
return (
<>{row.num}</>
)
}
},
}
},
{
field: 'code',
title: '分派委案金额',
slots: {
default: ({row, rowIndex}) => {
if (currentAllBtn.value === 3) {
return (
<>
<ElInputNumber v-model={row.num} onChange={() => changeNum(3, row, rowIndex)} disabled={editRowIndex.value > -1 && editRowIndex.value!== rowIndex} />
</>
);
} else {
return (
<>{row.num}</>
)
}
},
}
}
],
};
});
tabledata.value = [
{ name: 'admin', code: 'admin', role: 'superadmin',num: 1 },
{ name: 'account1', code: 'account1', role: 'user',num: 1 },
{ name: 'account2', code: 'account2', role: 'user',num: 1 },
{ name: 'account3', code: 'account3', role: 'user',num: 1 },
];
const generateData = () => {
const data = []
for (let i = 1; i <= 15; i++) {
data.push({
key: i,
label: `Option ${i}`
})
}
return data
}
const data1 = ref(generateData())
const value1 = ref([])
const defaultProps = {
children: 'children',
label: 'label',
}
defineExpose({
openModal,
});
</script>
<style lang="scss" scoped>
.allocation-wrap {
height: 100%;
.top {
display: flex;
.number-box {
font-size: 15px;
width: 235px;
padding: 5px 0 5px 15px;
border: 1px solid #f1f1f1;
height: 50px;
display: flex;
margin-left: 10px;
}
.icon-wrapper {
width: 40px;
height: 40px;
text-align: center;
line-height: 40px;
color: #bbc3ca;
border: 2px solid #bbc3ca;
border-radius: 100%;
margin-right: 10px;
font-size: 37px;
}
}
.number-right {
p:nth-child(1){
color: #cacaca;
font-size: 13px;
}
}
}
.Content {
height: calc(100% - 50px);
.idea-box{
height: calc(100% - 24px);
display: flex;
}
.left-idea{
width: 250px;
border: 1px solid #ebeef5;
display: flex;
flex-direction: column;
}
.right-idea {
width: calc(100% - 250px);
:deep(.card) {
padding: 0;
}
}
.idea-btn {
display: flex;
flex-direction: column;
align-items: center;
border-bottom: 1px solid #ebeef5;
padding-bottom: 10px;
.el-button {
width: 150px;
margin-left: 0 !important;
margin-top: 15px;
}
}
.reset-btn {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
}
.mainContent {
display: flex;
.tree-wrapper {
border: 1px solid #ebeef5;
width: 290px;
height: 318px;
}
:deep(.el-transfer-panel .el-transfer-panel__header) {
border-top-left-radius: 0;
background: #fff;
border-top-right-radius: 0;
}
:deep(.el-transfer__buttons) {
padding: 0 5px;
}
:deep(.el-transfer-panel) {
width: 250px;
}
}
</style>
src/views/property/case-manage/index.vue
View file @ f5a91d32
<template>
<div class="card content-box">
<span class="text"> 案件处置 🍓🍇🍈🍉</span>
<div class="table-inner">
<ProTable :config="config" :data="data" ref="caseLRef">
<template #left_buttons>
<div class="topgrp">
<div class="topbox">
<div class="topinner">
<p>统计值</p>
<p>111</p>
</div>
</div>
</div>
</template>
</ProTable>
</div>
<caseModal ref="caseModalRef" />
</div>
</template>
<script setup name="systemLog"></script>
<script setup name="case-manage">
import caseModal from './components/caseModal.vue';
import { useRouter } from 'vue-router'
import { reactive, ref } from 'vue';
const caseModalRef = ref();
const caseLRef = ref();
const router = useRouter()
const options = ref([])
const onCellClick = ({row, rowIndex}) => {
let obj = JSON.stringify(row)
router.push({
path: '/property/case-detail',
query: { item: obj }, //这里不能直接写成 query: JSON.stringify(item)
})
}
const config = reactive({
columns: [
{ field: 'name', title: '案件ID', search: { el: 'input' } },
{
field: 'code',
title: '借款机构',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'code',
title: '资管公司',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '借款人姓名',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '身份证',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '手机号',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '委案金额',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '累计还款金额',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '累计减免金额',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '剩余待还金额',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: 'CPE',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '分配CPE日期',
search: { el: 'date-picker', props: { type: "date", valueFormat: "YYYY-MM-DD" } },
},
{
field: 'role',
title: '本金余额',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '欠息额',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '手续费',
search: { el: 'input', props: { clearable: true } },
},
{
field: 'role',
title: '跟进结果',
enum: options,
search: { el: 'select', props:{filterable:true },span: 1 },
fieldNames:{ label:"genderLabel", value: "genderValue" }
},
{
field: 'role',
title: '跟进状态',
enum: options,
search: { el: 'select', props:{filterable:true },span: 1 },
fieldNames:{ label:"genderLabel", value: "genderValue" }
},
{
field: 'role',
title: '案件状态',
enum: options,
search: { el: 'select', props:{filterable:true },span: 1 },
fieldNames:{ label:"genderLabel", value: "genderValue" }
}
],
onCellClick: onCellClick
});
const allocation = (row) => {
if (!caseLRef.value.element.getCheckboxRecords() || caseLRef.value.element.getCheckboxRecords().length === 0) return
console.log('111', caseLRef.value.element.getCheckboxRecords() )
caseModalRef.value.openModal(JSON.parse(JSON.stringify(row)));
}
const data = [
{ name: 'admin', code: 'admin', role: 'superadmin' },
{ name: 'account1', code: 'account1', role: 'user' },
{ name: 'account2', code: 'account2', role: 'user' },
{ name: 'account3', code: 'account3', role: 'user' },
];
</script>
<style lang="scss" scoped>
.table-inner {
width: 100%;
:deep(.topgrp) {
display: flex;
margin-bottom: 8px;
.topbox {
margin-right: 10px;
background: rgba(0,0,0,0.02);
border-radius: 16px;
width: 146px;
height: 97px;
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
p:nth-child(1) {
font-size: 14px;
color: rgba(0,0,0,0.45);
}
}
}
:deep(.card) {
border: none;
box-shadow: none;
}
}
</style>
src/views/property/import/index.vue
View file @ f5a91d32
......@@ -92,27 +92,27 @@
const isFold = ref(true);
const config = reactive({
columns: [
{ field: 'name', title: '导入编号', search: { el: 'input', span: 1.5, props: { clearable: true } } },
{ field: 'name', title: '委案合同', search: { el: 'input', span: 1.5, props: { clearable: true } } },
{ field: 'name', title: '导入编号', search: { el: 'input', span: 1, props: { clearable: true } } },
{ field: 'name', title: '委案合同', search: { el: 'input', span: 1, props: { clearable: true } } },
{
field: 'code',
title: '资产类型',
enum: options,
search: { el: 'select', props:{filterable:true }, span: 1.5 },
search: { el: 'select', props:{filterable:true }, span: 1 },
fieldNames:{ label:"genderLabel", value: "genderValue" }
},
{
field: 'role',
title: '借款平台',
enum: options,
search: { el: 'select', props:{filterable:true }, span: 1.5 },
search: { el: 'select', props:{filterable:true }, span: 1 },
fieldNames:{ label:"genderLabel", value: "genderValue" }
},
{
field: 'role',
title: '资管公司',
enum: options,
search: { el: 'select', props:{filterable:true },span: 1.5 },
search: { el: 'select', props:{filterable:true },span: 1 },
fieldNames:{ label:"genderLabel", value: "genderValue" }
},
{
......@@ -162,7 +162,7 @@
{
field: 'role',
title: '创建日期',
search: { el: 'date-picker', props: { type: "daterange", valueFormat: "YYYY-MM-DD" },span: 1.5 },
search: { el: 'date-picker', props: { type: "daterange", valueFormat: "YYYY-MM-DD" },span: 1 },
},
],
});
......
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