Skip to content

B
bims
Commit dcd9fd69 authored by 吴婷慧's avatar 吴婷慧
Browse files
Options

新建客户信息完成（保存接口暂未通）

parent f76b3dc9
Hide whitespace changes
Inline Side-by-side
Showing with 366 additions and 53 deletions
public/index.html
View file @ dcd9fd69
......@@ -8,7 +8,7 @@
<title><%= htmlWebpackPlugin.options.title %></title>
<script
type="text/javascript"
src="//at.alicdn.com/t/font_3020450_mgm6gng7qr.js"
src="//at.alicdn.com/t/font_3020450_c8k1zo91rcb.js"
></script>
</head>
<body>
......
src/api/apis_moudles/base.js
View file @ dcd9fd69
// 基础api
export default {
getUserInfo: `/getUserInfo`,
// getUserInfo: `/getUserInfo`,
corporateCodeList: "/backstage/auth/corporateList",
uploadImg: "/common/upload",
};
src/api/apis_moudles/customer.js
View file @ dcd9fd69
// 客户管理api
export default {
getCustomerList: "/backstage/auth/patientList",
updateCustomList: "/backstage/auth/updatePatientPolicy",
};
src/api/funcs_modules/base.js
View file @ dcd9fd69
......@@ -13,5 +13,10 @@ const GETCORPORATECODE = (data) => {
return req.post(apis.corporateCodeList, data);
};
// 上传图片
const UPLOADIMG = (data) => {
return req.post(apis.uploadImg, data);
};
// 对象数组
export default { GETUSERINFO, GETCORPORATECODE };
export default { GETUSERINFO, GETCORPORATECODE, UPLOADIMG };
src/api/funcs_modules/customer.js
View file @ dcd9fd69
......@@ -2,9 +2,14 @@
import apis from "../apis_moudles/";
import req from "../request";
// 对象数组
// get custom list
const GETCUSTOMERLIST = function (data) {
return req.post(apis.getCustomerList, data);
};
export default { GETCUSTOMERLIST };
// add or update custom data
const UPDATECUSTOMDATA = function (data) {
return req.post(apis.updateCustomList, data);
};
export default { GETCUSTOMERLIST, UPDATECUSTOMDATA };
src/assets/style/reset.less
View file @ dcd9fd69
......@@ -268,20 +268,50 @@ select {
}
.custom-info {
.ant-pagination-item-active {
.fs(16);
border: none;
// vertical-align: baseline;
.ant-pagination-item-active {
.fs(16);
border: none;
// vertical-align: baseline;
}
.ant-pagination-item-link {
.fs(16);
.lh(22);
.pa(7, 15, 7, 15);
display: inline-block;
background-color: #f8fafb;
border: none;
}
.ant-pagination-item:not(.ant-pagination-item-active) {
display: none;
}
}
.ant-radio-group{
.ant-radio-button-wrapper{
.pa(8, 17, 8, 17);
.lh(20);
vertical-align: bottom;
border: none;
border-radius: 4px;
background-color: #F8FAFB;
&:before{
content: none;
}
.ant-pagination-item-link {
.fs(16);
.lh(22);
.pa(7, 15, 7, 15);
display: inline-block;
background-color: #f8fafb;
border: none;
&:hover{
color: #2B63FF;
}
}
.ant-radio-button-wrapper-checked{
border: none;
color: #2B63FF;
background-color: #F1F5FF;
&:before{
content: none;
}
.ant-pagination-item:not(.ant-pagination-item-active) {
display: none;
&:hover{
border: none;
background-color: #F1F5FF;
color: #2B63FF;
}
}
\ No newline at end of file
}
}
\ No newline at end of file
src/components/Antd/index.js
View file @ dcd9fd69
import Vue from "vue";
import {
Button,
Input,
Select,
DatePicker,
notification,
menu,
dropdown,
FormModel,
Row,
Col,
menu,
dropdown,
Table,
InputNumber,
message,
pagination,
FormModel,
Select,
DatePicker,
Input,
InputNumber,
Radio,
upload,
Button,
notification,
popconfirm,
modal,
} from "ant-design-vue";
export default () => {
let els = [
Button,
Input,
notification,
Row,
Col,
menu,
dropdown,
Table,
message,
pagination,
FormModel,
Row,
Col,
Select,
DatePicker,
Table,
Input,
InputNumber,
message,
pagination,
Radio,
upload,
Button,
notification,
popconfirm,
modal,
];
// 注册
els.forEach((item) => {
......
src/views/customer/edit/index.vue
View file @ dcd9fd69
<template>
<div>
<!-- form -->
<a-form-model ref="form" layout="vertical" :model="form">
<a-form-model ref="form" layout="vertical" :model="form" :rules="formRules">
<a-row :gutter="30">
<a-col :xl="5" :lg="6" :sm="12">
<a-form-model-item label="病历号码">
<a-col :xl="6" :lg="6" :sm="12">
<a-form-model-item label="病历号码" prop="mrnNo">
<a-input v-model="form.mrnNo" placeholder="请输入病历号"></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="5" :lg="6" :sm="12">
<a-form-model-item label="客户姓名">
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="客户姓名" prop="patientName">
<a-input
v-model="form.patientName"
placeholder="请输入客户姓名"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="5" :lg="6" :sm="12">
<a-form-model-item label="出生日期">
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="出生日期" prop="birthday">
<a-date-picker
v-model="form.birthday"
placeholder="请选择出生日期"
value-format="YYYY-MM-DD"
></a-date-picker>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="保险公司">
<a-form-model-item label="保险公司" prop="payorId">
<a-select v-model="form.payorId" placeholder="请选择保险公司">
<a-select-option v-for="item in companyCode" :key="item.corpCode">
{{ item.longName }}
......@@ -33,24 +34,160 @@
</a-select>
</a-form-model-item>
</a-col>
<a-col :xl="5" :lg="6" :sm="12">
<a-form-model-item label="保单号码">
<a-col :xl="6" :lg="6" :sm="12">
<a-form-model-item label="客户公司名称" prop="payorName">
<a-input
v-model="form.payorName"
placeholder="请输入客户公司名称"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="6" :lg="6" :sm="12">
<a-form-model-item label="保单卡号" prop="policyNo">
<a-input
v-model="form.policyNo"
placeholder="请输入保单号码"
placeholder="请输入保单卡号"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="首次入保时间" prop="firstEnrollmentTime">
<a-date-picker
v-model="form.firstEnrollmentTime"
placeholder="请选择首次入保时间"
value-format="YYYY-MM-DD"
></a-date-picker>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="保单生效日期" prop="startDate">
<a-date-picker
v-model="form.startDate"
placeholder="请选择保单生效日期"
value-format="YYYY-MM-DD"
></a-date-picker>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="保单终止日期" prop="endDate">
<a-date-picker
v-model="form.endDate"
placeholder="请选择保单终止日期"
value-format="YYYY-MM-DD"
></a-date-picker>
</a-form-model-item>
</a-col>
<a-col :xl="6" :lg="6" :sm="12">
<a-form-model-item label="保险计划" prop="planId">
<a-input
v-model="form.planId"
placeholder="请输入保险计划"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="6" :lg="6" :sm="12">
<a-form-model-item label="其他备注" prop="remark">
<a-input
v-model="form.remark"
placeholder="请输入备注信息"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="等待期" prop="waitingPeriod">
<a-radio-group
v-model="form.waitingPeriod"
:default-value="form.waitingPeriod"
button-style="solid"
>
<a-radio-button value="Y"> 是 </a-radio-button>
<a-radio-button class="mar-left10" value="N"> 否 </a-radio-button>
</a-radio-group>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="等待期时间" prop="waitingPeriodTime">
<a-date-picker
v-model="form.waitingPeriodTime"
placeholder="请选择等待期时间"
value-format="YYYY-MM-DD"
></a-date-picker>
</a-form-model-item>
</a-col>
<a-col :xl="4" :lg="6" :sm="12">
<a-form-model-item label="是否承担既往症" prop="isUndertakeAnamnesis">
<a-radio-group
v-model="form.isUndertakeAnamnesis"
:default-value="form.isUndertakeAnamnesis"
button-style="solid"
>
<a-radio-button value="Y"> 是 </a-radio-button>
<a-radio-button class="mar-left10" value="N"> 否 </a-radio-button>
</a-radio-group>
</a-form-model-item>
</a-col>
<a-col :xl="9" :sm="12">
<a-form-model-item label="保卡复印件" prop="medCardCopeFiles">
<div class="upload-print">
<div class="picture">
<a-upload
action=""
accept="image/*"
list-type="picture-card"
:file-list="medCardCopeFiles"
:beforeUpload="uploadMedImg"
@preview="handlePreview"
:remove="handleMedRemove"
>
<div v-if="form.medCardCopeFiles.length < 3">
点击上传文件
</div>
</a-upload>
</div>
<a-button type="primary" class="mar-left10" ghost>打印</a-button>
</div>
</a-form-model-item>
</a-col>
<a-col :xl="9" :sm="12">
<a-form-model-item label="身份证复印件" prop="idCardCopeFiles">
<div class="upload-print">
<div class="picture">
<a-upload
action=""
list-type="picture-card"
:beforeUpload="uploadIDImg"
:file-list="idCardCopeFiles"
@preview="handlePreview"
:remove="handleIDRemove"
>
<div v-if="form.idCardCopeFiles.length < 3">点击上传文件</div>
</a-upload>
</div>
<a-button type="primary" class="mar-left10" ghost>打印</a-button>
</div>
</a-form-model-item>
</a-col>
<a-col :xl="24" :lg="18" :sm="12" class="none-label">
<a-form-model-item label="button">
<a-button type="primary">新建客户信息</a-button>
<a-button class="mar-left10" type="primary" @click="handlerSearch"
>查询</a-button
>
<a-button type="primary">
<Icon name="ssiprint" :size="14" />打印理赔申请书
</a-button>
<a-button
class="mar-left10 text-r"
type="primary"
@click="handlerSave"
><Icon name="ssidownload" :size="14" />保存
</a-button>
<a-button type="primary" class="text-r" @click="handlerReset">
<Icon name="ssireset" :size="14" />重置
</a-button>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
<a-modal :visible="previewVisible" :footer="null" @cancel="handleClose">
<img alt="example" style="width: 100%" :src="previewImage" />
</a-modal>
</div>
</template>
......@@ -58,10 +195,138 @@
export default {
data() {
return {
form: {},
previewVisible: false,
form: {
waitingPeriod: "N",
isUndertakeAnamnesis: "N",
medCardCopeFiles: [],
idCardCopeFiles: [], // 身份证复印件
},
medCardCopeFiles: [],
idCardCopeFiles: [], // 身份证复印件
previewImage: "",
companyCode: [],
formRules: {},
};
},
mounted() {
this._getCorporateCode();
},
methods: {
handlerSave() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.$apis.UPDATECUSTOMDATA(this.form).then((res) => {
console.log(res);
});
});
},
handlerReset() {
this.$refs.form.resetFields();
this.form.medCardCopeFiles = [];
this.medCardCopeFiles = [];
this.form.idCardCopeFiles = [];
this.idCardCopeFiles = [];
},
uploadMedImg(file) {
console.log(file);
// this.form.medCardCopeFiles.push(file);
this.uploadFile(file, "1");
return false;
},
uploadIDImg(file) {
this.uploadFile(file, "2");
},
uploadFile(file, type) {
let formData = new FormData();
formData.append("file", file);
this.$apis.UPLOADIMG(formData).then((res) => {
if (res.state === "SUCCESS") {
const { original, title, url } = res;
let fileItem = {
fileName: title,
fileType: type,
fileUrl: url,
};
let showItem = {
url,
uid: url,
name: original,
};
if (type === "1") {
this.form.medCardCopeFiles.push(fileItem);
this.medCardCopeFiles.push(showItem);
} else {
this.form.idCardCopeFiles.push(fileItem);
this.idCardCopeFiles.push(showItem);
}
}
console.log(res);
});
return false;
},
handleMedRemove(file) {
for (let i = 0; i < this.medCardCopeFiles.length; i++) {
if (this.medCardCopeFiles[i].url === file.url) {
this.medCardCopeFiles[i].splice(i, 1);
this.form.medCardCopeFiles[i].splice(i, 1);
return true;
}
}
},
handleIDRemove(file) {
for (let i = 0; i < this.idCardCopeFiles.length; i++) {
if (this.idCardCopeFiles[i].url === file.url) {
this.idCardCopeFiles[i].splice(i, 1);
this.form.idCardCopeFiles[i].splice(i, 1);
return true;
}
}
},
handlePreview(file) {
this.previewImage = file.url;
this.previewVisible = true;
},
handleClose() {
this.previewVisible = false;
},
_getCorporateCode() {
const params = {
longName: "",
payorId: 0,
};
this.$apis.GETCORPORATECODE(params).then((res) => {
this.companyCode = res.content || [];
});
},
},
};
</script>
<style></style>
<style lang="less" scoped>
.upload-print {
display: flex;
justify-content: space-between;
align-items: flex-end;
.picture {
flex: 1;
font-size: 0; // 去除div幽灵字体
}
}
.ant-btn {
.icon-class {
.mg-r(10);
}
}
.none-label .text-r {
float: right;
}
/deep/ .ant-upload {
width: 100%;
color: #2b63ff;
margin: 0;
border: none;
}
</style>
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