partnerApp/pages/carInsure2/insureItems.vue

<template>
	<view class="page">
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
		<view class="plan-ins-title dis j-s a-c">
			<text>车船税</text>
		</view>
		<view class="compulsory-insurance">
			<u-form ref="uForm" :model="vehicleAndVesselTaxForm" label-width="130px">
				<u-form-item label="纳税类型" prop="taxRelifFlag" class="modelformcss">
					<u-input type="select" :select-open="taxRelifFlagShow" v-model="model.taxRelifFlag"
						:custom-style="{textAlign:'right'}" placeholder="请选择纳税类型"
						@click="taxRelifFlagShow = true"></u-input>
					<u-select mode="single-column" :list="taxRelifFlagoptions" v-model="taxRelifFlagShow"
						label-name="dictTag" value-name="dictValue"
						@confirm="taxRelifFlagConfirm($event,'taxRelifFlag')"></u-select>
				</u-form-item>
				<u-form-item
					v-show="vehicleAndVesselTaxForm.taxRelifFlag == 2 || vehicleAndVesselTaxForm.taxRelifFlag == 3"
					label="减免税凭证号" prop="extendChar2" class="modelformcss">
					<u-input placeholder="请输入减免税凭证号" :custom-style="{textAlign:'right'}"
						v-model="vehicleAndVesselTaxForm.extendChar2" type="text"></u-input>
				</u-form-item>
				<u-form-item v-show="vehicleAndVesselTaxForm.taxRelifFlag == 4" label="完税凭证号" prop="paidFreeCertificate"
					class="modelformcss">
					<u-input placeholder="请输入完税凭证号" :custom-style="{textAlign:'right'}"
						v-model="vehicleAndVesselTaxForm.paidFreeCertificate" type="text"></u-input>
				</u-form-item>
				<u-form-item
					v-show="vehicleAndVesselTaxForm.taxRelifFlag == 2 || vehicleAndVesselTaxForm.taxRelifFlag == 3"
					label="减免税原因" prop="relifReason" class="modelformcss">
					<u-input type="select" :select-open="relifReasonShow" v-model="model.relifReason"
						:custom-style="{textAlign:'right'}" placeholder="请选择减免税原因"
						@click="relifReasonShow = true"></u-input>
					<u-select mode="single-column" :list="relifReasonoptions" v-model="relifReasonShow"
						label-name="dictTag" value-name="dictValue"
						@confirm="taxRelifFlagConfirm($event,'relifReason')"></u-select>
				</u-form-item>
				<u-form-item v-show="vehicleAndVesselTaxForm.taxRelifFlag != 1" label="税务机关代码" prop="taxComCode"
					class="modelformcss">
					<u-input placeholder="请输入税务机关代码" :custom-style="{textAlign:'right'}"
						v-model="vehicleAndVesselTaxForm.taxComCode" type="text"></u-input>
				</u-form-item>
				<u-form-item v-show="vehicleAndVesselTaxForm.taxRelifFlag != 1" label="税务机关名称" prop="taxComName"
					class="modelformcss">
					<u-input placeholder="请输入税务机关名称" :custom-style="{textAlign:'right'}"
						v-model="vehicleAndVesselTaxForm.taxComName" type="text"></u-input>
				</u-form-item>
				<u-form-item v-show="vehicleAndVesselTaxForm.taxRelifFlag == 4" label="完税凭证填发日期" prop="taxDocumentDate"
					class="modelformcss">
					<u-input type="select" :select-open="taxDocumentDateShow" :custom-style="{textAlign:'right'}"
						v-model="vehicleAndVesselTaxForm.taxDocumentDate" placeholder="请选择时间"
						@click="taxDocumentDateShow = true"></u-input>
					<u-picker v-model="taxDocumentDateShow" mode="time" :params="params1"
						@confirm="taxDocumentDateconfirm"></u-picker>
				</u-form-item>
				<u-form-item v-show="vehicleAndVesselTaxForm.taxRelifFlag == 4" label="完税凭证地区" prop="taxPaidAreaCode"
					class="modelformcss">
					<u-input type="select" :select-open="taxPaidAreaCodeShow" :custom-style="{textAlign:'right'}"
						v-model="model.taxPaidAreaCode" placeholder="请选择地区"
						@click="taxPaidAreaCodeShow = true"></u-input>
					<u-picker mode="region" v-model="taxPaidAreaCodeShow" :params="params2"
						@confirm="taxPaidAreaCodeconfirm"></u-picker>
				</u-form-item>
				<u-form-item v-show="vehicleAndVesselTaxForm.taxRelifFlag == 3" label="减税比例" prop="taxRelief"
					class="modelformcss">
					<u-input placeholder="请输入0~1的小数" :custom-style="{textAlign:'right'}"
						v-model="vehicleAndVesselTaxForm.taxRelief" type="text"></u-input>
				</u-form-item>
			</u-form>
		</view>
		<view class="plan-ins-title dis j-s a-c">
			<text>交强险</text>
			<u-switch v-model="jqchecked" active-color="#0052FF" inactive-color="#eee" size='30'
				@change="jqImmediate"></u-switch>
		</view>
		<view class="compulsory-insurance">
			<view class=" immediately  dis j-s a-c" style="border-bottom: 1px solid #eee;">
				<text>即时投保</text>
				<view class="dis a-c j-c">
					<view class="status-data" :class="item.value==jqimmediately? 'active':''"
						v-for="(item,index) in jqimmediatelyList"
						@tap="immediatelyClick(item.value,'jqimmediately','jqstartDate','jqendDate')" :key="index">
						{{item.label}}
					</view>
				</view>
			</view>
			<u-form ref="uForm" label-width="120px" v-if="CIInsureList.amount!=0">
				<u-form-item label="交强险投保日期" class="modelformcss">
					<u-input type="select" :select-open="jqstartShow" :custom-style="{textAlign:'right'}"
						v-model="jqstartDate" placeholder="请选择开始时间" @click="jqstartShow = true"></u-input>
					<u-picker v-model="jqstartShow" mode="time" :params="params" @confirm="jqstartconfirm"></u-picker>
				</u-form-item>
				<u-form-item label="交强险终保日期" class="modelformcss">
					<u-input type="select" :select-open="jqendShow" :custom-style="{textAlign:'right'}"
						v-model="jqendDate" placeholder="请选择结束时间" @click="jqendShow = true"></u-input>
					<u-picker v-model="jqendShow" mode="time" :params="params" @confirm="jqendconfirm"></u-picker>
				</u-form-item>
			</u-form>
		</view>
		<view class="plan-ins-title dis j-s a-c">
			<text>商业险</text>
			<u-switch v-model="sychecked" active-color="#0052FF" inactive-color="#eee" size='30'
				@change="syImmediate"></u-switch>
		</view>
		<view class="business-insurance">
			<view class=" immediately  dis j-s a-c" style="border-bottom: 1px solid #eee;">
				<text>即时投保</text>
				<view class="dis a-c j-c">
					<view class="status-data" :class="item.value==syimmediately? 'active':''"
						v-for="(item,index) in syimmediatelyList"
						@tap="immediatelyClick(item.value,'syimmediately','systartDate','syendDate')" :key="index">
						{{item.label}}
					</view>
				</view>
			</view>
			<u-form ref="uForm" label-width="120px" v-if="BIInsureList.amount!=0">
				<u-form-item label="商业险投保日期" class="modelformcss">
					<u-input type="select" :select-open="systartShow" :custom-style="{textAlign:'right'}"
						v-model="systartDate" placeholder="请选择开始时间" @click="systartShow = true"></u-input>
					<u-picker v-model="systartShow" mode="time" :params="params" @confirm="systartconfirm"></u-picker>
				</u-form-item>
				<u-form-item label="商业险终保日期" class="modelformcss">
					<u-input type="select" :select-open="syendShow" :custom-style="{textAlign:'right'}"
						v-model="syendDate" placeholder="请选择开始时间" @click="syendShow = true"></u-input>
					<u-picker v-model="syendShow" mode="time" :params="params" @confirm="syendconfirm"></u-picker>
				</u-form-item>
			</u-form>
			<view v-if="BIInsureList.amount!=0" class="immediately">
				<view class=" dis f-c" style="background: #F9F9F9;border-radius: 10px;">
					<block v-for="(insureItem,index) in insureList" :key="index">
						<template v-if="insureItem.amount != 0">
							<view class="car-ins-cell d-flex j-sb common-ins-cell" @tap="adjustBIItem(index)">
								<view class="cell-title d-flex a-center j-center">{{insureItem.kindName}}</view>
								<view class="cell-desc d-flex a-center j-center">{{insureItem.amountDesc}}
									<view class="icon iconfont icon-youjiantou"
										style="font-size: 40rpx;margin-left: 20upx;color: #C7C6CA;">
									</view>
								</view>
							</view>
						</template>
					</block>
				</view>
			</view>
		</view>
		<view class="compulsory-insurance">
			<block v-for="(insureItem,index) in insureList" :key="index">
				<template
					v-if="(insureItem.amount == 0) && (insureItem.isMainRisk || (insureItem.isMainRisk && (insureCodeList.indexOf(insureItem.mainRiskCodeList)>=0)))  ">
					<view class="car-ins-cell d-flex j-sb common-ins-cell" @tap="adjustBIItem(index)">
						<view class="cell-title d-flex a-center j-center">{{insureItem.kindName}}</view>
						<view class="cell-desc d-flex a-center j-center">{{insureItem.amountDesc}}
							<view class="icon iconfont icon-youjiantou"
								style="font-size: 40rpx;margin-left: 20upx;color: #C7C6CA;">
							</view>
						</view>
					</view>
				</template>
			</block>
		</view>
		<view class="bottom-btn">
			<u-button type="primary" style="background-color: #0052FF;color: #fff;" @tap="toQuote">下一步</u-button>
		</view>
		<!-- 商业选择方案 -->
		<wyb-popup ref="popupBI" type="bottom" mode="size-fixed" height="900" radius="6" :showCloseIcon="true">
			<view class="popup-content">
				<view class="popHeader d-flex a-center j-center">
					选择方案
				</view>
				<scroll-view scroll-top="0" scroll-y="true" class="popContent">
					<view class="popContentTitle">{{insureItem.kindName}}</view>
					<view style="color: #999;font-size: 24upx;">{{insureItem.desc}}</view>
					<view class="dis a-c j-s p-3" v-if="['TY2','TY3','TY4'].includes(insureItem.kindCode)">
						<text>自定义次数</text>
						<u-number-box v-model="insureItem.amount" :input-width="100" :input-height="60" :min="0"
							color="#fff" size="30" @change="numberBoxChange"></u-number-box>
					</view>
					<view v-else style="margin-top: 10px;">
						<block v-for="(amt,index) in insureItem.amtList" :key="index">
							<view class="amtSingle" @tap="adjustBIItemLabel(index)"
								:class="(amt.label== insureItem.amountDesc)?'active':''">
								{{amt.label}}
							</view>
						</block>
					</view>
				</scroll-view>
				<view class="popBottom">
					<button type="primary" style="background-color: #0052FF;"
						@tap="adjustBIItemLabelSubmit()">完成</button>
				</view>
			</view>
		</wyb-popup>

	</view>
