IP小卡片

master
chaiyapeng 2024-08-25 09:42:55 +08:00
parent fe4de82d23
commit f7052cf827
1 changed files with 55 additions and 32 deletions

View File

@ -1,38 +1,61 @@
<template>
<div>
<div>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>手机号查询归属地</span>
<el-button style="float: right; padding: 3px 0" type="text">购买</el-button>
</div>
<el-form :model="formLabelAlign">
<el-form-item placeholder="请输入手机号">
<el-input v-model="formLabelAlign.tel"></el-input>
</el-form-item>
<el-form-item placeholder="请输入手机号">
<el-button @click="getPhonePlace"></el-button>
</el-form-item>
</el-form>
<span>省份{{this.formLabelAlign.province}}</span><br>
<span>城市{{this.formLabelAlign.city}}</span><br>
<span>区号{{this.formLabelAlign.areacode}}</span><br>
<span>邮编{{this.formLabelAlign.zip}}</span><br>
<span>运营商{{this.formLabelAlign.company}}</span>
</el-card>
</div>
<el-row :gutter="12">
<el-col :span="8">
<el-card shadow="hover">
<div slot="header" class="clearfix">
<span>手机号查询归属地</span>
<el-button style="float: right; padding: 3px 0" type="text">购买</el-button>
</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card shadow="hover">
<div slot="header" class="clearfix">
<span>IP查询归属地</span>
<el-button style="float: right; padding: 3px 0" type="text">购买</el-button>
</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card shadow="never">
从不显示
</el-card>
</el-col>
</el-row>
<!-- <div>-->
<!-- <el-card class="box-card">-->
<!-- <div slot="header" class="clearfix">-->
<!-- <span>手机号查询归属地</span>-->
<!-- <el-button style="float: right; padding: 3px 0" type="text">购买</el-button>-->
<!-- </div>-->
<!-- <el-form :model="formLabelAlign">-->
<!-- <el-form-item placeholder="请输入手机号">-->
<!-- <el-input v-model="formLabelAlign.tel"></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item placeholder="请输入手机号">-->
<!-- <el-button @click="getPhonePlace"></el-button>-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- <span>省份{{this.formLabelAlign.province}}</span><br>-->
<!-- <span>城市{{this.formLabelAlign.city}}</span><br>-->
<!-- <span>区号{{this.formLabelAlign.areacode}}</span><br>-->
<!-- <span>邮编{{this.formLabelAlign.zip}}</span><br>-->
<!-- <span>运营商{{this.formLabelAlign.company}}</span>-->
<!-- </el-card>-->
<!-- </div>-->
<div>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>IP查询归属地</span>
<el-button style="float: right; padding: 3px 0" type="text">购买</el-button>
</div>
<div v-for="o in 4" :key="o" class="text item">
{{'列表内容 ' + o }}
</div>
</el-card>
</div>
<!-- <div>-->
<!-- <el-card class="box-card">-->
<!-- <div slot="header" class="clearfix">-->
<!-- <span>IP查询归属地</span>-->
<!-- <el-button style="float: right; padding: 3px 0" type="text">购买</el-button>-->
<!-- </div>-->
<!-- <div v-for="o in 4" :key="o" class="text item">-->
<!-- {{'列表内容 ' + o }}-->
<!-- </div>-->
<!-- </el-card>-->
<!-- </div>-->
</div>
</template>