|
|
@@ -1,14 +1,60 @@
|
|
|
<script setup lang="ts">
|
|
|
-import { type PlusColumn, PlusDescriptions } from "plus-pro-components";
|
|
|
+import {
|
|
|
+ type FieldValues,
|
|
|
+ type PlusColumn,
|
|
|
+ PlusDescriptions,
|
|
|
+ PlusDialog,
|
|
|
+ PlusDialogForm
|
|
|
+} from "plus-pro-components";
|
|
|
import { useRoute } from "vue-router";
|
|
|
-import { onMounted, ref } from "vue";
|
|
|
-import { merchantFollowInfoDetail } from "@/api/order";
|
|
|
+import { onMounted, reactive, ref, toRefs } from "vue";
|
|
|
+import {
|
|
|
+ merchantFollowInfoDetail,
|
|
|
+ merchantFollowInfoList,
|
|
|
+ updateStartLevel
|
|
|
+} from "@/api/order";
|
|
|
import { getDictionary } from "@/utils/dictionary";
|
|
|
+import { ElMessage, FormRules } from "element-plus";
|
|
|
|
|
|
defineOptions({
|
|
|
name: "OrderLoanDetail"
|
|
|
});
|
|
|
|
|
|
+interface State {
|
|
|
+ dialogVisible: boolean;
|
|
|
+ detailsVisible: boolean;
|
|
|
+ confirmLoading: boolean;
|
|
|
+ form: {};
|
|
|
+ detailForm: {
|
|
|
+ list: any;
|
|
|
+ };
|
|
|
+ rules: FormRules;
|
|
|
+}
|
|
|
+
|
|
|
+const state = reactive<State>({
|
|
|
+ dialogVisible: false,
|
|
|
+ detailsVisible: false,
|
|
|
+ confirmLoading: false,
|
|
|
+ form: {},
|
|
|
+ detailForm: {
|
|
|
+ list: []
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ starLevel: [
|
|
|
+ { required: true, message: "请选择客户星级", trigger: "change" }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+const {
|
|
|
+ form,
|
|
|
+ detailForm,
|
|
|
+ confirmLoading,
|
|
|
+ rules,
|
|
|
+ dialogVisible,
|
|
|
+ detailsVisible
|
|
|
+} = toRefs(state);
|
|
|
+
|
|
|
const route = useRoute();
|
|
|
console.log(route.query.id);
|
|
|
|
|
|
@@ -26,6 +72,41 @@ const getDetail = async (id: string) => {
|
|
|
console.log(data.value);
|
|
|
};
|
|
|
|
|
|
+const handleOpenFormDialog = () => {
|
|
|
+ form.value = {};
|
|
|
+ form.value.orderId = route.query.orderNo;
|
|
|
+ dialogVisible.value = true;
|
|
|
+};
|
|
|
+
|
|
|
+const handleOpenDetailDialog = () => {
|
|
|
+ detailForm.value = data.value;
|
|
|
+ detailForm.value.list = [];
|
|
|
+ merchantFollowInfoList({ orderNo: route.query.orderNo }).then(res => {
|
|
|
+ detailForm.value.list = res.data;
|
|
|
+ });
|
|
|
+ detailsVisible.value = true;
|
|
|
+};
|
|
|
+
|
|
|
+const handleClose = () => {};
|
|
|
+
|
|
|
+const handleSubmit = async (values: FieldValues) => {
|
|
|
+ confirmLoading.value = true;
|
|
|
+ try {
|
|
|
+ let params = form.value;
|
|
|
+ console.log(params);
|
|
|
+ let res = await updateStartLevel(params);
|
|
|
+ if (res.code === 0) {
|
|
|
+ ElMessage.success("修改成功");
|
|
|
+ confirmLoading.value = false;
|
|
|
+ dialogVisible.value = false;
|
|
|
+ } else {
|
|
|
+ ElMessage.error(res.msg);
|
|
|
+ }
|
|
|
+ } finally {
|
|
|
+ confirmLoading.value = false;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
const data = ref();
|
|
|
|
|
|
const columns: PlusColumn[] = [
|
|
|
@@ -113,6 +194,62 @@ const columns5: PlusColumn[] = [
|
|
|
formatter: val => getDictionary("HouseBuyType", val)
|
|
|
}
|
|
|
];
|
|
|
+
|
|
|
+const formColumns: PlusColumn[] = [
|
|
|
+ {
|
|
|
+ label: "客户星级",
|
|
|
+ prop: "starLevel",
|
|
|
+ valueType: "select",
|
|
|
+ tooltip: {
|
|
|
+ content:
|
|
|
+ "<span>客户星级说明</span></br>" +
|
|
|
+ "<span>0星：未接通</span></br>" +
|
|
|
+ "<span>1星：接通但无办理意向</span></br>" +
|
|
|
+ "<span>2星：有意向但无可贷点</span></br>" +
|
|
|
+ "<span>3星：有可贷点但资质一般</span></br>" +
|
|
|
+ "<span>4星：有可贷点且条件较好</span></br>" +
|
|
|
+ "<span>5星：马上需要或条件优质</span></br>",
|
|
|
+ rawContent: true
|
|
|
+ },
|
|
|
+ options: [
|
|
|
+ { label: "1星", value: 1 },
|
|
|
+ { label: "2星", value: 2 },
|
|
|
+ { label: "3星", value: 3 },
|
|
|
+ { label: "4星", value: 4 },
|
|
|
+ { label: "5星", value: 5 }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "备注",
|
|
|
+ prop: "remark",
|
|
|
+ valueType: "input",
|
|
|
+ fieldProps: {
|
|
|
+ type: "textarea",
|
|
|
+ rows: 4,
|
|
|
+ maxlength: 200,
|
|
|
+ showWordLimit: true
|
|
|
+ }
|
|
|
+ }
|
|
|
+];
|
|
|
+
|
|
|
+const detailsColumns: PlusColumn[] = [
|
|
|
+ {
|
|
|
+ label: "姓名：",
|
|
|
+ prop: "userName"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "需求资金：",
|
|
|
+ prop: "loanAmount"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "年龄：",
|
|
|
+ prop: "age"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "需求周期：",
|
|
|
+ prop: "loanTerm"
|
|
|
+ }
|
|
|
+];
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
@@ -163,11 +300,73 @@ const columns5: PlusColumn[] = [
|
|
|
<PlusDescriptions :columns="columns5" :data="data" :border="false" />
|
|
|
</el-card>
|
|
|
<el-row class="mt-5">
|
|
|
- <el-col :span="12">
|
|
|
- <el-button type="primary" @click="$router.back()">返回</el-button>
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-button type="primary" class="w-full" @click="$router.back()"
|
|
|
+ >返回</el-button
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" :offset="1">
|
|
|
+ <el-button type="success" class="w-full" @click="handleOpenFormDialog"
|
|
|
+ >跟进</el-button
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" :offset="1">
|
|
|
+ <el-button
|
|
|
+ type="warning"
|
|
|
+ class="w-full"
|
|
|
+ @click="handleOpenDetailDialog"
|
|
|
+ >跟进记录</el-button
|
|
|
+ >
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-card>
|
|
|
+ <!-- 跟进弹窗编辑 -->
|
|
|
+ <PlusDialogForm
|
|
|
+ ref="dialogForm"
|
|
|
+ v-model="form"
|
|
|
+ v-model:visible="dialogVisible"
|
|
|
+ :form="{
|
|
|
+ columns: formColumns,
|
|
|
+ labelPosition: 'left',
|
|
|
+ labelWidth: 100,
|
|
|
+ rules
|
|
|
+ }"
|
|
|
+ :dialog="{ title: '跟进', width: 600, confirmLoading }"
|
|
|
+ @confirm="handleSubmit"
|
|
|
+ @close="handleClose"
|
|
|
+ />
|
|
|
+ <!-- 跟进状态弹窗 -->
|
|
|
+ <plusDialog
|
|
|
+ v-model="detailsVisible"
|
|
|
+ :hasFooter="false"
|
|
|
+ title="跟进状态"
|
|
|
+ width="600"
|
|
|
+ >
|
|
|
+ <plus-descriptions
|
|
|
+ :column="4"
|
|
|
+ :data="detailForm"
|
|
|
+ :columns="detailsColumns"
|
|
|
+ :border="false"
|
|
|
+ />
|
|
|
+ <el-timeline>
|
|
|
+ <el-timeline-item
|
|
|
+ v-for="item in detailForm.list"
|
|
|
+ :key="item.id"
|
|
|
+ :timestamp="item.createTime"
|
|
|
+ >
|
|
|
+ <el-card>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-rate v-model="item.starLevel" disabled />
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="16">
|
|
|
+ <el-tag>{{ item.remark }}</el-tag>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ </el-timeline>
|
|
|
+ </plusDialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
zouzs