|
@@ -24,7 +24,13 @@
|
|
|
<view class="claimmobile">
|
|
|
<view class="claimmobiletitle d-flex a-center">
|
|
|
<p>各大保险公司理赔报案电话</p>
|
|
|
+
|
|
|
</view>
|
|
|
+ <view class=" search-input d-flex a-center">
|
|
|
+ <u-input v-model="value" type="text" :border="true" @confirm="onConfirm"/>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
<view class="claimmobilecontent">
|
|
|
<view class="claimmobileitem d-flex a-center j-center" v-for="(item,index) in claimmobiles"
|
|
|
:key="index">
|
|
@@ -259,10 +265,14 @@
|
|
|
name: "天安财险",
|
|
|
mobile: "95505"
|
|
|
}
|
|
|
-
|
|
|
- ]
|
|
|
+
|
|
|
+ ],
|
|
|
+ companyList:[],
|
|
|
}
|
|
|
},
|
|
|
+ created() {
|
|
|
+ this.companyList=[...this.claimmobiles]
|
|
|
+ },
|
|
|
computed: {
|
|
|
getHeight() {
|
|
|
let height = uni.getSystemInfoSync().windowHeight;
|
|
@@ -295,15 +305,37 @@
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 搜索电话
|
|
|
+ onConfirm(e){
|
|
|
+ // console.log(e)
|
|
|
+ let arr=[...this.companyList]
|
|
|
+ let newAarr=[]
|
|
|
+
|
|
|
+ arr.forEach((v,i)=>{
|
|
|
+ if(v.mobile.includes(e)){
|
|
|
+ newAarr.push(v)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.claimmobiles=e!=''?[...newAarr]:[...this.companyList]
|
|
|
+ },
|
|
|
// 电话咨询
|
|
|
mobileCall(mobile) {
|
|
|
// #ifdef APP-PLUS
|
|
|
- uni.makePhoneCall({
|
|
|
- phoneNumber: mobile,
|
|
|
+ uni.authorize({
|
|
|
+ scope: 'scope.makePhoneCall',
|
|
|
success: () => {
|
|
|
- console.log("成功拨打电话")
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: mobile,
|
|
|
+ success: () => {
|
|
|
+ console.log("成功拨打电话")
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fail: () => {
|
|
|
+ console.error('授权失败,请允许拨打电话权限!');
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
+
|
|
|
// #endif
|
|
|
},
|
|
|
}
|
|
@@ -311,127 +343,113 @@
|
|
|
</script>
|
|
|
|
|
|
<style>
|
|
|
- .pagebody {
|
|
|
- background-color: #ededed;
|
|
|
- }
|
|
|
-
|
|
|
- .claimimg {
|
|
|
- background-color: #FFFFFF;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- .claimimg>image {
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps {
|
|
|
- background-color: #FFFFFF;
|
|
|
- padding: 20upx 30upx;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep {
|
|
|
- padding-bottom: 10upx;
|
|
|
- border-bottom: 1px solid #F5F3F6;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep .stepinfo {
|
|
|
- width: 510upx;
|
|
|
- padding: 30upx 18upx 20upx;
|
|
|
- box-sizing: border-box;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep .stepinfo .stepindex {
|
|
|
- width: 50upx;
|
|
|
- height: 50upx;
|
|
|
- font-size: 32upx;
|
|
|
- font-weight: bold;
|
|
|
- color: #FFFFFF;
|
|
|
- border-radius: 50%;
|
|
|
- background-color: #3C95FE;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep .stepinfo .steptitle {
|
|
|
- line-height: 80upx;
|
|
|
- font-size: 32upx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep .stepinfo .stepcontent {
|
|
|
- line-height: 40upx;
|
|
|
- color: #A39FA3;
|
|
|
- font-size: 26upx;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep .stepimg {
|
|
|
- width: 180upx;
|
|
|
- flex-shrink: 1;
|
|
|
- }
|
|
|
-
|
|
|
- .claimsteps .claimstep .stepimg>image {
|
|
|
- width: 170upx;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile {
|
|
|
- margin: 15upx 0;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobiletitle {
|
|
|
- height: 80upx;
|
|
|
- background: #FFFFFF;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobiletitle p {
|
|
|
- margin-left: 50upx;
|
|
|
- font-size: 32upx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobiletitle p:before {
|
|
|
- width: 8upx;
|
|
|
- height: 34upx;
|
|
|
- margin-top: 15upx;
|
|
|
- position: absolute;
|
|
|
- align-items: center;
|
|
|
- left: 30upx;
|
|
|
- content: '';
|
|
|
- background: #008DF0;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent {}
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent .claimmobileitem {
|
|
|
- height: 80upx;
|
|
|
- background: #FFFFFF;
|
|
|
- margin: 10upx 15upx;
|
|
|
- padding: 0upx 20upx;
|
|
|
- border-radius: 10upx;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent .claimmobileitem .companyicon {
|
|
|
- width: 60upx;
|
|
|
- height: 60upx;
|
|
|
- border: 1px solid #F0F1F3;
|
|
|
- border-radius: 5upx;
|
|
|
- flex-shrink: 1;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent .claimmobileitem .companyicon>image {
|
|
|
- width: 80%;
|
|
|
- height: 80%;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent .claimmobileitem .companyname {
|
|
|
- margin: 0upx 20upx;
|
|
|
- font-size: 32upx;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent .claimmobileitem .companymobile {
|
|
|
- width: 300upx;
|
|
|
- flex-shrink: 1;
|
|
|
- }
|
|
|
-
|
|
|
- .claimmobile .claimmobilecontent .claimmobileitem .companymobile .iconfont {
|
|
|
- font-size: 28upx;
|
|
|
- margin: 0 20upx 0 30upx;
|
|
|
- }
|
|
|
+.pagebody{
|
|
|
+ background-color: #ededed;
|
|
|
+}
|
|
|
+.claimimg{
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.claimimg>image{
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.claimsteps{
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ padding: 20upx 30upx;
|
|
|
+}
|
|
|
+.claimsteps .claimstep{
|
|
|
+ padding-bottom: 10upx;
|
|
|
+ border-bottom: 1px solid #F5F3F6;
|
|
|
+}
|
|
|
+.claimsteps .claimstep .stepinfo{
|
|
|
+ width: 510upx;
|
|
|
+ padding: 30upx 18upx 20upx;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.claimsteps .claimstep .stepinfo .stepindex{
|
|
|
+ width: 50upx;
|
|
|
+ height: 50upx;
|
|
|
+ font-size: 32upx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #FFFFFF;
|
|
|
+ border-radius: 50%;
|
|
|
+ background-color: #3C95FE;
|
|
|
+}
|
|
|
+.claimsteps .claimstep .stepinfo .steptitle{
|
|
|
+ line-height: 80upx;
|
|
|
+ font-size: 32upx;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.claimsteps .claimstep .stepinfo .stepcontent{
|
|
|
+ line-height: 40upx;
|
|
|
+ color: #A39FA3;
|
|
|
+ font-size: 26upx;
|
|
|
+}
|
|
|
+.claimsteps .claimstep .stepimg{
|
|
|
+ width: 180upx;
|
|
|
+ flex-shrink: 1;
|
|
|
+}
|
|
|
+.claimsteps .claimstep .stepimg>image{
|
|
|
+ width: 170upx;
|
|
|
+}
|
|
|
+.claimmobile{
|
|
|
+ margin: 15upx 0;
|
|
|
+}
|
|
|
+.claimmobile .search-input{
|
|
|
+ padding: 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+}
|
|
|
+.claimmobile .claimmobiletitle{
|
|
|
+ height: 80upx;
|
|
|
+ background: #FFFFFF;
|
|
|
+}
|
|
|
+.claimmobile .claimmobiletitle p{
|
|
|
+ margin-left: 50upx;
|
|
|
+ font-size: 32upx;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.claimmobile .claimmobiletitle p:before{
|
|
|
+ width: 8upx;
|
|
|
+ height: 34upx;
|
|
|
+ margin-top: 15upx;
|
|
|
+ position:absolute;
|
|
|
+ align-items: center;
|
|
|
+ left: 30upx;
|
|
|
+ content:'';
|
|
|
+ background: #008DF0;
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent{
|
|
|
+
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent .claimmobileitem{
|
|
|
+ height: 80upx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ margin: 10upx 15upx;
|
|
|
+ padding: 0upx 20upx;
|
|
|
+ border-radius: 10upx;
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent .claimmobileitem .companyicon{
|
|
|
+ width: 60upx;
|
|
|
+ height: 60upx;
|
|
|
+ border: 1px solid #F0F1F3;
|
|
|
+ border-radius: 5upx;
|
|
|
+ flex-shrink: 1;
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent .claimmobileitem .companyicon>image{
|
|
|
+ width: 80%;
|
|
|
+ height: 80%;
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent .claimmobileitem .companyname{
|
|
|
+ margin: 0upx 20upx;
|
|
|
+ font-size: 32upx;
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent .claimmobileitem .companymobile{
|
|
|
+ width: 300upx;
|
|
|
+ flex-shrink: 1;
|
|
|
+}
|
|
|
+.claimmobile .claimmobilecontent .claimmobileitem .companymobile .iconfont{
|
|
|
+ font-size: 28upx;
|
|
|
+ margin:0 20upx 0 30upx;
|
|
|
+}
|
|
|
</style>
|