xpz2018
8 months ago
5 changed files with 201 additions and 2 deletions
Split View
Diff Options
-
9src/api/clue/index.ts
-
4src/locales/lang/zh-CN/routes/invite.ts
-
25src/router/menu.ts
-
54src/views/market/contract/data.ts
-
111src/views/market/contract/index.vue
@ -0,0 +1,54 @@ |
|||
import { BasicColumn, FormSchema } from '/@/components/Table' |
|||
|
|||
export const contactStatusList = [ |
|||
{ label: '未开始', value: 1 }, |
|||
{ label: '生效中', value: 2 }, |
|||
{ label: '已结束', value: 3 }, |
|||
{ label: '已废弃', value: 4 }, |
|||
] |
|||
|
|||
export const tableColumns: BasicColumn[] = [ |
|||
{ title: '甲方标识', dataIndex: 'firstPartyIdentityNo' }, |
|||
{ width: 110, title: '甲方经办人', dataIndex: 'firstPartyName' }, |
|||
{ title: '乙方标识', dataIndex: 'secondPartyIdentityNo' }, |
|||
{ title: '乙方经办人', dataIndex: 'secondPartyName' }, |
|||
{ width: 90, title: '签订日期', dataIndex: 'signDate' }, |
|||
{ width: 90, title: '开始日期', dataIndex: 'startDate' }, |
|||
{ width: 90, title: '结束日期', dataIndex: 'endDate' }, |
|||
{ width: 80, title: '合同状态', dataIndex: 'status', |
|||
customRender: ({ text }) => { |
|||
return contactStatusList.find((find) => find.value === text)?.label |
|||
}, |
|||
}, |
|||
{ width: 80, title: '合同金额', dataIndex: 'amount' }, |
|||
// { width: 160, title: '付款凭证', dataIndex: 'voucherImageList', slots: { customRender: 'voucherImageList' } },
|
|||
{ width: 160, title: '合同凭证', dataIndex: 'contractImageList', slots: { customRender: 'contractImageList' } }, |
|||
{ width: 120, title: '合同备注', dataIndex: 'remark' }, |
|||
] |
|||
|
|||
export const tableFormSchema: FormSchema[] = [ |
|||
{ |
|||
field: 'datingStoreCustomerIdentityNo', |
|||
label: '客户身份证', |
|||
component: 'Input', |
|||
colProps: { span: 6 }, |
|||
}, |
|||
{ |
|||
field: 'datingStoreCustomerName', |
|||
label: '客户姓名', |
|||
component: 'Input', |
|||
colProps: { span: 6 }, |
|||
}, |
|||
{ |
|||
field: 'datingStoreCustomerPhone', |
|||
label: '客户联系号码', |
|||
component: 'Input', |
|||
colProps: { span: 6 }, |
|||
}, |
|||
{ |
|||
field: 'createTime', |
|||
label: '签订日期', |
|||
component: 'RangePicker', |
|||
colProps: { span: 6 }, |
|||
}, |
|||
] |
|||
@ -0,0 +1,111 @@ |
|||
<template> |
|||
<div class="order-list"> |
|||
<BasicTable @register="registerTable"> |
|||
<template #toolbar> |
|||
<div style="width: 100%; padding: 2px" class="flex-row-center-space"> |
|||
<RadioGroup button-style="solid" v-model:value="radioVal" @change="handleRadioChange"> |
|||
<RadioButton v-for="item in followStatusList" :key="item.value" :value="item.value">{{item.label}}</RadioButton> |
|||
</RadioGroup> |
|||
</div> |
|||
</template> |
|||
<template #contractImageList="{ text }"> |
|||
<ImagePreviewGroup v-if="text && text.length"> |
|||
<Image |
|||
v-for="(item, index) in text" |
|||
style="width: 40px; height: 40px; border-radius: 5px; margin: 0 5px 5px 0" |
|||
:key="index" |
|||
:src="item.url" |
|||
/> |
|||
</ImagePreviewGroup> |
|||
</template> |
|||
<!-- <template #action="{ record }"> |
|||
<div class="flex-col-center-start"> |
|||
<Button style="width: 100px;" type="primary" @click.stop="toDetail(record)">详情</Button> |
|||
</div> |
|||
</template> --> |
|||
</BasicTable> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts"> |
|||
import { Radio } from 'ant-design-vue' |
|||
|
|||
export default { |
|||
name: 'ClueList', |
|||
components: { RadioGroup: Radio.Group, RadioButton: Radio.Button }, |
|||
} |
|||
</script> |
|||
<script setup lang="ts"> |
|||
import moment from 'moment/moment' |
|||
import { computed, ref, reactive } from 'vue' |
|||
import { Avatar, Card, Button, InputNumber, Result } from 'ant-design-vue' |
|||
import { useRouter } from 'vue-router' |
|||
import { tableColumns, tableFormSchema } from './data' |
|||
import { BasicTable, useTable, TableAction } from '/@/components/Table' |
|||
import { getContractList } from '/@/api/clue' |
|||
import Timeline from '../../components/Timeline.vue' |
|||
import Profile from '../../components/Profile.vue' |
|||
import { educationList, maritalList, genderList, followStageList } from '/@/enums/customerEnum' |
|||
|
|||
const [registerTable, { reload, setPagination }] = useTable({ |
|||
bordered: false, |
|||
useSearchForm: true, |
|||
columns: tableColumns, |
|||
showIndexColumn: false, |
|||
showTableSetting: false, |
|||
api: getContractList, |
|||
formConfig: { |
|||
labelWidth: 120, |
|||
schemas: tableFormSchema, |
|||
}, |
|||
beforeFetch: (arg) => { |
|||
const { createTime } = arg |
|||
if (createTime) { |
|||
arg.signDateFrom = moment(createTime[0]).format('YYYY-MM-DD 00:00:00') |
|||
arg.signDateTo = moment(createTime[1]).format('YYYY-MM-DD 23:59:59') |
|||
delete arg.createTime |
|||
} |
|||
arg.status = radioVal.value |
|||
}, |
|||
// actionColumn: { |
|||
// width: 160, |
|||
// title: '操作', |
|||
// fixed: 'right', |
|||
// dataIndex: 'action', |
|||
// slots: { customRender: 'action' }, |
|||
// }, |
|||
}) |
|||
|
|||
const followStatusList = [ |
|||
{ label: '未开始', value: 1 }, |
|||
{ label: '生效中', value: 2 }, |
|||
{ label: '已结束', value: 3 }, |
|||
{ label: '已废弃', value: 4 }, |
|||
{ label: '全部', value: '' }, |
|||
] |
|||
const radioVal = ref<any>('') |
|||
const ageModel = reactive({ |
|||
minAge: '', |
|||
maxAge: '', |
|||
}) |
|||
function handleRadioChange() { |
|||
setPagination({ current: 1 }) |
|||
reload() |
|||
} |
|||
|
|||
const router = useRouter() |
|||
function toDetail(record: any) { |
|||
const { id } = record |
|||
router.push({ |
|||
query: { id }, |
|||
path: '/clue/customer', |
|||
}) |
|||
} |
|||
</script> |
|||
<style scoped lang="less"> |
|||
.single-line { |
|||
overflow: hidden; /* 超出部分隐藏 */ |
|||
white-space: nowrap; /* 文本不换行 */ |
|||
text-overflow: ellipsis; /* 超出部分显示省略号 */ |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save