|
@@ -199,122 +199,11 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <el-dialog :title="modalType == 'add' ? '新增' : '编辑'" v-if="dialogVisible" v-model="dialogVisible" width="800" v-loading="loadingOperation">
|
|
|
- <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="submit">
|
|
|
- <template #allAddress>
|
|
|
- <el-row style="width: 100%">
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item prop="countryId">
|
|
|
- <el-select v-model="formData.data.countryId" placeholder="国家" filterable @change="(val) => getCityData(val, '20', true)">
|
|
|
- <el-option v-for="item in countryData" :label="item.name" :value="item.id">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item prop="provinceName">
|
|
|
- <selectCity placeholder="省/洲" @change="(val) => getCityData(val, '30', true)" addressId="provinceId" addressName="provinceName"
|
|
|
- v-model="formData.data" :data="provinceData">
|
|
|
- </selectCity>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item prop="cityName">
|
|
|
- <selectCity placeholder="城市" addressId="cityId" addressName="cityName" v-model="formData.data" :data="cityData"></selectCity>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row style="margin-top: 20px; width: 100%">
|
|
|
- <el-col :span="24">
|
|
|
- <el-form-item prop="address">
|
|
|
- <el-input v-model="formData.data.address" type="textarea">
|
|
|
- </el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </template>
|
|
|
- <template #person>
|
|
|
- <div style="width: 100%">
|
|
|
- <el-button type="primary" @click="clickAddPerson">添 加</el-button>
|
|
|
- <el-table :data="formData.data.customerUserList" style="width: 100%; margin-top: 16px">
|
|
|
- <el-table-column label="联系人" width="160">
|
|
|
- <template #default="{ row, $index }">
|
|
|
- <div style="width: 100%">
|
|
|
- <el-form-item :prop="'customerUserList.' + $index + '.name'" :rules="rules.name2" :inline-message="true">
|
|
|
- <el-input v-model="row.name" placeholder="请输入联系人" />
|
|
|
- </el-form-item>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="电子邮箱">
|
|
|
- <template #default="{ row, $index }">
|
|
|
- <div style="width: 100%">
|
|
|
- <el-form-item :prop="'customerUserList.' + $index + '.email'" :rules="rules.email" :inline-message="true">
|
|
|
- <el-input v-model="row.email" placeholder="请输入电子邮箱" />
|
|
|
- </el-form-item>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="操作" width="120" fixed="right">
|
|
|
- <template #default="{ row, $index }">
|
|
|
- <el-button type="primary" link @click="clickInformationMore(row, $index)">更多</el-button>
|
|
|
- <el-button type="primary" link @click="clickDelete($index)">删除</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </byForm>
|
|
|
+ <el-dialog :title="modalType == 'add' ? '新增' : '编辑'" v-if="dialogVisible" v-model="dialogVisible" width="800">
|
|
|
+ <AddCustomer ref="AddCustomerDom" :modalType="modalType" :customerId="customerId" @refreshList="refreshList"></AddCustomer>
|
|
|
<template #footer>
|
|
|
<el-button @click="dialogVisible = false" size="large">取 消</el-button>
|
|
|
- <el-button type="primary" @click="submitForm()" size="large" :loading="submitLoading">确 定</el-button>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
-
|
|
|
- <el-dialog title="更多联系方式" v-if="openPerson" v-model="openPerson" width="700">
|
|
|
- <el-form :label-position="'top'" :model="formPerson.data" :rules="rulesPerson" ref="person">
|
|
|
- <el-form-item label="联系人" prop="name">
|
|
|
- <el-input v-model="formPerson.data.name" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="电子邮箱" prop="email">
|
|
|
- <el-input v-model="formPerson.data.email" />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="更多联系方式">
|
|
|
- <div style="width: 100%">
|
|
|
- <el-button type="primary" @click="clickAddMoreInformation">添 加</el-button>
|
|
|
- <el-table :data="formPerson.data.contact" style="width: 100%; margin-top: 16px">
|
|
|
- <el-table-column label="类型" width="180">
|
|
|
- <template #default="{ row, $index }">
|
|
|
- <div style="width: 100%">
|
|
|
- <el-form-item :prop="'contact.' + $index + '.type'" :rules="rulesPerson.type" :inline-message="true">
|
|
|
- <el-select v-model="row.type" placeholder="请选择类型" style="width: 100%">
|
|
|
- <el-option v-for="item in contactType" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="联系号码">
|
|
|
- <template #default="{ row, $index }">
|
|
|
- <div style="width: 100%">
|
|
|
- <el-form-item :prop="'contact.' + $index + '.contactNo'" :rules="rulesPerson.contactNo" :inline-message="true">
|
|
|
- <el-input v-model="row.contactNo" placeholder="请输入联系号码" />
|
|
|
- </el-form-item>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="操作" width="120" fixed="right">
|
|
|
- <template #default="{ $index }">
|
|
|
- <el-button type="primary" link @click="clickInformationDelete($index)">删除</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <template #footer>
|
|
|
- <el-button @click="openPerson = false" size="large">取 消</el-button>
|
|
|
- <el-button type="primary" @click="submitPerson()" size="large">确 定</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm()" size="large">确 定</el-button>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
|
|
@@ -455,13 +344,13 @@ import { computed, ref } from "vue";
|
|
|
import useUserStore from "@/store/modules/user";
|
|
|
import selectCity from "@/components/selectCity/index.vue";
|
|
|
import TitleInfo from "@/components/TitleInfo/index.vue";
|
|
|
-
|
|
|
+import AddCustomer from "@/views/customer/addCustomer.vue";
|
|
|
+const AddCustomerDom = ref(null);
|
|
|
+const customerId = ref("");
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
const activeNames = ref(["1", "2", "3", "4"]);
|
|
|
const loading = ref(false);
|
|
|
-const loadingOperation = ref(false);
|
|
|
const submitLoading = ref(false);
|
|
|
-const openPerson = ref(false);
|
|
|
const openAllocation = ref(false);
|
|
|
const customerTag = ref([]);
|
|
|
const customerSource = ref([]);
|
|
@@ -759,15 +648,8 @@ const config = computed(() => {
|
|
|
});
|
|
|
const modalType = ref("add");
|
|
|
const dialogVisible = ref(false);
|
|
|
-const formData = reactive({
|
|
|
- data: {
|
|
|
- countryId: "44",
|
|
|
- },
|
|
|
-});
|
|
|
+
|
|
|
const openFollow = ref(false);
|
|
|
-const formPerson = reactive({
|
|
|
- data: {},
|
|
|
-});
|
|
|
const formAllocation = reactive({
|
|
|
data: {},
|
|
|
});
|
|
@@ -780,117 +662,6 @@ const formOption = reactive({
|
|
|
itemWidth: 100,
|
|
|
rules: [],
|
|
|
});
|
|
|
-const formConfig = computed(() => {
|
|
|
- return [
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "name",
|
|
|
- label: "客户名称",
|
|
|
- required: true,
|
|
|
- itemWidth: 100,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "slot",
|
|
|
- slotName: "allAddress",
|
|
|
- label: "详细地址",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "select",
|
|
|
- label: "客户来源",
|
|
|
- prop: "source",
|
|
|
- itemWidth: 50,
|
|
|
- data: customerSource.value,
|
|
|
- },
|
|
|
- {
|
|
|
- type: "select",
|
|
|
- label: "客户类型",
|
|
|
- prop: "status",
|
|
|
- itemWidth: 50,
|
|
|
- data: customerStatus.value,
|
|
|
- },
|
|
|
- {
|
|
|
- type: "select",
|
|
|
- label: "业务员",
|
|
|
- prop: "userId",
|
|
|
- itemWidth: 100,
|
|
|
- data: userList.value,
|
|
|
- clearable: true,
|
|
|
- },
|
|
|
- {
|
|
|
- type: "select",
|
|
|
- label: "客户标签",
|
|
|
- prop: "tags",
|
|
|
- itemWidth: 100,
|
|
|
- multiple: true,
|
|
|
- data: customerTag.value,
|
|
|
- style: {
|
|
|
- width: "100%",
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "beneficiaryName",
|
|
|
- label: "Beneficiary Name",
|
|
|
- required: true,
|
|
|
- itemWidth: 50,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "beneficiaryAccountNumber",
|
|
|
- label: "Beneficiary Account Number",
|
|
|
- required: true,
|
|
|
- itemWidth: 50,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "beneficiaryBank",
|
|
|
- label: "Beneficiary Bank",
|
|
|
- required: true,
|
|
|
- itemWidth: 50,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "swiftCode",
|
|
|
- label: "Swift Code",
|
|
|
- required: true,
|
|
|
- itemWidth: 50,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "beneficiaryBankAddress",
|
|
|
- label: "Beneficiary Bank Address",
|
|
|
- required: true,
|
|
|
- itemWidth: 50,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "input",
|
|
|
- prop: "beneficiaryAddress",
|
|
|
- label: "Beneficiary Address",
|
|
|
- required: true,
|
|
|
- itemWidth: 50,
|
|
|
- itemType: "text",
|
|
|
- },
|
|
|
- {
|
|
|
- type: "slot",
|
|
|
- slotName: "person",
|
|
|
- label: "客户联系人",
|
|
|
- },
|
|
|
- ];
|
|
|
-});
|
|
|
-const rules = ref({
|
|
|
- name: [{ required: true, message: "请输入客户名称", trigger: "blur" }],
|
|
|
- name2: [{ required: true, message: "请输入联系人", trigger: "blur" }],
|
|
|
- email: [{ required: true, message: "请输入电子邮箱", trigger: "blur" }],
|
|
|
- countryId: [{ required: true, message: "请选择国家", trigger: "change" }],
|
|
|
- source: [{ required: true, message: "请选择客户来源", trigger: "change" }],
|
|
|
- status: [{ required: true, message: "请选择类型", trigger: "change" }],
|
|
|
-});
|
|
|
const formConfigAllocation = computed(() => {
|
|
|
return [
|
|
|
{
|
|
@@ -930,18 +701,10 @@ const formConfigAFollow = computed(() => {
|
|
|
},
|
|
|
];
|
|
|
});
|
|
|
-const rulesPerson = ref({
|
|
|
- name: [{ required: true, message: "请输入联系人", trigger: "blur" }],
|
|
|
- email: [{ required: true, message: "请输入电子邮箱", trigger: "blur" }],
|
|
|
- type: [{ required: true, message: "请选择类型", trigger: "change" }],
|
|
|
- contactNo: [{ required: true, message: "请输入联系号码", trigger: "blur" }],
|
|
|
-});
|
|
|
const rulesFollow = ref({
|
|
|
date: [{ required: true, message: "请选择跟进时间", trigger: "change" }],
|
|
|
content: [{ required: true, message: "请输入跟进内容", trigger: "blur" }],
|
|
|
});
|
|
|
-const submit = ref(null);
|
|
|
-const person = ref(null);
|
|
|
const allocation = ref(null);
|
|
|
const follow = ref(null);
|
|
|
const getList = async (req) => {
|
|
@@ -963,65 +726,11 @@ const getList = async (req) => {
|
|
|
}, 200);
|
|
|
});
|
|
|
};
|
|
|
-const countryData = ref([]);
|
|
|
-const provinceData = ref([]);
|
|
|
-const cityData = ref([]);
|
|
|
-const getCityData = (id, type, isChange) => {
|
|
|
- proxy.post("/customizeArea/list", { parentId: id }).then((res) => {
|
|
|
- if (type === "20") {
|
|
|
- provinceData.value = res;
|
|
|
- if (isChange) {
|
|
|
- formData.data.provinceId = "";
|
|
|
- formData.data.provinceName = "";
|
|
|
- formData.data.cityId = "";
|
|
|
- formData.data.cityName = "";
|
|
|
- }
|
|
|
- } else if (type === "30") {
|
|
|
- cityData.value = res;
|
|
|
- if (isChange) {
|
|
|
- formData.data.cityId = "";
|
|
|
- formData.data.cityName = "";
|
|
|
- }
|
|
|
- } else {
|
|
|
- countryData.value = res;
|
|
|
- }
|
|
|
- });
|
|
|
-};
|
|
|
-getCityData("0");
|
|
|
+
|
|
|
const openModal = () => {
|
|
|
modalType.value = "add";
|
|
|
- formData.data = {
|
|
|
- countryId: "44",
|
|
|
- tags: [],
|
|
|
- customerUserList: [
|
|
|
- {
|
|
|
- name: "",
|
|
|
- email: "",
|
|
|
- },
|
|
|
- ],
|
|
|
- };
|
|
|
- getCityData(formData.data.countryId, "20");
|
|
|
- loadingOperation.value = false;
|
|
|
dialogVisible.value = true;
|
|
|
};
|
|
|
-const clickAddPerson = () => {
|
|
|
- if (
|
|
|
- formData.data.customerUserList &&
|
|
|
- formData.data.customerUserList.length > 0
|
|
|
- ) {
|
|
|
- formData.data.customerUserList.push({
|
|
|
- name: "",
|
|
|
- email: "",
|
|
|
- });
|
|
|
- } else {
|
|
|
- formData.data.customerUserList = [
|
|
|
- {
|
|
|
- name: "",
|
|
|
- email: "",
|
|
|
- },
|
|
|
- ];
|
|
|
- }
|
|
|
-};
|
|
|
const submitAllocation = () => {
|
|
|
allocation.value.handleSubmit(() => {
|
|
|
proxy.post("/customer/CustomerAllocation", formAllocation.data).then(() => {
|
|
@@ -1066,33 +775,7 @@ const submitFollow = () => {
|
|
|
});
|
|
|
};
|
|
|
const submitForm = () => {
|
|
|
- submit.value.handleSubmit(() => {
|
|
|
- if (
|
|
|
- formData.data.customerUserList &&
|
|
|
- formData.data.customerUserList.length > 0
|
|
|
- ) {
|
|
|
- formData.data.tag = formData.data.tags.join(",");
|
|
|
- submitLoading.value = true;
|
|
|
- proxy.post("/customer/" + modalType.value, formData.data).then(
|
|
|
- () => {
|
|
|
- ElMessage({
|
|
|
- message: modalType.value == "add" ? "添加成功" : "编辑成功",
|
|
|
- type: "success",
|
|
|
- });
|
|
|
- dialogVisible.value = false;
|
|
|
- submitLoading.value = false;
|
|
|
- getList();
|
|
|
- obtainStatisticalData();
|
|
|
- },
|
|
|
- (err) => {
|
|
|
- console.log(err);
|
|
|
- submitLoading.value = false;
|
|
|
- }
|
|
|
- );
|
|
|
- } else {
|
|
|
- ElMessage("请添加客户联系人");
|
|
|
- }
|
|
|
- });
|
|
|
+ AddCustomerDom.value.handleSubmit();
|
|
|
};
|
|
|
const getDict = () => {
|
|
|
proxy
|
|
@@ -1325,47 +1008,7 @@ const judgeTotal = () => {
|
|
|
}
|
|
|
return false;
|
|
|
};
|
|
|
-const moreIndex = ref(0);
|
|
|
-const clickInformationMore = (item, index) => {
|
|
|
- moreIndex.value = index;
|
|
|
- if (item.contactJson) {
|
|
|
- item.contact = JSON.parse(item.contactJson);
|
|
|
- } else {
|
|
|
- item.contact = [];
|
|
|
- }
|
|
|
- formPerson.data = proxy.deepClone(item);
|
|
|
- openPerson.value = true;
|
|
|
-};
|
|
|
-const clickDelete = (index) => {
|
|
|
- formData.data.customerUserList.splice(index, 1);
|
|
|
-};
|
|
|
-const clickAddMoreInformation = () => {
|
|
|
- if (formPerson.data.contact && formPerson.data.contact.length > 0) {
|
|
|
- formPerson.data.contact.push({
|
|
|
- type: "",
|
|
|
- contactNo: "",
|
|
|
- });
|
|
|
- } else {
|
|
|
- formPerson.data.contact = [
|
|
|
- {
|
|
|
- type: "",
|
|
|
- contactNo: "",
|
|
|
- },
|
|
|
- ];
|
|
|
- }
|
|
|
-};
|
|
|
-const clickInformationDelete = (index) => {
|
|
|
- formPerson.data.contact.splice(index, 1);
|
|
|
-};
|
|
|
-const submitPerson = () => {
|
|
|
- person.value.validate((valid) => {
|
|
|
- if (valid) {
|
|
|
- formPerson.data.contactJson = JSON.stringify(formPerson.data.contact);
|
|
|
- formData.data.customerUserList[moreIndex.value] = formPerson.data;
|
|
|
- openPerson.value = false;
|
|
|
- }
|
|
|
- });
|
|
|
-};
|
|
|
+
|
|
|
const deleteTop = (item) => {
|
|
|
proxy.post("/customerTop/delete", { customerId: item.id }).then(() => {
|
|
|
item.isTop = 0;
|
|
@@ -1497,21 +1140,8 @@ const getNum = (val) => {
|
|
|
};
|
|
|
const update = (row) => {
|
|
|
modalType.value = "edit";
|
|
|
- loadingOperation.value = true;
|
|
|
- proxy.post("/customer/detail", { id: row.id }).then((res) => {
|
|
|
- if (res.tag) {
|
|
|
- res.tags = res.tag.split(",");
|
|
|
- } else {
|
|
|
- res.tags = [];
|
|
|
- }
|
|
|
- formData.data = res;
|
|
|
- getCityData(formData.data.countryId, "20");
|
|
|
- if (formData.data.provinceId) {
|
|
|
- getCityData(formData.data.provinceId, "30");
|
|
|
- }
|
|
|
- loadingOperation.value = false;
|
|
|
- dialogVisible.value = true;
|
|
|
- });
|
|
|
+ customerId.value = row.id;
|
|
|
+ dialogVisible.value = true;
|
|
|
};
|
|
|
const countrySearchData = ref([]);
|
|
|
const provinceSearchData = ref([]);
|
|
@@ -1650,6 +1280,11 @@ onMounted(() => {
|
|
|
}
|
|
|
);
|
|
|
});
|
|
|
+
|
|
|
+const refreshList = () => {
|
|
|
+ dialogVisible.value = false;
|
|
|
+ getList();
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|