Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
50c8ed8b by joe
Options

简易理赔

1 parent ddd35090
Inline Side-by-side
Showing 35 changed files with 1026 additions and 262 deletions
......@@ -4,7 +4,7 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="stylesheet" href="./css/pure-min.css">
<link rel="stylesheet" href="./css/grids-responsive-min.css">
......
......@@ -11,8 +11,7 @@
<script>
import Vue from 'vue'
import Vue from "vue";
import { mapGetters, mapActions, mapState } from "vuex";
import { getCookie } from "@utils/utils.js";
import VHeader from "@components/home/header/header.vue";
......@@ -301,8 +300,7 @@ input::-webkit-search-cancel-button {
opacity: 1;
}
::-webkit-scrollbar{
::-webkit-scrollbar {
width: 0px;
height: 0px;
display: none;
......@@ -420,10 +418,22 @@ textarea {
}
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
.el-select .el-input.is-focus .el-input__inner {
border-color: transparent !important;
}
.ipt .el-input__inner {
border: none !important;
background-color: transparent !important;
padding: 0 !important;
}
.el-select-dropdown__item.selected {
color: $cOrange !important;
}
.el-input__suffix {
display: none;
}
@media (max-width: 1200px) {
......
......@@ -70,6 +70,8 @@ module.exports = {
getCidByVerify : "/pingan_hklife_webapi/policy/getCidByVerify",
// 客户信息
clarmsCustomerList : "/pingan_hklife_webapi/policy/clarmsCustomerList",
// 理赔报案
clarmsRegisterCase : "/pingan_hklife_webapi/policy/clarmsRegisterCase",
// cms相关
......
......@@ -835,45 +835,59 @@ module.exports = {
step1: {
register: "Register",
login: "Login",
t1: "Ping An UniAccount that we can provide you with better services",
t1: "to OneConnect account to enjoy better service.",
label0: "Claimant information",
label1: "Last name",
label2: "First name",
label3: "Document type",
label4: "Identification Number",
label5: "Birthday",
btn: "Confirm"
btn: "Apply now"
},
step2: {
label1: "I want to",
label2: "Claim for compensation",
label3: "Application type",
label4: "(Multiple choice)",
op1: "Accident medical treatment",
op2: "Accidental death",
op3: "Disease medical treatment",
op4: "Death of illness",
op5: "Major diseases",
label5: "Please fill in the amount of this visit.",
label6: "Amount of this visit",
label1: "I want to claim for",
label2: "",
label3: "Type of application ",
label4: "(Can choose more than one)",
op1: "Accidential medical",
op2: "Accidential death",
op3: "Illness medical",
op4: "Illness death",
op5: "Critical illness",
label5: "Please fill in receipt amount",
label6: "Amount",
label7: "(HKD)",
label8: "If you pay non Hong Kong dollars at the time of treatment, please convert it into Hong Kong dollars and fill in the amount.",
label9: "Accident time",
label10: "Must transmit information",
label11: "Expense receipt and list",
label12: "Medical records",
label13: "Biography data",
label14: "Hospital diagnosis report",
label15: "Account information of claimant",
label16: "Other",
label17: "Statement of authorization:",
label18: "Statement of personal data collection:",
btn: "Confirm",
contact: "I would like to contact customer service",
tip1: "I / we hereby authorize (1) any employer, registered western medicine, hospital, clinic, insurance company, bank, government agency, or other institution, organization or person, who knows or holds any record of the policyholder / insured, to provide, issue and transfer such information to Ping An Life Insurance (Hong Kong) Co., Ltd. (2) your company or any The doctor or laboratory designated by him may apply for medical assessment and test on behalf of the policyholder / insured for the purpose of examining the health status of the policyholder / insured. This power of attorney shall be binding on the successors and assignors of the policyholder / insured, and shall remain in force even if the policyholder / Insured dies or is incapacitated.",
tip2: "I / we confirm that I / we have read and understood the personal data collection statement (this statement) of Ping An Life Insurance (Hong Kong) Co., Ltd.",
tip3: "I / we hereby confirm and agree that you use and transfer my / our personal data in accordance with this statement, including the use and provision of my / our personal data for direct promotion purposes. I / we confirm and agree to transfer my / our personal data outside Hong Kong to the type of transferee described in this statement for the purposes described in this statement.",
tip4: "I / we hereby declare that all the above statements and information, to the best of my / our knowledge and belief, are true and complete."
label8: "Please convert to HKD if the currency you paid is not in HKD",
label9: "Date",
label10: "Required Documents",
label11: "Receipts",
label12: "Medical record",
label13: "Additional Documents",
label14: "Hospital diagnostic report",
label15: "Claimant information",
label16: "Others",
label17: "Declaration of Authorization: ",
label18: "Personal data collection statement: ",
btn: "Submit",
btnUpload: "Upload",
uploadFile: "Uploaded file:",
contact: "Contact customer service",
tip1: "I / We hereby authorize (1) any employer, registered medical practitioner, hospital, clinic, insurance company, bank, government agency, or other agency, organization, or person who knows or holds any relevant policy holder / Those in the insured's records can provide, issue and transfer these assets to Ping An Life Insurance (Hong Kong) Co., Ltd .; (2) your company or any of its designated doctors or laboratories can apply for compensation for this policy The medical evaluation and testing required for the holder / insured person to audit the health status of the policy holder / insured person. This authorization is binding on the policyholder / insured's heirs and grantors; this authorization is valid even if the policyholder / insured dies or becomes incompetent.",
tip2: "I / We confirm that I have read and understood the Personal Data Collection Statement (Ping An Life Insurance (Hong Kong) Co., Ltd.) (this statement). ",
tip3: "I / We hereby confirm and agree to your company's use and transfer of my / our personal assets in accordance with this statement, including the use and provision of my / our personal assets for direct marketing purposes. I / We acknowledge and agree to transfer my / our personal resources for the purposes described in this statement to the type of transferee outside Hong Kong to which this statement refers.",
tip4: "I / We hereby declare that the above statement and information, as far as I / we know and believe, are all facts and true.",
tip5: "The type of application you selected is not within the scope of insurance liability. Please verify and confirm. If you have any questions, ",
tip6: "please contact customer service.",
tip7: "Your claim application has been processed and we will process this application as soon as possible. We will notify you of the progress of the claim through a short message. Due to the need for review, we may notify you to supplement the relevant information or mail the physical object. If approved, the claims will be transferred to the insurance payment account by default. If changes are required, ",
tip8: "please upload the claimant's account information.",
toast1: "Medical treatment receipts",
toast2: "Discharge document / doctor's certificate with clear diagnosis",
toast3: "Such as blood test report, computer scan report, ultrasound report, etc.",
toast4: "The claims are transferred to the insured account by default. If you need to change, please upload the account information.",
toast5: "Evidence of accidents such as police reports, traffic accident reports, etc.",
failure: "Claim report failed,",
failureContact: "Please contact customer service",
placeHolder1: "Select",
}
}
}
......
......@@ -859,16 +859,30 @@ module.exports = {
label12: "病歷資料",
label13: "選傳資料",
label14: "醫院診斷報告",
label15: "索償人賬戶資料",
label15: "索償人資料",
label16: "其他",
label17: "授權聲明：",
label18: "收集個人資料聲明：",
btn: "提交",
btnUpload: "上傳",
uploadFile: "已上傳文件：",
contact: "我想聯絡客服",
tip1 : "本人/我們謹此授權（1）任何雇主、注册西醫、醫院、診所、保險公司、銀行、政府機構、或其他機構、組織或人士、凡知道或持有任何有關保單持有人/受保人之紀錄者，均可將該等資料提供、發放及轉交給中國平安人壽保險（香港）有限公司；（2）貴公司或任何其指定之醫生或化驗所，可就此賠償申請替保單持有人/受保人進行所需之醫療評估及測試，作為稽核保單持有人/受保人之健康狀況。此授權對保單持有人/受保人之繼承人及授讓人具有約束力；即使保單持有人/受保人死亡或無行為能力時，此授權書仍具效力。",
tip2 : "本人/我們確認已閱讀及明白「中國平安人壽保險（香港）有限公司」的收集個人資料聲明（本聲明）。",
tip3 : "本人/我們特此確認並同意貴公司根據本聲明使用和移轉本人/我們的個人資料，包括為直接促銷之目的使用和提供本人/我們的個人資料。本人/我們確認並同意為本聲明中所述之目的將本人/我們的個人資料移轉至香港境外給本聲明所述的承轉人的類別。",
tip4 : "本人/我們謹此聲明上述一切陳述及資料，就本人/我們所知所信，均為事實之全部並確實無訛。"
tip1: "本人/我們謹此授權（1）任何雇主、注册西醫、醫院、診所、保險公司、銀行、政府機構、或其他機構、組織或人士、凡知道或持有任何有關保單持有人/受保人之紀錄者，均可將該等資料提供、發放及轉交給中國平安人壽保險（香港）有限公司；（2）貴公司或任何其指定之醫生或化驗所，可就此賠償申請替保單持有人/受保人進行所需之醫療評估及測試，作為稽核保單持有人/受保人之健康狀況。此授權對保單持有人/受保人之繼承人及授讓人具有約束力；即使保單持有人/受保人死亡或無行為能力時，此授權書仍具效力。",
tip2: "本人/我們確認已閱讀及明白「中國平安人壽保險（香港）有限公司」的收集個人資料聲明（本聲明）。",
tip3: "本人/我們特此確認並同意貴公司根據本聲明使用和移轉本人/我們的個人資料，包括為直接促銷之目的使用和提供本人/我們的個人資料。本人/我們確認並同意為本聲明中所述之目的將本人/我們的個人資料移轉至香港境外給本聲明所述的承轉人的類別。",
tip4: "本人/我們謹此聲明上述一切陳述及資料，就本人/我們所知所信，均為事實之全部並確實無訛。",
tip5: "您選擇的申請類型不在保險責任範圍內，請核實確認，如有疑問可",
tip6: "聯繫客服",
tip7: "您的理賠申請已經受理，我們會儘快處理本次申請。我們會短信通知理賠進度，因審核需要，可能會通知您補充相關資料或者郵寄實物。如審批通過，理賠款將默認轉入投保繳費帳戶，如需變更，",
tip8: "請上傳索償人帳戶資料。",
toast1: "醫療收據正本及帳單明細表",
toast2: "載有明確診斷之出院紙/醫生證明書等檔",
toast3: "如驗血報告、電腦掃描報告、超聲波報告等",
toast4: "本次理賠款默認轉入投保帳戶，如需變更，請上傳帳戶資料",
toast5: "如員警報告、交通意外報告等意外事故證明材料",
failure: "理賠報案失敗，",
failureContact: "請聯繫客服解決",
placeHolder1: "請選擇",
}
}
}
......
......@@ -861,16 +861,30 @@ module.exports = {
label12: "病例资料",
label13: "选传资料",
label14: "医院诊断报告",
label15: "索偿人账户资料",
label15: "索偿人资料",
label16: "其他",
label17: "授权声明：",
label18: "收集个人资料声明：",
btn: "提交",
btnUpload : "上传",
uploadFile : "已上传文件：",
contact: "我想联络客服",
tip1: "本人/我们谨此授权（1）任何雇主、注册西医、医院、诊所、保险公司、银行、政府机构、或其他机构、组织或人士、凡知道或持有任何有关保单持有人/受保人之纪录者，均可将该等数据提供、发放及转交给中国平安人寿保险（香港）有限公司；（2）贵公司或任何其指定之医生或化验所，可就此赔偿申请替保单持有人/受保人进行所需之医疗评价及测试，作为审核保单持有人/受保人之健康状况。此授权对保单持有人/受保人之继承人及授让人具有约束力；即使保单持有人/受保人死亡或无行为能力时，此授权书仍具效力。",
tip2: "本人/我们确认已阅读及明白「中国平安人寿保险（香港）有限公司」的收集个人资料声明（本声明）。",
tip3: "本人/我们特此确认并同意贵公司根据本声明使用和移转本人/我们的个人资料，包括为直接促销之目的使用和提供本人/我们的个人资料。本人/我们确认并同意为本声明中所述之目的将本人/我们的个人资料移转至香港境外给本声明所述的承转人的类别。",
tip4: "本人/我们谨此声明上述一切陈述及数据，就本人/我们所知所信，均为事实之全部并确实无讹。"
tip4: "本人/我们谨此声明上述一切陈述及数据，就本人/我们所知所信，均为事实之全部并确实无讹。",
tip5: "您选择的申请类型不在保险责任范围内，请核实确认，如有疑问可",
tip6: "联系客服",
tip7: "您的理赔申请已经受理，我们会尽快处理本次申请。我们会短信通知理赔进度，因审核需要，可能会通知您补充相关资料或者邮寄实物。如审批通过，理赔款将默认转入投保缴费账户，如需变更，",
tip8: "请上传索偿人账户资料。",
toast1 : "医疗收据正本及账单明细表",
toast2 : "载有明确诊断之出院纸/医生证明书等文件",
toast3 : "如验血报告、计算机扫描报告、超声波报告等",
toast4 : "本次理赔款默认转入投保账户，如需变更，请上传账户资料",
toast5 : "如警察报告、交通意外报告等意外事故证明材料",
failure : "理赔报案失败，",
failureContact : "请联系客服解决",
placeHolder1 : "请选择",
}
}
}
......
import api from '@/api/api'
import {
httpGet,
httpPost,
formdata
} from '@/api/fetch-api.js'
import DatePicker from '@/components/date-picker/date-picker.vue';
import ClarmsUpload from './clarms-plugins-upload.vue';
import Vue from 'vue';
import { Loading } from 'vant';
import { Select, Option } from 'element-ui';
Vue.use(Loading);
Vue.use(Select);
Vue.use(Option);
export default {
props: {
// 是否显示组件
insuredList: {
type: Array,
default() {
return []
}
},
cid: {
type: String,
default: ""
}
},
data() {
return {
showTips: false,
// 候选人所购买的保单可选择的类型
/**
* 1 意外医疗
* 2 疾病医疗
* 3 意外残疾
* 4 疾病残疾
* 5 意外死亡
* 6 疾病死亡
* 7 重大疾病
*/
typeCandidates: ['1', '2', '5', '6', '7'],
// 已经选择的类型,
typeSelected: [],
images: [],
agress: false,
data: {
insuredIndex: "",
amount: 0,
contactDate: "",
// 必传资料
HT41: null,
HT26: null,
// 非必传资料
HT29: null,
HT34: null,
HT16: null,
// 是否正在上传
HT41Uploading: false,
HT26Uploading: false,
HT29Uploading: false,
HT34Uploading: false,
HT16Uploading: false,
},
loading: false,
contactDateError: false
}
},
components: {
DatePicker,
ClarmsUpload
},
computed: {
lan() {
return this.$i18n.locale;
},
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
submitBtnDisabled() {
// 受保人
let b1 = this.data.insuredIndex ? false : true;
// 申请类型
let b2 = this.typeSelected.length > 0 ? false : true;
// 申请额度
let b3 = this.data.amount > 0 ? false : true;
// 日期校验
let b4 = this.data.contactDate ? false : true;
let b5 = this.contactDateError;
// 必传资料
let b6 = this.data.HT41 && this.data.HT41.length > 0 ? false : true;
let b7 = this.data.HT26 && this.data.HT26.length > 0 ? false : true;
// 资料上传中
let b8 = this.data.HT41Uploading || this.data.HT26Uploading || this.data.HT29Uploading || this.data.HT34Uploading || this.data.HT16Uploading;
let b9 = !this.agress;
return b1 || b2 || b3 || b4 || b5 || b6 || b7 || b8 || b9;
}
},
methods: {
initData() {
// console.log("this.insuredList = ", this.insuredList);
},
typeClickHandle(t) {
let index = this.typeSelected.indexOf(t);
if (index > -1) {
this.typeSelected.splice(index, 1);
} else {
this.typeSelected.push(t);
}
},
amountCheck() {
if (this.data.amount) {
if (this.data.amount < 0) {
this.data.amount = 0;
} else if (this.data.amount > 5000) {
this.data.amount = 5000;
}
}
},
uploadSuccess(data) {
console.log(data);
switch (data.type) {
case "HT41":
this.data.HT41Uploading = false;
this.data.HT41 = data.list;
break;
case "HT26":
this.data.HT26Uploading = false;
this.data.HT26 = data.list;
break;
case "HT29":
this.data.HT29Uploading = false;
this.data.HT29 = data.list;
break;
case "HT34":
this.data.HT34Uploading = false;
this.data.HT34 = data.list;
break;
case "HT16":
this.data.HT16Uploading = false;
this.data.HT16 = data.list;
break;
}
},
beforeUpload(data) {
console.log(data);
switch (data.type) {
case "HT41":
this.data.HT41Uploading = true;
this.data.HT41 = [];
break;
case "HT26":
this.data.HT26Uploading = true;
this.data.HT26 = [];
break;
case "HT29":
this.data.HT29Uploading = true;
this.data.HT29 = [];
break;
case "HT34":
this.data.HT34Uploading = true;
this.data.HT34 = [];
break;
case "HT16":
this.data.HT16Uploading = true;
this.data.HT16 = [];
break;
}
},
checkDate(data) {
this.contactDateError = data.disable;
if (this.contactDateError) {
}
},
toContact() {
this.$router.push({
path: "/custom/service?q=m1"
});
},
submitMaterial() {
if (this.submitBtnDisabled) {
return;
}
if (this.loading) {
return;
}
let policy = this.checkPolicy();
if (!policy) {
return;
}
let insured = this.insuredList[this.data.insuredIndex - 1];
this.loading = true;
let imageList = [];
imageList = this.data.HT41 && this.data.HT41.length > 0 ? imageList.concat(this.data.HT41) : imageList;
imageList = this.data.HT26 && this.data.HT26.length > 0 ? imageList.concat(this.data.HT26) : imageList;
imageList = this.data.HT29 && this.data.HT29.length > 0 ? imageList.concat(this.data.HT29) : imageList;
imageList = this.data.HT34 && this.data.HT34.length > 0 ? imageList.concat(this.data.HT34) : imageList;
imageList = this.data.HT16 && this.data.HT16.length > 0 ? imageList.concat(this.data.HT16) : imageList;
let params = {
cid: this.cid,
insuredId: insured.insuredId,
policyId: policy.policyId,
accidentTime : this.data.contactDate,
applyReasonList: this.typeSelected.join(","),
treatmentAmount: this.data.amount,
imageList: imageList
}
console.log("params == ", params);
httpPost({ url: api.clarmsRegisterCase, data: params }).then(res => {
this.$emit("showModal", 2);
this.loading = false;
}).catch(e => {
this.loading = false;
})
},
checkPolicy() {
// 校验选择的受保人在选择的时间点内是否有保单
if (this.contactDateError) {
return false;
}
if (!this.data.contactDate || !this.data.insuredIndex) {
return false;
}
let insured = this.insuredList[this.data.insuredIndex - 1];
if (!insured.policyInfoList || insured.policyInfoList.length <= 0) {
this.$emit("showModal", 1);
return false;
}
// console.log("insured === ", insured);
var time = new Date(this.data.contactDate.replace(/\-/g, "/") + " 00:00:00").getTime();
for (let index = 0; index < insured.policyInfoList.length; index++) {
let policy = insured.policyInfoList[index];
if (policy.activeDate <= time && policy.expireDate >= time) {
return policy;
}
}
this.$emit("showModal", 1);
return false;
}
},
watch: {
"data.insuredIndex": function () {
this.checkPolicy();
},
"data.contactDate": function () {
this.checkPolicy();
}
},
mounted() {
this.initData();
},
created() { }
}
......@@ -26,6 +26,7 @@ input {
cursor: pointer;
margin: 2.5rem auto;
text-align: center;
border-radius: 2rem;
}
.reservation-container-2 {
......@@ -40,6 +41,12 @@ input {
padding:.166667rem;
border-radius: .416667rem;
background-image: linear-gradient(to right , #ffb31d, #f15907) ;
margin: 0 1.25rem ;
min-width: 25rem ;
.clarms-select {
width: 100%;
}
}
.title {
......@@ -76,6 +83,14 @@ input {
flex-wrap: wrap;
}
.check-disabled {
cursor: default;
span {
color: $cDisabled;
}
}
.check-item {
display: flex;
align-items: center;
......@@ -114,53 +129,6 @@ input {
margin-top: .833333rem;
}
.upload-item {
.tip {
color: $cOrange;
font-size: 1rem;
margin-top: .833333rem ;
text-align: center;
width: 8.333333rem ;
letter-spacing: 1px;
}
.upload-icon-1 {
width: 8.333333rem ;
height: 8.333333rem ;
background: url("~@/assets/images/clarms/icon1.png");
background-size: 100% 100%;
}
.upload-icon-2 {
width: 8.333333rem ;
height: 8.333333rem ;
background: url("~@/assets/images/clarms/icon2.png");
background-size: 100% 100%;
}
.upload-icon-3 {
width: 8.333333rem ;
height: 8.333333rem ;
background: url("~@/assets/images/clarms/icon3.png");
background-size: 100% 100%;
}
.upload-icon-4 {
width: 8.333333rem ;
height: 8.333333rem ;
background: url("~@/assets/images/clarms/icon4.png");
background-size: 100% 100%;
}
.upload-icon-5 {
width: 8.333333rem ;
height: 8.333333rem ;
background: url("~@/assets/images/clarms/icon5.png");
background-size: 100% 100%;
}
}
.bottom-tip {
font-size: .833333rem ;
display: flex;
......@@ -201,6 +169,28 @@ input {
color: $cOrange;
font-weight: 600;
}
.tips {
align-items: center;
justify-content: center;
display: flex;
font-size: 1.333333rem;
.icon {
width:1.333333rem;
margin-right: 5px;
display: inline-block;
}
.btn {
margin-left: 0;
color: $cOrange;
font-weight: 600;
font-size: 1.333333rem;
}
}
}
......@@ -302,7 +292,7 @@ input {
.label {
align-items: center;
width: 25%;
width: 30%;
padding-left: 5px;
letter-spacing: .25rem;
......@@ -318,7 +308,7 @@ input {
}
.value {
width: 75%;
width: 70%;
position: relative;
.ipt-wrap {
......@@ -411,6 +401,16 @@ input {
}
@media (max-width: 600px) {
.reservation-container-2 {
.clarms-border{
min-width: auto;
margin: 0 .25rem;
}
}
.form {
&-item {
width: 100%;
......@@ -433,11 +433,13 @@ input {
}
&-item-2 {
display: block;
.label {
width: 30%;
width: 100%;
margin-bottom:10px;
}
.value {
width: 70%;
width: 100%;
}
.date-container {
......
......@@ -4,9 +4,15 @@
<div class="title default-mt">
<span>{{$t('clarms.step2.label1')}}</span>
<div class="clarms-border">
<el-select v-model="data.insured">
<el-option v-for="(item,index) in insuredList" :key="index" :label="item.insuredNameCn" :value="item.insuredNameCn">
<el-select class="clarms-select" v-model="data.insuredIndex" :placeholder="$t('clarms.step2.placeHolder1')">
<template v-if="lan == 'en'">
<el-option v-for="(item,index) in insuredList" :key="index" :label="item.insuredNameEn" :value="index + 1">
</el-option>
</template>
<template v-else>
<el-option v-for="(item,index) in insuredList" :key="index" :label="item.insuredNameCn" :value="index + 1">
</el-option>
</template>
</el-select>
</div>
<span>{{$t('clarms.step2.label2')}}</span>
......@@ -30,21 +36,20 @@
<div class="check-item pointer" v-if="typeCandidates.indexOf('2') > -1" @click="typeClickHandle('2')">
<img v-if="typeSelected.indexOf('2') > -1" src="@/assets/images/clarms/checked.png">
<img v-else src="@/assets/images/clarms/uncheck.png">
<span>{{$t('clarms.step2.op2')}}</span>
</div>
<div class="check-item pointer" v-if="typeCandidates.indexOf('3') > -1" @click="typeClickHandle('3')">
<img v-if="typeSelected.indexOf('3') > -1" src="@/assets/images/clarms/checked.png">
<img v-else src="@/assets/images/clarms/uncheck.png">
<span>{{$t('clarms.step2.op3')}}</span>
</div>
<div class="check-item pointer" v-if="typeCandidates.indexOf('4') > -1" @click="typeClickHandle('4')">
<img v-if="typeSelected.indexOf('4') > -1" src="@/assets/images/clarms/checked.png">
<img v-else src="@/assets/images/clarms/uncheck.png">
<div class="check-item check-disabled">
<img src="@/assets/images/clarms/uncheck-disabled.png">
<!-- <img v-if="typeSelected.indexOf('2') > -1" src="@/assets/images/clarms/checked.png">
<img v-else src="@/assets/images/clarms/uncheck.png"> -->
<span>{{$t('clarms.step2.op2')}}</span>
</div>
<div class="check-item check-disabled">
<img src="@/assets/images/clarms/uncheck-disabled.png">
<span>{{$t('clarms.step2.op4')}}</span>
</div>
<div class="check-item pointer" v-if="typeCandidates.indexOf('5') > -1" @click="typeClickHandle('5')">
<img v-if="typeSelected.indexOf('5') > -1" src="@/assets/images/clarms/checked.png">
<img v-else src="@/assets/images/clarms/uncheck.png">
<div class="check-item check-disabled">
<img src="@/assets/images/clarms/uncheck-disabled.png">
<span>{{$t('clarms.step2.op5')}}</span>
</div>
</div>
......@@ -62,7 +67,7 @@
<div class="value">
<div>
<div class="ipt-wrap">
<input class="ipt2" type="number">
<input class="ipt2" type="number" v-model="data.amount" @blur="amountCheck">
</div>
</div>
<div class="tips"><img src="@/assets/images/clarms/impor.png"> <span>{{$t('clarms.step2.label8')}}</span></div>
......@@ -90,8 +95,8 @@
</div>
</div>
<div class="value">
<clarms-upload :icon="require('@/assets/images/clarms/icon1.png')" :options="{name:$t('clarms.step2.label11'),imageTypeID:'HT41',imageMainTypeID:'HT11',imageFileName:'医疗收费票据/医疗收据'}" @success="uploadSuccess"></clarms-upload>
<clarms-upload class="mt20" :icon="require('@/assets/images/clarms/icon2.png')" :options="{name:$t('clarms.step2.label12'),imageTypeID:'HT26',imageMainTypeID:'HT06',imageFileName:'住院病历'}"></clarms-upload>
<clarms-upload :icon="require('@/assets/images/clarms/icon1.png')" :options="{name:$t('clarms.step2.label11'),imageTypeID:'HT41',imageMainTypeID:'HT11',toast:$t('clarms.step2.toast1')}" @success="uploadSuccess" @beforeUpload="beforeUpload"></clarms-upload>
<clarms-upload class="mt20" :icon="require('@/assets/images/clarms/icon2.png')" :options="{name:$t('clarms.step2.label12'),imageTypeID:'HT26',imageMainTypeID:'HT06',toast:$t('clarms.step2.toast2')}" @success="uploadSuccess" @beforeUpload="beforeUpload"></clarms-upload>
</div>
</div>
......@@ -102,9 +107,9 @@
</div>
</div>
<div class="value">
<clarms-upload :icon="require('@/assets/images/clarms/icon3.png')" :options="{name:$t('clarms.step2.label14'),imageTypeID:'HT29',imageMainTypeID:'HT06',imageFileName:'检查报告'}"></clarms-upload>
<clarms-upload class="mt20" :icon="require('@/assets/images/clarms/icon4.png')" :options="{name:$t('clarms.step2.label15'),imageTypeID:'HT34',imageMainTypeID:'HT08',imageFileName:'银行账户'}"></clarms-upload>
<clarms-upload class="mt20" :icon="require('@/assets/images/clarms/icon5.png')" :options="{name:$t('clarms.step2.label16'),imageTypeID:'HT16',imageMainTypeID:'HT03',imageFileName:'警察报告/证明'}"></clarms-upload>
<clarms-upload :icon="require('@/assets/images/clarms/icon3.png')" :options="{name:$t('clarms.step2.label14'),imageTypeID:'HT29',imageMainTypeID:'HT06',toast:$t('clarms.step2.toast3')}" @success="uploadSuccess" @beforeUpload="beforeUpload"></clarms-upload>
<clarms-upload class="mt20" :icon="require('@/assets/images/clarms/icon4.png')" :options="{name:$t('clarms.step2.label15'),imageTypeID:'HT34',imageMainTypeID:'HT08',toast:$t('clarms.step2.toast4')}" @success="uploadSuccess" @beforeUpload="beforeUpload"></clarms-upload>
<clarms-upload class="mt20" :icon="require('@/assets/images/clarms/icon5.png')" :options="{name:$t('clarms.step2.label16'),imageTypeID:'HT16',imageMainTypeID:'HT03',toast:$t('clarms.step2.toast5')}" @success="uploadSuccess" @beforeUpload="beforeUpload"></clarms-upload>
</div>
</div>
</div>
......@@ -122,9 +127,20 @@
<span>{{$t('clarms.step2.tip4')}}</span>
</div>
<div class="submit-btn">{{$t('clarms.step2.btn')}}</div>
<div class="submit-btn pointer flex-center" :class="{disabled: submitBtnDisabled || showTips}" @click="submitMaterial">
<van-loading v-if="loading" />
{{$t('clarms.step2.btn')}}
</div>
<div class="contact" v-if="!showTips" @click="toContact">{{$t('clarms.step2.contact')}}</div>
<div class="contact" @click="toContact">{{$t('clarms.step2.contact')}}</div>
<div class="tips" v-if="showTips">
<img class="icon" src="@/assets/images/common/icon-alert-i.png" alt="">
<div class="txt">
{{$t('clarms.step2.failure')}}
<span class="pointer btn" @click="toContact">{{$t('clarms.step2.failureContact')}}</span>
</div>
</div>
</div>
</template>
......
import api from '@/api/api'
import {
httpGet,
httpPost,
formdata
} from '@/api/fetch-api.js'
import Vue from 'vue';
import DatePicker from '@/components/date-picker/date-picker.vue';
import { Loading } from 'vant';
Vue.use(Loading);
export default {
data() {
return {
data : {},
reservationTypes: []
}
},
components: {
DatePicker
},
components: {},
computed: {
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
},
methods: {
initData() {
},
checkDate(){
onOverLayHandler() {
this.$emit("close");
},
toContact() {
this.$router.push({
path: "/custom/service?q=m1"
});
}
},
watch: {
mounted() {
},
mounted() {
created() {
this.initData();
},
created() { }
watch: {
},
}
......
@import '@/styles/_support';
.comp {
position: fixed;
top: 0;
left: 0;
z-index: 999;
width: 100%;
height: 100%;
@extend .fcc;
text-align: center;
}
.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba($color: #000000, $alpha: 0.7);
}
.modal {
position: relative;
@extend .bb;
width: 63.333333rem;
// height: 28.5rem;
border-radius: .8333rem;
background-color: #ffffff;
padding: 3.5rem 2rem 2.5rem;
border: .083333rem solid $cOrange;
.content {
display: flex;
justify-content: flex-start;
align-items: center;
padding: 10rem 8.333333rem;
.info-icon {
width: 10rem;
min-width: 6rem;
img {
width:100%;
}
}
.message {
margin-left: 1.666667rem;
font-size: 1.333333rem;
font-weight: 600;
color: $cOrange;
letter-spacing: .083333rem ;
text-align: left;
line-height: 1.5;
span {
cursor: pointer;
text-decoration: underline;
}
}
}
.close {
cursor: pointer;
img {
width: 1.666667rem ;
position: absolute;
right: -2.5rem;
top: -1.666667rem ;
}
}
}
@media (max-width: 800px) {
.modal {
// height: 28.5rem;
padding: 3rem 1.5rem;
width: 80%;
height: auto;
.content {
padding: 5rem 4rem;
}
.close {
display: none;
}
}
}
@media (max-width: 700px) {
.modal {
// height: 28.5rem;
padding: 3rem 1.5rem;
width: 80%;
height: auto;
.content {
padding: 4rem 2rem;
}
.close {
display: none;
}
}
}
@media (max-width: 450px) {
.modal {
// height: 28.5rem;
padding: 3rem 1.5rem;
width: 90%;
height: auto;
.close {
display: none;
}
.content {
padding: 2rem .5rem;
}
}
}
<template>
<div class="comp">
<div @click="onOverLayHandler()" class="overlay"></div>
<div class="modal">
<div class="close" @click="onOverLayHandler()"><img src="@/assets/images/clarms/close.png"></div>
<div class="content">
<div class="info-icon">
<img src="@/assets/images/clarms/info.png">
</div>
<div class="message">
{{$t('clarms.step2.tip5')}}<span @click="toContact">{{$t('clarms.step2.tip6')}}</span>
</div>
</div>
</div>
</div>
</template>
<script src="./clarms-plugins-modal1.js"></script>
<style lang="scss" scoped>
@import "./clarms-plugins-modal1.scss";
</style>
export default {
data() {
return {
}
},
components: {},
computed: {
},
methods: {
initData() {
},
onOverLayHandler() {
this.$emit("close");
},
toContact() {
this.$router.push({
path: "/custom/service?q=m1"
});
}
},
mounted() {
},
created() {
this.initData();
},
watch: {
},
}
@import '@/styles/_support';
.comp {
position: fixed;
top: 0;
left: 0;
z-index: 999;
width: 100%;
height: 100%;
@extend .fcc;
text-align: center;
}
.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba($color: #000000, $alpha: 0.7);
}
.modal {
position: relative;
@extend .bb;
width: 63.333333rem;
// height: 28.5rem;
border-radius: .8333rem;
background-color: #ffffff;
padding: 3.5rem 2rem 2.5rem;
border: .083333rem solid $cOrange;
.content {
display: flex;
justify-content: flex-start;
align-items: center;
padding: 10rem 8.333333rem;
.info-icon {
width: 10rem;
min-width: 6rem;
img {
width:100%;
}
}
.message {
margin-left: 1.666667rem;
font-size: 1.333333rem;
font-weight: 600;
color: $cOrange;
letter-spacing: .083333rem ;
text-align: left;
line-height: 1.5;
span {
cursor: pointer;
text-decoration: underline;
}
}
}
.close {
cursor: pointer;
img {
width: 1.666667rem ;
position: absolute;
right: -2.5rem;
top: -1.666667rem ;
}
}
}
@media (max-width: 800px) {
.modal {
// height: 28.5rem;
padding: 3rem 1.5rem;
width: 80%;
height: auto;
.content {
padding: 5rem 4rem;
}
.close {
display: none;
}
}
}
@media (max-width: 700px) {
.modal {
// height: 28.5rem;
padding: 3rem 1.5rem;
width: 80%;
height: auto;
.content {
padding: 4rem 2rem;
}
.close {
display: none;
}
}
}
@media (max-width: 450px) {
.modal {
// height: 28.5rem;
padding: 3rem 1.5rem;
width: 90%;
height: auto;
.close {
display: none;
}
.content {
padding: 2rem .5rem;
}
}
}
<template>
<div class="comp">
<div @click="onOverLayHandler()" class="overlay"></div>
<div class="modal">
<div class="close" @click="onOverLayHandler()"><img src="@/assets/images/clarms/close.png"></div>
<div class="content">
<div class="info-icon">
<img src="@/assets/images/clarms/suc.png">
</div>
<div class="message">
{{$t('clarms.step2.tip7')}}<span @click="onOverLayHandler">{{$t('clarms.step2.tip8')}}</span>
</div>
</div>
</div>
</div>
</template>
<script src="./clarms-plugins-modal2.js"></script>
<style lang="scss" scoped>
@import "./clarms-plugins-modal2.scss";
</style>
......@@ -25,6 +25,8 @@ export default {
imageMainTypeID: "",
// 副单证类型
imageTypeID: "",
// toast消息
toast: "",
};
}
},
......@@ -70,7 +72,7 @@ export default {
if (this.uploading) {
return;
}
this.$emit("beforeUpload", { type: this.options.imageTypeID });
let _this = this;
let input = document.createElement("input");
input.setAttribute("type", "file");
......@@ -119,17 +121,26 @@ export default {
key: item.key
}
formdata({ url: api.uploadClarmsImage, data: param }).then(res => {
if (res && res.content && res.content.id) {
item.fileName = res.content.fileName;
item.cacheKey = res.content.id;
clearInterval(item.intervial);
item.intervial = false;
this.$set(this, "images", this.images);
this.refreshUploadNumber();
} else {
clearInterval(item.intervial);
item.intervial = false;
item.err = "失败";
this.$set(this, "images", this.images);
this.refreshUploadNumber();
}
}).catch(err => {
clearInterval(item.intervial);
item.intervial = false;
item.err = "失败";
this.$set(this, "images", this.images);
this.refreshUploadNumber();
});
},
refreshUploadNumber() {
......@@ -175,7 +186,7 @@ export default {
if (this.uploading) {
return;
}
let result = [];
let list = [];
let len = this.images.length;
if (len < 0) {
return false;
......@@ -187,14 +198,17 @@ export default {
}
// 结果
let res = {
seqNumber: index + 1,
cloudStorageID: d.cacheKey,
imageFileName: this.options.imageFileName,
imageFileName: d.fileName,
imageMainTypeID: this.options.imageMainTypeID,
imageTypeID: this.options.imageTypeID
}
result.push(res);
list.push(res);
}
let result = {
type: this.options.imageTypeID,
list: list
};
this.$emit("success", result);
}
},
......
......@@ -7,11 +7,11 @@
<img class="clarms-icon" :src='icon'>
<div class="clarms-title-container">
<div class="clarms-t1" :class="{clarmsActivty:images && images.length > 0}">{{options.name}}</div>
<div class="clarms-t2">已上传文件：{{uploadFiles}}</div>
<div class="clarms-t2">{{$t('clarms.step2.uploadFile')}}{{uploadFiles}}</div>
</div>
</div>
<div class="clarms-btn" :class="{disabled:uploading}" @click="selectMutilFile">
上传
{{$t('clarms.step2.btnUpload')}}
</div>
</div>
<div v-if="images && images.length > 0">
......
import api from '@/api/api'
import {
httpGet,
httpPost,
formdata
} from '@/api/fetch-api.js'
import { getPolicyIdTypeList } from '@/utils/biz.js';
import Vue from 'vue';
import DatePicker from '@/components/date-picker/date-picker.vue';
import { Loading } from 'vant';
import { Selector, Options } from 'element-ui';
Vue.use(Loading);
export default {
data() {
return {
birthdayIllegal: false,
loading: false,
showTips: false,
data: {
// firstName: "玛丽",
// lastName: "何",
// birthDate: "1999-07-15",
// idNo: "H4099030",
// idType: "40"
firstName: "",
lastName: "",
birthDate: "",
idNo: "",
idType: ""
}
}
},
components: {
DatePicker
},
computed: {
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
policyIdTypeList() {
return getPolicyIdTypeList(this.$i18n.locale);
},
btnDisabled() {
let b1 = this.data.firstName ? false : true;
let b2 = this.data.lastName ? false : true;
let b3 = this.data.birthDate ? false : true;
let b4 = this.data.idType ? false : true;
let b5 = this.data.idNo ? false : true;
let b6 = this.birthdayIllegal;
return b1 || b2 || b3 || b4 || b5 || b6;
}
},
methods: {
initData() {
},
checkDate(data) {
this.birthdayIllegal = data.disable;
},
toRegisterPage() {
this.$router.push({
path: "/register"
});
},
toLoginPage() {
this.$router.push({
path: "/login"
});
},
toContactUs() {
this.$router.push({
path: "/custom/service?q=m1"
});
},
handleConfirm() {
if (this.btnDisabled) {
return;
}
if (this.loading) {
return;
}
this.loading = true;
httpPost({ url: api.getCidByVerify, data: this.data }).then(res => {
if (res) {
let cid = res;
httpPost({ url: api.clarmsCustomerList, data: { cid: cid } }).then(res => {
this.loading = false;
if (res && res.insuredInfoList && res.insuredInfoList.length > 0) {
sessionStorage.setItem("clarmsRequestCid", cid);
this.$emit("insuredInfoList", { cid: cid, list: res.insuredInfoList });
} else {
this.showTips = true;
}
}).catch(e => {
this.loading = false;
this.showTips = true;
});
} else {
this.loading = false;
this.showTips = true;
}
}).catch(e => {
this.loading = false;
});
}
},
watch: {
'data.firstName': function () {
this.showTips = false;
},
'data.lastName': function () {
this.showTips = false;
},
'data.birthDate': function () {
this.showTips = false;
},
'data.idNo': function () {
this.showTips = false;
},
'data.idType': function () {
this.showTips = false;
},
},
mounted() {
this.initData();
},
created() { }
}
@import '@/styles/_support';
input {
padding: 0 2.083333rem;
color: #333333;
}
.orange {
color: $cOrange;
......@@ -17,14 +13,15 @@ input {
background: url("~@assets/images/vhis/vhis-btn.png");
background-size: 100% 100%;
background-repeat: no-repeat;
width: 15rem;
height: 2.5rem;
line-height: 2.5rem;
width: 18rem;
height: 3rem;
line-height: 3rem;
color: white;
font-weight: 600;
cursor: pointer;
margin: 2.5rem auto;
text-align: center;
border-radius: 1.666667rem;
}
.reservation-container {
......@@ -41,7 +38,7 @@ input {
margin: 1.666667rem auto 0 auto;
span {
padding: 0 .166667rem;
margin: 0 .333333rem ;
}
}
......@@ -69,6 +66,21 @@ input {
margin-left: .833333rem;
}
}
.tips {
align-items: center;
justify-content: center;
display: flex;
.icon {
margin-right: 5px;
display: inline-block;
}
.btn {
color: $cOrange;
}
}
}
......@@ -93,7 +105,7 @@ input {
border-radius: .416667rem ;
height: 3rem;
align-items: center;
padding-left: .833333rem;
padding: 0 2rem;
}
&-item {
......@@ -106,7 +118,7 @@ input {
.label {
display: flex;
align-items: center;
min-width: 30%;
width: 30%;
justify-content: flex-start;
padding-left: 5px;
letter-spacing: .25rem;
......
<template>
<div class="reservation-container">
<div class="title"><u><span class="pointer">{{$t('clarms.step1.register')}}</span>/<span class="pointer">{{$t('clarms.step1.login')}}</span></u>{{$t('clarms.step1.t1')}}</div>
<div class="title"><u><span class="pointer" @click="toRegisterPage">{{$t('clarms.step1.register')}}</span>/<span class="pointer" @click="toLoginPage">{{$t('clarms.step1.login')}}</span></u>{{$t('clarms.step1.t1')}}</div>
<div class="form-name default-mt"> {{$t('clarms.step1.label0')}}</div>
<div class="gird-g form default-mt">
<div class="pure-u-1 pure-u-md-1-2 form-item">
......@@ -8,7 +8,7 @@
{{$t('clarms.step1.label1')}}
</div>
<div class="ipt-wrap">
<input class="ipt" type="text" v-model="data.name">
<input class="ipt" type="text" v-model="data.lastName">
</div>
</div>
......@@ -17,7 +17,7 @@
{{$t('clarms.step1.label2')}}
</div>
<div class="ipt-wrap">
<input class="ipt" type="text" v-model="data.name">
<input class="ipt" type="text" v-model="data.firstName">
</div>
</div>
......@@ -27,9 +27,9 @@
</div>
<div class="ipt-wrap">
<div class="down-arrow"></div>
<select class="ipt" v-model="data.reservationType">
<option v-for="(item,index) in reservationTypes" :key="index" :value="item.value">{{item.name}}</option>
</select>
<el-select class="ipt" v-model="data.idType" :placeholder="$t('clarms.step2.placeHolder1')">
<el-option v-for="(item, index) in policyIdTypeList" :key="index" :label="item.n" :value="item.v"></el-option>
</el-select>
</div>
</div>
......@@ -38,7 +38,7 @@
{{$t('clarms.step1.label4')}}
</div>
<div class="ipt-wrap">
<input class="ipt" type="text" v-model="data.name">
<input class="ipt" type="text" v-model="data.idNo">
</div>
</div>
......@@ -48,11 +48,21 @@
</div>
<div class="ipt-wrap">
<div class="down-arrow"></div>
<date-picker class="ipt-date" v-model="data.contactDate" :filtModel="['future']" :check="checkDate" :cusStyle="{border:'none !important','background-color':'transparent !important',height:'3rem', 'color':'#f05a23','font-weight':'600'}"></date-picker>
<date-picker class="ipt-date" v-model="data.birthDate" :filtModel="['future']" :check="checkDate" :cusStyle="{border:'none !important','background-color':'transparent !important',height:'3rem', padding:'0', color:'#606266'}"></date-picker>
</div>
</div>
</div>
<div class="submit-btn">{{$t('clarms.step1.btn')}}</div>
<div class="submit-btn pointer flex-center" @click="handleConfirm" :class="{disabled : btnDisabled}">
<van-loading v-if="loading" />
<span>{{$t('clarms.step1.btn')}}</span>
</div>
<div class="tips" v-if="showTips">
<img class="icon" src="@/assets/images/common/icon-alert-i.png" alt="">
<div class="txt">
{{$t('customService.insuranceQuery.noPolicy')}}
<span class="pointer btn" @click="toContactUs">{{$t('customService.insuranceQuery.customService')}}</span>
</div>
</div>
</div>
</template>
......
import api from '@/api/api'
import {
httpGet,
httpPost,
formdata
} from '@/api/fetch-api.js'
import DatePicker from '@/components/date-picker/date-picker.vue';
import ClarmsUpload from './clarms-plugins-upload.vue';
import Vue from 'vue';
import { Loading, List } from 'vant';
import { Select, Option } from 'element-ui';
Vue.use(Loading);
Vue.use(Select);
Vue.use(Option);
export default {
props: {
// 是否显示组件
insuredList: {
type: Array,
default() {
return []
}
}
},
data() {
return {
uploadFiles: 0,
typeCandidates: ['1', '2', '3', '4', '5'], // 候选人所购买的保单可选择的类型
typeSelected: [], // 已经选择的类型,
images: [],
agress: false,
data: {
contactDate: "",
insured: {}
},
contactDateError: false
}
},
components: {
DatePicker,
ClarmsUpload
},
computed: {
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
},
methods: {
initData() {
console.log("this.insuredList = " , this.insuredList);
},
typeClickHandle(t) {
let index = this.typeSelected.indexOf(t);
if (index > -1) {
this.typeSelected.splice(index, 1);
} else {
this.typeSelected.push(t);
}
},
uploadSuccess(data) {
console.log(data);
},
checkDate(data) {
this.contactDateError = data.disable;
if (this.contactDateError) {
}
},
toContact() {
this.$router.push({
path: "/custom/service?q=m1"
});
},
},
watch: {
},
mounted() {
this.initData();
},
created() { }
}
......@@ -10,8 +10,10 @@ import {
httpPost
} from '@/api/fetch-api.js'
import ClarmsVerifyForm from './clarms-plugins-verifyform.vue';
import ClarmsMaterial from './clarms-plugins-material.vue';
import ClarmsModalOne from '@/components/clarms/clarms-plugins-modal1.vue';
import ClarmsModalTwo from '@/components/clarms/clarms-plugins-modal2.vue';
import ClarmsVerifyForm from '@/components/clarms/clarms-plugins-verifyform.vue';
import ClarmsMaterial from '@/components/clarms/clarms-plugins-material.vue';
// 用户没有登录
// 校验成功
......@@ -26,6 +28,8 @@ export default {
data() {
return {
step: 0, // 1是表单；2是报案页面
showModal1: false,
showModal2: false,
agress: false,
reservationTypes: [],
cid: false,
......@@ -35,7 +39,9 @@ export default {
},
components: {
ClarmsVerifyForm,
ClarmsMaterial
ClarmsMaterial,
ClarmsModalOne,
ClarmsModalTwo
},
computed: {
...mapState({
......@@ -92,15 +98,26 @@ export default {
this.step = 1;
});
},
handleInsuredInfo(data) {
this.cid = data.cid;
this.customerList = data.list;
this.step = 2;
},
handleShowModal(modalIndex) {
console.log(modalIndex);
if (modalIndex == 1) {
this.showModal1 = true;
} else if (modalIndex == 2) {
this.showModal2 = true;
}
},
logoutAction() {
console.log("logoutAction");
this.sid = false;
this.hadQueryCustomerList = false;
this.customerList = [];
this.step = 1;
},
loginAction() {
console.log("loginAction");
this.sid = false;
this.hadQueryCustomerList = false;
this.customerList = [];
......
<template>
<div>
<clarms-modal-one v-if="showModal1" @close="showModal1 = false"></clarms-modal-one>
<clarms-modal-two v-if="showModal2" @close="showModal2 = false"></clarms-modal-two>
<div class="mobile-margin">
<template v-if="step == 1">
<clarms-verify-form></clarms-verify-form>
<clarms-verify-form @insuredInfoList="handleInsuredInfo"></clarms-verify-form>
</template>
<template v-if="step == 2">
<clarms-material :insuredList="customerList"></clarms-material>
<clarms-material :insuredList="customerList" :cid="cid" @showModal="handleShowModal"></clarms-material>
</template>
</div>
</div>
</template>
<script src="./clarms.js"></script>
......
......@@ -3,8 +3,7 @@
input {
padding: 0 2.083333rem;
color: #333333;
padding: 0 2rem;
}
.top-space {}
......
......@@ -73,3 +73,13 @@
background-image: none !important;
box-shadow: none !important;
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
input {
color:'#606266'
}
\ No newline at end of file
......
......@@ -37,7 +37,8 @@ $cGreen:#006441;
$cGray:#bfbfbf;
$cGray2:#494949;
$cDark:#dcdcdc;
$cLightBlack:#333333;
$cLightBlack:#606266;
$cDisabled:#888888;
// 文章宽度
$articleWidth:1041px;
......