|
|
@@ -1,34 +1,75 @@
|
|
|
<template>
|
|
|
<view>
|
|
|
- <view class="status_bar"></view>
|
|
|
- <view class="" style="position: relative;top: 40px;">
|
|
|
- <view style="position: fixed;z-index: 100;width: 100%;">
|
|
|
- <uni-nav-bar @clickLeft="clickLeft" left-icon="back" left-text="返回" title="sim卡详情"></uni-nav-bar>
|
|
|
- </view>
|
|
|
- <view class="sim_info">
|
|
|
+ <view>
|
|
|
+ <view class="sim_info" v-if="iccidObj.data_iccid">
|
|
|
<view class="sim_info_loding" v-if="loding">
|
|
|
<image src="../../static/images/cb/6286299.gif" mode="" class="img"></image>
|
|
|
</view>
|
|
|
<view class="sim_info_title">
|
|
|
- <image :src="'https://www.hnyfwlw.com:8006/bigdata_app'+'/image/cb/sim1.png'" mode=""></image>
|
|
|
- <p>sim卡查询{{"("+simnew+")"}}</p>
|
|
|
+ <image :src="'http://www.hnyfwlw.com:8006/bigdata_app'+'/image/cb/sim1.png'" mode=""></image>
|
|
|
+ <p>sim卡查询</p>
|
|
|
</view>
|
|
|
<view class="sim_info_text">
|
|
|
- <p>运营商：{{siminfo.data.carrier}}</p>
|
|
|
- <view class="sim_info_iccid" @click="copy(iccid)">
|
|
|
- <p>ICCID：{{iccid}}</p>
|
|
|
- <image src="../../static/images/ba167c2774bc7a63381dc3aaf1ef95c.png" mode="" class="tishi"></image>
|
|
|
+ <view class="sim_info_iccid" @click="copy(siminfo['data'].iccid)">
|
|
|
+ <p>ICCID：{{siminfo['data'].iccid}}</p>
|
|
|
+ <image src="../../static/images/ba167c2774bc7a63381dc3aaf1ef95c.png" mode="" class="tishi">
|
|
|
+ </image>
|
|
|
+ </view>
|
|
|
+ <view class="" v-if="!isDataFault">
|
|
|
+ <p>总流量：{{siminfo['data'].total}}M</p>
|
|
|
+ <p>状态：{{siminfo['data'].status}}</p>
|
|
|
+ <p>到期时间：{{siminfo['data'].expire}}</p>
|
|
|
+ <p class="infoDeclear">
|
|
|
+ <span>已使用:{{siminfo['data'].used.toFixed(2)}}M/{{siminfo['data'].total}}M</span>
|
|
|
+ <span>剩余:<span :class="[siminfo['data'].used/siminfo['data'].total < 1 ?'green':'red']">{{siminfo['data'].total - siminfo['data'].used.toFixed(2)}}M</span></span>
|
|
|
+ </p>
|
|
|
+ <u-line-progress :percent="(siminfo['data'].used/siminfo['data'].total) * 100" height="12" :show-percent="false" :active-color="(siminfo['data'].used/siminfo['data'].total) < 1 ? '#14A478' : '#f56c6c'"></u-line-progress>
|
|
|
</view>
|
|
|
- <p>状态：{{state}}</p>
|
|
|
- <p>套餐：{{siminfo.data.data_plan || siminfo.data.totalDataVolume}}MB</p>
|
|
|
- <p v-if="simnew=='旧'">已用流量：{{siminfo.data.data_usage.toFixed(2)}}MB</p>
|
|
|
- <p v-if="simnew=='新'">已用流量：{{siminfo.data.usedDataVolume.toFixed(2)}}MB</p>
|
|
|
- <p v-if="simnew=='旧'">剩余流量：{{siminfo.data.data_balance.toFixed(2)}}MB</p>
|
|
|
- <p v-if="simnew=='新'">剩余流量：{{(siminfo.data.totalDataVolume-siminfo.data.usedDataVolume).toFixed(2)}}MB</p>
|
|
|
- <p v-if="simnew=='旧'">到期时间：{{siminfo.data.expiry_date|timeFormat()}}</p>
|
|
|
- <p v-if="simnew=='新'">到期时间：{{siminfo.data.expireDate}}</p>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <template v-if="iccidObj.photo_iccid">
|
|
|
+ <view class="sim_info">
|
|
|
+ <view class="sim_info_loding" v-if="loding2">
|
|
|
+ <image src="../../static/images/cb/6286299.gif" mode="" class="img"></image>
|
|
|
+ </view>
|
|
|
+ <view class="sim_info_title">
|
|
|
+ <image mode="widthFix" src="http://www.hnyfwlw.com:8006/bigdata_app/image/cb/sim2.png"></image>
|
|
|
+ 图片sim卡流量
|
|
|
+ </view>
|
|
|
+ <view class="sim_info_text">
|
|
|
+ <view class="sim_info_iccid">
|
|
|
+ <p>ICCID：{{siminfo['photo'].iccid}}</p>
|
|
|
+ <image @click="copy(siminfo['photo'].iccid)" src="../../static/images/ba167c2774bc7a63381dc3aaf1ef95c.png" mode="" class="tishi">
|
|
|
+ </image>
|
|
|
+ <text v-if="iccidObj.data_iccid" class="yficonfont icon-xiugai" @click="editFun(siminfo['photo'].iccid)"></text>
|
|
|
+ <!-- <image src="../../static/images/ba167c2774bc7a63381dc3aaf1ef95c.png" mode="" class="tishi">
|
|
|
+ </image> -->
|
|
|
+ </view>
|
|
|
+ <view class="contenB" v-if="!isPhotoFault">
|
|
|
+ <p>总流量：{{siminfo['photo'].total}}M</p>
|
|
|
+ <p>状态：{{siminfo['photo'].status}}</p>
|
|
|
+ <p>到期时间：{{siminfo['photo'].expire}}</p>
|
|
|
+ <p class="infoDeclear">
|
|
|
+ <span>已使用:{{siminfo['photo'].used.toFixed(2)}}M/{{siminfo['photo'].total}}M</span>
|
|
|
+ <span>剩余:<span :class="[siminfo['photo'].used/siminfo['photo'].total < 1 ?'green':'red']">{{siminfo['photo'].total - siminfo['photo'].used.toFixed(2)}}M</span></span>
|
|
|
+ </p>
|
|
|
+ <u-line-progress :percent="(siminfo['photo'].used/siminfo['photo'].total) * 100" height="12" :show-percent="false" :active-color="(siminfo['photo'].used/siminfo['photo'].total) < 1 ? '#14A478' : '#f56c6c'"></u-line-progress>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ <u-modal v-model="editFlag" width="90%" :async-close="true" :show-cancel-button="true"
|
|
|
+ @confirm="editFunConfim">
|
|
|
+ <view class="slot-content">
|
|
|
+ <view class="expireBox">
|
|
|
+ <u-form>
|
|
|
+ <u-form-item label="新iccid号" :label-width="140">
|
|
|
+ <u-input v-model="editSim" type="text" :border="true" />
|
|
|
+ </u-form-item>
|
|
|
+ </u-form>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
@@ -38,129 +79,184 @@
|
|
|
data() {
|
|
|
return {
|
|
|
iccid: '',
|
|
|
+ iccidObj: {
|
|
|
+ data_iccid: '',
|
|
|
+ photo_iccid: ''
|
|
|
+ },
|
|
|
siminfo: {
|
|
|
data: {
|
|
|
- carrier: "--",
|
|
|
- account_status: "--",
|
|
|
- data_plan: "--",
|
|
|
- data_usage: "--",
|
|
|
- data_balance: "--",
|
|
|
- outbound_date: ""
|
|
|
+ expire: "",
|
|
|
+ iccid: "",
|
|
|
+ status: "",
|
|
|
+ total: 0,
|
|
|
+ used: 0
|
|
|
+ },
|
|
|
+ photo: {
|
|
|
+ expire: "",
|
|
|
+ iccid: "",
|
|
|
+ status: "",
|
|
|
+ total: 0,
|
|
|
+ used: 0
|
|
|
}
|
|
|
},
|
|
|
- state:"",
|
|
|
- id: '',
|
|
|
- simnew:"",
|
|
|
- loding:false
|
|
|
+ editSim:'',
|
|
|
+ editFlag: false,
|
|
|
+ isPhotoFault: false,
|
|
|
+ isDataFault: false,
|
|
|
+ loding: true,
|
|
|
+ loding2: true,
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ async editFun(iccid) {
|
|
|
+ // this.editSim = iccid;
|
|
|
+ this.editSim = '';
|
|
|
+ this.editFlag = true;
|
|
|
+ },
|
|
|
+ async editFunConfim() {
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=forecast.send_control.device_sim_update',
|
|
|
+ data: {
|
|
|
+ d_id: this.id,
|
|
|
+ simid:this.editSim
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(res.code) {
|
|
|
+ this.editFlag = false;
|
|
|
+ this.loding2 = true;
|
|
|
+ uni.showToast({
|
|
|
+ title: '修改成功',
|
|
|
+ duration: 2000,
|
|
|
+ icon:"none"
|
|
|
+ });
|
|
|
+ this.simdata(this.editSim, 'photo');
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: res.msg,
|
|
|
+ duration: 2000,
|
|
|
+ icon:"none"
|
|
|
+ });
|
|
|
+ }
|
|
|
+ console.log(res);
|
|
|
+ },
|
|
|
async simid(data) { //获取sim卡号
|
|
|
const res = await this.$myRequest({
|
|
|
- url: '/api/api_gateway?method=forecast.send_control.device_sim',
|
|
|
+ url: '/api/api_gateway?method=forecast.send_control.device_sim_new',
|
|
|
data: {
|
|
|
- d_id: data,
|
|
|
- type: 'sim'
|
|
|
+ d_id: data
|
|
|
}
|
|
|
})
|
|
|
- if(res.length!=0){
|
|
|
- this.iccid = res[0].iccid
|
|
|
- this.simdata(this.iccid)
|
|
|
+ if(res.data_iccid == '' && res.photo_iccid == '') {
|
|
|
+ uni.showToast({
|
|
|
+ title: '此设备暂无SIM卡信息!',
|
|
|
+ duration: 2000,
|
|
|
+ icon:"none"
|
|
|
+ });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.iccidObj = res;
|
|
|
+ if (res.data_iccid) {
|
|
|
+ this.simdata(res.data_iccid, 'data')
|
|
|
}
|
|
|
-
|
|
|
+ if (res.photo_iccid) {
|
|
|
+ this.simdata(res.photo_iccid, 'photo')
|
|
|
+ }
|
|
|
+ console.log(res);
|
|
|
+
|
|
|
},
|
|
|
- async simdata(data) { //获取sim信息
|
|
|
+ async simdata(data, type) { //获取sim信息
|
|
|
const res = await this.$myRequest({
|
|
|
- url: '/api/api_gateway?method=forecast.send_control.sim_query',
|
|
|
+ url: '/api/api_gateway?method=forecast.send_control.sim_query_new',
|
|
|
data: {
|
|
|
iccid: data
|
|
|
}
|
|
|
})
|
|
|
- if(res.code==1){//企鹏
|
|
|
- this.simnew = "新"
|
|
|
- switch (res.data.data.deviceStatus){
|
|
|
- case "TEST_READY_NAME":
|
|
|
- this.state = "可测试"
|
|
|
- break;
|
|
|
- case "INVENTORY_NAME":
|
|
|
- this.state = "库存"
|
|
|
- break;
|
|
|
- case "ACTIVATION_READY_NAME":
|
|
|
- this.state = "可激活"
|
|
|
- break;
|
|
|
- case "ACTIVATED_NAME":
|
|
|
- this.state = "已激活"
|
|
|
- break;
|
|
|
- case "DEACTIVATED_NAME":
|
|
|
- this.state = "已停卡"
|
|
|
- break;
|
|
|
- case "RETIRED_NAME":
|
|
|
- this.state = "已销卡"
|
|
|
- break;
|
|
|
- case "PURGED_NAME":
|
|
|
- this.state = "已清除"
|
|
|
- break;
|
|
|
+ if(type == 'data') {
|
|
|
+ this.loding = false;
|
|
|
+ } else {
|
|
|
+ this.loding2 = false;
|
|
|
+ }
|
|
|
+ if(res.code) {
|
|
|
+ uni.showToast({
|
|
|
+ title: res.msg,
|
|
|
+ duration: 5000,
|
|
|
+ icon:"none"
|
|
|
+ });
|
|
|
+ this.siminfo[type] = {
|
|
|
+ iccid: res.iccid
|
|
|
+ }
|
|
|
+ if(type == 'data') {
|
|
|
+ this.isDataFault = true;
|
|
|
+ } else {
|
|
|
+ this.isPhotoFault = true;
|
|
|
}
|
|
|
- }else if(res.code==2){//合宙
|
|
|
- var arr = ['未知', '测试期', '沉默期', '使用中', '停机', '停机保号', '预销号', '销号']
|
|
|
- this.state = arr[res.data.data.account_status]
|
|
|
- this.simnew = "旧"
|
|
|
+ return
|
|
|
}
|
|
|
- this.siminfo = res.data
|
|
|
- this.loding = false
|
|
|
- console.log(this.siminfo.data)
|
|
|
+ this.isFault = false;
|
|
|
+ this.siminfo[type] = res;
|
|
|
+ console.log(this.siminfo[type])
|
|
|
},
|
|
|
clickLeft() {
|
|
|
uni.navigateBack({
|
|
|
delta: 1
|
|
|
})
|
|
|
},
|
|
|
- copy(item){
|
|
|
+ copy(item) {
|
|
|
uni.setClipboardData({
|
|
|
- data: item ,
|
|
|
- success: function () {
|
|
|
- console.log('success');
|
|
|
- }
|
|
|
+ data: item,
|
|
|
+ success: function() {
|
|
|
+ console.log('success');
|
|
|
+ }
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
onLoad(option) {
|
|
|
console.log(option)
|
|
|
- this.id = option.id
|
|
|
+ this.id = option.id ? option.id : option.d_id
|
|
|
this.loding = true
|
|
|
this.simid(this.id)
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss">
|
|
|
+<style lang="scss" scoped="scoped">
|
|
|
+ .expireBox{
|
|
|
+ padding: 0 20rpx;
|
|
|
+ }
|
|
|
+ .green{
|
|
|
+ color: #14A478;
|
|
|
+ }
|
|
|
+ .red{
|
|
|
+ color: #f56c6c;
|
|
|
+ }
|
|
|
.sim_info {
|
|
|
+ position: relative;
|
|
|
width: 90%;
|
|
|
- position: absolute;
|
|
|
- top: 54px;
|
|
|
- left: 5%;
|
|
|
+ margin: 30rpx auto;
|
|
|
box-shadow: 0 0 10rpx #bcb9ca;
|
|
|
padding: 30rpx 20rpx 50rpx;
|
|
|
border-radius: 20rpx;
|
|
|
box-sizing: border-box;
|
|
|
-
|
|
|
- .sim_info_loding{
|
|
|
+
|
|
|
+ .sim_info_loding {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
width: 100%;
|
|
|
- background-color: rgba(0,0,0,0.3);
|
|
|
+ background-color: rgba(0, 0, 0, 0.3);
|
|
|
border-radius: 20rpx;
|
|
|
height: 100%;
|
|
|
display: flex;
|
|
|
justify-content: space-around;
|
|
|
align-items: center;
|
|
|
- .img{
|
|
|
+
|
|
|
+ .img {
|
|
|
width: 200rpx;
|
|
|
height: 175rpx;
|
|
|
-
|
|
|
+
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.sim_info_title {
|
|
|
width: 100%;
|
|
|
display: flex;
|
|
|
@@ -179,22 +275,28 @@
|
|
|
.sim_info_text {
|
|
|
width: 100%;
|
|
|
padding-left: 44rpx;
|
|
|
-
|
|
|
+ box-sizing: border-box;
|
|
|
p {
|
|
|
- height: 30rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
+ height: 50rpx;
|
|
|
font-size: 26rpx;
|
|
|
+ line-height: 50rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .infoDeclear{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
- .sim_info_iccid{
|
|
|
+ .sim_info_iccid {
|
|
|
display: flex;
|
|
|
- .tishi{
|
|
|
+ align-items: center;
|
|
|
+ .tishi {
|
|
|
width: 30rpx;
|
|
|
height: 30rpx;
|
|
|
- margin: 26rpx 0 0 20rpx;
|
|
|
color: #000;
|
|
|
+ margin:0 20rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
-
|
|
|
+</style>
|
