huoran
/
FE_sandTable
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

系统买方

Browse Source
V0.1
yujialong 1 year ago
parent 3a07f53216
commit cda5fee482
4 changed files with 334 additions and 77 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      src/api/config.ts
  2. 15
      src/components/Search.vue
  3. 1
      src/utils/request.ts
  4. 388
      src/views/config/Buyer.vue

7
src/api/config.ts
Unescape View File

@ -1,5 +1,8 @@
import axios from '@/utils/request';
export const systemBuyerAdd = async (data: Record<string, any>): Promise<any> => (await axios.post('/product/systemBuyer/add', data)).data;
export const saveOrUpdate = async (data: Record<string, any>): Promise<any> => (await axios.post('/product/systemBuyer/saveOrUpdate', data)).data;
export const systemBuyerFind = async (): Promise<any> => (await axios.post('/product/systemBuyer/details')).data;
export const systemBuyerUpdate = async (data: Record<string, any>): Promise<any> => (await axios.post('/product/systemBuyer/update', data)).data;
export const ages = async (): Promise<any> => (await axios.post('/product/ages/list')).data;
export const edu = async (): Promise<any> => (await axios.post('/product/edu/list')).data;
export const accountType = async (): Promise<any> => (await axios.post('/product/accountType/list')).data;
export const buyerType = async (): Promise<any> => (await axios.post('/product/buyerType/list')).data;

15
src/components/Search.vue
Unescape View File

@ -11,7 +11,7 @@
</template>
<script setup lang="ts">
import { watch, computed, ref } from 'vue';
import { computed, ref } from 'vue';
const props = defineProps({
modelValue: { type: String, default: '' },
@ -25,21 +25,8 @@ const val = computed({
timer.value = setTimeout(() => {
emit('update:modelValue', value);
}, 500);
// emit('update:modelValue', value)
},
});
// watch(
// () => props.modelValue,
// (val) => {
// clearTimeout(timer.value);
// timer.value = setTimeout(() => {
// emit('update:modelValue', val);
// }, 500);
// },
// {
// deep: true,
// },
// );
</script>
<style lang="scss" scoped>

1
src/utils/request.ts
Unescape View File

@ -30,7 +30,6 @@ service.interceptors.response.use(
status,
},
} = e;
console.log('🚀 ~ file: request.ts:27 ~ e:', e, status, message);
const {
global: { t },
} = i18n;

388
src/views/config/Buyer.vue
Unescape View File

