Skip to content

Y
yd-csf-front
Commit a17fcd13 by Sweet Zhang
Options

新单跟进页面

parent 6194d11b
Showing with 145 additions and 7 deletions
src/views/sign/underwritingMain/policyDetail.vue
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<el-tabs v-model="activeTab" @tab-click="handleTabClick"> <el-tabs v-model="activeTab" @tab-click="handleTabClick">
<el-tab-pane label="基础信息" name="basic"></el-tab-pane> <el-tab-pane label="基础信息" name="basic"></el-tab-pane>
<el-tab-pane label="首期缴费" name="firstPayment"></el-tab-pane> <el-tab-pane label="首期缴费" name="firstPayment"></el-tab-pane>
<el-tab-pane label="介绍人" name="referrer"></el-tab-pane> <el-tab-pane label="介绍人" name="introducer"></el-tab-pane>
<el-tab-pane label="邮寄信息" name="postal"></el-tab-pane> <el-tab-pane label="邮寄信息" name="postal"></el-tab-pane>
<el-tab-pane label="关联记录" name="related"></el-tab-pane> <el-tab-pane label="关联记录" name="related"></el-tab-pane>
<el-tab-pane label="附件" name="attachment"></el-tab-pane> <el-tab-pane label="附件" name="attachment"></el-tab-pane>
...@@ -84,20 +84,109 @@ ...@@ -84,20 +84,109 @@
</div> </div>
</div> </div>
<!-- 其他 Tab 内容 --> <!-- 首期缴费 Tab 内容 -->
<div v-if="activeTab === 'firstPayment'" class="tab-content"> <div v-else-if="activeTab === 'firstPayment'" class="tab-content">
<!-- 签单信息 --> <!-- 签单信息 -->
<div class="section"> <div class="section">
<h3 class="sectionTitle">缴费信息</h3> <h3 class="sectionTitle">缴费信息</h3>
<SearchForm ref="firstPremiumFormRef" :config="firstPremiumFormConfig" <SearchForm ref="firstPremiumFormRef" :config="firstPremiumFormConfig"
v-model="firstPremiumFormData" /> v-model="firstPremiumFormData" />
<h3 class="sectionTitle">首期对账信息</h3>
<el-table :data="firstPremiumTableData" border style="width: 100%">
<el-table-column prop="date" label="申请对账日期" width="180" />
<el-table-column prop="name" label="对账状态" width="180" />
<el-table-column prop="address" label="缴费方式" width="180" />
<el-table-column prop="address" label="汇款币种" width="180" />
<el-table-column prop="address" label="汇款日期" width="180" />
<el-table-column prop="address" label="认定金额" width="180" />
<el-table-column prop="address" label="认定币种" width="180" />
</el-table>
</div>
</div>
<!-- 介绍人 Tab 内容 -->
<div v-else-if="activeTab === 'introducer'" class="tab-content">
<!-- 签单信息 -->
<div class="section">
<h3 class="sectionTitle">介绍人信息</h3>
<h5>第一位默认是客户主要负责人，客户资料出现在介绍人（主）账号下，其他介绍人不会看到客户信息</h5>
<el-button type="primary">
<el-icon class="el-icon--right">
<Upload />
</el-icon>新增
</el-button>
<el-table :data="firstPremiumTableData" border style="width: 100%">
<el-table-column prop="date" label="介绍人姓名" width="180" />
<el-table-column prop="name" label="性别" width="180" />
<el-table-column prop="address" label="内部编号" width="180" />
<el-table-column prop="address" label="所属团队" width="180" />
<el-table-column prop="address" label="分配比例" width="180" />
<el-table-column prop="address" label="备注" width="180" />
<el-table-column fixed="right" label="操作" min-width="120">
<template #default>
<el-button link type="primary" size="small" @click="handleClick">
Detail
</el-button>
<el-button link type="primary" size="small">Edit</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 邮寄信息 Tab 内容 -->
<div v-else-if="activeTab === 'postal'" class="tab-content">
<div class="section">
<h3 class="sectionTitle">邮寄信息</h3>
<SearchForm ref="postalFormRef" :config="postalFormConfig" v-model="postalFormData" />
</div>
</div>
<!-- 关联记录 Tab 内容 -->
<div v-else-if="activeTab === 'related'" class="tab-content">
<div class="section">
<h3 class="sectionTitle">关联记录</h3>
<el-table :data="relatedTableData" border style="width: 100%">
<el-table-column prop="date" label="流程编号" width="180" />
<el-table-column prop="name" label="客户姓名" width="180" />
<el-table-column prop="address" label="创建时间" width="180" />
<el-table-column fixed="right" label="操作" min-width="120">
<template #default>
<el-button link type="primary" size="small" @click="handleClick">
Detail
</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 附件 Tab 内容 -->
<div v-else-if="activeTab === 'attachment'" class="tab-content">
<div class="section">
<h3 class="sectionTitle">附件</h3>
<el-button type="primary">
<el-icon class="el-icon--right">
<Upload />
</el-icon>上传附件
</el-button>
<el-table :data="attachmentTableData" border style="width: 100%">
<el-table-column prop="date" label="文件名" width="180" />
<el-table-column prop="name" label="文件类型" width="180" />
<el-table-column prop="address" label="上传时间" width="180" />
<el-table-column prop="address" label="上传人" width="180" />
<el-table-column fixed="right" label="操作" min-width="120">
<template #default>
<el-button link type="primary" size="small" @click="handleClick">
修改
</el-button><el-button link type="danger" size="small" @click="handleClick">
删除
</el-button>
</template>
</el-table-column>
</el-table>
</div> </div>
</div> </div>
<!-- 其他 Tab 占位（你可以按需填充） --> <!-- 其他 Tab 占位（你可以按需填充） -->
<div v-else class="tab-placeholder"> <div v-else class="tab-placeholder">
<el-empty description="该 Tab 内容待开发" /> <el-empty description="该 Tab 内容待开发" />
</div> </div>
<!-- 底部按钮 --> <!-- 底部按钮 -->
<div class="form-footer"> <div class="form-footer">
<el-button size="default" @click="handleCancel">取消</el-button> <el-button size="default" @click="handleCancel">取消</el-button>
...@@ -110,9 +199,7 @@ ...@@ -110,9 +199,7 @@
<script setup> <script setup>
import { ref, reactive, watch, nextTick } from 'vue' import { ref, reactive, watch, nextTick } from 'vue'
import SearchForm from '@/components/SearchForm/SearchForm.vue' import SearchForm from '@/components/SearchForm/SearchForm.vue'
import { Delete, Edit, Search, Share, Upload } from '@element-plus/icons-vue'
const basicInfoFormRef = ref() const basicInfoFormRef = ref()
const basicInfoFormData = ref({}) const basicInfoFormData = ref({})
const basicInfoFormConfig = ref([ const basicInfoFormConfig = ref([
...@@ -266,6 +353,7 @@ const basicPlanFormConfig = ref([ ...@@ -266,6 +353,7 @@ const basicPlanFormConfig = ref([
]) ])
// 首期保费 // 首期保费
const firstPremiumTableData = ref([])
const firstPremiumFormRef = ref() const firstPremiumFormRef = ref()
const firstPremiumFormData = ref({}) const firstPremiumFormData = ref({})
const firstPremiumFormConfig = ref([ const firstPremiumFormConfig = ref([
...@@ -342,6 +430,41 @@ const firstPremiumFormConfig = ref([ ...@@ -342,6 +430,41 @@ const firstPremiumFormConfig = ref([
}, },
]) ])
// 邮寄信息
const postalFormRef = ref(null)
const postalFormData = ref({})
const postalFormConfig = ref([
{
type: 'input',
prop: 'postalCode',
label: '寄送方式',
}, {
type: 'input',
prop: 'address',
label: '快递单号',
}, {
type: 'date',
prop: 'address',
label: '我司签收日',
rules: [
{ required: true, message: '请输入我司签收日', trigger: 'blur' }
]
}, {
type: 'date',
prop: 'address',
label: '客户签收日',
rules: [
{ required: true, message: '请输入客户签收日', trigger: 'blur' }
]
},
])
// 关联记录
const relatedTableData = ref([])
const attachmentTableData = ref([])
// ===== Props & Emits ===== // ===== Props & Emits =====
const props = defineProps({ const props = defineProps({
...@@ -426,6 +549,10 @@ const handleCancel = () => { ...@@ -426,6 +549,10 @@ const handleCancel = () => {
emit('cancel') emit('cancel')
} }
const handleClick = (tab) => {
activeTab.value = tab.name
}
// 如果外部 modelValue 更新（比如重新加载数据），同步到 localData // 如果外部 modelValue 更新（比如重新加载数据），同步到 localData
watch( watch(
() => props.modelValue, () => props.modelValue,
...@@ -474,4 +601,14 @@ watch( ...@@ -474,4 +601,14 @@ watch(
background-color: #007bff; background-color: #007bff;
border-radius: 5px; border-radius: 5px;
} }
.section h5 {
margin: 0 0 15px 0;
font-size: 14px;
line-height: 1;
position: relative;
background-color: rgba(0, 119, 238, 0.05);
color:#383838;
padding: 15px 10px;
border-radius: 4px;
}
</style> </style>
\ No newline at end of file
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