</template>

<script>
	import wybPopup from '@/components/modules/carInsure/wyb-popup/wyb-popup.vue'
	var dateTime = new Date();
	dateTime.setTime(dateTime.getTime() + 24 * 60 * 60 * 1000);
	var tomorrow = dateTime.getFullYear() + "-" + (((dateTime.getMonth() + 1) < 10) ? ("0" + (dateTime.getMonth() + 1)) :
		(dateTime.getMonth() + 1)) + "-" + ((dateTime.getDate() < 10) ? ("0" + dateTime.getDate() + ' 00:00') :
		dateTime
		.getDate() + ' 00:00:00');

	export default {
		components: {
			wybPopup
		},
		data() {
			return {
				jqchecked: true,
				sychecked: true,
				jqimmediately: "0",
				jqimmediatelyList: [{
						label: '是',
						value: "1",
					},
					{
						label: '否',
						value: "0",
					},

				],
				syimmediately: "0",
				syimmediatelyList: [{
						label: '是',
						value: "1",
					},
					{
						label: '否',
						value: "0",
					},
				],
				model: {
					taxRelifFlag: "正常交税",
					taxpayerIdentifier: "身份证",
					relifReason: "",
					taxPaidAreaCode: "",
				},
				//车船税form
				vehicleAndVesselTaxForm: {
					taxRelifFlag: "1", //类型
					identifyNumber: "", //纳税人识别号
					taxpayerIdentifier: "01", //纳税人证件类型
					taxpayerName: "", //纳税人名称
					extendChar2: "", //减免税凭证号
					paidFreeCertificate: "", //完税凭证号
					relifReason: "", //减免税原因
					taxComCode: "", //税务机关代码
					taxComName: "", ///税务机关名称
					taxDocumentDate: "", //完税日期
					taxPaidAreaCode: "", //完税凭证地区代码
					taxRelief: "", //减税比例
				},

				form: {},
				taxPaidAreaCodeShow: false, //完税凭证地区
				taxDocumentDateShow: false, //完税凭证填发日期
				taxRelifFlagShow: false, //车船税类型
				taxpayerIdentifierShow: false, //纳税人证件类型
				relifReasonShow: false, //减免税原因代码
				jqstartShow: false, //交强起保日期
				jqendShow: false, //交强终保日期
				systartShow: false, //商业起保日期
				syendShow: false, //商业终保日期
				params: {
					year: true, //年
					month: true, //月
					day: true, //日
					hour: true, //时
					minute: true, //分
					second: true, //秒
				},
				params1: {
					year: true, //年
					month: true, //月
					day: true, //日
				},
				params2: {
					province: true,
					city: false,
					area: false
				},
				carInfo: {}, //车辆信息
				ownerInfo: {}, //车主信息
				policyHolderInfo: {}, //投保人信息
				insuredPersonInfo: {}, //被保人信息
				riskList: [], //险种大类信息
				kindList: [], //商业险险别
				carInfoPositiveList: [], //车辆
				ownerInfoPositiveList: [], //车主
				policyHolderInfoPositiveList: [], //投保人
				insuredPersonInfoPositiveList: [], //被保人
				jqstartDate: tomorrow, //交强始
				jqendDate: " ", //交强终
				systartDate: tomorrow, //商业始
				syendDate: "", //商业终
				BIStartDate: tomorrow,
				insureItem: {}, //popup弹出框的参数
				insureCodeList: ["A", "B", "D3"],
				CIInsureList: {
					amount: "1",
					amountDesc: "投保",
					amtList: [{
						"label": "不投保",
						"value": "0"
					}, {
						"label": "投保",
						"value": "1"
					}],
					kindCode: "0507",
					kindName: "交强险",
					desc: "国家强制规定购买的险种，对第三方的人身或财产损失提供基本保障"
				},
				BIInsureList: {
					amount: "1",
					amountDesc: "投保",
					amtList: [{
						"label": "不投保",
						"value": "0"
					}, {
						"label": "投保",
						"value": "1"
					}],
					kindCode: "0510",
					kindName: "商业险",
					desc: "国家强制规定购买的险种，对第三方的人身或财产损失提供基本保障"
				},
				insureList: [{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "投保",
							"value": "1"
						}],
						kindCode: "A",
						isMainRisk: true,
						kindName: "机动车损失险",
						desc: "保险期间内，被保险人或被保险机动车驾驶人在使用被保险机动车过程中，因自然灾害、意外事故、机动车被盗窃、抢劫、抢夺等情况（详见保险条款）造成被保险机动车直接损失，且不属于免除保险人责任的范围，保险人依照本保险合同的约定负责赔偿的险种。"
					},
					{
						amount: "2000000",
						amountDesc: "200万",
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "50万",
								value: "500000"
							},
							{
								label: "100万",
								value: "1000000"
							},
							{
								label: "150万",
								value: "1500000"
							},
							{
								label: "200万",
								value: "2000000"
							},
							{
								label: "250万",
								value: "2500000"
							},
							{
								label: "300万",
								value: "3000000"
							},
							{
								label: "500万",
								value: "5000000"
							},
							{
								label: "1000万",
								value: "10000000"
							}
						],
						kindCode: "B",
						isMainRisk: true,
						kindName: "第三者责任险",
						desc: "保险期间内，被保险人或其允许的驾驶人在使用被保险机动车过程中发生意外事故，致使第三者遭受人身伤亡或财产直接损毁，依法应当对第三者承担的损害赔偿责任，且不属于免除保险人责任的范围，保险人依照本保险合同的约定，对于超过机动车交通事故责任强制保险各分项赔偿限额的部分负责赔偿的险种。"
					},
					{
						amount: "10000",
						amountDesc: "1万",
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "1万",
								value: "10000"
							},
							{
								label: "2万",
								value: "20000"
							},
							{
								label: "3万",
								value: "30000"
							},
							{
								label: "4万",
								value: "40000"
							},
							{
								label: "5万",
								value: "50000"
							},
							{
								label: "6万",
								value: "60000"
							},
							{
								label: "7万",
								value: "70000"
							},
							{
								label: "8万",
								value: "80000"
							},
							{
								label: "9万",
								value: "90000"
							},
							{
								label: "10万",
								value: "100000"
							},
							{
								label: "15万",
								value: "150000"
							},
							{
								label: "20万",
								value: "200000"
							},
							{
								label: "25万",
								value: "250000"
							},
							{
								label: "30万",
								value: "300000"
							},
							{
								label: "35万",
								value: "350000"
							},
							{
								label: "40万",
								value: "400000"
							},
							{
								label: "45万",
								value: "450000"
							},
							{
								label: "50万",
								value: "500000"
							},

						],
						kindCode: "D3",
						isMainRisk: true,
						kindName: "司机责任险",
						desc: "保险期间内，被保险人或其允许的驾驶人在使用被保险机动车过程中发生意外事故，致使车上人员遭受人身伤亡，且不属于免除保险人责任的范围，依法应当对车上人员承担的损害赔偿责任，保险人依照本保险合同的约定负责赔偿的险种。"
					},
					{
						amount: "10000",
						amountDesc: "1万",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "1万",
							"value": "10000"
						}, {
							"label": "2万",
							"value": "20000"
						}, {
							"label": "4万",
							"value": "40000"
						}, {
							"label": "5万",
							"value": "50000"
						}, {
							"label": "10万",
							"value": "100000"
						}, {
							"label": "15万",
							"value": "150000"
						}, {
							"label": "20万",
							"value": "200000"
						}],
						kindCode: "D4",
						isMainRisk: true,
						kindName: "乘客责任险",
						desc: "保险期间内，被保险人或其允许的驾驶人在使用被保险机动车过程中发生意外事故，致使车上人员遭受人身伤亡，且不属于免除保险人责任的范围，依法应当对车上人员承担的损害赔偿责任，保险人依照本保险合同的约定负责赔偿的险种。"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "2000",
							"value": "2000"
						}, {
							"label": "5000",
							"value": "5000"
						}, {
							"label": "1万",
							"value": "10000"
						}],
						desc: "保险期间内，被保险机动车在被保险人或被保险机动车驾驶人使用过程中，发生无明显碰撞痕迹的车身划痕损失，保险人按照保险合同约定负责赔偿的险种",
						isMainRisk: true,
						kindCode: "L",
						kindName: "车身划痕险",
						mainRiskCodeList: "A"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "5%",
							"value": "5"
						}, {
							"label": "10%",
							"value": "10"
						}, {
							"label": "15%",
							"value": "15"
						}, {
							"label": "20%",
							"value": "20"
						}],
						desc: "被保险机动车发生主险约定的保险事故，保险人按照主险的约定计算赔款后，扣减本特约条款约定的免赔的险种。",
						isMainRisk: true,
						kindCode: "MJ1",
						kindName: "绝对免赔率特约险（车损）",
						mainRiskCodeList: "A"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "5%",
							"value": "5"
						}, {
							"label": "10%",
							"value": "10"
						}, {
							"label": "15%",
							"value": "15"
						}, {
							"label": "20%",
							"value": "20"
						}],
						desc: "被保险机动车发生主险约定的保险事故，保险人按照主险的约定计算赔款后，扣减本特约条款约定的免赔的险种。",
						isMainRisk: true,
						kindCode: "MJ2",
						kindName: "绝对免赔率特约险（三者）",
						mainRiskCodeList: "B"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "5%",
							"value": "5"
						}, {
							"label": "10%",
							"value": "10"
						}, {
							"label": "15%",
							"value": "15"
						}, {
							"label": "20%",
							"value": "20"
						}],
						desc: "被保险机动车发生主险约定的保险事故，保险人按照主险的约定计算赔款后，扣减本特约条款约定的免赔的险种。",
						isMainRisk: true,
						kindCode: "MJ3",
						kindName: "绝对免赔率特约险（司机）",
						mainRiskCodeList: "D3"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
							"label": "不投保",
							"value": "0"
						}, {
							"label": "5%",
							"value": "5"
						}, {
							"label": "10%",
							"value": "10"
						}, {
							"label": "15%",
							"value": "15"
						}, {
							"label": "20%",
							"value": "20"
						}],
						desc: "被保险机动车发生主险约定的保险事故，保险人按照主险的约定计算赔款后，扣减本特约条款约定的免赔的险种。",
						isMainRisk: true,
						kindCode: "MJ4",
						kindName: "绝对免赔率特约险（乘客）",
						mainRiskCodeList: "D4"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						coveragePremium: 0,
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "1万",
								value: "10000"
							},
							{
								label: "2万",
								value: "20000"
							},
							{
								label: "4万",
								value: "40000"
							},
							{
								label: "5万",
								value: "50000"
							},
							{
								label: "8万",
								value: "80000"
							},
							{
								label: "10万",
								value: "100000"
							},
							{
								label: "20万",
								value: "200000"
							},
							{
								label: "30万",
								value: "300000"
							},
							{
								label: "50万",
								value: "500000"
							},
							{
								label: "100万",
								value: "1000000"
							},
							{
								label: "200万",
								value: "2000000"
							},
							{
								label: "300万",
								value: "3000000"
							},
						],
						kindCode: "SY_FJ_YBW1",
						isMainRisk: true,
						kindName: "附加医保-三者",
						desc: "附加医保外医疗费用责任险（机动车第三者责任保险）"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						coveragePremium: 0,
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "1万",
								value: "10000"
							},
							{
								label: "2万",
								value: "20000"
							},
							{
								label: "4万",
								value: "40000"
							},
							{
								label: "5万",
								value: "50000"
							},
							{
								label: "8万",
								value: "80000"
							},
							{
								label: "10万",
								value: "100000"
							},
							{
								label: "20万",
								value: "200000"
							},
							{
								label: "30万",
								value: "300000"
							},
							{
								label: "50万",
								value: "500000"
							},
							{
								label: "100万",
								value: "1000000"
							},
							{
								label: "200万",
								value: "2000000"
							},
							{
								label: "300万",
								value: "3000000"
							},
						],
						kindCode: "SY_FJ_YBW2",
						isMainRisk: true,
						kindName: "附加医保-座位险(乘客)",
						desc: "附加医保外医疗费用责任险（机动车第三者责任保险）"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						coveragePremium: 0,
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "1万",
								value: "10000"
							},
							{
								label: "2万",
								value: "20000"
							},
							{
								label: "4万",
								value: "40000"
							},
							{
								label: "5万",
								value: "50000"
							},
							{
								label: "8万",
								value: "80000"
							},
							{
								label: "10万",
								value: "100000"
							},
							{
								label: "20万",
								value: "200000"
							},
							{
								label: "30万",
								value: "300000"
							},
							{
								label: "50万",
								value: "500000"
							},
							{
								label: "100万",
								value: "1000000"
							},
							{
								label: "200万",
								value: "2000000"
							},
							{
								label: "300万",
								value: "3000000"
							},
						],
						kindCode: "SY_FJ_YBW3",
						isMainRisk: true,
						kindName: "附加医保-座位险(司机)",
						desc: "附加医保外医疗费用责任险（机动车第三者责任保险）"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						coveragePremium: 0,
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "2次",
								value: "2"
							},
							{
								label: "7次",
								value: "7"
							},
							{
								label: "12次",
								value: "12"
							},
							{
								label: "17次",
								value: "17"
							},
							{
								label: "22次",
								value: "22"
							},
						],
						kindCode: "TY1",
						isMainRisk: true,
						kindName: "道路救援服务特约条款",
						desc: "道路救援服务特约条款是指在保险期内，被保险机动车在使用过程中发生故障而丧失行驶能力时，保险人根据被保险人的请求，向被保险人提供道路救援服务。"
					},
					{
						amount: 0,
						amountDesc: "不投保",
						kindCode: "TY2",
						isMainRisk: true,
						kindName: "车辆安全检测特约条款",
						desc: "安全检测特约条款是指保险期间内，为保障车辆安全运行，保险人或其受托人根据被保险人请求，为被保险机动车提供车辆安全检测服务。"
					},
					{
						amount: 0,
						amountDesc: "不投保",
						kindCode: "TY3",
						isMainRisk: true,
						kindName: "代为驾驶服务特约条款",
						desc: "代为驾驶特约条款是指保险期间内，在被保险人或其允许的驾驶人因饮酒、服用药物等原因无法驾驶或存在重大安全驾驶隐患时，提供单程30公里以内的短途代驾服务。"
					},
					{
						amount: 0,
						amountDesc: "不投保",
						kindCode: "TY4",
						isMainRisk: true,
						kindName: "代为送检服务特约条款",
						desc: "代为送检特约条款是指保险期间内，由保险人或其受托人代替车辆所有人进行车辆送检。"
					},
					{
						amount: "0",
						amountDesc: "不投保",
						amtList: [{
								label: "不投保",
								value: "0"
							},
							{
								label: "50万",
								value: "500000"
							},
							{
								label: "100万",
								value: "1000000"
							},
							{
								label: "150万",
								value: "1500000"
							},
							{
								label: "200万",
								value: "2000000"
							},
							{
								label: "250万",
								value: "2500000"
							},
							{
								label: "300万",
								value: "3000000"
							},
							{
								label: "500万",
								value: "5000000"
							},
							{
								label: "1000万",
								value: "10000000"
							}
						],
						desc: "保险期间内，被保险人或其允许的驾驶人在法定节假日期间使用被保险机动车发生机动车第三者责任保险范围内的事故，并经公安部门或保险人查勘确认的，被保险机动车第三者责任保险所适用的责任限额在保险单载明的基础上增加一倍的险种",
						isMainRisk: true,
						kindCode: "BD",
						kindName: "法定节假日限额翻倍险",
						mainRiskCodeList: "B"
					}
				],
				/* 数据字典 */
				taxRelifFlagoptions: [],
				taxpayerIdentifieroptions: [],
				relifReasonoptions: [],
				/* 数据字典 */
			}
		},
		// 监听导航栏的按钮
		onNavigationBarButtonTap(e) {
			if (e.index == 0) {
				this.navigate({
					url: '/pages/index/index'
				}, "switchTab", true);
			}
		},
		onShow() {
			dateTime = new Date();
			dateTime.setTime(dateTime.getTime() + 24 * 60 * 60 * 1000);
		},
		onLoad() {
			this.getDicType("taxRelifFlag"); //车船税类型
			this.getDicType("taxpayerIdentifier"); //纳税人证件类型
			this.getDicType("relifReason"); //减免税原因代码
			this.jqstartDate = this.nextday();
			this.jqendDate = this.oneYearPast(this.jqstartDate);
			this.systartDate = this.nextday();
			this.syendDate = this.oneYearPast(this.jqstartDate);
			const eventChannel = this.getOpenerEventChannel()
			// 监听acceptData事件，获取上一页面通过eventChannel传送到当前页面的数据
			eventChannel.on('acceptData', (data) => {
				console.log(data);
				if (!!data) {
					//读取上一个页面传过来数据（车辆信息，人员信息，险种信息）
					this.carInfo = data.carInfo; //车辆信息
					this.ownerInfo = data.ownerInfo; //车主信息
					this.policyHolderInfo = data.policyHolderInfo; //投保人信息
					this.insuredPersonInfo = data.insuredPersonInfo; //被保人信息
					this.vehicleAndVesselTaxForm.identifyNumber = this.policyHolderInfo.identifyNumber;
					this.vehicleAndVesselTaxForm.taxpayerName = this.policyHolderInfo.name;
					this.riskList = data.riskList; //险种大类
					this.kindList = data.kindList; //商业险险别
					this.carInfoPositiveList = data.carInfoPositiveList; //车辆
					this.ownerInfoPositiveList = data.ownerInfoPositiveList; //车主
					this.policyHolderInfoPositiveList = data.policyHolderInfoPositiveList; //投保
					this.insuredPersonInfoPositiveList = data.insuredPersonInfoPositiveList; //被保人
					if (this.riskList.length > 0) {
						this.insureCodeList = [];
						if (this.riskList.length == 1) {
							if (this.riskList[0].riskCode == '0507') {
								this.CIInsureList.amount = "1";
								this.CIInsureList.amountDesc = "投保";
								this.jqstartDate = this.riskList[0].startDate;
								this.jqendDate = this.riskList[0].endDate;
								this.BIInsureList.amount = "0";
								this.BIInsureList.amountDesc = "不投保";
								this.sychecked = false;
							} else if (this.riskList[0].riskCode == '0510') {
								this.CIInsureList.amount = "0";
								this.CIInsureList.amountDesc = "不投保";
								this.BIInsureList.amount = "1";
								this.BIInsureList.amountDesc = "投保";
								this.systartDate = this.riskList[0].startDate;
								this.syendDate = this.riskList[0].endDate;
								this.jqchecked = false;
							}
						} else {
							this.CIInsureList.amount = "1";
							this.CIInsureList.amountDesc = "投保";
							this.jqstartDate = this.riskList[0].startDate;
							this.jqendDate = this.riskList[0].endDate;
							this.BIInsureList.amount = "1";
							this.BIInsureList.amountDesc = "投保";
							this.systartDate = this.riskList[1].startDate;
							this.syendDate = this.riskList[1].endDate;
						}
						this.kindList.map(ele => {
							this.insureList.map(ele1 => {
								if (ele.kindCode == ele1.kindCode) {
									switch (ele.kindCode) {
										case 'A':
											ele1.amount = '1';
											ele1.amountDesc = '投保'
											break;
										case 'D4':
										case "SY_FJ_YBW2":
											ele1.amount = ele.unitAmount;
											ele1.amountDesc = this.toChinesNum(ele.unitAmount)
											break;
										case "MJ1":
										case "MJ2":
										case "MJ3":
										case "MJ4":
											ele1.amount = ele.deductibleRate;
											ele1.amountDesc = ele.deductibleRate + '%'
											break;
										case "TY1":
										case "TY2":
										case "TY3":
										case "TY4":
											ele1.amount = ele.serviceTimes;
											ele1.amountDesc = ele.serviceTimes + '次'
											break;
										default:
											ele1.amount = ele.amount;
											ele1.amountDesc = this.toChinesNum(ele.amount)
											break;
									}
								}
							})

						})
						var notselected = this.insureList.filter(item1 => !this.kindList.some(item2 => item2
							.kindCode === item1.kindCode))
						notselected.map(ele => {
							ele.amount = '0';
							ele.amountDesc = '不投保'

						})
						// console.log(this.insureList)
					}

				}
			})
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		methods: {
			immediatelyClick(value, name, startDate, endDate) {
				this[name] = value;
				if (value == 1) {
					const date = new Date();
					date.setHours(date.getHours() + 2);
					date.setMinutes(0)
					date.setSeconds(0)
					this[startDate] = this.transformTime(date)
					this[endDate] = this.oneYearPast(date);
				} else {
					this[startDate] = this.nextday();
					this[endDate] = this.oneYearPast(this.jqstartDate);
				}
			},
			jqImmediate(value) {
				if (value) {
					this.CIInsureList.amount = "1";
					this.CIInsureList.amountDesc = "投保";
				} else {
					this.CIInsureList.amount = "0";
					this.CIInsureList.amountDesc = "不投保";
				}
			},
			syImmediate(value) {
				if (value) {
					this.BIInsureList.amount = "1";
					this.BIInsureList.amountDesc = "投保";
					// 三者险
					this.insureList[1].amount = 2000000;
					this.insureList[1].amountDesc = "200万";
					// 司机险
					this.insureList[2].amount = 10000;
					this.insureList[2].amountDesc = "1万";
					// 乘客险
					this.insureList[3].amount = 10000;
					this.insureList[3].amountDesc = "1万";
					this.insureList[4].amount = 0;
					this.insureList[4].amountDesc = "不投保";
				} else {
					this.BIInsureList.amount = "0";
					this.BIInsureList.amountDesc = "不投保";
					this.insureCodeList = [];
					for (let i = 0; i < this.insureList.length; i++) {
						this.insureList[i].amount = '0';
						this.insureList[i].amountDesc = '不投保';
					}
				}
			},
			taxRelifFlagConfirm(val, name) {
				this.vehicleAndVesselTaxForm[name] = val[0].value;
				this.model[name] = val[0].label;
			},
			/* 数据字典 */
			async getDicType(type) {
				let res = await this.$http.get('/sysDict/dictDetails/' + type);
				if (res.code == 200) {
					this[type + 'options'] = res.data.ddList;
				}
			},
			jqstartconfirm(e) {
				this.jqstartDate = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second;
				this.jqendDate = this.oneYearPast(this.jqstartDate)
			},
			jqendconfirm(e) {
				this.jqendDate = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second;
			},
			systartconfirm(e) {
				this.systartDate = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second;
				this.syendDate = this.oneYearPast(this.systartDate)
			},
			syendconfirm(e) {
				this.syendDate = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second;
			},
			taxDocumentDateconfirm(e) {
				this.vehicleAndVesselTaxForm.taxDocumentDate = e.year + '-' + e.month + '-' + e.day;
			},
			taxPaidAreaCodeconfirm(e) {
				this.vehicleAndVesselTaxForm.taxPaidAreaCode = e.province.value;
				this.model.taxPaidAreaCode = e.province.label;
			},
			insureTip() {
				this.$refs.popupInsure.show() // 显示
			},
			adjustPopupInsureSubmit() {
				this.$refs.popupInsure.hide() // 显示
			},

			// 交强险提示
			CITips() {
				uni.showModal({
					title: "交强险",
					content: "指“机动车交通事故责任强制保险”，是由保险公司对被保险机动车发生道路交通事故造成受害人（不包括本车人员和被保险人）的人身伤亡、财产损失，在责任限额内予以赔偿的强制性责任保险。",
					showCancel: false,
					confirmText: "我知道了"
				})
			},
			// 商业险提示
			BITips() {
				uni.showModal({
					title: "商业险",
					content: "指给车辆加上一份全面保障。详细险种包含：第三者责任险、盗抢险、车上人员责任险、车辆损失险、车身划痕损失险、自燃损失险、涉水险等，是您和爱车的必要保障。",
					showCancel: false,
					confirmText: "我知道了"
				})
			},
			//弹出popup框并显示基本信息
			adjustBIItem(index) {
				var a = {};
				Object.assign(a, this.insureList[index])
				this.insureItem = a;
				this.$refs.popupBI.show() // 显示
			},
			//popup内容的label改变
			adjustBIItemLabel(index) {
				this.insureItem.amount = this.insureItem.amtList[index].value;
				this.insureItem.amountDesc = this.insureItem.amtList[index].label;
			},
			// 提交popup的label修改
			adjustBIItemLabelSubmit() {
				for (let i = 0; i < this.insureList.length; i++) {
					if (this.insureItem.kindCode == this.insureList[i].kindCode) {
						this.insureList[i].amount = this.insureItem.amount; /* 保额 */
						this.insureList[i].amountDesc = this.insureItem.amountDesc; /* 保额名称 */

						if (this.insureItem.kindCode == 'B') {
							if (this.insureItem.amount != 0) {
								this.insureList[9].amtList[1].value = this.insureItem.amount;
							} else {
								this.insureList[9].amtList[1].value = '1';
							}
						}

						if (this.insureList[i].isMainRisk && this.insureList[i].amount == '0') {
							for (let j = 0; j < this.insureList.length; j++) {
								if ((!this.insureList[j].isMainRisk) && (this.insureList[j].mainRiskCodeList == this
										.insureList[i].kindCode)) {
									this.insureList[j].amount = this.insureList[j].amtList[0].value;
									this.insureList[j].amountDesc = this.insureList[j].amtList[0].label;
								}
							}
						}

						var codeList = []
						for (let m = 0; m < this.insureList.length; m++) {
							if (this.insureList[m].amount != '0') {
								codeList.push(this.insureList[m].kindCode);
							}
						}
						this.insureCodeList = [];
						Object.assign(this.insureCodeList, codeList)
						if (this.insureCodeList.length > 0) {
							this.BIInsureList.amount = '1';
							this.BIInsureList.amountDesc = '投保';
						} else {
							this.BIInsureList.amount = '0';
							this.BIInsureList.amountDesc = '不投保';
						}

						break;
					}
				}
				this.$refs.popupBI.hide();
			},
			numberBoxChange(val) {
				console.log(val)
				if (val.value > 0) {
					this.insureItem.amount = val.value;
					this.insureItem.amountDesc = val.value + '次';
				} else {
					this.insureItem.amount = 0;
					this.insureItem.amountDesc = '不投保';
				}

			},
			getDate(type) {
				const date = new Date();
				if (type === 'start') {
					date.setTime(date.getTime());
				} else if (type === 'end') {
					date.setTime(date.getTime() + 24 * 60 * 60 * 1000 * 90);
				}
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			//日期的选择
			bindDateChange(e, startDateType) {

				const date = new Date();
				const date1 = date.getTime();
				const date2 = date.getTime() + 24 * 60 * 60 * 1000 * 90;
				const date3 = new Date(e.detail.value).getTime();
				if (((date3 - date1) > 0) && ((date3 - date2) > 0)) {
					return uni.showToast({
						icon: "none",
						title: "投保日期须在90天内"
					})
				}
				this[startDateType] = e.detail.value;
			},

			//跳转报价页面
			toQuote() {
				var riskList = []; //险种大类信息
				var kindList = []; //商业险险别
				if (this.CIInsureList.amount == '1') {
					this.jqstartDate = this.transformTime(this.jqstartDate);
					this.jqendDate = this.transformTime(this.jqendDate);
					riskList.push({
						amount: "200000",
						premium: "0",
						riskCode: "0507",
						startDate: this.jqstartDate,
						endDate: this.jqendDate,
						instantFlag: "0"
					})

				}
				if (this.BIInsureList.amount == '1') {
					this.systartDate = this.transformTime(this.systartDate);
					this.syendDate = this.transformTime(this.syendDate);
					riskList.push({
						startDate: this.systartDate,
						endDate: this.syendDate,
						quotePreceptName: "",
						quotePreceptCode: "",
						instantFlag: "0",
						premium: "0",
						riskCode: "0510"
					})
					this.insureList.map((ele, index) => {
						if (ele.amount != "0" && ["SY_FJ_YBW2", "D4"].includes(ele.kindCode)) {
							kindList.push({
								unitAmount: this.insureList[index].amount,
								kindCode: this.insureList[index].kindCode,
								kindName: this.insureList[index].kindName
							});
						} else if (ele.amount != "0" && ["MJ1", "MJ2", "MJ3", "MJ4"].includes(ele.kindCode)) {
							kindList.push({
								deductibleRate: this.insureList[index].amount,
								kindCode: this.insureList[index].kindCode,
								kindName: this.insureList[index].kindName
							});
						} else if (ele.amount != "0" && ["TY1", "TY2", "TY3", "TY4"].includes(ele.kindCode)) {
							kindList.push({
								serviceTimes: String(this.insureList[index].amount),
								kindCode: this.insureList[index].kindCode,
								kindName: this.insureList[index].kindName
							});
						} else if (ele.amount != "0") {
							kindList.push({
								amount: this.insureList[index].amount,
								kindCode: this.insureList[index].kindCode,
								kindName: this.insureList[index].kindName
							});
						}
						return ele;
					});
				}
				if (riskList.length == 0) {
					return uni.showToast({
						icon: "none",
						title: "请至少选择一种主险"
					})
				}
				// console.log(riskList, kindList)
				this.navigate({
					url: '/pages/carInsure2/quote',
					success: (res) => {
						res.eventChannel.emit("acceptData", {
							carInfo: this.carInfo,
							ownerInfo: this.ownerInfo,
							policyHolderInfo: this.policyHolderInfo,
							insuredPersonInfo: this.insuredPersonInfo,
							riskList: riskList,
							kindList: kindList,
							carInfoPositiveList: this.carInfoPositiveList, //车辆
							ownerInfoPositiveList: this.ownerInfoPositiveList, //车主
							vehicleAndVesselTaxForm: this.vehicleAndVesselTaxForm, //车船税信息
							policyHolderInfoPositiveList: this.policyHolderInfoPositiveList, //投保人
							insuredPersonInfoPositiveList: this.insuredPersonInfoPositiveList, //被保人
						})
					}
				}, "navigateTo", true);
			},
			//计算输入时间一年后的的前一天(输入的参数为字符串("2019-03-02")最终输出也为日期的字符串)
			oneYearPast(time) {
				var date = new Date(time);
				date.setSeconds(date.getSeconds() - 1);
				date.setFullYear(date.getFullYear() + 1); //一年后
				date.setTime(date.getTime()); //一年后的前一天
				var strYear = date.getFullYear();
				var strDay = date.getDate();
				var strMonth = date.getMonth() + 1;
				var hh = date.getHours();
				var minutes = date.getMinutes(); // 分
				var Seconds = date.getSeconds();
				if (hh < 10) {
					hh = "0" + hh;
				}
				if (minutes < 10) {
					minutes = "0" + minutes;
				}
				if (Seconds < 10) {
					Seconds = "0" + Seconds;
				}
				if (strMonth < 10) {
					strMonth = "0" + strMonth;
				}
				if (strDay < 10) {
					strDay = "0" + strDay;
				}
				var datastr =
					strYear + "-" + strMonth + "-" + strDay + " " + hh + ":" + minutes + ":" + Seconds;
				return datastr;
			},
			//次日
			nextday() {
				var date = new Date();
				date.setFullYear(date.getFullYear());
				date.setTime(date.getTime() + 24 * 60 * 60 * 1000);
				var strYear = date.getFullYear();
				var strDay = date.getDate();
				var strMonth = date.getMonth() + 1;
				var hh = date.getHours();
				if (hh < 10) {
					hh = "0" + hh;
				}
				if (strMonth < 10) {
					strMonth = "0" + strMonth;
				}
				if (strDay < 10) {
					strDay = "0" + strDay;
				}
				var datastr = strYear + "-" + strMonth + "-" + strDay + " " + "00:00:00";
				return datastr;
			},
			//时间转换
			transformTime(date) {
				var d = new Date(date);
				var strYear = d.getFullYear();
				var strMonth = d.getMonth() + 1;
				var strDay = d.getDate();
				var hh = d.getHours();
				var minutes = d.getMinutes(); // 分
				var Seconds = d.getSeconds();
				if (hh < 10) {
					hh = "0" + hh;
				}
				if (minutes < 10) {
					minutes = "0" + minutes;
				}
				if (Seconds < 10) {
					Seconds = "0" + Seconds;
				}
				if (strMonth < 10) {
					strMonth = "0" + strMonth;
				}
				if (strDay < 10) {
					strDay = "0" + strDay;
				}
				var datetime =
					strYear + "-" + strMonth + "-" + strDay + " " + hh + ":" + minutes + ":" + Seconds;
				return datetime;
			},
			toChinesNum(num) {
				let overWan = Math.floor(num / 10000);
				let result = overWan + "万";
				return result;
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/style/mixin.scss';

	/deep/ .uni-switch-input-checked {
		background-color: #0052FF !important;
		border-color: #0052FF !important;
	}

	/* 整个页面的统一样式 Start */
	.page {
		min-height: 100vh;
		background: #F8FAFE;
		padding: 16px 16px 100px 16px;
	}

	/* 整个页面的统一样式 End */
	.plan-ins-title {
		color: #232832;
		font-size: 15px;
		font-weight: bold;
		padding: 8px 0;
	}

	.plan-ins-title .title-right {
		color: #aaa;
	}

	.compulsory-insurance,
	.business-insurance {
		width: 100%;
		height: auto;
		background: #FFFFFF;
		box-shadow: 0px 4px 10px 0px #DAE3F4;
		border-radius: 6px 6px 6px 6px;
		margin-bottom: 20px;

		.immediately {
			padding: 19rpx 15px;

			.common-ins-cell:last-child {
				border-bottom: none;
			}
		}
	}

	.common-title {
		font-size: 32upx;
		font-weight: bold;
	}

	.common-ins-cell {
		font-size: 30upx;
		padding: 0upx 30upx;
		height: 90upx;
		border-bottom: 1px solid #eee;
	}

	/* 底部按钮Start */
	.bottom-btn {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 30upx 30upx;
		z-index: 99;
		height: 62px;
		background: #FFFFFF;
		box-shadow: 0px -4px 10px 0px #DAE3F4;
		border-radius: 0px 0px 0px 0px;
	}

	/* 底部按钮End */

	/* 交强险和商业险弹出框Start */
	.popup-content {
		position: relative;
	}

	.popHeader {
		box-sizing: border-box;
		font-size: 32upx;
		font-weight: bold;
		height: 120upx;
		border-bottom: 1px solid #eee;
	}

	.popup-content .popContent {
		padding: 0upx 30upx;
		height: 620upx;
		box-sizing: border-box;
	}

	.popup-content .popContent .popContentTitle {
		font-weight: bold;
		font-size: 32upx;
		margin: 20upx 0upx 5upx 0upx;
	}

	.popup-content .popContent .amtSingle {
		width: 22%;
		box-sizing: border-box;
		display: inline-block;
		text-align: center;
		vertical-align: middle;
		border: 1px solid #eee;
		margin: 0 15rpx 15rpx 0;
	}

	.popup-content .popBottom {
		margin: 30upx 30upx 0 30upx;
		padding-bottom: 30upx;
	}

	/* 交强险和商业险弹出框End */

	/* 投保方案建议弹出框Start */
	.popupBody {
		position: relative;
	}

	.popupBody .popHeader {
		border: none;
	}

	.popupBody .popBottom {
		position: fixed;
		box-sizing: border-box;
		bottom: 0;
		width: 100%;
		height: 100upx;
		border-top: 1px solid #f6f6f6;
		font-weight: 700;
		font-size: 36upx;
	}

	.popupBody .popupScroll {
		height: 485upx;
		padding: 0 30upx 0 30upx;
		box-sizing: border-box;
	}

	.popupScroll .title {
		font-weight: 700;
		font-size: 30upx;
	}

	.popupScroll .desc {
		font-size: 28upx;
	}

	.modelformcss {
		padding: 5px 15px;
	}

	.status-data {
		width: 40px;
		height: 25px;
		margin: 0 7px;
		font-size: 14px;
		border: 1px solid #CDCDCD;
		cursor: pointer;
		text-align: center;
		line-height: 25px;
	}

	.active {
		position: relative;
		background: rgba(0, 82, 255, 0.1);
		color: #0052FF;
		border: 1px solid #0052FF !important;
		font-weight: 700;
	}

	.active::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 10px;
		height: 10px;
		background-image: url("/static/image/car-insure/before.png");
		background-size: cover;
	}
</style>