xpz2018
10 months ago
12 changed files with 1166 additions and 499 deletions
Split View
Diff Options
-
2package.json
-
6src/api/clue/index.ts
-
2src/api/sys/user.ts
-
28src/enums/customerEnum.ts
-
4src/layouts/default/header/index.vue
-
400src/views/clue/clueList/data.ts
-
70src/views/clue/clueList/index.vue
-
76src/views/clue/clueList/modal.vue
-
659src/views/clue/cluePool/data.ts
-
187src/views/clue/cluePool/index.vue
-
196src/views/clue/cluePool/modal.vue
-
35src/views/clue/customer/index.vue
@ -1,76 +0,0 @@ |
|||
<template> |
|||
<BasicModal v-bind="$attrs" :width="960" @ok="handleOk" @register="registerModal"> |
|||
<BasicForm @register="registerForm" style="padding: 16px 48px 0px 0px;"> |
|||
<template #profilePhoto="{ model, field }"> |
|||
<CropperAvatar :value="model[field]" @change="uploadAvatarAfter"/> |
|||
</template> |
|||
</BasicForm> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { ref, unref } from 'vue' |
|||
import { modalFormSchema, basicInfoData } from './data' |
|||
import { useMessage } from '/@/hooks/web/useMessage' |
|||
import { BasicForm, useForm } from '/@/components/Form' |
|||
import { BasicModal, useModalInner } from '/@/components/Modal' |
|||
import { CropperAvatar } from '/@/components/Cropper'; |
|||
import { createClueRecord, editClueRecord } from '/@/api/clue' |
|||
|
|||
const [registerForm, { setFieldsValue, resetFields, validate, getFieldsValue, updateSchema }] = |
|||
useForm({ |
|||
labelWidth: 120, |
|||
schemas: modalFormSchema, |
|||
baseColProps: { span: 22 }, |
|||
showActionButtonGroup: false, |
|||
}) |
|||
|
|||
const ifUpdate = ref<boolean>(false) |
|||
const [registerModal, { setModalProps }] = useModalInner(async (data) => { |
|||
await resetFields() |
|||
ifUpdate.value = !!data.ifUpdate |
|||
setModalProps({ |
|||
minHeight: 50, |
|||
confirmLoading: false, |
|||
title: ifUpdate.value ? '编辑' : '新增线索', |
|||
}) |
|||
await updateSchema({ |
|||
field: 'franchiseFee', |
|||
componentProps: { |
|||
disabled: ifUpdate.value, |
|||
}, |
|||
}) |
|||
if (unref(ifUpdate)) { |
|||
await setFieldsValue({ |
|||
...data.record, |
|||
}) |
|||
} |
|||
}) |
|||
|
|||
function uploadAvatarAfter(value) { |
|||
//修改表单的值 |
|||
setFieldsValue({ |
|||
profilePhoto: value, |
|||
}); |
|||
} |
|||
|
|||
const { createMessage } = useMessage() |
|||
const emits = defineEmits(['success']) |
|||
async function handleOk() { |
|||
try { |
|||
await validate() |
|||
const values: any = getFieldsValue() |
|||
console.log({...values, ...basicInfoData.value}) |
|||
|
|||
setModalProps({ confirmLoading: true }) |
|||
const fun = unref(ifUpdate) ? editClueRecord : createClueRecord |
|||
await fun({...values, ...basicInfoData.value}) |
|||
createMessage.success(`${unref(ifUpdate) ? '编辑' : '新增'}成功！`) |
|||
emits('success') |
|||
} finally { |
|||
setModalProps({ confirmLoading: false }) |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="less"></style> |
|||
@ -0,0 +1,196 @@ |
|||
<template> |
|||
<BasicModal v-bind="$attrs" :width="960" @ok="handleOk" @register="registerModal"> |
|||
|
|||
<template v-if="!ifUpdate" #title> |
|||
<span style="margin: 0 5px">-</span> |
|||
</template> |
|||
|
|||
<div v-if="ifUpdate"> |
|||
<Result title="请将模板Excel文件导入" v-if="tableListRef.length == 0"> |
|||
<template #icon> |
|||
<Icon icon="ant-design:cloud-upload-outlined" size="150px" color="#d6d6d6"/> |
|||
</template> |
|||
<template #extra> |
|||
<ImpExcel @success="loadDataSuccess" dateFormat="YYYY-MM-DD"> |
|||
<Button>导入Excel</Button> |
|||
</ImpExcel> |
|||
</template> |
|||
</Result> |
|||
<BasicTable v-for="(table, index) in tableListRef" |
|||
:key="index" |
|||
:columns="table.columns" |
|||
:canResize="false" |
|||
:dataSource="table.dataSource" |
|||
:pagination="{ pageSize: 10 }" |
|||
/> |
|||
</div> |
|||
|
|||
<div class="flex-col" v-else> |
|||
<Tabs v-model:activeKey="activeKey2" :animated="false"> |
|||
<TabPane key="1" tab="个人资料"> |
|||
<BasicForm @register="registerForm" style="padding: 16px 48px 0px 0px;" > |
|||
<template #profilePhoto="{ model, field }"> |
|||
<CropperAvatar :value="model[field]" @change="uploadAvatarAfter"/> |
|||
</template> |
|||
</BasicForm> |
|||
</TabPane> |
|||
<TabPane key="2" tab="择偶要求"> |
|||
<BasicForm @register="registerForm3" style="padding: 16px 48px 0px 0px;"> |
|||
<template #age="{ model }"> |
|||
<div class="flex-row-center-start"> |
|||
<InputNumber placeholder="请输入" :min="0" v-model:value="model['minAge']" /> |
|||
<span style="margin: 0 5px">-</span> |
|||
<InputNumber placeholder="请输入" :min="0" v-model:value="model['maxAge']" /> |
|||
</div> |
|||
</template> |
|||
<template #height="{ model }"> |
|||
<div class="flex-row-center-start"> |
|||
<InputNumber placeholder="请输入" :min="0" v-model:value="model['minHeight']" /> |
|||
<span style="margin: 0 5px">-</span> |
|||
<InputNumber placeholder="请输入" :min="0" v-model:value="model['maxHeight']" /> |
|||
</div> |
|||
</template> |
|||
<template #income="{ model }"> |
|||
<div class="flex-row-center-start"> |
|||
<InputNumber placeholder="请输入" :min="0" v-model:value="model['minIncome']" /> |
|||
<span style="margin: 0 5px">-</span> |
|||
<InputNumber placeholder="请输入" :min="0" v-model:value="model['maxIncome']" /> |
|||
</div> |
|||
</template> |
|||
</BasicForm> |
|||
</TabPane> |
|||
</Tabs> |
|||
</div> |
|||
|
|||
<template v-if="ifUpdate" #footer> |
|||
<div class="flex-row-center-space"> |
|||
<ImpExcel @success="loadDataSuccess" dateFormat="YYYY-MM-DD"> |
|||
<Button type="primary">导入Excel</Button> |
|||
</ImpExcel> |
|||
<div class="flex-row-center-start"> |
|||
<Button @click="close">取消</Button> |
|||
<Button type="primary" @click="handleOk">确定</Button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
</BasicModal> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { ref, unref } from 'vue' |
|||
import { Tabs, TabPane, Button, Result, InputNumber } from 'ant-design-vue' |
|||
import Icon from '/@/components/Icon' |
|||
import { modalFormSchema, basicInfoData, demandMarriageSchema, demandMarriageMoreData } from './data' |
|||
import { ImpExcel, ExcelData } from '/@/components/Excel'; |
|||
import { BasicTable, BasicColumn } from '/@/components/Table' |
|||
import { useMessage } from '/@/hooks/web/useMessage' |
|||
import { BasicForm, useForm } from '/@/components/Form' |
|||
import { BasicModal, useModalInner } from '/@/components/Modal' |
|||
import { CropperAvatar } from '/@/components/Cropper'; |
|||
import { createClueRecord, editClueRecord } from '/@/api/clue' |
|||
|
|||
const activeKey2 = ref<string>('1') |
|||
|
|||
const [registerForm, { setFieldsValue, resetFields, validate, getFieldsValue, updateSchema }] = |
|||
useForm({ |
|||
labelWidth: 120, |
|||
schemas: modalFormSchema, |
|||
baseColProps: { span: 22 }, |
|||
showActionButtonGroup: false, |
|||
}) |
|||
|
|||
const ifUpdate = ref<boolean>(false) |
|||
const [registerModal, { closeModal, setModalProps }] = useModalInner(async (data) => { |
|||
ifUpdate.value = !!data.ifUpdate |
|||
if(ifUpdate.value){ |
|||
tableListRef.value = []; |
|||
} else { |
|||
demandMarriageMoreData.value = {} |
|||
basicInfoData.value = {} |
|||
activeKey2.value = '1' |
|||
await resetFields() |
|||
// await setFieldsValue3() |
|||
} |
|||
setModalProps({ |
|||
minHeight: 50, |
|||
confirmLoading: false, |
|||
title: ifUpdate.value ? '导入线索' : '新增线索', |
|||
}) |
|||
await updateSchema({ |
|||
field: 'franchiseFee', |
|||
componentProps: { |
|||
disabled: ifUpdate.value, |
|||
}, |
|||
}) |
|||
if (unref(ifUpdate)) { |
|||
await setFieldsValue({ |
|||
...data.record, |
|||
}) |
|||
} |
|||
}) |
|||
|
|||
// 择偶标准表单配置 |
|||
const [registerForm3, { getFieldsValue: getFieldsValue3, setFieldsValue: setFieldsValue3 }] = |
|||
useForm({ |
|||
labelWidth: 100, |
|||
schemas: demandMarriageSchema, |
|||
baseColProps: { span: 22 }, |
|||
showActionButtonGroup: false, |
|||
}) |
|||
|
|||
function close(){ |
|||
closeModal() |
|||
} |
|||
|
|||
function uploadAvatarAfter(value) { |
|||
//修改表单的值 |
|||
setFieldsValue({ |
|||
profilePhoto: value, |
|||
}); |
|||
} |
|||
|
|||
const { createMessage } = useMessage() |
|||
const emits = defineEmits(['success']) |
|||
async function handleOk() { |
|||
try { |
|||
await validate() |
|||
const values: any = getFieldsValue() |
|||
console.log({...values, ...basicInfoData.value}) |
|||
|
|||
setModalProps({ confirmLoading: true }) |
|||
const fun = unref(ifUpdate) ? editClueRecord : createClueRecord |
|||
await fun({...values, ...basicInfoData.value, channelType: 1}) |
|||
createMessage.success(`${unref(ifUpdate) ? '编辑' : '新增'}成功！`) |
|||
emits('success') |
|||
} finally { |
|||
setModalProps({ confirmLoading: false }) |
|||
} |
|||
} |
|||
|
|||
const tableListRef = ref<{ title: string; columns?: any[]; dataSource?: any[];}[]>([]); |
|||
|
|||
function loadDataSuccess(excelDataList: ExcelData[]) { |
|||
tableListRef.value = []; |
|||
console.log(excelDataList); |
|||
for (const excelData of excelDataList) { |
|||
const { |
|||
header, |
|||
results, |
|||
meta: { sheetName }, |
|||
} = excelData; |
|||
const columns: BasicColumn[] = []; |
|||
for (const title of header) { |
|||
columns.push({ title, dataIndex: title }); |
|||
} |
|||
tableListRef.value.push({ title: sheetName, dataSource: results, columns }); |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="less"> |
|||
::v-deep .ant-input-number { |
|||
min-width: 80px; |
|||
width: 100% !important; |
|||
max-width: 100%; |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save