xfapp/pages/safeGuard/QA/QA.vue

<template>
	<view class="qa">
		<view class="cu-list menu-avatar">
			<view class="qa-tit cu-item " @click="click">
				<view class="cu-avatar round" style="background-image: url(../../static/zr.png)"></view>
				<view class="content">
					<view class="title">保险责任</view>
				</view>
				<view class="nav-right">
					<view :class="[isShow?'':'rotate180']">
						<text class="icon iconfont margin-right-xs margin-left-xs " >&#xe63d;</text>
					</view>
				</view>
			</view>
			<view class="qa-des padding " v-show="isShow">
				<view>一、保险期间内，被保险人在保险单载明的场 所内依法从事生产、经营活动时，因该场所内发生 火灾、爆炸造成第三人身伤亡，依照中华人民共和 国法律（不包括港澳台地区法律）应由被保险人承
					担的经济赔偿责任，保险人按照本保险合同的约定 负责赔偿。 </view>
				<view>二、发生保险事故后，被保险人因此而被提起 仲裁或者诉讼的，应由被保险人支付的仲裁或诉讼 费用以及事先经保险人书面同意支付的其它必要、
					合理的费用（以下简称为“法律费用”），保险人 按照本合同的约定负责赔偿。</view>
			</view>
			<view class="bottom-line"></view>
		</view>

		<view class="cu-list menu-avatar">
			<view class="qa-tit cu-item " @click="click2">
				<view class="cu-avatar round" style="background-image: url(../../static/xe.png)"></view>
				<view class="content">
					<view class="title">保险限额</view>
				</view>
				<view class="nav-right">
					<view  :class="[isShow2?'':'rotate180']">
						<text class="icon iconfont margin-right-xs margin-left-xs">&#xe63d;</text>
					</view>
				</view>
			</view>
			<view class="qa-des padding "  v-show="isShow2">
				<view>保险合同的责任限额包括每人责任限额和累计 责任限额，由投保人与保险人协商确定，并在保险 合同中载明。</view>
			</view>
			<view class="bottom-line"></view>
		</view>

		<view class="cu-list menu-avatar">
			<view class="qa-tit cu-item " @click="click3">
				<view class="cu-avatar round" style="background-image: url(../../static/qt.png)"></view>
				<view class="content">
					<view class="title">其他事项</view>
				</view>
				<view class="nav-right">
					<view  :class="[isShow3?'':'rotate180']">
						<text class="icon iconfont margin-right-xs margin-left-xs">&#xe63d;</text>
					</view>
				</view>
			</view>
			<view class="qa-des padding "  v-show="isShow3">
				<view>保险责任开始前，投保人要求解除保险合同的， 应当向保险人支付相当于保险费5%的退保手续费， 保险人应当退还剩余部分保险费；保险人要求解除 保险合同的，不得向投保人收取手续费并应退还已
					收取的保险费。 </view>
				<view>保险责任开始后，投保人要求解除保险合同的， 自书面通知送达保险人之日起，保险合同解除，保 险人按照保险责任开始之日起至合同解除之日止期 间按短期费率计收保险费，并退还剩余部分保险费；
					保险人要求解除保险合同的，应提前十五日向投保 人发出解约通知书解除本保险合同，保险人按照保 险责任开始之日起至合同解除之日止期间与保险期 间的日比例计收保险费，并退还剩余部分保险费。</view>
			</view>
			<view class="bottom-line"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isShow: true,
				isShow2: true,
				isShow3: true

			}
		},
		methods: {
			click() {
				this.isShow = !this.isShow;
			},
			click2() {
				this.isShow2 = !this.isShow2;
			},
			click3() {
				this.isShow3 = !this.isShow3;
			}


		}
	}
</script>

<style>
	.rotate180{
		transform:rotate(180deg);
		-ms-transform:rotate(180deg); /* Internet Explorer */
		-moz-transform:rotate(180deg); /* Firefox */
		-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
		-o-transform:rotate(180deg); /* Opera */
	}

</style>