@ -1,131 +1,411 @@
<template>
<h6 class="title">城市人口及年龄参数</h6>
<el-table class="c-table"
ref="table"
v-loading="loading"
:data="list"
border
@sort-change="handleSort">
:data="form.ageAduRatioList"
:span-method="ageSpan"
border>
<el-table-column prop="productName"
label="城市总人口 (人)"
align="center">
<el-input maxlength="20"></el-input>
<template #default="{ row }">
<el-input v-model.number="row.totalPopulation"
placeholder="请输入"
type="number"
min="0"></el-input>
</template>
</el-table-column>
<el-table-column prop="productNumber"
<el-table-column prop="ageStage"
label="年龄 (岁)"
align="center"></el-table-column>
<el-table-column prop="parentIds"
<el-table-column prop="ageRatio"
label="年龄占比 (%)"
align="center">
<el-input maxlength="3"></el-input>
<template #default="{ row }">
<el-input v-model="row.ageRatio"
placeholder="请输入"></el-input>
</template>
</el-table-column>
</el-table>
<h6 class="title mt-7">学历参数</h6>
<el-table class="c-table"
ref="table"
v-loading="loading"
:data="list"
border
@sort-change="handleSort">
<el-table-column prop="productName"
:data="edus"
:span-method="eduSpan"
border>
<el-table-column prop="ageStage"
label="年龄 (岁)"
align="center"> </el-table-column>
<el-table-column prop="productNumber"
<el-table-column prop="education"
label="学历"
align="center"></el-table-column>
<el-table-column prop="parentIds"
label="学历占比 (%)"
align="center">
<el-input maxlength="3"></el-input>
<template #default="{ row }">
<el-input v-model="row.eduRatio"
placeholder="请输入"></el-input>
</template>
</el-table-column>
</el-table>
<h6 class="title mt-7">企业数量配置</h6>
<el-table class="c-table"
ref="table"
v-loading="loading"
:data="list"
border
@sort-change="handleSort">
:data="form.enterpriseNumList"
border>
<el-table-column prop="productName"
label="城市总人口 (人)"
align="center"> </el-table-column>
label="企业类型"
align="center">
<template #default="{ row }">
{{ row.enterpriseType == 1 ? '小微企业' : '创业企业' }}
</template>
</el-table-column>
<el-table-column prop="parentIds"
label="城市总人口 (人)"
label="企业数量（家）"
align="center">
<el-input maxlength="3"></el-input>
<template #default="{ row }">
<el-input v-model.number="row.number"
placeholder="请输入"
maxlength="3"
type="number"
min="0"></el-input>
</template>
</el-table-column>
</el-table>
<h6 class="title mt-7">单个商品每日需求量</h6>
<el-table class="c-table"
ref="table"
v-loading="loading"
:data="list"
border
@sort-change="handleSort">
<el-table-column prop="productName"
:data="form.commodityDemandList"
border>
<el-table-column prop="typeName"
label="买家类型"
min-width="100"
align="center"> </el-table-column>
<el-table-column prop="parentIds"
label="买家总占比 (%)"
min-width="100"
align="center">
<el-input maxlength="3"></el-input>
<template #default="{ row }">
<el-input v-model="row.buyerRatio"
placeholder="请输入"></el-input>
</template>
</el-table-column>
<el-table-column prop="parentIds"
label="每次需求人数占比 (%)"
min-width="130"
align="center">
<el-input maxlength="3"></el-input>
<template #default="{ row }">
<el-input v-model="row.peopleNumRatio"
placeholder="请输入"></el-input>
</template>
</el-table-column>
<el-table-column prop="parentIds"
label="单个买家单次需求"
min-width="200"
align="center">
<el-input maxlength="3"></el-input>
<template #default="{ row }">
<div class="flex items-center">
<template v-if="row.typeId == 7 || row.typeId == 8">
<span class="mr-2 whitespace-nowrap">一个保险产品一次最多购买</span>
<el-input v-model="row.buyerSingleDemand"
placeholder="请输入"></el-input>
<span class="ml-2">份</span>
</template>
<template v-else>
<span class="mr-2 whitespace-nowrap">{{ row.typeId == 9 ? '投入' : '贷款' }}</span>
<el-input v-model="row.buyerSingleDemandMin"
placeholder="请输入"></el-input>
<span class="mx-2">~</span>
<el-input v-model="row.buyerSingleDemandMax"
placeholder="请输入"></el-input>
<span class="ml-2 whitespace-nowrap">万元</span>
</template>
</div>
</template>
</el-table-column>
</el-table>
<h6 class="title mt-7">系统账户起始金额</h6>
<el-form class="w-[300px]"
:model="form"
<el-form v-if="form.moneyAllocationList.length"
class="w-[300px]"
label-width="120px"
label-suffix="：">
<el-form-item label="银行账户">
<el-input v-model="form.name">
<el-input v-model="form.moneyAllocationList[0].startingAmount">
<template #suffix> 万元 </template>
</el-input>
</el-form-item>
<el-form-item label="保险账户">
<el-input v-model="form.name">
<el-input v-model="form.moneyAllocationList[1].startingAmount">
<template #suffix> 万元 </template>
</el-input>
</el-form-item>
<el-form-item label="基金账户">
<el-input v-model="form.name">
<el-input v-model="form.moneyAllocationList[2].startingAmount">
<template #suffix> 万元 </template>
</el-input>
</el-form-item>
</el-form>
<div class="flex justify-end">
<div class="submit">保存修改</div>
<div class="submit"
@click="submit">保存修改</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { ElMessage } from 'element-plus';
import { systemBuyerAdd, systemBuyerFind } from '@/api/config';
import type { TableColumnCtx } from 'element-plus';
import { saveOrUpdate, systemBuyerFind, ages, edu, accountType, buyerType } from '@/api/config';
import _ from 'lodash';
const list = ref<Array<any>>([]);
const form = ref<Object>({});
const added = ref<number>(0);
const edus = ref<Record<string, any>[]>([]);
const form = ref<Record<string, any>>({
ageAduRatioList: [],
commodityDemandList: [],
enterpriseNumList: [
{
enterpriseType: 1,
number: '',
},
{
enterpriseType: 2,
number: '',
},
],
moneyAllocationList: [],
});
// 配置项
const getInfo = async () => {
const { process } = await systemBuyerFind();
config.value = process;
edus.value = [];
const res = await edu();
const { list } = await ages();
list.map((e) => {
res.list.map((n) => {
edus.value.push({
eduRatio: '',
...n,
...e,
});
});
e.ageRatio = '';
e.totalPopulation = '';
});
form.value.ageAduRatioList = list;
const { data } = await buyerType();
data.map((e) => {
e.buyerRatio = '';
e.buyerSingleDemand = '';
e.buyerSingleDemandMin = '';
e.buyerSingleDemandMax = '';
e.peopleNumRatio = '';
});
form.value.commodityDemandList = data;
const res1 = await accountType();
res1.list.map((e) => {
e.startingAmount = '';
});
form.value.moneyAllocationList = res1.list;
// 以上的是每个模块的每行名称，下面的是整块的详情
const { systemBuyerDTO } = await systemBuyerFind();
if (systemBuyerDTO.ageAduRatioList.length) {
edus.value = _.merge(edus.value, systemBuyerDTO.ageAduRatioList.splice(6));
added.value = 1;
}
systemBuyerDTO.commodityDemandList.map((e) => {
if (e.typeId != 7 && e.typeId != 8 && e.buyerSingleDemand.includes('-')) {
const val = e.buyerSingleDemand.split('-');
e.buyerSingleDemandMin = val[0];
e.buyerSingleDemandMax = val[1];
}
});
_.merge(form.value, systemBuyerDTO);
console.log('🚀 ~ file: Buyer.vue:236 ~ getInfo ~ form.value:', form.value);
};
const submit = async () => {
const param = JSON.parse(JSON.stringify(form.value));
let invalid = 0;
// 年龄
if (param.ageAduRatioList[0].totalPopulation === '') return ElMessage.error('请输入城市总人口');
param.ageAduRatioList.some((e) => {
if (e.ageRatio === '') {
ElMessage.error('请输入年龄占比');
invalid = 1;
return true;
}
if (isNaN(e.ageRatio)) {
ElMessage.error('请输入合理的年龄占比');
invalid = 1;
return true;
}
if (e.ageRatio < 0) {
ElMessage.error('年龄占比不得小于0');
invalid = 1;
return true;
}
});
if (invalid) return false;
if (_.sum(param.ageAduRatioList.map((e) => +e.ageRatio)) > 100) return ElMessage.error('占比总和不得超过100%');
// 学历
edus.value.some((e) => {
if (e.eduRatio === '') {
ElMessage.error('请输入学历占比');
invalid = 1;
return true;
}
if (isNaN(e.eduRatio)) {
ElMessage.error('请输入合理的学历占比');
invalid = 1;
return true;
}
if (e.eduRatio < 0) {
ElMessage.error('学历占比不得小于0');
invalid = 1;
return true;
}
});
if (invalid) return false;
// 企业数量配置
param.enterpriseNumList.some((e) => {
if (e.number === '') {
ElMessage.error('请输入企业数量');
invalid = 1;
return true;
}
if (isNaN(e.number)) {
ElMessage.error('请输入合理的企业数量');
invalid = 1;
return true;
}
if (e.number < 0) {
ElMessage.error('企业数量不得小于0');
invalid = 1;
return true;
}
});
if (invalid) return false;
// 单个商品每日需求量
param.commodityDemandList.some((e) => {
if (e.buyerRatio === '') {
ElMessage.error('请输入买家总占比');
invalid = 1;
return true;
}
if (isNaN(e.buyerRatio) || e.buyerRatio < 0 || e.buyerRatio > 100) {
ElMessage.error('请输入合理的买家总占比');
invalid = 1;
return true;
}
if (e.peopleNumRatio === '') {
ElMessage.error('请输入每次需求人数占比');
invalid = 1;
return true;
}
if (isNaN(e.peopleNumRatio) || e.peopleNumRatio < 0 || e.peopleNumRatio > 100) {
ElMessage.error('请输入合理的每次需求人数占比');
invalid = 1;
return true;
}
if (e.typeId != 7 && e.typeId != 8 && (e.buyerSingleDemandMin === '' || e.buyerSingleDemandMax === '')) {
console.log('🚀 ~ file: Buyer.vue:323 ~ param.commodityDemandList.some ~ e:', e);
ElMessage.error('请输入单个买家单次需求1');
invalid = 1;
return true;
}
if (e.typeId != 7 && e.typeId != 8 && (isNaN(e.buyerSingleDemandMin) || isNaN(e.buyerSingleDemandMax))) {
ElMessage.error('请输入合理的单个买家单次需求');
invalid = 1;
return true;
}
if (e.typeId != 7 && e.typeId != 8 && (e.buyerSingleDemandMin < 0 || e.buyerSingleDemandMax < 0)) {
ElMessage.error('单个买家单次需求不得小于0');
invalid = 1;
return true;
}
if ((e.typeId == 7 || e.typeId == 8) && e.buyerSingleDemand === '') {
ElMessage.error('请输入单个买家单次需求2');
invalid = 1;
return true;
}
if ((e.typeId == 7 || e.typeId == 8) && isNaN(e.buyerSingleDemand)) {
ElMessage.error('请输入合理的单个买家单次需求');
invalid = 1;
return true;
}
if ((e.typeId == 7 || e.typeId == 8) && e.buyerSingleDemand < 0) {
ElMessage.error('单个买家单次需求不得小于0');
invalid = 1;
return true;
}
});
if (invalid) return false;
// 系统账户起始金额
if (param.moneyAllocationList[0].startingAmount === '' || isNaN(param.moneyAllocationList[0].startingAmount)) return ElMessage.error('请输入合理的银行账户');
if (param.moneyAllocationList[1].startingAmount === '' || isNaN(param.moneyAllocationList[1].startingAmount)) return ElMessage.error('请输入合理的保险账户');
if (param.moneyAllocationList[2].startingAmount === '' || isNaN(param.moneyAllocationList[2].startingAmount)) return ElMessage.error('请输入合理的基金账户');
param.ageAduRatioList.push(...edus.value);
param.commodityDemandList.map((e) => {
if (e.buyerSingleDemandMin && e.buyerSingleDemandMax) e.buyerSingleDemand = `${e.buyerSingleDemandMin}-${e.buyerSingleDemandMax}`;
});
await saveOrUpdate(param);
ElMessage.success('保存成功！');
getInfo();
};
interface SpanMethodProps {
row: Record<string, any>;
column: TableColumnCtx<Record<string, any>>;
rowIndex: number;
columnIndex: number;
}
// 人口及年龄表格合并
const ageSpan = ({ row, column, rowIndex, columnIndex }: SpanMethodProps) => {
if (columnIndex === 0) {
if (rowIndex === 0) {
return {
rowspan: 6,
colspan: 1,
};
}
return {
rowspan: 0,
colspan: 0,
};
}
};
// 学历表格合并
const eduSpan = ({ row, column, rowIndex, columnIndex }: SpanMethodProps) => {
if (columnIndex === 0) {
if (rowIndex % 4 === 0) {
return {
rowspan: 4,
colspan: 1,
};
}
return {
rowspan: 0,
colspan: 0,
};
}
};
onMounted(() => {
getInfo();
});
@ -145,20 +425,8 @@ onMounted(() => {
:deep(th.el-table__cell) {
@apply bg-[#F8FBFC];
}
:deep(.cell) {
:deep(th.el-table__cell > .cell) {
@apply text-[#006BFF];
}
}
.submit {
padding: 15px 22px;
font-size: 14px;
line-height: 1;
color: #fff;
background: #006bff;
border-radius: 12px;
cursor: pointer;
&:hover {
opacity: 0.9;
}
}
</style>

Write Preview
Loading…
Cancel
Save